@font-face {
    font-family: 'gillsanslight';
    src: url('../fonts/gillsanslight.eot');
    src: url('../fonts/gillsanslight.eot') format('embedded-opentype'),
         url('../fonts/gillsanslight.woff2') format('woff2'),
         url('../fonts/gillsanslight.woff') format('woff'),
         url('../fonts/gillsanslight.ttf') format('truetype'),
         url('../fonts/gillsanslight.svg#gillsanslight') format('svg');
}

@font-face {
    font-family: 'gillsans';
    src: url('../fonts/gillsans.eot');
    src: url('../fonts/gillsans.eot') format('embedded-opentype'),
         url('../fonts/gillsans.woff2') format('woff2'),
         url('../fonts/gillsans.woff') format('woff'),
         url('../fonts/gillsans.ttf') format('truetype'),
         url('../fonts/gillsans.svg#gillsans') format('svg');
}

@font-face {
    font-family: 'honeyscript';
    src: url('../fonts/honeyscript.eot');
    src: url('../fonts/honeyscript.eot') format('embedded-opentype'),
         url('../fonts/honeyscript.woff') format('woff'),
         url('../fonts/honeyscript.ttf') format('truetype'),
         url('../fonts/honeyscript.svg#honeyscript') format('svg');
}

@font-face {
    font-family: 'sanuklflight';
    src: url('../fonts/sanuklf-light.eot');
    src: url('../fonts/sanuklf-light.eot') format('embedded-opentype'),
         url('../fonts/sanuklf-light.woff2') format('woff2'),
         url('../fonts/sanuklf-light.woff') format('woff'),
         url('../fonts/sanuklf-light.ttf') format('truetype'),
         url('../fonts/sanuklf-light.svg#gillsans') format('svg');
}


h1{margin:0;padding:0;}
h2{margin:0;padding:15% 0 0 0;}
h3{margin:0;padding:5% 0 0 0;}

body{}

/* Basic */
@-ms-viewport {width: device-width;}

html{height: 100%;}

