﻿:root {
    --primary: #FF6600;
    --bs-primary-rgb: #FF6600;
    --secundary: #FF8C40;
    --tertiary: #72207E;
    --hover-backcolor: #DCC7DF;
    --Black-300: rgba(64, 64, 64, 1);
}

body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 140%;
    color: var(--Black-300, #404040);
}

h1,
h2,
h3 {
    font-weight: 600;
}

.text-primary {
    color: var(--primary) !important;
}

.text-secundary {
    color: var(--secundary) !important;
}

h4 {
    font-weight: 500;
    color: #000000;
}

a {
    color: #f60;
    text-decoration: none;
}

    a:hover {
        color: #F60 !important;
    }

#btnText, #loadingCarta {
    display: inline-block;
    vertical-align: middle;
}

.btn-default {
    border-radius: 24px;
    border: 1px solid var(--primary);
    text-align: center;
    background-color: var(--primary);
    color: white;
    height: 40px;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

    .btn-default:hover {
        border-radius: 24px;
        border: 1px solid var(--primary);
        color: var(--primary);
        background-color: white !important
    }

    .btn-default.disabled {
        border-radius: 32px 0px 0px 32px;
        background: #EFEFEF;
        cursor: not-allowed;
        border: none;
    }

    .btn-default.switch {
        font-size: 20px;
        font-style: normal;
        font-weight: 400;
        line-height: 100%;
        height: 64px;
        border-radius: 32px;
        min-width:160px
    }

.btn.blanco {
    background-color: #EFEFEF !important;
    color: var(--primary);
}

.btn.btn-link {
    color: #f60;
    background-color: transparent;
    border-color: transparent;
}

.btn-group-custom {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(36px, 1fr));
    gap: 9%;
    justify-content: start;
    align-items: start;
}

.btn-card-cuadro {
    /*flex-basis: calc(20% - 10px); /* Ancho base para 5 botones por fila con espaciado de 10px */
    width: 36px;
    height: 33px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 5px;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.20);
    border: 1px solid transparent;
    transition: transform 0.2s, border-color 0.2s;
    color: var(--primary);
    font-size: 15px;
    font-weight: 300 !important;
    text-align: center;
    padding: 5px 8px;
    line-height: 170%
}

.btn-card-cuadro-last {
    margin-right: 0;
}


.btn-activo {
    background-color: var(--primary);
    color: white;
}

.btn-card-cuadro:hover {
    transform: translateY(-2px);
    /* efecto boton */
    border-color: var(--primary);
    background-color: var(--primary) !important;
    color: white !important;
}

.btn-card-cuadro:not(.btn-activo) {
    background-color: white;
    color: black;
    font-weight: 300;
}

.btn-volver {
    text-decoration: none;
    font-size: 24px;
    font-weight: 500;
}


.form-select, .form-control {
    border-radius: 10px;
    border: 1px solid #BFBFBF;
}

/* Chosen DropDownList */

.chosen-container.chosen-container-single {
    width: 100% !important;
}

select.form-control + .chosen-container.chosen-container-single .chosen-single {
    height: 38px !important;
}

    select.form-control + .chosen-container.chosen-container-single .chosen-single.bold {
        height: 46px !important;
        font-size: 20px !important;
        font-style: normal !important;
        font-weight: 500 !important;
        line-height: normal !important;
    }

.chosen-container-single .chosen-single div b {
    background: none;
}

    .chosen-container-single .chosen-single div b::after {
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 6 Free";
        font-size: 15px;
        font-weight: 700 !important;
        content: "\f107";
        color: #686c71;
    }

select.form-control + .chosen-container.chosen-container-single .chosen-single div {
    top: 8px !important;
    right: 5px !important;
}

.info-20 + .chosen-container.chosen-container-single .chosen-single {
    font-size: 20px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: normal !important;
}

.linea-vertical {
    width: 3px;
    height: 147px;
    background-color: #72207E;
    margin: auto;
}

.linea-horizontal {
    border-top: 2px solid #72207E;
    display: none;
}

/* Card de Solicitudes */

