/*--------------------------------------------------------------------------
 Clic 2008
----------------------------------------------------------------------------
 File: layout.css
	    Gerardo Gonzalez Flores
 		--> gerardo AT clic DOT com DOT mx <--
---------------------------------------------------------------------------		
 CSS Layout styles for the web site.
 Layout CSS para el sitio.
--------------------------------------------------------------------------*/


/* Layout
-------------------------------------------------------------------*/
 body {
	background: #ECECEC;
 }

 
 #wrapper{
	width:774px;
	position:relative;
	margin-left:-387px;
	left:50%;
	background-image:none;
 }
 #header{
 	background: url(../img/header_bg.jpg) no-repeat top;
	width: 774px;
	height:381px;
	position:relative;
 }
 

 #body{
	background: url(../img/body-top.jpg) no-repeat top;
 }
 
 #bodyHome{
	background: url(../img/body-top.jpg) no-repeat top;
 }
 
 #footer{
 	background: url(../img/pie-bg.jpg) #FF9900 no-repeat;
	width:774px;
	position:relative;
	font-size:9pt !important;
	text-align:center;
	min-height: 55px;
	height: auto !important;
	height: 55px;
	clear:both;
	
	
 }
 
 .contenido img.promocharter {
 	padding:1px; 
	border: 4px solid #0069B0;
	
 }
 
 
 
/* =Layout343
-------------------------------------------------------------------*/

/* Header 
-------------------------------------------------------------------*/
 #logo	{
 	width:241px;
	height:319px;
	background: url(../img/logo.jpg) no-repeat top;
	position:absolute;
	top:0px;
	left:0px;
	
 }
 
 #logo h1 { display:none;}
 
 #banner{
 	width:533px;
	height:319px;
	background: url(../img/banner.jpg) no-repeat top;
	position:absolute;
	top:0px;
	left:241px;
 }
 
 #bannerBody{
 	position:absolute;
	top:16px;
	left:71px;
	
 }
 
 #menuArea { 
 	height:62px;
	width:774px;
	background: url(../img/area-menu.jpg) no-repeat top;
    position:absolute;
	top:319px;
	left:0px;
 }
 
 #menu { 
 	height:50px;
	width:730px;
    position:absolute;
	top:0px;
	left:20px;
 }
  

 #quickLinks {
 	position:absolute;
	height:244px;
	width:42px;
	top:279px;
	left:69px;
	/*border:1px solid;*/
 }
 ul#quickLinks, ul#quickLinks li { padding:0px; margin:0px}
 #bannerArea h2,  #bannerArea span.atnRep { display:none;}

 #quickLinks li{ list-style:none;  background: none;}
 #quickLinks  li.home,  #quickLinks  li.contact, #quickLinks  li.siteMap {
	position:absolute;
 }
 #quickLinks a { display:block; width:45px; height:23px; }
 
/* #quickLinks a:hover { background: url(../img/home.gif) 50% 50% no-repeat #ff0000} */
 #quickLinks a span { display:none;}
 #quickLinks  li.home  { left:0px;top:0px;}
 #quickLinks  li.contact { left:45px;top:0px;}
 #quickLinks  li.siteMap { left:90px;top:0px;}
 
 #quickLinks  li.home a { background: url(../img/home.gif) 50% 50% #FF8F4D no-repeat;  }
 #quickLinks  li.home a:hover { background: url(../img/home-over.gif) 50% 50% #E2E4D9 no-repeat; }
 
 #quickLinks  li.contact a { height:23px; background: url(../img/contacto.gif) #FF8F4D 50% 50% no-repeat;  }
 #quickLinks  li.contact a:hover { background: url(../img/contacto-over.gif) 50% 50% #E2E4D9 no-repeat; }
 
 #quickLinks  li.siteMap a { height:23px; background: url(../img/mapa-sitio.gif) #FF8F4D 50% 50% no-repeat; }
 #quickLinks  li.siteMap a:hover { background: url(../img/mapa-sitio-over.gif) 50% 50% #E2E4D9 no-repeat; }

 

 

