:root {
    --main-color: #1a2b47;
    --color-dark: #1D2231;
    --text-grey: #8390A2;
    --submenu-color: #374f8d;
    --color-titulos: #B21025;
    --color-texto: #1a2b47;
    --color-fondotabla: #fff;
    --color-botones: #27908b;
    --hoverguardar: #1b5750;
    --color-boton-switch: #27A913;
    --color_fondo_login: rgb(255, 255, 255);
    --color_fondo_icono_login: rgb(58, 82, 153);
    --color_icono_login: rgb(255, 255, 255);
    --color_cajastxt: #F9EBEA;
    --color_rojo: #ce1414;
    --color_boton_alerta: #ff3b3b;
    --color_btn-imprimir: darkorange;
    --color-btn-editar: #873600;
    --rojo_principal: #ce3a50;
    --azul_principal: #3b5297;
    --color_success: #138636;
    --color_warning: #FFBC11;
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    list-style-type: none;
    text-decoration: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    /* font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; */
    font-family: "Montserrat", sans-serif;
}

html {
    box-sizing: border-box;
    font-size: 60%;
    width: 100%;
}

input#fecha_nacimiento{
    border: 1px solid black;
    display: flex;
    /* width: 10vh; */
    /* border: 5px solid red; */
    -webkit-appearance: none;
}

.contenedor_oculto{
    display: none !important;
}

.boton{
    cursor: pointer;
}

.contenedor_principal_escritorio input#fecha_nacimiento{
    border: 1px solid rgba(200,200,200);
}

.mostrar_notificacion{
    width: 100%;
    height: 10%;
    position: fixed;
    top: 0%;
    left: 0;
    transition: top .5s;
    z-index: 0;
}

.mostrar_notificacion .contenedor_notificacion.notificacion_activa{
    top: 0%;
    z-index: 200;
}

.mostrar_notificacion .contenedor_notificacion{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    top: -100%;
    position: absolute;
    transition: top .5s;
}

.mostrar_notificacion .contenedor_notificacion.correcto{
    background-color: var(--color_success);
    box-shadow: inset 0px 0px 5px #00C851;
    color: lightgreen;
}

.mostrar_notificacion .contenedor_notificacion.error{
    background-color: var(--color_warning);
    box-shadow: inset 0px 0px 5px yellow;
    color: rgb(141, 107, 22);
}

.mostrar_notificacion .contenedor_notificacion .contenedor_icono{
    font-size: 2.5rem;
    display: flex;
    justify-content: center;
    width: 20%;
}

.mostrar_notificacion .contenedor_notificacion .contenedor_mensaje{
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 80%;
    /* border: 1px solid red; */
    padding: .5rem 0;
    padding-right: 2rem;
    height: 100%;
}

.mostrar_notificacion .contenedor_notificacion .contenedor_mensaje .titulo_notificacion{
    display: flex;
    align-items: center;
    width: 100%;
    font-weight: bold;
    font-size: 1.4rem;
    margin-bottom: .2rem;
    height: 2rem;
    /* border: 1px solid blue; */
}

.mostrar_notificacion .contenedor_notificacion .contenedor_mensaje .detalle_notificacion{
    display: flex;
    width: 100%;
    font-weight: 600;
    font-size: 1.2rem;
    margin-bottom: .2rem;
    /* border: 1px solid blue; */
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: calc(100% - 2.2rem);
}

.modal_cargando{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.3);
    z-index: 100;
    display: none;
}

.modal_cargando .contenedor_cargando{
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
}

.contenedor_cargando .imagen_logotipo{
    width: 0px;
    height: 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    opacity: 0;
    transition: all 1s;
}

.contenedor_cargando .imagen_logotipo{
    width: 350px;
    height: 200px;
    opacity: 1;
}

.contenedor_cargando .imagen_logotipo .imagen_verificacion{
    width: 0px;
    height: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    opacity: 0;
    transition: all 1s;
}

.contenedor_cargando .imagen_logotipo .imagen_verificacion{
    width: 150px;
    height: 100px;
    opacity: 1
}

.contenedor_cargando .imagen_logotipo img{
    height: 100%;
    transition: all 2s;
    animation: cargando_img 2s linear infinite;
}

.contenido-modal-generarcodigoqr.error .contenedor_cargando .imagen_logotipo img{
    filter: grayscale(1);
}

.contenedor_cargando .imagen_logotipo .check_verificacion{
    width: 0px;
    height: 100px;
    font-size: 5rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    overflow: hidden;
    transition: all 1s;
    transition-delay: .7s;
}

.contenedor_cargando .efecto_cargando{
    position: absolute;
    width: 100px;
    height: 100px;
}

.contenedor_cargando .efecto_cargando span{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: rotate(calc(18deg * var(--i)));
}

.contenedor_cargando .efecto_cargando span::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    /* bottom: 0; */
    /* right: 0; */
    width: 15px;
    height: 15px;
    border-radius: 50px;
    animation: cargando_notificacion 2s linear infinite;
    animation-delay: calc(0.1s * var(--i));
    transition: all 1s;
    opacity: 1;
}

@keyframes cargando_notificacion{
    0%{
        transform: scale(1);
        background-color: var(--azul_principal);
    }
    50%,100%{
        transform: scale(0);
        background-color: var(--rojo_principal);
    }
}

@keyframes cargando_img{
    0%{
        transform: scale(1);
        opacity: 1;
    }
    50%{
        transform: scale(.8);
    }
}

::-webkit-scrollbar {
    display: none;
}

body {
    width: 100vw;
    height: 100vh;
}

.deshabilitado:not(.contenedor_input){
    filter: brightness(.5);
    pointer-events: none;
}

.contenedor_input.deshabilitado input:not(.combobox_vitam input),
.contenedor_input.deshabilitado select,
.contenedor_input.deshabilitado textarea,
.contenedor_input.deshabilitado .combobox_vitam
{
    filter: brightness(.7);
    pointer-events: none;
}

.contenedor_input.celular_verificado input{
    filter: brightness(.7);
    pointer-events: none;
}

.input-oculto{
    display: none;
}

.contenedor_menu{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.contenedor_principal{
    width: 100%;
    height: 100%;
    position: relative;
    overflow: scroll;
}

.contenedor_principal.contenedor_principal_escritorio{
    display: none;
}

@media (min-width: 790px) {
    .contenedor_principal.contenedor_principal_escritorio{
        display: flex;
    }

    .contenedor_principal.contenedor_principal_movil{
        display: none;
    }
}

.contenedor_principal #frmMenu{

}

.contenedor_principal_escritorio #frmMenuEscritorio{
    width: 100%;
}

div.contenedor_flecha_volver{
    position: fixed;
    display: none;
    bottom: 0;
    left: 0;
    width: 100%;
    box-shadow: inset 0px 0px 0px 0px;
    background-image: linear-gradient(to top, rgba(0,0,0,.2) 5%, rgba(0,0,0,0));
}

div.contenedor_flecha_volver label{
    display: flex;
    align-items: center;
    font-size: 1.2rem;
    font-weight: 700;
    color: rgba(50, 50, 50);
    height: 75%;
    padding-right: 1rem;
    padding-top: .2rem;
    background-color: rgba(0,0,0,.2);
    text-shadow: 0px 0px 12px black;
    border-radius: 0 5px 5px 0;
}

div.contenedor_flecha_volver label:hover{
    cursor: pointer;
}

.flecha_volver{
    color: #3b5297;
    font-size: 3rem;
    padding: 0 1rem;
    text-shadow: 0px 0px 5px rgb(95 114 169);
}

.flecha_volver:hover{
    cursor: pointer;
}

div.contenedor_flecha_volver.mostrar_flecha{
    display: flex;
    height: 5rem;
    justify-content: flex-start;
    align-items: center;
    z-index: 100;
}

form{
    height: 100%;
    position: relative;
}

#frmMenuMovil{
    background-color: #f5f5f5;
}

form.frm_login{
    
}

.contenedor_principal #icono_ubicacion{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 100;
}

.contenedor_principal #icono_ubicacion i{

}

.contenedor_barra_superior{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 10%;
    overflow: hidden;
    background-color: white;
}

.contenedor_barra_superior.barra_consulta_precio{
    background-color: black;
}

.icono_volver{
    position: fixed;
    width: 3rem;
    height: 3rem;
    bottom: 1rem;
    left: 1.8rem;
    display: flex;
    background-color: #ce3a50c4;
    border-radius: 25px;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.icono_volver i{
    color: black;
    font-size: 2.5rem;
}

.contenedor_barra_superior .imagen_encabezado{
    max-width: 100%;
    height: 17rem;
}

.contenedor_principal_movil .contenedor_imagen_principal{
    width: 100%;
    position: relative;
    background-color: white;
}

.contenedor_principal_escritorio .contenedor_imagen_principal{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    top: 0;
    left: 0;
}

.contenedor_principal_movil .contenedor_imagen_principal img{
    width: 100%;
    border-radius: 16px 16px 0 0;
}

.contenedor_principal_escritorio .contenedor_imagen_principal img{
    width: 100%;
    height: 100%;
    /* border-radius: 16px 16px 0 0; */
}

.contenedor_principal_movil .contenedor_imagen_principal .sombreado_imagen{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    border-radius: 16px 16px 0 0;
    box-shadow: inset 0px 0px 0px 0px;
    background-image: linear-gradient(to right, rgba(0,0,0,.6) -5%, rgba(0,0,0,0));
}

.contenedor_principal_movil .contenedor_central{
    width: 100%;
    background-color: #f5f5f5;
    /* min-height: 75%; */
    padding-top: 1rem;
}

.contenedor_principal_escritorio .segmentos_menu_escritorio{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: right;
    padding-right: 5rem;
    position: absolute;
    z-index: 1;
}

.contenedor_principal_escritorio .contenedor_central{
    width: 40rem;
    background-color: #f5f5f5b4;
    min-height: 75%;
    padding-top: 1rem;
    border-radius: 5px;
}

.div_menu{
    display: none;
}

.div_menu.menu_activo{
    display: flex;
    flex-direction: column;
}

.contenedor_central a{
    width: 100%;
}


.contenedor_central .titulo_conteneodor_central{
    font-weight: 800;
    font-size: 2.4rem;
    padding: 1rem 2rem;
    color: rgba(0,0,0,.95);
}

.seccion_contenedor_central{
    display: flex;
    padding: .7rem 2rem;
}

.seccion_oculta{
    display: none;
}

.contenedor_principal_movil .seccion_menu{
    border-radius: 10px;
    height: 11.2rem;
    width: 100%;
    display: flex;
    align-items: center;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.09), 0px 2px 4px rgba(0, 0, 0, 0.09);
}

