/* ================================================================================== */
/* ================================================================================== */
/*
	modificaciones sobre el estilo generado para Jquery UI
*/
/*
 * @DEBUG
.ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: .2em .2em 0; font-size:9pt}
*/
.ui-icon{
	float:left;        
}
.button:hover{
	cursor:pointer;
}
.ui-widget{
	vertical-align:middle;
        font-size: 10pt;
        text-align: center;
}
/*.ui-button-text-only .ui-button-text { padding: 0 0.2em; } */

/*
.ui-widget-header{
    font-family: Arial;
}
*/
.ui-widget-content{
    background: #E4E5E6;
 /*   height: 50px;  */
    border:none;
}    

/* ================================================================================== */
/* css for timepicker */
.ui-timepicker-div .ui-widget-header{ margin-bottom: 8px; }
.ui-timepicker-div dl{ text-align: left; }
.ui-timepicker-div dl dt{ height: 25px; }
.ui-timepicker-div dl dd{ margin: -25px 0 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
/* ================================================================================== */
/* ================================================================================== */

.ui-widget-content {
    background-image: none;
}


body{
	background-color: #525258;
/*
	es el ancho oficial, pero es demasiado chico para las resoluciones actuales
	width : 716px;
 */
	font-family: Arial, Helvetica, sans-serif, Verdana;
	margin: 0;
	padding: 3px;
	text-align: left;
        font-size: 16px;
	
}

/* div que contiene TODO lo que se muestra en la pantalla
 es para fijar el ancho y color de fondo por default */
div.main_window{
	width:1030px;
	text-align:center;
	padding: 3px 15px 3px 15px;
	margin: 0 auto 20px;
	background-color:#FFFFFF;
}

/* div que contiene el menu de accesos del sistema, 
 * es para sacarle el overflow de gobierno que me tapa el menu */
.gc_div_menu,.gc_div_menu div {
	overflow:visible;
        
}

/* redefino lo de gobierno porque no va asi */
div.header{
	padding: 0;
}

/*
	es la tabla que contiene todo lo que se ve (el body)
	dentro de esta tabla hay una fila para el header, otra para el content
	y una mas para el footer
*/
table.table_content {
	/*width: 100%;*/
	width: 1024px;
	padding : 0pt;
	margin : 0pt;
	border : 0pt;
	border-collapse: collapse;
	text-align: center;
	vertical-align: middle;
        background-color: #FFFFFF;
}

tr.table_content, td.table_content {
	padding : 0pt;
	margin : 0pt;
	border : 0pt;
	text-align: center;
	vertical-align: middle;
}

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




/*
 * 
 * clases CSS puestas en los distintos elementos del sistema
 * 
clase CSS        tipo de elemento
---------------    ----------------------------------------------------------
abm                	<table> es la tabla que contiene otra tabla para el form y otra tabla mas para el listado
form_button        	<table> es una tabla que contiene solamente botones en una sola fila
						se ubica debajo del formulario del reporte (con los botones para generar reporte en xls, en pdf, etc)
						tambien hay uno de estos en la parte de abajo del form de carga
form				<table> es la tabla que contiene los inputs para la carga, busqueda y reporte
field_title			<td> del form que tiene la descripcion del input de carga
field_value			<td> del form que tiene el input
		
form_detail			<table> es la tabla que contiene los inputs para la carga, busqueda y reporte para un formulario
						de detalle (esta dentro de otro formulario)
			
popup				<table> que se usa para mostrar la info de un registro en un popup emergente
popup_detail		<table> que esta dentro del popup anterior, para mostrar la parte del detalle
						en las relaciones maestro-detalle
popup_title			<td> del popup para el nombre del campo que se muestra
popup_value			<td> del popup para mostrar el valor de un registro (contiene texto, no inputs)
			
list				<table> tabla para los listados
cell_varchar		<td> del listado que contiene texto              (letra linda  alinear izquierda)
cell_date			<td> del listado que contiene fechas u horas     (monoespaciar alinear centro)
cell_int			<td> del listado que contiene un numero entero   (monoespaciar alinear derecha)
cell_float			<td> del listado que contiene un numero flotante (monoespaciar alinear derecha)
			
table_pag			<table> tabla para el paginador del listado
menu_search			<table> tabla para el popup que tiene los radiobutton de ordenamiento del listado
cursor_pointer		<tr> que tiene los titulos de la tabla de listado, para que le ponga la manito como cursor
row_data			<tr> que tiene los datos de la tabla de listado, para que le ponga otro fondo en el OVER

*/

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



/*  NO UTILIZO POR AHORA LA CLASE "tabla_tramite" DEL REPOSITORIO DEL MDS !!!!
    tabla_tramite es un estilo del repositorio del mds.
    aca lo especifico mas para modificar algunos estilos que uso en las tablas de los forms. 
 */
/*table.tabla_tramite tr th{
    
    background-color:#b3cfdb;
    padding: 8px;
    text-align: center;
    border: 1px solid #FFFFFF;
}

table.tabla_tramite tr td{
    
    padding: 8px;
    border: 1px solid #FFFFFF;
    vertical-align: middle;
    
}

table tr.row_data:hover{
	background-color:#FFFFFF;        
}
*/

/* a los elementos que se les aplique esta clase, el cursor se transforma en manito */
.cursor_pointer{
	cursor:pointer;
}
/*
cell_bool			<td> del listado que contiene texto              (letra linda  alinear centro)
cell_varchar		<td> del listado que contiene texto              (letra linda  alinear izquierda)
cell_date			<td> del listado que contiene fechas u horas     (monoespaciar alinear centro)
cell_int			<td> del listado que contiene un numero entero   (monoespaciar alinear derecha)
cell_float			<td> del listado que contiene un numero flotante (monoespaciar alinear derecha)
cell_enumeration	<td> del listado que contiene texto de un enum   (letra linda  alinear centro)
*/
.cell_bool{
	font-weight: normal;
	font-family: Arial;
	text-align: center;
}
.cell_enumeration{
	font-weight: normal;
	font-family: Arial;
	text-align: center;
}
.cell_varchar{
	font-weight: normal;
	font-family: Arial;
	text-align: left;
}
.cell_date{
	font-weight: normal;
	font-family: Arial;
	text-align: center;
}
.cell_int{
	font-weight: normal;
	font-family: Helvetica;
	text-align: right;
}
.cell_float{
	font-weight: normal;
	font-family: Helvetica;
	text-align: right;
}
/* --------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------- */
/*  titulo de los field-set  */
legend{
/*
	font-weight: bold;
	font-family: Arial;
 */
	padding:0 0.5em;
	
	
	/*
	 * ahora esta usando el estilo de jquery-ui (clases ui-widget-header ui-corner-all)
	 * pero se puede sacarle ese selector y poner estos estilos
	border:1px solid;
	text-align:center;
	background-color:#E0E0D0;
	*/
}



/* estilo del TD de los formularios que contiene el nombre del field */
.field_title, .popup_title{
	width:20%;
	text-align:left;
	/* padding: 1px 2px 0 1px; */
	vertical-align:middle;
        color: #333333;
        font-size: 10pt;
        font-weight: 400;
        margin-left: 4px;
        padding: 0 5px;
        text-transform: uppercase;
}
/* estilo del TD de los formularios que contiene el input del field */
.field_value, .popup_value{
	text-align:left;
        vertical-align:middle;
}
/* son los fieldset de los popup para ver el detalle de un registro */
fieldset.ui-widget.ui-widget-content{
	min-height: 40px;
	margin: 10px 0 5px 0
}


/*	============================================================================
 * estilos para los inputs el sistema
 * no esta del todo integrado con jquery-ui
*/
input, select, textarea{
	border-width: 2px;
	border-style : groove;
	border-color : #cccccc;
	/*background-color : #FFFFFF;*/
	
/*	border-bottom-right-radius: 4px;
	border-bottom-left-radius:  4px;
	border-top-left-radius:     4px;
	border-top-right-radius:    4px;
*/
}

input:focus, select:focus, textarea:focus {
	/*border-color : #000;*/
        
}

form input[type="text"], form input[type="number"], input[type="password"] {
    border: 1px solid rgba(30, 40, 44, 0.3);
    color: #666;
    font-size: 10pt;
    font-weight: 400;
    height: 25px;
    margin: 0 5px 10px;
    outline: medium none;
    padding: 1px 4px;  
    transition: all 0.15s ease-in-out 0s;
    width:auto; 
}



/*
================================================================================
		CSS INPUTS
================================================================================
*/
/* --------------------------------- */
/*div.gc_input{
	display: inline-block;
}*/
/* --------------------------------- */
div.gc_input_autocomplete{
	display: inline-block;
}
div.gc_input_autocomplete div{
	background: transparent;
	padding-top: 10px;
        margin-left: 3px;
  /*      margin-right: 3px;    */
        border: 1px solid #c0c0c0;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius:  4px;
	border-top-left-radius:     4px;
	border-top-right-radius:    4px;
}
div.gc_input_autocomplete fieldset{
        margin-left: 3px;
        margin-right: 3px;
        border: 1px solid #c0c0c0;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius:  4px;
	border-top-left-radius:     4px;
	border-top-right-radius:    4px;
}
/* --------------------------------- */

.label_browser{
    font-family: "aller";
    font-size: 10pt;
}




div.gc_input_browser{
	display: inline-block;
}
/*	tabla contenedora */
div.gc_input_browser table.input_browser_main{
	
	border : 0;
	border-collapse : collapse;
	padding : 0;
	margin : 0;
	text-align: left;
	vertical-align: middle;
	width: 100%;
}
/*	tabla que muestra el elemento seleccionado */
div.gc_input_browser table.input_browser_description{
	width: 100%;                    
}
/*	tabla de filtros */
div.gc_input_browser table.input_browser_filter{
	width: 100%;
}
div.gc_input_browser table.input_browser_filter td{
	padding: 1px;
}
/*      listado del browser    */
div.gc_input_browser table.list tr td{
        border-bottom-color: #cfd0d0;
        border-bottom-width: 1px;  
        border-bottom-style: dotted;
        background-color: #f7f7f7;
        padding: 2px;
}
/*      titulo del listado del browser    */
div.gc_input_browser table.list tr th{
        padding: 3px;
        border-bottom-color: #cfd0d0;
        border-bottom-style: dotted;
        border-bottom-width: 1px;
        border-top-color: #e30713;
        border-top-style: dotted;
        border-top-width: 1px;
        color: #413f43;
        text-align: left;
        /*font-size: 11px;*/
}
/* --------------------------------- */

/* --------------------------------- */
div.gc_input_captcha{}
/* --------------------------------- */
div.gc_input_checkbox{
    
    
}
/* --------------------------------- */
div.gc_input_combo, div.gc_input_combo select{
	min-width:150px;
        
}
/* --------------------------------- */
div.gc_input_combo_binario{}
/* --------------------------------- */
div.gc_input_date{}

img.ui-datepicker-trigger{ margin-bottom: -5px; }

.ui-datepicker {
    display: none;
    padding: 0.2em 0.2em 0;
    width: 17em;
    border: 1px solid #4DA3AC;
    border-width: 4px;
}


/* --------------------------------- */
div.gc_input_datetime{}
/* --------------------------------- */
div.gc_input_time{}
/* --------------------------------- */
div.gc_input_file{
	width: 400px;
	display: inline-block;
}
/* --------------------------------- */
div.gc_input_file_img{}
/* --------------------------------- */
div.gc_input_file_link{}
/* --------------------------------- */
div.gc_input_link{
  font-size: 12pt;
}
/* --------------------------------- */
div.gc_input_password{}
/* --------------------------------- */
div.gc_input_password_change{}
div.gc_input_password_change table{
	display: inline-block;
	width: 98%;
}
/* --------------------------------- */
div.gc_input_radio{}
div.gc_input_radio .fieldset{
        margin-left: 3px;
        margin-right: 3px;
        border: 1px solid #c0c0c0;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius:  4px;
	border-top-left-radius:     4px;
	border-top-right-radius:    4px;
        
}
div.gc_input_radio table.table_group_input, div.gc_input_radio table.table_group_input td{
	border : 0;
	border-collapse : collapse;
	padding : 0;
	margin : 0;
	text-align: left;
	vertical-align: middle;
        
}
/* --------------------------------- */
div.gc_input_set_checkbox{
    vertical-align: middle;
}

div.gc_input_set_checkbox fieldset{
	display:inline-block;
	width:100%;
        border: 0;
}
/* --------------------------------- */
div.gc_input_text{}
/* --------------------------------- */
div.gc_input_textarea{}
/* --------------------------------- */
div.gc_input_textarea_rich{}
/*
================================================================================
		FIN REFACTOR DE CSS INPUTS
================================================================================
*/

/* clase que se le aplica al asterisco que se pone a continuacion de los inputs requeridos */
.input-required{
	color: #DD0000;
        display: inline-block;
}


/* ================================================================================== */
/*  tablas de listados y formularios del sistema  */

table.form, table.form_detail, table.list, table.abm,table.form_report{
	width: 100%;
	border-collapse: collapse;
        background: #EFEFEF;
}
table.form_report td{
	vertical-align: middle;
	text-align: center;
}
/* ================================================================================== */
/* ================================================================================== */

/* ================================================================================== */
/*
	tabla que contiene el header del sistema
*/
table.table_header {
	width: 100%;
	padding : 0pt;
	margin : 0pt;
	border : 0pt;
}
.table_header tr, .table_header td{
	padding : 0pt;
	margin : 0pt;
	border : 0pt;
	font-family: Arial;
}
/* ================================================================================== */
/*
	tabla que contiene el footer del sistema
*/
table.table_footer {
	width: 100%;
	padding : 0pt;
	margin : 0pt;
	border : 0pt;
        border-collapse: collapse;
}
.table_footer tr, .table_footer td{
	padding : 0pt;
	margin : 0pt;
	border : 0pt;
	font-family: Arial;
	background-color: #383838;
}
/* ================================================================================== */

th {
    
    text-align: center;
    font-size: 11pt;
}

/* estilo para el div que bloquea la pantalla */
.blocker{
	background-color:#A5CBCF;
}

/*
li.ui-menu-item{
	display: block;
	float: none;
        height: 28px;
        
}*/
li.ui-menu-item-1{
	float: left;
	padding-right: 5px;
	padding-left: 3px;
	min-width: 80px;
	max-width: 200px;
}
li.ui-menu-item-1 a{
	font-weight:bold;
        font-size: 10pt;
        
}
li.ui-menu-item-2 a,li.ui-menu-item-3 a,li.ui-menu-item-4 a{
	font-weight:bold;
        font-size: 10pt;
        
}

/* para las descripciones de las pestañas que son detalles en las pantallas. */
.ul_detalles {
    
    font-size: 11pt; 
    text-transform: uppercase; 
    font-weight: bold;
}
/* ============================================== */

/* aplica a los span usados en los titulos generales de las pantallas */
span.campo_texto_titulo {
    float: left;    
    font-size: 15px;
    font-weight: bold;
    margin: 15px 10px 5px;    
    color: #DA0000;
}

/* aplica a las tablas generales de datos */
table.table_general_datos{        
    font-size: 9pt;
    /*margin: 10px;*/    
}     

/* aplica al recuadro de los botones en cada pantalla */
fieldset.recuadro_general_y_botones{
    
    border: 1px solid #CFCFCF; 
    /*margin: 4px;*/            
    /*padding: 8px;*/        
    width:100%;             
    
}

/*	clase para ocultar algo */
.hidden{
	display: none;
}

/*	tabla que contiene los botones del form*/
.form_button{
    width: 100%;
    margin: 5px;
}
.form select[multiple]{
    height: 120px;
    font-size: 11pt;
    
}
.form select{
   font-size: 11pt;
    
}
#cssmenu ul li ul li a {
    display: block;
    width: 300px;
}
#cssmenu > ul > li > ul > li {
    display: block;
    width: 300px;
}

