#atmosphere-container {
  transform-origin: 0vh 100vw 101vh;
  transform-style: preserve-3d;
  position: absolute;
  bottom: 0px;
  left: 0px;
  animation-name: move-atmosphere;
  animation-duration: 180s;
  animation-iteration-count: infinite;
}

@keyframes move-atmosphere {
  from {
    transform: rotateX(-15deg) rotateY(0deg);
    opacity: 0;
  }
  to {
    transform: rotateX(-15deg) rotateY(-90deg);
    opacity: 0.5;
  }
}

section {
  z-index: 99
}
img#atmosphere {
  width: 10%;
  height: 10%;
  z-index: 3;
  animation-name: rotate-atmosphere;
  animation-duration: 180s;
  animation-iteration-count: infinite;
}

@keyframes rotate-atmosphere {
  from {
    transform: rotateZ(0deg);
  }
  to {
    transform: rotateZ(1080deg);
  }
}
#sun-gradient {
  position: absolute;
  right: 10vw;
  bottom: 35vh;
  width: 4.5vw;
  height: 8vh;
  animation-iteration-count: infinite;
  animation-direction: alternate-reverse;
  z-index: 1;
}
#sun-gradient.pattern1 {
  background: radial-gradient(white 0%, rgba(217, 224, 55, 0.7) 5%, rgba(255, 255, 255, 0) 15%);
  animation-name: inner-star-fade;
  animation-duration: 7s;
}
#sun-gradient.pattern2 {
  background: radial-gradient(white 0%, rgba(217, 224, 55, 0.3) 40%, rgba(255, 255, 255, 0) 70%);
  animation-name: outer-star-fade;
  animation-duration: 9s;
}
#sun-gradient.pattern3 {
  background: radial-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(217, 224, 55, 0.3) 20%, rgba(255, 255, 255, 0) 60%);
  animation-name: outer-star-fade;
  animation-duration: 7s;
}
#sun-gradient.vertical {
  height: 32vh;
  width: 2vw;
  bottom: 23.2vh;
  right: 11.25vw;
}
#sun-gradient.horizontal {
  height: 3vh;
  width: 17vw;
  bottom: 37.5vh;
  right: 3.7vw;
}

@keyframes outer-star-fade {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes inner-star-fade {
  from {
    opacity: 1;
  }
  to {
    opacity: 0.5;
  }
}
#island-gradient-outer {
  position: absolute;
  animation-name: island-gradient-fade;
  animation-iteration-count: infinite;
  animation-direction: alternate-reverse;
  animation-duration: 4s;
  background: radial-gradient(white -5%, #417c77 15%, rgba(255, 255, 255, 0) 55%);
}
#island-gradient-outer.fade-top {
  right: 20.2vw;
  top: -80vh;
  width: 3vw;
  height: 160vh;
}
#island-gradient-outer.fade-bottom {
  right: 20.2vw;
  bottom: -50vh;
  width: 3vw;
  height: 90vh;
}

#island-gradient-inner {
  position: absolute;
  animation-name: island-gradient-fade;
  animation-iteration-count: infinite;
  animation-direction: alternate-reverse;
  animation-duration: 4s;
  background: radial-gradient(white -5%, #417c77 20%, rgba(255, 255, 255, 0) 40%);
}
#island-gradient-inner.top {
  right: 21.2vw;
  top: -80vh;
  width: 1vw;
  height: 160vh;
}
#island-gradient-inner.bottom {
  right: 21.2vw;
  bottom: -50vh;
  width: 1vw;
  height: 90vh;
}

