
/* vim: set expandtab tabstop=3 shiftwidth=3 softtabstop=3 foldmethod=marker: */


img {
   border: none;
}



fieldset {
   margin: 1px 2px;
   padding: 2px;
}

legend {
   color: black;
   font-weight: bold;
}


fieldset fieldset legend {
   color: gray;
   font-weight: normal;
   font-size: 0.9em;
}







/* FORMULARIOS */


form {
   margin: 0;
}

TEXTAREA, INPUT, SELECT, OPTION {
   font-family: "Trebuchet MS", "Bitstream Vera Sans", verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   margin: 0px;
   padding: 0px;
}

INPUT  {
   height: 18px;
   line-height: 14px;
}

.mantenedor_input_memo        { width: 500; height: 80px; }
.mantenedor_input_htmlarea    { width: 500px; height: 350px; }


.input_ancho_fijo_cuarto { width: 40px; } filter: progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=3);
.input_ancho_fijo_medio { width: 81px; }

.input_ancho_fijo,             /* ancho estÐ±ndar para inputs */
.mantenedor_input_text, 
.mantenedor_input_file, 
.mantenedor_input_email       { width: 165px; }
.mantenedor_input_popup       { width: 170px; }
.mantenedor_input_fecha_dia   {width: 20px; }
.mantenedor_input_fecha_mes   {width: 90px; }
.mantenedor_input_fecha_ano   {width: 40px; }
.mantenedor_input_fecha_hor,
.mantenedor_input_fecha_min,
.mantenedor_input_fecha_seg {width: 23px; }
.mantenedor_input_password    {width: 100px; }

.input_checkbox,
.input_radio {
   width: 10px;
   height: 10px;
}














/* nota que se adjunta a algÑŠn pÐ±rrafo */
.nota {
   font-size: 0.9em;
   font-weight: normal;
}



/* indica que el elemento posee informaciÑƒn histÑƒrica que ya noes vigente
   como por ejemplo cuando se listan las suscripciones de una empresa,
   se mostrarÐ±n tambiÐ¹n las suscripciones que ya no estÐ±n vigentes

*/
.noVigente {
   color: gray;
}








/* Elementos de formulario usados para desplegar datos calculados */
input.calculado {
   border: none;
   margin: 1px;
   padding-top: 4px;
}


/* indica que el dato contenido es numÐ¹rico */
input.autonumero,
.numero input,
.numero {
   text-align: right;
}


/* indica que el dato contenido es una fecha */
.fecha {
   text-align: center;
}

/* Elementos de formulario usados para almacenar fechas */
input.autofecha {
   text-align: center;
   width: 68px;
}


/* indica que el elemento (ejemplo TD) posee acciones sobre el registro */
.accion {
   text-align: center;
}

/* Botones */

button,
.buttonGrande,
.button,
.button5,
.button10,
.button15,
.button20
{
   background-image: url(/images/botones/boton-gris-80_login.gif);
   background-color: transparent;
   width: 80px;
   height: 20px;
   border: 0px none;
   margin: 1px;
   cursor: pointer;

   padding-bottom: 1px;
   color: #222;
   font-size: 11px;
   font-weight:normal;
}

/*.button5   { background-image: url(/images/botones/boton-gris-60.gif);  width: 60px; } */
.button10  { background-image: url(/images/botones/boton-gris-80.gif);  width: 80px; }
.button15  { background-image: url(/images/botones/boton-gris-120.gif); width: 120px; }
.button20  { background-image: url(/images/botones/boton-gris-160.gif); width: 160px; }










/* botones dentro de las tablas de uso corriente */

table.tabla button,
table.tabla .button,
table.tabla .button5,
table.tabla .button10,
table.tabla .button15,
table.tabla .button20,
fieldset button,
fieldset .button,
fieldset .button5,
fieldset .button10,
fieldset .button15,
fieldset .button20
{
   background-image: url(/images/botones/boton-gris-80_login.gif);
   background-color: transparent;
   width: 80px;
   height: 20px;
   border: 0px none;
   margin: 1px;
  
   padding-bottom: 1px;
   color: #222;
   font-size: 11px;
   font-weight:normal;
}