.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {
    background: #ffffff none repeat scroll 0 0; 
    /* border: 1px solid #ec1c24; */
    border: 1px solid #4DA3AC;
    border-width: 4px;
    color: #990000;
   
}

.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {
    background-image: url("../javascript/jquery-ui/images/ui-icons_990000_256x240.png");  
    
   
}


.detalles span {
    display: block;
    font-size: 1em;
    color: #333333;
    font-weight: 400;
    margin-left: 0; 
}
table td{    
    
    border-left: 0px;
    border-right: 0px;
    font-size: 10pt;
    background-color: #e4e5e6;
    padding: 0px 0px;
    /* text-align:center;  */
}

/* --- celda de los listados */
.list td{
    
	padding: 8px;
        border: 1px solid #cccccc;
        vertical-align: middle;
	color: initial;
	font-size: 9pt;
}
/*	listados del sistema */
/*	resaltado de la fila del listado cuando pasas por arriba */
tr.row_data:hover{
	background-color:#000;
        
}

/*	titulos de las columnas del listado */
.list th{
	background-color:#999999;
	font-family: Helvetica;
	font-weight: bold;
        border-style: solid;
        border-width: 1px;
	padding: 4px;
	text-align: center;
	border-color : #cdcdcd;
  /*      border-bottom-color: white;  */
	color: initial;
	font-size: 10pt;
        height: 25px;
        color:white;
}
/*  tabla del paginador de los listados  */
.table_pag, .table_pag tbody, .table_pag td{
	width: 100%;
	text-align : center;
	background-color: #cdcdcd;
}

