/*********************************** Copyright Arribas&Galobart 2006 ***********************************/
/**** Estilos tradicionales ***/

body {
	scrollbar-arrow-color:#D6D6D6;
	scrollbar-base-color:#F1F1F1;
	scrollbar-shadow-color:#B8B8B8;
	scrollbar-face-color:#F1F1F1;
	scrollbar-highlight-color:#F7F7F7;
	scrollbar-darkshadow-color:#F1F1F1;
	scrollbar-3dlight-color:#B8B8B8;
	margin: 0px;
	padding-top: 5px;
	background: #626262 url(../graficos/fondo-general.gif) repeat-x left top;
}

form {margin: 0px 1px 0px 3px;}
strong { font: bold 11px/16px "Trebuchet MS", Tahoma, Arial, geneva, sans-serif; color: #757575; }
P { font: normal 11px/16px "Trebuchet MS", Tahoma, Arial, geneva, sans-serif; color: #666666; }


.contenido { width:792px; vertical-align: top; height: auto; background: url(../graficos/fondo-interior.gif) repeat-y center top;}
.menu { width:792px; vertical-align: middle; text-align: center; height: 43px; background: url(../graficos/menu01.gif) no-repeat left top;}
.links { width:471px; padding: 3px 0px 0px 12px; vertical-align: middle; height: 40px;}

/************************* Menu ***********************************/

.submenu { font: 10px/normal Tahoma, Arial, Helvetica, Verdana; text-align: left; padding: 0px 3px ; width:303px; vertical-align: middle;}
.submenu A:link { color: #333333; text-decoration: none; padding: 1px; }
.submenu A:hover {color: #FFFFFF; background: #ABA37E; padding: 1px; text-decoration: none;}
.submenu A:visited { color: #333333; text-decoration: none; padding: 1px; }
#bandera{ background: none; padding: 0px;}

.pie { font: 10px/normal Tahoma, Arial, Helvetica, Verdana; color: #FFFFFF; width:615px; vertical-align: middle; background-image: url(../graficos/fondo-pie.gif); background-repeat: repeat-x; background-position: center top; height: 75px;}
.pie A:link { color: #FFFFFF; text-decoration: none; padding: 1px;}
.pie A:hover { color: #E9E6BA; text-decoration: none; padding: 1px;}
.pie A:visited { color: #DDDDDD; text-decoration: none; padding: 1px;}
.pie strong{font: bold 10px/normal Tahoma, Arial, Helvetica, Verdana; color: #FFFFFF; }

.top { vertical-align: top;}
.bottom { vertical-align: bottom; padding-bottom: 130px;}


/************************* Columnas principales ***********************************/

.columna01 { width:244px; vertical-align: top; height: auto; text-align: left; padding: 5px 5px 5px 5px;}
.columna02 { width:244px; vertical-align: top; height: auto; text-align: left; padding: 5px 5px; border-left: 1px solid #F2F2F2;}
.columna03 { width:250px; vertical-align: top; height: auto; background: url(../graficos/fondo-columna.gif) repeat-y;}
.columna04 { width:508px; vertical-align: top; height: auto; text-align: left; padding: 5px 0px;}
.columna05 { width:254px; vertical-align: top; height: auto; text-align: left; padding: 10px 5px 5px;}
.columna06 { width:762px; vertical-align: top; height: auto; text-align: left; padding: 10px 5px 5px;}

#titulo-columna{ font: bold 12px "Trebuchet MS"; color: #8B735A; background: url(../graficos/columna-titulo.gif) repeat-y; height: 20px; 	width: auto;	padding: 5px 5px 5px 12px;}

.links-texto{ font: normal 10px Tahoma, Arial, Helvetica, Verdana; color: #333333; text-align: center; height: 40px; width: 792px; vertical-align: middle;}
.links-texto A:link { color: #333333; text-decoration: none; padding: 1px;}
.links-texto A:hover { color: #FFFFFF; text-decoration: none; background: #333333; padding: 1px;}
.links-texto A:visited { 	color: #DDDDDD; text-decoration: none; padding: 1px;}

.fechas{
	font: normal 10px/14px Tahoma, Arial, Helvetica, Verdana;
	color: #666666;
	padding: 3px 5px 3px 3px;
}
#extended{ color: #990000;}
#mes{ color: #FFFFFF; background: #ABA37E; 	padding: 2px;}
.fondoanima{ background-color: #FFFFFF;}

/************************************* Interior *********************************************/

.datos { font: 11px/normal Tahoma, Arial, Helvetica, Verdana; color: #484853; text-align: right; padding-right: 10px; height: 20px; width: 285px; border-top: 1px solid #DDDDDD;}
.forms { font: 10px/normal Tahoma, Arial, Helvetica, Verdana; color: #333333; text-align: left; height: 20px; width: 423px; border-top: 1px solid #DDDDDD; padding: 5px 0px 5px 20px;}
#color{ background: #F2F4F9;}
.fondo-form{ background: url(../graficos/formtable-fondo.gif) repeat-y;}
.titulos{ font: bold 11px/normal Tahoma, Arial, Helvetica, Verdana; color: #FFFFFF; text-align: left; height: 30px; background: #8F919E; border-top: 1px solid #DDDDDD; vertical-align: middle; padding: 3px 5px 3px 5px;}

/************************************* Itinerarios *********************************************/

.dias{ height: 30px; width: 10%; font: bold 10px Tahoma, Arial, Helvetica, Verdana; color: #666666; vertical-align: top; text-align: center; padding: 3px 0px; border-top: 1px solid #DDDDDD;}
.itinerario{ font: normal 11px Tahoma, Arial, Helvetica, Verdana; color: #666666; height: 30px; vertical-align: top; text-align: left; padding: 3px; border-top: 1px solid #DDDDDD;}
.leyenda{ font: normal 11px Tahoma, Arial, Helvetica, Verdana; color: #666666; text-align: left; padding: 5px 18px;}
.itinerario strong { font: bold 10px Tahoma, Arial, Helvetica, Verdana; color: #666666;}
#titulos{ font: bold 10px Tahoma, Arial, Helvetica, Verdana; color: #666666; background: #CAD1DF;}
#centrados{ font: bold 10px Tahoma, Arial, Helvetica, Verdana; color: #666666; background: #CAD1DF; text-align: center;}


/************************************* Fechas *********************************************/

.tabla{ font: normal 11px Tahoma, Arial, Helvetica, Verdana; color: #666666; vertical-align: top; text-align: left; padding: 3px; border-top: 1px solid #DDDDDD; height: 25px;}
#trip{ width: 10%; font-weight: bold; font-size: 9px;}
#route{ width: 15%;}
#date{ width: 27%;}
#datebold{ width: 27%; font-weight: bold; font-size: 10px;}

/************************************* Tablas bonitas *********************************************/

.fondotabla{ width: 506px; background: url(../graficos/fechas-fondo.gif) repeat-y; text-align: center; padding: 0px 0px;}
.fondogrande{ width: 746px; background: url(../graficos/fondo-grande.gif) repeat-y;}

/************************************* Express *********************************************/

.base{ width: 234px; background: url(../graficos/express-fondo.gif) repeat-y; text-align: center; padding: 0px 0px;}
.alto{ padding:5px 5px 5px 10px; height:30px; text-align: left; font: 10px/normal Tahoma, Arial, Helvetica, Verdana; color: #666666;}
#tform{ width: 55px; margin-top: 0px; float: left; height: 20px; vertical-align: middle; font: normal 11px Tahoma, Arial, Helvetica, Verdana; color: #333333; padding-left: 5px;}
#formexpress{ width: 216px; margin-top: 0px;  margin-right: auto;  margin-bottom: 0px;  margin-left: auto;}
.textfield{ font-family: Tahoma, Arial, geneva, sans-serif; font-size: 11px; color: #222222; width: 140px; height: 20px; border-width: 0px; margin: 0px; padding: 0px; border-style: none; background: url(../graficos/spacer.gif);}
#forms{ float: left; margin: 0; 	margin-left: ; margin-right: ; width: 140px; height: 20px; background: url(../graficos/form-background.gif) repeat-x;}

/************************************* Almanaque *********************************************/

.calendar{ width: 739px;}
.mes{ font: 10px Tahoma, Arial, Helvetica, Verdana; text-align: center; height: 20px; border-top: 1px solid #FFFFFF;}
.mes strong{ font: bold 10px/20px Tahoma, Arial, Helvetica, Verdana; color: #660000; height: auto; display: block;}
#low{ background: #FFE888;	width: 20px;}
#lowref{ background: #FFE888;}
#mid{ background: #B8EDED;	width: 20px;}
#midref{ background: #B8EDED;}
#high{ background: #E97543; width: 20px;}
#highref{ background: #E97543;}
#none{ background: #E4E4E4; width: 20px;}
#derecha{ border-right: 1px solid #CCCCCC; font-weight: bold; color: #FFFFFF; background: #57586A; 	width: auto;}
#doble{ border-right: 1px solid #CCCCCC; border-left: 1px solid #333333; font-weight: bold; color: #FFFFFF; background: #57586A;	width: auto;}
#izquierda{ font-weight: bold; color: #FFFFFF; background: #57586A; border-left: 1px solid #333333;	width: auto;}
#referencia{ text-align: left; padding: 10px;}


/********* Descripcion Itinerarios ***********/

#contenedor{ height: auto; width: 730px; border-bottom: 1px solid #DDDDDD; padding: 10px 0px; text-align: left; float: left;}
#cartel{ height: 100%; width: 55px; float: left; vertical-align: top;}
#tit{ font: bold 18px "Trebuchet MS"; color: #7C8694; height: 40px; width: 655px; float: left; vertical-align: bottom; padding: 15px 5px 0px 15px;}
#texto{ font: 11px/15px Tahoma, Arial, Helvetica, Verdana; color: #666666; height: auto; width: 655px; float: right; vertical-align: top; padding: 5px 5px 0px 0px; text-align: left;}

/********* Links generales - Cabeceras ***********/

sup {font-family:Arial, geneva, sans-serif; font-size: 9pt;} 
A:link { color: #5E748A; text-decoration: none; }
A:hover { color: #003366; text-decoration: underline;}
A:visited {color: #BE7474; text-decoration: none;}

h1{ font-family: "Trebuchet MS"; font-size: 20px; color: #999999; font-weight: normal; line-height: normal; padding: 3px 0px 0px 0px; font-style: italic; text-align: center;}
h2{ font-family: "Trebuchet MS", Tahoma, Arial, geneva, sans-serif; font-size: 14px; color: #49689C; font-weight: bold; line-height: 16px; padding: 0px; height: auto; margin: 0px;}
h3{font-family: Tahoma, Arial, geneva, sans-serif; font-size: 11px; color: #CC9900; font-weight: bold; line-height: normal; margin: 0px; padding-top: 3px; padding-right: 0px; padding-bottom: 3px;}
h4{font-family: Tahoma, Arial, geneva, sans-serif; font-size: 20px; color: #657798; font-weight: bold; line-height: 25px; margin: 0px; padding: 0px 0px 0px 10px;}
h5{font-family: Tahoma, Arial, geneva, sans-serif; font-size: 20px; color: #FFFAEF; font-weight: bold; line-height: 12px; margin: 0px; padding: 0px 0px 0px 10px;}


/********* Formularios ***********/

.error{ width:755px; font: bold 16px Tahoma, Arial, Helvetica, Verdana; color: #990000; text-align: left; vertical-align: middle; height: 200px; padding-left: 25px;}
.error A:link { font: bold 11px Tahoma, Arial, Helvetica, Verdana; color: #003366;}
.error A:hover{ font: bold 11px Tahoma, Arial, Helvetica, Verdana; color: #3300FF;}
.error A:visited{ font: bold 11px Tahoma, Arial, Helvetica, Verdana; color: #990000;}

.gracias{ width:755px; font: bold 16px Tahoma, Arial, Helvetica, Verdana; color: #003366; text-align: left; vertical-align: middle; height: 200px; padding-left: 25px;}
.gracias A:link { font: bold 11px Tahoma, Arial, Helvetica, Verdana; color: #003366; }
.gracias A:hover{ font: bold 11px Tahoma, Arial, Helvetica, Verdana; color: #3300FF;}
.gracias A:visited{	font: bold 11px Tahoma, Arial, Helvetica, Verdana; color: #990000;}

#formcontent{ width: 216px;}
#formleft {float: left; height: 20px; width: 8px; background: url(../graficos/form-start.gif);}
#obligatory { float: left; height: 20px; width: 8px; background: url(../graficos/form-obligatory.gif);}
#formright{ float: right; height: 20px; width: 8px; background: url(../graficos/form-end.gif);}
#campo{ float: left; margin: 0; 	margin-left: ; margin-right: ; width: 200px; height: 20px; background: url(../graficos/form-background.gif) repeat-x;}

.Z1-Lista-Menu{ font-family: Tahoma, Arial, geneva, sans-serif; font-size: 11px; line-height: normal; color: #555555; height: 17px; background-color: #FFFFFF; border: 1px solid #DDDDDD; width: 216px; height: 20px; background-image: url(../graficos/form-background.gif); background-repeat: repeat-x; background-position: left top;}
.Z2-CampoDeTexto{ font-family: Tahoma, Arial, geneva, sans-serif; font-size: 11px; color: #222222; width: 200px; height: 20px; border-width: 0px; margin: 0px; padding: 0px; border-style: none; background: url(../graficos/spacer.gif);}
.Z4-AreaDeTexto{ font-family: Tahoma, Arial, geneva, sans-serif; font-size: 11px; line-height: normal; color: #222222; background-image:  url(../graficos/area-background.gif); border-top: 0px solid #CCCCCC; border-bottom: 1px solid #CCCCCC; border-left: 1px solid #CCCCCC; border-right: 0px solid #CCCCCC; width: 218px; height: 50px; background-repeat: repeat-x; background-position: left top; background-color: #FFFFFF;}
.Z6-Seleccion-Opcion{ border-top: 1px solid #666666; border-bottom: 1px solid #666666; border-left: 2px solid #666666; border-right: 1px solid #666666;}


/************** Menú desplegable ***********************/

.suckertreemenu ul{
	margin: auto 0px;
	padding: 0px;
	list-style-type: none;
	vertical-align: middle;
}

/*Top level list items*/
.suckertreemenu ul li{
	position: relative;
	display: inline;
	float: left;
	vertical-align: middle;
}

/*Top level menu link items style*/
.suckertreemenu ul li a{
	font: bold 10px/15px Tahoma, Arial, Helvetica, Verdana;
	display: block;
	width: auto; /*Width of top level menu link items*/
	padding: 2px 5px;
	text-decoration: none;
	color: #49689C;
	float: left; /* sin esto, en IE6 no funciona mal */

}

.suckertreemenu ul li a:hover{
	color: #222222;
	text-decoration: none;
}

#sep1{border-right: solid 1px #d8cd9b; width: 78px; }
#sep2{border-right: solid 1px #d8cd9b; width: 134px; }
#sep3{border-right: solid 1px #d8cd9b; width: 98px; }


#separador{border-right: solid 1px #d8cd9b; }
	
/*1st sub level menu*/
.suckertreemenu ul li ul{
	margin:0px;
	left: 0px;
	position: absolute;
	top: 1em; /* no need to change, as true value set by script */
	display: block;
	visibility: hidden;

}

/*Sub level menu list items (undo style from Top level List Items)*/
.suckertreemenu ul li ul li{
/*display: list-item;*/
	float: none;


}

/*All subsequent sub menu levels offset after 1st level sub menu */
.suckertreemenu ul li ul li ul{
	left: 159px; /* no need to change, as true value set by script */
	top: 0px;

}

/* Sub level menu links style */
.suckertreemenu ul li ul li a{
	display: block;
	width: 130px; /*width of sub menu levels*/
	text-decoration: none;
	padding: 5px 2px 5px 20px;
	text-align: left;
	border-top: 1px solid #C4B9AA;
	background: #fff0d0 url(../graficos/flecha.gif) no-repeat 3px center;

}

#espaniol {width: 150px; margin:0px;}
#info {width: auto; margin:0px;}

* html p#iepara{ /*For a paragraph (if any) that immediately follows suckertree menu, add 1em top spacing between the two in IE*/
	padding-top: 10px;
}
	
/* Holly Hack for IE \*/
* html .suckertreemenu ul li { float: left; height: 1%;   }
* html .suckertreemenu ul li a { height: 1%; }
/* End */


/**************** Utility Rules *******************/

/*\*/ /*/
.sidenav a:hover {position: relative;}
/* this fixes an IEmac hover bug in the left column, hidden from other browsers */


.brclear { /* Use a break with this class to clear float containers */
  clear:both;
  height:0;
  margin:0;
  font-size: 1px;
  line-height: 0;
}
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}


div#qTip {
	font: normal 9px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	text-align: left;
	padding: 3px;
	border-top:1px solid #8B8161;
	border-right: 1px solid #8B8161;
	border-bottom: 1px solid #8B8161;
	border-left: 1px solid #8B8161;
	display: none;
	position: absolute;
	z-index: 1500;
	-moz-opacity: .85;
	opacity: .85;
	filter: alpha(opacity=90);
	min-width:auto;
	background: #333333;
}
