@charset "UTF-8";
/* CSS Document */
.bb-backlink {
    visibility: hidden;
    opacity: 0;
    max-height: 1px;
    font-size: 1px;
    display: flex;
    margin-bottom: -1px;
    position: absolute;
    bottom: 100px;
}



@font-face {
  font-family: 'GothamBold';
  src: url('../fonts/Gotham-Bold.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Gotham-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
     url('../fonts/Gotham-Bold.woff') format('woff'), /* Modern Browsers */
     url('../fonts/Gotham-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
     url('../fonts/Gotham-Bold.svg#svgFontName') format('svg'); /* Legacy iOS */

 }

@font-face {
  font-family: 'GothamMedium';
  src: url('../fonts/Gotham-Medium.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Gotham-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
     url('../fonts/Gotham-Medium.woff') format('woff'), /* Modern Browsers */
     url('../fonts/Gotham-Medium.ttf')  format('truetype'), /* Safari, Android, iOS */
     url('../fonts/Gotham-Medium.svg#svgFontName') format('svg'); /* Legacy iOS */

 }

@font-face {
  font-family: 'GothamLight';
  src: url('../fonts/Gotham-Thin.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Gotham-Thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
     url('../fonts/Gotham-Thin.woff') format('woff'), /* Modern Browsers */
     url('../fonts/Gotham-Thin.ttf')  format('truetype'), /* Safari, Android, iOS */
     url('../fonts/Gotham-Thin.svg#svgFontName') format('svg'); /* Legacy iOS */

 }
 
 

 
body {
	background: url('../img/hero-bg.jpg') no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;	margin: 0px;
	padding: 0px;
	border: none;
	font-family: 'GothamLight', Helvetica, Arial, sans-serif;
}

#container {
}
.content {margin: 0;
  position: absolute;
  top: 25%;
left: 50%;
  transform: translateX(-50%);
}



.inner {
	position: relative;
}

.logo {width:100%; text-align:center;}
.contact {width:100%; min-height:50%; text-align:center; margin:20px 0 0 0;}


.phone{color:#fff; font-size:40px; letter-spacing:0px; margin-top:40px; }

.phone span{color:#f99d24; font-family:'GothamMedium'; }

h4 {size:48px!important;}
.hide-mobile {display:inline!important;}

@media only screen and (max-width: 500px) {
  /* here comes the trick..this is the css, which would be applied to all 
   * the devices whose screen has a max-width of 400px..
   */
.logo img {width:300px !important; height:auto;}
 
 .logo p{font-size:13px !important; letter-spacing:2px; margin-top:20px; }
 .hide-mobile {display:none!important;}
  .hide-desktop {display:inline !important;}


  
}
.contact {margin:40px 0 0 0;}



 .hide-desktop {display:none;}

/*!
  Ionicons, v1.4.1
  Created by Ben Sperry for the Ionic Framework, http://ionicons.com/
  https://twitter.com/helloimben  https://twitter.com/ionicframework
  MIT License: https://github.com/driftyco/ionicons
*/
@font-face { font-family: "Ionicons"; src: url("../fonts/ionicons.eot?v=1.4.1"); src: url("../fonts/ionicons.eot?v=1.4.1#iefix") format("embedded-opentype"), url("../fonts/ionicons.ttf?v=1.4.1") format("truetype"), url("../fonts/ionicons.woff?v=1.4.1") format("woff"), url("../fonts/ionicons.svg?v=1.4.1#Ionicons") format("svg"); font-weight: normal; font-style: normal; }


    * {
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }

  

    a, a:visited {
      color: #fff;
      text-decoration: underline;
    }
    a:hover, a:focus  { opacity: .9; }

    header {
      border-bottom: 2px solid #ddd;
      margin-bottom: 20px;
      overflow: hidden;
      padding: 20px 0;
    }

    header h1 {
      color: #888;
      float: left;
      font-size: 36px;
      font-weight: 300;
    }

    header a {
      float: right;
      font-size: 14px;
    }

    .container {
      margin: 0 auto;
      max-width: 1200px;
      min-width: 960px;
      padding: 0 20px;
      width: 95%;
    }

    .icons {
      margin: 0 auto;
	  width:100px;
	  text-align:center;
    }
    .icon-row {
      padding: 10px 0 20px;
      margin-bottom: 0px;
	  color:#fff;
	  text-align:center;
    }
    .ion {
      -webkit-touch-callout: text;
      -webkit-user-select: text;
      -khtml-user-select: text;
      -moz-user-select: text;
      -ms-user-select: text;
      user-select: text;
    }

    .preview-icon { vertical-align: bottom;
    height: 100px;
    width: 100px; }

    .preview-scale {
      color: #888;
      font-size: 12px;
      margin-top: 5px;
    }

    .step {
      line-height: 1;
    }

    .step i {
      -webkit-transition: opacity .3s;
      -moz-transition: opacity .3s;
      -ms-transition: opacity .3s;
      -o-transition: opacity .3s;
      transition: opacity .3s;
    }

    .step:hover i { opacity: .5; }
    
    .size-12 { font-size: 12px; }
    .size-14 { font-size: 14px; }
    .size-16 { font-size: 16px; }
    .size-18 { font-size: 18px; }
    .size-21 { font-size: 21px; }
    .size-24 { font-size: 24px; }
    .size-32 { font-size: 32px; }
    .size-48 { font-size: 48px; }
    .size-64 { font-size: 64px; }
    .size-96 { font-size: 96px; }
    
    .usage { margin-top: 10px; }
    .usage input {
      font-family: monospace;
      margin-right: 3px;
      padding: 2px 5px;
      text-align: center;
      -webkit-touch-callout: text;
      -webkit-user-select: text;
      -khtml-user-select: text;
      -moz-user-select: text;
      -ms-user-select: text;
      user-select: text;
    }

    .usage label { 
      font-size: 12px; 
      text-align: right; 
      padding: 0 3px 0 60px;
    }
    .usage label:first-child { padding-left: 0; }
    .usage .name { width: 180px; }
    .usage .html { width: 80px; }
    .usage .css { width: 80px; }

    footer {
      color: #888;
      font-size: 12px;
      padding: 20px 0;
    }

.ion,  .ion-ios7-email, .ion-ios7-telephone{ display: inline-block; font-family: "Ionicons"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.ion-spin, .ion-loading-a, .ion-loading-b, .ion-loading-c, .ion-loading-d, .ion-looping, .ion-refreshing, .ion-ios7-reloading { -webkit-animation: spin 1s infinite linear; -moz-animation: spin 1s infinite linear; -o-animation: spin 1s infinite linear; animation: spin 1s infinite linear; }

@-moz-keyframes spin { 0% { -moz-transform: rotate(0deg); }
  100% { -moz-transform: rotate(359deg); } }

@-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(359deg); } }

@-o-keyframes spin { 0% { -o-transform: rotate(0deg); }
  100% { -o-transform: rotate(359deg); } }

@-ms-keyframes spin { 0% { -ms-transform: rotate(0deg); }
  100% { -ms-transform: rotate(359deg); } }

@keyframes spin { 0% { transform: rotate(0deg); }
  100% { transform: rotate(359deg); } }

.ion-loading-a { -webkit-animation-timing-function: steps(8, start); -moz-animation-timing-function: steps(8, start); animation-timing-function: steps(8, start); }



.ion-ios7-email:before { content: "\f187"; }


.ion-ios7-telephone:before { content: "\f1e6"; }