UNPKG

ng-cw-v12

Version:

Angular UI Component Library

33 lines 146 kB
import { Component, Input } from '@angular/core'; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; export class LoadingComponent { constructor() { //1:圆球排列 //2:彩色跳动 //3:旋转呼吸 //4:多彩球体 //5:爱心跳动 //6:旋转齿轮 //7:弹跳小球 //8:滑块滑动 //9:容器填充 //10:方块跳动 //11-40:spin //41-50:hypnotic /** 加载类型 */ this.ncType = 1; /** 加载大小 */ this.ncSize = 'default'; /** 加载提示 */ this.ncTips = ''; /** 加载提示颜色 */ this.ncTipsColor = '#1890ff'; /** 加载提示字体粗细 */ this.ncTipsWeight = '400'; } ngOnInit() { } } LoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.1.5", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); LoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.1.5", type: LoadingComponent, selector: "nc-loading", inputs: { ncType: "ncType", ncSize: "ncSize", ncTips: "ncTips", ncTipsColor: "ncTipsColor", ncTipsWeight: "ncTipsWeight" }, ngImport: i0, template: "<div class=\"nc-loading\">\r\n <!--1\u5706\u7403\u6392\u5217-->\r\n <div [ngClass]=\"'ballArrangement_' + ncSize\" *ngIf=\"ncType == 1\">\r\n <div class=\"cs-loader\">\r\n <div class=\"cs-loader-inner\">\r\n <div style=\"--j:1\"></div>\r\n <div style=\"--j:2\"></div>\r\n <div style=\"--j:3\"></div>\r\n <div style=\"--j:4\"></div>\r\n <div style=\"--j:5\"></div>\r\n <div style=\"--j:6\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <!--2\u5F69\u8272\u8DF3\u52A8-->\r\n <div [ngClass]=\"'colorfulBounce_' + ncSize\" *ngIf=\"ncType == 2\">\r\n <div class=\"ball-row\">\r\n <span class=\"ball\" style=\"--i:1;--ii:0\"></span>\r\n <span class=\"ball\" style=\"--i:2;--ii:1\"></span>\r\n <span class=\"ball\" style=\"--i:3;--ii:2\"></span>\r\n <span class=\"ball\" style=\"--i:4;--ii:3\"></span>\r\n <span class=\"ball\" style=\"--i:5;--ii:4\"></span>\r\n </div>\r\n <div class=\"shadow-row\">\r\n <span class=\"shadow\" style=\"--i:1;--ii:0\"></span>\r\n <span class=\"shadow\" style=\"--i:2;--ii:1\"></span>\r\n <span class=\"shadow\" style=\"--i:3;--ii:2\"></span>\r\n <span class=\"shadow\" style=\"--i:4;--ii:3\"></span>\r\n <span class=\"shadow\" style=\"--i:5;--ii:4\"></span>\r\n </div>\r\n </div>\r\n <!--3\u65CB\u8F6C\u547C\u5438-->\r\n <div [ngClass]=\"'rotatingBreathing_' + ncSize\" *ngIf=\"ncType == 3\">\r\n <div class=\"box\">\r\n <div class=\"circle\"></div>\r\n <div class=\"circle\"></div>\r\n </div>\r\n </div>\r\n <!--4\u591A\u5F69\u7403\u4F53-->\r\n <div [ngClass]=\"'colorfulBall_' + ncSize\" *ngIf=\"ncType == 4\">\r\n <span style=\"--i:0;\"></span>\r\n <span style=\"--i:1;\"></span>\r\n <span style=\"--i:2;\"></span>\r\n <span style=\"--i:3;\"></span>\r\n <span style=\"--i:4;\"></span>\r\n <span style=\"--i:5;\"></span>\r\n <span style=\"--i:6;\"></span>\r\n </div>\r\n <!--5\u7231\u5FC3\u8DF3\u52A8-->\r\n <div [ngClass]=\"'heartBeating_' + ncSize\" *ngIf=\"ncType == 5\">\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n </div>\r\n <!--6\u65CB\u8F6C\u9F7F\u8F6E-->\r\n <div [ngClass]=\"'gearbox_' + ncSize\" *ngIf=\"ncType == 6\">\r\n <div class=\"overlay\"></div>\r\n <div class=\"gear one\">\r\n <div class=\"gear-inner\">\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n </div>\r\n </div>\r\n <div class=\"gear two\">\r\n <div class=\"gear-inner\">\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n </div>\r\n </div>\r\n <div class=\"gear three\">\r\n <div class=\"gear-inner\">\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n </div>\r\n </div>\r\n <div class=\"gear four large\">\r\n <div class=\"gear-inner\">\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n <div class=\"bar\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <!--7\u5F39\u8DF3\u5C0F\u7403-->\r\n <div [ngClass]=\"'bouncingBall_' + ncSize\" *ngIf=\"ncType == 7\"></div>\r\n <!--8\u6ED1\u5757\u6ED1\u52A8-->\r\n <div [ngClass]=\"'sliderLoading_' + ncSize\" *ngIf=\"ncType == 8\"></div>\r\n <!--9\u5BB9\u5668\u586B\u5145-->\r\n <div [ngClass]=\"'containerFilling_' + ncSize\" *ngIf=\"ncType == 9\"></div>\r\n <!--10\u65B9\u5757\u8DF3\u52A8-->\r\n <div [ngClass]=\"'blockJump_' + ncSize\" *ngIf=\"ncType == 10\">\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n </div>\r\n <!--11spin-->\r\n <div [ngClass]=\"'spin11_' + ncSize\" *ngIf=\"ncType == 11\"></div>\r\n <!--12spin-->\r\n <div [ngClass]=\"'spin12_' + ncSize\" *ngIf=\"ncType == 12\"></div>\r\n <!--13spin-->\r\n <div [ngClass]=\"'spin13_' + ncSize\" *ngIf=\"ncType == 13\"></div>\r\n <!--14spin-->\r\n <div [ngClass]=\"'spin14_' + ncSize\" *ngIf=\"ncType == 14\"></div>\r\n <!--15spin-->\r\n <div [ngClass]=\"'spin15_' + ncSize\" *ngIf=\"ncType == 15\"></div>\r\n <!--16spin-->\r\n <div [ngClass]=\"'spin16_' + ncSize\" *ngIf=\"ncType == 16\"></div>\r\n <!--17spin-->\r\n <div [ngClass]=\"'spin17_' + ncSize\" *ngIf=\"ncType == 17\"></div>\r\n <!--18spin-->\r\n <div [ngClass]=\"'spin18_' + ncSize\" *ngIf=\"ncType == 18\"></div>\r\n <!--19spin-->\r\n <div [ngClass]=\"'spin19_' + ncSize\" *ngIf=\"ncType == 19\"></div>\r\n <!--20spin-->\r\n <div [ngClass]=\"'spin20_' + ncSize\" *ngIf=\"ncType == 20\"></div>\r\n <!--21spin-->\r\n <div [ngClass]=\"'spin21_' + ncSize\" *ngIf=\"ncType == 21\"></div>\r\n <!--22spin-->\r\n <div [ngClass]=\"'spin22_' + ncSize\" *ngIf=\"ncType == 22\"></div>\r\n <!--23spin-->\r\n <div [ngClass]=\"'spin23_' + ncSize\" *ngIf=\"ncType == 23\"></div>\r\n <!--24spin-->\r\n <div [ngClass]=\"'spin24_' + ncSize\" *ngIf=\"ncType == 24\"></div>\r\n <!--25spin-->\r\n <div [ngClass]=\"'spin25_' + ncSize\" *ngIf=\"ncType == 25\"></div>\r\n <!--26spin-->\r\n <div [ngClass]=\"'spin26_' + ncSize\" *ngIf=\"ncType == 26\"></div>\r\n <!--27spin-->\r\n <div [ngClass]=\"'spin27_' + ncSize\" *ngIf=\"ncType == 27\"></div>\r\n <!--28spin-->\r\n <div [ngClass]=\"'spin28_' + ncSize\" *ngIf=\"ncType == 28\"></div>\r\n <!--29spin-->\r\n <div [ngClass]=\"'spin29_' + ncSize\" *ngIf=\"ncType == 29\"></div>\r\n <!--30spin-->\r\n <div [ngClass]=\"'spin30_' + ncSize\" *ngIf=\"ncType == 30\"></div>\r\n <!--31spin-->\r\n <div [ngClass]=\"'spin31_' + ncSize\" *ngIf=\"ncType == 31\"></div>\r\n <!--32spin-->\r\n <div [ngClass]=\"'spin32_' + ncSize\" *ngIf=\"ncType == 32\"></div>\r\n <!--33spin-->\r\n <div [ngClass]=\"'spin33_' + ncSize\" *ngIf=\"ncType == 33\"></div>\r\n <!--34spin-->\r\n <div [ngClass]=\"'spin34_' + ncSize\" *ngIf=\"ncType == 34\"></div>\r\n <!--35spin-->\r\n <div [ngClass]=\"'spin35_' + ncSize\" *ngIf=\"ncType == 35\"></div>\r\n <!--36spin-->\r\n <div [ngClass]=\"'spin36_' + ncSize\" *ngIf=\"ncType == 36\"></div>\r\n <!--37spin-->\r\n <div [ngClass]=\"'spin37_' + ncSize\" *ngIf=\"ncType == 37\"></div>\r\n <!--38spin-->\r\n <div [ngClass]=\"'spin38_' + ncSize\" *ngIf=\"ncType == 38\"></div>\r\n <!--39spin-->\r\n <div [ngClass]=\"'spin39_' + ncSize\" *ngIf=\"ncType == 39\"></div>\r\n <!--40spin-->\r\n <div [ngClass]=\"'spin40_' + ncSize\" *ngIf=\"ncType == 40\"></div>\r\n <!--41hypnotic-->\r\n <div [ngClass]=\"'hypnotic41_' + ncSize\" *ngIf=\"ncType == 41\"></div>\r\n <!--42hypnotic-->\r\n <div [ngClass]=\"'hypnotic42_' + ncSize\" *ngIf=\"ncType == 42\"></div>\r\n <!--43hypnotic-->\r\n <div [ngClass]=\"'hypnotic43_' + ncSize\" *ngIf=\"ncType == 43\"></div>\r\n <!--44hypnotic-->\r\n <div [ngClass]=\"'hypnotic44_' + ncSize\" *ngIf=\"ncType == 44\"></div>\r\n <!--45hypnotic-->\r\n <div [ngClass]=\"'hypnotic45_' + ncSize\" *ngIf=\"ncType == 45\"></div>\r\n <!--46hypnotic-->\r\n <div [ngClass]=\"'hypnotic46_' + ncSize\" *ngIf=\"ncType == 46\"></div>\r\n <!--47hypnotic-->\r\n <div [ngClass]=\"'hypnotic47_' + ncSize\" *ngIf=\"ncType == 47\"></div>\r\n <!--48hypnotic-->\r\n <div [ngClass]=\"'hypnotic48_' + ncSize\" *ngIf=\"ncType == 48\"></div>\r\n <!--49hypnotic-->\r\n <div [ngClass]=\"'hypnotic49_' + ncSize\" *ngIf=\"ncType == 49\"></div>\r\n <!--50hypnotic-->\r\n <div [ngClass]=\"'hypnotic50_' + ncSize\" *ngIf=\"ncType == 50\"></div>\r\n <!--tips-->\r\n <div [ngStyle]=\"{'color': ncTipsColor, 'font-weight': ncTipsWeight}\" [ngClass]=\"'ncTips_' + ncSize\" *ngIf=\"ncTips\">\r\n {{ncTips}}</div>\r\n</div>", styles: [".nc-loading{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.ncTips_mini{font-size:12px;margin-top:6px;letter-spacing:0}.ncTips_small{font-size:15px;margin-top:10px;letter-spacing:1px}.ncTips_default{font-size:18px;margin-top:18px;letter-spacing:2px}.ncTips_large{font-size:22px;margin-top:24px;letter-spacing:3px}.ballArrangement_mini{overflow:hidden;transition:opacity .65s;z-index:-1;position:relative;width:100%;height:6px}.ballArrangement_mini .cs-loader{position:absolute;top:0;left:0;height:100%;width:100%}.ballArrangement_mini .cs-loader .cs-loader-inner{width:100%;display:flex;align-items:center;justify-content:center}.ballArrangement_mini .cs-loader .cs-loader-inner div{width:6px;height:6px;opacity:0;display:inline-block;background-color:#49a9ee;border-radius:50%;margin-left:6px}.ballArrangement_mini .cs-loader .cs-loader-inner div:nth-child(6){animation:lol_mini 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_mini .cs-loader .cs-loader-inner div:nth-child(5){animation:lol_mini 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_mini .cs-loader .cs-loader-inner div:nth-child(4){animation:lol_mini 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_mini .cs-loader .cs-loader-inner div:nth-child(3){animation:lol_mini 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_mini .cs-loader .cs-loader-inner div:nth-child(2){animation:lol_mini 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_mini .cs-loader .cs-loader-inner div:nth-child(1){animation:lol_mini 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}@keyframes lol_mini{0%{opacity:0;transform:translate(-100px)}33%{opacity:1;transform:translate(0)}66%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(100px)}}.ballArrangement_small{overflow:hidden;transition:opacity .65s;z-index:-1;position:relative;width:100%;height:10px}.ballArrangement_small .cs-loader{position:absolute;top:0;left:0;height:100%;width:100%}.ballArrangement_small .cs-loader .cs-loader-inner{width:100%;display:flex;align-items:center;justify-content:center}.ballArrangement_small .cs-loader .cs-loader-inner div{width:10px;height:10px;opacity:0;display:inline-block;background-color:#49a9ee;border-radius:50%;margin-left:10px}.ballArrangement_small .cs-loader .cs-loader-inner div:nth-child(6){animation:lol_small 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_small .cs-loader .cs-loader-inner div:nth-child(5){animation:lol_small 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_small .cs-loader .cs-loader-inner div:nth-child(4){animation:lol_small 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_small .cs-loader .cs-loader-inner div:nth-child(3){animation:lol_small 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_small .cs-loader .cs-loader-inner div:nth-child(2){animation:lol_small 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_small .cs-loader .cs-loader-inner div:nth-child(1){animation:lol_small 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}@keyframes lol_small{0%{opacity:0;transform:translate(-200px)}33%{opacity:1;transform:translate(0)}66%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(200px)}}.ballArrangement_default{overflow:hidden;transition:opacity .65s;z-index:-1;position:relative;width:100%;height:14px}.ballArrangement_default .cs-loader{position:absolute;top:0;left:0;height:100%;width:100%}.ballArrangement_default .cs-loader .cs-loader-inner{width:100%;display:flex;align-items:center;justify-content:center}.ballArrangement_default .cs-loader .cs-loader-inner div{width:14px;height:14px;opacity:0;display:inline-block;background-color:#49a9ee;border-radius:50%;margin-left:14px}.ballArrangement_default .cs-loader .cs-loader-inner div:nth-child(6){animation:lol_default 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_default .cs-loader .cs-loader-inner div:nth-child(5){animation:lol_default 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_default .cs-loader .cs-loader-inner div:nth-child(4){animation:lol_default 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_default .cs-loader .cs-loader-inner div:nth-child(3){animation:lol_default 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_default .cs-loader .cs-loader-inner div:nth-child(2){animation:lol_default 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_default .cs-loader .cs-loader-inner div:nth-child(1){animation:lol_default 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}@keyframes lol_default{0%{opacity:0;transform:translate(-300px)}33%{opacity:1;transform:translate(0)}66%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(300px)}}.ballArrangement_large{overflow:hidden;transition:opacity .65s;z-index:-1;position:relative;width:100%;height:24px}.ballArrangement_large .cs-loader{position:absolute;top:0;left:0;height:100%;width:100%}.ballArrangement_large .cs-loader .cs-loader-inner{width:100%;display:flex;align-items:center;justify-content:center}.ballArrangement_large .cs-loader .cs-loader-inner div{width:24px;height:24px;opacity:0;display:inline-block;background-color:#49a9ee;border-radius:50%;margin-left:24px}.ballArrangement_large .cs-loader .cs-loader-inner div:nth-child(6){animation:lol_large 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_large .cs-loader .cs-loader-inner div:nth-child(5){animation:lol_large 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_large .cs-loader .cs-loader-inner div:nth-child(4){animation:lol_large 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_large .cs-loader .cs-loader-inner div:nth-child(3){animation:lol_large 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_large .cs-loader .cs-loader-inner div:nth-child(2){animation:lol_large 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}.ballArrangement_large .cs-loader .cs-loader-inner div:nth-child(1){animation:lol_large 3s calc((6 - var(--j)) * .1s) infinite ease-in-out}@keyframes lol_large{0%{opacity:0;transform:translate(-400px)}33%{opacity:1;transform:translate(0)}66%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(400px)}}.colorfulBounce_mini{width:100%;height:25px;display:flex;flex-direction:column;justify-content:center;align-items:center}.colorfulBounce_mini .ball-row{width:60px;height:100%;position:relative}.colorfulBounce_mini .ball-row .ball{width:6px;height:6px;border-radius:50%;background-color:#20b2aa;position:absolute;margin:0 3px;left:calc(var(--ii) * (6px * 2));animation:colorfulBounceMiniJump 2s linear infinite calc(var(--i) * .3s)}.colorfulBounce_mini .shadow-row{width:60px;position:relative}.colorfulBounce_mini .shadow-row .shadow{width:6px;height:3px;border-radius:50%;background-color:#000;position:absolute;left:calc(var(--ii) * (6px * 2));margin:0 3px;bottom:-1.5px;z-index:-1;animation:colorfulBounceMiniShadow 2s linear infinite calc(var(--i) * .3s)}@keyframes colorfulBounceMiniJump{0%,to{bottom:15.75px}40%,60%{bottom:3.25px;height:6px}50%{height:3px;filter:hue-rotate(180deg)}}@keyframes colorfulBounceMiniShadow{0%,to{transform:scale(1.2);opacity:.1;filter:blur(2px)}40%,60%{transform:scale(1);opacity:1;filter:blur(1px)}}.colorfulBounce_small{width:100%;height:50px;display:flex;flex-direction:column;justify-content:center;align-items:center}.colorfulBounce_small .ball-row{width:120px;height:100%;position:relative}.colorfulBounce_small .ball-row .ball{width:12px;height:12px;border-radius:50%;background-color:#20b2aa;position:absolute;margin:0 6px;left:calc(var(--ii) * (12px * 2));animation:colorfulBounceSmallJump 2s linear infinite calc(var(--i) * .3s)}.colorfulBounce_small .shadow-row{width:120px;position:relative}.colorfulBounce_small .shadow-row .shadow{width:12px;height:6px;border-radius:50%;background-color:#000;position:absolute;left:calc(var(--ii) * (12px * 2));margin:0 6px;bottom:-3px;z-index:-1;animation:colorfulBounceSmallShadow 2s linear infinite calc(var(--i) * .3s)}@keyframes colorfulBounceSmallJump{0%,to{bottom:31.5px}40%,60%{bottom:6.5px;height:12px}50%{height:6px;filter:hue-rotate(180deg)}}@keyframes colorfulBounceSmallShadow{0%,to{transform:scale(1.2);opacity:.1;filter:blur(3px)}40%,60%{transform:scale(1);opacity:1;filter:blur(1px)}}.colorfulBounce_default{width:100%;height:100px;display:flex;flex-direction:column;justify-content:center;align-items:center}.colorfulBounce_default .ball-row{width:240px;height:100%;position:relative}.colorfulBounce_default .ball-row .ball{width:24px;height:24px;border-radius:50%;background-color:#20b2aa;position:absolute;margin:0 12px;left:calc(var(--ii) * (24px * 2));animation:colorfulBounceDefaultJump 2s linear infinite calc(var(--i) * .3s)}.colorfulBounce_default .shadow-row{width:240px;position:relative}.colorfulBounce_default .shadow-row .shadow{width:24px;height:12px;border-radius:50%;background-color:#000;position:absolute;left:calc(var(--ii) * (24px * 2));margin:0 12px;bottom:-6px;z-index:-1;animation:colorfulBounceDefaultShadow 2s linear infinite calc(var(--i) * .3s)}@keyframes colorfulBounceDefaultJump{0%,to{bottom:63px}40%,60%{bottom:13px;height:24px}50%{height:12px;filter:hue-rotate(180deg)}}@keyframes colorfulBounceDefaultShadow{0%,to{transform:scale(1.2);opacity:.1;filter:blur(4px)}40%,60%{transform:scale(1);opacity:1;filter:blur(2px)}}.colorfulBounce_large{width:100%;height:200px;display:flex;flex-direction:column;justify-content:center;align-items:center}.colorfulBounce_large .ball-row{width:480px;height:100%;position:relative}.colorfulBounce_large .ball-row .ball{width:48px;height:48px;border-radius:50%;background-color:#20b2aa;position:absolute;margin:0 24px;left:calc(var(--ii) * (48px * 2));animation:colorfulBounceLargeJump 2s linear infinite calc(var(--i) * .3s)}.colorfulBounce_large .shadow-row{width:480px;position:relative}.colorfulBounce_large .shadow-row .shadow{width:48px;height:24px;border-radius:50%;background-color:#000;position:absolute;left:calc(var(--ii) * (48px * 2));margin:0 24px;bottom:-12px;z-index:-1;animation:colorfulBounceLargeShadow 2s linear infinite calc(var(--i) * .3s)}@keyframes colorfulBounceLargeJump{0%,to{bottom:126px}40%,60%{bottom:26px;height:48px}50%{height:24px;filter:hue-rotate(180deg)}}@keyframes colorfulBounceLargeShadow{0%,to{transform:scale(1.2);opacity:.1;filter:blur(5px)}40%,60%{transform:scale(1);opacity:1;filter:blur(2px)}}.rotatingBreathing_mini{display:flex;flex-direction:column;justify-content:center;align-items:center}.rotatingBreathing_mini .box{position:relative;width:25px;height:25px;animation:rotateBox 10s linear infinite}.rotatingBreathing_mini .box .circle{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#f5e866;border-radius:50%;animation:rotatingBreathingAnimate 5s linear infinite}.rotatingBreathing_mini .box .circle:nth-child(2){background-color:#a08fd5;animation-delay:-2.5s}.rotatingBreathing_small{display:flex;flex-direction:column;justify-content:center;align-items:center}.rotatingBreathing_small .box{position:relative;width:50px;height:50px;animation:rotateBox 10s linear infinite}.rotatingBreathing_small .box .circle{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#f5e866;border-radius:50%;animation:rotatingBreathingAnimate 5s linear infinite}.rotatingBreathing_small .box .circle:nth-child(2){background-color:#a08fd5;animation-delay:-2.5s}.rotatingBreathing_default{display:flex;flex-direction:column;justify-content:center;align-items:center}.rotatingBreathing_default .box{position:relative;width:100px;height:100px;animation:rotateBox 10s linear infinite}.rotatingBreathing_default .box .circle{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#f5e866;border-radius:50%;animation:rotatingBreathingAnimate 5s linear infinite}.rotatingBreathing_default .box .circle:nth-child(2){background-color:#a08fd5;animation-delay:-2.5s}.rotatingBreathing_large{display:flex;flex-direction:column;justify-content:center;align-items:center}.rotatingBreathing_large .box{position:relative;width:200px;height:200px;animation:rotateBox 10s linear infinite}.rotatingBreathing_large .box .circle{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#f5e866;border-radius:50%;animation:rotatingBreathingAnimate 5s linear infinite}.rotatingBreathing_large .box .circle:nth-child(2){background-color:#a08fd5;animation-delay:-2.5s}@keyframes rotatingBreathingAnimate{0%{transform:scale(1);transform-origin:left}50%{transform:scale(0);transform-origin:left}50.01%{transform:scale(0);transform-origin:right}to{transform:scale(1);transform-origin:right}}@keyframes rotateBox{to{transform:rotate(360deg)}}.colorfulBall_mini{display:flex}.colorfulBall_mini span{position:relative;width:10px;height:10px;background-color:#eaeef0;margin:0 3px;border-radius:50%;box-shadow:-2px -2px 4px #fff,2px 2px 4px #0003,inset 3px 3px 6px #0000001a,inset -1px -1px 6px #fff;border:1px solid #eaeef0}.colorfulBall_mini span:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#20b2aa;border-radius:50%;box-shadow:inset 3px 3px 6px #0000001a,inset -1px -1px 6px #fff;opacity:0;animation:colorfulBallAnimate1 3.5s linear infinite,colorfulBallAnimate2 5s linear infinite;animation-delay:calc(var(--i) * .15s)}.colorfulBall_small{display:flex}.colorfulBall_small span{position:relative;width:16px;height:16px;background-color:#eaeef0;margin:0 4px;border-radius:50%;box-shadow:-4px -4px 8px #fff,4px 4px 8px #0003,inset 3px 3px 6px #0000001a,inset -1px -1px 6px #fff;border:2px solid #eaeef0}.colorfulBall_small span:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#20b2aa;border-radius:50%;box-shadow:inset 3px 3px 6px #0000001a,inset -1px -1px 6px #fff;opacity:0;animation:colorfulBallAnimate1 3.5s linear infinite,colorfulBallAnimate2 5s linear infinite;animation-delay:calc(var(--i) * .15s)}.colorfulBall_default{display:flex}.colorfulBall_default span{position:relative;width:25px;height:25px;background-color:#eaeef0;margin:0 5px;border-radius:50%;box-shadow:-6px -6px 12px #fff,6px 6px 12px #0003,inset 3px 3px 6px #0000001a,inset -1px -1px 6px #fff;border:4px solid #eaeef0}.colorfulBall_default span:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#20b2aa;border-radius:50%;box-shadow:inset 3px 3px 6px #0000001a,inset -1px -1px 6px #fff;opacity:0;animation:colorfulBallAnimate1 3.5s linear infinite,colorfulBallAnimate2 5s linear infinite;animation-delay:calc(var(--i) * .15s)}.colorfulBall_large{display:flex}.colorfulBall_large span{position:relative;width:50px;height:50px;background-color:#eaeef0;margin:0 10px;border-radius:50%;box-shadow:-8px -8px 16px #fff,8px 8px 16px #0003,inset 3px 3px 6px #0000001a,inset -1px -1px 6px #fff;border:6px solid #eaeef0}.colorfulBall_large span:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#20b2aa;border-radius:50%;box-shadow:inset 3px 3px 6px #0000001a,inset -1px -1px 6px #fff;opacity:0;animation:colorfulBallAnimate1 3.5s linear infinite,colorfulBallAnimate2 5s linear infinite;animation-delay:calc(var(--i) * .15s)}@keyframes colorfulBallAnimate1{0%,9.99%,70.01%{opacity:0}10%,70%{opacity:1}}@keyframes colorfulBallAnimate2{to{filter:hue-rotate(360deg)}}.heartBeating_mini{width:56px;height:44px;display:flex;justify-content:space-between}.heartBeating_mini span{--c: plum;--h: 50%;--t: 25%;background-color:var(--c);width:4px;border-radius:2px;position:relative;height:var(--h);top:var(--t);animation:heartBeatingMini 1s infinite}.heartBeating_mini span:nth-child(1),.heartBeating_mini span:nth-child(9){--c: lightcoral;--h: calc(60px * .2);--t: calc(44px * .2)}.heartBeating_mini span:nth-child(2),.heartBeating_mini span:nth-child(8){--c: lightskyblue;--h: calc(120px * .2);--t: calc(12px * .2)}.heartBeating_mini span:nth-child(3),.heartBeating_mini span:nth-child(7){--c: lightgreen;--h: calc(160px * .2);--t: 0}.heartBeating_mini span:nth-child(4),.heartBeating_mini span:nth-child(6){--c: gold;--h: calc(180px * .2);--t: calc(16px * .2)}.heartBeating_mini span:nth-child(5){--c: plum;--h: calc(188px * .2);--t: calc(32px * .2)}@keyframes heartBeatingMini{0%,30%{height:var(--h);top:var(--t);background-color:var(--c);filter:blur(0)}60%,70%{height:50%;top:25%;background-color:plum;filter:blur(1px)}}.heartBeating_small{width:112px;height:88px;display:flex;justify-content:space-between}.heartBeating_small span{--c: plum;--h: 50%;--t: 25%;background-color:var(--c);width:8px;border-radius:4px;position:relative;height:var(--h);top:var(--t);animation:heartBeatingSmall 1s infinite}.heartBeating_small span:nth-child(1),.heartBeating_small span:nth-child(9){--c: lightcoral;--h: calc(60px * .4);--t: calc(44px * .4)}.heartBeating_small span:nth-child(2),.heartBeating_small span:nth-child(8){--c: lightskyblue;--h: calc(120px * .4);--t: calc(12px * .4)}.heartBeating_small span:nth-child(3),.heartBeating_small span:nth-child(7){--c: lightgreen;--h: calc(160px * .4);--t: 0}.heartBeating_small span:nth-child(4),.heartBeating_small span:nth-child(6){--c: gold;--h: calc(180px * .4);--t: calc(16px * .4)}.heartBeating_small span:nth-child(5){--c: plum;--h: calc(188px * .4);--t: calc(32px * .4)}@keyframes heartBeatingSmall{0%,30%{height:var(--h);top:var(--t);background-color:var(--c);filter:blur(0)}60%,70%{height:50%;top:25%;background-color:plum;filter:blur(2px)}}.heartBeating_default{width:168px;height:132px;display:flex;justify-content:space-between}.heartBeating_default span{--c: plum;--h: 50%;--t: 25%;background-color:var(--c);width:12px;border-radius:6px;position:relative;height:var(--h);top:var(--t);animation:heartBeatingDefault 1s infinite}.heartBeating_default span:nth-child(1),.heartBeating_default span:nth-child(9){--c: lightcoral;--h: calc(60px * .6);--t: calc(44px * .6)}.heartBeating_default span:nth-child(2),.heartBeating_default span:nth-child(8){--c: lightskyblue;--h: calc(120px * .6);--t: calc(12px * .6)}.heartBeating_default span:nth-child(3),.heartBeating_default span:nth-child(7){--c: lightgreen;--h: calc(160px * .6);--t: 0}.heartBeating_default span:nth-child(4),.heartBeating_default span:nth-child(6){--c: gold;--h: calc(180px * .6);--t: calc(16px * .6)}.heartBeating_default span:nth-child(5){--c: plum;--h: calc(188px * .6);--t: calc(32px * .6)}@keyframes heartBeatingDefault{0%,30%{height:var(--h);top:var(--t);background-color:var(--c);filter:blur(0)}60%,70%{height:50%;top:25%;background-color:plum;filter:blur(3px)}}.heartBeating_large{width:280px;height:220px;display:flex;justify-content:space-between}.heartBeating_large span{--c: plum;--h: 50%;--t: 25%;background-color:var(--c);width:20px;border-radius:10px;position:relative;height:var(--h);top:var(--t);animation:heartBeatinglarge 1s infinite}.heartBeating_large span:nth-child(1),.heartBeating_large span:nth-child(9){--c: lightcoral;--h: calc(60px * 1);--t: calc(44px * 1)}.heartBeating_large span:nth-child(2),.heartBeating_large span:nth-child(8){--c: lightskyblue;--h: calc(120px * 1);--t: calc(12px * 1)}.heartBeating_large span:nth-child(3),.heartBeating_large span:nth-child(7){--c: lightgreen;--h: calc(160px * 1);--t: 0}.heartBeating_large span:nth-child(4),.heartBeating_large span:nth-child(6){--c: gold;--h: calc(180px * 1);--t: calc(16px * 1)}.heartBeating_large span:nth-child(5){--c: plum;--h: calc(188px * 1);--t: calc(32px * 1)}@keyframes heartBeatinglarge{0%,30%{height:var(--h);top:var(--t);background-color:var(--c);filter:blur(0)}60%,70%{height:50%;top:25%;background-color:plum;filter:blur(5px)}}.gearbox_mini{height:36px;width:48px;position:relative;border:none;overflow:hidden;border-radius:1.44px}.gearbox_mini .overlay{border-radius:1.44px;content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;transition:background .2s;background:transparent}.gearbox_mini .gear{position:absolute;height:14.4px;width:14.4px;border-radius:7.2px}.gearbox_mini .gear.large{height:28.8px;width:28.8px;border-radius:14.4px}.gearbox_mini .gear.large:after{height:23.04px;width:23.04px;border-radius:11.52px;margin-left:-11.52px;margin-top:-11.52px}.gearbox_mini .gear.one{top:2.88px;left:2.4px}.gearbox_mini .gear.two{top:14.64px;left:14.4px}.gearbox_mini .gear.three{top:26.4px;left:2.4px}.gearbox_mini .gear.four{top:3.12px;left:30.72px}.gearbox_mini .gear:after{content:\"\";position:absolute;height:8.64px;width:8.64px;border-radius:8.64px;background:#111;top:50%;left:50%;margin-left:-4.32px;margin-top:-4.32px;z-index:3;box-shadow:0 0 2.4px #ffffff1a,inset 0 0 2.4px #0000001a,inset 0 2px #090909,inset 0 -1px #888}.gearbox_mini .gear-inner{position:relative;height:100%;width:100%;background:#555;border-radius:7.2px;border:1px solid rgba(255,255,255,.1)}.gearbox_mini .large .gear-inner{border-radius:14.4px}.gearbox_mini .gear.one .gear-inner{animation:counter-clockwise 3s infinite linear}.gearbox_mini .gear.two .gear-inner{animation:clockwise 3s infinite linear}.gearbox_mini .gear.three .gear-inner{animation:counter-clockwise 3s infinite linear}.gearbox_mini .gear.four .gear-inner{animation:counter-clockwise 6s infinite linear}.gearbox_mini .gear-inner .bar{background:#555;height:3.84px;width:18.24px;position:absolute;left:50%;margin-left:-9.12px;top:50%;margin-top:-1.92px;border-radius:.48px;border-left:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1)}.gearbox_mini .large .gear-inner .bar{margin-left:-16.32px;width:32.64px}.gearbox_mini .gear-inner .bar:nth-child(2){transform:rotate(60deg)}.gearbox_mini .gear-inner .bar:nth-child(3){transform:rotate(120deg)}.gearbox_mini .gear-inner .bar:nth-child(4){transform:rotate(90deg)}.gearbox_mini .gear-inner .bar:nth-child(5){transform:rotate(30deg)}.gearbox_mini .gear-inner .bar:nth-child(6){transform:rotate(150deg)}.gearbox_small{height:60px;width:80px;position:relative;border:none;overflow:hidden;border-radius:2.4px}.gearbox_small .overlay{border-radius:2.4px;content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;transition:background .2s;background:transparent}.gearbox_small .gear{position:absolute;height:24px;width:24px;border-radius:12px}.gearbox_small .gear.large{height:48px;width:48px;border-radius:24px}.gearbox_small .gear.large:after{height:38.4px;width:38.4px;border-radius:19.2px;margin-left:-19.2px;margin-top:-19.2px}.gearbox_small .gear.one{top:4.8px;left:4px}.gearbox_small .gear.two{top:24.4px;left:24px}.gearbox_small .gear.three{top:44px;left:4px}.gearbox_small .gear.four{top:5.2px;left:51.2px}.gearbox_small .gear:after{content:\"\";position:absolute;height:14.4px;width:14.4px;border-radius:14.4px;background:#111;top:50%;left:50%;margin-left:-7.2px;margin-top:-7.2px;z-index:3;box-shadow:0 0 4px #ffffff1a,inset 0 0 4px #0000001a,inset 0 2px #090909,inset 0 -1px #888}.gearbox_small .gear-inner{position:relative;height:100%;width:100%;background:#555;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.gearbox_small .large .gear-inner{border-radius:24px}.gearbox_small .gear.one .gear-inner{animation:counter-clockwise 3s infinite linear}.gearbox_small .gear.two .gear-inner{animation:clockwise 3s infinite linear}.gearbox_small .gear.three .gear-inner{animation:counter-clockwise 3s infinite linear}.gearbox_small .gear.four .gear-inner{animation:counter-clockwise 6s infinite linear}.gearbox_small .gear-inner .bar{background:#555;height:6.4px;width:30.4px;position:absolute;left:50%;margin-left:-15.2px;top:50%;margin-top:-3.2px;border-radius:.8px;border-left:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1)}.gearbox_small .large .gear-inner .bar{margin-left:-27.2px;width:54.4px}.gearbox_small .gear-inner .bar:nth-child(2){transform:rotate(60deg)}.gearbox_small .gear-inner .bar:nth-child(3){transform:rotate(120deg)}.gearbox_small .gear-inner .bar:nth-child(4){transform:rotate(90deg)}.gearbox_small .gear-inner .bar:nth-child(5){transform:rotate(30deg)}.gearbox_small .gear-inner .bar:nth-child(6){transform:rotate(150deg)}.gearbox_default{height:90px;width:120px;position:relative;border:none;overflow:hidden;border-radius:3.6px}.gearbox_default .overlay{border-radius:3.6px;content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;transition:background .2s;background:transparent}.gearbox_default .gear{position:absolute;height:36px;width:36px;border-radius:18px}.gearbox_default .gear.large{height:72px;width:72px;border-radius:36px}.gearbox_default .gear.large:after{height:57.6px;width:57.6px;border-radius:28.8px;margin-left:-28.8px;margin-top:-28.8px}.gearbox_default .gear.one{top:7.2px;left:6px}.gearbox_default .gear.two{top:36.6px;left:36px}.gearbox_default .gear.three{top:66px;left:6px}.gearbox_default .gear.four{top:7.8px;left:76.8px}.gearbox_default .gear:after{content:\"\";position:absolute;height:21.6px;width:21.6px;border-radius:21.6px;background:#111;top:50%;left:50%;margin-left:-10.8px;margin-top:-10.8px;z-index:3;box-shadow:0 0 6px #ffffff1a,inset 0 0 6px #0000001a,inset 0 2px #090909,inset 0 -1px #888}.gearbox_default .gear-inner{position:relative;height:100%;width:100%;background:#555;border-radius:18px;border:1px solid rgba(255,255,255,.1)}.gearbox_default .large .gear-inner{border-radius:36px}.gearbox_default .gear.one .gear-inner{animation:counter-clockwise 3s infinite linear}.gearbox_default .gear.two .gear-inner{animation:clockwise 3s infinite linear}.gearbox_default .gear.three .gear-inner{animation:counter-clockwise 3s infinite linear}.gearbox_default .gear.four .gear-inner{animation:counter-clockwise 6s infinite linear}.gearbox_default .gear-inner .bar{background:#555;height:9.6px;width:45.6px;position:absolute;left:50%;margin-left:-22.8px;top:50%;margin-top:-4.8px;border-radius:1.2px;border-left:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1)}.gearbox_default .large .gear-inner .bar{margin-left:-40.8px;width:81.6px}.gearbox_default .gear-inner .bar:nth-child(2){transform:rotate(60deg)}.gearbox_default .gear-inner .bar:nth-child(3){transform:rotate(120deg)}.gearbox_default .gear-inner .bar:nth-child(4){transform:rotate(90deg)}.gearbox_default .gear-inner .bar:nth-child(5){transform:rotate(30deg)}.gearbox_default .gear-inner .bar:nth-child(6){transform:rotate(150deg)}.gearbox_large{height:150px;width:200px;position:relative;border:none;overflow:hidden;border-radius:6px}.gearbox_large .overlay{border-radius:6px;content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;transition:background .2s;background:transparent}.gearbox_large .gear{position:absolute;height:60px;width:60px;border-radius:30px}.gearbox_large .gear.large{height:120px;width:120px;border-radius:60px}.gearbox_large .gear.large:after{height:96px;width:96px;border-radius:48px;margin-left:-48px;margin-top:-48px}.gearbox_large .gear.one{top:12px;left:10px}.gearbox_large .gear.two{top:61px;left:60px}.gearbox_large .gear.three{top:110px;left:10px}.gearbox_large .gear.four{top:13px;left:128px}.gearbox_large .gear:after{content:\"\";position:absolute;height:36px;width:36px;border-radius:36px;background:#111;top:50%;left:50%;margin-left:-18px;margin-top:-18px;z-index:3;box-shadow:0 0 10px #ffffff1a,inset 0 0 10px #0000001a,inset 0 2px #090909,inset 0 -1px #888}.gearbox_large .gear-inner{position:relative;height:100%;width:100%;background:#555;border-radius:30px;border:1px solid rgba(255,255,255,.1)}.gearbox_large .large .gear-inner{border-radius:60px}.gearbox_large .gear.one .gear-inner{animation:counter-clockwise 3s infinite linear}.gearbox_large .gear.two .gear-inner{animation:clockwise 3s infinite linear}.gearbox_large .gear.three .gear-inner{animation:counter-clockwise 3s infinite linear}.gearbox_large .gear.four .gear-inner{animation:counter-clockwise 6s infinite linear}.gearbox_large .gear-inner .bar{background:#555;height:16px;width:76px;position:absolute;left:50%;margin-left:-38px;top:50%;margin-top:-8px;border-radius:2px;border-left:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1)}.gearbox_large .large .gear-inner .bar{margin-left:-68px;width:136px}.gearbox_large .gear-inner .bar:nth-child(2){transform:rotate(60deg)}.gearbox_large .gear-inner .bar:nth-child(3){transform:rotate(120deg)}.gearbox_large .gear-inner .bar:nth-child(4){transform:rotate(90deg)}.gearbox_large .gear-inner .bar:nth-child(5){transform:rotate(30deg)}.gearbox_large .gear-inner .bar:nth-child(6){transform:rotate(150deg)}@keyframes clockwise{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes counter-clockwise{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.bouncingBall_mini{position:relative;width:24px;height:18px;margin:0 auto}.bouncingBall_mini:before{content:\"\";position:absolute;bottom:6px;left:10px;height:6px;width:6px;border-radius:50%;background:#2a9d8f;animation:bouncingBallMiniBounce .5s ease-in-out infinite alternate}.bouncingBall_mini:after{content:\"\";position:absolute;right:0;top:0;height:1.4px;width:9px;border-radius:.8px;box-shadow:0 1px #aaa,-7px 10px #aaa,-14px 19px #aaa;animation:bouncingBallMiniStep 1s ease-in-out infinite}@keyframes bouncingBallMiniBounce{0%{transform:scaleY(.7)}40%{transform:scale(.8,1.2)}60%{transform:scale(1)}to{bottom:28px}}@keyframes bouncingBallMiniStep{0%{box-shadow:0 2px #0000,0 2px #aaa,-7px 10px #aaa,-14px 18px #aaa}to{box-shadow:0 2px #aaa,-7px 10px #aaa,-14px 18px #aaa,-14px 18px #0000}}.bouncingBall_small{position:relative;width:48px;height:36px;margin:0 auto}.bouncingBall_small:before{content:\"\";position:absolute;bottom:12px;left:20px;height:12px;width:12px;border-radius:50%;background:#2a9d8f;animation:bouncingBallSmallBounce .5s ease-in-out infinite alternate}.bouncingBall_small:after{content:\"\";position:absolute;right:0;top:0;height:2.8px;width:18px;border-radius:1.6px;box-shadow:0 2px #aaa,-14px 20px #aaa,-28px 38px #aaa;animation:bouncingBallSmallStep 1s ease-in-out infinite}@keyframes bouncingBallSmallBounce{0%{transform:scaleY(.7)}40%{transform:scale(.8,1.2)}60%{transform:scale(1)}to{bottom:56px}}@keyframes bouncingBallSmallStep{0%{box-shadow:0 4px #0000,0 4px #aaa,-14px 20px #aaa,-28px 36px #aaa}to{box-shadow:0 4px #aaa,-14px 20px #aaa,-28px 36px #aaa,-28px 36px #0000}}.bouncingBall_default{position:relative;width:72px;height:54px;margin:0 auto}.bouncingBall_default:before{content:\"\";position:absolute;bottom:18px;left:30px;height:18px;width:18px;border-radius:50%;background:#2a9d8f;animation:bouncingBallDefaultBounce .5s ease-in-out infinite alternate}.bouncingBall_default:after{content:\"\";position:absolute;right:0;top:0;height:4.2px;width:27px;border-radius:2.4px;box-shadow:0 3px #aaa,-21px 30px #aaa,-42px 57px #aaa;animation:bouncingBallDefaultStep 1s ease-in-out infinite}@keyframes bouncingBallDefaultBounce{0%{transform:scaleY(.7)}40%{transform:scale(.8,1.2)}60%{transform:scale(1)}to{bottom:84px}}@keyframes bouncingBallDefaultStep{0%{box-shadow:0 6px #0000,0 6px #aaa,-21px 30px #aaa,-42px 54px #aaa}to{box-shadow:0 6px #aaa,-21px 30px #aaa,-42px 54px #aaa,-42px 54px #0000}}.bouncingBall_large{position:relative;width:120px;height:90px;margin:0 auto}.bouncingBall_large:before{content:\"\";position:absolute;bottom:30px;left:50px;height:30px;width:30px;border-radius:50%;background:#2a9d8f;animation:bouncingBallLargeBounce .5s ease-in-out infinite alternate}.bouncingBall_large:after{content:\"\";position:absolute;right:0;top:0;height:7px;width:45px;border-radius:4px;box-shadow:0 5px #aaa,-35px 50px #aaa,-70px 95px #aaa;animation:bouncingBallLargeStep 1s ease-in-out infinite}@keyframes bouncingBallLargeBounce{0%{transform:scaleY(.7)}40%{transform:scale(.8,1.2)}60%{transform:scale(1)}to{bottom:140px}}@keyframes bouncingBallLargeStep{0%{box-shadow:0 10px #0000,0 10px #aaa,-35px 50px #aaa,-70px 90px #aaa}to{box-shadow:0 10px #aaa,-35px 50px #aaa,-70px 90px #aaa,-70px 90px #0000}}.sliderLoading_mini{width:20px;height:4px;margin-bottom:4px;background:#3498DB;border-radius:2px;animation:sliderLoadingMini 1.8s ease-in-out infinite}.sliderLoading_mini:after,.sliderLoading_mini:before{position:absolute;display:block;content:\"\";animation:sliderLoadingMini 1.8s ease-in-out infinite;height:4px;border-radius:2px}.sliderLoading_mini:after{bottom:-8px;width:14px;background:#F5AB35}.sliderLoading_mini:before{top:-8px;left:4px;width:16px;background:#EF4836}@keyframes sliderLoadingMini{0%{transform:translate(16px)}50%{transform:translate(-12px)}to{transform:translate(16px)}}.sliderLoading_small{width:30px;height:6px;margin-bottom:6px;background:#3498DB;border-radius:3px;animation:sliderLoadingSmall 1.8s ease-in-out infinite}.sliderLoading_small:after,.sliderLoading_small:before{position:absolute;display:block;content:\"\";animation:sliderLoadingSmall 1.8s ease-in-out infinite;height:6px;border-radius:3px}.sliderLoading_small:after{bottom:-12px;width:21px;background:#F5AB35}.sliderLoading_small:before{top:-12px;left:6px;width:24px;background:#EF4836}@keyframes sliderLoadingSmall{0%{transform:translate(24px)}50%{transform:translate(-18px)}to{transform:translate(24px)}}.sliderLoading_default{width:50px;height:10px;margin-bottom:10px;background:#3498DB;border-radius:5px;animation:sliderLoadingDefaul 1.8s ease-in-out infinite}.sliderLoading_default:after,.sliderLoading_default:before{position:absolute;display:block;content:\"\";animation:sliderLoadingDefaul 1.8s ease-in-out infinite;height:10px;border-radius:5px}.sliderLoading_default:after{bottom:-20px;width:35px;background:#F5AB35}.sliderLoading_default:before{top:-20px;left:10px;width:40px;background:#EF4836}@keyframes sliderLoadingDefaul{0%{transform:translate(40px)}50%{transform:translate(-30px)}to{transform:translate(40px)}}.sliderLoading_large{width:70px;height:14px;margin-bottom:14px;background:#3498DB;border-radius:7px;animation:sliderLoadingLarge 1.8s ease-in-out infinite}.sliderLoading_large:after,.sliderLoading_large:before{position:absolute;display:block;content:\"\";animation:sliderLoadingLarge 1.8s ease-in-out infinite;height:14px;border-radius:7px}.sliderLoading_large:after{bottom:-28px;width:49px;background:#F5AB35}.sliderLoading_large:before{top:-28px;left:14px;width:56px;background:#EF4836}@keyframes sliderLoadingLarge{0%{transform:translate(56px)}50%{transform:translate(-42px)}to{transform:translate(56px)}}.containerFilling_mini{position:relative;width:16px;height:16px;border:1.2px solid #3cefff;overflow:hidden;animation:containerFillingSpin 3s ease infinite}.containerFilling_mini:before{content:\"\";position:absolute;width:16px;height:16px;background-color:#29ffffbf;transform-origin:center bottom;transform:scaleY(1);animation:containerFillingFill 3s linear infinite}.containerFilling_small{position:relative;width:32px;height:32px;border:2.4px solid #3cefff;overflow:hidden;animation:containerFillingSpin 3s ease infinite}.containerFilling_small:before{content:\"\";position:absolute;width:32px;height:32px;background-color:#29ffffbf;transform-origin:center bottom;transform:scaleY(1);animation:containerFillingFill 3s linear infinite}.containerFilling_default{position:relative;width:48px;height:48px;border:3.6px solid #3cefff;overflow:hidden;animation:containerFillingSpin 3s ease infinite}.containerFilling_default:before{content:\"\";position:absolute;width:48px;height:48px;background-color:#29ffffbf;transform-origin:center bottom;transform:scaleY(1);animation:containerFillingFill 3s linear infinite}.containerFilling_large{position:relative;width:80px;height:80px;border:6px solid #3cefff;overflow:hidden;animation:containerFillingSpin 3s ease infinite}.containerFilling_large:before{content:\"\";position:absolute;width:80px;height:80px;background-color:#29ffffbf;transform-origin:center bottom;transform:scaleY(1);animation:containerFillingFill 3s linear infinite}@keyframes containerFillingSpin{50%,to{transform:rotate(360deg)}}@keyframes containerFillingFill{25%,50%{transform:scaleY(0)}to{transform:scaleY(1)}}.blockJump_mini{display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-between;width:16px;margin-bottom:2px}.blockJump_mini span{display:block;width:2.4px;height:8px;background-color:#3cefff}.blockJump_mini span:nth-of-type(1){animation:blockJumpGrow 1s -.45s ease-in-out infinite}.blockJump_mini span:nth-of-type(2){animation:blockJumpGrow 1s -.3s ease-in-out infinite}.blockJump_mini span:nth-of-type(3){animation:blockJumpGrow 1s -.15s ease-in-out infinite}.blockJump_mini span:nth-of-type(4){animation:blockJumpGrow 1s ease-in-out infinite}.blockJump_small{display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-between;width:32px;margin-bottom:4px}.blockJump_small span{display:block;width:4.8px;height:16px;background-color:#3cefff}.blockJump_small span:nth-of-type(1){animation:blockJumpGrow 1s -.45s ease-in-out infinite}.blockJump_small span:nth-of-type(2){animation:blockJumpGrow 1s -.3s ease-in-out infinite}.blockJump_small span:nth-of-type(3){animation:blockJumpGrow 1s -.15s ease-in-out infinite}.blockJump_small span:nth-of-type(4){animation:blockJumpGrow 1s ease-in-out infinite}.blockJump_default{display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-between;width:48px;margin-bottom:6px}.blockJump_default span{display:block;width:7.2px;height:24px;background-color:#3cefff}.blockJump_default span:nth-of-type(1){animation:blockJumpGrow 1s -.45s ease-in-out infinite}.blockJump_default span:nth-of-type(2){animation:blockJumpGrow 1s -.3s ease-in-out infinite}.blockJump_default span:nth-of-type(3){animation:blockJumpGrow 1s -.15s ease-in-out infinite}.blockJump_default span:nth-of-type(4){animation:blockJumpGrow 1s ease-in-out infinite}.blockJump_large{display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-between;width:80px;margin-bottom:10px}.blockJump_large span{display:block;width:12px;height:40px;background-color:#3cefff}.blockJump_large span:nth-of-type(1){animation:blockJumpGrow 1s -.45s ease-in-out infinite}.blockJump_large span:nth-of-type(2){animation:blockJumpGrow 1s -.3s ease-in-out infinite}.blockJump_large span:nth-of-type(3){animation:blockJumpGrow 1s -.15s ease-in-out infinite}.blockJump_large span:nth-of-type(4){animation:blockJumpGrow 1s ease-in-out infinite}@keyframes blockJumpGrow{0%,to{transform:scaleY(1)}50%{transform:scaleY(2)}}.spin11_mini{width:20px;aspect-ratio:1;border-radius:50%;border:3.2px solid;border-color:#ffffff #ffffff00;mix-blend-mode:difference;animation:spin11 1s infinite}.spin11_small{width:30px;aspect-ratio:1;border-radius:50%;border:4.8px solid;border-color:#ffffff #ffffff00;mix-blend-mode:difference;animation:spin11 1s infinite}.spin11_default{width:50px;aspect-ratio:1;border-radius:50%;border:8px solid;border-color:#ffffff #ffffff00;mix-blend-mode:difference;animation:spin11 1s infinite}.spin11_large{width:65px;aspect-ratio:1;border-radius:50%;border:10.4px solid;border-color:#ffffff #ffffff00;mix-blend-mode:difference;animation:spin11 1s infinite}@keyframes spin11{to{transform:rotate(.5turn)}}.spin12_mini{width:20px;aspect-ratio:1;border-radius:50%;border:3.2px solid lightblue;border-right-color:orange;animation:spin12 1s infinite linear}.spin12_small{width:30px;aspect-ratio:1;border-radius:50%;border:4.8px solid lightblue;border-right-color:orange;animation:spin12 1s infinite linear}.spin12_default{width:50px;aspect-ratio:1;border-radius:50%;border:8px solid lightblue;border-right-color:orange;animation:spin12 1s infinite linear}.spin12_large{width:65px;aspect-ratio:1;border-radius:50%;border:10.4px solid lightblue;border-right-color:orange;animation:spin12 1s infinite linear}@keyframes spin12{to{transform:rotate(1turn)}}.spin13_mini{width:20px;padding:3.2px;aspect-ratio:1;border-radius:50%;background:#25b09b;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:spin13 1s infinite linear}.spin13_small{width:30px;padding:4.8px;aspect-ratio:1;border-radius:50%;background:#25b09b;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0)