/*-------------------------Item: clearer general-----------------*/
* {
	margin: 0; 
	padding:0;
}

body {
	margin: 0;
	padding: 0;
	background-color: #C7EDB7;
	font-family:"Lucida Sans Unicode", helvetica, arial, sans-serif; 
	font-size:65%;
	text-align: left;
}

/*------------------------Imagenes: correcion de autopadding en ifrefox------------------------*/

#divdelproblema img {
	display:block; /*firefox pone un autopadding si no defino esta propiedad. It is the "problem" that images as inline elements are
aligned in relation to the baseline of the text and the gap keeps some space for characters like "p".*/
}

/*------------------------Layout: divs de diagramación comunes------------------------*/

#containerhead {			/*div que contiene al header*/
	margin: auto;
	width: 100%;
	height: 318px;
	background-image: url(../img/bgheader.jpg); 	/*aplicar en caso de faux columns*/
}

#header {				/*div del header*/
	height: 82px;
	width: 980px;
	margin: auto;
	clear: both;
	border:0;
	background-image:url(../img/header.jpg);
	
}

body.english #header {
		background-image:url(../img/engheader.jpg);
	
}

#menu {				/*div para el menu*/
	height: 65px;
	width: 960px;
	margin: auto;
	clear: both;
	border:0;
	background-image:url(../img/bgmenu.jpg);
	padding: 0 10px 0 10px;	
}

#image {				/*div de la imagen principal*/
	height: 171px;
	width: 980px;
	margin:auto;
	background:url(../img/shadowcontenttop.jpg) bottom;	
}
	#image img{
		border:0;
		}
	

#content {				/*div para menu o barra auxiliar*/
	width: 930px;/*980-70*/
	margin:auto;
	background-image:url(../img/bgcontent.jpg);
	padding: 10px 25px 0 25px;
	overflow:auto;
	font-size: 1.25em;
}

#contentcien {				/*div para menu o barra auxiliar*/
	width: 100%;
	margin:auto;
	background-color:#E6F1F7;
	
}
/*-------------------------Footer------------------------*/

#footercontainer {				
	clear: both;
	height: 170px;
	width: 100%;
	border:0;
	background-image:url(../img/bgfooter.jpg);
}
#footer {				
	margin:auto;
	height: 170px;
	width: 960px;
	border:0;
	background: url(../img/footer.jpg) center no-repeat;
	font-size:1.1em;
	color:#003300;
	text-align:left;
	padding: 0 10px;
	line-height: 150%;
}
#footer #infoextra {
	float:left;
	width:230px;/*250-20*/
	height: 100px;/*120-20*/
	margin:  30px 10px 0 0;
	padding: 10px;
	
}
	#infoextra ul li {
		list-style: none inside;
		float:left;  height: 16px; line-height:16px;
		margin: 0 0 10px 30px;	
		padding: 0 0 0 23px; 
	}
		#infoextra ul li#footaddress {
			background:url(../img/map.png) no-repeat top left;
			
		}
		#infoextra ul li#footphone {
			background:url(../img/phone.png) no-repeat top left;
		}
		#infoextra ul li#footmail {
			background:url(../img/email.png) no-repeat top left;
		}
