/* NOTA: aquesta plantilla te el menu a l'esquerra i el contingut a la dreta. si es vol al reves, nomes cal intercanviar els continguts d'una columna a l'altra i canviar les amplades de les columnes. la suma de les amplades de les columnes dreta i esquerra ha de ser igual o inferior a l'amplada total de la pagina (embolcallPag). no posar mai margin o padding a les columnes. utilitzar les "camises". aixo facilita la feina i evita problemes de webs desquadrades en alguns navegadors, ja que tracten amplades i marges/paddings de forma diferent! */

/************** GENERAL ****************/
body{
	margin: 0 auto;
	padding: 0px;
	background: #403835;
	font-family: Trebuchet MS,Arial,sans-serif;
	font-size: 13px;
	color: #333;
	height:100%;
}

input, textarea{ /* si no es posa aixo la font del missatge de contacte es diferent */
	font-family: Trebuchet MS,Arial,sans-serif;
	font-size: 13px;
}

a{color:#8D321A; text-decoration: none; font-weight:bold; border:0px; outline:none;}
a:hover{ text-decoration: underline;}
	
img{border:0px;}

p{
	margin-top:10px;
	padding:0px;
}

.centrat{ /* per si es vol centrar horizontalment algun element. es poden afegir parametres si els elements centrats han de tenir altres caracteristiques comunes */
		text-align:center;
	}	
	
#titol_seccio{
	font-size: 16px;
	font-weight:bold;
	color: #FF6000;
	margin-bottom:20px;
}

.subtitular{
	font-size: 16px;
	font-weight:bold;
}

.orng{color: #FF6000;}

/*============= estructura del template =================*/

	

#embolcall{  /*tota la pagina. es centra al navegador per margin: 0 auto*/
	  background:#403835; 
	  width: 972px;
	  margin:0 auto;
	}
	


	  
#capsalera{ /* a dintre de la capçalera normalment hi ha  un altre div amb el logo que linka a index */
	width:960px;
	text-align:left;	
	height:356px;
	margin-top:35px;
	background: white url(../../img/fons-cap.jpg) bottom no-repeat;
	border:6px solid white;
	position:relative;
	}
	  
	#idiomes{
		float:right;
		font-size: 12px;
		color:#FF6000;
		margin:8px;
	}
	
	#idiomes a, #idiomes .gris{
		color:#9B8B70;
	}
	
	#logo{
		
		text-align:left;
		margin-left:50px;

	}


#menu{
	position:relative;
margin-left:50px;
margin-top:2px;
text-align:center;
width:910px;

}	

#menu .overlay{
	background:#666666;
	position:absolute;
	width:910px;
	bottom:0;
	left:0;
	top:0;
	opacity:0.20;
	-moz-opacity: 0.20; /* older Gecko-based browsers */
	filter:alpha(opacity=20); /* For IE6&7 */	
}

#menu .content{
	position: relative;
	width:100%;
}

#menu ul{
	padding: 0px;
	margin: 0px;
	list-style: none;
	
}

#menu ul li{
	display:inline;
	margin-bottom:7px;	
	font-size: 16px;
	font-weight:bold;
	}
	
	#menu ul li.separador{
		font-weight:normal;
	color:#A49272;
	}

	/*els estats dels "botons" del menu*/
	
	#menu ul li.itemMenuOn{
		padding:9px;
		color: #FF6000;
	}
	
	
	#menu ul li a{
		padding:9px;
		color:black;
	}
	

 #menu ul li a:hover{
	color: #FF6000;
	text-decoration:none;
} 	
	/* ------------------------ */	
	
	#flash{
		width:235px;
		height:229px;
		border:6px solid white;
		border-bottom:none;
		margin-left:50px;
		position:absolute;
		bottom:0px;
	}
	
	#contenidor_categories{
		width:235px;
		margin-top:84px;
	}
	
	#categories_galeria{
		width:100%;		
		position: relative;
	}
	
	#categories_galeria .overlay{
		background:#ffffff;
		position:absolute;
		width:235px;
		bottom:0;
		left:0;
		top:0;
		opacity:0.80;
		-moz-opacity: 0.80; /* older Gecko-based browsers */
		filter:alpha(opacity=80); /* For IE6&7 */	
	}
	
	#categories_galeria .content{
		position: relative;		
		color:#FF6000;
		font-size:16px;
		font-weight:bold;
		text-align:right;
		padding:10px;
		padding-right:14px;
		line-height:1.8em;
	}
	
	#categories_galeria .content a{
		color:black;
	}

