body {font-family: 'Open Sans', sans-serif;}
a:focus, a:visited {outline: none;}



/* header */
#cabecera {
  background: url(../img/background.jpg) bottom center no-repeat;
  background-color: #007fc2;
  padding-top: 150px;
  margin-top: -150px;
  overflow: hidden;
}
header {
  overflow: hidden;
  height: 150px;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
header .logo-sticky {
  display: none;
-webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

/*-------------------------------*/
/*    header smaller             */
/*-------------------------------*/

header.smaller {
  height: 100px; 
  width: 100%;
  background: #0e7dc5;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9;
  opacity: .9;
  overflow: visible;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s; 
}
header.smaller h1 {
  display: none;
-webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
header.smaller .logo-sticky {
  display: block;
-webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}



/* ****************************** */

h1 {margin: 0; padding-top: 20px;}
h2 {margin-top: 30px; color: #fff; font-size: 18px; font-weight: 300; font-style: italic; line-height: 130%;}


.header-libro {margin-left: -15px; position: relative; margin-bottom: -15px; margin-top: 20px;}
.header-precio {position: absolute; bottom: 35px; left: 270px; width: 126px; height: 126px; background: #b32424; color: #fff; border-radius: 63px; text-align: center; padding-top: 20px;}
a .header-precio {color: #fff; text-decoration: none;}
.header-precio strong {display: block; font-size: 24px;}


/* opiniones */

#opiniones {background: url(../img/bg-opiniones.gif) bottom center no-repeat; background-color:#f5f5f5;}





/* presentaciones */

#presentaciones {margin-bottom: 60px; padding-top: 20px;}
#presentaciones h3 {text-align: center; color: #333; margin: 0 0 30px 0; font-size: 24px; font-weight: 300;}


/* autor */

#autor {background: #0e7dc5; padding-top: 30px; padding-bottom: 200px; color: #fff;}
#autor h3 {text-align: center; margin: 0 0 40px 0;}
#autor p {margin: 0 0 12px 0;  line-height: 140%; font-size: 16px; font-weight: 300;}

#biografia {background: #fff;}
.mainat-foto {margin-top: -125px; margin-bottom: 20px; position: relative; text-align: center;}
.perfil {width: 258px; position: relative; margin: auto;}
.pensamiento {position: absolute; top: -30px; left: -30px; height: 70px; width: 70px;}

.bioMainat {text-align: center;}
.bioMainat h3 {color: #b32424; font-weight: 300; margin: 0 0 25px 0; color: #b32424; font-size: 24px;}
.bioMainat p {font-size: 16px; color: #666; line-height: 140%; margin-bottom: 12px;}
hr {border-top: 1px solid #51aee1 !important;}


.tapa {
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.6)), to(rgba(255, 255, 255, 1)));
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 1));
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 1));
  background: -o-linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 1));
  background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 1));
  background: linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 1));
  background-color: rgba(255, 255, 255, 0.6);
  width: 100%;
  position: relative;
  z-index: 2;
  height: 30px;
  margin-top: -30px;
  margin-bottom: 10px;
}


/* presentaciones */

