@charset "utf-8";
.clearfix {display: inline-block;}
.clearfix:after {content: " "; display: block; height: 0; clear: both; font-size: 0; visibility: hidden;}
.clearfix {display: block;}

html {
	width:100%;
	padding: 0;
	margin: 0;
	
}
body{padding:0px;margin:0px;
	font-size:0.5em;
	width:100%;
	/*font-family:Arial, Helvetica, sans-serif;*/
	font-family: "Myriad Pro", 'Droid Sans', 'Lucida Grande', Myriad, Arial,  sans-serif;
	color: #6F6F6E;
	background-color:#EEEDEB;
}

/* ~~ Element/tag selectors ~~ */
ul, ol, dl { 
	list-style:none;
	padding: 0;
	margin: 0;
}

a img { 
	border: none;
}
a:link {
	
	color: #4C4C4C;
	text-decoration: none;
}
a:visited {
	
	color: #4C4C4C;
	text-decoration: underline;
}

.container {
	display:block !important;
	width: 100%;
	max-width:640px;
	overflow:hidden;
	/*min-width:640px;*/
	/*text-align:center;*/
	/*background: #white;*/

}
form
{
	padding:2em;
	color:#FFFFFF;
	line-height:2em;
	
	font-size:1.5em;

}


input, select, textarea, label
{
	display:block;
	width:100%;
	font-size:1.5em;
    box-sizing: border-box;
	-ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
select { font-size: 1.1em; margin-bottom: 20px; }
label { font-size: 1.2em; opacity: 0.6; }
input { font-size: 1.1em; margin-bottom: 20px; }

input[type~=checkbox]
{
	display:inline;
	width:auto;
	margin: 0;
}
input[type~=image]
{
	display:inline-block;
	width:40%;
	margin:0 0em 0 0em;
}
form .btn
{
	text-align:center;
	width:100%;
	padding-bottom:30px;
}

.pageName { text-align: center; margin-bottom: 10px; }
.pageName img {	height: 25px; }

header.innerpage
{
	position:relative;
	display:block;
	text-align:center;
	display:block;
	width:100%;
	height:15em;
	max-height:150px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#white', endColorstr='#073c66'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#white), to(#073c66)); /* for webkit browsers */
background: -moz-linear-gradient(top,  #white,  #073c66); /* for firefox 3.6+ */
}
header .logo
{ 
	position:absolute;
	
	width:100%;
	height:100%;
	background:url(../images/logoHeader.png) center center no-repeat;
	background-size:auto 65%;
}
img.header{
	display:block;
	width: 100%;
	max-width:640px;
	min-width:90px;
	/*max-height:546px;*/
	margin: 0 auto;
}

nav.langBar {
	display:block;
	position:relative;
	width: 100%; 
	height:auto;
	text-align:right;
}
nav.langBar img.bg{
	display:block;
	width: 100%; 
	max-width:640px;
	min-width:320px;
	/*max-height:546px;*/
	height:30px;
	margin: 0 auto;
	
}
nav.langBar .langBarLink{
	margin: 0 auto;
	display:block;
	position:absolute;
	top:0px;
	right:5%;
	margin:0 0 0 0px;
}

nav.langBar .designerBarLink{
	margin: 0 auto;
	display:block;
	position:absolute;
	top:0px;
	left:5%;
	margin:0 0 0 0px;
	width:auto;
	height:auto;
	overflow:hidden;
	font-size:12px;
}
.langBar .langBarLink li{
	float:left;
	width:15px;
	height:35px;
	text-align:center;
	font-size:12px;
	/*background:url(../images/diveiderLangBar.png) repeat-y;*/
}
.langBar .langBarLink li.first
{
	background:none;
}
.langBar .langBarLink li img
{
	display:block;
	/*width:30px;*/
	height:35px;
	margin:0 auto;
}
.info
{
	text-align:center;
}
.enquiryInfo {
	display:block;
	width: 100%;
	/*height:189px;*/
	max-width:640px;
	min-width:320px;
	/*max-height:546px;*/
	margin: 0 auto;
	font-size:11px;
	padding:10px 0 5px 0;
}
.enquiryInfo span{
	font-weight:bold;
}
.enquiryInfoTel1 {
	display:inline-block;
	width: 100%;
	/*height:189px;*/
	max-width:640px;
	min-width:320px;
	/*max-height:546px;*/
	margin: 0 auto;
	font-size:11px;
	padding:10px 0 15px 0;
}

.enquiryInfoTel1 span{
	font-weight:bold;
}
.enquiryInfoTel2 {
	display:inline-block;
	width: 3%;
	/*height:189px;*/
	max-width:304px;
	/*max-height:546px;*/
	margin: 0 0;
}
.enquiryInfoTel3 {
	display:inline-block;
	width: 33%;
	/*height:189px;*/
	max-width:319px;
	/*max-height:546px;*/
	margin: 0 auto;
}
nav.main{
	display:block;
	
}
nav.main ul li{
	
	height:1%;
	text-align:center;
	/*background:url(../images/btn_bg.png) repeat-x;*/
}
nav.main ul li a{
	display:block;
	width:100%;

}

nav.main ul li img
{
    padding: 0;
    display: block;
	position:relative;
	margin:0 auto;
	width:100%;
	max-width:640px;
	min-width:320px;
}
nav.main .navFooter
{
	background:url(../images/navBarShadow.png) repeat-x;
	height:18px;
	width:100%;
	margin:0 auto;
}
section
{
		background:#073c66 url(../images/formBG.jpg) bottom repeat-x;;
		display:block;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#073c66', endColorstr='#white'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#073c66), to(#white)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #073c66,  #white); 
	padding-bottom:30px;

}
section p
{
	margin:10px 0;
	color:#FFFFFF;
	font-size:1.8em;
	opacity:0.6;
	padding:5px;
	line-height: 160%;
}
section .guestBookDesc
{
	font-size:1.2em;
}
section.gallery ul{margin:auto;}
section.gallery li{width:24%;height:auto;float:left;margin-top:1%;margin-left:1%;margin-bo:1%;}
section.gallery li img{display:block;width:100%;height:auto;}
#colorbox{background:rgba(0, 0, 0, 0.6);}
.photoframe{width:100%;height:100%;display:none;background-size:100% auto;background-repeat:no-repeat;background-position:center center;}

#cboxLoadingGraphic{background:url(../images/loading.gif) no-repeat center center;z-index:2000;}
#cboxTitle{position:absolute;padding:0.5em 5% 0.5em 5%;width:90%;background:#white;opacity:0.8;color:#FFF;}
#colorbox{top:0 !important;width:100%;}
.galleryThumbnail{position:relative;}
#cboxClose{position:absolute;padding:0.5em 1em 0.5em 1em;font-weight:bold;top:15px;right:1em;border-radius:5px;color:#FFFFFF;font-size:2em;
border:0;

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#073c66', endColorstr='#white'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#073c66), to(#white)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #073c66,  #white); }
.btnBack a:link{text-decoration:none;}


.ui-loader{display:none;}
/* ~~ The footer ~~ */
footer {
	background:#white;
	position: relative;
	/*height:163px;*/
	text-align:center;
	clear: both; 
}
footer .link{
	line-height:15px;
	padding:0.5em;
}
footer .disclaimer{
	padding:10px 30px 30px;
	text-align:centre;
	color:#000;
	opacity:0.5;
}
footer .copyright{
	padding:10px 30px 30px;
	text-align:center;
	color:#000;
	opacity:0.5;
}
footer .link a{
	color:#FFFFFF;
	opacity:0.5;
	text-decoration: none;
}
footer .link img.bullet{
	width:14px;
	height:14px;
	vertical-align:middle;
}
footer .devLogo{
	width: 100%;
	max-width:640px;
	min-width:320px;
	margin: 0 auto;
	display:block;
	text-align:center;
	padding-bottom:15px;
}

footer .devLogo img{
	height:40px;
}
footer .devLogo a{
	width:33%;
	min-width:320px;
	max-width:640px;
	text-align:center;
}
footer .dateIframe {width:200px; height:30px; background:transparent;}
footer .datePara {text-align:center;}
footer table.footerLogo{margin:0 auto;text-align:left;opacity:0.5;color:#FFF;padding-bottom:15px;width:90%;}
footer table.footerLogo img{max-height:45px;max-width:95%}

/* for Spacer in Guest Book only, added by Angel on 2012.11.15 */
div.spacer { width: 100%; height: 1px; margin-bottom: 15px; }

/*HTML 5 support */
header, section, footer, aside, nav, article, figure {
	display: block;
}
#popUpDisclaimer{width:100%;height:100%;position:fixed;top:0;left:0;z-index:9999;}
#popUpDisclaimer .overlay{background:rgba(0,0,0,0.6);width:100%;height:100%;}
#popUpDisclaimer .overlay .alignment{display:inline-block;height:100%;width:0;text-indent:-9999px;vertical-align:middle;}
#popUpDisclaimer .overlay .content{background:rgba(255,255,255,1);display:inline-block;vertical-align:middle;width:99%;text-align:center;padding:20px 0;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#white', endColorstr='#073c66'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#white), to(#073c66)); /* for webkit browsers */
background: -moz-linear-gradient(top,  #white,  #073c66); /* for firefox 3.6+ */
color:#4C4C4C;
}
#popUpDisclaimer .overlay .content p{width:80%;text-align:justify;margin:0 auto;padding-bottom:15px;}
#popUpDisclaimer .overlay .content p.closeBtn{text-align:right;color:#4C4C4C;}

#statement a.btn_close {  }


.iframe{text-align:center;}
iframe{width:95%;height:400px;border:0;background:#FFF;margin:0 auto;}
iframe.footerCorner{height:700px;background:#FFF;}


.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }
  
.mainBanner {width:100%;}
.mainBanner .nav {position:relative;  margin-top:-1.2%; bottom:0px; z-index:100; overflow:hidden; width:101.5%;}
.mainBanner .nav a {display:block; float:left;}
.mainBanner .nav a img {width:100%;}
.mainBanner .nav a:first-child{}
.mainBanner .nav a:hover, .mainBanner .nav a.activeSlide {background-position:0 100%;}

a.btn0 {/*background-image:url(../images/btn_intro.png); max-width:177px;*/ width:23.28125%;}
a.btn1 {/*background-image:url(../images/btn_philosophy.png); width:162px;*/ width:20.3125%;}
a.btn2 {/*background-image:url(../images/btn_publications.png); width:114px;*/ width:17.5%;}
a.btn3 {/*background-image:url(../images/btn_awards.png); width:89px;*/ width:19.375%;}
a.btn4 {/*background-image:url(../images/btn_portfolio.png); width:98px;*/ width:19.53125%;}

.mainBanner .subNav {position:relative;  margin-top:0px; bottom:0px; z-index:100; overflow:hidden; width:101.5%;}
.mainBanner .subNav a {display:block; float:left;}
.mainBanner .subNav a img {width:100%;}
.mainBanner .subNav a:hover, .mainBanner .nav a.activeSlide {background-position:0 100%;}
a.btn5 {/*background-image:url(../images/btn_intro.png); max-width:177px;*/ width:17.34375%;}
a.btn6 {/*background-image:url(../images/btn_philosophy.png); width:162px;*/ width:18.4375%;}
a.btn7 {/*background-image:url(../images/btn_publications.png); width:114px;*/ width:17.5%;}
a.btn8 {/*background-image:url(../images/btn_awards.png); width:89px;*/ width:23.28125%;}
a.btn9 {/*background-image:url(../images/btn_portfolio.png); width:98px;*/ width:23.4375%;}
.designerContent #intro.contentPage {position:relative;}

.designerContent #intro.contentPage .content{
	display:block;
	left:0px;
	bottom:0;
	position:absolute;
	width: 100%;
	max-width:620px;
	min-width:90px;
	height:190px;
	margin: 0 auto;
	/**text-align:justify;**/
	background:url(../images/contentBg_black.png);
	overflow: hidden;
	z-index:2;
	}
/*position:absolute;height:275px;width:620px;left:0px;top:450px;z-index:2;background:url(../images/contentBg_black.png);padding:10px 10px 10px 10px; text-align:justify;}*/
.designerContent #intro.contentPage .content .title{font-family : Arial, Helvetica, sans-serif;color:#FFF;font-size:16px;font-weight:bold; max-width:620px; overflow: hidden; padding:10px;}
.designerContent #intro.contentPage .content .scrollable{font-family : Arial, Helvetica, sans-serif;font-size:14px;line-height:1.75em;color:#DDDDDD;max-width:620px; overflow: hidden;}
.designerContent #intro.contentPage .content p {margin:0 0 20px 0; padding:0;}

/*Scrollbar */
.scrollable.barScroll { clear: both;}
.scrollable.barScroll .viewport { height: 150px; overflow: hidden; position: relative; margin:0 auto; max-width:640px;}
.scrollable.barScroll .overview { list-style: none; position: absolute; left: 0; top: 0; max-width:640px;}
.scrollable.barScroll .thumb .end,
.scrollable.barScroll .thumb { background-color: transparent; }
.scrollable.barScroll .scrollbar { position: relative; float: right; width:13px; z-index:1000;}
.scrollable.barScroll .track {background:rgba(0,0,0,0.5);height: 100%; width:3px; position: relative; padding: 0; margin:0 0 0 5px;}
.scrollable.barScroll .thumb {width:3px; cursor: pointer; overflow: hidden; position: absolute; top: 0;background:#888888;}
.scrollable.barScroll .thumb .end { overflow: hidden; height: 5px; width: 13px; }
.scrollable.barScroll.disable{ display: none; }

.scrollable.bulletScroll { clear: both;}
.scrollable.bulletScroll .viewport { height: 290px; overflow: hidden; position: relative; margin:0}
.scrollable.bulletScroll .overview { list-style: none; position: absolute; left: 0; top: 0; }
.scrollable.bulletScroll .thumb .end,
.scrollable.bulletScroll .thumb { background-color: transparent; }
.scrollable.bulletScroll .scrollbar { position: relative; float: right; width: 23px; }
.scrollable.bulletScroll .track {background:url(../images/scrollTrack.png) no-repeat -4px 100% ;height: 100%; width:23px; position: relative; padding:0; }
.scrollable.bulletScroll .thumb { height: 23px; width: 23px; cursor: pointer; overflow: hidden; position: absolute; right:2px; background:url(../images/scrollBullet.png) no-repeat;}
.scrollable.bulletScroll .thumb .end { overflow: hidden; height: 5px; width: 13px; }
.scrollable.bulletScroll.disable{ display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }

/* added by Hermann */
.designerContent .scrollable{padding: 10px 0 10px 10px;}
.designerContent .scrollable .scrollbar{width: 23px; height: 10px;}
.designerContent #awards.contentPage{height: 330px; background: url(../images/contentBg_white.png) no-repeat 0 0;}
.designerContent #awards.contentPage .content, .designerContent #publications.contentPage .content{position:  relative !important; top: 0 !important; left: 0 !important; }
.designerContent .contentPage img.header{min-height: 300px;}
/* end */


.designerContent #philosophy.contentPage .content{	display:block;
	left:0px;
	bottom:0;
	position:absolute;
	width: 100%;
	max-width:620px;
	min-width:90px;
	height:auto;
	margin: 0 auto;
	text-align:justify;
	background:url(../images/contentBg_black.png);
	overflow: hidden;
	z-index:2;
	}
	
.designerContent #philosophy.contentPage .content .text {padding:20px 10px;}
#philosophyVideo {float:left; width:48%; margin:0 3% 0 0;}
#philosophyVideo img {width:100%;}
.designerContent #philosophy.contentPage .content .caption {margin-top:15px; float:left; width:48%;}
.designerContent #philosophy.contentPage .content .caption img {width:100%;}

.designerContent #publications.contentPage {position:relative;}
.designerContent #publications.contentPage .content{	display:block;
	top:5%;
	left:10%;
	bottom:0;
	position:absolute;
	width: 90%;
	max-width:620px;
	min-width:90px;
	height:auto;
	margin: 0 auto;
	text-align:justify;
	overflow: hidden;
	z-index:2;
	}

.designerContent #publications.contentPage .content .title{font-family : Arial, Helvetica, sans-serif;color:#FFF;font-size:14px;font-weight:bold;padding-top:20px;height:33px;}

.designerContent #publications.contentPage .content .scrollable{font-size:11px;line-height:1.75em;color:#DDDDDD;overflow:hidden;}
.designerContent #publications.contentPage .content .scrollable .book{padding-bottom:16px;}
.designerContent #publications.contentPage .content .scrollable .book .image{float:left; width:48%; margin:3% 3% 0 0;}

.designerContent #publications.contentPage .content .scrollable .book .image img{width:100%;}

.designerContent #publications.contentPage .content .scrollable .book .text{width:48%;float:left;color:#444444;font-size:14px;font-family:"Times New Roman", Times, serif;line-height:20px;}
.designerContent #publications.contentPage .content .scrollable .book.noImg .text{width:100%;}
.designerContent #publications.contentPage .content .scrollable .book .text .title{color:#3F3000;font-size:18px;font-weight:bold;font-family:"Times New Roman", Times, serif;display:block;line-height:26px;height:auto;padding-bottom:10px;}

.designerContent #awards.contentPage {position:relative;}
.designerContent #awards.contentPage .content{ display:block;
	top:5%;
	left:10%;
	bottom:0;
	position:absolute;
	width: 90%;
	max-width:620px;
	min-width:90px;
	height:auto;
	margin: 0 auto;
	overflow: hidden;
	z-index:2;
	}		
.designerContent #awards.contentPage .content .scrollable{color:#6A6A6A;font-size:14px; overflow:hidden;font-family:"Times New Roman", Times, serif;}
.designerContent #awards.contentPage .content .scrollable .title{height:auto;padding-bottom:7px;}
.designerContent #awards.contentPage .content .scrollable .awards{padding-bottom:30px;}
.designerContent #awards.contentPage .text{padding-right:15px;}


.designerContent #portfolio.contentPage .content{
	background: url("../images/contentBg_portfolio.png") no-repeat scroll 0 -30px rgba(0, 0, 0, 0);
	bottom: 0px;
	display: block;
	/**height: 126px;
	overflow: hidden;
	**/
	left: 15px;
	margin: 0 auto;
	max-width: 100%;
	min-width: 30%;
	position: absolute;
	padding: 10px 15px 0px 10px;
	text-align: justify;
	top: -150px;
	width: 85%;
	font-size: 14px;
	}
	

