@font-face {
    font-family: 'EuclidRegular';
    src: url('/fonts/EuclidRegular.eot');
    src: url('/fonts/EuclidRegular.eot') format('embedded-opentype'),
         url('/fonts/EuclidRegular.woff2') format('woff2'),
         url('/fonts/EuclidRegular.woff') format('woff'),
         url('/fonts/EuclidRegular.ttf') format('truetype'),
         url('/fonts/EuclidRegular.svg#EuclidRegular') format('svg');
}

@font-face {
    font-family: 'EuclidLight';
    src: url('/fonts/EuclidLight.eot');
    src: url('/fonts/EuclidLight.eot') format('embedded-opentype'),
         url('/fonts/EuclidLight.woff2') format('woff2'),
         url('/fonts/EuclidLight.woff') format('woff'),
         url('/fonts/EuclidLight.ttf') format('truetype'),
         url('/fonts/EuclidLight.svg#EuclidLight') format('svg');
}



@font-face {
    font-family: 'SangbleubpsansLight';
    src: url('/fonts/SangbleubpsansLight.eot');
    src: url('/fonts/SangbleubpsansLight.eot') format('embedded-opentype'),
         url('/fonts/SangbleubpsansLight.woff2') format('woff2'),
         url('/fonts/SangbleubpsansLight.woff') format('woff'),
         url('/fonts/SangbleubpsansLight.ttf') format('truetype'),
         url('/fonts/SangbleubpsansLight.svg#SangbleubpsansLight') format('svg');
}


@font-face {
    font-family: 'GothamBook';
    src: url('/fonts/GothamBook.eot');
    src: url('/fonts/GothamBook.eot') format('embedded-opentype'),
         url('/fonts/GothamBook.woff2') format('woff2'),
         url('/fonts/GothamBook.woff') format('woff'),
         url('/fonts/GothamBook.ttf') format('truetype'),
         url('/fonts/GothamBook.svg#GothamBook') format('svg');
}

@font-face {
    font-family: 'GothamBold';
    src: url('/fonts/GothamBold.eot');
    src: url('/fonts/GothamBold.eot') format('embedded-opentype'),
         url('/fonts/GothamBold.woff2') format('woff2'),
         url('/fonts/GothamBold.woff') format('woff'),
         url('/fonts/GothamBold.ttf') format('truetype'),
         url('/fonts/GothamBold.svg#GothamBold') format('svg');
}

.bold {
    font-family: 'GothamBold';
}

.main{
	display: block;
	width:100vw;
	height: 100vh;
	position: fixed;
	top:0;
	left:0;
	-webkit-transition: all 0.6s ease-in-out;
    -moz-transition:all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
    /*opacity:0;*/
}


section:first-child {
	opacity: 1;
}
section{
	height:100vh;
	position: absolute;
	overflow:auto;
    -webkit-overflow-scrolling: touch; 
	width:100%;
	display: block;
	-webkit-transition: all 0.6s ease-in-out;
    -moz-transition:all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
	opacity: 0;
    padding:60px 60px 60px 0;

}

#page-home section {
    padding:0;
}
section>.content {
	width:100%;
    width:calc(100% - 170px);
	height:100%;
    -webkit-transition:all 0.4s ease-in-out;
    -moz-transition:all 0.4s ease-in-out;
    transition:all 0.4s ease-in-out;
    margin-right:0;
    margin-left:auto;

}

#page-home section>.content {
	width:100%;
}

.main.collapse section>.content {
    width:calc(100% - 410px);
    width:calc(100% - 480px);
    -moz-transition-delay:0.4s;
    -webkit-transition-delay:0.4s;
    transition-delay:0.4s;
}

#page-home .main.collapse section>.content {
    width:calc(100% - 350px);
    width:calc(100% - 420px);
    -moz-transition-delay:0.4s;
    -webkit-transition-delay:0.4s;
    transition-delay:0.4s;
}

.container {
	padding: 0;
	width: 100%;
	margin: 0 auto;
	clear: both;
	display: block;
	overflow: auto;
	position: relative;
}

.tb {
	display: table;
}
.tbc {
	display: table-cell;
	vertical-align: middle;
}
.fullHeight {
	height: 100vh;
}
.fullWidth {
    width:100%;
}


