@keyframes move {
  from {
    -webkit-transform: rotate(0deg) translateX(40px) rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg) translateX(40px) rotate(-360deg);
  }
}

.bg-color {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: #1a1919;
  z-index: 1;
  opacity: 0.3;
}

.background-movement {
  width: 45vmin;
  height: 45vmin;
  border-radius: 45vmin;
  backface-visibility: hidden;
  position: absolute;
  animation-name: move;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.background-movement:nth-child(1) {
  background-color: rgba(186, 34, 41, 0.8);
  filter: blur(110px);
  top: 44%;
  left: 62%;
  animation-duration: 4s;
  animation-delay: -3s;
  transform-origin: 24vw, 7vh;
  /* box-shadow: 90vmin 0
  /*box-shadow: 90vmin 0 5.83904342756971vmin currentColor;*/
}
.background-movement:nth-child(2) {
  background-color: rgba(186, 34, 41, 0.8);
  filter: blur(110px);
  top: -20%;
  left: 36%;
  animation-duration: 8s;
  animation-delay: -6s;
  transform-origin: -17vw, 24vh;
  /*box-shadow: 90vmin 0 5.820863129004694vmin currentColor;*/
}
.background-movement:nth-child(3) {
  background-color: rgba(186, 34, 41, 0.8);
  filter: blur(110px);
  top: 34%;
  left: 10%;
  animation-duration: 8s;
  animation-delay: -9s;
  transform-origin: -17vw, 24vh;
  /*box-shadow: 90vmin 0 5.230766663615902vmin currentColor;*/
}

@media only screen and (max-width: 600px) {
  .background-movement:nth-child(1) {
    top: 80%;
    left: 32%;
  }

  .background-movement:nth-child(2) {
    top: -10%;
    left: 36%;
  }

  .background-movement:nth-child(3) {
    top: 34%;
    left: 20%;
  }
}