/* -------------------------------- 

Primary style

-------------------------------- */
*, *::after, *::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 1.6rem;
  font-family: sans-serif;
  color: #ffffff;
  background: #001426 url("../img/bg-pattern.png");
}

a {
  color: #196a74;
  text-decoration: none;
}

/* -------------------------------- 

Main Components 

-------------------------------- */
.cd-background-wrapper {
  background-color: #001426;
}
.cd-background-wrapper::before {
  /* never visible - this is used in jQuery to check the current MQ */
  content: 'mobile';
  display: none;
}
@media only screen and (min-width: 1024px) {
  .cd-background-wrapper {
    position: relative;
    overflow: hidden;
    -webkit-perspective: 4000px;
    -moz-perspective: 4000px;
    perspective: 4000px;
  }
  .cd-background-wrapper::before {
    /* never visible - this is used in jQuery to check the current MQ */
    content: 'web';
  }
}

.cd-floating-background {
  position: relative;
}
.cd-floating-background img {
  display: block;
  width: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.cd-floating-background img:not(:first-child) {
  position: absolute;
  top: 0;
  left: 0;
}
@media only screen and (min-width: 1024px) {
  .cd-floating-background {
    top: 0;
    left: 0;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
  }
  .cd-floating-background.is-absolute {
    position: absolute;
  }
  .no-preserve-3d .cd-floating-background {
    /* we target browsers that don't support preserve-3d and show just a standard image - no effect visible */
    position: relative;
  }
  .cd-floating-background img:first-child {
    -webkit-transform: translateZ(50px);
    -moz-transform: translateZ(50px);
    -ms-transform: translateZ(50px);
    -o-transform: translateZ(50px);
    transform: translateZ(50px);
  }
  .cd-floating-background img:nth-child(2) {
    -webkit-transform: translateZ(290px);
    -moz-transform: translateZ(290px);
    -ms-transform: translateZ(290px);
    -o-transform: translateZ(290px);
    transform: translateZ(290px);
  }
  .cd-floating-background img:nth-child(3) {
    -webkit-transform: translateZ(400px);
    -moz-transform: translateZ(400px);
    -ms-transform: translateZ(400px);
    -o-transform: translateZ(400px);
    transform: translateZ(400px);
  }
}