.pr20 {
    padding-right:20px;
}

.pr10 {
    padding-right:10px;
}
.mb20 {
    margin-bottom:20px;
}


.clear, * html .clearfix, *:first-child + html .clearfix {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

    .clearfix:after {
        clear: both;
        content: ' ';
        display: block;
        font-size: 0;
        line-height: 0;
        visibility: hidden;
        width: 0;
        height: 0;
    }

*, *:before, *:after
{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
a {
	text-decoration: none;
	cursor: pointer;
	color: #fff;
}
img {
	border: none;
	max-width: 100%;
    display:block;
}
a, img {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}
textarea:focus, input:focus, select:focus {
	outline: none;
}
/* General */
html{
    padding: 0;
    margin: 0;
    background: #ffffff;	
}
body {
    font-family: 'GothamBook';
	font-size: 12px;
	background: #ffffff;
	color: #180a00;
	margin: 0;
	padding: 0;
    position: relative!important;
	overflow: hidden!important;
}

.grid_4 {
    width: calc(33.3333333333% - 33.3333333333px);
 
}
.flex {
    display: flex; width: 100%;
    flex-wrap: wrap;
    gap:30px

}
.title {
    color: #000000;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    font-family: 'GothamBold';
    letter-spacing: 1px;
    display:block;
    padding:15px 0

}
.asp3-2 {
    aspect-ratio: 3/2
}
.btn{
color: #ff4a00;
display:block
}
.news-details{
    text-align:center
}
.g50 {
    width:calc(50% - 20px);
    padding:0 15px
}
.news-details p{
    max-width:560px;
    margin-bottom:15px
}
.mb50 {
    margin-bottom: 50px
}
.h2news{
    max-width:980px;
    letter-spacing:2px;
    margin-left:auto;
    margin-right:auto;
    font-size:36px
}
.pbs {
    padding-top: 20px
}
.img {
    max-width: 100%;
    margin: 0;
    display: block;
}
/* Headings */
h1, h2, h3, h4, h5 {
	margin: 0;
	font-weight: normal;
    font-family: 'SangbleubpsansLight';
    color:#000000;
}
p {
	text-align: left;
    /*letter-spacing:1px;*/
}
h1 {
	font-size: 29px;
    letter-spacing:2px;
}
h2 {
    font-size: 24px;
    font-size: 34px;
    letter-spacing:4px;
    text-align:center;
    color:#ff4a00;

}
h3 {
    font-size:17px;
    letter-spacing:0;
}
h4 {
	font-size: 14px;

}



/* enquiry */
.register {
	max-width: 100%;
	width: 100%;
	margin: 0 auto;
    position:relative;
    display:block;
    /*height:100vh;*/
    overflow:hidden;
}

.register h2 {
    margin-bottom:75px;
}
.formbox {
	    margin: auto;
    display: block;
}
form#portal_enquiry {
    max-width:533px;
    width:calc(100% - 40px);
    margin:auto;
    display:block;
    text-align:center;
}


.footerLogo {
    left: 0;
    right: 0;
    text-align: center;
    margin-top:30px;
}
.footerLogo a {
    display: inline-block;
    margin-right: 40px;
}
.footerLogo a:last-of-type {
    margin-right: 0;
    vertical-align: top;
}
.footerLogo a #svg1 {

	height: 33px;
}
.footerLogo a #svg2 {
  
    height: 33px;
}
.footerLogo a #svg3 {


	    height: 47px;
    transform: translateY(-7px);
	
}



div#enquiry_thankyou {
        display: block;
    text-align: center;

}

p#th {
    text-align: center;
    margin-bottom:40px;
}

div#enquiry_thankyou a {
    color:#180a00;
    text-align:center;
    display:block;
    font-size:12px;
    font-weight:bold;
}
input, select {
    font-size:10px;
    font-family:"EuclidRegular";
    color:#ff4a00;
	margin: 0 auto;
	padding: 5px 10px;
	width: 100%;
	border: 0 none;
	background: transparent;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 0;
	border-bottom: 1px solid #ff4a00;
	text-align: center;
	text-align-last: center;
	letter-spacing: 2px;
    text-transform:uppercase;
    margin-bottom:20px;
}

