/*
Theme Name: Sempurna Height
Theme URI: https://sempurnaheight.com.my/
Author: eJeeban Web Design Company
Author URI: https://www.ejeeban.com/
Description: Customized theme for Sempurna Height Website.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, light, one-column, flexible-width, custom-header, custom-menu, featured-images, post-formats, sticky-post
Text Domain: sempurnaheight
*/


/*	--------------------------------------------------
		locomotive-scroll
		-------------------------------------------------- */
/*! locomotive-scroll v4.1.1 | MIT License | https://github.com/locomotivemtl/locomotive-scroll */
html.has-scroll-smooth {
  overflow: hidden;
}

html.has-scroll-dragging {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.has-scroll-smooth body {
  overflow: hidden; 

}

.has-scroll-smooth [data-scroll-container] {
  min-height: calc(100vh + 100px);
}

[data-scroll-direction="horizontal"] [data-scroll-container] {
  height: 100vh;
  display: inline-block;
  white-space: nowrap; }

[data-scroll-direction="horizontal"] [data-scroll-section] {
  display: inline-block;
  vertical-align: top;
  white-space: nowrap;
  height: 100%; }

.c-scrollbar {
  position: absolute;
  right: 0;
  top: 0;
  width: 11px;
  height: 100%;
  transform-origin: center right;
  transition: transform 0.3s, opacity 0.3s;
  opacity: 0; }
  .c-scrollbar:hover {
    transform: scaleX(1.45); }
  .c-scrollbar:hover, .has-scroll-scrolling .c-scrollbar, .has-scroll-dragging .c-scrollbar {
    opacity: 1; }
  [data-scroll-direction="horizontal"] .c-scrollbar {
    width: 100%;
    height: 10px;
    top: auto;
    bottom: 0;
    transform: scaleY(1); }
    [data-scroll-direction="horizontal"] .c-scrollbar:hover {
      transform: scaleY(1.3); }

.c-scrollbar_thumb {
  position: absolute;
  top: 0;
  right: 0;
  background-color: black;
  opacity: 0.5;
  width: 7px;
  border-radius: 10px;
  margin: 2px;
  cursor: -webkit-grab;
  cursor: grab; }
  .has-scroll-dragging .c-scrollbar_thumb {
    cursor: -webkit-grabbing;
    cursor: grabbing; }
  [data-scroll-direction="horizontal"] .c-scrollbar_thumb {
    right: auto;
    bottom: 0; }
noscript img {
	display: none;
}
noscript iframe {
	display: none;
	visibility:hidden;
}


/*	--------------------------------------------------
	Fonts
	-------------------------------------------------- */
@font-face {
    font-family: 'URWClassico';
    src: url('fonts/urwclassico-regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'URWClassico';
    src: url('fonts/urwclassico-italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: 'URWClassico';
    src: url('fonts/urwclassico-bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'URWClassico';
    src: url('fonts/urwclassico-bolditalic.woff2') format('woff2');
    font-weight: 700;
    font-style: italic;
}


/*	--------------------------------------------------
	Generic CSS Setup
	-------------------------------------------------- */
*,
*:after,
*:before{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
:root{
    --black: rgba(33, 33, 33, 1);
    --blue: rgba(39, 44, 145, 1);
    --red: rgba(223, 21, 0, 1);
    --white: rgba(255, 255, 255, 1);
    --bg-white: rgba(232, 230, 231, 1);
    --light-yellow: rgba(252, 250, 234, 1);
    --dark-grey: rgba(67, 67, 67, 1);
    --border-box: 1px solid rgba(67, 67, 67, 1);
    --border-light-grey: 1px solid rgba(33, 33, 33, 0.3);
    --border-dark-grey: 1px solid rgba(33, 33, 33, 1);
    --default-font: 'URWClassico', sans-serif;
    --white-space01: 0 9%;
    --white-space02: 2% 9%;
    --white-space03: 0 18%;
    --space100: 100px;
    --space125: 125px;
    --space50: 50px;
    --space30: 30px;
    --space3p: 2.8%;
    --space9p: 9%;
    --space18p: 18%;
    --space21p: 21%;
    --space0: 0px;
}
html {
	width: 100%;
	background: var(--white);
	font-family: var(--default-font);
	font-size: 16px;
}
body {
	width: 100%;
	height: 100%;
	background: url(images/bg-red-flora03.jpg) no-repeat left top rgba(142, 27, 0, 1.0);
	background-size: 100% auto;
	background-attachment: fixed;
	padding: 0 0 0 0px;
	margin: 0 0 0 0px;
	font-family: var(--default-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.667;
	box-sizing: border-box;
	color: var(--black);
}
h1, h2, h3, h4, h5, td, tr, th, div, header, section, footer, p, form, input, textarea, select, select option, fieldset, label{
	font-family: var(--default-font);
	font-size: 1vw;
	font-weight: 400;
	line-height: 1.5;
	color: var(--dark-grey);
	margin: 0 0 0 0px;
	padding: 0 0 0 0px;
	border: none;
}
h1{
	margin-bottom: 3vh;
	font-size: 4vw;
	line-height: 1.2;
}
h1 span{
	margin-bottom: 10px;
	font-size: 0.8vw;
	letter-spacing: 0.2vw;
	text-transform: uppercase;
	display: block;
}
h2{
	margin-bottom: 3vh;
	font-size: 4vw;
	line-height: 1.25;
}
h2 span{
	margin-bottom: 10px;
	font-size: 0.8vw;
	letter-spacing: 0.2vw;
	text-transform: uppercase;
	display: block;
}
h3{
	margin-bottom: 1vh;
	font-size: 1.2vw;
	font-weight: 700;
	line-height: 1.5;
}
h3 span{
	margin-bottom: 10px;
	font-weight: 400;
	font-size: 0.8vw;
	letter-spacing: 0.2vw;
	text-transform: uppercase;
	display: block;
}
h4{
	margin-bottom: 1vh;
	font-weight: 700;
	text-transform: uppercase;
}
h5{
	font-size: 1.25vw;
	font-weight: 700;
	line-height: 1.2;
	color: var(--blue);
}
p{
	margin-bottom: 2.5vh;
}
a {
	color: var(--red);
	text-decoration: none;
}
a img{
	border: none;
	display: block;
	margin: 0;
	padding: 0;
	pointer-events: none;
}
input{
	width: 100%;
	height: 35px;
	padding: 0 10px;
	margin: 0 0 20px 0px;
	background-color: transparent;
	border: var(--border-box);
	border-radius: 0px;
	-webkit-appearance: none;
}
textarea{
	width: 100%;
	height: 125px;
	padding: 10px 10px;
	margin: 0 0 20px 0px;
	background-color: transparent;
	border: var(--border-box);
	border-radius: 0px;
	-webkit-appearance: none;
}
select{
	width: 100%;
	height: 35px;
	padding: 0 10px 3px 10px;
	margin: 0 0 20px 0px;
	background: url(images/ico-dropdown.png) no-repeat 98% center;
	border: var(--border-box);
	border-radius: 0px;
	-webkit-appearance: none;
}
input:active, textarea:active, select:active{
	background-color: var(--white);
}
label{
	margin-bottom: 5px;
	display: block;
}
input[type="checkbox"]{
	position: relative;
	width: 16px;
	height: 16px;
	background-color: transparent;
	padding: 0;
	margin: 5px 5px 0 0px;
	border: 1px solid var(--black);
	border-radius: 3px;
	color: var(--black);
	cursor: pointer;
	display: inline-block;
	transition: all 0.2s ease-out;
}
input[type="checkbox"]:checked:after {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 10px;
	height: 10px;
	background-color: var(--black);
	border-radius: 3px;
	content: "";
}
input[type="file"]{
	padding: 8px 10px;
}
input[type="submit"]{
	width: 180px;
	height: 45px;
	background-color: var(--black);
	padding: 0px;
	border: none;
	border-radius: 10px;
	font-family: var(--heading-font);
	font-weight: 700;
	text-transform: uppercase;
	color: var(--white);
	-webkit-appearance: none;
	cursor: pointer;
	transition: all 0.2s ease-out;
}
input[type="submit"]:hover {
	background-color: var(--red);
	transition: top 0.2s ease-out;
}
input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--black);
}
*:focus {
    outline: none;
}
form a{
	display: inline-block;
	color: var(--red);
}
form p{
	margin-bottom: 0px;
}
img, video{
	pointer-events: none;
}
.checkBox {
	display: block;
	text-align: left;
	margin-bottom: 5px;
}
.checkBoxLast {
	display: block;
	text-align: left;
	margin-bottom: 30px;
}
.wpcf7-list-item {
	margin: 0;
}
.thumbHolder,
.imgHolder {
	position: relative;
	overflow: hidden;
}
.thumbHolder:after,
.imgHolder:after {
	content: "";
  display: block;
  padding-bottom: 100%;
}
.thumbHolder img,
.imgHolder img{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	pointer-events: none;
	transition: all 0.2s ease-out;
}
.clearBoth {
	clear: both;
}
.listingHolder ul, 
.listingHolder li{
	margin: 0 0 0 0px;
	padding: 0 0 0 0px;
	list-style: none;
}
.listingHolder li{
	display: block;
}
.btnCTA {
	margin-top: 2.5vw;
}
.btnCTA a{
	position: relative;
	background-color: var(--black);
	padding: 20px 50px 17px 50px;
	letter-spacing: 0.1vw;
	text-transform: uppercase;
	font-family: var(--heading-font);
	font-size: 1.3vw;
	font-weight: 700;
	color: var(--white);
	border-radius: 10px;
	white-space: nowrap;
	transition: all 0.2s;
}
.btnCTA a:hover {
	background-color: var(--red);
}
.btnLearnMore {
	position: relative;
	text-transform: uppercase;
	letter-spacing: 0.1vw;
	font-size: 1vw;
	text-decoration: underline;
	color: var(--dark-grey);
	white-space: nowrap;
	display: block;
	transition: all 0.2s;
}
.btnLearnMore:hover {
}
.rowHolder {
	display: flex;
	justify-content: space-between;
}
.colLeft {
	width: 48%;
}
.colRight {
	width: 48%;
}
#theContainer::before {
	z-index: 1101;
	mix-blend-mode: multiply;
	pointer-events: none;
}
.italic {
	font-style: italic;
}
.grecaptcha-badge {
    display: none;
}


/*	--------------------------------------------------
	Preloader
	-------------------------------------------------- */
#preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(142, 27, 0, 1.0);
	z-index: 1100;
	width: 100%;
	height: 100%;
}
#preloader .wrapper {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#preloader .wrapper .logoHolder {
	width: 225px;
}
#preloader .wrapper .logoHolder img{
	width: 100%;
	height: auto;
}