.contenedor_principal_escritorio .seccion_menu{
    border-radius: 10px;
    height: 11.2rem;
    width: 100%;
    display: flex;
    align-items: center;
    background-color: #f5f5f5;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.09), 0px 2px 4px rgba(0, 0, 0, 0.09);
}

.contenedor_principal_movil .seccion_menu:hover{
    background-color: rgba(59,82,151,.1);
}

.contenedor_principal_escritorio .seccion_menu:hover{
    cursor: pointer;
    background-color: rgb(226 228 235);
}

.contenedor_principal_escritorio .seccion_menu label:hover{
    cursor: pointer;
}

.icono_menu{
    display: flex;
    justify-content: center;
    align-items: center;
    /* font-size: 3.5rem; */
    /* color: #ce3a50; */
    /* height: 4rem; */
    /* background: rgba(59,82,151,.1); */
    position: relative;
    width: 20%;
}

.icono_menu .contenedor_icono{
    width: 4rem;
    height: 4rem;
    background-color: rgba(59, 82, 151, .1);
    border-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.icono_menu .contenedor_icono .icono_seccion{
    color: rgb(59 82 151);
    font-size: 1.8rem;
}


.icono_menu img{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    border-radius: 100px;
    /* position: absolute; */
    /* background-color: rgba(206, 58, 80, .10); */
}

.titulo_menu{
    display: flex;
    flex-direction: column;
    width: 80%;
}

.titulo_menu label{
    text-align: left;
    font-style: normal;
    font-weight: 700;
    font-size: 1.6rem;
    color: #2c2c2c;
}

.descripcion_menu{
    width: 85%;
}

.descripcion_menu label{
    font-size: 1rem;
    opacity: .4;
}

.descripcion_menu label:not(label:last-of-type)::after{
    content: " - ";
}

#contenedor_pie_menu{
    display: none;
    /* border: 1px solid red; */
    padding: 2.7rem 2rem 0 2rem;
    background-color: #f5f5f5;
}

    #seccion_pie_menu{
        display: flex;
        flex-direction: column;
        /* border: 1px solid red; */
        border-radius: 15px 15px 0px 0px;
        /* padding: 1rem 2rem; */
        overflow: hidden;
        background-color: var(--azul_principal);
        box-shadow: 0px -4px 8px rgba(0, 0, 0, 0.09), 0px -2px 4px rgba(0, 0, 0, 0.09);
    }



        /* #label_titulo_pie{
            font-size: 1.3rem;
            font-weight: 600;
            margin-top: 0;
            color: #f5f5f5;
        }

        #seccion_pie_menu span{
            font-weight: 600;
            margin-right: .5rem;
            color: #f5f5f5;
        }

        #seccion_pie_menu label{
            margin-top: .5rem;
            color: #f5f5f5;
        } */

.difuminador_camara{
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    z-index: 1;
}

.escaner_codigo{
    position: relative;
    margin: 0 auto;
    margin-top: 7.5rem;
    width: 75%;
    height: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 0 0 2000px rgba(0,0,0,.6);
}

.marco{
    display: flex;
    justify-content: space-between;
}

.esquina{
    width: 5rem;
    height: 5rem;
}

.superior_izquierda{
    border-left: .5rem solid var(--color-titulos);
    border-top: .5rem solid var(--color-titulos);
}
.superior_derecha{
    border-right: .5rem solid var(--color-titulos);
    border-top: .5rem solid var(--color-titulos);
}
.inferior_derecha{
    border-bottom: .5rem solid var(--color-titulos);
    border-right: .5rem solid var(--color-titulos);
}
.inferior_izquierda{
    border-left: .5rem solid var(--color-titulos);
    border-bottom: .5rem solid var(--color-titulos);
}

.escaner_codigo .contenedor_imagen{
    position: absolute;
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 2.5rem 0;
}

.escaner_codigo .contenedor_imagen img{
    width: 75%;
    height: 100%;
    opacity: .3;
}

.contenedor_video{
    position: relative;
    width: 100%;
    height: 43%;
    overflow: hidden;
}

.contenedor_video.contenedor_reconodedor_facial{
    padding: .1rem;
}

.div_cubrir{
    /* position: absolute;
    background-color: white;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0; */
}

.contenedor_video .titulo_escaner{
    position: absolute;
    color: white;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 20%;
    z-index: 2;
}

.contenedor_video .titulo_escaner label{
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: 0em;
    font-style: normal;
    line-height: 28px;
}

.contenedor_video video{
    width: 100%;
    /* height: 100%; */
}

canvas{
    max-width: 100%;
}

canvas.drawingBuffer{
    position:absolute;
    top:0;
    left:0;
    /* height: 100%; */
}

#resultado{
    position: absolute;
    top: 0;
    left: 0;
    color: white;
    font-weight: bold;
}

.contenedor_pie_escaner{
    height: 47%;
    background-color: black;
    display: flex;
    justify-content: center;
    padding: 2.5rem 0;
}

.contenedor_botones{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contenedor_botones .boton{
    margin: 1rem 0;
}

.boton_escaner{
    background-color: white;
    height: 45px;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    justify-content: center;
    letter-spacing: 0.01em;
    color: #000000;
    display: flex;
    align-items: center;
    padding: 16px 24px;
    border-radius: 16px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.09), 0px 2px 4px rgba(0, 0, 0, 0.09);
    width: 100%;
}

.contenedor_principal_escritorio .boton_escaner{
    background-color: rgba(30,30,30);
    color: white;
}

.contenedor_boton_cartola{
    position: fixed;
    bottom: .5rem;
    width: 100%;
    transition: all .2s;
}

.boton_cartola{
    background-color: white;
    height: 3rem;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    justify-content: center;
    letter-spacing: 0.01em;
    color: rgba(0,0,0,.9);
    display: flex;
    align-items: center;
    padding: 16px 24px;
    border-radius: 10px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.09), 0px 2px 4px rgba(0, 0, 0, 0.09);
    width: 90%;
}

.boton_negro{
    color: #ffffff;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 24px;
    gap: 8px;
    height: 45px;
    font-size: 16px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    background: rgba(0,0,0,.9);
    border-radius: 16px;
}

.boton_blanco{
    position: relative;
    top: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 16px 24px;
    gap: 8px;
    height: 56px;
    background: #ffffff;
    border-radius: 16px;
    font-size: 16px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

.boton_menu{
    background-color: rgba(59, 82, 151, 0.95);
    color: white;
}


.boton_pago{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 4rem;
    width: 12rem;
    font-size: 1.6rem;
    font-weight: 500;
    background-color: var(--azul_principal);
    color: white;
    border-radius: 5px;
}

.contenedor_principal_escritorio label.boton{
    border-radius: 0;
}

.contenedor_error{
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10rem 6rem;
}

.icono_error{
    color: #ffc014;
    font-size: 5rem;
}

.titulo_error{
    font-size: 3.3rem;
    font-weight: bold;
    text-align: center;
}

.contenido_error{
    font-size: 1.6rem;
    text-align: center;
}

.contenedor_ingreso_manual{
    width: 100%;
    height: 100%;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contenedor_registro_cliente{
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    transition: all .5s;
    padding: 1rem;
    flex-direction: column;
    align-items: center;
}

.contenedor_registro_cliente_escritorio.actualizar_datos{
    flex-direction: row;
}

.contenedor_registro_cliente.contenedor_registro_cliente_escritorio{
    display: none;    
}

@media (min-width: 900px) {
    .contenedor_registro_cliente.contenedor_registro_cliente_escritorio{
        display: flex;
        flex-direction: row;
    }
    .contenedor_registro_cliente.contenedor_registro_cliente_movil{
        display: none;    
    }
}

.contenedor_registro_cliente.nuevo_registro .contenedor_nuevo_cliente{
    display: flex;
}

.contenedor_actualizar_datos{
    display: none;
    width: 100%;
    height: 100%;
    padding: 1rem;
    position: relative;
}

.contenedor_registro_cliente.actualizar_datos .contenedor_actualizar_datos{
    display: flex;
}

.contenedor_registro_cliente_movil.nuevo_registro .contenedor_nuevo_cliente,
.contenedor_registro_cliente_movil.actualizar_datos .contenedor_actualizar_datos{
    height: 100%;
    width: 100%;
    flex-direction: column;
}

.contenedor_registro_cliente_movil.actualizar_datos .contenedor_nuevo_cliente{
    width: 100%;
}

.contenedor_registro_cliente_movil.actualizar_datos .contenedor_nuevo_cliente .contenedor_formulario{
    display: none;
}

.contenedor_registro_cliente_escritorio.nuevo_registro .contenedor_nuevo_cliente{
    width: 35%;
    height: 100%;
    align-items: center;
}

.contenedor_registro_cliente_escritorio.actualizar_datos .contenedor_actualizar_datos{
    width: 35%;
    height: 100%;
    align-items: center;
}

.contenedor_nuevo_cliente.contenedor_registro{
    padding-top: 0;
}

/* .contenedor_registro_cliente_escritorio.actualizar_datos .contenedor_nuevo_cliente.contenedor_registro{
    width: calc(100% - 50rem);
} */

.contenedor_nuevo_cliente .contenedor_nuevo_cliente_datos{
    overflow: hidden;
    height: 0%;
    transition: all .1s;
}

.contenedor_nuevo_cliente .contenedor_nuevo_cliente_datos.mostrar_contenedor{
    height: calc(100% - 3.5rem);
    overflow: visible;
}

#contenedor_ingreso_cartola{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#contenedor_formulario_minicartola{
    display: flex;
    flex-direction: column;
}

@media (min-width: 790px) {
    #contenedor_formulario_minicartola{
        display: flex;
        flex-direction: row;
    }
}

    .contenedor_principal_escritorio #contenedor_ingreso_cartola{
        width: calc(100% - 50rem);
    }

        #titulo_ingreso_cartola{
            width: 85%;
            text-align: center;
            padding: 2rem;
            /* height: 16.5%; */
        }

        #contenedor_imagen_cartola{
            width: 100%;
            position: relative;
        }

            #contenedor_imagen_cartola img{
                width: 100%;
            }

            .contenedor_imagen_cartola .marcador_cartola{
                background-color: white;
                border-radius: 15px 15px 0 0;
            }

            .contenedor_principal_escritorio .marcador_cartola{
                display: none;
            }

    .contenedor_principal_escritorio #form_cartola{
        width: 50rem;
        padding-top: 7rem;
    }

        #frmConsultaCredito{
            display: flex;
            flex-direction: column;
            align-items: center;
        }

            #frmConsultaCredito .contenedor_botones{
                margin-top: 2rem;
                width: 85%;
            }

                #frmConsultaCredito .contenedor_botones .boton_escaner{
                    height: 40px;
                }

            #frmConsultaCredito .contenedor_input{
                margin: 0;
                width: 85%;
            }

