@charset "UTF-8";
/* CSS Document */








#contacto {
	
	width:500px;
	height:300px;
	margin:auto;
	position:relative;
	top:200px;
	}




#titulo {
	
	width: 500px;
	height: 50px;
	position: relative;
	border-bottom: thin #F5C73B solid;
	top: 170px;
	margin: auto;	
}

#datos {
	
	width: 500px;
	height: 200px;
	position: relative;
	top: 180px;
	margin: auto;
	
}


#icon-tel {
	background:no-repeat url("../img/contacto/phone.png");	
	width: 50px;
	height: 50px;
	
}

#telefono {
	width: 150px;
	height: 50px;
	line-height: 45px;
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight:normal;
	color: #ffffff;
	margin:0 0 0 50px;
	top: -50px;
	position: relative;
	padding-left: 10px;
	font-size: 13pt;
	
	
}



#icon-cel {
	background:no-repeat url("../img/contacto/whatsapp.png");	
	width: 50px;
	height: 50px;
	top:-100px;
	left: 260px;
	position: relative;
	
}


#celular {
	width: 150px;
	height: 50px;
	line-height: 45px;
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight:normal;
	color: #ffffff;
	margin:0 0 0 50px;
	top: -150px;
	left: 260px;
	position: relative;
	padding-left: 10px;
	font-size: 14pt;
	
	
	
}




#icon-tw {
	background:no-repeat url("../img/contacto/twitter.png");	
	width: 50px;
	height: 50px;
	position: relative;
	top: -230px;
	
}

#twitter {
	width: 150px;
	height: 50px;
	line-height: 45px;
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight:normal;
	color: #ffffff;
	position: relative;
	padding-left: 10px;
	top: -280px;
	margin: 0 0 0 50px ;
	font-size: 16pt;
	
}


#icon-fb {
	background:no-repeat url("../img/contacto/facebook.png");	
	width: 50px;
	height: 50px;
	top:-130px;
	left: 260px;
	position: relative;
	
}


#facebook {
	width: 150px;
	height: 50px;
	line-height: 45px;
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight:normal;
	color: #ffffff;
	margin:0 0 0 50px;
	top: -180px;
	left: 260px;
	position: relative;
	padding-left: 10px;
	font-size: 16pt;
	
	
}


#icon-mail {
	background:no-repeat url("../img/contacto/email.png");	
	width: 50px;
	height: 50px;
	position: relative;
	top: -260px;
}


#mail {
	width: 180px;
	height: 50px;
	line-height: 45px;
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight:normal;
	color: #ffffff;
	margin:0 0 0 50px;
	top: -310px;
	position: relative;
	padding-left: 10px;
	font-size: 14pt;
	
	
}



/* reglas CSS para formulario */
.form-consulta {max-width: 500px; background: #eee; padding: 25px; font-family: 'Source Sans Pro', sans-serif;}
.campo-form {width:100%; height:36px; margin:2px 0 6px; padding-left:6px; box-sizing: border-box; border-radius:3px; border:0; font-family: 'Source Sans Pro', sans-serif; font-size:1em;}
label span {color: #f00}
textarea {min-height: 150px!important;}
.btn-form {display: inline-block; border:0; background: #000; height: 46px; line-height: 46px; padding: 0 20px; border-radius: 6px; color:#fff; text-decoration: none; text-transform: uppercase; letter-spacing: 1px}
.btn-form:hover {background: #444}









@media (max-width:600px) {
	
	

	
	#titulo {
	width: auto;
	padding-left: 10px;
	padding-right: 10px;
	height: 30px;
	top: 100px;
		
	}
	
	
	#datos {
	
	width: 95%;
	height: 200px;
	top: 110px;
	
	
}
	
	
	#icon-tel {
	background-size: contain;
	width: 35px;
	height: 35px;
	
}

	#telefono {
	width: auto;
	height: 35px;
	line-height: 35px;
	margin:0 0 0 35px;
	top: -35px;
	
	
}
	
	
	#icon-cel {
	width: 35px;
	height: 35px;
	background-size: contain;
	top:-25px;
	left: 0px;
	
}


	#celular {
	width: auto;
	height: 35px;
	line-height: 35px;
	margin:0 0 0 35px;
	top: -60px;
	left: 0;
	
}
	
	
	#icon-tw {
	width: 35px;
	height: 35px;
	top: -75px;
	background-size: contain;
	
}

	#twitter {
	width: auto;
	height: 35px;
	line-height: 35px;
	padding-left: 10px;
	top: -110px;
	margin: 0 0 0 35px ;
	
}
	
	
	#icon-fb {
	width: 35px;
	height: 35px;
	top:-50px;
	left: 0px;
	background-size: contain;
	
}


	#facebook {
	width: auto;
	height: 35px;
	line-height: 35px;
	padding-left: 10px;
	top: -85px;
	left: 0;
	margin: 0 0 0 35px ;
	
	
}
	
	#icon-mail {
	width: 35px;
	height: 35px;
	background-size: contain;
	top: -100px;
}


	#mail {
	width: auto;
	height: 35px;
	line-height: 35px;
	margin:0 0 0 35px;
	top: -135px;
	}
	
	
	#contacto {
	
	width:90%;
	height:450px;
	margin:auto;
	position:relative;
	top:130px;
		padding-left: 10px;
	padding-right: 10px;
	}
	
		
	} /*FIN Responsivo 600*/



@media (min-width:601px) and (max-width:1024px){ /*INICIO RESPONSIVO 601PX-1024px*/
	
	
	
	
	#titulo {
		top: 100px;
		line-height: 50px;
		width: 50%;
	}
	
	
	
		#datos {
	
	width: 50%;
	height: 200px;
	top: 110px;
	
}
	
	
	
	#icon-tel {
	background-size: contain;
	width: 35px;
	height: 35px;
	
}

	#telefono {
	width: auto;
	height: 35px;
	line-height: 35px;
	margin:0 0 0 35px;
	top: -35px;
	
	
}
	
	
	#icon-cel {
	width: 35px;
	height: 35px;
	background-size: contain;
	top:-25px;
	left: 0px;
	
}


	#celular {
	width: auto;
	height: 35px;
	line-height: 35px;
	margin:0 0 0 35px;
	top: -60px;
	left: 0;
	}
	
	
	#icon-tw {
	width: 35px;
	height: 35px;
	top: -75px;
	background-size: contain;
	
}

	#twitter {
	width: auto;
	height: 35px;
	line-height: 35px;
	padding-left: 10px;
	top: -110px;
	margin: 0 0 0 35px ;
	
}
	
	
	#icon-fb {
	width: 35px;
	height: 35px;
	top:-50px;
	left: 0px;
	background-size: contain;
	
}


	#facebook {
	width: auto;
	height: 35px;
	line-height: 35px;
	padding-left: 10px;
	top: -85px;
	left: 0;
	margin: 0 0 0 35px ;
	
	
}
	
	#icon-mail {
	width: 35px;
	height: 35px;
	background-size: contain;
	top: -100px;
}


	#mail {
	width: auto;
	height: 35px;
	line-height: 35px;
	margin:0 0 0 35px;
	top: -135px;
	}
	
	
	
	
	#contacto {
	
	width:450px;
	height:450px;
	margin:auto;
	position:relative;
	top:130px;
	padding-left: 10px;
	padding-right: 10px;
	}
	
}