/*
    Color principal  #173853
    
    Quitar este #173853
    Principal color azul usado
    Color para los label dentro de cuerpo acordion
    Azul de prusia
    Connotación: Autoridad / Credibilidad / Profesionalismo
    CMYK: C=97 M=73 Y=41 K=38
    RGB: R=23 G=56 B=83
    Pantone: 2965 C / 295 U
    #173853
    
    Color: Azul secundario
    CMYK: C=100 M=77 Y=50 K=60
    RGB: R=13 G=37 B=55
    Pantone: 296 C / 2965 U
    #0D2537

    Color: Olivo secundario
    CMYK: C=41 M=42 Y=91 K=31
    RGB: R=130 G=111 B=40
    Pantone: 133 C / 126 U
    #826F28

    Color: Verde olivo
    Connotación: Disciplina / Seguridad
    CMYK: C=38 M=36 Y=91 K=22
    RGB: R=147 G=129 B=43
    Pantone: 105 C / 104 U
    #93812B

    GRIS CLARO
    en el texto de la campana
    #F5F5F5

    danger color
    #ff6961

    --hover  #FF321E

    olivo transparente
    #d8cdb0

    menu dropdown azul claro
    #8ca6bf
    */

:root {
    --azul-principal: #173853; /*Todos los controles, textos que usan el azul principal*/
    --azul-secundario: #0D2537;
    --olivo-primario: #93812B;
    --olivo-secundario: #826F28;
    --fondo-btn-general: white; /*color de fondo para el boton general*/
    --fondo-btn-generalHover: #173853; /*color de fondo para el boton general en el hover*/
    --colorTextoBtnGeneral: #173853; /*color para el texto dentro del btn general*/
    --colorGris: #666666; /*todo los textos y cuadros que usan este gris*/
    /*encabezados acordion (BARRA SEPARADORA DE TITULOS)*/
    --encabezadoAcordionGradiente1: #D6D6D6;
    --encabezadoAcordionGradiente2: #ECECEC;
    --encabezadoAcordionGradiente3: #ADADAD;
    --contenedorEncabezadoAcordion: white;
    --encabezadoAcordionGradiente4: #CBCBCB; /*barra derecha header barraderechaheader*/
    /*gradiente superior*/
    --gradienteSuperior1: rgba(13,37,55,1);
    --gradienteSuperior2: rgba(26, 65, 94,1);
    --gradienteSuperior3: rgba(255,255,255,1);
    --color-fondoPrincipal: #FFFFFF;
    /*color de los documentos cuando el mouse esta encima*/
    --colorDcoumentosHover: #F5F5F5;
    /*color de los documentos cuando se hace clic DOCUMENTO SELECCIONADO*/
    --tituloDocumentoExpedienteSelected: #b7cbdb;
    --textoOscuro: #0D2537; /*Todos los textos con el azul principal*/
    --backgroundModal: #ffffff; /*color blanco de los modales*/
    --visited: #173853;
    --actionLink: #173853;
    --actionLinkHover: #173853;
    --colorPrincipalBody: #333333; /*color default para el body, para todos los textos donde no se especifica, el default es un gris oscuro*/
    --colorMenuIzquierdo: #5b5b5c; /*colores para el texto del menú lateral izquierdo*/
    --colorMenuIzquierdoHover: #173853; /*colores para el texto del menú lateral izquierdo*/
    --colorBarraBusqueda: white;
    --backgroundBarraBusqueda: #173853;
    /*colores del chosen*/
    --backGroundChosenSelected: #173853; /*color del hover chosen*/
    --colorChosenSelected: #fff; /*color de texto del chosen hover*/
    --colorChosen: #173853; /*color default del texto chosen*/
    --backgroundColorChosen: #ffffff; /*color default del texto chosen*/
    --backgroundColorChosen2: #f6f6f6; /*color default del texto chosen*/
    /*form controls*/
    --colorFormControl: black; /*color default del texto chosen opcion seleccionada*/
    --backgroundColorFormControl: #ffffff; /*color default del texto chosen*/
    --colorFormControlPlaceholder: #999999;
    /*coloresDataTable*/
    --backgroundRowSelected: #173853; /*color de fondo cuando el renglon esta seleccionado*/
    --backgroundRowHover: #adadad; /*color de fondo en el row hover*/
    --colorRowHover: #333333; /*color de fondo en el row hover*/
    --colorRowSelected: white; /*color del texto del renglon seleccionado DT*/
    --backgroundRowOscuro: #d9d9d9; /*color de fondo para el renglon oscuro del DT*/
    --backgroundRowClaro: white; /*color de fondo para el renglon oscuro del DT*/
    --colorRow: #333333; /*color de texto del row*/
    /*full calendar*/
    --colorFullCalendar: #173853; /*todos los colores azules del full calendar*/
    --colorElementosFullCalendar: #173853; /*color de los elementos agendados*/
    --colorNumeroDiaFullCalendar: #173853; /*color de los elementos agendados*/
    /*submenu principal*/
    --backgroundSubmenu: #8ca6bf;
    --colorTextoSubmenu: #173853;
    --colorCerrarModal: #5D5B5C;
    --colorLineaDashed: #ADADAD;
    --colorTextoDager: #8d5e19;
    --backgroundBtnGris: #D6D6D6;
    --font-size-base: 15px;
}

[data-theme="dark"] {
    --azul-principal: #8ab8db; /*Todos los controles, textos que usan el azul principal*/
    --azul-secundario: #5D5B5C;
    --olivo-primario: #93812b;
    --olivo-secundario: #826F28;
    /*btn general*/
    --fondo-btn-general: #5D5B5C; /*color de fondo para el boton general*/
    --fondo-btn-generalHover: #353535; /*color de fondo para el boton general en el hover*/
    --colorTextoBtnGeneral: white; /*color para el texto dentro del btn general*/
    --colorGris: #ADADAd;
    /*encabezados acordion (BARRA SEPARADORA DE TITULOS)*/
    --encabezadoAcordionGradiente1: #1a1818;
    --encabezadoAcordionGradiente2: #1a1818;
    --encabezadoAcordionGradiente3: #2c2c2c;
    --contenedorEncabezadoAcordion: #2c2b2b;
    --encabezadoAcordionGradiente4: #5D5B5c; /*barra derecha header barraderechaheader*/
    /*gradiente superior general SICEE*/
    --gradienteSuperior1: #06243d;
    --gradienteSuperior2: #253d51;
    --gradienteSuperior3: #272626;
    /*--gradienteSuperior1: #191818;
    --gradienteSuperior2: #343333;
    --gradienteSuperior3: #272626;*/
    --color-fondoPrincipal: #272626;
    /*color de los documentos cuando el mouse esta encima*/
    --colorDcoumentosHover: #343333;
    /*color de los documentos cuando se hace clic DOCUMENTO SELECCIONADO*/
    --tituloDocumentoExpedienteSelected: #4c4d4d;
    --textoOscuro: #282828; /*Todos los textos con el azul principal*/
    --backgroundModal: #353535; /*color blanco de los modales*/
    --visited: #93812B;
    --actionLink: #282828;
    --actionLinkHover: #ADADAD;
    --colorPrincipalBody: #ECECEC; /*color default para el body, para todos los textos donde no se especifica, el default es un gris oscuro para el modo dark lo vamos a poner gris claro*/
    --colorMenuIzquierdo: #CBCBCB;
    --colorMenuIzquierdoHover: white; /*colores para el texto del menú lateral izquierdo*/
    --colorBarraBusqueda: #282828;
    --backgroundBarraBusqueda: #8ab8db;
    /*colores del chosen*/
    --backGroundChosenSelected: #5D5B5c; /*color del hover chosen*/
    --colorChosenSelected: #fff; /*color de texto del chosen hover*/
    --colorChosen: #333333; /*color default del texto chosen opcion seleccionada*/
    --backgroundColorChosen: #ADADAd; /*color default del texto chosen*/
    --backgroundColorChosen2: #ff0000; /*color default del texto chosen*/
    /*form controls*/
    --colorFormControl: #CBCBCB; /*color default del texto chosen opcion seleccionada*/
    --backgroundColorFormControl: transparent; /*color default del texto chosen*/
    --colorFormControlPlaceholder: #6e7c87;
    /*coloresDataTable*/
    --backgroundRowSelected: #353535; /*color de fondo cuando el renglon esta seleccionado en el DT*/
    --backgroundRowHover: #5D5B5c; /*color de fondo en el row hover*/
    --colorRowHover: white; /*color de fondo en el row hover*/
    --colorRowSelected: white; /*color del texto del renglon seleccionado DT*/
    --backgroundRowOscuro: #807f7f; /*color de fondo para el renglon oscuro del DT*/
    --backgroundRowClaro: #a5a4a4; /*color de fondo para el renglon oscuro del DT*/
    --colorRow: #333333; /*color de texto del row*/
    /*full calendar*/
    --colorFullCalendar: #173853; /*todos los colores azules del full calendar*/
    --colorElementosFullCalendar: #173853; /*color de los elementos agendados*/
    --colorNumeroDiaFullCalendar: #826F28; /*color de los elementos agendados*/
    /*submenu principal*/
    --backgroundSubmenu: #ADADAd;
    --colorTextoSubmenu: #282828;
    --colorCerrarModal: white; /*boton x del modal*/
    --colorLineaDashed: #8ab8db;
    --colorTextoDager: #FFB84D;
    --backgroundBtnGris: #5f5b5b;
    --font-size-base: 15px;
}

