/* =============================== */
/* Theme */
/* =============================== */

/* reset */
html { font-size: 24px; }
html, body { min-height: 100%; }
body { letter-spacing: 0.02em; color: #aaa; background-color: #18181a; padding: 0; margin: 0; font-family: 'Abel', sans-serif; }

@media only screen and (min-width: 1540px) {
	.container { max-width: 1420px; }
}

/* color palettes */
:root { --color-lm-gray: #263746; --bg-color-lm-gray: #263746; --color-lm-pink: #ce0027; --bg-color-lm-pink: #ce0027; --color-lm-lightgray: #a5a5a5; --bg-color-lm-lightgray: #a5a5a5; }

.bg-color-gray { background-color: var(--bg-color-lm-gray); }
.color-gray { color: var(--bg-color-lm-gray); }

.bg-color-pink { background-color: var(--bg-color-lm-pink); }
.color-pink { color: var(--bg-color-lm-pink); }

.bg-color-lightgray { background-color: var(--bg-color-lm-lightgray); }
.color-lightgray { color: var(--bg-color-lm-lightgray); }

a { text-decoration: none !important; }
a:active,
a:hover { outline: 0; }

small, .small { line-height: normal; }

h1, .h1,
h2, .h2,
h3, .h3 { font-family: 'Barlow Condensed', sans-serif; letter-spacing: normal; }


.cd-section { background-color: #18181a; }

/* side nav */
.cd-side-navigation { background-color: #202124; position: fixed; top: 0; left: 0; height: 100%; width: 9%; z-index: 5; overflow: hidden; box-shadow: 0 0 30px rgba(0,0,0,0.5); transition: all 0.2s ease-in-out; }
.cd-side-navigation ul,
.cd-side-navigation li { margin: 0; padding: 0; list-style-type: none; }
.cd-side-navigation a { display: block; padding: 1.30em 10px; background-color: #202124; text-align: center; color: inherit; border-bottom: 1px solid #18181a; font-size: 74%; text-transform: uppercase; line-height: normal; }
.cd-side-navigation .selected { background-color: #18181a !important; }
.cd-side-navigation .logo-lm { width: 80%; max-width: inherit; margin: -10px auto; opacity: 0.8; }
.cd-side-navigation-closed { left: -9%; box-shadow: none; }

.side-nav-icn { width: 45px; height: 50px; display: block; margin: 0 auto 8px; border-radius: 4px; }
.side-nav-icn img { opacity: 0.2; width: 100%; }




.ts-main-nav-toggle { position: fixed; bottom: 25px; left: 45px; width: 60px; height: 60px; z-index: 6; border-radius: 50%; cursor: pointer; transition: all 0.5s ease-in-out; box-shadow: 0 3px 8px rgba(0,0,0,0.2); background-color: #263746; }
.ts-main-nav-toggle span { width: 100%; border-radius: 50%; height: 60px; display: block; opacity: 0.2; background: url(../images/arrow-angle-pointing-to-left.svg) center center no-repeat; background-size: 35%; transition-delay: 0.5s; transition: all 0.5s ease-in-out; }


.cd-section-expended { width: 100%; }
.cd-section-expended.visible { left: 0; }



.ts-main-nav-toggle-active { left: 20px; width: 40px; height: 40px; box-shadow: 0 8px 20px rgba(0,0,0,0.5); }
.ts-main-nav-toggle-active span { height: 40px; background-image: url(../images/menu.svg); }



/* community selection page */
.community-select-container { color: #aaa; text-align: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.community-select-container > div { display: table; vertical-align: middle; width: 90%; height: 100%; margin: 0 auto; }
.community-select-container > div > div { display: table-cell; vertical-align: middle; }
.community-select-container a { color: #aaa !important; margin: 0 12px 28px; width: 23%; float: left; font-size: 98%; padding-bottom: 10px; font-weight: normal; text-transform: uppercase; letter-spacing: 0.02em; }
.community-select-container h5 { line-height: normal; opacity: 0.2; }
.community-select-container img { opacity: 0.2; }


/* community selection popup */
.modalBackground { background-color: rgba(255,255,255,0.6); }
.pnlModalContainer iframe { border: none; }


.compare-btn { position: fixed; bottom: 40px; right: 40px; z-index: 4; width: 70px; height: 70px; border-radius: 50%; background-color: #ce0027; overflow: hidden; color: white; font-size: 16px; padding: 20px 0; text-align: center; }

/* intro slider */
.intro-slider-outer { width:100%; height:99.7vh; margin:1px auto 0; overflow:hidden; }
.intro-slider { width:100%; }
.intro-slider .slick-slide { outline:none!important }
.intro-slider p { line-height:normal;font-size:80%; padding:0 0 0 15px!important;   }
.intro-slider .col-elev-caption { font-family: 'Barlow Condensed', sans-serif; font-weight: 500; margin:-2px 0; text-transform: uppercase; letter-spacing:0.06em; color: #fff; text-shadow: 0 0 4px rgba(0,0,0,0.5); font-size:120%; padding:0 0 5px 15px!important }

.intro-slider .slick-slide > div {  margin:0.2em 0.10em; overflow:hidden; height:calc(50vh - 0.35em) }

.intro-slider .fotorama__img,
.intro-slider .fotorama__stage { margin: 0 auto; z-index:-1}

.fotorama-outer { background-color:white; overflow:hidden; overflow-y:auto; width:100%; height:49.01vh; border-right:1px solid #ababab; margin:0 auto; padding:0;  }


.fotorama-outer::-webkit-scrollbar { -webkit-appearance: none; background-color: rgba(0,0,0,.15); width: 8px; height: 8px; }
.fotorama-outer::-webkit-scrollbar-thumb { border-radius: 0; background-color: rgba(0,0,0,.4); }

.fotorama-outer .fotorama__arr { display:none!important }
.fotorama-outer .fotorama__fullscreen-icon { transform:scale(0.5)!important; transform-origin:top right; opacity:1!important; top:8px;border-radius:6px; }
.fotorama-outer .fotorama__nav-wrap { height:20px; background-color:#fff; box-shadow:0 0 20px rgba(0,0,0,0.2)!important; z-index:999; width:100%; top:0; left:0;}
.fotorama-outer .fotorama__img {  }
.fotorama__dot { top:8px!important; }


.intro-outer { overflow:hidden; width:100%; background-color:#263746; position:relative; }
.intro-1 { width:28%; float:left;  }
.intro-2 { width:36%;  float:left; }
.intro-3 { width:36%; float:left; }

.intro-1 img { width:100%; margin-bottom:10px; box-shadow:0 4px 10px rgba(0,0,0,0.5) }
.intro-1 .btn-intro { background-color:#558873; position:absolute; bottom:0; left:0; overflow:hidden; color:white; text-transform:uppercase; font-size:80%; letter-spacing:0.02em; padding:10px 20px;width:29%; text-align:right;z-index:4; box-shadow:0 -4px 20px rgba(0,0,0,0.4)}
.intro-1 .btn-intro:after { content: ''; width: 18px; height: 14px; margin-left:10px; display: inline-block; vertical-align: middle; background:url(/images/arrow-pointing-to-right.svg) center center no-repeat; background-size:100%; }





.house-type-icon { display: inline-block; vertical-align: middle; margin: 0; padding: 0; }


.fr-ratio-ph { width:100%;  padding-top:75%; position:relative; background:url(../images/loader.gif) center center no-repeat #343030; }

.fr-outer { position:absolute; top:0; left:0; width:100%; height:100%; }



.btn-size {width: 70px;height: 56px;border-radius: 5px;display: inline-block;vertical-align: top;background: url(../images/ruler.svg) center center no-repeat #3b3c42;background-size: 50%;text-indent: -999999px;margin: 1px 4px 0px -6px;}

.btn-name { width: 70px; height: 56px; border-radius: 5px; display: inline-block; vertical-align: top; background: url(../images/font-size.svg) center center no-repeat #3b3c42; background-size: 50%; text-indent: -999999px; margin: 1px 4px 0px 0; }



.btn-back { width: 60px; height: 60px; border-radius: 50%; background-color: #263746; display: block; padding: 10px 18px; margin-bottom: 28px; margin-left: 15px; }
.btn-back img { width: 100%; opacity: 0.2; }



.compare-box { background-color: #475d65; padding: 80px 20px 0; margin: 0; width: 100%; /*border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;*/  color: white; display: block; overflow: hidden; position: relative; text-align: left; font-size: 80%; box-shadow:0 2px 20px rgba(0,0,0,0.4) inset }
.compare-box:nth-child(3),
.compare-box:nth-child(4) { padding-top:110px; }

.compare-box img { width: 100%; display: inline-block; vertical-align: top; border-radius: 8px; }
.compare-box p { margin: 0; padding: 0 0 10px; line-height: normal; opacity: 0.5; }

.compare-box-qp { padding: 0; margin: 0; background-color: transparent; }
.compare-box-qp > div { margin-bottom: 0; background-color: #475d65; box-shadow:0 2px 20px rgba(0,0,0,0.4) inset; padding: 20px; /*border-radius: 10px;*/ }





.compare-slider-dots .slick-dots { position: absolute; top: -55px; left: 0; margin: 0; padding: 0; list-style-type: none; }
.compare-slider-dots .slick-dots li { display: inline-block; vertical-align: top; }
.compare-slider-dots .slick-dots li button { -webkit-appearance: none; border: none; background-color: black; color: #898989; margin: 0 8px 0 0; display: block; width: 35px; height: 35px; font-size: 80%; border-radius: 50%; outline: none !important; }
.compare-slider-dots .slick-dots li.slick-active button { background-color: #ce0027; color: #fff; }
.compare-slider-dots .slick-slide { overflow: hidden; overflow-y: auto; height: 835px; outline: none !important; }





.phase-panel-btn { position: fixed; top: 20px; right: 15px; z-index: 8; width: 50px; height: 50px; border-radius: 50%; background: url(../images/more.svg) center center no-repeat #ce0027; background-size: 50%; transition: all 0.2s ease-in-out; }
.phase-panel-btn-active { right: 370px; }
.phase-panel { position: fixed; top: 0; right: -350px; width: 350px; height: 100%; z-index: 4; background-color: #202124; box-shadow: 0 0 20px rgba(0,0,0,0.4); transition: all 0.2s ease-in-out; }
.phase-panel-active { right: 0; }
.phase-panel-close { width: 0 20px; display: block; width: 60px; height: 60px; position: absolute; top: 10px; right: 10px; text-align: center; color: white; font-weight: bold; font-size: 38px; opacity: 0.5; }
.phase-panel > div { padding: 2.8em 2em 1em; }
.phase-panel > div a { display: block; margin-bottom: 10px; text-transform: capitalize; color: white !important; opacity: 0.5; }
.phase-panel > div a:before,
.phase-panel > div a:after { display: none; }



.popup-container-overlay { position: fixed; width: 100%; opacity: 0.8; top: 0px; margin: 0px; min-height: 200px; height: 100%; background-color: #000; z-index: 7; visibility: hidden; opacity: 0; transition: all 0.5s ease-in-out; }
.popup-container-overlay-active { visibility: visible; opacity: 0.8; }
.popup-container { position: fixed; left: 50%; top: 50%; -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 750px; height: 1px!important; padding: 0; background-color: #33333a; box-shadow: 0 0 40px rgba(0,0,0,0.6); z-index: 8; text-align: center; border-radius: 8px; visibility: hidden; opacity: 0; overflow: hidden; transition: all 0.2s ease-in-out; transition-delay:0s; }
.popup-container-active { visibility: visible; opacity: 1; height: 500px!important; padding:10px; transition-delay:0.4s;  }
.popup-container h3 { font-weight: normal; padding-top: 12px; }
.popup-container iframe { width: 100%; height: 450px; opacity:0; visibility:hidden; display: block; border: none; margin: 0 auto; transition:all 0.2s ease-in-out; transition-delay:1s; }
.popup-container-active iframe { opacity:1; visibility:visible; }
.popup-container .popup-close { font-size: 42px; position: absolute; top: 0; right: 0; padding: 5px 22px; cursor: pointer; }






.slider-gallery-one img { max-width:100%; }
.slider-gallery-one .slick-arrow { position:absolute; top:50%; z-index:2;-webkit-appearance:none; border:none; text-indent:-99999px; width:70px; height:70px; border-radius:50%;outline:none!important}
.slider-gallery-one .slick-next { right:15px;  background:url(../images/arrow-angle-pointing-to-left.svg) center center no-repeat rgba(0,0,0,0.4);  background-size:40%; transform:rotate(180deg)}
.slider-gallery-one .slick-prev { left:15px;  background:url(../images/arrow-angle-pointing-to-left.svg) center center no-repeat rgba(0,0,0,0.4);background-size:40%;  }


.sticky-top {  position:fixed; top:0; width:100%; box-sizing:border-box; padding:15px 14px; z-index:3; background-color:rgba(24, 24, 26, 0.88); }

/*.modal { position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.5); z-index:9999; }*/