/*-------------------------------------------------------------------------
 Clic 2006
---------------------------------------------------------------------------
 File: utils.css
 Sitio: www.c2e-us.net
 	    Gerardo Gonzalez Flores
 		--> gerardo AT clic DOT com DOT mx <--
---------------------------------------------------------------------------	
 Estilos utilitarios pasra proyectos en general
--------------------------------------------------------------------------*/
/*-- Estilos textos y ligas --*/
	
	.noDisplay{
		display:none;
	}
	
	.center, .centrado{
		margin-left:auto;
		margin-right:auto;
	}
	
	.centro {	text-align:center	}
	
	.bold{
		font-weight:bold;
	}

	/*-- Begin Clearfix Hack Classes --*/
	.clearfix:after {
    	content:"."; 
    	display:block; 
    	height:0; 
    	clear:both; 
    	visibility:hidden;
	}
	
	.clearfix {
		display:inline-block;
	}
	
	.clearfix {
		display:block;
	}
	
	* html .clearfix {
		height:1px;
	}
	/*-- End Clearfix Hack Classes --*/
	
	/*-- images styles --*/
	img.centered {
		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	img.alignright {
		padding: 4px;
		margin: 0 0 2px 7px;
		display: inline;
	}

	img.alignleft {
		padding: 4px;
		margin: 0 7px 2px 0;
		display: inline;
	}

	.alignright {
		float: right;
	}

	.alignleft {
		float: left
	}
/*--------------------------------------------------------------------------
 Clic 2008
 ----------------------------------------------------------------------------
 File: generales.css
 Gerardo Gonzalez Flores
 --> gerardo AT clic DOT com DOT mx <--
 ---------------------------------------------------------------------------
 CSS general styles for the web site, apply to specific HTML tags
 CSS generales para el sitio, aplicados a etiquetas HTML especifcas .
 --------------------------------------------------------------------------*/
/* General Styles
 -------------------------------------------------------------------*/
* {
    margin: 0px;
    padding: 0px;
}

body * {
    font-size: 12pt;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "Verdana", "Arial", "sans-serif";
    /*background:url(img/backgroundPage.jpg) center no-repeat top;*/
}

p {
    padding-bottom: 1em;
}

img {
    border: none;
}

blockquote {
    margin-left: 30px;
    margin-right: 30px;
}

blockquote div {
    margin-left: 7px;
}

a {
    color: #000000;
    text-decoration: none;
}

a:hover {
    color: #000000;
    text-decoration: none;
}

a:visited {
    color: #000000;
}
/* Estilos de ULs*/
ul {
    padding: 5px 0px 5px 10px
}

ul li {
    list-style: none;
    background: url(../img/bullet-level-1.gif) no-repeat .1em .3em;
    padding-left: 15px;
    margin-bottom: 5px;
    margin-top: 4px;
}

ul li ul li {
    list-style: none;
    background: url(../img/bullet-level-2.gif) no-repeat .1em .3em;
    padding-left: 15px;
}

ul#siteMap {
    margin-top: 0px;
}

ul#siteMap ul {
    margin-top: 0px;
}

ul#siteMap h2 {
    font-weight: normal
}
/* Imagenes */
img.left {
    float: left;
    margin-right: 15px;
    margin-bottom: 5px
	width:auto;

}

img.right {
    float: right;
    margin-left: 15px;
    margin-bottom: 5px
	width:auto;

	
}
img.block {
	display:block;
}


.textoCentrado { text-align:center;}
/*= General Styles
 -------------------------------------------------------------------*/

/*-------------------------------------------------------------------------
 Clic 2006
---------------------------------------------------------------------------
 File: paginacion.css
 Sitio: www.c2e-us.net
 	    Gerardo Gonzalez Flores
 		--> gerardo AT clic DOT com DOT mx <--
---------------------------------------------------------------------------	
	CSS styles for pagination item
	Estilos generales para el despliegue del item de paginacion
--------------------------------------------------------------------------*/
#paginacion{
	margin-top:5px;
	clear:both;
	
}

.paginacion * { font-size:8pt;}

