/* FONTS --------------------------------------------------------- */
@font-face{
  font-family: 'Roboto';
  src: url('../fonts/Roboto-Regular.woff2') format('woff2'),
      url('../fonts/Roboto-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face{
  font-family: 'RobotoBold';
  src: url('../fonts/Roboto-Bold.woff2') format('woff2'),
      url('../fonts/Roboto-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
}

:root{
  --green: #367E84;
  --green-lemon: #D8E15C;
  --medium-green: #007473;
  --dark-green: #163E43;
  --grey: #89a2ae;
  --dark-grey: #231f20;
  --light-grey: #e7ecef;
}

.main-coronavirus{
  font-family: 'Roboto', Arial, Helvetica, sans-serif;
  font-size: 16px;
  word-wrap: initial !important;
}
.main-coronavirus section{
  padding: 50px 0;
}
.main-coronavirus h2{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  font-size: 35px;
  margin: 0 auto 30px auto;
  color: var(--medium-green);
}
.main-coronavirus h3,
.main-coronavirus h4{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  font-size: 25px;
}
@media (max-width: 991px){
  .main-coronavirus h2{
    font-size: 25px;
  }
  .main-coronavirus h3,
  .main-coronavirus h4{
    font-size: 20px;
  }
}
.main-coronavirus p{
  font-size: 16px;
  line-height: 1.3;
  margin-bottom: 20px;

  @media (max-width: 991px){
    font-size: 16px;
  }
}
.main-coronavirus strong{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
}
.main-coronavirus p a:hover,
.main-coronavirus p :focus,
.main-coronavirus p :active{
  text-decoration: underline;
}
.queEsCoronavirus a:focus,
.queEsCoronavirus a:active,
.queEsCoronavirus a:hover{
  text-decoration: underline;
}
.main-coronavirus ul{
  list-style-position: inside;
}
.main-coronavirus .text-regular{
  font-family: 'Roboto', Arial, Helvetica, sans-serif;
}
.main-coronavirus .text-bold{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
}
.main-coronavirus .text-italic{
  font-style: italic;
}
.main-coronavirus .text-green{
  color: var(--green);
}
.main-coronavirus .text-green-dark{
  color: var(--dark-green);
}
.main-coronavirus .text-grey{
  color: var(--grey);
}
.main-coronavirus .bgGreen{
  background: var(--medium-green);
}
.main-coronavirus .bgGreenLemon{
  background: var(--green-lemon);
}
.main-coronavirus .bgDarkGreen{
  background: var(--dark-green);
}
.main-coronavirus .bgLightGrey{
  background: var(--light-grey);
}
.main-coronavirus .bgWashHands{
  background: url('../img/corona/bg-wash-hands.jpg') no-repeat center center;
  background-size: cover;
}
.main-coronavirus .btnCustom{
  display: inline-block;
  background: none;
  font-size: 15px;
  line-height: 30px;
  color: var(--dark-green);
  border: 1px solid var(--dark-green);
  border-radius: 0;
  height: auto;
  padding: 5px 20px;
  cursor: pointer;
  margin-top: 10px;
}
.main-coronavirus .btnCustom i{
  font-size: 19px;
  line-height: 30px;
  margin-right: 3px;
}
.main-coronavirus .btnCustom:hover,
.main-coronavirus .btnCustom:active,
.main-coronavirus .btnCustom:focus{
  background: var(--dark-green);
  color: white;
}
.main-coronavirus .btnCustom.btnShare{
  border: 0;
}
.main-coronavirus .btnCustom.btnShare:hover,
.main-coronavirus .btnCustom.btnShare:focus,
.main-coronavirus .btnCustom.btnShare:active{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  background: none;
  color: var(--dark-green);
}

/* HERO -------------------------------------------- */
.main-coronavirus .hero{
  min-height: 450px;
}
.main-coronavirus .hero.benefit-compra{
  background: url('../img/corona/hero.jpg') no-repeat center right;
  background-size: cover;
}
.main-coronavirus .hero::before{
  background-color: #889DA9;
}
.main-coronavirus .hero h2{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  font-size: 6rem;
  line-height: 6rem;
  color: white;
  margin: 0 0 15px 0;
}
@media (max-width: 991px){
  .main-coronavirus .hero{
    min-height: 350px;
  }
  .main-coronavirus .hero h2{
    font-size: 4.3rem;
    line-height: 4.3rem;
  }
}
.main-coronavirus .hero p{
  margin-top: 0;
}

/* QUE ES -------------------------------------------- */
.main-coronavirus .queEsCoronavirus .helpLinks ul li{
  padding: 5px 10px;
}

.main-coronavirus .queEsCoronavirus .helpLinks ul li button,
.main-coronavirus .queEsCoronavirus .helpLinks ul li a{
  margin-top: 0;
  text-decoration: none;
}

.main-coronavirus .queEsCoronavirus .textBox{
  position: relative;
  margin-top: 50px;
  padding-bottom: 50px;
}

.main-coronavirus .queEsCoronavirus .textBox::before{
  content: url('../img/vaccine.svg');
  display: block;
  width: 138px;
  height: 138px;
  position: absolute;
  right: 0;
  bottom: -10px;
}

.main-coronavirus .queEsCoronavirus .textBox p{
  max-width: 600px;
  margin: 20px auto 0 auto;
}

@media (max-width: 991px){
  .main-coronavirus .queEsCoronavirus .textBox::before{
    display: none;
  }
}

@media (max-width: 576px){
  .main-coronavirus .queEsCoronavirus .helpLinks ul li{
    width: 100%;
    padding: 5px 0!important;
  }
  .main-coronavirus .queEsCoronavirus .helpLinks ul li:last-child{
    border-left: 0;
  }
}

/* VACUNACIÓN INFO -------------------------------------------- */
.vacunaInfoContainer{
  padding: 80px 0 50px 0;
}

@media (max-width: 767px){
  .vacunaInfoContainer{
    padding: 50px 0;
  }
  .vacunaInfoContainer .qContainer > li{
    text-align: center;
  }
}

.vacunaInfoContainer .qContainer{
  list-style: none;
  counter-reset: item;
}

.vacunaInfoContainer .qContainer > li {
  position: relative;
  counter-increment: item;
}

.vacunaInfoContainer .qContainer > li::before{
  content: counter(item);
  border-radius: 100%;
  width: 80px;
  height: 80px;
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  font-size: 55px;
  text-align: center;
  display: inline-block;
  background: var(--white);
  color: #C4C4C4;
  position: absolute;
  left: 0;
  top: -25px;
}

.vacunaInfoContainer .qContainer li .qBox{
  padding-left: 100px;
}

@media (max-width: 767px){
  .vacunaInfoContainer .qContainer > li.last{
    margin-top: 50px;
  }

  .vacunaInfoContainer .qContainer > li::before{
    position: initial;
  }

  .vacunaInfoContainer .qContainer li .qBox{
    padding: 0;
    margin-top: 30px;
  }
}

.vacunaInfoContainer .qContainer li .qBox h3{
  color: var(--dark-green);
  margin-bottom: 20px;
}

.vacunaInfoContainer .qContainer li .qBox ul li{
  max-width: 290px;
  margin: 40px 0;
}

.vacunaInfoContainer .qContainer li .qBox ul li:first-child{
  margin-left: 0;
}

.vacunaInfoContainer .qContainer li .qBox ul li:last-child{
  margin-right: 0;
}

@media (max-width: 576px){
  .vacunaInfoContainer .qContainer li .qBox ul li{
    margin: 40px 0 0 0;
  }
}

.vacunaInfoContainer .qContainer li .qBox ul li p{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  margin: 20px 0 0 0;
  font-size: 16px;
}

/* VACUNACIÓN BENEFICIOS -------------------------------------------- */
.vacunacionBenefContainer{
  padding: 50px 0;
}
.vacunacionBenefContainer h3{
  font-size: 30px;
  color: var(--medium-green);
}

.vacunacionBenefContainer .beneficiosList .beneficioBox{
  margin: 40px auto 0 auto;
  max-width: 400px;
}

.vacunacionBenefContainer .beneficiosList .beneficioBox img{
  width: 100%;
  max-width: 100px;
  margin-bottom: 15px;
}

.vacunacionBenefContainer .beneficiosList .beneficioBox p{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  margin-bottom: 0;
  /* font-size: 16px; */
}

/* VACUNACIÓN MITOS -------------------------------------------- */
.vacunacionMitosContainer .mitosBanner-text{
  padding: 70px 4vw;
  color: var(--white);
  margin: 0 auto 0 0;
}

.vacunacionMitosContainer .mitosBanner-text h3{
  margin-bottom: 20px;
}

.vacunacionMitosContainer .mitosBanner-text p{
  margin: 0;
}

.vacunacionMitosContainer .mitosBanner-image img{
  width: 100%;
  height: 335px;
  object-fit: cover;
}

/* VACUNACIÓN SINTOMAS -------------------------------------------- */
.vacunaSintomasContainer{
   padding: 50px 0;
}

.vacunaSintomasContainer h3{
  color: var(--dark-green);
  margin-bottom: 20px;
}

/* RECOMENDACIONES -------------------------------------------- */
.main-coronavirus .recomendacionesBox .owl-carousel .owl-item .item{
  text-align: center;
  padding: 0 40px;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-item .item img{
  width: auto;
  max-width: 140px;
  margin: 30px auto;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-item .item p{
  margin-bottom: 0;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  height: 37px;
  text-align: center;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-nav button{
  position: absolute;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-nav button span{
  display: block;
  width: 37px;
  height: 37px;
  text-indent: -9999px;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-nav button.owl-prev{
  left: -10px;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-nav button.owl-prev span{
  background: url('../img/corona/back.svg') no-repeat center center;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-nav button.owl-next{
  right: -10px;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-nav button.owl-next span{
  background: url('../img/corona/next.svg') no-repeat center center;
}
.main-coronavirus .recomendacionesBox .owl-carousel .owl-nav button.disabled{
  opacity: 0.5;
}

/* MANTENTE INFORMADO -------------------------------------------- */
.main-coronavirus .mantenteInformadoBox .tabBox .nav-tabs .nav-item{
  width: 50%;
  max-width: 200px;
  text-align: center;
}
.main-coronavirus .mantenteInformadoBox .tabBox .nav-tabs .nav-item a{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  padding: 20px;
  border: 0;
  font-size: 2.5rem;
}
@media (max-width: 1199px){
  .main-coronavirus .mantenteInformadoBox .tabBox .nav-tabs .nav-item a{
    font-size: 20px;
  }
}
.main-coronavirus .mantenteInformadoBox .tabBox .nav-tabs a.active{
  color: var(--green);
}
.main-coronavirus .mantenteInformadoBox .tabBox .tab-content{
  background: white;
  padding: 30px;
}
.main-coronavirus .mantenteInformadoBox .tabBox .tab-content .newsBox:last-child{
  margin-bottom: 0 !important;
}
.main-coronavirus .mantenteInformadoBox .tabBox .tab-content .newsBox h3{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  color: var(--green);
  font-size: 20px;
}
.main-coronavirus .mantenteInformadoBox .tabBox .tab-content .newsBox p.date{
  color: var(--grey);
  font-size: 15px;
  margin-top: 5px;
}

/* PREVENCIÓN -------------------------------------------- */
.main-coronavirus .prevencionBox{
  min-height: 500px;
}
.main-coronavirus .prevencionBox h2{
  max-width: 650px;
  color: white;
  margin: 0 auto;
}

/* MATERIALES EDUCATIVOS -------------------------------------------- */
.main-coronavirus .materialesEducativosBox .materialesContent .materialesBox:last-child{
  margin-bottom: 0 !important;
}
.main-coronavirus .materialesEducativosBox .materialesContent .materialesBox h3{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  color: var(--green);
  font-size: 20px;
}
.main-coronavirus .materialesEducativosBox .materialesContent .materialesBox p.date{
  color: var(--grey);
  font-size: 15px;
  margin-top: 5px;
}

/* MÁS RECURSOS -------------------------------------------- */
.main-coronavirus .masRecursos .recursoLink{
  position: relative;
  padding-left: 45px;
  margin: 20px 0 0 0;
}
.main-coronavirus .masRecursos .recursoLink:before{
  position: absolute;
  left: 15px;
  content: url('../img/corona/ico-link.svg');
}

/* SOCIAL FOOTER -------------------------------------------- */
.main-coronavirus .socialFooter{
  padding: 30px;
  background: var(--green);
}
.main-coronavirus .socialFooter i{
  font-size: 30px;
}
.main-coronavirus .socialFooter li{
  font-family: 'RobotoBold', Arial, Helvetica, sans-serif;
  font-size: 16px;
  margin: 0 5px;
}
.main-coronavirus .socialFooter li:first-child{
  margin-right: 20px;
}