@charset "UTF-8";
@media screen and (max-width: 425px){
    .header-centrado {
        text-align: start !important;
        width: 80% !important;
    }
    .img-header-dos {
        width: 85% !important;
    }

}

@media screen and (max-width: 355px) {
    .img-header {
        width: 100%;
    }
    .header-idu{
        font-size: 8px !important;
    }
}

/*
/* Esta hoja de estilos es utilizada por el header de la aplicacion para que el header permanezca presente en la pagina en la parte superior cuando
   en la pantalla se hace un scroll. El style .header es utilizado en el div del default.xhtml y el style .sticky es utilizado en el javascript onScrollHeader.js  */

/* Style the header */
.header {
    padding: 5px 2%;
    /* Antes era height:70px fijo. El nombre del ciudadano (#lblLogueadoNombre) y su
       rol (#lblLogueado, ver menu.xhtml) viven dentro de esta caja y usan la columna
       "ui-md-4"/"ui-lg-5" del panelGrid de dos columnas (ver #header en default.xhtml)
       -- en tablet (701px-1024px, donde esa columna es más angosta que en escritorio)
       nombre+rol se parten en más líneas de las que caben en 70px, y ese sobrante
       se desbordaba encima del menú de pestañas (Mi Llave/Trámites/...) que viene
       justo después en el documento. min-height conserva el alto original cuando el
       contenido cabe (como en escritorio), pero deja crecer la caja cuando no cabe. */
    min-height: 70px;
    height: auto !important;
    background: #901645;
    color: #f1f1f1;
    flex: 0 0 auto;
}

.line {
    float: left;
    width: 0.3px !important;
    height: 34.6px;
    border-right: solid 2px #898d8d;
    margin: 5px auto !important;
    padding-left: 10px !important;
}

.header-idu{
    font-family: 'Inter';
    font-size: 9px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.17;
    letter-spacing: normal;
    color: #898d8d;
    margin: 5px auto !important;
    padding: 10px 10px; 
}

.divicion {
    margin: 0 auto;
    width: 100%;
    height: 32px !important;
    background: #f8f8f8;
}

/* Page content */
.content {
    padding: 0px;
    width: 100%;
    height: 90%;
    flex: 0 0 auto;
}
.contenido{
    width: 100%;
    height: 90%;
    flex: 0 0 auto;

}

/* The sticky class is added to the header with JS when it reaches its scroll position */
.sticky {
    position: fixed;
    top: 0;
    width: 100%
}

/* Add some top padding to the page content to prevent sudden quick movement (as the header gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
    padding-top: 102px;
} 