.bubblesq {
  border-radius: 25%;
  -webkit-transform: rotate(30deg);
          transform: rotate(30deg);
  /*  -webkit-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1);
  -moz-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1);
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1);*/
  height: 30px;
  position: absolute;
  width: 30px;
}

.bubblesq:after {
  border: solid #b1dff0 8px;
  border-radius: 25%;
  -webkit-transform: rotate(30deg);
          transform: rotate(30deg);
  /*    -webkit-box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3);
  -moz-box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3);
  box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3);*/
  content: "";
  height: 30px;
  left: 10px;
  position: absolute;
  width: 30px;
}

/* ANIMATIONS */
.sq1 {
  -webkit-animation: animateBubblesq 25s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  animation: animateBubblesq 25s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  left: -10%;
  top: 15%;
  -webkit-transform: scale(0.6);
  transform: scale(0.6);
}

.sq2 {
  -webkit-animation: animateBubblesq 20s linear infinite, sideWayssq 2s ease-in-out infinite alternate;
  animation: animateBubblesq 20s linear infinite, sideWayssq 2s ease-in-out infinite alternate;
  left: 20%;
  top: 85%;
  -webkit-transform: scale(0.4);
  transform: scale(0.4);
}

.sq3 {
  -webkit-animation: animateBubblesq 28s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  animation: animateBubblesq 28s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  left: 25%;
  top: 45%;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
}

.sq4 {
  -webkit-animation: animateBubblesq 22s linear infinite, sideWayssq 3s ease-in-out infinite alternate;
  animation: animateBubblesq 22s linear infinite, sideWayssq 3s ease-in-out infinite alternate;
  left: 30%;
  top: 5%;
  -webkit-transform: scale(0.3);
  transform: scale(0.3);
}

.sq5 {
  -webkit-animation: animateBubblesq 29s linear infinite, sideWayssq 2s ease-in-out infinite alternate;
  animation: animateBubblesq 29s linear infinite, sideWayssq 2s ease-in-out infinite alternate;
  left: 35%;
  top: 45%;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
}

.sq6 {
  -webkit-animation: animateBubblesq 21s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  animation: animateBubblesq 21s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  left: 45%;
  top: 10%;
  -webkit-transform: scale(0.6);
  transform: scale(0.6);
}

.sq7 {
  -webkit-animation: animateBubblesq 20s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  animation: animateBubblesq 20s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  left: 55%;
  top: 65%;
  -webkit-transform: scale(0.4);
  transform: scale(0.4);
}

.sq8 {
  -webkit-animation: animateBubblesq 22s linear infinite, sideWayssq 3s ease-in-out infinite alternate;
  animation: animateBubblesq 22s linear infinite, sideWayssq 3s ease-in-out infinite alternate;
  left: 75%;
  top: 15%;
  -webkit-transform: scale(0.3);
  transform: scale(0.3);
}

.sq9 {
  -webkit-animation: animateBubblesq 29s linear infinite, sideWayssq 2s ease-in-out infinite alternate;
  animation: animateBubblesq 29s linear infinite, sideWayssq 2s ease-in-out infinite alternate;
  left: 80%;
  top: 45%;
  -webkit-transform: scale(0.6);
  transform: scale(0.6);
}

.sq10 {
  -webkit-animation: animateBubblesq 26s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  animation: animateBubblesq 26s linear infinite, sideWayssq 1s ease-in-out infinite alternate;
  left: 85%;
  top: 70%;
  -webkit-transform: scale(0.3);
  transform: scale(0.3);
}

/* KEYFRAMES */
@-webkit-keyframes animateBubblesq {
  0% {
    margin-top: 100px;
  }
  100% {
    margin-top: -100%;
  }
}

@keyframes animateBubblesq {
  0% {
    margin-top: 1000px;
  }
  100% {
    margin-top: -100%;
  }
}

@-webkit-keyframes sideWayssq {
  0% {
    margin-left: 0px;
  }
  100% {
    margin-left: 50px;
  }
}

@keyframes sideWayssq {
  0% {
    margin-left: 0px;
  }
  100% {
    margin-left: 50px;
  }
}
/*# sourceMappingURL=bubblenew.css.map */