.card-solicitud-content {
    padding: 40px 35px;
    border-radius: 16px;
    /*border: 1px solid #FF8C40;*/
    box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.10);
}

    .card-solicitud-content .producto-titulo {
        color: #FF8C40;
        font-weight: 600;
        font-size: 24px;
    }

    .card-solicitud-content .producto-atributos-titulo {
        color: #404040;
        font-weight: 600;
        font-size: 16px;
        margin-bottom: 6px;
    }

    .card-solicitud-content .producto-atributos-valor {
        color: #FF8C40;
        font-weight: 600;
        font-size: 16px;
    }

/* Solicitud Pasos */
.line-time-process {
    position: absolute;
    height: 8px;
    width: 80%;
    background: #d9d9d9;
    z-index: -1;
    top: 30%;
    transform: translateY(-30%);
}

@media (max-width: 430px) {
    .line-time-process {
        top: 10%;
        transform: translateY(-10%);
    }
    .card-solicitud-content .producto-atributos-titulo {
        color: #404040;
        font-weight: 300;
        font-size: 11px !important;
        margin-bottom: 6px;
    }

    .card-solicitud-content .producto-atributos-valor {
        color: #FF8C40;
        font-weight: 600;
        font-size: 11px !important;
            }

    .card-solicitud-content .producto-titulo {
        color: #FF8C40;
        font-weight: 600;
        font-size: 16px !important;
        
    }

    .text-line-process {
        flex: 1 1 auto;
        width: 105.666667%;
    }

}



.nav-process-sucessful > span {
    margin-top: 5px;
}

    .nav-process-sucessful > span::after {
        content: url('../../Imagenes/icons/check.svg');
    }

.nav-process-active, .nav-process-sucessful {
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    border-radius: 50%;
    border: none;
    margin: 0 auto;
    color: white;
    font-size: 24px;
    font-weight: 500;
}

.nav-process-inactive {
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    border-radius: 50%;
    border: none;
    background: #bfbfbf;
    margin: 0 auto;
    color: white;
    font-size: 16px;
    font-weight: 500;
}

.nav-process-active {
    background: #ff6600;
}

.nav-process-sucessful {
    background: #2bbf21;
}

    .nav-process-sucessful > span, .nav-process-active > span, .nav-process-inactive > span {
        align-self: center;
    }

.nav-process-description {
    display: flex;
    justify-content: center;
    align-items: center;
}

.description-nav-centered-previous, .description-nav-centered-active {
    font-size: 16px;
    color: black;
    font-weight: 500;
}

.description-nav-centered-inactive {
    font-size: 16px;
    color: #bfbfbf;
    font-weight: 300;
}

/* Modal */

.mis-solicitudes-content {
    display: flex;
    justify-content: center;
    align-content: center;
    padding: 46px 25px;
    border-radius: 16px;
    box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.10);
    color: #404040;
}

.modalrad-bienvenida-wrapper {
    max-width: 337px;
    margin-top: 17px;
}

.modalrad-bienvenida-titulo {
    color: #FF8C40;
    font-size: 40px;
    font-weight: 700;
}

.modalrad-bienvenida-icon {
    width: 55px;
    height: 55px;
    background-color: #72207E;
}

.modalrad-bienvenida-separador {
    min-width: 3px;
    background-color: #72207E;
}

.modalrad-bienvenida-descripcion > h1 {
    font-size: 16px;
    font-weight: 500;
    color: #404040;
    margin-bottom: 1px;
}

.modalrad-bienvenida-descripcion > h2 {
    font-size: 24px;
    font-weight: 500;
    color: #72207E;
    margin-bottom: 1px;
}

.modalrad-instrucciones-wrapper {
    font-weight: 400;
}

.modalrad-lista-instrucciones li::marker {
    color: #FF8C40;
}

.modalrad-recordatorio-wrapper {
    max-width: 680px;
}

    .modalrad-recordatorio-wrapper > p {
        font-size: 14px;
    }

/* Pignoración Simulación */

.subsidio-beneficiario-item input[type="checkbox"]:after {
    width: 23px;
    height: 23px;
    top: -2px;
    left: -1px;
    position: relative;
    background-color: white;
    content: '';
    display: inline-block;
    visibility: visible;
    border-radius: 7px;
    border: 3px solid #DADADA;
}

.subsidio-beneficiario-item input[type="checkbox"]:checked:after {
    width: 23px;
    height: 23px;
    top: -2px;
    left: -1px;
    position: relative;
    background-color: #FF6600;
    content: '';
    display: inline-block;
    visibility: visible;
    border-radius: 7px;
    border: 3px solid #DADADA;
}