.contenedor_principal_escritorio #contenedor_mini_cartola_movil,
.contenedor_principal_movil #contenedor_mini_cartola_movil{
    display: none;
}

.contenedor_principal_escritorio #contenedor_mini_cartola_escritorio,
.contenedor_principal_movil #contenedor_mini_cartola_escritorio{
    display: none;
}

.titulo_ingreso_manual{
    width: 85%;
    text-align: center;
    padding: 3.5rem 0;
    /* height: 16.5%; */
}

.titulo_registro{
    width: 90%;
    text-align: center;
    padding: 1.5rem 0;
    /* height: 16.5%; */
}

.titulo_ingreso_manual label,
#titulo_ingreso_cartola label{
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: 0em;
    font-style: normal;
    line-height: 28px;
    color: rgba(0, 0, 0, .95);
}

.titulo_registro label{
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: 0em;
    font-style: normal;
    line-height: 28px;
}

.contenedor_imagen,
.contenedor_imagen_precio{
    width: 100%;
    padding: 0rem 11rem;
}

.contenedor_registro_cliente_movil .contenedor_imagen_registro{
    width: 100%;
    position: relative;
    height: 20rem;
}

.contenedor_registro_cliente_escritorio .contenedor_imagen_registro{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 65%;
    height: 100%;
    position: relative;
    padding: 0 1rem;
}

/* .contenedor_registro_cliente_escritorio.actualizar_datos .contenedor_imagen_registro{
    width: 100%;
} */

.imagen_marcada{
    width: 100%;
    position: relative;
}

.contenedor_imagen img,
.contenedor_imagen_precio img,
.contenedor_imagen_registro img{
    width: 100%;
}

.contenedor_imagen_registro .titulo_tarjeta_multihogar{
    position: absolute;
    width: 100%;
    display: flex;
    bottom: 4rem;
    justify-content: center;
}

.contenedor_imagen_registro .titulo_tarjeta_multihogar label{
    background: #3b5299;
    color: white;
    display: flex;
    padding: .5rem 0rem;
    border-radius: 20px;
    width: 75%;
    max-width: 75rem;
    justify-content: center;
    text-align: center;
}

.contenedor_registro_cliente_escritorio .contenedor_imagen_registro .titulo_tarjeta_multihogar{
    padding: 0 1rem;
}

.contenedor_registro_cliente_escritorio .contenedor_imagen_registro .titulo_tarjeta_multihogar label{
    font-size: 2rem;
    font-weight: 800;
}

.contenedor_registro_cliente_movil .contenedor_imagen_registro .titulo_tarjeta_multihogar{

}

.contenedor_registro_cliente_movil .contenedor_imagen_registro .titulo_tarjeta_multihogar label{
    font-size: 1.2rem;
    font-weight: 800;
    width: auto;
    padding: .1rem 1rem;
}

.contenedor_principal_movil .contenedor_imagen img,
.contenedor_principal_movil .contenedor_imagen_registro img{
    width: calc(100% + 2rem);
    height: 100%;
    position: absolute;
    top: -1rem;
    left: -1rem;
}

.contenedor_registro_cliente_escritorio .contenedor_imagen img,
.contenedor_registro_cliente_escritorio .contenedor_imagen_cartola img,
.contenedor_registro_cliente_escritorio .contenedor_imagen_registro img{
    width: 100%;
    border-radius: 0;
    /* margin-bottom: 10rem; */
}

.contenedor_registro_cliente_escritorio .contenedor_imagen_registro img{

}

#contenedor_imagen_cartola .marcador_cartola {
    background-color: white;
    border-radius: 15px 15px 0 0;
}

.marcador_imagen{
    height: 2rem;
    width: 100%;
    position: absolute;
    bottom: 0;
    box-shadow: 0 -5px 5px rgba(150,150,150,.2);
    z-index: 2;
}

.contenedor_principal_movil .contenedor_imagen_principal .marcador_principal{
    background-color: whitesmoke;
    border-radius: 15px 15px 0 0;
    display: flex;
}

.marcar_codigo{
    position: absolute;
    border: 2px solid #ce3a50;
    width: 110%;
    height: 3rem;
    border-radius: 5px;
    bottom: -5px;
    left: -5%;
}

.contenedor_formulario{
    padding: 2rem;
    display: flex;
    flex-direction: column;
    position: relative;
}

.contenedor_registro_cliente_movil .contenedor_formulario{
    width: 100%;
    height: calc(100% - 18rem);
    overflow: scroll;
}

.contenedor_registro_cliente_escritorio .contenedor_formulario{
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .3);
    overflow: scroll;
    /* border-radius: 20px; */
}

.contenedor_registro_cliente_escritorio.actualizar_datos .contenedor_formulario{
    display: none;
}

.contenedor_beneficios{
    display: flex;
    padding: 0 2rem;
    flex-direction: column;
    font-size: 1.1rem;
    font-weight: 600;
}

.contenedor_beneficios.contenedor_oculto{
    display: none;
}

.contenedor_beneficios .contenedor_titulo_beneficios{
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: .5rem;
}

.contenedor_beneficios .contenedor_titulo_beneficios .titulo_beneficios{
    display: flex;
    justify-content: center;
    background-color: #3b5299;
    color: white;
    font-size: 1.2rem;
    padding: .2rem 1rem;
    border-radius: 25px;
    width: 100%;
}


.contenedor_beneficios label{
    display: flex;
    justify-content: left;
    align-items: center;
    padding: .5rem 0;
    font-size: 1.1rem;
}

.contenedor_beneficios label span{
    padding-right: 1rem;
}

.contenedor_input {
    display: flex;
    position: relative;
    z-index: 1;
    justify-content: space-evenly;
    flex-direction: column;
    align-items: center;
    margin-bottom: 3rem;
    width: 100%;
}

.frmRegistroCliente .contenedor_input{
    margin: 0;
}

.contenedor_input input:not([type="checkbox"],[type="radio"]), 
.contenedor_input textarea,
.contenedor_input select {
    font-size: 1.5rem;
    height: 5rem;
    padding: 0.5rem;
    display: block;
    background-color: white;
    border: 1px solid;
    border-radius: .8rem;
    color: #333;
    /* margin: 0.5rem 0; */
    width: 100%;
    z-index: 1;
    transition: all .5s;
}

.contenedor_principal_escritorio .contenedor_input input:not([type="checkbox"],[type="radio"]), 
.contenedor_principal_escritorio .contenedor_input textarea,
.contenedor_principal_escritorio .contenedor_input select {
    font-size: 1.5rem;
    height: 5rem;
    padding: 0.5rem;
    display: block;
    background-color: white;
    border: 1px solid rgba(200,200,200);
    border-radius: 0;
    color: #333;
    /* margin: 0.5rem 0; */
    width: 100%;
    z-index: 1;
    transition: all .5s;
    outline: 0;
}

.contenedor_principal_movil .contenedor_input input:focus ~ .icon-qrcode{
    border: 1px solid;
}

.contenedor_input input:invalid,
.contenedor_input.marca_error input
{
    outline: var(--color_rojo) auto 1px;
}

.contenedor_input.small input:not([type="checkbox"],[type="radio"]), 
.contenedor_input.small textarea, 
.contenedor_input.small select,
.contenedor_input.small .combobox_vitam,
.contenedor_input.small .combobox_vitam > input {
    height: 3.5rem;
}

.contenedor_input_check.small{
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    width: 100%;
    margin-bottom: .5rem;
}

.contenedor_input_check.small input{
    margin-right: .5rem;
}

.contenedor_input_check.small label{

}

.contenedor_input_check.small label a{
    text-decoration: underline;
}

.contenedor_input.requerido input {
    box-shadow: 0px 0px 5px #ce3a50;
}

.contenedor_input textarea {
    height: auto;
}

.contenedor_input.medium label.panel_legenda:not(div.panel_legenda label.panel_legenda) {
    /* position: absolute; */
    /* font-size: 2rem; */
    /* padding: 1rem; */
    /* pointer-events: none; */
    /* opacity: .6; */
    /* top: .5rem; */
    /* left: 1rem; */
    /* transition: transform 120ms ease-in; */
}

.contenedor_input div.panel_legenda label.panel_legenda{
    font-size: 2rem;
    transition: all 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
}

.contenedor_input.small div.panel_legenda label.panel_legenda {
    font-size: 1.5rem;
}

.contenedor_input.small input:focus + div.panel_legenda label.panel_legenda,
.contenedor_input.small input:not(:placeholder-shown) + div.panel_legenda label.panel_legenda,
.contenedor_input.small textarea:focus + div.panel_legenda label.panel_legenda,
.contenedor_input.small textarea:not(:placeholder-shown) + div.panel_legenda label.panel_legenda,
.contenedor_input.small select + div.panel_legenda label.panel_legenda,
.contenedor_input.small > .contenedor_combobox + div.panel_legenda label.panel_legenda,
.contenedor_input.small > .contenedor_selector_busqueda + div.panel_legenda label.panel_legenda,
.contenedor_input.small > .combobox_vitam + div.panel_legenda label.panel_legenda
{
    font-size: 1.2rem;
    background: white;
    border-radius: 5px;
    translate: 0 -17px;
    padding: 0 .5rem;
    z-index: 50;
}

.contenedor_input label.icono_verificado{
    position: absolute;
    right: 0;
    top: 0;
    height: 3.5rem;
    width: 3.5rem;
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    z-index: 20;
}