fieldset .button5,  table.tabla .button5   {  background-image: url(/images/botones/boton-gris-60.gif);  width: 60px; }
fieldset .button10, table.tabla .button10  {  background-image: url(/images/botones/boton-gris-80.gif);  width: 80px; } 
fieldset .button15, table.tabla .button15  {  background-image: url(/images/botones/boton-gris-120.gif); width: 120px; } 
fieldset .button20, table.tabla .button20  { background-image: url(/images/botones/boton-gris-160.gif); width: 160px; } 
/*
fieldset .button5    { background-image: url(images/boton-chico-azul-40.gif);  width:  40px; }
fieldset .button10   { background-image: url(images/boton-chico-azul-60.gif);  width:  60px; } 
fieldset .button15   { background-image: url(images/boton-chico-azul-80.gif);  width:  80px; } 
fieldset .button20   { background-image: url(images/boton-chico-azul-100.gif); width: 100px; } 
*/














/* Tablas de uso corriente */

.tabla caption,
.tabla th {
	text-align: left;	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: white;
	background-color: #EEE;
	font-weight: bold;
	padding: 5px 5px;
}
.tabla td {
   padding:	5px 3px;
   color: black;
}
.tabla tr.par {
   background-color: white;
}
.tabla tr.impar {
   background-color: #DDD;
}


.tabla {
   background-color: white;
   border: 1px solid #DDD;
   border-collapse: collapse;
    filter: progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=1);
   
}



/* Tablas interna */

.tablaInterna caption,
.tablaInterna th {
	text-align: left;	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: white;
	background-color: #EEE;
	font-weight: bold;
	padding: 5px 5px;
}
.tablaInterna td {
   padding:	5px 3px;
   color: black;
}
.tablaInterna tr.par {
   background-color: white;
}
.tablaInterna tr.impar {
   background-color: #DDD;
}


.tablaInterna {
   background-color: white;
   border: 1px solid #DDD;
   border-collapse: collapse;
    filter: progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=1);
   
}









/* Tablas destacadas

Se utilizan para tablas con mensajes especiales, pantallas de login o cualquier
otro componente que requiera uso de tablas pero con pocos datos.


*/


.destacado { 
   border: 2px solid #DDD;
   border-collapse: collapse;
   background-color: #EEE;
   border-spacing: 0;
   filter: progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=2);   
   }
   

.destacado th {
   color:#5e762a;
   font-size: 1.7em;
 	padding:	5px 15px;
}


.destacado td {
   padding:	5px 15px;
}

.destacado button,
.destacado .button {
   background-image: url(/images/botones/boton7.jpg);
   background-color: transparent;
   width: 110px;
   height: 20px;
   border: 0px none;
   color: #222;
   font-size: 11px;
   font-weight: normal   ;
   }


.destacado A {
	color: #327BB2;
}



div.destacado {
	padding:	5px 15px;
  background-color:#fbfbfb;

}














/* Tablas para formularios de busqueda */


.tablaBusqueda {
   background-color: #EEE;
   border: 2px solid #DDD;
   border-collapse: collapse;
   filter: progid:DXImageTransform.Microsoft.Shadow(direction=145,strength=1);
   }

.tablaBusqueda caption {
   background-color: #EEE;
   
   text-align: center;
   color:white;
   font-size: 1.5em;
	padding:	8px 5px;

	 }

.tablaBusqueda th {
   color: 5e762a;
   font-size: 1.3em;
	padding:	5px 15px;
 

   
}
.tablaBusqueda td {
	padding:	5px 15px;
	
}

.tablaBusqueda button,
.tablaBusqueda .button {
   background-image: url(/images/botones/boton7.jpg);
   background-color: transparent;
   width: 110px;
   height: 20px;
   border: 0px none;
   color: #222;
   font-size: 11px;
   font-weight: normal;
}


