.background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: #3E1E68;
  overflow: hidden;
}

.background span {
  width: 20vmin;
  height: 20vmin;
  border-radius: 20vmin;
  backface-visibility: hidden;
  position: absolute;
  animation-name: move;
  animation-duration: 6s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.background span:nth-child(1) {
  color: #583C87;
  top: 90%;
  left: 92%;
  animation-duration: 12.8s;
  animation-delay: -12.2s;
  transform-origin: 12vw 18vh;
  box-shadow: -40vmin 0 13.3665331733vmin currentColor;
}
.background span:nth-child(2) {
  color: #E45A84;
  top: 28%;
  left: 28%;
  animation-duration: 12.6s;
  animation-delay: -13.2s;
  transform-origin: -6vw -22vh;
  box-shadow: 40vmin 0 8.0227543201vmin currentColor;
}
.background span:nth-child(3) {
  color: #E45A84;
  top: 29%;
  left: 37%;
  animation-duration: 13.1s;
  animation-delay: -4.3s;
  transform-origin: 14vw 24vh;
  box-shadow: -40vmin 0 9.3941763702vmin currentColor;
}
.background span:nth-child(4) {
  color: #E45A84;
  top: 52%;
  left: 47%;
  animation-duration: 10.3s;
  animation-delay: -5.6s;
  transform-origin: -13vw -9vh;
  box-shadow: -40vmin 0 8.7591804097vmin currentColor;
}
.background span:nth-child(5) {
  color: #E45A84;
  top: 32%;
  left: 23%;
  animation-duration: 10.7s;
  animation-delay: -2.3s;
  transform-origin: 17vw 20vh;
  box-shadow: -40vmin 0 6.0217072636vmin currentColor;
}
.background span:nth-child(6) {
  color: #E45A84;
  top: 90%;
  left: 70%;
  animation-duration: 13.7s;
  animation-delay: -12.6s;
  transform-origin: -3vw -22vh;
  box-shadow: -40vmin 0 11.0329460762vmin currentColor;
}
.background span:nth-child(7) {
  color: #583C87;
  top: 62%;
  left: 10%;
  animation-duration: 11.8s;
  animation-delay: -8.3s;
  transform-origin: 15vw 18vh;
  box-shadow: 40vmin 0 5.0587523869vmin currentColor;
}
.background span:nth-child(8) {
  color: #583C87;
  top: 27%;
  left: 78%;
  animation-duration: 13.8s;
  animation-delay: -8.8s;
  transform-origin: 5vw -19vh;
  box-shadow: 40vmin 0 11.7442454819vmin currentColor;
}
.background span:nth-child(9) {
  color: #E45A84;
  top: 83%;
  left: 64%;
  animation-duration: 12s;
  animation-delay: -2.8s;
  transform-origin: -23vw -23vh;
  box-shadow: 40vmin 0 8.038963391vmin currentColor;
}
.background span:nth-child(10) {
  color: #583C87;
  top: 42%;
  left: 84%;
  animation-duration: 11.7s;
  animation-delay: -13.5s;
  transform-origin: 23vw 9vh;
  box-shadow: 40vmin 0 5.3308979775vmin currentColor;
}
.background span:nth-child(11) {
  color: #FFACAC;
  top: 36%;
  left: 5%;
  animation-duration: 13.1s;
  animation-delay: -6.2s;
  transform-origin: 3vw 21vh;
  box-shadow: -40vmin 0 11.0106908708vmin currentColor;
}
.background span:nth-child(12) {
  color: #FFACAC;
  top: 36%;
  left: 30%;
  animation-duration: 15.6s;
  animation-delay: -11.6s;
  transform-origin: 2vw 22vh;
  box-shadow: 40vmin 0 13.9976925405vmin currentColor;
}
.background span:nth-child(13) {
  color: #E45A84;
  top: 37%;
  left: 78%;
  animation-duration: 10.4s;
  animation-delay: -9s;
  transform-origin: 0vw 14vh;
  box-shadow: 40vmin 0 9.3270001574vmin currentColor;
}
.background span:nth-child(14) {
  color: #FFACAC;
  top: 34%;
  left: 60%;
  animation-duration: 10.9s;
  animation-delay: -5.4s;
  transform-origin: 20vw 21vh;
  box-shadow: -40vmin 0 12.2250365032vmin currentColor;
}
.background span:nth-child(15) {
  color: #FFACAC;
  top: 44%;
  left: 2%;
  animation-duration: 13.1s;
  animation-delay: -9.3s;
  transform-origin: -16vw -22vh;
  box-shadow: -40vmin 0 13.9122602636vmin currentColor;
}
.background span:nth-child(16) {
  color: #FFACAC;
  top: 80%;
  left: 34%;
  animation-duration: 10.5s;
  animation-delay: -13.3s;
  transform-origin: 11vw -20vh;
  box-shadow: 40vmin 0 14.5170728302vmin currentColor;
}
.background span:nth-child(17) {
  color: #583C87;
  top: 73%;
  left: 48%;
  animation-duration: 14.6s;
  animation-delay: -2.5s;
  transform-origin: -1vw -24vh;
  box-shadow: -40vmin 0 9.9422753376vmin currentColor;
}
.background span:nth-child(18) {
  color: #E45A84;
  top: 57%;
  left: 86%;
  animation-duration: 13.8s;
  animation-delay: -15.5s;
  transform-origin: -4vw -12vh;
  box-shadow: 40vmin 0 8.753121157vmin currentColor;
}
.background span:nth-child(19) {
  color: #FFACAC;
  top: 67%;
  left: 29%;
  animation-duration: 13.9s;
  animation-delay: -8.5s;
  transform-origin: -22vw -9vh;
  box-shadow: 40vmin 0 13.8404364926vmin currentColor;
}
.background span:nth-child(20) {
  color: #FFACAC;
  top: 39%;
  left: 37%;
  animation-duration: 14.3s;
  animation-delay: -13.4s;
  transform-origin: -17vw -19vh;
  box-shadow: -40vmin 0 10.0783058985vmin currentColor;
}

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