@import "classes.css";

html {margin:0; padding:0;}
body, td/*, p*/ {
	font-family: Verdana, Arial, helvetica, sans-serif;
	color: #000000;
	font-size: small;
	}
body {
	background-image:url(../../images/vgtemplate/bg-letterhead.gif);
	background-position:center;
	background-repeat:repeat-y;
	background-color:#D2D2FF;
	color: #000000;
	margin-top:130px;
	padding:0px;
	text-align:center;
	}
	
/* Styles for the "letterhead" frame */

a#skipnav {
	position:absolute;
	top:0;
	left:0;
	background-color:#FFFF00;
	z-index:101;
	height:0;
	width:0;
	overflow:hidden;
	}
a#skipnav:focus {
	width:auto;
	height:auto;
	}
	
#frametopdiv {
	position:fixed;
	height:120px;
	top:0;
	left:0;
	width:100%;
	text-align:center;
	z-index:100;
	}
img#frametop {
	position:relative; 
	z-index:100;
	width:868px;
	height:120px;
	max-height:120px;
	overflow:hidden;
	}
#framemoondiv { /*just for IE 6*/
	width:124px;
	height:21px;
	background-image:url(../../images/vgtemplate/moonbottom.png);
	position:absolute;
	left: 802px;
	top: 119px;
	display:none;
	}
#bodyframediv {
	position:fixed;
	top:120px;
	left:0;
	width:100%;
	text-align:center;
	z-index:10;
	}
#framerightdiv {
	width:868px;
	height:394px;
	margin:0 auto;
	background-image:url(../../images/vgtemplate/frame-stringright.png);
	background-position:right;
	background-repeat:no-repeat;
	}
div#framebotdiv {
	position:fixed;
	top:514px;
	left:0;
	width:100%;
	text-align:center;
	z-index:100;
	height:686px;
	background-image:url(../../images/vgtemplate/frame-stringbottom.png);
	background-position:center;
	background-repeat:no-repeat;
	}
#bodydiv {
	width:725px;
	margin-left:auto; margin-right:auto;
	margin-bottom:100px;
	position:relative;
	z-index:11;
	/*left:-50px; if the window isn't wide enough, part of the left edge is cut off. So I added the right padding to fix the width*/
	padding-right:100px;
	text-align:left;
	}
#bodydiv>*:first-child {margin-top:5px !important;}

/* General Text Styles */
a:link {
	color: #3d3dbd;
	text-decoration:underline;
	}
a:visited {
	color: #5d5dcd;
	text-decoration: none;
	}
a:hover {
	color: #5d5dcd;
	text-decoration: none;
	}
H1>a:link, H2>a:link, H3>a:link, H4>a:link, H5>a:link, H6>a:link {text-decoration:none;}
H1>a:hover, H2>a:hover, H3>a:hover, H4>a:hover, H5>a:hover, H6>a:hover {text-decoration:underline;}
H1 { /*H1 is so styled to hide it underneath the banner image*/
	position:relative; 
	font-size:24px; 
	line-height:24px; 
	top:-120px; 
	z-index:0;
	}
H2, H3, H4, H5, H6 {
	color:#3d3dbd;
	margin:0;
	}
H2 {font-size:150%;}
H3 {font-size:130%;}
H4 {font-size:110%;}
H5 {font-size:100%;}
H6 {font-size:85%;}
OL {margin-top:0; margin-bottom:0;}
UL {margin-top:0; margin-bottom:0;}
p {margin:1.8ex 0;}
p:first-child {margin-top:0;}