@charset "UTF-8";
/* CSS Document created by: CARLOS AVILA for CAMINO AL MARE */

/* <---------- BODY LANDING ----------> */
body {
	margin: 0;
	padding: 0;
	background-image: url(../images/pattern_2.jpg);
	background-repeat: repeat-y;
	background-position: right top;
	}

@font-face {
  font-family: Geomanist;
  src: url(../fonts/Geomanist-Regular.otf);
}

p {
	font-family: Geomanist;
	color: #caaf76;
	}

.contenedor{
	width: 1100px;
	height: 100%;
	margin: auto;
	margin-top: 30px;
	overflow: hidden;
	}

.contenedor_white{
	background: #FFF;
	width: 100%;
	height: 100%;
	overflow: hidden;
	margin-top: 50px;
	}

.contenedor_white_2{
	width: 1100px;
	height: 100%;
	margin: auto;
	}

/* <---------- HEADER LANDING ----------> */

.caminoalmare {
	width: 340px;
	height: 20px;
	float: left;
	}

.title_camino{
	width: 675px;
	height: 74px;
	margin-top: 7px;
	float: left;
	}

.escudo_camino{
	background: url(../images/logo_CAMINO_2.png);
	width: 111px;
	height: 134px;
	float: right;
	}

/* <---------- PICTURES LANDING ----------> */

.picture_01{
	width: 431px;
	height: 580px;
	float: right;
	}

.picture_02{
	background: url(../images/picture_02.jpg);
	width: 480px;
	height: 517px;
	position: absolute;
	right: 0;
	}

.picture_03{
	background: url(../images/picture_03.jpg);
	width: 800px;
	height: 455px;
	float: left;
	z-index: 99;
	}

.picture_02_{ display: none;}
.picture_03_{ display: none;}

	
/* <---------- FORM LANDING ----------> */

.form_camino{
	width: 400px;
	float: left;
	margin-bottom: 50px;
	}

.input_camino{
	font-family: "Geomanist";
	width: 400px;
	border: #caaf76 solid 1px;
	color: #666;
	font-size: 14px;
	padding: 5px;
	margin-bottom: 7px;
	}

.btn_camino{
	width: 400px;
	background: #caaf76;
	color: #FFF;
	font-size: 15px;
	text-align: center;
	}

.nota{
	font-family: Geomanist;
	color: #000;
	font-size: 11px;
	margin-top: 10px;
	}

/* <---------- TIPOGRAFIA LANDING ----------> */

.Subtitle{
	width: 495px;
	height: 60px;
	margin-top: 300px;
	margin-bottom: 50px;
	float: left;
	}
	
/* <---------- GALLERY LANDING ----------> */

.cont_gallery{
	width: 100%;
	height: 100%;
	float: left;
	margin-top: 50px;
	}

.contenedor_gallery{
	width: 1130px;
	margin: auto;
	}

.pic_cont_gallery{
	width: 23%;
	margin: 1%;
	float: left;
	}

.pic_gallery{
	width: 100%;
	height: auto;
	}

/* <---------- GALLERY ----------> */

.cont_marcas{
	width: 100%;
	height: 100%;
	float: left;
	margin-top: 50px;
	}

.contenedor_marcas{
	width: 97%;
	margin: auto;
	}

.logos{
	margin: 2%;
	float: left;
	}

/* <---------- FOOTER ----------> */

.Line_Grey{
	background: #dfdfe1;
	height: 12px;
	width: 100%;
	}

.bg_footer{
	background: #02002e;
	height: 172px;
	width: 100%;
	}

.camino_footer{
	width: 398px;
	height: 23px;
	margin: 60px auto 20px;
	}

.copyright{
	color: #FFF;
	font-family: "Geomanist";
	font-size: 12px;
	text-align: center;
	}
	
@media only screen and (min-width: 1056px) {
	.logos{margin: 10px;}}
@media only screen and (min-width: 1024px) {
	.contenedor{width: 980px;}
	.contenedor_gallery{width: 95%;}
	.contenedor_marcas{width: 1056px;}
	.logos{margin: 7px;}}
@media(max-width:1000px){
	.contenedor_gallery{width: 100%;}
	.pic_cont_gallery{width: 48%;} 
	.picture_02{display: none;}
	.Subtitle{margin-top: 30px; margin-bottom: 30px;}
	.contenedor{width: 90%;}
	.contenedor_white_2{width: 90%;}
	.contenedor_marcas{width: 200px; display: block;}
	.cont_marcas{text-align: center;}
	.logos{margin: auto; float: none; text-align: center; margin-bottom: 20px;}}
@media(max-width:900px){ 
	.picture_03{display: none;} 
	.picture_03_{display: block; margin: auto; width: 99%; margin-bottom: 30px;s} 
	.picture_02_{display: block; margin: auto; width: 99%;}
	.picture_01{margin: auto; float: none; width:99%; height: auto; overflow: hidden;}
	.caminoalmare {margin: 10px auto; float: none; width: 90%;}
	.title_camino{width: 90%; height: auto; margin: 10px auto; float: none;}
	.escudo_camino{ background: url(../images/logo_CAMINO_3.png); float: none; margin: auto;}
	.form_camino{margin: 100px auto; float: none;}
	body {background-image: url(../images/pattern_3.jpg);}}
@media(max-width:600px){
	p{ width: 80%;}
	.pic_cont_gallery{width: 96%; margin: auto; padding: 2%;}
	.camino_footer{width: 90%;height: auto;}
	.btn_camino{width: 60%; margin: auto; text-align: center;}
	.Subtitle{width: 85%; height: auto; margin: 30px auto;}}