input.b_submit {
    font-weight: bold;
    /*border: none;*/
    position:relative;
    display:inline-block;
    width:auto;
    margin-bottom:75px;
}


input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus
input:-webkit-autofill {
	-webkit-box-shadow: 0 0 0 30px #ffffff inset;
	-webkit-text-fill-color: #ff4a00!important;
}


select option {
	padding: 7px 5px;
	background: #fff;
	text-align-last: center;
    text-align: center;
    -ms-text-align-last: center;
}

.privacy {
	    font-size: 9px;
    margin:0;
    color:#ff4a00;
    text-align:center;
    font-family:"EuclidRegular";
    line-height:1.5;
}

.privacy b {
    letter-spacing:2px;
}
.chk_holder {
	margin: 10px auto 0 auto;
	color: #fff;
    padding:0 10px;
    text-align:center;
    text-align-last:center;
}
#chkInternational {
	border: 0 none;
	clip: rect(0px, 0px, 0px, 0px);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 13px;
	line-height: 25px;
	width: 20px;
	text-align: center;
}
#chkInternational + label {
	background: url("/images/buttons/uncheck.png") no-repeat left center;
	color: #ff4a00;
	padding: 2px 0 2px 26px;
    background-size: 13px!important;
}
#chkInternational:checked + label {
	background: url(/images/buttons/check.png) no-repeat left center;
}
input:-webkit-input-placeholder, textarea:-webkit-input-placeholder {
color: #ff4a00;
opacity: 1;
}
 input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
color: #ff4a00;
opacity: 1;
}
 input:-moz-placeholder, textarea:-moz-placeholder {
color: #ff4a00;
opacity: 1;
}
 input::-moz-placeholder, textarea::-moz-placeholder {
color: #ff4a00;
opacity: 1;
}
 input:-ms-input-placeholder, textarea:-ms-input-placeholder {
color: #fff;
opacity: 1;
}
 input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {
color: #ff4a00;
}
 input:focus:-moz-placeholder, textarea:focus:-moz-placeholder {
color: #ff4a00;
}
 input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {
color: #ff4a00;
}
 input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder {
color: #ff4a00;
}

/* Token Style */
ul.token-input-list-project {
	border: none;
	width: 100%;
	margin: 0 auto;
	max-width: 100%;
	text-align: center;
	text-align-last: center;
	text-align: -moz-center;
	text-align: -webkit-center;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding: 0;
	clear: both;
}
li.token-input-input-token-project {
	margin: 0;
	padding: 0;
	list-style-type: none;
	width: 100%;

}
ul.token-input-list-project li input {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 100% !important;

}
li.token-input-token-project p {
	display: inline;
	padding: 0;
	margin: 0 5px 0 0;
	font-size: 10px;
    color: #ff4a00;


}
li.token-input-token-project {
	overflow: hidden;
    height: 24px;
    margin: 0;
    padding: 2px 5px;
    color: #ff4a00;
    cursor: default;
    border-bottom: 1px solid #525252;
    font-size: 12px;
    white-space: nowrap;
    list-style: none;
    display: inline-block;
    width: 100%;
    text-align: center;
    text-align-last: center;
    margin-bottom:17px;
}


div.token-input-dropdown-project {
	position: absolute;
	width: 100%;
	overflow-x: hidden;
	cursor: default;
	font-size: 11px;
	z-index: 13;
	color: #ff4a00;
    background:#ffffff;
}
div.token-input-dropdown-project p {
    color:#ff4a00;
}
div.token-input-dropdown-project ul {
	margin: 0;
	padding: 0;
	display: block !important;
	max-height: 205px;
    overflow-y:scroll!important;

}
div.token-input-dropdown-project ul li {
	background-color: #fff;
	font-size: 14px;
	padding: 3px;
	margin: 0;
	list-style-type: none;
	font-weight: 100 !important;
}
div.token-input-dropdown-project ul li.token-input-dropdown-item-project {
	background-color: #fff;

}
div.token-input-dropdown-project ul li.token-input-dropdown-item2-project {
	background-color: #fff;
}
div.token-input-dropdown-project ul li em {
	font-weight: bold;
	font-style: normal;
}
div.token-input-dropdown-project ul li.token-input-selected-dropdown-item-project {
	background-color: #ff4a00;
	color: #fff;
}
/* Parsley-error */
ul.parsley-errors-list.filled, ul.parsley-errors-list {
	font-size: 10px;
	list-style: outside none none;
	margin: 0 auto;
	padding: 0;
	position: relative;
	text-align: center;
	top: 0;
}
ul.parsley-errors-list.filled li, ul.parsley-errors-list li {
	padding:0;
	text-align: center;
	color: #F00D0D;
    POSITION: ABSOLUTE;
    top: -20px;
}