.tablaBusqueda A {
	color: #327BB2;
}


.tablaBusqueda fieldset {
   border: 1px solid gray;
}

   

















/* Tablas para mostrar listados de valores, ejemplo: listado de resultados de busqueda */


.tablaLista td {
   background-color: WHITE;
   padding:	1px 5px;
   border: 1px solid #DDD;
   border-collapse: collapse;
   
}


.tablaLista th {
   background-color: #EEE;
   border: 1px solid #DDD;
   border-collapse: collapse;
   color: WHITE;
   font-size: 1.1em;
   font-weight: bold;
     
}


.tablaLista {
   background-color: WHITE;
   border-collapse: collapse;
      filter: progid:DXImageTransform.Microsoft.Shadow(direction=145,strength=1);
}



















/*    Tabla que corresponde a una ficha con informaciÑƒn de resumen


Se utiliza para mostrar de manera destacada la informaciÑƒn resumida en la ediciÑƒn de un elemento.

Por ejemplo al editar un contrato de publicidad, muestra la fecha de creaciÑƒn, ediciÑƒn y
nÑŠmero de contrato.

*/

.tablaFichaResumen {
   
   
   border-collapse: collapse;
   text-align: center;
    filter: progid:DXImageTransform.Microsoft.Shadow(direction=145,strength=1);
}

.tablaFichaResumen th {
background-color: #EEE;
border: 1px solid #DDD;
   border-collapse: collapse;
	color: white;
	padding:	2px 10px;
}

.tablaFichaResumen td {
background-color:#CCC; 
border: 1px solid #DDD;
   border-collapse: collapse;
	padding:	2px 10px;
}

.tablaFichaResumen A {
	color: #327BB2;
}








.tablaMantenedor2 {
   border-collapse: collapse;
   border: 1px solid #DDD;
   padding: 4px;
   margin: 3px;
   width: 780px;
   vertical-align: top;
    filter: progid:DXImageTransform.Microsoft.Shadow(direction=145,strength=1);
}


.tablaMantenedor2 tr.par {
   background-color: white;
}
.tablaMantenedor2 tr.impar {
   background-color: #EEE;
}

.tablaMantenedor2 th {
   padding:	2px 3px;
   vertical-align: top;
}
.tablaMantenedor2 td {
   padding:	0px 3px;
   vertical-align: top;
}







.tablaMantenedor {
   border-collapse: collapse;
   border: 1px solid #DDD;
   padding: 4px;
   margin: 3px;
   vertical-align: top;
    filter: progid:DXImageTransform.Microsoft.Shadow(direction=145,strength=1);
}

.tablaMantenedor tr.par {
   background-color: white;
}
.tablaMantenedor tr.impar {
   background-color: #EEE;
}

.tablaMantenedor th {
   padding:	2px 3px;
   vertical-align: top;
}
.tablaMantenedor td {
   padding:	0px 3px;
   vertical-align: top;
}








/* Tablas del mantenedor */


/* Contenedor de las mantenciones. Todas las mantenciones (del mantenedor) estÐ±n dentro de esta tabla */

table.contenedorMantenedor {
   width: 100%;
   height: 100%;
   text-align: center;
}


/* Formatos para encabezados de tablas del mantenedor */

.encTabla1 {
   background-color: #CCC !important; 
   color: 222;
   font-size: 1.3em;
   font-weight: bold;
}


.encTabla2 {
   background-color: #FFFFFF !important;
   color: 222;
   font-size: 1em;
   font-weight: normal;
}


.encTabla3 {
   background-color: #EEE; 
   color: 222;
   font-size: 0.9em;
   font-weight: normal;
}















/* Tablas con formularios de ediciÑƒn */
.tablaEdicion {
   border-collapse: collapse;
   border: none;
   padding: 4px;
   margin: 3px;
   vertical-align: top;
  }