.times-input-group {
    min-width: 50px;
}

/*
    menu opciones de consulta externa
*/
.opcionesExterna {
    margin: 0px 0px 2px 2px;
    padding: 0px 6px 0px 6px;
    color: var(--colorTextoBtnGeneral) !important;
}

.menuHam {
    color: var(--colorTextoBtnGeneral) !important;
    height: 100%;
    width: 100% !important;
    padding: 10px 10px 5px 10px;
}

    .menuHam:hover {
        color: white !important;
    }

.btn_submenu {
    border: none;
    color: var(--colorTextoSubmenu) !important;
    font-family: Tahoma !important;
    background-color: var(--backgroundSubmenu) !important;
    text-align: left !important;
    height: auto !important;
    width: 98% !important; /*para que deje un pequeño margen*/
    margin-left: 10px !important;
    margin: 1px !important;
    vertical-align: central !important;
}

    .btn_submenu:hover {
        background-color: var(--fondo-btn-generalHover) !important;
        color: white !important;
    }

.times-input-group .btn {
    width: 100%;
}
/*F8C9CC   color desvanecido vino, de los documentos glosados en la vista del expediente*/

.infoDia {
    padding: 3px 0px 3px 0px;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid var(--azul-principal);
}

.btn-help {
    line-height: 1.5;
    border-radius: 3px;
    height: 28px;
    padding: 2px 2px 2px 2px;
    margin: 0px 3px 0px 3px;
    background-color: white;
}

    .btn-help:hover {
        border: solid var(--azul-principal) 1px;
    }

/*
    menu opciones de consulta externa
*/
.ColorGeneralBold {
    font-weight: bold !important;
    color: var(--azul-principal);
}

.ColorGeneral {
    color: var(--azul-principal);
}

.dtAncho {
    max-width: 1000px !important;
    width: 25%;
}

@font-face {
    font-family: Cinzel;
    src: url(fonts/Cinzel-Bold.ttf);
}

.chosenError {
    border: 1px solid #ff0000 !important;
    border-radius: 5px 5px 5px 5px !important;
}

.chosenSelected {
    border: 1px solid #35cd66;
    border-radius: 5px 5px 5px 5px;
}

.chosenNotificarActuaria {
    border: 1px solid #ff980f;
    border-radius: 5px 5px 5px 5px;
    background-color: #ff980f;
}

.opacitiClass {
    opacity: 0.5;
    color: var(--azul-principal);
}

.NoopacitiClass {
    opacity: 1;
}

.representanteComun {
    font-weight: bold !important;
    color: var(--azul-principal);
}

.sinAcceso {
    font-weight: bold;
    color: var(--azul-principal);
    text-align: center;
}
/*Las clases de row 1,2,3,4,5- se usan para seleccionar el coror del renglon para el caso de las
    firmas masivas, si es 1 hay una promocion pendiente de acordar
    2 hay dos promociones
    3 hay tres promociones
    4 hay cuatro pormociones
    5- hay 5 o mas promociones pendientes de acordar*/
table.dataTable.display tbody tr.odd.row1 {
    background-color: #FBD1C7;
}

table.dataTable.display tbody tr.odd.row2 {
    background-color: #FCB7A8;
}

table.dataTable.display tbody tr.odd.row3 {
    background-color: #FD776A;
}

table.dataTable.display tbody tr.odd.row4 {
    background-color: #FE5342;
}

table.dataTable.display tbody tr.odd.row5 {
    background-color: #FF321E;
}

table.dataTable.display tbody tr.even.row1 {
    background-color: #FBD1C7;
}

table.dataTable.display tbody tr.even.row2 {
    background-color: #FCB7A8;
}

table.dataTable.display tbody tr.even.row3 {
    background-color: #FD776A;
}

table.dataTable.display tbody tr.even.row4 {
    background-color: #FE5342;
}

table.dataTable.display tbody tr.even.row5 {
    background-color: #FF321E;
}

.modal-title {
    margin: 0;
    line-height: 1.428571429;
    color: var(--azul-principal);
    font-weight: bold;
    font-family: 'Trajan Pro';
}

.MyModalHeader {
    /*descomentar en caso de querer darle color al header de los modales*/
    /*background-color: #d8cdb0;*/
}


.contenedorBarraInfo {
    display: flex;
    align-items: flex-end;
    height: 25pt;
    vertical-align: middle;
}

.infoRow {
    margin-left: 3px;
    height: 15pt;
    width: 25pt;
    border: 1px solid;
    color: var(--colorTextoBtnGeneral);
    text-align: center;
}

    .infoRow:hover {
        cursor: pointer;
        border: 2px solid #9D7E2D;
        width: 25pt;
        height: 25pt;
    }

.inforRow1 {
    background-color: #FBD1C7;
}

.inforRow2 {
    background-color: #FCB7A8;
}

.inforRow3 {
    background-color: #FD776a;
}

.inforRow4 {
    background-color: red;
}

.inforRow5 {
    background-color: darkred;
    color: lightgray;
}

.submenu {
    height: 40px;
    background-color: white;
    color: #5D5B5C;
    cursor: pointer;
    vertical-align: central;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

.ui-widget-content {
    width: 50%;
}

.ui-menu-item:hover {
    cursor: pointer;
}

.submenu:hover {
    background-color: #ECECEC;
    color: var(--azul-secundario);
    font-weight: bold;
    cursor: pointer;
}

/*estilo para el contenedor de mensaje de las sugerencias*/
.bodySugerencia {
    padding: 0px 0px 13px 13px;
    border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    -webkit-border-radius: 0px 0px 5px 5px;
    border: 1px solid #9D7E2D;
}

.titleSugerenciaDerecha {
    padding: 3px 0px 13px 13px;
    border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    border: 1px solid #9D7E2D;
    vertical-align: central;
    background-color: var(--azul-principal);
    color: white;
    font-weight: bold;
}

.titleSugerenciaIzquierda {
    padding: 3px 0px 13px 13px;
    border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    border: 1px solid #9D7E2D;
    vertical-align: central;
    background-color: #9d7E2D;
    font-weight: bold;
}

.hr-warning {
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 3px;
    border-top: 3px solid var(--azul-principal);
}

.glosado {
    background-color: #EEE4B4;
}

.documentoCancelado {
    background-color: #fb6944;
}

.modalDetails {
    width: 80%;
}

.modalNotificacion {
    width: 50% !important;
}

@media (max-width: 1200px) {
    .celdaFooter {
        width: 100%;
        float: none;
    }

    .celdaFooterInterno {
        float: none;
        width: 100%;
    }

    .modalDetails {
        width: 100%;
    }

    .contenidoLayout {
        /*padding: 0px 0px 0px 0px;*/
        padding: 3px 0px 3px 0px;
        border-radius: 5px 5px 5px 5px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border: 1px solid var(--azul-principal);
    }
}

/*cuando el tamaño sea mayor a 1000*/
@media (min-width: 1000px) {
    .rowContent {
        border: 2px solid red;
    }
}

/*Reducir el padding del div contenedor del body cuando el tamaño sea menor a 650 px*/
@media (max-width: 650px) {
    .body-content {
        padding-left: 2px;
        padding-right: 0px;
    }

    .infoDia {
        display: none;
    }

    #headerAcordionRawTitulo2 {
        display: none;
    }
}


/*Inherit le decimos que tome el tamaño de su papa*/
@media (max-width:700px) {
    .bodyLogin {
        background-size: inherit;
    }

    .opcionesExterna {
        width: 90%;
        text-align: left;
    }

    #headerAcordionRawTitulo2 {
        display: none;
    }
}

@media (max-width:980px) {
    .contenidoLayout, .menuDivLayout, #navBarContenedorUsuario {
        /*padding: 20px 20px 20px 20px;*/
        margin-left: 8px;
        margin-right: 8px;
    }

    .modal-dialog {
        width: 90% !important;
    }

    .barraDerechaHeader {
        width: 20% !important;
    }

    .barraDerechaHeader2 {
        width: 20% !important;
    }

    .barraIzquierdaHeader {
        width: 80% !important;
    }

    .barraIzquierdaHeader2 {
        width: 80% !important;
    }

    #headerAcordionRawTitulo2 {
        display: none;
    }

    .NoRojo {
        width: 400px !important;
        margin-bottom: 4px;
        margin-right: 5px;
    }
}

@media (max-width: 999px) {

    #headerAcordionRawTitulo2 {
        display: none;
    }
}