.backImg {
    background-position:center center;
    background-size:cover;
    background-repeat:no-repeat;
}

#nav-toggle {
    position: absolute;
    top: 0;
    bottom:0;
    left: 40px;
    z-index: 10;
    cursor: pointer;
    display: block;
    width: 20px;
    height: 20px;
    margin:auto;
    -webkit-transition:all 0.4s ease-in-out;
    -moz-transition:all 0.4s ease-in-out;
    transition:all 0.4s ease-in-out;

}

#nav-toggle.active {
    transform:translateX(325px);
    transform:translateX(395px);
    -moz-transition-delay:0.4s;
    -webkit-transition-delay:0.4s;
    transition-delay:0.4s;
}

#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {
    cursor: pointer;
    border-radius: 1px;
    height: 2px;
    width: 20px;
    background: #ff4a00;
    position: absolute;
    display: block;
    content: '';
    top: 0;
    bottom:0;
    margin:auto;
    -webkit-transition:all 0.4s ease-in-out;
    -moz-transition:all 0.4s ease-in-out;
    transition:all 0.4s ease-in-out;
    -moz-transition-delay:0.4s;
    -webkit-transition-delay:0.4s;
    transition-delay:0.4s;
}

#nav-toggle span:before {
    top: -15px;

}

#nav-toggle span:after {
    bottom: -15px;
}

#nav-toggle.active span {
    -webkit-transition-delay:0s;
    -moz-transition-delay:0s;
    transition-delay:0s;
    background-color: transparent;
}

#nav-toggle.active span:after, #nav-toggle.active span:before{
    -webkit-transition-delay:0s;
    -moz-transition-delay:0s;
    transition-delay:0s;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);

}

#nav-toggle.active span:before{
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);

}
#nav-toggle.active span:before, #nav-toggle.active span:after {
    top: 0;
    bottom:0;
}


/* Navigation */ 

header {
    position:fixed;
    top:0;
    left:0;
    height:100vh;
    width:170px;
    z-index:9;
    background:#fff;
}

#page-home header {
    background:transparent;
}

.logo {
	position:absolute;
    left:40px;
    top:60px;
    width:107px;
    transition:all 0.4s ease-in-out;
    transition-delay:0.4s;

}
.logo svg {
    width:100%;
}

header.active_nav .logo,header.active_nav  #currentPage {
    transform:translateX(-200px);
    transition-delay:0s;

}

#currentPage {
    position:absolute;
    bottom:60px;
    left:40px;
    font-size:10px;
    font-family: 'GothamBold';
    color:#ff4c00;
    letter-spacing:1px;
    text-transform:uppercase;
    transition:all 0.4s ease-in-out;
    transition-delay:0.4s;
    display:none!important;

}

nav#leftNav {
    display:block;
    position:fixed;
    top:0;
    left:0;
    width:350px;
    width:420px;
    height:100%;
    background:#f3f3f3;
    transition:all 0.4s ease-in-out;
    transform:translateX(-350px);
    transform:translateX(-420px);
    padding-top:60px;
}


#page-home nav#leftNav {
    background:#ffffff;
}

header.active_nav #leftNav {
    transform:none;
    transition-delay:0.4s;
}

.hide {
    opacity:0!important;
}

#sectionContent {
    padding:40px;
    max-height: calc(100vh - 315px);
    overflow:auto;
    transition:all 0.2s ease-in-out;

}