/*	--------------------------------------------------
	Header & Navigation
	-------------------------------------------------- */
#header {
  position: absolute;
  height: 50%;
  top: 0px;
  z-index: 21;
  width: 100%;
  background: url(images/shadow-header02.png) repeat-x;
  transition: top 0.2s ease-out;
}
#header ul, 
#header li{
	margin: 0 0 0 0px;
	padding: 0 0 0 0px;
	list-style: none;
	display: block;
}
#header a{
	color: var(--dark-grey);
}
#header .widthWrapper {
  position: relative;
  margin: 0 var(--space3p);
  padding: 3vh 0px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: double 3px rgba(31, 31, 30, 0.1);
}
#header .subNavi {
  position: relative;
  margin: 0 var(--space3p);
  padding: 1vh 0px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: solid 1px rgba(31, 31, 30, 0.1);
}
#header .logoHolder {
  width: 10%;
}
#header .logoHolder img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#header .btnMenu {
  position: relative;
  width: 30px;
  cursor: pointer;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: none;
}
#header .btnMenu .bar1, 
#header .btnMenu .bar2,
#header .btnMenu .bar3 {
  width: 30px;
  height: 2px;
  background-color: var(--dark-grey);
  transition: 0.5s;
}
#header .btnMenu .bar2 {
	margin-top: 5px;
}
#header .btnMenu .bar3 {
	margin-top: 5px;
}
#header .menuLeft {
	width: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#header .menuRight {
	width: 15%;
  display: flex;
  justify-content: right;
  align-items: center;
}
#header .menuCTA{
	width: 18%;
  padding: 7px 20px;
  margin-left: 3%;
  background-color: var(--red);
  border-radius: 30px;
  text-align: center;
}
#header .menuSub {
	display: flex;
	justify-content: center;
	align-items: center;
}
#header .menuLeft li,
#header .menuRight li,
#header .menuCTA li,
#header .menuSub li{
  padding: 0 10px 0 0px;
  line-height: 1.1;
}
#header .menuLeft li:last-child,
#header .menuRight li:last-child,
#header .menuCTA li:last-child,
#header .menuSub li:last-child{
  padding: 0px;
}
#header .menuLeft li a,
#header .menuRight li a,
#header .menuCTA li a,
#header .menuSub li a{
	padding: 10px;
	color: var(--dark-grey);
	font-family: var(--default-font);
	font-size: 0.8rem;
	text-transform: uppercase;
  text-decoration: none;
  display: block;
}
#header .menuCTA a {
	padding: 5px;
	color: var(--white);
	display: flex;
	justify-content: center;
	align-items: center;
}
#header .menuCTA a img{
	width: auto;
	height: 23px;
	margin: 0 5px 0 0px;
	display: block;
}
#header .menuCTA a p{
	margin: 0;
	padding: 0;
	color: var(--white);
}
#header .menu-item-has-children {
	position: relative;
}
#header .menu-item-has-children a{
	display: flex;
	align-items: center;
}
#header .menu-item-has-children a:after {
	width: 10px;
	height: 10px;
	margin-left: 10px;
	background: url(images/ico-dropdown.png) no-repeat center center;
	content: "";
	display: inline-block;
}
#header .sub-menu{
	position: absolute;
	left: 0;
	margin: 0;
	min-width: 180px;
	background-color: var(--white);
	box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.2);
	display: none;
	transition: .5s;
}
#header .menu-item-has-children:hover .sub-menu {
    display: block;
}
#header .sub-menu li{
	padding: 0;
	margin: 0;
	width: 100%;
	height: auto;
	border-bottom: var(--border-light-grey);
}
#header .sub-menu li:last-child{
	border-bottom: none;
}
#header .sub-menu li a{
	text-align: left;
	padding: 10px 10px;
	color: var(--black);
}
#header .sub-menu li a:after {
	display: none;
}

