/* CSS Document */
/*reseteo universal*/
* {
	border:0;
	margin:0;
	padding:0;
}

article,figcaption,figure,footer,header,hgroup,nav,section{
 	display:block;
 }
 article{
 display:inline-block;
 margin-top:2%;
 padding:1em;
 }
 
 H1,H2,H3, H4{
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size:20px;
 }
 H3{
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size:18px;
 }
 li{
 list-style:none;
 }
 
/*estilos basicos*/
@font-face{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-style:normal;
}

body{
color: #003366;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:1em;	
}
p{
font-size:1em;
line-height:2em;
text-align:left;
}
a{
	color: #003399;
	text-decoration:none;
}
a hover{
	color: #0066CC;
	font-weight:bold;
}
img, video{
	padding:5px;
}

header, section#web, footer{
	text-align:center;
	width:100%;
}
header{
	background-color:#8c8037;
	max-height:180px;
	height: 20%;
	
	
	
}
footer{
	background-color: #333333;
	color: #CCCC33;
	display:inline-block;
	font-size:1em;
	height:auto;
	line-height:2em;
	margin:0 auto;
	padding-top:10px;
	text-align:center;
	
}

/*menu de navegacion*/
nav{
	background-color:#336666;
	background-image:url(../fondos/navFdo.jpg);
	background-repeat:repeat-x;
	min-height:50px;
	position:relative;
	text-align:left;
	width: 100%;
	
}
nav ul{
	list-style:none;
	width:100%;
	margin-top:1%;
}
nav  li{
	display: inline;
	text-align:left;
	margin:1%;
	
}
nav  a{
	color: #FFCC00;
	font-family: "Eras Demi ITC", Verdana, Arial, Helvetica, sans-serif;
	font-size:1.3em;
	-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;
	transition: all 0.5s ease-in;
}
nav a:hover{
	color: #FFFF66;
	-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}
.boton{
	background-color: #336666;
	float:left;
	height:auto;
}
#logo{
display:inline;
height:20%;
width:50%;
}
/*maquetacion principal*/
section#contenido{
	display:inline-block;
	height:100%;
	margin:0 auto;
	min-height:450px;
	text-align:center;
	width:100%;
}
.fdo_contVde{
background-image:url(../fondos/verdeagua.png);
}

section#central{
	background-color:transparent;
	display:inline-block;
	height:100%;
	min-height:400px;
	text-align:center;
	width:90%;
}

article#laempresa{
background-color: #FFFFCC;
font-family: Georgia, "Times New Roman", Times, serif;
color:#333333;
display: block;
margin:0 auto;
overflow: hidden;
padding:30px;
text-align:left;
width:80%;
}

section#galeria{
	background-color: #336666;
	
	display:inline-block;
	height:100%;
	margin:5px;
	padding:2%;
	text-align:center;
	width:93%;
}
section#galeria ul {
display:inline-block;

}

section#galeria ul li{
display:inline-block;
border:thin;
border-color:#FF0000;
text-align:center;
}

.fabrica_imgTop{
	background-color: #336666;
	/*box-shadow: 3px 3px 50px grey;*/
	height:90%;
	margin:2%;
	margin-top:0px;
	min-width:400px;
	text-align:center;
	width:90%;
}
.fabrica_img{
	background-color:  #336666;
	/*box-shadow: 3px 3px 50px grey;*/
	height:20%;
	margin:2%;
	margin-top:0px;
	max-height:200px;
	/*float:left;*/
	width:20%;
}
.fabrica_imgRight{
	background-color:  #336666;
	/*box-shadow: 3px 3px 50px grey;*/
	height:20%;
	margin:2%;
	margin-top:1%;
	min-width:300px;
	/*float: right;*/
	width:20%;*/
}

section#catalogo{
	/*background-color:rgba(204,204,51,2);*/
	background-color: #CCCC33;
	display:inline-block;
	height:100%;
	margin:5px;
	padding:2%;
	text-align:left;
	width:93%;
}
section#catalogo ul {
display:inline-block;
}
section#catalogo ul li{
display:inline-block;
border:thin;
border-color:#FF0000;
text-align:center;
}
#indice_btn{
background-color:#FFFFFF;
margin:1px;
width:auto;
}

.indice_ttl {
background-color: #666633;
color:#FFFFFF;
font-size:0.9em;
text-align:center;
width:100%;
}
.indice_ttl a{
background-color: #666633;
color:#FFFFFF;
font-size:0.9em;
text-align:center;
}
.indice_ttl a:hover{
background-color:#666633;
color: #009966;
font-size:0.9em;
min-height:50px;
text-align:center;
}

#marcaPags{
	background-color:transparent;
	margin: 0 auto;
	font-size:2em;
	color: #CC0099;
	padding-left:5%;
	position:relative;
	width: 90%;
	text-align:left;
	top:5%;
}


.fade{
	opacity:1;
	filter:alpha(opacity=10);
	-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;
	transition: all 0.5s ease-in;
}
.fade hover{
	opacity:0.7;
	filter:alpha(opacity=7);
	-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}


/* Formulario de contacto*/
#form_container{
	background-color:transparent;
	display:inline-block;
	height:100%;
	margin:3px;
	min-height:380px;
	overflow:hidden;
	padding:2%;
	text-align:left;
	width:100%;
}
#formulario {
	float:left;
	position:relative;
	margin-top:5%;
	text-align:left;
	width:auto;
}
#ilustration_img{
	box-shadow: 0px 0px 30px grey;
	float:left;
	margin-left:5%;
	margin-top:8%;
	width:auto;
}
	
.form_btn{
font-family: Verdana, Arial, Helvetica, sans-serif
font-size:10px;
color: #003333;
background-color: #FFFFFF;
padding:2px;
}
.form_txt{
font-family: Georgia, "Times New Roman", Times, serif;
color:#333333;
}

#gracias{
margin-top:80px;
width:40%;
height:120px;
float:left;
margin-left:100px;
}
#infooter{
float: left;
margin-left:25%;
text-align:left;}

#qr{
float:right;
height:auto;
margin-right:2%;
width:auto;
}
/* boton diseņo*/
.diseņo{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#000000;
	text-align:right;
	float:right;
	padding-right:10px;
}
.diseņo a{
	text-decoration:none;
}	
.diseņo a:hover{
	color: #999999;
}

@media(min-with:1081px){
	figure{	
	width:100%;
	}
	nav li{
	font-size: 1.3em;
	width:80%;
	}
	
}

@media(max-with:1080px){

	nav li{
	font-size: 1.em;
	width:80%;
	}
	figure{	
	width:80%;
	}
}

@media(max-with:800px){

	nav li{
	font-size: 0.90em;
	}
	p{
	font-size: 0.80em;
	}
	
	#formulario {
	width: 40%;
	}
	figure{	
	width:60%;
	}
}

@media(max-with:600px){

	nav li{
	font-size: 0.80em;
	}
	p{
	font-size: 0.65em;
	}
	#formulario {
	width: 30%;
	}
	figure{	
	width:40%;
	}
}