body {
   margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #ffd;
}
img {padding: 0;margin: 0;border: none;}
form {padding: 0;margin: 0;}
.form select, .form input, .form textarea {vertical-align:middle;}
#main {margin: 0 auto;width: 972px;}
#header {
	position: relative;
	width: 972px;
	height: 178px;
	background: url(../img/header-bg.gif) no-repeat;
}
#header .logo {
	position: absolute;
	top: 0;
	left: 0;
	background: url(../img/logo-bg.gif) no-repeat;
	width: 158px;
	height: 178px;
	text-indent: -9999px;
	overflow: hidden;
}
#header .header-text {
	position: absolute;
	top: 50px;
	left: 172px;
	background: url(../img/header-text.gif) no-repeat;
	width: 469px;
	height: 45px;
	text-indent: -9999px;
	overflow: hidden;
}
#header .form {
	position: absolute;
	width: 170px;
	left: 802px;
	top: 10px;
}
#header .form .row {float: left;padding: 0 0 6px 0;}
#header .form p {
	font: 11px Arial, Helvetica, sans-serif;
	color: #256744;
}
#header .form label {
	float: left;
	width: 59px;
	text-align: right;
	font: 11px Arial, Helvetica, sans-serif;
	color: #256744;
	padding: 3px 6px 0 0;
}
#header .form .text {
	float: left;
	width: 100px;
	border: 1px solid #f1a11f;
	font: 11px Arial, Helvetica, sans-serif;
	color: #256744;
	padding: 1px 0 0 3px;
}
#header .form .btn {float: left;padding: 0 0 0 90px;margin: 1px 0 0;}
#header #top-nav {
	position: absolute;
	top: 116px;
	left: 157px;
	list-style: none;
	padding: 0;
	margin: 0;
	font: bold 12px Arial, Helvetica, sans-serif;
}
#header #top-nav li {float: left;border-left: 1px solid #fff;padding: 3px 24px;}
#header #top-nav li:first-child {border: 0;}
#header #top-nav li a {color: #256744;text-decoration: none;}
#header #top-nav li a:hover, #header #top-nav .active a {color: #f00;}
#header .header-text2 {
	position: absolute;
	top: 116px;
	right: 18px;
	font: 20px/20px Arial, Helvetica, sans-serif;
	color: #000;
	font-size: 18px;
}
#header .form2 {
	position: absolute;
	width: 173px;
	right: 6px;
	top: 154px;
}
#header .form2 .text {
	float: left;
	width: 113px;
	padding: 1px 0 0 3px;
	font: 11px Arial, Helvetica, sans-serif;
	border: 1px solid #f1a01d;
}
#header .form2 .btn {float: left;padding: 0 0 0 4px;}
#content {
	float: left;
	width: 972px;
	padding: 14px 0 0;
}
#column {float: left;width: 158px;}
#column #left-nav {
	float: left;
	list-style: none;
	padding: 0;
	margin: 0;
	width: 158px;
	font: bold 11px Arial, Helvetica, sans-serif;
}
#column #left-nav li {float: left;padding: 0 0 8px 0;}
#column #left-nav a {
	float: left;
	width: 142px;
	height: 21px;
	background: url(../img/left-nav-bg.gif) no-repeat;
	color: #256744;
	text-decoration: none;
	padding: 5px 6px 0 10px;
}
#column #left-nav a:hover, #column #left-nav .active a {background: url(../img/left-nav-bg.gif) no-repeat 0 100%;}
#column .link {float: left;margin: 0 0 20px 0;}
#column .link img {float: left;}
#column2 {float: left;width: 395px;padding: 0 0 10px 23px;}
#column2 h1 {
	margin: 0;
	height: 26px;
	padding: 6px 17px 0 0;
	text-align: right;
	background: url(../img/title-1.gif) no-repeat;
	font: bold 17px Arial, Helvetica, sans-serif;
	color: #256744;
}
#column2 h3 {
	margin: 3px 0 5px 0;
	font: bold 16px/21px Arial, Helvetica, sans-serif;
	color: #256744;
}
#column2 p {
	margin: 7px 0 0;
	font: 11px/16px Arial, Helvetica, sans-serif;
	color: #000;
}
#column2 p a {color: #000;text-decoration: none;}
#column2 p a:hover {text-decoration:underline;}
#column2 .second {font: 12px/15px Arial, Helvetica, sans-serif;}
#column2 .images {float: left;margin: 7px 0 0;width: 90px;}
#column2 .images img {float: left;padding: 0 0 10px 0;}
.link {color: #39c !important;font-weight: bold;font: bold 12px Arial, Helvetica, sans-serif !important;}
#column2 h2 {
	clear: both;
	margin: 0;
	width: 378px;
	height: 27px;
	color: #256744;
	text-align: right;
	padding: 6px 17px 0 0;
	text-align: right;
	font: bold 17px Arial, Helvetica, sans-serif;
	background: url(../img/title-2.gif) no-repeat;
}
#column2 ul {
	float: left;
	list-style: none;
	padding: 10px 18px 0 0;
	margin: 0;
	font: bold 13px Arial, Helvetica, sans-serif;
	letter-spacing: -0.05em;
	color: #999;
}
#column2 ul li {background: url(../img/column-sep.gif) no-repeat 0 5px;padding: 0 0 6px 11px;}
#column2 ul li a {color: #999;text-decoration: none;}
#column2 ul li a:hover {text-decoration: underline;}
#column3 {padding: 0 0 0 24px; border:#66FF66 1px solid;}
#column3 h2, #column3 h3 {
	clear: both;
	margin: 0;
	background: url(../img/title-3.gif) no-repeat;
	font: bold 17px Arial, Helvetica, sans-serif;
	color: #256744;
	text-align: right;
	height: 26px;
	padding: 6px 15px 0 0;
}
#column3 h3 {background: url(../img/title-4.gif) no-repeat;padding: 6px 15px 5px 0;}
#column3 p {margin: 5px 0 14px 0; font: 12px Arial, Helvetica, sans-serif;color: #000;}
#column3 p a {text-decoration:none;color: #000;}
#column3 p a:hover {text-decoration: underline;}
#column3 .line {float: left;width: 368px;padding: 12px 0 0 4px;}
#column3 .last {padding-bottom: 33px;}
#column3 .line .text {float: left;width: 189px;margin: -17px 0 0 0;}
#column3 .line .text span {font: 9px Arial, Helvetica, sans-serif;color: #000;}
#column3 .line .text h4 {margin: 0 0 18px 0;font: bold 13px Arial, Helvetica, sans-serif;color: #256744;}
#column3 .line img {float: right;}
#column3 .text {width: 359px;float: left;padding: 13px 0 0 12px;}
#column3 .text p {clear: both;margin: 0;}
#column3 .text ul {
	float: left;
	list-style: none;
	padding: 6px 65px 5px 0;
	margin: 0;
	font: 12px/14px Arial, Helvetica, sans-serif;
	color: #999;
}
#column3 .text ul li a {color: #999;text-decoration: none;}
#column3 .text ul li a:hover {text-decoration: underline;}
#column3 .text h4 {margin: 0;font: 12px Arial, Helvetica, sans-serif;color: #256744;}