.navLight #header{
	background-color: transparent;
	border-bottom: none;
}
.navLight #header .menuLeft li a,
.navLight #header .menuRight li a,
.navLight #header .menuCTA li a{
	color: var(--white);
}
.navLight #header .menuLeft li img,
.navLight #header .menuCTA li img{
	filter: saturate(0) brightness(2000%);
}
.navLight #header .menu-item-has-children a:after {
	background: url(images/ico-dropdown-white.png) no-repeat center center;
}
.navLight #header .sub-menu li a{
	color: var(--dark-grey);
}
.navLight #btnMenu .bar1, 
.navLight #btnMenu .bar2, 
.navLight #btnMenu .bar3 {
    background-color: var(--white);
}
#header.fixed-header {
  position: fixed;
  height: auto;
  transition: top 0.2s ease-out;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
#header.fixed-header .widthWrapper {
  padding: 1.5vh 0px;
  border-bottom: none;
}
#header.fixed-header .subNavi {
	display: none;
  border-bottom: none;
}
#header.fixed-header .logoHolder {
  width: 9%;
}
.navLight #header.fixed-header .secTopMenu li a,
.navLight #header.fixed-header .menuCTA li a{
	color: var(--dark-grey);
}
.navLight #header.fixed-header .secTopMenu li img,
.navLight #header.fixed-header .menuCTA li img{
	filter: unset;
}
.navLight #header.fixed-header .menu-item-has-children a:after {
	background: url(images/ico-dropdown.png) no-repeat center center;
}
.navLight #header.fixed-header #btnMenu .bar1, 
.navLight #header.fixed-header #btnMenu .bar2, 
.navLight #header.fixed-header #btnMenu .bar3 {
    background-color: var(--dark-grey);
}


/*	--------------------------------------------------
	Navigation
	-------------------------------------------------- */
