* { margin: 0; padding: 0; }

body { 
	margin: 0pt; 
	background: rgb(236, 137, 33) 
	url(../imatges/fons_body.jpg) repeat-x scroll center top; 
}

#contenidor { 
	margin: 0pt auto; 
	background: url(../imatges/fons_contenidor.jpg) repeat-y scroll left center; 
	width: 773px; 
	}
	
#top { 
	margin: 0pt; 
	background:  url(../imatges/fons_capsalera_principal.jpg) no-repeat left top; 
	height: 274px; 
	}

#logo, #menuidiomes { margin: 5px 0 0 0;;
}	

#top h2 { padding: 225px 90px 0px 70px; margin: 0}
#top p {padding: 0 300px 0 70px; font-size:90%; margin-top: 0}


#coldreta {float:right;
width:200px;}

#principal {
	margin: 0px 0px 0px 0px;
	padding-left: 70px;
	padding-bottom: 2em;
	width: 400px;
	}
	
#menu { 
	width: 180px; 
	float: right; 
	}
	
#peu { 
	background: rgb(236, 137, 33) url(../imatges/fons_peu.jpg) no-repeat scroll left top; 
	height: 90px; 
	padding-left: 70px; }

.neteja { clear: both; }

body { 
	font-family: Verdana,sans-serif; 
	font-style: normal; 
	font-variant: normal; 
	font-weight: normal; 
	font-size: 0.75em; 
	line-height: 1.5em; 
	color: rgb(34, 30, 31); }
	
a { text-decoration: none; }

a:link, a:visited { border-bottom: 1px solid rgb(242, 176, 106); color: rgb(11, 12, 7); }
/* html body a:hover { border-bottom: 1px solid rgb(242, 176, 106); color: rgb(11, 12, 7); background-color: rgb(252, 237, 222); } */

a img { border:  none ; }


h2, h3, h4, #menu ul { font-family: "Trebuchet MS",Tahoma,Arial,Helvetica,sans-serif; font-weight: bold; }

h2 { margin: 1em 0pt; font-size: 1.5em; color: rgb(107, 42, 38); letter-spacing: 1px; }

h3 { margin: 0; font-size: 1.3em; letter-spacing: 2px; padding: 0 }

h4 { margin: 1em 0pt 0pt; background: rgb(255, 255, 255) url(../imatges/fletxa_titol_fitxa.png) no-repeat scroll left top; font-size: 1.1em; letter-spacing: 0px; padding-left: 15px; }

p { margin: 0.75em 0pt 0pt; }

ul, ol { list-style-type: none; list-style-image: none; list-style-position: outside; margin-bottom: 0.5em; }

table { border-bottom: 3px solid rgb(178, 178, 178); margin: 0pt 0pt 2em; }

th, td { border-style: solid; border-color: rgb(204, 204, 204); border-width: 0pt 0pt 1px 1px; padding: 0.5em 1em; }

#principal li { background: rgb(255, 255, 255) url(../imatges/boto_llistes_principal.png) no-repeat scroll left top; padding-left: 1em; margin-bottom: 0.2em; }

#principal li li { background: rgb(255, 255, 255) url(../imatges/boto_llistes_2.png) no-repeat scroll left top; padding-left: 1em; margin-left: 1em; }

#principal p {text-align:justify; }

#principal img {  }


/* menu principal */

#menu ul { 
	margin-left: 0pt; 
	padding-left: 0pt; 
	list-style-type: none; 
	font-weight: bold; 
	letter-spacing: 0.1em; 
	font-size: 1.1em;
	line-height:110%}

#menu a { 
	border-bottom: medium none; 
	padding: 5px 3px; 
	background: rgb(236, 137, 33); 
	display: block; 
	width: 155px; 
	border-bottom: 1px solid #F6C490 
	 }

#menu a:link, #menu a:visited { color: rgb(238, 238, 238); text-decoration: none; }

#menu a:hover { background-color: rgb(240, 161, 77); color: rgb(17, 17, 17); }

#menu li.active a:link, #menu li.active a:visited, #menu li.active a:hover, #menu li.active a:active { color: rgb(0, 0, 0); }