.paginacion{
	color:#000000;
	font-size:8pt;
}
.paginacion a{
	text-decoration:none;
	color:#000000;
}
.paginacion a:hover{
	text-decoration:none;
	color:#FF0000;
}

.paginacion a:visited{
	text-decoration:none;
	color:#000000;
}

.pagValign{
 	vertical-align:middle;
}
/*--------------------------------------------------------------------------
 Clic 2010
 ----------------------------------------------------------------------------
 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: url(../img/page-bg.png) repeat}

#wrapperBody { }



#wrapper {
   	width:994px;
	margin:0px auto;	
	position:relative;
	background: url(../img/body-bg.png) repeat-y ;
}


 #body {
 	width:994px;
	background: url(../img/herramientas.png) no-repeat bottom left;
	
 	
 		
 }

#wrapperFoot {
     position: relative;
   	 margin: 0px auto;
	 margin-top:0px;
	 clear:both;
     min-height:72px;
	 height: auto !important;
	 height:72px;

}

#header {
    position:relative; 
	width:994px;
	margin:0px auto;
	height:106px;
	background: url( ../img/bg-header.png) no-repeat top; 
   
    
}

#barraLateral {
	width:308px;
	float:left;
	margin-left:7px;
	
}

#areaCentral{
	width:672px;
	float:left;
	border:1px solid #ff0000;
	position:relative;
}
 

/* =Layout343
 -------------------------------------------------------------------*/
/* Header
 -------------------------------------------------------------------*/
#siteTitle {
    background: url(../img/logo.png) no-repeat left top;
    width: 332px;
    height: 77px;
    position: absolute;
    left:10px;
    top: 16px;
}

#siteTitle span, #nombreCompleto span {display:none;}
#siteTitle a {
	display:block; 
	width: 332px;
    height: 77px;
}

#nombreCompleto {
	width:572px;
	height:31px;
	position:absolute;
	left:356px;
	top:41px;
	background: url(../img/proveedora-ferretera-satelite.png) no-repeat;
	}
#menuArea {
    width:670px;
 	margin:0px auto;
 	position:relative;
 	height:35px;
}

#menuLateral h2 span{
	display:none;
}

#menuLateral {
 position:relative;
 width:308px;
 background: url(../img/menuLateral/fondo.png) repeat-y top;
 min-height:200px;
 height: auto !important;
 height: 200px;
}

#menuLateral h2{
 width:308px;
 background: url(../img/menuLateral/top.png) no-repeat top;
 min-height:109px;
 height: auto !important;
 height: 109px;
}

#lang { 
 position:absolute;
 font-size:7pt;
 color:#ffffff;
 right:10px;
 top:283px;
 
 
}


/** QuickLinks **/

#quickLinks {
    position: absolute;
    height: 30px;
    width: 102px;
    top: 10px;
    right:25px;
}

ul#quickLinks, ul#quickLinks li {
    padding: 0px;
    margin: 0px
}


#quickLinks li {
    list-style: none;
    background: none;
}

#quickLinks li.home, #quickLinks li.contact, #quickLinks li.siteMap {
    position: absolute;
}

#quickLinks a {
    display: block;
    width: 34px;
    height: 27px;
}
/* #quickLinks a:hover { background: url(../img/home.gif) 50% 50% no-repeat #ff0000} */
#quickLinks a span {
    display: none;
}

#quickLinks li.home {
    left: 7px;
    top: 1px;
}

#quickLinks li.contact {
    left: 43px;
    top: 1px;
}

#quickLinks li.siteMap {
    left: 79px;
    top: 1px;
}

#quickLinks li.home a {
    background: url(../img/home.gif) 50% 50% no-repeat;
    background-color: none;
}

#quickLinks li.home a:hover {
    background: url(../img/home.gif) 50% 50% #042865 no-repeat;
}

#quickLinks li.contact a {
    height: 27px;
    background: url(../img/contacto.gif) 50% 50% no-repeat;
    background-color: none;
}

#quickLinks li.contact a:hover {
    background: url(../img/contacto.gif) 50% 50% #042865 no-repeat;
}

