.inputBox,.inputBox2{
    display:flex;
    flex-direction:column;
    margin:0 0 10px 20px;
    width:50%;
    gap:10px
}
.inputBox .fileInput{
    flex-direction:column
}
label{
    font-family:var(--keralty-proxima-nova-main-font);
    font-size:var(--keralty-small-font);
    color:var(--keralty-main-blue)
}
.mandatory,.errorInput{
    color:var(--keralty-semantics-error)
}
input,select{
    font-size:var(--keralty-small-font);
    font-family:var(--keralty-proxima-nova-main-font);
    padding:8px 20px 8px 10px;
    border:1px solid var(--keralty-secondary-blue);
    border-radius:5px
}
input:focus{
    transition:.5s;
    border:1px solid var(--keralty-main-blue);
    outline:none;
    background-color:transparent
}
@media (max-width: 705px){
    .inputBox,.inputBox2{
        width:100%;
        margin:0 0 12px
    }
}
@media (min-width:970px){
    .inputBox2{
        width:95%;
        margin:0 0 12px
    }
}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{
    -webkit-box-shadow:0 0 0 30px white inset!important
}
.loader{
    width:22px;
    height:22px;
    border:5px solid #fff;
    border-bottom-color:transparent;
    border-radius:50%;
    display:inline-block;
    box-sizing:border-box;
    animation:rotation 1s linear infinite
}
@keyframes rotation{
    0%{
        transform:rotate(0)
    }
    to{
        transform:rotate(360deg)
    }
}
.schedule-container{
    background-color:var(--keralty-softgreen);
    width:100%;
    padding:6px;
    margin:18px 0
}
.div-header{
    display:flex;
    align-items:center;
    gap:1rem
}
.schedule-icon{
    padding:2px
}
.schedule-title{
    color:var(--keralty-green);
    font-weight:700;
    font-size:var(--keralty-small-font);
    font-style:normal;
    line-height:1.9rem
}
.schedule-info{
    font-size:var(--keralty-small-font);
    font-weight:400;
    font-style:normal;
    line-height:19px;
    margin-left:39px
}
.out-of-time-icon-cont{
    display:flex;
    margin-bottom:10px
}
.out-of-time-icon{
    margin:0 auto
}
.out-of-time-title,.out-of-time-paragraph{
    text-align:center
}
.overlay{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:#00000080;
    display:flex;
    justify-content:center;
    align-items:center;
    overflow-y:auto;
    z-index:1000
}
.modal{
    background:#fff;
    padding:10px 40px 40px;
    border-radius:8px;
    box-shadow:0 0 10px #0000004d;
    max-width:600px;
    width:100%;
    display:flex;
    flex-direction:column;
    flex-wrap:wrap;
    gap:32px;
    place-items:center
}
.main-title{
    font-family:var(--keralty-proxima-nova-main-font);
    color:var(--keralty-green);
    font-size:var(--keralty-large-font);
    font-weight:700;
    text-align:center;
    font-style:normal;
    line-height:45px
}
.btn-container{
    width:100%;
    display:flex;
    place-items:center;
    justify-content:center;
    margin-top:18px;
    margin-bottom:32px
}
.primary-button{
    background-color:var(--keralty-green);
    color:var(--keralty-neutral-gray0);
    font-family:Figtree,sans-serif;
    font-weight:600;
    padding:12px 30px;
    font-size:1.6rem;
    display:flex;
    gap:10px;
    border:none;
    border-radius:22px;
    width:auto;
    cursor:pointer
}
.primary-button:disabled{
    background-color:var(--keralty-gray200);
    color:var(--keralty-gray700);
    font-weight:600;
    line-height:19px;
    letter-spacing:.48px;
    cursor:default
}
.blue-primary-btn{
    background-color:var(--keralty-secondary-blue);
    color:var(--keralty-neutral-gray0);
    font-family:Figtree,sans-serif;
    padding:12px 30px;
    font-size:1.6rem;
    display:flex;
    gap:10px;
    border:none;
    border-radius:22px;
    width:auto;
    cursor:pointer
}
.bodyModal{
    width:100%
}
.modalHeader{
    width:100%;
    text-align:center
}
.modalHeader figure{
    width:100%;
    text-align:right
}
.bold{
    font-weight:700
}
.acceptButton{
    background-color:var(--keralty-secondary-blue)
}
.acceptButton:hover{
    transition:.4s;
    background-color:var(--keralty-main-blue)
}
.acceptButton:not(:hover){
    transition:.4s;
    background-color:var(--keralty-secondary-blue)
}
.contact-type-base-modal{
    background:#fff;
    padding:10px 40px 40px;
    border-radius:8px;
    box-shadow:0 0 10px #0000004d;
    max-width:600px;
    width:100%;
    display:flex;
    flex-direction:column;
    flex-wrap:wrap;
    gap:10px;
    place-items:center
}
.contact-type-h3{
    color:var(--keralty-main-blue);
    font-size:22px;
    font-weight:700;
    line-height:31px
}
.select-contact-type-modal-p{
    color:var(--keralty-gray900);
    line-height:22px
}
.select-contact-type-modal-p span{
    font-weight:700
}
.colsanitas-contact-type-form{
    width:100%;
    display:flex;
    flex-direction:column;
    gap:10px
}
.colsanitas-contact-type-form div{
    padding:5px 0;
    display:flex;
    align-items:center
}
.radius-cont label{
    display:flex;
    gap:4px;
    align-items:center
}
#colsanitas-radio-btn{
    width:24px;
    height:24px
}
.colsanitas-radio-btn-label{
    color:var(--keralty-gray900)
}
.colsanitas-btn-cont{
    width:100%;
    display:flex;
    justify-content:center
}
.colsanitas-submit{
    background-color:var(--keralty-secondary-blue);
    color:var(--keralty-neutral-gray0);
    font-weight:600;
    padding:12px 30px;
    font-size:1.6rem;
    display:flex;
    gap:10px;
    border:none;
    border-radius:22px;
    width:auto;
    cursor:pointer
}
.otp-group{
    display:flex;
    width:100%;
    max-width:360px;
    column-gap:10px
}
.otp-input{
    width:100%;
    height:60px;
    border:1px solid var(--keralty-main-blue);
    border-radius:5px;
    padding:0;
    text-align:center;
    font-family:Roboto;
    font-size:32px;
    font-weight:700;
    line-height:1
}
.modal-close-icon{
    display:grid;
    text-align:end;
    width:100%;
    padding-top:16px
}
.modal-close-icon svg{
    cursor:pointer
}
.h3-title{
    color:var(--keralty-main-blue);
    font-weight:700;
    font-size:2.2rem
}
.otp-form{
    display:flex;
    flex-direction:column;
    gap:25px
}
.otp-input{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    grid-template-rows:1fr;
    gap:8px
}
.otp-input-box{
    width:76px;
    height:100px
}
.otp-input-number{
    width:100%;
    height:100%;
    text-align:center;
    padding:10px;
    font-family:Roboto;
    font-size:42px;
    font-style:normal;
    font-weight:400;
    line-height:normal
}
.otp-modal-paragraph{
    text-align:left;
    line-height:25px
}
.otp-modal-paragraph span{
    color:var(--keralty-gray900)
}
.otp-modal-paragraph span:nth-child(1){
    font-weight:700;
    font-style:normal;
    line-height:19px;
    padding-bottom:20px
}
.otp-modal-cellphone{
    text-align:left;
    display:flex;
    width:100%;
    color:var(--keralty-gray900);
    line-height:19px
}
.otp-modal-cellphone span{
    padding-right:8px;
    color:var(--keralty-gray900)
}
.otp-modal-cellphone span:nth-child(1){
    font-weight:900
}
.otp-modal-footer{
    display:flex;
    justify-content:center;
    place-items:center;
    width:100%;
    gap:20px
}
.otp-modal-footer-paragraph{
    color:var(--keralty-gray900)!important
}
.otp-modal-footer-link{
    font-weight:700;
    font-size:1.4rem;
    border:none;
    background-color:var(--keralty-neutral-gray0);
    color:var(--keralty-main-blue);
    text-decoration:underline;
    cursor:pointer
}
.otp-modal-footer-link:disabled{
    color:var(--keralty-gray700);
    cursor:default
}
.disabled-link{
    pointer-events:none;
    cursor:default;
    color:var(--keralty-gray700)
}
.otp-btn-container{
    display:flex;
    flex-wrap:wrap;
    width:100%;
    place-content:center;
    gap:20px
}
#Ingresar{
    background-color:var(--keralty-secondary-blue);
    color:var(--keralty-neutral-gray0);
    font-weight:600;
    padding:14px 30px;
    font-size:1.6rem;
    display:flex;
    gap:10px;
    border:none;
    border-radius:22px;
    width:auto;
    cursor:pointer
}
#Ingresar:disabled{
    background-color:var(--keralty-gray200);
    color:var(--keralty-gray700);
    font-weight:600;
    line-height:19px;
    letter-spacing:.48px;
    cursor:default
}
#Regresar{
    background-color:var(--keralty-neutral-gray0);
    color:var(--keralty-secondary-blue);
    font-weight:600;
    padding:12px 30px;
    font-size:1.6rem;
    display:flex;
    gap:10px;
    border:2px solid var(--keralty-secondary-blue);
    border-radius:22px;
    width:auto;
    cursor:pointer
}
#Regresar:disabled{
    border:1px solid var(--keralty-gray700);
    color:var(--keralty-gray700);
    font-weight:600;
    line-height:19px;
    letter-spacing:.48px;
    cursor:default
}
.success{
    border:1px solid var(--keralty-green)
}
.disabled{
    border:1px solid var(--keralty-gray200)
}
.error{
    border:1px solid var(--keralty-semantics-error)
}
.error-paragraph{
    color:var(--keralty-semantics-error);
    font-size:1.6rem;
    font-style:normal;
    font-weight:700;
    line-height:1.6rem;
    text-align:center
}
@media (max-width: 450px){
    .modal-close-icon{
        margin-top:150px
    }
    .otp-input{
        grid-template-columns:repeat(6,40px)
    }
    .otp-input-box{
        width:40px
    }
}
.link-button{
    background-color:var(--keralty-secondary-blue);
    color:var(--keralty-neutral-gray0);
    font-weight:600;
    padding:12px 30px;
    font-size:1.6rem;
    display:flex;
    gap:10px;
    border:none;
    border-radius:22px;
    width:auto;
    cursor:pointer
}
.modal-header{
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:var(--keralty-secondary-blue);
    gap:10px;
    margin-top:10px
}
.modal-header figure{
    width:100%;
    text-align:right
}
.close-permission span{
    cursor:pointer
}
.modal-header .underLine{
    height:2px;
    width:100%;
    background-color:var(--keralty-main-blue)
}
.modal-footer{
    display:flex;
    gap:20px
}
.video-call-link{
    text-decoration:none
}
.file-input-appeareance{
    display:flex;
    align-items:center;
    position:relative;
    width:100%;
    border:1px solid var(--keralty-gray700);
    padding:8px 5px 8px 10px;
    max-height:36px;
    cursor:pointer
}
.file-input,.file-input-appeareance-hidden{
    display:none
}
.files-info{
    font-size:14px;
    color:var(--keralty-gray700);
    padding:0 8px
}
.clip-icon-cont{
    height:18px;
    display:flex;
    place-items:center;
    margin-right:6px
}
.add-icon-cont{
    height:24px;
    display:flex;
    place-items:center
}
.clip-icon-cont svg,.add-icon-cont svg{
    height:90%
}
.file-input-appeareance p{
    font-size:1.4rem;
    width:100%;
    color:var(--keralty-gray700);
    margin-left:5px
}
.file-input-disabled{
    background-color:var(--keralty-gray500)
}
.right-side{
    display:flex;
    padding:52px 40px 0;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:8px;
    align-self:stretch;
    min-height:55vh
}
.top{
    width:100%
}
.form{
    width:100%;
    flex-direction:column
}
.hidden{
    display:none
}
.caja{
    width:100%;
    display:flex;
    justify-content:center
}
.captchaBox{
    width:100%;
    display:flex;
    justify-content:center;
    padding-top:15px
}
.checkInput{
    width:100%;
    display:flex;
    margin-left:20px;
    gap:10px;
    padding:10px 0
}
.checkInput p a{
    color:var(--keralty-secondary-blue)
}
.checkInput .checked{
    color:var(--keralty-main-blue);
    font-size:16px;
    font-weight:700;
    font-style:normal
}
.checkInput .unChecked{
    font-weight:400;
    color:var(--keralty-main-blue)
}
.checkInput--checked{
    font-weight:700
}
.checkError{
    color:var(--keralty--semantics-error);
    margin:30px 0 0 15px
}
.swal-title-lg,.swal-content-lg{
    font-size:23px
}
.swal-button-lg{
    font-size:15px;
    padding:.75rem 1.5rem;
    background-color:var(--keralty-main-blue)
}
@media (max-width: 705px){
    .right-side{
        height:100%
    }
    .caja{
        flex-direction:column
    }
    .checkInput{
        margin-left:0
    }
}
.file-list{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    width:100%;
    padding-right:8px
}
.file-list p{
    margin:auto;
    font-weight:700
}
.file-list ul{
    list-style:none;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
    font-size:1.5rem;
    width:70%;
    place-items:center
}
.file-list li{
    background-color:var(--keralty-softgreen);
    color:var(--keralty-green);
    padding:8px;
    border-radius:20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:4px;
    height:40px;
    max-width:283px;
    width:90%!important
}
.file-txt-info{
    width:80%;
    display:flex;
    flex-direction:column;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}
