@import url(http://fonts.googleapis.com/css?family=Ubuntu+Condensed);
@import url(http://fonts.googleapis.com/css?family=Pontano+Sans);
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300);

/* Colors */
/* Brand colors */
.media, .bd {
  overflow: hidden;
  _overflow: visible;
  zoom: 1; }

.media .img {
  float: left; }

.media .img img {
  display: block; }

.media .imgExt {
  float: right; }

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

/* Use the following CSS code if you want to use data attributes for inserting your icons */
[data-icon1]:before {
  font-family: 'icomoon1';
  content: attr(data-icon);
  speak: none;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased; }

/* Use the following CSS code if you want to have a class per icon */
/*
Instead of a list of all class selectors,
you can use the generic selector below, but it's slower:
[class*="icon-"] {
*/
.icon-money, .icon-brain, .icon-hand, .icon-login {
  font-family: 'icomoon1';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased; }

.icon-money:before {
  content: "\e000"; }

.icon-brain:before {
  content: "\e001"; }

.icon-hand:before {
  content: "\e002"; }

.icon-login:before {
  content: "\e031"; }

#login-menu span {
  font-size: 2.5em !important; }

#main-nav {
  margin-bottom: 0 !important; }

#empty-menu {
  border-left: none !important; }

#gallery > #img-wrap{
  border-left: 0px;
  border-right: 0px;
}

.center img{
  margin-right: auto;
  margin-left: auto;
}

table.prices{
  margin-right: auto;
  margin-left: auto;
  border: 1px solid white;
  margin-top: 1em;
  margin-bottom: 1em;
}

table.prices td, table.prices th{
  padding: 10px;
  border: 1px solid white;
  background-color: #e5e5e5;
}
table.prices th{
  font-size: 90%;
}

p{
  text-align: left !important;
  /*font-style: italic;*/
}

footer p{
  text-align: center !important;
  font-style: normal !important;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif !important;    
}

#values h2 {
  font-size: 1.52em;
}

#values h2 img{
  max-width: 100%;
}

.about div{
  margin-top: 2%;
  margin-bottom: 10%;
}

.about div.last{
  margin-bottom: 3%;
}

.about .name{
  float: right;
  margin-bottom: 1em;
}

#about-img{  
  max-width: 100%;  
}

#why #about-img{
  float: left;
  display: block;
}

#why #about-p{
  max-width: 40em;
  margin: 0 auto;
}

#img-wrap {
  /*background-image: url(../img/landing.png);
  background-repeat: no-repeat;
  background-position: top center;*/
  /*margin: 0 auto;*/
  width: 100%;
  max-width: 74.9em;
  border: 0;
  /*padding: 0 2px;*/
  height: auto;

  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -o-border-radius: 0px;
  border-radius: 0px;
  box-shadow: 0 0px 0px rgba(0, 0, 0, .2);
  -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, .2);
  -moz-box-shadow: 0 0px 0px rgba(0,0,0,.2);
  -o-box-shadow: 0 0px 0px rgba(0,0,0,.2);
}

#img-wrap li{  
  list-style: none;
}

#img-wrap img{
  max-width: 100%;
  height: auto;
  /*height: 100%;*/
}

.georgia{
  font-family: Georgia !important;
}

#values {
  background: white;
  max-width: 74.9em;
  margin: 0 auto;
  padding: 1em;
  border-top: 1px solid #d5d5d5;
  border-bottom: 1px solid #d5d5d5;
  color: #4d4d4d; }
  #values div {
    text-align: center; }
    #values div h2 {
      font-size: 5em;
      margin: 0.25em 0; }
    #values div h3 {
      font-size: 1.5em;
      margin-bottom: 0.5em; }
    #values div p {
      font-family: 'Pontano Sans', sans-serif;
      max-width: 40em;
      margin: 0 auto; }
    #values div .icon-hand {
      color: #1c8ece; }
    #values div .icon-brain {
      color: #ff6732; }
    #values div .icon-money {
      color: #637b2a; }

