/*
This file is used to contain all abstracts imports.
Files inside this folder can contain abstract settings, helpers or functions. They have no direct output.
*/
*:not(html):not(head):not(body):not(script):not(link):not(style):not(meta), .side-info-container .side-box .side-info-img {
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  /* NEW, Spec - Firefox, Chrome, Opera */
}

.modal1-container, .modal2-container, .modal2-container .modal2, .modal2-container .modal2 .second-row img, .side-info-container .side-box .side-info-img, .side-info-container .side-box .mini-athmosphere .elev-icon-container .elevator-icon, .side-info-container .side-box .mini-athmosphere .boxes .box-1, .side-info-container .side-box .mini-athmosphere .boxes .box-2, .side-info-container .side-box .mini-athmosphere .boxes .box-3, .side-info-container .side-box .mini-athmosphere .boxes .box-4, .side-info-container .side-box .mini-athmosphere .boxes .box-5, .side-info-container .side-box .mini-athmosphere .boxes .box-6, main .elevator-div, main .elevator-div .elevator-container .elevator, main .athmosphere .stratosphere .bird-container .bird, main .athmosphere .stratosphere .plane-container .plane, main .athmosphere .stratosphere .baloon-container .baloon, main .athmosphere .mesosphere .meteor-container .meteor, main .athmosphere .thermosphere .stars1, main .athmosphere .thermosphere .aurora-container, main .athmosphere .thermosphere .aurora-container .aurora-bg1, main .athmosphere .thermosphere .aurora-container .aurora-bg11, main .athmosphere .thermosphere .aurora-container .aurora-bg2, main .athmosphere .thermosphere .aurora-container .aurora-bg22, main .athmosphere .thermosphere .aurora-container .aurora-front1, main .athmosphere .thermosphere .aurora-container .aurora-front11, main .athmosphere .thermosphere .aurora-container .aurora-front2, main .athmosphere .thermosphere .aurora-container .aurora-front22, main .athmosphere .thermosphere .iss-container .iss, main .athmosphere .stars, main .athmosphere .exosphere .satellite-container .satellite, main .athmosphere .space .spy-sat-container .spy-sat, main .athmosphere .geo-orbit .space-station-container .space-station {
  width: 100%;
}

.modal1-container, .modal2-container, .modal2-container .modal2, .modal2-container .modal2 .second-row img, .side-info-container, .side-info-container .side-box .side-info-img, .side-info-container .side-box .mini-athmosphere .elev-icon-container .elevator-icon, main .elevator-div .elevator-container .elevator, main .athmosphere .stratosphere .bird-container .bird, main .athmosphere .stratosphere .plane-container .plane, main .athmosphere .stratosphere .baloon-container .baloon, main .athmosphere .mesosphere .meteor-container .meteor, main .athmosphere .thermosphere .aurora-container .aurora-bg1, main .athmosphere .thermosphere .aurora-container .aurora-bg11, main .athmosphere .thermosphere .aurora-container .aurora-bg2, main .athmosphere .thermosphere .aurora-container .aurora-bg22, main .athmosphere .thermosphere .aurora-container .aurora-front1, main .athmosphere .thermosphere .aurora-container .aurora-front11, main .athmosphere .thermosphere .aurora-container .aurora-front2, main .athmosphere .thermosphere .aurora-container .aurora-front22, main .athmosphere .thermosphere .iss-container .iss, main .athmosphere .exosphere .satellite-container .satellite, main .athmosphere .space .spy-sat-container .spy-sat, main .athmosphere .geo-orbit .space-station-container .space-station {
  height: 100%;
}