#menu li.active a:hover { color: rgb(0, 0, 0); }

/*2n nivell */

#menu ul ul li { margin: 0 0 0 10px; }

#menu ul ul a
{
display: block;
padding: 2px 2px 2px 10px;
width: 138px;
color: #fff;
text-decoration: none;
font-size:.9em;
font-weight:normal;
background: rgb(236, 137, 33) url(../imatges/boto_rodo.png) no-repeat 0 4px ;
border-bottom: 1px dotted #F6C490 
}

#menu ul ul ul a:hover
{
color: #000;
background-color:rgb(240, 161, 77) ;
text-decoration: none;
}

/* 3r nivell */

#menu  ul ul ul li { margin: 0 0 0 20px; }

#menu ul ul ul a
{
display: block;
padding: 2px 2px 2px 10px;
width: 118px;
color: #fff;
background:none;
background-color: rgb(236, 137, 33);
text-decoration: none;
font-size:.7em;
font-weight:normal;

}

#menu ul ul ul a:hover
{
color: #000;
background-color:rgb(240, 161, 77) ;
text-decoration: none;
}

#menu li.active ul li a:link, 
#menu li.active ul li a:visited, 
#menu li.active ul li a:hover, 
#menu li.active ul li a:active { 
	color: white; }

#menu li.active ul li.active a:link, 
#menu li.active ul li.active a:visited, 
#menu li.active ul li.active a:hover, 
#menu li.active ul li.active a:active { 
	color: black; }


ul#menuidiomes { margin: 3px 18px 10px 0; list-style-type: none; font-family: Arial,Helvetica,sans-serif; font-size: 0.85em; text-align:right; }

ul#menuidiomes li { display: inline; }

ul#menuidiomes li a { border-right: 1px solid rgb(238, 238, 238); border-bottom: medium none; margin: 0pt; padding: 0pt 0.5em; text-decoration: none; color: rgb(255, 255, 255); }

ul#menuidiomes li a:hover { background-color: rgb(228, 184, 141); color: rgb(0, 0, 0); }



.pdf {
padding-left:20px;
background:url(../imatges/pdf.gif) left no-repeat; }

.imatgeesq {
float: left;
margin: 0.5em 1em 0.5em 0;
}
.imatgedreta {
float: right;
margin: 0.5em 0 0.5em 1em;
border: 2px solid #000;
}


.numservei { padding:0; font-size:90%; margin-top: 0; margin-bottom: 1.5em}



/* index serveis */

/*
#menuserveis ul li {
	display: inline;
	list-style-type: none;
}

#menuserveis ul li a {
	display: block;
	padding: 9px;
	margin: 0px 9px 9px 0px;
	height: 20px;
	width: 100%;
}

#menuserveis ul li a, #menuserveis ul li a:hover {
    border: 1px solid #e6e6e6;
    background-color: #f6f6f6;
}

#menuserveis ul li a:visited {
    background-color: #fcfcfc;
    border: 1px solid #f8f8f8;
}

#menuserveis ul li a:hover {
	background-color: #f3f3f3;
	border: 1px solid #cccccc;

}

#menuserveis h3 {
}

.menucrae {
background: url(../imatges/fons_menu_serveis_crae.jpg) no-repeat left;


}

*/


/* capçaleres */

#top.fonscrae {
background-image:url(../imatges/fons_capsalera_crae.jpg);
}

#top.fonscraei {
background-image:url(../imatges/fons_capsalera_craei.jpg);
}

#top.fonscacollida {
background-image: url(../imatges/fons_capsalera_centre_acollida.jpg);
}

#top.fonspisassistit {
background-image: url(../imatges/fons_capsalera_pisos_assistits.jpg);
}

#top.fonscentreobert {
background-image: url(../imatges/fons_capsalera_centre_obert.jpg);
}

#top.fonsautonomia {
background-image: url(../imatges/fons_capsalera_promo_autonomia.jpg);
}

#top.fonsevami {
background-image: url(../imatges/fons_capsalera_evami.jpg);
}