fieldset.popup_fieldset{
    border: 1px solid #cdcdcd;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius:  4px;
    border-top-left-radius:     4px;
    border-top-right-radius:    4px;
 /*   width:100%; */
}

table{
    width: 100%;
    margin: 0px 0px;
}

.form h3{
    font-size: 15.4px;
}
h3{
    text-align: left;
    font-size: 15.4px;
}
input:focus, select:focus, textarea:focus{
        box-shadow: 0 0 5px rgba(34, 40, 44, 0.8);
}
.detalles label {
    display: inline;
    font-size: 1.0em;
  
}
.ui-dialog .ui-dialog-content {
    background: #e4e5e6;
    border: 1;
    overflow: auto;
    padding: 0.5em 1em;
    position: relative;
    
}

.ui-dialog{
    border: 1px solid #4DA3AC;
    border-width: 4px;
}


.parrafo {    
    margin-bottom: 0px;
    font-size: 10pt;
    text-align: justify;
    font-family: "aller";    
    padding-left: 5pt;
}


.custom-checkbox label{
  
  position: relative;    
  font-family: Verdana, Arial, Helvetica, sans-serif;  
  font-size: 11pt;
  font-weight: normal;    
  text-align: justify;  
  display: block;   
  line-height: 18px; 
  margin-left: 15px; 
  margin-right: 15px;
  text-transform: none;
  
}

.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
    background-color: #454545;
    color: white;
    text-decoration: none;
}