/* =Header
------------------------------------------------------------------*/
/* Body
------------------------------------------------------------------*/
#contenido, .contenido{
 	/*width:60%;*/
	padding-top:10px;
	padding-bottom:10px;
	text-align:justify;
	min-height: 400px;
	height: auto !important;
	height: 400px;
	/*border:1px solid;*/
	
	padding-left:10px;
	padding-right:10px;
	background: url(../img/body-bg-inner.jpg) repeat-y top;
	
 }
 
 #bodyHome #contenido, #bodyHome  .contenido{
	background: url(../img/body-bg.jpg) repeat-y top;
	
 }
 
 
 /* Le ponemos el fondo a la paginacion */
 #paginacion {margin-top:0px; padding-bottom:5px; background: url(../img/content_bg.jpg) repeat-y top;}
/* =Body
------------------------------------------------------------------*/


/* Footer 
------------------------------------------------------------------*/
 #footerContent{
	display:none;
	/*position:absolute;*/
	width:774px;
	/*top:9px;*/
	/*	left:34px;*/
	height:55px;
	/*line-heihht:46px;*/
	padding-top:5px;
 }
 
 #footerContent h3 { display:none}
 
 #footerFood{
	/* background: url(../img/footer_food_bg.jpg) top no-repeat;*/
	 height:11px;
	 text-align:right;
	 padding-right:10px;
	
 }
 
/* URL de pie de página de CLIC*/
 #clic {
	position:relative; 
 }

 #clicUrl
 {
	position:absolute;
    right:5px; 
	top:1px;
	color:#000000;
	text-decoration:none;
	display:block;
 } 

 #clicUrl h3{
	background:none;
	font-weight:normal; 
	font-size:7pt;
 }

/* =Footer
-------------------------------------------------------------------*/
.message{
	padding:10px;
	margin-top:35px;
	background:#FFDEDE;
	width:338px;
	text-align:center;
	border:1px solid #FF7F7F;
}
	
#flashMessage{
	background:#FFDEDE;
	border:1px solid #FF7F7F;
	/*height:20px;*/
	padding:3px;
	width:250px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	margin-bottom:10px;
}