#column4 {float: left;width: 767px;padding: 0 0 10px 23px;}
#column4 h1 {
	margin: 0;
	height: 26px;
	padding: 6px 17px 0 0;
	text-align: right;
	background: url(../img/title-big.gif) no-repeat;
	font: bold 17px Arial, Helvetica, sans-serif;
	color: #256744;
}
#column4 h3 {
	margin: 3px 0 5px 0;
	font: bold 16px/21px Arial, Helvetica, sans-serif;
	color: #256744;
}
#column4 p {
	margin: 7px 0 0;
	font: 11px/16px Arial, Helvetica, sans-serif;
	color: #000;
}
#column4 p a {color: #000;text-decoration: none;}
#column4 p a:hover {text-decoration:underline;}
#column4 .second {font: 12px/15px Arial, Helvetica, sans-serif;}
#column4 .images {float: left;margin: 7px 0 0;width: 90px;}
#column4 .images img {float: left;padding: 0 0 10px 0;}
.link {color: #39c !important;font-weight: bold;font: bold 12px Arial, Helvetica, sans-serif !important;}
#column4 h2 {
	clear: both;
	margin: 0;
	width: 767px;
	height: 27px;
	color: #256744;
	text-align: right;
	padding: 6px 17px 0 0;
	text-align: right;
	font: bold 17px Arial, Helvetica, sans-serif;
	background: url(../img/title-2.gif) no-repeat;
}
#column4 ul {
	float: left;
	list-style: none;
	padding: 10px 18px 0 0;
	margin: 0;
	font: bold 13px Arial, Helvetica, sans-serif;
	letter-spacing: -0.05em;
	color: #999;
}
#column4 ul li {background: url(../img/column-sep.gif) no-repeat 0 5px;padding: 0 0 6px 11px;}
#column4 ul li a {color: #999;text-decoration: none;}
#column4 ul li a:hover {text-decoration: underline;}

