body {
	margin: 0;
	border: 0;
	padding: 0;
	height: 100%; 
	max-height: 100%; 
	font-family: "Lucida Grande", arial, verdana, sans-serif; 
	font-size: 8pt;
	overflow: hidden; 
	color:#cccccc; 
}
  
#navigation {
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 231px; 
	height: 100%; 
	overflow:hidden; 
	background: url('images/bg-nav.gif') repeat;
}
  
#content {
	position:absolute; 
	top: 0;
	bottom: 0;
	left: 231px; 
	right: 0;
	padding-top: 20px;
	padding-right: 40px;
	padding-left: 20px;
	height: 100%; 
	overflow: auto; 
	background: url('images/bg-content.gif') repeat;
}

#panorama {
	position: absolute; 
	bottom: 10px;
	}

/* BOXES */
.boxgrid{ 
	width: 200px; 
	height: 160px; 
	margin: 10px; 
	float:left; 
	background:#161613; 
	border: solid 1px #000000; 
	overflow: hidden; 
	position: relative; 
}

.boxgrid img{ 
	position: absolute; 
	top: 0; 
	left: 0; 
	border: 0; 
}
.boxgrid p{ 
	padding-left: 10px; 
	color: #afafaf; 
	font-weight: bold; 
	font: 8pt "Lucida Grande", Arial, sans-serif; 
}

.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: 160;
	left: 0;
}
.caption .boxcaption {
	top: 120;
	left: 0;
}

a { 
color:#cccccc; 
border: 0;
}

img {
border: 0;
}

#subhead {
color:#FFF;
font: 12pt "Lucida Grande", Arial, sans-serif; 
letter-spacing:-1px;
}

.subhead {
color:#FFF;
font: 12pt "Lucida Grande", Arial, sans-serif; 
letter-spacing:-1px;
}


#controls, #output {
float: right;
}

#desc {
color:#cccccc;
width: 700px;
position: relative; 
top: 10px;
padding-bottom: 20px;
}

#about {
color:#cccccc;
width: 400px;
position: relative; 
top: 10px;
padding-bottom: 20px;
}


#filler {
float: left;
height: 220px;
}

#view {
position: absolute;
top: 360px;
left: 870px;
z-index: 5;
}

#back {
position: absolute;
top: 0;
left: 0;
z-index: 5;
}