/**** MENU LEFT ******/
 #menuLeft, #menuRight {
 	position:relative;
	/*border:1px solid;*/
	width:222px;
	height:312px;
 }
 
 #menuLeft ul#quickLinks, #menuRight ul#quickLinks {
 	position:absolute;
	top:0px;
	left:0px;
 }

 #menuLeft ul#quickLinks  li.playa,  ul#quickLinks  li.montania, ul#quickLinks  li.ciudad 
 {
	position:absolute;
 }
 #menuLeft ul#quickLinks a, #menuRight ul#quickLinks a  { display:block; width:222px; height:104px;}
 
 #menuLeft ul#quickLinks  li.playa, #menuRight ul#quickLinks  li.playa { left:0px;top:0px;}
 #menuLeft ul#quickLinks  li.montania, #menuRight ul#quickLinks  li.montania{ left:0px;top:104px;}
 #menuLeft ul#quickLinks   li.ciudad,  #menuRight ul#quickLinks   li.ciudad { left:0px;top:208px;}
 
 #menuLeft ul#quickLinks  li.playa a { background: url(../img/dest-playa-sprite.jpg) 0px 0px  no-repeat; }
 #menuLeft ul#quickLinks  li.playa  { background: url(../img/dest-playa-sprite.jpg) 0px -104px  no-repeat; }
 #menuLeft ul#quickLinks  li.playa a:hover { background: none; }
 
 #menuLeft ul#quickLinks  li.montania a {  background: url(../img/dest-montania-sprite.jpg) 0px 0px no-repeat; }
 #menuLeft ul#quickLinks  li.montania { background: url(../img/dest-montania-sprite.jpg) 0px -104px  no-repeat; }
 #menuLeft ul#quickLinks  li.montania a:hover { background: none; }
 
 #menuLeft ul#quickLinks  li.ciudad a {  background: url(../img/dest-ciudades-sprite.jpg) 0px -104px no-repeat;  }
 #menuLeft ul#quickLinks  li.ciudad  { background: url(../img/dest-ciudades-sprite.jpg) 0px 0px  no-repeat; }
 #menuLeft ul#quickLinks  li.ciudad a:hover { background: none; }
 
 /* Rollo overs interiores */
 
 #menuRight ul#quickLinks  li.playa a { background: url(../img/dest-playa-inner-sprite.jpg) 0px 0px  no-repeat; }
 #menuRight ul#quickLinks  li.playa { background: url(../img/dest-playa-inner-sprite.jpg) 0px 104px  no-repeat; }
 #menuRight ul#quickLinks  li.playa a:hover { background:none; }
 
 #menuRight ul#quickLinks  li.montania a {  background: url(../img/dest-montania-inner-sprite.jpg)  0px 0px no-repeat; }
 #menuRight ul#quickLinks  li.montania  { background: url(../img/dest-montania-inner-sprite.jpg)  0px 104px  no-repeat; }
 #menuRight ul#quickLinks  li.montania a:hover { background: none; }

 #menuRight ul#quickLinks  li.ciudad a {  background: url(../img/dest-ciudades-inner-sprite.jpg)  0px 0px  no-repeat;  }
 #menuRight ul#quickLinks  li.ciudad { background: url(../img/dest-ciudades-inner-sprite.jpg)  0px 104px  no-repeat; }
 #menuRight ul#quickLinks  li.ciudad a:hover  { background:none; }
 
 /***/


 #bodyHome #textContent{
 		width:39%;
		float:left;
		padding-right:5px;
 }
 #bodyHome #paquetes{
 		width:30%;
		float:right;
 }
 
 /* paquetes en pagina interiores*/ 
  #paquetesHome{
 		width:29%;
		float:right;
		/*border:1px solid;*/
 }
 
 #textContent {
		width:70%;
		float:left;
		/*border:1px solid;*/
 }

 #bodyHome #contenido{ padding-left:10px; padding-right:10px;}
 #bodyHome #menuLeft{
 		width:30%;
		float:left;
	
 }
 
  #bodyHome #menuRight{
 		width:30%;
		float:right;
	
 }
 
  #menuRight{
 	width:28%;
	float:right;
	/*border:1px solid;*/
	margin-right:10px;
	
 }

 /* listado de destinos */
 .destino { border:3px solid #FFFFFF; 
 			background:#EAEAEA; padding:5px; 
			width:auto; margin:5px;}

 a.ligaDestinos {display:block;
				border:3px solid #FFFFFF; 
 				background:#EAEAEA; padding:5px; 
				 margin:5px;
				text-align:center;
				color:#54554B;
				font-weight:bold;
				}
 a:hover.ligaDestinos{background:#FE9900; padding:5px; color:#FFFFFF; border:3px solid #FFFFFF;}


/* Disponibilidad.... #E2E4D9*/ 
table#availability { width:100%; margin-top:10px;}
table#availability, table#availability td, table#availability th { border: 1px solid #969696; border-collapse:collapse;}
table#availability td.dia { width:16px; }
table#availability tr.head1 th.hotel { border-bottom:0px; background:#FE9900; font-size:8pt; text-align:center;  }
table#availability tr.head2 th.hotel { border-top:0px; background:#FE9900; text-align:center;  font-size:8pt;}
table#availability tr.head1 th.dia { font-size:9px; text-align:center;  background:#FE9900;}
table#availability tr.head2 th.dia { font-size:9px; text-align:center;  background:#E2E4D9;}
table#availability td.hotel { font-size:8pt; text-align:center;  background:#E2E4D9;}
#significados{ padding:10px;}


table#directorioPersonal th { text-align:left}
table#directorioPersonal td.nombre { padding-left:25px; text-align:right; padding-right:15px; padding-top:5px; padding-bottom:5px;}
table#directorioPersonal td.email { padding-top:5px; padding-bottom:5px;}