@import "reset.css"; body { background:#000; text-align:center; font: 10px Arial, Helvetica, sans-serif; color:#000;} #page { width:746px; margin:0 auto; text-align:left; } #navigation { width:100%; height:16px; padding:58px 0px 20px;} #navigation ul li { display:block; float:left; margin-right:14px;} #navigation ul li a { display:block; height:16px;text-indent:-9999px; } li.btn-inicio a { width:52px; background:url(../images/sprite_menu.gif) 0px 0px;} li.btn-inicio a:hover,li.btn-inicio a.active { background-position:0px 16px;} li.btn-somos a { width:65px; background:url(../images/sprite_menu.gif) -67px 0px;} li.btn-somos a:hover,li.btn-somos a.active { background-position:-67px 16px;} li.btn-rutas a { width:54px; background:url(../images/sprite_menu.gif) -146px 0px;} li.btn-rutas a:hover, li.btn-rutas a.active { background-position:-146px 16px;} li.btn-alojamiento a { width:119px; background:url(../images/sprite_menu.gif) -213px 0px;} li.btn-alojamiento a:hover, li.btn-alojamiento a.active { background-position:-213px 16px;} li.btn-reservaciones a { width:137px; background:url(../images/sprite_menu.gif) -347px 0px;} li.btn-reservaciones a:hover, li.btn-reservaciones a.active { background-position:-347px 16px;} li.btn-contacto a { width:91px; background:url(../images/sprite_menu.gif) -498px 0px;} li.btn-contacto a:hover, li.btn-contacto a.active { background-position:-498px 16px;} li.btn-campana a { width:84px; background:url(../images/sprite_menu.gif) -604px 0px;} li.btn-campana a:hover, li.btn-campana a.active { background-position:-604px 16px;} #navigation ul li.btn-blog { margin-right:0px;} li.btn-blog a { width:45px; background:url(../images/sprite_menu.gif) -703px 0px;} li.btn-blog a:hover, li.btn-blog a.active { background-position:-703px 16px;} #maincontent { width:100%; height:627px; position:relative; margin-bottom:16px; background:#111;} #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; color:#FFF;} #footer a { color:#FFF;} #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;} /* HOME */ #inicio #box-content { padding:103px 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 */ .img-quienes { background:url(../images/somos/somos.jpg);} .img-porque { background:url(../images/somos/porquemx700.jpg);} .img-seguridad { background:url(../images/somos/seguridad.jpg);} .img-turismo { background:url(../images/somos/turismosustentable.jpg);} .img-alianzas { background:url(../images/somos/alianzas.jpg);} #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;} /* ALOJAMIENTO */ .img-alojamiento { background:url(../images/alojamiento/alojamiento.jpg);} .img-tepozteco { background:url(../images/alojamiento/tepozteco.jpg);} .img-cupulas { background:url(../images/alojamiento/cupulas.jpg);} .img-vistahermosa { background:url(../images/alojamiento/vistahermosa.jpg);} .img-mision { background:url(../images/alojamiento/mision.jpg);} #accordion h3 a#title-alojamiento { background:url(../images/btn_alojamiento_alojamiento.gif); } #accordion h3 a#title-tepozteco { background:url(../images/btn_alojamiento_tepozteco.gif); } #accordion h3 a#title-cupulas { background:url(../images/btn_alojamiento_cupulas.gif); } #accordion h3 a#title-vistahermosa { background:url(../images/btn_alojamiento_vistahermosa.gif); } #accordion h3 a#title-mision { background:url(../images/btn_alojamiento_mision.gif); } #accordion h3.ui-state-active a#title-alojamiento, #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;} /* RESERVACIONES */ .img-costos { background:url(../images/reservaciones/costos.jpg);} .img-pago { background:url(../images/reservaciones/pago.jpg);} #accordion h3 a#title-costos { background:url(../images/btn_reservaciones_costos.gif); } #accordion h3 a#title-pago { background:url(../images/btn_reservaciones_pago.gif); } #accordion h3.ui-state-active a#title-costos, #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;} #reservaciones #accordion div.content { height:529px; position:relative;} .box-scroll-costos, .box-scroll-pago { width:294px; height:528px; overflow:auto;} /* RESERVACIONES PASO 2 */ #reservaciones2 h2 { margin-bottom:10px; } #box-maincontent { background-color:#FFF; width:714px; height:595px; 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:16px; width:155px; height:200px;} #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 */ .img-amarilla { background:url(../images/rutas/amarilla.gif);} .img-naranja { background:url(../images/rutas/naranja.gif);} .img-roja { background:url(../images/rutas/roja.gif);} .img-morada { background:url(../images/rutas/morada.gif);} .img-verde { background:url(../images/rutas/verde.gif);} .img-azul { background:url(../images/rutas/azul.gif);} #accordion h3 a#title-amarilla { background:url(../images/btn_rutas_amarilla.gif); } #accordion h3 a#title-morada { background:url(../images/btn_rutas_morada.gif); } #accordion h3 a#title-roja { background:url(../images/btn_rutas_roja.gif); } #accordion h3 a#title-verde { background:url(../images/btn_rutas_verde.gif); } #accordion h3 a#title-azul { background:url(../images/btn_rutas_azul.gif); } #accordion h3 a#title-naranja { background:url(../images/btn_rutas_naranja.gif); } #accordion h3.ui-state-active a#title-amarilla, #accordion h3.ui-state-active a#title-morada, #accordion h3.ui-state-active a#title-roja, #accordion h3.ui-state-active a#title-verde, #accordion h3.ui-state-active a#title-azul, #accordion h3.ui-state-active a#title-naranja{ background-position:318px 0px;} a.link-pdf { display:block; position:absolute; bottom:0px; left:0px; width:428px; height:46px; text-indent:-9999px; overflow:hidden;} a.link-pdf:hover, a.link-pdf:active { background-position:-428px 0px; } .img-amarilla a.link-pdf { background-image:url(../images/btn_rutas_ficha_amarilla.gif);} .img-naranja a.link-pdf { background-image:url(../images/btn_rutas_ficha_naranja.gif);} .img-azul a.link-pdf { background-image:url(../images/btn_rutas_ficha_azul.gif);} .img-morada a.link-pdf { background-image:url(../images/btn_rutas_ficha_morada.gif);} #rutas #accordion div.content { height:381px;} .box-scroll-amarilla, .box-scroll-naranja, .box-scroll-azul, .box-scroll-morada { width:294px; height:346px; overflow:auto;} #rutas h4 {font-weight:bold; font-size:14px; height:30px;} #rutas h4.title-simple {font-weight:bold; font-size:14px; height:auto; } .subtitle-amarilla { color:#E2C92C; } .subtitle-naranja { color:#F8961D;} .subtitle-azul { color:#00ADE6;} .subtitle-morada { color:#AD238D;} #rutas h4.subtitle-small { font-size:11px; } .title-margin { margin-bottom:10px;} /* CAMPAŅAS */ #campana #maincontent { background-color:#FFF;} #title-campana { width:746px;height:172px;} #box-campanathumbs { width:100%; height:455px; position:relative; overflow:hidden;} .campanathumbs { width:90px; height:90px; background-color:#000; float:left; margin: 0px 0px 60px 49px;} .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);} /* BICICLETA */ .box-padded { padding:16px;} #bicicleta h3 { font-weight:bold; font-size:14px; margin-bottom:14px;} #bicicleta .box-padded p { font-size:13px; line-height:15px; margin-bottom:15px;} /* 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; overflow:hidden;} .alianzas { text-align:center;} .alianzas img { margin-top:20px;} #accordion div.content p { font-size:12px; line-height:14px; margin-bottom:12px;} #accordion div.content p.bulleted { background:url(../images/bullet_small.gif) no-repeat 0px 4px; text-indent: 8px; } #accordion div.content p strong {color: #37803E; }