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

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

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


.background span:nth-child(0) {
    color: #bc586f;
    top: 58%;
    left: 38%;
    animation-duration: 37s;
    animation-delay: -148s;
    transform-origin: 5vw -14vh;
    box-shadow: 100vmin 0 12.62361919232821vmin currentColor;
}
.background span:nth-child(1) {
    color: #bc586f;
    top: 81%;
    left: 8%;
    animation-duration: 135s;
    animation-delay: -1s;
    transform-origin: 22vw 1vh;
    box-shadow: 100vmin 0 12.685915006895591vmin currentColor;
}
.background span:nth-child(2) {
    color: #9b2e4f;
    top: 86%;
    left: 70%;
    animation-duration: 174s;
    animation-delay: -173s;
    transform-origin: 11vw -14vh;
    box-shadow: -100vmin 0 13.196062384643957vmin currentColor;
}
.background span:nth-child(3) {
    color: #bc586f;
    top: 19%;
    left: 93%;
    animation-duration: 143s;
    animation-delay: -159s;
    transform-origin: 21vw -19vh;
    box-shadow: -100vmin 0 12.750604041295901vmin currentColor;
}
.background span:nth-child(4) {
    color: #9b2e4f;
    top: 46%;
    left: 36%;
    animation-duration: 64s;
    animation-delay: -137s;
    transform-origin: 15vw 11vh;
    box-shadow: 100vmin 0 12.961084057901084vmin currentColor;
}
.background span:nth-child(5) {
    color: #9b2e4f;
    top: 6%;
    left: 24%;
    animation-duration: 6s;
    animation-delay: -78s;
    transform-origin: -20vw -1vh;
    box-shadow: -100vmin 0 13.258434045186597vmin currentColor;
}
.background span:nth-child(6) {
    color: #bc586f;
    top: 13%;
    left: 5%;
    animation-duration: 26s;
    animation-delay: -147s;
    transform-origin: -20vw 7vh;
    box-shadow: 100vmin 0 12.947679971159069vmin currentColor;
}
.background span:nth-child(7) {
    color: #9b2e4f;
    top: 45%;
    left: 72%;
    animation-duration: 68s;
    animation-delay: -159s;
    transform-origin: 2vw 10vh;
    box-shadow: 100vmin 0 13.174804643794946vmin currentColor;
}
.background span:nth-child(8) {
    color: #9b2e4f;
    top: 80%;
    left: 67%;
    animation-duration: 150s;
    animation-delay: -55s;
    transform-origin: -16vw -6vh;
    box-shadow: -100vmin 0 13.021744257010832vmin currentColor;
}
.background span:nth-child(9) {
    color: #9b2e4f;
    top: 28%;
    left: 7%;
    animation-duration: 16s;
    animation-delay: -48s;
    transform-origin: 6vw 12vh;
    box-shadow: -100vmin 0 13.260160726412705vmin currentColor;
}
.background span:nth-child(10) {
    color: #bc586f;
    top: 51%;
    left: 93%;
    animation-duration: 121s;
    animation-delay: -163s;
    transform-origin: 14vw -15vh;
    box-shadow: -100vmin 0 12.98939813029728vmin currentColor;
}
.background span:nth-child(11) {
    color: #9b2e4f;
    top: 7%;
    left: 27%;
    animation-duration: 113s;
    animation-delay: -137s;
    transform-origin: -3vw -19vh;
    box-shadow: 100vmin 0 12.5056406254672vmin currentColor;
}
.background span:nth-child(12) {
    color: #9b2e4f;
    top: 75%;
    left: 54%;
    animation-duration: 60s;
    animation-delay: -139s;
    transform-origin: 17vw -10vh;
    box-shadow: 100vmin 0 12.996060020494145vmin currentColor;
}
.background span:nth-child(13) {
    color: #bc586f;
    top: 84%;
    left: 46%;
    animation-duration: 71s;
    animation-delay: -175s;
    transform-origin: -11vw 17vh;
    box-shadow: -100vmin 0 13.014151536657174vmin currentColor;
}
.background span:nth-child(14) {
    color: #9b2e4f;
    top: 97%;
    left: 75%;
    animation-duration: 74s;
    animation-delay: -120s;
    transform-origin: 22vw -3vh;
    box-shadow: -100vmin 0 13.11877598546375vmin currentColor;
}
.background span:nth-child(15) {
    color: #9b2e4f;
    top: 53%;
    left: 78%;
    animation-duration: 137s;
    animation-delay: -72s;
    transform-origin: -17vw -8vh;
    box-shadow: 100vmin 0 12.793907791910447vmin currentColor;
}
.background span:nth-child(16) {
    color: #9b2e4f;
    top: 42%;
    left: 48%;
    animation-duration: 80s;
    animation-delay: -140s;
    transform-origin: 8vw 15vh;
    box-shadow: 100vmin 0 12.637742926347023vmin currentColor;
}
.background span:nth-child(17) {
    color: #bc586f;
    top: 80%;
    left: 98%;
    animation-duration: 72s;
    animation-delay: -55s;
    transform-origin: 19vw 3vh;
    box-shadow: 100vmin 0 12.907825090305531vmin currentColor;
}
.background span:nth-child(18) {
    color: #bc586f;
    top: 25%;
    left: 27%;
    animation-duration: 91s;
    animation-delay: -24s;
    transform-origin: -13vw -14vh;
    box-shadow: -100vmin 0 12.875792870664736vmin currentColor;
}
.background span:nth-child(19) {
    color: #bc586f;
    top: 69%;
    left: 76%;
    animation-duration: 156s;
    animation-delay: -31s;
    transform-origin: 2vw 3vh;
    box-shadow: -100vmin 0 12.698814734212686vmin currentColor;
}
