html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
border: 0;
font: inherit;
font-size: 100%;
margin: 0;
padding: 0;
vertical-align: baseline;
}
html {
margin-right: 0 !important;
scroll-behavior: smooth !important;
}
html.fbx-no-scroll {
overflow: auto !important;
}
a:focus {
outline: none;
} article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
img {
display: block;
}
* {
box-sizing: border-box;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.clear {
clear: both;
}
iframe {
display: block;
}
:root {
--verde-claro: #94B422;
--verde-escuro: #475C22;
--verde-menu: #64902D;
--transicao: .3s linear;
--swiper-navigation-size: 20px;
--swiper-theme-color: #94B422;
}
body {
margin: 0 !important;
font-family: "Montserrat", sans-serif;
position: relative;
font-size: 16px;
}
.phone_hp,
.fbx-count {
display: none !important;
}
header {
width: 100%;
display: flex;
justify-content: end;
padding-top: 26px;
position: fixed;
top: 0;
left: 0;
z-index: 11;
transition: var(--transicao);
}
header.verde {
background-color: var(--verde-menu);
justify-content: end;
padding-top: 0;
}
header.verde nav {
width: 100%;
}
header .logo {
position: absolute;
top: 29px;
left: 0;
display: flex;
justify-content: center;
align-items: center;
transition: var(--transicao);
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-banner.webp);
background-size: cover;
background-position: center;
background-size: cover;
padding: 0px 30px 30px 30px;
border-radius: 0 0 50px
}
header .cinza {
background-image: unset;
padding: 20px;
background-color: #58595B;
border-radius: 0px 0px 40px 0px;
margin-left: 0px;
position: absolute;
left: 60px;
top: 0;
border: 2px solid #fff;
}
header .cinza img {
width: 115px;
height: auto;
}
header nav {
background-color: var(--verde-menu);
margin-right: 45px;
width: 862px;
height: max-content;
max-width: 50%;
padding: 15px 35px;
border-radius: 0px 20px 0px 20px;
transition: var(--transicao);
}
header nav ul {
display: flex;
justify-content: space-between;
align-items: center;
}
header nav ul li a {
text-decoration: none;
color: #fff;
font-size: 14px;
font-weight: 500;
transition: var(--transicao);
}
header nav ul li a:hover {
font-weight: 700;
}
header nav ul li a:visited {
color: #fff;
}
#banner {
width: 100%;
padding: 100px 0px 100px 0px;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-banner.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
position: relative;
}
#banner .container {
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/img-banner.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
width: 96%;
height: 730px;
margin: 0 auto;
border-radius: 20px;
display: flex;
justify-content: space-between;
flex-direction: column;
}
#banner .container .cima {
width: 100%;
display: flex;
justify-content: end;
align-items: center;
}
#banner .container .cima .conteudo {
width: 1170px;
max-width: 90%;
display: flex;
justify-content: end;
align-items: center;
column-gap: 20px;
background-color: #475C2299;
border-radius: 0px 20px 0px 20px;
padding: 20px 50px;
}
#banner .container .cima .conteudo .esq {
width: 50%;
}
#banner .container .cima .conteudo .esq .texto {
color: #fff;
font-size: 22px;
font-weight: 700;
text-align: right;
letter-spacing: 2px;
}
#banner .container .cima .conteudo .dir {
width: max-content;
}
#banner .container .baixo {
width: 100%;
display: flex;
justify-content: space-between;
align-items: end;
column-gap: 20px;
}
#banner .container .baixo .esq {
display: flex;
column-gap: 20px;
justify-content: center;
align-items: center;
padding: 0px 0px 30px 30px;
}
#banner .container .baixo .esq .plantao {
color: #fff;
font-size: 21px;
font-weight: 800;
}
#banner .container .baixo .esq .plantao .texto {
text-transform: uppercase;
}
#banner .container .baixo .dir {
width: 610px;
max-width: 50%;
background-color: #575756CC;
border-radius: 25px 0px 0px 0px;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-weight: 700;
padding: 14px 0px 14px;
}
#banner .container .baixo .dir .lotes p {
width: 210px;
font-size: 28px;
line-height: 40px;
text-transform: uppercase;
}
#banner .container .baixo .dir .lotes p span {
display: block;
font-size: 56px;
}
#banner .container .baixo .dir .numero p {
font-size: 40px;
}
#banner .container .baixo .dir .numero p span {
font-size: 84px;
margin-right: 20px;
}
#banner .container .baixo .dir .numero p .dois {
font-size: 60px;
margin-right: 0;
}
#local {
padding: 100px 0;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-papel.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
#local .container {
width: 1400px;
max-width: 90%;
margin: 0 auto;
display: flex;
align-items: center;
}
#local .container .esq {
width: 516px;
background-color: var(--verde-escuro);
display: flex;
align-items: center;
flex-direction: column;
padding: 120px 65px;
height: auto;
border-radius: 50px 0px 50px 0px;
color: #fff;
position: relative;
}
#local .container .esq .logo {
margin-bottom: 60px;
}
#local .container .esq .logo img {
width: 166px;
height: auto;
}
#local .container .esq .titulo {
margin-bottom: 35px;
font-size: 22px;
font-weight: 700;
text-align: center;
}
#local .container .esq .texto {
font-size: 20px;
font-weight: 400;
text-align: justify;
}
#local .container .esq .detalhe {
position: absolute;
bottom: -5px;
display: flex;
}
#local .container .esq .detalhe .inverte svg {
transform: rotate(180deg);
}
#local .container .dir {
width: 886px;
}
#local .container .dir img{
border-radius: 0px 30px 30px 0px;
}
#lote {
padding: 100px 0;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-verde.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
scroll-margin-top: 50px;
}
#lote .container {
width: 1400px;
max-width: 90%;
margin: 0 auto;
display: flex;
align-items: center;
}
#lote .container .esq {
width: 886px;
height: 633px;
background-color: #D9D9D9;
border: 3px solid #fff;
border-radius: 30px;
display: flex;
justify-content: center;
align-items: center;
}
#lote .container .esq img {
object-fit: cover;
scale: 1.1;
}
#lote .container .dir {
width: 515px;
height: 603px;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
border-radius: 10px 0px 50px 0px;
background-color: #58595B;
padding: 45px 60px;
}
#lote .container .dir .titulo {
text-align: center;
font-size: 20px;
font-weight: 700;
width: 308px;
max-width: 100%;
}
#lote .container .dir .lista {
width: 100%;
margin-top: 35px;
}
#lote .container .dir .lista p {
font-size: 18px;
font-weight: 700;
margin-bottom: 15px;
}
#lote .container .dir .lista ul {
display: flex;
flex-direction: column;
row-gap: 10px;
}
#lote .container .dir .lista ul li {
font-size: 18px;
position: relative;
display: flex;
align-items: center;
}
#lote .container .dir .lista ul li::before {
content: '';
width: 11px;
height: 1px;
background-color: #94B422;
position: absolute;
left: -18px;
}
#swiper {
padding: 100px 0px 78px;
scroll-margin-top: 100px;
}
#swiper .container {
width: 1150px;
max-width: 90%;
margin: 0 auto;
background-color: #58595B;
display: flex;
justify-content: center;
align-items: center;
padding: 20px 0px;
position: relative;
color: #fff;
border-radius: 0px 30px 30px 30px;
font-size: 18px;
}
#swiper .container .detalhe {
position: absolute;
right: -25px;
bottom: -5px;
}
#swiper .container-swiper {
padding-top: 60px;
width: 1550px;
max-width: 90%;
height: 500px;
margin: 0 auto;
position: relative;
}
#swiper .container-swiper .btn-next {
position: absolute;
right: -120px;
top: 50%;
margin-top: 15px;
font-weight: 800;
}
#swiper .container-swiper .btn-prev {
position: absolute;
left: -120px;
top: 50%;
margin-top: 15px;
font-weight: 800;
}
.swiper {
width: 100%;
height: 100%;
}
.swiper-wrapper {
align-items: center;
}
.swiper-slide {
width: 100%;
height: 267px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
border-radius: 50px;
transition: var(--transicao);
position: relative;
}
.swiper-slide::after {
content: '';
width: 100%;
height: 100%;
display: flex;
position: absolute;
bottom: 0;
left: 0;
background: linear-gradient(179.95deg, rgba(23, 23, 255, 0) 86%, #000000 106%);
border-radius: 50px;
}
.swiper-slide.swiper-slide-active {
height: 395px;
border: 5px solid var(--verde-claro);
z-index: 2;
transform: scale(1.73, 1);
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.4);
}
.swiper-slide.swiper-slide-active .legenda,
.swiper-slide.swiper-slide-active .ampliar {
transform: scale(0.578, 1);
transform-origin: center;
z-index: 2;
}
.swiper-slide a {
height: 100%;
}
.swiper-slide img {
display: block;
width: 100%;
height: 100%;
border-radius: 45px;
}
.swiper-slide .legenda {
position: absolute;
bottom: 15px;
left: 30px;
}
.swiper-slide.swiper-slide-active .legenda {
left: -30px;
bottom: 27px;
}
.swiper-slide .legenda p {
font-size: 12px;
font-weight: 700;
color: #fff;
}
.swiper-slide .ampliar {
position: absolute;
top: 20px;
right: 20px;
width: 45px;
height: 45px;
border-radius: 50%;
background-color: var(--verde-claro);
display: flex;
justify-content: center;
align-items: center;
transition: var(--transicao);
}
.swiper-slide .ampliar svg {
color: #fff;
transition: var(--transicao);
}
.swiper-slide .ampliar:hover {
background-color: #58595B;
}
.swiper-slide .ampliar:hover svg {
color: var(--verde-claro);
}
#formulario {
padding: 100px 0;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-papel.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
#formulario .container {
width: 594px;
max-width: 90%;
margin: 0 auto;
}
#formulario .container form {
width: 100%;
padding: 35px 40px 40px 40px;
display: flex;
justify-content: center;
flex-direction: column;
background-color: var(--verde-claro);
border-radius: 30px 0px 30px 0px;
}
form .titulo {
font-size: 20px;
font-weight: 500;
text-align: center;
letter-spacing: 1px;
margin-bottom: 15px;
color: #fff;
}
form .texto {
font-size: 12px;
font-weight: 500;
letter-spacing: 1px;
text-align: center;
margin-bottom: 30px;
color: #fff;
}
form .texto span {
display: block;
}
form .box-input {
position: relative;
width: 100%;
margin-bottom: 15px;
display: flex;
column-gap: 15px;
}
form .box-input label {
font-weight: 400;
font-size: 15px;
color: #000;
position: absolute;
left: 15px;
top: 14px;
transition: var(--transicao);
}
form .box-input input {
width: 100%;
padding: 0 10px;
height: 45px;
border-radius: 5px;
}
form .box-input .inside {
width: 80%;
position: relative;
}
form .box-input .box-ddd {
width: 20%;
}
form .box-input textarea {
width: 100%;
height: 115px;
border-radius: 5px;
resize: none;
padding: 0 10px;
padding-top: 10px;
}
form .box-input textarea::placeholder {
color: #000;
font-family: "Montserrat", sans-serif;
font-size: 15px;
}
form .box-input textarea:focus {
outline: none;
box-shadow: none;
}
form .box-check {
display: flex;
column-gap: 8px;
margin-bottom: 12px;
}
form .box-check label {
font-size: 10px;
font-weight: 700;
color: var(--preto);
border-radius: 50px;
}
form .box-input label.subir {
border-radius: 50px;
font-size: 12px;
font-weight: 600;
top: -10px;
padding: 2.5px 9.5px;
z-index: 5;
background-color: var(--verde-escuro);
color: #fff;
}
.error,
.error::placeholder {
color: red !important;
}
form input[type='submit'] {
width: 100%;
background-color: var(--verde-escuro);
font-size: 22px;
color: #fff;
font-weight: 700;
padding: 0;
height: 45px;
cursor: pointer;
border-radius: 5px;
transition: var(--transicao);
border: none;
text-transform: uppercase;
}
form input[type='submit']:hover {
background-color: #58595B;
color: var(--verde-claro);
}
#infraestrutura {
width: 100%;
display: flex;
flex-direction: column;
}
#infraestrutura .texto {
background-color: var(--verde-claro);
display: flex;
justify-content: center;
align-items: center;
font-size: 20px;
color: #fff;
font-weight: 700;
padding: 25px 0;
}
#infraestrutura .img {
width: 100%;
}
#infraestrutura .img img {
width: 100%;
height: 100%;
object-fit: cover;
}
#escolha-lote {
padding: 100px 0px;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-verde.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
#escolha-lote .container {
width: 1400px;
max-width: 90%;
display: flex;
flex-direction: column;
row-gap: 30px;
margin: 0 auto;
}
#escolha-lote .container .cima {
width: 1150px;
max-width: 90%;
margin: 0 auto;
background-color: #58595B;
display: flex;
justify-content: center;
align-items: center;
padding: 20px 0px;
position: relative;
color: #fff;
border-radius: 0px 30px 30px 30px;
font-size: 18px;
}
#escolha-lote .container .cima .detalhe {
position: absolute;
right: -25px;
bottom: -5px;
}
#escolha-lote .container .baixo {
width: 100%;
display: flex;
flex-wrap: wrap;
column-gap: 1%;
}
#escolha-lote .container .baixo .card {
width: 32.6%;
}
#escolha-lote .container .baixo .card img {
border-radius: 30px 30px 0px 0px;
}
#escolha-lote .container .baixo .card .texto {
width: 100%;
text-align: center;
background-color: var(--verde-claro);
color: #fff;
padding: 24px 5px;
border-radius: 0px 0px 30px 30px;
}
#escolha-lote .container .baixo .card .texto .titulo {
font-size: 18px;
font-weight: 700;
margin-bottom: 10px;
}
#escolha-lote .container .baixo .card .texto .info {
font-size: 18px;
font-weight: 400;
}
#formulario-whats {
padding: 100px 0;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-papel.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
scroll-margin-top: 50px;
}
#formulario-whats .container {
width: 594px;
max-width: 90%;
margin: 0 auto;
position: relative;
}
#formulario-whats .container .icone {
position: absolute;
right: -20px;
top: -20px;
}
#formulario-whats .container form {
width: 100%;
padding: 35px 40px 40px 40px;
display: flex;
justify-content: center;
flex-direction: column;
background-color: var(--verde-claro);
border-radius: 30px 0px 30px 0px;
}
#piscina {
padding: 100px 0;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-verde.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
#piscina .container {
width: 1400px;
max-width: 90%;
display: flex;
column-gap: 15px;
margin: 0 auto;
}
#piscina .container .legenda {
position: absolute;
bottom: 15px;
left: 20px;
font-size: 12px;
font-weight: 700;
letter-spacing: 1px;
word-spacing: 2px;
color: #fff;
z-index: 2;
}
#piscina .container .esq {
position: relative;
width: 870px;
height: 496px;
}
#piscina .container .esq::after {
content: '';
width: 100%;
height: 100%;
display: flex;
position: absolute;
bottom: 0;
left: 0;
border-radius: 0px 0px 50px 0px;
background: linear-gradient(179.95deg, rgba(23, 23, 255, 0) 86%, #000000 106%);
}
#piscina .container .esq img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 50px 0px 50px 0px;
}
#piscina .container .dir {
width: 510px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
#piscina .container .dir .cima {
font-size: 18px;
font-weight: 700;
text-align: justify;
background-color: var(--verde-claro);
padding: 50px;
border-radius: 0px 50px 0px 50px;
color: #fff;
}
#piscina .container .dir .baixo {
position: relative;
}
#piscina .container .dir .baixo::after {
content: '';
width: 100%;
height: 100%;
display: flex;
position: absolute;
bottom: 0;
left: 0;
border-radius: 0px 0px 50px 0px;
background: linear-gradient(179.95deg, rgba(23, 23, 255, 0) 86%, #000000 106%);
}
#piscina .container .dir .baixo img {
border-radius: 50px 0px 50px 0px;
}
#implantacao {
width: 100%;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/bg-papel.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding-bottom: 50px;
scroll-margin-top: 50px;
}
#implantacao .imp {
width: 100%;
background-color: var(--verde-claro);
color: #fff;
display: flex;
justify-content: center;
align-items: center;
padding: 25px 0px;
font-size: 20px;
font-weight: 700;
margin-bottom: 50px;
}
#implantacao .container {
width: 1400px;
max-width: 90%;
margin: 0 auto;
display: flex;
justify-content: space-between;
}
#implantacao .container .conteudo {
padding-bottom: 190px;
width: 50%;
display: flex;
flex-direction: column;
position: relative;
align-items: center;
}
#implantacao .container .conteudo .bloco-img {
display: flex;
justify-content: center;
align-items: center;
margin-top: 10px;
margin-bottom: 70px;
}
#implantacao .container .conteudo .bloco-titulo {
background-color: #58595B;
padding: 16px 56px;
color: #fff;
border-radius: 0px 22px 0px 22px;
font-size: 13px;
font-weight: 700;
text-transform: uppercase;
}
#implantacao .container .conteudo .bloco-lista {
position: absolute;
bottom: 0;
width: 675px;
max-width: 100%;
background-color: #58595B;
color: #fff;
display: flex;
justify-content: space-between;
column-gap: 10px;
padding: 20px 40px;
border-radius: 30px;
}
#implantacao .container .conteudo .bloco-lista ul {
display: flex;
flex-direction: column;
row-gap: 6px;
}
#implantacao .container .conteudo .bloco-lista ul li {
display: flex;
align-items: center;
font-size: 12px;
font-weight: 700;
column-gap: 10px;
}
#implantacao .container .conteudo .bloco-lista ul li .num {
display: flex;
justify-content: center;
align-items: center;
min-width: 28px;
min-height: 28px;
border-radius: 50%;
background-color: var(--verde-claro);
color: #000;
font-size: 12.26px;
}
#implantacao .container .dir .bloco-lista {
padding: 22px 40px 22px 37px;
}
#implantacao .container .dir .bloco-lista ul li {
font-size: 14px;
}
#implantacao .container .dir .bloco-lista ul li .num {
min-width: 36px;
min-height: 36px;
font-size: 15.5px;
}
#implantacao .container .dir .bloco-img {
height: 410px;
}
#implantacao .container .dir .bloco-img img {
margin-top: 85px;
}
#mapa {
scroll-margin-top: 50px;
}
#mapa .info {
width: 100%;
background-color: var(--verde-claro);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: #fff;
font-size: 22px;
font-weight: 800;
text-align: center;
padding: 20px 0px;
}
#mapa .info .plantao {
font-weight: 400;
text-transform: uppercase;
}
#mapa .container {
width: 100%;
background-image: url(//www.reservamairinque.com.br/wp-content/themes/reservamairinque/assets/images/img-maps.webp);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 185px 0px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
#mapa .container::after {
content: '';
width: 100%;
height: 100%;
display: flex;
position: absolute;
top: 0;
left: 0;
backdrop-filter: blur(5px);
}
#mapa .container a {
text-decoration: none;
background-color: var(--verde-claro);
font-size: 26px;
font-weight: 700;
padding: 27px 43px;
color: #fff;
border-radius: 20px;
transition: var(--transicao);
position: relative;
z-index: 2;
}
#mapa .container a:hover {
background-color: #58595B;
color: var(--verde-claro);
}
#construcao {
padding-bottom: 106px;
scroll-margin-top: 50px;
}
#construcao .info {
width: 100%;
padding: 25px 0px;
background-color: var(--verde-claro);
display: flex;
justify-content: center;
align-items: center;
font-size: 20px;
font-weight: 700;
color: #fff;
margin-bottom: 106px;
}
#construcao .container {
width: 1050px;
max-width: 90%;
margin: 0 auto;
display: flex;
justify-content: space-between;
}
#construcao .container .esq {
width: 50%;
}
#construcao .container .dir {
width: 50%;
display: flex;
align-items: center;
justify-content: center;
line-height: 25px;
font-size: 22px;
font-weight: 400;
}
#construcao .container .dir p {
font-size: 22px;
font-weight: 400;
width: 512px;
max-width: 90%;
}
#politica {
padding: 50px 0px;
background-color: #F2F2F2;
}
#politica .container {
width: 1400px;
max-width: 90%;
margin: 0 auto;
display: flex;
flex-direction: column;
justify-content: center;
row-gap: 40px;
}
#politica .container p {
width: 100%;
font-size: 12px;
letter-spacing: 1px;
color: #000000;
text-align: center;
}
#politica .container .title {
margin-bottom: 10px;
font-weight: 700;
}
footer {
width: 100%;
background-color: var(--verde-claro);
display: flex;
justify-content: center;
align-items: center;
padding: 20px 0px;
padding-bottom: 85px;
}
@media screen and (max-width: 1920px) {}
@media screen and (max-width: 1820px) {
#swiper .container-swiper .btn-prev {
left: -3%;
}
#swiper .container-swiper .btn-next {
right: -3%;
}
}
@media screen and (max-width: 1680px) {}
@media screen and (max-width: 1600px) {
#banner .container .cima .conteudo .dir {
width: 20%;
}
#banner .container .cima .conteudo .esq {
width: auto;
}
#banner .container .cima .conteudo .esq .texto {
color: #fff;
font-size: 18px;
}
#banner .container {
background-position: right;
height: 571px;
}
#banner .container .baixo .esq .plantao {
font-size: 16px;
}
#banner .container .baixo .dir .lotes p span {
font-size: 46px;
}
#lote .container .esq {
height: 487px;
width: 50%;
}
#lote .container .dir {
height: auto;
width: 50%;
padding: 35px;
}
}
@media screen and (max-width: 1530px) {
#implantacao .container {
column-gap: 15px;
}
#implantacao .container .dir .bloco-img {
height: 420px;
}
#implantacao .container .dir .bloco-img img {
width: 100%;
height: auto;
}
}
@media screen and (max-width: 1440px) {
#banner .container .cima .conteudo {
max-width: 80%;
}
#local .container .esq .texto {
font-size: 16px;
}
#local .container .esq {
width: 40%;
height: auto;
}
#local .container .dir {
width: 60%;
}
#lote .container .esq {
width: 60%;
}
#lote .container .dir {
width: 40%;
}
}
@media screen and (max-width: 1366px) {
header nav {
margin-right: 20px;
width: 1000px;
max-width: 70%;
}
#banner .container .cima .conteudo .esq .texto {
font-size: 18px;
}
#banner .container .cima .conteudo .dir img {
width: 400px;
height: auto;
}
#banner .container .baixo .esq .plantao {
font-size: 16px;
}
#banner .container .baixo .dir .lotes p span {
font-size: 40px;
}
#banner .container .baixo .dir .numero p span {
font-size: 56px;
}
#banner .container .baixo .dir .lotes p {
font-size: 23px;
}
#local .container .esq .logo {
margin-bottom: 30px;
}
#local .container .esq .detalhe svg {
width: 60px;
height: auto;
}
#lote .container .dir .lista ul li {
font-size: 16px;
}
#escolha-lote .container .baixo .card .texto {
padding: 24px 10px;
min-height: 105px;
}
#escolha-lote .container .baixo .card .texto .titulo {
font-size: 16px;
}
#escolha-lote .container .baixo .card .texto .info {
font-size: 16px;
}
#piscina .container .dir .cima {
font-size: 16px;
}
#mapa .info {
font-size: 18px;
}
#piscina .container .dir .baixo {
height: 250px;
}
#piscina .container .dir .baixo img {
width: 100%;
height: 100%;
object-fit: cover;
}
#implantacao .container .dir .bloco-lista ul li {
font-size: 12px;
}
}
@media screen and (max-width: 1280px) {
#implantacao .container .conteudo .bloco-img {
margin-bottom: 0px;
}
#implantacao .container .dir .bloco-img img {
margin-top: 30px;
}
}
@media screen and (max-width: 1210px) {
#banner .container .cima .conteudo {
max-width: 75%;
}
#banner .container .cima .conteudo .dir img {
width: 350px;
}
#banner .container .cima .conteudo .esq .texto {
font-size: 16px;
}
#local .container .esq {
padding: 80px 65px;
}
}
@media screen and (max-width: 1080px) {}
@media screen and (max-width: 1024px) {
header {
padding-top: 0px;
}
header nav ul {
justify-content: start;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
padding: 200px 5% 40px 5%;
row-gap: 30px;
overflow: auto;
}
header nav {
position: fixed;
right: -150%;
width: 100%;
transition: var(--transicao);
height: 100vh;
top: 0px;
max-width: 100%;
margin-right: 0;
border-radius: 0px;
}
header .menu-hamburger {
display: flex;
flex-direction: column;
row-gap: 5px;
padding: 20px;
}
header .menu-hamburger span {
width: 33px;
height: 4px;
background-color: var(--verde-claro);
transition: var(--transicao);
}
header .menu-hamburger.ativo .hamburger-01 {
transform: rotate(42deg) translate(7px, 5.5px);
}
header .menu-hamburger.ativo .hamburger-02 {
opacity: 0;
}
header .menu-hamburger.ativo .hamburger-03 {
transform: rotate(-46deg) translate(8px, -5.5px);
}
header.ativo nav {
right: 0px;
}
header nav ul li a {
font-size: 20px;
color: #fff;
}
header .logo {
z-index: 2;
padding: 30px;
top: 0;
}
header .logo img {
width: 130px;
height: auto;
}
header .cinza {
left: 0;
border-radius: 0 0 50px;
}
#banner .container .cima .conteudo {
flex-direction: column;
max-width: unset;
row-gap: 20px;
width: 65%;
}
#banner .container .cima .conteudo .esq {
width: 100%;
}
#banner .container .cima .conteudo .dir img {
width: 255px;
}
#banner .container .cima .conteudo .dir {
width: auto;
}
#banner .container .baixo .dir {
column-gap: 20px;
}
#banner .container .baixo .dir .lotes p {
width: max-content;
font-size: 18px;
line-height: 28px;
}
#banner .container .baixo .dir .lotes p span {
font-size: 30px;
}
#banner .container .baixo .dir .numero p span {
font-size: 40px;
}
#banner .container .baixo .dir .numero p .dois {
font-size: 40px;
}
#local .container {
flex-direction: column;
row-gap: 30px;
}
#local .container .esq {
width: 100%;
border-radius: 30px;
padding: 100px 60px;
}
#local .container .dir {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
#local .container .dir img {
width: 865px;
max-width: 100%;
height: auto;
border-radius: 30px;
}
#lote .container {
flex-direction: column-reverse;
row-gap: 20px;
}
#lote .container .esq {
height: auto;
}
#lote .container .dir {
width: 100%;
height: auto;
border-radius: 20px;
}
#lote .container .dir .titulo {
width: 100%;
}
#lote .container .esq {
width: 100%;
}
#infraestrutura .img {
width: 100%;
height: 300px;
}
#escolha-lote .container .baixo {
justify-content: center;
}
#escolha-lote .container .baixo .card {
width: 32%;
}
#escolha-lote .container .baixo .card .texto {
min-height: 130px;
}
#escolha-lote .container .cima {
font-size: 16px;
padding: 20px 50px 20px 20px;
}
#swiper .container {
font-size: 16px;
padding: 20px 50px 20px 20px;
}
#piscina .container {
flex-direction: column;
row-gap: 30px;
}
#piscina .container .esq {
width: 100%;
height: auto;
}
#piscina .container .dir {
width: 100%;
flex-direction: row;
column-gap: 20px;
}
#piscina .container .dir .cima {
text-align: start;
width: 50%;
display: flex;
justify-content: center;
align-items: center;
}
#piscina .container .dir .baixo {
width: 50%;
}
#implantacao .container {
flex-direction: column;
row-gap: 50px;
}
#implantacao .container .conteudo {
width: 100%;
padding-bottom: 0;
row-gap: 30px;
}
#implantacao .container .conteudo .bloco-lista {
position: relative;
bottom: unset;
}
#implantacao .container .conteudo .bloco-img {
margin-top: 0px;
}
#implantacao .container .dir .bloco-img img {
margin-top: 0;
}
#implantacao .container .dir .bloco-img {
height: auto;
}
#implantacao .container .conteudo .bloco-lista {
width: 100%;
}
#construcao .container {
flex-direction: column-reverse;
row-gap: 30px;
}
#construcao .container .esq {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
#construcao .container .dir {
width: 100%;
}
#construcao .container .dir p {
width: 100%;
font-size: 18px;
}
#local {
padding: 80px 0px;
}
#banner {
padding: 100px 0px 80px 0px;
}
#lote {
padding: 80px 0;
}
#swiper {
padding: 80px 0px;
}
#formulario {
padding: 80px 0;
}
#escolha-lote {
padding: 80px 0px;
}
#formulario-whats {
padding: 80px 0;
}
#piscina {
padding: 80px 0;
}
#construcao {
padding-bottom: 80px;
}
#construcao .info {
margin-bottom: 80px;
}
}
@media screen and (max-width: 996px) {}
@media screen and (max-width: 768px) {
.swiper-slide.swiper-slide-active {
transform: scale(1.2, 1);
}
.swiper-slide.swiper-slide-active .legenda,
.swiper-slide.swiper-slide-active .ampliar {
transform: scale(0.8333, 1);
}
.swiper-slide.swiper-slide-active .legenda {
left: 13px;
bottom: 27px;
}
.swiper-slide img {
object-fit: cover;
}
header .logo img {
width: 105px;
}
header .cinza {
left: 0;
}
#banner .container .baixo .esq {
padding: 0px 0px 12px 12px;
flex-direction: column;
row-gap: 15px;
width: 50%;
}
#banner .container .baixo .esq .plantao {
display: flex;
flex-direction: column;
row-gap: 10px;
text-align: center;
}
#banner .container .baixo .dir {
width: 45%;
flex-direction: column;
row-gap: 10px;
padding: 14px;
}
#banner .container .baixo .dir .numero p span {
margin-right: 8px;
}
#piscina .container .dir {
flex-direction: column;
row-gap: 20px;
}
#piscina .container .dir .cima {
width: 100%;
}
#piscina .container .dir .baixo {
width: 100%;
height: auto;
}
#swiper .container .detalhe {
bottom: 10px;
}
#swiper .container .detalhe svg {
width: 60px;
height: auto;
}
#escolha-lote .container .baixo {
row-gap: 30px;
}
#escolha-lote .container .baixo .card {
width: 100%;
}
#escolha-lote .container .baixo .card .img img {
width: 100%;
}
#escolha-lote .container .baixo .card .texto {
min-height: unset;
}
#escolha-lote .container .cima .detalhe {
bottom: 10px;
}
#escolha-lote .container .cima .detalhe svg {
width: 60px;
height: auto;
}
#infraestrutura .texto {
font-size: 16px;
padding: 25px;
}
#mapa .info {
font-size: 16px;
padding: 20px;
}
#construcao .info {
font-size: 16px;
padding: 25px;
}
}
@media screen and (max-width: 600px) {
#implantacao .container .conteudo .bloco-lista {
flex-direction: column;
row-gap: 10px;
}
#construcao .container .esq img {
width: 400px;
height: auto;
}
#formulario {
scroll-margin-top: 70px;
}
#mapa {
scroll-margin-top: 134px;
}
#swiper {
scroll-margin-top: 70px;
overflow: hidden;
}
#swiper .swiper {
overflow: visible;
}
#banner .container .cima .conteudo {
width: 100%;
padding: 70px 30px 30px 30px;
}
#banner .container .cima .conteudo .dir {
width: 200px;
max-width: 100%;
}
#banner .container .cima .conteudo .esq .texto {
text-align: left;
}
#banner .container {
height: 478px;
}
}
@media screen and (max-width: 540px) {
.swiper-slide.swiper-slide-active {
transform: none;
}
.swiper-slide.swiper-slide-active .legenda,
.swiper-slide.swiper-slide-active .ampliar {
transform: none;
}
.swiper-slide.swiper-slide-active .legenda {
left: 13px;
bottom: 27px;
}
.swiper-slide img {
object-fit: cover;
}
#swiper .container-swiper .btn-next {
top: 100%;
}
#swiper .container-swiper .btn-prev {
right: 3%;
left: unset;
top: 100%;
}
#swiper .container-swiper {
padding-top: 0;
height: 432px;
margin-top: 20px;
}
#banner .container .baixo .esq .icone svg {
width: 28px;
height: auto;
}
#swiper .container .detalhe {
right: -15px;
}
}
@media screen and (max-width: 490px) {
#local .container .dir {
height: auto;
}
#local .container .dir a {
height: 100%;
}
#local .container .dir img {
width: 100%;
height: 100%;
object-fit: cover;
}
#lote .container .esq {
height: auto;
}
#lote .container .esq a {
height: 100%;
}
#lote .container .esq img {
width: 100%;
height: 100%;
object-fit: cover;
scale: 1;
}
#local .container .esq {
padding: 35px 32px 65px 32px;
}
#construcao .container .esq img {
width: 100%;
}
#construcao .container .dir p {
font-size: 16px;
}
form .box-input {
display: flex;
flex-direction: column;
row-gap: 15px;
}
form .box-input .box-ddd {
width: 100%;
}
form .box-input .box-telefone {
width: 100%;
}
#banner .container .baixo .esq .plantao {
font-size: 12px;
}
#banner .container .baixo .dir .numero p span {
font-size: 29px;
}
#banner .container .baixo .dir .numero p .dois {
font-size: 30px;
}
#banner .container .baixo .dir .lotes p {
font-size: 14px;
}
#banner .container .baixo .dir .lotes p span {
font-size: 20px;
}
}
@media screen and (max-width: 460px) {
#piscina .container .dir .cima {
padding: 28px;
}
#formulario-whats .container form {
padding: 35px 25px 40px 25px;
}
#formulario .container form {
padding: 35px 25px 40px 25px;
}
#banner .container .baixo .dir .lotes p {
width: 100%;
}
#banner .container .baixo .dir .numero {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
#banner .container .baixo .dir .numero p {
font-size: 32px;
}
}
@media screen and (max-width: 430px) {
#formulario-whats .container .icone {
right: -5px;
}
#formulario-whats .container .icone svg {
width: 55px;
height: auto;
}
#piscina .container .legenda {
padding: 0 10px 0px 0px;
}
#mapa .container a {
font-size: 20px;
}
}
@media screen and (max-width: 400px) {
#local .container .esq .detalhe svg {
width: 50px;
}
#implantacao .container .conteudo .bloco-lista {
padding: 22px;
}
#piscina .container .esq img {
border-radius: 20px 0px 20px 0px;
}
#piscina .container .esq::after {
border-radius: 0px 0px 20px 0px;
}
#piscina .container .dir .cima {
border-radius: 0px 20px 0px 20px;
}
#piscina .container .dir .baixo img {
border-radius: 20px 0px 20px 0px;
}
#piscina .container .dir .baixo::after {
border-radius: 0px 0px 20px 0px;
}
#formulario-whats {
scroll-margin-top: 90px;
}
#swiper {
padding: 60px 0px;
}
#banner {
padding: 100px 0px 60px 0px;
}
#local {
padding: 60px 0px;
}
#lote {
padding: 60px 0;
}
#formulario {
padding: 60px 0;
}
#escolha-lote {
padding: 60px 0px;
}
#formulario-whats {
padding: 60px 0;
}
#piscina {
padding: 60px 0;
}
#construcao {
padding-bottom: 60px;
}
#construcao .info {
margin-bottom: 60px;
}
}
@media screen and (max-width: 360px) {
#banner .container .baixo .dir .lotes p {
font-size: 16px;
}
#banner .container .baixo .dir .numero p span {
font-size: 30px;
}
}
@media screen and (max-width: 330px) {}
@media screen and (max-width: 280px) {}