#quickLinks li.siteMap a {
    height: 27px;
    background: url(../img/mapa-sitio.gif) 50% 50% no-repeat;
    background-color: none;
}

#quickLinks li.siteMap a:hover {
    background: url(../img/mapa-sitio.gif) 50% 50% #042865 no-repeat;
}
/* =Header
 ------------------------------------------------------------------*/
/* Body
 ------------------------------------------------------------------*/


#contenido, .contenido {
	margin:0px auto;
    padding-bottom: 10px;
    text-align: justify;
    min-height:769px;
    height: auto !important;
    height: 769px;
    position: relative;
	z-index:80;
	width:650px;
	padding-right:10px;
	padding-left:10px;
	padding-top:125px;
}

body.inicio #contenido, 
body.inicio .contenido {
	padding-top:20px;
}
/* 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
 ------------------------------------------------------------------*/
/* URL de pie de página de CLIC*/


#datosFoot #direccion  ,#datosFoot #infContact,#datosFoot strong, #datosFoot a, #datosFoot div {
 	font-size:10pt;
	color:#FFFFFF;
	text-align:left;
	
}



#datosFoot div {
	padding-left:10px;	
	padding-right:10px;
}
#datosFoot ul  { width:950px; margin:0px; margin:0px auto; padding-top:5px;}
#datosFoot ul li { float:left; width:475px;  margin:0px; padding:0px; background:none;}

#clicFoot {
	position:absolute;
    text-align: right;
    padding-right: 5px;
    top:5px;
    font-size: 8pt;
    height: 16px;
	color: #666666;
	width:auto;
	margin:0px auto;
	clear:both;
	right:10px;
}

#wrapperFoot{
	background: url(../img/footer-bg.png) repeat-y center  ; 
	width:994px;
}

#aux{
	background: url(../img/bottom-end.png) no-repeat center; 
	width:994px;
	height:12px;
	margin:0px auto;
}


#datosFoot {
	width:980px;
	margin:0px auto;
	color:#ffffff;
	padding:5px 0px 0px 0px;
	text-align:center;
	background: url(../img/bottom-bg.png) no-repeat #1d4299 top center;
	
	position:relative;
}

#datosFoot #clicFoot * {
	color: #ffffff;
    font-size: 8pt;
}



/* =Footer
 -------------------------------------------------------------------*/



.message {
    padding: 10px;
    margin-top: 10px;
	margin-bottom: 10px;
    background: #FFDEDE;
    width: 338px;
    text-align: center;
    border: 1px solid #FF7F7F;
	color:#000000;
}

#flashMessage {
    background: #FFDEDE;
    border: 1px solid #FF7F7F;
    /*height:20px;*/
    padding: 3px;
    width: 250px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
/* Mapa de ubicacion */
table#mapaUbicacion td {
    vertical-align: middle;
}

table#mapaUbicacion td.imagen {
    vertical-align: top;
    text-align: center;
    padding-left: 20px;
}

b.mapaUbicacion {
    font-size: 8pt;
    font-weight: normal
}




/****** MENU AREA ****/

ul.menu, ul.menu li{
    margin:0px;
    padding:0px;  
	z-index:9999;
} 