.contenedor_input label.icono_buscar
{
    position: absolute;
    right: 0;
    top: 0;
    height: 3.5rem;
    width: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    z-index: 20;
}

.contenedor_input label.icono_buscar.icon-qrcode
{
    position: absolute;
    right: 1px;
    top: 1px;
    height: 3.3rem;
    width: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
    border-left: 1px solid;
    background: rgb(178 178 178);
    border-radius: 0px 6px 6px 0px;
    z-index: 20;
}

.contenedor_principal_escritorio .contenedor_input label.icono_buscar.icon-qrcode
{
    font-size: 1.8rem;
    border-left: none;
    border-radius: 0px;
    z-index: 20;
}

.contenedor_input.celular_verificado label.icono_buscar{
    display: none;
}

.contenedor_input.celular_verificado label.icono_verificado{
    display: flex;
}

.contenedor_input > .combobox_vitam.combobox_vitam_arriba + div.panel_legenda label{
    translate: 0 17px;
}

select option{
    width: 100%;
}

.contenedor_input div.panel_legenda {
    position: absolute;
    display: flex;
    align-items: center;
    pointer-events: none;
    width: 100%;
    height: 5rem;
    top: 0;
    left: 0;
    color: #333;
    padding: .2rem 0;
    padding-left: 1rem;
    z-index: 20;
}

.contenedor_input.small div.panel_legenda {
    width: 100%;
    height: 3.5rem;
}

.contenedor_input.medium input:focus + div.panel_legenda label.panel_legenda,
.contenedor_input.medium input:not(:placeholder-shown) + div.panel_legenda label.panel_legenda,
.contenedor_input.medium textarea:focus + div.panel_legenda label.panel_legenda,
.contenedor_input.medium textarea:not(:placeholder-shown) + div.panel_legenda label.panel_legenda,
.contenedor_input.medium select + div.panel_legenda label.panel_legenda,
.contenedor_input.medium > .contenedor_combobox + div.panel_legenda label.panel_legenda,
.contenedor_input.medium > .contenedor_selector_busqueda + div.panel_legenda label.panel_legenda,
.contenedor_input.medium > .combobox_vitam + div.panel_legenda label.panel_legenda{
    font-size: 1.5rem;
    background: white;
    border-radius: 5px;
    translate: 0 -25px;
    padding: 0 .5rem;
    z-index: 50;
}

.contenedor_input .campo_requerido{
    opacity: 0;
    width: 100%;
    padding: 0 1rem;
    font-size: 1.1rem;
    font-weight: bold;
    color: #ce3a50;
    transition: all .5s;
    pointer-events: none;
}

.contenedor_input.requerido .campo_requerido{
    opacity: 1;
} 

.consulta_precio{
    padding: 1.6rem;
}

.contenedor_informacion{
    align-items: flex-start;
    /* 3b5294 */
    background-color: #3b529747;
    border-radius: 15px;
    display: flex;
    flex-direction: row;
    gap: 8px;
    padding: 14px 90px 14px 16px;
    width: 100%;
}

.icono_informacion{
    color: #3b5297;
    font-size: 2.6rem;
    display: flex;
    align-items: flex-start;
}

.contenedor_informacion label{
    color: #3b5297;
    font-style: normal;
    font-weight: 400;
    font-size: 1.5rem;
    line-height: 20px;
}

.contenedor_informacion label span{
    font-weight: bold;
}

.contenedor_producto{

}

.encabezado_producto{

}

.detalle_producto{
    display: flex;
    flex-direction: column;
    margin-left: 1rem;
    padding: 0 2rem;
}

.detalle_producto label{
    margin: 0.2rem 0;
}

.detalle_producto .marca{
    margin-top: 1rem;
    color: #2c2c2c;
    font-weight: 400;
    font-size: 2rem;
    line-height: 24px;
}

.detalle_producto .descripcion{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #2c2c2c;
    font-weight: 700;
    font-size: 2rem;
    line-height: 24px;
    max-width: 100%;
}

.detalle_producto .precio_grande{
    font-style: normal;
    font-weight: 700;
    font-size: 5rem;
    line-height: 24px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    color: #e4022d;
}

.detalle_producto .precio_oferta{
}

.detalle_producto .precio_normal{
    font-style: normal;
    font-weight: 400;
    font-size: 2rem;
    text-decoration: line-through;
    line-height: 24px;
    color: #6e6e6e;
    margin-bottom: 1.5rem;
}

.detalle_producto .cod_item{
    color: #8e8e8e;
    font-style: normal;
    font-weight: 400;
    font-size: 1.5rem;
    line-height: 16px;
    margin-bottom: 1rem;
}

.detalle_producto .contenedor_color_talla{
    display: flex;
    align-items: center;
}

.detalle_producto .contenedor_color_talla label{
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: center;
    padding: 0 .5rem;
}

.detalle_producto .contenedor_color_talla:first-child{
    padding-left: 0;
}

.detalle_producto .contenedor_color_talla .separador{
    height: 2rem;
    margin-left: 2px;
    border-right: 2px solid;
}

.contenedor_resumen_financiero{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    height: 9%;
    min-height: 65px;
    /* margin: auto; */
    padding: 0rem 2rem;
    font-size: 1.1rem;
    color: rgba(90,90,90,1);
}

.contenedor_resumen_financiero .monto_resumen{
    font-size: 1.2rem;
    font-weight: 500;
    color: black;
}

.contenedor_resumen_financiero .resumen_superior{
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.contenedor_resumen_financiero .resumen_superior .monto_resumen{
    margin-top: .5rem;
}

.contenedor_resumen_financiero .resumen_utilizado{
    display: flex;
    flex-direction: column;
    text-align: start;
}

.contenedor_resumen_financiero .resumen_disponible{
    display: flex;
    flex-direction: column;
    text-align: end;
}

.contenedor_resumen_financiero .barra_cupo_utilizado{
    width: 100%;
    height: .3rem;
    background-color: rgba(59,82,151,.3);
    border-radius: 5px;
    margin: .5rem 0;
}

#barra_porcentaje_consumo{
    max-width: 100%;
    height: 100%;
    background-color: rgba(59,82,151,1);
    border-radius: 5px;
}

.contenedor_resumen_financiero .resumen_cupo_total{
    display: flex;
    justify-content: space-between;
}

.contenedor_detalle_financiero{
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
    min-height: 25%;
    max-height: 74%;
    padding-bottom: 2rem;
}

.selector_detalle_financiero{
    display: flex;
    font-size: 1.2rem;
    margin-top: 1rem;
    padding: .5rem 0rem;
    width: 90%;
    justify-content: center;
    font-weight: 500;
}

.selector_detalle_financiero .selector{
    /* border: 1px solid rgba(59,82,151,1); */
    padding: .2rem 0rem;
    width: 50%;
    display: flex;
    justify-content: center;
    border-bottom: 2px solid rgba(59,82,151,.1);
}

.selector_detalle_financiero .selector_consumo{
    /* border-radius: 5px 0px 0 5px; */
}

.selector_detalle_financiero .selector_facturacion{
    /* border-radius: 0 5px 5px 0; */
}

.selector_detalle_financiero .selector.activo{
    /* background-color: rgba(59,82,151,1); */
    /* color: white; */
    /* border: 1px solid black; */
    border-bottom: 2px solid rgba(59,82,151,1);
}

.detalle_consumo{
    width: 90%;
    /* margin-top: 0rem; */
    display: none;
    overflow: scroll;
}

.detalle_consumo.detalle_activo{
    display: block;
}

.detalle_consumo .detalle_cargo_tarjeta{
    /* padding: 0 2rem; */
    font-size: 1.2rem;
    overflow: hidden;
    max-height: calc(50px * var(--registros_facturacion));
    transition: all .5s;
}

.detalle_consumo .facturaciones_pendientes .detalle_cargo_tarjeta{
    height: 0px;
}

#contenedor_facturaciones .facturaciones_pendientes.mostrar .detalle_cargo_tarjeta{
    height: auto;
}

.detalle_consumo .descripcion{
    padding: 1rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.2rem;
    height: 50px;
    width: 100%;
}

.detalle_consumo .descripcion_cargo{

}

.detalle_consumo .icono_cargo{
    width: 10%;
    text-align: center;
}

.detalle_consumo .icono_pago{
    width: 10%;
    text-align: center;
}

.detalle_consumo .contenedor_descripcion_consumo{
    width: 69%;
    text-align: start;
    display: flex;
    justify-content: center;
    /* padding-right: 3rem; */
}

.detalle_consumo .contenedor_monto_consumo{
    width: 21%;
    text-align: end;
}

.detalle_consumo .icono_cargo i{
    color: red;
    font-size: 2rem;
    transform: rotate(-45deg);
}

.detalle_consumo .icono_pago i{
    color: green;
    font-size: 2rem;
    transform: rotate(-45deg);
}

.detalle_consumo label.detalle_descripcion{
    display: flex;
    flex-direction: column;
}

.detalle_consumo label.detalle_facturacion{
    display: flex;
    flex-direction: column;
}

.detalle_descripcion span.detalle_extra{
    font-size: 1rem;
    color: rgb(90, 90, 90);
}

.detalle_monto span.detalle_extra{
    font-size: 1rem;
    color: rgb(90, 90, 90);
}

.detalle_consumo .legenda_facturado{
    font-size: 1rem;
    color: #e4022d;
}

.detalle_consumo .legenda_no_facturado{
    font-size: 1rem;
    color: rgba(59,82,151,1);
}

.detalle_consumo #contenedor_facturaciones{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    width: 100%;
    margin: auto;
    margin-bottom: 1rem;
    font-size: 1.1rem;
}

.detalle_consumo #contenedor_facturaciones .facturaciones_pendientes:not(.facturaciones_pendientes:last-child){
    margin-bottom: .5rem;
}

#contenedor_facturaciones .facturaciones_pendientes{
    width: 100%;
    font-size: 1.2rem;
    padding-bottom: .5rem;
    box-shadow: 0px 1px rgba(59,82,151,.1);
}

#contenedor_facturaciones .facturaciones_pendientes .marca_deslizar{
    width: 100%;
    height: 2px;
    display: flex;
    justify-content: center;
    /* border-radius: 0 0 25px 25px; */
    /* align-items: center; */
    margin-top: .5rem;
    background-color: rgba(59,82,151,1);
    transition: all .1s;
}

