@font-face {
  font-family: 'HelveticaNeueLT Com 55 Roman';
  src: url(fonts/HelveticaNeueLTCom-Roman.woff);}
@font-face {
  font-family: 'HelveticaNeueLT Com 75 Bold';
  src: url(fonts/HelveticaNeueLTCom-Bd.woff);}



* {font-family: 'HelveticaNeueLT Com 55 Roman'; margin: 0; box-sizing: border-box;}

body {position: relative;}

p {font-size: 15px;}

header {background-color: #87319a; padding: 2em 0 1.5em;}
header img {margin-right: 3em;}
.login {float: right; color: #fff; padding-top: 15px; position: relative; padding-right: 15px;z-index: 1;}
.login span {color: #80bd01; text-transform: uppercase; font-weight: 700;}
.login::after {position: absolute; content: ""; top: 18px; right: 0;
	width: 0; 
    height: 0; 
    border-top: 6px solid #fff;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;}

.lupa {position: absolute; bottom: 30px; right: 0; width: 550px;}

main {background-color: #eee; padding: 6em 0;}
main h1 {text-transform: uppercase; margin-bottom: 1em; font-family: 'HelveticaNeueLT Com 75 Bold';}
main h2 {color: #87319a; margin-top: 40px; margin-bottom: 2em;}
main h2:first-child {margin-top: 0;}
main h3 {text-transform: uppercase; font-size: 14px; margin-top: 25px; margin-bottom: 10px; font-family: 'HelveticaNeueLT Com 75 Bold';}
main p {margin-bottom: 3em; color: #777;}

.container {max-width: 1200px; margin: 0 auto; width: 100%; padding: 0 30px;}

.formulario	{width: 60%;}
label {background-color: #666; float: left; color: #fff; font-weight: 400; text-transform: uppercase; margin-right: 1%; width: 29%;}
input {background-color: #fff; width: 70%; }
label, input {border: 0; height: 42px; padding: 14px 15px 16px; margin-bottom: 10px; font-size: 15px;}
.button {text-align: right;}
button {text-transform: uppercase; color: #fff; background-color: #80bd01; padding: 15px 20px 10px; font-size: 14px; border: 0; margin-top: 1em; transition: all 0.3s ease;}
button:hover {background-color: #87319a;}
footer p {padding: 2em 0; font-size: 12px;}
select {    
  width: 100%;
  background-color: #fff;
  border: 0; 
  border-radius: 0;
  font-size: 14px;
  height: 42px;
  padding: 0;}

.tres-uno h2 {margin-bottom: 15px;}
.tres-uno p {margin-bottom: 5px;}
.tres-uno div {border-left: 3px solid #87319a; padding: 25px 30px 20px; background-color: #fff; margin-bottom: 3em; width: 60%;}
.tres-uno div h3:first-child {margin-top: 0;}

.cuatro {overflow:hidden;}
.cuatro label {text-transform: none; width: 49%;}
.cuatro select {background-color: #fff; width: 50%; border: 0; height: 42px; padding: 0; margin-bottom: 10px; }
.cuatro input {width: 50%;}
.cuatro .ancho-completo  select {width: 100%;}
textarea {width: 100%; height: 120px; border: 0; padding: 10px; font-size: 15px;}

.formulario img.linea-facil {width: 100%; padding: 0; border-radius: 0; border: 0;margin-bottom: 3em;}


/* ESTILOS NUEVOS */

.tres-uno {margin-top: 3em;}
.tres-uno div h3 {color: #000;}
.tres-uno div {transition: all 0.3s ease;}
.tres-uno div:hover {background-color: #f9f9f9;}
.cinco .button {text-align: left;}
.formulario img {border: 1px solid #ccc; border-radius: 5px; padding: 20px; background-color: #fff; float: right;}
.nuevo-ocultar label {width: 89%;}
.nuevo-ocultar select {width: 10%}


@media only screen and (max-width: 600px) {

	.formulario div {margin-bottom: 25px;}
	label, input, .cuatro label, .cuatro input, select, .cuatro select, .nuevo-ocultar label, .nuevo-ocultar select {width: 100%; float: none; margin: 0 0 5px; display: block;}
	button {width: 100%;}
	.nuevo-ocultar label {height: 60px;}

}

a.gracias {text-transform: uppercase; color: #fff; background-color: #80bd01; padding: 15px 20px 10px; font-size: 14px; border: 0; margin-top: 1em; transition: all 0.3s ease;text-decoration:none;}
a.gracias:hover {background-color: #87319a;}
.tres-uno ul li {color: #777;}


/* FIN ESTILOS NUEVOS */









@media only screen and (max-width: 1024px) {

	.lupa {width: 350px;}

}


@media only screen and (max-width: 768px) {

	.lupa {display: none;}
	.formulario, .tres-uno div {width: 100%;}

}