/* DIA CLUB FYBECA */
#maincontent .home-main.homepage {
    background-size: cover !important;
    background-repeat: no-repeat;
    background-attachment: fixed !important;
    background: url("https://staging-na01-difarma.demandware.net/on/demandware.static/-/Sites-FybecaEcuador-Library/default/v2eba9619cd1642be95ac61ce6b47589397b7957f/images/other-pages/background_home_dfybeca.png");
    background-blend-mode: overlay;
}

/* ACERCA DE NOSOTROS */
#header_banner {
    background: url(https://staging-na01-difarma.demandware.net/on/demandware.static/-/Sites-FybecaEcuador-Library/default/dwb6d48428/images/other-pages/placeholder-large-breakpoint.jpg);
    background-position: center;
    background-size: cover;
}

#header_banner .transparencia {
    background: rgba(250, 250, 250, .7);
}

.title-adn {
    font-family: Ubuntu Bold, Arial, sans-serif;
    border-bottom: 1px solid #263A5A;
}

.title-adn h3 {
    font-family: Ubuntu, Arial, sans-serif;
    font-size: 1.3rem;
}

#menu_desktop {
    background: #fff;
    padding: 2rem;
}

.menuNosotros .list-group-item {
    font-family: Ubuntu Medium, Arial, sans-serif;
    text-align: center;
    margin-bottom: 10px;
    border: 1px solid #203A5D;
    background-color: #203A5D;
    border-radius: 8px;
    padding: 1.1rem 1rem;
    color: #ffffff;
}

.menuNosotros .list-group-item-action:hover {
    z-index: 1;
    color: #203A5D;
    text-decoration: none;
    background-color: #f8f9fa;
}

.menuNosotros .list-group-item.active {
    background-color: #FF8700;
    border: 1px solid #FF8700;
}

.menuNosotros .list-group-item:first-child {
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

.menuNosotros .list-group-item:last-child {
    margin-bottom: 0px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

#menu_desktop .list-group-item+.list-group-item,
#seleccion .list-group-item+.list-group-item {
    border-top-width: 1px;
}

#menu_seleccion .card,
#acerca_de_nosotros .card,
#politicas_privacidad .card,
#preguntas_frecuentes .card {
    border-radius: 0px;
}

#encabezado.card-header {
    background-color: #ffffff;
    border-bottom: 0px;
}

.titleNav {
    transition: transform .2s ease-in-out;
}

.content-checkmark {
    font-size: 1rem;
    transform: rotate(-180deg);
    color: #FF8700;
}

.collapsed .content-checkmark {
    transform: rotate(0deg);
}

.collapsed.titleNav {
    border-bottom: 0px;
}

.content_video {
    max-width: 800px;
    width: 85%;
    margin: 0 auto;
}

.content_video iframe {
    width: 100%;
}

.ico_prod_our {
    margin: 0 auto 15px;
    width: 80%;
    max-width: 80px;
    display: block;
}

.titProdOur {
    font-family: Ubuntu Bold, Arial, sans-serif;
    border-bottom: 1px solid #C6C6C6;
    text-align: center;
    margin: 0 auto 20px;
    width: 150px;
}

.btn-link-nosotros {
    background: #e40520;
    margin: 0 auto;
    display: block;
    max-width: 80%;
    color: #fff;
    font-size: .8rem;
}

.titleAsk {
    background: #fff;
    border: 2px solid #707070;
    border-radius: 5px;
}

#preguntas_frecuentes .titleAsk {
    background: rgba(136, 143, 164, 0.13);
    border: 2px solid rgba(136, 143, 164, 0.13);
}

.titleAsk .content-collapse-title {
    font-family: Ubuntu Bold, Arial, sans-serif;
    font-size: 1rem;
    color: #203A5D;
}

.link-default {
    color: #FF8700;
    text-decoration: none;
}

.year-timelapse {
    width: 80px;
}

.img-fyb-tempo {
    width: 90%;
    margin: 0 auto;
    display: block;
}

.cuadro-timelapse {
    border: 2px solid #203A5D;
    padding: 1rem .5rem;
    border-radius: 8px;
}

.fatherComunidad {
    border-bottom: 2px dotted #B7B7B7;
    margin-bottom: 2rem;
}

.subtComunidad {
    display: block;
    position: relative;
    text-align: center;
    width: max-content;
    margin: 0 auto;
    color: #FF8700;
    font-family: Ubuntu Medium, Arial, sans-serif;
    font-size: 1.3rem;
    padding: 5px 0;
}

.subtComunidad::before {
    content: "";
    position: absolute;
    background: #203A5D;
    display: block;
    width: .35rem;
    height: .35rem;
    bottom: 0;
    line-height: 0;
    color: transparent;
    top: 0;
    margin: auto;
    left: -20px;
    border-radius: .35rem;
    outline: none;
}