#sectionContent h3 {
    margin-bottom:20px;
    /*text-transform:uppercase;
    letter-spacing:2px;*/
}

#page-location #sectionContent h3 {
    margin-bottom:20px;

}


#sectionContent p {
    line-height:1.3;
}


#sectionContent.map p.bold {
    margin: 5px 0 2px;
}

#sectionContent.map ol {
    padding-left:15px;
}

#sectionContent.map ol li {
    padding-bottom:5px;
}
.moor_logo {
    width:170px;
    display:block;
    position:relative;
    left:40px;
}
.moor_logo svg {
    width:100%;
}


#nav {
    position:absolute;
    bottom:60px;
    left:40px;
    height: 132px;

}
#nav li {
    display:block;
    padding:8px 0;
    padding:5px 0;
}

#nav li a{
    color:#000000;
    font-size:10px;
    text-transform:uppercase;
    font-weight:bold;
    font-family:'GothamBold';
    letter-spacing:1px;
    transition:all 0.2s ease-in-out;

}

#nav li a:hover,
#page-home #nav li a.home, #page-residences #nav li a.residences, #page-location #nav li a.location,
#page-future #nav li a.future, #page-team #nav li a.team, #page-register #nav li a.register {    
    color:#868686;
}


.dotline {
    display:inline-block;
    position:relative;
    top:-8px;
    width:50px;
    height:1px;
    background:#ff4a00;
    margin:auto 15px;

}

.dotline:after, .dotline:before {
    content:'';
    position:absolute;
    width:5px;
    height:5px;
    border-radius:100%;
    border:1px solid #ff4a00;
    background:transparent;
    left:-5px;
    top:0;
    bottom:0;
    margin:auto;
}

.dotline:after {
    left:auto;
    right:-5px;
}


.singleNav {
    position:fixed;
    top:calc(100vh - 50px);
    left:0;
    right:0;
    margin:auto;
    width:200px;
    text-align:center;
    font-size:12px;
    color:#ff4a00;
    text-transform:uppercase;
    letter-spacing:2px;
    font-family: 'SangbleubpsansLight';
    font-family: 'EuclidRegular';
    font-weight:bold;
    z-index:1;
    transform:translateX( calc((170px - 60px) / 2) );
    transition:all 0.4s ease-in-out;
}

#page-home .singleNav {
    transform:none;
}



.slide.singleNav {
    width:calc(100% - 350px);
    width:calc(100% - 420px);
    transform: translateX(120px)!important;
    transition-delay:0.4s;
}

.singleNav:before {
    content:'';
    position:absolute;
    left:0;
    right:0;
    margin:auto;
    top:20px;
    width:5px;
    height:5px;
    border-radius:100%;
    border:1px solid #ff4a00;
    background:transparent;
}
.singleNav:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: 25px;
    height:25px;
    width:1px;
    background:#ff4a00;
}


#top.singleNav {
    top:0;
    padding-top:35px;
}

#top.singleNav:before {
    top:25px;
}

#top.singleNav:after {
    top:0;
}
nav#navRight {
    position: fixed;
    top: 0;
    right: 30px;
    height: 100vh;
    width: 10px;
    /* background: red; */
    z-index: 2;
    display: table;
}

#navRight ul {
    display: table-cell;
    vertical-align: middle;
}

#navRight ul li {
    display: block;
    padding: 25px 0;
    position:relative;
}

#navRight ul li:after {
    content:'';
    position:absolute;
    left:0;
    right:2px;
    margin:auto;
    height:50px;
    width:1px;
    background:#ff4a00;
}


#navRight ul li:last-of-type:after {
    height:0;
}

#navRight ul li a {
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: transparent;
    display: block;
    border: 1px solid #ff4a00;
    transition:all 0.4s ease-in-out;
}

#navRight ul li.active a  {
    background:#ff4a00;
}



.copydeck {
    display:none;

}


.kitchenBtn {
    display:block;
    color:#000000;
    position:relative;
    padding-left:20px;
        margin-bottom: 10px;
}

.kitchenBtn:before {
   content: '';
    position: absolute;
    left: 4px;
    top: 0;
     bottom: 0; 
    margin: auto;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    border: 1px solid #000000;
    background: transparent;
    

}



