.background {
  width: 100vw;
  height: 100vh;
position:fixed; left:0px; bottom:0px; width:100%; height:100%; z-index:-9999;}

.background span {
  width: 20vmin;
  height: 20vmin;
  border-radius: 20vmin;
  backface-visibility: hidden;
  position: absolute;
  animation-name: move;
  animation-duration: 10s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.background span:nth-child(1) {
  opacity: 0.5;
  width: 50vmin;
  height: 50vmin;
  border-radius: 50vmin;
  color: #FFF;
  top: 44%;
  left: 97%;
  animation-duration: 25s;
  animation-delay: -13.8s;
  transform-origin: 11vw -22vh;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(2) {
  opacity: 0.5;
  color: #FFF;
  top: 93%;
  left: 8%;
  animation-duration: 23.8s;
  animation-delay: -10.9s;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(3) {
  width: 30vmin;
  height: 30vmin;
  border-radius: 30vmin;
  color: #FFF;
  top: 14%;
  left: 41%;
  animation-duration: 15.9s;
  animation-delay: -6.7s;
  transform-origin: -9vw -24vh;
  box-shadow: -40vmin 0 0px currentColor;
}
.background span:nth-child(4) {
  opacity: 0.5;
  width: 50vmin;
  height: 50vmin;
  border-radius: 50vmin;
  color: #FFF;
  top: 40%;
  left: 75%;
  animation-duration: 24.3s;
  animation-delay: -12.6s;
  transform-origin: 16vw 25vh;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(5) {
  opacity: 0.3;
  width: 40vmin;
  height: 40vmin;
  border-radius: 40vmin;
  color: #FFF;
  top: 0%;
  left: 25%;
  animation-duration: 25.9s;
  animation-delay: -10s;
  transform-origin: 8vw 3vh;
  box-shadow: -50vmin 0 0px currentColor;
}
.background span:nth-child(6) {
  opacity: 0.5;
  color: #FFF;
  top: 35%;
  left: 1%;
  animation-duration: 21.6s;
  animation-delay: -6s;
  transform-origin: 0vw 17vh;
  box-shadow: -50vmin 0 0px currentColor;
}.background span:nth-child(12) {
  color: #FFF;
  top: 68%;
  left: 97%;
  animation-duration: 25.8s;
  animation-delay: -8.2s;
  transform-origin: 24vw 3vh;
  box-shadow: 50vmin 0 0px currentColor;
}/*

.background span:nth-child(9) {
  color: #FFF;
  top: 75%;
  left: 67%;
  animation-duration: 21.7s;
  animation-delay: -13.9s;
  transform-origin: -11vw -3vh;
  box-shadow: 50vmin 0 0px currentColor;
}



.background span:nth-child(13) {
  opacity: 0.5;
  color: #FFF;
  top: 69%;
  left: 46%;
  animation-duration: 20.4s;
  animation-delay: -11.5s;
  transform-origin: 13vw 24vh;
  box-shadow: -40vmin 0 6.2939412125vmin currentColor;
}
.background span:nth-child(14) {
  opacity: 0.5;
  color: #FFF;
  top: 98%;
  left: 63%;
  animation-duration: 21.2s;
  animation-delay: -3s;
  transform-origin: -13vw -15vh;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(15) {
  color: #FFF;
  top: 12%;
  left: 20%;
  animation-duration: 14s;
  animation-delay: -6.8s;
  transform-origin: 7vw 20vh;
  box-shadow: 40vmin 0 10.924056322vmin currentColor;
}

.background span:nth-child(10) {
  color: #FFF;
  top: 59%;
  left: 51%;
  animation-duration: 22.1s;
  animation-delay: -11.7s;
  transform-origin: -5vw -7vh;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(11) {
  opacity: 0.5;
  color: #FFF;
  top: 80%;
  left: 91%;
  animation-duration: 23.4s;
  animation-delay: -5.9s;
  transform-origin: 7vw -19vh;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(16) {
  color: #FFF;
  top: 29%;
  left: 20%;
  animation-duration: 11s;
  animation-delay: -14.4s;
  transform-origin: -20vw 4vh;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(17) {
  color: #FFF;
  top: 88%;
  left: 87%;
  animation-duration: 10.7s;
  animation-delay: -3.7s;
  transform-origin: -11vw 12vh;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(18) {
  color: #FFF;
  top: 57%;
  left: 35%;
  animation-duration: 10.1s;
  animation-delay: -13.6s;
  transform-origin: -19vw -1vh;
  box-shadow: 40vmin 0 8.5771411832vmin currentColor;
}
.background span:nth-child(19) {
  color: #FFF;
  top: 11%;
  left: 37%;
  animation-duration: 11.5s;
  animation-delay: -10.1s;
  transform-origin: -20vw 22vh;
  box-shadow: 50vmin 0 0px currentColor;
}
.background span:nth-child(20) {
  color: #FFF;
  top: 53%;
  left: 60%;
  animation-duration: 12.3s;
  animation-delay: -11.3s;
  transform-origin: 10vw -1vh;
}
*/
@keyframes move {
  100% {
    transform: translate3d(0, 0, 1px) rotate(360deg);
  }
}