/* links relacionals sota els continguts */

.navegacio_peu { clear: left; border-top: 1px solid rgb(204, 204, 204); padding: 0.5em 0pt 1em; display: block; margin-top: 2em; }
.navegacio_peu { font-size: 0.75em; color: rgb(102, 102, 102); }
.navegacio_peu a { text-decoration: none; color: rgb(144, 95, 92); }
.navegacio_peu a:link, .navegacio_peu a:visited { border-bottom: 1px solid rgb(204, 204, 204); color: rgb(144, 95, 92); }
.navegacio_peu a:hover { border-bottom: 1px solid rgb(204, 204, 204); color: rgb(11, 12, 7); background-color: rgb(246, 246, 246); }
.navegacio_peu { border-top: 1px solid rgb(204, 204, 204); padding: 0; display: block; margin-top: 2em; }



div.esquerra45, div.dreta45, .peuesq45, .peudretq45 {
	width: 45%;
	margin: 1em 0;
	background-color: #F6C490;
	padding: 0.5em;
	}

.peuesq45, .peudretq45 {
background-color:white; padding: 0;
}
.peuesq45 p, .peudretq45 p {
margin: 0; padding: 0;
}

div.esquerra45, .peuesq45 {
	float: left;
	clear: left;
}

div.dreta45 {
  float: right;
}

.peudretq45 { margin-left: 45%; text-align:right;}


div.esquerra45 h3, div.dreta45 h3 {
font-size:1.1em;
margin: 0 .5em .5em .5em;
padding: 0;
letter-spacing:0;
}

div.esquerra45 a, div.dreta45 a {
border-bottom: none;
}





/* galeria /*

------------------------------ */

#galeria {
margin: 2em 0
}

.miniatures a, .miniatures a:hover {
	display: block;
	padding: 4px;
	margin: 0px 3px 3px 0px;
	line-height: 0px;
    border: 1px solid #e6e6e6;
    background-color: #f6f6f6;
}

.miniatures a:visited {
    background-color: #fcfcfc;
    border: 1px solid #f8f8f8;
}

.miniatures a:hover {
	background-color: #f3f3f3;
	border: 1px solid #EC8921;
}

.miniatures {
	float: left;
}


.imatge { 
	margin: 0;
	padding: 0;
	border: 0;
}

#image {

	text-align: center;

	line-height: 0;

}


.notes {
border: 1px solid #e9e9e9; background-color: #f3f3f3; padding: 1em; margin: 2em 0 1em 0; color: #666; font-size:75%; line-height:130%
}



/*formulari extret de: http://www.websemantics.co.uk/tutorials/accessible_forms */

form {}
input, textarea { color: #000; background: #fff; border: 1px solid #ccc;  width:250px}


#formcontacte                {margin:1em 0 2em 0; text-align:right; padding:0;}
#formcontacte *              {font:inherit}
#formcontacte div            {margin:0.5em 0}
#formcontacte fieldset       {background-color:#f6f6f6; padding:0.5em ; margin:0; color:#333; border:none}
#formcontacte legend         {font-weight:bold; padding:0 1em 0 0.5em}
#formcontacte p              {margin-bottom:0.8em}
#formcontacte label          {font-weight:bold}
#formcontacte input.text     {background:#FFF0D0; border:2px inset #ccc; width:200px; background:#dde; padding:2px 3px 2px 5px; vertical-align:middle}
#formcontacte input.radio    {border:2px solid #fff; vertical-align:middle}
#formcontacte textarea       {margin-left:0.5em; font-size:100%; vertical-align: text-top}
#formcontacte input.button   {
	border:1px solid #666;
	color:#FFFFFF;
	font-weight:bold;
	vertical-align:bottom;
	height:2em;
	width:100px;
	margin-right:158px;
	background-color: #EC8921;
}

.error { color: red; font-weight:bold;}
.ok { font-weight:bold; color: black; background-color:#F6C490; padding: 1em;  text-align:center  }

.requadrerrhh {background-color:#f6f6f6; padding:0.5em ; color:#333; border:none}
