/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */



/* Document

   ========================================================================== */



/**

 * 1. Correct the line height in all browsers.

 * 2. Prevent adjustments of font size after orientation changes in iOS.

 */



html {

  line-height: 1.15; /* 1 */

  -webkit-text-size-adjust: 100%; /* 2 */

}



/* Sections

   ========================================================================== */



/**

 * Remove the margin in all browsers.

 */



body {

  margin: 0;

}



/**

 * Render the `main` element consistently in IE.

 */



main {

  display: block;

}



/**

 * Correct the font size and margin on `h1` elements within `section` and

 * `article` contexts in Chrome, Firefox, and Safari.

 */



h1 {

  font-size: 2em;

  margin: 0.67em 0;

}



/* Grouping content

   ========================================================================== */



/**

 * 1. Add the correct box sizing in Firefox.

 * 2. Show the overflow in Edge and IE.

 */



hr {

  box-sizing: content-box; /* 1 */

  height: 0; /* 1 */

  overflow: visible; /* 2 */

}



/**

 * 1. Correct the inheritance and scaling of font size in all browsers.

 * 2. Correct the odd `em` font sizing in all browsers.

 */



pre {

  font-family: monospace, monospace; /* 1 */

  font-size: 1em; /* 2 */

}



/* Text-level semantics

   ========================================================================== */



/**

 * Remove the gray background on active links in IE 10.

 */



a {

  background-color: transparent;

}



/**

 * 1. Remove the bottom border in Chrome 57-

 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.

 */



abbr[title] {

  border-bottom: none; /* 1 */

  text-decoration: underline; /* 2 */

  text-decoration: underline dotted; /* 2 */

}



/**

 * Add the correct font weight in Chrome, Edge, and Safari.

 */



b,

strong {

  font-weight: bolder;

}



/**

 * 1. Correct the inheritance and scaling of font size in all browsers.

 * 2. Correct the odd `em` font sizing in all browsers.

 */



code,

kbd,

samp {

  font-family: monospace, monospace; /* 1 */

  font-size: 1em; /* 2 */

}



/**

 * Add the correct font size in all browsers.

 */



small {

  font-size: 80%;

}



/**

 * Prevent `sub` and `sup` elements from affecting the line height in

 * all browsers.

 */



sub,

sup {

  font-size: 75%;

  line-height: 0;

  position: relative;

  vertical-align: baseline;

}



sub {

  bottom: -0.25em;

}



sup {

  top: -0.5em;

}



/* Embedded content

   ========================================================================== */



/**

 * Remove the border on images inside links in IE 10.

 */



img {

  border-style: none;

}



/* Forms

   ========================================================================== */



/**

 * 1. Change the font styles in all browsers.

 * 2. Remove the margin in Firefox and Safari.

 */



button,

input,

optgroup,

select,

textarea {

  font-family: inherit; /* 1 */

  font-size: 100%; /* 1 */

  line-height: 1.15; /* 1 */

  margin: 0; /* 2 */

}



/**

 * Show the overflow in IE.

 * 1. Show the overflow in Edge.

 */



button,

input {

  /* 1 */

  overflow: visible;

}



/**

 * Remove the inheritance of text transform in Edge, Firefox, and IE.

 * 1. Remove the inheritance of text transform in Firefox.

 */



button,

select {

  /* 1 */

  text-transform: none;

}



/**

 * Correct the inability to style clickable types in iOS and Safari.

 */



button,

[type="button"],

[type="reset"],

[type="submit"] {

  -webkit-appearance: button;

}



/**

 * Remove the inner border and padding in Firefox.

 */



button::-moz-focus-inner,

[type="button"]::-moz-focus-inner,

[type="reset"]::-moz-focus-inner,

[type="submit"]::-moz-focus-inner {

  border-style: none;

  padding: 0;

}



/**

 * Restore the focus styles unset by the previous rule.

 */



button:-moz-focusring,

[type="button"]:-moz-focusring,

[type="reset"]:-moz-focusring,

[type="submit"]:-moz-focusring {

  outline: 1px dotted ButtonText;

}



/**

 * Correct the padding in Firefox.

 */



fieldset {

  margin: 0;

  padding: 0;

  border: 0;

}



/**

 * 1. Correct the text wrapping in Edge and IE.

 * 2. Correct the color inheritance from `fieldset` elements in IE.

 * 3. Remove the padding so developers are not caught out when they zero out

 *    `fieldset` elements in all browsers.

 */



legend {

  box-sizing: border-box; /* 1 */

  color: inherit; /* 2 */

  display: table; /* 1 */

  max-width: 100%; /* 1 */

  padding: 0; /* 3 */

  white-space: normal; /* 1 */

}