.modal1-container, .modal2-container, .modal2-container .modal2, .header, .header .info-container, .header .info-container .info, .side-info-container .vertical-text, main .info-arrow {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.header .info-container .aditional-info, .side-info-container, .side-info-container .side-box, main .athmosphere .stratosphere .bird-container, main .athmosphere .stratosphere .plane-container, main .athmosphere .stratosphere .baloon-container, main .athmosphere .mesosphere .meteor-container {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.modal1-container .modal1 .button-modal1, .modal2-container .modal2 .button2, .header .info-container .small-info, main .athmosphere .troposphere, main .athmosphere .mesosphere, main .athmosphere .geo-orbit {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.header .info-container .bckg, .header .info-container .headline-img, .side-info-container .side-box .mini-athmosphere, .side-info-container .vertical-text, main .info-arrow, main .info-arrow span, main .elevator-div, main .elevator-div .tether, main .athmosphere .troposphere .sun-reflection, main .athmosphere .troposphere .clouds1, main .athmosphere .troposphere .ground-station, main .athmosphere .troposphere .elevator-trigger1, main .athmosphere .stratosphere .clouds2, main .athmosphere .stratosphere .bird-container, main .athmosphere .stratosphere .plane-container, main .athmosphere .stratosphere .baloon-container, main .athmosphere .mesosphere .meteor-container, main .athmosphere .mesosphere .aurora-trigger, main .athmosphere .mesosphere .aurora-text, main .athmosphere .thermosphere .stars1, main .athmosphere .thermosphere .aurora-container, main .athmosphere .thermosphere .aurora-container .aurora-bg1, main .athmosphere .thermosphere .aurora-container .aurora-bg11, main .athmosphere .thermosphere .aurora-container .aurora-bg2, main .athmosphere .thermosphere .aurora-container .aurora-bg22, main .athmosphere .thermosphere .aurora-container .aurora-front1, main .athmosphere .thermosphere .aurora-container .aurora-front11, main .athmosphere .thermosphere .aurora-container .aurora-front2, main .athmosphere .thermosphere .aurora-container .aurora-front22, main .athmosphere .thermosphere .iss-trigger, main .athmosphere .thermosphere .iss-container, main .athmosphere .exosphere .satellite-container, main .athmosphere .exosphere .sat-trigger, main .athmosphere .space .spy-sat-container, main .athmosphere .space .spy-sat-trigger, main .athmosphere .geo-orbit .space-station-container {
  position: absolute;
}

.side-info-container .side-box, main, main .info-arrow .arrow-img, main .athmosphere .troposphere, main .athmosphere .stratosphere, main .athmosphere .mesosphere, main .athmosphere .thermosphere, main .athmosphere .exosphere, main .athmosphere .space, main .athmosphere .geo-orbit {
  position: relative;
}

.modal1-container, .modal2-container, .header, .side-info-container, main .athmosphere .troposphere #sun, main .athmosphere .troposphere #sun2 {
  position: fixed;
}

.header, .side-info-container, main {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

main .athmosphere .troposphere {
  /* FF3.6-15 */
  /* Chrome10-25,Safari5.1-6 */
  background: -webkit-gradient(linear, left top, left bottom, from(#7eb0d5), color-stop(50%, #bdcbcc), color-stop(51%, #bccbc8), color-stop(57%, #c5ccc4), color-stop(61%, #c9cbbe), color-stop(70%, #cecbbc), color-stop(77%, #d8b78e), color-stop(81%, #ceba99), color-stop(83%, #b5b09d), color-stop(87%, #769aaa), color-stop(90%, #4e8cb3), color-stop(94%, #4d8cc1), to(#518dcb));
  background: linear-gradient(to bottom, #7eb0d5 0%, #bdcbcc 50%, #bccbc8 51%, #c5ccc4 57%, #c9cbbe 61%, #cecbbc 70%, #d8b78e 77%, #ceba99 81%, #b5b09d 83%, #769aaa 87%, #4e8cb3 90%, #4d8cc1 94%, #518dcb 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

main .athmosphere .stratosphere {
  background: -webkit-gradient(linear, left top, left bottom, from(#7899b8), to(#7fafd3));
  background: linear-gradient(to bottom, #7899b8 0%, #7fafd3 100%);
}

main .athmosphere .mesosphere {
  background: -webkit-gradient(linear, left top, left bottom, from(#3b4c77), to(#7899b8));
  background: linear-gradient(to bottom, #3b4c77 0%, #7899b8 100%);
}

main .athmosphere .thermosphere {
  background: -webkit-gradient(linear, left top, left bottom, from(#0d0f24), to(#3b4c77));
  background: linear-gradient(to bottom, #0d0f24 0%, #3b4c77 100%);
}

main .athmosphere .exosphere {
  background: -webkit-gradient(linear, left top, left bottom, from(#050811), to(#0d0f24));
  background: linear-gradient(to bottom, #050811 0%, #0d0f24 100%);
}

main .athmosphere .space {
  background: #05050f;
  /* Old browsers */
  background: -webkit-gradient(linear, left top, left bottom, from(#05050f), to(#050811));
  background: linear-gradient(to bottom, #05050f 0%, #050811 100%);
}

main .athmosphere .geo-orbit {
  background: #06050b;
  /* Old browsers */
  background: -webkit-gradient(linear, left top, left bottom, from(#06050b), to(#05050f));
  background: linear-gradient(to bottom, #06050b 0%, #05050f 100%);
}

/*
This file is used to contain all base imports.
Files inside this folder can contain global styles used in the project.
*/
*:not(head) {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  padding: 0;
  text-decoration: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

input, button, form, fieldset {
  display: block;
}

link:hover {
  cursor: pointer;
}

:-webkit-any-link {
  color: inherit;
}

:-moz-any-link {
  color: inherit;
}

:any-link {
  color: inherit;
}

a:visited, a:active {
  color: inherit;
  text-decoration: none;
}

/*
This file is used to contain all component imports.
Files inside this folder should contain all styles relating to a reusable component.
*/
.modal1-container .modal1 .button-modal1 #modal1btn, .modal2-container .modal2 .button2 button, .header .info-container .small-info button, .header .info-container .exit-info-btn .exit-btn {
  padding: 0.4em 1.5em;
  background: rgba(88, 88, 88, 0.8);
  color: #bd9d78;
  border: solid 1px #bd9d78;
  cursor: pointer;
  text-transform: uppercase;
  font-size: 0.9em;
  font-weight: 400;
  width: auto;
}

.modal1-container .modal1 .button-modal1 #modal1btn:hover, .modal2-container .modal2 .button2 button:hover, .header .info-container .small-info button:hover, .header .info-container .exit-info-btn .exit-btn:hover {
  background: rgba(63, 63, 63, 0.8);
  -webkit-transition: background-color 1s;
  transition: background-color 1s;
}

.modal1-container {
  -webkit-animation: modal-bg 5s linear forwards;
  animation: modal-bg 5s linear forwards;
  top: 0;
  z-index: 12;
  display: none;
}

@-webkit-keyframes modal-bg {
  0% {
    background: #111010;
  }
  70% {
    background: #111010;
  }
  100% {
    background: rgba(88, 88, 88, 0.6);
  }
}

@keyframes modal-bg {
  0% {
    background: #111010;
  }
  70% {
    background: #111010;
  }
  100% {
    background: rgba(88, 88, 88, 0.6);
  }
}

.modal1-container .modal1 {
  max-width: 1000px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-preferred-size: 45%;
      flex-basis: 45%;
  background: rgba(56, 56, 56, 0.8);
  color: #bd9d78;
  padding: 8vh 4vh;
}

@media screen and (max-width: 900px) {
  .modal1-container .modal1 {
    font-size: 3.8vh;
    -ms-flex-preferred-size: auto;
        flex-basis: auto;
    padding: 8vh 10vh;
  }
}

.modal1-container .modal1 .first-p {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  display: block;
}

.modal1-container .modal1 .first-p a {
  display: inline-block;
  color: #ac8456;
}

.modal1-container .modal1 .second-row {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1vh 0;
}

.modal1-container .modal1 .second-row img {
  width: 7%;
}

.modal1-container .modal1 .second-row .second-p {
  margin: 0 0 0 5%;
}

.modal2-container {
  -webkit-animation: modal-bg 4s linear reverse forwards;
  animation: modal-bg 4s linear reverse forwards;
  top: 0;
  z-index: 14;
  display: none;
}

@-webkit-keyframes modal-bg {
  0% {
    background: #111010;
  }
  70% {
    background: #111010;
  }
  100% {
    background: rgba(88, 88, 88, 0.6);
  }
}

@keyframes modal-bg {
  0% {
    background: #111010;
  }
  70% {
    background: #111010;
  }
  100% {
    background: rgba(88, 88, 88, 0.6);
  }
}

@media screen and (max-width: 470px) {
  .modal2-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.modal2-container .modal2 {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background: rgba(56, 56, 56, 0.8);
  color: #bd9d78;
  padding: 8vh 4vh;
}

.modal2-container .modal2 .first-p {
  text-align: center;
  padding: 0 0 6vh 0;
}

.modal2-container .modal2 .second-row {
  width: 45%;
}

.modal2-container .modal2 .second-row img {
  -webkit-animation: phone 3s ease-in-out infinite;
  animation: phone 3s ease-in-out infinite;
  -webkit-transform-origin: 50% 50%;
  -khtml-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

@-webkit-keyframes phone {
  0% {
    -webkit-transform: rotate(0deg);
    -khtml-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  20% {
    -webkit-transform: rotate(-90deg);
    -khtml-transform: rotate(-90deg);
    transform: rotate(-90deg);
  }
  80% {
    -webkit-transform: rotate(-90deg);
    -khtml-transform: rotate(-90deg);
    transform: rotate(-90deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -khtml-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes phone {
  0% {
    -webkit-transform: rotate(0deg);
    -khtml-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  20% {
    -webkit-transform: rotate(-90deg);
    -khtml-transform: rotate(-90deg);
    transform: rotate(-90deg);
  }
  80% {
    -webkit-transform: rotate(-90deg);
    -khtml-transform: rotate(-90deg);
    transform: rotate(-90deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -khtml-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/*
This file is used to contain all component imports.
Files inside this folder can contain specific element styles and layout. 
*/
html .disable-scroll {
  overflow: hidden;
}

html body {
  font-family: "Open Sans";
  overflow-x: hidden;
}

html body .visible {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

html body .hidden {
  display: none !important;
}

html body .info-visible {
  visibility: visible !important;
}

.hide-header {
  -webkit-transform: translate(0, -100%);
          transform: translate(0, -100%);
}

.header {
  -webkit-transition: transform 1.3s ease-in-out;
  -webkit-transition: -webkit-transform 1.3s ease-in-out;
  transition: -webkit-transform 1.3s ease-in-out;
  transition: transform 1.3s ease-in-out;
  transition: transform 1.3s ease-in-out, -webkit-transform 1.3s ease-in-out;
  width: 100%;
  z-index: 10;
}

.header .info-container {
  color: #bd9d78;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-preferred-size: 136em;
      flex-basis: 136em;
  height: 13.5vh;
}

@media screen and (max-width: 2560px) {
  .header .info-container {
    padding: 0 11vw;
    height: 15.5vh;
  }
}

@media screen and (max-width: 1920px) {
  .header .info-container {
    padding: 0 calc(90px + 10vh);
    -ms-flex-preferred-size: 96em;
        flex-basis: 96em;
  }
}

@media screen and (max-width: 1600px) {
  .header .info-container {
    padding: 0 calc(90px + 12vh);
  }
}

.header .info-container .info-h2 {
  display: none;
}

@media screen and (max-width: 900px) {
  .header .info-container .info-h2 {
    position: absolute;
    top: 12%;
    left: auto;
    font-size: calc(9px + 0.4vw);
    font-weight: 300;
  }
}

.header .info-container .bckg {
  top: -2px;
  left: auto;
  right: auto;
  bottom: 0;
  height: 100%;
  width: 79%;
  z-index: -2;
}

@media screen and (max-width: 1600px) {
  .header .info-container .bckg {
    width: 95vw;
  }
}

@media screen and (max-width: 1024px) {
  .header .info-container .bckg {
    width: 85vw;
  }
}

.header .info-container .show-head-img {
  -webkit-animation: h2line 2s ease-in-out forwards;
  animation: h2line 2s ease-in-out forwards;
  visibility: visible !important;
}

@-webkit-keyframes h2line {
  0% {
    -webkit-transform: scale(0, 1);
    -khtml-transform: scale(0, 1);
    transform: scale(0, 1);
  }
  100% {
    -webkit-transform: scale(1, 1);
    -khtml-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}

@keyframes h2line {
  0% {
    -webkit-transform: scale(0, 1);
    -khtml-transform: scale(0, 1);
    transform: scale(0, 1);
  }
  100% {
    -webkit-transform: scale(1, 1);
    -khtml-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}

.header .info-container .headline-img {
  visibility: hidden;
  width: calc(9px + 21.4vh);
  top: 2vh;
  z-index: -1;
}

@media screen and (max-width: 2560px) {
  .header .info-container .headline-img {
    top: 1.7em;
  }
}

@media screen and (max-width: 1440px) {
  .header .info-container .headline-img {
    top: 1.5em;
    width: 17em;
    line-height: 69%;
  }
}

@media screen and (max-width: 900px) {
  .header .info-container .headline-img {
    height: auto;
    line-height: auto;
    width: 42vw;
    top: 1.3em;
  }
}

.header .info-container .small-info {
  display: none;
}

@media screen and (max-width: 900px) {
  .header .info-container .small-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: 8vh;
  }
}

.header .info-container .small-info button {
  font-size: calc(7px + 0.4vw);
}

.header .info-container .info {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  display: none;
  height: 10vh;
}

@media screen and (max-width: 1600px) {
  .header .info-container .info {
    height: 79%;
  }
}

@media screen and (max-width: 900px) {
  .header .info-container .info {
    -webkit-transition: background-color 1s;
    transition: background-color 1s;
    background: #111010;
    opacity: 0.9;
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    padding: 4vw 12vh;
  }
}

.header .info-container .info h2 {
  padding: 0.6em 0;
  font-weight: 400;
  font-size: calc(9px + 0.4vw);
}

.header .info-container .info p {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  height: 5vw;
  font-size: calc(9px + 0.4vw);
  overflow-x: hidden;
}

.header .info-container .info p .mCustomScrollBox {
  display: block;
}

@media screen and (max-height: 420px) {
  .header .info-container .info p {
    font-size: 14px;
  }
}

@media screen and (max-width: 900px) {
  .header .info-container .info {
    visibility: hidden;
  }
}

.header .info-container .exit-info-btn {
  width: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  bottom: -410%;
}

.header .info-container .exit-info-btn .exit-btn {
  visibility: hidden;
  font-size: calc(7px + 0.4vw);
  z-index: 10;
}

.header .info-container .aditional-info {
  font-size: calc(9px + 0.4vw);
  white-space: nowrap;
  height: 20%;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
}

@media screen and (max-width: 1600px) {
  .header .info-container .aditional-info {
    padding: 0 3vh;
  }
}

@media screen and (max-width: 1600px) {
  .header .info-container .aditional-info {
    padding: 0 1vh;
  }
}

@media screen and (max-width: 1366px) {
  .header .info-container .aditional-info {
    padding: 0 3vh;
  }
}

@media screen and (max-width: 900px) {
  .header .info-container .aditional-info {
    display: none;
  }
}

.header .info-container .aditional-info .add-info-l {
  width: 30%;
}

.header .info-container .aditional-info .add-info-l .rad {
  display: none;
}

.header .info-container .aditional-info .add-info-r {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 30%;
}

.show-side {
  -webkit-transform: translate(0, 0) !important;
          transform: translate(0, 0) !important;
}

.side-info-container {
  -webkit-transition: transform 1.2s ease-in-out;
  -webkit-transition: -webkit-transform 1.2s ease-in-out;
  transition: -webkit-transform 1.2s ease-in-out;
  transition: transform 1.2s ease-in-out;
  transition: transform 1.2s ease-in-out, -webkit-transform 1.2s ease-in-out;
  -webkit-transform: translate(100%, 0);
          transform: translate(100%, 0);
  width: 7%;
  right: -1.2%;
  z-index: 9;
}

@media screen and (max-width: 2560px) {
  .side-info-container {
    right: 0;
  }
}

.side-info-container .side-box .side-info-img {
  z-index: 9;
}

.side-info-container .side-box .mini-athmosphere {
  width: 66%;
  height: 72%;
  top: 14%;
  right: 28%;
}

.side-info-container .side-box .mini-athmosphere .elev-icon-container {
  -webkit-transition: transform 1s;
  -webkit-transition: -webkit-transform 1s;
  transition: -webkit-transform 1s;
  transition: transform 1s;
  transition: transform 1s, -webkit-transform 1s;
  height: 20%;
  width: 87%;
  margin: 0 0 0 13%;
}

.side-info-container .side-box .mini-athmosphere .elev-icon-container .elevator-icon {
  z-index: 4;
}

.side-info-container .side-box .mini-athmosphere .pos0 {
  -webkit-transform: translate(0, 406%);
  -khtml-transform: translate(0, 406%);
  transform: translate(0, 406%);
}

.side-info-container .side-box .mini-athmosphere .pos1 {
  -webkit-transform: translate(0, 322%);
  -khtml-transform: translate(0, 322%);
  transform: translate(0, 322%);
}

.side-info-container .side-box .mini-athmosphere .pos2 {
  -webkit-transform: translate(0, 240%);
  -khtml-transform: translate(0, 240%);
  transform: translate(0, 240%);
}

.side-info-container .side-box .mini-athmosphere .pos3 {
  -webkit-transform: translate(0, 157%);
  -khtml-transform: translate(0, 157%);
  transform: translate(0, 157%);
}

.side-info-container .side-box .mini-athmosphere .pos4 {
  -webkit-transform: translate(0, 75%);
  -khtml-transform: translate(0, 75%);
  transform: translate(0, 75%);
}

.side-info-container .side-box .mini-athmosphere .pos5 {
  -webkit-transform: translate(0, -8%);
  -khtml-transform: translate(0, -8%);
  transform: translate(0, -8%);
}

.side-info-container .side-box .mini-athmosphere .boxes {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  height: 98.4%;
  width: 9%;
  margin: 0 0 0 -9.3%;
  z-index: 10;
}

.side-info-container .side-box .mini-athmosphere .boxes .box-1 {
  height: 16.5%;
}

.side-info-container .side-box .mini-athmosphere .boxes .box-2 {
  height: 16.5%;
}

.side-info-container .side-box .mini-athmosphere .boxes .box-3 {
  height: 16.5%;
}

.side-info-container .side-box .mini-athmosphere .boxes .box-4 {
  height: 16.5%;
}

.side-info-container .side-box .mini-athmosphere .boxes .box-5 {
  height: 16.5%;
}

.side-info-container .side-box .mini-athmosphere .boxes .box-6 {
  height: 16.5%;
}

.side-info-container .vertical-text {
  color: #bd9d78;
  font-size: 0.9vw;
  width: 9%;
  height: 72%;
  text-align: center;
  top: 14%;
  right: 10%;
  z-index: 10;
  opacity: 0.8;
  word-break: break-all;
}

@media screen and (max-width: 900px) {
  .side-info-container .vertical-text {
    font-size: 1.3vw;
  }
}

main {
  display: block;
}

@media (min-aspect-ratio: 43 / 18) {
  main {
    width: 100vw;
  }
}

@media screen and (min-width: 2100px) {
  main {
    width: 100vw;
  }
}

main .info-arrow {
  display: none;
  bottom: auto;
  left: -34%;
  z-index: 4;
}

main .info-arrow .arrow-img {
  max-width: 350px;
  width: 80%;
}

@media screen and (max-width: 960px) {
  main .info-arrow .arrow-img {
    width: 22vw;
  }
}

@media screen and (max-width: 820px) {
  main .info-arrow .arrow-img {
    min-width: 26vw;
  }
}

main .info-arrow span {
  margin: 0 0 0 -6%;
  color: #bd9d78;
  white-space: nowrap;
}

@media screen and (max-width: 820px) {
  main .info-arrow span {
    margin: 0 0 0 -12%;
  }
}

main .elevator-div {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-item-align: end;
      align-self: flex-end;
  height: 932.5vh;
  z-index: 3;
}

main .elevator-div .tether {
  top: 3%;
  left: 49.75%;
  height: 94%;
  width: 0.5%;
  background: rgba(93, 93, 93, 0.8);
  z-index: -1;
}

main .elevator-div .elevator-container {
  width: 50vh;
  -ms-flex-item-align: end;
      align-self: flex-end;
  margin-bottom: 52vh;
  position: sticky;
  position: -webkit-sticky;
  bottom: 6vh;
}

main .elevator-div .elevator-container .info-arrow {
  width: 61.9%;
  left: -56%;
  bottom: 37%;
}

main .athmosphere {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
  overflow-x: hidden;
  width: 100vw;
}

main .athmosphere .ocean {
  height: 8vh;
  background-color: #3883c3;
}

main .athmosphere .troposphere {
  height: 100vh;
}

main .athmosphere .troposphere .sun-reflection {
  bottom: 4%;
  left: 7%;
  width: 14%;
}

main .athmosphere .troposphere #sun {
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  bottom: 30%;
  left: 6%;
  width: 16%;
  z-index: 1;
}

main .athmosphere .troposphere #sun2 {
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
  opacity: 0;
  bottom: 30%;
  left: 6%;
  width: 16%;
  z-index: 2;
}

main .athmosphere .troposphere .clouds1 {
  bottom: 46%;
  left: 29%;
  width: 60%;
}

main .athmosphere .troposphere .ground-station {
  left: auto;
  bottom: 0;
  width: 96vh;
  z-index: 3;
}

main .athmosphere .troposphere .info-arrow {
  width: 16.1%;
  left: 15%;
  bottom: 37%;
}

main .athmosphere .troposphere .elevator-trigger1 {
  bottom: 0;
  left: 23%;
  height: 39vh;
  width: 50vw;
}

main .athmosphere .stratosphere {
  height: 180vh;
}

main .athmosphere .stratosphere .clouds2 {
  bottom: 0%;
  left: 14%;
  width: 58%;
  z-index: 2;
}

main .athmosphere .stratosphere .bird-container {
  -webkit-animation: bird 20s linear infinite;
  animation: bird 20s linear infinite;
  bottom: 0;
  left: -15%;
  width: 12%;
  z-index: 3;
}

@-webkit-keyframes bird {
  0% {
    -webkit-transform: translate(1000%, 0);
    -khtml-transform: translate(1000%, 0);
    transform: translate(1000%, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@keyframes bird {
  0% {
    -webkit-transform: translate(1000%, 0);
    -khtml-transform: translate(1000%, 0);
    transform: translate(1000%, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@media screen and (max-width: 820px) {
  main .athmosphere .stratosphere .bird-container {
    width: 16%;
  }
}

main .athmosphere .stratosphere .bird-container .info-arrow {
  width: 134%;
  left: -127%;
}

@media screen and (max-width: 820px) {
  main .athmosphere .stratosphere .bird-container .info-arrow {
    left: -150%;
  }
}

main .athmosphere .stratosphere .plane-container {
  -webkit-animation: plane 15s linear infinite;
  animation: plane 15s linear infinite;
  bottom: 43%;
  left: -34%;
  width: 35%;
  z-index: 3;
}

@-webkit-keyframes plane {
  0% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(380%, 0);
    -khtml-transform: translate(380%, 0);
    transform: translate(380%, 0);
  }
}

@keyframes plane {
  0% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(380%, 0);
    -khtml-transform: translate(380%, 0);
    transform: translate(380%, 0);
  }
}

main .athmosphere .stratosphere .plane-container .info-arrow {
  width: 46%;
  left: -37%;
  bottom: 50%;
}

main .athmosphere .stratosphere .baloon-container {
  -webkit-animation: baloon 25s linear infinite;
  animation: baloon 25s linear infinite;
  top: -3%;
  left: -8%;
  width: 8%;
  z-index: 3;
}

@-webkit-keyframes baloon {
  0% {
    -webkit-transform: translate(1400%, 0);
    -khtml-transform: translate(1400%, 0);
    transform: translate(1400%, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@keyframes baloon {
  0% {
    -webkit-transform: translate(1400%, 0);
    -khtml-transform: translate(1400%, 0);
    transform: translate(1400%, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

main .athmosphere .stratosphere .baloon-container .info-arrow {
  width: 201.5%;
  left: -180%;
}

@media screen and (max-width: 820px) {
  main .athmosphere .stratosphere .baloon-container .info-arrow {
    left: -262%;
  }
}

main .athmosphere .mesosphere {
  height: 130vh;
}

main .athmosphere .mesosphere .meteor-container {
  -webkit-animation: meteor 9s linear infinite;
  animation: meteor 9s linear infinite;
  top: 10%;
  left: 100%;
  width: 27%;
  z-index: 2;
}

@-webkit-keyframes meteor {
  0% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(-463%, 366%);
    -khtml-transform: translate(-463%, 366%);
    transform: translate(-463%, 366%);
  }
}

@keyframes meteor {
  0% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(-463%, 366%);
    -khtml-transform: translate(-463%, 366%);
    transform: translate(-463%, 366%);
  }
}

main .athmosphere .mesosphere .meteor-container .meteor {
  -webkit-filter: blur(0.8px);
  -khtml-filter: blur(0.8px);
  -moz-filter: blur(0.8px);
  -ms-filter: blur(0.8px);
  -o-filter: blur(0.8px);
  filter: blur(0.8px);
}

main .athmosphere .mesosphere .meteor-container .info-arrow {
  width: 59.7%;
  bottom: 18%;
  left: -55%;
}

@media screen and (max-width: 820px) {
  main .athmosphere .mesosphere .meteor-container .info-arrow {
    left: -79%;
  }
}

main .athmosphere .mesosphere .aurora-trigger {
  top: 40%;
  left: 23%;
  height: 5vh;
  width: 50vw;
}

main .athmosphere .mesosphere .aurora-text {
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
  font-size: 8vh;
  left: auto;
  top: -18%;
  color: #fff;
  opacity: 0.5;
  display: none;
  margin: 0 0 0 2.5%;
}

main .athmosphere .thermosphere {
  height: 180vh;
}

main .athmosphere .thermosphere .stars1 {
  top: 0;
  left: 0;
}

main .athmosphere .thermosphere .aurora-container {
  height: 35%;
  bottom: 0;
  left: 0;
  z-index: 2;
}

main .athmosphere .thermosphere .aurora-container .aurora-bg1 {
  -webkit-animation: aurora 30s linear infinite;
  animation: aurora 30s linear infinite;
  opacity: 0.6;
  left: 0;
}

@-webkit-keyframes aurora {
  0% {
    -webkit-transform: translate(0,0) scale(1, 1);
    -khtml-transform: translate(0,0) scale(1, 1);
    transform: translate(0,0) scale(1, 1);
  }
  50% {
    -webkit-transform: translate(48%,0) scale(1, 1.7);
    -khtml-transform: translate(48%,0) scale(1, 1.7);
    transform: translate(48%,0) scale(1, 1.7);
  }
  100% {
    -webkit-transform: translate(96.8%,0) scale(1, 1);
    -khtml-transform: translate(96.8%,0) scale(1, 1);
    transform: translate(96.8%,0) scale(1, 1);
  }
}

@keyframes aurora {
  0% {
    -webkit-transform: translate(0,0) scale(1, 1);
    -khtml-transform: translate(0,0) scale(1, 1);
    transform: translate(0,0) scale(1, 1);
  }
  50% {
    -webkit-transform: translate(48%,0) scale(1, 1.7);
    -khtml-transform: translate(48%,0) scale(1, 1.7);
    transform: translate(48%,0) scale(1, 1.7);
  }
  100% {
    -webkit-transform: translate(96.8%,0) scale(1, 1);
    -khtml-transform: translate(96.8%,0) scale(1, 1);
    transform: translate(96.8%,0) scale(1, 1);
  }
}

main .athmosphere .thermosphere .aurora-container .aurora-bg11 {
  -webkit-animation: aurora 30s linear infinite;
  animation: aurora 30s linear infinite;
  left: -96%;
  opacity: 0.6;
}

main .athmosphere .thermosphere .aurora-container .aurora-bg2 {
  -webkit-animation: aurora 60s linear infinite;
  animation: aurora 60s linear infinite;
  opacity: 0.6;
  left: 0;
}

main .athmosphere .thermosphere .aurora-container .aurora-bg22 {
  -webkit-animation: aurora 60s linear infinite;
  animation: aurora 60s linear infinite;
  opacity: 0.6;
  left: -96%;
}

main .athmosphere .thermosphere .aurora-container .aurora-front1 {
  -webkit-animation: aurora 60s linear infinite;
  animation: aurora 60s linear infinite;
  opacity: 0.7;
  left: 0;
}

main .athmosphere .thermosphere .aurora-container .aurora-front11 {
  -webkit-animation: aurora 60s linear infinite;
  animation: aurora 60s linear infinite;
  left: -96%;
  opacity: 0.7;
}

main .athmosphere .thermosphere .aurora-container .aurora-front2 {
  -webkit-animation: aurora-reverse 60s linear infinite;
  animation: aurora-reverse 60s linear infinite;
  opacity: 0.7;
  left: 0;
}

@-webkit-keyframes aurora-reverse {
  0% {
    -webkit-transform: translate(0,0) scale(1, 1.1);
    -khtml-transform: translate(0,0) scale(1, 1.1);
    transform: translate(0,0) scale(1, 1.1);
  }
  50% {
    -webkit-transform: translate(-48%,0) scale(1, 1.7);
    -khtml-transform: translate(-48%,0) scale(1, 1.7);
    transform: translate(-48%,0) scale(1, 1.7);
  }
  100% {
    -webkit-transform: translate(-96.8%,0) scale(1, 1.1);
    -khtml-transform: translate(-96.8%,0) scale(1, 1.1);
    transform: translate(-96.8%,0) scale(1, 1.1);
  }
}

@keyframes aurora-reverse {
  0% {
    -webkit-transform: translate(0,0) scale(1, 1.1);
    -khtml-transform: translate(0,0) scale(1, 1.1);
    transform: translate(0,0) scale(1, 1.1);
  }
  50% {
    -webkit-transform: translate(-48%,0) scale(1, 1.7);
    -khtml-transform: translate(-48%,0) scale(1, 1.7);
    transform: translate(-48%,0) scale(1, 1.7);
  }
  100% {
    -webkit-transform: translate(-96.8%,0) scale(1, 1.1);
    -khtml-transform: translate(-96.8%,0) scale(1, 1.1);
    transform: translate(-96.8%,0) scale(1, 1.1);
  }
}

main .athmosphere .thermosphere .aurora-container .aurora-front22 {
  -webkit-animation: aurora-reverse 60s linear infinite;
  animation: aurora-reverse 60s linear infinite;
  left: 96%;
  opacity: 0.7;
}

main .athmosphere .thermosphere .iss-trigger {
  bottom: 11%;
  left: 23%;
  height: 5vh;
  width: 50vw;
}

main .athmosphere .thermosphere .iss-container {
  -webkit-animation: iss 22s linear infinite;
  animation: iss 22s linear infinite;
  top: 41%;
  left: -36%;
  width: 33%;
  z-index: 2;
}

@-webkit-keyframes iss {
  0% {
    -webkit-transform: translate(400%, 0);
    -khtml-transform: translate(400%, 0);
    transform: translate(400%, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@keyframes iss {
  0% {
    -webkit-transform: translate(400%, 0);
    -khtml-transform: translate(400%, 0);
    transform: translate(400%, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

main .athmosphere .thermosphere .iss-container .info-arrow {
  width: 48.8%;
  bottom: 53%;
  left: -44%;
}

@media screen and (max-width: 820px) {
  main .athmosphere .thermosphere .iss-container .info-arrow {
    left: -64%;
  }
}

main .athmosphere .exosphere {
  height: 100vh;
}

main .athmosphere .exosphere .satellite-container {
  -webkit-animation: satellite 20s linear infinite;
  animation: satellite 20s linear infinite;
  top: 5%;
  left: -19%;
  width: 19%;
  z-index: 2;
}

@-webkit-keyframes satellite {
  0% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(610%, 0);
    -khtml-transform: translate(610%, 0);
    transform: translate(610%, 0);
  }
}

@keyframes satellite {
  0% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  100% {
    -webkit-transform: translate(610%, 0);
    -khtml-transform: translate(610%, 0);
    transform: translate(610%, 0);
  }
}

main .athmosphere .exosphere .satellite-container .info-arrow {
  width: 84.7%;
  bottom: 62%;
  left: -39%;
}

@media screen and (max-width: 820px) {
  main .athmosphere .exosphere .satellite-container .info-arrow {
    left: -77%;
  }
}

main .athmosphere .exosphere .sat-trigger {
  bottom: 9.8%;
  left: 23%;
  height: 5vh;
  width: 50vw;
}

main .athmosphere .space {
  height: 140vh;
}

main .athmosphere .space .spy-sat-container {
  -webkit-animation: spy-sat 20s linear infinite;
  animation: spy-sat 20s linear infinite;
  top: 33%;
  left: -19%;
  width: 19%;
  z-index: 2;
}

@-webkit-keyframes spy-sat {
  0% {
    -webkit-transform: translate(610%, 0);
    -khtml-transform: translate(610%, 0);
    transform: translate(610%, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@keyframes spy-sat {
  0% {
    -webkit-transform: translate(610%, 0);
    -khtml-transform: translate(610%, 0);
    transform: translate(610%, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
    -khtml-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

main .athmosphere .space .spy-sat-container .info-arrow {
  width: 84.7%;
  bottom: 50%;
  left: -84%;
}

@media screen and (max-width: 820px) {
  main .athmosphere .space .spy-sat-container .info-arrow {
    left: -121%;
  }
}

main .athmosphere .space .spy-sat-trigger {
  bottom: 6%;
  left: 23%;
  height: 5vh;
  width: 50vw;
}

main .athmosphere .geo-orbit {
  height: 120vh;
}

main .athmosphere .geo-orbit .space-station-container {
  top: 23vh;
  width: 117vh;
  left: auto;
  z-index: 3;
}

main .athmosphere .geo-orbit .space-station-container .space-station {
  z-index: 1;
}

main .athmosphere .geo-orbit .space-station-container .info-arrow {
  width: 29.3%;
  bottom: 11%;
  left: -22%;
}
/*# sourceMappingURL=styles.css.map */