/* Polygon & Cloud Control */

.cloud-container {
  position: relative;
  z-index: -1;
  top: 15%;
  left: -50%;
  opacity: 0.3;
  -webkit-animation: cloudMove 31s 0s linear infinite;
  -moz-animation: cloudMove 31s 0s linear infinite;
  animation: cloudMove 31s 0s linear infinite;
  transform: translateZ(0);
  backface-visibility: hidden;
}
@keyframes cloudMove {
  0% {
    -webkit-transform: translateX(-30%);
    transform: translateX(-30%);
  }
  100% {
    -webkit-transform: translateX(150%);
    transform: translateX(150%);
  }
}
.cloud-tiny {
  width: 55px;
  height: 35px;
  border-radius: 50%;
  background-color: #fff;
  position: absolute;
  left: 0px;
  top: 100px;
  z-index: 31;
}
.cloud-tiny::before {
  content: "";
  width: 40px;
  height: 25px;
  background-color: #fff;
  margin-left: -20px;
  margin-top: 10px;
  display: block;
  border-radius: 50%;
}
.cloud-tiny::after {
  content: "";
  width: 40px;
  height: 30px;
  background-color: #fff;
  position: absolute;
  right: -10px;
  top: 10px;
  border-radius: 50%;
}
.cloud-small {
  width: 75px;
  height: 55px;
  border-radius: 50%;
  background-color: #ebfff5;
  position: absolute;
  left: 100px;
  z-index: 30;
}
.cloud-small::before {
  content: "";
  width: 55px;
  height: 40px;
  background-color: #ebfff5;
  margin-left: -20px;
  margin-top: 10px;
  display: block;
  border-radius: 50%;
}
.cloud-small::after {
  content: "";
  width: 40px;
  height: 30px;
  background-color: #ebfff5;
  position: absolute;
  right: -10px;
  top: 17px;
  border-radius: 50%;
}
.cloud-med {
  width: 125px;
  height: 100px;
  border-radius: 50%;
  background-color: #cffbe4;
  position: absolute;
  top: 20px;
  left: 0;
  z-index: 29;
}
.cloud-med::before {
  content: "";
  width: 105px;
  height: 90px;
  background-color: #cffbe4;
  margin-left: -20px;
  margin-top: 10px;
  display: block;
  border-radius: 50%;
}
.cloud-med::after {
  content: "";
  width: 90px;
  height: 80px;
  background-color: #cffbe4;
  position: absolute;
  right: -10px;
  top: 17px;
  border-radius: 50%;
}
.cloud-large {
  width: 135px;
  height: 110px;
  border-radius: 50%;
  background-color: #b8ecd1;
  position: absolute;
  top: 20px;
  left: 120px;
  z-index: 28;
}
.cloud-large::before {
  content: "";
  width: 115px;
  height: 100px;
  background-color: #b8ecd1;
  margin-left: -20px;
  margin-top: 10px;
  display: block;
  border-radius: 50%;
}
.cloud-large::after {
  content: "";
  width: 100px;
  height: 90px;
  background-color: #b8ecd1;
  position: absolute;
  top: 10px;
  border-radius: 50%;
}
.cloud-huge {
  width: 155px;
  height: 120px;
  border-radius: 50%;
  background-color: #d4ffe9;
  position: absolute;
  top: 10px;
  left: 175px;
  z-index: 27;
}
.cloud-huge::before {
  content: "";
  width: 135px;
  height: 120px;
  background-color: #d4ffe9;
  margin-left: -50px;
  margin-top: 10px;
  display: block;
  border-radius: 50%;
}
.cloud-huge::after {
  content: "";
  width: 130px;
  height: 110px;
  background-color: #d4ffe9;
  position: absolute;
  top: 10px;
  left: 70px;
  border-radius: 50%;
}
/*-- END CLOUD CONTROL ---*/

/*-- POLYGON CONTROL ---*/
.poly-container {
  position: absolute;
  bottom: -5px;
  left: 0;
  right: 0;
  z-index: -1;
}
.poly-container-left {
  position: absolute;
  left: 0;
  bottom: -10px;
  right: 0;
  z-index: 1;
}
.poly-container-right {
  position: absolute;
  left: 0;
  bottom: -10px;
  right: 0;
  z-index: 1;
}

