.preloader{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:var(--white-box-bg,#fff);z-index:99999999}.preloader>h1{position:absolute;font-family:"Open Sans";font-weight:600;font-size:12px;text-transform:uppercase;left:50%;top:58%;color:var(--system_primery_gredient1);margin-left:-20px}.body{position:absolute;top:50%;margin-left:-50px;left:50%;animation:speeder .4s linear infinite}.body>span{height:5px;width:35px;background:var(--system_primery_gredient1);position:absolute;top:-19px;left:60px;border-radius:2px 10px 1px 0}.preloader .base span{position:absolute;width:0;height:0;border-top:6px solid transparent;border-right:100px solid var(--system_primery_gredient1);border-bottom:6px solid transparent}.preloader .base span:before{content:"";height:22px;width:22px;border-radius:50%;background:var(--system_primery_gredient1);position:absolute;right:-110px;top:-16px}.preloader .base span:after{content:"";position:absolute;width:0;height:0;border-top:0 solid transparent;border-right:55px solid var(--system_primery_gredient1);border-bottom:16px solid transparent;top:-16px;right:-98px}.face{position:absolute;height:12px;width:20px;background:var(--system_primery_gredient1);border-radius:20px 20px 0 0;transform:rotate(-40deg);right:-125px;top:-15px}.face:after{content:"";height:12px;width:12px;background:var(--system_primery_gredient1);right:4px;top:7px;position:absolute;transform:rotate(40deg);transform-origin:50% 50%;border-radius:0 0 0 2px}.body > span > span:nth-child(1),
.body > span > span:nth-child(2),
.body > span > span:nth-child(3),
.body > span > span:nth-child(4) {width:30px;height:1px;background:var(--system_primery_gredient1);position:absolute;animation:fazer1 .2s linear infinite}.body > span > span:nth-child(2) {top:3px;animation:fazer2 .4s linear infinite}.body > span > span:nth-child(3) {top:1px;animation:fazer3 .4s linear infinite;animation-delay:-1s}.body > span > span:nth-child(4) {top:4px;animation:fazer4 1s linear infinite;animation-delay:-1s}@keyframes fazer1 {
    0% {
        left: 0;
    }
    100% {
        left: -80px;
        opacity: 0;
    }
}@keyframes fazer2 {
    0% {
        left: 0;
    }
    100% {
        left: -100px;
        opacity: 0;
    }
}@keyframes fazer3 {
    0% {
        left: 0;
    }
    100% {
        left: -50px;
        opacity: 0;
    }
}@keyframes fazer4 {
    0% {
        left: 0;
    }
    100% {
        left: -150px;
        opacity: 0;
    }
}@keyframes speeder {
    0% {
        transform: translate(2px, 1px) rotate(0deg);
    }
    10% {
        transform: translate(-1px, -3px) rotate(-1deg);
    }
    20% {
        transform: translate(-2px, 0px) rotate(1deg);
    }
    30% {
        transform: translate(1px, 2px) rotate(0deg);
    }
    40% {
        transform: translate(1px, -1px) rotate(1deg);
    }
    50% {
        transform: translate(-1px, 3px) rotate(-1deg);
    }
    60% {
        transform: translate(-1px, 1px) rotate(0deg);
    }
    70% {
        transform: translate(3px, 1px) rotate(-1deg);
    }
    80% {
        transform: translate(-2px, -1px) rotate(1deg);
    }
    90% {
        transform: translate(2px, 1px) rotate(0deg);
    }
    100% {
        transform: translate(1px, -2px) rotate(-1deg);
    }
}.longfazers{position:absolute;width:100%;height:100%}.longfazers span{position:absolute;height:2px;width:20%;background:var(--system_primery_gredient1)}.longfazers span:nth-child(1) {top:20%;animation:lf .6s linear infinite;animation-delay:-5s}.longfazers span:nth-child(2) {top:40%;animation:lf2 .8s linear infinite;animation-delay:-1s}.longfazers span:nth-child(3) {top:60%;animation:lf3 .6s linear infinite}.longfazers span:nth-child(4) {top:80%;animation:lf4 .5s linear infinite;animation-delay:-3s}@keyframes lf {
    0% {
        left: 200%;
    }
    100% {
        left: -200%;
        opacity: 0;
    }
}@keyframes lf2 {
    0% {
        left: 200%;
    }
    100% {
        left: -200%;
        opacity: 0;
    }
}@keyframes lf3 {
    0% {
        left: 200%;
    }
    100% {
        left: -100%;
        opacity: 0;
    }
}@keyframes lf4 {
    0% {
        left: 200%;
    }
    100% {
        left: -100%;
        opacity: 0;
    }
}.circle{position:relative;width:100px;height:100px;border-radius:50%;animation:rotate 2.5s linear infinite}.circle1{box-shadow:0 5px 5px 3px #0496ff , 0 -5px 5px 3px red , -5px 0 5px 3px #a1ff0a , 5px 0 5px 3px #f8ffe5}@keyframes rotate {
    to {
        transform: rotate(360deg);
    }
}.circle2{box-shadow:0 5px 5px 3px #0496ff}.circle3{position:absolute;border-radius:50%}.c31{border-left:5px solid #ffb703}.c32{border-right:5px solid #d00000}.circle4{position:absolute;border-radius:50%}.c41{border-left:5px solid #3a86ff}.c42{border-right:5px solid #ff006e}.c43{border-top:5px solid #fb5607}.c44{border-bottom:5px solid #80ffdb}.circle5{position:absolute;animation:color5 1s linear infinite , rotate 2.5s linear infinite;border-left:5px solid transparent;border-right:5px solid transparent}@keyframes color5 {
    0% {
        border: 5px solid #fff;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }
    25% {
        border: 5px solid #ffd166;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }
    50% {
        border: 5px solid #06d6a0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }
    75% {
        border: 5px solid #118ab2;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }
    100% {
        border: 5px solid #fb5607;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }
}.circle6{position:absolute;border-radius:50%}.c61{border-left:15px solid #3a86ff;background:#000;border-right:15px solid #000;border-top:15px solid #000;border-bottom:15px solid #000}.c62{border-right:15px solid #ff006e;border-top:15px solid transparent;border-bottom:15px solid transparent;border-left:15px solid transparent}.c63{border-right:15px solid transparent;border-top:15px solid #fb5607;border-bottom:15px solid transparent;border-left:15px solid transparent}.c64{border-right:15px solid transparent;border-left:15px solid transparent;border-top:15px solid transparent;border-bottom:15px solid #80ffdb}.c65{position:absolute;animation:colorUp 2s ease infinite}@keyframes colorUp {
    0% {
        width: 0px;
        height: 0px;
        background: #fff;
    }
    15% {
        width: 50px;
        height: 50px;
        background: #ff006e;
    }
    25% {
        width: 0px;
        height: 0px;
        background: #fff;
    }
    40% {
        width: 50px;
        height: 50px;
        background: #fb5607;
    }
    50% {
        width: 0px;
        height: 0px;
        background: #fff;
    }
    65% {
        width: 50px;
        height: 50px;
        background: #80ffdb;
    }
    75% {
        width: 0px;
        height: 0px;
        background: #fff;
    }
    90% {
        width: 50px;
        height: 50px;
        background: #3a86ff;
    }
}.circle7{position:absolute;border-radius:50%}.c71{border:5px solid #3a86ff;border-top:5px solid transparent;border-bottom:5px solid transparent}.c72{width:80px;height:80px;border:5px solid #ff006e;border-top:5px solid transparent;border-bottom:5px solid transparent}.c73{width:60px;height:60px;border:5px solid #fb5607;border-bottom:5px solid transparent;border-top:5px solid transparent}.c74{width:40px;height:40px;border:5px solid #80ffdb;border-bottom:5px solid transparent;border-top:5px solid transparent}.c75{width:20px;height:20px;border:5px solid #ffbe0b}.circle8{position:absolute;border-radius:50%}.c81{border:5px solid #3a86ff;border-top:5px solid transparent;border-bottom:5px solid transparent;animation:2s ease rotate2 infinite}.c82{width:80px;height:80px;border:5px solid #ff006e;border-top:5px solid transparent;border-bottom:5px solid transparent;animation:2s 200ms ease rotate2 infinite}.c83{width:60px;height:60px;border:5px solid #fb5607;border-bottom:5px solid transparent;border-top:5px solid transparent;animation:2s 500ms ease rotate2 infinite}.c84{width:40px;height:40px;border:5px solid #80ffdb;border-bottom:5px solid transparent;border-top:5px solid transparent;animation:2s 1s ease rotate2 infinite}.c85{width:20px;height:20px;border:5px solid #ffbe0b}@keyframes rotate2 {
    0%,
    100% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(360deg);
    }
}.circle9{position:absolute;border-radius:50%}.c91{border:5px solid #3a86ff;border-top:5px solid transparent;border-bottom:5px solid transparent}.c92{width:80px;height:80px;border:5px solid #ff006e;border-left:5px solid transparent;border-right:5px solid transparent;animation:rotate2 2.5s linear infinite}.c93{width:60px;height:60px;border:5px solid #fb5607;border-bottom:5px solid transparent;border-top:5px solid transparent}.c94{width:40px;height:40px;border:5px solid #80ffdb;border-left:5px solid transparent;border-right:5px solid transparent;animation:rotate2 2.5s linear infinite}.c95{width:20px;height:20px;background:#ffbe0b}@keyframes rotate2 {
    0%,
    100% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(360deg);
    }
}.circle10{position:absolute;border-radius:50%;border:5px solid transparent;border-left:5px solid #3a86ff}.c102{width:80px;height:80px;border-left:5px solid #ff006e}.c103{width:60px;height:60px;border-left:5px solid #fb5607}.c104{width:40px;height:40px;border-left:5px solid #80ffdb}.c105{width:20px;height:20px;border-left:5px solid #ffbe0b}.circle11{position:absolute;border-radius:50%;animation-direction:reverse;border:5px solid #3a86ff;border-left:5px solid transparent}.c112{width:80px;height:80px;border:5px solid #ff006e;border-left:5px solid transparent}.c113{width:60px;height:60px;border:5px solid #fb5607;border-left:5px solid transparent}.c114{width:40px;height:40px;border:5px solid #80ffdb;border-left:5px solid transparent}.c115{width:20px;height:20px;border:5px solid #ffbe0b;border-left:5px solid transparent}.circle12{position:absolute;border-radius:50%}.c121{border:5px solid #3a86ff;border-top:5px solid transparent;border-bottom:5px solid transparent}.c122{width:80px;height:80px;border:5px solid #ff006e;border-left:5px solid transparent;border-right:5px solid transparent}.c123{width:60px;height:60px;border:5px solid #fb5607;border-bottom:5px solid transparent;border-top:5px solid transparent}.c124{width:40px;height:40px;border:5px solid #80ffdb;border-left:5px solid transparent;border-right:5px solid transparent}.c125{width:20px;height:20px;background:#ffbe0b}.circle12{position:absolute;border-radius:50%}.c121{border:5px solid #3a86ff;border-top:5px solid transparent;border-bottom:5px solid transparent}.c122{width:80px;height:80px;border:5px solid #ff006e;border-left:5px solid transparent;border-right:5px solid transparent}.c123{width:60px;height:60px;border:5px solid #fb5607;border-bottom:5px solid transparent;border-top:5px solid transparent}.c124{width:40px;height:40px;border:5px solid #80ffdb;border-left:5px solid transparent;border-right:5px solid transparent}.c125{width:20px;height:20px;background:#ffbe0b}.circle13{position:absolute;border-radius:50%;animation:fillUp 500ms cubic-bezier(0,1.18,1,-.23) infinite alternate , rotateFast 1s linear infinite}.c131{border-top:5px solid #ffbe0b}@keyframes fillUp {
    0% {
        border-bottom: 10px solid transparent;
        border-left: 10px solid transparent;
        border-top: 10px solid transparent;
        border-right: 10px solid transparent;
    }
    25% {
        border-bottom: 10px solid #ffbe0b;
        border-left: 10px solid transparent;
        border-top: 10px solid transparent;
        border-right: 10px solid transparent;
    }
    50% {
        border-bottom: 10px solid #ffbe0b;
        border-left: 10px solid #fb5607;
        border-top: 10px solid transparent;
        border-right: 10px solid transparent;
    }
    75% {
        border-bottom: 10px solid #ffbe0b;
        border-left: 10px solid #fb5607;
        border-top: 10px solid #ff006e;
        border-right: 10px solid transparent;
    }
    100% {
        border-bottom: 10px solid #ffbe0b;
        border-left: 10px solid #fb5607;
        border-top: 10px solid #ff006e;
        border-right: 10px solid #00f5d4;
    }
}@keyframes rotateFast {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}.wrapper{position:relative}.circle14{margin:50px auto;width:100px;height:100px;position:absolute;border-radius:50%;background: linear-gradient(
        to right,
        #ffbe0b 10%,
        rgba(255, 255, 255, 0) 42%
    );animation:effect14 1.4s infinite linear;transform:translateZ(0)}.circle14:before,.circle14:after{width:50%;height:50%;content:"";background:#ffbe0b;border-radius:100% 0 0 0;position:absolute}.circle14:before{top:0;left:0}.circle14:after{background:#000;width:75%;height:75%;border-radius:50%;margin:auto;bottom:0;right:0;top:0;left:0}@keyframes effect14 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
}.circle15{position:relative;width:100px;height:100px;transform:translateZ(0);border-radius:50%;box-shadow:inset 0 0 0 25px #ff006e}.circle15:before,.circle15:after{position:absolute;border-radius:50%;content:"";width:50%;height:100%}.circle15:before{top:0;left:0;background:#000;border-radius:100px 0 0 100px;transform-origin:center right;animation:effect15 2s infinite ease 1.5s}.circle15:after{top:0;right:0;background:#000;border-radius:0 100px 100px 0;transform-origin:center left;animation:effect15 2s infinite ease}@keyframes effect15 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}.dot{width:50px;height:50px;border-radius:50%;margin-right:10px}.dot:last-child{margin-right:0}.dot1{width:30px;height:30px;background-color:#000}.d11{animation:diagonalSlice 2s ease infinite}.d12{animation:diagonalSlice 2s 300ms ease infinite}.d13{animation:diagonalSlice 2s 600ms ease infinite}@keyframes diagonalSlice {
    0%,
    100% {
        transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
        opacity: 0;
    }
    35% {
        transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg) translateX(100px);
        opacity: 1;
    }
    70% {
        transform: translateZ(0) rotate3d(1, 1, 0, 0);
    }
}.wrapper2{perspective:1000px}.dot2{width:30px;height:30px;background-color:#fff}.d21{animation:rollInOut 3s 500ms ease infinite}.d22{animation:rollInOut 3s 1s ease infinite}.d23{animation:rollInOut 3s 1.5s ease infinite}@keyframes rollInOut {
    0% {
        transform: translateX(-100px) scale(0);
    }
    30%,
    70% {
        transform: translateX(0) scale(1);
        background: #e76f51;
    }
    100% {
        transform: translateX(100px) scale(0);
    }
}.wrapper3{perspective:1000px;position:relative}.dot3{position:absolute;width:50px;height:50px;margin:0;background-color:#fcbf49;transform-origin:top right;animation:rotate-1 3s ease infinite}.dot31{animation-direction:reverse;background:#d62828;width:40px;height:40px}@keyframes rotate-1 {
    0%,
    10%,
    90%,
    100% {
        transform: rotate(0);
    }
    50% {
        transform: rotate(520deg) scale(0);
    }
}.wrapper4{position:relative}.dot4{margin:0;width:50px;height:50px;background-color:#fcbf49;transform-origin:top right;animation:dotLeft 3s ease infinite}.dot41{animation:dotRight 3s ease infinite;background:#6930c3}@keyframes dotLeft {
    0%,
    100% {
        transform: rotateY(0);
        transform-origin: left;
    }
    50% {
        transform: rotateY(-70deg);
        transform-origin: left;
    }
}@keyframes dotRight {
    0%,
    100% {
        transform: rotateY(-70deg);
        transform-origin: right;
    }
    50% {
        transform: rotateY(0deg);
        transform-origin: right;
    }
}.wrapper5{width:100px;position:relative}.dot5{width:20px;height:20px;margin-right:20px;background-color:#fcbf49;animation:dotMove 400ms linear infinite}.dot50{position:absolute;left:0;animation:dotScale 400ms linear infinite}.dot53{right:0;animation:dotScale 400ms linear infinite reverse}@keyframes dotScale {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}@keyframes dotMove {
    0% {
        transform: translateX(0px);
    }
    100% {
        transform: translateX(40px);
    }
}.wrapper6{position:relative}.dot6{margin:0;position:absolute}.dot60{width:100px;height:100px;background-color:#fcbf49;z-index:1;animation:expand 3s ease infinite}.dot61{width:70px;height:70px;background:#f77f00;z-index:5;animation:expand 3s 300ms ease infinite}.dot62{width:40px;height:40px;background:#d62828;z-index:10;animation:expand 3s 600ms ease infinite}@keyframes expand {
    0%,
    80%,
    100% {
        transform: scale(0);
    }
    40% {
        transform: scale(1);
    }
}.wrapper7{position:relative}.dot7{margin:0;position:absolute}.dot70{width:100px;height:100px;background-color:#ffc300;z-index:1}.dot71{width:90px;height:90px;background:#fff;z-index:5;animation:expand7 3s linear infinite}.dot72{width:60px;height:60px;background:#ffc300;z-index:10;animation:expand71 3s 500ms ease infinite}.dot73{width:40px;height:40px;background:#fff;z-index:15;animation:expand71 3s 200ms ease infinite}@keyframes expand7 {
    0%,
    100% {
        transform: scale(0.6);
    }
    50% {
        transform: scale(1);
    }
}@keyframes expand71 {
    0%,
    100% {
        transform: scale(0.4);
    }
    50% {
        transform: scale(1);
    }
}.wrapper8{width:200px;height:100px;position:relative;perspective:20px}.dot8{position:absolute;top:0;left:0;width:10px;height:10px;background-color:#ff006e;animation:moveDot 2s ease infinite}.dot81{background-color:#ffd60a;animation:moveDot 2s 200ms ease infinite}.dot82{background-color:#8338ec;animation:moveDot 2s 400ms ease infinite}@keyframes moveDot {
    0%,
    100% {
        left: 0px;
        top: 0;
    }

    30% {
        top: 100%;
        left: calc(50% - 10px);
    }

    60% {
        top: 0;
        left: calc(100% - 10px);
    }
}.wrapper9{width:200px;height:200px;position:relative;perspective:20px}.dot9{width:30px;height:30px;background-color:#ff006e;animation:effect9 2s cubic-bezier(.215,.61,.355,1) infinite}.dot91{background-color:#8338ec;animation:effect9 2s 400ms cubic-bezier(.215,.61,.355,1) infinite}.dot92{background-color:#ffbe0b;animation:effect9 2s 600ms cubic-bezier(.215,.61,.355,1) infinite}.dot93{background-color:#3a86ff;animation:effect9 2s 800ms cubic-bezier(.215,.61,.355,1) infinite}@keyframes effect9 {
    0%,
    100% {
        opacity: 0;
        transform: translate3d(0, 3000px, 0);
    }
    60% {
        opacity: 1;
        transform: translate3d(0, -20px, 0);
    }
    75% {
        transform: translate3d(0, 10px, 0);
    }
    90% {
        transform: translate3d(0, -5px, 0);
    }
}