/*  © Miguel Perez Alvarado - CSS 2019
* Author: Nomada Digital Ltd.;
*
* 
* 
*
********************/
/*  FONTS
********************/

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

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

}

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

}

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

}

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

}

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

}

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

}

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

}

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

}

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

}

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

}



/********************/
/*  MAIN
********************/
html{
  color:#383939;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  /* Prevent font scaling in landscape while allowing user zoom */
  letter-spacing: 0;
}


body{
  font-family: 'PT Sans', Roboto, Arial, Helvetica, sans-serif;
  background: #fff;
  /*background: #ebebeb;*/
}

html, body {height:100%!important;}


/*TEXTS & HEADINGS*/
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Dutch801RmBTBoldItalic', Helvetica, Arial, sans-serif;
  color: inherit;
  font-weight: normal;
}


/*  tags  */
p {
  font-family: 'PT Sans', Roboto, Arial, Helvetica, sans-serif;
  font-size: 1rem;
  /* 18px on desktop  */
  line-height: 1.7em;
  margin: 0 0 10px; }

h1, .h1 {
  font-size: 38px;
  font-size: 2.714rem;
  font-weight: bold;
  line-height: 1.3em;
  margin: 20px 0 10px; }

h2, .h2 {
  font-size: 35px;
  font-size: 2.2rem;
  line-height: 1.3em;
  margin: 20px 0 10px; }

h3, .h3 {
  font-size: 36px;
  font-size: 2.0rem;
  line-height: 1.3em;
  margin: 20px 0 10px; }

h4, .h4 {
  font-size: 24px;
  font-size: 1.716rem;
  line-height: 1.5em;
  margin: 10px 0 10px; }

h5, .h5 {
  font-size: 20px;
  font-size: 1.429rem;
  line-height: 1.5em;
  margin: 10px 0 10px; }

h6, .h6 {
  font-size: 18px;
  font-size: 1.2rem;
  line-height: 1.5em;
  margin: 10px 0 10px; }

small {font-size: 85%; }

.upper{text-transform: uppercase;}

em {
  /*  do not globally make all <em>'s italic  */ }

i {
  font-style: italic; }

p em, li em, td em {
  font-style: italic; }

/*a p, a h1, a h2, a h3, a h4, a h5, a h6 {
  color: #383939; }*/

ol {
  list-style-type: decimal; }

ul {
  list-style-type: square; }

ul, ol {
  margin: 0 0 8px; }

ul li, ol li {
  margin-bottom: 0.2rem; }

strong, b {
  font-weight: bold; }

a, a:hover, a:focus {
  color: inherit; }

p a{
    border-bottom: 1px solid rgba(64,64,64,.5);
    display: inline;
    padding-bottom: 1px;
    text-decoration: none;
    transition: all 200ms ease-in-out;
}
p a:hover, p a:focus{
    color: rgba(64,64,64,1);
    border-bottom: 2px solid rgba(64,64,64,1);
    text-decoration: none;
    padding-bottom: 1px;
    transition: all 200ms ease-in-out;
}

p a.white{
    border-bottom: 1px solid rgba(255, 255, 255, .5);
    display: inline;
    padding-bottom: 1px;
    text-decoration: none;
    transition: all 200ms ease-in-out;
}
p a.white:hover, p a.white:focus{
    color: #fff;
    border-bottom: 2px solid rgba(255, 255, 255, 1);
    text-decoration: none;
    padding-bottom: 1px;
    transition: all 200ms ease-in-out;
}

/*  end Typography
********************/
@media (max-width: 767px) {
  /*  Globally scale down font-size on mobile  */
  html {
    font-size: .938em;}
  /*  Keep text component <p> at 18px for optimal <40cpl */
  p {
    font-size: 1rem;
    margin: 0 0 2em;
  }
}
@media (min-width: 1200px) {
  /*  Scale up text component font-size on 1170px grid.  */
  p {
    font-size: 1.1rem;
    margin: 0 0 2em;
  }
}
@media (min-width: 1400px) {
  /*  Scale up text component font-size on 1370px grid.  */
  p {
    font-size: 1.15rem;
    margin: 0 0 2em;
  }
}