.tablaEdicion th {
   padding:	2px 3px;
   vertical-align: top;
}
.tablaEdicion td {
   padding:	0px 3px;
   vertical-align: top;
}
.tablaEdicion tr.par {
}
.tablaEdicion tr.impar {
}

.tablaEdicion thead th {
   text-align: center;
}
.tablaEdicion tbody th {
   text-align: left;
}

fieldset .tablaEdicion {
   border: none;
}





































/* Lenguetas */

ul.lenguetas {
   margin: 0px;
   padding: 8px 0px 0px 1px;
   border-bottom: 1px solid #CCC;
}

ul.lenguetas li {
   display: inline;
}


ul.lenguetas a {
   text-decoration: none;
   color: black;

   padding: 2px 1px 1px;

   border-top: 1px solid #CCC;
   border-left: 1px solid #CCC;
   border-right: 1px solid #CCC;

   background-color: #EEE;
   line-height: 14px;
}


ul.lenguetas a:hover,
ul.lenguetas li.activo a {
   border-top: 1px solid #DDD;
   background-image: url(images/pestana.gif);
   background-repeat: repeat-x;
}
ul.lenguetas li.activo a {
   border-bottom: 1px solid white;
   background-color: white;
}

ul.lenguetas li.inactivo a {
   color: gray;
}
ul.lenguetas li.inactivo a:hover {
   border-top: 1px solid #CCCS;
   background-image: none;
}























/*
** Autocomplete styles
*/
/* Suggestion list */
#autocomplete {
  position: absolute;
  border: 1px solid;
  overflow: hidden;
  font-family: sans-serif;
  font-size: 8pt;
}
#autocomplete ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#autocomplete li {
  background: #fff;
  color: #000;
  white-space: pre;
  cursor: hand;
  padding-left: 2px;
}
#autocomplete li.selected {
  background: #0072b9;
  color: #fff;
}
/* caracteres que conciden con el patron de busqueda */
#autocomplete .match {
  font-weight: bold;
}

/* Animated throbber */
input.autocomplete {
  background: url('images/autocomplete_loading.gif') no-repeat 100% 2px;
}
input.throbbing {
  background-position: 100% -18px;
}













/* autofecha */

div.autofecha {
   background-color: white;
   border: 1px solid #DDD;
   padding: 1px;
}
div.autofecha TABLE {
   background-color: white;
   border-collapse: collapse;
   font-size: 7pt;
}
div.autofecha TABLE TD {
   padding: 0px 2px;
}

div.autofecha A {
   text-decoration: none;
   color: black;
}
/* fila (1) de selección del mes y año */
div.autofecha TABLE TR.mes TD {
   text-align: center;
   font-weight: bold;
}
/* fila (2) de despliegue de los días de la semana */
div.autofecha TABLE TR.dias TD {
   text-align: center;
   font-weight: bold;
}
/* filas (3 en adelante) de despliegue de los días de les mes en curso */
div.autofecha TABLE TR.dia TD {
   /*border: 1px solid #ddd;*/
   text-align: right;
}
/* celdas con los días del mes (anterior, actual y el posterior) */
div.autofecha TD.mes {
}
/* celdas con los días del mes anterior */
div.autofecha TD.anterior A {
   color: gray;
}
/* celdas con los días del mes posterior */
div.autofecha TD.posterior A {
   color: gray;
}
/* celdas con los días del mes actual */
div.autofecha TD.actual {
   background-color: #E9F0F5;
}
/* celda con la fecha actualmente selecionada en el formulario */
div.autofecha TD.activo {
   background-color: #378BE7;
   font-weight: bold;
}
div.autofecha TD.activo A {
   color: white;
}
/* celda con la fecha de hoy */
div.autofecha TD.hoy {
   border: 1px solid red;
}
/* celda con un día feriado (incluye los días sábado) */
div.autofecha TD.feriado A {
   color: red;
}












/* mantenedor_multiopcion */