ul.menu {   
  height:35px;
  position:relative;
  background:none;
  /*position:absolute;*/
  
  
}

 /*ul.menu li a span {display:none}*/
 ul.menu li a h1  { margin:0px; padding:0px;}

 ul.menu li {
    background-image:none;
    list-style-image:none;
    height: 35px;
    display:block;
    /*position:relative; /** protofish **/
    z-index:96896;
	top:0px;
 }
    
 ul.menu a { display:block; height:35px;}

 /*ul.menu li#mnInicio {position:absolute; left:33px; width:59px; }*/
 ul.menu li#mnQuienesSomos  {position:absolute; left:109px; width:186px;}
 ul.menu li#mnUbicacion {position:absolute; left:300px;  width:125px;}
 ul.menu li#mnContacto {position:absolute; left:437px;  width:126px;}
 
 
 ul.home li#mnInicio {position:absolute; left:63px; width:80px; }
 ul.home li#mnQuienesSomos  {position:absolute; left:155px; width:186x;}
 ul.home li#mnUbicacion {position:absolute; left:346px;  width:125px;}
 ul.home li#mnContacto {position:absolute; left:482px;  width:126px;}
 
 
 
 ul.menu li#mnInicio a#linkInicio { background: url(../img/menu/inicio.png) 0px 0px  no-repeat; }
 ul.menu li#mnInicio a#linkInicio:hover,  
 ul.menu li#mnInicio.hover  a#linkInicio { background: url(../img/menu/inicio.png) 0px -35px  no-repeat; }

 ul.menu li#mnQuienesSomos a#linkQuienesSomos { background: url(../img/menu/quienes-somos.png) 0px 0px  no-repeat; }
 ul.menu li#mnQuienesSomos a#linkQuienesSomos:hover,  
 ul.menu li#mnQuienesSomos.hover  a#linkQuienesSomos { background: url(../img/menu/quienes-somos.png) 0px -35px   no-repeat; }
 
 ul.menu li#mnUbicacion a#linkUbicacion { background: url(../img/menu/ubicacion.png) 0px 0px  no-repeat; }
 ul.menu li#mnUbicacion a#linkUbicacion:hover,  
 ul.menu li#mnUbicacion.hover  a#linkUbicacion { background: url(../img/menu/ubicacion.png) 0px  -35px  no-repeat; }
 
 ul.menu li#mnContacto  a#linkContacto { background: url(../img/menu/contacto.png) 0px 0px  no-repeat; }
 ul.menu li#mnContacto  a#linkContacto:hover,
 ul.menu li#mnContacto.hover   a#linkContacto { background: url(../img/menu/contacto.png) 0px -35px  no-repeat; }
 
ul.menu li a span  { display:none;} 
.mAnim { background: #006699; display:block; position:absolute;height:50px; top:0px; z-index:-10}
/* Esto es para los submenus anidados */
ul.menu li ul.sub {
    z-index: 9999;
    margin: 0px;
    padding: 0px;
    border: 1px #961B14 solid;
    position: absolute; /** relative para protofish **/
    width: 150px;
    color: #ffffff;
    text-align: left;
    background: #DD281D url(../img/menu/menu_bg.png) repeat-x;
}

ul.menu ul.sub li{
    background: none;
    display: block;
    float: none;
    border-bottom: 1px #5E5F5F solid;
    min-height: 5px;
    height: auto !important;
    height: 5px;
	background: transparent url(../img/bullet-menu.gif) no-repeat 3px 5px;
	padding-left:10px;
    
}



ul.menu ul.sub li.last{
    border:none;
    
}

ul.menu ul.sub li a span { display:block;}

ul.menu ul.sub li a {
    min-height: 5px;
    height: auto !important;
    height: 5px;
    color: #ffffff;
    text-align:left;
    z-index: 99999;
    width: auto;
    background:none;
    padding:1px;
	text-decoration:none;
    
}

ul.menu ul.sub li a:hover, {
ul.menu ul.sub li.hover a    
    color: #ffffff;
	font-weight:bolder;
	
}
ul.menu ul.sub li.hover {
	
 background: #5A100C url(../img/bullet-menu.gif) no-repeat 3px 5px;
}

ul.menu ul.sub li a:hover {
    width: auto;
    /*color: #E4E4E4;
    text-decoration:underline;*/
    background: none;
}


 /**** protofish ***/
/* show hide behaviour */
ul.menu ul,
ul.menu li:hover ul ul,
ul.menu ul ul,
ul.menu li:hover ul ul ul,
ul.menu ul ul ul,
ul.menu li:hover ul ul ul ul {
    position: absolute;
    left: -999em;
}

ul.menu li:hover ul,
ul.menu li li:hover ul,
ul.menu li li li:hover ul,
ul.menu li li li li:hover ul {
    left: -1px;
    z-index: 999;
}

/* show hide behaviour with protofish */
ul.menu li.hover ul ul,
ul.menu li.hover ul ul ul,
ul.menu li.hover ul ul ul ul {
    position: absolute;
    left: -999em;
}

ul.menu li.hover ul,
ul.menu li li.hover ul,
ul.menu li li li.hover ul,
ul.menu li li li li.hover ul {
    left: -1px;
    z-index: 999;
}
/**= MENU **/


.padding { text-align:right; padding-right:10px;}

ul#subDesc {
	width:152px;
	
}