@media (max-width: 650px) {
    .menuPrincipal {
        width: 98%;
        float: none;
        margin-left: 2px;
    }

    .container {
        width: 100%;
    }

    .contenido {
        float: none;
        border: 1px solid #5D5B5C;
        margin-left: 2px;
        padding: 2px 2px 2px 8px;
        border-radius: 4px;
        width: 98%;
        margin-top: 10px;
    }

    #headerAcordionRawTitulo2 {
        display: none;
    }
}

/*cuando el tamaño sea menor o igual a 450 px*/
@media (max-width: 235px) {
    .contenedorEncabezadoAcordion {
        height: 68px !important;
    }

    #headerAcordionRawTitulo2 {
        display: none;
    }
}



@media (max-height: 400px) {
    .tituloLogin {
        display: none;
    }
}



/*Oculta el titulo y el footer dentro del sistema de los usaurios que usan el _Layout*/
/*el alto es menor o igual a 600*/
@media (max-height: 600px) {
    .tituloSicee {
        display: none;
    }
}

@media (min-height: 601px) {
    .loginContainer {
        min-height: 70% !important;
    }
}

@media (min-height: 601px) {
    .loginContainer {
        min-height: 70% !important;
    }
}





.notificacionNoLeida {
    font-weight: bold;
    color: #ECECEC;
}

.row-selected {
    background-color: #826F28 !important;
    font-weight: bold;
}

.notificacionNoLeida a {
    font-weight: bold;
    color: #fff;
}
/*----------------------------------*/
/*a.fa-globe {
  position: relative;
  font-size: 2em;
  color: grey;
  cursor: pointer;
}*/
/*span.fa-comment {
  position: absolute;
  font-size: 0.6em;
  top: -4px;
  color: red;
  right: -4px;
}*/
span.num {
    position: absolute;
    font-size: 1em;
    font-weight: bold;
    top: 3px;
    color: #fff;
    right: 10px;
}

.badge {
    position: absolute;
    top: 6px;
    right: 2px;
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: var(--color-fondoPrincipal);
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: var(--azul-principal);
    border-radius: 10px;
}

.badge-campana {
    position: absolute;
    top: 6px;
    right: 2px;
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #E8E8E8;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #ff4545;
    border-radius: 10px;
}

/****************************************/


.CheckBoxGrande {
    transform: scale(2.5);
    margin-right: 10px;
    margin-left: 5px;
}

.actionLinkRowSelected {
    color: #000000;
}

    .actionLinkRowSelected:hover {
        color: #000000;
        font-weight: bold;
    }

.actionLink {
    color: var(--actionLink);
}

.mainColor {
    color: var(--azul-principal) !important;
}


.actionLink:hover {
    color: var(--actionLinkHover);
    font-weight: bold;
    cursor: pointer !important;
}

/*no change color*/
.simpleActionLink {
    cursor: pointer !important;
}

    .simpleActionLink:hover {
        font-weight: bold;
        text-decoration: underline;
    }

.LabelLink {
    color: #9D7E2D;
    text-decoration: underline;
}

    .LabelLink:hover {
        color: #9D7E2D;
        cursor: pointer;
        font-weight: bold !important;
    }

.ColorTextoSecundario {
    color: #9D7E2D !important;
}

.ErrorMessage {
    font-size: 15pt;
    color: #cc3300;
    font-weight: bold;
}

.SuccessMessage {
    font-size: 15pt;
    color: #339900;
    font-weight: bold;
}

.direcciones {
    color: var(--azul-secundario);
}

    .direcciones:hover {
        cursor: pointer;
        color: #826F28;
        font-weight: bold;
    }

@font-face {
    font-family: Artifika;
    src: url(fonts/Artifika-Regular.ttf);
}

@font-face {
    font-family: CinzelRegular;
    src: url(fonts/Cinzel-Regular.ttf);
}

/*Para quitar la felcha del combo de busqueda para busqueda expediente*/
select::-ms-expand {
    display: none;
}

/***************************************
    ESTILOS PARA LA PAGINA LAYOUT
****************************************/
body, html {
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: white;
}

#barraBusqueda {
    height: 100%;
    margin: 0;
    padding: 0;
}

.form-control {
    border: 1px solid #ADADAD;
}

.form-control-mini {
    width: 30%;
}

.form-control:focus { /* Este estilo cambia el color de focus para los form-control  */
    border-color: var(--azul-principal); /* Se cambia tanto la el borde como la sombra del control cuando esta activo */
    box-shadow: inset 0 1px 1px rgba(141,69,73, 0.075), 0 0 8px rgba(141,69,73, 0.6);
}


.gradiente_superior {
    background: var(--gradienteSuperior1);
    background: -moz-linear-gradient(top, var(--gradienteSuperior1) 0%, var(--gradienteSuperior1) 7%, var(--gradienteSuperior2) 16%, var(--gradienteSuperior3) 97%, var(--gradienteSuperior3) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, var(--gradienteSuperior1)), color-stop(7%, var(--gradienteSuperior1)), color-stop(16%, var(--gradienteSuperior2)), color-stop(97%, var(--gradienteSuperior3)), color-stop(100%, var(--gradienteSuperior3)));
    background: -webkit-linear-gradient(top, var(--gradienteSuperior1) 0%, var(--gradienteSuperior1) 7%, var(--gradienteSuperior2) 16%, var(--gradienteSuperior3) 97%, var(--gradienteSuperior3) 100%);
    background: -o-linear-gradient(top, var(--gradienteSuperior1) 0%, var(--gradienteSuperior1) 7%, var(--gradienteSuperior2) 16%, var(--gradienteSuperior3) 97%, var(--gradienteSuperior3) 100%);
    background: -ms-linear-gradient(top, var(--gradienteSuperior1) 0%, var(--gradienteSuperior1) 7%, var(--gradienteSuperior2) 16%, var(--gradienteSuperior3) 97%, var(--gradienteSuperior3) 100%);
    background: linear-gradient(to bottom, var(--gradienteSuperior1) 0%, var(--gradienteSuperior1) 7%, var(--gradienteSuperior2) 16%, var(--gradienteSuperior3) 97%, var(--gradienteSuperior3) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#173853', endColorstr='#ffffff', GradientType=0 );
}

.titulo_Layout {
    font-family: CinzelRegular;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 2pt;
    color: var(--azul-principal);
}

.menuDivLayout {
    padding: 3px 0px 3px 0px;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid #cbc5b4;
    margin-bottom: 3px;
}

.contenidoLayout {
    padding: 3px 0px 3px 0px;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid #9db2c3;
}

.nav-pills {
    background: none;
}

.navbar-default {
    background-color: transparent;
    border-color: transparent;
}

.navbar-collapse {
    max-height: none;
}

.menuNavBarToggle {
    border: 1px solid var(--azul-principal);
    background-color: var(--azul-principal);
}

    .menuNavBarToggle:hover {
        background-color: #826F28;
    }

    .menuNavBarToggle > span {
        background-color: #826F28;
    }

    .menuNavBarToggle:hover > span {
        background-color: white;
    }
/************ ESTILOS BARRA NAVEGACION USUARIOS LAYOUT **************/
#navBarContenedorUsuario {
    background-color: transparent;
    border-color: transparent;
    margin-bottom: 0px;
    color: white;
}

    #navBarContenedorUsuario .navbar-toggle {
        border-color: var(--azul-principal);
    }

        #navBarContenedorUsuario .navbar-toggle:hover {
            background-color: #826F28;
        }

    #navBarContenedorUsuario li a {
        color: white;
        font-family: Tahoma;
        font-size: 16px;
    }

#navBarUsuario {
    /*border-radius: 5px 5px 5px 5px;*/
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-top: 0px solid transparent;
    border-bottom: 2px solid transparent !important;
    /*border: 1px solid var(--azul-principal);*/
}

.not-active {
    pointer-events: none;
    cursor: default;
}

#navBarUsuario a:hover {
    background-color: var(--azul-principal);
    border-radius: 0px 0px 8px 8px;
}

/****************************************************/
.containerLayout { /*estilo para el container del la vista layout para que abarque toda la pagina*/
    height: auto;
    min-height: 85%;
    padding-bottom: 65px;
}

