/*fonts*/
@font-face {
	font-family: 'ubuntu';
	src:local('/assets/Ubuntu-R.ttf'),
	url('/assets/Ubuntu-R.ttf') format('truetype');
}
@font-face {
	font-family: 'abeezee';
	src:local('/assets/ABeeZee-Regular.ttf'),
	url('/assets/ABeeZee-Regular.ttf') format('truetype');
}


/*elements*/
body 				{ font-size:20px; font-family:ubuntu,abeezee,Arial; color:#234; padding:0; margin:0; background-color:#fff; }
h1					{ padding: 10px 0 20px 0; border-radius: 0 0 55% 0; border-bottom: 5px solid #327080; }
h2					{ color: #5FAE45; padding-bottom:0; margin:20px 0 20px 0; }
h3,h4				{ padding-bottom:0; margin:20px 0 20px 0; }
body a				{ text-decoration:none; color: #21ABE3; }
body a:hover		{ text-decoration:none; }
article				{ margin:10%; }
article h3			{ margin:20px 0 5px 0; }
a:phone.hover		{ background-image: url(../assets/phone-fao.png); }
input, textarea		{ margin:10px; border:1px solid #CCC; font-size:20px; }
label 				{ padding:10px; margin:auto 0; }
ul					{ list-style-image: url("/assets/arrow.png"); }
.bluetile ul		{ list-style-image: url("/assets/wht-arrow.png"); }
.slideoverlay ul	{ list-style-image: url("/assets/wht-arrow.png"); }
p					{ margin:0 0 20px 0; }
#top 				{ background-color:#EFF; float:none; position:fixed; top:0; width:100%; z-index:10; box-shadow:0 0 2px #AAA; height:114px; }
#top a				{ text-decoration:none; color:#333; }
#menu 				{ display:block; width:100%; height:50px; background-color:#41dbff; }
#menu a 			{ text-decoration:none; padding:10px 20px 10px 20px; float:left; height:30px; color:#333; border-right:1px dotted #21ABE3; }
#menu a:visited 	{ color:#109AE2; }
#menu a:hover 		{ background-color:#444444; color:#fff; transition: background-color .2s; display:block;  }
#menu a:active 		{ color:#fff; background-color:#222222; }
#mainmenu:hover		{ display:block; z-index:0; }
#h2line 			{ float:left; }
#h2lineM			{ display: none; }
#burgmenu			{ display:none; }
/*#burgmenu a:hover  #mainmenu	{ display:block; position:absolute; top:200px; left:0; width:100%; background-color: #fff; height:140px; }*/


/*classes*/
.topcenter			{ width: calc(100%-300px); vertical-align:top;  }
.phone 				{ 
						text-decoration:none; color:#000; font-size:26px; text-align:right; vertical-align:middle; 
						border:2px solid #C73; border-radius:3px; position:absolute; top:10px; right:10px;
						background-image: url(../assets/phone.png); background-repeat:no-repeat; background-position:5px 3px; background-size: 22px; 
					}
.enquire			{ 
						text-decoration:none; color:#000; font-size:26px; text-align:left; vertical-align:middle; 
						border:2px solid #C73; border-radius:3px; width:200px;
						background-image: url(../assets/form.png); background-repeat:no-repeat; background-position:left; background-size: 22px; 
					}
.phone:hover		{ background-image: url(../assets/phone-fao.png); }
.enquire:hover		{ background-image: url(../assets/form-fa0.png); }
.phone a			{ color:#000; }
.phone a:hover		{ color:#fa0;  }

.left 				{ text-align:left;  }
.right				{ width:250px; }
.padtop				{ height:100px; }
.sitemap 			{ background-color:#41dbff; width:100%; vertical-align:top; }
.sitemap a 			{ text-decoration:none; font-size:14px; margin:0 20px 0 0; }
.sitemap a:visited 	{ color:#333; }
.sitemap a:link 	{ color:#000; }
.sitemap a:hover 	{ border-bottom:2px #21ABE3; }
.sitemapqq 			{ width:120px; margin:10px 10px 10px calc(80%-130px); }
.sitemap div ul li 	{ float:left; list-style:none; }
.table 				{ display:table; }
.row 				{ display:table-row; vertical-align:top; }
.cell				{ display:table-cell; vertical-align:top; }
.company			{ color: #5FAE45; margin:10px 0 0 0; font-size:18px; font-family:Arial; font-weight:bold; transtion: text-shadow 2s ease; display:block; clear:both; }
.a					{ text-decoration:none; }
.logocontainer 		{ width:100%; margin:62px 0 0 0; }
.logowidth			{ width:80px; }
.logo				{ height:60px; margin:0 0 0 10px; }
.h247				{ float: left; font-size:12px; color:#21ABE3; }
.topemaillink		{ color:#000; text-decoration:none; }
.mainslide			{ width:100%; position:relative; margin: 115px 0 0 0; }
.mainslide img		{ width:100%; }
.ms_action, cta			{ background-color:#FFAA00; color:#000; padding:10px; font-size:24px; text-decoration:none; display: inline-block; margin:20px 0; box-shadow:0 0 2px 2px #C73; }
.ms_action:hover, cta:hover	{ background-color:#000; color:#FFAA00; transition: background-color .2s ease; }
.maincontent		{ padding:0 10%; margin:0; }
.slideoverlay		{ background-color: #327090; width:30%; color:#fff; padding:0; }
.slideoverlay ul	{ margin:0 0 20px 0; }
.slideoverlay ul li { font-size:24px; margin:15px 0; }
.slideoverlay h3	{ color:#FFAA00; text-shadow:0 0 3px #000; margin:10px 0 10px 10px; font-size:32px; }
.mainslide h1		{ color: #fff; text-shadow:0 0 5px #000; position:absolute; top:25%; left:10%; font-size:48px; border-color:#fff; }
.mainslide h2		{ color: #fff; text-shadow:0 0 5px #000; position:absolute; top:35%; left:10%; font-size:44px; }
.bborder			{ border-bottom: 1px solid #555; }
.eow				{ background-color:#333; color:#fff; font-size:14px; margin:0; padding:2% 5%; width:90%; }
.wechat				{ font-size:11px; margin:0; padding:0; }
.pad10				{ margin:20px; }
.action				{ display:block; background-color:#FFAA00; color:#000; text-decoration:none; padding:5px 15px 5px 35px; }
.action:hover		{ background-color:#000; color:#fa0; transition: background-color .2s ease; text-decoration:none; }
.promo				{ background-color:#fff; border:none; box-shadow:0 0 4px #DDD; }
.hometile			{ width:30%; height:390px; border:1px solid #21ABE3; float:left; margin:5% 3% 5% 0; box-shadow:0 0 5px #AAA; opacity:.7; display:block; overflow: hidden; text-decoration:none; }
.hometile h2		{ margin:10px; color:#444; }
.hometile p			{ margin:10px; }
.hometile img		{ width:100%; border-left:10px solid #fff; border-left:none; border-right:10px solid #fff; border-bottom:none; margin-bottom:none; }
.hometile:hover		{ opacity:1; box-shadow:0 0 10px #777; cursor:pointer; }
.fullwidth			{ width:100%; }
/*.spacer				{ height: 10px; margin:135px 0 0 0; } */
.h50				{ height:210px; overflow:hidden; }
.floatingtable		{ border:2px solid #5FAE45; background-color:#FFF; color:#000; float:left; margin:10px;}
.floatingtable table thead tr th	{ background-color:#5FAE45; Color:#FFF; }
.darktable 							{ background-color:#ffffff; border: 2px solid #111111; margin: 0 0 20px 0px; width: 100%; }
.darktable table thead tr th 		{ background-color:#111111; color:#FFF; }
.darktable table tbody tr th 		{ background-color:#111111; color:#FFF; }
.darktable table tbody tr td 		{ border: 1px solid #111111; }

.bluetable 							{ background-color:#fff; border: 2px solid #21ABE3; margin: 0 0 20px 0px; width: 100%; }
.bluetable table thead tr th 		{ background-color:#21ABE3; color:#FFF; }
.bluetable table tbody tr th 		{ background-color:#21ABE3; color:#FFF; }
.bluetable table tbody tr td 		{ border: 1px solid #21ABE3; }

.greentable 						{ background-color:#fff; border: 2px solid #5FAE45; margin: 0 0 20px 0px; width: 100%; }
.greentable table thead tr th 		{ background-color:#5FAE45; color:#FFF; }
.greentable table tbody tr th 		{ background-color:#5FAE45; color:#FFF; }
.greentable table tbody tr td 		{ border: 1px solid #5FAE45; }
.cta								{ margin:0 0 0 10px; }
.pricetable 						{ background-color:#fff; border: 2px solid #5FAE45; margin: 0 0 20px 0px; width: 100%; }
.pricetable thead tr th				{ background-color: #5FAE45; color:#fff; }
.pricetable tbody tr td				{ border: 1px solid #5FAE45; }
.pricetable2 						{ background-color:#fff; border: 2px solid #327090; margin: 0 0 20px 0px; width: 100%; }
.pricetable2 thead tr th			{ background-color: #327090; color:#fff; }
.pricetable2 tbody tr td			{ border: 1px solid #327090; }
.fielderror							{ display:none; color:#880044; } 
.pagebottom							{ vertical-align:top; }
.bluetile							{ background-color:#327090; color:#FFF; padding:20px; width:calc(100% - 40px); vertical-align:top; font-size:1.2em; }
.bluetile .cell						{ padding:0; width:50%; }
.bluetile img						{ width:calc(100% - 20px); overflow:hidden; margin:30px 10px auto 10px;  }
.bluetile h2						{ color: #41dbff; }
.faq								{ margin:20px 0 0 0; color:#555; font-weight:bold; }
.faq:hover							{ cursor: pointer; }
.faqa								{ color:#21ABE3; display:none; margin:10px 0 20px 0; font-weight:normal; }
.price								{ margin: 10px; padding: 10px; border: 2px solid #DDD; }
.price h2							{ background-color:#DDD; }
.contentimage						{ box-shadow: 0 0 10px 10px #FFF inset; float:right; max-width:40%; }
.nosplit							{ white-space: nowrap; }
.slider								{ width:400px; height:400px; overflow:hidden; float:right; position:relative; }
.slider img							{ position:absolute; top:0; left:0; }
.lang								{ position:absolute; top:15px; right:245px; }
.formbutton							{ box-shadow: 0 0 2px 2px #888; border-radius:3px; }
.formbutton:hover					{ cursor:pointer; }
.anchor								{ margin-top:-100px; padding-top:100px; margin-bottom:0; padding-bottom:0; }
.extrainfo							{ display: block; transition: max-height .2s ease-out; margin:0 0 0 20px; overflow:hidden; }
.frmbtn								{ background-image: url("/assets/form.png"); background-position:left; background-repeat:no-repeat; background-size:contain; padding-left:40px; }
.frmbtn:hover						{ background-image: url("/assets/form-wht.png"); }
.applybtn							{ text-align:right; padding:10px; }
.errmsg								{ padding:10px; background-color:#FFCCCC; color:#880033; border:1px solid #BB4444; }
.msg								{ padding:10px; background-color:#CCFFCC; color:#558855; border:1px solid #88CC88; }
.vatop								{ vertical-align: top; }
.photos	img:nth-child(even)			{ rotate: 7deg; float:right;	border:10px solid #FFF;  }
.photos	img:nth-child(odd)			{ rotate: -7deg; float:left;	border:10px solid #FFF;	 }
.photos img:first-child				{ rotate: 0deg; }
.photos img:last-child				{ rotate: 0deg; }

#singletable 						{ display: none;  }
#singletable table thead tr th 		{ background-color:#5FAE45; color:#FFF; }
#singletable table tbody tr td 		{ border: 1px solid #5FAE45; }
#feedback_form .cell				{ vertical-align:text-top; }


/*responsive adjustments */

@media (max-width: 1180px) {
	#menu a 				{ font-size: 16px; }
	.hometile 				{ width: 44%; margin: 5% 3% 5% 0; display: block; }
	.slideoverlay			{ width: 32%; }
	.slideoverlay h3		{ font-size:24px; }
	.slideoverlay ul li		{ margin:10px 0; }
	.bluetile				{ font-size:1em; }
}

@media (max-width: 920px) {
	.hometile				{ width:97%; }
	.slideoverlay ul li 	{ font-size:24px; margin:5px 0; }
	.slideoverlay			{ width:100%; display:block; position:absolute; top:75%; left:0; }
	.maincontent			{ margin-top: 114px; }
	.choverlay				{ width:40%; float:left; }
	.mobilespacer			{ height:70px; }
}

@media (max-width: 840px) {
	#menu a 				{ font-size: 16px; }
	.slideoverlay ul li 	{ font-size: 26px; }
	.ms_action				{ bottom:20px; right:20px; }
	.slideoverlay ul li 	{ font-size:24px; }
	.mainslide h1			{ font-size:38px; }
	.mainslide h2			{ font-size:28px; }
	.padtop					{ height:80px; }
	.hometile				{ width:97%; }
	.floatingtable			{ width: 95%; }
	.floatingtable table 	{ width:100%; }
	.maincontent			{ padding: 0 2px; margin-top:134px; }
	.slider					{ width:100%; }
	.bluetile .cell			{ width:100%; display:block; }
}


@media (max-width: 780px) {
	#mainmenu		{ display:none; z-index:1; background-image: linear-gradient(#fff, #eee); position:absolute; width:100%; top:114px; }
	#menu a 		{ width:100%; display:block; border-right:none; }
	#burgmenu		{ display:block; }
	#burgmenu a:hover + #mainmenu	{ display:block; z-index:1; }
	#burgmenu:hover + #mainmenu		{ display:block; z-index:1; }
	#mainmenu:hover					{ display:blockl z-index:1; }
	.contentimage					{ max-width: 100%; float:none; }
	.bluetile		{ font-size:.9em; }
}

@media (max-width: 680px) {
	#h2line 			{ display: none; }
	.company 			{ display: none; }
	.h247 				{ display: none; }
	.ms_action			{ font-size:18px; padding:5px 20px;  }
	.mainslide			{ margin: 90px 0 0 0; }
	.mainslide h1		{ font-size:28px; }
	.mainslide h2		{ font-size:18px; }
	.slideoverlay ul li { font-size:16px; }
	.topemaillink		{ display:none; }	
	.bluetable .cell	{ display:block; width:100%; }
	/*#mainmenu			{ display:none; position:absolute; left:0; top:135px; box-shadow:5px 5px 10px #fff; }*/
	#singletable		{ display:block; }
	.maincontent		{ margin-top:114px; }

}

@media (max-width: 540px) {
	.mainslide h2	{ display:none; }
	.mainslide h1 	{ font-size:20px; }
	.eow			{ font-size:12px; }
	.phone			{ font-size:14px; }
	.lang			{ right:185px; }
}

@media (max-width: 440px) { 
	#menu a 			{ float:none; width:100%; }

	.slideoverlay h3	{ font-size:14px; }

}