.titular_contacto{
	position:relative;
	margin:0px;
	padding:0px;
	width:100%;
	height:70%;
	background-image:linear-gradient(90deg, rgba(0, 60, 111, 0.8) 0%, rgba(0, 60, 111, 0) 100%), url(../img/contacto/banner.jpg);
  	background-attachment:fixed;
	background-position:50% 0;
	background-repeat:no-repeat;
	background-size:cover;
}



@media(max-width:1023px){
	.titular_contacto{height:50%; height:250px; background-attachment:inherit;}
}



.titular_contacto .titulo{
	position:absolute;
	top:50%;
	left:inherit;
	transform:translate(0%,-50%);
	margin: 0px;
    padding: 0px 16px;
}



.titular_contacto .titulo h1{
	margin:0px;
    padding:0px;
    font-family:'Roboto', sans-serif;
	font-weight:700;
    font-size:3rem;
	letter-spacing:3px;
    color:white;
}



@media(max-width:1023px){
	.titular_contacto .titulo h1{font-size:2rem; letter-spacing:2px;}
}



#disposicion-contacto{
	width:50%;
    margin:64px 0px;
    padding:0px;
    background-color:white;
    margin-left:auto;
    margin-right:auto;
}



@media screen and (max-width:680px){
	#disposicion-contacto{width:100%; margin:32px 0px 0px;}
}



#contacto{
	width:100%;
}



#contacto form{
	margin:16px 0px;
	padding:0px 16px;
}



.row:after{
	display:table;
  	content:"";
  	clear:both;
}



.col-25{
	width:25%;
  	float:left;	
  	margin:4px 0px;
}



.col-75{
	display:flex;
	width:75%;
  	float:left;
	margin:4px 0px;
  	flex-direction:row-reverse;
  	justify-content:flex-end;
}



@media screen and (max-width:1023px){
  	.col-25, .col-75{width:100%;}
}



label{
	position:relative;
	display:inline-block;
	margin:0px;
  	padding:12px 0px;	
	text-align:left;
	font-family:'Roboto', sans-serif;
	font-weight:700;
	font-size:1rem;
	color:#666;
}



@media screen and (max-width:1023px){
  	label{padding:8px 0px;}
}



.col-75 .fas{
	position:absolute;
	width:45px;
	height:41px;
	padding:11px;
	background-color:#bbb;
	border-radius:5px 0px 0px 5px;
	text-align:center;
	font-size:1.2rem;
	color:white;
}



.col-75 .fa-comment{
	height:116px;
}



input[type=text], input[type=email], textarea{
  	width:100%;
	margin:0px;
  	padding:12px 12px 12px 56px;
  	border:1px solid #bbb;
  	border-radius:5px;
	font-family:'Roboto', sans-serif;
	font-weight:400;
	font-size:0.8rem;
	outline:none;
}



textarea{
	resize:none;
}



input[type=text]:focus, input[type=email]:focus, textarea:focus{
	border:1px solid rgb(255, 191, 63);
}



input[type=text]:focus + .fas, input[type=email]:focus + .fas, textarea:focus + .fas{
	background-color:rgb(255, 191, 63);
}



input[type=submit]{
	float:right;
	margin:16px 0px 0px;
  	padding:12px 36px;
  	background-color:rgb(255, 191, 63);
	border:none;	
	border-radius:5px;
	font-family:'Roboto', sans-serif;
	font-weight:700;
	font-size:1rem;
  	color:white;
	letter-spacing:1px;
  	cursor:pointer;
	outline:none;
}



@media screen and (max-width:1023px){
  	input[type=submit]{width:100%; margin:16px 0px;}
}



.respuesta{
	display:none;
	position:fixed;
	bottom:10px;
    left:10px;
	margin:0px;
	padding:15px;
	text-align:center;
	font-family:'Roboto', sans-serif;
	font-weight:700;
    font-size:1.2rem; 
	color:white;
}



@media screen and (max-width:680px){
  	.respuesta{bottom:0px; left:0px; font-size:1rem;}
}