* 		{margin: 0; padding: 0; outline: 0}
body	{ background: #37c0f5; font: normal 15px arial,helvetica,sans-serif; color: #fafafa; }
#wrap	{ margin: 0 auto;  padding: 20px 0; }
a		{ text-decoration: none; }
ul		{ list-style: none; }
img		{ border: 0; }
h1,h2,h3	{ font-weight: normal; }
.side	{ float: left; position: relative; height: 600px; width: 180px;  padding: 0 0 0 75px; }
.side .nav	{ margin: 20px 0 0 0; }
.nav ul li	{ display: block; }
.nav ul li a {  display: block; margin: 10px 0px 0 0; color: #cdeffc; font-size: 10px; text-transform: uppercase; }

.nav ul li a:hover,
.nav ul li a.active,
.nav ul li li a.active		{ color: #1f2024; }

.devsite	{ padding: 10px;  position: fixed; top: 0; left: 0; background: #fff; color: #000; opacity: .6; font-size: 12pt; border-radius: 0 0 10px 0; z-index: 10000; }
.nav ul li li a	{ color: #748590; }
.nav h4 { font-weight: bold; }
.nav ul.categorised { padding-left: 6px; padding-bottom: 5px; display: none}
.nav ul.categorised.active {display: block };

.top h3.projectname 	{ color: #001921; margin: 10px 0 0 0; font-size: 17px; text-transform: uppercase; }
	
.topnav	{ margin: 5px 0 0 0;  }
.topnav li	{ float: left; margin: 0 20px 0 0; }
.topnav li a	{ color: #fff; }

br.clear	{ clear: both; }
.main { float: left; width: 70%; }
.main.static	{ width: 700px; }
.main .top { height: 85px; max-width: 700px;  }
.main .bottom { max-width: 700px;  }

.main h1	{ margin: 20px 0 0 0; font-size: 25px; text-transform: uppercase; }
.main h2	{ margin: 20px 0 0 0;  font-size: 25px; }
.main h3	{ margin: 0; font-size: 25px; }
.main img.image	{ margin: 0 0 30px  0;  width: 100%; }
.main p, .main ul { padding: 10px 0; color: #1f2024;  }



.contact	{ width: 45%; }
.contact p	{ margin: 0; }

.contact label	{ color: #1f2024; display: block; float: left; padding: 5px 10px; margin: 0 0 10px 0;  }
.contact input[type=text],
.contact textarea	{ display: block; float: right; padding: 5px 10px; background: #eee; font: 11px; arial, sans-serif; border: 0; margin: 0 0 10px 0; width: 175px; }
.contact textarea	{ height: 100px; }
.contact input[type=submit] { border: 0; background: #eee; color: #1f2024; cursor: pointer; padding: 5px 10px; float: right;  }

#contacts {
	font-size: 0.9em;
	border-top: 1px dotted #fff;
	padding: 1.5em 0;
	margin: 2em 0
}

#contacts ul {
	float: left;
	width: 100%;
}

#contacts h4 {
	text-transform: uppercase;
	color: #fff
}

#contacts p a {
	color: #000;
	text-decoration: underline
}

#contacts p a:hover {
	text-decoration: none	
}

#contacts li {
	padding-top: 1em;
	padding-right: 2%;
	padding-bottom: 1em;
	width: 48%;
	float: left;
}

.left 	{ float: left; }
.right	{ float: right; }


.slides	{ position: relative; }
.slide { left: 0; top: 0; }
 
.slide 		{ position: absolute; width: 100%; height: 100%; left: 0; display: none;  }
.slide.show	{ display: block; }
.slide  img		{ width: 100%; left: 0;  } 
.slide h3.caption 	{ color: #fff; font-size: 15px; }

.slide  .capt 	{ position: relative; top: -72px; background: url(../images/bg_caption.png); color: #fff;  width: 100%;  font-size: 18px; color: #fff; padding: 20px ;}
.slide .capt.btm 		{ width: auto;  }

.controls	{ position: fixed; bottom: 0; height: 90%; width: 25px; right: 0; }
.controls .inner	{ margin: 20px; }
.controls .pag		{ margin: 50px 0 0 0;  color: #000; }
.controls .pag li.active	{ font-weight: bold; }
.controls .cont		{ margin: 20px 0 0 -8px;  }
.controls .cont li a		{ text-indent: -9999px; display: block; width: 22px; height: 26px; margin: 0 0 10px 0; }
.controls li a.next	{ background: url(../images/gallery_controls.png) no-repeat;  }
.controls li a.prev	{ background: url(../images/gallery_controls.png) no-repeat 0 -46px;  }
.controls li a.pause	{ background: url(../images/gallery_controls.png) no-repeat 0 -89px;  }
.controls li a.play	{ background: url(../images/gallery_controls.png) no-repeat 0 -120px;  }





.favourite	{ width: 325px; height: 300px; float: left; margin: 0 20px 20px 0; border: 1px solid #000;  }
.favourite img	{ width: 170px; float: left; height: 160px;  }
.favourite	h3	{ font-size: 15px; margin: 10px 5px; color: #fff;  }
.favourite p	{ float: right; margin: 0 10px; color: #fff; width: 130px;  }


.pdf	{ text-transform: uppercase; padding: 0 20px; color: #fff; }


.right	{ margin: 27px 0 0 0; float: right; }

ul.social { float: left; margin-right: 20px }
ul.social li	{ float: left; margin-left: 7px; }
ul.social li a	{ display: block; width: 27px; height: 27px; text-indent: -9999px; }
ul.social li a.linkedin	{ background: url(../images/social.png) no-repeat -27px 0 ; }
ul.social li a.twitter		{ background: url(../images/social.png) no-repeat 0 0; }

ul.flags { float: left; margin-top: 8px; }
ul.flags li	{ float: left; margin-left: 5px;  }
ul.flags li a	{ display: block; width: 30px; height: 20px; text-indent: -9999px; }
ul.flags li a.english	{ background: url(../images/flags.png) no-repeat; }
ul.flags li a.chinese	{ background: url(../images/flags.png) no-repeat -30px 0; }