#mod8 {
	position: relative;
	margin: 15vh auto 0px auto;
	width: 100%;
}

#mod8 > div {
	position: absolute;
	top: 50vh;
	left: -100%;
	padding: 1.5% 3%;
	color: #ffffff;
	border-radius: 0px 10px 10px 0px;
	opacity: 0%;
	background-color: #000000;
}

#mod8 > div > span:nth-child(1) {
	color: #ff0000;
	font-weight: 600;
}

#mod8 > div > span:nth-child(2) {
	font-weight: 600;
}

#mod8 > div > span:nth-child(3) {
	display: block;
	font-size: 0.8rem;
}

#mod8 > div > span:nth-child(3) > span {
	font-weight: 600;
}

#mod8 article {
	display: grid;
	grid-template-columns: repeat(20, 1fr);
	column-gap: 2%;

	margin: 0px auto;
	width: 100%;
	max-width: 1080px;
}

#mod8 h2 {
	grid-column: 1 / 21;
	margin-top: 0px;
	font-size: 4rem;
	text-transform: uppercase;
}

#mod8 form {
	grid-column: 1 / 21;

	display: grid;
	grid-template-columns:inherit;
	column-gap: 2%;

	position: relative;
	width: 100%;
	border-radius: 20px;
}

#mod8 form input, #mod8 form textarea {
	margin-bottom: 9%;
	padding: 5% 10%;
	font-size: 1rem;
	font-family: inherit;
	font-weight: 600;
	color: #000000;
	border: 1px solid #000000;
	border-radius: 30px;
}

#mod8 form input[name="nome"], #mod8 form input[name="celular"] {
	grid-column: 3 / 11;
}

#mod8 form input[name="sobrenome"], #mod8 form input[name="outroTelefone"] {
	grid-column: 11 / 19;
}

#mod8 form input[name="email"], #mod8 form textarea, #mod8 form input[name="enviar"] {
	grid-column: 3 / 19;
	margin-bottom: 4.5%;
	padding: 2.5% 5%;
}

#mod8 form textarea {
	grid-column: 3 / 19;
	margin-bottom: 1%;
	padding: 2.5% 5%;
	height: 30vh;
	min-height: 100px;
}

#mod8 form label {
	grid-column: 3 / 19;
	margin-bottom: 4.5%;
	font-size: 0.8rem;
}

#mod8 form input[name="enviar"] {
	margin-bottom: 0px;
	color: #ffffff;
	background-color: #000000;
}

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

	#mod8 {
		margin-top: 7.5vh;
	}

	#mod8 > div {
		padding: 4% 8%;
	}

	#mod8 article {
		padding: 0px 10%;
		width: 80%;
	}

	#mod8 h2 {
		font-size: 2rem;
	}

	#mod8 form input {
		margin-bottom: 6%;
		padding: 5% 10%;
	}

	#mod8 form input[name="nome"], #mod8 form input[name="celular"] {
		grid-column: 1 / 21;
	}

	#mod8 form input[name="sobrenome"], #mod8 form input[name="outroTelefone"] {
		grid-column: 1 / 21;
	}

	#mod8 form input[name="email"], #mod8 form input[name="enviar"] {
		grid-column: 1 / 21;
		margin-bottom: 6%;
		padding: 5% 10%;
	}

	#mod8 form input {
		border-radius: 50px;
	}

	#mod8 form textarea {
		grid-column: 1 / 21;
		margin-bottom: 1%;
		padding: 5% 10%;
		border-radius: 20px;
	}

	#mod8 form label {
		grid-column: 1 / 21;
		margin-bottom: 4.5%;
	}

}

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

	#mod8 > div {
		padding: 6% 9%;
	}

	#mod8 form input {
		margin-bottom: 9%;
		padding: 7.5% 10%;
		font-size: 1rem;
	}

	#mod8 form input[name="email"], #mod8 form input[name="enviar"] {
		margin-bottom: 9%;
		padding: 7.5% 10%;
	}

	#mod8 form textarea {
		margin-bottom: 1%;
		padding: 7.5% 10%;
		border-radius: 20px;
	}

	#mod8 form label {
		margin-bottom: 6%;
	}
}