#island {
  position: absolute;
  right: 20.3vw;
  bottom: 32vh;
  width: 3vw;
  height: 3vw;
  z-index: 2;
}
#island img {
  width: 100%;
  height: 100%;
}
#island #reflect {
  position: absolute;
  left: 63%;
  top: 6%;
  width: 25%;
  height: 80%;
  animation-name: island-light-fade;
  animation-iteration-count: infinite;
  animation-direction: alternate-reverse;
  animation-duration: 7s;
  transform: rotate(-40deg);
  background: radial-gradient(white 0%, rgba(217, 224, 55, 0.3) 35%, rgba(255, 255, 255, 0) 70%);
}
#island #gradient-reflect {
  position: absolute;
  left: 18%;
  top: 7%;
  width: 60%;
  height: 30%;
  animation-name: island-gradient-fade;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: 4s;
  background: radial-gradient(rgba(255, 255, 255, 0.4) -5%, rgba(65, 124, 119, 0.3) 40%, rgba(255, 255, 255, 0) 80%);
}
#island #lights {
  position: absolute;
  animation-name: island-light-fade;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
#island #lights.first {
  left: 36%;
  top: 93%;
  width: 12%;
  height: 12%;
  animation-duration: 4s;
  background: radial-gradient(circle, white 0%, #37e0b5 20%, rgba(255, 255, 255, 0) 75%);
}
#island #lights.second {
  left: 54%;
  top: 91%;
  width: 10%;
  height: 10%;
  animation-duration: 7s;
  animation-delay: -2s;
  background: radial-gradient(circle, white 0%, #ce37e0 20%, rgba(255, 255, 255, 0) 75%);
}
#island #lights.third {
  left: 46%;
  top: 83%;
  width: 8%;
  height: 8%;
  animation-duration: 2s;
  animation-delay: -1s;
  background: radial-gradient(circle, white 0%, #3aad24 30%, rgba(255, 255, 255, 0) 75%);
}
#island #lights.fourth {
  left: 70%;
  top: 81%;
  width: 10%;
  height: 10%;
  animation-duration: 3s;
  animation-delay: -1s;
  background: radial-gradient(circle, white 0%, #1f43b1 10%, rgba(255, 255, 255, 0) 75%);
}
#island #lights.fifth {
  left: 27%;
  top: 86%;
  width: 8%;
  height: 8%;
  animation-duration: 5s;
  animation-delay: -4s;
  background: radial-gradient(circle, white 0%, #0ce6f5 40%, rgba(255, 255, 255, 0) 75%);
}

@keyframes island-light-fade {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes island-gradient-fade {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 0;
  }
}
.ring-container {
  position: absolute;
  width: 100%;
  height: 100%;
  top: -100px;
  animation-name: rotate-ring;
  animation-duration: 180s;
  animation-iteration-count: infinite;
  z-index: 1;
}

.ring-container:nth-child(1) {
  animation-delay: -120s;
  left: -13.3333333333%;
  transform-origin: -125% 250%;
}
.ring-container:nth-child(1) .rock-container .rock {
  animation-delay: -120s;
}

.ring-container:nth-child(2) {
  animation-delay: -96s;
  left: -8.6666666667%;
  transform-origin: -160% 250%;
}
.ring-container:nth-child(2) .rock-container .rock {
  animation-delay: -96s;
}

.ring-container:nth-child(3) {
  animation-delay: -156s;
  left: -3.3333333333%;
  transform-origin: -200% 250%;
}
.ring-container:nth-child(3) .rock-container .rock {
  animation-delay: -156s;
}

.ring-container:nth-child(4) {
  animation-delay: -72s;
  left: -14.6666666667%;
  transform-origin: -115% 250%;
}
.ring-container:nth-child(4) .rock-container .rock {
  animation-delay: -72s;
}

.ring-container:nth-child(5) {
  animation-delay: -174s;
  left: -1.3333333333%;
  transform-origin: -215% 250%;
}
.ring-container:nth-child(5) .rock-container .rock {
  animation-delay: -174s;
}

.ring-container:nth-child(6) {
  animation-delay: -54s;
  left: -0.6666666667%;
  transform-origin: -220% 250%;
}
.ring-container:nth-child(6) .rock-container .rock {
  animation-delay: -54s;
}