.kitchenBtn:after {
        content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 16px;
    height: 16px;
    border-radius: 100%;
    border: 1px solid #000000;
    background: transparent;

}


.kitchenBtn.clicked:before {
    background:#000000;
     -webkit-animation: blink 0.2s; /* Safari 4.0 - 8.0 */
    animation: blink 0.2s;
}




@-webkit-keyframes blink {
    from {transform: scale(0)}
    to {transform:scale(1);}
}

/* Standard syntax */
@keyframes blink {
    from {transform: scale(0)}
    to {transform:scale(1);}
}


.relate {
    position:relative;
}



/*#page-future .main.collapse section .tb{
    background-image:url('/images/future/1-points.jpg')!important;
}*/


body.touch .main, body.touch section {
    height:calc(100vh - 20px);
}

body.touch .singleNav {
    top:calc(100vh - 70px);
}

body.touch #currentPage {
    bottom: 75px;
}

/*body.touch #sectionContent{
    max-height: calc(100vh - 350px);
    max-height: calc(100vh - 336px);
}*/



.livingBtn {
    display:block;
    color:#000000;
    position:relative;
    padding-left:50px;
    margin-bottom: 10px;
}

.livingBtn:before {
   content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 25px;
    height: 12px;
    border-radius: 10px;
    border: 1px solid #000000;
    background: transparent;
    

}



.livingBtn:after {
    content: '';
    position: absolute;
    left: 5px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 6px;
    height: 6px;
    transition: all 0.1s ease-in-out;
    border-radius: 100%;
    border: 1px solid #000000;
    background: transparent;

}


.livingBtn.clicked:after {
    background:#000000;
    left:15px;
     
}


.mobile, .imgWrapper, .onlyphone {
    display:none;
}


.futurePoints {
    width:100%;
    display:block;
    position:relative;
}
.futurePoints img {
    width:100%;
}

.points {
    position:absolute;    
    width:18px;
    height:18px;
    color: #ff8e6c;
    font-size: 10px;
    font-family: 'EuclidRegular';
    letter-spacing:1px;
    cursor:pointer;

}







.points:before {
    background:transparent;
    content:'';
    position:absolute;
    width:15px;
    height:15px;
    border:1px solid #ffffff;
    border-radius:100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    cursor:pointer;
    transition:all 0.3s ease-in-out;

}

.points:after {
    background:#ffffff;
    content:'';
    position:absolute;
    width:5px;
    height:5px;
    border-radius:100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    cursor:pointer;
    transition:all 0.3s ease-in-out;
}

.points.bgTang:before {
    border-color:#ff8e6c;
}
.points.bgTang:after {
    background:#ff8e6c;
}


.points span {
    position: absolute;
    top: -200px;
    left: 0;
    right: 0;
    margin-left: -41px;
    display: block;
    width: 100px;
    text-align: center;
    visibility: hidden;
    opacity:0;
    transition: all 0.3s ease-in-out;

}


.points span.visible {
    visibility:visible;
    opacity:1;
}
.points span:after {
    content: '';
    position: absolute;
    top: 40px;
    background: #ff8e6c;
    height: 162px;
    width: 1px;
    left: 0;
    right: 0;
    margin: auto;
}



#moor {
    top: 67%;
    left: 75%;
}

#moor span {
    background-image:url('/images/moor_pointer.png');
    /*background-position: 7px;*/
    height:45px;
    background-size:contain;
    background-repeat:no-repeat;
}

#moor span:after {
    top: 45px;
    height: 157px;
}

#transport {
    top: 83%;
    left: 25%;

}
#plaza {
    top: 54%;
    left: 57%;

}
#drive {
    top: 3%;
    left: 62%;

}

#drive span {
    top:200px;
}
#drive span:after {
    top:-184px;
}

#monashCaulfield, #monashClayton {
    top: 15%;
    right: 2%;
}


#monashCaulfield span, #monashClayton span, #dingley span, #rejuvenation span {
        top: -10px;
    text-align: right;
    width: 120px;
    margin-left: -168px;
}

 #monashClayton {
    top: 29%;
    right: 2%;
}
 #dingley {
     bottom:32%;
    right: 2%;

 }
 #dingley span {
     top:-3px;
 }

 #rejuvenation {
     bottom:24%;
    right: 2%;

 }
