/* --------------------------------- Header --------------------------------- */
.banner-container img {
    border-radius: 100px;
}
/* -------------------------------------------------------------------------- */

/* ------------------------------ Ads Carousel ------------------------------ */
.quotationAddsCarousel .carousel-item img {
    width: 100%;
    height: auto;
}

.top-coupon {
    position: fixed;
    top: 63px;
    right: 0;
    left: 0;
    padding: 10px;
    z-index: 30;
}
/* -------------------------------------------------------------------------- */

/* --------------------------------- Info ----------------------------------- */
.step_info {
    display: grid;
    margin-bottom: 2rem;
    grid-gap: 7%;
    -ms-grid-columns: 20% 60%;
    grid-template-columns: 20% 60%;
}

.step_number {
    font-size: 48px;
    line-height: 1;
    color: #D6D6D6;
}

.step_info > img {
    flex: 1;
    margin-bottom: 0;
}
    .step_info > h1 {
        flex: 1;
        width: 40px;
        justify-self: end;
    }
/* -------------------------------------------------------------------------- */

/* ------------------------------- Formulario ------------------------------- */
/*.form-group {
    margin-bottom: 10px;
}*/

#fechaNacimiento div {
    padding: 0 5px;
}

@media all and (min-width: 768px) {
    .form-container .intro {
        border-left: 1px solid #e8e8e8;
        border-right: 1px solid #e8e8e8;
    }

    .form-container .preFormCotizar {
        border-left: 1px solid #e8e8e8;
        border-right: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
        border-radius: 0 0 20px 20px;
    }
}
/* -------------------------------------------------------------------------- */

/* ------------------------------ Autocomplete ------------------------------ */
ul.autocomplete-list {
    background-color: rgb(242, 242, 242);
    border-radius: 4px;
    margin-top: 2px;
    overflow: auto;
    position: absolute;
    width: calc(100% - 30px);
    z-index: 10;
    max-height: 320px;
}

ul.autocomplete-list li {
    color: rgb(17, 17, 17);
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: 64px;
    padding: 20px 16px;
}

    ul.autocomplete-list li:hover {
        background-color: rgb(224, 224, 224);
    }

ul.autocomplete-list > li + li {
    border-top: 1px solid rgb(224, 224, 224);
}
/* -------------------------------------------------------------------------- */

/* ------------------------------- Coberturas ------------------------------- */
.spoked-asterisk:before {
    /*content: "\01F7B8";*/
}

/* purgecss ignore */
.fixed-first .coberturas_variables {
    order: 1;
    padding-top: 3rem 0!important;
}

.coberturasboard .panel {
    border:2px solid #00C8FF;
    border-radius: 10px;
    box-shadow: 0px 3px 3px 1px rgb(125 131 130 / 75%);
    -webkit-box-shadow: 0px 3px 3px 1px rgb(125 131 130 / 75%);
    -moz-box-shadow: 0px 3px 3px 1px rgb(125 131 130 / 75%);
}

.coberturas_fijas {
    z-index: 0;
}

/* purgecss ignore */
.coberturasboard .panel[title="Plan Fijo"] {
    border:2px solid #00FFC8;
}

.coberturasboard .panel + .back_miiflex {
    bottom: -60px;
    border-radius: 10px;
    z-index: -1;
    right: 15px;
    left: 15px;
    background-color: #00C8FF;
    background-image: url(/Content/miituo/images/cotizar/white_plus.svg);
    background-repeat: no-repeat;
    background-position: bottom;
}

.coberturasboard .panel + .back_fijo {
    bottom: -60px;
    border-radius: 10px;
    z-index: -1;
    right: 8px;
    left: 8px;
    background-color: #00FFC8;
}

.back-cobertura {
    position: absolute;
    bottom: 0px;
    right: 0px;
    height: 100%;
    border-radius: 0 8px 8px 0;
    left: 50%;
    top: 0;
}