.ring-container:nth-child(7) {
  animation-delay: -42s;
  left: 1.3333333333%;
  transform-origin: -235% 250%;
}
.ring-container:nth-child(7) .rock-container .rock {
  animation-delay: -42s;
}

.ring-container:nth-child(8) {
  animation-delay: -126s;
  left: -4.6666666667%;
  transform-origin: -190% 250%;
}
.ring-container:nth-child(8) .rock-container .rock {
  animation-delay: -126s;
}

.ring-container:nth-child(9) {
  animation-delay: -174s;
  left: -5.3333333333%;
  transform-origin: -185% 250%;
}
.ring-container:nth-child(9) .rock-container .rock {
  animation-delay: -174s;
}

.ring-container:nth-child(10) {
  animation-delay: -30s;
  left: 0%;
  transform-origin: -225% 250%;
}
.ring-container:nth-child(10) .rock-container .rock {
  animation-delay: -30s;
}

.ring-container:nth-child(11) {
  animation-delay: -108s;
  left: -12.6666666667%;
  transform-origin: -130% 250%;
}
.ring-container:nth-child(11) .rock-container .rock {
  animation-delay: -108s;
}

.ring-container:nth-child(12) {
  animation-delay: -114s;
  left: -1.3333333333%;
  transform-origin: -215% 250%;
}
.ring-container:nth-child(12) .rock-container .rock {
  animation-delay: -114s;
}

.ring-container:nth-child(13) {
  animation-delay: -36s;
  left: -6.6666666667%;
  transform-origin: -175% 250%;
}
.ring-container:nth-child(13) .rock-container .rock {
  animation-delay: -36s;
}

.ring-container:nth-child(14) {
  animation-delay: -66s;
  left: -1.3333333333%;
  transform-origin: -215% 250%;
}
.ring-container:nth-child(14) .rock-container .rock {
  animation-delay: -66s;
}

.ring-container:nth-child(15) {
  animation-delay: -120s;
  left: -10.6666666667%;
  transform-origin: -145% 250%;
}
.ring-container:nth-child(15) .rock-container .rock {
  animation-delay: -120s;
}

.ring-container:nth-child(16) {
  animation-delay: -150s;
  left: 1.3333333333%;
  transform-origin: -235% 250%;
}
.ring-container:nth-child(16) .rock-container .rock {
  animation-delay: -150s;
}

.ring-container:nth-child(17) {
  animation-delay: -162s;
  left: -9.3333333333%;
  transform-origin: -155% 250%;
}
.ring-container:nth-child(17) .rock-container .rock {
  animation-delay: -162s;
}

.ring-container:nth-child(18) {
  animation-delay: -144s;
  left: -12.6666666667%;
  transform-origin: -130% 250%;
}
.ring-container:nth-child(18) .rock-container .rock {
  animation-delay: -144s;
}

.ring-container:nth-child(19) {
  animation-delay: -126s;
  left: -12%;
  transform-origin: -135% 250%;
}
.ring-container:nth-child(19) .rock-container .rock {
  animation-delay: -126s;
}

.ring-container:nth-child(20) {
  animation-delay: -156s;
  left: -14.6666666667%;
  transform-origin: -115% 250%;
}
.ring-container:nth-child(20) .rock-container .rock {
  animation-delay: -156s;
}

.ring-container:nth-child(21) {
  animation-delay: -114s;
  left: -16%;
  transform-origin: -105% 250%;
}
.ring-container:nth-child(21) .rock-container .rock {
  animation-delay: -114s;
}

.ring-container:nth-child(22) {
  animation-delay: -48s;
  left: -9.3333333333%;
  transform-origin: -155% 250%;
}
.ring-container:nth-child(22) .rock-container .rock {
  animation-delay: -48s;
}

.ring-container:nth-child(23) {
  animation-delay: -168s;
  left: -2%;
  transform-origin: -210% 250%;
}
.ring-container:nth-child(23) .rock-container .rock {
  animation-delay: -168s;
}