#monashCaulfield span:after, #monashClayton span:after, #dingley span:after, #rejuvenation span:after {
        width: 40px;
    height: 1px;
    top: 0;
    bottom: 0;
    left: auto;
    right: -50px;

}

#southland {
    bottom: 1%;
    right: 18%;
}

#southland span {
    width: 180px;
    margin-left: -81px;
}

#beach {
    left: 2%;
    top: 48%;
}
#beach span {
    top: -5px;
    margin-left: 100px;
}
#beach span:after {
    height: 1px;
    width: 64px;
    right: calc(100% + 20px);
    left: auto;
    top: 3px;
    bottom: 0;
}

#page-location #sectionContent p.bold {
    padding:10px 0;
}


.displaysuite_popup {
    display: block;
    position: fixed;
    width: 1020px;
    height: 600px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background: #ff4a00;
    z-index: 999;
    padding: 50px 20px;
    max-width: calc(100% - 40px);
    border: 4px solid #ffffff;
}

.displaysuite_popup_close {
    display: block;
    position: absolute;
    top: 10px;
    right: 20px;
    width: 30px;
    height: 30px;
}

    .displaysuite_popup_close span {
        position: absolute;
        width: 1px;
        height: 100%;
        right: 0;
        left: 0;
        background: #ffffff;
        margin: 0 auto;
        transform: rotate(45deg);
    }

        .displaysuite_popup_close span:first-child {
            transform: rotate(-45deg);
        }

        .displaysuite_popup h4 {
            display: block;
            font-size: 16px;
            color: #ffffff;
            margin-bottom: 40px;
            padding: 0 30px;
        }

.displaysuite_popup h3 {
    display: block;
    font-size: 23px;
    color: #ffffff;
    padding-bottom: 16px;
}

.displaysuite_video {
    position: absolute;
    width: calc(100% - 50px);
    height: calc(100% - 100px);
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: none;
}

.play_video_btn {
    border: 2px solid #ffffff;
    margin: 50px auto 0 auto;
    display: block;
    width: 70px;
    height: 70px;
    border-radius: 100%;
    position: relative;
}

    .play_video_btn span {
        display: block;
        position: absolute;
        top: 50%;
        left: 55%;
        transform: translate(-50%,-50%);
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 15px 0 15px 30px;
        border-color: transparent transparent transparent #ffffff;
    }

.message_holder {
    display: table;
    width: 100%;
    vertical-align: middle;
    text-align: center;
    height: 100%;
}

.middle_content {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    table-layout: fixed;
}

.whatchVideo {
    font-size: 16px;
    border-bottom: 2px solid #ffffff;
    color: #ffffff;
    margin: 20px auto 50px auto;
    display: block;
    width: 127px;
    position: relative;
    font-weight: 600;
}

.displaysuite_video .dv {
    margin: 0 auto;
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
}

.backtowebsite {
    font-size: 16px;
    border-bottom: 2px solid #ffffff;
    color: #ffffff;
    margin: 20px auto 50px auto;
    display: inline-block;
    position: relative;
    font-weight: 600;
}
/*  */
.counterHolder {
    display: block;
    max-width: 100%;
    margin-bottom: 50px;
}

    .counterHolder h3 {
        padding-bottom: 20px;
    }

    .counterHolder > span {
        color: #fff;
        display: inline-block;
        padding: 10px;
        text-align: center;
        width: 80px;
        position: relative;
        font-size: 22px;
    }

        .counterHolder > span::after {
            position: absolute;
            content: '';
            width: 1px;
            height: 60%;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            background: rgba(255,255,255,0.4)
        }

        .counterHolder > span:last-child::after {
            content: none;
        }



@media screen and (max-width:1290px) {
    nav#leftNav {
        width:350px;
    }
    .main.collapse section>.content {
            width: calc(100% - 410px);
    }
    #nav-toggle.active {
        transform: translateX(330px);
    }