.presentacion {border-radius: 10px; border: 1px solid #e5e5e5; overflow: hidden; height: 410px; position: relative; margin-bottom: 20px;}
.presentacion:hover {
  background: #f5f5f5;
  -webkit-box-shadow: 0px 0px 10px #c5c5c5;
  -moz-box-shadow: 0px 0px 10px #c5c5c5;
  box-shadow: 0px 0px 10px #c5c5c5;
}
.presentacion-foto {height: 215px; overflow: hidden; position: relative;}
.presentacion-fecha {position: absolute; top: 10px; left: 10px; width: 80px; height: 80px; border-radius: 40px; background: #51aee1; color: #fff; padding-top: 15px; text-align: center; font-size: 16px;}
.presentacion-fecha strong {display: block; font-size: 24px; font-weight: 300; line-height: 100%;}
.presentacion-info {padding: 10px;}
.presentacion-info h4 {font-size: 12px; color: rgb(81, 174, 225); margin: 0 0 10px 0;}
.presentacion-info h5, .presentacion-info h5 a, .presentacion-info h5 a:hover {font-size: 16px; color: rgb(51, 51, 51); margin: 0 0 12px; font-weight: 600; text-decoration: none;}
.presentacion-info h6 {color: #666; font-size: 14px;}
.presentacion-info p {position: absolute; bottom: 0px; left: 0; width: 100%; color: #666; font-size: 12px; margin: 0;}
.presentacion-info p a {padding: 10px 0; color: #666; display: block; border-top: 1px solid #e5e5e5; text-decoration: none; margin: 0 10px;}
.presentacion-info p a:hover {text-decoration: none;}

.masAgenda {margin-top: 20px; text-align: center;}
.masAgenda a, .masAgenda a:hover {color: #51aee1; text-decoration: none; line-height: 250%;}

  
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }



/* donde comprarlo */

#dondecomprarlo {color: #666;}
#dondecomprarlo h3 {font-weight: 400; font-size: 24px; color: #51aee1; margin: 0 0 15px 0;}
#dondecomprarlo ul {margin-top: 30px; margin-bottom: 30px;}
#dondecomprarlo li {
  background: url(../img/ico-list.png) no-repeat;
  padding-left: 30px;
  margin-bottom: 12px;
}
#dondecomprarlo .btn {padding: 15px 45px; font-size: 18px;}
#dondecomprarlo .btn-primary, #dondecomprarlo .btn-primary:hover {background: #51aee1; border:none;}
#dondecomprarlo img {margin-top: 20px;}


/* footer */

footer {background: #333; color: #c5c5c5; padding: 20px 10px; margin-top: 0px; position: relative; z-index: 2;}
footer .text-seo {font-weight: 300; text-align: center;}
.mediakit {text-align: center; padding: 15px; background: #484848; margin: 20px 0;}
.mediakit p {margin: 0;}
.mediakit a, footer .text-seo a {color: #51aee1; font-weight: 600; text-decoration: none;}
.mediakit a:hover, footer .text-seo a:hover {text-decoration: none;}
.studiogenesis {text-align: center; font-size: 12px; margin-top: 30px;}
.studiogenesis a, .studiogenesis a:hover {color: #c5c5c5; text-decoration: none;}



/*-------------------------------*/
/*    Carousel Fade Transition   */
/*-------------------------------*/

#fade-quote-carousel.carousel {
  padding-bottom: 60px;
  min-height: 425px;
}
#fade-quote-carousel.carousel .carousel-inner .item {
  opacity: 0;
  -webkit-transition-property: opacity;
      -ms-transition-property: opacity;
          transition-property: opacity;
}
#fade-quote-carousel.carousel .carousel-inner .active {
  opacity: 1;
  -webkit-transition-property: opacity;
      -ms-transition-property: opacity;
          transition-property: opacity;
}
#fade-quote-carousel.carousel .carousel-indicators {
  bottom: 10px;
}
#fade-quote-carousel.carousel .carousel-indicators > li {
  background-color: #51aee1;
  border: none;
}
#fade-quote-carousel blockquote {
    text-align: center;
    border: none;
}
#fade-quote-carousel .profile-circle {
    width: 100px;
    height: 100px;
    margin: 0 auto;
    border-radius: 100px;
}

.item {padding-top: 50px;}
.item p {font-weight: 300; color: #333; line-height: 150%; font-size: 18px;}
.item p strong {color: #666; font-weight: 400;}
.item p small {font-size: 12px;}



/*-------------------------------*/
/*    responsive                 */
/*-------------------------------*/


#myNavmenu.navmenu-default, #myNavmenu.navbar-default .navbar-offcanvas {
    background-color: #51aee1;
    border: none;
}
#myNavmenu.navmenu-default .navmenu-nav>li>a, #myNavmenu.navbar-default .navbar-offcanvas .navmenu-nav>li>a {
    color: #fff;
    opacity:0.8;
    border-left: 4px solid #0e7dc5;
}
#myNavmenu.navmenu-default .navmenu-nav>li>a:hover, #myNavmenu.navbar-default .navbar-offcanvas .navmenu-nav>li>a:hover, #myNavmenu.navmenu-default .navmenu-nav>li>a:focus, #myNavmenu.navbar-default .navbar-offcanvas .navmenu-nav>li>a:focus {
    color: #fff;
    background-color: transparent;
    border-left: 4px solid #fff;
}
#myNavmenu.navmenu-default .navmenu-nav>.active>a, #myNavmenu.navbar-default .navbar-offcanvas .navmenu-nav>.active>a, #myNavmenu.navmenu-default .navmenu-nav>.active>a:hover, #myNavmenu.navbar-default .navbar-offcanvas .navmenu-nav>.active>a:hover, #myNavmenu.navmenu-default .navmenu-nav>.active>a:focus, #myNavmenu.navbar-default .navbar-offcanvas .navmenu-nav>.active>a:focus {
    color: #fff;
    font-weight: 600;
    background-color: transparent;
    border-left: 4px solid #fff;
    opacity: 1;
}