.st0 {
  opacity: 0.15;
  fill: #ffffff;
}
.st1 {
  opacity: 0.5;
  fill: #ffffff;
}
.st2 {
  opacity: 0.4;
  fill: #ffffff;
}
.st3 {
  opacity: 0.7;
  fill: #ffffff;
}
.st4 {
  opacity: 0.2;
  fill: #ffffff;
}
.st5 {
  opacity: 0.6;
  fill: #ffffff;
}
.st6 {
  opacity: 0.1;
  fill: #ffffff;
}

@keyframes lightFlyOver {
  0% {
    fill: #fff;
  }
  20% {
    fill: #469689;
  }
  40% {
    fill: #fff;
  }
}
.poly-1,
.poly-2,
.poly-3,
.poly-4,
.poly-5,
.poly-6,
.poly-7,
.poly-8,
.poly-9,
.poly-10,
.poly-11,
.poly-12,
.poly-13,
.poly-14,
.poly-15,
.poly-16,
.poly-17,
.poly-18,
.poly-19,
.poly-20,
.poly-21,
.poly-22,
.poly-23,
.poly-24,
.poly-25 {
  transform: translateZ(0);
}
.poly-1:hover,
.poly-2:hover,
.poly-2:hover,
.poly-3:hover,
.poly-4:hover,
.poly-5:hover,
.poly-6:hover,
.poly-7:hover,
.poly-8:hover,
.poly-9:hover,
.poly-10:hover,
.poly-11:hover,
.poly-12:hover,
.poly-13:hover,
.poly-14:hover,
.poly-15:hover,
.poly-16:hover,
.poly-17:hover,
.poly-18:hover,
.poly-19:hover,
.poly-20:hover,
.poly-21:hover,
.poly-22:hover,
.poly-23:hover,
.poly-24:hover,
.poly-25:hover {
  fill: #67b1ad;
  opacity: 0.8;
  -webkit-transition-delay: 0.03s; /* Safari */
  transition-delay: 0.03s;
  transform: z(0);
}
.poly-1 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 5s; /* --- Matched up with delay of cloudContainer --- */
  animation-delay: 5;
}
.poly-2 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 6s; /* Chrome, Safari, Opera */
  animation-delay: 6s;
}
.poly-3 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 7s; /* Chrome, Safari, Opera */
  animation-delay: 7s;
}
.poly-4 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 8s; /* Chrome, Safari, Opera */
  animation-delay: 8s;
}
.poly-5 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 9s; /* Chrome, Safari, Opera */
  animation-delay: 9s;
}
.poly-6 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 10s; /* Chrome, Safari, Opera */
  animation-delay: 10s;
}
.poly-7 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 11s; /* Chrome, Safari, Opera */
  animation-delay: 11s;
}
.poly-8 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 12s; /* Chrome, Safari, Opera */
  animation-delay: 12s;
}
.poly-9 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 13s; /* Chrome, Safari, Opera */
  animation-delay: 13s;
}
.poly-10 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 14s; /* Chrome, Safari, Opera */
  animation-delay: 14s;
}
.poly-11 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 15s; /* Chrome, Safari, Opera */
  animation-delay: 15s;
}
.poly-12 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 16s; /* Chrome, Safari, Opera */
  animation-delay: 16s;
}
.poly-13 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 17s; /* Chrome, Safari, Opera */
  animation-delay: 17s;
}
.poly-14 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 18s; /* Chrome, Safari, Opera */
  animation-delay: 19s;
}
.poly-15 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 20s; /* Chrome, Safari, Opera */
  animation-delay: 20s;
}
.poly-16 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 21s; /* Chrome, Safari, Opera */
  animation-delay: 21s;
}
.poly-17 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 22s; /* Chrome, Safari, Opera */
  animation-delay: 22s;
}
.poly-18 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 23s; /* Chrome, Safari, Opera */
  animation-delay: 23s;
}
.poly-19 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 24s; /* Chrome, Safari, Opera */
  animation-delay: 24s;
}
.poly-20 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 25s; /* Chrome, Safari, Opera */
  animation-delay: 25s;
}
.poly-21 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 26s; /* Chrome, Safari, Opera */
  animation-delay: 26s;
}
.poly-22 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 25.5s; /* Chrome, Safari, Opera */
  animation-delay: 25.5s;
}
.poly-23 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 27s; /* Chrome, Safari, Opera */
  animation-delay: 27s;
}
.poly-24 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 28s; /* Chrome, Safari, Opera */
  animation-delay: 28s;
}
.poly-25 {
  animation: lightFlyOver 33s linear infinite;
  -webkit-animation-delay: 29s; /* Chrome, Safari, Opera */
  animation-delay: 29s;
}