.footerLayout {
    clear: both;
    position: relative;
    z-index: 10;
    height: 65px;
    margin-top: -65px;
    width: 100%;
    background-color: blue;
    background: -webkit-linear-gradient(left,#CBCBCB, var(--color-fondoPrincipal),var(--color-fondoPrincipal),#CBCBCB);
    background: -moz-linear-gradient(left,#CBCBCB, var(--color-fondoPrincipal),var(--color-fondoPrincipal),#CBCBCB);
    background: -o-linear-gradient(left,#CBCBCB, var(--color-fondoPrincipal),var(--color-fondoPrincipal),#CBCBCB);
    background: linear-gradient(to left,#CBCBCB, var(--color-fondoPrincipal),var(--color-fondoPrincipal),#CBCBCB); /*Internet Explorer*/
}

.footerInterno {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    align-content: center;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: center;
    margin: 0 auto;
    position: relative;
}

.rowFooter {
    display: inline-table;
    /*border: 1px,dashed;*/
    width: 80%;
}

#wrapperInicioSesion {
    min-height: 100%;
    position: relative;
    background-color: var(--color-fondoPrincipal) !important;
}

#wraperLayoutPrincipal {
    min-height: 100%;
    position: relative;
    background-color: var(--color-fondoPrincipal);
}

.backGroundPrincipal {
    background-color: var(--color-fondoPrincipal);
}

.backGroundAzulSecundario {
    background-color: var(--azul-secundario);
}



#header {
}

#content {
    padding-bottom: 100px; /* Height of the footer element */
}

#fondoImagen {
    height: 100%;
    background-image: url(Resources/login_fondo.png);
    background-size: 100% 80%;
    background-repeat: no-repeat;
    background-origin: content-box;
}

#fondoInicioSesion {
    /*background-image: url(Resources/login_fondo.png);*/
    /*background-image: url(Resources/login_fondo.jpg);*/
    background-size: 100% 100%;
    margin: 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    position: absolute;
    height: 100%;
    background-origin: content-box;
}

#bodyImagenLogin {
    background-size: 100% 100%;
    margin: 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    position: absolute;
    height: 80%;
    background-origin: content-box;
}



#footer {
    width: 100%;
    height: 65px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: -webkit-linear-gradient(left,#CBCBCB, var(--color-fondoPrincipal),var(--color-fondoPrincipal),#CBCBCB);
    background: -moz-linear-gradient(left,#CBCBCB, var(--color-fondoPrincipal),var(--color-fondoPrincipal),#CBCBCB);
    background: -o-linear-gradient(left,#CBCBCB, var(--color-fondoPrincipal),var(--color-fondoPrincipal),#CBCBCB);
    background: linear-gradient(to left,#CBCBCB, var(--color-fondoPrincipal),var(--color-fondoPrincipal),#CBCBCB); /*Internet Explorer*/
}

.textoFalloInicioSesion {
    color: var(--colorTextoDager) !important;
    font-family: Tahoma;
    font-size: 15px;
}

.contenedorSearch {
    width: 100%;
    height: auto;
    align-content: center;
}

.subContenedorSearch {
    width: 80%;
    text-align: right;
}

.barraPeriodo {
    height: 35px;
    padding: 0px 5px 0px 5px;
}

    .barraPeriodo .form-control {
        border-right: 1;
        box-shadow: 0 0 0;
        border-color: var(--colorFormControl);
        background-color: var(--backgroundColorFormControl);
        color: white;
        font-size: small;
    }

/*Estilos para la barra de busqueda de areas externas al juzgado*/
/* Estilo para el contededor del formulario, input y boton de la barra de busqueda*/
.barra-BusquedaAreaExterna {
    display: inline;
    width: 700px;
    height: 35px;
    display: flex;
    float: left;
    padding: 0px 5px 0px 5px;
}

    /* Estilo para el formulario dentro de la barra de busqueda*/
    .barra-BusquedaAreaExterna form {
        display: block;
        width: inherit;
        background-color: var(--azul-principal);
        border-color: var(--azul-principal);
        border-right: 10px;
        box-shadow: 0 0 0;
        border-radius: 6px;
        border: 1px solid var(--azul-principal);
    }

    .barra-BusquedaAreaExterna .form-control {
        border-right: 0;
        box-shadow: 0 0 0;
        border-color: var(--azul-principal);
        background-color: var(--backgroundBarraBusqueda);
        color: var(--colorBarraBusqueda);
        font-size: small;
        height: inherit;
    }

    .barra-BusquedaAreaExterna button {
        width: 30px;
        border: 0;
        background: transparent;
    }
/* Estilo para el contededor del formulario, input y boton de la barra de busqueda*/
.barra-Busqueda {
    display: inline;
    width: 330px;
    height: 35px;
    display: flex;
    float: left;
    padding: 0px 5px 0px 5px;
}

    /* Estilo para el formulario dentro de la barra de busqueda*/
    .barra-Busqueda form {
        display: block;
        width: inherit;
        background-color: var(--azul-principal);
        border-color: var(--azul-principal);
        border-right: 10px;
        box-shadow: 0 0 0;
        border-radius: 6px;
        border: 1px solid var(--azul-principal);
        padding-left: 7px;
    }

    .barra-Busqueda .form-control {
        border-right: 0;
        box-shadow: 0 0 0;
        border-color: var(--azul-principal);
        background-color: var(--backgroundBarraBusqueda);
        color: var(--colorBarraBusqueda);
        font-size: small;
        height: inherit;
    }

    .barra-Busqueda button {
        width: 30px;
        border: 0;
        background: transparent;
    }

.noRegistro-hr {
    border-style: dashed;
    display: none;
}
/***************************************
    FIN ESTILOS PARA LA PAGINA LAYOUT
****************************************/


/**************************************
    ESTILOS PARA LOS DROPZONES
***************************************/

.dropzone {
    border: none !important;
    background-color: transparent !important;
}
/***************************************
    ESTILOS PARA LOS DROPZONES
****************************************/


/**************************************
    ESTILOS PARA LAS ESTADISTICAS
***************************************/

.descargaThumbnail {
    padding-top: 5px;
}

.pBotonDescargaEstadistica > button {
    width: 100%;
}

.extraEst {
    min-height: 60px;
}
/***************************************
    ESTILOS PARA LAS ESTADISTICAS
****************************************/


/*****************************************************
    ESTILOS PARA LOS LI DEL MENU IZQUIERDO DE LAYOUT
******************************************************/
/**
    Esta case se planea usar cuando se haga clic sobre uno de los menus para dejarlo seleccionado
**/
.divMenuActive {
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    padding: 5px 5px 8px 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    background-color: #F1F1F1;
}

.divMenu {
    padding: 5px 5px 8px 5px;
    margin-top: 5px;
    margin-bottom: 5px;
}

    .divMenu:hover {
        /*background-color: #F1F1F1;*/
        /*background-color: #D1C483;*/
        background-color: var(--olivo-primario);
    }

        .divMenu:hover > a {
            background-color: #D1C483;
            color: var(--colorMenuIzquierdoHover) !important;
            font-weight: bold !important;
            cursor: pointer;
            text-decoration: none;
        }

.divMenu_a {
    display: block !important;
    border: none !important;
    padding-left: 10px !important;
    background: none !important;
    white-space: normal !important;
    text-align: left !important;
    text-decoration: none !important;
    color: var(--colorMenuIzquierdo) !important;
    font-style: normal !important;
    font-size: var(--font-size-base) !important;
    font-weight: 100 !important;
    width: auto;
}

    /**
    Estilo que da un espacio para los menus y separar el texto de la imagen
**/
    .divMenu_a > div {
        width: 60px;
        min-width: 60px;
        height: 100%;
        float: left;
    }

#ContenedorPrincipalMenu {
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

.botonOculto {
    display: none;
}
/*****************************************************
 FIN ESTILOS PARA LOS LI DEL MENU IZQUIERDO DE LAYOUT
******************************************************/

/*****************************************************
  ESTILOS PARA EL MODAL DONDE SE MUESTRAN LOS PDF
******************************************************/

@media screen and (min-width: 768px) {
    #modalPDF .modal-dialog {
        width: 600px;
    }
}

/*oculta el footer cuando el ANCHO de pantalla es menor a 768px*/
@media screen and (max-width: 768px) {
    .footerSicee {
        display: none !important;
    }
}

@media screen and (min-height: 768px) {
    #modalPDF .modal-dialog {
        height: 600px;
    }
}

#modalPDF .modal-dialog {
    width: 90%;
}

#modalCKEditor .modal-body {
    padding: 20px 0px 20px 0px;
    min-height: 700px;
}

#modalPDF .modal-body {
    padding: 20px 0px 20px 0px;
    min-height: 800px;
}

/*#modalPDF #modalPDF_Contenido object {
    height: 600px;
}

#modalPDF #modalPDF_Contenido {
    height: 900px;
}*/
/*****************************************************
  FIN ESTILOS PARA EL MODAL DONDE SE MUESTRAN LOS PDF
******************************************************/
/********************************************
  ESTILOS PARA LA PAGINA DE INICIO DE SESION
*********************************************/
.tituloLogin {
    font-family: Cinzel;
    font-size: 23px;
    font-weight: 400;
    letter-spacing: 1pt;
    color: #ECECEC;
    text-shadow: 2px 2px 7px #000000;
}

.labelIniciarSesion {
    color: #ECECEC;
    font-family: Tahoma;
    padding-right: 15px;
}

.labelContraseña {
    color: #ECECEC;
    font-family: Tahoma;
}

    .labelContraseña:hover {
        color: var(--color-fondoPrincipal);
        font-weight: bold;
        text-decoration: solid;
        border-bottom: 1px dotted white;
    }