#footer #centernote {
	float:left;
	width:415px;
	height: 110px;
	margin:  14px 10px 0 0;
	padding: 10px;
		
}
	#footer #centernote h3 { 
		margin: 0 0 4px 20px; width: 95%; 
		border-bottom:0; font-style:italic; font-size:1.4em; letter-spacing:-0.08em;  
		}
		
	#footer h3 {  color:#466721; border-bottom: solid 1px #466721; }
	#centernote div {
		float:left;
		width: 137px;
		height: 50px;
		
	}
	#centernote div a#footcontactanos {
		float:left; height: 20px; width: 137px;	margin: 5px 0 0 0;
		text-align:center;
		padding: 62px 0 0  0;	
		background:url(../img/footcontactanos.png) no-repeat top center; color: #466721;
		font-size: 1.3em; font-style:italic;
		border-right: solid 1px #375915;
	}
	#centernote div a#footlinkchat {
		float:left; height: 27px; width: 137px;	margin: 5px 0 0 0;
		padding: 55px 0 0 0 ;
		text-align:center;
		background:url(../img/footlinkchat.png) no-repeat top center; color: #466721;
		font-size: 1.1em; font-style:italic;
		border-right: solid 1px #375915;
	}
	#centernote div p {
		font-size: 1.1em; font-style:italic;
		margin: 0 0 6px 15px;
	}
	#centernote div ul li {
		list-style: none inside;
		margin: 0 0 0 30px;		
	}
		#centernote div ul li a#footskype {
			float:left;  height: 20px; line-height:20px;
			background:url(../img/footskype.png) no-repeat top left;
			padding: 0 0 0 23px; margin: 0 0 5px 0;
		}
		#centernote div ul li a#foottwitter {
			float:left;  height: 20px; line-height:20px;
			background:url(../img/foottwitter.png) no-repeat top left;
			padding: 0 0 0 23px; margin: 0 0 5px 0;
		}
		#centernote div ul li a#footfacebook {
			float:left; height: 20px; line-height:20px;
			background:url(../img/footfacebook.png) no-repeat top left;
			padding: 0 0 0 23px; margin: 0 0 5px 0;
		}
		
#footer #credits {
	float:left;
	width:220px;
	margin:  80px 0 0 20px;
	padding: 3px 0 0 0;
	text-align:right;
}

#footer #language a img {
	float: right;
	margin: 3px 0 0 6px;
	border:0;
	}
#footer #language {
	width: 180px;
	border-bottom: solid 1px #060;
	margin: 0 0 5px 40px;
	padding: 2px;
	font-size: 0.9em;
	}
	#footer #language a {
	color:#003300;
	font-weight:normal;
	}
#editable {				/*div para el contenido de la region editable (dentro de #content)*/
	width: 100%;
	overflow: auto; 	/* evita el uso del geniuswork haciendo que el div contenedor se estire*/
}

/*.geniuswork {			"aplicar en caso de que overflow no funcione y retirar este comentario"
	width: 90%;
	background-color: #F2F2F2;
	margin: 0 auto 0 auto;
	clear:both;
	color: #888888;
}*/

/*-------------------------Layout: columnas de diagramación interna------------------------*/

#menu ul {
	list-style-type:none;
	list-style-position:outside;
	margin:0;
	padding:0;
}

#menu ul li {
	list-style-type:none;
	list-style-image:none;
	padding: 0;
	float:left;
}

#menu ul li a {
	text-align:center;
	padding: 45px 0 0 0;
	width: 160px;
	height:20px;
	float:left;
	font-size:1.2em;
	font-weight:bold;
	letter-spacing:-10%;
	color:#435A6D;
	text-decoration:none;
}
	#menu ul li a:hover {
		color: #fff;
	}

#menu ul li#home { background-image:url(../img/menuhoverhome.jpg);}
#menu ul li#home a { background-image:url(../img/menuhome.jpg);}
#menu ul li#home a:hover { background-image:url(../img/menuhoverhome.jpg);}
body.home #menu ul li#home a { background-image:url(../img/menupressedhome.jpg);}


#menu ul li#studio {	background-image:url(../img/menuhoverstudio.jpg);}
#menu ul li#studio a {	background-image:url(../img/menustudio.jpg);}
#menu ul li#studio a:hover { background-image:url(../img/menuhoverstudio.jpg);}
body.studio #menu ul li#studio a { background-image:url(../img/menupressedstudio.jpg);}


