.appointments-body { position: relative; height: auto; padding-bottom: 70px; }

.appointments-body > h2 {
    margin: 2em auto auto;
    font-size: 26px;
    font-weight: 600;
    text-align: center;
    color: #002A60;
    background: #F9B804;
    padding: 1em 1ex;
    }

.appointments-body .col-md-12 > hr { max-width: 50%; margin: 20px auto; }



.ofit-wyse {
    display:block;
    margin: 30px auto 0px;
    max-width: 390px;
    padding: 13px 15px;
    border-radius: 5px;
}

.ofit-wyse img {
    width:100%;
    height:auto;
}

.introduction {
    color:white;
    text-align:center;
}

.introduction h2 {
    font-size: 33px;
    padding: 20px 0 20px;
}

.introduction h3 {
    display:flex;
    text-align:left;
    align-items: center;
    font-size: 23px;
    border: 1px solid white;
    border-radius: 5px;
    /* width: 460px; */
    margin: 20px auto 30px;
}

.v-application { border-radius: 14px; }

.introduction h3 .sep {
    border-left: 1px solid white;
    padding: 0;
    align-self: stretch;
}

.introduction h3 span {
    padding:12px;
}

.introduction h3 img {
    margin: 18px 12px;
}

.introduction p {
    font-size: 20px;
    line-height: 1.2em;
}

.introduction label {
    font-size: 17px;
    margin-top: 35px;
    background: #F9B804;
    color: #002A60;
    font-weight: 400;
    padding: 8px 16px;
    border-radius: 5px;
    cursor: pointer;
}
.introduction label.danger{background-color: #F22E18;color: white;}

.introduction label:hover { background: transparent; border: 1px solid #fff; color: #fff; padding: 7px 15px; }

.introduction label input {
    font-size: 102em !important;
}

.btn-yellow, .btn-yellow:focus {
    font-size: 17px;
    line-height: 1em;
    background-color: #F9B804;
    border:1px solid #F9B804;
    color: #002A60 !important;
    font-weight: 400;
    padding: 20px 16px !important;
    margin: 0;
    border-radius: 5px;
    cursor: pointer;
    border: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.btn-yellow:hover {
    border:1px solid white;
    color:white !important;
    background-color:#002A60;
    padding: 19px 16px !important;
}



[v-cloak]{display:none;}
.PreApplicationForm h3 { color:white; margin:0; padding:0; }
.PreApplicationForm h4 {color:white;margin:0;padding-bottom: 7px;border-bottom: 1px solid white;}
.PreApplicationForm label { color:white; }
.PreApplicationForm button { color:white; }
.PreApplicationForm .radiolist p label { white-space:wrap; display:inline; }
.PreApplicationForm ul.doc-list {margin-bottom: 60px;}
.PreApplicationForm ul.doc-list li { margin: 10px 0;}



.whole-form label.select-program {font-size: 23px;font-weight:300;color:white;}
.p-white {color: white;font-size: 18px;line-height: 1.1em;}
.force-text-white {color: white !important;}
.force-text-left {text-align: left;}

.section-item {height:100%;}
.section-item, .section-disabled {background: #f3f3f3;}
.section-filled {background: #ffe6e6;}
.section-available { background:transparent; }
.section-hover { border-top:1px solid #F0C52D; }

#modal-appointment .modal-dialog { overflow:hidden; }
#modal-appointment .modal-header {border-bottom:0 none;padding: 30px 10px 30px;}
#modal-appointment .modal-footer {border-top:0 none;padding: 30px 30px;}

#modal-appointment .modal-body { padding:0 30px 1px; }
#modal-appointment h3 { margin-top:0; color:#163e69; font: 700 21px Poppins, sans-serif; }
#modal-appointment h3.smaller {font-size: 17px;}

#modal-appointment .btn-primary { color:white; }

#modal-appointment .form-group { margin-top:20px; }

#modal-appointment .v-tabs .v-tab:not(.v-tab--active) {color: #ccc;}
#modal-appointment .v-card__text { padding:30px; }
#modal-appointment .v-card__text small i { line-height: 1rem; display: block; margin: 0 0 7px 0; }
#modal-appointment .v-card__text h4 { margin: 34px 0; color: #163e69; }

#modal-appointment .modal-footer button {margin-left: 30px;margin-bottom: 20px;}
#modal-appointment .modal-footer button.btn-prev {margin-left: 0; float:left;}
#modal-appointment .modal-footer button.do-program {
    border-color:#f1cd02;
    background-color:#f1cd02;
    color:#163e69;
}

.chk-requisites {
    display:inline-block;
    font-weight:400;
}

.btn-requisites {
    padding:6px 6px;
    font-size:12px;
    line-height:0.8em;
}


.information ul {
    margin-left:2em;
}

.information ul li {
    position:relative;
    list-style:outside none;
}
.information ul li:before {
    position: absolute;
    left: -1.7em;
    top: -1px;
    color: #163e69;
    content: "\e013" !important;
    font: 900 normal normal 12px/1 'Glyphicons Halflings' !important;
    display: inline-block;
    margin-top: 7px;
    margin-right: 3px;
}

.information ul label { font-weight:400; }
.information ul label .btn {font-size:11px;line-height: 1.4em;padding:0 3px;margin: 0 0 0 8px;color: white;}


#modal-appointment .grecaptcha-badge {bottom: 3px !important;}

.expiration-fields label {
    display:block;
    margin-bottom:17px;
}

.select-arrow {
    position:relative;
    display:block;
}
.select-arrow:after {
    position:absolute;
    display:block;
    right: 5px;
    top:0;
    bottom:0;
    margin:auto;
    content: "\e114" !important;
    font: 13px/1em 'Glyphicons Halflings' !important;
    height:10px;
}

.no-pad-y {padding-top: 2px;padding-bottom: 2px;}


@media only screen and (max-width: 768px) {
    #modal-appointment .form-group.expiration-fields {margin-bottom: 13px;}

    .appointments-body .col-md-12 > hr { max-width: 100%; }

    #modal-appointment .mobile-hidden {
        display:none !important;
    }

    .introduction h3 {
        font-size:15px;
        margin: 1em 0 1.5em;
    }
    .introduction p {
        font-size: 14px;
    }
    .introduction h3 img {
        width: 33px;
    }

    .appointments-body > h2 {
        font-size: 17px;
    }

    .introduction label {
        font-size: 12px;
        margin: 1em 0 1em;
    }

}

@media (max-width: 414px) {
    #vue-calendar button.v-btn {
        padding: 5px;
        margin: 0 3px !important;
        min-width: auto;
        height: auto;
        width: auto;
        font-size: 11px;
    }

    #vue-calendar .mobile-hidden {
        display:none;
    }

    #modal-appointment .modal-footer button {
        margin-left: 5px;
    }

    #modal-appointment .v-slide-group__prev {
        display:none;
    }
    #modal-appointment .v-slide-group__content {
        justify-content:center;
    }
    #modal-appointment .v-tab {
        font-size: 12px;
        padding:0 5px;
        min-width:10px;
    }
}

    #modal-appointment span.type_filename {
    margin-left: 0.7ex;
    padding: 0.1ex 0.5ex;
    border-radius: 5px;
    font-style: italic;
    font-size: 0.8em;
    color: #08456B;
    font-weight: 300;
}

