/* ----------- MENU ----------- */
.divNavegacion  
{
    float: right; 
    padding-top: 9px; 
    padding-left: 30px;
}

.divDXNavegacion {
    float: left;
    padding-top: 9px;
    padding-left: 30px;
}

.menuNavegacion {
    height: 41px;
    font-weight: bold;
    font-family: "Gill Sans", sans-serif;
}

.menuDXNavegacion {
    height: 41px;
    font-weight: bold;
    font-family: "Gill Sans", sans-serif;
}

.menuNavegacion, .menuNavegacion ul 
{
    margin: 0;
    padding: 0;
    list-style-type: none; 
    list-style-position: outside; 
    position: relative; 
    line-height: 40px; 
}

.menuDXNavegacion, .menuDXNavegacion ul 
{
    margin: 0;
    padding: 0;
    list-style-type: none; 
    list-style-position: outside; 
    position: relative; 
    line-height: 40px; 
}

.menuNavegacion a 
{
    display: block;
    font-size: 11px; 
    /*font-weight: normal;*/ 
    float: left; 
    line-height: 18px; 
    outline: medium none; 
    padding: 8px 2px 2px 2px; 
    text-decoration: none; 
    width: auto; 
    min-height: 35px;
}

.menuNavegacion li a 
{ 
    text-transform: uppercase; 
    letter-spacing: 1px; 
    /*font-size: 7pt;*/ 
    color:#777; 
    text-decoration:none;
}

.menuNavegacion li a strong 
{ 
    display: block; 
    font-weight:normal;
}

.menuNavegacion li
{ 
    float: left; 
    position: relative; 
    z-index: 5;
    margin-right: 12px; 
    background: none; 
    list-style: none; 
    padding:0;
}

.menuNavegacion ul
{ 
    display: none; 
    position: absolute; 
    top: 35px; 
    width: 192px; 
    padding-top:0px;
    right: 0px;
}

    .menuNavegacion li ul a {
        width: 148px;
        height: auto;
        float: left;
        text-align: left;
        line-height: 15px;
        padding: 4px 21px;
        min-height: 15px;
        font-size: 9px;
        font-weight: normal;
    }

.menuNavegacion ul ul
{ 
    top: auto; 
    padding-top: 0px !important;
}

.menuNavegacion li ul ul
{ 
    left: 191px; 
    top: 0px;
}

.menuNavegacion li:hover ul ul, 
.menuNavegacion li:hover ul ul ul, 
.menuNavegacion li:hover ul ul ul ul
{ 
    display: none;
}

.menuNavegacion li:hover ul, 
.menuNavegacion li li:hover ul, 
.menuNavegacion li li li:hover ul, 
.menuNavegacion li li li li:hover ul
{ 
    display: block;
}

.menuNavegacion ul li a
{ 
    border: 1px solid #ddd; 
    border-bottom: none; 
    color: #888;
    background: #fff;
}

    .menuNavegacion li a:hover {
        color: darkorange;
        border-bottom-style: none;
        border-top-style: solid;
        border-bottom-width: medium;
    }

        .menuNavegacion li a:hover.imghome {
            border-bottom-style: none;
            border-top-style: none;
        }

    .menuNavegacion ul li a:hover {
        color: white;
        /*background-color: gray;*/
        background-color: darkorange;
        border-bottom-style: none;
        border-radius: 0px;
    }

.menuNavegacion ul
{ 
    background: #ddd; 
    border-bottom: 1px solid #ddd;
}

.menuNavegacion .current-menu-item a strong	
{
    color: #444; 
    font-weight: bold;
}

/* ------------------------------------------------------- */
/* ----------- MENU ACCIONES ----------- */

.divDataGridAcciones
{
    height: 35px;
}