.login-control {
    width: 100%;
    font-size: 14px;
    line-height: 1.428571429;
    color: #826F28;
    vertical-align: middle;
    /*background-color: var(--color-fondoPrincipal);*/
    border: 1px solid #cccccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    font-weight: lighter;
}

.userLogin {
    background-image: url("Resources/Icons/user_icon.png") !important;
    background-repeat: no-repeat;
    background-position: 10px 10px;
    padding-left: 32px;
}

.passwordLogin {
    background-image: url("Resources/Icons/security_icon.png") !important;
    background-repeat: no-repeat;
    background-position: 10px 10px;
    padding-left: 32px;
}

.botonInicioSesion {
    height: 25px;
    color: white;
    background-color: var(--azul-principal);
    border: none;
    width: 100px;
    margin: 0px 10px 0px 10px;
    padding: 2px;
    font-weight: bold;
}

    .botonInicioSesion:hover {
        background-color: #826F28;
        color: white;
        font-weight: bold;
    }



.bodyLogin {
    background-image: url("/Resources/login_fondo.png");
    /*background-image: url("/Resources/login_fondo.jpg");*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
}

.containerLogin { /*estilo para el container del la vista layout para que abarque toda la pagina*/
    height: auto;
    min-height: 100%;
    padding-bottom: 65px; /*padding para que el container no se muestre atras del footer y da margen a mostrar el footer*/
    background: url(/Resources/login_fondo.png) no-repeat center center fixed;
    /*background: url(/Resources/login_fondo.jpg) no-repeat center center fixed;*/
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}

/********************************************
  FIN ESTILOS PARA LA PAGINA DE INICIO DE SESION
*********************************************/

/*************************************************************
   ESTILOS PARA ENCABEZADOS DE LOS ACORDIONES 
*************************************************************/
.cuerpoAcordion {
    margin-top: 5px;
    padding: 0px 10px 10px 10px;
    font-size:var(--font-size-base);
}

    .cuerpoAcordion label:not(.textoEncabezadoVistaExpediente), dt {
        color: var(--azul-principal);
        font-family: Tahoma;
        font-weight: 100;
    }

.textoEncabezadoAcordion {
    font-family: Artifika;
    font-size: var(--font-size-base);
    
    color: var(--azul-principal);
}

.encabezadoAcordion {
    margin: 0px 0px 5px 0px;
}

.imagenAbrirAcordion {
    float: right;
    margin-right: 10px;
    margin-top: 5px;
}

    .imagenAbrirAcordion:hover {
        background-color: var(--olivo-primario) !important;
    }

.contenedorEncabezadoAcordion {
    background-color: var(--contenedorEncabezadoAcordion);
    width: 100%;
    height: auto;
    min-height: 30px;
    margin: 0px;
    cursor: pointer;
}

.barraDerechaDiv {
    width: 100%;
    height: 30px;
    margin: 0px;
}

.barraDerechaHeader {
    display: block;
    float: left;
    width: 30%;
    height: 100%;
    min-height: 30px !important;
    margin: 0px;
    padding: 0px;
    background-color: var(--encabezadoAcordionGradiente4);
    border-radius: 0px 0px 0px 200px;
    -moz-border-radius: 0px 0px 0px 200px;
    -webkit-border-radius: 0px 0px 0px 200px;
    border: 0px solid #000000;
}


.barraDerechaHeader2 {
    display: block;
    float: left;
    width: 30%;
    height: 100%;
    min-height: 30px !important;
    margin: 0px;
    padding: 0px;
    background-color: var(--encabezadoAcordionGradiente4);
    border-radius: 0px 0px 0px 200px;
    -moz-border-radius: 0px 0px 0px 200px;
    -webkit-border-radius: 0px 0px 0px 200px;
    border: 0px solid #000000;
}

.barraIzquierdaHeader {
    display: block;
    overflow: hidden;
    float: left;
    width: 70%;
    height: 100%;
    min-height: 30px;
    margin: 0px;
    padding: 0.5% 0% 0px 2%;
    /* IE10+ */
    /*background-image: -ms-linear-gradient(top, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);*/
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(top, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);
    /* Opera */
    background-image: -o-linear-gradient(top, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.2, var(--encabezadoAcordionGradiente1)), color-stop(10.25, var(--encabezadoAcordionGradiente2)), color-stop(45.2, var(--encabezadoAcordionGradiente2)), color-stop(100, var(--encabezadoAcordionGradiente3)));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(top, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);
    /* W3C Markup */
    background-image: linear-gradient(to bottom, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);
    /*background-color: var(--azul-principal);*/
    border-radius: 20px 141px 0px 0px;
    -moz-border-radius: 20px 141px 0px 0px;
    -webkit-border-radius: 20px 141px 0px 0px;
    border: 0px solid #000000;
}

.barraIzquierdaHeader2 {
    display: block;
    overflow: hidden;
    float: left;
    width: 70%;
    height: 100%;
    margin: 0px;
    padding: 0.5% 0% 0px 2%;
    /* IE10+ */
    /*background-image: -ms-linear-gradient(top, #D6D6D6 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);*/
    /* Mozilla Firefox */
    background-image: -moz-linear-gradient(top, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);
    /* Opera */
    background-image: -o-linear-gradient(top, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);
    /* Webkit (Safari/Chrome 10) */
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.2, var(--encabezadoAcordionGradiente1)), color-stop(10.25, var(--encabezadoAcordionGradiente2)), color-stop(45.2, var(--encabezadoAcordionGradiente2)), color-stop(100, var(--encabezadoAcordionGradiente3)));
    /* Webkit (Chrome 11+) */
    background-image: -webkit-linear-gradient(top, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);
    /* W3C Markup */
    background-image: linear-gradient(to bottom, var(--encabezadoAcordionGradiente1) 0.2%, var(--encabezadoAcordionGradiente2) 10.25%, var(--encabezadoAcordionGradiente2) 45.2%, var(--encabezadoAcordionGradiente3) 100%);
    /*background-color: var(--azul-principal);*/
    border-radius: 20px 141px 0px 0px;
    -moz-border-radius: 20px 141px 0px 0px;
    -webkit-border-radius: 20px 141px 0px 0px;
    border: 0px solid #000000;
}

.barraHeader {
    text-align: center;
    font-weight: bold;
}

.contenidoAcordeon {
    border-radius: 15px;
    border-style: solid;
    border-width: 1px;
    padding: 0px 10px 0px 10px;
    margin: 0px -8px 0px -8px;
}
/*************************************************************
   FIN ESTILOS PARA ENCABEZADOS DE LOS ACORDIONES 
*************************************************************/

/*************************************************************
  ESTILOS PARA MOSTRAR DE TEMPLATE DE VISTA EXPEDIENTE
*************************************************************/
.contenedorVistaTemplate {
    width: 100%;
    padding: 10px;
    margin: 10px 0px 10px 0px;
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border: 1px solid #ADADAD;
    background-color: var(--color-fondoPrincipal);
}

._vistaTemplate {
    padding: 6px 6px 6px 6px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 1px solid #abb3b9;
    margin-top: 5px;
}

    /*._vistaTemplate:nth-of-type(odd) {
        background-color: #FAFAFA;
    }*/

    ._vistaTemplate:nth-of-type(even) .btn-Vista {
        background-color: var(--fondo-btn-general) !important;
    }

    ._vistaTemplate:hover {
        background-color: var(--colorDcoumentosHover);
    }

    /*._vistaTemplate:nth-of-type(odd) {
        background-color: #FAFAFA;
    }*/

    ._vistaTemplate:nth-of-type(even) .btn-Vista {
        background-color: var(--fondo-btn-general) !important;
    }

.bntGroup-vistaTemplate {
    vertical-align: middle;
}

.encabezadoPromocion {
    background-color: transparent;
    background-color: red;
    color: var(--colorGris);
}

.contenedorEncabezadoPromocion {
    background-color: yellow;
    width: 100%;
    height: 30px;
    margin: 0px;
}

.textoEncabezadoVistaExpediente {
    font-family: Tahoma;
    font-weight: bolder;
    font-size: 14px;
    color: var(--azul-principal);
    padding: 5px;
}

.barraIzquierdaPromocion {
    display: inline-block;
    overflow: hidden;
    float: left;
    width: 35%;
    height: 100%;
    margin: 0px;
}

.barraDerechaPromocion {
    display: block;
    float: left;
    width: 65%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    background-color: blue;
}

.imagenAbrirPromocion {
    float: right;
}