@media screen and (max-width:1024px) and (orientation:landscape) {
    #nav li {
        padding:5px 0;
    }

    #nav {
        height:130px;
    }

    #sectionContent {
        padding-top:20px;
        padding-bottom:20px;
    }
}


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

    .futurePoints {
        margin-bottom:40px;
    }
    #page-location .copydeck h3,#page-location .copydeck p {
        display:none;
    }
    #page-location .main section:nth-of-type(2) .copydeck h3 {
        margin-bottom:20px;
    }
    #page-location .main section:nth-of-type(2) .copydeck h3, #page-location .main section:nth-of-type(2) .copydeck p {
        display:block;
    }

    #page-team .copydeck h3 {
        margin-bottom:20px;
    }

    .venobox {
        position:absolute;
        bottom:15px;
        right:15px;
        content:url('/images/buttons/expand.png');
    }

    .mt20 {
        margin-top:20px;
    }
    .mt30 {
        margin-top:30px;
    }
    .mb30 {
        margin-bottom:30px;
    }

    .copydeck h4 {
        margin-bottom:20px;
        letter-spacing: 2px;
    }

    .mobile, .imgWrapper {
        display:block;
    }

    .imgWrapper {
        position:relative;
        /*margin-bottom:40px;*/
    }
    .copydeck {
        display:block;
    }

    .desktop {
        display:none!important;
    }
    .main.collapse section>.content {
        width:100%!important;
    }
    
    nav#leftNav {
        width:100%;
        transform:translateX(-100%);
    }
    #nav-toggle.active {
        transform:none;
    }
    header {
        width:100%;
        height:100px;
    }
    #currentPage, .singleNav, nav#navRight, #sectionContent {
        display:none!important;
    }
    .logo {
        left: 40px;
        top: 0;
        bottom: 0;
        margin: auto;
        height: 22px;
    }
    #nav-toggle {
        right:40px;
        bottom: 0;
        left: auto;
        margin: auto;
    }
    body {
        overflow:scroll!important;
    }
    .main {
        height:auto!important;
        position:relative;
        transform:none!important;
        padding-top: 100px;
    }

    #page-home .main {
        padding-top:0;
    }
    section {
        position:relative!important;
        top:auto!important;
        height:auto!important;
        padding:0 40px 40px!important;
        padding:0 40px 30px!important;

    }

    #page-home section {
        height:calc(100vh)!important;
        padding:0!important;
    }

    section>.content {
        width:100%;
    }
    #page-residences section>.content, #page-location section>.content, #page-future section>.content,
    #page-team section>.content, #page-future .main.collapse section .tb {
        background:initial!important;
    }
}


@media screen and (max-width:760px) and (orientation: landscape) {
    #page-home .copydeck {
        margin-top:20px!important;
    }
}

@media screen and (max-width: 760px) {
    .displaysuite_popup h4 {
        font-size: 12px;
        padding: 0;
    }
    .counterHolder > span {
        width: 68px;
        font-size: 18px;
    }
    .displaysuite_popup h3 {
        font-size: 18px;
    }
        #nav li a {
        font-size:12px;
    }
    .points span {
        top:-60px;
    }

    .points span:after {
        top: 32px;
        height: 30px;
    }

    #moor span:after {
        top: 45px;
        height: 18px;
    }


    #drive span {
        top: 50px;
    }
    #drive span:after {
        top: -35px;
    }


    .onlyphone {
        display:block;
    }

    .futurePoints {
        /*display:none;*/
    }
    section {
        padding:0 15px 30px!important
    }
    #page-home section:first-of-type>.content {
        /*background-image:url('/images/home/1-mob.jpg')!important;*/
    }

    #page-home section:nth-of-type(2)>.content {
        background-image:url('/images/home/2-mob.jpg')!important;
    }

    #page-home section:last-of-type>.content {
        background-image:url('/images/home/3-mob.jpg')!important;
    }

    header {
        height:65px;
        border-bottom:1px solid #f3f3f3;
    }
    #page-home header {
        border:none;
    }
    #nav-toggle {
        right:20px;
    }
    .logo {
        left:20px;
        transform:none!important;
    }
    h2 {
        font-size:18px;
    }
    .g50,grid_4{
        width:100%;
    }
}