/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
*/


/* ------------
	 Generales
---------------*/

body{
	font-family:tahoma, arial, verdana, helvetica;
	font-size:1em;
	background:url("bitmaps/pattern_body.gif");
}

.left{
	float:left;
}

.right{
	float:right;
}

/* ------------
	 Contenido
---------------*/

#container{
	width:800px;
	margin:0 auto;
	/*outline:1px dotted red;*/
	position:relative;
	padding-top:30px;
}

	#container h1{
		width:181px;
		height:179px;
		/*outline:1px solid blue;*/
		overflow:hidden;
		text-indent:-999px;
		background:url("bitmaps/logo.png") left top no-repeat;
		position:absolute;
		top:5px;
		left:-20px;
		z-index:999;
	}
	
/* ------------
	 MENU
---------------*/

	#menu ul{
		list-style:none;
		position:absolute;
		top:8px;
		right:185px;
		width:344px;
	}
	
		#menu ul li{
			display:inline;
			padding:0 6px;
			float:left;
		}
		
		#menu ul li.last{
			padding:0;
			width:30px;
			/*outline:1px dotted green;*/
		}
	
			#menu ul li a.menu{
				display:block;
				float:left;
				margin-right:6px;
				padding-right:6px;
				font-size:11px;
				color:#5A5A5A;
				text-decoration:none;
				border-right:1px solid #5A5A5A;
			}
			
			#menu ul li a.menu:hover{
				color:#000;
				text-decoration:underline;
			}
			
			#menu ul li a.nomargin{
				margin:0;
				padding-right:0;
				border-right:none;
				/*border:1px solid red;*/
			}
		#menu ul.banderas{
			list-style:none;
			position:absolute;
			top:8px;
			right:45px;
			width:118px;
		}
			#menu ul.banderas li.language{
				font-size:11px;
				color:#999;
				margin:0 5px 0 0;
				padding:0;
			}
			#menu ul.banderas li{
				margin:0 0 0 5px;
				border-right:1px solid #999;
				padding:0;
			}
				#menu ul.banderas a.esp, ul.banderas a.eng{
					display:block;
					width:17px;
					height:16px;
					overflow:hidden;
					text-indent:-999px;
				}
				ul.banderas a.esp{
					background:url("bitmaps/flag-chile.png") 0 0 no-repeat;
					padding:0 5px 0 0;
				}
				ul.banderas a.eng{
					background:url("bitmaps/flag-usa.png") 0 0 no-repeat;
				}
				.no-border{border:none !important;}
		#menu ul.social{
			list-style:none;
			position:absolute;
			top:4px;
			right:-24px;
			width:72px;
			margin:0;
			padding:0;
			overflow:hidden;
		}
			#menu ul.social li{
				margin:0;
				padding:0;
				float:left;
				width:24px;
				height:24px;
			}
				#menu ul.social li a{
					display:block;
					width:24px;
					height:24px;
					overflow:hidden;
					text-indent:-999px;
				}
				#menu ul.social li a.fb{
					background:url("bitmaps/icon-fb.png") -25px 0 no-repeat;
				}
				#menu ul.social li a.fb:hover{
					background:url("bitmaps/icon-fb.png") 0 0 no-repeat;
				}
				#menu ul.social li a.twitter{
					background:url("bitmaps/icon-twitter.png") -25px 0 no-repeat;
				}
				#menu ul.social li a.twitter:hover{
					background:url("bitmaps/icon-twitter.png") 0 0 no-repeat;
				}
	