.designerContent #portfolio.contentPage {position:relative;}

.designerContent .contentPage.portfolio .content span {
    color: #AAAAAA;
    display: block;
}
.designerContent .contentPage.portfolio .content span.title img{
    padding-bottom: 20px;
	max-width:60%;
	min-width:30%;
}
.designerContent .contentPage.portfolio .content span.link {
    bottom: 40px;
    position: absolute;
	left: -10px;
    text-align: left;
}
.designerContent .contentPage.portfolio .content span.link a {
    /**background: url("../images/bulletPortfolio.png") no-repeat scroll left center rgba(0, 0, 0, 0);
    text-decoration: underline;**/
	color: #786C4C;
    display: inline-block;
    padding-left: 20px;
    
}
.designerContent .contentPage.portfolio .content span.link a:hover {
    color: #B8AD8F;
	
#videoBlock{position:fixed;width:100%;height:100%;top:0;left:0;z-index:900;display:none;}
#videoBlock .overlay{width:100%;height:100%;top:0;left:0;background:#141414;opacity:0.85;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";filter: alpha(opacity=85); /* Netscape */ -moz-opacity: 0.85;  /* Safari 1.x */ -khtml-opacity: 0.85;}
#videoBlock .wrapper{position:absolute;top:50%;margin-top:-105px;left:50%;margin-left:-155px;background:#FFF;padding:5px;}
#videoBlock .closeBtn{position:absolute;display:block;width:26px;height:26px;background:url(../images/btnVideoClose.png);top:50%;margin-top:-270px;left:50%;margin-left:483px;text-indent:-9999px;cursor:pointer}
#videoBlock .closeBtn.mobile{margin-left:458px;margin-top:-295px;}