#contenedor_facturaciones .facturaciones_pendientes.mostrar .marca_deslizar{
    height: 2px;
    background-color: rgba(59,82,151,.1);
    border-radius: 0px;
}

#contenedor_facturaciones .facturaciones_pendientes .marca_deslizar span{
    opacity: 0;
    transition: all .1s;
}

#contenedor_facturaciones .facturaciones_pendientes.mostrar .marca_deslizar span{
    opacity: 0;
}

#contenedor_facturaciones .facturaciones_pendientes label{
    padding: .2rem 0;
}

.facturaciones_pendientes .monto_facturado{
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.facturaciones_pendientes .fecha_vencimiento{
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.modal_popup.modal_cartola{
    position: absolute;
    background: rgba(0,0,0,.1);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 2;
    display: none;
}

.modal_cartola .contenedor_modal{
    background-color: white;
    position: relative;
    overflow: hidden;
    width: 70%;
    margin: 15rem auto;
    border-radius: 15px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.09), 
                0px 2px 4px rgba(0, 0, 0, 0.09);
    transition: all .5s;
}

.contenedor_principal_escritorio .modal_popup.modal_cartola .contenedor_modal.mostrar_pregunta{
    border-radius: 5px;
    width: 50%;
}

.modal_cartola .contenedor_modal.mostrar_pregunta{
    height: 12rem;
}

.contenedor_principal_escritorio .modal_popup.modal_cartola .contenedor_modal.mostrar_pregunta{
    height: 18rem;
    border-radius: 5px;
}

.modal_cartola .contenedor_modal.mostrar_ingreso_correo{
    height: 18rem;
    width: 80%;
}

.contenedor_principal_escritorio .modal_popup.modal_cartola .contenedor_modal.mostrar_ingreso_correo{
    height: 20rem;
    width: 50%;
    border-radius: 5px;
}

.modal_cartola .contenedor_modal.mostrar_ingreso_correo label.titulo_ingreso_correo{
    display: flex;
    justify-content: center;
    width: 100%;
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 1.5rem;
}

.contenedor_principal_escritorio .modal_cartola .contenedor_modal.mostrar_ingreso_correo label.titulo_ingreso_correo{

}

.modal_cartola .contenedor_modal .contenedor_pregunta{
    display: none;
}

.modal_cartola .contenedor_modal.mostrar_pregunta .contenedor_pregunta{
    display: block;
}

.contenedor_principal_escritorio .modal_cartola .contenedor_modal.mostrar_pregunta .contenedor_pregunta{
    height: calc(100% - 3.5rem);
}

.modal_cartola .contenedor_modal .contenedor_ingresar_nuevo_correo{
    display: none;
}

.modal_cartola .contenedor_modal.mostrar_ingreso_correo .contenedor_ingresar_nuevo_correo{
    display: block;
    padding: 2rem 4rem 0 4rem;
}

.contenedor_principal_escritorio .modal_cartola .contenedor_modal.mostrar_ingreso_correo .contenedor_ingresar_nuevo_correo{
    padding: 2rem 8rem 1rem 8rem;
    height: calc(100% - 3.5rem);
}

.contenedor_modal .icono_cerrar{
    position: absolute;
    top: 2px;
    right: 5px;
    font-size: 1.8rem;
}

.contenedor_principal_escritorio .contenedor_modal .icono_cerrar{
    top: 5px;
    font-size: 2.4rem;
}

.modal_cartola .encabezado_modal{
    width: 100%;
    padding: 3rem 2rem 0 2rem;
    display: flex;
    flex-direction: column;
}

.contenedor_principal_escritorio .modal_cartola .encabezado_modal{
    padding: 3rem 10rem 2rem 10rem;
    height: 100%;
    justify-content: center;
}

.modal_cartola .mostrar_pregunta .encabezado_modal .contenedor_input_radio{
    padding-left: 3.5rem;
    width: 100%;
    min-width: auto;
}

.contenedor_principal_escritorio .modal_cartola .mostrar_pregunta .encabezado_modal .contenedor_input_radio{
    font-size: 1.4rem;
}

.modal_cartola .mostrar_pregunta .encabezado_modal .contenedor_input_radio input{
    width: 12px;
    height: 12px;
}

.contenedor_principal_escritorio .modal_cartola .mostrar_pregunta .encabezado_modal .contenedor_input_radio input{
    width: 15px;
    height: 15px;
}

.modal_cartola .mostrar_ingreso_correo .contenedor_input{
    margin-bottom: .5rem;
}

.modal_cartola .mostrar_ingreso_correo .contenedor_input input,
.modal_cartola .mostrar_ingreso_correo .contenedor_input div.panel_legenda{
    height: 2.5rem;
}

.modal_cartola .mostrar_ingreso_correo .contenedor_input div.panel_legenda label.panel_legenda{
    font-size: 1.2rem;
}

.contenedor_principal_escritorio .modal_cartola .mostrar_ingreso_correo .contenedor_input input,
.contenedor_principal_escritorio .modal_cartola .mostrar_ingreso_correo .contenedor_input div.panel_legenda{
    height: 3.5rem;
}

.contenedor_principal_escritorio .modal_cartola .mostrar_ingreso_correo .contenedor_input div.panel_legenda label.panel_legenda{
    font-size: 1.5rem;
}

.modal_cartola .mostrar_ingreso_correo .contenedor_input.small input:focus + div.panel_legenda label.panel_legenda,
.modal_cartola .mostrar_ingreso_correo .contenedor_input.small input:not(:placeholder-shown) + div.panel_legenda label.panel_legenda,
.modal_cartola .mostrar_ingreso_correo .contenedor_input.small textarea:focus + div.panel_legenda label.panel_legenda,
.modal_cartola .mostrar_ingreso_correo .contenedor_input.small textarea:not(:placeholder-shown) + div.panel_legenda label.panel_legenda,
.modal_cartola .mostrar_ingreso_correo .contenedor_input.small select + div.panel_legenda label.panel_legenda,
.modal_cartola .mostrar_ingreso_correo .contenedor_input.small > .contenedor_combobox + div.panel_legenda label.panel_legenda,
.modal_cartola .mostrar_ingreso_correo .contenedor_input.small > .contenedor_selector_busqueda + div.panel_legenda label.panel_legenda,
.modal_cartola .mostrar_ingreso_correo .contenedor_input.small > .combobox_vitam + div.panel_legenda label.panel_legenda {
    font-size: 1rem;
    translate: 0 -13px;
}

.modal_cartola .encabezado_modal .contenedor_encabezado_modal{
    display: flex;
}

.modal_cartola .encabezado_modal .contenedor_encabezado_modal i{
    font-size: 2.6rem;
    margin-right: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.contenedor_principal_escritorio .modal_cartola .encabezado_modal .contenedor_encabezado_modal i{
    font-size: 3rem;
}

.modal_cartola .encabezado_modal .contenedor_encabezado_modal .titulo_modal{
    font-size: 1.4rem;
}

.contenedor_principal_escritorio .modal_cartola .encabezado_modal .contenedor_encabezado_modal .titulo_modal{
    font-size: 1.8rem;
}

.modal_cartola .cuerpo_modal{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}

.modal_cartola .botones_modal{
    display: flex;
    width: 100%;
    height: 2.5rem;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 -1px 2px rgba(0,0,0,.05);
}

.contenedor_principal_escritorio .modal_cartola .botones_modal{
    height: 3.5rem;
}

.modal_cartola .botones_modal .boton{
    width: 50%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.3rem;
}

.contenedor_principal_escritorio .modal_cartola .botones_modal .boton{
    font-size: 1.6rem;
}

.modal_cartola .botones_modal .btn_izquierda{
    box-shadow: 1px 0px 0px rgba(0,0,0,.03);
}
.modal_cartola .botones_modal .btn_derecha{
    box-shadow: -1px 0px 0px rgba(0,0,0,.03);
}

.modal_popup.modal_verificacion_cliente{
    position: fixed;
    filter: drop-shadow(2px 4px 6px black);
    background-color: #96969633;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 50;
    /* border: 1px solid red; */
    display: none;
}

.modal_verificacion_cliente .contenedor_modal{
    display: flex;
    flex-direction: column;
    background-color: white;
    position: relative;
    overflow: hidden;
    width: 80%;
    height: 25rem;
    margin: 15rem auto;
    border-radius: 15px;
    justify-content: space-evenly;
}

.contenedor_principal_escritorio .modal_verificacion_cliente .contenedor_modal{
    border-radius: 5px;
}

.modal_verificacion_cliente .encabezado_modal{
    width: 100%;
    padding: 2rem 2rem 0 2rem;
    display: flex;
}

.modal_verificacion_cliente .encabezado_modal i{
    font-size: 2.6rem;
    margin-right: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal_verificacion_cliente .encabezado_modal .titulo_modal{
    display: flex;
    justify-content: center;
    width: 100%;
    font-size: 1.4rem;
    font-weight: bold;
}

.modal_verificacion_cliente .cuerpo_modal{
    padding: 2rem 3rem;
    height: min-content;
}

.modal_verificacion_cliente .cuerpo_modal .contenedor_input{
    margin-bottom: 1rem;
}

.modal_verificacion_cliente .cuerpo_modal form{
    height: auto;
}

.modal_verificacion_cliente .cuerpo_modal .contenedor_input div.panel_legenda{
    height: 3rem;
}

.modal_verificacion_cliente .cuerpo_modal .contenedor_input label.panel_legenda,
.modal_verificacion_cliente .cuerpo_modal .contenedor_input input
{
    font-size: 1.4rem;
}

.modal_verificacion_cliente .cuerpo_modal .contenedor_input input{
    height: 3rem;
}

.modal_verificacion_cliente .cuerpo_modal .botones_modal{
    display: flex;
    width: 100%;
    height: 2.5rem;
    justify-content: space-between;
    align-items: center;
    /* box-shadow: 0 -1px 2px rgba(0,0,0,.05); */
}

.modal_verificacion_cliente .cuerpo_modal .boton.boton_escaner{
    height: 1rem;
    width: 45%;
    font-size: 1.4rem;
}

.combobox_vitam{
    position: relative;
    width: 100%;
    z-index: 5;
}

.combobox_vitam.combobox_vitam_mostrar *{
    z-index: 3;
}

.combobox_vitam input.input_combobox_vitam:not(.option_combobox_vitam input){
    pointer-events: none;
    position: relative;
    border: 1px solid black;
    color: transparent;
    transition: none;
    z-index: 3;
}

.contenedor_principal_escritorio .combobox_vitam input.input_combobox_vitam:not(.option_combobox_vitam input){
    pointer-events: none;
    position: relative;
    border: 1px solid rgba(200,200,200);
    color: transparent;
    transition: none;
    z-index: 3;
}

.combobox_vitam.combobox_vitam_mostrar input.input_combobox_vitam:not(.option_combobox_vitam input){
    border: 2px solid black;
}

.contenedor_principal_escritorio .combobox_vitam.combobox_vitam_mostrar input.input_combobox_vitam:not(.option_combobox_vitam input){
    border: 1px solid rgba(200,200,200);
}

.combobox_vitam .panel_legenda_combobox_vitam{
    display: flex;
    align-items: center;
    padding: .2rem 1rem;
    font-size: 1.5rem;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
}

.combobox_vitam span{
    display: flex;
    align-items: center;
    position: absolute;
    padding: 0 .5rem;
    right: 0;
    top: 0;
    font-size: 1.5rem;
    height: 100%;
    z-index: 3;
}

.combobox_vitam.combobox_vitam_mostrar span{
    rotate: 180deg;
}

.combobox_vitam .contenedor_options_combobox_vitam{
    display: flex;
    flex-direction: column;
    background-color: white;
    position: absolute;
    width: 100%;
    max-height: 12rem;
    display: none;
    height: min-content;
    /* height: 0; */
    /* overflow: hidden; */
    z-index: 2;
}

.combobox_vitam .options_combobox_vitam{
    display: flex;
    flex-direction: column;
    width: 100%;
    overflow: scroll;
    max-height: 8rem;
    z-index: 2;
}

.combobox_vitam.combobox_vitam_abajo .contenedor_options_combobox_vitam{
    top: 2.7rem;
    border-radius: 0px 0px 5px 5px;
}

.contenedor_principal_escritorio .combobox_vitam .contenedor_options_combobox_vitam{
    border-radius: 0px;
}

.combobox_vitam.combobox_vitam_arriba .contenedor_options_combobox_vitam{
    bottom: 2.7rem;
    border-radius: 5px 5px 0px 0px;
}

.combobox_vitam.combobox_vitam_mostrar .contenedor_options_combobox_vitam{
    display: flex;
    border: 1px solid black;
}

.contenedor_principal_escritorio .combobox_vitam.combobox_vitam_mostrar .contenedor_options_combobox_vitam{
    border: 1px solid rgba(200,200,200);
}

.combobox_vitam .options_combobox_vitam .option_combobox_vitam{
    padding: .3rem .5rem;
    z-index: 2;
}

.combobox_vitam .options_combobox_vitam .option_combobox_vitam:hover{
    background-color: #3b529786;
}

.contenedor_options_combobox_vitam .option_combobox_vitam_input_abajo,
.contenedor_options_combobox_vitam .option_combobox_vitam_input_arriba{
    padding: .1rem 0rem;
}

.contenedor_input.small .combobox_vitam .option_combobox_vitam input{
    height: 3rem;
    border-radius: 0;
    border: none;
    border-bottom: 1px solid;
    outline: none;
}

.contenedor_input.small .combobox_vitam .option_combobox_vitam_input_abajo input{
    border-bottom: 1px solid;
}

.contenedor_input.small .combobox_vitam .option_combobox_vitam_input_arriba input{
    border-top: 1px solid;
}

.combobox_vitam_abajo .contenedor_options_combobox_vitam::before{
    content: '';
    height: 1rem;
}

.combobox_vitam_arriba .contenedor_options_combobox_vitam::after{
    content: '';
    height: 1rem;
}

.combobox_vitam_arriba .option_combobox_vitam_input_abajo{
    display: none;
}

.combobox_vitam_abajo .option_combobox_vitam_input_arriba{
    display: none;
}

.combobox_vitam .options_combobox_vitam .option_combobox_vitam label{
    font-size: 1.5rem;
}

.modalgenerarcodigoqr{
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #96969633;
    /* transition: all .5s; */
}

.modalgenerarcodigoqr .contenedor_flex{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    transition: all .5s;
}

.contenido-modal-generarcodigoqr{
    width: 80%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: white;
    border-radius: 5px;
    box-shadow: 1px 1px 5px rgba(200,200,200,1), -1px -1px 5px rgba(200,200,200,1);
    transition: all .5s;
}

.contenido-modal-generarcodigoqr.mostrar_qr{
    height: 70%;
    max-width: 60%;
    width: 120rem;
    flex-direction: row;
    transition: all 1s;
    position: relative;
}

.mostrar_qr .contenedor_img_modal_qr{
    width: 100%;
    display: flex;
    height: 80%;
}

.contenedor_titulo_modal_qr{
    display: none;
    height: 20%;
}

.contenedor_titulo_modal_qr label{
    display: flex;
    width: 100%;
    font-size: 2rem;
    font-weight: 700;
    justify-content: center;
}

.mostrar_qr .contenedor_titulo_modal_qr{
    width: 100%;
    display: flex;
    align-items: center;
    overflow: hidden;
    transition: all 1s;
}

.mostrar_qr.correcto .contenedor_titulo_modal_qr,
.mostrar_qr.error .contenedor_titulo_modal_qr{
    height: 0;
    opacity: 0;
}

.contenido-modal-generarcodigoqr.mostrar_link{
    height: 35%;
}

.contenido-modal-generarcodigoqr.mostrar_qr.correcto,
.contenido-modal-generarcodigoqr.mostrar_qr.error{
    height: 25rem;
    width: 30rem;
}

.contenido-modal-generarcodigoqr.mostrar_link.correcto,
.contenido-modal-generarcodigoqr.mostrar_link.error{
    height: 30%;
    width: 75%;
}

.conten-modal-generarcodigoqr{
    padding: 5rem 4rem;
    display: none;
    height: 100%;
    width: 100%;
    overflow: hidden;
    opacity: 1;
    transition: all 1s;
}

.mostrar_qr .conten-modal-generarcodigoqr{
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: all 1s;
}

.mostrar_qr .contenedor_link_verificar_celular{
    display: none;
}

.mostrar_link .contenedor_link_verificar_celular{
    width: 100%;
    height: 25%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.contenedor_link_verificar_celular label{
    font-size: 1.6rem;
    font-weight: 600;
}

.contenedor_link_verificar_celular label a{
    font-weight: 900;
    color: var(--azul_principal);
}

.contenido-modal-generarcodigoqr.correcto .conten-modal-generarcodigoqr,
.contenido-modal-generarcodigoqr.correcto .contenedor_link_verificar_celular,
.contenido-modal-generarcodigoqr.error .conten-modal-generarcodigoqr,
.contenido-modal-generarcodigoqr.error .contenedor_link_verificar_celular{
    width: 0%;
    height: 0%;
    padding: 0;
    opacity: 0;
}

.conten-superior-modal-generarcodigoqr{
    font-size: 1.4rem;
    margin-bottom: 1rem;
    /* width: 100%; */
    overflow: hidden;
}

.conten-superior-modal-generarcodigoqr h3{
    width: 180px;
}

.icono-close{
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 2rem;
}

.icono-close:hover{
    cursor: pointer;
}

.content-inferior-generarcodigoqr{
}

.conten-codigo-qr{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.conten-codigo-qr img{
    width: 180px;
    height: 180px;
    margin-bottom: 1rem;
    opacity: 1;
    transition: all 1s;
}

.contenido-modal-generarcodigoqr.correcto .conten-codigo-qr img,
.contenido-modal-generarcodigoqr.error .conten-codigo-qr img{
    width: 0;
    height: 0;
    opacity: 0;
}

.conten-codigo-qr p{
    width: 250px;
    text-align: center;
}

.conten-modal-estado{
    height: 100%;
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    /* animation: animateBg 10s linear infinite; */
}

.mostrar_qr.correcto .conten-modal-estado,
.mostrar_qr.error .conten-modal-estado{
    width: 100%;
}

.conten-modal-estado .imagen_logotipo{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: all 1s;
}

.contenido-modal-generarcodigoqr.correcto .conten-modal-estado .imagen_logotipo,
.contenido-modal-generarcodigoqr.error .conten-modal-estado .imagen_logotipo{
    width: 350px;
    height: 200px;
    opacity: 1;
}

.conten-modal-estado .imagen_logotipo .imagen_verificacion{
    width: 0px;
    height: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    opacity: 0;
    transition: all 1s;
    animation: animateLogotipo 2s linear infinite;
}

@keyframes animateLogotipo{
    0%{
        width: 25px;
        height: 25px;
        opacity: .1;
    }
    50%{
        width: 90px;
        height: 90px;
        opacity: .8;
    }
    100%{
        width: 25px;
        height: 25px;
        opacity: .1;
    }
}

.contenido-modal-generarcodigoqr.correcto .conten-modal-estado .imagen_logotipo .imagen_verificacion,
.contenido-modal-generarcodigoqr.error .conten-modal-estado .imagen_logotipo .imagen_verificacion{
    width: 150px;
    height: 100px;
    opacity: 1;
    animation: none;
}

.conten-modal-estado .imagen_logotipo img{
    height: 100%;
    transition: all 2s;
}

.contenido-modal-generarcodigoqr.error .conten-modal-estado .imagen_logotipo img{
    filter: grayscale(1);
}

.conten-modal-estado .imagen_logotipo .check_verificacion{
    width: 0px;
    height: 100px;
    font-size: 5rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    overflow: hidden;
    transition: all 1s;
    transition-delay: .7s;
}

.conten-modal-estado .imagen_logotipo .check_verificacion.correcto{
    color: green;
}

.conten-modal-estado .imagen_logotipo .check_verificacion.error{
    color: var(--rojo_principal);
}

.contenido-modal-generarcodigoqr.correcto .conten-modal-estado .imagen_logotipo .check_verificacion.correcto,
.contenido-modal-generarcodigoqr.error .conten-modal-estado .imagen_logotipo .check_verificacion.error{
    width: 50px;
}

/* @keyframes animateBg
{
    0%
    {
        filter: hue-rotate(0deg);
    }
    100%
    {
        filter: hue-rotate(360deg);
    }
} */

.conten-modal-estado .efecto_cargando{
    position: absolute;
    width: 100px;
    height: 100px;
}

.mostrar_qr .conten-modal-estado .efecto_cargando{
    width: 150px;
    height: 150px;
}

.conten-modal-estado .efecto_cargando span{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: rotate(calc(18deg * var(--i)));
}

.conten-modal-estado .efecto_cargando span::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 15px;
    height: 15px;
    border-radius: 50px;
    /* background-color: var(--azul_principal); */
    /* box-shadow: 0 0 20px var(--azul_principal),
                0 0 40px var(--azul_principal),
                0 0 60px var(--azul_principal),
                0 0 80px var(--azul_principal),
                0 0 100px var(--azul_principal); */
    animation: animate 2s linear infinite;
    animation-delay: calc(0.1s * var(--i));
    transition: all 1s;
    opacity: 1;
}

.mostrar_qr .conten-modal-estado .efecto_cargando span::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    /* background-color: var(--azul_principal); */
    /* box-shadow: 0 0 20px var(--azul_principal),
                0 0 40px var(--azul_principal),
                0 0 60px var(--azul_principal),
                0 0 80px var(--azul_principal),
                0 0 100px var(--azul_principal); */
    animation: animate 2s linear infinite;
    animation-delay: calc(0.1s * var(--i));
    transition: all 1s;
    opacity: 1;
}

.contenido-modal-generarcodigoqr.correcto .conten-modal-estado .efecto_cargando span::before,
.contenido-modal-generarcodigoqr.error .conten-modal-estado .efecto_cargando span::before{
    top: 50%;
    left: 50%;
    opacity: 0;
}

@keyframes animate{
    0%{
        transform: scale(1);
        background-color: var(--azul_principal);
    }
    80%,100%{
        transform: scale(0);
        background-color: var(--rojo_principal);
    }
}

.selectores_cambio_datos{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 1.4rem;
    padding-top: 1rem;
}

    .selectores_cambio_datos > label{
        display: flex;
        width: 50%;
        min-width: 250px;
        margin-bottom: .5rem;
        font-weight: 600;
    }

.selectores_tipo_bloqueo{
    width: 100%;
    display: flex;
    flex-direction: column;
    font-size: 1.6rem;
    padding: 0 12.5%;
    padding-top: 1rem;
}

    .selectores_tipo_bloqueo > label{
        display: flex;
        width: 50%;
        min-width: 250px;
        margin-bottom: 1rem;
        font-weight: 600;
        font-size: 1.7rem;
    }

.contenedor_input_radio{
    width: 50%;
    min-width: 250px;
    padding-left: 15px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: normal;
    margin-bottom: 5px;
}

.contenedor_input_radio input{
    height: 15px;
    width: 15px;
    margin: .5rem .5rem .5rem 0;
}

.contenedor_cambiar_datos{
    width: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
    background: rgba(0, 0, 0, .3);
    transition: all .5s;
}

.contenedor_registro_cliente_movil .contenedor_cambiar_datos{
    background: none;
} 

.contenedor_cambiar_datos .frmRegistroCliente{
    width: 75%;
}


.contenedor_tipo_cambio{
    display: flex;
    flex-direction: column;
}

.contenedor_validar_codigo{
    display: none;
    flex-direction: column;
    padding: 0 12.5%;
    padding-top: 1rem;
}

.contenedor_validar_codigo.mostrar{
    display: flex;
}

    .contenedor_validar_codigo > label{
        display: flex;
        width: 50%;
        min-width: 250px;
        margin-bottom: 1rem;
        font-weight: 600;
        font-size: 1.7rem;
    }

    .contenedor_validar_codigo input[type=number]::-webkit-outer-spin-button { 
        -webkit-appearance: none; 
        margin: 0; 
    }

    .contenedor_validar_codigo input[type=number]{
        -moz-appearance: textfield;
    }

.contenedor_cambiar_correo.mostrar,
.contenedor_cambiar_telefono.mostrar,
.contenedor_cambiar_datos_personales.mostrar,
.contenedor_formulario_contactanos.mostrar{
    padding-top: 3rem;
    height: auto;
}

.contenedor_cambiar_correo,
.contenedor_cambiar_telefono,
.contenedor_cambiar_datos_personales,
.contenedor_formulario_contactanos{
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    width: 100%;
    padding: 0;
    height: 0%;
}

.contenedor_registro_cliente_escritorio .contenedor_formulario_contactanos .boton a:visited{
    color: white;
}

.contenedor_registro_cliente_movil .contenedor_formulario_contactanos .boton a:visited{
    color: #2c2c2c;
}

.contenedor_tipo_cambio div.dato_actual{
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-left: .5rem;
}

.contenedor_confirmar_correo{
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.confirmar_correo_contenedor_mensaje{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: var(--azul_principal);
    color: white;
    padding: 5rem;
    width: 100%;
    height: 100%;
}

.confirmar_correo_mensaje_1{
    color: var(--rojo_principal);
    font-size: 3rem;
    font-weight: bold;
    text-shadow: 0px 1px 2px black;
}

.confirmar_correo_mensaje_2{
    font-size: 2rem;
}

.confirmar_correo_mensaje_3{
    font-size: 20rem;
    text-shadow: 0px 2px 2px black;
}

.parpadea {
    animation-name: parpadeo;
    animation-duration: 1.5s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;

    -webkit-animation-name: parpadeo;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
}

@-moz-keyframes parpadeo {
    0% {
        text-shadow: 0px 0px 5px var(--azul_principal);
    }

    50% {
        text-shadow: 0px 0px transparent;
    }

    100% {
        text-shadow: 0px 0px 5px var(--azul_principal);
    }
}

@-webkit-keyframes parpadeo {
    0% {
        text-shadow: 0px 0px 5px var(--azul_principal);
    }

    50% {
        text-shadow: 0px 0px transparent;
    }

    100% {
        text-shadow: 0px 0px 5px var(--azul_principal);
    }
}

@keyframes parpadeo {
    0% {
        text-shadow: 0px 0px 5px var(--azul_principal);
    }

    50% {
        text-shadow: 0px 0px transparent;
    }

    100% {
        text-shadow: 0px 0px 5px var(--azul_principal);
    }
}

/*MINI CARTOLA MOVIL*/
#contenedor_mini_cartola_movil{
    width: 100%;
    /* display: flex; */
    /* flex-direction: column; */
}

    #contenedor_mini_cartola_movil #frmMiniCartola{
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

/*==================*/

/*MINI CARTOLA  ESCRITORIO*/
#contenedor_mini_cartola_escritorio{
    width: 100%;
    display: flex;
    flex-direction: column;
}

    #contenedor_mini_cartola_escritorio .encabezado_minicartola{
        height: 8%;
        width: 100%;
        background-color: var(--azul_principal);
        display: flex;
        padding: 1rem 2rem;
        position: relative;
    }

        #img_cartola_escritorio{
            position: absolute;
            height: calc(100% - 2rem);
            z-index: 50;
            cursor: pointer;
        }