.naviSlideOut {
	margin-top: -30px;
	opacity: 0;
	transition: all 0.5s ease-out;
}
.fullNavi {
  position: fixed;
  z-index: 122;
  top: 0;
  right: 0;
  background: var(--white);
  background-attachment: fixed;
  background-size: contain;
  width: 300px;
  height: 100%;
  padding: 30px;
  text-align: left;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: none; 
}
.nav-hide { 
	display: none; 
}
.fullNavi ul, 
.fullNavi li{
	margin: 0 0 0 0px;
	padding: 0 0 0 0px;
	list-style: none;
	display: block;
}
.fullNavi .btnClose {
	position: absolute;
	z-index: 3;
	top: 30px;
	right: var(--space4p);
  width: 30px;
  cursor: pointer;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.fullNavi .btnClose .bar1, 
.fullNavi .btnClose .bar2 {
	position: absolute;
  width: 30px;
  height: 2px;
  background-color: var(--black);
  margin-right: 3px;
  transition: 0.5s;
  display: inline-block;
  transform-origin: 0 0;
}
.fullNavi .btnClose .bar1 {
	top: 0;
	transform: rotate(45deg);
	transform-origin: 0 0;
}
.fullNavi .btnClose .bar2 {
	top: 1px;
	right: -24px;
	transform: rotate(135deg);
	transform-origin: 0 0;
}
.fullNavi .naviMobile {
	padding-top: 30px;
}
.fullNavi .naviMobile li {
	font-size: 15px;
	display: block;
}
.fullNavi .naviMobile li a{
	position: relative;
	width: 100%;
	padding: 10px 0px;
	font-weight: 700;
	display: block;
	color: var(--black);
	border-bottom: var(--border-light-grey);
	transition: all 0.3s ease-out;
}
.fullNavi .naviMobile li a:hover {
	color: var(--blue);
}
.fullNavi .menu-item-has-children a:after {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	width: 10px;
	height: 10px;
	background: url(images/ico-dropdown.png) no-repeat center center;
	content: "";
	display: inline-block;
}
.fullNavi .sub-menu{
	display: none;
	transition: .5s;
}
.fullNavi .menu-item-has-children:hover .sub-menu {
    display: block;
}
.fullNavi .sub-menu li{
	padding: 0;
	margin: 0;
	width: 100%;
}
.fullNavi .sub-menu li:last-child{
	border-bottom: none;
}
.fullNavi .sub-menu li a{
	padding: 10px 10px;
	font-weight: 400;
}
.fullNavi .sub-menu li a:after {
	display: none;
}


/*	--------------------------------------------------
	Footer
	-------------------------------------------------- */
footer {
	padding: var(--space100) var(--space9p) var(--space50) var(--space9p);
	text-align: center;
}
footer h2, footer h3, footer h4, footer p, footer span, footer div, footer input, footer input::placeholder {
	color: var(--light-yellow);
}
footer h2, footer h3, footer h4{
	margin-bottom: 20px;
}
footer a{
	color: var(--light-yellow);
	text-decoration: underline;
}
footer ul, 
footer li{
	margin: 0 0 0 0px;
	padding: 0 0 0 0px;
	list-style: none;
	display: block;
}
footer .secFooterInfo {
	padding-bottom: var(--space50);
}
footer .secFooterInfo h2{
	margin-bottom: 30px;
}
footer .secFooterInfo .contactHolder {
	text-align: center;
}
footer .secFooterInfo .qrListing {
	margin-bottom: 30px;
	display: flex;
	justify-content: center;
}
footer .secFooterInfo .qrListing li{
	width: 100px;
	margin-right: 20px;
}
footer .secFooterInfo .qrListing li:last-child {
	margin-right: 0;
}
footer .secFooterInfo .qrListing li img{
	width: 100%;
	height: auto;
}
footer .secFooterInfo .socialListing {
	margin-top: 30px;
	margin-bottom: 30px;
	display: flex;
	justify-content: center;
}
footer .secFooterInfo .socialListing li{
	width: 30px;
	margin-right: 20px;
}
footer .secFooterInfo .socialListing li:last-child {
	margin-right: 0;
}
footer .secFooterInfo .socialListing li img{
	width: 100%;
	height: auto;
}
footer .sitemapHolder {
	width: 100%;
}
footer .sitemapHolder ul{
	display: flex;
	justify-content: center;
}
footer .sitemapHolder li{
	position: relative;
	padding: 0 20px;
	border-right: 1px solid var(--light-yellow);
}
footer .sitemapHolder li:last-child{
	border-right: none;
}
footer .sitemapHolder li a{
	text-decoration: none;
	text-transform: uppercase;
}
footer .secCopyright {
	padding-top: 55px;
	border-top: var(--border-light-grey);
}
footer .secCopyright p{
	font-size: 0.9vw;
	letter-spacing: 2px;
}


/*	--------------------------------------------------
	Owl Carousel
	-------------------------------------------------- */
.owl-dots {
	padding-top: 50px;
}
.owl-carousel button.owl-dot {
	width: 11px;
	height: 11px;
	margin-right: 15px;
	background-color: rgba(0, 0, 0, 0.3);
	border-radius: 50%;
	overflow: hidden;
}
.owl-carousel button.owl-dot:last-child {
	margin-right: 0;
}
.owl-carousel button.owl-dot.active {
	background-color: var(--aqua);
}
.owl-carousel .owl-nav {
	margin-top: var(--space30);
	display: flex;
	justify-content: center;
}
.owl-carousel .owl-nav button.owl-prev, 
.owl-carousel .owl-nav button.owl-next {
	width: 40px;
	height: 40px;
	font-size: 30px;
	font-weight: 400;
	line-height: 1;
	margin: 0;
	padding: 0;
	border: var(--border-dark-grey);
}
.owl-carousel .owl-nav button.owl-prev {
	margin-right: 3px;
}


/*	--------------------------------------------------
	Section Banner
	-------------------------------------------------- */
.secBanner {
	position: relative;
	background-color: var(--dark-grey);
}
.secBanner .bgHolder {
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
}
.secBanner .bgHolder video,
.secBanner .bgHolder img{
	width: 100%; 
	height: 100%; 
	object-fit: cover; 
	display: block;
}
.secBanner .txtureHolder {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 25%;
	overflow: hidden;
}
.secBanner .txtureHolder img{
	width: 100%; 
	height: auto; 
	display: block;
}
.secBanner .descHolder {
	position: absolute;
	z-index: 3;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 70%;
	text-align: center;
}
.secBanner .descHolder h1,
.secBanner .descHolder h2{
	color: var(--white);
}
.secBanner .descHolder p{
	font-size: 1.2vw;
	letter-spacing: 0.1vw;
	color: var(--white);
}
.secBanner .descHolder img{
	width: 100%;
	height: auto;
}
.secBanner .btnCTA {
	margin-top: var(--space50);
}
.secBanner .formHolder {
	margin-top: var(--space30);
}


/*	--------------------------------------------------
	Heading Section
	-------------------------------------------------- */
.secHeading {
	position: relative;
	z-index: 2;
	background: url(images/bg-grey-flora.jpg) no-repeat left top;
	background-size: 100% auto;
	background-color: var(--bg-white);
	background-attachment: fixed;
	padding: 35vh var(--space18p) var(--space125) var(--space18p);
	text-align: center;
}
.secHeading iframe {
	width: 100%;
	height: 320px;
	margin-top: var(--space50);
}


/*	--------------------------------------------------
	Tiles Slider View
	-------------------------------------------------- */
.tileSlider .item {
	position: relative;
}
.tileSlider .item a{
	display: block;
}
.tileSlider .item .imgHolder:after {
	padding-bottom: 135%;
}
.tileSlider .item:hover .imgHolder img{
	width: 101%;
	height: 101%;
}
.tileSlider .item .titleHolder {
	position: absolute;
	z-index: 3;
	bottom: 30px;
	left: 30px;
	right: 30px;
	text-align: center;
}
.tileSlider .item .titleHolder h3{
	margin-bottom: 0;
	color: var(--white);
}


/*	--------------------------------------------------
	List Listing View
	-------------------------------------------------- */
.listingHolder {
	position: relative;
	margin: 0 -10px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}
.listingHolder h3{
	margin-bottom: 5px;
}
.listingHolder a{
	text-decoration: none;
	display: block;
}
.listingHolder .btnLearnMore {
	margin-top: 2vw;
	padding: 10px 30px 7px 30px;
}
.listingHolder li{
	position: relative;
	z-index: 2;
	width: calc(33.33% - 20px);
	margin: 0 10px 20px 10px;
  opacity: 1;
  transition: all 0.8s ease-out;
}
.listingHolder li.appear{
  opacity: 1;
}
.listingHolder .thumbHolder,
.listingHolder .imgHolder {
	margin-bottom: 25px;
}
.listingHolder .thumbHolder:after,
.listingHolder .imgHolder:after {
  padding-bottom: 80%;
}
.listingHolder li:hover .thumbHolder img,
.listingHolder li:hover .imgHolder img{
	width: 110%;
	height: 110%;
}
.listingHolder li .descHolder{
	width: 100%;
}
.listingHolder .descHolder {
	padding: 0 20px 20px 20px;
	text-align: left;
}
.listingHolder .btnCTA a{
	width: 100%;
	margin-bottom: 20px;
	padding: 15px 10px 10px 10px;
	text-align: center;
	display: block;
}
.listingHolder .btnViewMap {
	text-align: center;
	text-decoration: underline;
	display: block;
}


/*	--------------------------------------------------
	Pop Up
	-------------------------------------------------- */
.btnRegister {
	position: fixed;
	z-index: 30;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
}
.btnRegister p{
	position: relative;
	right: -38%;
	background: var(--white);
	padding: 10px 20px;
	transform: rotate(-90deg);
	transform-origin: center center;
	text-transform: uppercase;
	line-height: 1;
	cursor: pointer;
}
.btnRegister p:hover {
	color: var(--red);
}
.popupCTA {
	position: fixed;
	z-index: 30;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	display: none;
}
.popupCTA .maskHolder {
	position: relative;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.9);
	cursor: pointer;
}
.popupCTA .contentHolder {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 60%;
	background-color: var(--white);
	padding: 65px;
	border-radius: 20px;
	overflow: hidden;
  box-shadow: 0px 0px 20px 0px rgba(81, 98, 84, 0.15);
}
.popupCTA .contentHolder h2{
	margin-bottom: 30px;
}
.popupCTA .contentHolder .colLeft {
	width: 48%;
}
.popupCTA .contentHolder .colRight {
	width: 48%;
}