/**

 * Add the correct vertical alignment in Chrome, Firefox, and Opera.

 */



progress {

  vertical-align: baseline;

}



/**

 * Remove the default vertical scrollbar in IE 10+.

 */



textarea {

  overflow: auto;

}



/**

 * 1. Add the correct box sizing in IE 10.

 * 2. Remove the padding in IE 10.

 */



[type="checkbox"],

[type="radio"] {

  box-sizing: border-box; /* 1 */

  padding: 0; /* 2 */

}



/**

 * Correct the cursor style of increment and decrement buttons in Chrome.

 */



[type="number"]::-webkit-inner-spin-button,

[type="number"]::-webkit-outer-spin-button {

  height: auto;

}



/**

 * 1. Correct the odd appearance in Chrome and Safari.

 * 2. Correct the outline style in Safari.

 */



[type="search"] {

  -webkit-appearance: textfield; /* 1 */

  outline-offset: -2px; /* 2 */

}



/**

 * Remove the inner padding in Chrome and Safari on macOS.

 */



[type="search"]::-webkit-search-decoration {

  -webkit-appearance: none;

}



/**

 * 1. Correct the inability to style clickable types in iOS and Safari.

 * 2. Change font properties to `inherit` in Safari.

 */



::-webkit-file-upload-button {

  -webkit-appearance: button; /* 1 */

  font: inherit; /* 2 */

}



/* Interactive

   ========================================================================== */



/*

 * Add the correct display in Edge, IE 10+, and Firefox.

 */



details {

  display: block;

}



/*

 * Add the correct display in all browsers.

 */



summary {

  display: list-item;

}



/* Misc

   ========================================================================== */



/**

 * Add the correct display in IE 10+.

 */



template {

  display: none;

}



/**

 * Add the correct display in IE 10.

 */



[hidden] {

  display: none;

}



/* start Helpers */

.clearfix:before,

.clearfix:after {

  content: ".";

  display: block;

  height: 0;

  overflow: hidden;

}

.clearfix:after {

  clear: both;

}

/* end Helpers */



/* start Layout */

html,

body {

  height: 100%;

}


/*
html.js,

html.js body {

  overflow: hidden;

}
*/


html.isResponsive,

html.isResponsive body {

  height: auto !important;

  overflow: auto !important;

}



html.isResponsive.modal_on,

html.isResponsive.modal_on body {

  overflow: hidden !important;

}





html {

  font-size: 10px;

}



@media only screen and (min-width: 1924px) {

  html {

    font-size: 10px !important;

  }

}



#wrapper {

  position: relative;

}



body {

  background: #000;

  color: #fff;

  font-family: "Sb_Standard", sans-serif;

  line-height: normal;

}



fieldset {

  min-width: 0;

  width: 100%;

}



a {

  color: inherit;

  text-decoration: none;

  outline: none;

}



a img {

  border: 0;

}



.input {

  outline: none;

}



img {

  max-width: 100%;

  height: auto;

  box-sizing: border-box;

}



.click_through {

  -ms-pointer-events: none;

  pointer-events: none;

}



.no_select {

  -webkit-user-select: none; /* Chrome all / Safari all */

  -moz-user-select: none; /* Firefox all */

  -ms-user-select: none; /* IE 10+ */

  user-select: none; /* Likely future */

}



.scene {

  min-height: calc(100vh - 13rem);

  box-sizing: border-box;

  position: relative;

  padding: 0 5rem;

  overflow: hidden;

}



.scene .inner {

  margin: 0 auto;

  max-width: 130rem;

  position: relative;

  min-height: calc(100vh - 13rem);

  display: flex;

  align-items: center;

}



h2 {

  font-weight: 700;

  text-transform: uppercase;

  text-shadow: 0 0.1em 0 #000;

}



h2.large {

  font-size: 8rem;

  line-height: normal;

}



h2 {

  font-size: 4.9rem;

  line-height: 1.224em;

}



.btn_wrapper {

  display: inline-block;

  position: relative;

  background: transparent;

  border: 0;

  outline: none;

  text-align: left;

  margin: 0;

  padding: 0;

  text-indent: 0;

  line-height: normal;

  cursor: pointer;

}



.btn_mask {

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  overflow: hidden;

  width: 100%;

  height: 100%;

  opacity: 0;

  z-index: 1;

}

.btn {

  display: block;

  font-weight: bold;

  font-size: 2.6rem;

  line-height: 1.769em;

  border: solid;

  border-width: 0.346em 0;

  margin: 0 0.692em;

  text-transform: uppercase;

  position: relative;

  cursor: pointer;

}



.btn.hover {

  position: absolute;

  top: 0;

  left: 0;

}