ul#subQuienes-somos{
	width:178px;
}


ul#subCont{
	width:137px;
}


ul.sub li, 
ul.sub li a span{ 
	padding-bottom:2px;
	font-size:8pt;
}


/*** Menu Lateral **/
 ul.menuLat {   
  background:none;
  margin:0px;
  padding:0px;
  margin-left:63px;
  width:245px;
 }
 
 ul.menuLat li a h1  { margin:0px; padding:0px;}

 ul.menuLat li {
    background-image:none;
    list-style-image:none;
    height: 52px;
    display:block;
    z-index:96896;
	top:0px;
	margin:0px; padding:0px;
	 
 }
   



 
 ul.menuLat a { display:block; width:245px; height:52px; }


 /*
 ul.menuLat li#mnMaterialElectrico  {position:absolute; left:43px; width:121px;}
 ul.menuLat li#mnConstruccion {position:absolute; left:198px; width:136px; }
 ul.menuLat li#mnAutomotriz {position:absolute; left:368px; width:100px;}
 ul.menuLat li#mnFerreteria {position:absolute; left:502px; width:65px;}
 ul.menuLat li#mnPlomeria {position:absolute; left:601px;  width:138px;}
 ul.menuLat li#mnPintura {position:absolute; left:774px;  width:76px;}
 ul.menuLat li#mnVarios {position:absolute; left:883px;  width:67px;}
 */
 
  
 ul.menuLat li#mnMaterialElectrico a#linkMaterialElectrico { background: url(../img/menuLateral/material-electrico.png) 0px 0px  no-repeat; }
 
 ul.menuLat li#mnMaterialElectrico a#linkMaterialElectrico:hover,  
 ul.menuLat li#mnMaterialElectrico.hover  a#linkMaterialElectrico { background: url(../img/menuLateral/material-electrico.png) -245px 0px  no-repeat; }
 
 ul.menuLat li#mnConstruccion a#linkConstruccion { background: url(../img/menuLateral/construccion.png) 0px 0px  no-repeat; }
 ul.menuLat li#mnConstruccion a#linkConstruccion:hover,  
 ul.menuLat li#mnConstruccion.hover  a#linkConstruccion { background: url(../img/menuLateral/construccion.png) -245px 0px  no-repeat; }
 
 ul.menuLat li#mnAutomotriz a#linkAutomotriz { background: url(../img/menuLateral/automotriz.png) 0px 0px  no-repeat; }
 ul.menuLat li#mnAutomotriz a#linkAutomotriz:hover,  
 ul.menuLat li#mnAutomotriz.hover  a#linkAutomotriz { background: url(../img/menuLateral/automotriz.png) -245px 0px  no-repeat; }
 
 ul.menuLat li#mnFerreteria a#linkFerreteria { background: url(../img/menuLateral/ferreteria.png) 0px 0px  no-repeat; }
 ul.menuLat li#mnFerreteria a#linkFerreteria:hover,  
 ul.menuLat li#mnFerreteria.hover  a#linkFerreteria { background: url(../img/menuLateral/ferreteria.png) -245px 0px  no-repeat; }
 
 ul.menuLat li#mnPlomeria a#linkPlomeria { background: url(../img/menuLateral/plomeria.png) 0px 0px  no-repeat; }
 ul.menuLat li#mnPlomeria a#linkPlomeria:hover,  
 ul.menuLat li#mnPlomeria.hover  a#linkPlomeria { background: url(../img/menuLateral/plomeria.png) -245px 0px  no-repeat; }
 
 ul.menuLat li#mnPintura a#linkPintura { background: url(../img/menuLateral/pintura.png) 0px 0px  no-repeat; }
 ul.menuLat li#mnPintura a#linkPintura:hover,  
 ul.menuLat li#mnPintura.hover  a#linkPintura { background: url(../img/menuLateral/pintura.png) -245px 0px  no-repeat; }
 
 ul.menuLat li#mnVarios a#linkVarios { background: url(../img/menuLateral/varios.png) 0px 0px  no-repeat; }
 ul.menuLat li#mnVarios a#linkVarios:hover,  
 ul.menuLat li#mnVarios.hover  a#linkVarios { background: url(../img/menuLateral/varios.png) -245px 0px  no-repeat; }
 
 ul.menuLat li a span  { display:none;} 

 #menuLateral div#menuLatHelp {
  	 background: url(../img/menuLateral/bottom.png) no-repeat;
	 height:20px;
 }