/*  --------------------------------------------------
    Accordion
    -------------------------------------------------- */
.accordionHolder {
	clear: both;
}
.accordionHolder .item {
	border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.accordionContent {
  max-height: 0px;
  overflow: hidden;
  transition: 0.25s ease-in-out;
}
.accordionContent img{
	width: 100%;
	height: auto;
	display: block;
	margin-bottom: 30px;
}
.accordionTitle{
  cursor: pointer;
  display: block;
  font-size: 1.4vw;
	font-weight: 300;
  padding: 30px 0 25px 0;
  position: relative;
  margin-bottom: 0;
  transition: all 0.25s ease-out;
}
.accordionTitle::after {
  border-style: solid;
  border-width: 1px 1px 0 0;
  content: " ";
  display: inline-block;
  float: right;
  height: 10px;
  left: 2px;
  position: relative;
  right: 20px;
  top: 2px;
  transform: rotate(135deg);
  transition: 0.35s ease-in-out;
  vertical-align: top;
  width: 10px;
}
.accordionTitle:hover{ 
  color: var(--aqua);
}
.accordionTrigger:checked
  + .accordionTitle
  + .accordionContent {
  max-height: 350px;
}
.accordionTrigger:checked + .accordionTitle::after{
  transform: rotate(-45deg);
  transition: 0.25s ease-in-out;
}
.accordionHolder input[type="checkbox"] {
  display: none;
}
.accordionHolder table{
    width: 100%;
    margin-bottom: var(--space50);
    border: var(--border-light-grey);
}
.accordionHolder table td{
	padding: 15px;
	border-right: var(--border-light-grey);
	border-bottom: var(--border-light-grey);
}
.accordionHolder table td:last-child{
	border-right: none;
}
.accordionHolder table tr:last-child td{
	border-bottom: none;
}


/*	--------------------------------------------------
	Pagination
	-------------------------------------------------- */
.pagination {
	margin-top: 30px;
}
.pagination h2{
	display: none;
}
.pagination .nav-links {
	display: flex;
}
.pagination .nav-links a,
.pagination .nav-links span{
	padding: 1px 6px;
	margin-right: 5px;
	display: block;
	text-align: center;
	line-height: 1.2;
	border: 1px solid var(--black);
	color: var(--black);
}
.pagination .nav-links span,
.pagination .nav-links a:hover{
	background-color: var(--black);
	color: var(--white);
}


/*	--------------------------------------------------
	Registration Section
	-------------------------------------------------- */
.secRegistration {
	background-color: #d3d4d5;
	padding: var(--space125) var(--space9p) var(--space125) var(--space9p);
	text-align: center;
}
.secRegistration h2{
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}
.secRegistration .colLeft,
.secRegistration .colRight {
	width: 49.5%;
}


/*	--------------------------------------------------
	Home Page
	-------------------------------------------------- */
#secIndex {
	width: 100%;
}
#secIndex .secBanner .bgHolder {
	height: 110vh;
}
#secIndex .secBanner .descHolder {
	top: auto;
	bottom: 20%;
	width: 40%;
	transform: translateX(-50%);
}
#secIndex .secConcept {
	position: relative;
	margin-bottom: 200px;
}
#secIndex .secConcept h1,
#secIndex .secConcept h2,
#secIndex .secConcept h3,
#secIndex .secConcept h4,
#secIndex .secConcept p,
#secIndex .secConcept a{
	color: var(--light-yellow);
}
#secIndex .secConcept .descHolder {
	padding: var(--space125) var(--space18p) 0 var(--space18p);
	text-align: center;
	margin-bottom: var(--space50);
}
#secIndex .secConcept .facilityListing {
	margin: var(--space50) 0 0 0px;
	padding: 0;
	display: flex;
	justify-content: space-between;
	list-style: none;
}
#secIndex .secConcept .facilityListing li{
	margin: 0;
	padding: 0;
}
#secIndex .sliderGallery .owl-carousel .owl-stage {
  display: flex;
  align-items: center;
}
#secIndex .sliderGallery .item {
    position: relative;
    width: 100%;
    overflow: hidden;
}
#secIndex .sliderGallery .item:after{
    content: "";
    display: block;
    padding-bottom: 55%;
    transition: all 0.5s ease 0s;
}
#secIndex .sliderGallery .item img{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.5s ease 0s;
}
#secIndex .secConcept .taglineHolder {
	position: absolute;
	z-index: 3;
	bottom: -50px;
	left: 50%;
	transform: translateX(-50%);
	width: 60%;
}
#secIndex .secConcept .taglineHolder .line01 {
	width: 50%;
	margin-left: -10%;
	opacity: 0;
}
#secIndex .secConcept .taglineHolder .line01.appear {
	opacity: 1;
	margin-left: 0%;
}
#secIndex .secConcept .taglineHolder .line02 {
	width: 70%;
	margin-left: 30%;
	margin-top: -15%;
	opacity: 0;
}
#secIndex .secConcept .taglineHolder .line02.appear {
	margin-left: 20%;
	opacity: 1;
}
#secIndex .secMasterplan {
	background-color: var(--bg-white);
	padding: var(--space125) var(--space9p);
}
#secIndex .secMasterplan .rowHolder {
	align-items: center;
}
#secIndex .secMasterplan .colLeft {
	width: 45%;
}
#secIndex .secMasterplan .colLeft img{
	width: 100%;
	height: auto;
}
#secIndex .secMasterplan .colRight {
	width: 49%;
}
#secIndex .sec360View {
	margin-top: -2px;
	background-color: var(--bg-white);
	padding: 0 var(--space9p) var(--space125) var(--space9p);
	text-align: center;
}
#secIndex .sec360View h2{
	width: 60%;
	margin-left: auto;
	margin-right: auto;
}
#secIndex .secDevelopment {
	background-color: var(--black);
	overflow: hidden;
}
#secIndex .secDevelopment .owl-carousel .owl-nav {
	position: absolute;
	bottom: var(--space125);
	right: var(--space9p);
	margin-top: var(--space30);
	display: flex;
	justify-content: center;
}
#secIndex .secDevelopment .owl-carousel .owl-nav button.owl-prev, 
#secIndex .secDevelopment .owl-carousel .owl-nav button.owl-next {
	color: var(--light-yellow);
	border-color: var(--light-yellow);
}
#secIndex .secDevelopment .propertyListing .item {
	position: relative;
	overflow: hidden;
}
#secIndex .secDevelopment .propertyListing .item h2,
#secIndex .secDevelopment .propertyListing .item h3,
#secIndex .secDevelopment .propertyListing .item p,
#secIndex .secDevelopment .propertyListing .item a{
	color: var(--light-yellow);
}
#secIndex .secDevelopment .propertyListing .item h2{
	position: relative;
	padding-bottom: 6vh;
	margin-bottom: 8vh;
	border-bottom: 1px solid rgba(252, 250, 234, 0.3);
}
#secIndex .secDevelopment .propertyListing .item h2:after {
	position: absolute;
	bottom: -2px;
	right: 0px;
	width: 15%;
	height: 3px;
	background-color: var(--light-yellow);
	content: "";
}
#secIndex .secDevelopment .propertyListing .item p{
	width: 40%;
}
#secIndex .secDevelopment .propertyListing .btnLearnMore {
	color: var(--light-yellow);
}
#secIndex .secDevelopment .propertyListing .imgHolder:after {
	padding-bottom: 55%;
}
#secIndex .secDevelopment .propertyListing .imgHolder img{
	opacity: 0.8;
}
#secIndex .secDevelopment .propertyListing .descHolder {
	position: absolute;
	z-index: 2;
	top: 50%;
	left: var(--space9p);
	right: var(--space9p);
	transform: translateY(-50%);
}
#secIndex .secLocation {
	background: url(images/bg-grey-flora.jpg) no-repeat left top var(--bg-white);
	background-size: 100% auto;
	background-attachment: fixed;
	padding: var(--space125) var(--space18p) var(--space100) var(--space18p);
	text-align: center;
}
#secIndex .secLocation img{
	width: 100%;
	height: auto;
	padding: 50px;
	background-color: var(--white);
	border: 1px dashed var(--dark-grey);
}
#secIndex .secAmenities {
	margin-top: -2px;
	background-color: var(--bg-white);
	padding: 0 0 var(--space125) 0px;
}
#secIndex .secAmenities .owl-carousel .owl-nav {
	margin-top: var(--space30);
	display: flex;
	justify-content: center;
}
#secIndex .secAmenities .item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: var(--white);
	overflow: hidden;
	border-radius: 20px;
}
#secIndex .secAmenities .imgHolder {
	width: 55%;
}
#secIndex .secAmenities .imgHolder:after{
	padding-bottom: 80%;
}
#secIndex .secAmenities .descHolder {
	width: 45%;
	padding: 35px;
}
#secIndex .secRegistration {
	margin-top: -2px;
}


