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

.background {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    background: #01275c;
    overflow: hidden;
}

    .background span {
        width: 8vmin;
        height: 8vmin;
        border-radius: 8vmin;
        backface-visibility: hidden;
        position: absolute;
        animation: move;
        animation-duration: 40;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
    }


        .background span:nth-child(0) {
            color: #848c9c;
            top: 15%;
            left: 86%;
            animation-duration: 21s;
            animation-delay: -91s;
            transform-origin: -24vw 0vh;
            box-shadow: 16vmin 0 2.262981085079706vmin currentColor;
        }

        .background span:nth-child(1) {
            color: #848c9c;
            top: 78%;
            left: 78%;
            animation-duration: 23s;
            animation-delay: -9s;
            transform-origin: 0vw -7vh;
            box-shadow: 16vmin 0 2.0991599835602104vmin currentColor;
        }

        .background span:nth-child(2) {
            color: #aeb1b3;
            top: 99%;
            left: 19%;
            animation-duration: 29s;
            animation-delay: -56s;
            transform-origin: -22vw -10vh;
            box-shadow: 16vmin 0 2.265411858585197vmin currentColor;
        }

        .background span:nth-child(3) {
            color: #ffffff;
            top: 45%;
            left: 12%;
            animation-duration: 89s;
            animation-delay: -11s;
            transform-origin: 5vw -7vh;
            box-shadow: 16vmin 0 2.1145875245860966vmin currentColor;
        }

        .background span:nth-child(4) {
            color: #aeb1b3;
            top: 73%;
            left: 74%;
            animation-duration: 54s;
            animation-delay: -53s;
            transform-origin: 15vw 6vh;
            box-shadow: 16vmin 0 2.7381735950461215vmin currentColor;
        }

        .background span:nth-child(5) {
            color: #848c9c;
            top: 64%;
            left: 29%;
            animation-duration: 102s;
            animation-delay: -56s;
            transform-origin: 12vw 20vh;
            box-shadow: -16vmin 0 2.3153390928921063vmin currentColor;
        }

        .background span:nth-child(6) {
            color: #aeb1b3;
            top: 100%;
            left: 93%;
            animation-duration: 83s;
            animation-delay: -14s;
            transform-origin: 4vw -5vh;
            box-shadow: -16vmin 0 2.559953139980876vmin currentColor;
        }

        .background span:nth-child(7) {
            color: #ffffff;
            top: 69%;
            left: 9%;
            animation-duration: 24s;
            animation-delay: -63s;
            transform-origin: 25vw -7vh;
            box-shadow: -16vmin 0 2.8882072270030203vmin currentColor;
        }

        .background span:nth-child(8) {
            color: #ffffff;
            top: 96%;
            left: 91%;
            animation-duration: 31s;
            animation-delay: -30s;
            transform-origin: 24vw 25vh;
            box-shadow: -16vmin 0 2.9974987469761425vmin currentColor;
        }

        .background span:nth-child(9) {
            color: #848c9c;
            top: 69%;
            left: 57%;
            animation-duration: 42s;
            animation-delay: -51s;
            transform-origin: -20vw 9vh;
            box-shadow: 16vmin 0 2.8748050216000354vmin currentColor;
        }

        .background span:nth-child(10) {
            color: #848c9c;
            top: 89%;
            left: 29%;
            animation-duration: 9s;
            animation-delay: -70s;
            transform-origin: -20vw 17vh;
            box-shadow: 16vmin 0 2.106280785877198vmin currentColor;
        }

        .background span:nth-child(11) {
            color: #ffffff;
            top: 31%;
            left: 66%;
            animation-duration: 22s;
            animation-delay: -94s;
            transform-origin: 17vw 11vh;
            box-shadow: -16vmin 0 2.7682797467520475vmin currentColor;
        }

        .background span:nth-child(12) {
            color: #848c9c;
            top: 87%;
            left: 94%;
            animation-duration: 32s;
            animation-delay: -80s;
            transform-origin: -5vw 12vh;
            box-shadow: -16vmin 0 2.452263077675998vmin currentColor;
        }

        .background span:nth-child(13) {
            color: #aeb1b3;
            top: 1%;
            left: 4%;
            animation-duration: 101s;
            animation-delay: -70s;
            transform-origin: 1vw 22vh;
            box-shadow: 16vmin 0 2.836063233245578vmin currentColor;
        }

        .background span:nth-child(14) {
            color: #ffffff;
            top: 3%;
            left: 13%;
            animation-duration: 36s;
            animation-delay: -84s;
            transform-origin: 24vw 0vh;
            box-shadow: 16vmin 0 2.8285128310073486vmin currentColor;
        }

        .background span:nth-child(15) {
            color: #ffffff;
            top: 18%;
            left: 1%;
            animation-duration: 42s;
            animation-delay: -86s;
            transform-origin: -2vw -1vh;
            box-shadow: -16vmin 0 2.228974847252867vmin currentColor;
        }

        .background span:nth-child(16) {
            color: #ffffff;
            top: 68%;
            left: 91%;
            animation-duration: 93s;
            animation-delay: -72s;
            transform-origin: -17vw 23vh;
            box-shadow: 16vmin 0 2.5835894664620582vmin currentColor;
        }

        .background span:nth-child(17) {
            color: #aeb1b3;
            top: 52%;
            left: 75%;
            animation-duration: 40s;
            animation-delay: -82s;
            transform-origin: -2vw -16vh;
            box-shadow: 16vmin 0 2.132695376835251vmin currentColor;
        }

        .background span:nth-child(18) {
            color: #ffffff;
            top: 14%;
            left: 39%;
            animation-duration: 65s;
            animation-delay: -55s;
            transform-origin: 21vw -16vh;
            box-shadow: 16vmin 0 2.476924029581201vmin currentColor;
        }

        .background span:nth-child(19) {
            color: #aeb1b3;
            top: 79%;
            left: 64%;
            animation-duration: 20s;
            animation-delay: -29s;
            transform-origin: 11vw -5vh;
            box-shadow: 16vmin 0 2.378134333089002vmin currentColor;
        }

        .background span:nth-child(20) {
            color: #aeb1b3;
            top: 20%;
            left: 49%;
            animation-duration: 98s;
            animation-delay: -63s;
            transform-origin: -12vw -9vh;
            box-shadow: -16vmin 0 2.552082417641032vmin currentColor;
        }

        .background span:nth-child(21) {
            color: #ffffff;
            top: 1%;
            left: 61%;
            animation-duration: 22s;
            animation-delay: -43s;
            transform-origin: -14vw -6vh;
            box-shadow: 16vmin 0 2.8534738649690903vmin currentColor;
        }

        .background span:nth-child(22) {
            color: #848c9c;
            top: 25%;
            left: 74%;
            animation-duration: 46s;
            animation-delay: -59s;
            transform-origin: 25vw 7vh;
            box-shadow: 16vmin 0 2.443209193026277vmin currentColor;
        }

        .background span:nth-child(23) {
            color: #ffffff;
            top: 32%;
            left: 21%;
            animation-duration: 103s;
            animation-delay: -25s;
            transform-origin: -20vw -11vh;
            box-shadow: -16vmin 0 2.857817952506503vmin currentColor;
        }

        .background span:nth-child(24) {
            color: #aeb1b3;
            top: 11%;
            left: 90%;
            animation-duration: 37s;
            animation-delay: -90s;
            transform-origin: 2vw -1vh;
            box-shadow: -16vmin 0 2.0305480933654048vmin currentColor;
        }

        .background span:nth-child(25) {
            color: #aeb1b3;
            top: 1%;
            left: 63%;
            animation-duration: 7s;
            animation-delay: -31s;
            transform-origin: 5vw -16vh;
            box-shadow: -16vmin 0 2.762013493641488vmin currentColor;
        }

        .background span:nth-child(26) {
            color: #ffffff;
            top: 35%;
            left: 12%;
            animation-duration: 100s;
            animation-delay: -44s;
            transform-origin: -15vw -3vh;
            box-shadow: -16vmin 0 2.910480107948637vmin currentColor;
        }

        .background span:nth-child(27) {
            color: #848c9c;
            top: 45%;
            left: 41%;
            animation-duration: 37s;
            animation-delay: -41s;
            transform-origin: 3vw -15vh;
            box-shadow: 16vmin 0 2.7844753762868004vmin currentColor;
        }

        .background span:nth-child(28) {
            color: #848c9c;
            top: 70%;
            left: 50%;
            animation-duration: 85s;
            animation-delay: -65s;
            transform-origin: -22vw 6vh;
            box-shadow: -16vmin 0 2.8055915053819493vmin currentColor;
        }

        .background span:nth-child(29) {
            color: #ffffff;
            top: 72%;
            left: 32%;
            animation-duration: 51s;
            animation-delay: -45s;
            transform-origin: -16vw -6vh;
            box-shadow: 16vmin 0 2.052882849781624vmin currentColor;
        }

        .background span:nth-child(30) {
            color: #aeb1b3;
            top: 7%;
            left: 72%;
            animation-duration: 35s;
            animation-delay: -19s;
            transform-origin: 9vw -18vh;
            box-shadow: 16vmin 0 2.9628352509671423vmin currentColor;
        }

        .background span:nth-child(31) {
            color: #aeb1b3;
            top: 63%;
            left: 21%;
            animation-duration: 74s;
            animation-delay: -39s;
            transform-origin: 18vw 13vh;
            box-shadow: -16vmin 0 2.5659949739208514vmin currentColor;
        }

        .background span:nth-child(32) {
            color: #aeb1b3;
            top: 88%;
            left: 84%;
            animation-duration: 96s;
            animation-delay: -58s;
            transform-origin: -22vw -14vh;
            box-shadow: -16vmin 0 2.9560436972369155vmin currentColor;
        }

        .background span:nth-child(33) {
            color: #aeb1b3;
            top: 50%;
            left: 51%;
            animation-duration: 66s;
            animation-delay: -60s;
            transform-origin: 5vw 21vh;
            box-shadow: 16vmin 0 2.173488536080849vmin currentColor;
        }

        .background span:nth-child(34) {
            color: #ffffff;
            top: 4%;
            left: 32%;
            animation-duration: 65s;
            animation-delay: -7s;
            transform-origin: 10vw 5vh;
            box-shadow: -16vmin 0 2.31138842933499vmin currentColor;
        }

        .background span:nth-child(35) {
            color: #848c9c;
            top: 91%;
            left: 47%;
            animation-duration: 85s;
            animation-delay: -3s;
            transform-origin: 17vw 4vh;
            box-shadow: 16vmin 0 2.463183546537093vmin currentColor;
        }

        .background span:nth-child(36) {
            color: #848c9c;
            top: 61%;
            left: 66%;
            animation-duration: 26s;
            animation-delay: -92s;
            transform-origin: -1vw 4vh;
            box-shadow: 16vmin 0 2.2096524016283343vmin currentColor;
        }

        .background span:nth-child(37) {
            color: #aeb1b3;
            top: 43%;
            left: 38%;
            animation-duration: 66s;
            animation-delay: -82s;
            transform-origin: 22vw -20vh;
            box-shadow: -16vmin 0 2.585501366674367vmin currentColor;
        }

        .background span:nth-child(38) {
            color: #ffffff;
            top: 54%;
            left: 50%;
            animation-duration: 35s;
            animation-delay: -18s;
            transform-origin: -21vw -9vh;
            box-shadow: -16vmin 0 2.6033205714418877vmin currentColor;
        }

        .background span:nth-child(39) {
            color: #aeb1b3;
            top: 6%;
            left: 90%;
            animation-duration: 99s;
            animation-delay: -56s;
            transform-origin: -13vw -22vh;
            box-shadow: -16vmin 0 2.2077736870880686vmin currentColor;
        }

        .background span:nth-child(40) {
            color: #ffffff;
            top: 42%;
            left: 48%;
            animation-duration: 78s;
            animation-delay: -17s;
            transform-origin: -6vw -1vh;
            box-shadow: -16vmin 0 2.3706397362877967vmin currentColor;
        }

        .background span:nth-child(41) {
            color: #ffffff;
            top: 93%;
            left: 35%;
            animation-duration: 91s;
            animation-delay: -89s;
            transform-origin: 12vw 0vh;
            box-shadow: -16vmin 0 2.9860016386175587vmin currentColor;
        }

        .background span:nth-child(42) {
            color: #ffffff;
            top: 7%;
            left: 69%;
            animation-duration: 63s;
            animation-delay: -85s;
            transform-origin: 4vw -23vh;
            box-shadow: 16vmin 0 2.5331411425716492vmin currentColor;
        }

        .background span:nth-child(43) {
            color: #848c9c;
            top: 59%;
            left: 6%;
            animation-duration: 37s;
            animation-delay: -99s;
            transform-origin: 0vw 15vh;
            box-shadow: 16vmin 0 2.2772738872426923vmin currentColor;
        }