.file-list button{
    width:30px;
    background-color:var(--keralty-main-blue2);
    border:none;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-left:6px;
    cursor:pointer
}
.document-icon-cont{
    background-color:#fff;
    width:35px;
    height:35px;
    position:relative;
    right:5px;
    border-radius:20px;
    display:flex;
    justify-content:center;
    align-items:center
}
.remove-file{
    background-color:#fff;
    width:35px;
    height:35px;
    position:relative;
    left:5px;
    border-radius:20px;
    display:flex;
    justify-content:center;
    align-items:center
}
@media (min-width: 451px) and (max-width: 1366px){
    .file-list ul{
        font-size:1.1rem
    }
}
@media (max-width: 705px){
    .file-list ul{
        grid-template-columns:1fr;
        width:100%
    }
    .file-list li{
        max-width:100%;
        font-size:1.2rem;
        gap:8px
    }
    .file-name{
        width:100%
    }
    .file-size{
        display:flex;
        align-items:start
    }
}
.out-of-time{
    display:flex;
    flex-direction:column;
    place-items:center;
    justify-content:space-around;
    width:100%;
    padding:60px 40px 0;
    gap:18px;
    margin-bottom:20px;
    min-height:65.2vh
}
.ot-image-cont{
    width:275px
}
.ot-image{
    width:100%;
    object-fit:cover
}
.ot-paragraph{
    color:var(--keralty-gray900);
    text-align:center;
    font-size:2.2rem;
    font-style:normal;
    font-weight:700;
    line-height:31px
}
.ot-paragraph span{
    color:var(--keralty-gray900)
}
@media (max-width: 450px){
    .out-of-time{
        height:unset
    }
}
.loader-container{
    width:100%;
    height:700px;
    display:flex;
    justify-content:center;
    align-items:center
}
footer{
    max-width:100%;
    height:300px;
    background-color:#069;
    color:#fff;
    border-top-left-radius:15px;
    border-top-right-radius:15px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center
}
footer a{
    text-decoration:none;
    color:#fff
}
.info-p{
    font-size:large;
    position:relative;
    top:-3px;
    text-align:center;
    padding:0 5px
}
.first-line{
    width:80%;
    height:60px;
    display:flex;
    justify-content:space-between;
    margin-bottom:20px;
    padding-right:30px
}
.second-line{
    width:80%;
    height:60px;
    display:flex;
    justify-content:space-between;
    background-color:#3385ad;
    border-radius:100px;
    padding-right:30px
}
.element1,.element2,.element3{
    display:flex;
    align-items:center;
    gap:15px
}
.element1 figure,.element2 figure{
    margin:auto;
    background-color:#fff;
    border-radius:100px;
    display:flex;
    place-content:center;
    padding:2px
}
.element3 figure svg{
    display:none
}
.kiosco{
    margin:auto;
    background-color:#fff;
    border-radius:100px;
    display:flex;
    justify-content:center;
    padding:5px
}
.kiosco img{
    position:relative;
    left:1px;
    height:40px;
    width:40px
}
.element4{
    display:flex;
    align-items:center;
    gap:15px;
    height:100%
}
.element4 figure{
    margin:auto;
    height:55px;
    width:55px;
    background-color:#fff;
    border-radius:100px;
    display:flex;
    place-content:center;
    padding:2px
}
.element4 figure img{
    width:90%
}
.element5{
    display:flex;
    align-items:center
}
.element6{
    display:flex;
    align-items:center;
    justify-content:flex-start
}
.element4 div p,.element5 div p,.element6 div p{
    margin:auto
}
.functionalities{
    text-align:left;
    width:100%;
    padding-left:40px;
    margin-top:10px
}
.functionalities a{
    text-decoration:underline;
    margin-left:5px
}
.copyright{
    font-size:14px;
    position:relative;
    bottom:-30px;
    font-family:Figtree,sans-serif;
    font-weight:700
}
@media (max-width: 600px){
    footer{
        width:100%;
        flex-direction:column;
        height:auto
    }
    .info-p{
        top:20px;
        padding:0
    }
    .first-line{
        padding-top:30px;
        flex-direction:column;
        height:auto
    }
    .second-line{
        height:auto;
        display:flex;
        flex-direction:column;
        background-color:transparent
    }
    .element1,.element2,.element3{
        display:flex;
        align-items:center;
        gap:15px;
        font-size:12px;
        padding:10px 0
    }
    .element3{
        position:relative
    }
    .element1 figure,.element2 figure,.element3 figure{
        margin:auto;
        background-color:#fff;
        border-radius:100px;
        display:flex;
        place-content:center;
        padding:2px
    }
    .element1 figure img,.element2 figure img{
        width:100%
    }
    .element3 figure img{
        display:none
    }
    .element3 figure svg{
        display:block;
        position:relative;
        left:5px;
        width:85%
    }
    .element4,.element5,.element6{
        background-color:#3385ad;
        border-radius:100px;
        margin:10px 0;
        height:40px;
        font-size:medium
    }
    .element4{
        display:flex;
        align-items:center;
        gap:4px;
        height:100%;
        font-size:12px
    }
    .element4 figure{
        margin:auto;
        height:40px;
        width:40px;
        background-color:#fff;
        border-radius:100px;
        display:flex;
        place-content:center;
        padding:2px
    }
    .element4 figure img{
        width:90%
    }
    .element5{
        display:flex;
        align-items:center;
        font-size:10px;
        padding:8px 8px 8px 15px
    }
    .element6{
        display:flex;
        align-items:center;
        padding-left:15px;
        font-size:12px
    }
    .element4 div p,.element5 div p,.element6 div p{
        margin:auto
    }
    .copyright{
        font-size:10px;
        bottom:-10px;
        width:100%;
        background-color:#069;
        text-align:center
    }
}
.container{
    display:flex
}
.logo-cont{
    position:absolute;
    width:250px;
    padding:15px
}
.logo-colsanitas{
    width:100%;
    height:100%;
    object-fit:contain
}
.main-img-cont{
    min-width:50vw;
    max-width:50vw;
    background-color:var(--keralty-footer-darkblue)
}
.main-image{
    width:100%;
    object-fit:cover
}
.form-container,.ot-cont{
    width:100%;
    height:100%
}
@media (min-width: 451px) and (max-width: 1366px){
    .container{
        display:flex;
        flex-direction:column
    }
    .main-img-cont{
        min-width:100vw;
        max-width:100vw;
        background-color:#fff
    }
    .main-image{
        width:100%;
        height:300px;
        object-position:0px -150px
    }
    .logo-cont{
        left:5%
    }
}
@media (max-width: 450px){
    .container{
        flex-direction:column;
        flex-wrap:wrap;
        width:100%
    }
    .logo-cont{
        display:flex;
        position:relative;
        width:150px;
        justify-content:center;
        align-items:center;
        width:100%;
        right:0
    }
    .main-img-cont,.main-image{
        display:none
    }
}
@font-face{
    font-family:Proxima Nova;
    src:url(/logic/pages/ColsanitasAL/assets/Proxima_Nova_Regular-ZMiokYkv.otf),url(/logic/pages/ColsanitasAL/assets/Proxima_Nova_Extrabold-MyhNctk8.otf);
    src:url(/logic/pages/ColsanitasAL/assets/Figtree-VariableFont_wght.ttf),url(/logic/pages/ColsanitasAL/assets/Figtree-Italic-VariableFont_wght.ttf)
}
:root{
    --keralty-neutral-gray0: #ffffff;
    --keralty-gray200: #e4e4e4;
    --keralty-gray700: #757575;
    --keralty-gray900: #212121;
    --keralty-main-blue: #002f87;
    --keralty-secondary-blue: #0071ce;
    --keralty-green: #008767;
    --keralty-footer-darkblue: #006699;
    --keralty-softgreen: #e7fff9;
    --keralty-semantics-error: #b50303;
    --keralty-proxima-nova-main-font: "Figtree", sans-serif;
    --keralty-roboto-secundaria-font: "Roboto", sans-serif;
    --keralty-medium-font: 22px;
    --keralty-small-font: 14px;
    --keralty-large-font: 32px
}
*{
    margin:0;
    padding:0;
    box-sizing:border-box
}
html{
    font-size:62.5%
}
body{
    font-family:var(--keralty-proxima-nova-main-font);
    font-style:normal;
    font-size:1.6rem
}
input[type=number]{
    -webkit-appearance:unset;
    appearance:unset;
    -moz-appearance:textfield
}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{
    -webkit-appearance:none;
    margin:0
}
input:-webkit-autofill{
    background-color:transparent!important
}
input:-moz-autofill{
    background-color:transparent!important
}
select{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="6,9 12,15 18,9"></polyline></svg>');
    background-repeat:no-repeat;
    background-position:right 15px center;
    background-size:16px 16px;
    display:flex;
    align-items:center
}