.ring-container:nth-child(24) {
  animation-delay: -174s;
  left: 0%;
  transform-origin: -225% 250%;
}
.ring-container:nth-child(24) .rock-container .rock {
  animation-delay: -174s;
}

.ring-container:nth-child(25) {
  animation-delay: -78s;
  left: -4%;
  transform-origin: -195% 250%;
}
.ring-container:nth-child(25) .rock-container .rock {
  animation-delay: -78s;
}

.ring-container:nth-child(26) {
  animation-delay: -30s;
  left: 1.3333333333%;
  transform-origin: -235% 250%;
}
.ring-container:nth-child(26) .rock-container .rock {
  animation-delay: -30s;
}

.ring-container:nth-child(27) {
  animation-delay: -168s;
  left: -16%;
  transform-origin: -105% 250%;
}
.ring-container:nth-child(27) .rock-container .rock {
  animation-delay: -168s;
}

.ring-container:nth-child(28) {
  animation-delay: -162s;
  left: -1.3333333333%;
  transform-origin: -215% 250%;
}
.ring-container:nth-child(28) .rock-container .rock {
  animation-delay: -162s;
}

.ring-container:nth-child(29) {
  animation-delay: -30s;
  left: -12.6666666667%;
  transform-origin: -130% 250%;
}
.ring-container:nth-child(29) .rock-container .rock {
  animation-delay: -30s;
}

.ring-container:nth-child(30) {
  animation-delay: -126s;
  left: -11.3333333333%;
  transform-origin: -140% 250%;
}
.ring-container:nth-child(30) .rock-container .rock {
  animation-delay: -126s;
}

.ring-container:nth-child(31) {
  animation-delay: -144s;
  left: -11.3333333333%;
  transform-origin: -140% 250%;
}
.ring-container:nth-child(31) .rock-container .rock {
  animation-delay: -144s;
}

.ring-container:nth-child(32) {
  animation-delay: -90s;
  left: -5.3333333333%;
  transform-origin: -185% 250%;
}
.ring-container:nth-child(32) .rock-container .rock {
  animation-delay: -90s;
}

.ring-container:nth-child(33) {
  animation-delay: -144s;
  left: -3.3333333333%;
  transform-origin: -200% 250%;
}
.ring-container:nth-child(33) .rock-container .rock {
  animation-delay: -144s;
}

.ring-container:nth-child(34) {
  animation-delay: -174s;
  left: -0.6666666667%;
  transform-origin: -220% 250%;
}
.ring-container:nth-child(34) .rock-container .rock {
  animation-delay: -174s;
}

.ring-container:nth-child(35) {
  animation-delay: -132s;
  left: -12.6666666667%;
  transform-origin: -130% 250%;
}
.ring-container:nth-child(35) .rock-container .rock {
  animation-delay: -132s;
}

.ring-container:nth-child(36) {
  animation-delay: -78s;
  left: -11.3333333333%;
  transform-origin: -140% 250%;
}
.ring-container:nth-child(36) .rock-container .rock {
  animation-delay: -78s;
}

.ring-container:nth-child(37) {
  animation-delay: -102s;
  left: -7.3333333333%;
  transform-origin: -170% 250%;
}
.ring-container:nth-child(37) .rock-container .rock {
  animation-delay: -102s;
}

.ring-container:nth-child(38) {
  animation-delay: -30s;
  left: -16%;
  transform-origin: -105% 250%;
}
.ring-container:nth-child(38) .rock-container .rock {
  animation-delay: -30s;
}

.ring-container:nth-child(39) {
  animation-delay: -102s;
  left: -8%;
  transform-origin: -165% 250%;
}
.ring-container:nth-child(39) .rock-container .rock {
  animation-delay: -102s;
}

