@charset "utf-8";
/* CSS Document */

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, img, ins, kbd, q, s, samp,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
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;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}
body {
  line-height: 1;
}
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;
}

* { 
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;         /* Opera/IE 8+ */
}

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.clearfix {
    display: inline-block;
}
html[xmlns] .clearfix {
    display: block;
}
* html .clearfix {
    height: 1%;
}
.wrap {text-align:left;}

input[type="submit"] {-webkit-appearance: none;cursor:pointer;}


.wrap>*:not(*:root) {margin-left:-4px;}/*--- FIx for safari flexibleg grid--*/
*:focus {outline:0;}
html, body {width:100%; height:100%;font-family: 'Bellefair', serif;}
body {font-size:12px; line-height:1.25em; background-color:#f9f9f9;}
[class*="_fullcontainer"]{width: calc(100% - 90px);margin:0px auto;}
[class*="_container"]{width:100%; margin:0px auto; max-width:1180px;}
[class*="_smallcontainer"]{width:100%; margin:0px auto; max-width:960px;}
[class*="_narrowcontainer"]{width:100%; margin:0px auto; max-width:680px;}
[class*="col-"]{transition:0.2s;}

html {
  scroll-behavior: smooth;
}


/*---Fix for wow---*/
.wow {visibility:hidden;}

/*---General---*/
#content {overflow:hidden;}

html { height: 100%;}
body {min-height: 100%; height: auto;}



/*---Typography---*/
a, span {transition:0.5s linear; -ms-transition:0.5s linear; -moz-transition:0.5s linear; -webkit-transition:0.5s linear; text-decoration:none;}
body {font-size:100%;}
h1, h4, .project-status, .project-title, .forminput-title {font-family: archivo-black, sans-serif; font-weight: 400; font-style: normal;margin-bottom:25px;}
h1 {font-size:2.4em;line-height: 1em; font-weight:500; letter-spacing:1px;margin-bottom:20px;}
h2 {font-size:2.1em;line-height: 1em;letter-spacing: 2px;}
h3 {font-size:1.7em;line-height: 1em;}
h4 {font-size:1.6em;line-height: 1em;font-weight:700;letter-spacing:1px;}


[class*="but_"], nav.mainnav ul li a {font-size: 13px;letter-spacing: 4px;font-family: 'Open Sans', sans-serif;font-weight: 700;}

h2, h3, h5, h6, p, a, .full--title, .full--desc, .form_info input, .checktitle, label, input, .sel, h4.mapplic-tooltip-title {font-family: 'Open Sans', sans-serif;margin-bottom:20px;}


a {color:#cca666;}

h5 {font-size:23px;line-height: 30px;margin-bottom: 20px;letter-spacing:1px;}
h6 {font-size:21px;line-height: 24px;margin-bottom: 20px;}
p.big {font-size:1.3em;line-height:1em;margin-bottom:10px;}
p {font-size:15px;line-height: 24px;margin-bottom: 10px;}
p.small {font-size:0.9em;line-height: 1.2em;letter-spacing:0px;}
body {font-size:16px;}

/*---Variable---*/
:root {
  --main-brown: #AE9280;
  --main-lightbrown: #D3D1C6;
  --main-magenda: #B51580;
  --main-darkpurple: #491A35;
  --main-lightblue: #00A8BB;
  --main-medblue: #0098C8;
  --main-emeraldblue: #00AEB6;
  --main-darkorange: #AE3A26;
  --main-gold: #C9AD84;
  --main-yellowbrown: #C9AD84;
  --main-white: #ffffff;
}

@media screen and (prefers-color-scheme: dark) {
    :root {
      --main-brown: #AE9280;
      --main-lightbrown: #D3D1C6;
      --main-magenda: #B51580;
      --main-darkpurple: #491A35;
      --main-lightblue: #00A8BB;
      --main-medblue: #0098C8;
      --main-emeraldblue: #00AEB6;
      --main-darkorange: #AE3A26;
      --main-gold: #C9AD84;
      --main-yellowbrown: #C9AD84;
      --main-white: #ffffff;
    }
    /*h1.magenda {color:red !important;}*/
}

/*.samsung-dark h1.magenda {color:red !important;}*/


/*--Color---*/
.magenda {color:#B51580;}
.whitetext {color:#ffffff;}
.lightgrey{color:#e1e1e1;}
.medgrey{color:#747474;}
.darkred {color:#b3102c;}
.darkblue {color:#3f5564;}
.medbrown {color:#af856f;}
.lightgold {color:#cca666;}
.darkgold {color:#7c6739;}
.darkorange {color:#b33825;}
.gold {color:#C9AD84;}

.bck_brown {background-color: var(--main-brown);}
.bck_lightbrown {background-color: var(--main-lightbrown);}
.bck_darkpurple {background-color: var(--main-darkpurple);}
.bck_white {background-color:#ffffff;}
.bck_black {background-color:#000000;}
.bck_lightblue {background-color: var(--main-lightblue);}
.bck_medblue {background-color: var(--main-medblue);}
.bck_emeraldblue {background-color: var(--main-emeraldblue);}
.bck_darkorange {background-color: var(--main-darkorange);}
.bck_yellowbrown {background-color: var(--main-yellowbrown);}


input::placeholder, .sel__placeholder {color: #737373;}

/*---Button---*/
.maincta {display:block;margin:auto;color:#ffffff !important;width:150px;padding: 16px 35px;border: 1px solid #b33825;background-color: #b33825;font-size: 14px;letter-spacing: 2px;color: #ffffff;}


/*---Text style---*/
.uppertext {text-transform:uppercase;}
.textleft {text-align:left;}
.textright {text-align:right;}
.textcenter {text-align:center;}
.lightf {font-weight:400;}
.mediumf {font-weight:500;}
.heavyf {font-weight:700;}

/*---Padding---*/
.padt5 {padding-top:5%;}
.padb5 {padding-bottom:5%;}

.padbo35 {padding-bottom:35px;}

.tbpad5 {padding-top:5%;padding-bottom:5%;}
.tbpad8 {padding-top:8%;padding-bottom:8%;}
.tbpad10 {padding-top:10%;padding-bottom:10%;}
.padtb20 {padding-top:20px;padding-bottom:20px;}
.padtb35 {padding-top:35px;padding-bottom:35px;}
.padtb45 {padding-top:45px;padding-bottom:45px;}
.padtb60 {padding-top:60px;padding-bottom:60px;}
.padtb80 {padding-top:80px;padding-bottom:80px;}


.lfpad5 {padding-left:5%;padding-right:5%;}
.padlf0 {padding-left:0px;padding-right:0px;} 

.padlf15 {padding-left:15px;padding-right:15px;} 

.padlf45 {padding-left:45px;padding-right:45px;} 

.padall5 {padding:5%;}
.padall10 {padding:10%;}
.pad35{padding:35px;}

/*--- Margin---*/
.marb0 {margin-bottom:0px;}
.marb30 {margin-bottom:30px;}
.marb40 {margin-bottom:40px;}


.bheight20 {height:20px;}
.bheight30 {height:30px;}
.bheight40 {height:40px;}
.bheight60 {height:60px;}

.height_50 {height:50vh;}
.height_60 {height:60vh;}
.height_70 {height:70vh;}
.height_75 {height:75vh;}
.height_85 {height:85vh;}
.height_90 {height:90vh;}
.height_100 {height:100vh;}
.height_105 {height:105vh;}
.height_110 {height:110vh;}
.height_200 {height:200vh;}



.bck_cover {background-size:cover;background-repeat:no-repeat;background-position:center;}
.bck_center {background-position:center;}
.bck_bottom {background-position:center bottom;}
.bck_atth {overflow:hidden;}
.bck_parallax {background-position: center; background-attachment: fixed; background-size: cover;padding-bottom: 45%;}
.bck_botshadow {position:relative;}


/*---Cta button---*/
.but_outline {background-color:transparent;border:1px solid #ffffff;padding:15px 25px;color:#ffffff !important;}
.but_outline:hover {background-color:#2e0023;}

.but_trans,.but_medbrown,.but_darkbrown,.but_black,.but_lightgrey,.but_darkblue {min-width: 120px;}

.but_trans {background-color:transparent;color:#ffffff;padding:6px 15px;border:1px solid #ffffff;margin: 20px auto;display: block;width: fit-content;}
.but_trans:hover {background-color:#3f5564;}
.but_medbrown {background-color:#af856f;color:#ffffff;padding:6px 15px;border:1px solid #ffffff;margin: 20px auto;display: block;width: fit-content;}
.but_medbrown:hover {background-color:#3f5564;}
.but_darkbrown {background-color:#96694c;color:#ffffff;padding:6px 15px;border:1px solid #ffffff;margin: 20px auto;display: block;width: fit-content;}
.but_darkbrown:hover {background-color:#3f5564;}
.but_black {background-color:#ffffff;color:#000000;padding:6px 15px;border:1px solid #000000;margin: 20px auto;display: block;width: fit-content;}
.but_black:hover {background-color:#af856f;color:#ffffff;border:1px solid #af856f;}
.but_lightgrey {background-color:#ece8e4;color:#000000;padding:6px 15px;border:1px solid #000000;margin: 20px auto;display: block;width: fit-content;}
.but_lightgrey:hover {background-color:#af856f;color:#ffffff;border:1px solid #af856f;}
.but_darkblue {background-color:#3f5564;color:#ffffff;padding:6px 15px;border:1px solid #ffffff;margin: 20px auto;display: block;width: fit-content;}
.but_darkblue:hover {background-color:#af856f;}
.but_left {margin-left: 0px;}



/*---Animation---*/
@-webkit-keyframes slide-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
}
@keyframes slide-top {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
}

/*---Position---*/
.subhead {position:relative;}
.subhead:before {content: " ";width: 100%;height: 100%;position: absolute;top: 0;background-color: rgb(0, 0, 0);z-index: 1;opacity: 0.5;}
.midtop {position:absolute;top:5%;left:50%;transform:translate(-50%, 0%);}
.midcenter {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.midbot {position: absolute;bottom: 15%;transform: translate(-50%,0%);left: 50%;}

.subhead.bck_darkblue:before {display: none !important;}

/*---Preloader---*/
#overlayer {width:100%;height:100%;position:fixed;z-index:10000000;background:#000000;}
.loader {display: block;width: 200px;height:auto;position: fixed;z-index: 100000000;top: 50%;animation: loader 2s infinite ease;left: 50%;transform: translate(-50%,-50%);}

@keyframes loader {
  0% {width: 200px;}
  50% {width: 200px;}
  100% {width: 200px;}
}


/*---Video Banner---*/
#subbanner {position: relative; height: calc(100vh - 90px);min-height:400px;}
#bannervideo {position: absolute; right: 0; bottom: 0; min-width: 100%; min-height: 100%; }
.touch .video-image {background-image:url('../img/video-preload.jpg');background-size: cover;background-position: center;}


/*---Float Tools---*/
#float-tools {position: fixed;right: 0;top: 50%;transform: translate(0,-50%);z-index: 1000000;border: 1px solid #AE9280;border-top-left-radius: 15px;border-bottom-left-radius: 15px;opacity: 1;transition: 0.5s;}
#float-tools {opacity: 1;transition: 0.5s;}
#float-tools ul li {border-bottom: 1px solid #AE9280;}
#float-tools ul li:first-child a {border-top-left-radius: 14px;}
#float-tools ul li:last-child a {border-bottom-left-radius: 14px;}
#float-tools ul li:last-child {border-bottom: 0px;}
#float-tools ul li a {width: 48px;height: 48px;display: block;margin-bottom: 0px;background-color: #000000;position: relative;background-size: 36px;background-repeat: no-repeat;background-position: center;}
#float-tools ul li a span {color:#eaeaea;position: absolute;left: -110px;text-align: right;width: 100px;opacity: 0;top: 50%;transform: translate(0%,-50%);text-transform:uppercase;letter-spacing:2px;font-size:13px;line-height:17px;font-weight:700;display:none;}
#float-tools ul li:hover a span {opacity: 1;display:block;}

#float-tools ul li a:hover {background-color:#AE9280;}
#float-tools ul li a.icon-call:hover {background-image:url('../img/icon-call-magenda.svg') !important;}
#float-tools ul li a.icon-email:hover {background-image:url('../img/icon-email-magenda.svg') !important;}
#float-tools ul li a.icon-register:hover {background-image:url('../img/icon-register-magenda.svg') !important;}
#float-tools ul li a.icon-google:hover {background-image:url('../img/icon-google-map-magenda.svg') !important;}
#float-tools ul li a.icon-waze:hover {background-image:url('../img/icon-waze-magenda.svg') !important;}
#float-tools ul li a.icon-whatsapp:hover {background-image:url('../img/icon-whatsapp-magenda.svg') !important;}



/*---New code---*/
.menu-container {width: 100%; position: relative; height: 100%; max-width: 1366px; display: block; margin: auto;}

.intro--maintitle {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.intro--awards {position: absolute;top: 3%;left: 3%;z-index: 1000 !important;}
.intro--awards a {display: block;}
.intro--maintitle, .intro--awards {z-index:5;}





/*----Intro banner---*/
.intro--register {position: absolute;bottom: 18%;left: 50%;transform: translate(-50%,0%);}
.intro--maintitle, .intro--register {width: 100%;}
.intro--shopresidences {position: absolute;bottom: 2%;left: 50%;transform: translate(-50%,0%);width: 100%;padding-left:20px;padding-right:20px;}
.intro--shopresidences > div {padding-left: 0;padding-right: 0;}

a.but_full {
    color: #ffffff !important;
    display: block;
    box-shadow: 0px 0px 7px #00000057;
    /*margin-top: 8px;*/
    /*margin-bottom: 8px;*/
    height: 100px;
    position:relative;
}
.full--title, .full--desc {display:inline-block;vertical-align:middle;}
.full--title {
    font-size: 5em;
    line-height: 1em;
    position: absolute;
    left: 15%;
    top: 50%;
    transform: translate(0%,-50%);
}
.full--desc {
    font-size: 1.8em;
    line-height: 1.4em;
    letter-spacing: 0px;
    position: absolute;
    right: 10%;
    top: 50%;
    transform: translate(0%,-50%);
}

/*---Main Menu---*/
#masterhead {bottom: 0;z-index: 100000;background-color: #000000;box-shadow: 2px 2px 10px #00000059;height: 90px;width: 100%;position: relative;}
div#masterhead.fixed-header {position: fixed; top: 0; bottom: inherit; }
.menu-logo {position: absolute; top: 50%; left: 15px; transform: translate(0%,-50%); } .menu-register {position:absolute;top: 50%;right: 3%;transform: translate(0%,-50%);}
.menu-main {position: absolute; top: 50%; right: 0%; transform: translate(0%,-50%); } .menu-burger {position:relative;top: 50%;left: 0%;transform: translate(0%,-50%);z-index:1000;}
.menu-logo img {width: 200px;}
nav.mainnav ul li {display: inline-block;margin-left: 10px;margin-right: 10px;text-transform: uppercase;position:relative;padding: 34px 3px;}
nav.mainnav ul li a {color: #ffffff !important;}
nav.mainnav ul li a:hover {color: #D6801F !important; }
.submenu {position: absolute;width: 250px;text-align: left;top: 20px;color: #ffffff;opacity: 0;transition:0.5s;}
.submenu li {margin-left: 0px !important;font-size: 14px;letter-spacing: 2px;}
.submenu li a {color:#ffffff !important;}
.submenu li a:hover {color:#cca666 !important;}
li.navsub:hover > .submenu {opacity: 1 !important;transition:0.5s;}

.menu-main ul.mainnav-submenu {
    position: absolute;
    background-color: #000000;
    bottom: 85px;
    bottom:inherit;
    z-index: 1000;
    opacity:0;
    width: 230px;
    display:none;
}

ul.mainnav-submenu.fixed-header {
    bottom: inherit;
    top:85px;
}

ul.mainnav-submenu li {
    width: 100%;
    margin: 0px !important;
    padding: 0px !important;
}

nav.mainnav ul li:hover ul.mainnav-submenu {
    opacity: 1;
    display:block;
}

ul.mainnav-submenu li a {
    padding: 12px 20px !important;
    display: block;
    margin-bottom: 0px;
}


/*---Scrolltop---*/
div#scrolltop {
    position: fixed;
    right: 60px;
    bottom: 60px;
    z-index: 1000000;
}

#scrolltop a {opacity:0;}
#scrolltop a.fixed-scroll {display:block;opacity:1;}

a.bannerscroll {color:#ffffff;}

/*---Mobile menu---*/
.menu-mobile {position: absolute; z-index: 1000; color: #ffffff; top: 50%; left: 5px; transform: translate(0px,-50%); display: none;}
.mburger b {width: 30px; height: 3px; }

.mm-panel {background-color: #000000;}
.mm-panels {background-color:#000000;}
.mm-navbar {background-color: #000000;}
.mm-listitem {color: #ffffff;}
a.mm-navbar__title, .mm-navbar__btn:not(.mm-hidden)+.mm-navbar__title:last-child {color: #5a5a5a;border-bottom: 1px solid #2b2b2b;}

.mm-btn:after, .mm-btn:before {border-color: #ffffff !important;}
.mm-listitem_selected>.mm-listitem__text {background: #000000;color: #ffffff !important;}
a.mm-listitem__text {font-size: 14px;letter-spacing: 3px;}
a.mm-navbar__title {text-transform: uppercase;letter-spacing: 4px;font-weight: 700;}

.nav-toggle {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    cursor: pointer;
    right: 10%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 200000;
    width: 30px;
    height: 30px;
}

.nav-toggle .nav-toggle-bar {
    margin-top: 0;
}

.nav-toggle .nav-toggle-bar::before {
    margin-top: -10px;
}

.nav-toggle .nav-toggle-bar::after {
    margin-top: 10px;
    width: 50%;
}

.nav-toggle .nav-toggle-bar, .nav-toggle .nav-toggle-bar::after, .nav-toggle .nav-toggle-bar::before {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    background: white;
    content: '';
    height: 2px;
    width: 36px;
}


a.mm-listitem__text {
    font-size: 12px;
    letter-spacing: 4px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    margin-bottom: 0px;
}

/*---Subheader---*/
.sub_arrowdown {font-size:40px;color:#ffffff;
  -webkit-animation: slide-top 0.6s linear infinite alternate-reverse both;
          animation: slide-top 0.6s linear infinite alternate-reverse both;
}


/*---slick slider---*/
.slick-slide {
    user-select: text;
}

.slider-box {
    position: relative;
    padding-left: 15px;
    padding-right: 15px;
}


.slider-wrap-gallery-thumb {
    position: relative;
}

.slide-header {
    text-align: center;
    padding: 45px 0px 35px 0px;
    max-width: 1000px;
    margin: auto;
    display: block;
}

.slider-thumb {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translate(-50%,0%);
    max-width: 1115px;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.slider-thumb > a, .slider-thumb-mobile a {
    margin: 10px 0px 5px 0px;
    background-color: #D3D1C6;
    color: #000000;
    position: relative;
    text-align: center;
    padding: 20px 10px;
    font-size: 14px;
    line-height: 16px;
    min-width: 180px;
}

.slider-thumb > a:hover, .slider-thumb > a.slideactive, .slider-thumb-mobile a:hover, .slider-thumb-mobile a.slideactive, .slider-thumb-mobile a.slick-current {
    background-color: #B51580;
    color:#ffffff;
}

.slider-thumb > a span, .slider-thumb-mobile a span {
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translate(-50%,-10px);
    background-color: #ffffff;
    color:#000000;
    width: 20px;
    height: 20px;
    text-align: center;
    border-radius: 100%;
    border: 2px solid #000000;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
}


.slide-image-masterplan {
    background-color: #ffffff;
    padding-bottom: 50%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    min-height:805px;
}

.slider-thumb-mobile {max-width: 90%; margin: auto; width:650px;}

.slider-C.slider-gallery {
    background-color: #ffffff;
}


/*---Slide 2---*/
.slideWT-gallery .slick-slide {text-align: center; }
.slideWT-thumb {max-width: 80%; margin: auto;}
.slideWT-thumb .slick-slide {opacity: 0.3;padding: 5px;}
.slideWT-thumb .slick-current.slick-active {opacity: 1;}
.slideWT-thumb .slick-next:before, .slider-thumb-mobile .slick-next:before {content: '\f054'; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #000000;}
.slideWT-thumb .slick-prev:before, .slider-thumb-mobile .slick-prev:before {content: '\f053'; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #000000;}

div.gallery, div.siteprogress {max-width: 960px;margin: auto;}
#maingallery .sliderWT {max-width:960px;margin: auto;}
#mapplic {top: 55px;}

@keyframes mapani1 {
  0%   {fill:#e6e7e7;}
  25%  {fill:#c0c9c9;}
  100% {fill:#e6e7e7;}
}

@keyframes mapani2 {
  0%   {fill:#f3f2e6;}
  25%  {fill:#e2e1cd;}
  100% {fill:#f3f2e6;}
}

.mapanimate1, .mapanimate2, .mapanimate3, .mapanimate4, .mapanimate5 {animation-duration: 3s;animation-iteration-count: infinite;}
.mapanimate1 {animation-name: mapani1;animation-delay: 0s;}
.mapanimate2 {animation-name: mapani1;animation-delay: 1s;}
.mapanimate3 {animation-name: mapani1;animation-delay: 2s;}
.mapanimate4 {animation-name: mapani2;animation-delay: 0s;}
.mapanimate5 {animation-name: mapani2;animation-delay: 2s;}


/*---Popup slider---*/
.slider-pop button.slick-prev.slick-arrow {left: 10px;z-index: 100;}
.slider-pop button.slick-next.slick-arrow {right: 10px;z-index: 100;}
.slider-pop .slick-dots li button:before {color:#ffffff !important;}

/*---Location slider---*/
#location .slider-gallery, #location .slider-navi {border:1px solid #231F20;}
.slider-map {display:flex;align-items: stretch}
.slider-map .slider-gallery{width:calc(100% - 250px);}
.slider-map .slider-navi {min-width:250px;}



.slider-navi {position:relative; padding-top: 20px; padding-bottom: 20px;}
.slider-navi-box {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.slider-navi-button > a {padding: 8px 15px; border: 1px solid #000000; color: #000000; display: block; background-color: #ffffff; font-size: 14px; font-weight: 700; letter-spacing: 2px; width: 200px; margin: 8px auto; }
.slider-navi-button > a:last-child {margin-bottom:45px;}
.slider-navi-button a.slideactive {background-color: #000000; color: #ffffff; }
.icon-social {max-width:36px;display:inline-block;margin-bottom: 0px;}
a.slider-gallery-zoom {position: absolute;right: 10px;top: 10px;}

/*---Popup youtube---*/
.popup-youtube {padding-bottom: 50%; width: 100%;min-height: 400px;background-size: cover; display: block;position:relative;}
.popup-youtube-button {top:50%;left:50%;transform:translate(-50%,-50%);position:absolute;width:100%;}
.popup-youtube-button h1 {font-size: 2em;margin-bottom: 30px;}
.popup-youtube-button img {max-width: 58px;margin: 0px auto 15px auto;}
.popup-youtube-button p {font-size: 14px;letter-spacing: 1px;}





/*---Project section---*/
.dynamic-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 100%;
    margin-bottom:30px;
}


.dynamic-box {
    flex-grow: 1;
    flex-basis: 20%;
    background-position: center;
    position: relative;
    padding: 35px 15px;
    background-size: 220%;
    transition: 0.5s;
}

.dynamic-box:hover {
    background-size: 210%;
    transition: 0.5s;
}

.dynamic-box * {display:block;color:#ffffff;text-align:center;margin:auto;z-index:5;}
.dynamic-box a.project-cta span {position: relative; z-index: 10;}
.dynamic-box a.project-cta span, a.but-cta {padding: 8px 20px; border: 1px solid #000000; color: #000000; display: inline-block; background-color: #ffffff; font-size: 14px; font-weight: 700;letter-spacing: 2px;}
.dynamic-box a:before {content: ' ';width: 100%;height: 100%;position: absolute;left: 0;top: 0;z-index: 5;background-color: #000000;opacity: 0.5;}
.dynamic-box a:after {content: ' '; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10000; }
.dynamic-box > *:not(a) {z-index: 10; position: relative;}
.dynamic-box:hover a.project-cta span {background-color: #000000; color: #ffffff; }

.project-status {font-size:14px;line-height: 16px;margin-bottom: 60px;}
.project-image {max-width: 200px;height: 135px;margin-bottom: 30px;margin-top: 100px;}
.project-image img {width: auto;max-height: 70px;}
.project-title {font-size:18px;line-height: 20px;margin-bottom: 120px;}

span.project-status {width: 140px; background-color: transparent; top: 0px !important; position: absolute; left: 50%; transform: translate(-50%,0%); padding-top: 30px; padding-bottom: 10px; display: ; }
span.project-status.new, span.project-status.ongoing {background-color: #a42c7d;}
span.project-status.new:after, span.project-status.ongoing:after  {content: ' '; display: block; position: absolute; top: 72px; z-index: -1; border-top: 20px solid #a42c7d; border-right: 70px solid transparent; border-left: 70px solid transparent; border-bottom: 50px solid transparent; }


/*---Single Project page---*/
.single-project-intro {padding-top:15vh;padding-bottom:3vh;}
.single-project-title {font-size: 3.3em; line-height: 0.9em;margin-bottom:30px;}
.single-project-logo {margin-bottom:25px;max-width: 280px;}
.single-project-logo-box {max-width:260px;margin:auto;}
.single-project-tab a {width: 100%; display: block; background-color: #ffffff; color: #231F20; padding: 15px; text-align: center; letter-spacing: 1px; font-weight: 700; margin-bottom: 0px; border: 1px solid #000000; }
.single-project-tab .selected {background-color:#231F20;color:#ffffff;}
.single-project-description {padding-top:5vh;padding-bottom:20vh;}
.single-project-description-box {margin-bottom: 40px; border-bottom: 1px solid #000000; padding-bottom: 10px; }
.single-project-description-box.white {border-bottom: 1px solid #ffffff;color:#ffffff;}

.single-project-description-cta a{font-size:16px;color:#000000;font-weight:700;letter-spacing:3px;display: block;}
.single-project-description-cta.white a{color:#ffffff;}
.single-project-description-cta a *{display:inline-block;vertical-align:middle;}
.single-project-description-cta a img{margin-right:10px;}
.single-project-list {margin-bottom:30px;}
ol.single-project-list li, ul.single-project-list li {font-size: 14px; line-height: 20px; letter-spacing: 3px; font-family: 'Open Sans', sans-serif; font-weight: 700; list-style: disc; margin-left: 20px; margin-bottom: 10px; }

div#courtyardvilla, div#servicedresidences {
    padding-top: 20px;
}

/*---Project Transition---*/
.servicedresidences, .courtyardvilla {transition:0.5s;}

/*---Project Gallery Tabs---*/
.gallery, .siteprogress {display:none;}
.gallery.active, .siteprogress.active {display:block;}
.gallery, .siteprogress {padding-top: 25px;}

.gallery-tab {display: block; padding: 15px; text-align: center; }
.gallery-tab-cta {cursor:pointer;color: #7c7c7c; margin-right: 30px; font-weight: 700; letter-spacing: 3px;font-size: 18px;line-height: 30px;}
.gallery-tab-cta.selected {color: #000000; }
.gallery-tab-cta:last-child {margin-right: 0px;}


div.gallery .slick-slide p, div.siteprogress .slick-slide p {padding: 10px;text-transform: uppercase;}

.slider-N.siteprogress img {max-height: 55vh;min-height: 330px;width: auto;}

.slide-desc {max-width: calc(100% - 300px);}

/*---Slider N---*/
.slider-N .slick-dots {bottom: 20px;text-align: right;padding-right:10px;}
.slider-N .slick-dots li {background-color: #ffffff; border-radius: 100%; position: relative; }
.slider-N .slick-dots li button::before {font-size: 0px;left: 50%;top: 50%;transform: translate(-50%,-50%);line-height: initial;opacity: 1;color: #ffffff;position: absolute;width: 12px;height: 12px;background-color: #fff;border-radius: 100%;}
.slider-N .slick-dots li.slick-active button:before {background-color: #000000; }
div.media .slick-slider {margin-bottom: 0px !important; }
.slider-N.white p{color:#ffffff;}
.slider-N .slick-slide img {display: block;margin: auto;}



/*---footer---*/
div#footer {padding-top: 20px;padding-bottom: 20px;}
.footerright {float:right;}
a.socialicon img {max-width: 30px;}
.socialtext, .socialicon {display:inline-block;vertical-align:middle;}
#footer a {color:#ffffff !important;}
#footer p {letter-spacing: 0px;font-size: 13px;line-height: 17px;color: white;}

.footer-widget-box {margin-bottom: 30px;}
.footer-widget-title {font-size:16px !important;line-height:24px !important;font-weight:700;margin-bottom:20px;color: white;}


.socialmedia-box .icon-social {width: 36px; margin-right: 10px; border-right: 2px solid #ffffff; padding-right: 10px; }
.socialmedia-box .icon-social:last-child {border-right: 0px; }
.phone-link {font-size:24px;line-height:32px;display:block;margin-bottom:5px;}

div#footercopyright {text-align: right; }
div#footercopyright a:after {content: '|';margin-left: 6px;margin-right: 3px;}
.disclaimer, .copyright {display:inline-block;}
.disclaimer a:last-child:after {display: none;}
.awards-img {max-width:400px;text-align:center;}

.footer-logo-img {width:400px;max-width:80%;}

/*---Popup---*/
.white-popup-block {
    background: #FFF;
    padding: 20px 30px;
    text-align: left;
    max-width: 650px;
    margin: 40px auto;
    position: relative;
}

/*---pop slider---*/
.image-source-link {
  color: #98C3D1;
}

.zoom-gallery {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
}

.zoom-gallery a {
    position:relative;
}

p.popcaption {
  color:#ffffff;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%,0%);
}


.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
  opacity: 0;
  -webkit-backface-visibility: hidden;
  /* ideally, transition speed should match zoom duration */
  -webkit-transition: all 0.3s ease-out; 
  -moz-transition: all 0.3s ease-out; 
  -o-transition: all 0.3s ease-out; 
  transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
    opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
    opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container, 
.mfp-with-zoom.mfp-removing.mfp-bg {
  opacity: 0;
}





/*---Custom Form---*/
div#form div {padding-left: 0px;}
.forminput p, .forminput input {display: block;}
.forminput input, .forminput select {padding: 12px 20px 12px 0px; font-size: 16px; max-width: 100%; width: 100%; background-color: transparent !important; height: 45px; border-radius: 0px; border-bottom: 1px solid #D3D1C6 !important; }
.forminput input[type="checkbox"] {height: initial; }
.forminput {display:inline-block;padding-top: 10px;padding-bottom: 25px;width: 100%;}
.forminput p {width: 100%;}
.checkboxrow input {height: initial;}
.col3 .forminput {width: 33%;}
.col2 .forminput {width: 49.5%;vertical-align:top;}


.forminput input::placeholder {color:#626366;}
.forminput input {margin-left: 0px;border:0px;color:#ffffff;}
.forminput select {-webkit-appearance: none;-moz-appearance: none;border: 0px;border-radius: 0px;color:#ffffff;}
.forminput input[type=checkbox] { width: auto; display: inline-block;}

#form label {display: inline-block;max-width: calc(100% - 60px);vertical-align: top;cursor:pointer;font-size:13px;margin-bottom: 10px;}
.checkboxrow {margin-bottom:30px;margin-top:10px;}
input[type="submit"],#form button{padding: 15px 35px;-webkit-appearance: none;border: 0;font-size: 18px;cursor: pointer;background-color:#ffffff;}
#form button {background-color: #AE9280;border: 1px solid #000000;text-transform: uppercase;letter-spacing: 1px;font-weight: 700;}


input[type="checkbox"], input[type="radio"] {
    -webkit-appearance: none;
    border: 1px solid #D3D1C6;
    background-color: #D3D1C6 !important;
    font-size: 10px !important;
    padding: 2px !important;
    position: relative;
    margin: 0px 7px 0px 0px !important;
    border-radius: 0px !important;
}


input[type="checkbox"]::after, input[type=radio]::after {
    content: '\f00c';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #000000;
    opacity: 0;
    margin-left: 1px;
}


input[type="checkbox"]:checked:after, input[type="radio"]:checked:after {opacity:1;}

/*.forminput.error:after {content: 'Invalid Value';color: red;margin-top: 10px;display: block;}*/
.forminput.error input, .forminput.error select {border: 1px solid red;}
.errormessage{ display: none; color:red;}
.forminput.error .errormessage{ display: block; color: red; margin-top: 5px; }
.checkboxrow .forminput {padding: 0; width: 100%;}
.checkboxrow .forminput .errormessage{ padding-left: 23px;}

::placeholder {
  color: #b3b3b3;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
 color: #b3b3b3;
}

::-ms-input-placeholder { /* Microsoft Edge */
 color: #b3b3b3;
}


.forminput label[for="tnc"] a {
    color: #000000;
    text-decoration: underline;
}


/*---Popup disclaimer---*/
.modal {
    max-width: 900px;
    width: 95%;
}

.modal ol, .modal ul:not(.slick-dots) {
    list-style: initial;
    margin-left: 20px;
    margin-bottom: 15px;
}

.blocker {
    word-wrap: break-word;
}

.modal a.close-modal {
    position: fixed;
    right: 10px;
    top: 10px;
    background-color: white;
    background-image: none;
    color: transparent;
    border-radius: 100%;
    text-indent: inherit;
    border: 2px solid #000000;
}

.modal a.close-modal:before {
    content: 'x';
    position: absolute;
    color: #000000;
    top: 40%;
    left: 50%;
    z-index: 10000;
    font-size: 22px;
    line-height: 30px;
    display: block;
    transform: translate(-50%,-50%);
}

/*---Responsive---*/


@media only screen and (max-width:1200px) {
  .slider-thumb > a, .slider-thumb-mobile a {min-width: 120px;font-size: 12px;padding: 15px 10px;}
  .dynamic-box {flex-basis: 30%;}
  .menu-main {display: none;}
  .menu-logo {left: 50%; transform: translate(-50%,-50%); }
  .menu-mobile {display:block;}
}

@media only screen and (min-width:768px) {
  .hideindesktop {display:none !important;}
}

@media only screen and (max-width:767px) {
  #subbanner {height: calc(90vh - 90px);}
  .intro--maintitle img {max-width: 160px;}
  .slide-header p {font-size: 14px;line-height: 22px;}
  .hideinmobile {display:none !important;}
  .tbpad5 {padding-top: 40px; padding-bottom: 40px; }
  h1 {font-size:1.8em;}
  .intro--awards img {max-width:150px;}
  .bck_parallax {background-attachment:inherit;height: initial; padding-bottom: 80%;}
  .slider-thumb-mobile {max-width: 90%;margin: auto;width: 650px;}
  .slide-desc {height: 110px;max-width: 100%;}
  .slider-thumb > a {flex-basis: 48%;min-width:initial;}
  .slider-map {display:block;}
  .slider-map .slider-gallery {width: 100%;}
  .slider-navi-box {position: inherit; top: inherit; left: inherit; transform: inherit; }
  .slider-navi-button > a:last-child {margin-bottom: 20px;}
  .slider-thumb > a, .slider-thumb-mobile a {margin: 20px 0px 20px 0px;}
  .dynamic-box > * {margin-bottom: 25px; }
  .dynamic-box {flex-basis: 100%;background-size: cover;}
  .dynamic-box:hover {background-size: cover;}

  .single-project-intro {padding-top:35px;padding-bottom :0px;}
  .single-project-title {font-size: 2em; line-height: 1em; margin-bottom: 10px; }
  .single-project-logo-box {margin-bottom: 45px;margin-left: initial;margin-right: auto;max-width: 230px;}
  .single-project-logo-box .single-project-logo {max-width: 100%;}

  #float-tools {bottom: 0;height: 48px;width: 100%;top: initial;transform: initial;border-radius: 0px;overflow:hidden;opacity: 0;}
  #float-tools.mobilefloat {opacity: 1;}
  #float-tools ul {display: flex;}
  #float-tools ul li {justify-content: space-between;width: 100%;text-align: center;border-right: 1px solid #AE9280;}
  #float-tools ul li:last-child {border-right: 0px;}
  #float-tools ul li a {width: 100%;border-radius:0px;border-radius: 0px !important;}
  #float-tools ul li a span {left:0;top:0;}
  #float-tools ul li:hover a span {display: none;opacity: 0;font-size: 0;}
  div#footer-logo .padtb35 {padding-bottom: 80px;}
  div#footercopyright p {text-align: left !important;}
  .slider-thumb-mobile a {min-width:initial;}
  .slide-image-masterplan {padding-bottom: 67%;min-height:initial;}
  #bannervideo {display:none;}
  .video-image {background-image:url('../img/video-preload.jpg');background-size: cover;background-position: center;}
  
  .siteprogress .slick-slide img {max-height:330px;}
  .single-project-logo {max-width: 50%;}
  .disclaimer, .copyright {display:block;}
  ol.single-project-list li, ul.single-project-list li {margin-bottom: 5px;letter-spacing: 1px;}
  div#scrolltop {right: 20px;}
  .gallery-tab-cta {display: block;margin-right: 0px;}
  
}



@media only screen and (max-width:374px) {
    .slide-header {min-height: 380px;max-height: 380px;height: 380px;}
    .slider-thumb > a, .slider-thumb-mobile a {padding: 15px 8px;font-size: 12px;}
}




/* ===== Horizontal Rule ===== */
.rule {
  margin: 10px 0;
  border: none;
  height: 1.5px;
  background-image: linear-gradient(left, #f0f0f0, #c9bbae, #f0f0f0);
}

/* ===== Select Box ===== */
.sel {
    display: inline-block;
    width: 100%;
    background-color: transparent;
    position: relative;
    cursor: pointer;
    border-bottom: 1px solid #D3D1C6 !important
}

.sel::before {
    position: absolute;
    content: ' ';
    background-image: url(../img/icon-select-arrow.svg);
    color: #FFF;
    right: 5px;
    bottom: 10px;
    width: 25px;
    height: 25px;
    background-size: cover;
    background-position: center;
}

.sel.active::before {
  transform: rotateX(-180deg);
}

.sel__placeholder {
    padding: 12px 20px 12px 0px;
    font-size: 16px;
    max-width: 100%;
    width: 100%;
    background-color: transparent !important;
    height: 45px;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: 0px;
    border-radius: 0px;
    color: #ffffff;
    display: block;
}

.sel.active .sel__placeholder {
  visibility: hidden;
}

.sel__placeholder::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px 20px 12px 0px;
    content: attr(data-placeholder);
    visibility: hidden;
    opacity: 0;
    transition: 0.5s;
}

.sel.active .sel__placeholder::before {
  visibility: visible;
}

.sel__box {
    position: absolute;
    top: calc(100% + 4px);
    left: -4px;
    display: none;
    list-style-type: none;
    text-align: left;
    font-size: 12px;
    line-height: 14px;
    background-color: #231F20;
    width: calc(100% + 8px);
    box-sizing: border-box;
    border: 1px solid #626366;
    border-radius: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    z-index: 1000;
}

.sel.active .sel__box {
  display: block;
  animation: fadeInUp 500ms;
}

.sel__box__options {
    display: list-item;
    font-size: 14px;
    color: #D3D1C6;
    padding: 5px 10px 5px 30px;
    user-select: none;
}


.sel__box__options::after {
    content: '\f00c';
    font-family: 'Font Awesome 5 Free';
    margin-left: 5px;
    display: none;
    font-weight: 900;
    font-size: 14px;
    position: absolute;
    left: 5px;
}

.sel__box__options.selected::after {
  display: inline;
}

.sel__box__options:hover {
    background-color: #ebedef;
    color: #000000;
}




/* ===== Keyframes ===== */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}


/* ===== Homepage - Achievement ===== */
.achievement-headline {
      font-size: 1.3em;
    font-weight: 600;
    font-family: 'archivo-black', sans-serif;
    display: block;
    margin-bottom: 2vh;
    line-height: 1.4em;
    color: #b41580;
    margin: auto;
}

.achievement-title {
      font-size: 1.3em;
    font-weight: 600;
    font-family: 'archivo-black', sans-serif;
    display: block;
        margin-bottom: 2vh;
    color: #ffffff;
    line-height: 1.4em;
}

.achievement-category {
    font-weight: 600;
    font-family: 'Open Sans', sans-serif;
    display: block;
        margin-bottom: 2vh;
    color: #ffffff;
}


.achievement-trophy {
  max-width: 150px;
  text-align: center;
}

.achievement-border-btm {
  border-bottom: 1px solid #b41580;
}

@media only screen and (max-width:767px) {
  .achievement-headline {
      font-size: 1.1em;
}
.achievement-title {
      font-size: 1.2em;
      margin-top: 2vh;
}
}

.mm-panels .mm-listitem__text{
    text-transform: uppercase;
}

.popupcenter {display:block;margin:auto;padding:0px;}
.popup-slick {margin-bottom:0px;}
.slick-dot-center ul.slick-dots {bottom: 5px !important;text-align: center !important;padding-right: 0px !important;}
.slick-dots li:only-child {display: none;}
