body	{ font-family: Verdana, arial, helvetica, sans-serif; font-size:12px; margin:20px; padding:0; color: white; background-color: black}
h1	{ font-size:16px }	
h2	{ font-size:14px }
a:link { color: yellow; text-decoration:none }	
a:visited { color: yellow; text-decoration:none }	
a:active { color: red; text-decoration:none }
a:hover { color: red; text-decoration:none }
a.mp3:link { color: yellow; text-decoration:none; font-size:12}
a.mp3:hover { color: red; text-decoration:none; font-size:12}
a.mp3:visited { color: yellow; text-decoration:none; font-size:12}
a.mp3:active { color: red; text-decoration:none; font-size:12}
@media all {
	h1,	h2, p { margin:0 0 .8em 0 }
}



legend { font-family: Verdana, arial, helvetica, sans-serif;  
	font-size:18px; bold; margin:10px; padding:10; color: white; }

.tableRollOverEffect1{
		background-color:#8F8D8D; 
	background:url("gfx/menu_highlight2.gif") no-repeat;
		color:#FFF;
	}

	.tableRollOverEffect2{
		background-color:#000;
		color:#FFF;
	}
	
	.tableRowClickEffect1{
		background-color:#393838;
			background:url("gfx/menu_highlight2.gif") no-repeat;
		color:#FFF;
	}
	.tableRowClickEffect2{
		background-color:#00F;
		color:#FFF;
	}
	
/* Include id's for all your layers here, with commas between. 
	 Set width, left and top */
#lyr1, #lyr2, #lyr3, #lyr4, #lyr5, #lyr6, #lyr7, #lyr8 { position:absolute; visibility:hidden; 
	left:240px; top:220px; width:500px; z-index:100 }

#menu {
  background: white;
  position: absolute;
  float: left;
  top: 0px;
  left: 0px;
  width: 200px;
  height: 100%;
}
#content {
  background: #14326f;
  position: absolute;
  top: 0px;
  left: 200px;
  width: 100%;
  height: 100%;
}