/*
Theme Name: The HTML5 Reset Theme
Theme URI: http://html5reset.org
Description: A style-free theme to get you started on an HTML5-based WordPress theme of your own.
Author: Monkey Do! + @ckhicks
Author URI: http://monkeydo.biz
Version: 2.0
*/

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* A Linux- and Windows-friendly sans-serif font stack: http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body {font: 13px;}

/* Using local fonts? Check out Font Squirrel's webfont generator: http://www.fontsquirrel.com/tools/webfont-generator */

/* We like off-black for text. */
body, select, input, textarea {color: #333;}

a {color: #03f;}
a:hover {color: #69f;}

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #e8e7e8; color: #000; text-shadow: none;}
::selection {background: #e8e7e8; color: #000; text-shadow: none;}

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #e8e7e8;}

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }


/* And here begins the WordPress fun.
-------------------------------------------------------------------------------*/

@font-face {
  font-family: "Polder Grotesk Beta 03";
  src: url("Polder-Grotesk-Beta_03.otf") format("opentype"); }
body {
  font: 100% "Polder Grotesk Beta 03";
  color: #000;
  margin: 0 auto; }

.overlay {
  position: fixed;
  top: 0;
  height: 100%;
  width: 100%;
  background: #fff;
  z-index: 9999;
  display: none; }
  .overlay img {
    height: 100%;
    display: block;
    margin: 0 auto; }
  .overlay .full {
    font-size: 55px;
    text-align: center;
    margin-top: 45vh;
  }

  .overlay .info {
    position: fixed;
    bottom: 30px;
    left: 30px;
  }

  .overlay .info h1 {
    font-size: 17px;
    line-height: 28px;
  }

  .overlay .info h2 {
    font-size: 12px;
  }

  .overlay a {
    position: absolute;
    top: 3%;
    right: 3%;
    font-size: 33px;
    color: #000;
    text-decoration: none; }

.wrapper {
  overflow-x: hidden; }

.fill {
  min-width: 1200px;
  max-width: 1640px;
  margin: 0 auto;
  border-right: 1px solid #000;
  border-left: 1px solid #000;
  height: 37px; }

.content {
  max-width: 102.5em;
  margin-left: auto;
  margin-right: auto;
  min-width: 1200px;
  max-width: 1640px;
  border-right: 1px solid #000;
  border-left: 1px solid #000;
  position: relative; }
  .content::after {
    clear: both;
    content: "";
    display: table; }
  .content .progressbar {
    width: 100%;
    height: 1px; }
    .content .progressbar .progressbar-inner {
      -webkit-transition: all 0.6s;
      -moz-transition: all 0.6s;
      transition: all 0.6s;
      height: 100%;
      width: 0%;
      max-width: 100%;
      background: #000; }
  .content .textnavigation {
    position: absolute;
    right: 3%;
    top: 2%; }
    .content .textnavigation a {
      color: #000;
      text-decoration: none;
      padding-left: 30px;
      font-size: 23px; }
  .content .ghost {
    height: 1px;
    width: 1px; }
  .content header {
    will-change: transform, opacity;
    top: 0;
    position: relative;
    height: 360px;
    width: 88%;
    margin: 4% 4% 0; }
    @media screen and (max-width: 1200px) {
      .content header {
        margin: 48px 48px 0; } }
    .content header .fix {
      position: fixed;
      height: 360px;
      width: 88vw;
      max-width: 1403.2px;
      min-width: 1056px;
      padding: 0 0 0 20px;
      z-index: -1;
      background: #fff; }
    .content header h1 {
      font-size: 55px;
      line-height: 70px;
      letter-spacing: -1px; }
    .content header h2 {
      padding-top: 13px;
      font-size: 17px;
      line-height: 23px; }
  
  .content footer {
    z-index: 0;
    overflow: hidden;
    position: relative;
    top: 36px;
    height: 285px;
    width: 100%;
    }

  
    .content footer .fix-foot {
      min-width: 1200px;
      max-width: 1640px;
      bottom: 50px;
      padding-left: 4%;
      padding-right: 4%;
      width:inherit;
      position: fixed;
      opacity: 0;
    }

    .content footer .mobile-foot {
        display: none;
        }


      @media only screen 
      and (min-device-width : 320px) 
      and (max-device-width : 667px) { 
         .content footer {
          z-index: -1;
          padding-top: 56px;
          position: relative;
          top: 0x;
          height: auto;
          width: 100%;
          }
        .content footer .fix-foot {
        display: none;
        }
        .content footer .mobile-foot {
        display: inline-block;
        }
      }

      
      


       @media screen and (max-width: 1200px) {
      .content footer .fix-foot {
        padding-left: 48px; } }

        @media screen and (min-width: 1640px) {
      .content footer .fix-foot {
        padding-left: 66px; } }

    .content footer .left {
      width: 29%;
    }
    .content footer .left p{
        font-size: 17px;
        line-height: 23px;
        padding: 0px 20px;
    }

    .content footer .right {
      position: absolute;
      text-align: right;
      bottom: 0;
      right: 4%;
    }

    .content footer .right p{
        font-size: 17px;
        line-height: 23px;
        padding: 0px 20px;
    }
    
    .content footer a {

      font-size: 17px;
      line-height: 23px;

      color: #000;
      text-decoration: none; }
  .content .fix-2 {
    position: relative;
    background: #fff;
    z-index: 1; }
  .content .fix-2.sticky {
    position: fixed;
    top: 0; }
  .content .bookshelf-content {
    background: #fff;
    z-index: 1; }
  .content .row {
    display: block;
    overflow: hidden; }
    .content .row::after {
      clear: both;
      content: "";
      display: table; }
    .content .row .col {
      border-right: 1px solid #000;
      margin-bottom: -99999px;
      padding-bottom: 99999px; }
      .content .row .col h1 {
        text-align: center;
        font-size: 17px;
        line-height: 23px;
        padding: 6px 0; }
      .content .row .col p {
        font-size: 17px;
        line-height: 23px;
        padding: 15px 20px; }
      .content .row .col img {
        width: 100%;
        padding: 19px 20px;
        cursor: pointer; }
      .content .row .col span {
        display: inline-block;
        width: 100%; }
      .content .row .col ul {
        padding: 15px 20px; }
        .content .row .col ul li a {
          font-size: 17px;
          color: #000;
          line-height: 23px;
          text-decoration: none; }
    .content .row .one {
      float: left;
      display: block;
      margin-right: 0%;
      width: 4%;
      text-align: center; }
      .content .row .one:last-child {
        margin-right: 0; }
    .content .row .two {
      float: left;
      display: block;
      margin-right: 0%;
      width: 14.0%; }
      .content .row .two:last-child {
        margin-right: 0; }
    .content .row .three {
      float: left;
      display: block;
      margin-right: 0%;
      width: 14.0%; }
      .content .row .three:last-child {
        margin-right: 0; }
    .content .row .four {
      float: left;
      display: block;
      margin-right: 0%;
      width: 23%; }
      .content .row .four:last-child {
        margin-right: 0; }
    .content .row .five {
      float: left;
      display: block;
      margin-right: 0%;
      width: 14.0%; }
      .content .row .five:last-child {
        margin-right: 0; }
    .content .row .six {
      float: left;
      display: block;
      margin-right: 0%;
      width: 23%; }
      .content .row .six:last-child {
        margin-right: 0; }
    .content .row .seven {
      float: left;
      display: block;
      margin-right: 0%;
      width: 8%;
      border-right: none; }
      .content .row .seven:last-child {
        margin-right: 0; }
  .content .full-border {
    margin: 0px -99999px;
    padding: 0px 99999px;
    border-bottom: 1px solid #000;
     }


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {

}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Always do mobile-first, and consider using em units: http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw

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

} */