BODY { position: relative; min-width: 600px; width: 100%; margin: 0; padding: 0; border: none; background: #000000 }
#top {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 600px;
	width: 100%;
	padding-bottom: 1%;
}
#left {
	position: absolute;
	top:100px;
	left: 0px;
	width: 20%;
	margin-top: 1%;
	background-position: center;
	height: 8000px;
	padding-top: 1%;
}
#middle {
	width: 780px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	border: 1px solid #000000;
	padding: 2%;
	text-align: left; /* this overrides the text-align: center on the body element. */	
	top:100px;
	background-color: #FFFFFF;
}
#right {
	position: absolute;
	top:100px;
	left: 80%;
	width: 20%;
	margin-top: 1%;
	background-position: center;
	height: 6000px;
	padding-top: 1%;
}

textarea {background:#B3B3D7;}
input {background:#B3B3D7;}

/* Form styles */
div.form-container { margin: 10px; padding: 5px; background-color: #FFF; border: #EEE 0px solid; }

p.legend { margin-bottom: 1em; }
p.legend em { color: #C00; font-style: normal; }

div.errors { margin: 0 0 10px 0; padding: 5px 10px; border: #FC6 1px solid; background-color: #B3B3D7; }
div.errors p { margin: 0; }
div.errors p em { color: #C00; font-style: normal; font-weight: bold; }

div.form-container form p { margin: 0; }
div.form-container form p.note { margin-left: 170px; font-size: 90%; color: #333; }
div.form-container form fieldset { margin: 10px 0; padding: 10px; border: #DDD 1px solid; }
div.form-container form legend { font-weight: bold; color: #666; }
div.form-container form fieldset div { padding: 0.25em 0; }
div.form-container label, 
div.form-container span.label { margin-right: 10px; padding-right: 10px; width: 150px; display: block; float: left; text-align: right; position: relative; }
div.form-container label.error, 
div.form-container span.error { color: #660033; }
div.form-container label em, 
div.form-container span.label em { position: absolute; right: 0; font-size: 120%; font-style: normal; color: #C00; }
div.form-container input.error { border-color: #660033; background-color: #B3B3D7; }
div.form-container input:focus,
div.form-container input.error:focus, 
div.form-container textarea:focus {	background-color: #FFC; border-color: #FC6; }
div.form-container div.controlset label, 
div.form-container div.controlset input { display: inline; float: none; }
div.form-container div.controlset div { margin-left: 170px; }
div.form-container div.buttonrow { margin-left: 170px; }

.title { font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: bold; color: #000000} 
.bullet { list-style-type: square;  text-decoration: none; line-height: 16px} 
.text { font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 16px; line-height: 18px; color: #000000; clip:   rect(   )} 
.menutext { font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #FFFFFF; text-decoration: none; line-height: 16px; font-weight: normal} 
.subtitle { font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #666666; font-weight: bold; text-decoration: none}
.menusubtitle { font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #000000; text-decoration: none; font-weight: bold} 
.menutext:hover {  font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color: #000000; text-decoration: none; font-weight: normal; font-size: 10px} 
.bulletmenu { list-style-type: disc; left: -20px; clip:   rect(   ); position: relative; }
.footer { font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 9px; color: #666666; text-decoration: none; vertical-align: middle}
.titlelink { font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size: 20px;} 

a:link { color: #660033; text-decoration: none; font-weight:bold;}
a:visited { color: #660033; text-decoration: none; font-weight:bold;} 
a:hover { color: #B3B3D7; text-decoration: none; font-weight:bold;} 

table.girl {
	border-width: 2px 2px 2px 2px;
	border-spacing: 0px;
	border-style: solid solid solid solid;
	border-color: #AA0078 #AA0078 #AA0078 #AA0078;
	border-collapse: separate;
}

table.girl th {
	border-width: 0px 0px 0px 0px;
	padding: 3px 3px 3px 3px;
	border-style: inset inset inset inset;
	border-color: gray gray gray gray;
	-moz-border-radius: 0px 0px 0px 0px;
}
table.girl td {
	border-width: 0px 0px 0px 0px;
	padding: 3px 3px 3px 3px;
	border-style: inset inset inset inset;
	border-color: gray gray gray gray;
	-moz-border-radius: 0px 0px 0px 0px;
}

table.boy {
	border-width: 2px 2px 2px 2px;
	border-spacing: 0px;
	border-style: solid solid solid solid;
	border-color: #000078 #000078 #000078 #000078;
	border-collapse: separate;
}
table.boy th {
	border-width: 0px 0px 0px 0px;
	padding: 3px 3px 3px 3px;
	border-style: inset inset inset inset;
	border-color: gray gray gray gray;
	-moz-border-radius: 0px 0px 0px 0px;
}
table.boy td {
	border-width: 0px 0px 0px 0px;
	padding: 3px 3px 3px 3px;
	border-style: inset inset inset inset;
	border-color: gray gray gray gray;
	-moz-border-radius: 0px 0px 0px 0px;
}

img.bgirl {
   padding:2px;
   border:2px solid #AA0078;
   background-color:white;
}

img.bboy {
   padding:2px;
   border:2px solid #000078;
   background-color:white;
}