.btn span {

  display: inline-block;

  padding: 0 0.885em 0 1.077em;

}



.btn span:before,

.btn span:after,

.btn:before,

.btn:after {

  content: "";

  display: block;

  width: 0.346em;

  height: 1.769em;

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  box-sizing: border-box;

  border: solid;

  border-width: 0.346em 0;

}



.btn:before,

.btn span:before {

  right: 100%;

}



.btn:after,

.btn span:after {

  left: 100%;

}



.btn:before,

.btn:after {

  height: 1.077em;

}



.btn:before {

  margin-right: 0.346em;

}



.btn:after {

  margin-left: 0.346em;

}



.btn.light,

.btn.light:before,

.btn.light:after,

.btn.light span:before,

.btn.light span:after {

  color: #000;

  background: #f8ac01;

  border-color: #fec649 transparent #d58c00;

}



.btn.light:before,

.btn.light:after {

  background: #fec649;

}



.btn.light:hover,

.btn.light:hover:before,

.btn.light:hover:after,

.btn.light:hover span:before,

.btn.light:hover span:after {

  background: #e9a100;

  border-color: #e9a100;

}



.btn.dark,

.btn.dark:before,

.btn.dark:after,

.btn.dark span:before,

.btn.dark span:after {

  color: #fff;

  background: #000;

  border-color: #000;

}



.btn.dark.hover,

.btn.dark.hover:before,

.btn.dark.hover:after,

.btn.dark.hover span:before,

.btn.dark.hover span:after {

  background: #464646;

  border-color: #464646;

}



/* end Layout */



/* start mainNav */

#main_nav {

  padding: 0 5rem;

  min-height: 13rem;

  box-sizing: border-box;

  position: relative;

  display: flex;

  justify-content: space-between;

  align-items: center;

}



#main_nav .logo {

  display: block;

  width: 26rem;

  float: left;

  position: relative;

  z-index: 15;

}



#main_nav .logo a {

  display: block;

  width: 100%;

  padding-bottom: 19.33%;

  height: 0;

  position: relative;

}



#main_nav .logo span {

  display: block;

  width: 100%;

  height: 100%;

  overflow: hidden;

  text-indent: -3000px;

  background: url("../media/layout/logo.svg") no-repeat;

  background-size: contain;

  position: absolute;

  top: 0;

  left: 0;

}







#main_nav .sound_toggler {

  float: right;

  display: block;

  cursor: pointer;

  width: 4.2rem;

  height: 4.2rem;

  margin: 0.5rem 0;

  position: relative;

  z-index: 15;

}



#main_nav .sound_toggler span {

  display: block;

  width: 100%;

  height: 100%;

  background: url("../media/layout/speaker_on.svg"),

    url("../media/layout/speaker_off.svg");

  background-repeat: no-repeat, no-repeat;

  background-size: cover, cover;

  background-position: -100rem -100rem, 0 0;

}



#main_nav .sound_toggler.on span {

  background-position: 0 0, -100rem -100rem;

}

/* end mainNav */



/* start footer */

#footer {

  font-family: "Open Sans", sans-serif;

  font-size: 2.1rem;

  font-weight: 600;

  color: #2f2f2f;

  background: #000;

  position: relative;

  padding: 0 5rem;

  z-index: 20;

}



#footer .inner {

  min-height: 13rem;

  padding: 2rem 0;

  display: flex;

  justify-content: space-between;

  align-items: center;

  flex-wrap: wrap;

  box-sizing: border-box;

  margin: 0 auto;

  max-width: 130rem;

}



#footer a:hover {

  color: #616161;

}



#footer ul,

li {

  display: inline-block;

}



#footer ul {

  padding: 0 2rem;

}



#footer li:first-child {

  position: relative;

  padding: 0 3.5rem 0 0;

  margin: 0 1.4rem 0 0;

}



#footer li:first-child:after {

  content: "";

  display: block;

  background: #2f2f2f;

  width: 0.095em;

  height: 1.19em;

  position: absolute;

  right: 0;

  top: 0;

}

/* end footer */



/* start Team */

#team {

  background: url("../media/team/brick.png") center top;

  background-size: 13.1rem 6.6rem;

  user-select: none;

}



#team .wall {

  position: absolute;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  overflow: hidden;

  visibility: hidden;

}



#team .wall_1,

#team .wall_2 {

  display: block;

  width: 50%;

  height: 6.6rem;

  position: absolute;

  top: 0;

  left: 0;

}



#team .wall_2 {

  left: auto;

  right: 0;

}



#team .wall_1 span,

#team .wall_2 span {

  display: block;

  height: 100%;

  background: #000;

  position: relative;

}



