* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

/*****FLEXSLIDER******/
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus {
  outline: none; }

.slides,
.flex-control-nav,
.flex-direction-nav {
  margin: 0;
  padding: 0;
  list-style: none; }

/* FlexSlider Necessary Styles
*********************************/
.flexslider {
  margin: 0;
  padding: 0; }

.flexslider .slides > li {
  display: none;
  -webkit-backface-visibility: hidden; }

/* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {
  width: 100%;
  display: block; }

.flex-pauseplay span {
  text-transform: capitalize; }

/* Clearfix for the .slides element */
.slides:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0; }

html[xmlns] .slides {
  display: block; }

* html .slides {
  height: 1%; }

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {
  display: block; }

/* Direction Nav */
.flex-direction-nav {
  *height: 0; }

.flex-direction-nav a {
  width: 30px;
  height: 40px;
  margin: -20px 0 0;
  display: block;
  position: absolute;
  top: 50%;
  z-index: 10;
  cursor: pointer;
  text-indent: -9999px;
  -webkit-transition: all .3s ease; }

.flex-direction-nav .flex-next {
  background-size: contain;
  background: url(../img/next.png) 100% 100% no-repeat;
  opacity: 0.8;
  right: 10px; }

.flex-direction-nav .flex-prev {
  background-size: contain;
  background: url(../img/prev.png) no-repeat;
  opacity: 0.8;
  left: 10px; }

.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {
  opacity: 1; }

.flex-direction-nav .flex-disabled {
  opacity: 0.3 !important;
  filter: alpha(opacity=30);
  cursor: default; }

.flexslider {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%; }

.flex-viewport {
  height: 100%; }

ul.slides {
  width: 100%;
  height: 100%; }

ul.slides li {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%; }

html {
  width: 100%;
  height: 100%; }

@font-face {
  font-family: 'futura';
  src: url("futura/futura_light_bt-webfont.eot");
  src: url("futura/futura_light_bt-webfont.eot?#iefix") format("embedded-opentype"), url("futura/futura_light_bt-webfont.woff") format("woff"), url("futura/futura_light_bt-webfont.ttf") format("truetype"), url("futura/futura_light_bt-webfont.svg#futura_lt_btlight") format("svg");
  font-weight: normal;
  font-style: normal; }

body {
  font-family: 'futura';
  overflow: hidden; }

h1 {
  font-size: 20pt;
  line-height: 1em;
  font-weight: bold;
  letter-spacing: .25em; }

a {
  text-decoration: none;
  color: black; }

a:hover {
  text-decoration: none; }

#load {
  background-color: black;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  flex-direction: row;
  justify-content: center; }
  #load .flex-item {
    max-width: 50%; }

