
body{
	font-family: 'latoregular';
	font-size: 16px;
}
h1,h2{
	font-family: 'latobold';
}




a{
	text-decoration: none;
}

#blanco{
	background-color: white;
}

@media only screen and (max-width: 768px){
	.inicioMenu:before{
		content:url('../img/menu/MENU_inicio.png'); 
		position:relative;
		max-width: 35px;
		left:-5px;
		top:5px;
		height: auto;


	}
	.nosotrosMenu:before{
		content:url('../img/menu/MENU_nosotros.png'); 
		position:relative;
		max-width: 35px;
		left:-5px;
		top:5px;
		height: auto;


	}
	.serviciosMenu:before{
		content:url('../img/menu/MENU_servicios.png'); 
		position:relative;
		max-width: 35px;
		left:-5px;
		top:5px;
		height: auto;


	}
	.contactoMenu:before{
		content:url('../img/menu/MENU_contacto.png'); 
		position:relative;
		max-width: 35px;
		left:-5px;
		top:3px;
		height: auto;


	}
}


header nav .redes{
	float: right;
	top:-10px;
	right: 0;
	font-size: 1em;
	padding: 0 2em .1em 2em;
	position: absolute;
}

/*
PARALAX



#intro { 
    background: url('../img/bg/bg_1.jpg') 50% 0 fixed; 
    height: auto;  
    margin: 0 auto; 
    width: 100%; 
    position: relative; 
    box-shadow: 0 0 10px rgba(0,0,0,0.8);
    padding: 100px 0;

}


PARALAX


*/
#intro { 
    background: url('../img/bg/bg_1.jpg') 50% 0 fixed; 
    height: auto;  
    margin: 0 auto; 
    width: 100%; 
    position: relative; 
    padding: 100px 0;
}
#servicios { 
    background: url('../img/bg/bg_3.jpg') 50% 0 fixed; 
    height: auto;  
    margin: 0 auto; 
    width: 100%; 
    position: relative; 
    padding: 0px 0 50px 0;
}

.banner{
	margin: 0 auto;
	text-align: center;
	background: rgb(0,0,0,1);


}

.banner .redes{
	display: block;

	color:black;
	margin: 50px auto;
	text-align: center;
	overflow: hidden;
}
.redes ul{
	width: 200px;
	margin: 10px auto;
	color: #000;
	background: red;
	
}

.redes ul li{
	display: inline-block;
	text-align: center;
	padding: 5px;
	float: left;
}

.redes ul li a{
	font-size: 2em;
	color:white;
	text-decoration: none;
}
.banner .logo{
	text-align: center;
}


.banner h1{
	color:white;
	font-size: 1.5em;
}




.banner figure{
	max-width: 250px;
	margin: 2.8em auto;
	background: rgba(255,255,255,.7);
	border-radius: 50%;
}

.banner figure img{
	max-width: 100%;
	margin: 0 auto;
}
@media only screen and (min-width: 768px){
	.banner h1{
	color:white;
	font-size: 2.5em;
	}
	.banner figure{
		max-width: 350px;
		margin: 2.8em auto;
		background: rgba(255,255,255,.7);
		border-radius: 50%;
	}

	.banner figure img{
		max-width: 100%;
		margin: 0 auto;
	}



}


section{
	text-align: center;
	margin: 0px auto;
}

.nosotros{
	background:rgb(253,183,13);
	color: white;
	padding: 1.2em;
	display: block;
	margin: 0 auto;
	min-height: 250px;
	box-shadow: 0 0 50px rgba(0,0,0,0.8);

}
.nosotros h2{
	font-size: 1.5em;
	text-align: left;
	padding:1em;
}
.nosotros h2:before{
  content:url('../img/menu/MENU_nosotros_h2.png'); 
  position:relative;
  max-width: 50px;
  left: -.5em;
  top:.25em;
  height: auto;
}
.nosotros p{
	color:#333;
	font-size: 1em;
	text-align: justify;
	padding:2em;

}
.servicios{
	text-align: center;
	margin: 0 auto;
	font-family: 'bebas_neueregular';
}

.servicios h2{
	color: white;
	text-align: left;
	padding:2em;
}
.servicios h2:before{
  content:url('../img/menu/MENU_servicios_h2.png'); 
  position:relative;
  max-width: 50px;
  left: -.5em;
  top:.25em;
  height: auto;
}

.servicios .listaServicios{
	max-width: 300px;
	min-height: 20em;
	background-color: rgb(23,95,201);
	margin: .7em auto;
	color:white;
	text-align: center;
	box-shadow: 0 0 50px rgba(0,0,0,0.8);
 
}
.servicios .listaServicios:hover {
	max-width: 305px;
	min-height: 20em;
	background-color: rgb(105,165,253);
	margin: .7em auto;
	color:black;
	text-align: center;
	box-shadow: 0 0 50px rgba(0,0,0,0.8);
}


.listaServicios img{
	margin: 1.25em auto;
	max-width: 70%;
	
}
.listaServicios a{
	text-decoration: none;
}

.listaServicios a p{
	font-size: 1.3em;
	color: white;
}
.contacto{
	color:white;
	margin: 0 auto;

}	
.contacto h2{
	background: rgb(253,183,13);
	padding: 1em;
	margin: 0 auto;
	font-size: 1.5em;
	text-align: left;
	padding-left: 2em;
}
.contacto h2:before{
  content:url('../img/menu/MENU_contacto_h2.png'); 
  position:relative;
  max-width: 50px;
  left: -.5em;
  top:.2em;
  height: auto;
}

.contacto .mapa{
	padding: 0;
	margin-bottom: -5px;

}
.contacto .mapa iframe{
	padding: 0;
	margin: 0;
}
.contacto .formcontacto{
	min-height: 30em;
	padding: 2em;
	background: rgb(95,95,95);

}

.formcontacto h3{
	padding: .5em;
	font-family: 'latolight'
}
.formcontacto input, .formcontacto textarea{
	background: #000;
	border: 0px;
	color:white;
	outline: none;
}


.formcontacto .enviar{
	width: 160px;
	float: right;
	background: transparent;
	border: 1px solid #000;
	color:#000;


}
.formcontacto .enviar:hover{
	
	background: #000;
	border: 1px solid #000;
	color:white;


}
@media only  screen and (max-width: 768px){
	.formcontacto .enviar{
		width: 100%;
		float: right;
		background: transparent;
		border: 1px solid #000;
		color:#000;


	}

}

.popup{
	max-width: 600px;
	display: none;
}

.popup img{
	max-width: 100%;
}
.popup h3{
	text-align: center;
}





.footer{
	min-height: 5em;
	margin: 0 auto;
	background: rgb(253,183,13);
}
.footer p{
	font-size: .8em;
	font-weight: 300;
	padding: 2em;

}