.coberturasboard :nth-last-child(n + 2 of .cobertura-cotizacion) {
    margin-bottom: 5rem;
}

    .coberturasboard .coverage-panel-body {
        box-shadow: 0px 3px 3px 1px rgba(125, 131, 130, 0.75);
        -webkit-box-shadow: 0px 3px 3px 1px rgba(125, 131, 130, 0.75);
        -moz-box-shadow: 0px 3px 3px 1px rgba(125, 131, 130, 0.75);
        border-radius: 0 0 10px 10px;
    }

.coberturasboard .panel .panel-collapse {
    overflow: hidden;
}

.coberturasboard .panel.variable-fijo 
{
    padding: 45px 20px !important;
}

.coberturasboard .panel-heading {
    padding: 20px 15px;
}

.coberturasboard [class^='tarifa'] {
    font-size: 35px;
}

.infocontratacion {
    background-color: #f1f1f2;
    border-radius: 15px;
    padding: 20px;
}

.infocontratacion p:not(.tarifa):before {
    content: "\002A";
    margin: 0 5px;
    color: #00c9ff;
    position: absolute;
    left: 10px;
}

.infocontratacion .tarifa
{
    text-align:center;
    margin-bottom:0px;
    font-size: 45px;
}

/*.miiflex-carousel .miiflex-benefits {
    border:2px solid #00C8FF;
    border-radius: 10px;
    margin-bottom: 5rem;
    background-color: #fff;
}

.miiflex-carousel .carousel-control {
    align-items: baseline;
    bottom: auto;
}

.miiflex-carousel .carousel-content .col-compare > div:not(:first-child) {
    height: 105px;
}

.miiflex-carousel .miiflex-benefits + .back_miiflex {
    bottom: 5px;
    border-radius: 10px;
    z-index: -1;
    right: 15px;
    left: 0;
    background-color: #00C8FF;
    width: 50%;
}

.miiflex-carousel .miiflex-benefits + .back_miiflex p {
    color: #fff;
}*/

@media all and (max-width: 991px) {
    /*.coverage-panel-body .row > div:not(:last-child):after,*/
    .coverage-panel-body .details-border-bottom:after {
        position: relative;
        content: "";
        height: 1px;
        background-color: #D7D2CB;
        width: calc(100% - 30px);
        margin: 0 15px;
        bottom: 10px;
        display: inline-block;
    }

    .coberturasboard .panel .collapse.show + .bottom-btn .btncontratar {
        display: block!important;
        top: -15px;
    }

    /* purgecss start ignore */
    .coberturasboard .panel.expand + .back_miiflex,
    .coberturasboard .panel.expand + .back_fijo {
        display: none!important;
    }

    .panel.expand .back-cobertura,
    .panel.expand .small_copy.description {
        display: none;
    }

    .panel.expand .small_copy:not(.description) {
        display: block!important;
    }
    /* purgecss end ignore */
}

@media only screen and (min-width: 992px) {
    .coberturasboard {
        padding-top: 60px;
    }

    .coberturasboard .panel + .back_miiflex,
    .coberturasboard .panel + .back_fijo {
        right: 0;
        left: 0;
        top: -60px;
        bottom: calc(100% - 1rem);
        background-position: top;
    }

        .coberturasboard .coverage-panel-body {
            width: calc(100% - 4px);    
            top: -10px;
            left: 2px;
            position: relative;
        }
        
    .coverage-panel-body .row > div:not(:last-child):after {
        content: "";
        background: #D7D2CB;
        position: absolute;
        right: 0;
        height: 80%;
        width: 1px;
        top: 10%;
    }

    .coverage-panel-body .row:not(:last-child):after {
        position: relative;
        content: "";
        height: 1px;
        background-color: #D7D2CB;
        width: 100%;
        margin: 0 15px;
        bottom: 0;
    }

    .card-fijo {
        padding: 175px 30px 0px 30px;
    }

    .cobertura-titulo {
        z-index: 1;
    }

    .coberturas_variables .coberturasboard {
        top: 60px;
    }
}
/* -------------------------------------------------------------------------- */

/* ------------------------------ Como funciona ----------------------------- */
/*.how-it-works {
    position: absolute;
    background-color: #f1f1f2;
    padding: 60px 35px 0 0;
    top: -100%;
    transition: 1s;
    height: 100%;
    border-radius: 10px;
    z-index: 1;
        margin-right: 15px;
}*/