#team .wall_1 span:before,

#team .wall_2 span:before {

  content: "";

  display: block;

  height: calc(100% - 0.9rem);

  background: inherit;

  width: calc(100% - 13.1rem);

  position: absolute;

  left: 0;

  top: 100%;

}



#team .wall_2 span:before {

  left: auto;

  right: 0;

}



#team .cracks {

  position: absolute;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  overflow: hidden;

}



#team .crack_1 {

  display: block;

  position: absolute;

  top: 0;

  left: 50%;

  bottom: 0;

  width: 35rem;

  background: url("../media/team/cracks.png") left top repeat-y;

  background-size: 192rem 99rem;

}



#team .crack_2 {

  display: block;

  position: absolute;

  top: 0;

  right: 50%;

  bottom: 0;

  width: 70.5rem;

  background: url("../media/team/cracks.png") right top repeat-y;

  background-size: 192rem 99rem;

}



#team .lights_ {

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index: 5;

  overflow: hidden;

}



#team .lights {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;



  will-change: opacity;

}



#team .lights.red {

  background: url("../media/team/lights_red.png") no-repeat;

  background-size: cover;

  opacity: 0;

}



#team .lights.blue {

  background: url("../media/team/lights_blue.png") right bottom no-repeat;

  background-size: cover;

}



#team .shadows_ {

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  overflow: hidden;

}



#team .shadows {

  position: absolute;

  top: 0;

  left: 0;

  transform-origin: 0 0;

  width: 100%;

  height: 100%;

  background: url("../media/team/wall_shadow_2.png") no-repeat;

  background-size: cover;

  will-change: transform;

}



#team .inner_ {

  box-sizing: border-box;

  padding: 5rem 0;

  padding: 0;

  width: 100%;

}



#team header {

  text-align: center;

}



#team h2 {

  margin: 1.025em 0 0.275em;

}



#team .warning {

  font-size: 3.4rem;

  height: 16.4rem;

  height: 13rem;

}



.js #team .warning p {

  display: none;

}



#team .typed_text {

  display: inline;

}



#team .members {

  color: #413932;

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  margin: 0 -5.1rem 0 -4.6rem;

  font-weight: 700;

  padding: 0 0 9.6rem;

  padding: 0 0 1rem;
}



#team .members li {

  position: relative;

  margin: 0 4.4rem 8.8rem;

  width: 19.1rem;

}



#team .members .flyer {

  position: relative;

  /*will-change: transform;*/

}



#team .members li.hover {

  z-index: 10;

}



#team .members .sticker,

#team .members .sticker span {

  display: block;

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

}



#team .members .sticker {

  right: 6px;

  bottom: 6px;

}



#team .members .sticker:before,

#team .members .sticker:after,

#team .members .sticker span:before,

#team .members .sticker span:after {

  content: "";

  display: block;

  background: #959595;

  width: 1.6rem;

  height: 3.2rem;

  position: absolute;

}



#team .members .sticker_1:before {

  top: 0;

  left: 2rem;

  transform: translateY(-50%);

}



#team .members .sticker_1:after {

  top: 0;

  right: 2rem;

  transform: translateY(-50%);

}



#team .members .sticker_2 span:before {

  width: 3.2rem;

  height: 1.6rem;

  top: 100%;

  left: 50%;

  transform: translate(-50%, -50%);

}



#team .members .sticker_2 span:after {

  display: none;

}



#team .members .sticker_3:before {

  width: 3.2rem;

  height: 1.6rem;

  top: 1.4rem;

  left: 0;

  transform: translateX(-50%);

}



#team .members .sticker_3:after {

  width: 3.2rem;

  height: 1.6rem;

  top: 1.4rem;

  left: 100%;

  transform: translateX(-50%);

}



#team .members .sticker_4 span:before {

  width: 3.2rem;

  height: 1.6rem;

  bottom: 1.6rem;

  left: 0;

  transform: translateX(-50%);

}



#team .members .sticker_4 span:after {

  width: 3.2rem;

  height: 1.6rem;

  bottom: 1.6rem;

  left: 100%;

  transform: translateX(-50%);

}



#team .members .sticker_5:before {

  width: 3.2rem;

  height: 1.6rem;

  top: 0;

  left: 50%;

  transform: translate(-50%, -50%);

}



#team .members .sticker_5:after {

  display: none;

}



#team .members figure {

  background: #f0d2b1;

  text-align: center;

  background-clip: padding-box;

  border: solid rgba(28, 30, 65, 0.74);

  border-width: 0 0.6rem 0.6rem 0;

  margin: 0;

  padding: 1.2rem 2rem 0.5rem;

  cursor: zoom-in;

  overflow: hidden;

}



