*{ margin:0; padding:0; }
body { background:#111; height:100%; font-family: 'Titillium Web', sans-serif; font-size:13px;  }
img { border:none; }
a{ text-decoration:none; border:0px; border:none; outline:0px; outline:none;}
#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../img/progress.gif) no-repeat center center;}
#supersized {  display:block; position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
#supersized img { width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/
#supersized li { display:block; list-style:none; z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111;}
#supersized a { width:100%; height:100%; display:block; }
#supersized li.prevslide { z-index:-20; }
#supersized li.activeslide { z-index:-10; }
#supersized li.image-loading { background:#111 url(../img/progress.gif) no-repeat center center; width:100%; height:100%; }
#supersized li.image-loading img{ visibility:hidden; }
#supersized li.prevslide img, #supersized li.activeslide img{ display:inline; }
.credit{ position:fixed; bottom:20px; right:20px; background:url(../img/bodybg.png); padding:0px 8px; color:#CCCCCC; font-size:12px;}
.credit a{color:#CCCCCC;}
.mycredit{ margin:10px auto; width:960px; text-align:right; background:url(../img/bodybg.png); padding:0px 10px; color:#CCCCCC; font-size:12px;}
.mycredit a{color:#CCCCCC;}

.clr{ clear:both}
#header{ background:url(../img/bodybg.png); padding:12px 20px; border-bottom:solid 1px #e67817}
#navigation{text-align:center; padding:0px 0px; margin:0 auto; width:100%; }
#navigation a{ text-transform:uppercase; margin:0px 20px; color:#FFFFFF;}

.construction{ position:absolute; right:20px; top:49%;}
.interior{ position:absolute; left:20px;top:49%;}


.innercontent{ width:940px; margin:0 auto; background:url(../img/bg-black.png); padding:15px 20px; color:#CCC; line-height:20px;}
.innercontent a{color:#CCC; te}
.contentleft{ float:left; width:200px;}
.contentleft ul{ list-style:none; margin-top:40px;}
.contentleft ul li{ border-bottom:solid 2px #333; line-height:30px;}
.contentleft ul li a{ color:#CCC;}
.contentleft ul li a:hover{ color:#e67817;}
.contentleft ul li a.active{ color:#e67817;}
.contentright{ float:right; width:700px; text-align:justify; font-size:14px;}
.contentright p{ margin:15px 0px;}
.tree{ margin:10px auto; width:960px;background:url(../img/bg-black.png); padding-left:20px; color:#CCCCCC; font-size:11px;}
.tree a{color:#CCCCCC; text-decoration:underline}
.title{ color:#e67817; font-size:25px; margin-bottom:25px; text-transform:uppercase; border-bottom:solid 2px #333; padding-bottom:5px;}

#form input, textarea{ background:#666; border:0px; padding:6px; -webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px; color:#FFF; width:300px;}
#form textarea{ width:500px;}
#form input.button{ width:100px; background:#e67817; cursor:pointer}

.list{ margin:0px; padding:0px; list-style:none; margin-top:6px;}
.list li{ background:url(../images/arrow.png) no-repeat left; padding-left:15px;}
.heading{ font-size:16px;}
h3{ margin: 10px 10px 0 10px; color:#FFF; font-size:12px; text-align:left;}
			
			.boxgrid{ 
				width: 200px; 
				height: 162px; 
				margin:14px; 
				float:left; 
				background:#161613; 
				border: solid 2px #000; 
				overflow: hidden; 
				position: relative; 
			}
				.boxgrid img{ 
					position: absolute; 
					top: 0; 
					left: 0; 
					border: 0; 
				}
				.boxgrid p{ 
					padding: 0 10px; 
					color:#afafaf;
					margin:0px;
				}
				.boxgrid p a{ 
					padding: 0 0px; 
					color:#d57817;
					margin:0px;
				}

			.boxcaption{ 
				float: left; 
				position: absolute; 
				background: #000; 
				height: 100px; 
				width: 100%; 
				opacity: .8; 
				/* For IE 5-7 */
				filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
				/* For IE 8 */
				-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
 			}
 				.captionfull .boxcaption {
 					top: 260;
 					left: 0;
 				}
 				.caption .boxcaption {
 					top: 220;
 					left: 0;
 				}
				
			h3 a{ font-size:14px;}
			
			
			
			
			
			
			
			
			
			
			
			
			
.big-link { display:block; color: #06f; }
.reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; background: rgba(0,0,0,.8); z-index: 100; display: none;
top: 0; left: 0;}
.reveal-modal {visibility: hidden; top:20%; bottom:20%; 
		left: 50%;
		margin-left: -300px; border:solid 1px #f37521;
		width: 520px; color:#CCC;
		background: #000 url(../images/modal-gloss.png) no-repeat -200px -80px;
		position: absolute;
		z-index: 101; height:200px;
		padding: 30px 40px 34px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-box-shadow: 0 0 10px rgba(0,0,0,.4);
		}
		
	.reveal-modal.small 		{ width: 300px; height:150px; margin-left: -140px;}
	.reveal-modal.medium 		{ width: 500px; height:200px; margin-left: -240px;}
	.reveal-modal.large 		{ width: 600px; height:200px; margin-left: -340px;}
	.reveal-modal.xlarge 		{ width: 600px; margin-left: -440px;}
.reveal-modal h3{ color:#CCC; margin:0px; padding:0px;}
	.reveal-modal .close-reveal-modal {
		font-size: 22px;
		line-height: .5;
		position: absolute;
		top: 8px;
		right: 11px;
		color: #f37521;
		text-shadow: 0 -1px 1px rbga(0,0,0,.6);
		font-weight: bold;
		cursor: pointer;
		} 

.tbl{width:650px;}
.tbl td{ background:#333; padding:3px 6px;}
.mr{ margin-right:20px;}













#picture{ position:relative; top:0px; width:700px; height:466px; margin:0px auto; background:#FFF url('../case-study/dbs/dbs-gf1.jpg'); overflow:hidden; }
.more{ position:absolute; width:20px; height:20px; padding:5px; text-align:left; overflow:hidden; }
.more span{ position:absolute; left:50px; width:80px; top:20px; padding-left:5px; color:#FFF; background:#000; font-size:11px; }

#monitor{ top:260px; left:530px; }
#board{ top:213px; left:645px; }
#p5{ top:150px; left:611px; }
#infobox{ position:absolute; bottom:-400px; left: 250px; height:420px; width:520px; z-index:20; margin:0 0 -220px -150px; background:#FFF; text-align:center; padding-top:10px;}
#infobox a, #infobox a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
#infobox a:hover{ text-decoration:underline; }
span.close{position:absolute; right:10px; top:10px; background:#666; padding:4px;}
#fade_bg{ position:absolute; z-index:15; width:100%; height:100%; background:url('../images/dim.png'); display:none;}


#picture2{ position:relative; top:0px; width:700px; height:511px; margin:0px auto; background:#FFF url('../case-study/dbs/ff/dbs-ff.jpg'); overflow:hidden; }
.more2{ position:absolute; width:40px; height:37px; padding:5px; text-align:left; overflow:hidden; }
.more2 span{ position:absolute; left:50px; width:80px; top:20px; padding-left:5px; color:#FFF; font-size:11px; background:#000; }
#ff01{ top:330px; left:390px;}
#ff02{ top:374px; left:300px;}
#ff03{ top:424px; left:300px;}
#ff04{ top:244px; left:300px;}
#ff05{ top:466px; left:175px;}
#ff06{ top:172px; left:523px;}
#ff07{ top:210px; left:553px;}
#ff08{ top:260px; left:529px;}
#ff09{ top:265px; left:589px;}
#infobox2{ position:absolute; bottom:-400px; left: 250px; height:420px; width:520px; z-index:20; margin:0 0 -220px -150px; background:#FFF; text-align:center; padding-top:10px;}
#infobox2 a, #infobox2 a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
#infobox2 a:hover{ text-decoration:underline; }
span.close{position:absolute; right:10px; top:10px; background:#666; padding:4px;}
#fade_bg2{ position:absolute; z-index:15; width:100%; height:100%; background:url('../images/dim.png'); display:none;}


#picture3{ position:relative; top:0px; width:700px; height:511px; margin:0px auto; background:#FFF url('../case-study/indosolar/indosolar-floors.jpg'); overflow:hidden; }
.more3{ position:absolute; width:40px; height:37px; padding:5px; text-align:left; overflow:hidden; }
.more3 span{ position:absolute; left:50px; width:80px; top:20px; padding-left:5px; color:#FFF; font-size:11px; background:#000; }
#ind01{ top:60px; left:10px;}
#ind02{ top:75px; left:166px;}
#ind03{ top:30px; left:75px;}
#ind04{ top:34px; left:360px;}
#ind05{ top:45px; left:320px;}
#ind06{ top:340px; left:300px;}
#ind07{ top:60px; left:30px;}
#ind08{ top:73px; left:120px;}
#ind09{ top:60px; left:0px;}
#ind10{ top:60px; left:100px;}
#ind11{ top:50px; left:210px;}
#ind12{ top:30px; left:260px;}
#ind15{ top:80px; left:335px;}
#ind17{ top:62px; left:370px;}
#ind18{ top:40px; left:630px;}
#ind20{ top:350px; left:95px;}
#ind21{ top:220px; left:360px;}
#ind22{ top:220px; left:200px;}
#infobox3{ position:absolute; bottom:-400px; left: 250px; height:420px; width:520px; z-index:20; margin:0 0 -220px -150px; background:#FFF; text-align:center; padding-top:10px;}
#infobox3 a, #infobox3 a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
#infobox3 a:hover{ text-decoration:underline; }
span.close{position:absolute; right:10px; top:10px; background:#666; padding:4px;}
#fade_bg3{ position:absolute; z-index:15; width:100%; height:100%; background:url('../images/dim.png'); display:none;}


#picture4{ position:relative; top:0px; width:700px; height:451px; margin:0px auto; background:#FFF url('../case-study/kotahouse/gf.jpg'); overflow:hidden; }
.more4{ position:absolute; width:40px; height:37px; padding:5px; text-align:left; overflow:hidden; }
.more4 span{ position:absolute; left:50px; width:80px; top:20px; padding-left:5px; color:#FFF; font-size:11px; background:#000; }
#kh401{ top:77px; left:60px;}
#kh402{ top:25px; left:25px;}
#kh404{ top:210px; left:345px;}
#kh406{ top:83px; left:560px;}
#kh407{ top:223px; left:210px;}
#kh409{ top:223px; left:240px;}
#kh410{ top:206px; left:280px;}
#kh411{ top:202px; left:360px;}
#kh412{ top:210px; left:410px;}

#infobox4{ position:absolute; bottom:-400px; left: 250px; height:420px; width:520px; z-index:20; margin:0 0 -220px -150px; background:#FFF; text-align:center; padding-top:10px;}
#infobox4 a, #infobox4 a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
#infobox4 a:hover{ text-decoration:underline; }
span.close{position:absolute; right:10px; top:10px; background:#666; padding:4px;}
#fade_bg4{ position:absolute; z-index:15; width:100%; height:100%; background:url('../images/dim.png'); display:none;}

















#picture5{ position:relative; top:0px; width:700px; height:448px; margin:0px auto; background:#FFF url('../case-study/kotahouse/ff.jpg'); overflow:hidden; }
.more5{ position:absolute; width:40px; height:37px; padding:5px; text-align:left; overflow:hidden; }
.more5 span{ position:absolute; left:50px; width:80px; top:20px; padding-left:5px; color:#FFF; font-size:11px; background:#000; }
#kh501{ top:78px; left:70px;}
#kh502{ top:25px; left:18px;}
#kh503{ top:390px; left:33px;}
#kh505{ top:205px; left:200px;}
#infobox5{ position:absolute; bottom:-400px; left: 250px; height:420px; width:520px; z-index:20; margin:0 0 -220px -150px; background:#FFF; text-align:center; padding-top:10px;}
#infobox5 a, #infobox5 a:visited{ font:italic 16px Georgia, serif; color:#555; text-decoration:none; }
#infobox5 a:hover{ text-decoration:underline; }
span.close{position:absolute; right:10px; top:10px; background:#666; padding:4px;}
#fade_bg5{ position:absolute; z-index:15; width:100%; height:100%; background:url('../images/dim.png'); display:none;}











.testimonials p{ float:left; width:140px; margin-right:30px; font-size:11px; text-align:center}