body {
  background-color: #E91E63;
}

.grid {
  filter: url("#goo");
}

.circle, .one, .two, .three, .four, .five, .six, .seven, .eight, .nine {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background-color: white;
  margin-bottom: 10px;
  position: absolute;
  animation-timing-function: cubic-bezier(0.14, 0.75, 0.2, 1.01);
}

.row {
  display: inline-block;
  position: absolute;
}

.content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
}

.one {
  left: -30px;
  animation: moveOne 3s infinite 0.25s;
}

.two {
  animation: moveTwo 3s infinite 0.3s;
}

.three {
  left: 30px;
  top: 0px;
  animation: moveThree 3s infinite 0.35s;
}

.four {
  left: -30px;
  top: 30px;
  animation: moveFour 3s infinite 0.4s;
}

.five {
  top: 30px;
}

.six {
  left: 30px;
  top: 30px;
  animation: moveSix 3s infinite 0.45s;
}

.seven {
  left: -30px;
  top: 60px;
  animation: moveSeven 3s infinite 0.5s;
}

.eight {
  top: 60px;
  animation: moveEight 3s infinite 0.6s;
}

.nine {
  left: 30px;
  top: 60px;
  animation: moveNine 3s infinite 0.65s;
}

@keyframes moveOne {
  0%, 100% {
    transform: translate3d(0px, 0px, 0px);
  }
  50% {
    transform: translate3d(30px, 30px, 0px);
  }
}
@keyframes moveTwo {
  0%, 100% {
    transform: translate3d(0px, 0px, 0px);
  }
  50% {
    transform: translate3d(0px, 30px, 0px);
  }
}
@keyframes moveThree {
  0%, 100% {
    transform: translate3d(0px, 0px, 0px);
  }
  50% {
    transform: translate3d(-30px, 30px, 0px);
  }
}
@keyframes moveFour {
  0%, 100% {
    transform: translate3d(0px, 0px, 0px);
  }
  50% {
    transform: translate3d(30px, 0px, 0px);
  }
}
@keyframes moveSix {
  0%, 100% {
    transform: translate3d(0px, 0px, 0px);
  }
  50% {
    transform: translate3d(-30px, 0px, 0px);
  }
}
@keyframes moveSeven {
  0%, 100% {
    transform: translate3d(0px, 0px, 0px);
  }
  50% {
    transform: translate3d(30px, -30px, 0px);
  }
}
@keyframes moveEight {
  0%, 100% {
    transform: translate3d(0px, 0px, 0px);
  }
  50% {
    transform: translate3d(0px, -30px, 0px);
  }
}
@keyframes moveNine {
  0%, 100% {
    transform: translate3d(0px, 0px, 0px);
  }
  50% {
    transform: translate3d(-30px, -30px, 0px);
  }
}