.multiopcion_div input.autocomplete {
  width: 180px;
}


.multiopcion_container { border: 1px solid #DDD; background-color: #E6E8FF; }
.multiopcion_container div { font-size: 0.9em; border: 0 solid #DDD; border-width: 0 0 1px 0; padding: 1px; }








































#contenido { 
   
   position: absolute;
   padding: 0px;
   top: 100px; 
   left: 0px; 
   width: 100%; 
   height: 100%;
 filter: progid:DXImageTransform.Microsoft.Shadow(direction=145,strength=2);

}




#titulo { 
   position: absolute;
   top: 99px; 
   left: 210px;
   font-size: 1.7em;
   font-weight: 600;
   color: white;
}

#empresa { 
   position: absolute;
   top: 0px; 
   left: 0px;
   width: 350px;
   height: 48px;

}







#usuario { 
   text-align: center;
   padding-right: 15px;
   font-size: 12px;
   font-weight: bold;
   color: white;
   filter: progid:DXImageTransform.Microsoft.Glow(color=black,strength=1);
}





#fecha { 
   position: absolute;
   top: 20px; 
   left: 0px;
   width: 99%;

   text-align: right;

   font-size: 9px;
   color: #CAFE15;
}



#links { 
   text-align: right;
   padding-right: 15px;
   font-size: 10px;
   font-weight: bold;
   color: white;   
}

#links A { 
   color: white;
   text-decoration: none;
}

#links A:hover { 
   color: #CAFE15;
}









/* 
   Formatos para impresiÑƒn
*/


@media print
{

#links,
#fecha,
.HVMenu,
.no_print {
   position: absolute; visibility: hidden;
}


#contenido {
   top: 30pt;
}

#titulo {
   width: 100%;
   text-align: center;
   top: 0px; left: 0px;
   font-size: 14pt;
   color: black;
}

#usuario {
   width: 100%;
   text-align: center;
   top: 18pt; left: 0px;
   font-size: 9pt;
   filter: none;
   color: black;
}


}

/** Redefinición de elementos YUI */



/** YUI menu */
div.yuimenubar li.selected {
    background-color:#106DA8;
}
div.yuimenubar li {
    font-size: 0.9em;
}




/** YUI button */

/** disminuyo el alto */
.yuibutton button { padding: 0.2em 0.5em;  }
.yuibutton a      { padding: 0.08em 0.5em; }

/** Icono contextuales */
.buscar .yuibutton button {
    background: url(images/lupa.png) no-repeat 1px;
    padding-left: 22px;
}

.guardar .yuibutton button {
    background: url(images/disk.gif) no-repeat 4px 2px;
    padding-left: 22px;
}





























/**
 * 
 * YUI datatable "table" usados en busquedas
 * 
 * Las paginas de busqueda tienen la siguiente estructura de DIVs
 * 
 * + busqueda <clase>
 *    + formulario-busqueda     Contiene el formulario
 *       + tabla-busqueda       Tabla con campos de busqueda
 *    + mensaje-busqueda        Mensaje en caso de no haber encontrado registros
 *    + yui-dt resultado-busqueda      Contiene tabla YUI DataTable con los resultados de la busqueda (2 clases)
 * 
 */
 
.resultado-busqueda              { min-height: 700px; }
.yui-dt div.opciones { width: 80px; }

.yui-dt table {
    margin: 0px auto;
    width: 770px;
    background-color: #FFF;
    border: 1px solid #DDD;
    border-collapse: collapse;
    font-size: 11px;
}
.yui-dt table th,
.yui-dt table td {
    padding: 0.4em 5px;
}

.yui-dt table tr.yui-dt-even {
    background-color: #FFFFFF;
}
.yui-dt table tr.yui-dt-odd {
    background-color: #EDF5FF;
}

.yui-dt table thead a,
.yui-dt table thead td,
.yui-dt table thead th {
    /*background-color: #5c9900;*/
  	 font-family: Arial, Helvetica, sans-serif;
    color: white;
    font-size: 11px;
    font-weight: bold;
}