.divAcciones
{
    clear: both;
    float: left;
    width: 100%;
    padding-top: 0px;
    padding-bottom: 4px;
    height: 26px;
    text-align: center;
    border-color: #00C1EF;
    border-style: solid;
    border-width: thin;
    border-left: 0 none;
    border-right: 0 none;
    border-top: 0 none;
    border-bottom: 0 none;
    vertical-align: middle;
    /*font-family: "Lucida Grande" , "Lucida Sans Unicode" ,Arial,Helvetica,sans-serif;*/
    font-size: 12px;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: normal;
}

.menuAccion  
{
    float: left;
    left: 50%;
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    position: relative;
    height: 41px;
    /*font-family: Tahoma, Geneva, sans-serif;*/
}

.menuAccion, .menuAccion ul 
{
    margin: 0;
    padding: 1px;
    list-style-type: none; 
    list-style-position: outside; 
    position: relative; 
    line-height: 40px; 
    border: 0 none;
    outline: medium none;
}

.menuAccion a
{
    text-decoration: none;
    color: #FFFFFF;
    background: #0095cd;
	background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5));
	background: -moz-linear-gradient(top,  #00adee,  #0078a5);
    display: block;
    padding: 3px 10px 4px;
    text-align: center;
    border: 1px solid #ACCFE8;
    border-width: 1px 1px 1px 0;
    font-weight: normal;
    float: left;
    line-height: 18px;
    width: auto;
    border-left: 1px solid #ACCFE8;
    outline: medium none;
    min-height: 19px;
}

.menuAccion a:hover
{
    background: #DBEBF6;
    color: #000000;
}

.menuAccion li a
{
    text-transform: none;
    letter-spacing: 1px;
    font-size: 8pt;
    color: #FFFFFF;
    text-decoration: none;
}

.menuAccion li a strong 
{ 
    display: block; 
    font-weight:normal;
}

.menuAccion li
{ 
    float: left; 
    position: relative; 
    right: 50%;
    z-index: 1; 
    margin-right: 0px; 
    margin-bottom: 0px;
    background: none; 
    list-style: none; 
    padding:0;
    border: 0 none;
    outline: medium none;
}

.menuAccion ul
{ 
    display: none; 
    position: absolute; 
    top: 28px; 
    left: -0px; 
    width: auto; /*width: 192px; */
    padding-top:0px;
}

.menuAccion li ul a
{ 
    width: 148px; 
    height: auto; 
    float: left; 
    text-align: left; 
    line-height: 15px; 
    padding: 4px 21px; 
    min-height: 15px;
}

.menuAccion ul ul
{ 
    top: auto; 
    padding-top: 0px !important;
}

.menuAccion li ul ul
{ 
    left: 191px; 
    top: 0px;
}

.menuAccion li:hover ul ul, 
.menuAccion li:hover ul ul ul, 
.menuAccion li:hover ul ul ul ul
{ 
    display: none;
}

.menuAccion li:hover ul, 
.menuAccion li li:hover ul, 
.menuAccion li li li:hover ul, 
.menuAccion li li li li:hover ul
{ 
    display: block;
}

.menuAccion ul li
{
    right: auto;
}

.menuAccion ul li a
{ 
    border: 1px solid #ddd; 
    border-bottom: none; 
    color: #888;
    background: #fff;
}

.menuAccion ul li a:hover
{
    color: #0066FF;
    background: #fff;
}

.menuAccion ul
{ 
    background: #ddd; 
    border-bottom: 1px solid #ddd;
}

.menuAccion .current-menu-item a strong	
{
    color: #444; 
    font-weight: bold;
}

a.imghome {
    background: url(../../Content/Imagenes/Home-icon.png) no-repeat top left;
    display: block;
    width: 28px;
    height: 25px;
    text-indent: -9999px; /* hides the link text */
}
/* ------------------------------------------------------- */

#menuToolbarGridCabecera, #menuToolbarGrid, #menuToolbarGrid2, #menuToolbarGrid3, #mAcciones {
    border-style: double;
    border-width: 1px;
    border-color: darkgray;
}