/** Inicio **/
h1#bienvenidosProfesa { padding:15px; }



/** Mapa del sitio **/

 ul#siteMap h2 span{ font-size:12pt;}
 ul#siteMap h2 { padding-top:0px; padding-bottom:0px;}
 
 
 /** Quienes somos **/
h3.titleValores { display:inline; }
#valores div { padding-bottom:10px;}
 
 
 /** Boton  Catalogo **/
a.btnCatalogo span { display:none; }
  a.btnCatalogo { display:block; width:197px; height:136px; margin:0px auto; margin-top:10px;}
  a.btnCatalogo { background: url(../img/boton-catalogo-productos.png) 0px 0px  no-repeat; }
  a.btnCatalogo:hover { background: url(../img/boton-catalogo-productos.png) 0px -136px  no-repeat; }

 
  #direccionUbi * { font-size:10pt; }
 #direccionUbi { font-size:10pt; width:400px; margin:10px auto;}
/*--------------------------------------------------------------------------
 Clic 2008
 ----------------------------------------------------------------------------
 File: titles.css
 Gerardo Gonzalez Flores
 --> gerardo AT clic DOT com DOT mx <--
 ---------------------------------------------------------------------------
 CSS styles for titles
 Estilos generales para titulos.
 --------------------------------------------------------------------------*/
/* Titles
 ------------------------------------------------------------*/
h1, h2, h3, h4, h5 {
    margin: 0px;
    padding: 0px;
    color:#06334B;
}

h2 span, h2{
    font-size: 16pt;
}

h2.titleCufonWhite span, h2{
    font-size: 14pt;
}


 h3 span, h3{
 	font-size:12pt;
	color:#000000;
 }

 h4 span, h5 span , h4, h5{
	font-size:11pt;
	color:#000000;
}


.contenido h1,  #contenido h1,
.contenido h2, #contenido h2,
.contenido h3, #contenido h3, 
.contenido h4, #contenido h4,
.contenido h5, #contenido h5{
   
	padding-top: 10px;
	padding-bottom: 10px;
   
}


th.title span {
    display: inline
}

h1.title {
    min-height: 174px;
    height: auto !important;
    height: 174px;
    width:664px;  
    margin: 0px auto;
	
	top:0px;
}


h1.title span {
    font-size: 19pt;
	display:none;
    
}

.holderTitle, #contentHeader{
    position: absolute;
	top:0px;
    margin:0px auto;
	padding-top:10px;
	border: none;
    min-height: 174px;
    height: auto !important;
    height:174px;
	z-index:10;
	width: 100%;
}

h1#titleAutomotriz { width:664px;  height:174px; background: url(../img/titles/automotriz.jpg) no-repeat center;}
h1#titleConstruccion { width:664px;  height:174px; background: url(../img/titles/construccion.jpg) no-repeat center;}
h1#titleFerreteria { width:664px;  height:174px; background: url(../img/titles/ferreteria.jpg) no-repeat center;}
h1#titleMaterialElectrico { width:664px;  height:174px; background: url(../img/titles/material-electrico.jpg) no-repeat center;}
h1#titlePintura { width:664px;  height:174px; background: url(../img/titles/pintura.jpg) no-repeat center;}
h1#titlePlomeria { width:664px;  height:174px; background: url(../img/titles/plomeria-y-fontaneria.jpg) no-repeat center;}
h1#titleVarios { width:664px;  height:174px; background: url(../img/titles/varios.jpg) no-repeat center;}