.botoneraVistaTemplate {
    background-color: transparent !important;
}

    .botoneraVistaTemplate .btn-Vista {
        border-color: transparent !important;
        background-color: var(--fondo-btn-general) !important;
        text-align: center;
        vertical-align: middle;
        color: var(--textoOscuro) !important;
    }

    .botoneraVistaTemplate .btn-Vista {
        border-right-color: transparent !important;
        color: var(--azul-principal) !important;
    }

        .botoneraVistaTemplate .btn-Vista:hover {
            color: var(--azul-principal) !important;
            border-color: var(--colorGris) !important;
            background-color: var(--olivo-primario) !important;
        }


    .botoneraVistaTemplate .btn-Vista-Warning {
        border-color: transparent !important;
        /*background-color: #fbebe6 !important;*/
        /*background-color: #e0e7ed !important;*/
        background-color: #ECECEC !important;
        text-align: center;
        vertical-align: middle;
        color: var(--textoOscuro) !important;
    }

        .botoneraVistaTemplate .btn-Vista-Warning:hover {
            background-color: #cb693a !important;
            border-color: #802f08 !important;
        }

.btnResaltado {
    background-color: #d8cdb0 !important;
    text-align: center;
    vertical-align: middle;
    color: var(--textoOscuro) !important;
}

    .btnResaltado:hover {
        background-color: var(--olivo-primario) !important;
    }



.btn-VerMas {
    background-color: #ECECEC;
    border: 1px solid #ADADAD;
    font-family: Tahoma;
    padding: 2px;
    margin: 5px 0px 1px 0px;
}

    .btn-VerMas:hover {
        background-color: var(--azul-principal);
        color: var(--color-fondoPrincipal);
    }

.listaCadenas {
    margin-bottom: 5px;
}

.botonBlock {
    height: 35px !important;
}

.btn-listaCadenas {
}

ul {
    list-style-type: none;
}


/*************************************************************
   FIN ESTILOS PARA MOSTRAR DETALLES DE PROMO EN EXPEDIENTE
*************************************************************/

/*************************************************************
   ESTILOS OFICIALIA COMUN DE PARTES
*************************************************************/

#indexDemandas {
    margin-top: 20px;
}

.contenedorInteriorColumna {
    margin: 10px 2px 10px 2px;
}

.btn-General,
li a.btn-General {
    border: solid var(--azul-principal) 1px;
    color: var(--colorTextoBtnGeneral);
    font-family: Tahoma;
    background-color: var(--fondo-btn-general);
    height: auto;
    min-height: 40px;
    font-size: var(--font-size-base);
}

    .btn-General:hover {
        background-color: var(--fondo-btn-generalHover);
        color: white;
    }

    .btn-General:active {
        background-color: #ADADAd;
        color: var(--azul-secundario);
    }

.btn-General-Active {
    background-color: #adcce5;
    color: var(--azul-secundario) !important;
}

    .btn-General-Active:hover {
        background-color: #568fbd;
        color: white !important;
    }

/*Cuando una accion en un es sensible se usara esta clase para indicar al usuario que hay riesgo*/
.btn-General-Danger {
    border: solid var(--azul-principal) 1px;
    color: var(--azul-principal);
    font-family: Tahoma;
    background-color: #ff6961;
    height: 40px;
    font-size: var(--font-size-base);
}

    .btn-General-Danger:hover {
        background-color: var(--azul-principal);
        color: white;
        border: solid #b94a48 1px;
    }

    .btn-General-Danger:active {
        background-color: #ADADAD;
        color: #b94a48;
        border: solid #b94a48 1px;
    }


.ColorOlivo {
    background-color: #826F28 !important;
    color: white !important;
}

    .ColorOlivo:hover {
        background-color: var(--olivo-primario) !important;
    }

.ColorAzulPJ {
    background-color: var(--azul-principal) !important;
    color: white !important;
}

    .ColorAzulPJ:hover {
        background-color: white !important;
        color: var(--azul-principal) !important;
    }

.BtnVerdeAzul {
    background-color: green !important;
    color: white !important;
}

    .BtnVerdeAzul:hover {
        background-color: var(--azul-principal) !important;
    }

.BtnVerde {
    background-color: #308330 !important;
    color: white !important;
    border-color: green;
}

    .BtnVerde:hover {
        background-color: #826F28 !important;
        border-color: #9D7E2D;
    }

.BtnVerdePastel {
    color: var(--textoOscuro) !important;
    background-color: #5dc661 !important;
    border-color: #5dc661;
}

    .BtnVerdePastel:hover {
        background-color: #42893b !important;
        border-color: darkgreen;
    }

.BtnVerdePastelTituloDocs {
    border-color: transparent !important;
    text-align: center;
    vertical-align: middle;
    color: var(--textoOscuro);
    background-color: #5b9055 !important;
}

    .BtnVerdePastelTituloDocs:hover {
        background-color: #5cb85c !important;
        border-color: #4CAF50 !important;
        color: var(--textoOscuro);
    }

.BtnGris {
    background-color: var(--backgroundBtnGris) !important;
    color: var(--colorTextoBtnGeneral) !important;
}

    .BtnGris:hover {
        background-color: #858483 !important;
    }

.BtnDanger {
    background-color: #ff6961 !important;
}

    .BtnDanger:hover {
        background-color: #FF321E !important;
    }

.BtnWarningPastel {
    background-color: #ffbb9c !important;
    color: var(--azul-secundario);
}

    .BtnWarningPastel:hover {
        border-color: var(--azul-principal) !important;
        background-color: #cb693a !important;
        color: var(--textoOscuro);
    }

.BtnDangerDark {
    background-color: #9c0e00 !important;
    color: white !important;
}

    .BtnDangerDark:hover {
        background-color: #FF321E !important;
    }

.TxtVerde {
    background-color: darkseagreen !important;
    color: black;
}

/*.textoVerde {
    color: green;
}*/

.TextoVerde {
    color: #38833c !important;
    font-weight: bold !important;
}

.btn-General-Opacity {
    border: solid var(--azul-principal) 1px;
    background-color: #9cadbb;
    color: var(--azul-secundario);
    font-family: Tahoma;
    height: 40px;
}

    .btn-General-Opacity:hover {
        background-color: var(--azul-secundario);
        color: white;
        font-family: Tahoma;
        height: 40px;
    }

    .btn-General-Opacity:active {
        background-color: var(--azul-secundaria);
    }


.btn-sm-General {
    line-height: 1.5;
    border-radius: 3px;
    height: auto;
    min-height: 30px;
    padding: 2px 7px 2px 7px;
    margin: 0px 3px 0px 3px;
    font-size: 14px;
    border: solid var(--azul-principal) 1px;
    color: var(--colorTextoBtnGeneral);
    font-family: Tahoma;
    background-color: var(--fondo-btn-general);
}

    .btn-sm-General:hover {
        background-color: var(--fondo-btn-generalHover);
        color: white;
    }

    .btn-sm-General:active {
        background-color: #ADADAd;
        color: var(--azul-principal);
    }

.BorderDegradadoBtnGeneral {
    border: solid #8fa8bd 1px;
}

.btn-sm-warning {
    line-height: 1.5;
    border-radius: 3px;
    height: 30px;
    padding: 2px 7px 2px 7px;
    margin: 0px 3px 0px 3px;
    font-size: 14px;
    border: solid #f58c00 1px;
    color: var(--azul-secundario);
    font-family: Tahoma;
    background-color: #fca633;
}

    .btn-sm-warning:hover {
        background-color: var(--azul-principal);
        color: white;
    }

    .btn-sm-warning:active,
    .btn-sm-warning.active {
        -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    }

.btn-xsm-General {
    height: 25px;
    padding: 2px 7px 2px 7px;
    margin: 0px 2px 0px 2px;
    font-size: 12px;
    border: solid var(--azul-principal) 1px;
    color: var(--colorTextoBtnGeneral);
    font-family: Tahoma;
    background-color: var(--fondo-btn-general);
}

.btn-xsm-NoBorder {
    height: 25px;
    padding: 2px 7px 2px 7px;
    margin: 0px 2px 0px 2px;
    font-size: 12px;
    color: var(--azul-principal);
    font-family: Tahoma;
    background-color: white;
}

    .btn-xsm-NoBorder:hover {
        background-color: var(--azul-principal);
        color: white;
    }

.btn-xsm-General:hover {
    background-color: var(--fondo-btn-generalHover);
    color: white;
}

/*sm-danger*/
.btn-sm-danger {
    color: var(--color-fondoPrincipal);
    background-color: #d9534f;
    border-color: #924D51;
    border: solid var(--azul-principal) 1px;
    font-family: Tahoma;
    font-size: 14px;
    height: 30px;
    padding: 2px 7px 2px 7px;
    line-height: 1.5;
}

    .btn-sm-danger:hover,
    .btn-sm-danger:focus,
    .btn-sm-danger:active,
    .btn-sm-danger.active,
    .open .dropdown-toggle.btn-sm-danger {
        color: var(--color-fondoPrincipal);
        background-color: #d2322d;
        border-color: #ac2925;
    }

    .btn-sm-danger:active,
    .btn-sm-danger.active,
    .open .dropdown-toggle.btn-sm-danger {
        background-image: none;
    }

/*sm-danger*/






.btn-GeneralGroup {
    border: none;
    color: var(--colorTextoBtnGeneral) !important;
}

    .btn-GeneralGroup:hover {
        color: white !important;
    }