.brandMobile {position: relative;}

/* mobile vertical */
@media screen and (max-width: 479px) {

  header, header.smaller {display: none;}

  .header-precio {bottom: 35px; left: 200px;}
  .presentacion {height: 350px; margin-bottom: 20px;}
  .presentacion-foto {height: 150px;}
  #dondecomprarlo {padding-bottom: 25px;}
  #cabecera {
    background: #007fc2;
    padding-top: 0px;
    margin-top: 0px;
  }

.navmenu, .navbar-offcanvas {
    width: 200px;
  }
  .navbar-default {
      background-color: transparent;
      border:none;
  }
  .navbar-default .navbar-toggle .icon-bar {background-color: #fff;}
  .navbar-default .navbar-toggle {border:none; background-color: #007fc2;}
  .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: #007fc2;
}
.brandMobile {padding-top: 10px; background-color: #007fc2;}

.idiomas {position: absolute; top: 12px; right: 70px; color: #fff;} 
  .idiomas a {
    color: #fff;
    position: relative;
    display: block;
    padding: 0px 2px !important;
    text-decoration: none;
    opacity: 0.8;
  }
  .idiomas a:hover {text-decoration: none; border-bottom: 2px solid #94d3f2; }
  .idiomas li.active a {border-bottom: 2px solid #94d3f2; opacity: 1;}

}

/* mobile horizontal */
@media (min-width: 480px) and (max-width: 767px) {

  h2 {width: 49%; margin-top: 20px;}

  header {overflow: visible; display: none}
  header.smaller {display: none; height: 150px;}
  .presentacion {min-height: 400px; height: inherit; margin-bottom: 20px;}
  .presentacion-foto {height: 250px;}
  .presentacion-foto img {min-width: 100%;}
  #dondecomprarlo {padding-bottom: 25px;}
  h1 {width: 49%; float: left;}

  #cabecera {
    padding-top: 150px;
    margin-top: -150px;
  }

.navmenu, .navbar-offcanvas {
    width: 200px;
  }
  .navbar-default {
      background-color: transparent;
      border:none;
  }
  .navbar-default .navbar-toggle .icon-bar {background-color: #fff;}
  .navbar-default .navbar-toggle {border:none; background-color: #007fc2;}
  .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: #007fc2;
}
.brandMobile {padding-top: 10px; background-color: transparent}

.idiomas {position: absolute; top: 15px; right: 80px; color: #fff;} 
  .idiomas a {
    color: #fff;
    position: relative;
    display: block;
    padding: 0px 2px !important;
    text-decoration: none;
    opacity: 0.8;
  }
  .idiomas a:hover {text-decoration: none; border-bottom: 2px solid #94d3f2; }
  .idiomas li.active a {border-bottom: 2px solid #94d3f2; opacity: 1;}
  
}

/* tablet vertical */
@media (min-width: 768px) and (max-width: 991px) {

  .presentacion {height: 350px;}
  .presentacion-foto {height: 120px;}
  .presentacion-fecha {position: absolute; top: 10px; left: 10px; width: 50px; height: 50px; border-radius: 45px; background: #51aee1; color: #fff; padding-top: 7px; text-align: center; font-size: 12px;}
  .presentacion-fecha strong {display: block; font-size: 18px; font-weight: 400; line-height: 100%;}
  #dondecomprarlo {padding-bottom: 25px;}
  footer {font-size: 12px;}
  .navbar {z-index: 3;}

  #cabecera {
    padding-top: 150px;
    margin-top: -150px;
  }

.navmenu, .navbar-offcanvas {
    width: 200px;
  }
  .navbar-default {
      background-color: transparent;
      border:none;
  }
  .navbar-default .navbar-toggle .icon-bar {background-color: #fff;}
  .navbar-default .navbar-toggle {border:none; background-color: #007fc2; display:block !important;}
  .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: #007fc2;
}
.brandMobile {padding-top: 10px; background-color: transparent; display: block !important;}

  header {overflow: visible; /*display: none*/}
  header.smaller {/*display: none;*/ height: 150px;}
  .navbar-header {display: none;}
  .idiomas {position: absolute; top: 15px; right: 80px; color: #fff;} 
  .idiomas a {
    color: #fff;
    position: relative;
    display: block;
    padding: 0px 2px !important;
    text-decoration: none;
    opacity: 0.8;
  }
  .idiomas a:hover {text-decoration: none; border-bottom: 2px solid #94d3f2; }
  .idiomas li.active a {border-bottom: 2px solid #94d3f2; opacity: 1;}

  /**/

  .navbar-default {
      background-color: transparent;
      border:none;
  }

  .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
      color: #fff;
      background-color: transparent;
      font-weight: 600;
      border-bottom: 2px solid #94d3f2;
      opacity: 1;
  }

  .navbar-inner,
  .navbar-fixed-top .navbar-inner,
  .navbar-fixed-bottom .navbar-inner,
  .navbar-static-top .navbar-inner {
    background: none;
    border: none;
    -webkit-border-radius: 0;
    border-radius: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    filter: none;
    padding: 0;
  }
  .navbar { margin-bottom: 0; }
  .navbar .nav { margin: 0; }
  .navbar .brand,
  .navbar .nav > li > a {
    text-shadow: none;
    color: #fff;
    font-weight: 400;
    padding-left: 6px; padding-right: 6px;
    opacity: 0.8;
    font-size: 11px;
  }
  .navbar .btn-navbar,
  .navbar .btn-navbar:hover {
    background: none;
    -webkit-border-radius: 0;
    border-radius: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0;
    padding: 0;
    text-shadow: none;
  }

  .collapse {border-right: 1px solid #fff; float: right;}

  .idiomas {float: right; margin-left: 5px; color: #fff; padding-top: 5px;}
  .idiomas a {
    color: #fff;
    position: relative;
    display: block;
    padding: 10px 2px !important;
    text-decoration: none;
    opacity: 0.8;
    font-size: 11px;
  }
  .idiomas a:hover {text-decoration: none; border-bottom: 2px solid #94d3f2; }
  .idiomas li.active a {border-bottom: 2px solid #94d3f2; opacity: 1;}

  .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
      color: #fff;
      background-color: transparent;
      border-bottom: 2px solid #94d3f2;
  }
  .nav-separador {display: none !important;}
  .navbar-default .navbar-collapse, .navbar-default .navbar-form {float: left;}
  header .container .container-fluid {padding: 0px;}
  .idiomas {
    position: absolute;
    top: 3px;
    right: 40px;
    color: #fff;
  }

}



/* pantalla grande */
@media (min-width: 992px) {
  
  /*-------------------------------*/
  /*    Reset navbar               */
  /*-------------------------------*/

  .navbar-default {
      background-color: transparent;
      border:none;
  }

  .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
      color: #fff;
      background-color: transparent;
      font-weight: 600;
      border-bottom: 2px solid #94d3f2;
      opacity: 1;
  }

  .navbar-inner,
  .navbar-fixed-top .navbar-inner,
  .navbar-fixed-bottom .navbar-inner,
  .navbar-static-top .navbar-inner {
    background: none;
    border: none;
    -webkit-border-radius: 0;
    border-radius: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    filter: none;
    padding: 0;
  }
  .navbar { margin-bottom: 0; }
  .navbar .nav { margin: 0; }
  .navbar .brand,
  .navbar .nav > li > a {
    text-shadow: none;
    color: #fff;
    font-weight: 400;
    padding-left: 10px; padding-right: 10px;
    opacity: 0.8
  }
  .navbar .btn-navbar,
  .navbar .btn-navbar:hover {
    background: none;
    -webkit-border-radius: 0;
    border-radius: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0;
    padding: 0;
    text-shadow: none;
  }

  .collapse {border-right: 1px solid #fff; float: right;}

  .idiomas {float: right; margin-left: 10px; color: #fff; padding-top: 5px;}
  .idiomas a {
    color: #fff;
    position: relative;
    display: block;
    padding: 10px 2px !important;
    text-decoration: none;
    opacity: 0.8;
  }
  .idiomas a:hover {text-decoration: none; border-bottom: 2px solid #94d3f2; }
  .idiomas li.active a {border-bottom: 2px solid #94d3f2; opacity: 1;}

  .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
      color: #fff;
      background-color: transparent;
      border-bottom: 2px solid #94d3f2;
  }

}

/* tablet horizontal - pantalla media */
@media (min-width: 992px) and (max-width: 1199px) {

  #dondecomprarlo img {margin-top: 80px;}
  #autor p {font-size: 14px;}
  .navbar .nav > li > a {font-size: 12px; padding-left: 7px; padding-right: 7px;}
  .idiomas {margin-left: 7px; padding-top: 7px;}
  .idiomas a {font-size: 12px; padding-left: 7px; padding-right: 7px;}
  .presentacion {height: 370px;}
  .presentacion-foto {height: 174px;}


}