h1#titleQuienesSomos { width:664px;  height:174px; background: url(../img/titles/quienes-somos.jpg) no-repeat center;}
h1#titleContacto { width:664px;  height:174px; background: url(../img/titles/contacto.jpg) no-repeat center;}
h1#titleUbicacion { width:664px;  height:174px; background: url(../img/titles/ubicacion.jpg) no-repeat center;}
h1#titleMapaDelSitio { width:664px;  height:174px; background: url(../img/titles/mapa-del-sitio.jpg) no-repeat center;}



/*-------------------------------------------------------------------------
 Clic 2006
---------------------------------------------------------------------------
 File: forms.css
 Sitio:
 	    Gerardo Gonzalez Flores
 		--> gerardo AT clic DOT com DOT mx <--
---------------------------------------------------------------------------	
 CSS style for html forms
 Estilos generales para los formularios utilizados
--------------------------------------------------------------------------*/

.textoPequeno, .textoPequeno *{	font-size:10px; }
.admin {
	width:750px;
	/*border:1px solid;*/
}

.converter{
	width:220px;
}



.admin label, .converter label {
		display:block;
		width:180px;
		float:left;
		text-align:right;
		padding-right:2px;
}
.converter label
{
	width:110px;
}
.formItem {
	padding-top:1px;
	padding-bottom:1px;
	clear:both;

}

.formItem input, .formItem textarea {
 width:270px;
}

.formItem input.radio, input.checkbox{	
	width:auto;
}


.converter .formItem input{
	width:100px;
}
.formItem select {
	width:150px;
}

.submit{
		text-align:center;
		padding-top:2px;	
}


/* Formularios de contacto */
 .forma{
	width:400px;
}

.atencion{
	color:#990000;
	font-weight:bold;
}
#ContactoTipoComentario{ width:100%}
/*-------------------------------------------------------------------------
 Clic 2006
---------------------------------------------------------------------------
 File: error_messages.css
 Sitio: www.c2e-us.net
 	    Gerardo Gonzalez Flores
 		--> gerardo AT clic DOT com DOT mx <--
---------------------------------------------------------------------------	
 CSS styles for error messages
 Estilos para mensajes de error e informacion
--------------------------------------------------------------------------*/

.error_message, .error-message{
	font-size: 8pt;
	font-family: "Arial";
	color: #990000;
	font-weight:bold;
	text-align:left;
		
	padding-bottom:2px;
	padding-left:18px;
	background-image:url(../img/error/alert.gif);
	background-repeat:no-repeat;
	width:auto;
}
.admin * .error_message, .admin * .error-message{
	margin-left:150px;
}
.info_message {
	font-size: 8pt;
	font-family: "Arial";
	color: #000000;
	
	
	padding-bottom:2px;
	padding-left:18px;
	background-image:url(../img/error/information.gif);
	background-repeat:no-repeat;
	width:auto;
}
.resultado_vacio{
	clear:both;
	width:300px;
	padding:10px;
	background:#CCDCDD;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
}
/*--------------------------------------------------------------------------
 Clic 2007
----------------------------------------------------------------------------
 File: items.css
 	    Gerardo Gonzalez Flores
 		--> gerardo AT clic DOT com DOT mx <--
---------------------------------------------------------------------------		
 Estilos generales para ficha de item.
--------------------------------------------------------------------------*/

 .itemList{
 	width:99%;
	padding-top:20px;
 }

 
 .item{
 	width:99%;
	margin-bottom:5px;
	position:relative;
	
 	margin-left: auto;
    margin-right: auto;
	
	/*height:130px; */
 }
 

 ul.itemList li.even {
  list-style:none;
  background:none;
  float:left;
  width:225px;
  margin:0px;
  padding:0px;
  
 }

 ul.itemList li.odd{
  list-style:none;
  background:none;
  float:left;
  width:225px;
  margin:0px;
  padding:0px;

 }
 

 .itemList ul li{list-style:none; list-style-image: none;}
 .item .titulo{	font-weight:bold; text-transform:uppercase; text-align:left}
 .item .imageWrap .itemImagen {
	
	width:210px;
	margin-left: auto;
    margin-right: auto;
	
	/*border:1px solid #ff0000;*/
	/*height:114px;*/
	
 }
 .item .imageWrap .itemImagen img {
 	text-align:center;
 }