#menu ul li#servicios {	background-image:url(../img/menuhoverservicios.jpg);}
#menu ul li#servicios a { background-image:url(../img/menuservicios.jpg);}
#menu ul li#servicios a:hover {	background-image:url(../img/menuhoverservicios.jpg);}
body.services #menu ul li#servicios a {  background-image:url(../img/menupressedservicios.jpg);}


#menu ul li#portafolio { background-image:url(../img/menuhoverportfolio.jpg);}
#menu ul li#portafolio a {	background-image:url(../img/menuportfolio.jpg);}
#menu ul li#portafolio a:hover { background-image:url(../img/menuhoverportfolio.jpg);}
body.portfolio #menu ul li#portafolio a {  background-image:url(../img/menupressedportfolio.jpg);}


#menu ul li#blog { background-image:url(../img/menuhoverblog.jpg);}
#menu ul li#blog a { background-image:url(../img/menublog.jpg);}
#menu ul li#blog a:hover {	background-image:url(../img/menuhoverblog.jpg);}
body.blog #menu ul li#blog a { background-image:url(../img/menupressedblog.jpg);}



#menu ul li#contacto { background-image:url(../img/menuhovercontacto.jpg);}
#menu ul li#contacto a  { background-image:url(../img/menucontacto.jpg);}
#menu ul li#contacto a:hover { background-image:url(../img/menuhovercontacto.jpg);}
body.contact #menu ul li#contacto a {  background-image:url(../img/menupressedcontacto.jpg); }


/*-------------------------Layout: columnas de diagramación interna------------------------*/

.columnleft {		/*en modelos de diagramacion 2 columnas, esta ira a la izquierda*/
	padding: 4px;
	width: 30%;
	margin: 0 10px 0 10px;
	clear:none;
	float:left; 
}

.columnright {		/*en modelos de diagramacion 2 columnas, esta ira a la derecha*/
	padding: 4px;
	width: 30%;
	margin: 0 10px 0 10px;
	clear:none;
	float:left; 
}

.columnleft50 {		/*en modelos de diagramacion 2 columnas, esta ira a la izquierda*/
	padding: 4px;
	width: 47%;
	margin: 0 5px 0 0;
	clear:none;
	float:left; 
}

.columnright50 {		/*en modelos de diagramacion 2 columnas, esta ira a la derecha*/
	padding: 4px;
	width: 47%;
	margin: 0 0 0 5px;
	clear:none;
	float:left; 
}
.columnmiddle {			/*en modelos de diagramacion 3 columnas, esta ira en el medio, CORREGIR WIDTHS a 30%*/
	padding: 4px;
	width: 30%;
	margin: 0 10px 0 10px;
	clear:none;
	float:left;
	display: inline;
}

.columnaleftdostercios {		/*en modelos de diagramacion 2 columnas, esta ira a la izquierda*/
	padding: 4px;
	width: 58%;
	margin: 0 6px 0 0;
	clear:none;
	float:left; 		/*colocar de ser necesario*/
}

.columnarightdostercios {		/*en modelos de diagramacion 2 columnas, esta ira a la derecha*/
	padding: 4px;
	width: 38%;
	margin: 0 0 0 6px;
	clear:none;
	float:left; 		/*colocar de ser necesario*/
}


/*--------------------------------------SUBMENU SERVICIOS--------------------------*/

#submenuservicios {
	width:960px;
	height:160px;
	padding: 0 10px;
	background:url(../img/imgservicios.jpg);
	}

#submenuservicios div  {
	float:left;
	width: 290px;
	height: 130px;
	margin: 15px ;
}

#submenuservicios div ul {
	list-style: disc outside;
	margin:0 0 0 20px;
	padding:0;
	color:#fff;
	
}

#submenuservicios ul li { padding: 5px 0 5px 0; }

#submenuservicios ul li a {
	text-align:center;
	font-size:1.29em;
	color:#ffffff;
	text-decoration:none;
	letter-spacing: 0em;
}

#submenuservicios ul li a:hover { color: #A5F202; }