/************************************************************************
*			Grupo Inter México - Soluciones Web Avanzadas				*
*						http://www.intermexico.net						*
*					(C)2007 InteHost S.A. de C.V.						*
*************************************************************************
*	Proyecto: www.hotelhaciendalaventa.com.mx							*
*	Archivo: screen_site_hacienda.css									*
*	Versión: 1.0														*
*																		*
*	Diseño: Pavne Osuna P.	(pavne@intermexico.net)						*
*************************************************************************
*	Fecha Inicio: 04/06/07												*
*	Fecha Finalización: 09/07/07										*
*	Última Revisión: 30/08/07											*
*																		*
*	Descripción: Archivo de Hoja de Estilos en Cascada (CSS) para		*
*				formato en pantalla del sitio público.					*
*																		*
************************************************************************/
/************************************************************************
REGISTRO DE CAMBIOS
- 30/08/2007:
1. Se agregó la especificación para la etiqueta "span" dentro de una etiqueta "a", la cual permite generar tooltips al rollover de un elemento, ya sea imágen o texto, para mostrar información adicional del mismo.

************************************************************************/

/* FORMATOS GENERALES ------------------------------------------------ */
/* Especificaciones para las etiquetas de 'html' y 'body' */
html,body{background:#EDC url("../img/bg-total.jpg") repeat-x top; color:#333; font:85% Arial,Helvetica,sans-serif; height:100%; margin:0; padding:0;}
/* Especificaciones para formato de los Enlaces */
a:link{color:#036; font-weight:bold; text-decoration:none;}
a:visited{color:#777; font-weight:bold; text-decoration:none;}
a:hover{color:#069; font-weight:bold; text-decoration:none;}
a:active{color:#09C; font-weight:bold; text-decoration:none;}
/* Especificaciones para formato de los Títulos */
h1,h2,h3,h4,h5,h6{font-family:"Times New Roman", Times, serif; padding:0; margin:0; text-align:left; text-decoration:none;}
h1{color:#036; font-size:220%; text-align:left;}
h2{color:#C96; font-size:170%; text-align:left;}
h3{color:#036; font-size:150%; text-align:left;}
h4{color:#C96; font-size:130%; text-align:left;}
h5{color:#036; font-size:110%; text-align:left;}
h6{color:#C96; font-size:110%; text-align:left;}
/* Especificaciones para formato de los Listados sin órden <ul> */
ul{list-style-image:url('../img/vig1.gif');}
li{margin-top:5px;}
ul ul{list-style-image:url('../img/vig2.gif');}
ul ul ul{list-style-image:url('../img/vig3.gif');}
.back{font-size:100%; list-style-image:url('../img/vig-back.gif');}
.down{font-size:100%; list-style-image:url('../img/vig-down.gif');}
.top{font-size:100%; list-style-image:url('../img/vig-top.gif');}
.print{font-size:100%; list-style-image:url('../img/vig-print.gif');}
.detail{font-size:100%; list-style-image:url('../img/vig-detail.gif');}
.info{font-size:100%; list-style-image:url('../img/vig-info.gif');}
/* Especificaciones para formato de los Listados con órden <ol> */
ol{text-align:left;}
/* Notas - Clase para el texto a manera de notas, especificaciones o comentarios */
.notes{color:#777; font-style:italic;}

/* ESTRUCTURALES ----------------------------------------------------- */
/* Logotipo para impresión - Identificador para la imagen con el logotipo que se muestra sólo en medio impreso. */
#logo-print{display:none;}
/* Interfase total - Identificador para la tabla que contiene toda la interfase. */
#table-total{}
/* Celda izquierda de interfase total - Identificador para la celda izquierda de la tabla que contiene la interfase total (table-total). */
#cel-total-leftcol{background:url('../img/bg-cel-total-leftcol.jpg') no-repeat right top;}
/* Celda derecha de interfase total - Identificador para la celda derecha de la tabla que contiene la interfase total (table-total). */
#cel-total-rightcol{}
/* Celda de contenido de interfase total - Identificador para la celda de contenido de la tabla que contiene la interfase total (table-total). */
#cel-total-center{background:url('../img/bg-cel-total-center.gif') repeat-y top; height:100%;}
/* Celda central superior de interfase total - Identificador para la celda central superior de la tabla que contiene la interfase total (table-total), donde se ubican los elementos de encabezado (imagen flash y menú principal). */
#cel-total-header{}
/* Celda central inferior de interfase total - Identificador para la celda central inferior de la tabla que contiene la interfase total (table-total), donde se ubican los elementos de pie de página general (datos de contacto, crédito Inter México). */
#cel-total-footer{}
/* Tabla con elementos de encabezado - Identificador para la tabla que contiene los elementos del encabezado de interfase (imagen flash, fecha y menú principal). */
#table-header{}
/* Celda para imagen y logotipo flash - Identificador para la celda de la tabla con elementos de encabezado (table-header) que contiene la imagen y logotipo en flash. */ 
#cel-header-swf{}
/* Celda para fecha - Identificador para la celda de la tabla con elementos de encabezado (table-header) que contiene la fecha. */
#cel-header-date{background:url('../img/bg-cel-header-date.jpg') no-repeat; color:#036; font:9pt 'Times New Roman', Times, serif; margin:0px; padding:0px; width:230px;}
#cel-header-date p{padding:0px 30px; position:absolute; text-align:center; width:170px;}
/* Celda para menú principal - Identificador para la celda de la tabla con elementos de encabezado (table-header) que contiene el menú principal. */
#cel-header-menu{}
/* Tabla pie de página general - Identificador para la tabla que contiene elementos de pie de página general (datos de contacto, crédito Inter México). */
#table-footer{background:url('../img/bg-cel-total-center.gif') repeat-y; width:700px;}
/* Celda slogan - Identificador para la celda de la tabla con elementos de pie de página (table-footer) que muestra la imagen con slogan. */
#cel-footer-slogan{}
/* Celda datos contacto - Identificador para la celda de la tabla con elementos de pie de página (table-footer) que muestra elementos de pie de página general (datos de contacto, crédito Inter México). */
#cel-footer-data{background:url('../img/bg-cel-footer-data.jpg') no-repeat;}

/* ELEMENTOS COMPUESTOS ----------------------------------------------------- */
/* Capa contenido - Identificador para la capa que contiene elementos de contenido tales como la columna izquierda (navegación secundaria) y columna de contenido principal. */
#div-content{background:url('../img/bg-div-content.jpg') no-repeat left top; min-height:560px; height:100%;}
/* Capa columna izquierda - Identificador para la capa dentro dentro de div-content que contiene la columna izquierda (navegación secundaria). */
#div-content-leftcol{background:url('../img/bg-div-content-leftcol.jpg') no-repeat left top; float:left; font-size:95%; margin:0px; padding:20px 35px; width:160px;}
#div-content-leftcol h1{font-size:140%; margin:0px;}
#div-content-leftcol h2{border-bottom:1px solid #036; color:#C96; font-style:italic; font-size:120%; margin-top:20px;}
#div-content-leftcol ul{list-style-image:url('../img/vig-leftcol.gif'); margin:0; padding:0px 0px 0px 20px;}
#div-content-leftcol li{border-bottom:2px dotted #ccc; margin:0; padding:5px;}
#div-content-leftcol a{text-decoration:none;}
#div-content-leftcol a:visited{color:#777;}
#div-content-leftcol a:hover{color:#069;}
#div-content-leftcol a:active{color:#09C;}
/* Acceso directo - Identificador para la capa, dentro de div-content-leftcol para ubicar accesos directos a secciones importantes o contenidos breves en esta columna izquierda. */
#div-content-leftcol-item{border-bottom:1px dotted #CCC; color:#444; margin-top:20px;}
#div-content-leftcol-item ul{margin:0px; text-align:right;}
#div-content-leftcol-item li{border-bottom:none; margin:0px; padding:0px; text-align:right;}
/* Capa de contenido principal - Identificador para la capa dentro dentro de div-content para mostrar el contenido principal. */
#div-content-rightcol{float:left; margin:0px; padding:0px 40px 60px 20px; width:460px;}
/* Pie de página contenido - Identificador para la capa que contiene el pie de contenido con ociones de navegación e impresión. */
#footer-content{border-top:1px solid #69C; color:#666; font-size:95%; margin-top:40px; padding:10px;}
#footer-content a{text-decoration:none;}
#footer-content ul{margin:0 15px; padding:0;}
/* Pie de página links - Identificador para la capa que contiene el pie de página con links de las seccione sprincipales. */
#footer-links{border-top:1px solid #69C; color:#666; font-size:95%; margin-right:40px; padding:10px; text-align:center;}
#footer-links span{border-right:1px solid #999; display:inline; line-height:15px; padding:0px 5px;}
#footer-links br{display:none;}
#footer-links li{display:inline; list-style:none;}
/* Pie de página general - Identificador para la capa que contiene el pie de página con datos de contacto. */
#footer-contact{border-top:1px solid #69C; color:#666; font-size:95%; margin-right:40px; padding:5px; text-align:right;}
#footer-contact img{margin:0px 0px 5px 5px;}
/* Pie de página Inter México - Identificador para la capa que contiene el pie de página con crédito de Inter México. */
#footer-intermexico{border-top:2px solid #CCC; color:#999; font-size:95%; margin-right:40px; padding:5px; text-align:right;}
/* Menú principal - Identificadores involucrados en la construcción del menú principal. */
#div-menubar{background:url('../img/bg-menubar.gif') no-repeat; height:80px; text-transform:uppercase;}
#nav, #nav ul {font:bold 11px "Times New Roman",Times,serif; float:left; height:80px; list-style:none; margin:0px; padding:0px;}
#nav ul li {height:auto; padding:5px; width:180px;}
#nav a {color:#FFF; display:block; margin:0px; padding:0px; text-decoration:none;}
#nav a.parent {background:url('../img/vig-leftcol.gif') no-repeat right; margin:0px; padding:0px;}
#nav li {border-left:1px solid #FFF; border-right:1px solid #FFF; float:left; height:30px; margin:0px 0px 0px -1px; padding:5px;}
#nav li ul {background:url('../img/bg-submenus.png'); border:1px solid #036; color:#036; height:auto; margin:5px 0px 0px -5px; padding:0px; position:absolute; top:-999px; width:180px;}
#nav li li {border-left:1px solid #036; border-right:1px solid #036; border-bottom:1px solid #99B2CC;}
#nav li ul a {color:#036; cursor:pointer; width:180px; letter-spacing:none;}
#nav li ul ul {color:#FFF; height:auto; margin:0px 0px 0px 140px; padding:0px; width:180px;}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {color:#FFF; top:-999px;}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {color:#FFF; top:auto; width:190px;}
#nav li:hover, #nav li.sfhover {color:#FFF; background:#369 url('../img/bg-menubar-o.gif') repeat-x;}
/* Elementos de istado - Identificador para la capa que conforma un elemento de listado donde cada elemento conduce a una página de detalles del elemento seleccionado. */
#div-list-item{border-bottom:1px solid #CCC; margin-bottom:10px; padding-bottom:5px; min-height:150px; height:200px;}
#div-list-item img{float:left; margin:0px 10px 10px 0px;}
#div-list-item p{color:#666; font-size:95%;}
#div-list-item h1{font-size:200%;}
#div-list-item a{text-decoration:none;}
#div-list-item ul{text-align:right;}
/* Formularios - Identificador para las tablas que contienen formularios */
fieldset {border:1px solid #036;}
legend {color:#036; font:bold 160% Arial,Helvetica,sans-serif; margin:0 10px; padding:0 10px;}
#form {margin-top:10px; width:100%;}
#form td {border-botom:2px dotted #CCC; border-top:2px dotted #CCC; padding:5px;}
#form .input {color:#333; font:100% Arial,Helvetica,sans-serif; width:95%;}
#form .input_smallx {color:#333; font:100% Arial, Helvetica, sans-serif; width:40%;}
#form .input_smallxx {color:#333; font:100% Arial, Helvetica, sans-serif; width:20%;}
#form select {color:#333; font:100% Arial,Helvetica,sans-serif; width:95%;}
#form textarea {color:#333; font:100% Arial,Helvetica,sans-serif; height:100px; width:95%;}
#form .col1 {background-color:#EEE; color:#333; font-weight:bold; text-align:right; vertical-align:top; width:30%;}
#form .col2 {color:#333; text-align:left; vertical-align:top;}
#form .button {cursor:pointer; font:bold 10px Arial,Helvetica,sans-serif;}
/* Alertas - Identificadores para las capas con los mensajes en la validación de formularios */
#alert_no {background:url("../img/anim_alert_no.gif") no-repeat right top; border:1px solid #036; display:block; clear:right; margin-top:10px; padding:0px 110px 10px 10px;}
#alert_no a:visited {color:#AAA;}
#alert_no h1 {color:#036; font-size:200%; padding:10px;}
#alert_no ul {color:#FF0000;}
#alert_no ul .back {border-top:1px solid #036; list-style-image:url("../img/vig-back.gif"); margin:0px; padding-top:10px;}
#alert_yes {background:url("../img/anim_alert_yes.gif") no-repeat right top; border:1px solid #036; display:block; clear:right; margin-top:10px; padding:0px 110px 10px 10px; text-align:left;}
#alert_yes h1 {color:#036; font-size:200%; padding:10px;}
/* Elementos no-flash - Identificador para la capa que contiene el mensaje a mostrarse cuando no se ha detectado flash en lugar de las galerías de imágenes de la sección "Instalaciones". */
#noflash{border:1px solid #036; color:#999; font-style:italic; padding:10px; text-align:center;}
/* Iconos en instalaciones - Identificador para la capa que contiene los íconos con los servicios de cada una de las instalaciones. */
#div-icons-bottom{height:50px; margin-top:10px;}
#div-icons-bottom .description{display:none;}
#div-icons-bottom ul {list-style:none; margin:0px; padding:0px;}
#div-icons-bottom ul li {display:inline; float:left; margin:0px 5px 0px 0px;}
/* 30/08/07 - Tooltips flotantes y clases dependientes - Clase para la capa que muestra un "tooltip" al "rollover" */
a span{display:none;}
a:hover{position:relative;}
a:hover span{background-color:#FFF; border:1px solid #000; color:#333; display:block; font-size:9px; left:0px; padding:5px; opacity:0.9; position:absolute; top:35px; width:inherit;; z-index:100;}