.yui-dt tr td.yui-dt-loading {
    background: url(images/autocomplete_loading.gif) no-repeat 5px -15px;
    padding-left: 20px;
}




/** YUI datatable "pager" */
.yui-dt .yui-dt-pagelinks {
    display: block;
    margin: 3px auto;
    text-align: center;
    padding: 3px;
    font-size: 11px;
}
.yui-dt .yui-dt-pagelinks * {
    border: 1px solid #DDD;
    background-color: #FAFAF7;
    padding: 0px 5px;
    font-weight: bold;
}
.yui-dt .yui-dt-currentpage,
.yui-dt .yui-dt-pagelinks a:hover {
    border: 1px solid #DDD;
    background-color: #E3F2FC;
    color: #FF002C;
}

/** Oculto links a inicio y final */
.yui-dt .yui-dt-firstpage,
.yui-dt .yui-dt-lastpage,
.yui-dt .yui-dt-firstlink,
.yui-dt .yui-dt-lastlink {
    display: none;
}

/** Selector filas por pagina */
.yui-dt .yui-dt-pageselect {
    float: right;
    margin: -25px 10px 0 0;
}

.yui-dt tr.yui-dt-selected.yui-dt-odd { background-color: #8EEF4C; } 
.yui-dt tr.yui-dt-selected.yui-dt-even { background-color: #99EF60; } 




/** Celdas con iconos de opciones */
.yui-dt .opciones   {  }
.yui-dt .opciones a { display: block; float: left; text-indent: -10000px; margin: 0 1px; }
.yui-dt .opciones a.pdf  { width: 16px; height: 16px; background: url(images/iconos.gif) 0 0;     }
.yui-dt .opciones a.pdf2 { width: 16px; height: 16px; background: url(images/iconos.gif) 0 -50px;  }
.yui-dt .opciones a.xml  { width: 16px; height: 16px; background: url(images/iconos.gif) 0 -100px; }
.yui-dt .opciones a.txt  { width: 16px; height: 16px; background: url(images/iconos.gif) 0 -150px; }




/** Mensajes de busqueda sin resultados */
div.mensaje-busqueda {
   border-width: 1px; border-style: solid;
   color: black; font-weight: normal; text-align: center;
   padding: 15px; margin: 20px auto; clear: both; width: 50%;
   background-color: #FCE444; border-color: #E5BC24;
}

/** Formularios de búsqueda */
.formulario-busqueda {
    margin: 2px 10px 10px 10px;
    border: 2px solid #CCC;
    background-color: #E3F2FC;
}

.tabla-busqueda td {
    margin: 10px 2px;
    padding: 2px 7px;
}


.resumen-busqueda {
    margin-top: 10px;
    padding: 1px 5px 0px;
    background-color: #60A1CA;
    color: #E3F2FC;
    width: 360px;
    text-align: center;
    -moz-border-radius: 0 3px 0 0;
    border-radius: 0 3px 0 0;
    font-weight: bold;
}









/** Campos con datos numéricos */
input.numero,
input.numerico {
    width: 91px;
}

input.rut {
    width: 91px;
}



/** Elementos de formulario usados para desplegar datos calculados */
input.calculado {
    background: transparent none;
    border: none;
}

/* dato contenido es numérico */
input.autonumero,
.numero input,
.numero {
   text-align: right;
}

/* dato contenido es una fecha */
.fecha {
   text-align: center;
}














/** Formularios de edición */
.formulario-edicion {
    margin: 2px 10px 10px 10px;
    padding: 10px 2px;
    border: 2px solid #1673AE;
    background-color: #E3F2FC;
}



















/** Conjunto de botones que están bajo una tabla de listado */
.botones-pie-tabla {
    text-align: center;
    margin: 10px;
}





.campo-mantenedor-oculto { display: none; }
.campo-mantenedor-inactivo { background-color: #E7E7E7 !important; }