/* .item .imageWrap .imagen {border:1px solid #000000; padding:1px}*/
 .item .imageWrap {
 	/*float:left;*/
	width:220px;
	margin-left: auto;
    margin-right: auto;
	/*height:114px;*/
	
 }




 .item .lista{
  /* width:50%;*/
 /* float:left;*/
	
 }
 
 .item .verMas { position:absolute; bottom:0px; right:0px; z-index:99999}
 .item {padding-bottom:10px;}
 
 
 /* IMAGEN GRANDE */

#popUp .item .imageWrap .itemImagen {
	
	width:410px;
	margin-left: auto;
    margin-right: auto;
	padding-top:10px;
	/*border:1px solid #ff0000;*/
	/*height:114px;*/
	
 }

#popUp .item { width:430px;}
#popUp .item .imageWrap .itemImagen img {
 	text-align:center;
 }
/* .item .imageWrap .imagen {border:1px solid #000000; padding:1px}*/
#popUp .item .imageWrap {
 	/*float:left;*/
	width:420px;
	margin-left: auto;
    margin-right: auto;
	/*height:114px;*/
	
 }
 
 
 /***** ITEMS DE NOTICIAS *****/
  #noticias ul#listadoNoticias li { 
  			background:none;
			padding:0px;
			margin:0px;
  }
  #noticias  h3 { padding:0px; padding-bottom:5px; color:#0069B0 }

  #noticias  div.keepReading * { font-size:8pt;}
  #noticias  div.keepReading  { 
  			clear:both; 
			width:110px;
			/*border:1px solid;*/
			margin-left:auto;
			/*font-weight:bold;*/
			background: url(../img/bullet-level-3.gif) no-repeat .1em .3em;
   			padding-left: 15px;
  }
  #noticias  a, #newsList a {}
  #noticias  a:hover, #newsList a:hover { color:#0069B0}
  #noticias #newsList , #newsList{
  	background: url(../img/bullet-level-3.gif) no-repeat .1em .3em;
 	padding-left: 15px;
	width:150px;
	/*border:1px solid;*/
	margin-left:auto;
	margin-right:auto;
	font-size:9pt;
	/*font-weight:bold;*/
  }
  
  #newsList { margin-right:0px;}
  .listado #noticias { 
  	width:100%; 
	float:none;
	padding:0px;
	margin:0px;
	}
@charset "UTF-8";

/**
 * Horizontal CSS Drop-Down Menu Module
 *
 * @file		dropdown.css
 * @package		Dropdown
 * @version		0.7.1
 * @type		Transitional
 * @stacks		597-599
 * @browsers	Windows: IE6+, Opera7+, Firefox1+
 *				Mac OS: Safari2+, Firefox2+
 *
 * @link		http://www.lwis.net/
 * @copyright	2006-2008 Live Web Institute. All Rights Reserved.
 *
 */

ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
 list-style: none;
 margin: 0;
 padding: 0;
}

ul.dropdown {
 position: relative;
 z-index: 597;
 float: left;
}

ul.dropdown li {
 float: left;
 line-height: 1.3em;
 vertical-align: middle;
 zoom: 1;
}

ul.dropdown li.hover,
ul.dropdown li:hover {
 position: relative;
 z-index: 599;
 cursor: default;
}

ul.dropdown ul {
 visibility: hidden;
 position: absolute;
 top: 100%;
 left: 0;
 z-index: 598;
 width: 100%;
}

ul.dropdown ul li {
 float: none;
}

ul.dropdown ul ul {
 top: 1px;
 left: 99%;
}

ul.dropdown li:hover > ul {
 visibility: visible;
}