.container {position:relative; width:80%; max-width:1280px; margin:0 auto; padding:0; box-sizing:border-box; }
.container-fluid {position:relative; width:100%; margin:0 auto; padding: 0; box-sizing:border-box; }
.column,.columns { width: 100%; float: left; box-sizing: border-box; }
.pad2{padding:20px}.pad3{padding:30px}.pad4{padding:40px}.pad5{padding:50px}.pad6{padding:70px 0}
.padd{padding:80px 0; min-height:60px}.pad{padding:20px}
.br{color:#fff}
.green{color:#7ba805}
.verdlogo{color:#aed32f}
.bgbr{background-color:#fff}
.red{color:#d22630}
.bgred{background-color:#d22630}
.orange{color:#da872a}
.bgorange{background-color:#da872a}
.bk{color:#000}
.cz{color:#333}
.blu{color:#12446f}
.ouro{color:#ab8a26}
.bgouro{background-color:#ab8a26}
.bgourot{background-color:rgba(180,148,38,0.8);}
.bgblut{background-color:rgba(85,130,150,0.8);}
.bgroxo{background-color:rgba(110,60,180,0.7);}
.bgvd{background-color:rgba(50,80,60,0.7);}
.bgdourado{background:rgb(215,196,120); background: linear-gradient(142deg, rgba(215,196,120,1) 31%, rgba(175,145,54,1) 66%); }
.bgblu{background-color:#12446f}
.som{text-shadow:1px 1px 19px rgba(0, 0, 0, 0.4);}
.somd{-webkit-box-shadow:0px 0px 50px 0px rgba(0,0,0,0.4); -moz-box-shadow:0px 0px 50px 0px rgba(0,0,0,0.4); box-shadow:0px 0px 50px 0px rgba(0,0,0,0.4);}
.somlados{box-shadow:0 9px 0px 0px #052a41, 0 0 0px 0px #052a41, 12px 0 15px -4px rgba(0,40,60, 0.97), -12px 0 15px -4px rgba(0,40,60, 0.97);}
.over{position:absolute; float:left;z-index:100;}
.trans{background-color: cornflowerblue;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";filter:alpha(opacity=50);opacity:0.5}
.oki{text-transform: uppercase}
.img-circle {border-radius: 50%;}
.round {border-radius:12px}
.tsom{text-shadow:0px 5px 9px rgba(0,0,0,0.44);}

.bgvdd{background:rgb(77,163,129); background:radial-gradient(circle at bottom center, rgba(77,163,159,1) 13%, rgba(58,96,97,1) 39%, rgba(47,72,84,1) 76%); }
.bgblud{background:rgb(137,163,199); background:radial-gradient(circle at bottom center, rgba(137,163,199,1) 13%, rgba(48,76,167,1) 39%, rgba(17,32,74,1) 76%); }
.bgroxd{background:rgb(174,135,200); background:radial-gradient(circle at bottom center, rgba(174,135,200,1) 13%, rgba(130,57,168,1) 39%, rgba(61,17,74,1) 76%); }

.zoom{transition: transform 0.2s;}
.zoom:hover{transform: scale(1.1)}
.hide {opacity:0;left:-100%}
.show {opacity:1;left:0}

.row {padding:0}

@media (min-width: 680px) {
  .column, .columns { margin-left:2.5%; }
  .column:first-child, .columns:first-child { margin-left: 0; }

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 12.3333333333%; }
  .three.columns                  { width: 23%;            }
  .four.columns                   { width: 31.4666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }
  .one-third.column               { width: 30.6666666667%; }
  .two-thirds.column              { width: 65.3333333333%; }
  .one-half.column                { width: 48%; }

  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }

}



html {font-size: 62.5%; scroll-behavior:smooth; margin: 0; padding:0; }
body {font-size:1.5em; font-family:'Noto Sans Display', sans-serif; line-height:1.4; font-weight:400; background-color:#e8e8e8; color:#222; overflow-x:hidden; }

h1, h2, h3, h4, h5, h6 {margin-top:1rem; margin-bottom:1.2rem; color:#000; font-weight:300; line-height:1.2; letter-spacing:0.2em}
h1 { font-size: 2.5rem; font-weight:bolder}
h2 { font-size: 2.5rem; font-weight:lighter; text-transform:uppercase}
h3 { font-size: 2.3rem; text-transform:uppercase}
h4 { font-size: 2.0rem; }
h5 { font-size: 1.8rem; }
h6 { font-size: 1.2rem; }

@media (min-width:900px) {
  h1 { font-size: 4.6rem; }
  h2 { font-size: 4.3rem; }
  h3 { font-size: 3.5rem; }
  h4 { font-size: 2.2rem; }
  h5 { font-size: 1.8rem; }
  h6 { font-size: 1.5rem; }
}

@media (min-width:1600px) {
  h1 { font-size: 5.0rem; }
  h2 { font-size: 4.2rem; }
  h3 { font-size: 3.5rem; }
  h4 { font-size: 2.5rem; }
  h5 { font-size: 2.2rem; }
  h6 { font-size: 1.5rem; }
}

p {margin:0; font-size:1.2em; font-weight:300}


a {color:orange; text-decoration:none;-webkit-transition:color 0.2s ease-in; -moz-transition:color 0.2s ease-in; -o-transition:color 0.2s ease-in}
a:hover { color:#bbb}



.button,button,input[type="submit"],input[type="reset"],
input[type="button"] {display:inline-block; height:46px; padding:0 30px; color:#fff; text-align:center; font-size:0.9em; font-weight:400; line-height:46px; text-transform:uppercase; text-decoration:none; white-space:nowrap; background-color:#3e3e40; cursor:pointer; box-sizing:border-box; border:1px none #fff; letter-spacing:0.2em}
.button:hover,button:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover,.button:focus,button:focus,input[type="submit"]:focus,input[type="reset"]:focus,input[type="button"]:focus {color:#fff; outline: 0; background-color:#000}
.button.button-primary,button.button-primary,input[type="submit"].button-primary,input[type="reset"].button-primary,
input[type="button"].button-primary {background-color: #95b42a; color:#fff; font-size:20px; padding:8px 33px; height:58px}
.button.button-primary:hover,button.button-primary:hover,input[type="submit"].button-primary:hover,input[type="reset"].button-primary:hover,input[type="button"].button-primary:hover,.button.button-primary:focus,button.button-primary:focus,input[type="submit"].button-primary:focus,input[type="reset"].button-primary:focus,input[type="button"].button-primary:focus {color:#FFF; background-color:#ccc}

.button-sec{height:38px; padding:8px 12px 8px 12px; color:#fff; text-align:center; font-size:12px; font-weight:600; line-height:38px; text-decoration: none; white-space: nowrap; background-color:#d22630; border-radius:19px; cursor: pointer; box-sizing: border-box; margin:0 10px}
.button-sec:hover {color:#fff; background-color:#d22630}

.bbr{height:58px; padding:0 27px 9px 27px; color:#fff; text-align:center; font-size:28px; font-weight:bolder; letter-spacing:-0.03em; line-height:58px; text-decoration: none; white-space: nowrap; background-color:#7ba805; border-radius:19px; cursor: pointer; box-sizing: border-box}
.bbr:hover {background-color:#6c18f4}


input[type="email"],input[type="number"],input[type="search"],input[type="text"],input[type="tel"],input[type="url"],input[type="password"],input[type="date"],textarea,select {height:52px; padding:9px 10px; background-color:#fff; border: 1px solid #D1D1D1; border-radius:4px; box-shadow:none; box-sizing: border-box; font-size:22px}
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],input[type="number"],input[type="search"],input[type="text"],input[type="tel"],input[type="url"],input[type="password"],
textarea {-webkit-appearance: none; -moz-appearance: none;appearance: none; }
textarea {min-height: 65px; padding-top: 6px; padding-bottom: 6px; }
input[type="email"]:focus,input[type="number"]:focus,input[type="search"]:focus,input[type="text"]:focus,input[type="tel"]:focus,input[type="url"]:focus,input[type="password"]:focus,textarea:focus,select:focus {border:2px solid #03ab90; outline: 0; }
label,legend {display: block; margin-bottom: .5rem; font-weight: 600; }
fieldset { padding: 0; border-width: 0; }
input[type="checkbox"],input[type="radio"] { display: inline; padding: 5px}
label > .label-body { display: inline-block; margin-left: .5rem; font-weight: normal; }



ul {list-style:none }
ol {list-style: decimal inside; }
ol, ul {padding-left: 0; margin-top: 0; }
ul ul,ul ol,ol ol,ol ul {margin: 1.5rem 0 1.5rem 3rem}
li {margin-bottom: 1rem; }

code {padding:.2rem .5rem; margin: 0 .2rem; font-size:90%; white-space:nowrap; background:#F1F1F1; border:1px solid #E1E1E1; border-radius:4px}
pre > code {display: block;padding: 1rem 1.5rem;white-space: pre; }

table {border-collapse: collapse; margin:0; padding:0; width:100%; table-layout:fixed}
table caption {font-size:1.5em; margin:.5em 0 .75em 0}
table tr {padding:2em 0}
table th,table td { padding:.625em 0; text-align: center; border-bottom: 1px solid #E1E1E1}
table th, thead {font-size: .8em; text-transform: uppercase; font-weight: bold}

@media screen and (max-width: 600px) {
  table thead {border:none; clip: rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }
  table tr {background-color:#fff; display:block; padding:0 10px; border-bottom:12px solid #e7eff3}
  table td {border-bottom: 1px solid #ddd; display:block; font-size:11px; text-align:right}
  table td:before {content: attr(data-label); float: left; }
  .ttd {font-size:12px}
}



button,.button {margin-bottom: 1rem; }
input,textarea,select,fieldset {margin-bottom: 1.5rem; }
pre,blockquote,dl,figure,table,p,ul,ol,form {margin-bottom: 1.5rem; }

.u-full-width {width:100%; box-sizing:border-box}
.u-half-width {width:49.7%; box-sizing:border-box}
.u-max-full-width {max-width:100%; box-sizing:border-box}
.u-pull-right {float:right}
.u-pull-left {float:left}
.text-center{text-align: center}
.text-just{text-align: justify}
.text-right{text-align: right}
.it{font-style: italic}
.text-n{text-transform:none}
.upper{text-transform: uppercase;}
.esp{letter-spacing:0.3em}
.leve{font-weight:300}
hr {margin-top:2rem; margin-bottom:2.5rem; border-width:0; border-top: 1px solid #E1E1E1}
.container:after,.row:after,.u-cf { content:""; display:table; clear:both}


@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bounce {
  0%, 100% { transform: scale(0.0);-webkit-transform: scale(0.0);
  } 50% { transform: scale(1.0); -webkit-transform: scale(1.0); }
}





.rslides {position:relative; list-style:none; overflow:hidden; padding:0}
.rslides li {-webkit-backface-visibility:hidden; position:absolute; display:none; width:100%; left:0; top:0; }
.rslides li:first-child {position: relative; display: block; float: left; }





@media (min-width: 320px) {
#topp{position:absolute; top:0; height:90px; z-index:2; padding:0}
.pec{z-index:20; margin:30px auto; width:100%}
.pe{padding:30px 10px; color:#333 }
.pe a{color:#333}
.ico{width:26px;margin:0 7px -3px 0}
.construtora{background-color:#3f4042; padding:50px 10px; margin:50px 0 50px 0}
#form{position:absolute; margin:270px 0 30px 20px; width:87%; z-index:15; padding:15px 20px 0 20px}
.w3{font-size:10px; letter-spacing:0.6em; color:#333; margin:20px 0 0 2%; width:60%}
.bt{display:inline-block; font-size:0.7em; height:30px; padding:0 18px; line-height:1em; margin:-2px; font-weight:400; letter-spacing:0.1em}

.box {z-index:50; position:absolute; width:80%; height:auto; left:10%; margin:360px auto 0 auto; padding:0}
.boxlilas{position:relative; z-index:10; background-color:#c4b4d7; top:350px; margin:0 auto 0 auto; height:1200px}
.boxlilasc{position:absolute; z-index:15; top:30px; padding:0}
.box h3{margin-bottom:5px}
.box button{height:30px; font-size:0.68em; line-height:0.68em; padding:9px 23px; margin:0}
.tint {background-color: rgba(80,60,100,.9); background-blend-mode: multiply;}
.tintvd {background-color: rgba(70,120,90,.9); background-blend-mode: multiply;}
.hs{background:rgb(0,0,0,0.8); position:fixed; top:0;left:0; width:100%; height:100%; z-index:99999; padding:40px 10px; overflow-y:scroll}
#info p{color:#222}

.hero{width:100%; height:386px; position:absolute; top:-10px; left:0; z-index:0}
.heroin{width:100%; height:300px; position:absolute; top:-10px;}
.hero h3{font-size:1.5em}
.hero .selo{width:40%;}
.chamada{position:absolute; z-index:160; top:140px; width:94%; left:4%; text-align:center; letter-spacing:0.22em; font-size:2em}
.logo{width:120px; margin:0}
.conteudo{margin:800px auto 0 auto}
.conteudoin{margin:150px auto 0 auto}
.conteudoinbase{margin:300px auto 0 auto}
.fotos{position:relative; z-index:30; top:740px; bottom:100px; height:auto}
.fotos .co{height:330px;}
.fotosin{position:relative; z-index:2; top:250px; height:auto}
.fotos h5{text-transform:uppercase; font-weight:bold;color:#fff; font-size:90%; padding:20px; text-shadow:1px 1px 19px rgba(0, 0, 0, 0.4);}

.herolan{width:100%; height:100px; position:absolute; background-position:top center; background-size:233%; }
.fotosinlan{position:relative; top:100px; height:auto; background-attachment:fixed; background-position:top center; background-size:233%; padding:11% 0 9% 0}
.logoimovel{width:180px;height:auto; margin-top:200px}
.txtimovel{display:none}

.w3{font-size:14px; letter-spacing:0.8em; color:#333; margin:30px 0}
.vv {position:absolute;width:100%;height:auto;top:82px;right:0%; z-index:10}
.vvin {position:absolute;width:46%;height:auto;top:70px;left:26%; z-index:10}

.villa{top:0; z-index:1; background-image:url(../img/w3-hero-villa-visconti-garden.jpg); background-attachment:fixed; background-size:195%; background-position:top center}
.cores{top:0; z-index:1; background-image:url(../img/w3-hero-cores-do-rio-noite.jpg);  background-attachment:fixed; background-size:195%; background-position:top center}
.fatima{top:0; z-index:1; background-image:url(../img/w3-hero-cores-de-fatima2.jpg);  background-attachment:fixed; background-size:195%; background-position:top center}
.corestijuca{top:0; z-index:1; background-image:url(../img/w3-hero-cores-da-tijuca.webp); background-attachment:fixed; background-size:195%; background-position:top center}
.soulrio{top:0; z-index:1; background-image:url(../img/w3-hero-sourio-fatima_mob.webp); background-size:contain; background-repeat:no-repeat; background-position:top center; height:580px; margin-bottom:-40px}
.soulrio1{top:0; z-index:1; background-image:url(../img/w3-hero-sourio-fatima_mob-hm.webp); background-size:contain; background-repeat:no-repeat; background-position:top center; height:580px}

.bts{display:none}
.dois{display:none}
.top {display:block; z-index:1; position:absolute; top:0; left:0;}
.wpe{width:100%; z-index:0; position:absolute; bottom:-190px; left:0%; padding-bottom:80px}
#return-to-top {position:fixed; bottom:66px; right:15px;background:rgb(0, 0, 0); background:rgba(0, 0, 0, 0.5); width:48px; height:48px; display: block; text-decoration:none; -webkit-border-radius:34px; -moz-border-radius:34px; border-radius:34px; display:none; -webkit-transition:all 0.3s linear; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease;}
#return-to-top i{color:#fff; margin:0; position:relative; left:18px; top:15px; font-size:19px; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition:all 0.2s ease; -o-transition:all 0.2s ease;  transition:all 0.2s ease;}
#return-to-top:hover {background:rgba(0, 0, 0, 0.7)}
#return-to-top:hover i {color:#fff; top:12px}

#waves{position:absolute; top:400px;left:0; width:100%; height:120px; z-index:2; background-image:url(../img/waves.svg); background-size:contain; background-repeat:repeat-x}
.form{-webkit-box-shadow:0px 0px 50px 0px rgba(0,0,0,0.5); -moz-box-shadow:0px 0px 50px 0px rgba(0,0,0,0.5); box-shadow:0px 0px 50px 0px rgba(0,0,0,0.5); padding:20px 35px 0 35px; background:#fff}
#return-to-top {position:fixed; bottom:46px}

.menun ul{display:none}
#nav-icon4 {position:absolute; width:54px; height:32px; top:25px; right:0; -webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition:.5s ease-in-out; transition:.5s ease-in-out; cursor:pointer; z-index:99999}
#nav-icon4 span {display: block; position: absolute; height:5px; width:100%; background:#fff; border-radius:2px; opacity: 1; left: 0; -webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg); -webkit-transition: .25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out;}
#nav-icon4 {}
#nav-icon4 span:nth-child(1) {top:0px;-webkit-transform-origin:left center;-moz-transform-origin:left center;-o-transform-origin:left center;transform-origin:left center;}
#nav-icon4 span:nth-child(2) {top:10px; -webkit-transform-origin:left center;-moz-transform-origin:left center;-o-transform-origin:left center;transform-origin:left center;}
#nav-icon4 span:nth-child(3) {top:20px;-webkit-transform-origin:left center;-moz-transform-origin:left center; -o-transform-origin:left center; transform-origin:left center;}
#nav-icon4.open span:nth-child(1) {-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg); transform: rotate(45deg); top:-12px; left:6px; background-color:#a67fd5}
#nav-icon4.open span:nth-child(2) { width: 0%; opacity: 0;}
#nav-icon4.open span:nth-child(3) {-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform: rotate(-45deg); top:26px; left:6px; background-color:#a67fd5}
.menu{color:#fff; font-size:13px; position:fixed; top:28px; letter-spacing:0.42em}

.overlay {position:fixed; background:#000; top:0; left:0; width:100%; height:100%; opacity:0; visibility:hidden; -webkit-transition:opacity .35s, visibility .35s, height .35s; transition:opacity .35s, visibility .35s, height .35s; z-index:999}
.overlay.open {opacity:0.9; visibility:visible; height:100%;}
.overlay.open li {-webkit-animation:fadeInRight .5s ease forwards; animation:fadeInRight .5s ease forwards; -webkit-animation-delay:.35s; animation-delay:.35s;}
.overlay.open li:nth-of-type(2) {-webkit-animation-delay:.4s; animation-delay:.4s;}
.overlay.open li:nth-of-type(3) {-webkit-animation-delay:.45s; animation-delay:.45s;}
.overlay.open li:nth-of-type(4) {-webkit-animation-delay:.50s; animation-delay:.50s;}
.overlay nav {position:relative; height:70%; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); font-size:1.1em; text-align:center; font-weight:bolder}
.overlay ul {list-style:none; padding:0; margin:0 auto; display:inline-block; position:relative; height:100%; z-index:999}
.overlay ul li {display:block; height:19%; height: calc(100% / 6); min-height:20px; position:relative;  color:#e20932}
.overlay ul li a {display:block; position:relative; color:#fff; text-decoration:none; text-transform:uppercase; letter-spacing:0.4em; overflow:hidden}
.overlay ul li a:hover {color:#fff}

#abah{position:fixed; width:100%; height:37px; bottom:0; left:0; padding:25px 0 3px 20px; transition:all 0.5s; -webkit-filter:drop-shadow( 0px -12px 22px rgba(0, 0, 0, .4)); filter:drop-shadow(0px -12px 22px rgba(0, 0, 0, .4)); z-index:99999; background-image:url(https://w3.com.br/img/abah.svg);background-repeat:no-repeat}
.abicoh{display:inline-block; margin:0 5px}
.abicoh img{width:25px}
.abicoh p{font-size:0.9em; line-height:1em; margin:0px auto 0 6px; float:right; width:68px; color:#000}
.tel{display:inline-block}
.tel p{float:right}
.vendas{display:none}
.venda{width:320px;height:auto;border-radius:40px;float:left; margin-right:30px}

#etapas {background-color:#fff; padding:30px 40px 40px 40px; margin:60px 0}
#etapas h4{letter-spacing:0; font-size:0.95em; color:#747474}
#etapas .two{width:50%}
.single-chart { width:100%; justify-content:space-around}
.circular-chart { display:block; margin:10px auto; max-width:100%; max-height:250px;}
.circle-bg { fill: none; stroke: #eee; stroke-width: 3.8;}
.circle { fill: none; stroke-width: 2.8; stroke-linecap: round; animation: progress 1s ease-out forwards;}
@keyframes progress { 0% {stroke-dasharray: 0 100; }}
.circular-chart.orange .circle { stroke: #ff9f00;}
.circular-chart.green .circle { stroke: #4CC790;}
.circular-chart.blue .circle { stroke: #3c9ee5;}
.percentage { fill: #666; font-size: 0.5em; text-anchor: middle;}

.animated {-webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both;animation-fill-mode:both; -webkit-animation-timing-function:linear;animation-timing-function:linear;animation-iteration-count:infinite; -webkit-animation-iteration-count:infinite;} 
@-webkit-keyframes bounce {0%, 20%, 40%, 60%, 80%, 100% {-webkit-transform: translateY(0);} 50% {-webkit-transform: translateY(-9px);}} 
@keyframes bounce {0%, 20%, 40%, 60%, 80%, 100% {transform: translateY(0);} 50% {transform: translateY(-10px);}} 
.bounce {-webkit-animation-name:bounce; animation-name:bounce;}

.plano{width:auto; height:auto; text-align:center; }
.pla{width:41.5%; max-width:600px; height:auto; display:inline-block; margin:4px;padding:7px; background:#fff; border:0px solid #ccc; box-shadow:0 2px 10px rgb(0 0 0 / 0.2)}
.plao{width:88%; max-width:600px; height:auto; display:inline-block; margin:4px;padding:7px; background:#fff; border:0px solid #ccc; box-shadow:0 2px 10px rgb(0 0 0 / 0.2)}
.secimg{max-height:100%; max-width:100%; width:auto; height:auto}
}


@media (min-width:375px) {
.construtora{padding:50px 10px; margin:70px 0 50px 0}
#form{margin:400px 0 30px 20px; width:87%}
.boxlilas{top:400px; height:1150px}
.conteudo{margin:820px auto 0 auto}
.fotos{margin-top:40px}
.fotosin{margin-top:70px}
.heroin{height:330px}
.soulrio{height:585px;}
}

@media (min-width:390px) {
#form{margin:400px 0 30px 20px; width:90%}
.orna{height:1050px;top:360px;}
.boxlilas{top:400px; height:1100px}
}


@media (min-width:412px) {
.conteudo{margin:820px auto 0 auto}
.fotos{margin-top:0px}
#form{margin:360px 0 30px 20px; width:87%;}
.boxlilas{top:400px; height:1100px}
.hero{height:437px}
.box {margin:390px auto 0 auto}
#abah{height:42px; padding:27px 0 3px 33px}
.abicoh img{width:30px}
.abicoh p{font-size:1em; line-height:1.1em; margin:0px auto 0 6px; width:74px;}
#etapas .two{width:32%}
.soulrio{height:647px;}
}


@media (min-width:640px) {
.hero{height:362px}
.villa,.cores,.fatima,.corestijuca{background-size:cover}
.box {margin:300px auto 0 auto}
.herolan{background-size:150%}
.fotosinlan{background-size:150%; padding:11% 0 9% 0}
.soulrio{height:447px; margin-bottom:-20px; background-size:cover}
}

@media (min-width: 800px) {
#topp{padding:0; height:130px; width:100%}
.hero{height:100vh}
.box {margin-top:70vh}
.fotos{top:100vh}
.fotos .co{width:33.33%; height:390px;}
.logo{width:130px; margin:20px 0 0 0}
#form{top:560px; right:20px; width:270px; margin:auto;}
#slogan{display:block}
.construtora{padding:50px 10px; margin:20px 0 40px 0}
.vv {width:70%;top:5px;right:15%}
.hero .selo{width:100%; height:auto}
.chamada{top:220px; width:80%; left:10%; text-align:center; letter-spacing:0.2em; font-size:3em}
.wpe{width:100%; z-index:0; position:absolute; bottom:-300px; left:-14%; padding-bottom:10px}
.pe{position:absolute; z-index:10; margin:30px auto; width:86%; left:7%}
.pec{position:absolute; z-index:20; margin:30px auto; width:86%; left:7%}
#etapas .two{width:20%}
.herolan{background-size:125%}
.fotosinlan{background-size:125%; padding:11% 0 9% 0}
.soulrio1{background-image:url(../img/w3-hero-sourio-fatima-hm.webp); background-attachment:fixed; background-size:cover; background-position:top center; margin-bottom:0}
.soulrio{background-image:url(../img/w3-hero-soulrio-fatima.webp); background-attachment:fixed; background-size:contain; background-position:top center; margin-bottom:0}
}


@media (min-width: 1000px) {
.button.button-primary,button.button-primary,input[type="submit"].button-primary,input[type="reset"].button-primary,
input[type="button"].button-primary {font-size:20px; padding:0 30px; height:58px; line-height:58px}
#como{background-size:cover; background-attachment:inherit;}
.conteudo{margin:820px auto 0 auto}
.conteudoin{margin:180px auto 0 auto}
.villa,.cores,.fatima{background-size:cover}
.heroin{height:380px}
.fotosin{margin-top:120px}
.fotos .co{width:33.33%; height:430px;}
.fotos h5{text-transform:uppercase; font-weight:bold;color:#fff; font-size:90%; padding:20px; text-shadow:1px 1px 19px rgba(0, 0, 0, 0.4);}
.construtora{padding:50px 0; margin:60px 0}
#return-to-top {position:fixed; bottom:16px}
.arrow {border:solid #fff; border-width:0 4px 4px 0; display:inline-block; padding:4px; transform: rotate(-135deg);-webkit-transform: rotate(-135deg);}
.herolan{background-size:100%}
.fotosinlan{background-size:100%; padding:5% 0 11% 0}
.logoimovel{width:180px; margin-top:60px}
.txtimovel{display:block}
#abah{width:36%; height:47px; bottom:-10px;left:32%;padding:26px 0 7px 34px}
.pla{width:27%; margin:8px; padding:12px; display:inline-block; margin:8px;padding:10px}
.plao{width:45%; margin:8px; padding:12px; display:inline-block; margin:8px;padding:10px}
}


@media (min-width: 1200px) {
#topp{padding:0; height:130px}
#waves{top:590px; height:80px; background-size:cover}
#form{top:680px; right:100px; width:360px; padding:25px 32px 0 32px}
.form{margin-left:40px}
.bts{position:absolute; top:0; right:-2%; float:right; display:block}
.bt{display:inline-block; font-size:0.7em; height:34px; padding:3px 20px; line-height:1em; margin:-2px}
.chamada{top:280px; width:86%; left:7%; font-size:3.3em}
.fotosin{margin-top:120px}
.fotosinlan{top:120px; height:450px; background-size:cover; padding:13% 0 30% 0}
.logoimovel{width:240px; margin-top:-40px}
.hero{top:0}
.heroin{height:400px}
.herolan{height:130px}
.hero h3{font-size:1.5em}
.corestijuca{background-position:center}
.logo{width:138px; margin:0 0 0 0}
.conteudo{margin:840px auto 0 auto}
.conteudoin{margin:210px auto 0 auto}
.conteudoinbase{margin:340px auto 0 auto}
.w3{font-size:14px; letter-spacing:0.8em; color:#333; margin:30px 0}
.vv {width:60%;top:5px;right:20%}
.vvin {width:40%;top:0;left:30%}
.orna{width:87%; height:1050px; top:500px;}
.boxlilas{top:500px; margin:0 auto 0 13%}
.boxlilasc{top:20px; padding:10px 30px}
.pe{width:98%; left:2%}
.wpe{width:90%; bottom:-400px; left:0; padding-bottom:0}
.pec{margin:30px auto; width:90%; left:5%}

#abah{width:32%; height:47px; bottom:0;left:34%;padding:26px 0 7px 34px}
.abicoh{display:inline-block; margin:0 5px}
.abicoh img{width:35px}
.abicoh p{font-size:0.93em; line-height:1em; margin:4px auto 0 6px; float:right; width:72px; color:#000}
.tel{display:none}

.venda{width:260px;height:260px; border-radius:50%;float:left; margin-right:20px}
#etapas .two{width:12%}
#etapas h4{font-size:1.1em}

#nav-icon4,#overlay{display:none}
.menun ul{display:block; margin:0; padding:0}
.menun li{display:inline-block; font-size:1em; text-transform:uppercase; font-weight:bolder; margin:50px 15px; letter-spacing:0.2em;}
.menun li a{color:#fff}
.menun li a:hover{color:#c59e28}
}



@media (min-width: 1360px) {
.vv {width:60%;top:5px;right:20%}
#form{top:700px; right:10%}
.chamada{top:280px; font-size:3.6em}
.boxlilas{top:500px; margin:0 auto 0 13%}
.boxlilasc{top:20px; padding:10px 30px}
.box {width:80%; left:10%}
.conteudo{margin:820px auto 0 auto}
.fotosin{margin-top:120px}
.pe{width:100%; left:4%}
.pec{left:3%}
.wpe{width:95%; bottom:-400px; left:0}
.fotosinlan{top:120px; height:450px; padding:18% 0 30% 0}
.logoimovel{width:240px; margin-top:-60px}
}


@media (min-width: 1440px) {
.heroin{height:440px}
.hero h3{font-size:1.5em}
.fotosin{margin-top:180px}
.conteudo{margin:850px auto 0 auto}
.chamada{top:300px; font-size:4.6em}
.pe{left:5%}
}


@media (min-width: 1600px) {
.heroin{height:440px}
.hero h3{font-size:1.5em}
.fotosin{margin-top:180px}
.logo{width:180px}
.conteudo{margin:850px auto 0 auto}
.conteudoin{margin:240px auto 0 auto}
.logoimovel{width:290px; margin-top:-40px}
.chamada{top:300px; font-size:3.8em}
.box {width:70%; left:15%}
#form{top:780px; right:300px; width:400px}
.pe{left:10%}
#abah{width:30%; height:54px; left:35%; padding:38px 0 2px 50px}
.abicoh img{width:40px}
.abicoh p{font-size:1em; line-height:1.1em; margin:2px auto 0 9px; width:80px}
.bt{font-size:0.9em; height:44px; padding:3px 20px}
}

@media (min-width: 1900px) {
.heroin{height:500px}
.fotosin{margin-top:230px}
.hero h3{font-size:1.7em}
.conteudo{margin:1080px auto 0 auto}
.chamada{top:350px; font-size:4.0em}
.w3{font-size:14px; margin:30px 0}
.pe{left:16%} .pec{left:5%}
#abah{width:30%; height:64px; left:35%; padding:38px 0 2px 50px}
.abicoh img{width:44px}
.abicoh p{font-size:1.1em; line-height:1.2em; margin:2px auto 0 9px; width:100px}
}







/* Fade-In */
.fadeout { webkit-animation: fadeout 0.5s; -ms-animation: fadeout 0.5s; animation: fadeout 0.5s;}
.fadein { webkit-animation: fadein 0.5s; -ms-animation: fadein 0.5s; animation: fadein 0.5s;}
@keyframes fadein { from { opacity: 0; }  to   { opacity: 1; }}
@-webkit-keyframes fadein { from { opacity: 0; }  to   { opacity: 1; }}
@-ms-keyframes fadein { from { opacity: 0; }  to   { opacity: 1; }}
@keyframes fadeout { from { opacity: 1; }  to   { opacity: 0; }}
@-webkit-keyframes fadeout { from { opacity: 1; }  to   { opacity: 0; }}
@-ms-keyframes fadeout { from { opacity: 1; }  to   { opacity: 0; }}



#return-to-top {position:fixed; bottom:18px; right:20px;background:rgb(0, 0, 0); background:rgba(0, 0, 0, 0.5); width:48px; height:48px; display: block; text-decoration:none; -webkit-border-radius:34px; -moz-border-radius:34px; border-radius:34px; display:none; -webkit-transition:all 0.3s linear; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease;}
#return-to-top i{color:#fff; margin:0; position:relative; left:18px; top:16px; font-size:19px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease;  transition:all 0.3s ease;}
#return-to-top:hover {background:rgba(0, 0, 0, 0.7)}
#return-to-top:hover i {color:#fff; top:14px}
.arrow {border:solid #fff; border-width:0 4px 4px 0; display:inline-block; padding:4px; transform: rotate(-135deg);-webkit-transform: rotate(-135deg);}


.modal-window {position:fixed; background-color: rgba(10,15,10, 0.98); top:0; right:0; bottom:0; left:0; z-index:999999; visibility:hidden; opacity: 0; pointer-events:none; -webkit-transition: all 0.3s; transition: all 0.3s}
.modal-window:target { visibility: visible; opacity: 1; pointer-events: auto;}
.modal-window > div {max-width:305px; width:100%; padding:20px 18px 0 18px; position:absolute; top:42%; left:50%; -webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%); padding:2em; background:#ffffff; -webkit-box-shadow:0px 0px 80px 0px rgba(0,0,0,0.46); -moz-box-shadow:0px 0px 80px 0px rgba(0,0,0,0.46); box-shadow:0px 0px 80px 0px rgba(0,0,0,0.46); border-radius:10px}

.modal-close {font-size:90%; font-weight:700; position:absolute; right:5px; text-align:center; top:12px; width:80px; text-decoration:none}
.modal-close:hover {color: black;}
.modal-window div:not(:last-of-type) { margin-bottom: 15px;}

@media (min-width: 1020px) {
.modal-window > div {max-width:400px}
}