#team .members strong {

  display: block;

  font-size: 3rem;

  text-transform: uppercase;

  margin: 0 -2rem;

  text-indent: 0.2em;

  padding: 0 0 0.4rem;

}



#team .members .img_wrapper {

  position: relative;

  border: 0.7rem solid #413932;

  background-color: #413932;

  background-size: cover;

  background-repeat: no-repeat;

}



#team .members img {

  display: block;

  width: 100%;

}



#team .members figcaption {

  font-size: 1.8rem;

  line-height: 3.6rem;

  display: block;

  box-sizing: border-box;

  min-height: 3.6rem;

  padding: 0.3rem 0 0;

  text-indent: 0.25em;

  margin: 0 -2rem;

  text-align: center;

}



#team .members em {

  font-weight: 700;

  text-transform: uppercase;

  position: absolute;

  color: #fc0012;

  font-size: 1.9rem;

  border: 0.3rem solid #fc0012;

  bottom: 1rem;

  right: -1.5rem;

  z-index: 1;

  line-height: 2.2rem;

  padding: 0 0.5rem;

  font-style: normal;

}



#team .pointer {

  display: none;

  width: 6.7rem;

  height: 3.8rem;

  background: url("../media/team/arrow.png") no-repeat;

  background-size: 6.7rem 3.8rem;

  position: absolute;

  bottom: 4.4rem;

  left: 50%;

  transform: translate(-50%, 0);

}

@media only screen and (min-width: 1200px) {

  #team .pointer {
    display: block;
  }

}



#team .members blockquote {

  position: absolute;

  left: 0;

  top: 0;

  background: #fff;

  color: #000;

  box-sizing: border-box;

  border: #000 solid;

  border-width: 0.9rem 0;

  font-size: 1.4rem;

  line-height: 1.286em;

  width: 18.5rem;

  min-height: 9.9rem;

  text-align: center;

  display: none;

  background-clip: padding-box;

  will-change: transform, opacity;

}















#team .members li.hover blockquote {

  display: block;

}



#team .members blockquote:before {

  display: block;

  content: "";

  width: 3.6rem;

  height: 4.5rem;

  position: absolute;

  top: 50%;

  background: url("../media/team/bubble_pointer.png") no-repeat;

  background-size: cover;

}



#team .members blockquote.bq_1:before {

  left: -1.8rem;

  transform: translate(-100%, -50%);

}



#team .members blockquote.bq_2:before {

  left: -1.8rem;

  transform: translate(-100%, -50%) scale(1, -1);

}



#team .members blockquote.bq_3:before {

  right: -1.8rem;

  transform: translate(100%, -50%) scale(-1, 1);

}



#team .members blockquote.bq_4:before {

  right: -1.8rem;

  transform: translate(100%, -50%) scale(-1, -1);

}







#team .members blockquote:after {

  content: "";

  display: block;

  background: #000;

  position: absolute;

  width: 0.9rem;

  top: 1.8rem;

  bottom: 1.8rem;

  right: -2.7rem;

}



#team .members blockquote.bq_3:after,

#team .members blockquote.bq_4:after {

  left: -2.7rem;

  right: auto;

}



#team .members p {

  margin: 0 -0.5rem;

  padding: 0.357em 0 0.286em;

  position: relative;

  z-index: 1;

}



#team .members .bubble,

#team .members .bubble span {

  background: #fff;

  border: solid #000;

  border-width: 0.9rem 0;

  position: absolute;

  top: 0;

  bottom: 0;

  right: -0.9rem;

  left: -0.9rem;

  background-clip: padding-box;

}



#team .members .bubble:before,

#team .members .bubble:after {

  content: "";

  display: block;

  background: #fff;

  height: 50%;

  overflow: hidden;

  position: absolute;

  left: 0.8rem;

  right: 0.8rem;

  z-index: 1;

  background-clip: padding-box;

}



#team .members .bubble:before {

  top: -0.9rem;

}



#team .members .bubble:after {

  bottom: -0.9rem;

}



#team .members .bubble span {

  background: #fff;

}



#team .members .bubble span:before {

  display: block;

  content: "";

  width: 0.9rem;

  left: 0.9rem;

  top: -0.9rem;

  bottom: -0.9rem;

  background: #fff;

  position: absolute;

}



#team .members .bubble span:after {

  display: block;

  content: "";

  width: 0.9rem;

  right: 0.9rem;

  top: -0.9rem;

  bottom: -0.9rem;

  background: #fff;

  position: absolute;

}