/* PAGINA PRINCIPAL */

.botonMenuPrincipal1 div {
	height: 80px;
	background-color: gray;
	font-family: 'Roboto Medium';
	font-size: x-large;
	color: black;
}

.botonMenuPrincipal2 div {
    height: 60px;
    font-family: 'Roboto Medium';
    font-size: large;
    text-align: left;
}

.botonMenuPrincipal2 div img {
	padding-right: 10px;
}

.botonMenuPrincipal2.dxbButton_TransoftDXTheme.dxb-outline {
	color: black;
}

.botonMenuPrincipal3 div {
	height: 80px;
	background-color: white;
	font-family: 'Roboto Medium';
	font-size: x-large;
	color: black;
}

.botonMenuPrincipal4 div {
    height: 60px;
    font-family: 'Roboto Medium';
    font-size: large;
    text-align: left;
    text-transform: none;
    text-anchor: start;
}

.botonMenuPrincipal4 div img {
    padding-right: 10px;
} 

.botonMenuPrincipal4.dxbButton_TransoftDXTheme.dxb-outline {
    border-radius: 10px;
    color: gray;
}

.menuDivSliderPadre {
	position: relative;
}

.menuDivSliderHijo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -0%);
}

.menu-label-description span {
	line-height: 5px;
}


/* ----------- NAVBAR HTML (header) -----------
   Reemplaza al Menu de DevExpress del header. Valores medidos sobre TransoftDXTheme: tipografía, alto de 34 px,
   separador de 1 px #dfdfdf, hover rgba(0,0,0,.1) y desplegable blanco con borde #dcdcdc y sombra. */
.nav-ts {
    float: left;
    font-family: "Roboto Regular", Helvetica, "Droid Sans", Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color: #484848;
}

    .nav-ts ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

.nav-ts-lista {
    display: flex;
}

.nav-ts-item {
    position: relative;
}

.nav-ts-lista > .nav-ts-item + .nav-ts-item {
    border-left: 1px solid #dfdfdf;
}

.nav-ts a,
.nav-ts .nav-ts-link {
    display: block;
    box-sizing: border-box;
    padding: 8px 14px 8px 13px;
    line-height: 18px;
    color: #484848;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    outline: none;
}

.nav-ts a:hover,
.nav-ts a:visited {
    color: #484848;
    text-decoration: none;
}

.nav-ts-item:hover > a,
.nav-ts-item:hover > .nav-ts-link,
.nav-ts-item:focus-within > a,
.nav-ts-item:focus-within > .nav-ts-link {
    background-color: rgba(0, 0, 0, 0.1);
}

/* indicador de desplegable (el popOut de DevExpress) */
.nav-ts-lista > .nav-ts-con-sub > a::after,
.nav-ts-lista > .nav-ts-con-sub > .nav-ts-link::after {
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    margin: 0 0 3px 8px;
    border-right: 1px solid #777;
    border-bottom: 1px solid #777;
    transform: rotate(45deg);
}

.nav-ts-sub {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    min-width: 100%;
    background-color: #fff;
    border: 1px solid #dcdcdc;
    box-shadow: rgba(0, 0, 0, 0.16) 0 2px 4px 0, rgba(0, 0, 0, 0.12) 0 2px 8px 0;
}

.nav-ts-con-sub:hover > .nav-ts-sub,
.nav-ts-con-sub:focus-within > .nav-ts-sub {
    display: block;
}

.nav-ts-sub a,
.nav-ts-sub .nav-ts-link {
    padding: 7px 34px 6px 12px;
}

.nav-ts-sub .nav-ts-sub {
    top: -1px;
    left: 100%;
}

.nav-ts-sub .nav-ts-con-sub > a::after,
.nav-ts-sub .nav-ts-con-sub > .nav-ts-link::after {
    content: "";
    position: absolute;
    right: 14px;
    top: 14px;
    width: 5px;
    height: 5px;
    border-right: 1px solid #777;
    border-top: 1px solid #777;
    transform: rotate(45deg);
}


