/*   Author: Trey Martindale    Author URI: http://teachable.org/   */

body {       /* sets the "base" of the page. No margins or padding. Text size 100%  */
	margin: 0;
	padding: 0; 
	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
	font-size: 100%;
	background-color: #d5d6d7;  /* gray */
	text-align: center;   /* IE fix, I think. */
	}

#wrapper {
	width: 770px;
	background-color:#FFFFFF;
	margin: 10px auto 10px auto;
	padding: 0;
	border: 2px solid #959596;
	text-align: left;
	}
	
#banner {
 	padding: 10px 0 10px 0;  /* for some reason this 10 px fixed the mysterious white at top. */
	margin: 0;
	height: 70px;
	/* width: 100%;   is this necessary?  */
	background-color: #003399;
	}
	
#banner p {
	margin: 0 20px;
	padding: 0;
	text-align: right;
	font-size: 90%;
	color: #FFFFFF;
	}

#nav {  border-bottom: 5px solid #000000; /* background-color: #00FF99   for testing layout */}
#nav ul{ padding: 0; margin: 0; background-color: #003399; }
#nav ul li{ display: inline; padding: 0; margin: 0;}
#nav ul li a{ 
	font-size: 100%;
	color: #003399;
	background-color: #FFFFFF;
	text-decoration: none;
	padding: 0 10px 0 10px;
	text-align: center;
	 /*   width: 3em;  what is this?  */
	}
#nav ul li a:hover, #nav ul li a:focus{
	color: #000000;
	text-decoration: none;
	background-color: #FFFF33;
	}

#content p{ font-size: 100%; margin: 0 20px 20px 20px; }
#content ol{ font-size: 100%; margin: 0 20px 20px 20px; }
#content ul{ font-size: 100%; margin: 0 20px 20px 20px; }
#content table{ margin: 0 20px 20px 20px; }

#footer {
	padding: 0;
	margin: 0;
	height: 40px;
	background-color: #003399;
	}

#footer p {
	margin: 0 20px;
	padding: 0;
	text-align: left;
	font-size: 100%;
	color: #FFFFFF;
	}

h1, h2, h3, h4, .bigtitle{
	font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
	font-weight: bold;
	}
	
.bigtitle {
	text-align: left;
	font-size: 220%;
	padding: 0;
	margin: 20px;
	}
.bigtitle a { color: #FFFFFF; }
.bigtitle a:hover { color: #FFFF33; background-color: transparent; text-decoration:none; }

	
h1 {
	font-size: 180%;
	padding: 0;
	margin: 20px;
	text-align: left;
	}

h2 {
	font-size: 140%;
	margin: 20px;
	padding: 0;
	text-align: left;
	}

h3 {
	font-size: 120%;
	margin: 20px;
	padding: 0;
	text-align: left;
	}
h4 {
	font-size: 100%;
	margin: 20px;
	padding: 0;
	text-align: left;
	}
a {
	color: #0033CC;
	text-decoration: none;
	font-weight: bold;
	}

a:hover {
	color: #000000;
	background-color:#FFFF33;
	text-decoration: none;
	font-weight: bold;
	}

/* Begin Various Tags & Classes */

blockquote {
	margin: 15px 25px 15px 25px;
	font-size: 80%;
	}
/* End Various Tags & Classes*/