.circular{
        height:20px;
        width: 20px;
        position: relative;
      }
      .circular .inner{
        position: absolute;
        z-index: 6;
        top: 50%;
        left: 50%;
        height: 16px;
        width: 16px;
        margin: -8px 0 0 -8px;
        background: white;
        border-radius: 100%;
       
      }
      .circular .bar{
        position: absolute;
        height: 100%;
        width: 100%;
        background: #D3DCE2;
        -webkit-border-radius: 100%;
        clip: rect(0px, 20px, 20px, 10px);
      }
      .slick-active .circular .bar{
        background: white;
      }
      .circle .bar .process{
        position: absolute;
        height: 100%;
        width: 100%;
        -webkit-border-radius: 100%;
        clip: rect(0px, 10px, 20px, 0px);
        background: #6345DC;
      }
      .slick-active .circle .left .process{
        z-index:1;
        animation: left 4.5s linear both;
      }
      .slick-not-active .circle .left .process{
        animation: none!important;
      }
      @keyframes left{
        100%{
          transform: rotate(180deg);
        }
      }
      .circle .right {
        transform: rotate(180deg);
        z-index:3;
       
      }
      .slick-active .circle .right .process{
        animation: right 4.5s linear both;
        animation-delay:4.5s;
      }
      .slick-not-active .circle .right .process{
        animation: none!important;
      }
      @keyframes right{
        100%{
          transform: rotate(180deg);
        }
      }


