/*RESSET*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

@font-face {
    font-family: FuturaLT;
    src: url(FuturaLT/FuturaLT.ttf);
    font-weight:40;
}
@font-face {
    font-family: FuturaLT-Bold;
    src: url(FuturaLT/FuturaLT-Bold.ttf);
    font-weight:40;
}
@font-face {
    font-family: FuturaLT-ExtraBold;
    src: url(FuturaLT/FuturaLT-ExtraBold.ttf);
    font-weight:40;
}
@font-face {
    font-family: FuturaLT-Light;
    src: url(FuturaLT/FuturaLT-Light.ttf);
    font-weight:40;
}


body {
	margin: 0px;
	padding: 0px;
	background-color:#fff;
	font-family: Futura, Arial, Helvetica, sans-serif;
	font-size: 14px;
	min-width: 960px;

}

h1 {font-size: 1.3em;}

h2 {font-size: 1.8em;}

h3 {font-size: 1.2em;}

h4 {font-size: 1em;}

p, ul, ol {margin-top: 0;line-height: 180%;font-family:Futura, Arial, Helvetica, sans-serif;}

ul, ol {margin:0;padding:0;}

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

a:hover { text-decoration:underline}

img {border:none;}

.clear {
	clear: both;
}

.light {
	font-family:FuturaLT-Light, Arial, Helvetica, sans-serif;
}
.extraB {
	font-family:FuturaLT-ExtraBold, Arial, Helvetica, sans-serif;
}

/* Header */
#header {
	margin: 0 auto;
	padding: 0;
	background: url(../img/header.png) repeat-X;
}

#headerCont {
	width: 960px;
	height:120px;
	margin: 0 auto;
}

#ico{
	width:220px;
	height:140px;
	position:absolute;
	background:url(../img/index-03.png) no-repeat center #FEAE17;
	-moz-box-shadow:3px 3px 20px #000;
	-webkit-box-shadow:3px 3px 20px #000;
	box-shadow:3px 3px 20px #000;
}


.menuIdiom {
	padding-top:10px;
	position:absolute;
	right:20px;
	width:171px
}
.menuIdiom li {float:right;}
.menuIdiom a {background:url(../img/menu_idiomes.png);display:block;height:35px;}

.mapaweb a {color:#666; background:none; padding-right:15px; padding-top:10px}

.catala a { width:50px; background-position:2px 0px; text-indent:-9000px }
.castella a { width:50px; background-position:-50px 0px; text-indent:-9000px}
.angles a { width:50px; background-position:-100px 0px; text-indent:-9000px}

.catala a:hover {background-position:2px -38px; text-indent:-9000px}
.castella a:hover{background-position:-50px -38px; text-indent:-9000px}
.angles a:hover {background-position:-100px -38px; text-indent:-9000px}


/* MENU */
#pagemenu{
	padding:50px 0px 0px 0px;
	height:50px;
}
.menuca li,.menues li  {float:right;}
.menuca a {display:block; height:50px;background:url(../img/index_ca-04.png) no-repeat;  text-indent:-9000px }
.menues a {display:block; height:50px;background:url(../img/index_es-04.png) no-repeat;  text-indent:-9000px }

.inici a { width:98px; background-position:0px 4px;}
.quisom a { width:98px; background-position:-102px 4px;}
.onsom a { width:98px; background-position:-205px 4px;}
.caracteristiques a { width:190px; background-position:-308px 4px;}
.les_cases a { width:110px; background-position:-500px 4px;}

.inici a:hover , .inici a.active { width:98px; background-position:0px -40px;}
.quisom a:hover, .quisom a.active { width:98px; background-position:-102px -40px;}
.onsom a:hover, .onsom a.active { width:98px; background-position:-205px -40px;}
.caracteristiques a:hover, .caracteristiques a.active { width:190px; background-position:-308px -40px;}
.les_cases a:hover, .les_cases a.active { width:110px; background-position:-500px -40px;}




/*page*/
#page {
	margin: 0 auto;
	background:url(../img/bgpage.png) bottom repeat-x #e8e8e8;
}

#pageINICI {margin: 0 auto;background:url(../img/bgpage.png) bottom repeat-x #e8e8e8; height:500px;}

#pageCont {
	width:960px;
	margin: 0 auto;
	z-index:2;
	padding:30px 0px 150px 0px;
	
	height: auto!important; /* para los browsers buenos */
    height: 400px; /* para IE5+ */
    min-height: 400px; /* para los browsers buenos */
}

/*////////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////  QUI SOM  ////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////*/

#quisom{
	float:left;
	width:400px;
	margin:40px 20px 20px 40px;	
}

#arquitecte{
	float:right;
	width:400px;
	margin:40px 20px 20px 40px;
	}
	