#how, #why {
  background: white;
  max-width: 74.9em;
  margin: 0 auto;
  padding: 1em;
  border-top: 1px solid #d5d5d5;
  border-bottom: 1px solid #d5d5d5;
  color: #4d4d4d;
  margin-top: 20px; }
  #how h2, #why h2 {
    /*color: #1c8ece;*/
    font-size: 1.5em; }
  #how p, #why p {
    margin: 1em 0;
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;    
  }
  #how img, #why img {
    float: right;
    display: none; }

#why {
  margin-top: 0;
  border-top: none; }
  #why img {
    float: left; }
#why p{
  font-size: 1.2em;
}

h2 {
  text-align: center;
}

#usp {
  text-align: center;
  background: white;
  max-width: 74.9em;
  margin: 0 auto;
  padding: 1em; }
  #usp h1 {
    color: #4d4d4d;
    font-size: 2em;
    margin: 0.5em 0; }
  #usp p {
    color: #4d4d4d;
    font-family: 'Pontano Sans', sans-serif;
    /*max-width: 40em;*/
    margin: 0 auto; }
  #usp div {
    margin: 1em 0;
    padding-top: 1em; }
  #usp .reg-btn, #values .reg-btn, .reg-btn {
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 300;
    color: #fff;
    background: #31b7e8;
    border: none;
    padding: 0.5em 1em;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    text-decoration: none;
    -webkit-transition: all 0.3s ease-in-out;
    /* Safari 3.2+, Chrome */
    -moz-transition: all 0.3s ease-in-out;
    /* Firefox 4-15 */
    -o-transition: all 0.3s ease-in-out;
    /* Opera 10.5–12.00 */
    transition: all 0.3s ease-in-out;
    /* Firefox 16+, Opera 12.50+ */
    font-size: 1.2em;
    margin: 10px 0; 
    margin-left: 3%;
    margin-right: 3%;
  }
  #usp .log-btn {
    color: #1c8ece;
    text-decoration: none;
    font-size: 0.9em;
    margin: 10px 0;
    display: inline-block; }

.no-touch #usp .reg-btn:hover, .no-touch #usp .reg-btn:focus {
  background: #28cdff; }
.no-touch #usp .reg-btn:active {
  -webkit-box-shadow: "inset 1px 1px 1px 1px #000";
  box-shadow: "inset 1px 1px 1px 1px #000"; }

p.small{    
    font-size: 80%;
    text-align: center !important;
}

@media all and (max-width: 48em) {
  p.small{
    
  }

  #usp .reg-btn {
    display: block;
  }
  #full{
    margin-top: 4%;
    margin-bottom: 4%;
  }
  #full .reg-btn{
    display: block;
  }
  #img-wrap{
    height: auto;
  }
  #img-wrap img{
    height: auto;
    max-width: 100%;
  }
  #why p{
    font-size: 1em;
  }
}

div.grey{
  background-color: #d5d5d5;
  padding: 1em;
}

h1{
  text-align: center;
  color: #FF6732 !important;
}

h1, .ubuntu-condensed{
  font-family: 'Ubuntu Condensed', sans-serif;
}

.pontano-sans{
  font-family: 'Pontano Sans', sans-serif;
}

.open-sans{
  font-family: 'Open Sans Condensed', sans-serif;
}

.about p{
  font-style: italic !important;
}

@media all and (min-width: 48em) {
  #img-wrap, #usp, #values, #how, #why {
    border-right: 1px solid #d5d5d5;
    border-left: 1px solid #d5d5d5; 
    /*border-top: 1px solid #d5d5d5;*/
  }

  #usp, #values {
    font-size: 1.0em; }


  #full{
    width: 100% !important;
    margin-top: 3%;
  }

  #values {
    overflow: hidden;
    padding-bottom: 2em; }
    #values div {
      padding: 0 1em;
      width: 33.333%;
      float: left; }

  #how, #why {
    overflow: hidden; }
    #how h2, #why h2 {
      font-size: 1.8em; }
    #how div, #why div {
      /*width: 75%;*/
      float: left;
      padding-right: 2em; }
    #how img, #why img {
      display: block;
      max-width: 25%; }

  #why div {
    float: right;
    padding-right: 0;
    padding-left: 2em; }
  #why img {
    margin-top: 30px; 
  }  

  #why #about-img{
    float: right;
    margin-top: 0;
  }

  .about div{
    margin-bottom: 0;
  }

}