/* inicio */

	#inicio {
		position: relative;
		width: 100vw;
		padding: 0 0 10rem 0;
	}

		#inicio:before {
			background-attachment: fixed;
			background-color: #FF00BF;
			background-position: -50% 10%;
			background-repeat: repeat-y;
			background-size: 25% auto;
			content: '';
			display: block;
			height: 77%;
			left: 0;
			position: absolute;
			top: 0;
			width: 40vw;
			z-index: -1;
			
		}

	#inicio section {
			display: grid;
			grid-template-columns: 40vw 60vw;
		
		}
		
	
	#inicio > section.intro {
				align-items: center;
		}
@media screen and (max-width: 1152px) {

			#inicio > section.intro > header > * {
				width: 100%;
			}

			#inicio > section.intro > header:before {
				margin-left: 0;
			}

		}
		
@media screen and (max-width: 1280px) {

			#inicio {
				padding: 0 0 8rem 0;
			}

				#inicio section {
					margin: 6rem 0 0 0;
				}

					#inicio section > header {
						padding: 0 8rem 0 4rem;
						width: 33rem;
					}

					#inicio section > .content {
						padding: 0 4rem;
					}

					#inicio section > footer {
						padding: 0 8rem;
					}

				#inicio > section > header:before {
					height: calc(100% + 8rem);
					left: calc(50vw - 4rem);
				}

				#inicio > section > header h1:before, #wrapper > section > header h2:before {
					right: -4rem;
					width: 2rem;
				}

				#inicio > section > header h1:after, #wrapper > section > header h2:after {
					right: -2rem;
				}

				#inicio > section > .content > section {
					left: calc(-50vw - 4rem);
				}

					#inicio > section > .content > section > header {
						width: 30rem;
					}

				#inicio > section.intro > header > * {
					width: 21rem;
				}

				#inicio > section.intro > header:before {
					margin-left: calc(50vw - 8rem);
				}

		}

		
		

/* Form */

	form {
		margin: 0 0 2rem 0;
	}
  
		form > :last-child {
			margin-bottom: 0;
		}

		form > .fields {
			display: -moz-flex;
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
			-moz-flex-wrap: wrap;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			margin: -2rem 0 2rem -2rem;
			width: calc(50% + 4rem);
		}

			form > .fields > .field {
				-moz-flex-grow: 0;
				-webkit-flex-grow: 0;
				-ms-flex-grow: 0;
				flex-grow: 0;
				-moz-flex-shrink: 0;
				-webkit-flex-shrink: 0;
				-ms-flex-shrink: 0;
				flex-shrink: 0;
				padding: 2rem 0 0 2rem;
				width: calc(50% - 2rem);
			}

				form > .fields > .field > :last-child {
					margin-bottom: 0;
				}

				form > .fields > .field.half {
					width: calc(50% - 1rem);
				}

				form > .fields > .field.third {
					width: calc(50%/3 - 0.66667rem);
				}

				form > .fields > .field.quarter {
					width: calc(25% - 0.5rem);
				}

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

			form > .fields {
				margin: -1.5rem 0 2rem -1.5rem;
				width: calc(50% + 3rem);
			}

				form > .fields > .field {
					padding: 1.5rem 0 0 1.5rem;
					width: calc(50% - 1.5rem);
				}

					form > .fields > .field.half {
						width: calc(50% - 1.5rem);
					}

					form > .fields > .field.third {
						width: calc(50% - 1.5rem);
					}

					form > .fields > .field.quarter {
						width: calc(50% - 1.5rem);
					}

		}

	input[type="text"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		border-radius: 0.325rem;
		border: solid 2px rgba(144, 144, 144, 0.25);
		color: inherit;
		display: block;
		outline: 0;
		padding: 0 1rem;
		text-decoration: none;
		width: 50%;
	}

		input[type="text"]:invalid,
		select:invalid,
		textarea:invalid {
			box-shadow: none;
		}

		input[type="text"]:focus,
		select:focus,
		textarea:focus {
			border-color: #2ee4bb;
		}

	label {
		color: #000000;
		display: block;
		font-family: "Raleway", Helvetica, sans-serif;
		font-size: 0.75rem;
		font-weight: 600;
		letter-spacing: 0.175em;
		line-height: 1.75;
		margin: 0 0 1rem 0;
		text-transform: uppercase;
	}

	input[type="text"] {
		height: 3rem;
	}