@charset "UTF-8";
/* CSS Document */

* {
	box-sizing: border-box;
}

/*Alwyn New Rounded Regular

font-family: alwyn-new-rounded-web, sans-serif;

font-weight: 400;

font-style: normal;


Alwyn New Rounded Bold

font-family: alwyn-new-rounded-web, sans-serif;

font-weight: 700;

font-style: normal;


Alwyn New Rounded Light

font-family: alwyn-new-rounded-web, sans-serif;

font-weight: 300;

font-style: normal;


Alwyn New Rounded Medium

font-family: alwyn-new-rounded-web, sans-serif;

font-weight: 600;

font-style: normal;
*/
html {
	background: #fff;
	color:#666;
	font-family:"Glegoo", "Times New Roman", "serif";
	   letter-spacing: 0.05em;
    font-weight: 700;
    line-height: 1.25;
    color:var(--color-brown-deep);
}
* {
}

:root {
    --color-blue: #557585;
    --color-brown-deep: #2c2721;
    --color-brown-light: #b0996e;
    --color-bg: #E7E5E5;
}
a {
	color:var(--color-brown-deep);
}
h1,h2,h3,h4,h5,h6 {
    line-height: 1;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    line-height: 1.25;
}
.wrap{
	padding:0 1em;
	margin:auto;
    max-width:64em;
}
@media screen and (min-width: 48em) {
.wrap{
	padding:0 2em;
	margin:auto;
}
}
body {
	margin:0;
}


.container {
	padding-top:4em;
    overflow: hidden;
}
@media screen and (min-width: 48em) {
	.container {
	margin:auto;		
    padding-top: 4em;
}
	
}
.popup-container {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	overflow: hidden;
	
	width:100%;
	height:100%;
	
	background-color:#ebe7e1;
	
	opacity: 0;
	display: none;
	z-index: 999;
}
.popup {
	position: absolute;
	top:50%;
	left:50%;
	width:95%;
	height:80%;
	background-color:rgba(255,255,255,1);
	transform:translate(-50%,-50%);
    max-height: 44em;
    max-width: 48em;
	opacity: 0;
}
.popup .wrap {
	padding:0.5em 1em;
	width:100%;
	height:100%;
overflow-y: auto;
	max-width: 100%;
}
.popup p {
    font-size: 75%;
 
    line-height: 1.75;
	
}

.popup .close {
	position: absolute;
    top: -1.75em;
    right: -0.75em;
	padding:0.5em;
	
    font-size: 200%;
	cursor: pointer;
}

section.cover .wrap>.bg,
section.cover .img,
section.cover .slogan h2,
section.cover .enquiry hgroup,
section.cover .enquiry p,
section.cover .action .brochure,
section.cover .action .vr,
section.enquiry,
section.gallery,
section.disclaimer,
section.map,
nav,
header,
footer .csv,
footer .tam-nwd,
footer .date,
footer .disclaimer{ 
	opacity: 0;
}

header  {
	background-color:var(--color-brown-deep);
	position: fixed;
	top:0;
	left:0;
	width:100%;
	z-index: 3;
}


