<div class="container">
  <div class="anim-container">
    <ul id="scene">
      <li class="layer first">
        <div></div>
      </li>
      <li class="layer second">
        <div></div>
      </li>
      <li class="layer third">
        <div></div>
      </li>
    </ul>
  </div>
</div>
<div>Hello</div>

html,
body {
  margin: 0;
  padding: 0;
}

.container {
  height: 450px;
  width: 100%;
  background: linear-gradient(209deg, #9dcd2b, #21a343);
}

.anim-container {
  position: absolute;
  right: 0;
  top: 0;
  width: 600px;
  height: 450px;
}

#scene {
  list-style: outside none;
  height: 450px;
  width: 600px;
  padding: 0;
  margin: 0;
}

ul li {
  list-style: outside none;
  position: absolute;
  width: 800px;
  height: 450px;
  right: 0; top: 0;
  animation: blurIntro 2s;
  overflow: hidden;
}

ul li div {
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
}

@keyframes blurIntro {
  0% {
    filter: blur(500px);
  }
  100% {
    filter: blur(0px);
  }
}

@keyframes blink {
  50% {
    opacity: 1;
  }
}

.first div {
  width: 580px;
  height: 580px;
  background: linear-gradient(25deg, #9dcd2b 0%, #21a343 100%);
  top: 70px;
  right: 20px;
  animation: blink 15s infinite 12s;
}

.second div {
  width: 310px;
  height: 310px;
  background: linear-gradient(135deg, #9dcd2b 0%, #21a343 100%);
  top: 150px;
  right: -80px;
  animation: blink 15s infinite 0s;
}

.third div {
  width: 180px;
  height: 180px;
  background: linear-gradient(210deg, #9dcd2b 0%, #21a343 100%);
  top: -50px;
  right: 140px;
  animation: blink 15s infinite 4s;
}

/*$('#scene').parallax({
  frictionX: 0.01,
  frictionY: 0.01
});*/

moveBubbles();
setInterval(function(){
  moveBubbles();
}, 7000);

function moveBubbles () {
  $('#scene li div').each(function() {
    var random = Math.ceil(Math.random() * 20);
    var random2 = Math.ceil(Math.random() * 50);

    var whatWay = Math.ceil(Math.random() * 2);

    if(whatWay == 1) {
      $(this).transition({ 
        x: "+=" + random + "",
        y: "+=" + random2 + "",
        rotate: "+=" + random + ""
      }, 7000, "linear");

    } else {

      $(this).transition({ 
        x: "-=" + random + "",
        y: "-=" + random2 + "",
        rotate: "+=" + random2 + ""
      }, 7000, "linear");
    }
  });
}