.background-black {
                width: 100%;
                position: relative;
                overflow: hidden;
                background: #39394B;
        }

        .background-white {
                background: #F5F5F5;
                width: 100%;
                position: relative;
                overflow: hidden;
        }

        .background-red {
                background: #D92752;
                width: 100%;
                position: relative;
                overflow: hidden;
        }

        .background-violet {
                background: #6345DC;
                width: 100%;
                position: relative;
                overflow: hidden;
        }

        .background-black span {
                width: 20vmin;
                height: 20vmin;
                border-radius: 20vmin;
                -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
                position: absolute;
                -webkit-animation-name: move;
                animation-name: move;
                -webkit-animation-duration: 100s;
                animation-duration: 100s;
                -webkit-animation-timing-function: linear;
                animation-timing-function: linear;
                -webkit-animation-iteration-count: infinite;
                animation-iteration-count: infinite;
        }

        .background-black span:nth-child(1) {
                color: #D92752;
                opacity: 0.374;
                top: 60%;
                left: 33%;
                -webkit-animation-duration: 83.8s;
                animation-duration: 83.8s;
                -webkit-animation-delay: -56.2s;
                animation-delay: -56.2s;
                -webkit-transform-origin: 18vw -10vh;
                transform-origin: 18vw -10vh;
                -webkit-box-shadow: 40vmin 0 10.27255vmin currentColor;
                box-shadow: 40vmin 0 10.27255vmin currentColor;
        }

        .background-black span:nth-child(2) {
                color: #D92752;
                opacity: 0.422;
                top: 2%;
                left: 57%;
                -webkit-animation-duration: 81.3s;
                animation-duration: 81.3s;
                -webkit-animation-delay: -97.4s;
                animation-delay: -97.4s;
                -webkit-transform-origin: -19vw 10vh;
                transform-origin: -19vw 10vh;
                -webkit-box-shadow: -40vmin 0 9.45732vmin currentColor;
                box-shadow: -40vmin 0 9.45732vmin currentColor;
        }

        .background-black span:nth-child(3) {
                color: #9278FC;
                opacity: 0.524;
                top: 94%;
                left: 59%;
                -webkit-animation-duration: 20.2s;
                animation-duration: 20.2s;
                -webkit-animation-delay: -29.6s;
                animation-delay: -29.6s;
                -webkit-transform-origin: -5vw 11vh;
                transform-origin: -5vw 11vh;
                -webkit-box-shadow: 40vmin 0 7.52528vmin currentColor;
                box-shadow: 40vmin 0 7.52528vmin currentColor;
        }

        .background-black span:nth-child(4) {
                color: #6345DC;
                opacity: 0.428;
                top: 91%;
                left: 1%;
                -webkit-animation-duration: 37.8s;
                animation-duration: 37.8s;
                -webkit-animation-delay: -109.3s;
                animation-delay: -109.3s;
                -webkit-transform-origin: 3vw 6vh;
                transform-origin: 3vw 6vh;
                -webkit-box-shadow: -40vmin 0 8.79071vmin currentColor;
                box-shadow: -40vmin 0 8.79071vmin currentColor;
        }

        .background-black span:nth-child(5) {
                color: #6345DC;
                opacity: 0.788;
                top: 44%;
                left: 19%;
                -webkit-animation-duration: 98s;
                animation-duration: 98s;
                -webkit-animation-delay: -88.9s;
                animation-delay: -88.9s;
                -webkit-transform-origin: -11vw 17vh;
                transform-origin: -11vw 17vh;
                -webkit-box-shadow: -40vmin 0 9.78333vmin currentColor;
                box-shadow: -40vmin 0 9.78333vmin currentColor;
        }

        .background-black span:nth-child(6) {
                color: #9278FC;
                opacity: 0.728;
                top: 40%;
                left: 95%;
                -webkit-animation-duration: 41.3s;
                animation-duration: 41.3s;
                -webkit-animation-delay: -48.2s;
                animation-delay: -48.2s;
                -webkit-transform-origin: 25vw -14vh;
                transform-origin: 25vw -14vh;
                -webkit-box-shadow: 40vmin 0 14.36158vmin currentColor;
                box-shadow: 40vmin 0 14.36158vmin currentColor;
        }

        .background-black span:nth-child(7) {
                color: #9278FC;
                opacity: 0.356;
                top: 52%;
                left: 21%;
                -webkit-animation-duration: 16.1s;
                animation-duration: 16.1s;
                -webkit-animation-delay: -41.1s;
                animation-delay: -41.1s;
                -webkit-transform-origin: -10vw 0vh;
                transform-origin: -10vw 0vh;
                -webkit-box-shadow: -40vmin 0 11.32408vmin currentColor;
                box-shadow: -40vmin 0 11.32408vmin currentColor;
        }

        .background-black span:nth-child(8) {
                color: #FD4B75;
                opacity: 0.464;
                top: 42%;
                left: 22%;
                -webkit-animation-duration: 97s;
                animation-duration: 97s;
                -webkit-animation-delay: -55.1s;
                animation-delay: -55.1s;
                -webkit-transform-origin: -13vw -17vh;
                transform-origin: -13vw -17vh;
                -webkit-box-shadow: 40vmin 0 14.02743vmin currentColor;
                box-shadow: 40vmin 0 14.02743vmin currentColor;
        }

        .background-black span:nth-child(9) {
                color: #6345DC;
                opacity: 0.5;
                top: 33%;
                left: 8%;
                -webkit-animation-duration: 91s;
                animation-duration: 91s;
                -webkit-animation-delay: -25.2s;
                animation-delay: -25.2s;
                -webkit-transform-origin: 22vw 5vh;
                transform-origin: 22vw 5vh;
                -webkit-box-shadow: -40vmin 0 11.97448vmin currentColor;
                box-shadow: -40vmin 0 11.97448vmin currentColor;
        }

        .background-black span:nth-child(10) {
                color: #9278FC;
                opacity: 0.53;
                top: 15%;
                left: 74%;
                -webkit-animation-duration: 36.8s;
                animation-duration: 36.8s;
                -webkit-animation-delay: -3.3s;
                animation-delay: -3.3s;
                -webkit-transform-origin: -12vw -5vh;
                transform-origin: -12vw -5vh;
                -webkit-box-shadow: 40vmin 0 9.14744vmin currentColor;
                box-shadow: 40vmin 0 9.14744vmin currentColor;
        }

        .background-black span:nth-child(11) {
                color: #D92752;
                opacity: 0.746;
                top: 29%;
                left: 55%;
                -webkit-animation-duration: 23.6s;
                animation-duration: 23.6s;
                -webkit-animation-delay: -48.3s;
                animation-delay: -48.3s;
                -webkit-transform-origin: 22vw -24vh;
                transform-origin: 22vw -24vh;
                -webkit-box-shadow: 40vmin 0 8.44287vmin currentColor;
                box-shadow: 40vmin 0 8.44287vmin currentColor;
        }

        .background-black span:nth-child(12) {
                color: #FD4B75;
                opacity: 0.326;
                top: 2%;
                left: 28%;
                -webkit-animation-duration: 36s;
                animation-duration: 36s;
                -webkit-animation-delay: -37s;
                animation-delay: -37s;
                -webkit-transform-origin: 13vw 0vh;
                transform-origin: 13vw 0vh;
                -webkit-box-shadow: 40vmin 0 7.74076vmin currentColor;
                box-shadow: 40vmin 0 7.74076vmin currentColor;
        }

        .background-black span:nth-child(13) {
                color: #9278FC;
                opacity: 0.224;
                top: 80%;
                left: 30%;
                -webkit-animation-duration: 83.9s;
                animation-duration: 83.9s;
                -webkit-animation-delay: -33.6s;
                animation-delay: -33.6s;
                -webkit-transform-origin: 19vw -16vh;
                transform-origin: 19vw -16vh;
                -webkit-box-shadow: -40vmin 0 13.60181vmin currentColor;
                box-shadow: -40vmin 0 13.60181vmin currentColor;
        }

        .background-black span:nth-child(14) {
                color: #FD4B75;
                opacity: 0.422;
                top: 67%;
                left: 71%;
                -webkit-animation-duration: 29.4s;
                animation-duration: 29.4s;
                -webkit-animation-delay: -99.4s;
                animation-delay: -99.4s;
                -webkit-transform-origin: -19vw 25vh;
                transform-origin: -19vw 25vh;
                -webkit-box-shadow: 40vmin 0 11.23567vmin currentColor;
                box-shadow: 40vmin 0 11.23567vmin currentColor;
        }

        .background-black span:nth-child(15) {
                color: #FD4B75;
                opacity: 0.536;
                top: 49%;
                left: 15%;
                -webkit-animation-duration: 109.7s;
                animation-duration: 109.7s;
                -webkit-animation-delay: -10.8s;
                animation-delay: -10.8s;
                -webkit-transform-origin: -23vw -6vh;
                transform-origin: -23vw -6vh;
                -webkit-box-shadow: -40vmin 0 13.24604vmin currentColor;
                box-shadow: -40vmin 0 13.24604vmin currentColor;
        }

        .background-black span:nth-child(16) {
                color: #D92752;
                opacity: 0.392;
                top: 84%;
                left: 20%;
                -webkit-animation-duration: 36.7s;
                animation-duration: 36.7s;
                -webkit-animation-delay: -14.4s;
                animation-delay: -14.4s;
                -webkit-transform-origin: 17vw -8vh;
                transform-origin: 17vw -8vh;
                -webkit-box-shadow: -40vmin 0 10.51203vmin currentColor;
                box-shadow: -40vmin 0 10.51203vmin currentColor;
        }

        .background-black span:nth-child(17) {
                color: #D92752;
                opacity: 0.758;
                top: 22%;
                left: 22%;
                -webkit-animation-duration: 55.9s;
                animation-duration: 55.9s;
                -webkit-animation-delay: -57.7s;
                animation-delay: -57.7s;
                -webkit-transform-origin: 13vw 5vh;
                transform-origin: 13vw 5vh;
                -webkit-box-shadow: -40vmin 0 6.94493vmin currentColor;
                box-shadow: -40vmin 0 6.94493vmin currentColor;
        }

        .background-black span:nth-child(18) {
                color: #FD4B75;
                opacity: 0.5;
                top: 25%;
                left: 57%;
                -webkit-animation-duration: 87s;
                animation-duration: 87s;
                -webkit-animation-delay: -82.5s;
                animation-delay: -82.5s;
                -webkit-transform-origin: -5vw 10vh;
                transform-origin: -5vw 10vh;
                -webkit-box-shadow: -40vmin 0 12.33291vmin currentColor;
                box-shadow: -40vmin 0 12.33291vmin currentColor;
        }

        .background-black span:nth-child(19) {
                color: #6345DC;
                opacity: 0.488;
                top: 10%;
                left: 70%;
                -webkit-animation-duration: 11.7s;
                animation-duration: 11.7s;
                -webkit-animation-delay: -85.4s;
                animation-delay: -85.4s;
                -webkit-transform-origin: 10vw -1vh;
                transform-origin: 10vw -1vh;
                -webkit-box-shadow: 40vmin 0 10.26653vmin currentColor;
                box-shadow: 40vmin 0 10.26653vmin currentColor;
        }

        .background-black span:nth-child(20) {
                color: #D92752;
                opacity: 0.368;
                top: 21%;
                left: 45%;
                -webkit-animation-duration: 70.2s;
                animation-duration: 70.2s;
                -webkit-animation-delay: -49.8s;
                animation-delay: -49.8s;
                -webkit-transform-origin: 0vw 18vh;
                transform-origin: 0vw 18vh;
                -webkit-box-shadow: -40vmin 0 5.51951vmin currentColor;
                box-shadow: -40vmin 0 5.51951vmin currentColor;
        }

        @-webkit-keyframes move {
                100% {
                        -webkit-transform: translate3d(0, 0, 1px) rotate(360deg);
                        transform: translate3d(0, 0, 1px) rotate(360deg);
                }
        }

        @keyframes move {
                100% {
                        -webkit-transform: translate3d(0, 0, 1px) rotate(360deg);
                        transform: translate3d(0, 0, 1px) rotate(360deg);
                }
        }

        /*# sourceMappingURL=animation.css.map */


        .background-white span {
                width: 10vmin;
                height: 10vmin;
                border-radius: 10vmin;
                -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
                position: absolute;
                -webkit-animation-name: move;
                animation-name: move;
                -webkit-animation-duration: 100s;
                animation-duration: 100s;
                -webkit-animation-timing-function: linear;
                animation-timing-function: linear;
                -webkit-animation-iteration-count: infinite;
                animation-iteration-count: infinite;
        }

        .background-white span:nth-child(1) {
                color: #FD4B75;
                opacity: 0.72;
                top: 45%;
                left: 44%;
                -webkit-animation-duration: 63.7s;
                animation-duration: 63.7s;
                -webkit-animation-delay: -47.2s;
                animation-delay: -47.2s;
                -webkit-transform-origin: 21vw -22vh;
                transform-origin: 21vw -22vh;
                -webkit-box-shadow: -20vmin 0 7.1882vmin currentColor;
                box-shadow: -20vmin 0 7.1882vmin currentColor;
        }

        .background-white span:nth-child(2) {
                color: #6345DC;
                opacity: 0.405;
                top: 1%;
                left: 14%;
                -webkit-animation-duration: 29.7s;
                animation-duration: 29.7s;
                -webkit-animation-delay: -46s;
                animation-delay: -46s;
                -webkit-transform-origin: 18vw 12vh;
                transform-origin: 18vw 12vh;
                -webkit-box-shadow: -20vmin 0 5.07566vmin currentColor;
                box-shadow: -20vmin 0 5.07566vmin currentColor;
        }

        .background-white span:nth-child(3) {
                color: #9278FC;
                opacity: 0.435;
                top: 50%;
                left: 6%;
                -webkit-animation-duration: 45.9s;
                animation-duration: 45.9s;
                -webkit-animation-delay: -91.8s;
                animation-delay: -91.8s;
                -webkit-transform-origin: -23vw 9vh;
                transform-origin: -23vw 9vh;
                -webkit-box-shadow: -20vmin 0 6.04717vmin currentColor;
                box-shadow: -20vmin 0 6.04717vmin currentColor;
        }

        .background-white span:nth-child(4) {
                color: #FD4B75;
                opacity: 0.735;
                top: 90%;
                left: 2%;
                -webkit-animation-duration: 37.6s;
                animation-duration: 37.6s;
                -webkit-animation-delay: -79.6s;
                animation-delay: -79.6s;
                -webkit-transform-origin: -8vw -1vh;
                transform-origin: -8vw -1vh;
                -webkit-box-shadow: -20vmin 0 5.2657vmin currentColor;
                box-shadow: -20vmin 0 5.2657vmin currentColor;
        }

        .background-white span:nth-child(5) {
                color: #D92752;
                opacity: 0.74;
                top: 93%;
                left: 56%;
                -webkit-animation-duration: 93.8s;
                animation-duration: 93.8s;
                -webkit-animation-delay: -75s;
                animation-delay: -75s;
                -webkit-transform-origin: 25vw 2vh;
                transform-origin: 25vw 2vh;
                -webkit-box-shadow: -20vmin 0 3.13678vmin currentColor;
                box-shadow: -20vmin 0 3.13678vmin currentColor;
        }

        .background-white span:nth-child(6) {
                color: #FD4B75;
                opacity: 0.875;
                top: 59%;
                left: 51%;
                -webkit-animation-duration: 63.9s;
                animation-duration: 63.9s;
                -webkit-animation-delay: -38.7s;
                animation-delay: -38.7s;
                -webkit-transform-origin: -7vw -15vh;
                transform-origin: -7vw -15vh;
                -webkit-box-shadow: 20vmin 0 4.81768vmin currentColor;
                box-shadow: 20vmin 0 4.81768vmin currentColor;
        }

        .background-white span:nth-child(7) {
                color: #FD4B75;
                opacity: 0.735;
                top: 41%;
                left: 3%;
                -webkit-animation-duration: 55.7s;
                animation-duration: 55.7s;
                -webkit-animation-delay: -52.2s;
                animation-delay: -52.2s;
                -webkit-transform-origin: -12vw 11vh;
                transform-origin: -12vw 11vh;
                -webkit-box-shadow: -20vmin 0 6.35084vmin currentColor;
                box-shadow: -20vmin 0 6.35084vmin currentColor;
        }

        .background-white span:nth-child(8) {
                color: #9278FC;
                opacity: 0.615;
                top: 91%;
                left: 67%;
                -webkit-animation-duration: 81s;
                animation-duration: 81s;
                -webkit-animation-delay: -32.4s;
                animation-delay: -32.4s;
                -webkit-transform-origin: -9vw 23vh;
                transform-origin: -9vw 23vh;
                -webkit-box-shadow: -20vmin 0 5.22vmin currentColor;
                box-shadow: -20vmin 0 5.22vmin currentColor;
        }

        .background-white span:nth-child(9) {
                color: #D92752;
                opacity: 0.73;
                top: 51%;
                left: 81%;
                -webkit-animation-duration: 81s;
                animation-duration: 81s;
                -webkit-animation-delay: -63.8s;
                animation-delay: -63.8s;
                -webkit-transform-origin: -20vw -3vh;
                transform-origin: -20vw -3vh;
                -webkit-box-shadow: 20vmin 0 6.46105vmin currentColor;
                box-shadow: 20vmin 0 6.46105vmin currentColor;
        }

        .background-white span:nth-child(10) {
                color: #D92752;
                opacity: 0.65;
                top: 100%;
                left: 56%;
                -webkit-animation-duration: 46.8s;
                animation-duration: 46.8s;
                -webkit-animation-delay: -77.8s;
                animation-delay: -77.8s;
                -webkit-transform-origin: 8vw 6vh;
                transform-origin: 8vw 6vh;
                -webkit-box-shadow: -20vmin 0 3.32736vmin currentColor;
                box-shadow: -20vmin 0 3.32736vmin currentColor;
        }

        .background-white span:nth-child(11) {
                color: #FD4B75;
                opacity: 0.58;
                top: 46%;
                left: 51%;
                -webkit-animation-duration: 54.3s;
                animation-duration: 54.3s;
                -webkit-animation-delay: -63.6s;
                animation-delay: -63.6s;
                -webkit-transform-origin: 5vw -1vh;
                transform-origin: 5vw -1vh;
                -webkit-box-shadow: -20vmin 0 7.27853vmin currentColor;
                box-shadow: -20vmin 0 7.27853vmin currentColor;
        }

        .background-white span:nth-child(12) {
                color: #FD4B75;
                opacity: 0.8;
                top: 34%;
                left: 94%;
                -webkit-animation-duration: 84.1s;
                animation-duration: 84.1s;
                -webkit-animation-delay: -11.3s;
                animation-delay: -11.3s;
                -webkit-transform-origin: 13vw 11vh;
                transform-origin: 13vw 11vh;
                -webkit-box-shadow: 20vmin 0 5.45703vmin currentColor;
                box-shadow: 20vmin 0 5.45703vmin currentColor;
        }

        .background-white span:nth-child(13) {
                color: #FD4B75;
                opacity: 0.88;
                top: 61%;
                left: 44%;
                -webkit-animation-duration: 101.5s;
                animation-duration: 101.5s;
                -webkit-animation-delay: -32.3s;
                animation-delay: -32.3s;
                -webkit-transform-origin: 4vw 10vh;
                transform-origin: 4vw 10vh;
                -webkit-box-shadow: -20vmin 0 5.95069vmin currentColor;
                box-shadow: -20vmin 0 5.95069vmin currentColor;
        }

        .background-white span:nth-child(14) {
                color: #6345DC;
                opacity: 0.69;
                top: 34%;
                left: 12%;
                -webkit-animation-duration: 89.3s;
                animation-duration: 89.3s;
                -webkit-animation-delay: -59s;
                animation-delay: -59s;
                -webkit-transform-origin: -18vw -2vh;
                transform-origin: -18vw -2vh;
                -webkit-box-shadow: 20vmin 0 4.79445vmin currentColor;
                box-shadow: 20vmin 0 4.79445vmin currentColor;
        }

        .background-white span:nth-child(15) {
                color: #D92752;
                opacity: 0.455;
                top: 54%;
                left: 25%;
                -webkit-animation-duration: 79.1s;
                animation-duration: 79.1s;
                -webkit-animation-delay: -54.8s;
                animation-delay: -54.8s;
                -webkit-transform-origin: 16vw 23vh;
                transform-origin: 16vw 23vh;
                -webkit-box-shadow: -20vmin 0 4.62264vmin currentColor;
                box-shadow: -20vmin 0 4.62264vmin currentColor;
        }

        .background-white span:nth-child(16) {
                color: #9278FC;
                opacity: 0.845;
                top: 77%;
                left: 35%;
                -webkit-animation-duration: 59.9s;
                animation-duration: 59.9s;
                -webkit-animation-delay: -47.8s;
                animation-delay: -47.8s;
                -webkit-transform-origin: 25vw -19vh;
                transform-origin: 25vw -19vh;
                -webkit-box-shadow: 20vmin 0 2.71768vmin currentColor;
                box-shadow: 20vmin 0 2.71768vmin currentColor;
        }

        .background-white span:nth-child(17) {
                color: #9278FC;
                opacity: 0.615;
                top: 77%;
                left: 15%;
                -webkit-animation-duration: 66.8s;
                animation-duration: 66.8s;
                -webkit-animation-delay: -56.1s;
                animation-delay: -56.1s;
                -webkit-transform-origin: 19vw 4vh;
                transform-origin: 19vw 4vh;
                -webkit-box-shadow: -20vmin 0 4.54871vmin currentColor;
                box-shadow: -20vmin 0 4.54871vmin currentColor;
        }

        .background-white span:nth-child(18) {
                color: #D92752;
                opacity: 0.725;
                top: 89%;
                left: 43%;
                -webkit-animation-duration: 44s;
                animation-duration: 44s;
                -webkit-animation-delay: -53.7s;
                animation-delay: -53.7s;
                -webkit-transform-origin: 25vw 5vh;
                transform-origin: 25vw 5vh;
                -webkit-box-shadow: 20vmin 0 2.65925vmin currentColor;
                box-shadow: 20vmin 0 2.65925vmin currentColor;
        }

        .background-white span:nth-child(19) {
                color: #9278FC;
                opacity: 0.42;
                top: 57%;
                left: 8%;
                -webkit-animation-duration: 31.3s;
                animation-duration: 31.3s;
                -webkit-animation-delay: -60.8s;
                animation-delay: -60.8s;
                -webkit-transform-origin: 17vw -13vh;
                transform-origin: 17vw -13vh;
                -webkit-box-shadow: -20vmin 0 6.48167vmin currentColor;
                box-shadow: -20vmin 0 6.48167vmin currentColor;
        }

        .background-white span:nth-child(20) {
                color: #FD4B75;
                opacity: 0.805;
                top: 1%;
                left: 51%;
                -webkit-animation-duration: 59.9s;
                animation-duration: 59.9s;
                -webkit-animation-delay: -68.6s;
                animation-delay: -68.6s;
                -webkit-transform-origin: -18vw -23vh;
                transform-origin: -18vw -23vh;
                -webkit-box-shadow: -20vmin 0 2.58672vmin currentColor;
                box-shadow: -20vmin 0 2.58672vmin currentColor;
        }

        @-webkit-keyframes move {
                100% {
                        -webkit-transform: translate3d(0, 0, 1px) rotate(360deg);
                        transform: translate3d(0, 0, 1px) rotate(360deg);
                }
        }

        @keyframes move {
                100% {
                        -webkit-transform: translate3d(0, 0, 1px) rotate(360deg);
                        transform: translate3d(0, 0, 1px) rotate(360deg);
                }
        }

        /*# sourceMappingURL=animation.css.map */


        .background-red span {
                width: 20vmin;
                height: 20vmin;
                border-radius: 20vmin;
                -webkit-backface-visibility: hidden;
                backface-visibility: hidden;
                position: absolute;
                -webkit-animation-name: move;
                animation-name: move;
                -webkit-animation-duration: 100s;
                animation-duration: 100s;
                -webkit-animation-timing-function: linear;
                animation-timing-function: linear;
                -webkit-animation-iteration-count: infinite;
                animation-iteration-count: infinite;
        }

        .background-red span:nth-child(1) {
                color: #FFFFFF;
                opacity: 0.13;
                top: 17%;
                left: 52%;
                -webkit-animation-duration: 101.3s;
                animation-duration: 101.3s;
                -webkit-animation-delay: -14.4s;
                animation-delay: -14.4s;
                -webkit-transform-origin: 23vw -7vh;
                transform-origin: 23vw -7vh;
                -webkit-box-shadow: 40vmin 0 6.24853vmin currentColor;
                box-shadow: 40vmin 0 6.24853vmin currentColor;
        }

        .background-red span:nth-child(2) {
                color: #FFFFFF;
                opacity: 0.12;
                top: 30%;
                left: 72%;
                -webkit-animation-duration: 79.3s;
                animation-duration: 79.3s;
                -webkit-animation-delay: -83.1s;
                animation-delay: -83.1s;
                -webkit-transform-origin: 21vw -20vh;
                transform-origin: 21vw -20vh;
                -webkit-box-shadow: 40vmin 0 9.45476vmin currentColor;
                box-shadow: 40vmin 0 9.45476vmin currentColor;
        }

        .background-red span:nth-child(3) {
                color: #FFFFFF;
                opacity: 0.178;
                top: 25%;
                left: 80%;
                -webkit-animation-duration: 106.4s;
                animation-duration: 106.4s;
                -webkit-animation-delay: -71.2s;
                animation-delay: -71.2s;
                -webkit-transform-origin: 5vw -10vh;
                transform-origin: 5vw -10vh;
                -webkit-box-shadow: 40vmin 0 13.02565vmin currentColor;
                box-shadow: 40vmin 0 13.02565vmin currentColor;
        }

        .background-red span:nth-child(4) {
                color: #FFFFFF;
                opacity: 0.22;
                top: 18%;
                left: 99%;
                -webkit-animation-duration: 65.5s;
                animation-duration: 65.5s;
                -webkit-animation-delay: -53.7s;
                animation-delay: -53.7s;
                -webkit-transform-origin: -12vw -9vh;
                transform-origin: -12vw -9vh;
                -webkit-box-shadow: 40vmin 0 13.13187vmin currentColor;
                box-shadow: 40vmin 0 13.13187vmin currentColor;
        }

        .background-red span:nth-child(5) {
                color: #FFFFFF;
                opacity: 0.34;
                top: 43%;
                left: 89%;
                -webkit-animation-duration: 54.8s;
                animation-duration: 54.8s;
                -webkit-animation-delay: -98.6s;
                animation-delay: -98.6s;
                -webkit-transform-origin: 13vw 7vh;
                transform-origin: 13vw 7vh;
                -webkit-box-shadow: -40vmin 0 8.33546vmin currentColor;
                box-shadow: -40vmin 0 8.33546vmin currentColor;
        }

        .background-red span:nth-child(6) {
                color: #FFFFFF;
                opacity: 0.332;
                top: 1%;
                left: 54%;
                -webkit-animation-duration: 37.8s;
                animation-duration: 37.8s;
                -webkit-animation-delay: -63.6s;
                animation-delay: -63.6s;
                -webkit-transform-origin: -20vw 23vh;
                transform-origin: -20vw 23vh;
                -webkit-box-shadow: 40vmin 0 12.42489vmin currentColor;
                box-shadow: 40vmin 0 12.42489vmin currentColor;
        }

        .background-red span:nth-child(7) {
                color: #FFFFFF;
                opacity: 0.26;
                top: 60%;
                left: 86%;
                -webkit-animation-duration: 74.4s;
                animation-duration: 74.4s;
                -webkit-animation-delay: -87.5s;
                animation-delay: -87.5s;
                -webkit-transform-origin: -21vw -24vh;
                transform-origin: -21vw -24vh;
                -webkit-box-shadow: 40vmin 0 8.23814vmin currentColor;
                box-shadow: 40vmin 0 8.23814vmin currentColor;
        }

        .background-red span:nth-child(8) {
                color: #FFFFFF;
                opacity: 0.238;
                top: 78%;
                left: 35%;
                -webkit-animation-duration: 90.3s;
                animation-duration: 90.3s;
                -webkit-animation-delay: -2.6s;
                animation-delay: -2.6s;
                -webkit-transform-origin: -24vw -17vh;
                transform-origin: -24vw -17vh;
                -webkit-box-shadow: 40vmin 0 10.36558vmin currentColor;
                box-shadow: 40vmin 0 10.36558vmin currentColor;
        }

        .background-red span:nth-child(9) {
                color: #FFFFFF;
                opacity: 0.35;
                top: 28%;
                left: 70%;
                -webkit-animation-duration: 94s;
                animation-duration: 94s;
                -webkit-animation-delay: -67.6s;
                animation-delay: -67.6s;
                -webkit-transform-origin: -5vw 23vh;
                transform-origin: -5vw 23vh;
                -webkit-box-shadow: 40vmin 0 5.21636vmin currentColor;
                box-shadow: 40vmin 0 5.21636vmin currentColor;
        }

        .background-red span:nth-child(10) {
                color: #FFFFFF;
                opacity: 0.388;
                top: 92%;
                left: 54%;
                -webkit-animation-duration: 13.1s;
                animation-duration: 13.1s;
                -webkit-animation-delay: -54.5s;
                animation-delay: -54.5s;
                -webkit-transform-origin: -23vw 14vh;
                transform-origin: -23vw 14vh;
                -webkit-box-shadow: -40vmin 0 10.01266vmin currentColor;
                box-shadow: -40vmin 0 10.01266vmin currentColor;
        }

        .background-red span:nth-child(11) {
                color: #FFFFFF;
                opacity: 0.39;
                top: 82%;
                left: 37%;
                -webkit-animation-duration: 57.9s;
                animation-duration: 57.9s;
                -webkit-animation-delay: -103.3s;
                animation-delay: -103.3s;
                -webkit-transform-origin: 6vw -5vh;
                transform-origin: 6vw -5vh;
                -webkit-box-shadow: -40vmin 0 14.94461vmin currentColor;
                box-shadow: -40vmin 0 14.94461vmin currentColor;
        }

        .background-red span:nth-child(12) {
                color: #FFFFFF;
                opacity: 0.23;
                top: 88%;
                left: 71%;
                -webkit-animation-duration: 93.9s;
                animation-duration: 93.9s;
                -webkit-animation-delay: -72s;
                animation-delay: -72s;
                -webkit-transform-origin: 23vw -22vh;
                transform-origin: 23vw -22vh;
                -webkit-box-shadow: 40vmin 0 10.60543vmin currentColor;
                box-shadow: 40vmin 0 10.60543vmin currentColor;
        }

        .background-red span:nth-child(13) {
                color: #FFFFFF;
                opacity: 0.334;
                top: 62%;
                left: 84%;
                -webkit-animation-duration: 18.4s;
                animation-duration: 18.4s;
                -webkit-animation-delay: -59.4s;
                animation-delay: -59.4s;
                -webkit-transform-origin: 16vw 21vh;
                transform-origin: 16vw 21vh;
                -webkit-box-shadow: -40vmin 0 14.32475vmin currentColor;
                box-shadow: -40vmin 0 14.32475vmin currentColor;
        }

        .background-red span:nth-child(14) {
                color: #FFFFFF;
                opacity: 0.35;
                top: 56%;
                left: 67%;
                -webkit-animation-duration: 105.4s;
                animation-duration: 105.4s;
                -webkit-animation-delay: -27.5s;
                animation-delay: -27.5s;
                -webkit-transform-origin: 13vw 11vh;
                transform-origin: 13vw 11vh;
                -webkit-box-shadow: 40vmin 0 8.68937vmin currentColor;
                box-shadow: 40vmin 0 8.68937vmin currentColor;
        }

        .background-red span:nth-child(15) {
                color: #FFFFFF;
                opacity: 0.312;
                top: 12%;
                left: 37%;
                -webkit-animation-duration: 81.7s;
                animation-duration: 81.7s;
                -webkit-animation-delay: -16.4s;
                animation-delay: -16.4s;
                -webkit-transform-origin: -13vw 4vh;
                transform-origin: -13vw 4vh;
                -webkit-box-shadow: 40vmin 0 12.00524vmin currentColor;
                box-shadow: 40vmin 0 12.00524vmin currentColor;
        }

        .background-red span:nth-child(16) {
                color: #FFFFFF;
                opacity: 0.352;
                top: 53%;
                left: 40%;
                -webkit-animation-duration: 39.9s;
                animation-duration: 39.9s;
                -webkit-animation-delay: -57.1s;
                animation-delay: -57.1s;
                -webkit-transform-origin: 0vw -16vh;
                transform-origin: 0vw -16vh;
                -webkit-box-shadow: -40vmin 0 13.48693vmin currentColor;
                box-shadow: -40vmin 0 13.48693vmin currentColor;
        }

        .background-red span:nth-child(17) {
                color: #FFFFFF;
                opacity: 0.274;
                top: 15%;
                left: 68%;
                -webkit-animation-duration: 99s;
                animation-duration: 99s;
                -webkit-animation-delay: -58.6s;
                animation-delay: -58.6s;
                -webkit-transform-origin: 14vw 1vh;
                transform-origin: 14vw 1vh;
                -webkit-box-shadow: 40vmin 0 12.29199vmin currentColor;
                box-shadow: 40vmin 0 12.29199vmin currentColor;
        }

        .background-red span:nth-child(18) {
                color: #FFFFFF;
                opacity: 0.25;
                top: 59%;
                left: 58%;
                -webkit-animation-duration: 105.6s;
                animation-duration: 105.6s;
                -webkit-animation-delay: -90.5s;
                animation-delay: -90.5s;
                -webkit-transform-origin: -13vw -3vh;
                transform-origin: -13vw -3vh;
                -webkit-box-shadow: -40vmin 0 11.66163vmin currentColor;
                box-shadow: -40vmin 0 11.66163vmin currentColor;
        }

        .background-red span:nth-child(19) {
                color: #FFFFFF;
                opacity: 0.22;
                top: 69%;
                left: 75%;
                -webkit-animation-duration: 65.1s;
                animation-duration: 65.1s;
                -webkit-animation-delay: -80s;
                animation-delay: -80s;
                -webkit-transform-origin: -2vw 21vh;
                transform-origin: -2vw 21vh;
                -webkit-box-shadow: 40vmin 0 10.38618vmin currentColor;
                box-shadow: 40vmin 0 10.38618vmin currentColor;
        }

        .background-red span:nth-child(20) {
                color: #FFFFFF;
                opacity: 0.388;
                top: 56%;
                left: 10%;
                -webkit-animation-duration: 93.8s;
                animation-duration: 93.8s;
                -webkit-animation-delay: -107.7s;
                animation-delay: -107.7s;
                -webkit-transform-origin: 15vw 20vh;
                transform-origin: 15vw 20vh;
                -webkit-box-shadow: -40vmin 0 10.11036vmin currentColor;
                box-shadow: -40vmin 0 10.11036vmin currentColor;
        }

        @-webkit-keyframes move {
                100% {
                        -webkit-transform: translate3d(0, 0, 1px) rotate(360deg);
                        transform: translate3d(0, 0, 1px) rotate(360deg);
                }
        }

        @keyframes move {
                100% {
                        -webkit-transform: translate3d(0, 0, 1px) rotate(360deg);
                        transform: translate3d(0, 0, 1px) rotate(360deg);
                }
        }

        /*# sourceMappingURL=animation.css.map */


        .background-violet span {
                width: 20vmin;
                height: 20vmin;
                border-radius: 20vmin;
                -webkit-backface-visibility: hidden;
                        backface-visibility: hidden;
                position: absolute;
                -webkit-animation-name: move;
                        animation-name: move;
                -webkit-animation-duration: 100s;
                        animation-duration: 100s;
                -webkit-animation-timing-function: linear;
                        animation-timing-function: linear;
                -webkit-animation-iteration-count: infinite;
                        animation-iteration-count: infinite;
              }
              
              .background-violet span:nth-child(1) {
                color: #FFFFFF;
                opacity: 0.286;
                top: 20%;
                left: 87%;
                -webkit-animation-duration: 76.2s;
                        animation-duration: 76.2s;
                -webkit-animation-delay: -109.8s;
                        animation-delay: -109.8s;
                -webkit-transform-origin: 3vw -20vh;
                        transform-origin: 3vw -20vh;
                -webkit-box-shadow: -40vmin 0 9.247vmin currentColor;
                        box-shadow: -40vmin 0 9.247vmin currentColor;
              }
              
              .background-violet span:nth-child(2) {
                color: #FFFFFF;
                opacity: 0.148;
                top: 61%;
                left: 77%;
                -webkit-animation-duration: 70.1s;
                        animation-duration: 70.1s;
                -webkit-animation-delay: -96.7s;
                        animation-delay: -96.7s;
                -webkit-transform-origin: 17vw -10vh;
                        transform-origin: 17vw -10vh;
                -webkit-box-shadow: 40vmin 0 10.64556vmin currentColor;
                        box-shadow: 40vmin 0 10.64556vmin currentColor;
              }
              
              .background-violet span:nth-child(3) {
                color: #FFFFFF;
                opacity: 0.052;
                top: 65%;
                left: 46%;
                -webkit-animation-duration: 88.4s;
                        animation-duration: 88.4s;
                -webkit-animation-delay: -44.9s;
                        animation-delay: -44.9s;
                -webkit-transform-origin: 19vw 24vh;
                        transform-origin: 19vw 24vh;
                -webkit-box-shadow: -40vmin 0 8.74583vmin currentColor;
                        box-shadow: -40vmin 0 8.74583vmin currentColor;
              }
              
              .background-violet span:nth-child(4) {
                color: #FFFFFF;
                opacity: 0.262;
                top: 96%;
                left: 72%;
                -webkit-animation-duration: 73.7s;
                        animation-duration: 73.7s;
                -webkit-animation-delay: -59.6s;
                        animation-delay: -59.6s;
                -webkit-transform-origin: 17vw 24vh;
                        transform-origin: 17vw 24vh;
                -webkit-box-shadow: -40vmin 0 11.30628vmin currentColor;
                        box-shadow: -40vmin 0 11.30628vmin currentColor;
              }
              
              .background-violet span:nth-child(5) {
                color: #FFFFFF;
                opacity: 0.394;
                top: 41%;
                left: 81%;
                -webkit-animation-duration: 21.7s;
                        animation-duration: 21.7s;
                -webkit-animation-delay: -35.3s;
                        animation-delay: -35.3s;
                -webkit-transform-origin: -9vw -21vh;
                        transform-origin: -9vw -21vh;
                -webkit-box-shadow: 40vmin 0 10.63191vmin currentColor;
                        box-shadow: 40vmin 0 10.63191vmin currentColor;
              }
              
              .background-violet span:nth-child(6) {
                color: #FFFFFF;
                opacity: 0.048;
                top: 73%;
                left: 72%;
                -webkit-animation-duration: 105.6s;
                        animation-duration: 105.6s;
                -webkit-animation-delay: -77s;
                        animation-delay: -77s;
                -webkit-transform-origin: -9vw -21vh;
                        transform-origin: -9vw -21vh;
                -webkit-box-shadow: 40vmin 0 11.57366vmin currentColor;
                        box-shadow: 40vmin 0 11.57366vmin currentColor;
              }
              
              .background-violet span:nth-child(7) {
                color: #FFFFFF;
                opacity: 0.19;
                top: 90%;
                left: 63%;
                -webkit-animation-duration: 103s;
                        animation-duration: 103s;
                -webkit-animation-delay: -89.6s;
                        animation-delay: -89.6s;
                -webkit-transform-origin: 11vw -2vh;
                        transform-origin: 11vw -2vh;
                -webkit-box-shadow: 40vmin 0 10.22872vmin currentColor;
                        box-shadow: 40vmin 0 10.22872vmin currentColor;
              }
              
              .background-violet span:nth-child(8) {
                color: #FFFFFF;
                opacity: 0.244;
                top: 36%;
                left: 5%;
                -webkit-animation-duration: 69s;
                        animation-duration: 69s;
                -webkit-animation-delay: -107s;
                        animation-delay: -107s;
                -webkit-transform-origin: -6vw 17vh;
                        transform-origin: -6vw 17vh;
                -webkit-box-shadow: -40vmin 0 14.58808vmin currentColor;
                        box-shadow: -40vmin 0 14.58808vmin currentColor;
              }
              
              .background-violet span:nth-child(9) {
                color: #FFFFFF;
                opacity: 0.316;
                top: 81%;
                left: 68%;
                -webkit-animation-duration: 99.8s;
                        animation-duration: 99.8s;
                -webkit-animation-delay: -59.7s;
                        animation-delay: -59.7s;
                -webkit-transform-origin: 4vw 10vh;
                        transform-origin: 4vw 10vh;
                -webkit-box-shadow: -40vmin 0 10.29829vmin currentColor;
                        box-shadow: -40vmin 0 10.29829vmin currentColor;
              }
              
              .background-violet span:nth-child(10) {
                color: #FFFFFF;
                opacity: 0.316;
                top: 63%;
                left: 68%;
                -webkit-animation-duration: 81s;
                        animation-duration: 81s;
                -webkit-animation-delay: -72.5s;
                        animation-delay: -72.5s;
                -webkit-transform-origin: 24vw 12vh;
                        transform-origin: 24vw 12vh;
                -webkit-box-shadow: -40vmin 0 8.73248vmin currentColor;
                        box-shadow: -40vmin 0 8.73248vmin currentColor;
              }
              
              .background-violet span:nth-child(11) {
                color: #FFFFFF;
                opacity: 0.358;
                top: 4%;
                left: 32%;
                -webkit-animation-duration: 88.8s;
                        animation-duration: 88.8s;
                -webkit-animation-delay: -23.5s;
                        animation-delay: -23.5s;
                -webkit-transform-origin: 22vw -23vh;
                        transform-origin: 22vw -23vh;
                -webkit-box-shadow: -40vmin 0 11.54365vmin currentColor;
                        box-shadow: -40vmin 0 11.54365vmin currentColor;
              }
              
              .background-violet span:nth-child(12) {
                color: #FFFFFF;
                opacity: 0.4;
                top: 24%;
                left: 88%;
                -webkit-animation-duration: 102.3s;
                        animation-duration: 102.3s;
                -webkit-animation-delay: -53.7s;
                        animation-delay: -53.7s;
                -webkit-transform-origin: -18vw 3vh;
                        transform-origin: -18vw 3vh;
                -webkit-box-shadow: -40vmin 0 5.40966vmin currentColor;
                        box-shadow: -40vmin 0 5.40966vmin currentColor;
              }
              
              .background-violet span:nth-child(13) {
                color: #FFFFFF;
                opacity: 0.042;
                top: 71%;
                left: 42%;
                -webkit-animation-duration: 13.3s;
                        animation-duration: 13.3s;
                -webkit-animation-delay: -88.8s;
                        animation-delay: -88.8s;
                -webkit-transform-origin: 17vw -20vh;
                        transform-origin: 17vw -20vh;
                -webkit-box-shadow: -40vmin 0 7.07945vmin currentColor;
                        box-shadow: -40vmin 0 7.07945vmin currentColor;
              }
              
              .background-violet span:nth-child(14) {
                color: #FFFFFF;
                opacity: 0.364;
                top: 86%;
                left: 35%;
                -webkit-animation-duration: 56.2s;
                        animation-duration: 56.2s;
                -webkit-animation-delay: -5.8s;
                        animation-delay: -5.8s;
                -webkit-transform-origin: 18vw -19vh;
                        transform-origin: 18vw -19vh;
                -webkit-box-shadow: -40vmin 0 10.95238vmin currentColor;
                        box-shadow: -40vmin 0 10.95238vmin currentColor;
              }
              
              .background-violet span:nth-child(15) {
                color: #FFFFFF;
                opacity: 0.166;
                top: 25%;
                left: 71%;
                -webkit-animation-duration: 53.2s;
                        animation-duration: 53.2s;
                -webkit-animation-delay: -49.5s;
                        animation-delay: -49.5s;
                -webkit-transform-origin: 7vw 24vh;
                        transform-origin: 7vw 24vh;
                -webkit-box-shadow: 40vmin 0 12.85801vmin currentColor;
                        box-shadow: 40vmin 0 12.85801vmin currentColor;
              }
              
              .background-violet span:nth-child(16) {
                color: #FFFFFF;
                opacity: 0.136;
                top: 49%;
                left: 44%;
                -webkit-animation-duration: 90.6s;
                        animation-duration: 90.6s;
                -webkit-animation-delay: -11.2s;
                        animation-delay: -11.2s;
                -webkit-transform-origin: -21vw -19vh;
                        transform-origin: -21vw -19vh;
                -webkit-box-shadow: 40vmin 0 7.68097vmin currentColor;
                        box-shadow: 40vmin 0 7.68097vmin currentColor;
              }
              
              .background-violet span:nth-child(17) {
                color: #FFFFFF;
                opacity: 0.13;
                top: 83%;
                left: 70%;
                -webkit-animation-duration: 38.4s;
                        animation-duration: 38.4s;
                -webkit-animation-delay: -98.4s;
                        animation-delay: -98.4s;
                -webkit-transform-origin: 5vw 20vh;
                        transform-origin: 5vw 20vh;
                -webkit-box-shadow: 40vmin 0 7.78887vmin currentColor;
                        box-shadow: 40vmin 0 7.78887vmin currentColor;
              }
              
              .background-violet span:nth-child(18) {
                color: #FFFFFF;
                opacity: 0.298;
                top: 45%;
                left: 99%;
                -webkit-animation-duration: 30.9s;
                        animation-duration: 30.9s;
                -webkit-animation-delay: -5.2s;
                        animation-delay: -5.2s;
                -webkit-transform-origin: -19vw -6vh;
                        transform-origin: -19vw -6vh;
                -webkit-box-shadow: -40vmin 0 9.0091vmin currentColor;
                        box-shadow: -40vmin 0 9.0091vmin currentColor;
              }
              
              .background-violet span:nth-child(19) {
                color: #FFFFFF;
                opacity: 0.244;
                top: 9%;
                left: 10%;
                -webkit-animation-duration: 106.8s;
                        animation-duration: 106.8s;
                -webkit-animation-delay: -62.7s;
                        animation-delay: -62.7s;
                -webkit-transform-origin: 8vw -7vh;
                        transform-origin: 8vw -7vh;
                -webkit-box-shadow: 40vmin 0 9.50078vmin currentColor;
                        box-shadow: 40vmin 0 9.50078vmin currentColor;
              }
              
              .background-violet span:nth-child(20) {
                color: #FFFFFF;
                opacity: 0.214;
                top: 15%;
                left: 92%;
                -webkit-animation-duration: 26.7s;
                        animation-duration: 26.7s;
                -webkit-animation-delay: -26.8s;
                        animation-delay: -26.8s;
                -webkit-transform-origin: -21vw -12vh;
                        transform-origin: -21vw -12vh;
                -webkit-box-shadow: 40vmin 0 7.40091vmin currentColor;
                        box-shadow: 40vmin 0 7.40091vmin currentColor;
              }
              
              @-webkit-keyframes move {
                100% {
                  -webkit-transform: translate3d(0, 0, 1px) rotate(360deg);
                          transform: translate3d(0, 0, 1px) rotate(360deg);
                }
              }
              
              @keyframes move {
                100% {
                  -webkit-transform: translate3d(0, 0, 1px) rotate(360deg);
                          transform: translate3d(0, 0, 1px) rotate(360deg);
                }
              }
              /*# sourceMappingURL=animation.css.map */