@charset "utf-8";
/* CSS Document */


body {
  	background-color: #f6f4f5;
	background-image: url('../images/padrao.png');	
	background-attachment: fixed;
	
	font-family: 'Montserrat', sans-serif;
}

.portuga{
	width: clamp(35em, 35em + 35vw, 1.5em);
	height: clamp(35em, 35em + 35vw, 1.5em);
	
	text-align: center;
		
	background-color: #0f4777;
	border-radius: 50%;
	position: absolute;
  	top: -220px;
	z-index: -1;
	left: 80px;
}

.portuga .logo{
	transform: translate(0, 320%);
  	margin: auto;
	width: 65%;

}

.slogan{
	width: clamp(20em, 20em + 20vw, 1.5em);
	height: clamp(20em, 20em + 20vw, 1.5em);
	text-align: center;
	font-family: "Poppins", sans-serif;
  	font-weight: 700;
	color: #0f4777;
	
	background-color: #f8b80a;
	border-radius: 50%;
	position: absolute;
  	top: 30px;	
	right: 250px;
	z-index: -1;
}

.slogan p{	
	transform: translate(0, 70%);
  	margin: auto;
	font-size: clamp(1em, 1em + 1vw, 1.5em);
	
}

.desk .content{
	margin: auto;
  	display: block;
	margin-top: 150px;
}

.pack {
  	margin: auto;
  	display: block;
	width: 55%;
}

.marcas{
	margin: auto;
  	display: block;
	width: 35%;
}

.desk .content .links{ text-align: center; margin: 30px 0;}

.desk .content button{
	border-radius: 50px;
	padding: 10px 0px;
	width: 280px;
	
	font-family: "Poppins", sans-serif;
  	font-weight: 700;
	font-size: 1.2rem;	
	color: #58595c;
	cursor: pointer;
}

.desk .content .instagram{border: 2px solid #0b4777;}
.desk .content button .fa-instagram{ color: #fbba00; font-size: 2rem !important;}
.desk .content .whatsapp{border: 2px solid #3eab37!important;}
.desk .content button .fa-whatsapp{ color: #3eab37; font-size: 2rem !important;}

a {text-decoration: none;}


.footer{
	width: 100%;
	position: static;
	bottom: 0px;
	justify-content: center;
	text-align: center;	
}
.content-footer{
	font-family: "Poppins", sans-serif;
  	font-weight: 600;
	color: #58595c;
	font-size: clamp(0.8em, 0.8em + 0.8vw, 1.3em);
	align-items: center;

}




@media (max-width:480px) {	
	
	.portuga{top: -200px; width: clamp(30em, 30em + 30vw, 1em); height: clamp(27em, 27em + 27vw, 1em); left:0px;}
	.portuga .logo{transform: translate(0, 400%);  width: 50%; }
	
	.desk .content{margin-top: 250px;}
	
	.slogan{ width: clamp(13em, 13em + 13vw, 1.0em); height: clamp(13em, 13em + 13vw, 1.0em); right: 15px; top: 115px;	font-weight: 600;}
	.slogan p{ transform: translate(0, 40%); font-size: clamp(1em, 1em + 1vw, 1.2em);}
	
	
	.pack { display: block; right: 0; top: 0%;	width: 90%;	}
	
	.marcas{ margin: auto; display: block; width: 85%; padding-top: 15px;}
	
	
	.desk .content .links{ text-align: center; margin: 10px 0 40px 0;}
	.desk .content button{padding: 10px 0px; width: 250px; font-size: 1.0rem; margin-top: 20px;}	
	.desk .content button .fa-instagram{ font-size: 1.5rem !important;}
	.desk .content button .fa-whatsapp{ font-size: 1.5rem !important;}
	
	/*.footer, .content-footer{ position:absolute; font-size: 14px; bottom: 0px; text-align: center;}*/
	.footer, .content-footer{ position:static; font-size: 14px; bottom: 0px; text-align: center;}
	
}

/*@media screen and (min-width: 481px) and (max-width:768px) {	
	body {background-position: -140px 0px;}
	.pack { display: block; right: 0; top: 8%;	width:90%;	}
	.content-main {transform: translate(15%, 0%);}
	.content-main .title{ font-size: 28px;}
	.content-main img{ width: 359px}
	.content-main .coments{ font-size: 23px; font-weight: bold; width: 300px;}
	.footer, .content-footer{display:block; padding: 0px 0 5px 0;}
	
}*/

@media screen and (min-width: 769px) and (max-width:1366px) {	
	.portuga .logo{transform: translate(0, 400%); margin: auto; width: 60%;}
	.portuga{top: -270px; width: clamp(30em, 25em + 25vw, 1.5em); height: clamp(32em, 25em + 25vw, 1.5em);left: 100px;}
	
	body {background-position: 40px 0px;}
	
	.desk .content{margin-top: 90px;}
	
	.slogan{ width: clamp(18em, 18em + 18vw, 1.0em); height: clamp(18em, 18em + 18vw, 1.0em); right: 105px;}
	.slogan p{ transform: translate(0, 60%);}
	
	.marcas{ margin: auto; display: block; width: 35%;}
	
	.desk .content button{padding: 5px 0px; width: 250px; font-size: 1.0rem;}	
	.desk .content button .fa-instagram{ font-size: 1.5rem !important;}
	.desk .content button .fa-whatsapp{ font-size: 1.5rem !important;}
	
	
	.content-footer{ font-size: clamp(0.5em, 0.5em + 0.5vw, 1.5em);}
		
	.pack { display: block; right: 0; top: 10%;	width:50%;	}
	
	.footer, .content-footer{ padding: 10px 0 5px 0;}
	
}