@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100&display=swap');
@import url('../fonts/stylesheet.css');

body{
	overflow-x: hidden;
	font-size: 1em;
	font-family: Montserrat, sans-serif;
}

#page-extratora {
	max-width: 1220px;
	margin: 0px auto;
	position: relative;
	overflow-x: hidden;
}

.relative {
	position: relative;
}
.p1 {
	font-weight: 800;
	font-size: 2.5em;
}
.p2 {
	font-size: 1.5em;
}
.p3 {
	font-size: 1.3em;
}
.p4 {
	font-size: 1.2em;
	padding-bottom: 2px;
}
.p5 {
	font-size: 1.0em;
}
.p6 {
	font-weight: 800;
	font-size: 2.5em;
}
.p7 {
	font-size: 1.3em;
}
.p8 {
	font-weight: 800;
	font-size: 1.9em;
}
.p9 {
	font-size: 1.4em;
	padding-top: 15px;
}
.img-bg {
	width: 100%;
	height: auto;
	padding-top: 15px;
}

p {
	line-height: 1;
}
.bloco-segundo p {
    text-align: left;
    margin: 0px;
}

.nome-produto {
	background: rgba(255, 255, 255, 0.5);
	position: absolute;
	padding: 15px;

}
.receitas {
	position: absolute;
	padding: 15px;

}

.processador {
    position: absolute;
    width: 85%;
    top: -10%;
}
.processador-segundo {
    position: relative;
    width: 70%;
    top: 11px;
    left: 113px;
}
.britaniar-segundo {
	height: 607px;
	border-radius: 10px;
	background-color: #cc9832;
}
.bloco {
	width: 247px;
	height: 247px;
	background-color: #FFF;
	box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.11);
	border-radius: 10px;
	margin: 5px;
	text-align: center;
	padding: 40px 10px 10px 10px;
}
.bloco-segundo {
	width: 439px;
	height: 250px;
	background-color: #FFF;
	box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.11);
	border-radius: 10px;
	margin: 5px;
	text-align: center;
	padding: 65px 40px 40px 40px;
}
.bloco p {
	margin: 0px;
	padding: 0px;
}
.icones {
	align-items: center;
	padding-bottom: 15px;
}
.icones-segundo {
	float: left;
    padding-right: 20px;
}
.tamanho-bloco {
    height: 50%;
    top: 20%;
    left: 2%;
}
.tamanho-bloco-segundo {
    height: 500px;
    top: 115px;
    left: -47px;
}
#intro {
	background: url('../img/bg-intro.png') no-repeat center center;
	background-size: cover;
	height: 755px;
	padding: 50px;
	padding-top: 0px;

}

#intro .processador-intro {
	margin-top: 40px;
}

#nome-produto {
	background: rgba(255, 255, 255, 0.7);
	padding: 50px 0px;
}
#receitas {
	background: rgba(255, 255, 255, 0.7);
	padding: 80px 0px;
	text-align: center;
	height: 755px;
}
.nome-produto h1 {
	color: #002441;
	margin: 0px;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 2.2em;
}

.nome-produto h2 {
	color: #cd9a33;
	margin: 0px;
	text-transform: uppercase;
	font-weight: 300;
	font-size: 2.2em;
}

.nome-produto h3 {
	color: #cd9a33;
	margin: 0px;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 2.2em;
}

#detalhes {
	height: 755px;
}
#detalhes-segundo {
	height: 755px;
}

.info-detalhe {
	color: #FFF;
	padding: 30px;
}

.info-detalhe h5 {
	color: #cc9832;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 1.5em;
}

#potencia {
	background: #002441;
	color: #FFF;
	padding: 50px 0px;
}

.info-potencia {
	margin-top: 15px;
}

#capacidade {
	background: #FFF;
	padding-bottom: 30px;
}

.info-capacidade {
	color: #002441;
	text-transform: uppercase;
	font-size: 1.3em;
	font-weight: 700;
	margin-top: 25px;
}

.info-capacidade h4 {
	color: #cd9a33;
	font-weight: 800;
	font-size: 2em;
}

.feature {
	color: #002441;
	font-weight: 400;
	line-height: 1em;
	margin: 15px 0px 0px 0px;
}

.feature h5 {
	font-weight: 800;
	font-size: 1.2em;
}

footer {
	padding: 20px 0px;
	position: relative;
	z-index: 5;
}

.nota-footer {
	color: #152942F;
	font-size: 0.6em;
	font-weight: 400;
	text-align: center;
	margin-top: 20px;
}


/*------------------------------------------------------------------
---------------------------- RESPONSIVO ----------------------------
--------------------------------------------------------------------*/

