@charset "utf-8";
/* CSS Document */

@font-face {
	font-family: 'moderna';
	src: url('../fonts/MODERNA_.TTF') format('truetype');
}

img, object,embed,video{
max-width:100%;
width:auto;
max-height:100%;
height:auto;
}
html, body{
	width:100%;
	height:100%;
}
* {
    margin: 0;
    padding: 0;
}
.container_imatge{
	float: left;
	margin: 0;
	height:auto;
	width: 100%;
	z-index: 3;
	display:block;

}
#container_imatge_mobil{
	float:left;
	margin: 0;
	max-width:100%;
	height:auto;
	width:auto\9;
	z-index:3;
	display:none;
}
.cos_central{
	float:left;
	width:80%;
	height:auto;
	z-index:5;
	margin:2% 10%;
}
.serveis_menu{
	float: left;
	width: auto;
	height: auto;
	margin: 2% 1.5%;
	padding:.1em 1%;
	border-right-color: rgb(153,153,153);
	border-right-style: solid;
	border-right-width: 1px;
}
.serveis{
	
	float:left;
	width:23%;
	height:auto;
	margin: 2% 1%;
	z-index:1;
	
}
.serveis:hover {
	 box-shadow: 0 0 .5em #CCC;
	 opacity:.8;
}


.imatge_feina{
	float:left;
	width:95%;
	height:auto;
	margin:3% 2.5%;
	z-index:5;

}

.text_serveis{
	float:left;
	width:90%;
	height:auto;
	margin:3% 2.5%;
	text-align:center;
	z-index:5;

}

	



/* -------------------------------- MEDIA-QUERY  ----------------------*/

/* PER A 1280px O MENYS */
@media screen and (max-width: 1280px) {
* {
    margin: 0;
    padding: 0;
}

.cos_central{
	margin:0;
	width:100%;
}	
}
	



/* PER A 1024px O MENYS */
@media screen and (max-width: 1024px) {
	
.cos_central{
	margin:0;
	width:100%;
}

}

/* PER A 768px O MENYS */
@media screen and (max-width: 768px) {
	
#container_imatge_mobil{
	display:block;
}
#container_imatge{
	display:none;
}
.cos_central{
	margin:0;
	width:100%;
}
.serveis{
	width:95%;
	border-bottom-color:rgb(204,204,204);
	border-bottom-width: 1px;
	border-bottom-style:solid;
	margin: 2% 2.5%;
}

.text_imatge{
	float:left;
	width:80%;
	height:auto;
	margin:2% 10%;
}
}

/* PER A 480px O MENYS */
@media screen and (max-width: 480px) {
	
#container_imatge_mobil{
	display:block;
}
#container_imatge{
	display:none;
}

}