@charset "utf-8";
:root {
  --color-azul         : rgba(2, 75, 145, 100);
  --color-celeste      : #1E73BE;
  --color-verde        : rgba(42, 209, 5, 100);
  --color-verde-oscuro : rgb(34, 168, 4);
  --color-gris-light   : #F8F8FB;
  --color-blanco       : #FFF;
  --color-rojo         : red;

}
.color-rojo {
  color : var(--color-rojo);
}
.bg-rojo {
  background-color : var(--color-rojo);
}
.border-rojo {
  border-color : var(--color-rojo);
}
.color-celeste {
  color : var(--color-celeste);
}
.bg-celeste {
  background-color : var(--color-celeste);
}
.border-celeste {
  border-color : var(--color-celeste);
}
.color-blanco {
  color : var(--color-blanco);
}
.bg-blanco {
  background-color : var(--color-blanco);
}
.border-blanco {
  border-color : var(--color-blanco);
}
.color-gris-light {
  color : var(--color-gris-light);
}
.bg-gris-light {
  background-color : var(--color-gris-light);
}
.border-gris-light {
  border-color : var(--color-gris-light);
}
.color-azul {
  color : var(--color-azul);
}
.bg-azul {
  background-color : var(--color-azul);
}
.border-azul {
  border-color : var(--color-azul);
}
.color-verde {
  color : var(--color-verde);
}
.bg-verde {
  background-color : var(--color-verde);
}
.border-verde {
  border-color : var(--color-verde);
}
.color-verde-oscuro {
  color : var(--color-verde-oscuro);
}
.bg-verde-oscuro {
  background-color : var(--color-verde-oscuro);
}
.border-verde-oscuro {
  border-color : var(--color-verde-oscuro);
}
body, html {
  font-family : "algera-regularregular", sans-serif;
  color       : var(--color-azul);
}
b, strong {
  /*font-family : "algera-boldregular", sans-serif;*/
}
textarea {
  resize      : none;
  form-sizing : content;
  min-height  : 1em;
}
/*
Al seleccionar un campo de ingreso de texto, o un select, en browser realiza un zoom. (iphone)
http://stackoverflow.com/questions/2989263/disable-auto-zoom-in-input-text-tag-safari-on-iphone 
*/
@media screen and (-webkit-min-device-pixel-ratio : 0) {
  select, textarea, input {
    font-size : 16px !important;
  }

  input[type="button"],
  input[type="submit"] {
    -webkit-appearance : none;

  }
}
.videoWrapper {
  position       : relative;
  /* 16:9 */
  padding-bottom : 56.25%;
  /* 4:3 */
  /*padding-bottom : 75%; */
  padding-top    : 0;
  height         : 0;
}
.videoWrapper iframe {
  position : absolute;
  top      : 0;
  left     : 0;
  width    : 100%;
  height   : 100%;
}
/*---- aspectRatios ----*/
.aspectRatio43,
.aspectRatio1,
.aspectRatio169,
.aspectRatio168,
.aspectRatio167,
.aspectRatio166,
.aspectRatio165,
.aspectRatio164 {
  position : relative;
}
:is(
  .aspectRatio43,
   .aspectRatio1,
   .aspectRatio169,
   .aspectRatio168,
   .aspectRatio167,
   .aspectRatio166,
   .aspectRatio165,
   .aspectRatio164):before {
  display : block;
  content : " ";
  width   : 100%;

}
.aspectRatio1:before {
  padding-top : 100%;
}
.aspectRatio43:before {
  padding-top : calc((3 / 4) * 100%);
  /*padding-top : 75%;*/
}
.aspectRatio169:before {
  padding-top : calc((9 / 16) * 100%);
}
.aspectRatio168:before {
  padding-top : calc((8 / 16) * 100%);
}
.aspectRatio167:before {
  padding-top : calc((7 / 16) * 100%);
}
.aspectRatio166:before {
  padding-top : calc((6 / 16) * 100%);
}
.aspectRatio165:before {
  padding-top : calc((5 / 16) * 100%);

}
.aspectRatio164:before {
  padding-top : calc((4 / 16) * 100%);
}
.backCover {
  background-position : center;
  background-size     : cover;
  background-repeat   : no-repeat;
}
.backContain {
  background-position : center;
  background-size     : contain;
  background-repeat   : no-repeat;
}
:is(input[type=password],input[type=text]).verificado {
  border     : none;
  box-shadow : 0 0 7px green;
}
:is(input[type=password],input[type=text]).incorrecto {
  border        : 1px solid red;
  border-radius : 2px;
  box-shadow    : 0 0 7px red
}

