@charset 'utf-8';
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900);
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,
ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td
{
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	outline: none;
}
html,body { 
	height:100%;
	background-color:#c3efd2; 
	background-image: url('../images/main_BG_green.png');
	background-size: cover;
	min-width: 320px;
	min-height: 750px;
	position: relative;
}
a { text-decoration:none;color:white; border:0px;}
a:hover{color:#ffffff;}
/* FONT TYPE (DO NOT ADD OUT OF THIS SECTION) */
.ie8 body{font-family:inherit!important;}
body{ font-family: 'Roboto', "Microsoft JhengHei", "Apple LiGothic Medium", "Apple LiGothic Medium", "Lucida Grande", "Lucida Sans Unicode", Helvetica ,'Trebuchet MS';}
.zh-hk{font-family:"PingFang TC", 'Noto Sans', "Microsoft JhengHei", "Apple LiGothic Medium", "Apple LiGothic Medium", "Lucida Grande", "Lucida Sans Unicode", Helvetica;}
.zh-cn{font-family:"PingFang SC", 'Noto Sans SC', "Microsoft YaHei", "Source Han Sans SC", "WenQuanYi Zen Hei", 'Noto Sans',"Apple LiGothic Medium","Apple LiGothic Medium","Lucida Grande", "Lucida Sans Unicode", Helvetica;}

ul.sitelastmodified{
	text-align: left;
}

 a > img {border:0px !important;}
 @keyframes animatedBackground {
 from { background-position: center 0, center -2432px; }
 to { background-position: center 2432px, center 0; }
}
.overall {
	margin:auto;
	min-width:1024px;
	height:100%;
	width:100%;
	position:relative;
}
.slide1-wrapper{
	height: 100vh;
	min-height: 750px;
}
#floater { float:left; height:50%; margin-bottom:-375px; width:1px; /* only for IE7 */ }
#container { background-position: center center; background-size:cover; clear:both;max-width:1440px; margin:auto auto;width:100%;  height: calc(100% - 300px);min-height: 490px;}
.zh-cn #container,.zh-hk #container {height: calc(100% - 437px);}
#container > div { -webkit-transition: all 1s ease; -moz-transition: all 1s ease;-o-transition: all 1s ease; transition: all 1s ease; }
.upward { moz-transform: translateY(-750px); -webkit-transform: translateY(-750px); -o-transform: translateY(-750px); -ms-transform: translateY(-750px); transform: translateY(-750px); }
.intro-landing { background-image:url("../images/intro_landing.jpg"); background-position: center center; background-size:cover; clear:both; height:100%; width:100%; cursor:pointer; }
.intro-landing span { display:block; width:100%; height:100% }
.intro-page { 
	backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
	clear:both; 
	height:96%; 
	width:100%;
	margin:0px;
	min-height: 200px;
}
.landing-banner{width:1024px;}
.mobile{display:none;}
/* Content Page */
.top-header-m { height:auto; display:block;width:100%;margin:auto; position: relative;}
.top-header { height:auto; display:block;width:1024px;margin:auto; }
.top-header { height:160px;    width: 1024px;} /* mountregency */
.top-header > ul { margin:0; display:table; width:100%; }
.top-header > ul > li { list-style:none outside none; display:table-cell; float:left;}
.header-nav { line-height:10px; float:left; width:670px;margin:56px 0px 4px 20px;}
.zh-hk .header-nav , .zh-cn .header-nav {margin-top:90px;margin-bottom:9px;}
.header-nav  li{color:#000;  }

.header-nav ul { margin:0px; }
.zh-cn .header-nav ul, .zh-hk .header-nav ul{ font-size:14px; }
.header-nav ul li { display:block; padding:3px 0px 0px 0px; float:left; list-style:none-outside none;margin:2px 14px;font-size:16px;}
.zh-cn .header-nav ul li, .zh-hk .header-nav ul li { display:block; padding:3px 10px; border-right:1px #45626a solid; float:left; lsit-style:none-outside none; margin:0;font-weight: bold;font-size:20px;}

.header-nav ul li:last-child { border:0;color:#000; }
.header-nav ul li a, .header-nav ul li a:link, .header-nav ul li a:visited { 
	color:black; 
	text-decoration:none;
	line-height: 1.3;
}
.header-nav ul li a:hover, .header-nav ul li a.current {color:white; font-weight:normal;}
.header-logo {
	width: 280px;
	float: left !important;
	margin-top: 0px;
	padding: 20px 0px 5px 0px;
	margin-left: auto;
	margin-right: auto;
}
/*.header-logo > a > img{width:100%;}*/
.header-nav ul li a:link, .header-nav ul li a:visited { 
	color:#926c51; 
	text-shadow: 0 0 3px rgba(255, 255, 255, 1);
	text-decoration:none;
}
.header-nav ul li.active > a{text-decoration:underline;}
.header-nav ul li a:hover{color:#2c5e3b;text-decoration: underline;}
.header-nav ul li.active > a{
	color:#2c5e3b;
	text-shadow: 0 0 15px rgba(255, 255, 255, 0.5),
	text-shadow: 0 0 15px rgba(255, 255, 255, 0.5),
	text-shadow: 0 0 15px rgba(255, 255, 255, 0.5);
	text-decoration: none;
}
.main-content {
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6e0ff', endColorstr='#80f7f9ff',GradientType=0 ); 
	/* backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px); */
	height: 100%; 
	min-height:400px;
	margin: 0px auto; 
	opacity:0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease;-o-transition: all 1s ease; 
	transition: all 1s ease; 
	overflow:auto;
}

@media screen and (max-width: 1024px) {
	.intro-page {
		width:95%;
		margin: 0 auto;
	}
	.main-content {
		padding: 20px;
	}
}

.active { opacity:1; }
.content-close { position:absolute; right:20px; top:70px; z-index:10 }
.content-close img { cursor: pointer;width:20px;height:20px; }
.content-body { position:relative; padding:30px 45px 30px 45px;; display:block; z-index:5; }
.content-body h1 { color:#2c5e3b; font-size:24px; margin-bottom:0.8em; display:block; clear:both;font-weight:500; }
.content-body h2 { font-size:15px; margin-bottom:20px; }
.content-body h2 a,.content-body h2 a:link,.content-body h2 a:visited { color:black; text-decoration:underline; }
.content-body h2 a:hover { color:#f6aa00; }
.normal { text-transform: normal }
.zh-hk .content-body p ,.zh-cn .content-body p{ font-size:15px; line-height: 1.5em; margin-top:0px; }
 .content-body p { font-size:16px; margin-top:7px; line-height: 1.5em}
.content-body a, .content-body a:link, .content-body a.visited { color:#45626a; text-decoration:none; }
.content-body a:hover { color:black; }

.rhs { float:right; position:relative; z-index:10 ;width:380px;}
.rhs > p{margin-top:0px;}
.sales-brochure p { width:460px; }

.home_page{position:absolute;width:1024px;height:100%;width:100%;left:0px;top:0px;background-color:#fff;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";background-color: rgba(0,0,0,0.8);z-index:1000;}
.home_page .custom {background:#fff; color: black;
    line-height: 22px;
    font-size: 16px;
    margin:70px auto 0;
	width:90%;
    text-align: justify;
    padding: 30px 5%;
}
.home_page .custom p{font-size:16px;}
.home_page .content-body p{font-size:16px; margin-top:0px;line-height:17px;padding-bottom:5px;}
.home_page .content-body .en p{line-height:1.5em;}
/*footer */
.footer-m{width:100%;margin:auto;position:absolute;bottom:0px;z-index:2;height:185px; background-color:#fff;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; background-color:rgba(255,255,255,0.9);

    color: white;
		background-size: contain;
}
.footer {
	padding-top:13px ;
	padding-top: 10px;
	padding-bottom: 10px;
	background-size: contain;
}
.zh.footer { background-color:#fff; width:984px;padding:19px 20px; margin:auto;}
.footer  .description{font-size:12px;float:left;width:650px;}

@media screen and (max-width: 1024px) {
	.footer{
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
	}
}

#flax-footer-description {font-size: 12px;margin-bottom:10px}
.zh-hk  .footer  .description , .zh-cn .footer  .description{font-size:12px;float:left;}
.zh-cn .footer  .description{font-size:12px;float:left; line-height:normal;}
.footer div.footer-menu{font-weight:bold;float:left; display:block;width:auto;margin:10px auto;margin-right:0px;padding-top:3px;}
.zh-hk .footer  div.footer-menu{float:left; display:block;width:736px;margin-right:0px;padding-top:0px;}
.zh-cn .footer  div.footer-menu{float:left; display:block;width:736px;margin-right:0px;padding-top:0px;}

.mod-languages{display:inline-block;;margin-top:4px;height:24px;}
.lang-inline{display:inline-block;}
.mod-languages > .lang-inline > li{line-height:10px;font-weight:400;font-size:18px;float:left;list-style-type:none;display:block; padding:0 8px; border-right:1px #ffffff solid; float:left; list-style:none-outside none;}
.mod-languages > .lang-inline > li:nth-child(2), .mod-languages > .lang-inline > li:nth-child(3){font-weight:400;}
.mod-languages > .lang-inline > li:last-child { border:0;padding-right:0; }
.mod-languages > .lang-inline > li a:hover, .header-nav ul li a.current {color:#ffffff;}
.zh-hk .mod-languages > .lang-inline > li{font-weight:bold;font-size:15px;float:left;list-style-type:none;display:block; padding:0 8px; border-right:1px #ffffff solid; float:left; list-style:none-outside none;}
.zh-hk .mod-languages > .lang-inline > li:last-child { border:0;padding-right:0; }
.zh-hk .mod-languages > .lang-inline > li a:hover, .header-nav ul li a.current {color:#000; font-weight:bold;}
.zh-cn .mod-languages > .lang-inline > li{font-weight:bold;font-size:15px;float:left;list-style-type:none;display:block; padding:0 8px; border-right:1px #ffffff solid; float:left; list-style:none-outside none;}
.zh-cn .mod-languages > .lang-inline > li:last-child { border:0;padding-right:0; }
.zh-cn .mod-languages > .lang-inline > li a:hover, .header-nav ul li a.current {color:#000; font-weight:bold;}
.mod-languages .lang-inline li:first-child{padding-left:0}
.mod-languages > .lang-inline > li {padding:0 18px;}
.mod-languages > .lang-inline > li:last-child {border: 0;padding-right: 18px;}
.zh-cn .mod-languages > .lang-inline > li {padding:0 18px;}
.zh-cn .mod-languages > .lang-inline > li:last-child {border: 0;padding-right: 18px;}
.zh-hk .mod-languages > .lang-inline > li {padding:0 18px;}
.zh-hk .mod-languages > .lang-inline > li:last-child {border: 0;padding-right: 18px;}
#container > div > div.footer > div:nth-child(1) > div > ul > li:nth-child(3) {padding-right:0;}
.district , .street , .website , .enquiry{padding:0 7px;font-size:13px;  /*display: inline-block!important;*/}
.footer-lang-button a {
    color: white;
}
.footer-lang-button {
    margin-right: 108px;
}
.web-link{font-size:15px;margin-top:4px;}
.zh-hk .web-link , .zh-cn .web-link{margin-top:0px;}
.web-link > .custom{line-height:12px;overflow:hidden;}
.zh-hk .web-link > .custom , .zh-cn .web-link > .custom{line-height:normal;overflow:hidden;}
.web-link > .custom > p > a{font-weight:bold;}
.web-link a:hover{color:#000;}
.zh-hk .district ,.zh-hk  .street ,.zh-hk  .disclaimers ,.zh-hk  .website ,.zh-hk  .enquiry{padding:0 5px;font-weight:100;font-size:15.5px;font-weight:bold;  display: inline-block;}
.zh-cn .district ,.zh-cn .street ,.zh-cn .disclaimers ,.zh-cn .website ,.zh-cn .enquiry{  display: inline-block!important;padding:0 5px;font-weight:bold;font-size:15.5px; }
.zh-hk .website , .zh-cn .website{padding-left:0px;}
.footer-menu div:first-child, .footer-menu div:nth-child(4){padding-left:0;}
.district  {margin-top:8px;}
.district  , .website {padding-left:0px; font-weight: bold;font-size: 14px;}
.website{margin-bottom:8px;}
.disclaimers{
	line-height: 1em;
	padding-left:0px;margin-top:5px;margin-bottom:6px;text-decoration: underline;
	font-size: 14px;
	font-weight: bold;
}
.zh-hk .disclaimers , .zh-cn .disclaimers{margin-bottom:20px;}
.zh-hk .disclaimers , .zh-cn .disclaimers{margin-top:82px;}
.disclaimers > a{text-decoration:underline;font-size:14px;padding-left:0px;font-weight:bold;}
.disclaimers > a:hover{color:#ffffff;}
.lang-active > a{color:white; padding: 3.5px 0;background-repeat: no-repeat;background-position: bottom;}
a.active{color:white;}
.sunhungkai-logo{width:180px;margin-top:30px;}
@media screen and (min-width:1024px){.sunhungkai-logo{margin-top: 10px;}}
.copyright{font-size:12px;margin-top:0.5rem;float:left;padding-right:5px;border-right:1px black solid;}
.zh-hk .sunhungkai-logo{width:200px;margin-top:10px;margin-left: 10px;float:right;}
.zh-hk .copyright , .zh-cn .copyright{font-size:12px;margin-top:5px;float:left;padding-right:5px;border-right:1px black solid;}
.link-copyright{font-size:12px;margin-top:5px;padding-left:5px;display:inline-block;}
.link-copyright > a{text-decoration: underline;}
.link-copyright > a:hover{color:black;}
.zh-hk .link-copyright , .zh-cn .link-copyright{font-size:12px;margin-top:5px;padding-left:5px;display:inline-block;text-decoration: underline;}
.last-update{  float: right;font-size: 12.4px;margin-top: 5px;padding-left: 5px;display: inline-block;}
.zh-hk .last-update , .zh-cn .last-update{font-size:13.5px;}
.home_page > .content-body{padding:30px 20px 0 20px;}
.zh-hk .footer > div > p.description , .zh-cn .footer > div > p.description {margin-bottom:5px;margin-right:0px;}
.statement{font-size:12px;margin-top: 3px;  text-align: justify;line-height:13px;}
.zh-cn .statement , .zh-hk .statement{line-height:16px;}
.zh-cn .footer , .zh-hk .footer{padding-top:10px;}
.zh-cn .footer > div.statement , .zh-hk .footer > div.statement{margin-top:11px;font-size:13.5px; line-height: 1.3;}
.phocadownloadfilelist a{font-size:14px;line-height:160%;text-decoration:underline!important;margin-bottom:10px}
.zh-hk .phocadownloadfilelist a,.zh-cn .phocadownloadfilelist a{font-size:13.5px;}
.phocadownloadfilelist div{margin-bottom:10px;}
/*footer */
.sales_brochure_list .phocadownloadfilelist{height:auto;overflow-y:auto;width:auto;margin-bottom:32px;}
.phocadownloadfilelist{height:auto;overflow-y:auto;}
.home_page > .content-body{width:984px;margin:auto;}
.phocadownloadfilelist32 > a{font-weight:normal;}
.db8sitelastmodified > li{list-style-type:none;}
.sitelastmodified > li{list-style-type:none;font-size: 12px}
.item-page .db8sitelastmodified > li{list-style-type:none;font-size:12px;}
.item-152{display:none!important;}
.item-153{display:none!important;}
.logo_in_article{display: block; margin-left: auto; margin-right: auto; width: 150px;}
.zh-hk .logo_in_article ,.zh-cn .logo_in_article{display: block; margin-left: auto; margin-right: auto; width: 172px;}

.landing-banner-wrapper {height:100%;min-height:460px;min-width:460px;}
.landing-banner{width:auto;height:100%;min-height:460px;min-width:460px;}
.content-body .sitelastmodified{font-size:12px;}
.zh-hk .content-body .sitelastmodified,.zh-cn .content-body .sitelastmodified{font-size:13px;}
.en .header-nav ul li.item-119,.header-nav ul li.item-122{border-right:0px;}
.en .header-nav ul li.item-120{padding-left:0px;}
.footer-left{width:1004px;float:right;margin-right:20px;}
.footer-right{display: none;width:200px;float:right;}
.video-link{font-weight:normal;display:inline-block;position:relative;margin-bottom:10px;font-size:12px;}
.video-link img{  height: auto; height: auto;max-width: 100%;width: 470px;}
.zh-hk .video-link, .zh-cn .video-link{font-size:13.5px;}
.menu li{list-style-type:none;}
.button_mute{display:block;top:5px;right:5px;}
.button_unmute{display:none;top:5px;right:5px;}
.button_mute img , .button_unmute img{width:22px;height:22px;}
.audio_button {
    position: absolute;
		z-index:1000;
		background: rgba(0,0,0,0.05);
		cursor: pointer;
}
div#flax-footer-language-menu {
    display: inline;
    position: relative;
    margin-right: 0px;
}
#footer-langs-mute{
	z-index:1000;
}
.custom.link-copyrightlink{margin-top:0.5rem;}
.custom.link-copyrightlink p a {
    font-size: 12px;
		text-decoration: underline;
}
.mod-languages{width:100%}
#fullAjaxGif{position: absolute; margin-top:20%;width: 200px;top:60%;left:0;right:0;margin:auto;}
.closeContainer{
	display: none!important;
	color: #392b1f;
	text-align: right;
	height: 30px;
	margin-bottom: -30px;
	position: relative;
	z-index: 10;
}
.closeContainer span {
    background: #e1c7b5;
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    line-height: 30px;
    font-size: 30px;
    font-weight: 100;
}
.closeContainer span:hover{
	color:white;
	cursor: pointer;
	background-color: rgba(111, 91, 74);
}
@media screen and (min-width: 1024px) {
	.footer{
		position: absolute;
		left: calc(50vw - 512px);
		z-index: 11;

	}
.header-nav ul li a:hover:link, .header-nav ul li a:hover:visited{
/* text-shadow: 2px 2px 3px white; */
text-shadow: 0 0 15px rgba(255, 255, 255, 1);
text-decoration: none;
}
#footer-languages{
		z-index: 99;
}
.footer.container {min-height: 167px;position: absolute;bottom: 0;}
.footer.container .col{position:relative;}
#flax-copyrightlink{display: inline-block;}
#flax-bottom{position:relative; display:inline-block;margin-top:.5em;float:right;}
.audio_button {
		right: 0;
}
}
@media screen and (max-width:1023px){
  .audio_button{  float: left;
    position: relative;
    margin-top: -38px;
    margin-left: 190px;
    z-index: 10;
	}
}
@media screen and (min-width:1024px){
.col-left{width:22%;float:left;}
.col-right{width:78%;float:left;}
}
.no-wrap-on-desktop{white-space: nowrap;}
.header-nav{display:block!important;}
#footer-langs-mute{
	position: relative;
}

@media screen and (max-width: 1060px) {
		.footer .row{
			width: 100%;
	}
}
@media screen and (max-width: 1023px) {
	.links-to-others {
			text-align: left;
	}
}
@media screen and (max-width: 1436px) {
	.overall {min-width:1024px; position:relative; }
}

	.top-header{
		width:100%;
		height:auto;
		max-width:1440px;
	}
@media screen and (max-width: 1023px) {
	#btm-right-bird-container{
		display: none;
	}
	.closeContainer{display:none}
	.home_page .content-body p{text-align:left;}
  .home_page{ background-color:#fff;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; background-color:rgba(0,0,0,0.9);height:1600px;}
	.landing-banner-wrapper {min-height:0px;min-width:0px;}
	.landing-banner{min-height:0px;min-width:0px;}
	.overall {min-width:1024px; position:relative; background-position: center top, center right, center left, center bottom;}
	html,body { height:auto!important;}
	.desktop{display:none;}
	.mobile{display:block;}
	.overall{min-width:0;height:auto;}
	.header-logo {  
		width:200px;
		position: relative;
		display: block;
		margin: 0;
		padding: 0;
		float: none!important;}
	.header-logo .main-logo{width:100%;}


	.content-body{margin:0 5% 0;padding:0px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";}
	.main-content .content-body{
    min-height: 300px;
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6e0ff', endColorstr='#80f7f9ff',GradientType=0 );
	}
	.item-page{padding:5% 0;}
	.page-header h1{font-size:20px;font-weight: bold;}
	p{font-size:12px;}
	.item-page p{font-size:14px;}
	.item-page .sitelastmodified{font-size:14px;}
	.rhs{display:none;}
	.footer{width:80%;padding;min-height:0px;background-image: url('../images/brownbg_01.jpg');background-size: cover;}
	.footer-content{display:inline-block;position: relative;}

	.footer .description{font-size: 13px;margin:0px;}
	.footer .description > div{font-weight:bold;}
	.footer a{text-decoration:underline;}
	.copyright{clear:left;border:0px;margin-top:10px;}
	.home_page > .item-page{padding-top:12px;}
	.mod-languages{clear:right!important;float:none!important;margin:auto;  padding: 10px 0px 20px!important;width:100%;text-align:left;}
	.footer-nav{background-color:#fff;z-index:100;margin:10px;}
	.footer-nav > ul {margin:0 auto;border-top:1px #000 solid;}
	.footer-nav > ul >li { font-size:11px;border-bottom:1px #000 solid;padding:1px 0;list-style:none;}
	.footer-nav > ul >li > a{color:#000; font-size:18px;margin:10px;font-weight:bold;display:block;}
	.home .footer-content{text-align:center;padding:20px 10%;  width: 80%;}
	.nav .active > a{color:#58585A;}
	.nav li{text-align:left;}
	.home .footer{text-align:center;padding:0px;}
	.footer-nav a{text-decoration:none;}
	.zh-cn .footer, .zh-hk .footer {padding:0px;}
	.zh-cn .footer div{padding-bottom:0px;}
	.zh-hk .footer .description, .zh-cn .footer .description {margin-right:0px;}
	.sunhungkai-logo {width: 200px;margin-top: 10px;margin-bottom: 20px;clear: right;float:none;}
	.last-update {float:none;clear:right;font-size:12px;margin-top:5px;padding:10px;display:block;}
	.footer > div.footer-content:nth-child(2){text-align:left;padding:20px 10%;padding-top:0px;width:80%;}
	.enter{cursor:pointer;}

	.lang-inline a {font-size:18px;text-decoration:none;}
	.logo_in_article{display: block; margin:20px auto; width: 150px;}
	.item-page  p{margin-top:10px;}
	.footer-nav .item-152{display:none!important;}
	.footer-nav .item-153{display:none!important;}
	.zh-hk .disclaimers, .zh-cn .disclaimers, .disclaimers{margin-top:0px;}
	.footer .description{width:100%;float:none;}
	.link-copyright{margin-top:0px;margin-left:0px;padding-left:0px;}
	.zh-hk .district, .zh-hk .street, .zh-hk .disclaimers, .zh-hk .website, .zh-hk .enquiry{padding:0px;}
	.zh-cn .district, .zh-cn .street, .zh-cn .disclaimers, .zh-cn .website, .zh-cn .enquiry{padding:0px;}
	.zh-hk .copyright, .zh-cn .copyright{margin-top:0px;float:none;border-right:0px;}
	.zh-hk .link-copyright, .zh-cn .link-copyright{margin-top:0px;padding-left:0px;}
	.zh-hk .sunhungkai-logo{float:none;}
	.copyright{float:none;}
	.web-link a{font-size:18px;}
	.web-link > .custom{line-height:20px;}
	.footer-m {
			width: 100%;
			margin: auto;
			position: relative;
			bottom: 0px;
			z-index: 2;
			height: auto;
			background-image: url('../images/brownbg_01.jpg');
			background-size: cover;
	}
	.footer-m p{font-size:13.5px;}
	.district, .street {
			border-right: 0px;
	}
	.zh-hk .district, .zh-hk  .street, .zh-hk  .website, .zh-hk  .enquiry{padding:0px;}
	.zh-hk .link-copyright a, .zh-cn .link-copyright a{font-size:12px;}
	.zh-hk .link-copyright , .zh-cn .link-copyright {padding-left: 0px;}
	#container{height:auto;min-height:0px;margin:0px;padding-bottom: 140px;}
	.home_page > .content-body{width:94%;margin:auto;padding:0 3%;}
	.content-close{right:15px;top:15px;}

	.footer-left{width:100%;float:none;margin-right:20px;text-align:center;}
	.footer-right{width:100%;float:none;}
	.district, .street, .disclaimers, .website, .enquiry{padding:0px;}
	.web-link{text-align:center;}
	.disclaimers{width:100%;margin-top:10px;}
	.button_mute{left:5px;}
	.button_unmute{left:5px;}
}
 @media screen and (max-width: 542px) {
	.home_page{height:2100px;}
 }

#flax-footer-statement {
	letter-spacing: normal;
    text-align: justify;
    font-size: 11px;
    line-height: 1.2em;
}
	.custom.disclaimers p{font-size:16px;line-height: 1.4em;}
@media screen and (min-width: 1024px){
	.custom.disclaimers p{
		margin-top: 20px;
		text-align: left;
		font-size: 14px;
		line-height: 1.2em;
		text-decoration: underline;
	}
}

/* =========================================================
   HAMBURGER NAVIGATION (ALL SCREEN SIZES)
   ========================================================= */

.menu-checkbox,
.menu-button-trigger {
    display: none;
}

.top-header-m {
    position: relative;
    z-index: 30;
}

.top-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    max-width: 1070px;
    width: 100%;
    min-height: 88px;
    height: auto;
    margin: 0 auto;
    padding: 14px 20px;
    box-sizing: border-box;
}

.header-logo {
    width: min(400px, 52vw);
    float: none !important;
    margin: 0 !important;
    margin-right: auto !important;
    padding: 0;
    flex: 0 1 auto;
    order: 1;
}

.header-logo .main-logo {
    display: block;
    width: 100%;
    height: auto;
}

.menu-button {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    margin-left: auto;
    order: 2;
    position: relative;
    right: auto;
    top: auto;
    padding: 0;
    border: 1px solid rgba(44, 94, 59, 0.18);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.92);
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(44, 94, 59, 0.14);
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    z-index: 32;
}

.menu-button:hover {
    background: #ffffff;
    box-shadow: 0 6px 18px rgba(44, 94, 59, 0.2);
    transform: translateY(-1px);
}

.menu-button__icon {
    position: relative;
    display: block;
    width: 20px;
    height: 14px;
}

.menu-button__icon span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    border-radius: 2px;
    background: #2c5e3b;
    transition: transform 0.28s ease, opacity 0.2s ease, top 0.28s ease;
}

.menu-button__icon span:nth-child(1) { top: 0; }
.menu-button__icon span:nth-child(2) { top: 6px; }
.menu-button__icon span:nth-child(3) { top: 12px; }

.menu-button[aria-expanded="true"] .menu-button__icon span:nth-child(1) {
    top: 6px;
    transform: rotate(45deg);
}

.menu-button[aria-expanded="true"] .menu-button__icon span:nth-child(2) {
    opacity: 0;
}

.menu-button[aria-expanded="true"] .menu-button__icon span:nth-child(3) {
    top: 6px;
    transform: rotate(-45deg);
}

.header-nav {
    display: block !important;
    float: none !important;
    line-height: normal;
    order: 3;
    position: absolute;
    top: calc(100% + 10px);
    right: 20px;
    left: auto;
    width: min(420px, calc(100vw - 40px));
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    margin: 0 !important;
    padding: 0;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(44, 94, 59, 0.12);
    box-shadow: 0 18px 40px rgba(31, 58, 40, 0.16);
    border-radius: 20px;
    z-index: 31;
    transform: translateY(-8px);
    transition: max-height 0.38s ease, opacity 0.28s ease, transform 0.28s ease;
    pointer-events: none;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.header-nav.menu-open {
    max-height: min(78vh, 720px);
    opacity: 1;
    overflow-y: auto;
    pointer-events: auto;
    transform: translateY(0);
}

.header-nav ul.mod-menu,
.header-nav > ul {
    list-style: none;
    margin: 0;
    padding: 10px 0;
}
.mod-menu.mod-list.nav{
    max-height: 80vh;
}

.header-nav ul.mod-menu li.nav-item,
.header-nav ul li {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(44, 94, 59, 0.08) !important;
}

.header-nav ul.mod-menu li.nav-item:last-child,
.header-nav ul li:last-child {
    border-bottom: 0 !important;
}

.header-nav ul.mod-menu li.nav-item a,
.header-nav ul li a,
.header-nav ul li a:link,
.header-nav ul li a:visited {
    display: block;
    padding: 14px 22px;
    color: #3d4a3f !important;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.45;
    text-decoration: none !important;
    text-shadow: none !important;
    margin: 0;
    transition: background-color 0.18s ease, color 0.18s ease, padding-left 0.18s ease;
}

.header-nav ul.mod-menu li.nav-item a:hover,
.header-nav ul li a:hover {
    color: #2c5e3b !important;
    background: rgba(195, 239, 210, 0.45);
    padding-left: 26px;
}

.header-nav ul.mod-menu li.nav-item.active > a,
.header-nav ul.mod-menu li.nav-item.default > a,
.header-nav ul li.active > a,
.header-nav ul li.default > a {
    color: #2c5e3b !important;
    background: rgba(195, 239, 210, 0.55);
    font-weight: 700;
    box-shadow: inset 4px 0 0 #2c5e3b;
}

body.site-menu-open::before {
    display: none;
}

body.site-menu-open #container::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(36, 58, 44, 0.28);
    z-index: 1;
    pointer-events: none;
}

@media screen and (max-width: 767px) {
    .top-header {
        min-height: 76px;
        padding: 12px 16px 12px 12px;
    }

    .header-logo {
        width: min(240px, 58vw);
        top: 10vh;
    }

    .menu-button {
        width: 42px;
        height: 42px;
        border-radius: 12px;
    }

    .header-nav {
        left: 12px;
        right: 12px;
        width: auto;
    }

    .header-nav ul.mod-menu li.nav-item a,
    .header-nav ul li a {
        font-size: 16px;
        padding: 15px 18px;
    }
}

@media screen and (min-width: 1024px) {
    .zh-hk .header-nav ul.mod-menu li.nav-item a,
    .zh-cn .header-nav ul.mod-menu li.nav-item a,
    .zh-hk .header-nav ul li a,
    .zh-cn .header-nav ul li a {
        font-size: 16px;
    }
}

/* =========================================================
   INTRO PAGE CLOSE MECHANICAL ENGINE
   ========================================================= */

.intro-page {
    position: relative; /* Serves as the anchor coordinate for the button */
    opacity: 1;
		background: rgba(255,255,255,0.8);
		border-radius: 30px;
    transform: translateY(0);
    transition: transform 0.45s cubic-bezier(0.25, 1, 0.5, 1), 
                opacity 0.45s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: transform, opacity;
}

/* THE DISMISSAL TRIGGER STATE */
.intro-page.hidden {
    opacity: 0;
    transform: translateY(40px); /* Slides down cleanly by 40px while disappearing */
    pointer-events: none;        /* Blocks clicks once it is invisible */
}

/* THE CLOSE BUTTON COMPONENT STYLE */
.intro-close-btn {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 36px;
    height: 36px;
    background: rgba(0, 0, 0, 0.05); /* Soft background hover space */
    border: none;
    border-radius: 50%;
    cursor: pointer;
    z-index: 1005;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.intro-close-btn:hover {
    background-color: rgba(0, 0, 0, 0.15);
    transform: scale(1.05);
}

/* The X visual lines inside the button */
.intro-close-btn span {
    position: absolute;
    width: 18px;
    height: 2px;
    background-color: #333333; /* Color of the 'X' */
    border-radius: 1px;
}

.intro-close-btn span:nth-child(1) {
    transform: rotate(45deg);
}

.intro-close-btn span:nth-child(2) {
    transform: rotate(-45deg);
}

/* Responsive optimization for smaller phone viewports */
@media (max-width: 1024px) {
    .intro-close-btn {
        right: 40px;
    }
}
@media (max-width: 768px) {
    .intro-close-btn {
        top: 15px;
        right: 15px;
        width: 32px;
        height: 32px;
    }
    .intro-close-btn span {
        width: 14px;
    }
}


.footer-wrapper{
	--footer-height: 300px;
	position: absolute;
	width: 100%;
	height: var(--footer-height);
	bottom: calc(-1 * var(--footer-height));

  background: #476953;
}

@media screen and (max-width: 1024px) {
	.footer-wrapper{
		height: auto;
		bottom: auto;
	}
}

.footer.container{
  z-index: 1;
  position: relative;
	left: 0;
  color:white;
  width: 100%;

}

.footer .row{
	width: auto;
  padding: 30px 20px;
}
/* AJAX intro-page transitions */
.intro-page.is-leaving,
.intro-page.is-entering {
    opacity: 0;
    transform: translateY(40px);
    pointer-events: none;
}

/* Inner-page hero: same landing structure, anchored to first viewport */
body:not(.landing-home) .site-landing-hero {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

body:not(.landing-home) .site-landing-hero .landing-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}

body:not(.landing-home) .site-landing-hero .landing-content-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding-top: 20px;
    z-index: 10;
    gap: 0;
}

body:not(.landing-home) .site-landing-hero .landing-main-logo.site-hero-logo {
    pointer-events: auto;
    position: relative;
    z-index: 20;
    display: inline-block;
    width: auto;
    max-width: min(90vw, 864px);
    height: 150px;
    aspect-ratio: 864 / 272;
    text-decoration: none;
    flex-shrink: 0;
    vertical-align: top;
}

@media (max-width: 1440px) {
    body:not(.landing-home) .site-landing-hero .landing-main-logo.site-hero-logo {
        height: 130px;
    }
}

@media (max-width: 1024px) {
    body:not(.landing-home) .site-landing-hero .landing-main-logo.site-hero-logo {
        height: 110px;
    }
}

@media (max-width: 768px) {
    body:not(.landing-home) .site-landing-hero .landing-main-logo.site-hero-logo {
        height: 90px;
    }
}



/* Inner hero: cancel animation_styles short-viewport scroll (keeps decos on bar edge) */
@media (max-height: 650px) {
    body:not(.landing-home) .site-landing-hero {
        overflow: hidden;
    }

    body:not(.landing-home) .site-landing-hero .landing-wrapper {
        overflow: hidden;
        overflow-y: hidden;
        align-items: stretch;
        padding: 0;
        height: 100%;
    }

    body:not(.landing-home) .site-landing-hero .landing-content-container {
        height: 100%;
        overflow: hidden;
    }
}

body:not(.landing-home) .site-landing-hero .main-animation-wrapper {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    z-index: 0;
    pointer-events: none;
    margin: 0 auto;
}

@media (max-width: 1440px) {
    body:not(.landing-home) .site-landing-hero .landing-content-container {
        padding-top: 0;
    }
}

@media (max-width: 1024px) {
    body:not(.landing-home) .site-landing-hero .landing-content-container {
        padding-top: 30px;
    }
}

@media (max-width: 768px) {
    body:not(.landing-home) .site-landing-hero .landing-content-container {
        padding-top: 80px;
    }
}

body:not(.landing-home) .top-header-m {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 30;
    pointer-events: none;
}

/* Inner-page header: menu button on right */
body:not(.landing-home) .top-header {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    min-height: 0;
    padding-top: 20px;
    padding-bottom: 0;
    pointer-events: none;
}

body:not(.landing-home) .top-header .menu-button,
body:not(.landing-home) .top-header .header-nav {
    pointer-events: auto;
}

body:not(.landing-home) .menu-button {
    margin-left: 0;
}

/* Landing-style footer on Joomla inner pages */
.site-landing-footer {
    width: 100%;
    clear: both;
    position: relative;
    z-index: 2;
    flex-shrink: 0;
}

.site-landing-footer .slide.section1-1,
.site-landing-footer .slide.section-2 {
    width: 100%;
    min-height: 0;
}

body:not(.landing-home) .overall {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    position: relative;
    z-index: 1200;
}

body:not(.landing-home) .overall .slide1-wrapper {
    position: relative;
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    overflow: hidden;
    /* height set inline by JS: calc(100vh - disclaimer bar) */
}

body:not(.landing-home) .overall #container {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 0 !important;
    margin: 0;
    padding: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 2;
}

body:not(.landing-home) #container {
    position: absolute;
    z-index: 2;
}

/* Match landing popup-box position and size */
body:not(.landing-home) .intro-page {
    position: relative;
    z-index: 2;
    width: 90%;
    max-width: 1024px;
    height: 60vh;
    margin: 0 auto;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border-radius: 30px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    pointer-events: auto;
    flex: 0 0 auto;
    overflow: hidden;
    clear: none;
}

body:not(.landing-home) .intro-page .main-content {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    margin: 0;
    padding: 50px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: transparent;
}

body:not(.landing-home) .intro-page .content-body {
    padding: 0;
}

@media (max-width: 768px) {
    body:not(.landing-home) .overall #container {
        box-sizing: border-box;
        align-items: center;
        justify-content: flex-start;
        padding-top: 192px;
        padding-bottom: 12px;
    }

    body:not(.landing-home) .intro-page {
        width: 94%;
        height: min(68vh, calc(100% - 204px));
    }

}

.zh-cn.overall #container,
.zh-hk.overall #container {
    height: auto;
    min-height: 0;
}