/**
*
* barra de menus
*
*/

#barraMenu { /* Menu principal */
border-top   : 2px solid #fff;
border-bottom: 2px solid #fff;
top      : 0px;
left     : 0px;
width : 100%;
background-color: #000 ;
padding  : 2px 0px;
color: #fff; }

#barraMenu a {
text-transform : uppercase;
color: #fff;
padding: 2px 0.5em  ;
font-size: 0.9em;
font-weight: bold;}

#barraMenu a.inicio {
background: #E20B15 url(images/flecha1.gif) no-repeat 8px 5px;
padding-left: 25px !important;   }

#barraMenu a:hover {
background-color:#aaa ;   }

#barraMenuClient { /* Menu principal */
border-top   : 2px solid #fff;
border-bottom: 2px solid #fff;
top      : 0px;
left     : 0px;
width : 100%;
background-color: #000 ;
padding  : 2px 0px;
color: #fff; }

#barraMenuClient a {
text-transform : uppercase;
color: #fff;
padding: 2px 0.5em  ;
font-size: 0.9em;
font-weight: bold;}

#barraMenuClient a.inicio {
background: #E20B15 url(images/flecha1.gif) no-repeat 8px 5px;
padding-left: 25px !important;   }

#barraMenuClient a:hover {
background-color:#aaa ;   }


body {
background: #fff ;
margin :0;
padding:0;
}

.validacion
{ width:8em; margin-bottom:1px; margin-top:1px;}


body, p, td, th, input, textarea, select, li, ul, ol {
font: normal normal 10px Verdana,Univers,Arial,sans-serif;}

/**
* optimizacion datagrid
*/

.tabladerecha{
	text-align:right;
	padding-right:10px;
}

.tablaizquierda{
	text-align:left;
	padding-left:10px;
}

.tdmes{
width:60px;
text-align:center;
height:20px;
border-right:1px solid #cccccc;
border-top:1px solid #aaaaaa;
border-bottom:1px solid #333333;
background-color:#DDDDDD;
}

.tdmessel{
width:60px;
text-align:center;
height:20px;
border-right:1px solid #333333;
border-top:1px solid #333333;
border-left:1px solid #333333;
background-color:#CCCCCC;
}

.mes{
	font-size:11px;
	color:#000000;
}

A.mes:hover{
	font-size:11px;
	color:#ff0000;
}

.messel{
	font-size:12px;
	font-weight:bold;
	color:#CC0000;
}

.imprimir{
	font-size:12px;
	color:#FFFFFF;
	font-weight:bold;

}

A.imprimir:hover{
	font-size:12px;
	color:#FF0000;
	font-weight:bold;
}


/**
* optimizacion
*/

div {
   position: relative;
   margin : 0;
   padding: 0;
}

a { text-decoration: none}


/**
*  DEFINICION DE LAYOUT BASICO
*/

#pagina {
border  : none;
padding : 0 0 20px 0;}

#cabecera { /* Menu principal */
height   : 117px;
background: #334394 url(images/logo.gif) 22px 20px  no-repeat; }

#pie {
font-size: 0.8em;
color: #666;
}

/**
*  ESTILOS DE HTML
*/


h1 {
font-size: 2em;
font-weight:bold;
color: #334394;
text-align: left;
background: url(images/flecha2.gif) no-repeat 10px 5px;
padding-left: 35px;
margin: 15px 0px 10px 0px;  }

h1.edicion {
text-align: center;
background: #fff;
padding: 0px;
margin: 10px 0px;
}

h2 {
font  : bold normal 12px Verdana,Univers,Arial, sans-serif;
color : #444 ;
text-transform: uppercase;
background-color: #ededed;
border-top: 1px solid black;
padding:2px 10px;  }