.ring-container:nth-child(40) {
  animation-delay: -174s;
  left: -0.6666666667%;
  transform-origin: -220% 250%;
}
.ring-container:nth-child(40) .rock-container .rock {
  animation-delay: -174s;
}

.ring-container:nth-child(41) {
  animation-delay: -96s;
  left: 0.6666666667%;
  transform-origin: -230% 250%;
}
.ring-container:nth-child(41) .rock-container .rock {
  animation-delay: -96s;
}

.ring-container:nth-child(42) {
  animation-delay: -132s;
  left: -4%;
  transform-origin: -195% 250%;
}
.ring-container:nth-child(42) .rock-container .rock {
  animation-delay: -132s;
}

.ring-container:nth-child(43) {
  animation-delay: -138s;
  left: -8.6666666667%;
  transform-origin: -160% 250%;
}
.ring-container:nth-child(43) .rock-container .rock {
  animation-delay: -138s;
}

.ring-container:nth-child(44) {
  animation-delay: -180s;
  left: 3.3333333333%;
  transform-origin: -250% 250%;
}
.ring-container:nth-child(44) .rock-container .rock {
  animation-delay: -180s;
}

.ring-container:nth-child(45) {
  animation-delay: -138s;
  left: -10.6666666667%;
  transform-origin: -145% 250%;
}
.ring-container:nth-child(45) .rock-container .rock {
  animation-delay: -138s;
}

.ring-container:nth-child(46) {
  animation-delay: -144s;
  left: -13.3333333333%;
  transform-origin: -125% 250%;
}
.ring-container:nth-child(46) .rock-container .rock {
  animation-delay: -144s;
}

.ring-container:nth-child(47) {
  animation-delay: -84s;
  left: -6%;
  transform-origin: -180% 250%;
}
.ring-container:nth-child(47) .rock-container .rock {
  animation-delay: -84s;
}

.ring-container:nth-child(48) {
  animation-delay: -150s;
  left: -12%;
  transform-origin: -135% 250%;
}
.ring-container:nth-child(48) .rock-container .rock {
  animation-delay: -150s;
}

.ring-container:nth-child(49) {
  animation-delay: -54s;
  left: -2.6666666667%;
  transform-origin: -205% 250%;
}
.ring-container:nth-child(49) .rock-container .rock {
  animation-delay: -54s;
}

.ring-container:nth-child(50) {
  animation-delay: -18s;
  left: -12.6666666667%;
  transform-origin: -130% 250%;
}
.ring-container:nth-child(50) .rock-container .rock {
  animation-delay: -18s;
}

.ring-container:nth-child(51) {
  animation-delay: -42s;
  left: -14%;
  transform-origin: -120% 250%;
}
.ring-container:nth-child(51) .rock-container .rock {
  animation-delay: -42s;
}

.ring-container:nth-child(52) {
  animation-delay: -156s;
  left: -0.6666666667%;
  transform-origin: -220% 250%;
}
.ring-container:nth-child(52) .rock-container .rock {
  animation-delay: -156s;
}

.ring-container:nth-child(53) {
  animation-delay: -72s;
  left: -12%;
  transform-origin: -135% 250%;
}
.ring-container:nth-child(53) .rock-container .rock {
  animation-delay: -72s;
}

.ring-container:nth-child(54) {
  animation-delay: -12s;
  left: -5.3333333333%;
  transform-origin: -185% 250%;
}
.ring-container:nth-child(54) .rock-container .rock {
  animation-delay: -12s;
}

.ring-container:nth-child(55) {
  animation-delay: -108s;
  left: -14.6666666667%;
  transform-origin: -115% 250%;
}
.ring-container:nth-child(55) .rock-container .rock {
  animation-delay: -108s;
}

.ring-container:nth-child(56) {
  animation-delay: -138s;
  left: 3.3333333333%;
  transform-origin: -250% 250%;
}
.ring-container:nth-child(56) .rock-container .rock {
  animation-delay: -138s;
}