.mid-articulos .list a span.thumbnail {
  background-size     : cover;
  background-position : center;
  background-repeat   : no-repeat;
  display             : block;
}

.bodymask {
  background-color : #FFF;
  display          : none;
  position         : fixed;
  top              : 0;
  left             : 0;
  z-index          : 1000;
  opacity          : .7;

}
.paginacion span,
.paginacion a {
  color            : #FFF;
  text-decoration  : none;
  margin           : 5px;
  background-color : #658582;
  padding          : 5px 10px;
  transition       : .5s;
}
.paginacion a:hover,
.paginacion span {
  background-color : #FFF !important;
  color            : #658582;
  transition       : .5s;
}
.paginacion span {
  border : 1px solid #658582;
}

.owl-nav {
  position : absolute;
  bottom   : 29px;
  left     : 0;
}

.owl-prev, .owl-next {
  background-color : #333 !important;
}

.owl-dots {
  position : absolute;
  bottom   : 0;
}
#cboxTitle {
  position   : absolute;
  top        : -22px;
  left       : 0;
  color      : #EEE;
  background : #FFF;
  padding    : 0 5px 0 5px;
  font-size  : 14px;
}
#cboxTitle .btnGoFullScreen {
  color : #333;
}
:is(textarea,select,input)[data-validation-engine^="validate[required"] {
  background-color : #FFE8E8;
}

#boxes .backCover .h-100.bg-azul {
  background-color : rgba(2, 75, 145, .8) !important;
  transition       : .5s;
}
#boxes .backCover .h-100.bg-verde {
  background-color : rgba(42, 209, 5, .8) !important;
  transition       : .5s;
}
#boxes .backCover:hover .h-100.bg-azul {
  background-color : rgba(2, 75, 145, 1) !important;
  transition       : .5s;
}
#boxes .backCover:hover .h-100.bg-verde {
  background-color : rgba(42, 209, 5, 1) !important;
  transition       : .5s;
}

.shadow-pf {
  box-shadow : 64px 64px 120px -40px rgba(0, 0, 0, 0.08)
}
.bg-pf-100 {
  background-color    : #FFF;
  background-image    : url("/imagenes/100.png");
  background-position : center left;

}

#faq .cont-preguntas > ul {
  padding-left : 0;
}
#faq .cont-preguntas > ul > li {
  list-style-type : none;
}
#faq .cont-preguntas > ul > li {
  box-shadow    : 0px 0px 30px 0px rgba(0, 0, 0, 0.12);
  margin-bottom : 2em;
  padding       : 2em 2em 1em 2em;
  cursor        : pointer;
}
#faq .cont-preguntas > ul > li .open-pregunta {
  position : relative;
}
#faq .cont-preguntas > ul > li .open-pregunta.closed {
}
#faq .cont-preguntas > ul > li .open-pregunta.closed i.fa-angle-up {
  display : none;
}
#faq .cont-preguntas > ul > li .open-pregunta.closed + .pregunta {
  height   : 0;
  overflow : hidden;

}
#faq .cont-preguntas > ul > li .open-pregunta.opened {
}

#faq .cont-preguntas > ul > li .open-pregunta.opened i.fa-angle-down {
  display : none;
}
#faq .cont-preguntas > ul > li .open-pregunta.opened + .pregunta {
  height   : 100%;
  overflow : hidden;

}
#footer-portada {
  background-image : linear-gradient(180deg, #00052F00 16%, #024A91 16%);
}
#footer-portada .backContain {
  background-position : bottom right;
}


@media (min-width : 576px) {
  .aspectRatio-sm-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }
}
@media (min-width : 768px) {
  .aspectRatio-md-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }
}
@media (min-width : 992px) {
  .aspectRatio-lg-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }

}
@media (min-width : 1200px) {
  .aspectRatio-xl-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }
}
@media (min-width : 1400px) {
  .aspectRatio-xxl-none:before {
    display     : none !important;
    padding-top : 0 !important;
  }
}

.btn-pf-azul {
  background-color : transparent;
  border           : 2px solid var(--color-blanco);
  cursor           : pointer;
}
.z-index-2 {
  z-index : 2;

}