.terminos {margin: 1.5em 0 1em;}
.terminos ol { margin-left: 1em; }

footer .container,
footer > .container > .row > div {
    padding-top:6px;
    padding-bottom:0;
}


.azul-cc-fields {
    padding-top:20px;
}
.azul-cc-fields .col-md-12,
.azul-cc-fields .col-md-6 {
    padding-top:0;
    padding-bottom:0;
    margin-bottom:14px;
}

.azul-cc-fields .form-group {
    margin-top: 0 !important;
    margin-bottom:0;
}

.azul-cc-fields .credit-cards-icons-footer {
    padding-top:14px;
}

.wompi-terms-label { 
    text-align: center;
    display: block;
}

.wompi-first-payment-bottom { margin: 25px auto; }

.azul-cc-fields .credit-cards-icons-footer [class^=icon-] {
    font-size:26px;
    margin-bottom:5px;
    display:inline-block;
    line-height:1em;
    margin-right: 9px;
}

.payment-methods { align-items:center; }
.payment-methods label { display:flex; align-items:center; }
.payment-methods input { margin-right:5px; }

.pay-azul { height:38px; }
.pay-popular { height:42px; }
.pay-cash { height:33px; }
.pay-wompi { height:42px; }

.grecaptcha-badge {
    visibility: hidden;
}

div.g-recaptcha > div.grecaptcha-badge {
    width:0 !important;
}

.modalLoading {
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:hsl(0 0% 0% / 0.60);
    color:white;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    z-index: 1050;
}

.modalLoading .fa {
    font-size:60px;
    margin-bottom:10px;
}

.btn-form-previo-cita { display: block; margin-top: 30px; }

.make-first-payment-white-content {  
    background: #fff;
    max-width: 998px;
    margin: 13px auto;
    border-radius: 13px;
}

ul.h4-pago {
    font-size:18px;
    margin: 34px 0 34px 20px;
    color: #163e69;
    line-height: 1.4em;
}