#industrials {
	float:left;
	width:900px;
	margin:40px 20px 20px 40px;	
}

.industrial {
	width:270px;
	margin:40px 30px 0px 0px;
	min-height:150px;
	float:left
}
	

#quisom h1, #arquitecte h1, #industrials h1{
	font-family:FuturaLT-ExtraBold, Arial, Helvetica, sans-serif;
	margin-bottom:20px;
	height:20px;
	border-bottom:1px solid #333;
	text-shadow: 1px 1px 0px #FFF;
	filter: dropshadow(color=#FFF, offx=1, offy=1); 
}
#quisom h1, #arquitecte h1{
	text-align:right;
	width:400px;
}

#industrials h1{
	width:900px;
}
/*.industrial{
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; 
background-color: rgba(255, 255, 255, 20);
-webkit-box-shadow: 2px 2px 10px #666666;
-moz-box-shadow: 2px 2px 10px #666666;
box-shadow: 2px 2px 10px #666666; 
}*/

.industrial h2 {
	font-size:14px;
	font-weight:bold;
	padding-bottom:5px;
}

#quisom p, #arquitecte p, .industrial p{
	font-family: FuturaLT, Arial, Helvetica, sans-serif;
	text-align:justify;
}

/*////////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////  ON SOM  ////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////*/

#onsom, #onsomG{
	float:left;
	width:900px;
	margin:40px 20px 20px 40px;	
} 
#onsom h1, #onsomG h1{
	font-family:FuturaLT-ExtraBold, Arial, Helvetica, sans-serif;
	margin-bottom:20px;
	height:20px;
	border-bottom:1px solid #333;
	text-shadow: 1px 1px 0px #FFF;
	filter: dropshadow(color=#FFF, offx=1, offy=1); 
}
#onsom h1{
	text-align:right;
}
	
#onsomG h1{
	text-align:left;
}

/*////////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////  CARACTERÍSTIQUES  //////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////*/

#caracteristiques{
	margin: 0 auto;
	background:#212121;
}

#caracteristiquesCont{
	width:960px;
	margin: 0 auto;
	height:45px;
}

.menuCaracteristiques {padding-left:220px;}
.menuCaracteristiques li {float:left;}
.menuCaracteristiques a {background:url(../img/caracteristiques-02.png) no-repeat #212121;display:block; height:34px;}

.estiu a, .hivern a, .eficiencia a, .sostenible a {color:#CCC; padding:9px 2px 2px 32px;}

.estiu a { width:100px; background-position:-5px 0px;}
.hivern a { width:120px; background-position:-160px 0px;}
.eficiencia a { width:197px; background-position:-310px 0px;}
.sostenible a { width:165px; background-position:-535px 0px;}

/*.estiu a:hover , .estiu a.active, .hivern a:hover, .hivern a.active, .eficiencia a:hover, .eficiencia a.active, .sostenible a:hover, .sostenible a.active {
	background:;
}*/
.estiu a:hover { width:100px;background:url(../img/caracteristiques-02.png) no-repeat #e8e8e8; background-position:-5px -55px;}
.hivern a:hover { width:120px;background:url(../img/caracteristiques-02.png) no-repeat #e8e8e8; background-position:-160px -55px;}
.eficiencia a:hover { width:197px;background:url(../img/caracteristiques-02.png) no-repeat #e8e8e8; background-position:-310px -55px;}
.sostenible a:hover{ width:165px;background:url(../img/caracteristiques-02.png) no-repeat #e8e8e8; background-position:-535px -55px;}



.estiu a:hover, .hivern a:hover, .eficiencia a:hover, .sostenible a:hover {color:#333; text-decoration:none}

#estiubox, #hivernbox, #eficienciabox, #sosteniblebox{
	padding:30px 0px 150px 0px;
}

.bgestiu{background:url(../img/caracteristiques-07.png) no-repeat bottom;height:400px}
.bghivern{background:url(../img/caracteristiques-08.png) no-repeat bottom;height:400px}
.bgeficiencia{background:url(../img/caracteristiques-09.png) no-repeat bottom;height:400px}
.bgsostenible{background:url(../img/caracteristiques-10.png) no-repeat bottom;height:400px}

.caract{
	float:left;
	width:280px;
	padding: 20px 35px 0px 0px;
}
.caract ul{
	list-style:square;
	padding-left:20px
}


#estiubox h2, #hivernbox h2, #eficienciabox h2, #sosteniblebox h2{
	font-family:FuturaLT-Bold, Arial, Helvetica, sans-serif;
	font-size:16px;
	margin:30px 0px;
	height:20px;
	border-bottom:1px solid #333;
	text-shadow: 1px 1px 0px #FFF;
	filter: dropshadow(color=#FFF, offx=1, offy=1); 	
}

#estiubox img, #hivernbox img, #eficienciabox img, #sosteniblebox img{
	margin:0px 20px 20px 15px;
	width:250px;
	-moz-box-shadow:3px 3px 20px #666;
	-webkit-box-shadow:3px 3px 20px #666;
	box-shadow:3px 3px 20px #666;
}

#estiubox p, #hivernbox p, #eficienciabox p, #sosteniblebox p{
	text-align:justify;
}

.bggris{
	padding:20px;
	background:#dedede;
	margin-top:40px;
}



#imgtitol{
	margin-right:50px;
	margin-left:20px;
	height:100px;
	width:100px;
	float:right;
}

.imgestiu{background:url(../img/caracteristiques-03.png) no-repeat;}
.imghivern{background:url(../img/caracteristiques-04.png) no-repeat;}
.imgeficiencia{background:url(../img/caracteristiques-05.png) no-repeat;}
.imgsostenible{background:url(../img/caracteristiques-06.png) no-repeat;}

/*////////////////////////////////////////////////////////////////////////////////////////////////////
///////////////////////////////////////  LES CASES  ////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////*/

#cases{
	float:left;
	width:280px;
	padding: 20px 35px 0px 0px;
}

#cases img{
	width:260px;
	-moz-box-shadow:3px 3px 20px #666;
	-webkit-box-shadow:3px 3px 20px #666;
	box-shadow:3px 3px 20px #666;
	border:10px solid #FFF;
	margin:20px 0px;
}
#cases h1{
	font-family:FuturaLT-ExtraBold, Arial, Helvetica, sans-serif;
	margin-bottom:20px;
	height:20px;
	border-bottom:1px solid #333;
	text-shadow: 1px 1px 0px #FFF;
	filter: dropshadow(color=#FFF, offx=1, offy=1); 
}
#cases p{
	text-align:center;
	font-weight:normal;
}