.ring-container:nth-child(57) {
  animation-delay: -144s;
  left: -5.3333333333%;
  transform-origin: -185% 250%;
}
.ring-container:nth-child(57) .rock-container .rock {
  animation-delay: -144s;
}

.ring-container:nth-child(58) {
  animation-delay: -12s;
  left: 0.6666666667%;
  transform-origin: -230% 250%;
}
.ring-container:nth-child(58) .rock-container .rock {
  animation-delay: -12s;
}

.ring-container:nth-child(59) {
  animation-delay: -96s;
  left: -4.6666666667%;
  transform-origin: -190% 250%;
}
.ring-container:nth-child(59) .rock-container .rock {
  animation-delay: -96s;
}

.ring-container:nth-child(60) {
  animation-delay: -54s;
  left: -8%;
  transform-origin: -165% 250%;
}
.ring-container:nth-child(60) .rock-container .rock {
  animation-delay: -54s;
}

.ring-container:nth-child(61) {
  animation-delay: -72s;
  left: -7.3333333333%;
  transform-origin: -170% 250%;
}
.ring-container:nth-child(61) .rock-container .rock {
  animation-delay: -72s;
}

.ring-container:nth-child(62) {
  animation-delay: -138s;
  left: -2.6666666667%;
  transform-origin: -205% 250%;
}
.ring-container:nth-child(62) .rock-container .rock {
  animation-delay: -138s;
}

.ring-container:nth-child(63) {
  animation-delay: -66s;
  left: -2%;
  transform-origin: -210% 250%;
}
.ring-container:nth-child(63) .rock-container .rock {
  animation-delay: -66s;
}

.ring-container:nth-child(64) {
  animation-delay: -114s;
  left: 2.6666666667%;
  transform-origin: -245% 250%;
}
.ring-container:nth-child(64) .rock-container .rock {
  animation-delay: -114s;
}

.ring-container:nth-child(65) {
  animation-delay: -96s;
  left: -10%;
  transform-origin: -150% 250%;
}
.ring-container:nth-child(65) .rock-container .rock {
  animation-delay: -96s;
}

.ring-container:nth-child(66) {
  animation-delay: -78s;
  left: -7.3333333333%;
  transform-origin: -170% 250%;
}
.ring-container:nth-child(66) .rock-container .rock {
  animation-delay: -78s;
}

.ring-container:nth-child(67) {
  animation-delay: -42s;
  left: 2.6666666667%;
  transform-origin: -245% 250%;
}
.ring-container:nth-child(67) .rock-container .rock {
  animation-delay: -42s;
}

.ring-container:nth-child(68) {
  animation-delay: -168s;
  left: 0.6666666667%;
  transform-origin: -230% 250%;
}
.ring-container:nth-child(68) .rock-container .rock {
  animation-delay: -168s;
}

.ring-container:nth-child(69) {
  animation-delay: -138s;
  left: -6.6666666667%;
  transform-origin: -175% 250%;
}
.ring-container:nth-child(69) .rock-container .rock {
  animation-delay: -138s;
}

.ring-container:nth-child(70) {
  animation-delay: -102s;
  left: 0.6666666667%;
  transform-origin: -230% 250%;
}
.ring-container:nth-child(70) .rock-container .rock {
  animation-delay: -102s;
}

.ring-container:nth-child(71) {
  animation-delay: -102s;
  left: 0.6666666667%;
  transform-origin: -230% 250%;
}
.ring-container:nth-child(71) .rock-container .rock {
  animation-delay: -102s;
}

.ring-container:nth-child(72) {
  animation-delay: -156s;
  left: -3.3333333333%;
  transform-origin: -200% 250%;
}
.ring-container:nth-child(72) .rock-container .rock {
  animation-delay: -156s;
}

.ring-container:nth-child(73) {
  animation-delay: -84s;
  left: -10%;
  transform-origin: -150% 250%;
}
.ring-container:nth-child(73) .rock-container .rock {
  animation-delay: -84s;
}

