* {
margin: 0;
padding: 0;
}
html {
font-family: system-ui, sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
scroll-behavior: smooth;
margin: 0;
padding: 0;
}
body {
margin: 0%;
padding: 0%;
background-color: #edededed;
}
main {
display: flex;
flex-direction: column;
background-color: white;
}
ul {
list-style: none;
}
a {
background-color: transparent;
text-decoration: none;
}
#inicio {
position: absolute;
top: -50%;
visibility: hidden;
}
.header {
z-index: 99999;
margin: 0%;
padding: 0%;
position: fixed;
display: flex;
flex-direction: row;
width: 100%;
background-color: #F1F2F2;
box-shadow: 0px 3px 12px 0px #0000008c;
justify-content: space-between;
align-items: center;
top: 0;
}
.header-boxShadow {
box-shadow: 0px 3px 12px 0px #0000008c;
}
.logo-img {
width: 160px;
border-radius: 50px;
margin-left: 25px;
}
.logoReduzContainer {
display: none;
width: 100%;
align-items: center;
}
.mobile-title {
color: #1d3883;
display: none;
}
.logo-img-reduz {
width: 72px;
}
.header-mobile-menu {
display: none;
}
.header-list {
display: flex;
list-style: none;
gap: 10px;
margin: 0 10px 0 0;
}
.header-list li {
/* color: #304296; */
font-weight: 600;
transition: all 300ms;
position: relative;
line-height: 50px;
height: 50px;
text-align: center;
width: 120px;
cursor: pointer;
}
.header-list li a {
transition: all 0.3s;
justify-content: center;
}
.header-list li::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
opacity: 0;
transition: all 0.3s;
border-top-width: 2px;
border-bottom-width: 2px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #316ee0;
border-bottom-color: #316ee0;
transform: scale(0.1, 1);
}
.header-list li:hover a {
letter-spacing: 2px;
}
.header-list li:hover::before {
opacity: 1;
transform: scale(1, 1);
}
.dropdown {
position: fixed;
display: flexbox;
width: 100%;
}
.dropdown-content {
display: none;
border-radius: 3px;
width: 220%;
/* padding: 10px; */
position: absolute;
background-color: #f1f1f1f6;
box-shadow: 0px 8px 16px 0px #00000033;
}
.dropdown-content a {
color: black;
text-decoration: none;
text-align: center;
border-bottom: #00000027 solid 1px;
margin: 2px;
}
.dropdown-content a:hover {
background-color: #2788f7;
color: #ececec;
}
.dropdown:hover .dropdown-content {
display: flex;
flex-direction: column;
}
.arrow-right-menu {
display: none;
}
.show {
display: flex !important;
flex-direction: column;
width: 100%;
position: absolute;
right: 100%;
background-color: #f1f1f1f6;
box-shadow: 0px 8px 16px 0px #00000033;
max-height: 110%;
overflow-y: scroll;
}
.dropdown-itens:hover .subMenu {
display: flex;
}
.subMenu-itens {
display: none;
}
.subMenu a {
color: black;
text-decoration: none;
text-align: center;
}
.subMenu a:hover {
background-color: #2788f7;
color: #ececec;
}
.subMenu-itens::-webkit-scrollbar {
border-radius: 2pc;
width: 10px;
background-color: #2788f7;
}
.subMenu-itens::-webkit-scrollbar-thumb {
background-color: #ecececcb;
width: 2px;
border-radius: 2pc;
}
.dropdown-content a {
border-radius: 3px;
}
.limpeza-subMenu {
line-height: 30px;
}
/* botão de pesquisa */
.searchBarContainer {
margin: auto;
height: 30px;
border-radius: 2pc;
padding: 15px;
display: flex;
align-items: center;
justify-content: center;
transition: 0.8s;
}
.searchBarContainer input {
background: transparent;
border: none;
outline: none;
width: 0px;
font-weight: 500;
font-size: 10pt;
transition: 0.8s;
}
.searchBarContainer.active input {
width: 150px;
border: none;
outline: none;
}
.searchBarContainer.active {
box-shadow: inset 0 0 2px 0 #0d6efd;
}
.searchBarContainer .fas {
/* color: #0d6efd; */
font-size: 16pt;
}
/* fim do botão de pesquisa */
.banner-container {
width: 100%;
justify-content: center;
box-shadow: 0px 5px 5px #00000042;
margin-top: 66px;
}
.banner-img,
.carousel-item {
width: 100%;
}
.destaque-produtos-titulo-container {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
background-color: #edededed;
width: 100%;
text-shadow: #316ee0 1px 1px 1px;
}
.titulo-destaque-produtos {
font-size: 28px;
font-weight: bold;
color: #316ee0;
text-transform: uppercase;
letter-spacing: 3px;
border-bottom: 3px solid #3043969a;
width: 75%;
text-align: center;
margin: 8rem 0 3rem 0;
line-height: 50px;
}
.card-produtos {
display: flex;
flex-wrap: wrap;
gap: 1.5rem;
justify-content: center;
padding: 20px 0 150px 0;
background-color: #edededed;
}
.card:hover {
/* scale: 1.04; */
border: solid 1px #275ef7;
transition: all 300ms ease-in-out;
}
.card {
align-items: center;
text-align: center;
padding: 10px;
width: 18rem;
min-width: 12rem;
box-shadow: 3px 3px 3px #0000003f;
border-radius: 10px;
margin-bottom: 20px;
}
.card-img-top {
width: 85%;
margin-top: 10px;
object-fit: contain;
}
.card img,
.cards img {
width: 180px;
height: 180px;
margin-top: 10px;
}
.card-title {
font-weight: 400;
}
.card-text {
opacity: 0.9;
}
.card-body {
display: flex;
flex-direction: column;
gap: 20px;
width: 100%;
}
.btn {
align-self: center;
width: 30%;
border-radius: 6px;
box-shadow: 2px 3px 3px #000000a1;
}
.containerItens {
display: flex;
flex-wrap: wrap;
flex-direction: row;
gap: 1.5rem;
justify-content: center;
padding: 20px 0;
}
.produto-item {
background-color: #f2f2f2;
padding: 10px;
border: 1px solid #ccc;
margin-bottom: 5px;
}
.facaContatoContainer {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
align-items: center;
width: 95%;
margin: auto;
margin-top: 50px;
padding: 30px 10px;
color: #ececec;
border-radius: 5px;
box-shadow: 0px 5px 42px -25px #000000;
background-color: #1d3883;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='733' height='610.8' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/svg%3E");
}
.facaContatoContainer h2 {
flex: 1 0 140px;
text-align: center;
text-shadow: #000000 1px 1px 2px;
}
.facaContatoContainer p {
flex: 1 0 140px;
text-align: center;
}
.btn-outline-success {
display: flex;
justify-content: center;
flex-wrap: nowrap;
color: #ffffff;
background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
padding: 12px 24px;
text-align: center;
font-size: 18pt;
font-weight: 600;
border-radius: 12px;
border: 2px solid #25D366;
box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
flex: 0.5 0 50px;
width: 400px;
transition: all 0.3s ease;
cursor: pointer;
text-decoration: none;
position: relative;
overflow: hidden;
}
.btn-outline-success:hover {
background: linear-gradient(135deg, #128C7E 0%, #075E54 100%);
border-color: #128C7E;
box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4);
transform: translateY(-2px);
color: #ffffff;
}
.btn-outline-success:active {
transform: translateY(0);
box-shadow: 0 2px 10px rgba(37, 211, 102, 0.3);
}
.btn-outline-success:focus {
outline: none;
box-shadow: 0 0 0 3px rgba(37, 211, 102, 0.3), 0 4px 15px rgba(37, 211, 102, 0.3);
}
.quemSomosContainer {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: space-evenly;
width: 100%;
padding: 100px;
margin-top: 50px;
color: #ededed;
background-color: #1d3883;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='733' height='610.8' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/svg%3E");
/* background-size: cover; */
}
.quemSomosContent {
flex: 1;
text-align: right;
min-width: 449px;
}
.quemSomosImg {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
/* width: 100%; */
/* object-fit: fill; */
}
.quemSomosImg img {
box-shadow: 1px 1px 20px #000000;
border-radius: 15px;
width: 80%;
/* min-width: max-content; */
}
.quemSomosContent h2 {
text-shadow: #000 1px 1px 2px;
}
.quemSomosContent p {
color: #ededed;
text-shadow: #000 1px 1px 2px;
}
.quemSomosTopicos {
display: flex;
width: 100%;
background-color: #ededed;
justify-content: center;
align-items: center;
}
.quemSomosTopicos article {
padding: 20px;
text-align: center;
text-transform: uppercase;
border-radius: 5px;
margin: 25px 0;
text-shadow: #000000 1px 1px 2px;
width: 450px;
flex-shrink: 0;
}
.quemSomosTopicos article i {
font-size: 48px;
margin: 0 0 10px 0;
}
.topicosIcones {
width: 100px;
margin-bottom: 30px;
}
.quemSomosTopicos p {
text-transform: lowercase;
text-shadow: #313131 1px 1px 2px;
}
.quemSomosTopicos article:nth-child(2) p {
text-shadow: #000 1px 1px 2px;
}
.quemSomosTopicos article:nth-child(2) {
background-color: #1d3883;
text-shadow: #000 1px 1px 2px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='733' height='610.8' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/svg%3E");
color: whitesmoke;
box-shadow: -1px 1px 10px #000000;
}
.localizacao {
display: flex;
flex-direction: row;
color: whitesmoke;
justify-content: center;
align-items: center;
padding: 50px 0;
margin: 0%;
z-index: 1;
border-top: solid 2px #0000006b;
text-shadow: #000000 1px 1px 2px;
background-color: #1d3883;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='733' height='610.8' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/svg%3E");
}
.localizacao h2 {
padding: 15px;
text-align: center;
font-size: 35pt;
flex: 4;
}
#linha-vertical {
height: 150px;
border-right: 2px solid whitesmoke;
}
.localizacao address {
padding: 0px 100px;
flex: 2;
font-size: 14pt;
}
.comoChegarBtn {
background: none;
border: none;
color: whitesmoke;
text-decoration: underline;
text-shadow: #000000 1px 1px 2px;
}
.comoChegarBtn:hover {
opacity: 0.7;
}
.modal-maps {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: hidden;
background-color: #00000066;
}
.modal-maps-content {
display: flex;
flex-direction: column;
background-color: #fefefe;
margin: 10% auto;
padding: 0px;
border: 1px solid #888;
width: 80%;
max-width: 650px;
}
.close-maps {
position: relative;
color: #000000;
display: flex;
justify-content: right;
margin-right: 10px;
font-size: 30px;
font-weight: bold;
z-index: 999999;
}
.close-maps:hover,
.close-maps:focus {
color: black;
text-decoration: none;
cursor: pointer;
}
.map-responsive {
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
height: 65vh;
}
.map-responsive-footer {
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
height: 45vh;
margin-right: 20px;
border: none;
}
.map-responsive iframe,
.map-responsive-footer iframe {
left: 0;
top: 0;
height: 100%;
width: 100%;
position: absolute;
}
footer {
/* display: flex;
flex-direction: column; */
margin-top: 1px;
padding: 0%;
}
.footer-container {
display: flex;
justify-content: center;
background-color: #121213;
width: 100%;
height: 100%;
float: left;
font-size: 18px;
padding: 50px 0 0 0;
margin: 0%;
}
.footer-container .left {
width: 100%;
float: left;
border-bottom: solid 1px #242222;
border-right: 0;
margin-bottom: 20px;
padding-bottom: 20px;
}
.footer-container .title-footer {
color: #ffffff;
font-family: 'DM Sans', sans-serif;
font-weight: 700;
font-size: 19px;
width: 100%;
float: left;
margin-bottom: 15px;
}
.footer-container .title-footer span {
color: #2fcacf;
font-family: 'DM Sans', sans-serif;
font-weight: bold;
}
.payment-methods {
margin-bottom: 50px;
}
.payment {
display: flex;
gap: 20px;
align-items: baseline;
flex-wrap: wrap;
}
.payment li img {
width: 60px;
}
.semJuros {
display: flex;
width: 100%;
justify-content: start;
}
.semJuros img {
width: 300px;
}
.selos-container {
display: flex;
flex-direction: column;
}
.seloSSL {
width: 340px;
margin-bottom: 0%;
}
/* Footer links */
.footer-container .address {
font-family: 'DM Sans', sans-serif;
width: 100%;
float: left;
color: #ffffff;
margin-bottom: 20px;
padding: 0;
margin: 0%;
}
.footer-container .address a {
display: block;
line-height: 33px;
text-decoration: none;
color: #fff;
font-size: 16px;
transition: 0.3s;
}
.footer-container .address a:hover {
color: #2fcacf;
}
.Copyright-container {
background-color: #121213;
font-family: 'DM Sans', sans-serif;
color: #ffffff;
font-size: 12px;
font-weight: 500;
padding: 20px;
text-align: center;
}
.carlos-dev {
color: #ffffff;
font-weight: 500;
}
/* horizontal line */
.hr {
display: flex;
justify-content: center;
padding: 30px;
}
hr {
margin: 0%;
border: 0;
width: 75%;
border-top: 1px solid #f1f2f277;
}
/* horizontal line */
/*Rede Sociais*/
.footer-container .footer-icons {
display: flex;
width: 100%;
float: left;
gap: 12px;
}
.footer-container .footer-icons a,
.right-p a {
display: inline-block;
width: 35px;
height: 35px;
cursor: pointer;
background-color: #33383b;
border-radius: 50px;
font-family: 'DM Sans', sans-serif;
font-size: 20px;
color: #ffffff;
text-align: center;
line-height: 35px;
margin-bottom: 5px;
transition: 0.3s;
}
.footer-container .footer-icons a:hover,
.right-p a:hover {
background-color: #1d3883;
}
/*Right*/
.footer-container .right {
display: flex;
flex-direction: column;
width: 100%;
float: left;
/* height: 80vh; */
border-left: 1px #222424 solid;
}
.right-p {
font-family: 'DM Sans', sans-serif;
font-size: 11pt;
color: #fffffff3 !important;
/* font-weight: 600; */
}
.right-p ul li {
text-align: center;
}
.Copyright-container p {
margin: 0;
}
@keyframes pulse {
0%,
50%,
100% {
transform: scale(1);
}
25% {
transform: scale(1.1);
}
75% {
transform: scale(1);
}
}
#alertWapp,
.bt-whatsApp {
animation: pulse 1s linear infinite;
}
/*Responsive*/
@media (min-width: 1280px) {
.footer-container {
padding: 100px 50px 50px 100px;
}
.footer-container .Copyright {
font-size: 16px;
}
}
@media (min-width: 1050px) {
.footer-container .left {
width: 48%;
border-bottom: 0;
/* margin-left: 20px; */
}
.footer-container .right {
width: 48%;
padding-left: 4%;
}
}
@media screen and (max-width: 1050px) {
#close-btn {
z-index: 1;
/* position: absolute; */
font-size: 30pt;
font-style: none;
}
.quemSomosContainer {
/* padding: 40px 90px; */
flex-direction: column-reverse;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='733' height='610.8' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.03'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/svg%3E");
/* background-size: cover; */
}
.quemSomosContent {
text-align: center;
justify-content: center;
padding: 0 0 50px 0;
}
.quemSomosImg {
display: flex;
justify-content: center;
}
.quemSomosTxt {
padding: 20px;
}
.left,
.right {
margin-left: 20px;
}
.footer-container {
display: flex;
flex-wrap: wrap;
padding-left: 20px;
}
.footer-container .right {
border: none;
border-bottom: 1px #222424 solid;
}
.footer-container .right:last-child {
border: none;
}
.footer-container .funcionamento {
margin-top: 20px;
}
}
@media screen and (max-width: 921px) {
.header {
display: flex;
justify-content: space-between;
width: 100%;
z-index: 9999999999;
}
.mobile-title {
display: block;
font-size: 11pt;
margin: 5px 0 0 0;
font-weight: 900;
}
.logo-img {
display: none;
}
.logoReduzContainer {
display: flex;
width: 100%;
align-items: center;
}
.header-mobile-menu {
display: block;
position: absolute;
left: 90%;
}
.overlay {
/* content: ''; */
position: fixed;
right: 0;
top: 67px;
width: 100%;
height: 100%;
background-color: #00000065;
z-index: 999999999;
}
/* .fadeIn{
animation: fadeIn 100ms;
} */
.fadeOut {
animation: fadeIn 5s forwards reverse;
}
/* @keyframes fadeOut {
0% { left: -100%; }
100%{left: 0%;}
} */
/* open btn menu */
.btn-mobile-menu {
/* position: absolute; */
width: 30px;
/* Reduzido pela metade */
height: 30px;
/* Reduzido pela metade */
top: 0;
left: 0px;
cursor: pointer;
}
.btn-left {
background-color: #304296;
position: absolute;
height: 4px;
/* Reduzido pela metade */
width: 15px;
/* Reduzido pela metade */
top: 15px;
/* Reduzido pela metade */
left: 0px;
-webkit-transition-duration: 100ms;
transition-duration: 100ms;
}
.btn-left:before {
background-color: #304296;
position: absolute;
width: 15px;
/* Reduzido pela metade */
height: 4px;
/* Reduzido pela metade */
content: "";
top: -10px;
/* Reduzido pela metade */
-webkit-transition-duration: 100ms;
transition-duration: 100ms;
}
.btn-left:after {
background-color: #304296;
position: absolute;
width: 15px;
/* Reduzido pela metade */
height: 4px;
/* Reduzido pela metade */
content: "";
top: 10px;
/* Reduzido pela metade */
-webkit-transition-duration: 100ms;
transition-duration: 100ms;
}
.btn-right {
background-color: #304296;
position: absolute;
height: 4px;
/* Reduzido pela metade */
width: 15px;
/* Reduzido pela metade */
top: 15px;
/* Reduzido pela metade */
left: 15px;
/* Reduzido pela metade */
-webkit-transition-duration: 100ms;
transition-duration: 100ms;
}
.btn-right:before {
background-color: #304296;
position: absolute;
width: 15px;
/* Reduzido pela metade */
height: 4px;
/* Reduzido pela metade */
content: "";
top: -10px;
/* Reduzido pela metade */
-webkit-transition-duration: 100ms;
transition-duration: 100ms;
}
.btn-right:after {
background-color: #304296;
position: absolute;
width: 15px;
/* Reduzido pela metade */
height: 4px;
/* Reduzido pela metade */
content: "";
top: 10px;
/* Reduzido pela metade */
-webkit-transition-duration: 100ms;
transition-duration: 100ms;
}
.active .btn-left {
-webkit-transition-duration: 100ms;
transition-duration: 100ms;
background: transparent;
}
.active .btn-left:before {
-webkit-transform: rotateZ(45deg) scaleX(1.4) translate(2px, 2px);
/* Reduzido pela metade */
transform: rotateZ(45deg) scaleX(1.4) translate(2px, 2px);
/* Reduzido pela metade */
}
.active .btn-left:after {
-webkit-transform: rotateZ(-45deg) scaleX(1.4) translate(2px, -2px);
/* Reduzido pela metade */
transform: rotateZ(-45deg) scaleX(1.4) translate(2px, -2px);
/* Reduzido pela metade */
}
.active .btn-right {
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
background: transparent;
}
.active .btn-right:before {
-webkit-transform: rotateZ(-45deg) scaleX(1.4) translate(-2px, 2px);
/* Reduzido pela metade */
transform: rotateZ(-45deg) scaleX(1.4) translate(-2px, 2px);
/* Reduzido pela metade */
}
.active .btn-right:after {
-webkit-transform: rotateZ(45deg) scaleX(1.4) translate(-2px, -2px);
/* Reduzido pela metade */
transform: rotateZ(45deg) scaleX(1.4) translate(-2px, -2px);
/* Reduzido pela metade */
}
/* open btn menu */
.header-list {
display: flex;
z-index: 999;
position: fixed;
flex-direction: column;
align-items: center;
top: 4.1rem;
/* right: 100%; */
background: #ffffff;
width: 85%;
padding: 0%;
height: 100%;
font-size: 1.4rem;
/* transition: 100ms; */
gap: 2px;
border-radius: 0px
}
.dropdown-content-mobile {
right: 14%;
}
.descartaveis-subMenu-itens,
.domesticos-subMenu-itens,
.festa-subMenu-itens,
.limpeza-subMenu-itens {
display: flex;
z-index: 9999999999;
position: fixed;
flex-direction: column;
align-items: flex-end;
top: 4.1rem;
right: 100%;
background: #ffffff;
width: 85%;
padding: 0%;
height: 100%;
margin: 0%;
font-size: 1.4rem;
transition: 300ms all;
}
.show {
right: 15%;
}
.dropdown-content-mobile li {
display: flex;
width: 100%;
height: 7%;
text-align: left;
font-size: 15px;
border-bottom: #00000027 solid 1px;
margin: 5px;
border-radius: 2pc;
padding-left: 10px;
}
.header-list li {
transition: all 300ms;
}
.dropdown-content-mobile ul {
margin: 0%;
padding: 0%;
}
.header-list li a {
display: flex;
width: 99.9%;
justify-content: space-between;
align-items: center;
border-radius: 2pc;
padding: 0 10px;
background-color: #ffffff;
}
.header-list span {
font-size: 1.25rem;
}
.header-list li::before {
width: 0%;
height: 0%;
}
.header-list li:hover a {
letter-spacing: 0px;
}
.dropdown {
margin: 0%;
}
/*
.showMenu{
display: none!important;
} */
.dropdown-content {
display: flex;
flex-direction: column;
position: fixed;
align-items: center;
top: 4.1rem;
right: 100%;
z-index: 999;
width: 85%;
height: 100%;
transition: 300ms all;
background: #ffffff;
gap: 2px;
border-radius: 0%;
}
.showContent {
right: 15%;
}
@keyframes fadeIn {
0% {
left: -100%;
}
100% {
left: 0%;
}
}
.dropdown-content a {
color: #0d6efd;
display: flex;
width: 100%;
height: 7%;
padding: 10px;
font-size: 15px;
}
.dropdown-content a:hover {
background-color: inherit;
color: inherit;
}
/* .dropdown:hover .dropdown-content {
display: initial;
flex-direction: initial;
animation: initial;
} */
.dropdown-itens:hover .subMenu {
display: none;
}
.item-title-container {
display: flex !important;
width: 100%;
align-items: baseline;
justify-content: space-between;
padding: 0%;
height: min-content;
color: #0d6efd;
font-size: 13pt;
text-align: center;
}
.item-title-container button {
margin-left: 20px;
color: #0d6efd;
border: none;
background-color: inherit;
}
.title-container {
width: 100%;
height: 0;
text-align: center;
margin: 0 40px 0 0;
}
.hr-header {
display: flex;
justify-content: center;
width: 100%;
padding: 0 20px 5px 20px;
}
.hr-header hr {
margin: 0%;
border: 0;
width: 100%;
border-top: 1px solid #0d6efd;
}
.arrow-right-menu {
display: block;
}
.subMenu {
display: none;
pointer-events: fill;
}
.subMenu a:hover {
background-color: none;
color: #000000;
}
.subMenu-itens a {
color: black;
font-weight: 400;
background-color: #ffffff !important;
border-bottom: #00000027 solid 1px;
margin: 2px;
padding-left: 15px !important;
}
.subMenu-itens a:nth-last-child(1) {
margin-bottom: 50px !important;
}
/* botão de pesquisa */
.searchBarContainer {
display: flex;
border-radius: 2pc;
padding: 20px;
border: solid 1px #0000002c;
width: 7%;
transition: none;
position: fixed;
top: 50%;
}
@keyframes searchBarAnimation {
0% {
width: 7%;
}
100% {
width: 50%;
}
}
.searchBarShow {
width: 50%;
animation: searchBarAnimation 400ms;
}
.searchBarContainer input {
background: transparent;
border: none;
outline: none;
width: 100%;
font-weight: 500;
font-size: 15pt;
}
.searchBarContainer:hover input {
width: 100%;
}
.searchBarContainer .fas {
color: #0d6efd;
font-size: 20pt;
}
/* fim do botão de pesquisa */
.titulo-destaque-produtos {
font-size: 20px;
margin: 60px 0 10px 0;
}
.card-produtos {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 20px;
gap: 20px;
background-color: #ededed;
}
.card-img-top {
width: 50%;
}
.btn-outline-success {
width: 300px;
font-size: 16pt;
padding: 10px 20px;
}
.quemSomosContainer {
flex-direction: column-reverse;
justify-content: center;
align-items: center;
background-color: #1d3883;
text-align: center;
height: 20%;
width: 100%;
padding: 0%;
}
.quemSomosContent {
width: 100%;
min-width: 0px;
display: flex;
flex-direction: column;
height: 100%;
text-align: center;
margin: 50px 0 0 0;
justify-content: space-between;
}
.quemSomosTxt {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
}
.quemSomosTxt p {
display: flex;
justify-content: center;
flex-wrap: wrap;
width: 100%;
height: 100%;
}
.quemSomosImg {
height: 100%;
margin: 0 0 100px 0;
}
.quemSomosImg img {
/* position: relative; */
/* bottom: 7rem; */
height: 300px;
}
.quemSomosTopicos {
flex-wrap: wrap;
justify-content: center;
gap: 20px;
}
.quemSomosTopicos article {
width: 100%;
max-width: 350px;
margin: 10px 0;
}
.localizacao {
display: flex;
flex-direction: column;
/* Ajustar para coluna em telas menores */
color: whitesmoke;
justify-content: center;
align-items: center;
padding: 30px 0;
margin: 0%;
z-index: 1;
border-top: solid 2px #0000006b;
background-color: #1d3883;
}
.localizacao h2 {
font-size: 21pt;
}
#linha-vertical {
display: none;
/* Remover a linha vertical em telas menores */
}
.localizacao address {
padding: 0;
margin: 20px 0;
/* Adicionar espaçamento */
font-size: 14pt;
text-align: center;
/* Centralizar o conteúdo */
}
.modal-maps-content {
margin-top: 100px;
width: 90%;
}
.map-responsive {
height: 50vh;
}
.map-responsive-footer {
margin-right: 10px;
}
.footer-container {
display: flex;
flex-wrap: wrap;
}
.footer-container .right {
border: none;
border-bottom: 1px #222424 solid;
}
.footer-container .funcionamento {
margin-top: 20px;
}
.footer-container .right:last-child {
border: none;
}
.footer-container .right:nth-child(2) {
margin-right: 20px;
}
hr {
width: 100%;
}
}
/* ===== SISTEMA DE LISTA DE ORÇAMENTO ===== */
/* Botão do carrinho de orçamento */
.quote-cart-btn {
position: fixed;
bottom: 120px;
right: 20px;
width: 60px;
height: 60px;
background: linear-gradient(135deg, #25D366, #128C7E);
border: none;
border-radius: 50%;
color: white;
font-size: 24px;
cursor: pointer;
box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
transition: all 0.3s ease;
z-index: 999999;
display: flex;
align-items: center;
justify-content: center;
}
.quote-cart-btn:hover {
transform: scale(1.1);
box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4);
}
.quote-cart-btn:active {
transform: scale(0.95);
}
/* Contador de itens */
.quote-cart-count {
position: absolute;
top: -8px;
right: -8px;
background: #ff4757;
color: white;
border-radius: 50%;
width: 24px;
height: 24px;
font-size: 12px;
font-weight: bold;
display: flex;
align-items: center;
justify-content: center;
border: 2px solid white;
animation: pulse 2s infinite;
}
@keyframes pulse {
0% { transform: scale(1); }
50% { transform: scale(1.1); }
100% { transform: scale(1); }
}
/* Modal da lista de orçamento */
.quote-modal {
display: none;
position: fixed;
z-index: 1000000;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
backdrop-filter: blur(5px);
}
.quote-modal-content {
background-color: white;
margin: 5% auto;
padding: 0;
border-radius: 12px;
width: 90%;
max-width: 600px;
max-height: 86vh;
overflow: hidden;
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
animation: modalSlideIn 0.3s ease;
}
@keyframes modalSlideIn {
from {
opacity: 0;
transform: translateY(-50px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.quote-modal-header {
background: linear-gradient(135deg, #25D366, #128C7E);
color: white;
padding: 20px;
display: flex;
justify-content: space-between;
align-items: center;
}
.quote-modal-header h2 {
margin: 0;
font-size: 1.5rem;
font-weight: 600;
}
.quote-modal-close {
background: none;
border: none;
color: white;
font-size: 28px;
cursor: pointer;
padding: 0;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
transition: background-color 0.3s ease;
}
.quote-modal-close:hover {
background-color: rgba(255, 255, 255, 0.2);
}
.quote-modal-body {
padding: 20px;
max-height: 400px;
overflow-y: auto;
}
/* Campo de nome do cliente */
.quote-customer-info {
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 1px solid #e0e0e0;
}
.quote-customer-info label {
display: block;
font-weight: 600;
color: #333;
margin-bottom: 8px;
font-size: 0.95rem;
}
.quote-name-input {
width: 100%;
padding: 12px 15px;
border: 2px solid #e0e0e0;
border-radius: 6px;
font-size: 1rem;
transition: border-color 0.3s ease;
box-sizing: border-box;
}
.quote-name-input:focus {
outline: none;
border-color: #25D366;
box-shadow: 0 0 0 3px rgba(37, 211, 102, 0.1);
}
.quote-name-input::placeholder {
color: #999;
}
/* Container dos itens */
.quote-items-container {
min-height: 200px;
}
.quote-item {
display: flex;
align-items: center;
padding: 15px;
border: 1px solid #e0e0e0;
border-radius: 8px;
margin-bottom: 10px;
background: #fafafa;
transition: all 0.3s ease;
}
.quote-item:hover {
background: #f0f0f0;
border-color: #25D366;
}
.quote-item-image {
width: 60px;
height: 60px;
object-fit: cover;
border-radius: 6px;
margin-right: 15px;
}
.quote-item-details {
flex: 1;
}
.quote-item-name {
font-weight: 600;
margin-bottom: 5px;
color: #333;
}
.quote-item-category {
font-size: 0.9rem;
color: #666;
margin-bottom: 5px;
}
.quote-item-remove {
background: #ff4757;
color: white;
border: none;
border-radius: 50%;
width: 30px;
height: 30px;
cursor: pointer;
font-size: 14px;
margin-left: 10px;
transition: all 0.3s ease;
}
.quote-item-remove:hover {
background: #ff3742;
transform: scale(1.1);
}
.quote-modal-footer {
padding: 20px;
border-top: 1px solid #e0e0e0;
background: #f8f9fa;
display: flex;
justify-content: space-between;
align-items: center;
/* margin-bottom: 20px; */
}
.quote-total {
font-size: 1.2rem;
font-weight: 600;
color: #333;
}
.quote-actions {
display: flex;
gap: 10px;
}
.quote-btn {
padding: 12px 24px;
border: none;
border-radius: 6px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
}
.quote-btn-clear {
background: #6c757d;
color: white;
}
.quote-btn-clear:hover {
background: #5a6268;
}
.quote-btn-whatsapp {
background: #25D366;
color: white;
}
.quote-btn-whatsapp:hover {
background: #128C7E;
transform: translateY(-2px);
}
/* Estado vazio */
.quote-empty {
text-align: center;
padding: 20px;
color: #666;
}
.quote-empty i {
font-size: 48px;
color: #ddd;
margin-bottom: 15px;
}
.quote-empty h3 {
margin-bottom: 10px;
color: #333;
}
/* Botão adicionar à lista nos cards de produtos */
.add-to-quote-btn {
background: #25D366;
color: white;
border: none;
border-radius: 4px;
padding: 8px 16px;
font-size: 0.9rem;
cursor: pointer;
transition: all 0.3s ease;
margin-top: 10px;
width: 100%;
}
.add-to-quote-btn:hover {
background: #128C7E;
transform: translateY(-2px);
}
.add-to-quote-btn:active {
transform: translateY(0);
}
.add-to-quote-btn.added {
background: #28a745;
}
.add-to-quote-btn.added:hover {
background: #218838;
}
/* Estilos para os botões dos cards */
.card-buttons {
display: flex;
flex-direction: column;
gap: 8px;
margin-top: 10px;
}
.card-buttons .btn {
width: 100%;
margin: 0;
}
/* Responsividade */
@media (max-width: 768px) {
.quote-modal{
top: 65px;
z-index: 99999999;
}
.quote-cart-btn {
bottom: 115px;
right: 15px;
width: 55px;
height: 55px;
font-size: 20px;
}
.quote-cart-count {
width: 20px;
height: 20px;
font-size: 10px;
}
.quote-modal-content {
width: 95%;
margin: 5% auto;
max-height: 85vh;
}
.quote-modal-header {
padding: 15px;
}
.quote-modal-header h2 {
font-size: 1.3rem;
}
.quote-modal-body {
padding: 15px;
max-height: 350px;
}
.quote-customer-info {
margin-bottom: 15px;
padding-bottom: 12px;
}
.quote-name-input {
padding: 10px 12px;
font-size: 0.95rem;
}
.quote-item {
padding: 12px;
}
.quote-item-image {
width: 50px;
height: 50px;
margin-right: 12px;
}
.quote-modal-footer {
padding: 15px;
flex-direction: column;
gap: 15px;
}
.quote-actions {
width: 100%;
justify-content: center;
}
.quote-btn {
flex: 1;
justify-content: center;
}
}
/* Animações para notificações */
@keyframes slideInRight {
from {
transform: translateX(100%);
opacity: 0;
}
to {
transform: translateX(0);
opacity: 1;
}
}
@keyframes slideOutRight {
from {
transform: translateX(0);
opacity: 1;
}
to {
transform: translateX(100%);
opacity: 0;
}
}
/* Estilos para botão na página de detalhes do produto */
.produto-actions {
margin-top: 20px;
}
.produto-actions .add-to-quote-btn {
width: 100%;
padding: 12px 20px;
font-size: 1rem;
font-weight: 600;
}
/* Responsividade */