/* ------------
	CONTENIDO
---------------*/
	
	
	#hotel{
		width:100%;
		height:82px;
		background:#000;
		padding-top:10px;
	}
	
	#container h2{
		height:71px;
		width:222px;
		background:#000;
		color:#FFF;
		text-align:center;
		background:url("bitmaps/hotel_santino.jpg") left top no-repeat;
		overflow:hidden;
		text-indent:-999px;
		margin:0 auto;
	}
	
	#sections{
		width:100%;
		background:url("bitmaps/separadores.png") left top repeat-y;
		float:left;
		border-bottom:1px dotted #000;
	}
	
		#sections #instalaciones{
			width:237px;
			height:238px;
			background:url("bitmaps/instalaciones.png") left top no-repeat;
			float:left;
			margin:10px 0 0 10px;
			position:relative;
		}
		
			#instalaciones a.instalaciones{
				position:absolute;
				top:48px;
				left:30px;
			}
			
			#instalaciones p.inst{
				top:204px;
			}
			
			#instalaciones a.btn_inst{
				display:block;
				width:23px;
				height:23px;
				background:url("bitmaps/btn_red.gif") left top no-repeat;
				overflow:hidden;
				text-indent:-999px;
				position:absolute;
				top:206px;
				right:8px;
			}
		
		#sections #tarifas{
			width:237px;
			height:238px;
			background:url("bitmaps/tarifas.png") left top no-repeat;
			float:left;
			margin:25px 0 0 32px;
			position:relative;
		}
		
			#tarifas a.tarifas{
				position:absolute;
				top:33px;
				left:30px;
			}
			
			#sections p.fees{
				top:190px;
			}
			
			#tarifas a.btn_fees{
				display:block;
				width:23px;
				height:23px;
				background:url("bitmaps/btn_orange.gif") left top no-repeat;
				overflow:hidden;
				text-indent:-999px;
				position:absolute;
				top:192px;
				right:8px;
			}
		
		#contactos fieldset{
			width:243px;
			height:234px;
			/*border:1px solid red;*/
			float:left;
			margin:14px 0 0 30px;
		} 
		
			#contactos a, #tarifas a, #instalaciones a{
				text-decoration:none;
				color:#FFF;
				text-transform:uppercase;
				font-size:1em;
			}
			
			#contactos fieldset a.map{
				display:block;
				height:105px;
				width:210px;
				background:url("bitmaps/mapa.png") left top no-repeat;
				padding:45px 0 0 27px;
			}
			
			#contactos fieldset a.contacto{
				display:block;
				height:48px;
				width:216px;
				padding:36px 0 0 27px;
				background:url("bitmaps/contacto.png") left top no-repeat;
			}
			
		#sections p{
			font-size:0.7em;
			width:200px;
			position:absolute;
			left:28px;
		}
		
	a.hs_home{
		clear:both;
		display:block;
		width:36px;
		height:40px;
	}
	
	#footer p{
		width:100%;
		background:#000;
		color:#FFF;
		text-align:center;
		font-size:0.7em;
		padding:8px 0;
	}	
		
/* -----------------
	INSTALACIONES
---------------------*/	

#container.nopadding{
	padding:0px;
}
		#contenedor{
		width:800px;
		margin:0 auto;
		background:url("bitmaps/bordes_int.png") left top repeat-y;
		border-bottom:dotted 1px #A5A5A5;
		border-top:dotted 1px #D2D2D2;
	}
	
		#contenedor h3.title_instalaciones{
			margin:100px 0 0 90px;
			font-size:2em;
			text-align:center;
			overflow:hidden;
			text-indent:-999px;
			height:50px;
			background:url("bitmaps/title_instalaciones.jpg") center center no-repeat #000;
		}
	
		#contenedor #sidebar{
			width:174px;
			float:left;
			margin-top:40px;
			border-right:1px dotted #a5a5a5;
			padding:0 3px;
		}
			#contenedor #sidebar #menu_vertical a{
				display:block;
				height:24px;
				color:#666;
				font-size:0.8em;
				text-decoration:none;
				margin-top:5px;
				padding:6px 0 0 5px;
			}
			
			#contenedor #sidebar #menu_vertical a:hover{
				color:#FFF;
				background:#333;
			}
			#contenedor #sidebar #menu_vertical a.selected{
				color:#FFF;
				background:#000;
			}
		
		#contenedor #content{
			/*border:1px solid blue;*/
			width:598px;
			float:right;
			margin-top:40px;
			padding-bottom:20px;
		}
		
			#contenedor #content a{
				border:1px solid #F60;
				width:142px;
				height:107px;
				display:block;
				float:left;
				margin:4px 4px 0 0;
			}
			
			#contenedor #content a:hover{
				border:1px solid #000;
			}
			
