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 {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
} article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
html{
font-size: 16px;
scroll-behavior: smooth;
}
@font-face {
font-family: 'Nexa';
src: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/fonts/NexaLight.otf) format('opentype');
font-weight: 300; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Nexa';
src: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/fonts/NexaBold.otf) format('opentype');
font-weight: 700; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Aaux Next';
src: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/fonts/aauxnextmd.otf) format('opentype');
font-weight: 500; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Aaux Next';
src: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/fonts/aauxnextlight.otf) format('opentype');
font-weight: 300; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Aaux Next';
src: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/fonts/aauxnextlight.otf) format('opentype');
font-weight: 300; font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Istanbul Type';
src: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/fonts/IstanbulThin.otf) format('opentype');
font-weight: 100; font-style: normal;
font-display: swap;
}
:root{
--transicao: 0.3s ease-in-out;
--font-nexa: 'Nexa', sans-serif;
--font-aaux: 'Aaux Next', sans-serif;
--font-istanbul: 'Istanbul Type', sans-serif;
--montserrat: "Montserrat", sans-serif;
}
.post, .page {
margin: 0;
}
.fbx-rounded.fbx-light .fbx-count{
display: none;
}
body {
line-height: 1;
background-image: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/img/bg-body.webp);
background-size: cover;
color: white;
font-family: var(--font-aaux);
position: relative;
}
a{
color: #fff;
}
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;
}
.whats{
position: fixed;
bottom: 35px;
right: 46px;
z-index: 900;
width: 82px;
height: 82px;
background-color: #00000030;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 50%;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
.whats svg{
color: #A4FFAA;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
.whats:hover{
background-color: #A4FFAA;
}
.whats:hover svg{
color: #000;
}
header{
width: 100%;
height: 108px;
position: fixed;
top: 0;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
z-index: 12;
}
header:hover{
background-color: #00000066;
border-bottom: 0.5px solid #fff;
-webkit-backdrop-filter: blur(14px);
backdrop-filter: blur(14px);
}
#logo-beyond{
display: none;
}
header img{
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
.menu-hamburger{
display: none;
}
header.preto{
background-color: #00000066;
border-bottom: 0.5px solid #fff;
height: 48px;
-webkit-backdrop-filter: blur(14px);
backdrop-filter: blur(14px);
}
header .container{
width: 1830px;
max-width: 95%;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
header .container nav{
width: 832px;
max-width: 65%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
header .container nav ul{
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
header .container nav ul li a{
text-decoration: none;
color: #fff;
font-weight: 300;
font-size: 16px;
position: relative;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
header .container nav ul li a::before{
content: '';
width: 100%;
height: 2px;
background-color: transparent;
position: absolute;
bottom: -3px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
header .container nav ul li a:hover{
}
header .container nav ul li a:hover::before{
background-color: #fff;
}
#banner{
background-image: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/img/img-banner-com-detalhe.webp);
background-size: cover;
background-repeat: no-repeat;
background-position: center bottom;
padding-top: 244px;
padding-bottom: 240px;
position: relative;
z-index: 2;
}
#banner .container{
width: 740px;
max-width: 90%;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
#banner .container .cinza{
font-family:var(--font-nexa);
font-weight: 400;
color: #000;
font-size: 16px;
letter-spacing: 7px;
text-transform: uppercase;
background-color: #D9D9D9;
text-align: center;
padding: 8px 2px 8px 10px;
margin-bottom: 30px;
}
#banner .container .alpha{
font-weight: 300;
font-style: Light;
font-size: 24px;
letter-spacing: 36px;
text-transform: uppercase;
color: #fff;
margin-bottom: 30px;
}
#banner .container .texto{
font-family: var(--font-nexa);
font-weight: 400;
font-size: 17px;
letter-spacing: 5.5px;
color: #fff;
margin-bottom: 60px;
}
#banner .container .img{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin-bottom: 30px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#banner .container .info{
color: #fff;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 15px;
font-family: var(--font-istanbul);
}
#banner .container .info .cima span{
font-size: 4.938rem;
text-transform: uppercase;
}
#banner .container .info .cima span .menor{
font-size: 2.063rem;
}
#banner .container .info .cima span .menor2{
position: relative;
}
#banner .container .info .cima span .menor2::before{
content: "**";
position: absolute;
top: 0;
font-size: 12px;
right: -10px;
}
#banner .container .info .meio{
width: 100%;
height: 1.79px;
background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(#fff), to(transparent));
background: -o-linear-gradient(left, transparent, #fff, transparent);
background: linear-gradient(to right, transparent, #fff, transparent);
}
#banner .container .info .baixo{
font-size: 2.875rem;
}
#banner .container .info .baixo .ou{
font-size: 1.875rem;
padding-right: 7px;
}
#banner .container .info .baixo .dorms{
letter-spacing: 12.4px;
padding-left: 9px;
}
#banner .mouse{
width: 26px;
height: 45px;
border-radius: 15px;
border: 1px solid #fff;
-webkit-animation: intro 1s;
animation: intro 1s;
margin-top: 30px;
position: absolute;
bottom: 42px;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
#banner .mouse .scroll{
display: block;
width: 12px;
height: 12px;
margin: 6px auto;
border-radius: 50%;
background: #fff;
-webkit-animation: finger 1s infinite;
animation: finger 1s infinite;
}
@-webkit-keyframes intro{
0% {
opacity: 0;
-webkit-transform: translateY(40px);
transform: translateY(40px);
}
100% {
opacity: 0.5;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes intro{
0% {
opacity: 0;
-webkit-transform: translateY(40px);
transform: translateY(40px);
}
100% {
opacity: 0.5;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@-webkit-keyframes finger{
0% {
opacity: 0.5;
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
}
@keyframes finger{
0% {
opacity: 0.5;
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
}
#sobre{
margin-top: -100px;
padding-bottom: 80px;
position: relative;
z-index: 1;
scroll-margin-top: 100px;
}
#sobre .luz{
position: absolute;
left: 0;
top: -575px;
pointer-events: none;
}
#sobre .container{
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-column-gap: 80px;
-moz-column-gap: 80px;
column-gap: 80px;
}
#sobre .container .esq{
width: 38%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: end;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: end;
padding: 198px 0px 0px;
position: relative;
z-index: 2;
}
#sobre .container .esq svg{
width: 431px;
height: auto;
}
#sobre .container .esq .texto{
width: 428px;
max-width: 90%;
font-size: 20.18px;
line-height: 22px;
text-align: right;
font-weight: 300;
margin: 27px 0px;
}
#sobre .container .esq a{
background-color: #fff;
color: #000;
border-radius: 10px;
padding: 16px 76px;
font-size: 20px;
text-decoration: none;
font-weight: 300;
border: 0.5px solid #fff;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#sobre .container .esq a:hover{
background-color: #000;
color: #fff;
}
#sobre .container .dir{
width: 60%;
height:652px;
background-image: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/img/galeria/img-galeria-16.webp);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
border-radius: 0px 0px 0px 15px;
}
#formulario{
width: 100%;
background-image: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/img/bg-form-contato.webp);
background-size: cover;
background-position: left;
background-repeat: no-repeat;
scroll-margin-top: 120px;
padding: 80px 0px;
position: relative;
overflow: hidden;
z-index: 3;
}
#formulario .detalhe{
position: absolute;
right: 0;
bottom: -10px;
}
#formulario .container{
width: 1265px;
max-width: 90%;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: right;
-ms-flex-pack: right;
justify-content: right;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
}
.phone_hp{
display: none;
}
form{
max-width: 50%;
padding: 40px 70px;
background-color: #FBF8F3;
border-radius: 5px;
z-index: 5;
color: #000;
position: relative;
}
form .saiba{
font-family: var(--font-nexa);
font-size: 23.3px;
font-weight: 300;
text-align: center;
letter-spacing: 1px;
margin-bottom: 15px;
}
form svg{
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
}
form .texto{
font-size: 12px;
font-weight: 300;
letter-spacing: 1px;
text-align: center;
margin-bottom: 26px;
margin-top: 20px;
}
form .texto span{
display: block;
margin-top: 10px;
}
form .box-input{
position: relative;
width: 100%;
margin-bottom: 15px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
form .box-input label{
font-family: var(--font-nexa);
font-weight: 400;
position: absolute;
font-weight: 400;
font-size: 15px;
left: 20px;
top: 14px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
form .box-input input, form .box-input textarea {
border: 0.5px solid #000;
width: 100%;
padding: 0 10px;
height: 45px;
background-color: transparent;
border-radius: 10px;
}
form .box-input textarea {
height: 82px;
resize: none;
padding-top: 10px;
}
form .box-check {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 8px;
-moz-column-gap: 8px;
column-gap: 8px;
margin-bottom: 12px;
accent-color: #000;
}
form .box-check label {
font-size: 12px;
font-weight: 700;
color: #000;
border-radius: 50px;
}
form .box-input label.subir {
font-size: 15px;
font-weight: 400;
top: -10px;
padding: 2.5px 9.5px;
z-index: 5;
background-color:#fff;
}
.error::-webkit-input-placeholder {
color: red !important;
}
.error::-moz-placeholder {
color: red !important;
}
.error:-ms-input-placeholder {
color: red !important;
}
.error::-ms-input-placeholder {
color: red !important;
}
.error,
.error::placeholder {
color: red !important;
}
form input[type='submit']{
margin-top: 15px; width: 100%;
background-color: #000;
font-size: 20px;
color: #fff;
font-weight: 700;
letter-spacing: 0.05em;
padding: 0;
height: 45px;
cursor: pointer;
border-radius: 13px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
border: 1px solid #000;
}
form input[type='submit']:hover{
background-color: #5A5755;
border-color: #fff;
}
#galeria{
position: relative;
z-index: 2;
padding-top: 77px;
}
#galeria .luz{
pointer-events: none;
position: absolute;
left: 0;
top: -575px;
}
#galeria .luz-dir{
pointer-events: none;
position: absolute;
right: 0;
top: -575px;
-webkit-transform: scale(-1);
-ms-transform: scale(-1);
transform: scale(-1)
}
#galeria .container{
width: 1360px;
max-width: 90%;
margin: 0 auto;
margin-bottom: 45px;
position: relative;
z-index: 2;
}
#galeria .container .titulo{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 14px;
-moz-column-gap: 14px;
column-gap: 14px;
margin-bottom: 25px;
}
#galeria .container .titulo h2{
font-family: var(--font-nexa);
font-weight: 400;
font-size: 1.75rem;
line-height: 40px;
letter-spacing: 2px;
}
#galeria .container .texto{
font-weight: 300;
font-size: 18px;
line-height: 22px;
}
#galeria .container-swiper {
height: 808px;
position: relative;
}
#galeria .simpleParallax{
height: 808px;
border-radius: 15px;
}
#galeria .container-swiper .swiper {
width: 100%;
height: 100%;
}
#galeria .container-swiper .swiper  .swiper-slide {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 15px;
}
#galeria .container-swiper .swiper  .swiper-slide .img{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 20px;
}
#galeria .container-swiper .swiper .swiper-slide img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: 20px;
}
#galeria .container-swiper .btn-navegacao {
width: 100%;
position: absolute;
top: 50%;
}
.swiper-button-prev{
left: 140px !important;
color: #fff !important;
}
.swiper-button-next{
right: 140px !important;
color: #fff !important;
}
.swiper-button-next:after, .swiper-button-prev:after {
font-size: 80px !important;
font-weight: 300 !important;
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo{
position: relative;
z-index: 2;
height: 90%;
width: 1649px;
max-width: 90%;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding:20px 0px;
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .cima .linha{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
height: 2px;
background-color: #fff;
margin-bottom: 20px
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .cima .titulo{
font-weight: 400;
font-size: 22px;
margin-bottom: 5px;
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .cima .ilustrativa{
font-weight: 300;
font-size: 16px;
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .baixo{
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .baixo .texto{
font-weight: 300;
font-size: 16px;
margin-bottom: 5px;
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .baixo .linha-btn{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .baixo .linha-btn .ampliar{
min-width: 50px;
min-height: 50px;
background-color: #FFFFFF40;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 5px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .baixo .linha-btn .ampliar svg{
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .baixo .linha-btn .ampliar:hover{
background-color: #fff;
color: #000;
}
#galeria .container-swiper .swiper  .swiper-slide .conteudo .baixo .linha{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
height: 2px;
background-color: #fff;
}
#plantas{
padding-top: 85px;
scroll-margin-top: 70px;
}
#plantas .container{
width: 1360px;
max-width: 90%;
margin: 0 auto;
position: relative;
z-index: 2;
}
#plantas .container .cima{
margin-bottom: 45px;
}
#plantas .container .cima .bloco-titulo{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 14px;
-moz-column-gap: 14px;
column-gap: 14px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 20px;
}
#plantas .container .cima .titulo{
font-size: 1.75rem;
font-family: var(--font-nexa);
font-weight: 400
}
#plantas .container .cima .texto{
font-size: 18px;
font-weight: 300;
line-height: 22px;
}
#plantas .container .baixo{
width: 100%;
}
#plantas .container .baixo .btns{
max-width: 100%;
background-color:#FFFFFF24;
margin: 0 auto;
padding: 3px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
border: 1px solid #fff;
margin-bottom: 23px;
-webkit-column-gap: 1px;
-moz-column-gap: 1px;
column-gap: 1px;
border-radius: 5px;
}
#plantas .container .baixo .btns .btn{
width: 14%;
border-radius: 2px;
font-weight: 400;
font-size: 20px;
line-height: 27px;
padding: 10px 0px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
cursor: pointer;
text-align: center;
font-family: var(--font-nexa);
}
#plantas .container .baixo .btns .btn:hover{
background-color: #fff;
color: #000;
}
#plantas .container .baixo .btns .btn.ativo{
background-color: #fff;
color: #000;
}
#plantas .container .baixo .area-planta{
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
background-color: #FFFFFF24;
border: 0.5px solid #fff;
padding: 40px;
border-radius: 5px;
}
#plantas .container .baixo .area-planta .esq{
width: 547px;
max-width: 50%;
display: flex;
justify-content: center;
align-items: center;
}
#plantas .container .baixo .area-planta .scale-x{
transform: scaleX(-1);
}
#plantas .container .baixo .area-planta .esq .img{
position: relative;
}
#plantas .container .baixo .area-planta .esq .img .detalhe{
width: 46px;
height: 46px;
position: absolute;
top: 26px;
right: 26px;
background-color: #00000080;
border-radius: 10px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#plantas .container .baixo .area-planta .esq .img .detalhe svg{
min-width: 26px;
min-height: 26px;
color: #fff;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#plantas .container .baixo .area-planta .esq .img .detalhe:hover{
background-color: #fff;
}
#plantas .container .baixo .area-planta .esq .img .detalhe:hover svg{
color: #000;
}
#plantas .container .baixo .area-planta .esq .img img{
width: 100%;
}
#plantas .container .baixo .area-planta .dir{
width: 700px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#plantas .container .baixo .area-planta .dir b{
font-weight: 700;
}
#plantas .container .baixo .area-planta .dir .titulo{
text-transform: uppercase;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 10px;
font-family: var(--font-nexa);
font-weight: 400;
margin-bottom: 30px;
}
#plantas .container .baixo .area-planta .dir .titulo .topo span{
display: block;
width: 100%;
text-align: center;
font-size: 2.55rem;
letter-spacing: 2px;
}
#plantas .container .baixo .area-planta .dir .titulo .meio{
width: 100%;
height: 2px;
background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(#fff), to(transparent));
background: -o-linear-gradient(left, transparent, #fff, transparent);
background: linear-gradient(to right, transparent, #fff, transparent);
display: block;
}
#plantas .container .baixo .area-planta .dir .titulo .baixo {
text-align: center;
}
#plantas .container .baixo .area-planta .dir .titulo .baixo span{
font-size: 1.4rem;
letter-spacing: 2px;
}
#plantas .container .baixo .area-planta .dir .img-dir{
position: relative;
width: 684px;
max-width: 100%;
height: 300px;
margin-bottom: 20px;
}
#plantas .container .baixo .area-planta .dir .img-dir img{
width: 100%;
height: 100%;
object-fit: cover;
}
#plantas .container .baixo .area-planta .dir .img-dir .detalhe{
width: 46px;
height: 46px;
position: absolute;
top: 26px;
right: 26px;
background-color: #00000080;
border-radius: 10px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#plantas .container .baixo .area-planta .dir .img-dir .detalhe svg{
min-width: 26px;
min-height: 26px;
color: #fff;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#plantas .container .baixo .area-planta .dir .img-dir .detalhe:hover{
background-color: #fff;
}
#plantas .container .baixo .area-planta .dir .img-dir .detalhe:hover svg{
color: #000;
}
#plantas .container .baixo .area-planta .dir .img-planta{
width: 100%;
position: relative;
}
#plantas .container .baixo .area-planta .dir .img-planta .detalhe{
width: 46px;
height: 46px;
position: absolute;
top: 15px;
right: 15px;
background-color: #00000080;
-webkit-backdrop-filter: blur(11px);
backdrop-filter: blur(11px);
border-radius: 10px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#plantas .container .baixo .area-planta .dir .img-planta .detalhe svg{
min-width: 26px;
min-height: 26px;
color: #fff;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#plantas .container .baixo .area-planta .dir .img-planta .detalhe:hover{
background-color: #fff;
}
#plantas .container .baixo .area-planta .dir .img-planta .detalhe:hover svg{
color: #000;
}
#plantas .container .baixo .area-planta .dir .info .texto{
font-size: 12px;
line-height: 15px;
font-weight: 300;
text-align: justify;
}
#plantas .container .baixo .sem-ambiente{
flex-direction: column;
align-items: center;
row-gap: 20px;
}
#plantas .container .baixo .sem-ambiente .dir .titulo {
width: 210px;
max-width: 100%;
}
#plantas .container .baixo .sem-ambiente .dir{
width: 100%;
max-width: 100%;
}
#rooftop{
padding-top: 86px;
scroll-margin-top: 70px;
position: relative;
}
#rooftop .luz{
position: absolute;
left: 0;
top: -575px;
pointer-events: none;
}
#rooftop .luz-dir{
position: absolute;
pointer-events: none;
right: 0;
top: -575px;
-webkit-transform: scale(-1);
-ms-transform: scale(-1);
transform: scale(-1)
}
#rooftop .container{
width: 1360px;
max-width: 90%;
margin: 0 auto;
position: relative;
z-index: 2;
}
#rooftop .container .cima{
margin-bottom: 45px;
}
#rooftop .container .cima .bloco-titulo{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 14px;
-moz-column-gap: 14px;
column-gap: 14px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 20px;
}
#rooftop .container .cima .titulo{
font-size: 1.75rem;
font-family: var(--font-nexa);
font-weight: 400
}
#rooftop .container .cima .texto{
font-size: 18px;
font-weight: 300;
line-height: 22px;
}
#rooftop .container .baixo{
width: 100%;
}
#rooftop .container .baixo .btns{
max-width: 100%;
background-color:#FFFFFF24;
margin: 0 auto;
padding: 3px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
border: 1px solid #fff;
margin-bottom: 23px;
-webkit-column-gap: 1px;
-moz-column-gap: 1px;
column-gap: 1px;
border-radius: 5px;
}
#rooftop .container .baixo .btns .btn{
width: 49.5%;
border-radius: 2px;
font-weight: 400;
font-size: 20px;
line-height: 27px;
padding: 10px 0px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
cursor: pointer;
text-align: center;
font-family: var(--font-nexa);
}
#rooftop .container .baixo .btns .btn:hover{
background-color: #fff;
color: #000;
}
#rooftop .container .baixo .btns .btn.ativo{
background-color: #fff;
color: #000;
}
#rooftop .container .baixo .area-rooftop{
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 60px;
background-color: #FFFFFF24;
border: 0.5px solid #fff;
padding: 40px;
border-radius: 5px;
}
#rooftop .container .baixo .area-rooftop .img{
position: relative;
}
#rooftop .container .baixo .area-rooftop .img .detalhe{
width: 46px;
height: 46px;
position: absolute;
top: 26px;
right: 26px;
background-color: #00000080;
border-radius: 10px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#rooftop .container .baixo .area-rooftop .img .detalhe svg{
min-width: 26px;
min-height: 26px;
color: #fff;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#rooftop .container .baixo .area-rooftop .img .detalhe:hover{
background-color: #fff;
}
#rooftop .container .baixo .area-rooftop .img .detalhe:hover svg{
color: #000;
}
#rooftop .container .baixo .area-rooftop .lista{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
transition: var(--transicao);
}
#rooftop .container .baixo .area-rooftop .lista ul{
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
column-gap: 17px;
row-gap: 17px;
overflow: hidden;
}
#rooftop .container .baixo .area-rooftop .lista ul li{
font-family: var(--font-istanbul);
font-size: 19px;
letter-spacing: 1px;
position: relative;
}
#rooftop .container .baixo .area-rooftop .lista ul li::after{
content: '';
width: 4px;
height: 4px;
background-color: #fff;
border-radius: 50%;
position: absolute;
right: -10px;
top: 50%;
transform: translateY(-50%);
}
#rooftop .container .baixo #terreo .lista ul li:last-child::after,#rooftop .container .baixo #rooftop-predio .lista ul li:last-child::after{
content: none;
}
#rooftop .container .baixo #rooftop-predio .lista ul{
width: 718px;
max-width: 100%;
}
#rooftop .container button{
display: none;
}
#vista-por-andar{
padding:86px 0px 86px;
}
#vista-por-andar.vista-ativa{
padding-bottom: 126px;
}
#vista-por-andar .container{
width: 1360px;
max-width: 90%;
margin: 0 auto;
display: flex;
column-gap: 14px;
align-items: center;
margin-bottom: 32px;
}
#vista-por-andar .titulo{
font-size: 1.9rem;
font-family: var(--font-nexa);
font-weight: 400;
}
#vista-por-andar .vista-aerea{
height: 550px;
width: 100%;
position: relative;
}
#vista-por-andar .vista-aerea .seta{
width: 100px;
height: 100px;
clip-path: polygon(100% 50%, 0 0, 0 100%);
background-color: #fff;
position: absolute;
left: 50%;
top: 50%;
transform: translateY(-50%) translateX(-50%);
cursor: pointer;
transition: var(--transicao);
}
#vista-por-andar .vista-aerea .seta:hover{
background-color: #000;
}
#vista-por-andar .vista-aerea img{
width: 100%;
height: 100%;
object-fit: cover;
filter: blur(4px);
}
#lazer{
padding-top: 86px;
scroll-margin-top: 70px;
margin-bottom: 89px;
}
#lazer .container{
}
#lazer .container{
width: 1360px;
max-width: 90%;
margin: 0 auto;
}
#lazer .container {
margin-bottom: 45px;
}
#lazer .container  .bloco-titulo{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 14px;
-moz-column-gap: 14px;
column-gap: 14px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 20px;
}
#lazer .container  .titulo{
font-size: 1.75rem;
font-family: var(--font-nexa);
font-weight: 400
}
#lazer .container  .texto{
font-size: 18px;
font-weight: 300;
line-height: 22px;
}
#lazer .container-galeria{
margin-top: 40px;
position: relative;
}
#lazer .container-galeria::after{
content: '';
width: 11%;
height: 105%;
position: absolute;
right: 0;
top: 0;
pointer-events: none;
z-index: 3;
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px);
}
#lazer .container-galeria::before{
content: '';
width: 11%;
height: 105%;
position: absolute;
left: 0;
top: 0;
pointer-events: none;
z-index: 3;
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
}
#lazer .container-galeria .swiper {
width: 100%;
height: 100%;
}
#lazer .container-galeria  .swiper-slide{
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 30px;
font-family: var(--font-istanbul);
font-size: 1.75rem;
letter-spacing: 2px;
position: relative;
padding-bottom: 30px;
}
#lazer .container-galeria  .swiper-slide a {
height: 100%;
}
#lazer .container-galeria  .swiper-slide .rooftop{
display: block;
margin-top: 10px;
}
#lazer .container-galeria .swiper-slide .btnFull{
position: absolute;
min-width: 46px;
height: 46px;
background-color:#00000080;
top: 26px;
right: 26px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
cursor: pointer;
border-radius: 10px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#lazer .container-galeria  .swiper-slide .btnFull:hover{
background-color: #fff;
}
#lazer .container-galeria  .swiper-slide .btnFull:hover svg{
color: #000;
}
#lazer .container-galeria  .swiper-slide .btnFull svg{
min-width: 26px;
min-height: 26px;
color: #fff;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#lazer .container-galeria  .swiper-slide .btnFull a{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#lazer .container-galeria  .swiper-slide .img{
height: 522px;
}
#lazer .container-galeria .swiper-slide img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: 15px;
}
#formulario-whats{
width: 100%;
background-image: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/img/bg-form-whats.webp);
background-size: cover;
background-position: right;
background-repeat: no-repeat;
scroll-margin-top: 120px;
padding: 80px 0px;
position: relative;
z-index: 2;
overflow: hidden;
}
#formulario-whats .detalhe{
position: absolute;
left: 0;
bottom: -10px;
}
#formulario-whats .container{
width: 1180px;
max-width: 90%;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: left;
-ms-flex-pack: left;
justify-content: left;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
position: relative;
}
#formulario-whats .container form{
padding-top: 88px;
padding-bottom: 88px;
}
#formulario-whats .container form .saiba {
font-family: var(--font-nexa);
font-weight: 400;
letter-spacing: 1px;
}
#formulario-whats .container form .btn-whats {
width: 100%;
background-color: #000;
font-size: 20px;
font-weight: 400;
color: #fff;
font-weight: 400;
letter-spacing: 0.05em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 10px;
-moz-column-gap: 10px;
column-gap: 10px;
padding: 0;
height: 45px;
cursor: pointer;
border-radius: 13px;
border: none;
margin-top: 30px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#formulario-whats .container form .btn-whats svg {
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
margin: unset;
}
#formulario-whats .container form .btn-whats:hover {
background-color: #5A5755;
}
#localizacao {
padding-top: 80px;
position: relative;
}
#localizacao .luz{
position: absolute;
pointer-events: none;
left: 0;
top: -575px;
-webkit-transform: scale(-1);
-ms-transform: scale(-1);
transform: scale(-1);
}
#localizacao .luz svg{
height: 2000px;
}
#localizacao .luz-dir{
position: absolute;
pointer-events: none;
right: 0;
top: -575px;
}
#localizacao .luz-dir svg{
height: 2000px;
}
#localizacao .container {
width: 1360px;
max-width: 90%;
margin: 0 auto;
position: relative;
z-index: 2;
}
#localizacao .container .area-titulo {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 15px;
-moz-column-gap: 15px;
column-gap: 15px;
margin-bottom: 40px;
}
#localizacao .container .area-titulo .titulo {
font-size: 2rem;
line-height: 40px;
font-weight: 400;
font-family: var(--font-nexa);
font-weight: 400;
text-transform: uppercase;
}
#localizacao .container .area-titulo svg {
min-width: 21px;
}
#localizacao .container .mapa {
width: 100%;
position: relative;
}
#localizacao .container .mapa iframe {
width: 100%;
border-radius: 30px;
}
#localizacao .container .mapa .btns {
position: absolute;
top: 25px;
right: 25px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 24px;
-moz-column-gap: 24px;
column-gap: 24px;
}
#localizacao .container .mapa .btns a {
height: 54px;
padding: 0px 40px;
text-decoration: none;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 10px;
-moz-column-gap: 10px;
column-gap: 10px;
font-size: 18px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-radius: 5px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-weight: 400;
color: #000;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#localizacao .container .mapa .btns .waze {
background-color: #00000066;
color: #fff;
}
#localizacao .container .mapa .btns .waze:hover {
background-color: #fff;
border: 0.5px solid #000;
color: #000;
}
#localizacao .container .mapa .btns .maps {
border: 0.5px solid #000;
background-color: #fff;
}
#localizacao .container .mapa .btns .maps:hover {
background-color: #00000066;
color: #fff;
border-color: transparent;
}
#localizacao .container .mapa .btns .maps:hover svg {
color: #fff;
}
#localizacao .container .mapa .btns a svg {
color: #000;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
#realizacao {
padding-top: 45px;
scroll-margin-top: 80px;
}
#realizacao .container {
width: 1360px;
max-width: 90%;
margin: 0 auto;
position: relative;
z-index: 2;
}
#realizacao .container .cima {
width: 100%;
}
#realizacao .container .cima h2{
font-family: var(--font-istanbul);
font-size: 2rem;
letter-spacing: 2px;
margin-bottom: 10px;
}
#realizacao .container .cima .texto{
font-family: var(--font-nexa);
font-weight: 400;
font-size: 18px;
line-height: 22px;
text-align: justify;
}
#realizacao .container .meio {
padding-top: 60px;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-column-gap: 80px;
-moz-column-gap: 80px;
column-gap: 80px;
}
#realizacao .container .meio .esq {
width: 50%;
height: -webkit-max-content;
height: -moz-max-content;
height: max-content;
background-color: #E8E8E8;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 25px;
padding-left: 10px;
cursor: none;
}
#realizacao .container .meio .dir {
width: 50%;
font-family: var(--montserrat);
}
#realizacao .container .meio .dir h3 {
width: 489px;
max-width: 100%;
font-weight: 700;
font-size: 2rem;
margin-bottom: 28px;
}
#realizacao .container .meio .dir .texto {
width: 567px;
max-width: 100%;
font-size: 12px;
line-height: 175%;
font-weight: 300;
margin-bottom: 20px;
}
#realizacao .container .meio .dir .icones {
width: 460px;
max-width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
#realizacao .container .baixo {
padding-top: 100px;
width: 659px;
max-width: 100%;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
}
#realizacao .container .baixo .item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 54px;
}
#realizacao .container .baixo .item .texto {
font-family: var(--font-nexa);
font-weight: 700;
font-size: 18px;
font-weight: 27px;
text-align: center;
}
#politica {
padding: 100px 0px 80px;
position: relative;
}
#politica .detalhe{
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
bottom: -7px;
}
#politica .esquerda {
position: absolute;
bottom: -5px;
left: 0;
}
#politica .direita {
position: absolute;
right: 0;
bottom: -7px;
}
#politica .esquerda svg,
#politica .direita svg {
max-width: 100%;
height: auto;
}
#politica .container {
width: 1360px;
max-width: 90%;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
row-gap: 40px;
font-family: var(--montserrat);
position: relative;
z-index: 2;
}
#politica .container p {
font-family: var(--montserrat);
width: 100%;
font-size: 12px;
letter-spacing: 1px;
color: #fff;
text-align: center;
line-height: 18px;
font-weight: 300;
}
#politica .container .title {
font-family: var(--font-nexa);
font-weight: 500;
}
.lupa-zoom {
position: absolute;
width: 120px;
height: 120px;
border-radius: 50%;
border: 4px solid #000; -webkit-box-shadow: 0 0 8px rgba(0,0,0,0.5);
box-shadow: 0 0 8px rgba(0,0,0,0.5);
pointer-events: none;
display: none;
background-repeat: no-repeat;
background-clip: content-box;
cursor: none;
} .lupa-zoom::before {
content: "";
position: absolute;
width: 8px;
height: 70px;
background: #000;
border-radius: 4px;
bottom: -30px;
right: 0;
-webkit-transform: rotate(315deg);
-ms-transform: rotate(315deg);
transform: rotate(315deg);
-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.5);
box-shadow: 0 0 3px rgba(0,0,0,0.5);
cursor: none;
}
footer {
background-color: #e8e8e8;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 18px 0px;
position: relative;
z-index: 2;
}
@media screen and (max-width: 1920px) {}
@media screen and (max-width: 1680px) {}
@media screen and (max-width: 1600px) {
html {
font-size: 15px;
}
#plantas .container .baixo .area-planta .dir {
max-width: 50%;
}
}
@media screen and (max-width: 1440px) {}
@media screen and (max-width: 1366px) {
#lazer .container-galeria .swiper-slide .img {
height: 475px;
}
#realizacao .container .meio {
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
}
}
@media screen and (max-width: 1280px) {
#sobre .container {
-webkit-column-gap: 45px;
-moz-column-gap: 45px;
column-gap: 45px;
}
#sobre .container .esq svg {
width: 90%;
}
#galeria .container-swiper {
height: 750px;
}
#galeria .simpleParallax {
height: 750px;
}
.swiper-button-next:after, .swiper-button-prev:after {
font-size: 50px !important;
}
}
@media screen and (max-width: 1200px) {}
@media screen and (max-width: 1080px) {}
@media screen and (max-width: 1024px) {
html {
font-size: 14px;
}
html.trava-scroll {
overflow: hidden;
}
header .container {
max-width: 90%;
}
header .container nav {
width: 100%;
max-width: 100%;
height: 100vh;
top: 45px;
position: fixed;
right: revert-layer;
-webkit-transform: unset;
-ms-transform: unset;
transform: unset;
left: -100%;
border-radius: 0;
background-image: url(//www.beyondresidence.com.br/wp-content/themes/beyondresidence/assets/img/bg-body.webp);
background-size: cover;
background-repeat: no-repeat;
bottom: unset;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
padding-top: 80px; padding-bottom: 160px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
header .container nav.ativo {
left: 0;
overflow: auto;
}
header .container .menu-hamburger {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 7px;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
header .container .menu-hamburger .hamburger {
width: 22px;
height: 2px;
background-color: #fff;
display: block;
-webkit-transition: var(--transicao);
-o-transition: var(--transicao);
transition: var(--transicao);
}
header .menu-hamburger.ativo .hamburger-01 {
-webkit-transform: rotate(42deg) translate(7px, 5.5px);
-ms-transform: rotate(42deg) translate(7px, 5.5px);
transform: rotate(42deg) translate(7px, 5.5px);
}
header .menu-hamburger.ativo .hamburger-02 {
opacity: 0;
}
header .menu-hamburger.ativo .hamburger-03 {
-webkit-transform: rotate(-46deg) translate(8px, -5.5px);
-ms-transform: rotate(-46deg) translate(8px, -5.5px);
transform: rotate(-46deg) translate(8px, -5.5px);
}
header {
background-color: #00000066;
border-bottom: 0.5px solid #fff;
-webkit-backdrop-filter: blur(14px);
backdrop-filter: blur(14px);
}
header.preto {
height: 45px;
}
header .container nav ul {
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
text-align: center;
row-gap: 29px;
}
header .container nav ul li {
padding: 0;
border: none;
}
header .container nav ul li a {
font-size: 22px;
}
#sobre{
margin: 0 auto;
}
#sobre .container {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 40px;
}
#sobre .container .esq {
padding-top: 40px;
margin: 0 auto;
width: 90%;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#sobre .container .esq .texto {
width: 500px;
text-align: center;
}
#sobre .container .esq svg{
width: 430px;
}
#sobre .container .dir {
width: 100%;
height: 465px;
border-radius: 0px;
}
form {
max-width: 100%;
padding: 40px 30px;
}
form .box-input input, form .box-input textarea {
border: 1px solid #000;
width: 100%;
}
form input[type='submit'] {
margin-left: 0px;
width: 100%;
}
#formulario-whats .container form .btn-whats {
width: 100%;
margin: 0;
}
#formulario-whats .container form {
padding: 40px 30px;
}
form .box-check {
margin-left: 0px;
}
#galeria .container-swiper {
height: 650px;
}
#galeria .simpleParallax {
height: 650px;
}
.swiper-button-prev {
left: 80px !important;
}
.swiper-button-next {
right: 80px !important;
}
#plantas .container .baixo .btns {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 4px;
}
#plantas .container .baixo .btns .btn{
width: 100%;
}
#plantas .container .baixo .area-planta {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
row-gap: 40px;
}
#plantas .container .baixo .area-planta .esq {
width: 100%;
max-width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#plantas .container .baixo .area-planta .dir {
width: 100%;
max-width: 100%;
}
#plantas .container .cima .texto {
font-size: 16px;
}
#galeria .container .texto {
font-size: 16px;
}
#rooftop .container .cima .texto {
font-size: 16px;
}
#rooftop .container .baixo .area-rooftop {
align-items: start;
justify-content: start;
row-gap: 30px
}
#rooftop .container .baixo .area-rooftop .btn-mostrar-lista{
background-color: #000000;
color: #FBF8F3;
padding: 15px 60px;
border: none;
border-radius: 10px;
position: relative;
transition: var(--transicao);
}
#rooftop .container .baixo .area-rooftop .btn-mostrar-lista:hover {
background-color: #fff;
color: #000;
}
#rooftop .container .baixo .area-rooftop .btn-mostrar-lista svg{
position: absolute;
right: 10px;
top: 50%;
transition: var(--transicao);
transform: translateY(-50%) rotate(90deg);
}
#rooftop .container .baixo .area-rooftop .btn-mostrar-lista.lista-ativa svg{
transform: translateY(-50%) rotate(270deg);
}
#rooftop .container .baixo .area-rooftop .lista {
width: 100%;
justify-content: start;
opacity: 0;
height: 0;
}
#rooftop .container .baixo .area-rooftop .lista.visivel {
opacity: 1;
height: 100%;
transition: var(--transicao);
visibility: visible;
}
#rooftop .container .baixo .area-rooftop .lista ul {
flex-direction: column;
align-items: start;
}
#rooftop .container .baixo .area-rooftop .lista ul li {
font-size: 16px;
}
#rooftop .container .baixo .area-rooftop .lista ul li::after{
content: none;
}
#lazer .container .texto {
font-size: 16px;
}
#realizacao .container .cima .texto {
font-size: 16px;
}
#lazer .container-galeria::after {
width: 22%;
height: 105%;
}
#lazer .container-galeria::before {
width: 22%;
height: 105%;
}
#localizacao .container .mapa .btns {
top: unset;
right: unset;
left: 50%;
bottom: 25px;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
max-width: 90%;
width: 100%;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
#realizacao .container .meio {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
row-gap: 40px;
}
#realizacao .container .meio .esq {
width: 460px;
margin: 0 auto;
max-width: 100%;
}
#realizacao .container .meio .dir {
width: 100%;
}
#realizacao .container .meio .dir .texto {
width: 100%;
}
#realizacao .container .meio .dir h3 {
width: 100%;
}
#realizacao .container .meio .dir .icones {
margin: 0 auto;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
} #sobre .luz svg, #galeria .luz svg, #galeria .luz-dir svg, #rooftop .luz svg, #rooftop .luz-dir svg, #localizacao .luz-dir svg,#localizacao .luz svg {
width: 100%;
height: 100%;
}
#vista-por-andar.vista-ativa {
padding-bottom: 150px;
}
#vista-por-andar .vista-aerea {
height: 500px;
}
}
@media screen and (max-width: 996px) {}
@media screen and (max-width: 880px) {
#formulario .container {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
#formulario-whats .container {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
#banner .container .img svg{
width: 600px;
height: auto;
}
#banner .container .texto {
font-size: 16px;
text-align: center;
line-height: 20px;
}
}
@media screen and (max-width: 768px) {
.whats {
bottom: 15px;
right: 15px;
width: 60px;
height: 60px;
}
.whats svg {
width: 30px;
height: 30px;
}
#sobre .container .dir {
height: 400px;
}
#rooftop .container .baixo .btns {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 4px;
}
#rooftop .container .baixo .btns .btn{
width: 100%;
}
#rooftop .container .baixo .area-rooftop .lista {
width: 90%;
}
#rooftop .container .baixo .area-rooftop .lista ul {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
}
#rooftop .container .baixo .area-rooftop .lista ul li {
border: none !important;
}
#lazer .container-galeria::before{
width: 11%;
}
#lazer .container-galeria::after {
width: 11%;
}
#galeria .container-swiper {
height: 500px;
}
#galeria .simpleParallax {
height: 500px;
}
.swiper-button-next {
right: 50px !important;
}
.swiper-button-prev {
left: 50px !important;
}
#realizacao .container .baixo {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 40px;
padding-top: 45px;
}
#realizacao .container .baixo .item {
row-gap: 26px;
}
}
@media screen and (max-width: 700px) {
#banner .container .img svg {
width: 90%;
}
#banner .container .alpha {
font-size: 20px;
}
}
@media screen and (max-width: 600px) {
#banner .container .alpha {
font-size: 16px;
letter-spacing: 30px;
}
#banner .container .info .cima span {
font-size: 4rem;
}
#localizacao .container .area-titulo .titulo {
font-size: 24px;
}
}
@media screen and (max-width: 490px) {
#banner {
padding-top: 145px;
}
#sobre .container .esq svg {
width: 90%;
}
#sobre .container .dir {
height: 330px;
}
#galeria .container-swiper {
padding: 10px;
}
#galeria .container-swiper .swiper{ }
#galeria .simpleParallax {
height: 475px;
}
#galeria .container-swiper .btn-navegacao {
width: 75px;
position: absolute;
bottom: -40px;
right: 20px;
top: unset;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
#galeria .container .titulo h2 {
font-size: 24px;
line-height: 28px;
}
#galeria .container-swiper .btn-navegacao .swiper-button-next{
position: relative;
right: unset !important;
top: unset;
}
#galeria .container-swiper .btn-navegacao .swiper-button-prev{
position: relative;
left: unset !important;
top: unset;
}
#galeria .container-swiper .swiper .swiper-slide .conteudo .cima .titulo {
font-size: 16px;
}
#galeria .container-swiper .swiper .swiper-slide .conteudo .cima .ilustrativa {
font-size: 12px;
}
.swiper-button-next:after, .swiper-button-prev:after {
font-size: 30px !important;
}
#lazer .container-galeria {
padding: 10px;
}
#lazer .container-galeria::before,#lazer .container-galeria::after {
content: none;
}
#plantas .container .baixo .area-planta {
padding: 30px;
}
#plantas .container .baixo .area-planta .esq .img .detalhe {
width: 30px;
height: 30px;
top: 15px;
right: 15px;
}
#plantas .container .baixo .area-planta .esq .img .detalhe svg {
min-width: 20px;
width: 20px;
height: auto;
}
#plantas .container .baixo .area-planta .dir .img-dir .detalhe {
width: 30px;
height: 30px;
top: 15px;
right: 15px;
}
#plantas .container .baixo .area-planta .dir .img-dir .detalhe svg{
min-width: 20px;
width: 20px;
height: auto;
}
#plantas .container .baixo .area-planta .dir .titulo .topo span {
font-size: 2rem;
}
#rooftop .container .baixo .area-rooftop .img .detalhe {
width: 30px;
height: 30px;
top: 15px;
right: 15px;
}
#rooftop .container .baixo .area-rooftop .img .detalhe svg {
min-width: 20px;
width: 20px;
height: auto;
}
#rooftop .container .baixo .area-rooftop {
padding: 30px;
}
#localizacao .container .mapa .btns {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 15px;
}
#politica {
padding: 65px 0px
}
#lazer .container-galeria .swiper-slide .img {
height: 365px;
}
#vista-por-andar.vista-ativa {
padding-bottom: 200px;
}
#vista-por-andar .vista-aerea {
height: 450px;
}
}
@media screen and (max-width: 460px) {
#banner .container .alpha {
letter-spacing: 18px;
}
#banner .container .texto {
letter-spacing: 3.5px;
}
#banner .container .info .cima span {
font-size: 3rem;
}
#banner .container .info .baixo .ou{
font-size: 1.4rem;
padding-right: 0px;
}
#banner .container .info .baixo{
font-size: 36px;
}
#banner .container .info .baixo .dorms {
font-size: 18px;
margin-top: 15px;
padding-left: 0px;
letter-spacing: 8px;
}
}
@media screen and (max-width: 430px) {
#formulario .detalhe svg{
width: 270px;
}
#formulario-whats .detalhe svg{
width: 270px;
}
}
@media screen and (max-width: 400px) {
#politica .detalhe svg {
width: 280px;
height: auto;
}
#formulario-whats .container form .btn-whats {
font-size: 18px;
}
}
@media screen and (max-width: 360px) {
#banner .container .alpha {
letter-spacing: 12px;
}
}
@media screen and (max-width: 330px) {
#politica .detalhe svg {
width: 250px;
}
}
@media screen and (max-width: 280px) {}