.subtComunidad::after {
    content: "";
    position: absolute;
    background: #203A5D;
    display: block;
    width: .35rem;
    height: .35rem;
    bottom: 0;
    line-height: 0;
    color: transparent;
    top: 0;
    margin: auto;
    right: -20px;
    border-radius: .35rem;
    outline: none;
}

.logoComunidad {
    width: 70%;
    max-width: 90px;
    margin: 0 auto;
    display: block;
    margin-bottom: 10px;
}

.bloque-premios {
    max-width: 490px;
    margin: 0 auto;
}

.cuadro-premio {
    background: #F5F5F5;
    padding: 5px;
}

.cuadro-premio .year-premio {
    color: #FF8700;
    font-family: Ubuntu Bold, Arial, sans-serif;
    text-align: center;
    font-size: 2.85rem;
    margin: 0px;
}

.cuadro-premio p {
    font-size: .9rem;
    color: #203A5D;
}

.cuadro-premio .puesto-premio {
    color: #203A5D;
    font-family: Ubuntu Bold, Arial, sans-serif;
    text-align: center;
    margin: 0px;
}

@media (max-width:990px) {
    #header_banner {
        background: url(https://staging-na01-difarma.demandware.net/on/demandware.static/-/Sites-FybecaEcuador-Library/default/dwb6d48428/images/other-pages/placeholder-large-breakpoint.jpg);
        background-position: center;
        background-size: cover;
    }

    .img-fyb-tempo {
        width: 85%;
        max-width: 400px;
    }
}

@media (min-width:544px) and (max-width:990px) {
    .year-timelapse {
        width: 70%;
    }
}

@media (max-width:543px) {
    .year-timelapse {
        width: 76%;
    }

    .bloque-premios {
        max-width: 390px;
        width: 85%;
        margin: 0 auto;
    }

    .cuadro-premio {
        height: 100%;
    }

    .cuadro-premio .year-premio {
        font-size: 2.3rem;
    }

    .cuadro-premio p {
        font-size: .8rem
    }

    .cuadro-premio .puesto-premio {
        font-size: 1.2rem;
    }
}

/*CAMBIO TEXTO EDAD*/
div#form-birth-error{    
    visibility: hidden;
}
div#form-birth-error:before{    
    font-size: 11px;
    content: "Debes tener al menos 18 años para crear tu cuenta.";
    visibility: visible;
}

.city-sector-reminder-modal{
    display: none;
}

/* POPUP-ACUCHECK */
.show .modal-dialog.choose-bonus-product-dialog{
    max-width: 900px;
    overflow-y: visible;
    margin-top: auto;
}
.show .modal-dialog.choose-bonus-product-dialog .modal-header .close span{
    font-size: 2rem;
}
.modal-header{
    border-radius: 0;
    min-height: 0px;
}
.modal-body{
    position: relative;
    flex: 1 1 auto;
    padding: 0.1rem;
}
.show .modal-dialog.choose-bonus-product-dialog .bonus-products-btns{
    padding: .1rem;
}