h3 {
font: bold normal 12px Verdana,Univers,Arial,sans-serif;
color: #000 ;
padding:2px  10px;
text-align :center;
text-transform: uppercase;
background-color: #eee; }

h4 {
font: normal normal 12px Verdana,Univers,Arial,sans-serif;
color: #666 ;
padding: 2px 10px;
text-align:center;
background-color: #eee;
border-bottom: 1px dotted #666;}


/**
 *  TABLAS DE EDICION Y RESULTADOS
 *  Una vez definida la clase de una tabla, usar td y th para datos y cabeceras sin clase.
 */


/* .......table.cabecera: se usa para los datos de cliente que se muestran en la cabecera .......*/
table.cabecera {
border-collapse:collapse;
position: absolute;
right  : 20px;
top    : 35px;}

table.cabecera th {
padding: 1px 10px;
margin: 0;
color: #fff;
font-weight: bold;
text-align: right;}

table.cabecera td {
padding: 1px 10px;
width: 150px;
margin: 0;
background-color: #505da2;
color: #d9dbe5;
border: 1px #d9dbe5 solid; }







/*
* Estilos generales
*/

a.flecha3       { background: url(images/flecha3.gif)  0 0 no-repeat ; width:12px; height:12px; margin-left: 8px;}
a.flecha3:hover { background: url(images/flecha3x.gif) 0 0 no-repeat}
a.flecha3 img   { border: 0 none}

form.busquedas { /* para definir las busquedas */
margin: 0px;
position  : relative;
overflow  : auto;
border-top: 7px solid #334394;
background: #e1e0c3;
color     : #334394;
padding   : 8px 20px;}

table.tabladatos{
margin: 0px;
width:100%;
border:0px;
border-top: 7px solid #334394;
background-color: #e1e0c3;
color     : #334394;
padding   : 8px 20px;}


table.tabladatos th {
  text-align  :right;
  vertical-align:top;
  color     : #444444;
  font-weight:bold;
  white-space :nowrap;}

table.busquedas th {
  text-align  :right;
  padding-left:10px;
  white-space :nowrap;}


.botontabla{
width:130px;
color:#FFFFFF;
text-align:center;
font-size:12px;
font-weight:bold;
background-color:#999999;
border-top:1px solid #666666;
border-bottom:1px solid #666666;
border-right:1px solid #666666;
border-left:1px solid #666666;
}


/*
*
* Tabla de banner o anuncio.
*
*/

table.anuncio {
width: 100%;
margin    : 2px 0 5px 0;
border    : none;
padding   : 0;
position  : relative;
background: #e1e0c3;
color     : #334394;
font-size : 20px !important;   }

table.anuncio td.derecha {
font-size:: 1.5em;
text-align: right;
width: 45%;
padding: 12px 0 12px 0;   }

table.anuncio td.izquierda {
font-size:: 1.5em;
text-align: left;
padding: 12px 0 12px 1%;}

table.anuncio h2 {
margin: 1px 0px;
text-transform: uppercase;
padding:0;
border: none;
background-color:#e1e0c3;
color: #334394;
font-size: 1.4em}

table.anuncio strong {
color: #e20a16}

/**
*  DIALOGOS CON EL USUARIO
*/

div.error { /* cuadro de error, centrado en pantalla y fondo spiral */
width: 350px;
min-height: 180px;
margin: 10px auto;
padding: 20px 20px 20px 120px;
color: #fff;
font-weight: bold;
background: #990000 url(images/fondo_error.gif) no-repeat;}

div.error a {
color: #fff;
text-decoration: underline;}

div.aviso { /* cuadro para mostrar algo de manera destacado */
width: 400px;
min-height: 100px;
margin: 15px auto;
border: 1px solid #666;
padding: 10px 10px 10px 100px;
background: #ffffdf url(images/fondo_aviso.gif) no-repeat;  }

p.aviso {
max-width: 300px;
text-align:justify;
padding: 10px;
background-color: #FFFF7F ;
margin: 5px auto;}

div.informacion { /* cuadro para mostrar informacion, como el resultado de una modificación */
width: 350px;
min-height: 60px;
text-align:center;
vertical-align: middle;
margin: 50px auto;
border: 1px solid #666;
background: #fff url(images/fondo_cabecera.gif) repeat-x;
padding: 15px ;   }


div.dialogo {
position   : relative;
background-color: #e0e0e0;
padding    : 4px ;
margin      : 0 ;
text-align : left;
overflow   : visible; }


/**
* LAYOUT GENERICO
*/

div.contenedor{
position: relative ;
height  : auto;}

div.col_1de2, div.col_2de2 {
float: left;
width    : 49%;
}

div.col_1de3, div.col_1de3, div.col_3de3 {
float: left;
padding-left    :  2%;
padding-right   :  2%;
width    : 29%;
}


/**
* MINI ESTILOS O SPAN
* se usan para trozos de textos
*/

span.no, span.error {
color: #990000;
font-weight: bold; }


/**
* FORM y INPUT
*/



input.reducido   { width: 8em; margin-bottom:1px; margin-top:1px}
input.euro       { width: 8em; margin-bottom:1px; margin-top:1px; text-align:right ;}
input.numero     { width: 8em; margin-bottom:1px; margin-top:1px; text-align:right ;}
input.fecha      { width:10em; margin-bottom:1px; margin-top:1px; text-align:left ;}
select           { width:14em; margin-bottom:1px; margin-top:1px}
select.siNo      { width: 75px; margin-bottom:1px; margin-top:1px }
textarea         { width:200px; height:75px }
textarea.ancho         { width:350px; height:75px }
textarea.anchoylargo   { width:350px; height:250px }

/*
* ESTILOS PARTICULARES DE CADA PAGINA
*
*/

/* pagina de identificacion (home) */
#pagina_entrada    { background-color: #334394 ; }
form.entrada input { width: 8em; display:inline; margin-left:1em; }


/* .............................

Estilos especiales
.................................*/


a.buscar img { border: 0 none }
a.buscar       { background: url(images/buscar.gif) 0 0 no-repeat; display:block; width:74px;float:left;margin-left: 20px; }
a.buscar:hover { background: url(images/buscarx.gif)0 0 no-repeat;}


a.ordenActivo,
a.ordenAsc,
a.ordenDesc {
  display: block;
  margin: 3px 0px 1px 0px;
  color: #fff;
  padding-left: 15px;
  background-repeat: no-repeat}

a.ordenActivo:hover,
a.ordenAsc:hover,
a.ordenDesc:hover { color: #EEC}

a.ordenActivo          { background-image: url(images/item_activo.gif)}
a.ordenActivo:hover    { background-image: url(images/item_ascx.gif)  }
a.ordenDesc            { background-image: url(images/item_desc.gif)  }
a.ordenDesc:hover      { background-image: url(images/item_descx.gif) }
a.ordenAsc             { background-image: url(images/item_asc.gif)   }
a.ordenAsc:hover       { background-image: url(images/item_ascx.gif)  }