/* Producto Destacado */

.btn-ofertas-banner {
    color: #FFFFFF;
    text-align: center;
    font-weight: 400;
    background: #FF8C40;
    border-radius: 12px;
    min-height: 30px;
    width: 160px;
}

/* Simulador */

.simulador-lista-recomendaciones li::marker {
    color: #FF8C40;
}

/* Titular */

.titular-wrapper {
    background-color: #F6F6F6;
}

    .titular-wrapper .semi-circulo-2 {
        position: absolute;
        width: 36px;
        height: 77px;
        background: #FF6600;
        border-radius: 0 100px 100px 0;
        left: 0;
        bottom: 12px;
    }

    .titular-wrapper h1 {
        font-size: 32px;
        font-weight: 500;
        margin-left: 50px;
        color: black;
    }

    .titular-wrapper h2 {
        font-size: 16px;
        font-weight: 400;
        color: #777777;
        margin-left: 50px;
    }

/* Popover */

.popover {
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

    .popover > .popover-header {
        border-bottom: 0;
        color: #777;
        font-size: 16px;
        font-weight: 500;
        padding: 8px 28px 8px 14px;
        word-wrap: break-word;
        --bs-popover-header-bg: #fff;
    }

    .popover > .popover-body {
        padding: 9px 14px;
        font-size: 12px;
        font-weight: 400;
        word-wrap: break-word;
        font-family: 'Helvetica';
        color: #777;
    }

    .popover.bottom {
        margin-top: 10px;
    }

/* Toggle Button */

.btn-toggle > :first-child {
    padding-left: 24px;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    border-radius: 32px 0px 0px 32px;
}

.btn-toggle > :last-child {
    padding-right: 24px;
    font-weight: 500;
    font-size: 16px;
    border-radius: 0px 32px 32px 0px;
}

.btn-toggle > .btn-active {
    background-color: #ff6600;
    color: #fff;
}

.btn-toggle > .btn-inactive {
    background-color: #efefef;
    color: #868686;
}

    .btn-toggle > .btn-inactive:hover {
        background-color: #777 !important;
        border-color: #777 !important;
        color: #fff !important;
        transition: all 0.5s ease;
    }

/* Resumen Solicitud */

.resumen-solicitud-sucessful {
    width: 40px;
    height: 40px;
    background-color: #2bbf21;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color: white;
    font-size: 24px;
    font-weight: 500;
}

.textoMorado {
    font-weight: 500;
    color: #72207E;
}

/* Términos y Condiciones */

.t-and-c-wrapper a {
    font-size: 18px !important;
}

.t-and-c-wrapper {
    font-size: 18px;
    font-weight: 400;
}

.t-and-c-modal-title {
    font-size: 18px;
}

.form-control-title {
    font-size: 18px;
    font-weight: 500;
}

.form-control-helper {
    min-height: 30px;
    font-size: 14px;
    font-weight: 300;
}

.form-control-label {
    font-size: 20px;
    font-weight: 300;
}

/* Modales */

.modal-custom-header .modal-title {
    font-size: 18px;
    font-weight: 300;
    color: #777777;
}

.modal-custom-body {
    font-size: 14px;
    color: #777777;
}

/* Progress Bar */

.progress {
    height: 20px;
}

.progress-bar {
    background-color: var(--primary);
}

/* Scrollbar */
/*
*::-webkit-scrollbar {
    width: 16px;
}

*::-webkit-scrollbar-track {
    background: #ffffff;
}

*::-webkit-scrollbar-thumb {
    background-color: #999;
    border-radius: 10px;
    border: 3px solid #ffffff;
}

::-webkit-scrollbar {
    width: 10px;
}
*/

/* Header */

header {
    position: fixed;
    z-index: 5;
    left: 0;
    width: 100%;
    height: auto;
    padding: 0;
    box-shadow: 0 1px 4px 2px rgba(0,0,0,.1);
    background-color: #fff;
}

.header__container {
    position: relative;
    z-index: 1;
    height: 60px;
    background-color: #fff;
}

    .header__container .container {
        position: relative;
    }

.header__actionsLink {
    font-size: 24px;
    position: relative;
    color: #333;
    cursor: pointer;
    border: 0;
    outline: 0;
    background-color: #e5e5e5;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: none;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: auto;
}

    .header__actionsLink.userLogged {
        background-color: transparent;
        margin-right: 20px;
    }

    .header__actionsLink.zonaUsuario.userLogged.abrio:before {
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 6 Free";
        font-size: 15px;
        content: "\f106";
    }

    .header__actionsLink.zonaUsuario.userLogged:before {
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 6 Free";
        font-size: 15px;
        content: "\f107";
        color: #333;
        right: -22px;
        top: 1px;
        font-weight: 700 !important;
        background-color: #e5e5e5;
        padding: 0 0 0 15px;
        border-radius: 0 50% 50% 0;
        width: 40px;
        height: 97%;
        position: absolute;
        display: flex;
        align-items: center;
        justify-content: center;
    }

.header__actionsList {
    list-style-type: none;
    padding: 0;
    margin: 0;
    width: 100%;
    align-items: center;
    justify-content: center;
}

.pseudo__icon::before {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

#logo a {
    height: 40px;
    display: flex;
    justify-content: start;
    align-items: center;
    margin-top: 10px;
}

.avatar {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    background: #f60;
    width: 39px;
    height: 39px;
    margin: 0 auto;
    text-align: center;
    position: relative;
}

    .avatar::after {
        content: '';
        width: 10px;
        height: 10px;
        position: absolute;
        background: #85b300;
        bottom: 0;
        right: 0;
        border-radius: 100%;
    }

    .avatar img {
        position: absolute;
        display: none;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .avatar .logLetter {
        color: #fff !important;
        font-size: 20px;
        font-weight: 400;
        vertical-align: middle;
    }

.perfil {
    width: 100%;
    background: #f4f4f4;
    position: absolute;
    top: 60px;
    right: 0;
    height: 0;
    border-radius: 0 0 10px 10px;
    overflow: hidden;
    -webkit-transition: .5s ease;
    -o-transition: .5s ease;
    transition: .5s ease;
    z-index: 10;
}

.perfil__usuario {
    overflow: hidden;
    padding: 0 15px;
    padding-top: 10px;
    width: 100%;
    background-color: #e5e5e5;
}

.avatarPerfil {
    width: 70px;
    height: 70px;
    margin: 10px auto;
    cursor: pointer;
}

    .avatarPerfil::after {
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        font-family: "Font Awesome 6 Free";
        content: "\f040";
        position: absolute;
        color: #fff;
        right: 2px !important;
        top: inherit;
        bottom: 0 !important;
        background: #333 !important;
        width: 20px !important;
        font-weight: 700 !important;
        height: 20px !important;
        font-size: 10px;
        line-height: 20px;
    }

.avatar {
    border-radius: 100%;
    background: #f60;
    margin: 0 auto;
    text-align: center;
    position: relative;
}

.perfil__usuario .avatarPerfil .logLetter {
    font-size: 40px;
    vertical-align: text-bottom;
    line-height: 70px;
}

.perfil__usuario__datos {
    float: left;
    width: 100%;
    padding-top: 20px;
    text-align: center;
}

    .perfil__usuario__datos h4 {
        font-size: 16px;
        margin-bottom: 5px;
    }

    .perfil__usuario__datos .perfil__lista__item__datos__profesion {
        font-size: 14px;
        color: #b2b2b2;
    }

.perfil__lista {
    padding-left: 0;
    max-height: auto;
    overflow: hidden;
    margin-bottom: 0;
}

.perfil__lista__item {
    border-left: solid 1px #e5e5e5;
}

.ms-core-listMenu-verticalBox.perfil .root.ms-core-listMenu-root.static.perfil__lista > li.static:hover a {
    color: #fff;
}

.ms-core-listMenu-verticalBox.perfil .root.ms-core-listMenu-root.static.perfil__lista > li.static:hover {
    background: #ff944d;
}

.ms-core-listMenu-verticalBox.perfil li.static {
    position: relative;
    min-height: 32px;
    cursor: pointer;
}

    .ms-core-listMenu-verticalBox.perfil li.static > .ms-core-listMenu-item {
        display: table;
        padding: 0 20px !important;
        height: 32px;
        color: #666;
    }

        .ms-core-listMenu-verticalBox.perfil li.static > .ms-core-listMenu-item:hover {
            color: #fff !important;
        }

    .ms-core-listMenu-verticalBox.perfil li.static.perfil__lista__item:last-child a {
        width: 100%;
        margin: 0 auto;
    }

    .ms-core-listMenu-verticalBox.perfil li.static.perfil__lista__item:last-child {
        text-align: center;
        background-color: #333;
    }

    .ms-core-listMenu-verticalBox.perfil li.static > .ms-core-listMenu-item > span {
        display: table-cell;
        vertical-align: middle;
        font-size: 14px;
        font-weight: 300;
    }

    .ms-core-listMenu-verticalBox.perfil li.static.perfil__lista__item:last-child a span {
        font-weight: 300;
        font-size: 14px;
        color: #fff;
    }

.header__actions {
    height: 20px;
}

.mobile {
    height: 0px;
}

    .mobile .header__actionsItem.usuario {
        position: absolute;
        z-index: 1;
        top: 12px;
        right: 20px;
        margin: 0 8px;
    }

/* Footer */

.compensarPie__contenido {
    margin: 0 auto;
    max-width: 1200px;
    width: 100%;
}

footer.compensarPie .compensarPie_wrapper {
    background-color: #333;
}

.compensarPie__enlacesDeInteres {
    border-top: none;
    padding: 15px;
}

.compensarPie__enlacesDeInteres__lista__elementos--enlacesDeInteres li:before {
    content: "•";
    margin-right: 10px;
    color: #a9a9a9;
    vertical-align: top;
}

.compensarPie__enlacesDeInteres .footerList {
    padding: 15px 0 15px;
}

    .compensarPie__enlacesDeInteres .footerList:not(:last-child) {
        border-bottom: dashed 1px #666;
    }

.compensarPie__enlacesDeInteres__lista__elementos {
    list-style: none;
    padding: 0px;
    margin-bottom: 0px;
}

.compensarPie__enlacesDeInteres__lista__elementos--otrosServicios,
.compensarPie__enlacesDeInteres__lista__elementos--enlacesDeInteres {
    display: flex;
    flex-direction: column;
}

.compensarPie__enlacesDeInteres__lista__elementos--SiguenosEn {
    display: flex;
    flex-direction: row;
    gap: 25px;
}

    .compensarPie__enlacesDeInteres__lista__elementos--SiguenosEn i {
        color: #777;
    }

.compensarPie__enlacesDeInteres__lista__elementos--otrosServicios {
    width: 60%;
}

.compensarPie__enlacesDeInteres__lista__elementos--enlacesDeInteres {
    width: 60%;
}

.compensarPie__enlacesDeInteres__lista__elementos--contactanos {
    width: 80%;
}

.compensarPie__enlacesDeInteres__lista__elementos li:last-child {
    margin: 0;
}

.compensarPie__enlacesDeInteres__lista__elementos--SiguenosEn li,
.compensarPie__enlacesDeInteres__lista__elementos--enlacesDeInteres li,
.compensarPie__enlacesDeInteres__lista__elementos--otrosServicios li {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    margin-bottom: 5px;
}

.compensarPie__enlacesDeInteres__lista__titulo {
    font-size: 14px;
    font-weight: 500;
    color: #a9a9a9;
    margin: 0;
    padding-top: 0px;
    padding-bottom: 20px;
}

.compensarPie__enlacesDeInteres__lista__elementos li img {
    display: inline-block;
    height: 14px;
    margin-right: 5px;
    margin-top: 3px;
    vertical-align: top;
    width: auto;
}

.compensarPie__enlacesDeInteres__lista__elementos i {
    margin-right: 3px;
}

.compensarPie__enlacesDeInteres__lista__elementos a {
    color: #a9a9a9;
    width: 92%;
    display: inline-block;
    font-size: 14px
}

.compensarPie__enlacesDeInteres__lista__elementos--contactanos li {
    margin-bottom: 15px;
}

.compensarPie__enlacesDeInteres__lista__elementos h4 {
    font-weight: 500;
    color: #a9a9a9;
    margin-bottom: 5px;
    font-size: 14px;
}

.compensarPie__enlacesDeInteres__lista__elementos p {
    color: #a9a9a9;
    margin-bottom: 0;
    font-size: 14px;
}

.compensarPie__logosCertificaciones {
    background-color: #fff;
    padding: 15px 0;
    text-align: center;
}

    .compensarPie__logosCertificaciones .footerList {
        display: inline-flex;
    }

.compensarPie__logosCertificaciones__lista {
    display: inline-block;
    list-style: none;
    margin: 0;
    padding: 0 20px;
    vertical-align: top;
}

.compensarPie__logosCertificaciones__logotipo {
    display: inline-block;
    vertical-align: middle;
}

/* Media Queries (Bootstrap Viewports) */

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .card-custom {
        width: 100% !important
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {

    .breadcrumb-item {
        font-size: 18px;
    }

    .container {
        width: 750px;
    }

    #logo a {
        margin-top: 0px;
    }

    .perfil {
        width: 320px;
        right: -30px;
    }

    .compensarPie__enlacesDeInteres {
        padding-top: 0px;
        padding-bottom: 0px;
        border-top: 30px solid #333;
        border-bottom: 30px solid #333;
    }

    .compensarPie__enlacesDeInteres__lista__elementos--SiguenosEn {
        display: block;
    }

    .compensarPie__enlacesDeInteres__lista__elementos--contactanos {
        width: 100%;
    }

    .compensarPie__enlacesDeInteres__lista__elementos--enlacesDeInteres {
        width: 100%;
    }

    .compensarPie__enlacesDeInteres .footerList {
        padding: 0 15px 15px;
    }

        .compensarPie__enlacesDeInteres .footerList:first-child {
            padding-bottom: 0px;
            border: none;
        }

        .compensarPie__enlacesDeInteres .footerList:not(:first-child) {
            padding-bottom: 0px;
            border-bottom: none;
            border-left: dashed 1px #666;
        }

        .compensarPie__enlacesDeInteres .footerList:nth-child(1),
        .compensarPie__enlacesDeInteres .footerList:nth-child(2) {
            padding-bottom: 15px;
            border-bottom: dashed 1px #666;
        }

        .compensarPie__enlacesDeInteres .footerList:nth-child(3),
        .compensarPie__enlacesDeInteres .footerList:nth-child(4) {
            padding-top: 15px;
        }

    .proceso-producto-wrapper {
        max-width: 880px;
        margin-top: 57px;
    }

    .nav-process-sucessful, .nav-process-active {
        width: 60px;
        height: 60px;
    }

    .nav-process-inactive {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .description-nav-centered-previous, .description-nav-centered-active {
        font-size: 16px;
    }

    .description-nav-centered-inactive {
        font-size: 16px;
    }

    .product-title {
        font-size: 24px;
    }

    .card-outer {
        padding-top: 88px;
        padding-bottom: 88px;
        padding-left: 186px;
        padding-right: 186px;
    }

    .label.info-34 {
        font-size: 34px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        margin-left: 32px !important;
        color: #000;
    }

    .label.info-96 {
        font-size: 90px;
        font-style: normal;
        font-weight: 700;
        line-height: 90%;
        color: #000;
    }

    .firma-subtitulo {
        font-size: 56px;
    }

    .firma-recomendaciones-separador {
        min-width: 3px;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

    .header__container {
        box-shadow: 0 1px 4px 2px rgba(0,0,0,.1);
    }

    .container {
        width: 970px;
    }

    .header__actions {
        background-color: #fff;
        height: 60px;
    }

    .header__actionsItem:first-child {
        border-left: 1px solid #ccc;
        margin-left: 0;
        padding-left: 25px;
    }

    .header__actionsItem:last-child {
        margin-right: 0 !important;
    }

    .header__actionsItem {
        margin: 0 8px;
        text-align: center;
    }

    .compensarPie__enlacesDeInteres .footerList:nth-child(1),
    .compensarPie__enlacesDeInteres .footerList:nth-child(2) {
        padding-bottom: 0px;
        border-bottom: none;
    }

    .compensarPie__enlacesDeInteres .footerList:nth-child(3),
    .compensarPie__enlacesDeInteres .footerList:nth-child(4) {
        padding-top: 0px;
    }

    .label.info-40 {
        font-size: 40px;
        font-style: normal;
        font-weight: 700;
        line-height: 100%;
        margin-left: 32px !important;
        color: #000;
    }

    .card.w-344 {
        max-width: 344px !important;
        border: 0 !important;
        margin: 0 auto;
    }

        .card.w-344.izquierda {
            margin-left: 34%;
        }

        .card.w-344.derecha {
            margin-right: 34%;
        }

    .btn.group.switch {
        width: 50% !important;
    }

    .btn-default.switch {
        font-size: 28px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%;
        height: 64px;
        border-radius: 32px
    }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .container {
        width: 1170px;
    }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
}

.label.naranja {
    color: var(--secundary) !important;
    font-weight: 600;
}

.label.bold {
    text-align: center;
    font-weight: 700 !important;
}

.label.info-10 {
    font-size: 10px;
    font-weight: 400;
    line-height: normal;
}

.label.info-12 {
    font-size: 12px;
    font-weight: 300;
    line-height: normal
}

.label.info-13 {
    font-size: 13px;
    font-weight: 400;
    line-height: 150%
}

.label.info-14 {
    font-size: 14px;
    line-height: 170%;
    font-weight: 300;
}
    .label.info-14.bold {
        line-height: 28px !important;
        font-weight: 450 !important;
    }


.label.info-16 {
    font-size: 16px;
    line-height: 100%;
    font-weight: 500;
    min-width: 40px;
}

.label.titulo-16 {
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 170%;
}

.label.info-17 {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
}

.label.info-18 {
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.label.info-20 {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.label.titulo-20 {
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 300;
    line-height: 130%;
}

    .label.titulo-20.bold {
        font-weight: 500 !important;
        line-height: 40.8px !important;
    }

    .label.titulo-20.bolder {
        font-weight: 700 !important;
        line-height: 40.8px !important;
    }

.label.info-20.normal {
    font-size: 20px;
    font-style: normal;
    font-weight: 450;
    line-height: 28px;
}

.label.info-24 {
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.label.titulo-24 {
    color: #000;
    font-size: 24px;
    font-style: normal;
    font-weight: 300;
    line-height: 130%;
}

    .label.titulo-24.bold {
        font-weight: 500 !important;
    }

.label.titulo-25 {
    font-size: 25px;
    font-style: normal;
    font-weight: 500;
    line-height: 40.8px;
}

.label.info-25 {
    font-size: 25px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.label.info-31 {
    font-size: 31px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.label.info-34 {
    font-size: 34px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    margin-left: 32px !important;
    color: #000;
}

.label.info-48 {
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: -1.2px;
}

.label.info-96 {
    font-size: 80px;
    font-style: normal;
    font-weight: 700;
    line-height: 90%;
    color: #000;
}

.label.ml-32 {
    margin-left: 32px !important;
}

/*CARDS*/

.circulo {
    width: 73.8px;
    height: 74px;
    background-color: var(--secundary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
}

    .circulo i {
        font-size: 36px;
        color: white;
    }

.card-header {
    background-color: var(--secundary);
    /*background-color: #FF8C40;*/
    color: white;
    /*height: 54px !important*/
}

    .card-header:first-child {
        border-radius: 18px 18px 0 0;
    }

.card-custom {
    border-radius: 18px !important;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.10);
    border: 1px solid #FFB380;
    background: #FFF;
    flex-shrink: 0;
    height: auto;
    display: flex;
    flex-direction: column;
    width: 360px;
    margin: auto;
}

    .card-custom .row > * {
        padding-right: 0px !important
    }

    .card-custom .card-body {
        padding: 20px;
    }

.card-max-width {
    max-width: 360px;
    min-height: 465px;
    margin: 0 auto;
}

.card-simulador {
    max-width: 360px;
    height: auto;
    margin: 0 auto;
}



.card-custom .linea-separadora {
    border-top: 1px solid #ccc;
    margin: 20px 0;
}

.card-custom.resaltada {
    color: var(--tertiary) !important;
    border-color: var(--tertiary) !important;
}

    .card-custom.resaltada label.naranja {
        color: var(--tertiary) !important;
    }

    .card-custom.resaltada .circulo {
        background-color: var(--tertiary) !important;
        color: var(--tertiary) !important;
    }

.card-body .row {
    padding-right: 0;
    margin-right: 0;
}

.card-body .btn {
    width: 85%;
    height: 40px
}


.row.row-card {
    margin-right: -12%;
    margin-left: -7%;
}

.row-card [class^="col-"] {
    padding-left: 0px;
}

.separador-svg {
    width: 100%;
    height: 2px;
    fill: none;
}

    .separador-svg path {
        stroke: var(--Gray-light-400, #DADADA);
        stroke-width: 2px;
    }


.card-outer {
    border-radius: 16px;
    border: 1px solid var(--Black-100, #BFBFBF);
    background: var(--White, #FFF);
    box-shadow: 0px 4px 9px 0px rgba(0, 0, 0, 0.09);
    padding-top: 37px;
    padding-bottom: 37px;
    padding-left: 27px;
    padding-right: 27px;
}

.custom-ol {
    list-style: none;
    padding-left: 0;
    color: #1E1E1E;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; /* 16px */
}

    .custom-ol li {
        position: relative;
        padding-left: 30px;
        margin-bottom: 10px;
    }

        .custom-ol li::before {
            content: "";
            display: block;
            width: 6px;
            height: 6px;
            background-color: var(--primary);
            border-radius: 50%;
            position: absolute;
            top: 50%;
            left: 0;
            transform: translateY(-50%);
        }


.link-terminos {
    text-decoration: underline;
    text-align: right;
    display: block;
    color: var(--primary);
}


.gridview-header {
    background: var(--secundary);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: var(--White, #FFF);
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 170%;
    text-align: center;
    height: 36px;
}

    .gridview-header:first-child {
        border-top-right-radius: 0;
    }

    .gridview-header:last-child {
        border-top-left-radius: 0;
    }

    .gridview-header:not(:first-child):not(:last-child) {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border: 1px solid var(--Gray-light-400, #DADADA);
    }

.gridview-cell {
    color: #000;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 170%;
    height: 36px;
    text-align: left;
    padding-left: 5px;
}

    .gridview-cell:first-child {
        text-align: center;
    }

.gridview-border {
    border: 1px solid var(--Gray-light-400, #DADADA);
}


/*---------Estilos especificos para controles de solicitudes en tramite (Mis solicitudes)----------------*/
.w-circle-process {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    position: relative;
}

.row.nav-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0 15px;
}

.step-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    text-align: center;
    max-width: 180px;
    min-height: 80px;
}

    /* Línea entre los botones */
    .step-container::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        height: 8px;
        background-color: #d9d9d9;
        z-index: -1;
        transform: translateY(-50%);
        margin: -22px 0;
    }

    .step-container:first-child::before {
        left: 50%;
        width: 50%;
    }

    .step-container:last-child::before {
        right: 50%;
        width: 50%;
    }

.btnConfirmarCardSol {
    min-width: 187px !important;
}

.step-containersol {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    text-align: center;
    max-width: 180px;
    min-height: 16px;
    margin-top: 4%
}

    /* Línea entre los botones */
    .step-containersol::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        height: 8px;
        z-index: -1;
        transform: translateY(-50%);
        margin: -22px 0;
    }

    .step-containersol:first-child::before {
        left: 50%;
        width: 50%;
    }

    .step-containersol:last-child::before {
        right: 50%;
        width: 50%;
    }

.w-circle-process p {
    white-space: normal;
    word-wrap: break-word;
    text-align: center;
    max-width: 110px;
    margin: 0;
    line-height: 1.2;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Estilo responsivo */
@media (max-width: 768px) {
    .row.nav-container {
        flex-direction: column;
        padding: 0;
    }

    .step-container {
        margin-bottom: 10px;
        position: relative;
    }

        .step-container::before {
            content: "";
            left: 50%;
            width: 2px;
            height: calc(100% + 20px);
            background-color: #d9d9d9;
            top: 0;
            transform: translateX(-50%);
        }

        .step-container:first-child::before {
            height: calc(50% + 10px);
            top: 40px;
            width: 2px;
        }
        .step-container:last-child::before {
            width: 2px;
            height: calc(50% + 10px);
        }
    .step-containersol {
        margin-bottom: 10px;
        position: relative;
    }

        .step-containersol::before {
            content: "";
            left: 50%;
            width: 2px;
            height: calc(100% + 20px);
            background-color: white;
            top: 0;
            transform: translateX(-50%);
        }

        .step-containersol:first-child::before {
            height: calc(50% + 10px);
            top: 40px;
            width: 2px;
        }

        .step-containersol:last-child::before {
            width: 2px;
            height: calc(50% + 10px);
        }

            
}

@media (min-width: 768px) and (max-width: 992px) {
    .step-container {
        max-width: 85px;
    }
    .step-containersol {
        max-width: 85px;
    }
}

@media (max-width: 991px) {
    .linea-vertical {
        display: none
    }

    .linea-horizontal {
        display: block;
    }
}

    /*---------------------------------------------------------------------------------*/