* {margin:0; padding:0; outline:none;} /* borde "none" amaga els bordes dels formularis*/

/*html, body { margin:0; padding:0; height: 100%;}*/

body {
	text-align: center;
	/*background-color: #FFF;*/
	outline: 0; /*evita que es posi la linie vermella a FF i d'altres*/
	overflow-y: scroll; /* sempre apareix l'espai en blanc del scroll vertical: aixì no es mou la pàgina. NO funciona amb IE*/
    overflow-x: hidden; /* no hi ha espai en blanc per el scroll*/
	min-width: 100%;
	/* [disabled]height:100%; */
}
img {
	margin: 0;
	padding: 0;
	outline: 0; /*evita que es posi la linie vermella a FF i d'altres*/
	border: hidden; /*elimina el borde negre a les imatges IE*/
	max-width: 100%; 
	height: auto;
}
a {
	text-decoration: none;
	cursor: pointer;
	outline: 0; /*evita que es posi la linie vermella a FF i d'altres*/
}
a:hover {
	text-decoration: none;
}

#container {
		position:absolute;
		top:15%;
		margin-top:-90px;
		width:100%;
		height:auto;
		overflow:hidden;
		text-align:center;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
        box-sizing: border-box;
}

div#page {
	max-width: 1150px;
	background-color: #FFF;
	margin: 0 auto;
	text-align: center;
}

#nom {
	display:block; 
	left:0; 
	margin-left:0; 
	position:relative !important; 
	padding-left:10px;
	padding-top:20px;
	margin-bottom:0; /* mirar class="content_slideshow" */
	max-width:1100px;
	/*height:45px;*/
	text-align: left !important;
	background-color: transparent; /* el nom enganxat al slide-show */
	z-index:999;
}

h1 {
	margin-left:0;
	font-family: 'Ubuntu', sans-serif !important; /*300, 400 */
	font-size:36px;
	font-weight:400; /* 300,400 */
	font-variant: small-caps !important;
	letter-spacing:2px;
	color:rgba(189, 60, 41, 1.0) !important;
}
h1 a { color:rgba(189, 60, 41, 1.0); }
h1 a:hover { color:#000; }

#container-general {
	/* [disabled]float:left; */
	max-width: 100%;
	width: 100%;
	margin-top:0px;
	margin-bottom:0px;
	position: relative;
	background-color: #FFF;
	color: #444;
	text-align:center;
	height: auto;
}

#footer {
	text-align:left;
	max-width: 1150px;
	float:left;
	margin-left:10px;
	margin-top:15px;
	z-index:99;
}
.web_design {
	position:absolute;
	font-family:Verdana, Geneva, sans-serif;
	font-size: 11px;
	color:#888;
	margin-top:-15px;
}

.copyright {
	position:absolute;
	font-family:Verdana, Geneva, sans-serif;
	font-size: 11px;
	color:#888;
	margin-top:-15px;
	float:right;
	right:0;
	padding-right:10px;
}

#footer_socials {
	position: fixed;
	bottom:0;
	text-align:center;
	width: 100%;
	height:60px;
	background-color:#BBB;
	margin-left:0;
	margin-top:0;
	z-index:999;
}
.instagram a { position:relative; font-family:'Ubuntu', sans-serif; font-size: 16px; font-weight:400; color:#000; display:inline-block; margin-top:22px;}
.instagram a:hover { color:#cc3c04;}

.facebook a { position:relative; font-family:'Ubuntu', sans-serif; font-size: 16px; font-weight:400; color:#000; display:inline-block;}
.facebook a:hover { color:#E00;}

.separador { font-family:Verdana, sans-serif; font-size: 22px; margin-right:60px; margin-left:60px;}

.negreta{font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;font-size:19px;font-weight:bold;}
.bold{font-weight:bold;}

/* MEDIA QUERIES:
https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
*/

@media screen and (min-width: 820px and max-width: 1100px) {	
#container { top:15%; }
#nom { padding-left:10px; margin-bottom:8px; }
}

@media screen and (max-width: 768px) { 
#container { top:17%; }
#nom { padding-left:10px; margin-bottom:8px; }
h1 { font-size:36px; letter-spacing:2px; }
img { max-width: 100%; height: auto; }
}

@media screen and (max-width: 468px) {  /* IPHONE 6-7-8 */
#container { top:20%;}
#nom { padding-left:10px; margin-bottom:7px;}
h1 { font-size:32px; letter-spacing:1px; }
#footer_socials { height:50px;}
.instagram a { font-size: 14px; display:inline-block; margin-top:18px;}
.facebook a { font-size: 14px; display:inline-block; margin-top:18px;}
.separador { font-size: 20px; margin-right:40px; margin-left:40px;}
}

/*----------------------------------------*/
/* HACK PER FIREFOX ----------------------*/

@-moz-document url-prefix() {
#nom {
	display:block; 
	left:0; 
	margin-left:0; 
	position:relative !important; 
	padding-left:10px;
	padding-top:20px;
	margin-bottom:0; /* mirar class="content_slideshow" */
	max-width:1100px;
	/*height:45px;*/
	text-align: left !important;
	background-color: transparent; /* el nom enganxat al slide-show */
	z-index:999;
}
h1 {
	margin-left:0;
	/*font-family: 'Ubuntu', sans-serif;*/
	font-family: 'Ubuntu', sans-serif !important; /*300, 400 */
	font-size:33px;
	font-weight:300; /* 300,400,500 */
	font-variant: small-caps !important;
	letter-spacing:1px;
	color:#777 !important;
}

@media screen and (max-width: 768px) { 
#nom { padding-left:10px; margin-bottom:6px;}
h1 {font-size:30px; letter-spacing:2px;}
}

@media screen and (max-width: 468px) {
#nom { padding-left:10px; margin-bottom:3px;}
h1 {font-size:28px; letter-spacing:1px;}
}
}

/* https://css-tricks.com/snippets/css/media-queries-for-standard-devices/  */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 

}