html, body{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
    _overflow: hidden;
}

.g_entorno{
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: var(--g_color_ppl);
}
    .g_entorno .g_top{
        height: calc(var(--g_top_h) - 1px);
        border-bottom: 1px solid var(--g_color_border);
    }
    .g_entorno .g_pie{
        height: calc(var(--g_pie_h) - 1px);
        border-top: 1px solid var(--g_color_border);
    }
    .g_entorno .g_bdy{
        height: calc(100% - var(--g_top_h) - var(--g_pie_h) );
        background-color: #FFFFFF;
    }
/*--------------------------------------------------------*/

    .g_logo{
        position: absolute;
        top: -5px;
        left: 0px;
        height: var(--g_logo_h);
        width: var(--g_logo_h);
        background-image: url("../images/logo100.png");
        background-repeat: no-repeat, repeat;
        background-size: cover;
        margin: 0px 5px;
    }
/*--------------------------------------------------------*/

.g_bdy .g_left{
    float: left;
    height: calc(100%  );
    width: calc(var(--g_left_w) - 1px);
    background-color: var(--g_color_fdo);
    border-right: 1px solid var(--g_color_ppl);
}

.g_bdy .g_desk{
    float: left;
    height: calc(100% - 0px);
    width: calc(100% - var(--g_left_w) - 0px);
    _padding: 2px;
}


/*--------------------------------------------------------*/


.g_entorno .g_top_cont{
    float: left;
    margin-left: 100px;
    width: calc(100% - 100px);
    height: 100%;
    overflow: hidden;
}
.g_entorno .g_top_cont div.g_menu{
    float: left;
    height: 100%;
    display: flex;
    align-items: flex-end;
}
.g_entorno .g_top_cont div.g_menu div{
    padding: 4px 8px;
    font-family: Arial;
    font-size: 14px;
    color: white;
    border: 1px solid var(--g_color_ppl);
    border-bottom: none;
    cursor: pointer;
}


.g_entorno .g_top_cont div.g_user{
    float: right!important;
    height: 100%;
    display: flex;
    align-items: flex-end;
    
}
.g_entorno .g_top_cont div.g_user img{
    height: 25px;
    transition: all 0.2s;
    margin: 2px;
}
.g_entorno .g_top_cont div.g_user img:hover{
    filter:         invert(80%);
    -webkit-filter: invert(80%);
    -moz-filter:    invert(80%);
}