/* POP UP DERMO*/
#popup-dermo {
    background-color: rgba(0,0,0,0.8);
    position: fixed;
    z-index: 5;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:0;
    -animation:autopopup 2s;
  }
  
  @-webkit-keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  @-moz-keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  @keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  
  #popup-dermo:target {
    transition:all 1s;
    opacity: 0;
    visibility: hidden;
  }
  
  .popup-contenedor-dermo {
    position: relative;
    margin:23% auto;
    padding:25px 50px;
    -background-color: #fafafa;
    background: url(https://www.fybeca.com/on/demandware.static/-/Sites-FybecaEcuador-Library/default/dw57c43237/images/generic-banner/fybeca-generic-topbanner-large.jpg);
    color:#333;
    border-radius: 40px;
    width:60%;
  }
  

  a.popup-cerrar {
    position: absolute;
    top:4px;
    right:15px;
    background-color: #333;
    padding:5px 8px;
    font-size: 20px;
    text-decoration: none;
    line-height: 1;
    color:#fff;
    border-radius:inherit;
  }

/* TEXTO PRECIO EINSTEIN*/
.tile-body .price-original, .tile-body .sales{
    font-size: .75rem;
}
.tile-body .large-price .value{
    font-size: 1.5rem;
}


/* COLOR BOTON BIO-EQUIVALENTE*/
.btn-primary{
    background-color: #ff8700!important;
    border: 1px solid #ff8700!important;
	}
.btn-primary:hover{
    background-color: #FF4500!important;
    border: 1px solid #FF4500!important;
}

/* POP UP SUSTITUTIVO*/
#popup {
    background-color: rgba(0,0,0,0.8);
    position: fixed;
    z-index: 5;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:0;
    -animation:autopopup 2s;
  }
  
  @-webkit-keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  @-moz-keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  @keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  
  #popup:target {
    transition:all 1s;
    opacity: 0;
    visibility: hidden;
  }
  
  .popup-contenedor {
    position: relative;
    margin:23% auto;
    padding:25px 50px;
    -background-color: #fafafa;
    background: url(https://www.fybeca.com/on/demandware.static/-/Sites-FybecaEcuador-Library/default/dw57c43237/images/generic-banner/fybeca-generic-topbanner-large.jpg);
    color:#333;
    border-radius: 40px;
    width:60%;
  }
  

  a.popup-cerrar {
    position: absolute;
    top:4px;
    right:15px;
    background-color: #333;
    padding:5px 8px;
    font-size: 20px;
    text-decoration: none;
    line-height: 1;
    color:#fff;
    border-radius:inherit;
  }
  
  .btn-light{
    background-color: #151555!important;
    border: 1px solid #151555!important;
    color: #fff!important;
	}
    .btn-light:hover{
    background-color: #0090c2!important;
    border: 1px solid #0090c2!important;
    color: #fff!important;
    }

/* POP UP PANINI*/
#popup-panini {
    background-color: rgba(0,0,0,0.8);
    position: fixed;
    z-index: 5;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin:0;
    -animation:autopopup 2s;
  }
  
  @-webkit-keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  @-moz-keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  @keyframes autopopup {
    from {opacity: 0;margin-top:-200px;}
    to {opacity: 1;}
  }
  
  #popup-panini:target {
    transition:all 1s;
    opacity: 0;
    visibility: hidden;
  }
  
  .popup-contenedor-panini {
    position: relative;
    margin:23% auto;
    padding:25px 50px;
    -background-color: #fafafa;
    background: url(https://www.fybeca.com/on/demandware.static/-/Sites-FybecaEcuador-Library/default/dw57c43237/images/generic-banner/fybeca-generic-topbanner-large.jpg);
    color:#333;
    border-radius: 40px;
    width:60%;
  }
  

  a.popup-cerrar {
    position: absolute;
    top:4px;
    right:15px;
    background-color: #333;
    padding:5px 8px;
    font-size: 20px;
    text-decoration: none;
    line-height: 1;
    color:#fff;
    border-radius:inherit;
  }


/* PUM */
.product-detail .pum {
    background-color: #ff87005c;
    border-radius: 10px;
    border-style: dotted;
    border-width: 1px;
    border-color: #000000;
    }

/* TEXTO BENEFICIOS*/
.online-shop-title {
    color: #ffffff;
}


/* FOOTER */
.footer .footer-links-title a {
    font-family: Ubuntu Bold, Arial, sans-serif;
}

.footer .footer-links-list .logo_app {
    width: 188px;
}

@media (max-width:990px) {
    .footer .footer-links-list .logo_app {
        width: 100%;
        max-width: 250px;
    }
}

/* COBERTURA */
.img-mapa-sector {
    max-width: 400px;
    width: 85%;
    margin: 0 auto;
    display: block;
    margin-bottom: 1rem;
}

.pills-cobertura {
    max-width: 90%;
    margin: 0 auto;
}

.pills-cobertura .nav-item {
    background: unset;
    margin: 7px 0.75rem;
    position: relative;
}

.pills-cobertura .nav-item:last-child {
    padding-bottom: 0px;
}

.pills-cobertura .nav-item .nav-link {
    padding: 5px 30px 5px 15px;
    background: #fff;
    border: 1px solid #203A5D;
    border-radius: 5px;
    color: #203A5D;
    text-transform: capitalize;
    font-family: Ubuntu Bold, Arial, sans-serif;
}

.pills-cobertura .nav-item .nav-link:after {
    content: "\F078";
    font: normal normal normal 14px/1 FontAwesome;
    right: 10px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 14px;
    transition: transform .2s ease-in-out;
    transform: rotate(0deg);
}

.pills-cobertura .nav-item .nav-link.active {
    color: #FFF;
    background: #FF8700;
}

.pills-cobertura .nav-item .nav-link.active:after {
    transform: rotate(-180deg);
}

.barrios {
    max-width: 500px;
    margin: 0 auto;
    width: 90%;
}

.barrios .row:nth-of-type(2n) {
    background: #F5F5F5;
}

.barrios .row:nth-of-type(2n+1) {
    background: #FFFFFF;
}

@media (max-width:990px) {
    .barrios {
        max-width: 600px;
        margin: 0 auto;
        width: 90%;
    }
}


/* DEFAULT */
.ico-redirect {
    opacity: .6;
    width: 20px;
}

a:hover>.ico-redirect {
    opacity: 1;
}

.titulo-pagina {
    min-height: 300px;
}

.background-orange {
    background: #FF8700;
}

.body-text {
    background-color: #f5f5f5;
    width: 100%;
}

.text-blue {
    color: #203A5D;
}

.text-orange {
    color: #FF8700;
}

.titulo-pagina .page-topbanner-title {
    left: unset;
    top: unset;
    transform: unset;
    width: unset;
}

.titulo-pagina .subtitulo {
    font-family: Ubuntu Light Italic;
}


/* TERMINOS Y CONDICIONES */
.img-vitalcard-fybeca {
    width: 85%;
    max-width: 500px;
    margin: 0 auto;
    display: block;
}

.titleTerm {
    background: #ffffff;
    border: 2px solid #888FA4;
    border-radius: 5px;
}

#terminos_condiciones .titleTerm {
    background: #ffffff;
    border: 2px solid #888FA4;
}

