body {
	margin: 0;
	padding: 0;
	background-color: #333300;
	font-family: verdana, helvetica, sans-serif;
	color: #FFFFFF;
	}
ul {
	list-style: square;
	}
a {
	color: #FF6600; 
	text-decoration: underline;
	background-color: transparent;
	}
a:hover {
	color: #000000; 
	text-decoration: none; 
	background-color: #FF6600;
	}
#titlebox {
	width: 750px;
	position: absolute; 
	left: 50%;
	top: 10px;
	margin-left: -375px;
	background-color: #333300;
	font-family: verdana, helvetica, sans-serif;
	font-size: 11px;
	letter-spacing: 1px;
	line-height: 20px;
	text-align: right;
	z-index: 5;
	}
#linksbox {
	width: 750px;
	position: absolute; 
	left: 50%;
	top: 100%;
	margin-left: -375px;
	margin-top: -30px;
	background-color: #333300;
	font-family: verdana, helvetica, sans-serif;
	font-size: 11px;
	letter-spacing: 1px;
	line-height: 20px;
	text-align: left;
	z-index: 6;
	}
#wrapper {
	background-image: url(images/turtles.jpg);
	width: 750px;
	height: 400px;
	position: absolute; 
	left: 50%;
	top: 50%;
	margin-left: -375px;
	margin-top: -200px;
	z-index: 1;
	}
/* First, the box's left edge is positioned at the horizontal center of 
the page using "position: absolute; left: 50%;". Then, the box's left margin 
is set to the opposite of half the box's width using "margin-left: -375px;". */
#wrapper2 {
	background-image: url(images/turtles2.jpg);
	width: 750px;
	height: 400px;
	position: absolute; 
	left: 50%;
	top: 50%;
	margin-left: -375px;
	margin-top: -200px;
	z-index: 1;
	}
#introbox {
	width: 255px;
	position: absolute; 
	left: 460px;
	top: 10px;
	padding: 10px 10px 10px 15px;
	background-color: #FFFFFF;
	color: #000000;
	border: 1px solid #333333;
	font-family: verdana, helvetica, sans-serif;
	font-size: 11px;
	letter-spacing: 1px;
	line-height: 22px;
	text-align: left;
	z-index: 2;
	}
#texts {
	width: 270px;
	height: 330px;
	overflow: auto;
	position: absolute; 
	left: 20px;
	top: 20px;
	padding: 10px 10px 10px 15px;
	background-color: #CCCC99;
	color: #000000;
	border: 1px solid #333333;
	font-family: verdana, helvetica, sans-serif;
	font-size: 11px;
	letter-spacing: 1px;
	line-height: 22px;
	text-align: left;
	z-index: 2;
	scrollbar-3dlight-color: #CCCCCC;
	scrollbar-arrow-color: #333333;
	scrollbar-base-color: #333333;
	scrollbar-darkshadow-color: #333333;
	scrollbar-face-color: #CCCC99;
	scrollbar-highlight-color: #333333;
	scrollbar-shadow-color: #333333;
	scrollbar-track-color: #999999;
	}
#assess {
	width: 270px;
	height: 330px;
	overflow: auto;
	position: absolute; 
	left: 20px;
	top: 20px;
	padding: 10px 10px 10px 15px;
	background-color: #996633;
	color: #FFFFFF;
	border: 1px solid #FFFFFF;
	font-family: verdana, helvetica, sans-serif;
	font-size: 11px;
	letter-spacing: 1px;
	line-height: 22px;
	text-align: left;
	z-index: 2;
	scrollbar-3dlight-color: #CCCCCC;
	scrollbar-arrow-color: #FFFFFF;
	scrollbar-base-color: #FFFFFF;
	scrollbar-darkshadow-color: #663300;
	scrollbar-face-color: #996633;
	scrollbar-highlight-color: #CC9966;
	scrollbar-shadow-color: #FFFFFF;
	scrollbar-track-color: #999999;
	}
#sked {
	width: 270px;
	height: 330px;
	overflow: auto;
	position: absolute; 
	left: 20px;
	top: 20px;
	padding: 10px 10px 10px 15px;
	background-color: #999933;
	color: #FFFFFF;
	border: 1px solid #FFFFFF;
	font-family: verdana, helvetica, sans-serif;
	font-size: 11px;
	letter-spacing: 1px;
	line-height: 22px;
	text-align: left;
	z-index: 8;
	scrollbar-3dlight-color: #FFFFFF;
	scrollbar-arrow-color: #FFFFFF;
	scrollbar-base-color: #FFFFFF;
	scrollbar-darkshadow-color: #666666;
	scrollbar-face-color: #999933;
	scrollbar-highlight-color: #666666;
	scrollbar-shadow-color: #666666;
	scrollbar-track-color: #999999;
	}