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

* {box-sizing:border-box; text-align:center;}

body {margin:0; padding:0; top:0; right:0; bottom:0; left:0; font-family:'silkaregular'; line-height:17px; background: url("../Imaxes/backgrounds/grisclaro-milimetros-background.jpg") repeat; background-size:98px 98px;}
h1, h2, h3, h4, h5, h6, h7 {font-weight:normal;}
p {font-size:17px; line-height:21px;}

header {width:100%; height:50px; position:fixed; color:#ececec; padding-top:17px; font-family: 'silkalight_italic'; text-align:center; background:url("../Imaxes/backgrounds/gris-alert-background.jpg") repeat; background-size:645px 176px;}
section, article {width:100%;}

#principal {padding:150px 0 150px 0;}
	#hoja {width:100%; height:455px; text-align:center; margin:0 auto; padding-top:17px; color:#706f6f; background:url("../Imaxes/backgrounds/hoja-doblada-background.png") center center no-repeat; background-size:590px 455px;}
		#hoja p {margin:0 0 5px 0; font-size:16px; line-height:19px}
	#isotipo {}
		#isotipo img {height:112px; width:102px;}
	#logotipo {margin-top:74px; margin-bottom:19px;}
		#logotipo img {height:50px; width:240px;}

#secundario {padding:150px 0 250px 0; text-align:center; color:#ececec; background:url("../Imaxes/backgrounds/verde-geometrias-background.jpg"); background-size:450px 450px;}
	#secundario h2 {font-family:'silkalight_italic'; font-size:48px; line-height:48px; color:#ececec;}
	#secundario p {max-width:380px; margin:20px auto 20px auto;}
		#mbuttons {display:none;}
		#buttons {text-align:center; display:inline-block;}
			#contact, #contact:hover, #instagram, instagram:hover, #vimeo, #vimeo:hover {width:68px; height:77px; margin:20px 10px;}
			#contact {background:url(../imaxes/icons/contact-javier-pazos-btn.png) 0 0; float:left;}
				#contact:hover {background:url(../imaxes/icons/contact-javier-pazos-btn.png) 0 77px;}
			#instagram {background:url(../imaxes/icons/instagram-javier-pazos-btn.png) 0 0; float:left;}
				#instagram:hover {background:url(../imaxes/icons/instagram-javier-pazos-btn.png) 0 77px;}
			#vimeo {background:url(../imaxes/icons/vimeo-javier-pazos-btn.png) 0 0; float:left;}
				#vimeo:hover {background:url(../imaxes/icons/vimeo-javier-pazos-btn.png) 0 77px;}
		

footer {height:50px; width:100%; color:#ececec; padding-top:18px; position:fixed; bottom:0; text-align:center; font-size:12px; line-height:15px; background-color:#4a4a49;}

@media only screen and (min-width: 600px) and (max-height: 705px) {
	#principal {padding:110px 0 110px 0;}
	#secundario {padding:150px 0 190px 0;}
}
@media only screen and (min-width: 600px) and (max-height: 630px) {
	header {height:40px; padding-top:12px;}
	#principal {padding:80px 0 80px 0;}
	#secundario {padding:90px 0 100px 0;}
	footer { position: relative;}
}
@media only screen and (min-width: 600px) and (max-height: 550px) {
	header {height:35px; padding-top:9px;}
	#principal {padding:50px 0 50px 0;}
	#secundario {padding:60px 0 60px 0;}
	footer { position: relative;}
}
@media only screen and (max-width: 600px) {
	body {background: url("../Imaxes/backgrounds/grisclaro-milimetros-@2xbackground.jpg");background-size:98px 98px;}
	header {background:url("../Imaxes/backgrounds/gris-alert-@2xbackground.jpg"); background-size:645px 176px;}
		#principal {padding:90px 0 50px 0;}
		#hoja {background:url("../Imaxes/backgrounds/hoja-doblada-@2xbackground.png") center center no-repeat; background-size:590px 455px;}
		#secundario {padding:100px 0 120px 0; background:url("../Imaxes/backgrounds/verde-geometrias-@2xbackground.jpg");}
			#secundario h2 {font-size:42px; line-height:48px; color:#ececec;}
			#secundario p {font-size:19px; line-height:24px; max-width:300px;}
			#buttons {display:none;}
			#mbuttons {text-align:center; display:inline-block;}
			#mcontact, #minstagram, #mvimeo {width:75px; height:85px; margin:20px 10px;}
			#mcontact {background:url(../imaxes/icons/contact-javier-pazos-btn.svg); float:left;}
			#minstagram {background:url(../imaxes/icons/instagram-javier-pazos-btn.svg); float:left;}
			#mvimeo {background:url(../imaxes/icons/vimeo-javier-pazos-btn.svg); float:left;}
		footer { position: relative;}
}