.boto{
	width:200px;	
	padding:30px 45px;
}

.boto a{
	width:180px;
}

.download1 a, .download2 a, .download3 a{
	padding:5px 0px 0px 35px; 
	width:250px; 
	height:30px; 
	display:block;
	color:#222;}

.download1 a{background:url(../img/download_1.png) no-repeat;}
.download2 a{background:url(../img/download_2.png) no-repeat;}
.download3 a{background:url(../img/download_3.png) no-repeat;}

.download1 a:hover, .download2 a:hover, .download3 a:hover{
	text-decoration:underline;
}
	



/*////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////  ESTAT DE LES OBRES /////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////*/

.capcelera h1{
	font-family:FuturaLT-ExtraBold , Arial, Helvetica, sans-serif;
	font-size:24px;
	padding:40px;
	text-shadow: 1px 1px 0px #FFF;
	filter: dropshadow(color=#FFF, offx=1, offy=1); 
	width:900px;
	text-align:right;
}

.data{
	float:left;
	width:90px;
	height:90px;
	margin:10px;
	padding:30px 5px 0px 5px;
	background:url(../img/obres-02.png) no-repeat center;
		text-align:center;

}
span.dia {
	font:FuturaLT, Arial, Helvetica, sans-serif;
	font-size:40px;
	line-height:0.5;
	color:#FFF;
}
.mes {
	font:FuturaLT, Arial, Helvetica, sans-serif;
	font-size:20px;
	color:#FFF;
}
.titol {
	width:820px;
	float:left;
	font-size:25px;
	color:#333;
	padding:25px 10px 10px 0px;
	font-family:FuturaLT-ExtraBold, Arial, Helvetica, sans-serif;
	border-bottom:1px solid #333;
	text-shadow: 1px 1px 0px #FFF;
	filter: dropshadow(color=#FFF, offx=1, offy=1); 
}
.entrada{
	width:820px;
	float:left;
	padding:25px 10px 10px 10px;
	font:FuturaLT, Arial, Helvetica, sans-serif;

}

.entrada img{
	width:250px;
	margin:5px;
	-moz-box-shadow:3px 3px 20px #666;
	-webkit-box-shadow:3px 3px 20px #666;
	box-shadow:3px 3px 20px #666;
	border:5px solid #FFF;
}

.entrada p{
	padding:0px 30px;
	background:url(../img/obres-03.png) no-repeat;
}

.hidden{display:none;}


/*////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////  MAPA WEb /////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////*/

h2.mapa{
	padding-left:350px;
}
ul.mapa{
	padding-bottom:100px;

}
.mapa li{
	line-height:35px;
	padding-left:350px;
}

ul.mapa ul {
	padding-left:25px;
}