#resumen_financiero_escritorio{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 35%;
    height: 8rem;
    min-height: 65px;
    /* margin: auto; */
    padding: 0rem 2rem;
    font-size: 1.4rem;
    /* color: rgba(90,90,90,1); */
    position: absolute;
    right: 0;
    top: 2rem;
}

    #resumen_financiero_escritorio .resumen_superior{
        width: 100%;
        display: flex;
        justify-content: space-between;
    }

        #resumen_financiero_escritorio .resumen_utilizado{
            display: flex;
            flex-direction: column;
            text-align: start;
        }

        #resumen_financiero_escritorio .resumen_disponible{
            display: flex;
            flex-direction: column;
            text-align: end;
        }

            #resumen_financiero_escritorio .monto_resumen{
                font-size: 1.4rem;
                font-weight: 500;
                color: black;
            }

            #resumen_financiero_escritorio .resumen_superior .monto_resumen{
                margin-top: .5rem;
            }

    #resumen_financiero_escritorio .barra_cupo_utilizado{
        width: 100%;
        height: .5rem;
        background-color: rgba(59,82,151,.3);
        border-radius: 5px;
        margin: .5rem 0;
    }

        #resumen_financiero_escritorio #barra_porcentaje_escritorio{
            max-width: 100%;
            height: 100%;
            background-color: rgba(59,82,151,1);
            border-radius: 5px;
        }

    #resumen_financiero_escritorio .resumen_cupo_total{
        display: flex;
        justify-content: space-between;
    }