/****************************************************/
/****************************************************/
	
	
#embolcallPag{/*els continguts entre la capçalera i el peu: menu i contingut */
	width:972px;
	background:white;
	
	}


/*================== continguts ===================*/





#contingut{	/* normalment aqui va el contingut principal de la pagina a la dreta del menu*/
	width:960px; /*l'amplada total es aixo més el padding d'esquerra i dreta! */
	overflow:hidden; /*per IE 5.5 i 6 */
	float:left;
	text-align:left;
	min-height:549px;
	height:auto !important;
	background: #D9D1AD url(../../img/ombra-contingut.jpg) top repeat-x;
	border:6px solid white;
	border-top:none;
	}
	
.camisa_contingut{/* per contenir el contingut (valga la rebuznancia). aixo fa que no calgui especificar marges ni paddings al div contingut*/
	margin:0px;
	margin-bottom: 0px;	/* per IE6  */
	}
	
#imatge_contingut{	
	float:left;
	margin-top:0px;
	margin-left:50px;
	width:235px;
	height:493px;
	border:6px solid white;
	border-top:none;
}

#texte_contingut{
	float:left;
	margin-top:30px;
	margin-left:42px;
	padding-bottom:14px;
	width:580px;
}

#texte_contingut img{
	border:6px solid white;
}
	
#peu_general{
	background: white url(../../img/fons-peu.jpg) top no-repeat;
	color:black;
	float:right;
	width:972px;
	height:95px;
	font-size: 12px;	
	position:relative;
	}
	
	#logo_peu{
	float:left;
	margin:0px;
	padding:0px;
	margin-top:17px;
	margin-left:14px;
	}
	

	
	#links_peu{
	float:right;
	margin:0px;
	padding:0px;
	padding-right:16px;
	margin-top:17px;
	color:#000000;
	
	}
	
	#links_peu a, #links_peu .separador{
		color:white;
		margin-left:25px;
		
	}
	

/*#######################################################################################################*/	

/* ********************************** formulari contacte ************************************************ */



#dades_client{
	margin-left:96px;
	margin-bottom: 20px; 
	}
	
	
#legal_text{
	clear:both; font-size:11px
}

	
#contactar{
	width:100%;
	float:right;
	margin-right:0px;
}



#contactar #camps_basics{
	float:right;
	margin-right:260px;	
}



#contactar #base{ /*assumpte i missatge van aqui*/
	width:100%; /* per IE */
	margin-top:20px;
	margin-right:0px;
	clear:both;
	float:right;
}


#contactar div{
	vertical-align:middle;
	text-align:right;
	margin-bottom:7px; /*separacio vertical entre camps*/
}

#contactar .error{
	background-color:#FFFF66;
}

#contactar .estret div input{/* camp de texte normal*/
	width:220px;
	margin-top:-3px;
	margin-left: 10px;
	
}

#contactar .ample div input, #contactar .ample div textarea{/* camp de texte ample*/
	width:480px;
	margin-left: 10px;
}

#contactar .ample .controls input, #contactar .mes_ample .controls input { /*amplada dels botons del formulari*/
	width:100px;
}

.fix_missatge{
	float:right;
	text-align:right;	
	height:5em;
}

textarea {
	float:right;
}

.controls{
	clear:both;
	float:right;
	width:100%;
	margin-top:7px;
	font-size:11px;
	color:#00385F;
}

.controls p{
float:left;margin:0px;margin-left:96px;
}

#errors{
	clear:both;
	margin:20px;
	color:black;
	opacity:.80; /*experiments amb transparencia*/
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	}	
	
#errors p{	
	padding:5px;
}

/* ************************************* ubicacio google maps ******************************************** */
#map{
	border:6px solid white;
	width:568px;
	height:415px;
	margin-left:0px;
	float:right;
	margin-bottom:20px;
}

#map .bubble {
	width: 200px; 
	padding-right: 10px; 
	color:#333333; 
	font-size:12px;
	}