/*	--------------------------------------------------
	Springvale
	-------------------------------------------------- */
#secSpringVale {
	width: 100%;
	background: url(images/bg-torquise-flora02.jpg) no-repeat left top #1f6aa3;
	background-size: 100% auto;
	background-attachment: fixed;
}
#secSpringVale .secBanner .descHolder {
	width: 40%;
}
#secSpringVale .secIntro {
	position: relative;
	background-color: var(--bg-white);
	padding: var(--space125) var(--space9p);
	text-align: center;
}
#secSpringVale .secIntro .txtureHolder {
	position: absolute;
	top: 0;
	right: 0;
	width: 25%;
}
#secSpringVale .secIntro .txtureHolder img{
	width: 100%;
	height: auto;
	display: block;
}
#secSpringVale .secIntro .txtureBottomHolder {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 30%;
}
#secSpringVale .secIntro .txtureBottomHolder img{
	width: 100%;
	height: auto;
	display: block;
}
#secSpringVale .secIntro .descHolder {
	margin: 0 20% 50px 20%;
}
#secSpringVale .secIntro .descHolder .colorTorquise {
	color: #1f6aa3;
}
#secSpringVale .secIntro .descHolder .logoHolder {
	width: 40%;
	margin: 0 auto 20px auto;
}
#secSpringVale .secIntro .descHolder .logoHolder img{
	width: 100%;
	height: auto;
}
#secSpringVale .secIntro .typeListing {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	justify-content: space-around;
}
#secSpringVale .secIntro .typeListing li{
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	background-color: var(--black);
}
#secSpringVale .secIntro .typeListing a{
	display: block;
}
#secSpringVale .secIntro .typeListing .imgHolder img{
	width: 101%;
	height: 101%;
	opacity: 1;
	transition: all 0.5s;
}
#secSpringVale .secIntro .typeListing li:hover .imgHolder img{
	width: 105%;
	height: 105%;
	opacity: 0.8;
}
#secSpringVale .secIntro .typeListing li.disabled .imgHolder img {
	filter: saturate(0%);
	opacity: 0.6;
}
#secSpringVale .secIntro .typeListing h3{
	position: absolute;
	top: 50px;
	left: 30px;
	right: 30px;
	text-align: center;
	color: var(--light-yellow);
	opacity: 0;
	transition: all 0.5s;
}
#secSpringVale .secIntro .typeListing li:hover h3{
	opacity: 1;
	transition: all 0.5s;
}
#secSpringVale .secIntro .typeListing .btnLearnMore {
	position: absolute;
	bottom: 50px;
	left: 30px;
	right: 30px;
	text-align: center;
	color: var(--light-yellow);
	opacity: 0;
}
#secSpringVale .secIntro .typeListing li.disabled .btnLearnMore {
	text-decoration: none;
	font-style: italic;
}
#secSpringVale .secIntro .typeListing li:hover .btnLearnMore {
	opacity: 1;
	transition: all 0.5s;
}
#secSpringVale .secCoverImg {
	overflow: hidden;
}
#secSpringVale .secCoverImg .imgHolder:after {
	padding-bottom: 60%;
}
#secSpringVale .secCoverImg .imgHolder img{
	top: 0;
	left: 0;
}
#secSpringVale .secFloorPlan {
	position: relative;
	background-color: var(--bg-white);
	padding: var(--space125) var(--space9p);
}
#secSpringVale .secFloorPlan .item {
	background-color: #1f6aa3;
	display: flex;
	justify-content: space-between;
	overflow: hidden;
	border-radius: 30px;
}
#secSpringVale .secFloorPlan .item h2,
#secSpringVale .secFloorPlan .item h3,
#secSpringVale .secFloorPlan .item h4,
#secSpringVale .secFloorPlan .item p,
#secSpringVale .secFloorPlan .item a{
	color: var(--light-yellow);
}
#secSpringVale .secFloorPlan .item a{
	text-decoration: ;
}
#secSpringVale .secFloorPlan .item .colLeft {
	position: relative;
	width: 50%;
	overflow: hidden;
}
#secSpringVale .secFloorPlan .item .colLeft img{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 101%;
	height: 101%;
	object-fit: cover;
}
#secSpringVale .secFloorPlan .item .colRight {
	width: 50%;
}
#secSpringVale .secFloorPlan .item .imgHolder:after {
	padding-bottom: 45%;
}
#secSpringVale .secFloorPlan .item .imgHolder img{
	width: 101%;
	height: 101%;
}
#secSpringVale .secFloorPlan .item .descHolder {
	padding: 30px;
}
#secSpringVale .secRegistration {
	margin-top: -2px;
}


