#formulario {
	width: 100%;
	margin-top: 50px;
	background-color: rgba(100, 100, 100, 0.3);
}
#contact-form {
	max-width: 1000px;
	margin: 0 auto;
	background: rgba(64, 85, 127, 0.2);
}
#contact-form > h1 {
	width: 470px;
	padding-left: 10px;
}
#contact, label, input[name="submit"] {
	position: relative;
}

label > span, input, textarea, button {
	box-sizing: border-box;
}
label {
	display: block;
}
label > span {
	display: none;
}
input, textarea, button, aside {
	width: 100%;
	padding: 0.5em;
	border: none;
}
input[type="text"], input[type="email"], textarea {
	margin: 0 0 1em;
	border: 1px solid #ccc;
	outline: none;
}
input.invalid, textarea.invalid {
	border-color: #d5144d;
}
textarea {
	height: 6em;
}
input[type="submit"], button {
	background: #40557F;
	color: white;
}
input[type="submit"]:hover, button:hover {
	background: #09325B;
	cursor: pointer;
}
aside > p {
	font-size: 14px;
	width: 600px;
	text-align: center;
}
aside > p.invalid {
	color: #d5144d;
}
@media screen and (min-width: 30em) {
	#contact-form h1, h3 {
		margin-left: 26.3736%;
	}
	label > span {
		vertical-align: top;
		display: inline-block;
		width: 26.3736%;
		padding: 0.5em;
		border: 1px solid transparent;
		text-align: right;
	}
	input, textarea, button, aside {
		width: 73.6263%;
		line-height: 1.5;

	}
	textarea {
		height: 10em;
	}
	input[type="submit"], button {
		margin-left: 26.3736%;
	}
}
@media screen and (min-width: 48em) {
	#contact-form {
		text-align: justify;
		line-height: 0;
	}
	#contact-form:after {
		content: '';
		display: inline-block;
		width: 100%;
	}
	#contact-form h1, h3 {
		margin-left: 17.2661%;
	}
	#contact-form form, #contact-form aside {
		vertical-align: top;
		display: inline-block;
		width: 65.4676%;
		text-align: left;
		line-height: 1.5;
	}
	#contact-form aside {
		width: 30.9353%;
		vertical-align: bottom;

	}
}
.relleno {
	width: 100%;
	height: 20px;
}