/*HASTA AQUI LOS YANKIS **************************************************************************************************************************/


/*CONTENIDO*/
#contenido p, ul, ol, dl, dt, dd, li, blockquote, cite, h1, h2, h3, h4, h5, h6 { padding:0; margin:0; font-weight:normal; }
#contenido img{ border:0;}

#contenido { font-family: Arial, Helvetica, sans-serif; font-size:75%; color:#333333; }

.clear{ clear:both;}

#contenido { float: right;width: 767px;padding:0 10px;}
	#contenido h1 {  margin: 0;height: 26px;padding: 6px  0 0 17px;	text-align:left;	background: url(../img/title-big.gif) no-repeat;
					font: bold 17px Arial, Helvetica, sans-serif;color: #256744; margin-bottom:12px;}
					
	#contenido h2 {	color: #266745;	font: bold 17px Arial, Helvetica, sans-serif; padding:0.3em 0;}
	#contenido h3 { color: #266745;	font: bold 12px Arial, Helvetica, sans-serif; padding:0.3em 0; }
	 #contenido p {  padding:0.3em;}
	 
	  #contenido ul  { margin:0.5em 0 0 5px;}
	  #contenido li  { padding:0.3em; list-style-type:none;}
	  
	  		#contenido  a:link,
			#contenido  a:visited { font-weight:bold; color:#006600;}
			#contenido  a:hover   { text-decoration:none;}
	 
		/*ESTILOS GENERICOS*/
		.cincuenta { width:47%; float:left; padding:0.5em;}
		.imagenes img { float:right; background:#F7C97D; padding:0.5em; margin:0.5em;}
		
		
			/*CABECERA*/
			#div_pass_perdut { font-size:0.6em; clear:both;}
				#div_pass_perdut  a:link,
				#div_pass_perdut  a:visited { font-weight:bold; color:#006600;}
				#div_pass_perdut  a:hover   { text-decoration:none;}

		
			/*BANNERS HOME*/		
			#banners_esquerra     { margin:0; padding:0}
			#banners_esquerra img { margin:0; padding:0; }
			
			/*INICI*/
			#fotogran_home { width:55%; float:left; }
			
				#contenido div#fotogran_home img, #contenido div#imatges_home  img{ background:#F7C97D; padding:0.5em; margin:0.5em;}				
				#contenido div.line { padding:0.5em; border-bottom:#E4F48C 1px solid; margin-bottom:0.5em;}
				#contenido div.text  h4 { font-size:1.3em; font-weight:bold; color:#256744;}
				#contenido .line .text span {font: 9px Arial, Helvetica, sans-serif;color: #000;}
				#home_tres div.line img { float:right;}

				
			#imatges_home { width:43%; float:left; }
			#text_home { margin:0.5em; padding:0.5em;}
			
			#home_bajo { padding:1em; }
			
			#home_bajo h2 {clear: both;margin: 0;background: url(../img/title-22.gif) no-repeat;font: bold 17px Arial, Helvetica, sans-serif;color: #256744;
						text-align: right;height: 26px;padding: 6px 15px 0 0;}
			
				#home_dos {  width:48%; float: left;}
				#home_tres {  width:48%; float:right;}

			#home_alto { padding:1em; }
			
			#home_alto h2 {clear: both;margin: 0;background: url(../img/title-22.gif) no-repeat;font: bold 17px Arial, Helvetica, sans-serif;color: #256744;
						text-align: right;height: 26px;padding: 6px 15px 0 0;}
				#home_cero {  width:48%; float: left;}
				#home_uno {  width:48%; float:right;}

		
			/*ESCOLA*/
			#onsom { clear:both; padding:0.5em; }
			#mapa { border:#CCCCCC 1px solid; margin:0.5em 3em;}
			
			/*LISTADO DE NOTICIAS*/
			.listados_notis { border-bottom:#CCCCCC 1px solid; margin:0.5em;}
			.listados_notis img { float:right; padding:0 0 0.5em 0.5em;}
			.listados_notis p { padding:0.2em;}
			.titol_notis { font-size:1.4em; font-weight:bold;}
			
			
			/*AGENDA*/
			#ver_agenda { background:url(../img/fons-agenda.jpg)  no-repeat;  margin:0; font-size:0.8em; padding:0; padding-left:10px; border:#FFFFDD 1px solid;}
				#ver_agenda  a:link,
				#ver_agenda  a:visited { font-weight:bold; color:#006600;font-size:1em;}
				#ver_agenda  a:hover   { text-decoration:none;}

			
			/*ACTIVITATS*/
			#activitats { margin:0.5em; padding:0.5em;}
				.relacionats { background:url(../img/fons_activitat.jpg) no-repeat; margin:0.5em 1em; padding:0.5em 1em;}
			
					#activitats div.relacionats ul { margin-bottom:1em;}
					
				#fotos_notis img { background:#F7C97D; padding:0.5em; margin:0.5em;}
					#fotos_notis p { padding:0.5em;}
					
					
	
				
			
				#profes_listado h1 {  margin: 0;height: 26px ;padding: 6px  0 0 17px;	text-align:left;	
				background: url(http://www.santjosepgracia.org/img/title-big.gif) no-repeat;
					font: bold 17px Arial, Helvetica, sans-serif;color: #256744; margin-bottom:12px;}
					
					#profes_listado h2 {	color: #266745;	font: bold 17px Arial, Helvetica, sans-serif; padding:0.3em 0;}
					#profes_listado h3 { color: #266745;	font: bold 12px Arial, Helvetica, sans-serif; padding:0.3em 0; }
					 #profes_listado p {  padding:0.3em;}
					 
					  #profes_listado ul  { margin:0.5em 0.5em 1em 2em;}
					  #profes_listado li  { padding:0.3em; list-style-type:square; font: bold 12px Arial, Helvetica, sans-serif; padding:0.3em 0; }
					  
					  
							#profes_listado  a:link,
							#profes_listado  a:visited { font-weight:bold; color:#006600;font-size:1em;}
							#profes_listado  a:hover   { text-decoration:none;}
			
/*PEU**************************************************************************************************************************/
#footer {
	float: left;
	width: 972px;
	height: 40px;
	background: url(../img/footer-bg.gif) repeat-x;
}
#footer address {
	float: left;
	padding: 13px 0 0 26px;
	font: 12px Arial, Helvetica, sans-serif;
	color: #256744;
}



/*HACK PARA LAS CAJAS---------------http://www.positioniseverything.net/easyclearing.html--------------*/
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


.listados_notis:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.listados_notis {display: inline-block;}
/* Hides from IE-mac \*/
* html .listados_notis {height: 1%;}
.listados_notis {display: block;}
/* End hide from IE-mac */


.line:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.line {display: inline-block;}
/* Hides from IE-mac \*/
* html .line {height: 1%;}
.line {display: block;}
/* End hide from IE-mac */