/*



#team .members .bubble,

#team .members .bubble span {

  display: block;

  position: absolute;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0;

}



#team .members .bubble span {

  top: 9px;

  right: -9px;

  bottom: 9px;

  left: -9px;

}



#team .members .bubble:before,

#team .members .bubble:after,

#team .members .bubble span:before,

#team .members .bubble span:after {

  content: "";

  box-sizing: border-box;

  display: block;

  width: 9px;

  height: 100%;

  background: #fff;

  border: solid #000;

  border-width: 9px 0;

  position: absolute;

  top: 0;

}



#team .members .bubble:before,

#team .members .bubble span:before {

  left: -9px;

}



#team .members .bubble:after,

#team .members .bubble span:after {

  right: -9px;

}



#team .members .bubble span span:before,

#team .members .bubble span span:after {

  background: #000;

}

*/



/* end Team */



/* start About Us */



#about_us {

  background: #000638;

  z-index: 20;

}



#about_us:before {

  content: "";

  display: block;

  width: 100%;

  height: 100%;



  background: url(../media/about_us/aurora.png) right bottom no-repeat,

    url(../media/about_us/city.png) right bottom no-repeat,

    url(../media/about_us/hills.png) left bottom repeat-x;



  background-size: cover, auto 100%, 100% auto;

  position: absolute;

  left: 0;

  top: 0;

  z-index: 2;

}

#about_us:after {

  content: "";

  display: block;

  width: 100%;

  height: 100%;

  background: url(../media/about_us/moon.png) right bottom no-repeat;

  background-size: auto 100%;

  position: absolute;

  left: 0;

  top: 0;

}



#about_us .inner {

  z-index: 5;

}



#about_us .inner_ {

  max-width: 69.5rem;

  padding: 5rem 0;

}



#about_us h2 {

  margin: 1.061em 0 1.265em;

}



#about_us .txt {

  font: 2rem/1.4em "Open Sans", sans-serif;

  margin: 0 0 2.8em;

}



#about_us p {

  margin: 0 0 1.4em;

  will-change: transform, opacity;

}



#about_us .txt strong {

  color: #e0bc13;

  display: inline;

  font-weight: normal;

  background: #2d26cc;

  box-shadow: 0.2em 0 0 rgba(45, 38, 204, 1), -0.2em 0 0 rgba(45, 38, 204, 1);

  margin: 0 0.3em 0 0;

}



#about_us .cloudsWrapper {

  position: absolute;

  top: 0;

  left: 0;

  overflow: hidden;

  width: 100%;

  height: 100%;

  z-index: 1;

}



#about_us .cloud {

  display: block;

  background: url("../media/about_us/clouds.png") no-repeat;

  background-size: 32.9rem 29.2rem;

  position: absolute;

  right: 100%;

  top: 0;

}



#about_us .cloud_1 {

  width: 18.1rem;

  height: 4.5rem;

  margin-right: -18.1rem;

  background-position: 0 -8.2rem;

  transform: translate(7.2rem, 16.1rem);

}



#about_us .cloud_2 {

  width: 32.9rem;

  height: 7.2rem;

  margin-right: -32.9rem;

  background-position: 0 0;

  transform: translate(23.6rem, 7.6rem);

}



#about_us .cloud_3 {

  width: 12.6rem;

  height: 3.6rem;

  margin-right: -12.6rem;

  background-position: 0 -13.7rem;

  transform: translate(87.8rem, 10.8rem);

}



#about_us .cloud_4 {

  width: 29.7rem;

  height: 5.4rem;

  margin-right: -29.7rem;

  background-position: 0 -18.3rem;

  transform: translate(98.9rem, 13rem);

}



#about_us .cloud_5 {

  width: 17.1rem;

  height: 4.5rem;

  margin-right: -17.1rem;

  background-position: 0 -24.7rem;

  transform: translate(162.7rem, 17.4rem);

}



#about_us .starsWrapper_ {

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  overflow: hidden;

}



#about_us .starsWrapper {

  position: absolute;

  width: 100%;

  height: 100%;

  min-height: 95rem;

  min-width: 96rem;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}



#about_us .star {

  background: #ffd92a;

  display: block;

  position: absolute;

  width: 0.9rem;

  height: 0.9rem;

  transform: translate(-50%, -50%);

  transition: opacity 200ms;

}



#about_us .star.twinkle {

  opacity: 0.2;

}



#about_us .helicopter {

  position: absolute;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  overflow: hidden;

}



#about_us .helicopter_ {

  display: block;

  background: url("../media/about_us/helicopter.png") no-repeat -0.5rem -2.2rem;

  background-size: 8.9rem 6.7rem;

  width: 6.7rem;

  height: 4.5rem;

  position: absolute;

  top: 14.21%;

  right: 21.354%;

  z-index: 3;

}