hr {
    border-color: #ADADAD;
}


#actions {
    margin-bottom: 10px;
}

.dragDropArea {
    margin: 0px !important;
    color: var(--azul-secundario);
}

.tituloIndividual {
    font-family: CinzelRegular;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 2pt;
    color: var(--azul-principal);
}

.eliminar-header-pregunta {
    font-family: CinzelRegular;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: 2pt;
    color: var(--azul-principal);
}

.textarea-observaciones {
    width: 100%;
    resize: vertical;
    max-height: 200px;
    min-height: 70px;
}

.chosen-container {
    width: 100% !important;
}

.form-control {
    width: 100%;
}

.fechaControl {
    width: 100%;
}

.demanda-duplicada {
    margin-bottom: 10px;
    padding: 5px;
    width: 100%;
    background-color: var(--color-fondoPrincipal);
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    border: 1px solid var(--azul-principal);
}

.TablaDuplicas {
    width: 100%;
}

    .TablaDuplicas tr {
        margin: 0px 5px 0px 0px;
        padding: 0px 5px 0px 0px;
    }

    .TablaDuplicas .tituloDuplicado {
        font-weight: bold !important;
        width: 150px;
    }

    .TablaDuplicas .headerDuplicado {
        background-color: transparent !important;
        text-align: center;
        align-content: center;
    }

        .TablaDuplicas .headerDuplicado > label {
            font-weight: bold;
        }

    .TablaDuplicas .radioDuplicado {
        text-align: center;
    }
/*************************************************************
   FIN ESTILOS OFICIALIA COMUN DE PARTES
*************************************************************/

/*************************************************************
   ESTILOS PARA LOS PRESTAMOS
*************************************************************/

.contenedor-solicitud {
    margin-bottom: 10px;
    padding: 5px;
    width: 100%;
    background-color: var(--color-fondoPrincipal);
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    border: 1px solid var(--azul-principal);
}

.colTitulo {
    padding-left: 35px;
}

.tituloHPrestamo {
    color: #1A3853;
    margin-top: 5px;
}

/*************************************************************
   FIN ESTILOS PARA LOS PRESTAMOS
*************************************************************/

/*********************************************************************
INICIO ESTILOS PARA LA SELECCION DE MINIFORMS EXISTENTES EN ACUERDOS
**********************************************************************/

.tablaSlider {
    width: 100%;
    vertical-align: top;
    align-content: center;
}

.tablaSlider-izq {
    width: 30px;
}

.tablaSlider-der {
}

.tablaSlider-cent {
    width: 100%;
}

.slideButton {
    background-color: var(--azul-principal);
    opacity: 0.75;
    height: 100px;
    width: 30px;
    display: block;
    color: white;
}

/*********************************************************************
FIN ESTILOS PARA LA SELECCION DE MINIFORMS EXISTENTES EN ACUERDOS
*********************************************************************/

/*********************************************************************
    ESTILOS PARA SECCION DE ADMINISTRACION DE ROLES
**********************************************************************/

.panelHeadRoles {
    display: block;
    cursor: pointer;
    background-color: var(--azul-principal) !important;
    color: var(--color-fondoPrincipal) !important;
}

.panelPermisos {
    margin-bottom: 5px;
    border-color: var(--azul-principal);
}

.panel-body {
    padding-top: 5px;
    padding-bottom: 5px;
}

.panelModulo {
    border-color: #9D7E2D;
    margin-bottom: 5px;
}

    .panelModulo .panel-heading {
        background-color: #ECECEC;
        color: var(--colorGris);
        padding-top: 3px;
        padding-bottom: 1px;
    }

    .panelModulo .control-label {
        color: var(--colorGris);
    }

    .panelModulo .panel-title {
        font-weight: bold;
    }

    .panelModulo .panel-body {
        padding: 0px;
    }

    .panelModulo .breadcrumb {
        margin-bottom: 0px;
        padding-top: 0px;
        padding-bottom: 4px;
    }

    .panelModulo .badgeArea {
        background-color: var(--color-fondoPrincipal) !important;
    }

.panelHeadRoles .panel-title {
    font-weight: bold !important;
}
/*********************************************************************
    FIN ESTILOS PARA SECCION DE ADMINISTRACION DE ROLES
**********************************************************************/



/********************************************************************************************************/

body {
    padding-top: 0px;
    padding-bottom: 0px;
}
/****************************************************************************/
/* Set padding to keep content from hitting the edges */
.body-content {
    /*padding-left: 15px;
    padding-right: 1px;*/
    padding-left: 10px;
    padding-bottom: 15px;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    width: 100%;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    /*max-width: 280px;*/
}

/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}

/*#####################################*/
/*CSS para los titulos internos*/
.tituloInterno {
    width: 100%;
    background-color: #EAEAEA;
    padding: 5px 15px 5px 15px;
    color: var(--azul-principal);
}

    .tituloInterno:hover {
        cursor: pointer;
        background-color: #EBEBEB;
    }

.botonMostrarOcultar {
    text-align: right;
    font-weight: bold;
    font-size: 14pt;
    color: var(--azul-principal);
}

/*este estilo se genero para las celdas del Expediente donde va colocado el titulo de cada campo*/
.tituloCampo {
    width: 20%;
}

.contenidoCampo {
    font-weight: bold;
    width: 30%;
}

/*contenido de la pagina web*/
.contenido {
    float: left;
    border: 1px solid #5D5B5C;
    padding: 10px 10px 10px 10px;
    margin-left: 8px;
    border-radius: 4px;
    width: 77%;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/*Estilos para el div Container de una pagina externa*/
.contenidoExterno {
    float: left;
    border: 1px solid #5D5B5C;
    padding: 10px 10px 10px 10px;
    margin-left: 8px;
    border-radius: 4px;
    width: 100%;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.menuPrincipal {
    border: 1px solid #B59E61;
    width: 20%;
    border-radius: 4px;
    float: left;
    height: 100%;
    color: var(--colorGris);
}



.divSup {
    background: var(--azul-principal);
    height: 25px;
}

.marron {
    color: #924D51;
    font-weight: bold;
}

/*css para el encabezado del inicio de sesion*/
.encabezadoExterno {
    /*background: -webkit-linear-gradient(#AA5D04, #D3993A);
    background: -moz-linear-gradient(#AA5D04, #D3993A);
    background: -o-linear-gradient(#AA5D04, #D3993A);*/
    height: auto;
    align-content: center;
    text-align: center;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/*div para el titulo*/
.divTitulo {
    display: inline-table;
    background-color: transparent;
    align-content: center;
    text-align: center;
    width: 100%;
    color: #924D51;
}
/*div para el titulo de la pagina externa*/
.divTituloExterno {
    display: inline-table;
    background-color: transparent;
    align-content: center;
    text-align: center;
    width: 100%;
    color: white;
}

.contenedor {
    width: 100%;
    margin: 0 auto;
}
/*div para el contenido del login del sitio*/
.divLogin {
    align-content: center;
    width: 100%;
    text-align: center;
}
/*******************************************************/
/*divBody*/
/*******************************************************/
.divBody {
    background-image: url("/Resources/fondo_general.png");
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 90%;
}


/*CSS para el catalogo de datos*/
.verArchivo {
    border: 1px solid var(--azul-principal);
    border-radius: 4px;
    width: 60%;
    min-width: 20%;
    align-content: center;
    padding: 5px 5px 5px 25px;
    font: 700;
}

    .verArchivo:hover {
        background-color: var(--azul-principal);
        color: white;
        cursor: pointer;
        font-weight: bold;
    }

.contentCatalogoDatos {
    border: 1px solid #B59E61;
    border-top: none;
    /*padding-left: 20px;*/
    width: 100%;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.opcionCatalogoDatos {
    margin-top: 2px;
    padding-top: 4px;
    height: 40px;
    padding-bottom: 4px;
    background-color: #ECECEC;
    padding-left: 30px;
    margin-bottom: 0px;
    border: 1px solid #B59E61;
}

    .opcionCatalogoDatos:hover {
        cursor: pointer;
        background-color: #F1F1F1;
        color: var(--azul-principal);
    }

#campoExtra::after {
    overflow: unset !important;
}

body {
}



.btn-sm-delete {
    line-height: 1.5;
    border-radius: 3px;
    height: 30px;
    padding: 2px 7px 2px 7px;
    margin: 0px 3px 0px 3px;
    font-size: 14px;
    border: solid var(--azul-principal) 1px;
    color: var(--azul-principal);
    font-family: Tahoma;
    background-color: white;
}

    .btn-sm-delete:hover {
        background-color: #ffa13a;
        color: white;
    }

    .btn-sm-delete:active {
        background-color: #ADADAD;
        color: var(--azul-principal);
        border: none !important;
    }

.boton_warning {
    color: var(--textoOscuro) !important;
    background-color: #fae1bf !important;
    border-color: #ececec !important;
}

    .boton_warning:hover {
        background-color: #ed9c28 !important;
        border-color: #d58512 !important;
    }

.right_align {
    text-align: right !important;
}

.modalCapturaParteExterna {
    width: 40%;
}

.text-right {
    text-align: right;
}

.TextLoading {
    color: var(--azul-principal);
    font-weight: bold;
    font-family: Tahoma !important;
}

.textDager {
    color: var(--colorTextoDager) !important;
}

.TitleSmallText {
    font-size: 8pt;
}

#float {
    position: fixed;
    top: 3em;
    right: 2em;
    z-index: 100;
}

.activeButton {
    background-color: #d8cdb0;
    color: var(--azul-principal);
}

.ColorTextoPrimario {
    color: var(--colorPrincipalBody);
    font-family: Tahoma !important;
}

.modal-mini-centered {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transition: all 0.3s;
}

.modal-mini-content {
    background-color: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 0.5rem;
}

.btn-link {
    line-height: 1.5;
    border-radius: 3px;
    height: 25px;
    padding: 2px 7px 2px 7px;
    margin: 0px 3px 0px 3px;
    font-size: 14px;
    color: var(--textoOscuro);
    font-family: Tahoma;
    background-color: white;
}

    .btn-link:hover {
        background-color: var(--azul-principal);
        color: white;
    }

    .btn-link:active {
        background-color: #ADADAD;
        color: var(--azul-principal);
    }

.tituloDocumentoExpedienteSelected {
    background-color: var(--tituloDocumentoExpedienteSelected);
}

.requiredValue {
    color: #ed0a0a !important;
}

.bold-decoration {
    font-weight: bold !important;
}

.is-required:after {
    content: '*';
    margin-left: 3px;
    color: red;
    font-weight: bold;
}

.pull-right > .dropdown-menu {
    right: 0;
    left: auto;
}

.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
    border-top: 0;
    border-bottom: 4px solid #000000;
    content: "";
}

.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-bottom: 1px;
}