/* ============================================================= */
.g_bdy .g_left .g_lateral{
    float: left;
    width: 100%;
    margin-top: 40px;
}
.g_bdy .g_left .g_lateral a {
    text-decoration: none;
}
.g_bdy .g_left .g_lateral a div{
    text-align:center;
    margin: 15px;
}
.g_bdy .g_left .g_lateral a div img{
    height: 64px;
    transition:transform 0.1s
}
.g_bdy .g_left .g_lateral a div img:hover{
    transform: scale(1.1);
    filter: drop-shadow(1px 1px 2px #000000);
    -webkit-filter: drop-shadow(1px 1px 2px #000000);
    -moz-filter: drop-shadow(1px 1px 2px #000000);
}



.g_bdy .g_left .g_lateral a div.g_lateral_btn{
    padding: 4px;
    border: 1px solid var(--g_color_border);
    background-color: var(--g_color_ppl);
    color: var(--g_color_sec);

    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    
    font-family: Arial;
    font-size: 14px;
    
    transition:transform 0.1s;
}


.g_bdy .g_left .g_lateral a div.g_lateral_btn:hover{
    transform: scale(1.1);
    filter: drop-shadow(1px 1px 2px #000000);
    -webkit-filter: drop-shadow(1px 1px 2px #000000);
    -moz-filter: drop-shadow(1px 1px 2px #000000);
}


/* ============================================================= */

.g_bdy .g_desk .g_cuerpo{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.g_bdy .g_desk .g_cuerpo .g_cuerpo_ini{}

.g_bdy .g_desk .g_cuerpo .g_cuerpo_hdr{
    height: calc(var(--g_cuerpo_hdr_h) - 3px);
    border-bottom: double #cccccc;
    line-height: calc( var(--g_cuerpo_hdr_h) - 3px);
    overflow: hidden;
}
.g_bdy .g_desk .g_cuerpo .g_cuerpo_hdr div{
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
    font-size: 22px;
    padding-left: 20px;
}

.g_bdy .g_desk .g_cuerpo .g_cuerpo_bdy{
    height: calc(100% - var(--g_cuerpo_hdr_h));
    overflow: hidden;
}






/*--------------------------------------------------------*/
/* icono y menú de usuario */
/*--------------------------------------------------------*/
#g_perfilusuario{
    position: absolute;
    display: none;
    width: 180px;
    height: 80px;
    border: 2px solid var(--g_color_ppl);
    background-color: var(--g_color_fdo);
    padding: 10px;

    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;

    -webkit-box-shadow: 2px 2px 4px 1px rgba(0,0,0,0.75);
    -moz-box-shadow: 2px 2px 4px 1px rgba(0,0,0,0.75);
    box-shadow: 2px 2px 4px 1px rgba(0,0,0,0.75);
}
.g_perfil_info{
    font-family: arial;
    font-size: 14px;
    color: var(--g_color_font1);
    padding: 4px;
    height: calc(100% - 25px);
}
.g_perfil_info label{
    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
    font-size: 14px;
    font-weight: bolder;
    color: var(--g_color_ppl);
}
.g_perfil_cerrar{
    text-align: right;
    height: 25px;
}

.g_perfil_cerrar a{
    text-decoration: none;
    font-family: Arial;
    font-size: 12px;
    color: var(--g_color_ppl);
}
.g_perfil_cerrar a:hover{
    color: var(--g_color_font1);
}


/* ============================================================= */
/* MENU */
/* ============================================================= */
.g_menu_select{
	border-top:1px solid #cccccc!important;
	border-left: 1px solid #CCC!important;
	border-right: 1px solid #CCC!important;
	background-color: #EEEEEE!important;
	color: #333333!important
}
.g_MenuCont{
	position: absolute;
	_width: 150px;
	_height: 200px;
	border: 1px solid #CCCCCC;
	border-top: none;
	background-color: #EEEEEE;
	color: #333333;
	padding: 4px;
	box-shadow: 		2px 2px 5px 0px rgba(0,0,0,0.75);
	-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 	2px 2px 5px 0px rgba(0,0,0,0.75);
}
.g_MenuCont table{
	font-family: Arial;
	font-size: 14px;
	color: #333333;
	margin-bottom: 5px;
	border-bottom: 1px solid #CCCCCC;
}
.g_MenuCont table tr:hover{
	background-color: #ffffff;
}
.g_MenuCont table tr:hover td{
	color: #333333;
}
.g_MenuCont table tr:hover td img{
	transform: translate(2px, 0) scale(1.1) ;
}

.g_MenuCont table tr td:last-child{
	padding-top: 4px;
	padding-bottom: 4px;
	padding-right: 40px;
	padding-left: 4px;
	cursor: pointer;
}
.g_MenuCont table tr td:first-child{
	width: 24px;
	border-right: 1px solid #CCCCCC;
}

		.g_MenuCont table tr.g_MenuSepara td{
			border-bottom:1px solid #CCCCCC;
		}
		.g_MenuCont table tr.g_MenuSepara2 td, .g_MenuCont table tr.g_MenuSepara td{
			height:1px!important;
			padding:0!important;
		}






/* ============================================================= */
/* ============================================================= */
@media (max-width:450px){

    .g_logo{
        position: absolute;
        top: -5px;
        left: 5px;
        height: calc( var(--g_logo_h) * 0.7);
        width: calc( var(--g_logo_h) * 0.7);
        _background-image: url("../images/logo100.png");
        _background-repeat: no-repeat, repeat;
        _background-size: cover;
        _margin: 0px 5px;
    }

    .g_entorno .g_top_cont {
        margin-left: 70px;
     }
    .g_bdy .g_left{
        float: left;
        height: calc(100%  );
        width: calc(var(--g_left_w) - 1px);
        background-color: var(--g_color_fdo);
        border-right: 1px solid var(--g_color_ppl);

        display: none;
    }

    .g_bdy .g_desk{
        float: left;
        margin-top: 15px;
        height: calc(100% - 4px - 15px);
        width: calc(100% - 4px);
        padding: 2px;
    }   
}