@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

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

body, html { font-size: 100%; padding: 0; margin: 0; height: 100%;}


body {
   font-family: 'Lato', Calibri, Arial, sans-serif;
   color: #777;
   background: #f6f6f6;
   overflow: hidden;
}

a img {
   border: none;
}

.main {
   margin: 0 auto;
   padding: 2em;
   max-width: 69em;
}

.container {
   height: 100%;
}

a {
   color: #1baede;
   text-decoration: none;
   outline: none;
}

a:hover, a:active {
   opacity: 0.6;
}




@font-face {

   font-family: 'arrows';

   src:url('../fonts/arrows/arrows.eot');

   src:url('../fonts/arrows/arrows.eot?#iefix') format('embedded-opentype'),

      url('../fonts/arrows/arrows.woff') format('woff'),

      url('../fonts/arrows/arrows.ttf') format('truetype'),

      url('../fonts/arrows/arrows.svg#arrows') format('svg');

   font-weight: normal;

   font-style: normal;

}



.bb-custom-wrapper {

   width: 100%;

   height: 100%;

   position: relative;

}



.bb-custom-wrapper .bb-bookblock {

   width: 100%;

   height: 100%;

   -webkit-perspective: 2000px;

   -moz-perspective: 2000px;

   perspective: 2000px;

}



.bb-custom-side {

   width: 50%;

   float: left;

   height: 100%;

   overflow: hidden;

   /* Centering with flexbox */

   /*

   display: -webkit-box;

   display: -moz-box;

   display: -webkit-flex;

   display: flex;

   -webkit-flex-direction: row;

   flex-direction: row;

   -webkit-flex-wrap: wrap;

   flex-wrap: wrap;

   -webkit-box-pack: center;

   -moz-box-pack: center;

   -webkit-justify-content: center;

   justify-content: center;

   -webkit-box-align: center;

   -moz-box-align: center;

   -webkit-align-items: center;

   align-items: center;

   */

}



.bb-custom-side.left-side {

   display: -webkit-box;

   display: -moz-box;

   display: -webkit-flex;

   display: flex;

   -webkit-flex-direction: row;

   flex-direction: row;

   -webkit-flex-wrap: wrap;

   flex-wrap: wrap;

   -webkit-box-pack: center;

   -moz-box-pack: center;

   -webkit-justify-content: center;

   justify-content: center;

   -webkit-box-align: center;

   -moz-box-align: center;

   -webkit-align-items: center;

   align-items: center;

}



.bb-custom-firstpage h1 {

   font-size: 2.625em;

   line-height: 1.3;

   margin: 0;

   font-weight: 300;

}



.bb-custom-firstpage h1 span {

   display: block;

   font-size: 60%;

   opacity: 0.3;

   padding: 0 0 0.6em 0.1em;

}



.bb-custom-firstpage {

   text-align: center;

   padding-top: 15%;

   width: 50%;

   float: left;

   height: 100%;

}



.bb-custom-side p {

   padding: 0;

   font-size: 1.8em;

   font-weight: 300;

   margin: 0 0 0 .5em;

   clea: both;

}



.bb-custom-side.left-side p {

   padding: 0;

   margin: 0;

}



.bb-custom-wrapper p.meta {

   padding: 0;

   font-size: 1.2em;

   font-weight: 300;

   margin: 1em 0 1em .8em;

}



.bb-custom-wrapper p.readmore {

   padding: 0;

   font-size: 1.2em;

   font-weight: 300;

   margin: 1em 0 1em .7em;

}



.bb-custom-wrapper h3 {

   font-size: 1.8em;

   font-weight: 900;

   margin: 0.4em 0 1em .7em;

}



.bb-custom-wrapper > nav {

   width: 100%;

   height: 40px;

   margin: 1em auto 0;

   position: fixed;

   bottom: 20px;

   z-index: 1000;

   text-align: center;

}



.bb-custom-wrapper > nav a {

   display: inline-block;

   width: 40px;

   height: 40px;

   text-align: center;

   border-radius: 2px;

   background: #1baede;

   color: #fff;

   font-size: 0;

   margin: 2px;

}



.bb-custom-wrapper > nav a:hover {

   opacity: 0.6;

}



.bb-custom-icon:before {

   font-family: 'arrows';

   speak: none;

   font-style: normal;

   font-weight: normal;

   font-variant: normal;

   text-transform: none;

   line-height: 1;

   font-size: 30px;

   line-height: 40px;

   display: block;

   -webkit-font-smoothing: antialiased;

}



.bb-custom-icon-first:before,

.bb-custom-icon-last:before {

   content: "\e002";

}



.bb-custom-icon-arrow-left:before,

.bb-custom-icon-arrow-right:before {

   content: "\e003";

}



.bb-custom-icon-arrow-left:before,

.bb-custom-icon-first:before {

   -webkit-transform: rotate(180deg);

   -moz-transform: rotate(180deg);

   -ms-transform: rotate(180deg);

   transform: rotate(180deg);

}



/* No JS */

.no-js .bb-custom-wrapper {

   height: auto;

}



.no-js .bb-custom-content {

   height: 470px;

}



@media screen and (max-width: 61.75em){

   .bb-custom-side {

      font-size: 70%;

   }

}



@media screen and (max-width: 33em){

   .bb-custom-side {

      font-size: 60%;

   }

}















nav.bullets {

    bottom: 10px;

    text-align: center;

    height: 10px;

}



nav.bullets span {

    background: none repeat scroll 0 0 #f0f0f0;

    border-radius: 50%;

    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2) inset, 0 2px 1px rgba(255, 255, 255, 0.9);

    cursor: pointer;

    display: inline-block;

    height: 12px;

    margin: 3px;

    width: 12px;

}



nav.bullets span.bb-current {

    background: none repeat scroll 0 0 #ecb700;

}