/*	--------------------------------------------------
	Warranty Registration
	-------------------------------------------------- */



/*	--------------------------------------------------
	Search Warranty
	-------------------------------------------------- */





/*	--------------------------------------------------
	News & Events
	-------------------------------------------------- */



/*	--------------------------------------------------
	Contact Us
	-------------------------------------------------- */



/*	--------------------------------------------------
	Default Details Page
	-------------------------------------------------- */
#secDefault {
	position: relative;
	width: 100%;
}
#secDefault .secBanner .bgHolder,
#secDefault .secBanner .txtureHolder {
	height: 85vh;
}
#secDefault .secContent {
	position: relative;
	z-index: 2;
	background-color: var(--bg-white);
	padding: var(--space100) var(--space18p) var(--space125) var(--space18p);
	text-align: center;
}
#secDefault .secContent .imgHolder {
	margin-bottom: var(--space30);
}
#secDefault .secContent .imgHolder:after {
	padding-bottom: 75%;
}
#secDefault .secBlank {
	position: relative;
	z-index: 2;
	background-color: var(--bg-white);
	text-align: left;
}




/*	--------------------------------------------------
	For Large Screen
	-------------------------------------------------- */
@media screen and (min-width: 1600px) and (max-width: 5000px) {
	
}


/*	--------------------------------------------------
	For Tablet Landscape
	-------------------------------------------------- */
@media only screen and (max-width: 1100px) {
	:root{
    --white-space01: 0 5%;
    --white-space02: 3% 5%;
    --white-space03: 0 5%;
    --space9p: 5%;
    --space18p: 5%;
    --space21p: 5%;
	}

	#header .btnMenu {
    display: block;
  }
  #header .menuRight {
    display: none;
  }
  #header .menuLeft li a,
  #header .menuRight li a,
  #header .menuSub li a{
    font-size: 1vw;
  }

	#secSpringVale .secCoverImg .imgHolder img {
		position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	}
}


/*	--------------------------------------------------
	For Tablet Portrait
	-------------------------------------------------- */