header .wrap {
	padding:0;
}
nav hgroup h2,
header hgroup h1{ 

    text-transform: uppercase;
    font-weight: 300; 
    white-space: nowrap;
    line-height: 1;
    text-indent:-99999em;
    text-align: center;
    margin: 0.5em auto; 
    background-image: url("images/logo_light.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width:6em;
    height:1em;
}


@media screen and (min-width: 48em) {
    
nav hgroup h2,
header hgroup h1{
    
    height: 1.2em;    }
}


nav hgroup h2 {
    display: none;
}
header .toggle {
	
    opacity: 1;
    font-size: 250%;
    color: var(--color-brown-light);
    padding: 0.3em  0.3em;
	cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
}

@media screen and (min-width: 48em) {
    
header .toggle {
    
    padding: 0.44em  0.7em;
    }
}
nav {

    background-color: #ebe7e1;
    top: 4em;
    left: 0;
	width:100%;
    position: fixed;
    box-shadow: 0 0 1em #9e8b7e;
	z-index: 2;
	transition-duration: 0.5s;
	transition-timing-function: ease-out;
	background-color:var(--color-brown-deep);
}


nav .wrap {
    padding:0;
}
nav {
	left:-110%
}
nav.active {
	  left:0;
}

nav ul,
nav li{
margin:0;
	padding:0;
	list-style: none;
}
 nav {
	padding: 0.5em 0;
}
nav .main li  {
}nav li>span,
 nav li>a{
color:var(--color-brown-light);
    font-size: 125%;
    text-decoration: none;
    padding: 0.5em 1em;
    display: block;
     cursor: pointer;
     
} 
 nav li>a:hover
{
    
}
nav .submenu li>a {
    position: relative;
    padding-left:2em;
}

nav .submenu li>a:before{
    content: ">";
    position: absolute;

    left: 1em;
    top: 0.5em;
}

nav .submenu p {
    
color:#666;
    padding:0 1.4em;
    font-size:87.5%;
}
nav .lang  {
   padding: 0.25em 0.8em;
}
nav .lang li{
	display: inline-block;
}

nav .lang li a{
	font-size:100%;
    padding: 1em 0.5em;
	display: inline-block;
}

nav .audio {

    position: absolute;
    bottom: 0;
    right: 0;
    padding: 0.5em 0;
}
main {
	z-index: 1;
	position: relative;
}



    
@media screen and (min-width: 48em) { 
	nav {
    top: 0;
    left: 0;
    box-shadow: none;
    right: 0;
		width:100%;
		padding:0;
         
    display: block;
	}

	nav .wrap {
        display: table;
        width:100%; 
        position: relative;
    padding: 0 1.5em;
    }
	
	nav  ul {
		
    display: table-cell;
    vertical-align: middle;
		padding:0 ;
        height:4em;width:40%;
	}
    nav hgroup {
        width:20%; 
    }
	nav ul.main {
		text-align: left;
	}
		
	nav ul.nwd {
		text-align: right;
		padding:0;
	}
	nav  ul li {
		display: inline-block;
        position: relative;
	}
	
	nav ul li>span,
	nav ul li>a {
		font-size:100%;
		
    padding: 1.5em 0.5em;
		display: inline-block;
	}
    
    nav .submenu {
        position: absolute;
        top:4.2em;
        left:-1em;
        background:var(--color-brown-deep);
        min-width:20em;
        display: none;padding-bottom: 1em;
    }
    nav li:hover .submenu {
        display: block;
    }
    nav .submenu li a:before {
      left:1.5em;
    }
    
    
    nav .submenu li  {
        display: block;
    }
    nav .submenu li a {
        display:block;
    padding: 0.5em 1.5em 0.5em 2.5em;
    }
    
    nav .submenu p {
        
    padding: 0 2em 1em 2em;
        
    font-size: 75%;
    }
    nav hgroup{
        
    display: table-cell;
    vertical-align: middle;
		padding:0 ;
        height:4em;
    }
nav .audio {

    position:static;
    bottom: auto;
    right: auto;
    padding: 0;
}
    
nav .audio a {
    padding: 0 0.5em;
    vertical-align: middle;
    }
    
    /*
    nav hgroup h2 {
        position: absolute;
        top:0;
        left:50%;  
    transform: translateX(-50%);

    }	*/
    nav hgroup h2 {
        display: block;
    }

}

@media screen and (min-width: 64em) {
    nav {
        width:auto;
        padding:0;
    }
      nav .wrap { 
    }
}

.map {
	margin-top:0em;
	position: relative;
	z-index: 3;
}

@media screen and (min-width: 48em) {
.map .wrap {
	
		padding:0 2em;
   
}
}
.map .google-map {
    position: relative;
    padding-bottom: 125%;	  overflow: hidden;
  /* box-shadow: 0.15em 0.3em 0.9em #ccd5da;*/
}
.map .google-map>div {
 
    overflow: hidden;
}
 
.uwide .map .google-map {
	padding-bottom:50%;
}
.sq .map .google-map {
    
	padding-bottom:70%;
}
.hor .map .google-map {
	padding-bottom:50%;
}


.hor .map .google-map,
.sq .map .google-map {
	padding-bottom:60%;
}


footer figure {
    margin: 0;
    padding: 0;
}

footer figure img {
    width:100%;
    object-fit:contain;
    height:4em;
}
footer figure img {

}
footer figure {
    margin:2em auto;
}
footer figure img {
    display:block;
    width:100%;
    max-width:24em;
}


footer figure.csv img {
    object-position: left;
}
footer figure.tam-nwd img {
    object-position: right;
}

footer .date {
    font-size:87.5%;
    margin:2em 0;
    text-align: center;
    clear:both;
}
@media screen and (min-width: 48em) {
     
    footer figure.csv {
        float:left;
    }
    footer figure.tam-nwd {
        float:right;
    }
}

.disclaimer {
    margin:2em 0 0 0;
}
.disclaimer p {
    width:200%;
    font-size:87.5%;
    transform:scale(0.5);
    transform-origin:  top left;
    margin: 0;
}

.cover {
    position: relative;
    margin-bottom:1em;
}
.cover  * {
    position: relative;
    z-index: 2;
}

.cover .wrap {
    padding: 0 0 2em 0;
    position:static;
}
.cover .wrap>.bg {
position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color: var(--color-bg);
    z-index: 1;
    opacity: 0.6;
}
@media screen and (min-width:64em) {
    .cover .wrap>.bg {
    }
}
.cover .img {
    margin: 0;
    z-index: 3;
    position: relative;
    width:100%;
    padding-bottom: 150%;
}

.cover .img img {
    width:100%;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    object-fit: cover;
    width:100%;
    height: 100%;
    opacity: 0;
    animation: slideShow 10s linear infinite 0s;

}

.cover .img img.day {
    z-index: 1;
}
.cover .img img.night {
  
    z-index: 2; animation-delay: 5s;
}

@keyframes 
slideShow {
0% {
 opacity: 0;
	
}
 10% {
 opacity: 1;
}
50% {
 opacity: 1;
}
60% {
opacity: 0;

}
100% {
 opacity: 0;
}
}

.cover .info {
   position:static;
}
.slogan {
    margin:2em 0;
    z-index: 2;
}
.slogan h2 {
    margin:0em 0.5em;
    font-size:190%; 
}
/*
.slogan h2:nth-child(3) {
    margin-top:1em;
}
.slogan h2:nth-child(n+3) {
    font-size:150%;
    display: inline-block;
}*/
.action {
    margin:2em auto;
}

.action .item {
    display:inline-block;
    vertical-align: top;
    margin:0.4em 0.4em 0.4em 0;
}

.action a {
    text-decoration: none;
    display: block;
    position:relative;
    text-align: center;
    width:6em;
    height:9em;
    
}

.action .bg{
    position: absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
    background:var(--color-brown-deep);
    opacity: 0.2;
    transition-duration: 0.4s;
    transition-timing-function: ease-out; 
}

.action a:hover .bg {
    opacity: 0.3;
}
.action .icon{
    display: inline-block;
    padding: 0.8em 0.4em 0.4em 0.4em;
    text-align: center;
    font-size: 200%;
}
.action .txt {
    display: block;
    margin: auto;
    max-width:6em;
    font-size:100%;
    
}
.enquiry {
    display: table;
    z-index: 4; 
}
.enquiry hgroup {
    background-color: var(--color-brown-deep);
    display: table-cell;
    vertical-align: middle;
    padding: 0.8em 0.8em 0.8em 1em;
    height: 10em;
    text-align: center;
    font-size:100%;
}
.enquiry h2:first-child {
    color:var(--color-brown-light);
    text-transform: uppercase;

    letter-spacing: 0.13em;
    margin: 0.2em 0;
    font-size: 150%;
}

.enquiry h2:last-child {
    color:var(--color-brown-light);
    text-transform: uppercase;
 
    margin: 0.2em 0;
    font-size: 150%;
}

.enquiry .desc {
    padding-left:1em;
        display: table-cell;
    vertical-align: middle;
width:100%;
    padding-top: 0em;
}

.enquiry .desc P {
    margin:0.5em 0;
    position: relative;
    padding-left: 2em;
    font-size:90%;
}
/*
.enquiry .desc .title {
    display:  block;
  
}*/

.enquiry .desc .title {
}
.enquiry .desc a {
    text-decoration: none;
    display: inline-block;
    
    word-break: break-all; 
}

.enquiry .desc .material-icons {
vertical-align: middle;
    margin-right:0.2em;
    color:var(--color-brown-deep);
    position: absolute;
    top:0;
    left:0;
}

@media screen and (min-width:48em) {
    .cover .wrap>.bg {

    }
    
    .cover .wrap {
        padding: 0 1em 0 0;
    }
    .cover .img {
        display:table-cell;
        width:50%;
        vertical-align: middle;
        
    padding-bottom: 75%;
    }
    .cover .info {
        
        display:table-cell;
        width:50%;
        vertical-align: middle;
        padding:2em 0;
        padding-left:2em;
    }
    
    .cover .slogan h2 {
    margin: 0em;
    }/*
    .slogan h2:nth-child(n+3) {
    font-size:150%;
}*/
    .cover .enquiry {
    margin: 2em 0;
    }
    .cover .enquiry hgroup {
        font-size:80%;
    }
    .cover .enquiry {
        margin-left:-4em;
    }
}


    
@media screen and (min-width:64em) {
    
    .cover .slogan {
    margin: 3em 0;
    }
    
    .cover .slogan h2 {
        font-size:250%;
    }
    
    /*
    .slogan h2:nth-child(n+3) {
    font-size:150%;
}*/
    .cover .enquiry {
        font-size:120%;
    margin: 3em 0 4em -4em;
    }
        .cover .enquiry hgroup {
        font-size:90%;
    }
}
.gallery {
    position: relative;

    margin: 2em 0 5em 0;
}
.gallery .flexslider {
    padding: 0;
    margin: 0;
    background: none;
    border:0;
    margin-bottom:4em;
}

.gallery .flexslider .slides {
     
    overflow: hidden;
}
.gallery .flex-nav-next a::before,
.gallery .flex-nav-prev a::before {
    content:'';
}

.gallery .slogan {
    position: absolute;
    bottom:1em;
    right:1em;
    color:#fff;
    font-weight: bold;
    font-size:200%;
    z-index: 2;
    text-align: right;
}

.gallery .slides li {
    padding-bottom: 66%; 
}
.gallery .slides img {
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
height:100%;
    object-fit: cover;
    background: var(--color-bg); 
}

.gallery .slides figcaption {
    z-index: 1;
    position:absolute;
    font-size:87.5%;
    bottom:1em;
    left:50%;
    transform:translateX(-50%);
    background-color: var(--color-bg);
    color:var(--color-brown-deep);
    font-weight: bold;
    padding: 0.4em 0.8em; 
    border-radius: 1em;
    text-align: center;
}

.gallery .slides .disclaimer {
    position:absolute;
    z-index:1;
    background-color:rgba(0,0,0,0.4);
    color:#fff;
    padding:0.8em;
    font-size:50%;
    width:200%;
    transform: scale(0.5);
    bottom: 0;
    left: 0;
    transform-origin: bottom left; 
    display: none;
}

@media screen and (min-width:48em) {
    .gallery .slides .disclaimer {
    font-size:75%;
    width:150%;
    transform: scale(0.6666666); 
}
}
.gallery .flex-direction-nav a {
    font-size:200%;
    text-shadow: none;
    cursor:pointer;
    width:auto;
    height:auto;
    border-radius: 100%;
    background-color: var(--color-bg);
    color:var(--color-brown-deep);
}
@media screen and (max-width:767px) {
    .flexslider:hover .flex-direction-nav .flex-next {
        right:0.5em!important;
    }
    .flexslider:hover .flex-direction-nav .flex-prev {
        left:0.5em!important;
    }
}
.gallery .flex-direction-nav a:hover {
    transition-duration: 0.2s;
    transform:scale(1.2);
}
.gallery .flex-control-nav li {
    vertical-align: middle; 
}
.gallery .flex-control-paging li a {
    width:0.8em;
    height:0.8em;
    transition-duration: 0s;
    background-color:var(--color-bg);
   box-shadow:none;
    cursor:pointer;
}

.gallery .flex-control-paging li a:hover {
    transform:scale(1.2);
    background-color:var(--color-brown-deep);
    opacity: 0.5;
}


.gallery .flex-control-paging li a.flex-active {
        width:1em;
    height:1em;
    background-color:var(--color-brown-light);
}

.gallery h3 {

    font-size: 170%;
    margin: 0 0 1em 0;
    color: var(--color-brown-light);
    text-transform: uppercase;
}
.gallery.carpark h3:last-of-type {display: none;}



.gallery.interior .slides img,
.gallery.carpark .slides img {
    object-fit: contain;
}
@media screen and (min-width:48em) {

.gallery.interior .wrap,
.gallery.carpark .wrap{
    display: table;
    width:100%;
}


.gallery.interior .wrap h3,
.gallery.carpark .wrap h3{
    width:40%;
    display:table-cell;
    vertical-align: middle;
    text-align: center;
}
    
    
.gallery.interior .wrap .flexslider,
.gallery.carpark .wrap .flexslider{
    width:60%;
    display:table-cell;
    vertical-align: middle;
}
.gallery.carpark h3:last-of-type {display: table-cell;}
    
.gallery.carpark h3:first-of-type {display: none;}
}

.cms iframe {
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%;
    border:0;
}


.mask {
    position: fixed;
    z-index: 99;
    
	top:0;
	left:0;
	right:0;
	bottom:0;
    width:100%;
    height: 100%;
    background:#ebe7e1;
    opacity: 0.9;
}

.popup.vr {
    z-index: 100;
    opacity: 1;
    max-width: 100%;
    max-height: 100%;
    position: fixed;
}

.popup.vr .wrap {
    padding: 0;
}

.popup.vr iframe {
    border:0;
}

.popup.vr ul {
    margin: 0;
    padding: 0;
    position: absolute;

    bottom: 100%;
    left: -0.5em;
}
.popup.vr li {
    color:#557585;
    list-style: none;
    
    padding: 0.4em 0.4em;
    display: inline-block;
    cursor:pointer;
    transition-duration: 0.2s;
    transition-timing-function:ease-out;
}
.popup.vr li.active {
    color:#666;
    font-size:150%;
}

.popup.vr li:hover {
    font-size:125%;
}

body.vr iframe {
    position: fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height: 100%;
    border:0;
}