/* -----------------
	  CONTACTO
---------------------*/				
				
	#contenedor h3.title_contacto{
		margin:100px 0 0 90px;
		font-size:2em;
		text-align:center;
		overflow:hidden;
		text-indent:-999px;
		height:50px;
		background:url("bitmaps/title_contacto.jpg") center center no-repeat #000;
		}

	#content #contact_box{
		width:200px;
		float:left;
	}	
		
	#content #contact_box a{
		display:block;
		width:173px;
		height:38px;
		border:none;
		margin:0 0 0 4px;
	}
	
	#content #contact_box a:hover{
		border:none;
	}
	
	#content #contact_box p{
		width:153px;
		height:30px;
		padding:8px 0 0 20px;
		background:url("bitmaps/bk_fono.png") left top no-repeat;
		float:left;
		color:#FFF;
		font-size:0.8em;
		margin:0 0 0 4px;		
	}
		
			#content .sending {
				width: 360px;
				height: 150px;
				float:right;
				margin-right:20px;				
				background: url('bitmaps/loader.gif') center center no-repeat;
				display: none;
				text-align:center;
			}

			#content .exito {
				padding-top: 2em;
				text-align: center;
			}

				#content .exito p.thanks {
					font-size: 2em;
					color:#5A5A5A;
					text-shadow: #666 0 0 2px;
				}

				#content .exito p {
					font-size: 0.9em;
				}

			#content fieldset {
				margin: 0;
				padding: 12px 0 0 0;
				width:360px;
				float:right;
				margin-right:20px;
			}
			
			#content fieldset legend{
				font-size:1em;
				background:#000;
				color:#FFF;
				width:345px;
				height:20px;
				padding:5px 0 5px 5px;
			}

				#content label {
					display: block;
					width: 130px;
					float: left;
					font-style: italic;
					padding-top: 4px;
					font-size:0.8em;
				}

				#content input,
				#content textarea {
					border: 1px solid #999;
					background: rgba(255,255,255,0.2);
					padding: 2px 4px;
					width: 210px;
					margin-bottom: 10px;
					font-size: 0.9em;
					color: #5A5A5A;
				}

					#content textarea {
						height: 50px;
					}


				#content button {
					padding: 4px 10px;
					background: #000;
					border: 1px solid #000;
					color: #fff;
					font-weight: bold;
					cursor: pointer;
					float: right;
					clear:both;
					margin: 10px;
					font-size: 14px;
				}


	/* -------- Form Validation Engine --------- */
	.formError {
			position:absolute;
			top:300px; left:300px;
			width:150px;
			padding-bottom:15px;
			display:block;
			z-index:5000;
		}
			.formError .formErrorContent {
				width:100%; 
				background:#000;
				color:#fff;
				font-family:tahoma;
				font-size:10px;
				box-shadow: 1px 1px 6px #000;
				-moz-box-shadow: 1px 1px 6px #000;
				-webkit-box-shadow: 1px 1px 6px #000;
				padding:4px 10px 4px 10px;
				border-radius: 6px;
				-moz-border-radius: 6px;
				-webkit-border-radius: 6px;
			}
			.formError .formErrorArrow{
				position:absolute;
				bottom:0;left:20px;
				width:15px; height:15px;

			}
				.formError .formErrorArrow div{
					box-shadow: 1px 4px 5px #000;
					-moz-box-shadow: 1px 4px 5px #000;
					-webkit-box-shadow: 1px 1px 5px #000;
					font-size:0px; 

				}
				.formError .formErrorArrow .line10{width:15px;height:1px; background:#000;margin:0 auto; font-size:0px; display:block;} 
				.formError .formErrorArrow .line9{width:13px;height:1px; background:#000;margin:0 auto;display:block;} 
				.formError .formErrorArrow .line8{width:11px;height:1px; background:#000;margin:0 auto;display:block;} 
				.formError .formErrorArrow .line7{width:9px;height:1px; background:#000;margin:0 auto;display:block;} 
				.formError .formErrorArrow .line6{width:7px;height:1px; background:#000;margin:0 auto;display:block;} 
				.formError .formErrorArrow .line5{width:5px;height:1px; background:#000;margin:0 auto;display:block;} 
				.formError .formErrorArrow .line4{width:3px;height:1px; background:#000;margin:0 auto;display:block;} 
				.formError .formErrorArrow .line3{width:1px;height:1px; background:#000;margin:0 auto;display:block;}
		
/*--------------*/
/* COMO LLEGAR  */
/*--------------*/

#contenedor h3.title_map{
	margin:100px 0 0 90px;
	font-size:2em;
	text-align:center;
	overflow:hidden;
	text-indent:-999px;
	height:50px;
	background:url("bitmaps/title_mapa.jpg") center center no-repeat #000;
	}
		
#content #contact_box p.near{
	width:220px;
	height:100px;
	background:none;
	float:left;
	color:#5a5a5a;
	font-size:0.7em;
	font-style:italic;
	margin:5px 0 0 0;
	padding:0;
	}
	
	#content .img_map{
		border:1px solid #999;
	}
	
	#content h4{
		font-size:1em;
		background:#000;
		color:#FFF;
		width:374px;
		padding:3px;
		float:right;
		margin:0 18px 0 0;
	}
	
/*--------------*/
/*  SERVICIOS   */
/*--------------*/	
	
#contenedor h3.title_servicios{
	margin:100px 0 0 90px;
	font-size:2em;
	text-align:center;
	overflow:hidden;
	text-indent:-999px;
	height:50px;
	background:url("bitmaps/title_servicios.jpg") center center no-repeat #000;
	}
	
	#services{
		position:relative;
	}
	
		#services ul{
			list-style:url("bitmaps/bullet.gif");
			width:368px;
			/*border:1px solid red;*/
			position:absolute;
			top:40px;
			left:8px;
			font-size:0.8em;
		}
		
				#services ul li{
					margin:0 0 6px 0;
					border-bottom:1px dotted #999;
				}
		