.font-kabel{font-family: 'KabelUltBTUltra', Helvetica,  Arial, sans-serif;}
.font-dutch{font-family: 'Dutch801RmBTBoldItalic', Helvetica, Arial, sans-serif;}
.font-candela{font-family: 'CandelaBook', Roboto, Arial, Helvetica, sans-serif;}
.font-voll{font-family: 'Vollkorn', serif;}
.font-playfair{font-family: 'Playfair Display', serif;}
.font-ptserif{font-family: 'PT Serif', serif;}
.font-ptsans{font-family: 'PT Sans', Roboto, Arial, Helvetica, sans-serif;}
.font-fujiyama{font-family:'FujiyamaRegular', Helvetica, Arial, sans-serif;text-transform: uppercase;}
.font-josefin{font-family: 'Josefin Sans', sans-serif;}
.font-EBgaramond{font-family: 'EB Garamond', serif;}
.font-gelasio{font-family: 'Gelasio', serif;}
.font-suezone{font-family: 'Suez One', serif;}


/********************/
/*  COLOURS
********************/
.white{color: #fff;}
.yellow{color: #F9BA33;}
.grey{color: #5b6063!important;}
.black{color: #404141!important;}
.orange{color:rgb(182, 68, 26)!important;}
.lightcoral{color: rgb(240, 128, 128);}
.light-blue{color: #a5fffe!important;}
.blue{color:#3f5c82;}
.burgundy{color:#b85b62;}
.dark-grey{color:#323232;}
.pink{color:#C34651 /*#db9096*/;}
.bg-pale-white{background-color:#f2f1e9!important;}
.bg-pale-purple{background-color:#57484a!important;}
.bg-pale-yellow{background-color: #f1f0df!important;}
.bg-light-purple{background-color:#f1edf4!important;}
.bg-pale-brown{background-color:#7f5340!important;}
.bg-blue{background-color:#3f5c82;}
.bg-yellow{background-color: #F9BA33;}
.bg-lightyellow{background-color: #faeeba;}
.bg-lightcream{background-color: #e8e9d0;}
.bg-dark{background-color: rgba(21, 19, 19, 1)!important;}
.bg-grey{background-color:#5b6063!important;}
.bg-darkgrey{background-color: rgb(62, 60, 64)!important;}
.bg-orange{background-color:#e1913b!important;}
.bg-purple{background-color: #aeacb6!important;}
.bg-hilo{
    background-image: url(../images/hilodetrespuntas_bg.jpg);
    background-repeat: no-repeat;
    background-position: top;
    border: none;
    padding: 0% 0% 70.3125% 0%!important;
    height: 0;
    background-size: contain;
    background-color:#e1913b!important;
}
.bg-abordajes{background-color:#ababab!important;}
.bg-sepia{background-color: #eee9b8!important;}
.bg-palenavy{background-color: rgb(33, 37, 41)!important;}



/********************/
/*  MENU
********************/


a h3.logo{
  font-size:28px;
  font-size:1.2rem;
  background: -webkit-linear-gradient( #fff 0%, #ccc 100%);
  /*background: -webkit-linear-gradient( #30CFD0 0%, #24809e 100%);*/
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
   transition: ease-in-out .15s;
   margin: 6px 0 10px;
 }
a h3.logo:hover{
  background: -webkit-linear-gradient( #fff 0%, #fff 100%);
  /*background: -webkit-linear-gradient( #30CFD0 100%, #24809e 0%);*/
   -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 3px rgba(255, 238, 178,.4);
 }
 @media (max-width: 768px){ a h3.logo{font-size: 1.2rem;}}

.site-header {
  background-color: rgba(21, 19, 19, 1);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
}
.site-header a {
  color: #ccc;
  transition: ease-in-out .15s;
}
.site-header a:hover {
  color: #fff;
  text-decoration: none;
}


.navbar-dark .navbar-nav .de-vida, .navbar-dark .navbar-nav .escrituras, .navbar-dark .navbar-nav .lodicho, .navbar-dark .navbar-nav .contacto{
  cursor: pointer;
  display: inline-block;
  position: relative;
  top: 0px;
  border-bottom: 0px solid rgba(255,255,255, 0);
  transition: ease-in-out .15s;
  color: rgba(255,255,255,.5);
}
.navbar-dark .navbar-nav .active-devida>.nav-link, .navbar-dark .navbar-nav .nav-link.active-devida, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link,
.navbar-dark .navbar-nav .active-escrituras>.nav-link, .navbar-dark .navbar-nav .nav-link.active-escrituras, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link,
.navbar-dark .navbar-nav .active-lodicho>.nav-link, .navbar-dark .navbar-nav .nav-link.active-lodicho, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link,
.navbar-dark .navbar-nav .active-contacto>.nav-link, .navbar-dark .navbar-nav .nav-link.active-contacto, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link {
  top: -.2rem;
  color: rgba(255,255,255,1);
  border-bottom: 2px solid rgba(255,255,255, 1);
  padding-bottom: 0px;
}
.navbar-dark .navbar-nav .de-vida>.nav-link:hover, .navbar-dark .navbar-nav .nav-link.de-vida:hover, .navbar-dark .navbar-nav .de-vida>.nav-link:focus, .navbar-dark .navbar-nav .nav-link.de-vida:focus,
.navbar-dark .navbar-nav .escrituras>.nav-link:hover, .navbar-dark .navbar-nav .nav-link.escrituras:hover, .navbar-dark .navbar-nav .escrituras>.nav-link:focus, .navbar-dark .navbar-nav .nav-link.escrituras:focus,
.navbar-dark .navbar-nav .lodicho>.nav-link:hover, .navbar-dark .navbar-nav .nav-link.lodicho:hover, .navbar-dark .navbar-nav .lodicho>.nav-link:focus, .navbar-dark .navbar-nav .nav-link.lodicho:focus,
.navbar-dark .navbar-nav .contacto>.nav-link:hover, .navbar-dark .navbar-nav .nav-link.contacto:hover, .navbar-dark .navbar-nav .contacto>.nav-link:focus, .navbar-dark .navbar-nav .nav-link.contacto:focus {
  top: -.2rem;
  border-bottom: 1px solid rgba(255,255,255, .5);
  padding-bottom: 0px;
}

.navbar{padding: 1rem 1.5rem;}

.navbar-nav li:hover>.dropdown-menu {
  display: block;
  visibility: visible;
}

.navbar-toggler{
  background-color: none;
  border: none;
}
.menu-text{
      overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
        visibility: hidden;
}
.navbar-toggler-icon{
display: flex;
    position: relative;
    background-image: none!important;
  }
button:focus{outline: 2px solid #fff;}

.navbar-toggler-icon:after, .navbar-toggler-icon:before{
  content: "";
    position: absolute;
    top: 16px;
    left: 2px;
    width: 20px;
    height: 2px;
    background: #fff;
    -webkit-transition: -webkit-transform .3s ease-out;
    transition: -webkit-transform .3s ease-out;
    transition: transform .3s ease-out;
    transition: transform .3s ease-out,-webkit-transform .3s ease-out;
}
.navbar-toggler-icon:after{
  top: auto;
    bottom: 16px;
}
button.navbar-toggler-icon:focus{
    -webkit-transform: translateY(3px) rotate(135deg);
    transform: translateY(3px) rotate(135deg);
}
.dropdown-menu{
    /*top: 3rem;*/
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: 1rem 0;
    margin: .125rem 0 0;
    font-size: 0.8rem;
    color: #ccc;
    text-align: left;
    list-style: none;
    background-color: rgba(21, 19, 19, 1);
    visibility: hidden;
    background-clip: padding-box;
    border: 0px;
    border-radius: 0px;
    transition: all 200ms ease;
}
.dropdown-toggle::after {
  display: none;
}
.chevron::before {
  border-style: solid;
  border-width: 0.1em 0.1em 0 0;
  content: '';
  display: inline-block;
  height: 0.45em;
  left: 0.15em;
  position: relative;
  top: 0.15em;
  transform: rotate(-45deg);
  vertical-align: top;
  width: 0.45em;
  left: 0;
  transform: rotate(45deg);
}

.chevron.bottom:before {
  top: 0.4em;
  left: 0.2em;
  transform: rotate(135deg);
}

a.dropdown-item span{
  color: rgba(255,255,255,.5);
  border-bottom: 1px solid rgba(255,255,255,0);
  text-decoration: none;
  padding-bottom: 1px; 
  transition: all 200ms ease-in-out;
}
a.dropdown-item span.active-item{
  text-shadow: 0 0 15px rgba(75, 194, 238,0.6); color:rgb(75, 194, 238);
}
a.dropdown-item:hover span{
  color: rgba(255,255,255,1);
  border-bottom: 1px solid rgba(255,255,255,0.5);
  text-decoration: none;
  padding-bottom: 1px;
  transition: all 200ms ease-in-out;
}
a.dropdown-item:hover {
  background-color: rgba(255,255,255,0);
}

/********************/
/*  HOME
********************/

/*
 * Spacing on top row
 */
.bg-tweak{
  padding-bottom: 5rem;
  padding-top: 10rem;
  /*margin-top: -5.2rem;*/
}

.bg-home{
  padding-bottom: 4rem;
  padding-top: 9rem;
  background-color: rgb(220, 220, 220);
  /*margin-top: -5.2rem;*/
}


/*HOME ANIMATION
*/
#intro{padding: 5rem 0rem;}
.bg-transition{
  color: hsla(352, 9%, 31%, 1);
  -webkit-animation: bg-colour 2000ms 0ms ease-in;
  animation: bg-colour 2000ms 0ms ease-in;
  animation-fill-mode: forwards;
}
.text00{
  color: hsla(355, 40%, 54%, 0);
  text-align: center;
  font-weight:normal;
  position: relative;
  top: 8rem;
  -webkit-animation: text-block 1500ms 3000ms ease-in-out;
  animation: text-block 1500ms 3000ms ease-in-out;
  animation-fill-mode: forwards;
}


@media (max-width: 1280px){
  h1{ font-size: 2.2rem;}
}
@media (max-width: 1024px){
  h1{ font-size: 2.05rem;}
}
@media (max-width: 992px){
  h1{ font-size: 1.9rem;}
  .bg-home{
    padding-bottom: 3rem;
    padding-top: 8rem;}
}
@media (max-width: 768px){
  h1{ font-size: 2rem;}
  .text00{top: 0rem;animation: none;}
  .bg-home{
  padding-bottom: 0rem;
  padding-top: 6rem;}
  .firma{width: 80%;height: auto;}
}

.text01B{
  -webkit-animation: text-blurB 1500ms 200ms ease-in-out;
  animation: text-blurB 1500ms 200ms ease-in-out;
  animation-fill-mode: forwards;
}
.text02B{
  -webkit-animation: text-blurB 1500ms 500ms ease-in-out;
  animation: text-blurB 1500ms 500ms ease-in-out;
  animation-fill-mode: forwards;
}
.text03B{
  -webkit-animation: text-blurB 1500ms 2000ms ease-in-out;
  animation: text-blurB 1500ms 2000ms ease-in-out;
  animation-fill-mode: forwards;
}
.text01{
  -webkit-animation: text-blur 1500ms 200ms ease-in-out;
  animation: text-blur 1500ms 200ms ease-in-out;
  animation-fill-mode: forwards;
}
.text02{
  -webkit-animation: text-blur 1500ms 500ms ease-in-out;
  animation: text-blur 1500ms 500ms ease-in-out;
  animation-fill-mode: forwards;
}
.text03{
  -webkit-animation: text-blur 1500ms 2000ms ease-in-out;
  animation: text-blur 1500ms 2000ms ease-in-out;
  animation-fill-mode: forwards;
}
.text04{
  -webkit-animation: opacity 1500ms 4000ms ease-in-out;
  animation: opacity 1500ms 4000ms ease-in-out;
  animation-fill-mode: forwards;
  opacity: 0;
}
.text05{
  -webkit-animation: opacity 1500ms 5000ms ease-in-out;
  animation: opacity 1500ms 5000ms ease-in-out;
  animation-fill-mode: forwards;
  opacity: 0;
}
.books{
   -webkit-animation: booksintro 1500ms 200ms ease-in-out;
  animation: booksintro 1500ms 200ms ease-in-out;
  animation-fill-mode: forwards;
  top: 8rem;
  opacity: 0;
}

.shape{
  width: 4px;
  height: 40px;
  margin: 4em auto;
}

.semi{
  background-color: hsla(176, 42%, 54%, 0);
  transform: rotate(90deg) translateY(10px);
  margin: 1rem auto;
  -webkit-animation: semi 1500ms 3200ms ease-in-out;
  animation: semi 1500ms 3200ms ease-in-out;
  animation-fill-mode: forwards; 
}
.semi02{
  background-color: hsla(176, 42%, 54%, 0);
  transform: rotate(-90deg) translateY(10px);
  margin: 1rem auto;
  -webkit-animation: semi02 1500ms 3200ms ease-in-out;
  animation: semi02 1500ms 3200ms ease-in-out;
  animation-fill-mode: forwards; 
}

@keyframes text-blurB{
  from{
    color: hsla(355, 40%, 54%, 0);
    filter: blur(10px);
  }
  to{
    color: hsla(355, 40%, 54%, 1);
    filter: blur(0px);
  } 
}
@keyframes text-blur{
  from{
    color: hsla(60, 100%, 80%, 0);
    filter: blur(10px);
  }
  to{
    color: hsla(60, 100%, 80%, 1);
    filter: blur(0px);
  } 
}

@keyframes booksintro{
  from{
    top: 8rem;
    opacity: 0;
  }
  to{
    top: 0rem;
    opacity: 1;
  } 
}

@-webkit-keyframes text-block{
  from{top: 8rem;}
  to{ top: 1rem;} 
}

@keyframes text-block{
  from{top: 8rem;}
  to{ top: 1rem;} 
}

@keyframes opacity{
  from{opacity: 0;}
  to{opacity: 1;} 
}

@keyframes semi{
  from{
    background-color: hsla(176, 100%, 0%, 0);
    transform: rotate(90deg) translateX(100px);
  }
  to{
    background-color: hsla(176, 100%, 0%, .5);
    transform: rotate(90deg) translateX(0px);
  } 
}
@keyframes semi02{
  from{
    background-color: hsla(176, 100%, 0%, 0);
    transform: rotate(-90deg) translateX(100px);
  }
  to{
    background-color: hsla(176, 42%, 0%, .5);
    transform: rotate(-90deg) translateX(0px);
  } 
}
@keyframes bg-colour{
  from{background-color: hsla(0, 5%, 8%, 1);}
  to{background-color: hsla(352, 9%, 31%, 1);} 
}

/*
 * Book catalogue
 */
.book{margin: 1em;}

a:hover {text-decoration: none;}

.book img, .book h2, .book p {
  transition: all 300ms ease-in-out;
}
.book:hover img, .book:focus img {
  -webkit-transform: translateY(-20px);
  transform: translateY(-20px);
  box-shadow: 0 1rem 3rem rgba(0,0,0,.3)!important;
  /*-webkit-transform: scale(1.05);
  transform: scale(1.05);*/
}
.book:hover h2,  .book:hover p, .book:focus h2,  .book:focus p {
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
  /*-webkit-transform: scale(1.05);
  transform: scale(1.05);*/
}
.book-txt-lg{
  margin: 3rem 0 0 0;
  padding: 1rem 0;
  float: left;
}

.book-img-lg{
  width: 22%;
  height: 19em;
  margin-top: 2em;
  margin-right: 10em;
  float: right;
}
@media (max-width: 992px){
  .book-img-lg{
  width: 50%;
  height: 300px;
  margin-left: auto!important;
  margin-right: auto!important;
  float: none;
  }
  .book-txt-lg{
  margin: 1rem 0;
  padding: 1rem 0;
  margin-left: auto!important;
  margin-right: auto!important;
  float: none;
}
}

.pb-2rem{padding-bottom:2rem!important;}

/*CONTAINER*/
@media (max-width: 767px){
  .container {padding: .5rem 1rem;}
  .mb-xs-3{margin-bottom: 1rem!important;}
}
@media (min-width: 768px){
  .container {padding: .5rem 1.5rem;}
}
@media (min-width: 992px){
  .container {padding: .5rem 2rem;}
}

section.container {
  padding: 0px;
}
.margin-top {
  margin-top: 9vw;
}
.sticky {
  position: -webkit-sticky!important;
  position: sticky!important;
  top: 8rem;
}
.sticky-tabs {
  position: -webkit-sticky!important;
  position: sticky!important;
  top: 3rem;
}
/*
 * Home top row decoration 
 */
.product-device {
  position: absolute;
  left: 60%;
  bottom: -40%;
  width: 100%;
  height: 60%;
  background-color: #333;
  background: url("../images/home-decoration01.png") no-repeat;
}
.product-device::before {
  position: absolute;
  top: 10%;
  right: 10px;
  bottom: 10%;
  left: 10px;
  content: "";
  
}

.product-device-2 {
  top: -25%;
  right: auto;
  bottom: 0;
  left: 5%;
}

/********************/
/*  DE VIDA
********************/

/*
 * Spacing on top row
 */

h2.lead:before {
  content: '— ';
  }
      
h2.lead:after {
  content: ' —';
  }

h2.noDash:before {
  content: '';
  }
      
h2.noDash:after {
  content: '';
  }

p.subtitle:before {
  content: '— ';
  }
      
p.subtitle:after {
  content: ' —';
  }

/*.bg-devida-container{
  top: -15%;
    padding-top: 0;
    width: 105vw;
    height: 105vw;
    max-width: 120vh;
    max-height: 120vh;
  }
.bg-devida{
      position: absolute;
    top: -100px;
    left: -190px;
    width: 30%;
    height: 24%;
    border-radius: 188%;
    background: #d1fafd;
}
}*/

@media (min-width: 993px){
  .offset-img-left{
  margin: 0rem 2rem 0rem -10rem;
  float: left;
  }
  .offset-img-right{
  margin: 0rem -10rem 0rem 2rem;
  float: right;
  }
}
@media (max-width: 992px){
  .offset-img-left{
    margin: 0rem 2rem 0rem -5rem;
    float: left;
  }
  .offset-img-right{
    margin: 0rem -5rem 0rem 2rem;
    float: right;
  }
}
@media (max-width: 768px){
  .offset-img-left, .offset-img-right{
    margin-left: auto!important;
    margin-right: auto!important;
    float: none;
  }
}

.bg-devida{
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: top; 
  background-size: contain;
  background-color: #e2d8cc;
}
.bg-devida-blue{
  background-image: url('../images/bg-devida-coast.jpg');
  padding-bottom: 18rem;
  padding-top: 8rem;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: bottom; 
  background-size: contain;
  background-color: #86cce6;
}

@media (min-width: 1400px){
  .bg-devida-blue{padding-bottom: 24rem;}
}
@media (max-width: 992px){
  .bg-devida-blue{padding-bottom: 10rem;}
}
@media (max-width: 768px){
  .bg-devida-blue{padding-bottom: 4rem;}
  .devida p.lead{font-size: 1.15rem; margin-top: 6rem;}
}

/*.bg-devida{
  background-image: url('../images/bg-devida.jpg');
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: top; 
  background-size: contain;
  background-color: #f2f1e9;
}

@media (max-width: 768px){
  .bg-devida{background-size: auto;background-position: 0% 1%;}
  .devida p.lead{font-size: 1.15rem; margin-top: 6rem;}
}/*

/********************/
/*  LEVANTADO TEMPLO
********************/

.bg-pale-purple-gradient{background: -webkit-linear-gradient(180deg, #928fa1 10%, #7c788d 100%);}

 header#templo {
  position: relative;
  height: 32rem;
  overflow: hidden;
}

.header-templo{ 
  background-image: url(../images/levantado-templo.jpg);
  background-attachment: fixed;
  background-position: 85% 5%;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color:#fff!important;
  transform: skewY(4deg);
  transform-origin: top right;
}

#templo h1 {
  font-size: 3rem;
  margin: 0;
  padding: 8rem 0 0;
}

header#templo h1, header#templo h2 {
  position: relative;
}
.templo-height{height: 24rem;}

@media (max-width: 450px) {
  .levantado-texts p{font-size:3.3vw!important;}
}

/********************/
/*  ABORDAJES
********************/
.header-abordajes{
    position: relative;
    z-index: 0;
    background-image: url(../images/abordajes_bg.jpg);
    background-repeat: no-repeat;
    background-position: top;
    border: none;
    padding: 0% 0% 36.5% 0%!important;
    width: 100%;
    /*height: 0;*/
    background-size: contain;
    background-color:#ababab!important;
    margin-bottom: -8rem;
}
header#abordajes {
  position: relative;
  /*height: 32rem;*/
  overflow: hidden;
  padding: 0px;
}
.abordajes_deco01{
  position: relative;
  z-index: 1;
}
.abordajes-text{
  margin-top: 14rem;
  margin-left: 5%;
}
@media (max-width: 768px) {
  .header-abordajes{
    background-image: url(../images/abordajes_bg.jpg);
    background-position: 0% 25%;
    margin-bottom: -5rem;
  }
  .abordajes-text h1{
    font-size: 36px;
    font-size: 2.0rem;
    line-height: 1.3em;
    margin: 20px 0 10px; }
}

/********************/
/*  ABRA
********************/

.bg-abra{
  position: relative;
  z-index: 0;
  background-image: url(../images/abra_bg.jpg);
  background-repeat: no-repeat;
  background-position: 0em 0em;
  border: none;
  width: 100%;
  /*height: 0;*/
  background-size: cover;
  background-color:#10232c!important;
  padding-top: 0rem;
}
.abra-poems{
  margin-top: 22em;
}
.abra-texts p .indent{padding-left: 3rem;}


#abra h1{font-size: 3rem;}
#abra h2{font-size: 2rem;}
@media (min-width: 1350px) {
  #abra {margin-top: 4rem;
    padding-bottom: 6rem;
  }
}
@media (max-width: 1350px) {
  .bg-abra{background-position: 0em 4em;}
  .abra-poems{margin-top: 15em;}
}
@media (width: 1024px) and (height: 1366px) {
  .bg-abra{background-position: 0em -8em;}
  #abra {margin-top: 4rem;padding-bottom: 6rem;}
}
@media (width: 1024px) and (height: 768px) {
  .bg-abra{background-position: 0em 4em;}
  #abra {margin-top: 4rem;padding-bottom: 6rem;}
}



@media (max-width: 768px) {
  .abra-texts p{font-size:2.3vw!important;}
  .abra-texts p .indent{padding-left: 0rem;}
  .book-bg-tweak{padding-top: .1rem;}
  #abra h1{font-size: 2rem;}
  #abra h2{font-size: 1.5rem;}
  .abra-poems{margin-top: 10em;}
  #abra {margin-top: 8rem;}
}
@media (min-width: 400px) and (max-width: 768px) {
  .abra-poems{margin-top: 18em;}
  #abra {margin-top: 9rem;}
}
@media (max-width: 400px) {
  .abra-poems{margin-top: 18em;}
  #abra {margin-top: 9rem;}
}




/********************/
/*  LEVANTADO TEMPLO
********************/
@media (max-width: 767px){ .teoria-poems p {font-size: .9rem; margin: 0 0 1.8em;}}
/********************/
/*  ALA Y SAL
********************/


/********************/
/*  TRAS LA SÍSTOLE
********************/
.bg-sistole{
  background-color: #e2d8cc;
}

.tls-graphic{
  width: 50%;
  height: auto;
}
#tls i{color: #C34651;}
@media (max-width: 992px){
  .tls-graphic{width: 70%;}
}
@media (max-width: 768px){
  .tls-graphic{width: 75%;}
}


/********************/
/*  HILO DE TRES PUNTAS
********************/

@media (max-width: 768px) {
  .hilo-header h1{font-size:2rem;}
  .margin-top {margin-top: 6rem;}  
  img {margin-top: 1rem;}
}


/*****************************/
/*  PARA EL SALTO LA PALABRA
******************************/
/*.bg-paraelsalto{
  position: relative;
  z-index: 0;
  background-image: url(../images/paraelsalto-cubierta.gif);
  background-repeat: no-repeat;
  background-position: 0em 0em;
  border: none;
  width: auto;
  height: 0;
  background-size: cover;
  background-color:#bec1c5!important;
  padding-top: 0rem;
}*/


/********************/
/*  LO DICHO
********************/
.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
  color: #eee9b8;
  background-color: rgba(21, 19, 19, 1);
}
.nav-pills .nav-link {
  font-size: 1.2rem;
  border-radius: 0rem;
  border: none;
  padding: .5rem 1rem;
  margin: 0 1rem 0 0;
  transition: all 200ms ease-in-out;
}
#navbar-example .nav-pills:hover, #navbar-example .nav-link:hover {
  background-color: rgba(21, 19, 19, .2);

}
.nav-tabs {
  padding: 2rem 0 0rem;
  border-bottom: none;
}
.tabs-spacing{padding-top: 10rem;}
ul.lista{
  list-style:none;
  padding:0px;
  border:none;
  margin-left:0px;
}

ul.lista li{
  padding: 0px;
  border:0px;
  padding:.7rem .5rem;
}

ul.lista li a{
  font-size:.9rem;
  border-bottom: 1px solid rgba(64,64,65,0);
  display: inline;
  padding-bottom: 1px;
  text-decoration: none;
  color:#171717;
  text-indent:inherit;
  transition: all 200ms ease-in-out;
}



ul.lista li a:hover{
  color:#000000;
  border-bottom: 2px solid rgba(64,64,65,1);
}

ul.lista li#par{
  background-color:#e3d8a1;
}

ul.lista-white{
  list-style:none;
  padding:0px;
  border:none;
  margin-left:0px;
}

ul.lista-white li{
  padding: 0px;
  border:0px;
  padding:.5rem .0rem .5rem 0;
}

ul.lista-white li a{
  font-size:80%;
  border-bottom: 1px solid rgba(255,255,255,.5);
  display: inline;
  padding-bottom: 1px;
  text-decoration: none;
  color:#fff;
  text-indent:inherit;
  transition: all 200ms ease-in-out;
}



ul.lista-white li a:hover{
  color:#fff;
  border-bottom: 2px solid rgba(255,255,255,1);
}


/********************/
/*  FOOTER
********************/

footer {
  background-color: rgba(21, 19, 19, 1);
}
.footer-padding{
  padding: .5rem 1.5rem;
}

a.footer-links{
    font-size: 0.8rem;
    color: #f2f2f2;
    border-bottom: 1px solid rgba(255,255,255,0);
    display: inline;
    padding-bottom: 1px;
    text-decoration: none;
    transition: all 200ms ease-in-out;
}

a.footer-links-sm{
    font-size: 0.8rem;
    color: #bababa;
    border-bottom: 1px solid rgba(255,255,255,0);
    text-decoration: none;
    padding-bottom: 1px;
}
a.footer-links-sm:hover {
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,0.5);
    text-decoration: none;
    padding-bottom: 1px;
    transition: all 200ms ease-in-out;
}

a.footer-links:hover, a.footer-links:focus {
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,0.5);
    text-decoration: none;
    padding-bottom: 1px;
    transition: all 200ms ease-in-out;
}
.footer-legal{text-align: right!important;}
@media (max-width:992px){
  .footer-legal{text-align: left!important;margin-top: 2rem;}
}





/*************************/
/*  RESPONSIVE UTILITIES
**************************/

.flex-equal > * {
  -ms-flex: 1;
  flex: 1;
}
@media only screen and (max-device-width:360px){
  /*.header-templo{ background-position: -30% 20%; }*/
}

@media (min-width: 768px) {
  .flex-md-equal > * {
    -ms-flex: 1;
    flex: 1;
  }
}
@media (max-width: 767px) {
  .dropdown-menu{background-color: rgba(21, 19, 19, 0);padding: 0rem 0rem 0rem 1.1rem;}
  .navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link, .navbar-dark .navbar-nav .nav-link {padding-left: 0rem!important;}
  .dropdown-item {padding: .25rem .25rem; }
  .header-templo{ background-position: 90% 0%; }
  .sticky-tabs{top:3.7rem;}
}
@media (min-width: 768px) and (max-width: 991px) {
  .header-templo{ background-position: 90% 10%; }
}

.overflow-hidden { overflow: hidden; }