#main {
  display: none;
  width: 100%;
  height: 100%;
  display: table; }
  #main nav {
    position: absolute;
    z-index: 100;
    width: 100%;
    height: 100%;
    display: inline-block; }
    #main nav .title {
      position: absolute;
      left: 25px;
      top: 25px;
      font-style: italic;
      background-color: black;
      padding: 8px;
      letter-spacing: .3em;
      opacity: .2;
      -webkit-transition: opacity .2s ease-in-out;
      -moz-transition: opacity .2s ease-in-out;
      -ms-transition: opacity .2s ease-in-out;
      -o-transition: opacity .2s ease-in-out;
      transition: opacity .2s ease-in-out; }
      #main nav .title a {
        color: white; }
        #main nav .title a :hover {
          text-decoration: none; }
    #main nav .title:hover {
      opacity: 1;
      cursor: pointer; }
    #main nav .info {
      position: absolute;
      right: 25px;
      top: 25px;
      opacity: .2;
      -webkit-transition: opacity .2s ease-in-out;
      -moz-transition: opacity .2s ease-in-out;
      -ms-transition: opacity .2s ease-in-out;
      -o-transition: opacity .2s ease-in-out;
      transition: opacity .2s ease-in-out; }
    #main nav .info:hover {
      opacity: 1;
      cursor: pointer; }
    #main nav .download {
      position: absolute;
      left: 25px;
      bottom: 25px;
      opacity: .2;
      -webkit-transition: opacity .2s ease-in-out;
      -moz-transition: opacity .2s ease-in-out;
      -ms-transition: opacity .2s ease-in-out;
      -o-transition: opacity .2s ease-in-out;
      transition: opacity .2s ease-in-out; }
    #main nav .download:hover {
      opacity: 1;
      cursor: pointer; }
    #main nav .twitter {
      position: absolute;
      right: 25px;
      bottom: 25px;
      opacity: .2;
      -webkit-transition: opacity .2s ease-in-out;
      -moz-transition: opacity .2s ease-in-out;
      -ms-transition: opacity .2s ease-in-out;
      -o-transition: opacity .2s ease-in-out;
      transition: opacity .2s ease-in-out; }
      #main nav .twitter a {
        color: black; }
    #main nav .twitter:hover {
      opacity: 1;
      text-decoration: none;
      cursor: pointer; }
  #main .modal {
    display: block;
    float: left;
    margin-right: 2.35765%;
    width: 91.4702%;
    width: 100%;
    height: 100%;
    background-color: black;
    position: absolute;
    z-index: 500;
    text-align: center;
    display: none; }
    #main .modal:last-child {
      margin-right: 0; }
    #main .modal .content {
      display: block;
      float: left;
      margin-right: 2.35765%;
      width: 74.41059%;
      margin-left: 12.79471%;
      margin-top: 10em;
      color: white; }
      #main .modal .content:last-child {
        margin-right: 0; }
      #main .modal .content h1 {
        padding-bottom: 3em; }
      #main .modal .content .tagline {
        font-style: italic; }
      #main .modal .content .column {
        text-align: left;
        letter-spacing: .15em;
        display: inline;
        line-height: 1.2; }
      #main .modal .content .first {
        margin-left: 20px;
        margin-right: 50px;
        display: block;
        float: left;
        margin-right: 2.35765%;
        width: 48.82117%; }
        #main .modal .content .first:last-child {
          margin-right: 0; }
        #main .modal .content .first .contact {
          display: block;
          float: left;
          margin-right: 2.35765%;
          width: 27.49666%;
          padding-top: .75em; }
          #main .modal .content .first .contact:last-child {
            margin-right: 0; }
      #main .modal .content .last {
        padding: 15px 0 0 30px;
        display: block;
        float: left;
        margin-right: 2.35765%;
        width: 40.29137%; }
        #main .modal .content .last:last-child {
          margin-right: 0; }
        #main .modal .content .last a {
          color: white;
          outline: solid 2px white;
          padding: 10px;
          display: block;
          width: 80%;
          z-index: 2000;
          text-align: center;
          margin-bottom: 20px; }
        #main .modal .content .last iframe {
          z-index: 499;
          position: relative;
          margin-top: -22px;
          opacity: 0; }
        #main .modal .content .last .download {
          opacity: .15; }
    #main .modal .nav2 {
      color: white; }
      #main .modal .nav2 .title {
        position: absolute;
        left: 25px;
        top: 25px;
        font-style: italic;
        background-color: white;
        padding: 8px;
        letter-spacing: .3em;
        -webkit-transition: opacity .2s ease-in-out;
        -moz-transition: opacity .2s ease-in-out;
        -ms-transition: opacity .2s ease-in-out;
        -o-transition: opacity .2s ease-in-out;
        transition: opacity .2s ease-in-out; }
        #main .modal .nav2 .title a {
          color: black; }
        #main .modal .nav2 .title a:hover {
          text-decoration: none;
          cursor: pointer; }
      #main .modal .nav2 .exit {
        position: absolute;
        right: 25px;
        top: 25px; }
        #main .modal .nav2 .exit :hover {
          cursor: pointer; }
  #main .iphone1 {
    background-image: url("../img/iphone1.jpg"); }
  #main .iphone2 {
    background-image: url("../img/iphone2.jpg"); }
  #main .iphone3 {
    background-image: url("../img/iphone3.jpg"); }