@media only screen and (max-width: 969px) {
	body{
		background-size: contain;
	}
	:root{
    --white-space01: 0 5%;
    --white-space02: 20px 5%;
    --white-space03: 0 5%;
    --space100: 100px;
    --space125: 100px;
    --space9p: 5%;
    --space18p: 5%;
    --space21p: 5%;
	}
	h1, h2, h3, h4, h5, td, tr, th, div, header, section, footer, p, form, input, textarea, select, select option, fieldset, label{
		font-size: 1rem;
	}
	h1{
		margin-bottom: 20px;
		font-size: 2rem;
		line-height: 1.2;
	}
	h1 span{
		margin-bottom: 10px;
		font-size: 0.8rem;
		letter-spacing: 1px;
	}
	h2{
		margin-bottom: 20px;
		font-size: 2rem;
	}
	h2 span{
		margin-bottom: 10px;
		font-size: 0.8rem;
		letter-spacing: 1px;
	}
	h3{
		margin-bottom: 10px;
		font-size: 1.2rem;
	}
	h3 span{
		margin-bottom: 10px;
		font-size: 0.8rem;
		letter-spacing: 1px;
	}
	h4{
		margin-bottom: 10px;
	}
	h5{
		font-size: 1.2rem;
	}
	p{
		margin-bottom: 20px;
	}
	.btnCTA {
		margin-top: 20px;
	}
	.btnCTA a{
		position: relative;
		padding: 20px 50px 17px 50px;
		font-size: 1.2rem;
	}
	.btnLearnMore {
		letter-spacing: 1px;
		font-size: 1rem;
	}
	.rowHolder {
		display: block;
	}
	.colLeft {
		width: 100%;
	}
	.colRight {
		width: 100%;
	}

 	#header .widthWrapper {
    padding: 20px var(--space3p);
  }
  #header .subNavi {
    padding: 5px 0px;
  }
  #header .logoHolder {
    width: 25%;
  }
  #header .menuLeft {
    display: none;
  }
  #header .menuLeft li,
  #header .menuRight li,
  #header .menuSub li{
    padding: 0 10px 0 0px;
  }
  #header .menuLeft li a,
  #header .menuRight li a,
  #header .menuSub li a{
    font-size: 0.8rem;
  }
  #header.fixed-header .widthWrapper {
    padding: 10px var(--space3p);
  }
  #header.fixed-header .logoHolder {
    width: 20%;
  }

	footer .sitemapHolder ul{
		display: block;
	}
	footer .sitemapHolder li{
		padding: 20px 0px;
		border-right: none;
		border-bottom: 1px solid var(--light-yellow);
	}
	footer .sitemapHolder li:last-child{
		border-bottom: none;
	}
	footer .secCopyright p{
		font-size: 0.9rem;
		letter-spacing: 1px;
	}

	.secBanner .bgHolder {
		height: 600px;
	}
	.secBanner .txtureHolder {
		width: 40%;
	}
	.secBanner .descHolder {
		width: 85%;
	}
	.secBanner .descHolder p{
		font-size: 1.2rem;
		letter-spacing: 1px;
	}

	.listingHolder li{
		width: calc(50% - 20px);
	}

	.popupCTA .contentHolder {
		width: 90%;
		padding: 35px;
		border-radius: 10px;
	}
	.popupCTA .contentHolder .colLeft {
		width: 100%;
	}
	.popupCTA .contentHolder .colRight {
		width: 100%;
	}

	.secRegistration h2{
		width: 100%;
	}
	.secRegistration .colLeft,
	.secRegistration .colRight {
		width: 100%;
	}

	#secIndex .secBanner .bgHolder {
		height: 600px;
	}
	#secIndex .secBanner .descHolder {
		bottom: 15%;
		width: 70%;
	}
	#secIndex .secConcept {
		margin-bottom: 150px;
	}
	#secIndex .secConcept .facilityListing {
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#secIndex .secConcept .facilityListing li{
		width: 48%;
		margin-bottom: 3%;
	}
	#secIndex .secConcept .container .item{
	  width: 90%;
	  margin-right: 30px;
	}
	#secIndex .secConcept .taglineHolder {
		width: 80%;
	}
	#secIndex .secMasterplan {
		text-align: center;
	}
	#secIndex .secMasterplan .colLeft {
		width: 100%;
		margin-bottom: 30px;
	}
	#secIndex .secMasterplan .colRight {
		width: 100%;
	}
	#secIndex .sec360View h2{
		width: 100%;
	}
	#secIndex .secDevelopment .propertyListing .item {
		height: auto;
	}
	#secIndex .secDevelopment .propertyListing .item h2{
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
	#secIndex .secDevelopment .propertyListing .item h2:after {
		right: 0px;
		width: 35%;
	}
	#secIndex .secDevelopment .propertyListing .item p{
		width: 100%;
	}
	#secIndex .secDevelopment .propertyListing .item .imgHolder:after {
		padding-bottom: 70%;
	}
	#secIndex .secAmenities .item {
		display: block;
	}
	#secIndex .secAmenities .imgHolder {
		width: 100%;
		margin-bottom: 30px;
	}
	#secIndex .secAmenities .descHolder {
		width: 100%;
	}
	#secIndex .secAmenities .descHolder .rowHolder {
		display: flex;
		justify-content: space-between;
	}
	#secIndex .secAmenities .descHolder .colLeft {
    width: 75%;
  }
  #secIndex .secAmenities .descHolder .colRight {
    width: 25%;
  }

	#secSpringVale {
		background-size: contain;
	}
	#secSpringVale .secBanner .descHolder {
		width: 80%;
	}
	#secSpringVale .secIntro .txtureHolder {
		width: 40%;
	}
	#secSpringVale .secIntro .txtureBottomHolder {
		width: 40%;
	}
	#secSpringVale .secIntro .descHolder {
		margin: 0 0 50px 0px;
	}
	#secSpringVale .secIntro .typeListing {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	#secSpringVale .secIntro .typeListing li{
		width: 100%;
	}
	#secSpringVale .secCoverImg {
		height: 500px;
	}
	#secSpringVale .secCoverImg .imgHolder {
		width: 100%;
		height: 100%;
	}
	#secSpringVale .secFloorPlan .item {
		display: block;
	}
	#secSpringVale .secFloorPlan .item .colLeft {
		width: 100%;
	}
	#secSpringVale .secFloorPlan .item .colLeft img{
		position: static;
		top: auto;
		left: auto;
		transform: none;
		width: 100%;
		height: 100%;
	}
	#secSpringVale .secFloorPlan .item .colRight {
		width: 100%;
	}
}


/*	--------------------------------------------------
	For Mobile Landscape
	-------------------------------------------------- */
@media screen and (orientation:landscape) and (min-device-width: 319px) and (max-device-width: 480px) {

}


/*	--------------------------------------------------
	For Mobile Portrait
	-------------------------------------------------- */
@media only screen and (max-width: 500px) {
	:root{
    --white-space01: 0 6%;
    --white-space02: 20px 6%;
    --white-space03: 0 6%;
    --space100: 100px;
    --space125: 100px;
    --space9p: 6%;
    --space18p: 6%;
    --space21p: 6%;
	}

	#header .logoHolder {
    width: 35%;
  }
  #header.fixed-header .widthWrapper {
    padding: 10px var(--space3p);
  }
  #header.fixed-header .logoHolder {
    width: 30%;
  }

	.secBanner .bgHolder {
		height: 480px;
	}

	.listingHolder {
		margin: 0px;
	}
	.listingHolder li{
		width: 100%;
		margin: 0 0 30px 0px;
	}

	#secIndex .secBanner .bgHolder {
		height: 480px;
	}
	#secIndex .secConcept .taglineHolder {
		width: 90%;
	}
	#secIndex .secDevelopment .owl-carousel .owl-nav {
		bottom: var(--space30);
	}
	#secIndex .secDevelopment .propertyListing .item .imgHolder:after {
		padding-bottom: 120%;
	}
}