body {font-size: 24px; line-height: 34px; overflow: hidden; position: relative; font-family: 'Avenir Next'; font-weight: 100;}
h1 {line-height: 1; font-size: 78px;  margin-bottom: 25px; text-transform: uppercase; font-weight: 100; font-family: 'Avenir Next';}
h2 {line-height: 1; font-size: 55px; margin-bottom: 25px; text-transform: uppercase; font-weight: 100; font-family: 'Avenir Next';}
h3 {line-height: 1; font-size: 30px; line-height: 42px;  margin-bottom: 25px; text-transform: uppercase; font-family: 'Avenir Next';}
h4 {line-height: 1; font-family: 'Avenir Next';}
h5 {line-height: 1; font-family: 'Avenir Next';}
p {font-size: 24px; line-height: 34px; margin-bottom: 35px; color: #68594d; font-family: 'Avenir Next';}
p:last-child {margin-bottom: 0;}
p .button {display: inline-block; margin-top: 30px; line-height: 1;}
p a {color: inherit; text-decoration: none; border-bottom: 1px solid;}
ul, ol {margin: 25px;}
li {font-size: 24px;line-height: 34px;}
strong {font-weight: 900;}
p img {display: inline-block;}
blockquote p {color: #a5202e;}

/* General */
.flex-alt {display: flex;flex-flow: row wrap;}

.custom-next {position: absolute; width: 50px; right: 25px; top: 50%; transform: translateY(-50%); z-index: 99; cursor: pointer;}
.custom-prev {position: absolute; width: 50px; left: 25px; top: 50%; transform: translateY(-50%) rotate(180deg); z-index: 99; cursor: pointer;}

.close-icon {padding: 25px; left: 0px; top: 0; position: absolute; z-index: 9999; overflow: hidden; transition: 0.5s; transform: scale(0.8) rotate(180deg); cursor: pointer;}
.close-icon::before {content: ''; position: absolute; width: 2px; height: 30px; background: #fff; transform: rotate(45deg); top: 10px; transition: 0.5s;}
.close-icon::after {content: ''; position: absolute; width: 2px; height: 30px; background: #fff; transform: rotate(-45deg); top: 10px; transition: 0.5s;}

.close-icon:hover::before {transform: rotate(-135deg) !important;}
.close-icon:hover::after {transform: rotate(-225deg)!important;}

.hamburger { width: 50px; height: 30px; position: fixed; cursor: pointer; right: 5px; top: 43px; transition: 0.3s; z-index: 99999; display: none; transform: translateY(-50%) scale(0.6);}
.hamburger::after { content: ''; background: #3d3f4a; width: 100px; height: 100px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 150px; z-index: -9; transition: 0.3s;}
.hamburger.active::after {background: #3d3f4a; left: 150%;}
.hamburger span {height: 2px; background: #fff; width: 100%; position: absolute; opacity: 1; transition: 0.3s;}
.hamburger span:nth-child(1) {top: 0;}
.hamburger span:nth-child(2) {top: 15px;}
.hamburger span:nth-child(3) {bottom: 0;}

.hamburger.active span:nth-child(2) {opacity: 0; transform: rotate(90deg); top: 15px;}
.hamburger.active span:nth-child(1) {top: 0; transform: rotate(135deg); top: 15px;}
.hamburger.active span:nth-child(3) {bottom: 0; transform: rotate(225deg); top: 15px;}

.mobile-nav {position: fixed;background: #3d3f4a;top: 0; z-index: 9999; height: 0; width: 0; left: 100%; border-radius: 1000px 0 1000px 1000px; box-sizing: border-box; overflow: hidden; transition: 0.5s;}
.mobile-nav::before { content: ''; background: url('/img/b-01.png'); width: 110%; height: 110%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}

.mobile-nav ul {margin: 0;}
.mobile-nav > ul {margin: 0; opacity: 0; position: relative; right: -250px; top: 50px; width: 75%; transition: 1s;}
.mobile-nav.active ul {opacity: 1; right: -50px;}
.mobile-nav > ul li {display: block; width: 100%;}
.mobile-nav > ul li a {width: 100%; color: #fff; font-size: 25px; padding: 0; text-decoration: none; padding: 10px 0; display: block;}
.mobile-nav.active {border-radius: 0; height: 100vh; width: 100vw; left: 0;}

.button {padding: 25px 70px; background: #faeede; color: #7f7474; border: 1px solid #faeede00; font-size: inherit; font-family: inherit; border-radius: 0; transition: 0.3s;}
.button:hover {background: #fff0; color: #faeede; border: 1px solid #faeede;}

.button.button-border-white {background: #0000; color: #faeede; border: 1px solid #faeede;}
.button.button-border-white:hover {background: #faeede; color: #7f7474; border: 1px solid #faeede00;}

.button.button-border {background: #0000; color: #7f7474; border: 1px solid #dcc6a6;}
.button.button-border:hover {background: #faeede; color: #7f7474; border: 1px solid #faeede00;}

.button-round {position: relative; text-decoration: none; color: #af9e8f; font-size: 16px; border: 0; line-height: 130px;display: block; transition: 0.3s;}
.button-round::after {content: ''; background: #fff0; width: 130px; height: 130px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 1px solid #dfc7a2; border-radius: 150px; z-index: -1; transition: 0.3s;}
.button-round::before {content: ''; background: #dfc7a2; width: 5px; height: 5px; position: absolute; bottom: -2px;left: 180px; border-radius: 150px;}

.button-round:hover {color: #fff;}
.button-round:hover::after {background: #dfc7a2;}

.wrapper {max-width: 85%; margin: 0 auto;}
.wrapper-sml {max-width: 65%; margin: 0 auto;}

header {position: absolute; left: 0; top: 0; width: 100%; z-index: 999; padding: 30px 0;}
header ul {display: flex; justify-content: flex-end; align-items: center; margin: 0; padding-right: 50px;}
header ul li {list-style: none; position: relative; z-index: 99;}
header ul li::after {content: ''; width: 100%; left: 50%; bottom: 20px; transform: translateX(-50%); height: 0px; background: #fff; position: absolute; z-index: -9; transition: 0.3s;}
header ul li a {text-decoration: none; color: #fff; padding: 30px 20px; font-weight: 400; font-size: 16px; display: block; line-height: 1; text-transform: uppercase; transition: 0.3s;}
header ul li:hover::after {height: 120%;}
header ul li:hover a {color: #dfc7a2;}

header.header-inside {background: #3d3f4a; position: relative;}
header.header-inside .logo {padding-left: 50px;}

.home-banner-container {height: 101vh; position: relative; overflow: hidden; background: #000;}
.home-banner-container article {position: absolute; left: 50%; top: 60%; opacity: 0; transform: translate(-50%,-50%); z-index: 99; width: 85%; max-width: 1100px; text-align: center; transition: 1s;}
.home-banner-container.active-scroll article {opacity: 1; top: 50%;}
.home-banner-container article h1 {color: #fff;}
.home-banner-container article h2 {color: #fff;}
.home-banner-container article p span {color: #fff; font-size: 16px; letter-spacing: 4px; text-decoration: none !important; position: relative; text-transform: uppercase; display: inline-block; margin-bottom: 50px;}
.home-banner-container article p span::after {content: ''; background: #fff0; width: 130px; height: 130px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 1px solid #dfc7a2; border-radius: 150px;}
.home-banner-container article p span::before {content: ''; background: #dfc7a2; width: 5px; height: 5px; position: absolute; bottom: -40px; left: 59px; border-radius: 150px;}
.home-banner-container article p a:nth-child(1) {padding: 25px 70px; background: #faeede; text-decoration: none; color: #7f7474; border: 0;}
.home-banner-container article p a:nth-child(2) {padding: 25px 70px; text-decoration: none; color: #faeede; border: 0;}
.home-banner-container article p img {display: block; margin-bottom: 50px;}
.home-banner-container figure {width: 100%; height: 100%; background: #000;}
.home-banner-container figure img {width: 100%; height: 100%; position: absolute; object-fit: cover; transition: 5s; animation: homebanner 5s linear infinite; opacity: 0.6;}
.home-banner-container.active-scroll figure img {opacity: 1;}

@keyframes homebanner { 0% {filter: saturate(100%);} 50% {filter: saturate(150%);} 100% {filter: saturate(100%);}}

.home-banner-container .banner-feat { transform: rotate(90deg) translate(0%, -100%); transform-origin: 0 0; position: absolute; left: 0%; top: 0%; z-index: 99; padding: 50px; background: #3b3d48db; width: 100vh; box-sizing: border-box; transition: 1s;}
.home-banner-container .banner-feat p {max-width: 400px; font-size: 10px; line-height: 18px;text-transform: uppercase; color: #fff; transform: rotate(180deg);}
.home-banner-container.sticky .banner-feat {left: -20%;}

.dark-main-container {position: relative; z-index: 99; background: #af9e8f; overflow: hidden;}

.dark-main-container .block-one {width: 30%; position:relative; bottom: -250px;opacity: 0; transition: 1s;}
.dark-main-container.active-scroll .block-one {bottom: 0;opacity: 1;}
.dark-main-container .block-two {width: 70%; position:relative; bottom: -250px;opacity: 0; transition: 2s;}
.dark-main-container.active-scroll .block-two {bottom: 0;opacity: 1;}

.dark-main-container figure {overflow: hidden;}
.dark-main-container figure img {width: 100%; height: 100%; position: absolute; object-fit: cover;}
.dark-main-container article { padding: 10% 5%; box-sizing: border-box; max-width: 950px; margin: 0 auto; position: relative;}
.dark-main-container article h2 {color: #fff;}
.dark-main-container article h3 {color: #fff;}
.dark-main-container article p {color: #fff;}

.light-main-container {background: #fff4e4; position: relative; z-index: 99; overflow: hidden;}

.light-main-container .block-one {width: 30%; position:relative; bottom: -250px; opacity: 0; transition: 1s;}
.light-main-container.active-scroll .block-one {bottom: 0;opacity: 1; }
.light-main-container .block-two {width: 70%; position:relative; bottom: -250px; opacity: 0; transition: 2s;}
.light-main-container.active-scroll .block-two {bottom: 0;opacity: 1; }

.light-main-container figure {overflow: hidden;}
.light-main-container figure img {width: 100%; height: 100%; position: absolute; object-fit: cover;}
.light-main-container article { padding: 10% 5%; box-sizing: border-box; max-width: 950px; margin: 0 auto; position: relative;}
.light-main-container article h2 {color: #7f7474;}
.light-main-container article h3 {color: #7f7474;}
.light-main-container article p {color: #7f7474;}

.light-main-container .article-feature {position: absolute; top: 50%; transform: translateY(-50%); left: 20%; z-index: 99; width: 20%;}

.feature-container {padding: 400px 0 200px 0; position: relative; z-index: 99;}
.feature-container .feature-overlay {left: 50%; top: 150px; position: absolute; z-index: 99;transform: translateX(-50%);}

.feature-container .flex-row {column-gap: 6%; justify-content: center; padding-bottom: 50px;}

.feature-container .feature-item {width: 24%; position: relative; bottom: -250px; opacity: 0; transition: 2s;}
.feature-container .feature-item:nth-child(3n+2) {transition-delay: 0.3s;}
.feature-container .feature-item:nth-child(3n+3) {transition-delay: 0.6s;}

.feature-container.active-scroll .feature-item {bottom: 0; opacity: 1;}

.feature-container .feature-item:nth-child(3n+2) {margin-top: 150px;}
.feature-container .feature-item figure {overflow: hidden; position: relative; height: 60vh; margin-bottom: 80px;}
.feature-container .feature-item figure img {width: 100%; height: 100%; position: absolute; object-fit: cover;}
.feature-container .feature-item article {margin-bottom: 50px;}
.feature-container .feature-item article p {text-align: left; font-size: 24px; line-height: 34px;}
.feature-container .feature-item p {text-align: center;}

.feature-container > p {text-align: center;}

.inside-banner-container {background: #fff4e4; position: relative; overflow: hidden; z-index: 99;}

.inside-banner-container .block-one {width: 35%; position:relative; bottom: -250px; opacity: 0; transition: 1s;}
.inside-banner-container.active-scroll .block-one {bottom: 0;opacity: 1; }
.inside-banner-container .block-two {width: 65%; position:relative; bottom: -250px; opacity: 0; transition: 2s;}
.inside-banner-container.active-scroll .block-two {bottom: 0;opacity: 1; }

.inside-banner-container figure {overflow: hidden;}
.inside-banner-container figure img {width: 100%; height: 100%; position: absolute; object-fit: cover;}
.inside-banner-container article { padding: 15% 5%; box-sizing: border-box; max-width: 950px; margin: 0 auto; position: relative; min-height: 95vh;}
.inside-banner-container article h1 {color: #7f7474;}
.inside-banner-container article h2 {color: #7f7474;}
.inside-banner-container article h3 {color: #7f7474;}
.inside-banner-container article p {color: #7f7474;}

.center-container {padding: 150px 0; position: relative; z-index: 99;}
.center-container .wrapper {max-width: 720px; width: 100%;}
.center-container article {position: relative; bottom: -250px; transition: 1s; opacity: 0;}
.center-container.active-scroll article {bottom: 0; opacity: 1;}

.center-full-container {padding: 100px 0 200px 0;}
.center-full-container .flex-row {padding: 50px 0; align-items: flex-start;}
.center-full-container .flex-row article {width: 50%; box-sizing: border-box; padding: 30px; position: relative; bottom: -250px; opacity: 0; transition: 1s;}
.center-full-container.active-scroll .flex-row article {bottom: 0px; opacity: 1;}
.center-full-container .flex-row article h2 {color: #af9e8f;}
.center-full-container .flex-row article p {color: #af9e8f;}

.listings-container {padding: 150px 0; position: relative; z-index: 99;}
.listings-container .wrapper {position: relative; bottom: -250px; opacity: 0; transition: 1s;}
.listings-container.active-scroll .wrapper {bottom: 0; opacity: 1;}

.listing-item {margin-bottom: 50px;}
.listing-item article { padding: 20% 10%; box-sizing: border-box; position: relative;}
.listing-item article h2 {font-size: 50px; margin-bottom: 15px;}
.listing-item article p {color: #888888;}
.listing-item figure {overflow: hidden;}
.listing-item figure img {width: 100%; height: 100%; position: absolute; object-fit: cover;}
.listing-item .block-one {width: 50%; position:relative;}
.listing-item .block-two {width: 50%; position:relative;}

.listing-item .listing-feat {padding: 50px 0; max-width: 400px;}
.listing-item .listing-feat img {margin-right: 15px; width: 35px;}

.listing-item .listing-feat .price-title {position: relative; margin-left: 18px;}
.listing-item .listing-feat .price-title::after {content: ''; background: #fff0; width: 84px; height: 84px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 1px solid #dfc7a2; border-radius: 150px;}
.listing-item .listing-feat .price-title {text-align: center;}
.listing-item .listing-feat .price-title p {display: block; font-size: 12px; line-height: 1;}
.listing-item .listing-feat .price-title span {display: block; font-size: 24px;}

.gallery-top-container article {min-height: auto;}
.gallery-top-container article p a:nth-child(1) {padding: 25px 70px; background: #3d3f4a; text-decoration: none; color: #fff; border: 0;}
.gallery-top-container article p a:nth-child(2) {padding: 25px 70px; text-decoration: none; background: none;color: #3d3f4a; border: 0;}

.gallery-container .gal-container {position: relative; width: 16.666%; cursor: pointer; bottom: -250px; opacity: 0; transition: 1s;}
.gallery-container.active-scroll .gal-container {bottom: 0; opacity: 1;}

.gal-container:nth-child(6n+2) {transition-delay: 0.3s;}
.gal-container:nth-child(6n+3) {transition-delay: 0.6s;}
.gal-container:nth-child(6n+4) {transition-delay: 0.9s;}
.gal-container:nth-child(6n+5) {transition-delay: 1.2s;}
.gal-container:nth-child(6n+6) {transition-delay: 1.5s;}

.gal-container .gal-item {height: 600px; overflow: hidden; position: relative; background: #000; transition: 0.3s;}
.gal-container .gal-item::before { content: 'View'; font-size: 16px; color: #fff;  font-family: 'Avenir Next'; position: absolute; transform: translate(-50%, -50%); left: 50%; top: 50%; z-index: 9; opacity: 0; transition: 0.3s; cursor: pointer;}
.gal-container .gal-item figure {overflow: hidden; width: 100%; height: 100%; position: absolute;}
.gal-container .gal-item img {position: absolute; width: 100%; height: 100%; object-fit: cover; max-width: none;}
.gal-container .gal-pop {position: fixed; opacity: 0; width: 100%; max-width: 1200px; transform: translate(-50%, -50%) scale(0.8); left: 50%; top: 50%; z-index: -999; transition: 0.5s;}
.gal-container .gal-pop img {width: 100%; transition: 0.3s;}
.gal-container .gal-pop::after {content: ''; background: #0008; width: 130vw; height: 130vh; z-index: -1; position: absolute; transform: translate(-50%, -50%); left: 50%; top: 50%; transition: 0.6s;}
.gal-container.active {cursor: default;}
.gal-container.active .gal-pop {opacity: 1; z-index: 999;  transform: translate(-50%, -50%) scale(1); left: 50%;}
.gal-container.active .gal-pop::after {transform: translate(-50%, -50%); left: 50%;}
.gal-container:hover .gal-item img {opacity: 0.6;}
.gal-container:hover .gal-item::before {opacity: 1;}

.contact-container {padding: 100px 0 200px 0;}
.contact-container .flex-row {padding: 50px 0; align-items: center;}
.contact-container .flex-row article {width: 40%; box-sizing: border-box; padding: 30px; position: relative; bottom: -250px; opacity: 0; transition: 1s;}
.contact-container.active-scroll .flex-row article {bottom: 0px; opacity: 1;}
.contact-container .flex-row article h2 {color: #af9e8f;}
.contact-container .flex-row article p {color: #af9e8f;}
.contact-container .flex-row article p a {border: 0 !important;}
.contact-container .flex-row article p a.button:hover {background: #3d3f4a !important; color: #faeede !important;}
.contact-container .flex-row article:nth-child(2) p img {width: 50px;}
.contact-container .flex-alt article { padding: 10%; box-sizing: border-box; position: relative;}
.contact-container .flex-alt figure {overflow: hidden;}
.contact-container .flex-alt figure iframe {width: 100%; height: 100%; position: absolute; object-fit: cover;}
.contact-container .block-one {width: 50%; position:relative; bottom: -250px;opacity: 0; transition: 2s;}
.contact-container .block-two {width: 50%; position:relative; bottom: -250px;opacity: 0; transition: 2s; background: #f9f6f4;}
.contact-container.active-scroll .block-one {bottom: 0px; opacity: 1;}
.contact-container.active-scroll .block-two {bottom: 0px; opacity: 1;}

.video-container {height: 65vh; opacity: 0; position: relative; background: #000; transition: 1s;}
.video-container.active-scroll {opacity: 1;}

.video-container article {position: absolute; z-index: 99; left: 50%; top: 80%; transform: translate(-50%,-50%); width: 85%; opacity: 0; transition: 2s;}
.video-container.active-scroll article {top: 50%; opacity: 1;}
.video-container article h2 {color: #fff; font-size: 100px; text-transform: uppercase; font-weight: 700; text-align: center; margin: 0;}

.video-container figure {overflow: hidden; position: relative; height: 100%; width: 100%;}
.video-container figure iframe {position: absolute; width: 200%; height: 200%; object-fit: cover; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 0.8;}

footer {background: #3d3f4a; padding: 100px 0 400px 0; position: relative;}
footer p {color: #f2e8da; font-size: 16px;}
footer p a {display: block; color: #f2e8da; font-size: 16px; border: 0;}
footer .button {color: #f2e8da !important;}
footer .footer-logo {position: absolute; left: 50%; top: -70px; transform: translateX(-50%); z-index: 99;}
footer .footer-feat {max-width: none; width: 110%; opacity: 0.1; position: absolute; left: 50%; transform: translateX(-50%);bottom: 100px;}
footer .button:hover {color: #3d3f4a !important;}

/*=====================================================================
Media Queries
=====================================================================*/

@media screen and (max-width: 1800px) {
  .light-main-container .article-feature {width: 15%;}
}
@media screen and (max-width: 1500px) {

}
@media screen and (max-width: 1400px) {
  body {font-size: 18px !important; line-height: 24px !important;}
  h1 {font-size: 42px !important;}
  h2 {font-size: 26px !important; line-height: 42px !important;}
  h3 {font-size: 22px !important; line-height: 30px !important;}
  h4 {font-size: 18px !important; line-height: 24px !important;}
  p {font-size: 18px !important; line-height: 24px !important;}
  li {font-size: 18px !important; line-height: 24px !important;}
  .button { padding: 20px 50px;}
  header ul li a {font-size: 12px; padding: 30px 10px;}
  header .logo {max-width: 150px;}
  .listing-item .listing-feat p { font-size: 12px !important;}
  .dark-main-container article {padding: 20% 20%;}
  .light-main-container article {padding: 20% 20%;}
  .gal-container .gal-item {height: 400px;}
  .home-banner-container .banner-feat p {font-size: 10px !important;line-height: 18px !important;}
  .home-banner-container article p a {padding: 20px 50px !important;}
}
@media screen and (max-width: 1200px) {

}
@media screen and (max-width: 800px) {
  header ul {display: none;}
  header ul li::after {display: none;}
  .mobile-nav ul {display: block;}
  .hamburger {display: block;}
  .home-banner-container .banner-feat {display: none;}
  .dark-main-container .block-one {width: 100%;}
  .dark-main-container .block-two {width: 100%;}
  .light-main-container .block-one {width: 100%;}
  .light-main-container .block-two {width: 100%;}
  .inside-banner-container .block-one {width: 100%;}
  .inside-banner-container .block-two {width: 100%;}
  .listing-item .block-one {width: 100%;}
  .listing-item .block-two {width: 100%;}
  .feature-container .feature-item {width: 100%;}
  .dark-main-container figure {height: 300px;}
  .light-main-container {overflow: visible;}
  .light-main-container figure {height: 300px;}
  .light-main-container .article-feature{top: -80px;transform: translate(-50%, 0);left: 50%;width: 40%;}
  .dark-main-container article {padding: 30px;}
  .light-main-container article {padding: 30px;}
  .inside-banner-container figure {height: 300px;}
  .inside-banner-container figure {height: 300px;}
  .inside-banner-container article {min-height: auto;}
  .center-container { padding: 50px 0;}
  .center-container article {padding: 0 50px;}
  .listings-container {padding: 50px 0;}
  .listing-item figure {height: 300px;}
  .listing-item article {padding: 10%;}
  .listing-item .listing-feat { padding: 20px 0;}
  .listing-item .listing-feat .price-title {margin-bottom: 30px;}
  .listing-item .listing-feat div {width: 100%; padding: 15px 0;justify-content: center;}
  .listing-item .button {width: 100%; padding: 20px 0; text-align: center;}
  .feature-container .feature-item figure {height: 300px;}
  .feature-container .feature-item {margin-bottom: 30px;}
  .feature-container .feature-item:nth-child(3n+2) { margin-top: 0px;}
  .gallery-container .gal-container {width: 100%;}
  .gal-container .gal-item {height: 200px;}
  .feature-container .feature-overlay {top: 50px;}
  .feature-container .feature-item figure {margin-bottom: 30px;}
  .feature-container .feature-item article { margin-bottom: 20px;}
  .home-banner-container article p a {display: block;}
  .contact-container {padding: 50px 0 100px 0;}
  .contact-container .block-one {width: 100%;}
  .contact-container .block-two {width: 100%;}
  .contact-container .flex-row article {width: 100%;}
  .center-full-container {padding: 50px 0;}
  .center-full-container .flex-row {padding: 0;}
  .center-full-container .flex-row article {width: 100%; padding: 0;}
  .video-container { height: 35vh;}
  footer {padding: 100px 0 200px 0;}
  footer p {width: 100%;text-align: center;}
}
@media screen and (max-width: 500px) {

}
@media screen and (max-width: 414px) {

}
@media screen and (max-width: 375px) {

}
@media screen and (max-width: 320px) {

}