*{
	margin: 0;
	padding: 0;
}

body{
	font-family: 'lato', sans-serif, arial;
	background: url(../img/bg1.jpg);
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	background-attachment: fixed;
}

b{
	font-size: 18px;
	font-weight: 400;
}

img{
	border: none;
}

button{
	background: #9C5211;
	border: none;
	color: #fff;
	cursor: pointer;
	cursor: hand;
	font-size: 15px;
	font-weight: 300;
	height: auto;
	margin: 1.5%;
	padding: 15px 0px;
	width: 30%;
}

button:hover{
	background: #894403;
}

#submenu-responsivo{
	display: none;
}
/*-----------------estilos del acordeon responsivo--------------*/

dl{ margin: 0 auto; width: 100%; }
		dt, dd{ padding: 20px; }
		dt{ background: #9C5211; color: white; border-bottom: 1px solid #894403; border-top: 1px solid #894403; cursor: pointer; }
		dd{ background: #F5F5F5; display: none; line-height: 1.4em; color:#666666; }
		dt.activo, dt:hover{ background: #894403; }

		dt:before{ content: "▸"; margin-right: 10px; }
		dt.activo:before{ content: "▾"; }

/*-----------------terminan estilos del acordeon responsivo--------------*/

/*------------------estilos del menu---------------------*/


#menu{
	width: 100%;
	height: 65px;
	background: #000;
	position: fixed;
}

nav{
	width: 870px;
	height: 65px;
	margin: 0 auto;
}

nav a{
	text-decoration: none;
	color: #fff;
	display: inline-block;
	margin: 10px 50px;
	padding: 10px ;
	font-size: 20px;
}

nav a:hover{
	color: #9C5211;
}



/*-------------------terminan estilos del menu---------------*/

h1, h3, h4, h6{
	font-size: 58px;
	text-align: center;
	padding-top: 140px;
	color: #F4F4F4;
	font-weight: 300;
}

h2, h5{
	font-size: 30px;
	text-align: center;
	color: #F4F4F4;
	font-weight: 300;
}

p{
	border-top: solid 1px #333;
	font-size: 26px;
	font-weight: 300;
	height: auto;
	margin-top: 10px;
	padding: 40px 0px;
	text-align: center;
	width: 100%;
	color: #F4F4F4;
}

#portada{
	width: 100%;
	height: auto;
	background: url(../img/dark_wood.png);
	padding-bottom: 6%;
}

#cont-int-portada{
	width: 100%;
	height: auto;
	background: url(../img/sombra.png);
	background-repeat: repeat-x;
}

#logo{
	max-width: 600px;
	height: auto;
	margin: 0 auto;
	padding: 20% 0;
}

#logo img{
	width: 100%;
}



#contenedor-principal{
	background:  rgba(0, 0, 0, 0.8);
	height: auto;
	margin: 0 auto;
	max-width: 1100px;
	width: 80%;
	padding: 0 7%;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

#info-oculta-a, #info-oculta-b, #info-oculta-c, #info-oculta-d, #info-oculta-e, #info-oculta-f, #info-oculta-g, #info-oculta-h, #info-oculta-i{
	background: #fff;
	height: auto;
	margin: 0 auto;
	max-width: 1100px;
	width: 80%;
	padding: 40px 7%;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

#info p{
	color: #666666;
	border-top: none;
	font-size: 18px;
	text-align: justify;
	padding: 20px 0px;
	-moz-column-count: 2;
   -moz-column-gap: 2em;
   -webkit-column-count: 2;
   -webkit-column-gap: 2em;
}

#info-oculta-a ul{
		padding: 20px 0px;
}

#info-oculta-a ul li{
	font-size: 18px;
	font-weight: 300;
	color: #666666;
}

.titulo-oculto{
	font-size: 28px;
	color: #9C5211;
}

#cont-gal{
	border-top: solid 1px #333;
	height: auto;
	width: 100%;
	padding-top: 40px;
}

#gal{
	width: 31%;
	height: auto;
	display: inline-block;
	vertical-align: top;
	margin: 1%;
}

#gal img{
	width: 100%;
}

form{
	padding-bottom: 30px;
}

input[type="text"], input[type="email"]{
	font-size: 26px;
	width: 97%;
	margin: 5px 0;
	padding: 1%;
	font-weight: 300;
	font-family: 'lato', sans-serif, arial;
}

textarea{
	font-size: 26px;
	width: 97.2%;
	margin: 5px 0;
	padding: 1%;
	font-weight: 300;
	font-family: 'lato', sans-serif, arial;
	resize:none;
}

input[type="submit"]{
	font-size: 26px;
	padding: 1%;
	font-weight: 300;
	font-family: 'lato', sans-serif, arial;
	border: none;
	background: #666;
	width: 20%;
	cursor: pointer;
	cursor: hand;
	margin-left: 79.4%;
	margin-top: 3px;
	color: #fff;
	
}

input[type="submit"]:hover{
	background: #8CC63F;
}

@media(max-width: 920px){

	body{
		
	}

	button{
		font-size: 13px;
		margin: 1.2%;
	}

	#logo{
		max-width: 60%;
		padding: 20% 0;
	}

	#info p{
	border-top: none;
	font-size: 18px;
	text-align: justify;
	padding: 20px 0px;
	-moz-column-count: 1;
   -webkit-column-count: 1;
	}

	#gal{
		width: 30.8%;
	}


	nav{
	width: 700px;
	height: 65px;
	margin: 0 auto;
	}

	nav a{
		margin: 10px;
		padding: 10px 30px;
		font-size: 20px;
	}


}

@media(max-width: 620px){



	#portada{
		height: auto;
		padding-bottom: 0;
	}

	#logo{
		max-width: 60%;
		padding: 20% 0;
	}

	

	button{
		display: none;
	}

	p{
		font-size: 18px;
		padding: 20px 0;
	}

	dt{
		padding: 10px;
		font-size: 12px;
	}

	#submenu-responsivo{
	display: block;
	}

	h1, h3, h4, h6{
	font-size: 32px;
	text-align: center;
	padding-top: 80px;
	}

	h2, h5{
	font-size: 22px;
	text-align: center;
	}

	#contenedor-principal{
		width: 90%;
	}

	form{
	padding-bottom: 10px;
	}

	input[type="text"], input[type="email"]{
		font-size: 20px;
	}

	textarea{
		font-size: 20px;
	}

	input[type="submit"]{
		font-size: 20px;
		padding: 1%;
		font-weight: 300;
		font-family: 'lato', sans-serif, arial;
		border: none;
		background: #666;
		width: 99.5%;
		margin-left: 0;
		margin-top: 3px;
		
	}

	#menu{
		height: auto;
		border-bottom: solid 1px #333333;
	}

	nav{
	width: 100%;
	height: auto;
	margin: 0 auto;
	}

	nav a{
		width: 24.3%;
		text-align: center;
		padding: 5px 0px;
		font-size: 11px;
		margin: 0px;
		float: left;
		border-left: solid 1px #333333;
	}



}

@media(max-width: 600px){
	#gal{
		width: 47.3%;
	}

	#cont-int-portada{
	height: auto;
	background: none;
}


body{
	background: url(../img/bg2.jpg);
}

#contenedor-principal{
	
	width: 100%;
       
}

input[type="submit"]{
	font-size: 26px;
	padding: 15px 0px;
	
	
}

	
}

@media(max-width: 420px){
	#gal{
		width: 47.3%;
	}

	#logo{
		max-width: 75%;
		padding: 35% 0;
	}


h1, h3, h4, h6 {
	padding-top: 45px;
}

	
}