.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
    margin-left: 3px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

.dropup .dropdown-submenu > .dropdown-menu {
    top: auto;
    bottom: 0;
    margin-top: 0;
    margin-bottom: -2px;
    -webkit-border-radius: 5px 5px 5px 0;
    -moz-border-radius: 5px 5px 5px 0;
    border-radius: 5px 5px 5px 0;
}

.dropdown-submenu > a:after {
    display: block;
    float: right;
    width: 0;
    height: 0;
    margin-top: 5px;
    margin-right: -10px;
    border-color: transparent;
    border-left-color: #cccccc;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    content: " ";
}

.dropdown-submenu:hover > a:after {
    border-left-color: var(--color-fondoPrincipal);
}

.dropdown-submenu.pull-left {
    float: none;
}

    .dropdown-submenu.pull-left > .dropdown-menu {
        left: -100%;
        margin-left: 10px;
        -webkit-border-radius: 6px 0 6px 6px;
        -moz-border-radius: 6px 0 6px 6px;
        border-radius: 6px 0 6px 6px;
    }


.navbar .nav li.dropdown > a:hover .caret,
.navbar .nav li.dropdown > a:focus .caret {
    border-top-color: #333333;
    border-bottom-color: #333333;
}

.navbar .nav li.dropdown.open > .dropdown-toggle,
.navbar .nav li.dropdown.active > .dropdown-toggle,
.navbar .nav li.dropdown.open.active > .dropdown-toggle {
    color: #555555;
    background-color: #e5e5e5;
}

.navbar .nav li.dropdown > .dropdown-toggle .caret {
    border-top-color: #777777;
    border-bottom-color: #777777;
}

.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret {
    border-top-color: #555555;
    border-bottom-color: #555555;
}

.navbar .pull-right > li > .dropdown-menu,
.navbar .nav > li > .dropdown-menu.pull-right {
    right: 0;
    left: auto;
}

    .navbar .pull-right > li > .dropdown-menu:before,
    .navbar .nav > li > .dropdown-menu.pull-right:before {
        right: 12px;
        left: auto;
    }

    .navbar .pull-right > li > .dropdown-menu:after,
    .navbar .nav > li > .dropdown-menu.pull-right:after {
        right: 13px;
        left: auto;
    }

    .navbar .pull-right > li > .dropdown-menu .dropdown-menu,
    .navbar .nav > li > .dropdown-menu.pull-right .dropdown-menu {
        right: 100%;
        left: auto;
        margin-right: -1px;
        margin-left: 0;
        -webkit-border-radius: 6px 0 6px 6px;
        -moz-border-radius: 6px 0 6px 6px;
        border-radius: 6px 0 6px 6px;
    }

.hr-menu {
    margin-top: 5px;
    margin-bottom: 5px;
    border: 0;
    border-top: 1px solid #eeeeee;
}

.BtonLigaInteres {
    width: 100%;
    height: 80%;
    text-align: center;
    -webkit-border-radius: 6px 6px 6px 6px;
    -moz-border-radius: 6px 6px 6px 6px;
    border-radius: 6px 6px 6px 6px;
    padding-top: 15%;
    padding-bottom: 15%;
    border: 2px solid white;
}

    .BtonLigaInteres:hover {
        opacity: 0.7;
        cursor: pointer;
        border: 2px solid var(--azul-principal);
    }



.TituloLigasInteres {
    line-height: 1.5;
    font-size: 14px;
    color: var(--azul-principal);
    font-family: Tahoma;
    font-weight: bold;
    text-align: center;
    width: 100%;
}

.wrap-button {
    white-space: normal !important; /* Permite saltos de línea dentro del botón */
    word-wrap: break-word; /* Ajusta palabras largas */
    overflow-wrap: break-word; /* Asegura soporte adicional */
    display: inline-block; /* Asegura que el botón se ajuste a su contenido */
    text-align: center; /* Centra el texto dentro del botón */
    padding: 10px; /* Ajusta el espacio interno */
    width: auto; /* Deja que el ancho se ajuste automáticamente */
    max-width: 300px; /* Establece un ancho máximo para evitar botones gigantes */
    height: auto; /* Permite que la altura se ajuste al contenido */
    overflow: hidden; /* Evita cualquier desbordamiento no deseado */
    box-sizing: border-box; /* Incluye padding y borde en las dimensiones totales */
}

.tansform {
}

.transform:hover {
    transform: scale(1.1); /* Aumenta el tamaño en un 10% */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3); /* Sombra para dar efecto de elevación */
}

.adicional-submenu {
    margin-left: 0px !important;
}



.grupo {
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 8px;
    margin: 15px 0;
    position: relative;
}

.titulo {
    position: absolute;
    top: -12px;
    left: 15px;
    background: white;
    padding: 0 8px;
    font-size: 14px;
    font-weight: bold;
    color: var(--azul-secundario);
    background-color: transparent;
}


/*sobreescribir las clases para el popover en el modo oscuro*/
[data-theme="dark"] .popover {
    background-color: #1f1f1f;
    border-color: #444;
    color: #e5e5e5;
}

[data-theme="dark"] .popover-title,
[data-theme="dark"] .popover .popover-title {
    background-color: #2a2a2a !important;
    color: #fff !important;
    border-bottom: 1px solid #444 !important;
}

[data-theme="dark"] .jumbotron {
    background-color: var(--backgroundModal);
}

[data-theme="dark"] .TextoVerde {
    color: #0c420f !important;
    font-weight: bold !important;
}

[data-theme="dark"] .BtnWarningPastel {
    background-color: #dc6630 !important;
    color: white !important;
}
[data-theme="dark"] .BtnWarningPastel:hover  {
    background-color: #923812 !important;
    color: white !important;
}

.contenedorEstadistica{
    background-color: var(--backgroundModal) !important;
}

[data-theme="dark"] .form-control[disabled],
[data-theme="dark"] .form-control:disabled {
    color: #cccccc !important; /* color del texto */
    -webkit-text-fill-color: #cccccc !important; /* necesario para Chrome */
    opacity: 1 !important; /* evita que Bootstrap lo vuelva gris claro */
    background-color: #444; /* opcional: fondo oscuro */
}


body, button, input, select, textarea, .form-control, .btn {
    font-size: var(--font-size-base);
}

.form-control{
    min-height: 34px !important;
    height: auto;
    min-width: 100pt !important;
    /*width:auto;*/
}

/*ajustar ancho del dt y dd para que el texto del dt quepa un poquito mejor*/
@media (min-width: 768px){
    .dl-horizontal dt {
        width: 260px !important;
    }
.dl-horizontal dd {
    margin-left: 280px !important;
}
}

.label-warning {
    background-color: #f0ad4e;
    color: var(--azul-secundario) !important;
}

@media (max-width: 768px) {
    .btn-sm-General,
    .btn-General
    {
        padding: 10px 16px;
        font-size: 16px;
        border-radius: 6px;
    }
    .opcionesExterna,
    .btn_submenu {
        padding: 14px 16px;
        font-size: 16px;
        border-radius: 6px;
    }
}