#about_us .helicopter_ .rotor_1 {

  display: block;

  width: 7.3rem;

  height: 2.2rem;

  background: url("../media/about_us/helicopter.png") no-repeat 0 0;

  background-size: 8.9rem 6.7rem;

  position: absolute;

  top: -2.2rem;

  left: -0.5rem;

}



#about_us .helicopter_ .rotor_2 {

  display: block;

  width: 1.6rem;

  height: 1.8rem;

  background: url("../media/about_us/helicopter.png") no-repeat -7.3rem -2.7rem;

  background-size: 8.9rem 6.7rem;

  position: absolute;

  top: 0.5rem;

  left: 6.7rem;

}



#about_us .helicopter_ .light_svg {

  display: block;

  position: absolute;

  left: calc(50% - 0.5rem);

  transform: translateX(-50%);

  top: 2rem;

  width: 95rem;

  height: 70rem;

}



#about_us .helicopter_ .light {

  display: block;

}



/*

#about_us .helicopter_ .light.blue:before {

  content: "";

  display: block;

  width: 36.5rem;

  height: 65.5rem;

  background: url("../media/about_us/helicopter_blue_light.png") no-repeat;

  background-size: cover;

  position: absolute;

  top: 0;

  right: 1rem;

}



#about_us .helicopter_ .light.red:after {

  content: "";

  display: block;

  width: 52.4rem;

  height: 76.1rem;

  background: url("../media/about_us/helicopter_red_light.png") no-repeat;

  background-size: cover;

  position: absolute;

  top: -0.4rem;

  left: -0.3rem;

}

*/



/* start modal */

.modal {

  position: fixed;

  z-index: 100;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  display: none;

  overflow: auto;

}



.modal .overlay {

  background: rgba(0, 0, 0, 0.7);

  position: fixed;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

}



.modal_inner {

  width: 100%;

  height: 100%;

  display: none;

  border-collapse: collapse;

}



.modal_inner_ {

  width: 100%;

  height: 100%;

  display: table-cell;

  vertical-align: middle;

  text-align: center;

}



#contact {

  z-index: 1;

}



.modal .popup {

  box-sizing: border-box;

  background: #fff;

  color: #000;

  max-width: 80rem;

  margin: 5rem 3rem;

  padding: 4.5rem 5rem 5rem;

  text-align: left;

  display: inline-block;

}



.modal .form-wrapper {

  margin: 0 0 2.3rem;

}



.modal label {

  display: block;

  font-size: 1.6rem;

  line-height: normal;

  font-weight: 700;

  padding: 0 0 0.4rem 0.3rem;

}



.modal .input {

  border: 0.3rem solid #000;

  display: block;

  box-sizing: border-box;

  width: 100%;

  min-width: 0;

  font-size: 1.6rem;

  line-height: normal;

  padding: 0.9rem;

  font-family: "Open Sans", sans-serif;

}



.modal textarea.input {

  overflow: auto;

  resize: vertical;

  min-height: 21.4rem;

  max-height: 35rem;

}



#contact_form header {

  overflow: hidden;

}



#contact_form .slide {

  padding: 0.1rem 0;

}



#contact_form h3 {

  font-size: 2.4rem;

  line-height: normal;

  font-weight: 700;

  text-transform: uppercase;

  padding: 0 0 0 9.5rem;

  margin: 0.7rem 0 2.6rem;

  position: relative;

}



#contact_form h3::before {

  content: "";

  display: block;

  width: 7.3rem;

  height: 7.3rem;

  background: url("../media/layout/hypurrnet_ico.png") no-repeat;

  background-size: cover;

  position: absolute;

  top: -0.7rem;

  left: 0;

}



#contact_form p {

  font-size: 1.6rem;

  font-weight: bold;

  margin: 0 0 3rem;

}



#contact_form .btn {

  /*font-size: 2.4rem;*/

}



#thx_message {

  text-align: center;

  font-size: 1.8rem;

  font-weight: 700;

}



#thx_message h4 {

  font-size: 3rem;

  line-height: 5.1rem;

  position: relative;

  display: inline-block;

  padding: 0 0 0 10.5rem;

  margin: 3.3rem 0 2.4rem;

}



#thx_message h4:before {

  content: "";

  display: block;

  width: 8.4rem;

  height: 8.4rem;

  background: url("../media/layout/hypurrnet_ico.png") no-repeat;

  background-size: cover;

  position: absolute;

  left: 0;

  top: -2.1rem;

}



#thx_message hr {

  border: 0;

  background: url("../media/layout/hr.png") repeat-x;

  height: 0.4rem;

  margin: 4.2rem 0 4rem;

}