.ring-container:nth-child(74) {
  animation-delay: -162s;
  left: -2.6666666667%;
  transform-origin: -205% 250%;
}
.ring-container:nth-child(74) .rock-container .rock {
  animation-delay: -162s;
}

.ring-container:nth-child(75) {
  animation-delay: -150s;
  left: -2%;
  transform-origin: -210% 250%;
}
.ring-container:nth-child(75) .rock-container .rock {
  animation-delay: -150s;
}

.ring-container:nth-child(76) {
  animation-delay: -54s;
  left: -0.6666666667%;
  transform-origin: -220% 250%;
}
.ring-container:nth-child(76) .rock-container .rock {
  animation-delay: -54s;
}

.ring-container:nth-child(77) {
  animation-delay: -174s;
  left: -16%;
  transform-origin: -105% 250%;
}
.ring-container:nth-child(77) .rock-container .rock {
  animation-delay: -174s;
}

.ring-container:nth-child(78) {
  animation-delay: -138s;
  left: -10.6666666667%;
  transform-origin: -145% 250%;
}
.ring-container:nth-child(78) .rock-container .rock {
  animation-delay: -138s;
}

.ring-container:nth-child(79) {
  animation-delay: -156s;
  left: 2%;
  transform-origin: -240% 250%;
}
.ring-container:nth-child(79) .rock-container .rock {
  animation-delay: -156s;
}

.ring-container:nth-child(80) {
  animation-delay: -54s;
  left: -0.6666666667%;
  transform-origin: -220% 250%;
}
.ring-container:nth-child(80) .rock-container .rock {
  animation-delay: -54s;
}

.ring-container:nth-child(81) {
  animation-delay: -156s;
  left: -10%;
  transform-origin: -150% 250%;
}
.ring-container:nth-child(81) .rock-container .rock {
  animation-delay: -156s;
}

.ring-container:nth-child(82) {
  animation-delay: -156s;
  left: -12%;
  transform-origin: -135% 250%;
}
.ring-container:nth-child(82) .rock-container .rock {
  animation-delay: -156s;
}

.ring-container:nth-child(83) {
  animation-delay: -180s;
  left: -16%;
  transform-origin: -105% 250%;
}
.ring-container:nth-child(83) .rock-container .rock {
  animation-delay: -180s;
}

.ring-container:nth-child(84) {
  animation-delay: -18s;
  left: -14%;
  transform-origin: -120% 250%;
}
.ring-container:nth-child(84) .rock-container .rock {
  animation-delay: -18s;
}

.ring-container:nth-child(85) {
  animation-delay: -138s;
  left: 3.3333333333%;
  transform-origin: -250% 250%;
}
.ring-container:nth-child(85) .rock-container .rock {
  animation-delay: -138s;
}

.ring-container:nth-child(86) {
  animation-delay: -180s;
  left: 2%;
  transform-origin: -240% 250%;
}
.ring-container:nth-child(86) .rock-container .rock {
  animation-delay: -180s;
}

.ring-container:nth-child(87) {
  animation-delay: -30s;
  left: -4.6666666667%;
  transform-origin: -190% 250%;
}
.ring-container:nth-child(87) .rock-container .rock {
  animation-delay: -30s;
}

.ring-container:nth-child(88) {
  animation-delay: -180s;
  left: -9.3333333333%;
  transform-origin: -155% 250%;
}
.ring-container:nth-child(88) .rock-container .rock {
  animation-delay: -180s;
}

.ring-container:nth-child(89) {
  animation-delay: -144s;
  left: -6%;
  transform-origin: -180% 250%;
}
.ring-container:nth-child(89) .rock-container .rock {
  animation-delay: -144s;
}