.show-how-it-works.miiflex .first-plus:before {
    content: "++";
    margin: 0 30px 0 0;
    color: #00C8FF;
    font-weight: bold;
}

.show-how-it-works.miiflex .first-plus:after {
    content: "++";
    margin: 0;
    bottom: 5px;
    color: #00C8FF;
    font-weight: bold;
    position: absolute;
    left: 25px;
}

.show-how-it-works.miiflex .second-plus:before {
    content: "++";
    margin: 0 0 0 10px;
    color: #00C8FF;
    font-weight: bold;
}

.show-how-it-works.miiflex .second-plus:after {
    content: "++";
    bottom: 5px;
    color: #00C8FF;
    font-weight: bold;
    position: absolute;
    right: -20px;
}

.how-it-works {
    position: absolute;
    background-color: #EFEDEA;
    padding: 10px 15px 70px;
    top: -900px;
    transition: 1s;
    border-radius: 10px;
    z-index: 1;
}

/* purgecss start ignore */
.how-it-works.show {
    top: 0;
    position: relative;
}

.how-it-works.show + div {
    display: none;
}
/* purgecss end ignore */

.how-it-works-mobile {
    position: relative;
    overflow: hidden;
    padding: 0 15px;
}

.how-it-works-mobile > div {
    position: absolute;
    background-color: #EFEDEA;
    padding: 30px 8px 60px 8px;
    transition: 1s;
    height: 100%;
    border-radius: 10px;
    margin: 25px 0 20px 0;
}

/* purgecss start ignore */
.how-it-works-mobile.show {
    overflow: inherit;
}

    .how-it-works-mobile.show > div {
        position: inherit;
    }
/* purgecss end ignore */    

.number_step {
    font-size: 4rem!important;
    line-height: 1;
    margin-right: 1rem;
    color: #D7D2CB;
}

.bottom-steps {
    background-color: #f2f3f4;
    border-radius: 0 0 10px 10px;
    z-index: -1;
    position: relative;
}

@media (min-width: 992px) {
    .mask-how-it-works {
        position: absolute;
        height: 100%;
        width: 100%;
        background-color: #ffffff80;
        top: 0;
        left: 0;
        z-index: 1;
        display: none;
    }

        /* purgecss ignore */
        .mask-how-it-works.show {
            position: fixed;
            display: block;
        }
}
/* -------------------------------------------------------------------------- */

/* ---------------------------------- FAQ ----------------------------------- */
.faq-accordion .card-header {
    background-color: #fff;
    border-bottom: 1px solid gray;
    padding: 0.6rem 1.25rem;
}

.faq-accordion .btn {
    transform: none !important;
    font-size: inherit;
}

.faq-accordion button {
    width: 90%;
}

.faq-accordion i {
    position: absolute;
    right: 0;
    top: calc(50% - 15px);
}

.faq-accordion i:before {
    font-weight: bold!important;
}
/* -------------------------------------------------------------------------- */

/* ---------------------------- Enviar cotización --------------------------- */
.label-send-quotation {
    position: absolute;
    top: -150px;
    padding: 20px 15px!important;
    border-radius: 5px;
    cursor: pointer;
}

.label-send-quotation.background_pink:after {
    content: '';
    position: absolute;
    left: 29px;
    top: 100%;
    width: 0;
    height: 0;
    border-left: 0px solid transparent;
    border-right: 20px solid transparent;
    border-top: 12px solid #FF4BD2;
    clear: both;
}

.pop-desktop-send-quotation-container button {
    border: 1px solid #fff;
}

.pop-send-quotation {
    position: fixed;
    bottom: -100%;
    transition: 1s;
    height: 100%;
    z-index: 100;
}

.pop-send-quotation.show {
    bottom: 0;
}

.pop-send-quotation > .form-send-quotation {
    background-color: #D7D2CB;
    margin: 5% 20px;
    border-radius: 20px;
    height: 85%;
    position: absolute;
    padding: 60px 25px;
}