.cuerpo_minicartola{
    width: 100%;
    height: 92%;
    /* border: 1px solid blue; */
    padding: 2rem;
}

.minicartola_titulo{
    padding: 1rem 2rem;
    /* border: 1px solid orange; */
    height: 7rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

.minicartola_titulo #titulo_cartola_escritorio{
    font-size: 3rem;
    font-weight: 600;
}

.minicartola_cuerpo{
    height: calc(100% - 7rem);
}

.minicartola_detalle{
    height: 100%;
    position: relative;
}

.minicartola_detalle .contenedor_selectores{
    display: flex;
    position: absolute;
    top: 0;
}

.minicartola_detalle .selector_tipo_detalle{
    font-size: 1.2rem;
    /* border-bottom: 1px solid rgb(180 180 180); */
    width: 20rem;
    height: 4rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 2rem;
    border-radius: 5px 5px 0px 0px;
    background-color: rgba(220, 220, 220);
    /* background-color: rgba(150, 150, 150); */
    position: absolute;
    left: calc(21rem * var(--posicion));
    z-index: 0;
}

.minicartola_detalle .selector_tipo_detalle:hover:not(.selector_tipo_activo){
    cursor: pointer;
}

.minicartola_detalle .selector_tipo_activo{
    background-color: white;
    color: white;
    /* border: 1px solid rgba(180, 180, 180); */
    border-bottom: 1px solid rgb(47 66 121);
    background-color: var(--azul_principal);
    border-bottom: none;
    z-index: 2;
}

.minicartola_detalle .contenedor_detalle{
    z-index: 1;
    position: absolute;
    bottom: 1px;
    border: 1px solid rgba(180, 180, 180);
    width: 100%;
    height: calc(100% - 4rem);
    border-radius: 0px 5px 5px 5px;
    box-shadow: 0px 0px 2px 0px rgba(180, 180, 180);
    padding: 2.5rem;
    font-size: 1.4rem;
}

