@font-face {
    font-family: 'Lexend';
    src: url('fuentes/Lexend/Lexend-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Lexend-Bold';
    src: url('fuentes/Lexend/Lexend-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Lexend-ExtraBold';
    src: url('fuentes/Lexend/Lexend-ExtraBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Lexend-ExtraLight';
    src: url('fuentes/Lexend/Lexend-ExtraLight.ttf') format('truetype');
}

@font-face {
    font-family: 'Lexend-Light';
    src: url('fuentes/Lexend/Lexend-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Lexend-Medium';
    src: url('fuentes/Lexend/Lexend-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Lexend-Regular';
    src: url('fuentes/Lexend/Lexend-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Lexend-SemiBold';
    src: url('fuentes/Lexend/Lexend-SemiBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Lexend-Thin';
    src: url('fuentes/Lexend/Lexend-Thin.ttf') format('truetype');
}


:root {
    --dn-bg-white: #ffffff;
    --dn-bg-gray: #dce2e8;
    --dn-bg-gray01: #f6f7f9;
    --dn-bg-gray02: #F0F2F6;
    --dn-gb-gray03: #BEC8D2;
    --dn-bg-gray04: #4B5661;
    --dn-bg-gray05: #FAFAFA;
    --dn-bg-blue01: #39B7D9;
    --dn-bg-blue02: #3366cc;
    --dn-bg-blue03: #384149;
    --dn-bg-green01: #41d78c;
    --dn-bg-red: #ff0000;
    --dn-mg-formato: 'Formato no valido';
}


.fuenteTitulos{
	font-family: Lexend-Medium !important;
	font-weight: normal !important;
}

.lblFormulario{
	font-family: Lexend-ExtraLight !important;
	font-weight: normal !important;
	font-size: 14px !important;
}

.boton span:first-child{
    font-family: Lexend-Medium !important;
	font-weight: normal !important;
	font-size: 19px !important;
}

.fuenteInputFormulario{	
	font-family: Lexend-Regular !important;
	font-size: 16px !important;
}

.ddlCombo{
    border-radius: 30px;
    height: 40px;
	border: 2px solid !important;
	padding: 5px !important;
	font-family: Lexend-Regular !important;
	font-size: 16px !important;	
}

.ddlCombo>option{
	font-family: Lexend-Regular !important;
	font-size: 16px !important;	
}

.textoPolitica>div>span{
	font-family: Lexend-Regular !important;
	font-size: 16px !important;	
}

.fuenteLabelCitaNormal{
	font-family: Lexend-Regular !important;
	font-size: 14px !important;	
}

.fuenteLabelCitaNegrilla{
	font-family: Lexend-Bold !important;
	font-size: 14px !important;	
}

/*Estilo para ocultar el contenido en pantalla*/
.contenidoOculto {
    display: none !important;
}

/*Estilo para los campos con el contenido vacio*/
.campo-invalido,
.campo-formato-invalido {
    border: 1px solid var(--dn-bg-red) !important;
}

.campo-formato-invalido {
    margin-bottom: 10px !important;
}

/*Estilo para los campos que no cumplen con el formato*/
.campo-formato-invalido::after {
    position: absolute;
    content: var(--dn-mg-formato);
    color: var(--dn-bg-red);
    font-size: 14px;
    font-weight: 400;
    left: 10px;
    bottom: -20px;
}

/*Estilo para el campo número documento cuando no cumple longitud*/
.campo-longitud-invalida {
    color: #e76565;
	max-width: 300px !important;
}

.header .heaer-content-logo {
    background-color: var(--dn-bg-white);
    padding: 10px 0;
    height: 48px;
}

.header .contenido-header {
    height: 46px;
}

/*Footer*/
.footer {
    padding: 40px 0;
}

.footer .footer-direccion {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.footer>div {
    gap: 30px;
}

.footer-direccion .footer-info-direccion,
.footer .footer-contacto {
    width: 381px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.footer .social-icon {
    display: flex;
    align-items: center;
    gap: 16px;
}

.footer-logos {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
}

.footer .separador-horizontal {
    height: 242px;
    width: 1px;
    background-color: var(--dn-bg-white);
    border: none;
}

.footer .separador-vertical {
    width: 100%;
    height: 1px;
    background-color: var(--dn-bg-white);
    border: none;
}

.footer .contener-info-footer {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.contenido-pantalla {
    min-height: 77vh;
}

.contenedor-botones-inicio {
    gap: 16px;
}

.content-btnInicio {
    width: 193px;
    height: auto;
}

.content-btnInicio br {
    display: none;
}

.content-btnInicio span br {
    display: block;
}

.content-btnInicio span:first-child {
    font-weight: 700 !important;
}

.content-btnInicio span:last-child {
    font-weight: 400 !important;
}

#contenedor-pantalla {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 100vh;
    scrollbar-color: #40E0D0 var(--dn-bg-gray);
    scrollbar-width: thin;
}

.contenido-Pantalla {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
}

.tamanio-maximo-contenido {
    transition: width .2s ease-in;
}

.espaciado-horizontal {
    padding: 0 112px;
}

.content-progress {
    display: flex;
    justify-content: center;
}

.progress,
.progress-bar {
    border-radius: 25px;
    transition: width .5s ease-in;
}

.progress-bar {
    background-color: var(--dn-bg-green01);
}

.espaciado-horizontal .contenido-paso {
    background-color: var(--dn-bg-gray01);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    gap: 30px;
    width: fit-content;
    margin: 0 auto;
    transition: padding .5s ease-in;
}

.txtTituloPaso {
    font-weight: 600 !important;
    letter-spacing: -0.45px !important;
}

.txtInformacionPaso {
    font-weight: 500 !important;
    letter-spacing: -0.45px !important;
}

.separador-contenido {
    pad: 12px 0;
    height: 1px;
    background-color: var(--dn-bg-gray);
}

.contenido-form {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.customSelect {
    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMCAyMSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zLjQxMDA1IDYuOTgyMzJDMy45NTY3OCA2LjQzNTU4IDQuODQzMjIgNi40MzU1OCA1LjM4OTk1IDYuOTgyMzJMMTAgMTEuNTkyNEwxNC42MTAxIDYuOTgyMzJDMTUuMTU2OCA2LjQzNTU4IDE2LjA0MzIgNi40MzU1OCAxNi41ODk5IDYuOTgyMzJDMTcuMTM2NyA3LjUyOTA1IDE3LjEzNjcgOC40MTU0OCAxNi41ODk5IDguOTYyMjJMMTAuOTg5OSAxNC41NjIyQzEwLjQ0MzIgMTUuMTA4OSA5LjU1Njc4IDE1LjEwODkgOS4wMTAwNSAxNC41NjIyTDMuNDEwMDUgOC45NjIyMkMyLjg2MzMyIDguNDE1NDggMi44NjMzMiA3LjUyOTA1IDMuNDEwMDUgNi45ODIzMloiIGZpbGw9IiM0MUQ3OEMiLz4KPC9zdmc+');
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 20px;
}

.contentImgCategoria {
    width: 40px;
    height: 40px;
    margin: 0 auto;
}

.filterSVG {
    filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(8deg) brightness(94%) contrast(104%) !important;
    transition: filter 0.5s ease-in-out !important;
}

.btnSiguientePagina,
.btnSiguientePaginaBlock,
.btnAnteriorPagina,
.btnModalIcon {
    gap: 8px
}

.btnSiguientePagina span,
.btnSiguientePaginaBlock span,
.btnAnteriorPagina span,
.btnEditarPaso span,
.btnPasoCuatro span,
.btnModalIcon span,
.btnModal span,
.file-selector span {
    font-weight: 700 !important;
}

.contentImgBtnSiguiente,
.contentImgBtnAnterior,
.contentImgDescarga,
.content-imgbotonmodal {
    display: flex;
}

.btnSiguientePagina .contentImgBtnSiguiente img,
.btnSiguientePaginaBlock .contentImgBtnSiguiente img,
.btnAnteriorPagina .contentImgBtnAnterior img,
.btnCargarDocumento .contentImgDescarga img,
.btnModalIcon .content-imgbotonmodal img {
    width: 20px;
    height: 20px;
}

.contenido-botones {
    display: flex;
    gap: 30px;
}

.customSelect:focus {
    border-color: var(--dn-bg-green01);
}

.contenido-fecha {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.btnFecha:active {
    transform: none !important;
}

.btnFecha {
    min-height: 40px;
}

.contentImgFecha {
    display: flex;
    align-items: center;
    cursor: pointer !important;
}

.contentImgFecha img {
    width: 20px;
    height: 20px;
}

/*Estilo Calendario*/
.calendario .k-header {
    display: flex;
    flex-direction: row;
    font-family: 'Lexend-Bold';
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    color: var(--dn-bg-blue03);
    margin-bottom: 0.5rem;
    background-color: #FFFFFF;
    border-bottom: 1px solid var(--dn-bg-gray02);

}

.calendario .k-header .k-state-hover {
    background-color: var(--dn-bg-white) !important;
    color: var(--dn-bg-blue03);
}

.calendario .k-calendar th {
    background-color: var(--dn-bg-white);
    font-size: 14px;
    line-height: 20px;
    color: var(--dn-bg-blue03);
    border: none !important
}

.calendario .k-header>a {
    position: static !important;
    display: flex !important;
    align-items: center;
}

.calendario .k-header>a:nth-child(2) {
    cursor: default !important;
}

.calendario .k-header>a:first-child {
    order: 2;
    justify-content: center;
}

.calendario .k-header>a:last-child {
    order: 3;
    justify-content: center;
}

.calendario .k-calendar-view {
    font-family: 'Ubuntu';
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
}

.calendario .k-calendar-view .k-today>a {
    background-color: transparent !important;
    box-shadow: none !important;
}

.calendario .k-calendar-view .k-state-selected>a {
    background-image: none !important;
    border-radius: 50% !important;
    border: none !important;
    background-color: var(--dn-bg-green01) !important;
}

.calendario .k-calendar-view .k-state-focused>a {
    box-shadow: none !important;
}

.calendario .k-footer {
    display: none !important;
}

.calendario {
    font-family: Ubuntu;
    height: 0 !important;
    overflow: hidden;
    padding: 0px !important;
    border: 1px solid var(--dn-bg-gray02);
    border-radius: 8px;
    background-color: var(--dn-bg-white) !important;
    transition: height .5s ease-out, margin 1s ease;
    interpolate-size: allow-keywords;
}

.calendario.calendario-open {
    height: auto !important;
    padding: 20px !important;
    margin-top: 8px !important;
}

.cajaPlaceholder::placeholder {
    color: var(--dn-gb-gray03) !important;
    font-weight: 400 !important;
}

div[class="k-header"]>a[aria-live="assertive"] {
    color: #093042 !important;
    font-weight: bold;
}

th[scope="col"] {
    color: #093042 !important;
    font-weight: bold;
}

tr[role="row"] > td > a
{
	color: #093042 !important;
}

td[class="k-state-disabled k-weekend"]>a[class="k-link"]
{
	background-color: transparent !important;
    color: var(--bs-gray-500) !important;
}
td[class="k-other-month k-state-disabled k-weekend"]>a[class="k-link"]
{
	background-color: transparent !important;
    color: var(--bs-gray-500) !important;
}
td[class="k-other-month k-state-disabled"]>a[class="k-link"]
{
	background-color: transparent !important;
    color: var(--bs-gray-500) !important;
}
td[class="k-state-disabled"]>a[class="k-link"]
{
	background-color: transparent !important;
    color: var(--bs-gray-500) !important;	
}
td[class="k-weekend"]>a[class="k-link"]
{
	background-color: transparent !important;
    color: #093042 !important;	
}

.cajaPlaceholder:hover::placeholder {
    color: var(--dn-bg-gray04) !important;
}

.contenido-pregdatos {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/*Radio button*/
.customRadioButton {
    display: flex;
    gap: 33px;
}

.customRadioButton label {
    display: flex;
    gap: 8px;
    cursor: pointer;
}

.customRadioButton input[type="radio"] {
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    /* Remove most all native input styles */
    appearance: none;
    /* For iOS < 15 */
    background-color: var(--form-background);
    /* Not removed via appearance */
    margin: 0;

    font: inherit;
    color: currentColor;
    width: 1em;
    height: 1em;
    border: 0.15em solid var(--dn-bg-green01);
    border-radius: 50%;

    align-self: center;
    display: grid;
    place-content: center;
    cursor: pointer;
}

.customRadioButton input[type="radio"]::before {
    content: "";
    width: 0.5em;
    height: 0.5em;
    border-radius: 50%;
    transform: scale(0);
    transition: 120ms transform ease-in-out;
    box-shadow: inset 1em 1em var(--dn-bg-green01);
}

.customRadioButton input[type="radio"]:checked::before,
.customRadioButton input[type="radio"]:hover::before {
    transform: scale(.95);
}

/*Terminos y condiciones*/
.checkBoxTerminos>label {
    display: flex;
    gap: 4px;
    cursor: pointer;
}

.checkBoxTerminos span {
    font-weight: 400 !important;
}

.checkBoxTerminos span a {
    font-weight: 700 !important;
    color: inherit;
}

.checkBoxTerminos input[type="checkBox"] {
    /* Add if not using autoprefixer */
    -webkit-appearance: none;
    /* Remove most all native input styles */
    appearance: none;
    /* For iOS < 15 */
    background-color: var(--form-background);
    /* Not removed via appearance */
    margin: 0;

    font: inherit;
    color: var(--dn-bg-white);
    width: 1.15em;
    height: 1.15em;
    border: 0.15em solid var(--dn-bg-green01);
    border-radius: 0.3em;

    align-self: center;
    display: grid;
    place-content: center;
    cursor: pointer;
}

.checkBoxTerminos input[type="checkbox"]::before {
    content: "";
    width: 0.65em;
    height: 0.65em;

    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
    transform: scale(0);
    transform-origin: bottom left;
    transition: 120ms transform ease-in-out;

    box-shadow: inset 1em 1em var(--dn-bg-green01);
}

.checkBoxTerminos input[type="checkbox"]:checked::before {
    transform: scale(1);
}


/*Modales*/
div[rol="pantalla"][nombre="ModalArchivosAsociados"] {
    transition: none;
}

.pantalla-modal {
    z-index: 9000;
}

.contenedor-modal {
    border-radius: 47px;
    position: relative;
    display: flex;
    justify-content: center;
    background-color: var(--dn-bg-white);
    transition: all .5s ease-in;
}

.pantalla-modal-oscuro {
    background-color: rgb(0 0 0 / 85%) !important;
}

.contenedor-modal .contenido-modal {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.contenido-modal .info-modal {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.btnCerrarModal {
    position: absolute;
    top: 0;
    right: 0;
}

.texto-modal {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.tamanio-modal {
    margin: 0 auto;
}

.tamanio-modal-politica {
    margin: 0 auto;
}

.btnModalIcon,
.btnModal {
    width: 261px !important;
}

.drop-section {
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    background-color: var(--dn-bg-gray05);
    border: 1.5px dashed var(--dn-gb-gray03);
}

.botonBienvenido {
    width: 220px !important;
    height: 42px !important;
}

.textoBienvenida {
    font-family: 'Lexend-Medium' !important;
}

.campoBloqueado{
	background-color: #f2f5f6 !important;
}

.formularioLogin{
	border-radius: 30px;
}

.campo-requerido{
	font-family: Arial !important;
	color: #e76565;
	font-size: 15px !important;
}

.contenedorListaBotones
{
	max-height: 450px; 
	min-height: 450px;
}


@media (max-width:429px) {
    .header .contenido-header {
        margin: 20px 0px 0px 10px;
    }

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

    .imgBienvenido {
        padding-top: 5%;
        display: none;
    }

    .imgNavegacion {
        display: none;
    }

    .contenido-inicio {
        padding: 0px 10px 0px 10px
    }

    .btnRegresar {
        width: 150px !important;
        height: 42px !important;
    }

    .btnContinuar {
        width: 150px !important;
        height: 42px !important;
    }
	
	.tamanio-modal {
        max-width: 350px;
    }
	
	.tamanio-modal-politica
	{
        max-width: 350px;		
	}

    .footer-direccion .footer-info-direccion,
    .footer .footer-contacto {
        width: 320px;
    }

    .btnInicio {
        width: 355px !important;
        height: 165px !important;
    }

    .espaciado-horizontal {
        padding: 0 10px;
    }

    .espaciado-horizontal .contenido-paso {
        padding: 35px 20px;
    }

    .progress {
        width: 350px;
        height: 12px;
    }

    .checkBoxTerminos span {
        font-size: 14px !important;
        line-height: 23px !important;
    }

    .contenido-Pantalla {
        gap: 25px;
    }

    .contenedor-modal {
        padding: 15px;
        top: 50%;
        transform: translateY(-85%);
    }

    div[rol="control"][nombrecontrol="btnGuardarArchivos"] {
        padding-bottom: 15px;
    }

    .modal-small {
        top: 40%;
        transform: translateY(-70%);
    }
    
    .modal-error {
        top: 60%;
        transform: translateY(-80%);
    }

    .file-name {
        max-width: 215px;
    }

    .drop-section {
        gap: 20px;
        padding: 10px;
    }

    .contenedor-botones-modal {
        gap: 10px;
    }
	
    .listaRegionales{
       margin-right:  0px !important;
    }
}

@media (min-width:430px) {
    .header .contenido-header {
        margin: 20px 0px 0px 50px;
    }
    .listaRegionales{
        margin-right: 0px;
    }
    .orientacion {
        display: flex;
        flex-direction: column;
    }

    .imgBienvenido {
        display: none;
    }

    .imgNavegacion {
        display: none;
    }

    .contenido-inicio {
        padding: 0px 20px 0px 20px;
    }

    .btnRegresar {
        width: 160px !important;
        height: 42px !important;
    }

    .btnContinuar {
        width: 160px !important;
        height: 42px !important;
    }

    .btnInicio {
        width: 375px !important;
        height: 175px !important;
    }

    .espaciado-horizontal {
        padding: 0 15px;
    }

    .espaciado-horizontal .contenido-paso {
        padding: 40px 25px;
    }

    .progress {
        width: 400px;
        height: 16px;
    }

    .checkBoxTerminos span {
        font-size: 15px !important;
        line-height: 24px !important;
    }

    .contenido-Pantalla {
        gap: 30px;
    }

    .contenedor-modal {
        padding: 24px;
        top: 55%;
        transform: translateY(-70%);
    }

    .modal-small {
        top: 40%;
        transform: translateY(-70%);
    }

    .drop-section {
        gap: 16px;
        padding: 20px;
    }

    .contenedor-botones-modal {
        gap: 10px;
    }
}

@media (min-width: 576px) {
    .orientacion {
        display: flex;
        flex-direction: column;
    }
    .listaRegionales{
        margin-right: 0px;
    }
    .imgBienvenido {
        display: none;
    }

    .imgNavegacion {
        display: none;
    }

    .contenido-inicio {
        padding: 30px 31px 30px 40px;
    }
	
	.tamanio-modal {
        max-width: 350px;
    }
	
	.tamanio-modal-politica
	{
        max-width: 350px;		
	}

    .espaciado-horizontal {
        padding: 0 40px;
    }

    .espaciado-horizontal .contenido-paso {
        padding: 50px 30px;
    }
	
    .progress {
        width: 525px;
        height: 16px;
    }

    .checkBoxTerminos span {
        font-size: 16px !important;
        line-height: 25px !important;
    }

    .contenedor-modal {
        top: 45%;
        transform: translateY(-70%);
    }

    .file-name {
        max-width: 255px;
    }

    .modal-small {
        top: 40%;
        transform: translateY(-70%);
    }

    .contenedor-botones-modal {
        gap: 15px;
    }
}

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    .header .contenido-header {
        margin: 90px 0px 0px 50px;
    }
    .listaRegionales{
        margin-right: 0px;
    }

    .orientacion {
        display: flex;
        flex-direction: row;
    }

    .imgBienvenido {
        display: flex;
        justify-content: flex-start;
    }

    .imgNavegacion {
        display: none;
    }

    .contenido-inicio {
        padding: 30px 31px 30px 90px;
        gap: 20px;
    }

    .btnRegresar {
        width: 178px !important;
        height: 42px !important;
    }

    .btnContinuar {
        width: 178px !important;
        height: 42px !important;
    }

    .espaciado-horizontal {
        padding: 0 90px;
    }

    .content-progress {
        padding: 0 85px;
    }

    .espaciado-horizontal .contenido-paso {
        padding: 50px;
    }
	
    .progress {
        width: 592px;
        height: 16px;
    }
	
    .tamanio-modal {
        max-width: 400px;
    }	
	
	.tamanio-modal-politica
	{
        max-width: 550px;		
	}
	
    .contenedor-botones-modal {
        gap: 30px;
    }
}

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    .imgNavegacion {
        display: flex;
        justify-content: flex-start;
    }

    .listaRegionales{
        margin-right: 0px;
    }

    .header .contenido-header {
        margin: 90px 0px 0px 250px;
    }

    .footer-direccion .footer-info-direccion,
    .footer .footer-contacto {
        width: 275px;
    }

    .footer .separador-horizontal {
        height: 290px;
    }

    .contenido-inicio {
        padding: 0px 100px 0px 200px;
        gap: 20px;
    }

    .espaciado-horizontal {
        padding: 0 112px;
    }

    .content-progress {
        padding: none;
    }
}

/* X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .header .contenido-header {
        margin: 90px 0px 0px 280px;
    }

    .contenido-inicio {
        padding: 0px 100px 0px 350px;
        gap: 20px;
    }

    .footer-direccion .footer-info-direccion,
    .footer .footer-contacto {
        width: 381px;
    }

    .footer .separador-horizontal {
        height: 242px;
    }
}

/* XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
    .header .contenido-header {
        margin: 90px 0px 0px 300px;
    }
}

.ddlCombo.w-100.fw-bold {
    border-color: snow;
}