.ring-container:nth-child(90) {
  animation-delay: -102s;
  left: -10.6666666667%;
  transform-origin: -145% 250%;
}
.ring-container:nth-child(90) .rock-container .rock {
  animation-delay: -102s;
}

.ring-container:nth-child(91) {
  animation-delay: -108s;
  left: 2%;
  transform-origin: -240% 250%;
}
.ring-container:nth-child(91) .rock-container .rock {
  animation-delay: -108s;
}

.ring-container:nth-child(92) {
  animation-delay: -48s;
  left: -12.6666666667%;
  transform-origin: -130% 250%;
}
.ring-container:nth-child(92) .rock-container .rock {
  animation-delay: -48s;
}

.ring-container:nth-child(93) {
  animation-delay: -48s;
  left: 2.6666666667%;
  transform-origin: -245% 250%;
}
.ring-container:nth-child(93) .rock-container .rock {
  animation-delay: -48s;
}

.ring-container:nth-child(94) {
  animation-delay: -180s;
  left: 2.6666666667%;
  transform-origin: -245% 250%;
}
.ring-container:nth-child(94) .rock-container .rock {
  animation-delay: -180s;
}

.ring-container:nth-child(95) {
  animation-delay: -54s;
  left: -10.6666666667%;
  transform-origin: -145% 250%;
}
.ring-container:nth-child(95) .rock-container .rock {
  animation-delay: -54s;
}

.ring-container:nth-child(96) {
  animation-delay: -6s;
  left: 1.3333333333%;
  transform-origin: -235% 250%;
}
.ring-container:nth-child(96) .rock-container .rock {
  animation-delay: -6s;
}

.ring-container:nth-child(97) {
  animation-delay: -18s;
  left: -8.6666666667%;
  transform-origin: -160% 250%;
}
.ring-container:nth-child(97) .rock-container .rock {
  animation-delay: -18s;
}

.ring-container:nth-child(98) {
  animation-delay: -54s;
  left: 1.3333333333%;
  transform-origin: -235% 250%;
}
.ring-container:nth-child(98) .rock-container .rock {
  animation-delay: -54s;
}

.ring-container:nth-child(99) {
  animation-delay: -138s;
  left: -2%;
  transform-origin: -210% 250%;
}
.ring-container:nth-child(99) .rock-container .rock {
  animation-delay: -138s;
}

.ring-container:nth-child(100) {
  animation-delay: -102s;
  left: -4.6666666667%;
  transform-origin: -190% 250%;
}
.ring-container:nth-child(100) .rock-container .rock {
  animation-delay: -102s;
}

@keyframes vanish {
  from {
    transform: translateZ(-900px);
  }
  to {
    transform: translateZ(-14000px);
  }
}
@keyframes rotate-ring {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(22deg);
  }
}
.rock-container {
  backface-visibility: visible;
  transform-style: preserve-3d;
  perspective: 250px;
}

img.rock {
  animation-name: vanish;
  animation-duration: 180s;
  animation-iteration-count: infinite;
}

/* CHANGES */
header {
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  background-color: #000000;
  padding-bottom: 100vh;
}

body {
  overflow-x: hidden;
}

main {
  position: absolute;
  z-index: 99;
  width: 100%;
  background-color: white;
}

/* END CHANGES */

img#background {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  z-index: 0;
}

img#planet {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 60%;
  z-index: 2;
}

div#planetglow {
  background: radial-gradient(white 65%, rgba(237, 240, 165, 0.3) 66%, rgba(255, 255, 255, 0) 67%);
  position: absolute;
  bottom: -91vw;
  left: -82.6vw;
  width: 150vw;
  height: 150vw;
  z-index: 1;
  animation-name: outer-star-fade;
  animation-duration: 7s;
  animation-iteration-count: infinite;
  animation-direction: alternate-reverse;
}

img#creatures {
  position: absolute;
  bottom: 0px;
  left: 0px;
  z-index: 4;
  width: 43%;
}

/*# sourceMappingURL=newsite/space.css.map */