body{background:#ffffff;color: #000000;height:100%;margin:0;padding-top: 5em;}

#header{position: fixed;z-index: 10000;left: 0;top: 0;width: 100%;background: #fff;height: 5em;}
#header #logotipo{padding:1em;}
#header #logotipo ul{margin:0;padding:0;}
#header #logotipo ul li{display:inline;padding:0 0.3em 0 0;}

#nav {height:5em;line-height:3em;position:absolute;right:2em;top:0;}
#nav ul {margin:1% 0 0 0;}
#nav ul li {display: inline-block;margin: 0em 1em;}
#nav ul li a{color:inherit;display:block;height:5em;line-height: 5em;outline:0;padding:0 0.5em 0 0.5em;text-decoration:none;}
#nav ul li a:hover{text-decoration:underline;}

#somos{height:1500px;}
#somosimagen{background:url("../img/bodegas-jalon.jpg");background-position:50%;background-repeat: no-repeat;background-size:cover;-webkit-background-size:cover;-moz-background-size: cover;-o-background-size: cover;float:left;height:400px;position:relative;text-align:center;width:100%;}
#somosimagen span{position:absolute;top:0;bottom:0;left:0;right:0;width:90%;margin:10% auto;text-align:center;}


#elaboracion{height:1500px;}
#elaboracionimagen{background:url("../img/elaboracion-bodegas-jalon.jpg");background-position:50%;background-repeat: no-repeat;background-size:cover;-webkit-background-size:cover;-moz-background-size: cover;-o-background-size: cover;float:left;height:400px;position:relative;text-align:center;width:100%;}
#elaboracionimagen span{position:absolute;top:0;bottom:0;left:0;right:0;width:90%;margin:10% auto;text-align:center;}

#vinos{height:3000px;}
#vinosimagen{background:url("../img/vinos-bodegas-jalon.jpg");background-position:50%;background-repeat: no-repeat;background-size:cover;-webkit-background-size:cover;-moz-background-size: cover;-o-background-size: cover;float:left;height:400px;position:relative;text-align:center;width:100%;}
#vinosimagen span{position:absolute;top:0;bottom:0;left:0;right:0;width:90%;margin:10% auto;text-align:center;}
#vinos article.vino{margin:0 0 20% 0;}
#vinos article.vino header{float:left;text-align:left;width:100%;}
#vinos article.vino header{float:left;margin:0;padding:0.5% 0;}
#vinos article.vino .imagen{float:left;text-align:left;width:100%;}
#vinos article.vinosinmargen{margin:0 0 5% 0;}
#vinos article.vinosinmargen header{float:left;text-align:left;width:100%;}
#vinos article.vinosinmargen header{float:left;margin:0;padding:0.5% 0;}
#vinos article.vinosinmargen .imagen{float:left;text-align:left;width:100%;}

#contacto{height:1500px;}
#contactoimagen{background:url("../img/contacto-bodegas-jalon.jpg");background-position:50%;background-repeat: no-repeat;background-size:cover;-webkit-background-size:cover;-moz-background-size: cover;-o-background-size: cover;float:left;height:400px;position:relative;text-align:center;width:100%;}
#contactoimagen span{position:absolute;top:0;bottom:0;left:0;right:0;width:90%;margin:10% auto;text-align:center;}

.contenido{float:left;padding: 0 15%; width:70%;}
.contenido header{float:left;text-align:left;width:30%;}
.contenido .textocontenido{float:right;letter-spacing:1px;line-height:20px;padding:4% 0 0 2%;width:63%;}

.mensaje{float:left;text-align:center;width:100%;}

/* Footer */
#footer{background-color:#000000;float:left;line-height:22px;padding:1em 0;position:static;text-align:center;margin:0;width:100%;}

/*----- Alineación -----*/
.justificado{text-align:justify;}

/*----- Colores -----*/
.c_000000{color:#000000;}
.c_94c122{color:#94c122;}
.c_9d9d9c{color:#9d9d9c;}
.c_ffffff{color:#ffffff;}

/*----- Estilos -----*/
.nosubrayado{text-decoration:none;}

/*----- Input -----*/
input{background-color:#ffffff;border:1px solid #000000;margin:0 0 2% 0;padding:1%;}
.submit{background-color:#000000;color:#ffffff;font-size:87.5%;padding:3%;}

/*----- Letterspacing -----*/
.letterspacing1px{letter-spacing:1px;}
.letterspacing3px{letter-spacing:3px;}

/*----- Lineheight -----*/
.lineheight20{line-height:20px;}

/*----- Textos -----*/
.texto11{font-size:68.75%;}
.texto12{font-size:75%;}
.texto14{font-size:87.5%;}
.texto16{font-size:100%;}
.texto24{font-size:180%;}
.texto56{font-size:250%;}
.texto72{font-size:450%;}
.texto172{font-size:950%;}

/*----- Tipografías -----*/
.gillsans{font-family:'gillsans';}
.gillsanslight{font-family:'gillsanslight';}
.honeyscript{font-family:'honeyscript';}
.sanuklflight{font-family:'sanuklflight';}

/*----- Width -----*/
.width100{width:100%;}

@media screen and (max-width:1024px){
	#somosimagen{height:400px;}
	#elaboracionimagen{height:400px;}
	#vinosimagen{height:400px;}
	#contactoimagen{height:400px;}	
	.contenido{float:left;padding: 0 10%; width:80%;}
	
	.texto172{font-size:820%;}
}

@media screen and (max-width:800px){
	body{padding-top:8em;}
	#header{text-align:center;height:8em;}
	#nav {border-bottom:1px solid #000000;height:0.6em;line-height:0em;padding:1em;position:static;text-align:center;}
	#nav ul {margin:0;padding:0;}
	#nav ul li {display: inline-block;margin:0;padding:0;}
	#nav ul li a{color:inherit;display:block;height:0;line-height: 0;outline:0;padding:0 1em 0 0;text-decoration:none;}
	#nav ul li a:hover{text-decoration:underline;}

	#somosimagen{height:300px;}
	#elaboracionimagen{height:300px;}
	#vinosimagen{height:300px;}
	#contactoimagen{height:300px;}	
	
	.contenido{float:left;padding: 0 5%; width:90%;}
	.contenido header{float:left;padding:0 10%;text-align:left;width:80%;}
	.contenido .textocontenido{float:left;padding:0 10%;text-align:left;width:80%;}

	.texto172{font-size:670%;}
}

@media screen and (max-width:640px){
	#somosimagen{height:230px;}
	#elaboracionimagen{height:230px;}
	#vinosimagen{height:230px;}
	#contactoimagen{height:230px;}
	
	#vinos article.vino .imagen img{width:90%;}
	
	.texto172{font-size:500%;}
}

@media screen and (max-width:480px){
	.letterspacing3px{letter-spacing:1px;}
	
	#somosimagen{height:170px;}
	#elaboracionimagen{height:170px;}
	#vinosimagen{height:170px;}
	#contactoimagen{height:170px;}
	
	.texto172{font-size:420%;}
}

@media screen and (max-width:420px){
	#nav ul li a{padding:0 0.3em 0 0.3em;}
	
	#somosimagen span{display:none;}
	#elaboracionimagen span{display:none;}
	#vinosimagen span{display:none;}
	#contactoimagen span{display:none;}
	
	.contenido header{float:left;padding:0 1%;text-align:left;width:98%;}
	.contenido .textocontenido{float:left;padding:0 1%;text-align:left;width:98%;}
	
	.texto172{font-size:300%;}
}

@media screen and (max-width:400px){
	.letterspacing3px{letter-spacing:1px;}
	
	#nav ul li a{padding:0 0.1em;}
	
	#somosimagen span{display:none;}
	#elaboracionimagen span{display:none;}
	#vinosimagen span{display:none;}
	#contactoimagen span{display:none;}
	
	.contenido header{float:left;padding:0 1%;text-align:left;width:98%;}
	.contenido .textocontenido{float:left;padding:0 1%;text-align:left;width:98%;}
	
	.texto172{font-size:300%;}
}

@media screen and (max-width:380px){
	.letterspacing3px{letter-spacing:0.6px;}
	
	#nav{background-color: #f3f3f3;padding:6.5% 0 2.5% 0;}
	.texto14{font-size:75%;}
	
	#nav ul li{padding:0 0.1em;}
	#nav ul li a{padding:0 0 0 0;}
}