@media (min-width: 360px) {


	.nome-produto {
		top: 700px;
		margin:  0;
		font-size: 0.9em;
	}
	#intro {
		height: 900px;
	}
	.bloco {
		width: 150px;
		height: 150px;
		background-color: #FFF;
		box-shadow: 5px 5px 30px rgb(0 0 0 / 11%);
		border-radius: 10px;
		margin: 5px;
		text-align: center;
		padding: 5px;
	}
	.icones {
		align-items: center;
		padding-bottom: 5px;
		width: 35%;
		padding-top: 15px;
	}
	.p1 {
		font-weight: 800;
		font-size: 1.5em;
	}
	.p2 {
		font-size: 1.0em;
	}
	.p3 {
		font-size: 1.0em;
	}
	.p4 {
		font-size: 1.0em;
		padding-bottom: 2px;
	}
	.p6 {
		font-weight: 800;
		font-size: 1.5em;
	}
	.p7 {
		font-size: 1.0em;
	}
	.tamanho-bloco {
		height: 40%;
		top: 5%;
		left: 0;
	}
	.processador {
		position: absolute;
		width: 50%;
		top: -70%;
		left: 25%;
	}
	#receitas {
		background: rgba(255, 255, 255, 0.7);
		padding: 0px;
		text-align: center;
		height: 100%;
	}
	.tamanho-bloco-segundo {
		top: 25px;
		left: 0;
		height: 380px;
	}
	#detalhes-segundo {
		height: 430px;
	}
	.icones-segundo {
		float: left;
		padding-right: 20px;
		padding-bottom: 20px;
		width: 45%;
	}
	.p8 {
		font-weight: 800;
		font-size: 1.3em;
	}
	.bloco-segundo {
		width: 439px;
		height: 170px;
		background-color: #FFF;
		box-shadow: 5px 5px 30px rgb(0 0 0 / 11%);
		border-radius: 10px;
		margin: 5px;
		text-align: center;
		padding: 30px;
	}
	.britaniar {
		width: 60%;
	}
	.britaniar-segundo {
		height: 200px;
		border-radius: 10px;
		background-color: #cc9832;
	}
	.p5 {
		font-size: 0.9em;
	}
}
@media (min-width: 414px) {


	.nome-produto {
		top: 800px;
		margin:  0;
		font-size: 0.9em;
	}
	#intro {
		height: 1000px;
	}


}


@media (min-width: 768px) {

	.nota-footer {
		text-align: left;
		margin-top: 0px;
	}

	#intro {
		padding: 0px 0px;
		height: 755px;
	}

	#intro .processador-intro {
		position: absolute;
		top: 2px;
		left: 50px;
		z-index: 5;
		margin:  0;
	}
	
	#intro .britaniar-intro {
		position: absolute;
		top: -130px;
		right: 51px;
		margin:  0;
	}
	
	.nome-produto {
		top: 400px;
		right: -310px;
		margin:  0;
		font-size: 1.0em;
	}

	.info-potencia {
		font-size: 1.5em;
	}
	.processador {
		position: absolute;
		width: 90%;
		top: -9%;
		left: -25px;
	}
	#detalhes {
		height: 468px;
	}
	
	.tamanho-bloco {
		height: 40%;
		top: 15%;
		left: 0;
	}
	.processador-segundo {
		position: relative;
		width: 70%;
		top: 11px;
		left: 72px;
	}
	.icones-segundo {
		float: left;
		padding-right: 20px;
		padding-bottom: 20px;
		width: 35%;
	}
	.britaniar-segundo {
		height: 300px;
		border-radius: 10px;
		background-color: #cc9832;
	}


}

@media (min-width: 992px) {

	#intro .processador-intro {
		top: 1px;
		left: 212px;
	}

	.info-detalhe {
		font-size: 1.5em;
	}

}

@media (min-width: 1100px) {

	#intro .processador-intro {
		top: -12px;
		left: 248px;
	}

	.info-potencia {
		padding-top: 25px;
	}

	.nome-produto {
		top: 450px;
		right: -390px;
		margin:  0;
		font-size: 1.2em;
	}
	#intro {
		height: 755px;
	}
	#detalhes {
		height: 755px;
	}
	#detalhes-segundo {
		height: 755px;
	}
	.bloco {
		width: 247px;
		height: 247px;
		background-color: #FFF;
		box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.11);
		border-radius: 10px;
		margin: 5px;
		text-align: center;
		padding: 40px 10px 10px 10px;
	}
	.bloco-segundo {
		width: 439px;
		height: 250px;
		background-color: #FFF;
		box-shadow: 5px 5px 30px rgba(0, 0, 0, 0.11);
		border-radius: 10px;
		margin: 5px;
		text-align: center;
		padding: 65px 40px 40px 40px;
	}
	.bloco p {
		margin: 0px;
		padding: 0px;
	}
	.icones {
		align-items: center;
		padding-bottom: 15px;
	}
	.icones-segundo {
		float: left;
		padding-right: 20px;
	}
	.tamanho-bloco {
		height: 50%;
		top: 20%;
		left: 2%;
	}
	.tamanho-bloco-segundo {
		height: 500px;
		top: 115px;
		left: -47px;
	}
	.p1 {
		font-weight: 800;
		font-size: 2.5em;
	}
	.p2 {
		font-size: 1.5em;
	}
	.p3 {
		font-size: 1.3em;
	}
	.p4 {
		font-size: 1.2em;
		padding-bottom: 2px;
	}
	.p5 {
		font-size: 1.0em;
	}
	.p6 {
		font-weight: 800;
		font-size: 2.5em;
	}
	.p7 {
		font-size: 1.3em;
	}
	.p8 {
		font-weight: 800;
		font-size: 1.9em;
	}
	.p9 {
		font-size: 1.4em;
		padding-top: 15px;
	}
	.processador-segundo {
		position: relative;
		width: 70%;
		top: 11px;
		left: 113px;
	}
	.britaniar-segundo {
		height: 607px;
		border-radius: 10px;
		background-color: #cc9832;
	}
}