/* CSS Document */


/* ///////////////////// SECTION/SECCION //////////////////// */

/* ////////////////////////////////////////////////////////// */

section {
/*	background-color: white;*/
	margin-top: 3%;
	margin-bottom: 5%;
}

section h1 {
	font-family: 'Byom-bold', sans-serif;
	font-size: 3.6em;	
	margin: 0% 0% 2% 0%;
	color: red;
}

section p {
	font-size: 1.3em;
/*	border: solid 1px brown;*/
}

.rojo {
	color: red;
}

#direccion {
	margin-top: 3%;
	padding-left: 55px;
/*	border: solid 1px #939393;*/
}

#direccion a, #direccion_xs a {
	text-decoration: none;
	color: #333;
}

.mapa {
	background-image: url(../images/contacto/mapa.png);
	background-repeat: no-repeat;
	background-position:80% 0%;
}

#formulario {
	margin-top: 2%;
}

label {
	font-size: 1.4em;
}

#nombre, #email, #empresa {
	height: 45px;
	max-width: 95%;
	border: solid 1px #939393;
	margin-bottom: 30px;	
}

#mensaje {
	margin-bottom: 3%;
	border: solid 1px #939393;
}

#formulario button {
    border: solid 1px #a3a3a3;
    width: 180px;
    background-color: #a3a3a3; 
    color: white; 
    font-size: 2em;
	box-shadow: 9px 9px 14px grey;
}

#div_boton {
	text-align: right;
/*	border: solid 2px #33cc99;*/
	margin-top: -12px;
	margin-bottom: 30px;
}

@media (max-width:767px){
	section h1 {	
		font-size: 2em;	
		margin: 2% 0% 3% 2%;
	}
	
	section p {
		margin-left: 2%
	}		
	
	#direccion_xs {
		padding-left: 3%;
		margin-bottom: 5%;
	}
	
	form {
		padding-left: 2%;		
	}
	
	#nombre, #email, #empresa, #mensaje {
		max-width: 99%;
	}
	
	#div_boton {
		margin-top: 10px;
		margin-right: 2%;
	}
	

	
}

@media (min-width:992px) AND (max-width:1199px) {
	section h1 {
		font-family: 'Byom-bold', sans-serif;
		font-size: 3.7em;	
		margin: 0% 0% 2% 0%;
		color: red;		
	}	
	
	.mapa {
		background-image: url(../images/contacto/mapa.png);
		background-repeat: no-repeat;
		background-position:65% 0%;		
	}
}

@media (min-width: 1200px) {
	section h1 {
		margin: 0% 0% 2% 0%;
		font-size: 4.3em;
	}
	
	section p {
		font-size: 1.4em;
		padding-right: 20px;
	}
	
	.mapa {
		background-image: url(../images/contacto/mapa.png);
		background-repeat: no-repeat;
		background-position: center;
	}
	
}

/*========== Modal ===========  */

.modal-title {
	font-size: 1.3em;
}

#a_trigger  {
	color: red;
	text-decoration: none;
}


/*========== aside ===========  */



/* //////////////////////// BANDA de TRES ////////////////////////// */

/* ////////////////////////////////////////////////////////// */