@import "reset.css";

body {text-align:center; font: 10px Arial, Helvetica, sans-serif; }

#page { width:746px; margin:0 auto; text-align:left; }
	#navigation { width:100%; height:16px; padding:58px 0px 20px; position:relative;}
		#languages { position:absolute; top:20px; right:0px;}
		#navigation ul li { display:block; float:left;}
		#navigation ul li a { display:block; height:16px;text-indent:-9999px; }
			li.btn-inicio a { }
				li.btn-inicio a:hover,li.btn-inicio a.active { }
			li.btn-somos a { }
				li.btn-somos a:hover,li.btn-somos a.active { }
			li.btn-rutas a { }
				li.btn-rutas a:hover, li.btn-rutas a.active { }
			li.btn-alojamiento a { }link-step1
				li.btn-alojamiento a:hover, li.btn-alojamiento a.active { }
			li.btn-reservaciones a { color:#FF0}
				li.btn-reservaciones a:hover, li.btn-reservaciones a.active { }
			li.btn-contacto a { }
				li.btn-contacto a:hover, li.btn-contacto a.active { }
			li.btn-campana a { }
				li.btn-campana a:hover, li.btn-campana a.active { }
			#navigation ul li.btn-blog { margin-right:0px;}
			li.btn-blog a { }
				li.btn-blog a:hover, li.btn-blog a.active { }
				
				
	#maincontent { width:100%; height:627px; position:relative; margin-bottom:16px; background:#000; }
		#leftcolumn { width:428px; height:627px; float:left; overflow:hidden; position:relative;}
		#rightcolumn { width:318px; height:627px; float:left; position:relative; background:#FFF;}
	#footer { width:100%; height:30px; line-height:26px; font-size:11px; margin-bottom:20px; position:relative;}
		#footer a { text-transform:lowercase;}
		#box-footericons { position:absolute; top:0px; right:0px; width:220px; height:22px; text-align:right;}
			#box-footericons p { line-height:16px; }
			#box-footericons a { padding-left: 10px; }
			#box-logo { width:59px; float:left; }
	
	.to-bottom { padding-top: 40px;}
	.link-black { color:#000;}
	.socialbuttons { text-align:right; margin-bottom:10px;}
		.socialbuttons iframe { float:left; }
		.fb_iframe_widget { display:block;}
		.fb_iframe_widget iframe {float:left;}
	
/* HOME */
#inicio #box-content { padding:162px 19px 14px; height:92px; text-align:left; border-bottom:1px #000 solid;}
#nav-inicio div img { display:block; border-bottom:1px #000000 solid; }
#nav-inicio div#btn-newsletter img { border:none;}
#over-promo { position:absolute; top:16px; left:16px; width:120px; height:120px; z-index:10;}
	#over-promo a { display:block; width:120px; height:120px; border:0px; }
	
	#box-slideshow { z-index:5;}
	.promotour { color:#FFF; padding: 25px 30px 0px; font-size:14px; line-height:16px;}
		.promotour a { color:#FFF;}
		.promotour a.link-yellow { color:#FBE300;}

/* SOMOS */
	
#accordion h3 a#title-quienes {  background:url(../images/btn_somos_quienes.gif); }
#accordion h3 a#title-porque {  background:url(../images/btn_somos_porque.gif); }
#accordion h3 a#title-seguridad {  background:url(../images/btn_somos_seguridad.gif); }
#accordion h3 a#title-turismo {  background:url(../images/btn_somos_turismo.gif); }
#accordion h3 a#title-alianzas {  background:url(../images/btn_somos_alianzas.gif); }
#accordion h3.ui-state-active a#title-quienes,
#accordion h3.ui-state-active a#title-porque,
#accordion h3.ui-state-active a#title-seguridad,
#accordion h3.ui-state-active a#title-turismo,
#accordion h3.ui-state-active a#title-alianzas { background-position:318px 0px;}
.box-scroll-quienes, .box-scroll-porque, .box-scroll-seguridad, .box-scroll-turismo, .box-scroll-alianzas { width:290px; height:416px; overflow:auto;}

/* ALOJAMIENTO */
#accordion h3.ui-state-active a#title-alojamiento,
#accordion h3.ui-state-active a#title-conca,
#accordion h3.ui-state-active a#title-raab,
#accordion h3.ui-state-active a#title-castillo,
#accordion h3.ui-state-active a#title-tepozteco,
#accordion h3.ui-state-active a#title-cupulas,
#accordion h3.ui-state-active a#title-vistahermosa,
#accordion h3.ui-state-active a#title-mision { background-position:318px 0px;}
.box-scroll-alojamiento { width:290px; height:405px; overflow:auto;} 

/* RESERVACIONES */
.img-tarifabanco,.img-tarifa2dias, .img-tarifaidayvuelta, .img-tarifaatumedida, .img-tarifaespeciales { background:url(../images/reservaciones/costos.jpg);}
.img-pago { background:url(../images/reservaciones/pago.jpg);}
span.price { color:#000; font-weight:bold;}
	
#accordion h3.ui-state-active a#title-tarifabanco,
#accordion h3.ui-state-active a#title-tarifa2dias,
#accordion h3.ui-state-active a#title-tarifaidayvuelta,
#accordion h3.ui-state-active a#title-tarifaatumedida,
#accordion h3.ui-state-active a#title-tarifaespeciales,
#accordion h3.ui-state-active a#title-pago { background-position:318px 0px;}

#reservaciones h4 { font-weight:bold; font-size:13px; }
	#reservaciones h4.subtitle-black { margin-bottom:2px;}
.box-scroll-tarifa2dias.box-scroll-tarifa2dias, .box-scroll-tarifaidayvuelta, .box-scroll-tarifaatumedida, .box-scroll-pago, .box-scroll-tarifaespeciales { width:280px; height:390px; overflow:auto; margin-left:-20px; padding-left:20px; padding-right:20px;overflow-x : hidden}
.box-scroll-tarifa2dias.box-scroll-tarifa2dias img, .box-scroll-tarifaidayvuelta img, .box-scroll-tarifaatumedida img, .box-scroll-pago img, .box-scroll-tarifaespeciales img { margin-left:-15px}
.link-step1 { display:block; padding-top:12px;}

/* RESERVACIONES PASO 2 */
#reservaciones2 h2 { margin-bottom:10px; }
#box-maincontent { background-color:#FFF; width:714px; height:605px; padding: 16px; position:relative; overflow:hidden;}
.input-simpletext, .input-simpleselect { border:1px solid #000; width: 300px; font-size:10px; margin-right: 4px;}
input.error { border:1px #C00 solid;}
#box-note { position:absolute; top:14px; right:32px; width:155px; height:200px;}
#box-note strong{ font-weight:bolder}
	#box-note h3 {color:#54B948; font-weight:bold;}
	#box-note p { margin-bottom:12px;}

#form-step2 td { padding: 5px 6px 5px 0px; vertical-align:top; position:relative;}
	.box-error { color:#C00; font-size:9px; position:absolute;}
	td.form-label { width:216px; font-size:11px;}
	#form-step2  td.wrap-submit { padding-left:442px;}
	.simple-button { width:80px; border:1px #000 solid; }
	#form-step2 .simple-button { margin-left:16px; }

/* RUTAS */
#accordion h3.ui-state-active a#title-principiantes,
#accordion h3.ui-state-active a#title-atumedida,
#accordion h3.ui-state-active a#title-especiales,
#accordion h3.ui-state-active a#title-avanzados,
#accordion h3.ui-state-active a#title-intermedios{ background-position:318px 0px;}
.box-scroll-principiantes, .box-scroll-intermedios, .box-scroll-avanzados, .box-scroll-atumedida, .box-scroll-especiales { width:290px; height:416px; overflow:auto;}
.box-scroll-ruta { width:290px; height:180px; overflow:auto;}
.box-scroll-ruta-especiales { width:290px; height:400px; overflow:auto;}

#rutas h4 {font-weight:bold; font-size:12px; height:30px;}
#rutas h4.title-simple {font-weight:bold; font-size:14px; height:auto; }
#rutas h4.subtitle-small { font-size:11px; }
.title-margin { margin-bottom:10px;}

#rutas h4.title-idayvuelta, #rutas h4.title-2dias, #rutas h4.title-oaxaca, #rutas h4.title-xilitla { height:28px; width:318px;color:#FFF; line-height:28px; position:relative; left:-16px; text-indent:-9999px;}
#rutas h4.title-idayvuelta:hover, #rutas h4.title-2dias:hover, #rutas h4.title-oaxaca:hover, #rutas h4.title-xilitla:hover {cursor: pointer;}
#rutas h4.title-idayvuelta { background-color:#B3D335;}
#rutas h4.title-2dias, #rutas h4.title-oaxaca, #rutas h4.title-xilitla { background-color:#02919F; }

#rutas h5 { font-size:13px; font-weight:bold; margin-bottom:13px; }
.bernal { font-size:9px; background:url(../images/flash.gif) 215px 50% no-repeat;}
.bernal-p { font-size:9px;}
#rutas #accordion div.content p strong { color:#000; font-weight:bold;}
.box-idayvuelta, .box-2dias , .box-xilitla, .box-xilitla  { padding-top:12px;}

#accordion div.content p.small { font-size:10px; margin-bottom:8px;}
#accordion div.content p.notes { font-size:10px; margin-bottom:8px; font-style:italic;}
.pdf-link { font-weight:bold;}
.pdf-link img { vertical-align:middle;}

/* CAMPAÑAS */
#campana #maincontent { background-color:#FFF;}
	#title-campana {  width:746px;height:172px;}
	#box-campanathumbs { width:740px; height:455px; position:relative; overflow:hidden; background-color:#fff}
		.campanathumbs { width:90px; height:90px; background-color:red; float:left; margin: 0px 0px 60px 29px;}
	

.title-ejecucion1 { background:url(../images/campanas/title_ejecucion1.gif);}
.title-ejecucion2 { background:url(../images/campanas/title_ejecucion2.gif);}
.title-ejecucion3 { background:url(../images/campanas/title_ejecucion3.gif);}
.title-ejecucion4 { background:url(../images/campanas/title_ejecucion4.gif);}
.title-ejecucion5 { background:url(../images/campanas/title_ejecucion5.gif);}
.title-ejecucion6 { background:url(../images/campanas/title_ejecucion6.gif);}
.title-ejecucion7 { background:url(../images/campanas/title_ejecucion7.gif);}
.title-ejecucion8 { background:url(../images/campanas/title_ejecucion8.gif);}
.title-ejecucion9 { background:url(../images/campanas/title_ejecucion9.gif);}
.title-ejecucion10 { background:url(../images/campanas/title_ejecucion10.gif);}

.title-ejecucion1-en { background:url(../images/mexico/title_ejecucion1.gif);}
.title-ejecucion2-en { background:url(../images/mexico/title_ejecucion2.gif);}
.title-ejecucion3-en { background:url(../images/mexico/title_ejecucion3.gif);}
.title-ejecucion4-en { background:url(../images/mexico/title_ejecucion4.gif);}
.title-ejecucion5-en { background:url(../images/mexico/title_ejecucion5.gif);}


/* BICICLETA */
.box-padded { padding:16px;}
	#bicicleta h3 { font-weight:bold; font-size:14px; margin-bottom:12px;}
	#bicicleta .box-padded p { font-size:13px; line-height:15px; margin-bottom:14px;}
	.bikefitvideo { display:block; margin-bottom:8px;}
	
/* ACCORDION */
#img-accordion { width:428px; height:627px; position:relative;}

#accordion { height:627px; overflow:hidden;}
	#accordion h3 { height:36px; border-bottom:1px #000 solid; }
	#accordion h3 a { width:100%; height:100%; display:block; text-indent:-9999px;outline:none; overflow:hidden;}
	#accordion p a { color:#000; text-decoration:none;}
		
	#accordion div.content { height:418px; padding:12px 16px; border-bottom:1px #000 solid}
	#accordion div.content-alianzas, #accordion div.content-reservaciones { height:380px; padding:12px 16px; border-bottom:1px #000 solid; overflow:hidden;}
		.alianzas { text-align:center;}
		
			.alianzas img { margin-top:20px;}
		#accordion div.content p, #accordion div.content-alianzas p, #accordion div.content-reservaciones p { font-size:13px; line-height:17px; margin-bottom:14px;}
		#accordion div.content p.bulleted{ background:url(../images/bullet_small.gif) no-repeat 0px 4px; text-indent: 8px; }
		#accordion div.content-reservaciones p.bulleted { background:url(../images/bullet_small.gif) no-repeat 0px 4px; text-indent: 8px; margin-bottom:7px}
			#accordion div.content p strong {color: #37803E; font-weight:bolder; font-size:14px; }
			
/* NEWSLETTER */
#box-newsletter { color:#FFF;} 
	#box-newsletter td, #box-newsletter th { padding: 5px;}
	
	
p.logo-paypal{
	text-indent: -9999px;
	width: 50px; height: 29px;
	background-image: url(../images/logo-paypal.png);
}

.powered {width:130px; font-family:Arial, Helvetica, sans-serif; font-size:10px; float:right; margin-right:-35px;}
.powered img { margin-left:5px; vertical-align:middle}

/* HOME */
#home {
	width:400px;
	margin:0 auto;
}
#home  img {
	margin:200px 0 60px 0;
	text-align:center
}

#home ul {
	width:140px;
	height:30px;
	text-align:center;
	display:inline-block;
	margin-left:115px;
	}
	
#home ul li {
	display:inline-block;
	color:#FFF;
	padding:5px 12px
	}
#home ul li a {
	color:#fff; 
	font-size:11px;
	font-weight:100;
	}
#home a:hover {color:#54B948}
#home .left {
	border-right:#54B948 1px solid;
	padding-right:14px
}
area:hover {
	cursor:wait
	}