/*--------------*/
/*   TARIFAS    */
/*--------------*/	

#contenedor h3.title_tarifas{
	margin:100px 0 0 90px;
	font-size:2em;
	text-align:center;
	overflow:hidden;
	text-indent:-999px;
	height:50px;
	background:url("bitmaps/title_tarifas.jpg") center center no-repeat #000;
	}
	
	p.asterix_promo{
		font-weight:bold;
		font-size:36px;
		color:#FF0000;
	}
	
	#content #listadoprecios h4.tarifas_titulo{
		font-size:1em;
		background:#000;
		color:#FFF;
		width:544px;
		padding:3px;
		margin:0 48px 0 0;
	}	
	
	/*ESPECIAL*/
	#content #listadoprecios h4.tarifas_titulo_especial{
		font-size:1em;
		background:#FF0000;
		color:#FFF;
		width:544px;
		padding:3px;
		margin:0 48px 0 0;
	}
	
	#content table.precios_norm{
		width:550px;
		border:1px solid #999;
		margin-bottom:20px;
	}
	
		#content table.precios_norm td, #content table.precios_est td{
			border-bottom:1px solid #999;
			border-right:1px solid #999;
			font-size:0.8em;
			padding:2px 5px;
		}
		
		#content table.precios_norm td.titulos, #content table.precios_est td.titulos{
			font-size:0.8em;
			font-weight:bold;
		}
		
		#content table.precios_norm td.noborderr, #content table.precios_est td.noborderr{
			border-right:none;
		}
		#content table.precios_norm td.noborderb, #content table.precios_est td.noborderb{
			border-bottom:none;
		}
		
		#content table.precios_est td.ancho{
			width:80px;
		}
		
		
	#content #listadoprecios h4.tarifasest_titulo{
		font-size:1em;
		background:#000;
		color:#FFF;
		width:394px;
		padding:3px;
		float:left;
	}
		
		#content table.precios_est{
			width:400px;
			border:1px solid #999;
		}
	p.formas-pago{
		width:450px;
		height:52px;
		padding-top:25px;
		background:url("../images/tarjetas.gif") right 0 no-repeat;
	}