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

img, object,embed,video{
max-width:100%;
width:auto;
max-height:100%;
height:auto;
}

* {
    margin: 0;
    padding: 0;
}

#cercle{
	position: absolute;
	width:100px;
	height:100px;
	border-radius:50px;
	left:50%;
	margin-left:-50px;
	z-index:2;
	background:rgb(255,255,255);
}
	

#container_peu{
	float:left;
	width:100%;
	height:auto;
	margin: 0;
	padding:2%;
	z-index:1;
	background:rgb(91,91,91);
}
.interior_peu{
	float:left;
	width:28%;
	height:auto;
	margin:50px 2% 2% 2%;

}
.img_interior{
	float:left;
	position:relative;
	left:50%;
	margin-left:-50px;
	width:100px;
	height:100px;
}
.text_interior{
	float:left;
	width:90%;
	height:auto;
	margin:5%;
	text-align:center;

}
.img_xarxa{
	float:left;
	width:60px;
	height:60px;
	margin:1%;

}

#text_planolscad{
	float:left;
	width:100%;
	height:auto;
	padding:1% 0%;
	margin: 0;
	background:rgb(153,153,153);
}	


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


/* PER A 3000px O MENYS */
@media screen and (max-width: 3000px) {

.interior_peu{
	float:left;
	margin:50px 2% 2% 2%;
	width:28%;
	height:auto;


}

}
/* PER A 1280px O MENYS */
@media screen and (max-width: 1280px) {
* {
    margin: 0;
    padding: 0;
}	
.interior_peu{
	float:left;
	margin:50px 2% 2% 2%;
	width:28%;
	height:auto;
	

}

}
/* PER A 768px O MENYS */
@media screen and (max-width: 768px) {
* {
    margin: 0;
    padding: 0;
}
.interior_peu{
	margin:50px 0 0 0;
	width:96%;
	height:auto;

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

.interior_peu{
	margin:50px 0 0 0;
	width:96%;
	height:auto;

}

}