.close-pop-send-quotation, 
.close-pop-how-it-works-mobile,
.close-pop-how-it-works {
    background-color: #00C8FF;
    border-radius: 0 0 10px 10px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px;
    cursor: pointer;
}

    .close-pop-send-quotation span,
    .close-pop-how-it-works-mobile span,
    .close-pop-how-it-works span {
        color: #ffffff;
    }

.pop-desktop-send-quotation-container {
    bottom: 165px;
    background-repeat: no-repeat;
    width: 160px;
    position: fixed;
    z-index: 50;
    right: 0px;
}

.pop-desktop-send-quotation {
    height: 80%;
    z-index: 1000;
    background-color: #D7D2CB;
    width: 300px;
    box-shadow: 0px 0px 25px 0px rgb(0 0 0 / 4%);
    border-radius: 10px;
    border: 1px solid #ececec;
    padding: 45px 20px;
    right: 0;
    bottom: 0;
    margin: 1.85714286em;
    opacity: 0;
    pointer-events: none;
}

.pop-desktop-send-quotation .notification-close-cross.notification-close {
    color: #ffffff;
    font-size: xx-large;
    background-color: #00C8FF;
    border-radius: 45px;
    position: absolute;
    bottom: -20px;
    left: calc(50% - 25px);
    width: 40px;
    height: 40px;
    text-align: center;
    cursor: pointer;
}

.pop-desktop-send-quotation .notification-close-cross:before {
    bottom: 10px;
    position: relative;
    font-size: 1.2em;
}

.mask-quotation-sent {
    background-color: rgb(0 0 0 / 40%);
    height: 100%;
    position: relative;
}

.quotation-mobile-sent {
    position: absolute;
    top: 40%;
    background-color: #fff;
    padding: 25px 20px 40px 20px;
    margin: 0 10%;
    border: 2px solid #00C8FF;
    border-radius: 15px;
}

.quotation-mobile-sent .close-pop-send-quotation {
    width: 55px;
    height: 55px;
    left: calc(50% - 27px);  
    bottom: -30px; 
}

    .quotation-mobile-sent .close-pop-send-quotation span {
        top: 7px;
        font-size: x-large;
    }
/* --------------------------------------------------------- */

/* --------------------- Lead referido --------------------- */
.prop-videoelement {
    border: 1px solid rgb(228, 223, 222);
    margin-top: 10%;
}

.logo-referidos-container img {
    height: 350px;
    right: 0;
    position: relative;
    top: -50px;
}

.logo-referidos-container h1 {
        position: absolute;
    bottom: 180px;
    right: 150px;
    color: #fff;
}

.info-referido {
    top: -30px;
}

        .logo-referidos-container-desktop img {
            height: 300px;
            margin: 0;
        }

        .logo-referidos-container-desktop h1 {
            position: absolute;
            top: 130px;
            left: 55px;
            color: #fff;
            text-align: center;
            font-size: 2em!important;
        }

@media screen and (min-width: 1200px) {
    .logo-referidos-container-desktop .wrap {
        left: 10%;
        width: 90%;
    }
}

@media screen and (min-width: 1600px) {
    .logo-referidos-container-desktop h1 {
        font-size: 1.7em!important;
    }
}
/* --------------------------------------------------------- */

/* --------------------- Lead referido --------------------- */

.ContentTable {
    border: solid 1px #dfdad6;
    border-radius: 10px;
    padding: 20px 25px 20px 25px;
    margin-bottom: 1rem;
    width: fit-content;
    min-width: 260px;
}

.ContentTable a{
    color: #707a8d;
    min-height: 48px;
    display: block;
    font-size: 18px;
}

.ContentTable li{
    width: fit-content;
}

.ContentTable li:hover a{
    color: #00C8FF !important;
}

.ContentTable li:hover, .ContentTable a:hover{
    color: #00C8FF !important;
    text-decoration: underline;
}

.ContentTable ul:first-of-type{
    margin-top: 10px;
    margin-bottom: 7px;
}

/* --------------------------------------------------------- */