/* ----------- BLOQUE DEL USUARIO (header) -----------
   Reemplaza al FormLayout de DevExpress de LogOnUserControl2 sin cambiar lo que se ve. Medido sobre el control
   anterior (con el header de 55 px): nombre en negrita y rol en cursiva a 4 px uno del otro, el desplegable a la
   derecha en una caja de 43 x 25 px con el chevron oscuro, y "Iniciar sesión" como el botón naranja del tema. */
.perfil-ts {
    display: flex;
    align-items: flex-start;
    margin-top: 18px;
    padding-right: 24px;
    font-family: "Roboto Regular", Helvetica, "Droid Sans", Tahoma, Geneva, sans-serif;
    font-size: 14px;
    color: #000;
}

.perfil-ts-datos {
    display: flex;
    flex-direction: column;
    gap: 4px;
    line-height: 17px;
    margin-right: 15px;
    padding: 1px;
}

.perfil-ts-usuario {
    font-weight: bold;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.perfil-ts-rol {
    font-style: italic;
}

/* el botón de opciones muestra sólo el chevron; el texto queda para los lectores de pantalla */
.perfil-ts .nav-ts {
    float: none;
    margin-top: 0;
}

.perfil-ts .nav-ts-lista > .nav-ts-item > .nav-ts-link {
    box-sizing: border-box;
    width: 43px;
    height: 25px;
    padding: 0;
    font-size: 0;
    text-align: center;
    line-height: 25px;
}

.perfil-ts .nav-ts-lista > .nav-ts-con-sub > .nav-ts-link::after {
    width: 6px;
    height: 6px;
    margin: 0 0 4px 0;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    vertical-align: middle;
}

/* el desplegable del control anterior medía 202 px y salía 34 px a la derecha de la caja del chevron */
.perfil-ts .nav-ts-sub {
    left: auto;
    right: -34px;
    box-sizing: border-box;
    min-width: 202px;
}

/* la razón social en el desplegable: un renglón que informa, no se elige; si es larga, baja de renglón */
.nav-ts-sub .nav-ts-texto {
    display: block;
    box-sizing: border-box;
    max-width: 300px;
    padding: 7px 12px 6px 12px;
    border-bottom: 1px solid #dcdcdc;
    color: #555;
    cursor: default;
    overflow-wrap: anywhere;
    white-space: normal;
}

/* ícono de 16 px a 12 px del borde y el texto 12 px después (los de DevExpress, sacados de su sprite) */
.nav-ts .nav-ts-ico {
    padding-left: 40px;
    background-repeat: no-repeat;
    background-position: 12px center;
    background-size: 16px 16px;
}

.nav-ts-ico-perfil {
    background-image: url("Imagenes/menu-perfil.svg");
}

.nav-ts-ico-cambiar-contrasena {
    background-image: url("Imagenes/menu-cambiar-contrasena.svg");
}

.nav-ts-ico-cerrar-sesion {
    background-image: url("Imagenes/menu-cerrar-sesion.svg");
}

.perfil-ts-ingresar {
    display: inline-block;
    box-sizing: border-box;
    height: 32px;
    margin: 1px -10px 0 0;
    padding: 0 15px;
    border-radius: 2px;
    background-color: #ff8c00;
    box-shadow: rgba(0, 0, 0, 0.16) 0 2px 5px 0, rgba(0, 0, 0, 0.12) 0 2px 10px 0;
    font-family: "Roboto Medium", Helvetica, "Droid Sans", Tahoma, Geneva, sans-serif;
    font-size: 14px;
    line-height: 32px;
    letter-spacing: 0.14px;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
}

    .perfil-ts-ingresar:hover,
    .perfil-ts-ingresar:focus {
        color: #fff;
        text-decoration: none;
    }