html,
body {
padding: 0;
margin: 0;
scroll-behavior: smooth;
height: 100vh;
width: 100vw;
font-family: 'Inter', sans-serif !important;
background-color: #fff;
color: #424242;
overflow:inherit;
overflow-x: hidden;
scrollbar-width: thin;/* "auto" or "thin" */
scrollbar-color: #424242 #E1E1E1;/* scroll thumb and track */
}
a, a:visited, a:active, a:any-link, a:default, a:focus, a:hover{
color: #424242;
font-family: 'Inter', sans-serif !important;
text-decoration: none;
text-decoration-line: none;
}
html::-webkit-scrollbar {
z-index: 9999999999999999 !important;
width: 12px; /* width of the entire scrollbar */
}
html::-webkit-scrollbar-track {
background: #E1E1E1; /* color of the tracking area */
}
html::-webkit-scrollbar-thumb {
background-color: #EC6819;
border-radius: 6px !important;
border: 2px solid #E1E1E1;
}
.collapse{
border: none !important;
}
article{
height: auto;
width: 100vw;
padding: 100px;
background-color: #fff;
}
span{
font-size: 12pt;
}
h1{
font-size: 18pt;
margin-bottom: 30px;
}
h4{
text-align: center;
}
.texto{
padding: 60px 60px 60px 120px;
}
.bg {
width: 100vw;
background-image: url('../images/banner.jpg');
height: 100vh;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
margin-top: -6.5%;
}
.bg-contato{
width: 100vw;
background-image: url('../images/contato.jpg');
height: 800px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.marca{
background-image: url('../images/marca.svg');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
width: 20%;
height: 20%;
position: relative;
top: 40%;
left: 40%;
}
.faixa{
padding: 50px;
margin: auto;
text-align: center;
position: relative;
color: #fff;
height: auto;
}
.laranja{
background-color: #EC6819;
}
.verde{
background-color: #96A522;
}
.branco{
background-color: #fff;
color: #000;
}
.borda-laranja{
border-top: solid 10px #EC6819;
}
.borda-verde{
border-top: solid 10px #96A522;
}
.borda-azul{
border-top: solid 10px #0B5060;
}
.borda-marrom{
border-top: solid 10px #392500;
}
.seta{
margin: auto;
width: 40px;
height: 40px;
background-image: url('../images/seta.svg');
background-size: contain;
background-repeat: no-repeat;
}
.imagem-01{
height: 40vh;
width: 35vw;
background-image: url('../images/img01.jpg');
background-size: cover;
background-repeat: no-repeat;
border-radius: 15px;
}
#servicos{
width: 100%;
height: auto;
}
.card-servico{
font-size: 11pt;
height: auto;
padding: 30px;
border-radius: none;
display: inline;
}
.txt-card{
text-align: center;
padding: 20px;
}
.funcionais{
height: 50vh;
width: 100%;
background-image: url('../images/funcionais.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: left;
}
.organizacao{
height: 50vh;
width: 100%;
background-image: url('../images/organizacao.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: left;
}
.reciclagem{
height: 50vh;
width: 100%;
background-image: url('../images/reciclagem.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.mudanca{
height: 50vh;
width: 100%;
background-image: url('../images/mudanca.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: left;
}
.atendimento{
color: #000;
padding: 20px;
border: 1px solid #f1f1f1;
}
#palafita{
background-color: #0B5060;
color: #fff;
background-image: url('../images/pattern.svg');
background-repeat: repeat-y;
background-size: 32%;
background-position: left center;
}
#carousel{
background-color: #D6D1CA;
background-image: url('../images/pattern.svg');
background-repeat: repeat;
background-size: 32%;
}
.imagem-02{
height: 60vh;
width: 35vw;
background-image: url('../images/palafita.jpg');
background-position: center;
background-size: cover;
background-repeat: no-repeat;
border-radius: 15px;
}
.card-body{
background-color: #fff;
border-radius: 50px;
padding: 50px;
height: auto;
min-height: 40vh;
}
.comentario{
font-size: 10pt;
margin-top: 30px;
}
form{
margin-top: 100px;
margin-bottom: 50px;
border-radius: 0 !important;
}
.form-control{
border-radius: 0;
border: none;
}
#servicos{
min-height: 100vh;
height: auto;
}
.icones-social{
margin-bottom: 50px;
text-align:left;
font-size: 10pt
}
.tre{
color: #fff;
font-size: 8pt;
}
/*MEDIA*/
@media (max-width: 767px) {
.bg{
margin-top: -42%;
height: 115vh;
}
article{
padding: 20px;
}
.marca{
width: 100%;
left: 0%;
}
.imagem-01,.imagem-02{
/*display: none;*/
width: 97%;
height: 30vh;
}
.texto{
padding: 20px;
}
#servicos{
height: auto;
}
#palafita{
background-image: none;
}
.funcionais,.organizacao,.reciclagem,.mudanca{
/*display: none;*/
background-position: center;
background-size: cover;
height: 30vh;
margin-bottom: 20px;
}
.card-servico{
height: auto;
width: 150% !important;
padding: 0 !important;
font-size: 11pt;
}
.atendimento{
padding: 20px;
margin-top: -80px;
}
.txt-card{
padding: 20px;
}
.tre{
padding-top: 50px;
}
.icones-social{
margin-bottom: 50px;
text-align: center;
}
form{
margin-top: 20px;
}
.card-body{
height: 360px;
}
}