#thx_message p {

  margin: 0 0 0.5rem;

}



/* end modal */



/* end About Us */



@media (max-width: 575.98px) {

  .modal .popup {

    margin-left: auto;

    margin-right: auto;

    width: calc(100vw - 50px);

  }



  .modal textarea.input {

      min-height: 7rem;

      max-height: 10rem;

  }



  section h2 {

    font-size: 30px;

  }



  section h2.large {

    font-size: 40px;

  }



  #about_us .star {

    width: 0.2rem;

    height: 0.2rem;

  }



  #main_nav .logo {

    width: 20rem;

  }



  #main_nav .sound_toggler {

    width: 3rem;

    height: 3rem;

  }



  

  

}



@media (max-width: 767.98px) {

  

  .modal .popup {

    padding: 25px;

  }



  .modal_inner {

    padding: 25px;

  }





  #main_nav,

  #footer,

  .scene {

    padding-left: 25px;

    padding-right: 25px;

  }



  #team .wall,

  #team .cracks {

    display: none;

  }



  section h2 {

    font-size: 40px;

  }



  section h2.large {

    font-size: 50px;

  }



  .btn {

    font-size: 20px;

  }



  



  #team .inner_ {

    padding-top: 25px;

  }



  #team .members {

    margin: 0 -25px 0 -20px;

  }



  #team .members li {

    margin: 0 20px 70px;

  }



  #team .warning {

    font-size: 24px;

  }



  #main_nav {

    min-height: 10rem;

  }



  



  



  #footer .inner {

    font-size: 16px;

    padding: 0;

    min-height: 10rem;

  }



  #footer .inner:last-child {

    width: 100%;

  }



  #team .members {

    margin: 0;

    display: block;

  }

  #team .members li {

    display: block;

    margin-left: auto;

    margin-right: auto;

  }



  .modal textarea.input {

    min-height: 10rem;

    max-height: 15rem;

  }



  #about_us:before {

    background-size: cover, 100% auto, 100% auto;

  }



  #about_us:after {

    background-size: 100% auto;

  }



  



  

}



@media (max-width: 991.98px) {

  

  #contact_form h3 {

    padding-left: 0;

    padding-top: 7rem;

    font-size: 2rem;

    text-align: center;

  }



  #contact_form h3:before {

    top: 0;

    left: 50%;

    transform: translate(-50%, 0);

    width: 5rem;

    height: 5rem;

  }



  #thx_message h4 {

    padding-left: 0;

    padding-top: 5rem;

    font-size: 2.6rem;

  }



  #thx_message h4:before {

    top: 0;

    left: 50%;

    transform: translate(-50%, 0);

    width: 5rem;

    height: 5rem;

  }



  

  .starsWrapper,

  .cloudsWrapper {

    visibility: hidden;

  }

  

  #footer ul {

    display: none;

  }

}



@media (max-width: 1199.98px) {

  #team .members blockquote.bq_5 {

    background: red;

    left: 0 !important;

    top: 0 !important;

    margin-left: 0;

    margin-top: -7.8rem;

  }



  #team .members blockquote.bq_5:before {

    left: 50%;

    top: calc(100% - 0.9rem);

    transform: translate(-50%, 100%) rotate(-90deg);

    transform-origin: 0 0;

  }



  #team .members blockquote.bq_5:after {

    left: -2.7rem;

    right: auto;

  }

  

  

  #team .members blockquote.bq_5 p:after {

    content: "";

    display: block;

    background: #000;

    position: absolute;

    width: 0.9rem;

    top: 1.8rem;

    bottom: 1.8rem;

    right: -2.2rem;

  }



  #about_us .helicopter_ {

    top: auto;

    bottom: 50px;

    right: 35px;

  }



  #about_us .helicopter_ .light_svg {

    display: none;

  }



  #about_us .star {

    width: 0.7rem;

    height: 0.7rem;

  }

  

}



@media all and (-ms-high-contrast: none) {

  .click_through {

    display: none;

  }

  .scene .inner {

    display: table;

  }



  .scene .inner_ {

    display: table-cell;

    min-height: calc(100vh - 130px);

    vertical-align: middle;

  }

}



/*

.modal {

  display: block !important;

}



.overlay {

  opacity: 1 !important;

}







#contact {

  display: table !important;

}



#contact_form {

  opacity: 1 !important; 

  transform: matrix(1, 0, 0, 1, 0, 0) !important;

}



#contact_form header {

  opacity: 1 !important;

  max-height: none !important;

}







#thx {

  display: table !important;

}



#thx_message {

  opacity: 1 !important; 

  transform: matrix(1, 0, 0, 1, 0, 0) !important;

}

*/