.contenedor_detalle .contenedor_segmento{
    width: 100%;
    height: 100%;
    display: none;
}

.contenedor_detalle .contenedor_segmento.segmento_activo{
    display: flex;
    flex-direction: column;
}

.minicartola_detalle .encabezado_detalle{
    height: 8rem;
    display: flex;
}

.minicartola_detalle .encabezado_detalle .segmento_encabezado{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    width: calc(100% / 3);
    height: 100%;
}

.minicartola_detalle .encabezado_detalle .segmento_encabezado.segmento_boton_pago{
    align-items: flex-start;
    justify-content: flex-start;
    padding-top: 1.6rem;
}

.minicartola_detalle .proxima_facturacion{
    max-width: 30rem;
    display: flex;
    justify-content: space-between;
    padding: 1rem 0rem;
}

.minicartola_detalle .proximo_vencimiento{
    max-width: 30rem;
    display: flex;
    justify-content: space-between;
    padding: 1rem 0rem;
}

.minicartola_detalle .encabezado_detalle label.fecha{
    font-weight: 600;
}

.minicartola_detalle .contenedor_cuerpo_detalle{
    /* border: 1px solid blue; */
    margin-top: 4rem;
    height: calc(100% - 12rem);
    padding: .1rem;
    display: flex;
    flex-direction: column;
    /* align-items: end; */
    width: 100%;
}

.contenedor_cuerpo_detalle .contenedor_selector_facturacion{
    width: 100%;
    height: 4rem;
    margin-bottom: .5rem;
}

.contenedor_cuerpo_detalle .contenedor_selector_facturacion .contenedor_input{
    width: 30rem;
    height: 100%;
}

.contenedor_cuerpo_detalle .contenedor_selector_facturacion .contenedor_input select{
    height: 100%;
}

.minicartola_detalle .contenedor_tabla{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100% - 8rem);
    position: relative;
    /* border-bottom: 1px solid  rgba(180,180,180); */
}

    .minicartola_detalle .contenedor_tabla .tabla_detalle_minicartola{

    }

    .minicartola_detalle .contenedor_tabla .tabla_encabezado{
        height: 3.7rem;
    }

        .minicartola_detalle .contenedor_tabla .tabla_fila{
            display: flex;
            /* border: 1px solid red; */
            border: 1px solid  rgba(180,180,180);
            /* border-bottom: none; */
            border-top: none;
            justify-content: space-between;
            padding: 1.2rem 1rem;
        }

        .minicartola_detalle .contenedor_tabla .fila_encabezado{
            padding: .8rem 1rem;
            /* background-color: rgba(50,50,50); */
            background-color: var(--azul_principal);
            /* border: 1px solid rgba(50,50,50); */
            border: 1px solid var(--azul_principal);
        }

            .minicartola_detalle .contenedor_tabla .celda_encabezado{
                color: white;
            }

    .minicartola_detalle .tabla_cuerpo{
        max-height: calc(100% - 3.7rem);
        overflow: scroll;
    }

    .minicartola_detalle .tabla_cuerpo.cuerpo_activo{
        display: flex;
        flex-direction: column;
    }

        .minicartola_detalle .contenedor_tabla .fila_cuerpo{

        }

        .minicartola_detalle .contenedor_tabla .fila_cuerpo:nth-child(even){
            background-color: rgba(26, 43, 71, 0.1);
        }

        .minicartola_detalle .contenedor_tabla .tabla_celda{
            /* border: 1px solid red; */
            display: flex;
            justify-content: center;
            width: calc((100% / var(--columnas_tabla)) + var(--alt_ancho));
        }

        .minicartola_detalle .contenedor_tabla .celda_cuerpo{
            font-weight: 600;
        }

        .minicartola_detalle .contenedor_tabla .celda_monto{
            justify-content: right;
            padding-right: 2rem;
        }

        .minicartola_detalle .contenedor_tabla .celda_monto.monto_pagar{
            color: var(--main-color);
            text-shadow: 0px 0px 0px var(--main-color);
        }

        .minicartola_detalle .contenedor_tabla .tabla_celda.alinear_izq{
            justify-content: left;
        }

        .minicartola_detalle .contenedor_tabla .tabla_celda.alinear_der{
            justify-content: right;
        }

    #flecha_slide_movimientos{
        position: absolute;
        bottom: 0px;
        width: 10%;
        height: 2.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
        border-top-left-radius: 5rem;
        border-top-right-radius: 5rem;
        left: 45%;
        cursor: pointer;
        opacity: .5;
        transition: background-color .5s, opacity .5s;
        /* background-image: linear-gradient(transparent 10%,var(--azul_principal)); */
    }

    #flecha_slide_facturado{
        position: absolute;
        bottom: 0px;
        width: 10%;
        height: 2.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
        border-top-left-radius: 5rem;
        border-top-right-radius: 5rem;
        left: 45%;
        cursor: pointer;
        opacity: 0;
        transition: background-color .5s, opacity .5s;
        /* background-image: linear-gradient(transparent 10%,var(--azul_principal)); */
    }

        #icono_bajar_cartola{
            /* color: white; */
            padding-bottom: .3rem;
            font-size: 2.5rem;
            transition: color .5s;
        }

    .contenedor_tabla:hover #flecha_slide_movimientos{
        background-color: var(--azul_principal);
    }

    .contenedor_tabla:hover #flecha_slide_facturado{
        background-color: var(--azul_principal);
    }

        .contenedor_tabla:hover #icono_bajar_cartola{
            color: white;
        }


#encabezado_vencimientos{
    width: 100%;
    padding: 3rem 10rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

    #encabezado_vencimientos label{

    }

    #titulo_vencimientos{
        font-size: 2.2rem;
    }

#cuerpo_vencimientos{
    width: 100%;
    display: flex;
    justify-content: center;
    height: 68%;
    padding: 1rem 0;
}

    #contenedor_grafico_vencimientos{
        width: 45%;
        height: 100%;
    }

        #grafico_vencimientos{
            display: flex;
            width: 100%;
            height: 100%;
        }

            #montos_vencimiento{
                width: 8rem;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                align-items: end;
                padding-right: 1rem;
            }

                #montos_vencimiento label{
                    font-size: 1.2rem;
                }

            #contenedor_barrar_vencimiento{
                width: calc(100% - 8rem);
                display: flex;
                align-items: end;
                border: 1px solid #dcdcdc;
                gap: 2rem;
                padding: 0 1rem;
                overflow: hidden;
            }

                #contenedor_barrar_vencimiento .barra{
                    width: calc(100% / 5);
                    display: flex;
                    justify-content: center;
                    position: relative;
                    background-color: var(--azul_principal);
                    box-shadow: 0px 2px 4px black;
                    height: 0px;
                    transition: height .5s;
                }

                    #contenedor_barrar_vencimiento .barra label{
                        position: absolute;
                        bottom: 100%;
                        font-size: 1.2rem;
                        margin-bottom: .5rem;
                    }

        #contenedor_fechas_vencimiento{
            width: 100%;
            padding-left: 9rem;
            padding-right: calc(1rem + 1px);
            display: flex;
            gap: 2rem;
        }

            #contenedor_fechas_vencimiento label{
                display: flex;
                width: calc(100% / 5);
                justify-content: center;
            }



/* ============================================================ */


#tabla_facturado_minicartola{

}

    #cuerpo_tabla_facturado_escritorio{

    }

        .celda_fecha_facturacion{
            width: calc( ( 100% / 7 ) + 2rem);
            display: flex;
            justify-content: left;
            font-weight: 600;
        }

        .celda_descripcion_facturacion{
            width: calc( ( 100% / 7 ) + 5rem);
            display: flex;
            justify-content: left;
            font-weight: 600;
        }

        .celda_personal_facturacion{
            width: calc( ( 100% / 7 ) - 2.4rem);
            display: flex;
            justify-content: left;
            font-weight: 600;
        }

        .celda_total_facturacion{
            width: calc( ( 100% / 7 ) - 2.4rem);
            display: flex;
            justify-content: right;
            font-weight: 600;
        }

        .celda_total_facturacion.celda_total_pago_facturacion{
            color: green;
            text-shadow: 0px 0px 0px var(--rojo_principal);
        }

        .celda_total_facturacion.celda_total_saldo_facturacion{
            color: var(--rojo_principal);
            text-shadow: 0px 0px 0px var(--rojo_principal);
        }

        .celda_monto_facturacion{
            width: calc( ( 100% / 7 ) - 2.4rem);
            display: flex;
            justify-content: right;
            font-weight: 600;
            color: var(--main-color);
            text-shadow: 0px 0px 0px var(--main-color);
        }

        .celda_cuotas_facturacion{
            width: calc( ( 100% / 7 ) - 2.4rem);
            display: flex;
            justify-content: center;
            font-weight: 600;
        }

        .celda_cuota_facturacion{
            width: calc( ( 100% / 7 ) - 2.4rem);
            display: flex;
            justify-content: center;
            font-weight: 600;
        }


/* =========================================================== */


.modal{
    display: none;
    width: 100%;
    height: 100vh;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;
}

.modal.modal_terminos_condiciones{

}

.modal_terminos_condiciones .contenedor_modal{
    width: 100%;
    height: 100%;
}

.modal_terminos_condiciones .encabezado_modal{
    width: 100%;
    height: 3rem;
    background: #3b5299;
    color: white;
    display: flex;
    align-items: center;
    justify-content: end;
}

.modal_terminos_condiciones .icono_cerrar{
    position: static;
    margin-right: 1rem;
}

.modal_terminos_condiciones .cuerpo_modal{
    height: calc(100% - 7rem);
    background: white;
    padding: 1rem;
    overflow: scroll;
}

.modal_terminos_condiciones .pie_modal{
    height: 4rem;
    background: white;
    display: flex;
}

.modal_terminos_condiciones .contenedor_botones{
    flex-direction: row;
    width: 100%;
    justify-content: center;
}

.modal_terminos_condiciones .btn{
    display: flex;
    /* border: 1px solid black; */
    /* background: red; */
    margin: 0 3rem;
    justify-content: center;
    width: 8rem;
    padding: 2px 0;
    font-weight: 500;
    font-size: 1.2rem;
}

.modal_terminos_condiciones .btn_guardar{
    background: #3b5299;
    color: white;
}

.modal_terminos_condiciones .btn_cancelar{
    background: lightgray;
}