.titleTerm .content-collapse-title {
    font-family: Ubuntu Bold, Arial, sans-serif;
    font-size: 1rem;
    color: #203A5D;
}

.term_conditions .card {
    border-radius: 0px;
}

/* PLAN DE MEDICACIÓN CONTINUA */
.btn-afeccion {
    border-radius: 5px;
    padding: 7px 10px;
    background: #FF8700 !important;
    color: #FFF !important;
    width: 100%;
    border: 1px solid #FF8700 !important;
}

.collapsed.btn-afeccion {
    background: #fff !important;
    border: 1px solid #FF8700 !important;
    color: #203A5D !important;
    border-radius: 5px;
    padding: 7px 10px;
}

.afecciones .card {
    padding: 5px 10px;
}

.afecciones p:nth-of-type(2n) {
    background-color: #ffffff;
}

.afecciones p:nth-of-type(2n+1) {
    background-color: #f5f5f5;
}

.content-chevron {
    font-size: 1rem;
    transform: rotate(-180deg);
    color: #FFF;
    transition: transform .2s ease-in-out;
    padding: 0 0 3px;
}

.collapsed .content-chevron {
    transform: rotate(0deg);
    color: #FF8700;
}

@media (min-width:544px) and (max-width:990px) {
    .btn-afeccion {
        font-size: .9rem;
    }

    .afecciones .card {
        font-size: .8rem;
    }
}

@media (max-width:543px) {
    .btn-afeccion {
        font-size: .8rem;
    }

    .afecciones .card {
        font-size: .7rem;
    }
}

/* RED VITALCARD*/
.bloque-tabla {
    background: #fff;
    padding: 2px !important;
}

.bloque-tabla:nth-of-type(2n+1) .cabecera-bloque {
    background-color: #0B6040;
    color: #fff;
    text-align: center;
    padding: 15px 5px;
    border-radius: 6px;
}

.bloque-tabla:nth-of-type(2n) .cabecera-bloque {
    background-color: #2558A4;
    color: #fff;
    text-align: center;
    padding: 15px 5px;
    border-radius: 6px;
}

.bloque-tabla:nth-of-type(2n+1) .content-bloque {
    background-color: rgba(29, 162, 115, .58);
    color: #fff;
    padding: 10px 5px;
    height: 100%;
}

.bloque-tabla:nth-of-type(2n) .content-bloque {
    background-color: rgba(21, 99, 163, .58);
    color: #fff;
    padding: 10px 5px;
    height: 100%;
}

@media (max-width:990px) {
    .linea-tabla {
        margin: 4px 0;
    }

    .linea-tabla:nth-of-type(2n+1) {
        background-color: rgba(29, 162, 115, .58);
    }

    .linea-tabla:nth-of-type(2n) {
        background-color: rgba(21, 99, 163, .58);
    }

    .linea-tabla:nth-of-type(2n+1) .bloque-tabla .titleBenefits {
        color: #0B6040;
    }

    .linea-tabla:nth-of-type(2n) .bloque-tabla .titleBenefits {
        color: #2558A4;
    }

    .bloque-tabla {
        background: transparent;
    }

    .bloque-tabla:nth-of-type(2n+1) .cabecera-bloque {
        background-color: transparent;
    }

    .bloque-tabla:nth-of-type(2n) .cabecera-bloque {
        background-color: transparent;
    }

    .bloque-tabla:nth-of-type(2n+1) .content-bloque {
        background-color: transparent;
    }

    .bloque-tabla:nth-of-type(2n) .content-bloque {
        background-color: transparent;
    }
}