.inside
  /* .inside holds style information relative to all the main content areas of
   * the site.
   */       
{
	/* glitch in IE caused by vertical padding in this class, so 0 padding is
		* set here and those blocks that need the vertical padding must be 
		* applied to the parent element. the purpose of this class is to provide
		* horizontal padding without using hacks to get around IE's broken box 
		* model. so it's okay to apply vertical padding to the parent element, 
		* just not horizontal padding.
		*/
	padding: 0 1em;
}

.inside li	
  /* .inside li deals with all the style information for list items used in
   * the main content areas that are connected with the .inside style.
   */   
{ 
	list-style-type: square; 
	color: #000000; 
  font-family: Verdana,Arial,sans-serif; 
	line-height:1.5; 
}

.inside p	
  /* .inside p deals with all the style information for paragraphs used in the
   * main content areas that are connected with hte .inside style.
   */   
{ 
	color:#000000; 
	font-family:Verdana,Arial,sans-serif; 
	line-height:1.5; 
}

body 
{
  /* This is where you can alter the background color for the website.  It is 
   * currently set to White.
   */   
  background-color: #ffffff;
}

body,td,th 
{
  /* This is where you can alter the font type, ie- Arial, Times New Roman, etc. */
	font-family: Arial, Helvetica, sans-serif;
  /* This is where you can alter the size of the main text */
	font-size: 11px;
	/* This is where you can alter the color of the main text */
	color: #000000;
}

ul, ol, dl, p, h1, h2, h3, h4, h5, h6, 
{
	margin-top: 5px;
	margin-bottom: 0px;
	padding-top: 0;
	padding-bottom: 0;
}

/* The following section deals with the Header Lines H1 through H6.  If you
 * want to change the appearance of the Header Lines, this is the place to do
 * it
 */  

h1 
{
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 200%;
	color: #006666;
}

h2 
{
	padding-top:7px;
	padding-bottom: 7px;
	font-size: 180%;
	color: #006666;
}

h3 
{
	padding-top: 5px;
	padding-bottom: 5px:
	font-size: 160%;
	color: #006666;
}

h4 
{
	font-size: 140%;
	color: #006666;
}

h5
{
	font-size: 120%;
	color: #006666;
}

h6
{
	font-size: 100%;
	color: #006666;
}

/* The following section deals with some page layout itmes and styles. */

#pageWrapper {
	border: solid 0px #fff;
	margin: 0 5%;		/* set side margins here 'cause IE doesn't like it set on the body element */
	min-width: 779px;	/* IE doens't understand this property. I use ems rather
				   than pixels so that the layout shouldn't break even
				   when the browser's default size is set very large -- 40em */
	width: auto;
}		
#outerColumnContainer 
{
	/* reserves space for the left and right columns. you can use either
	* padding, margins, or borders, depending on your needs. however you 
	* can use the border method to create a background color for both left
	* and right columns
	*/
	border-left: solid 14em #eee;	/* left column background color */
	border-right: solid 14em #eee;	/* right column background color */
}
#innerColumnContainer 
{
	border: solid 1px #fff;
	border-width: 0 1px; /* Right Column*/
	margin: 0 -1px;		 /* compensate for the borders because of 100% width declaration */
	width: 100%;
	z-index: 1;
}
/* clearfix from PIE */
#innerColumnContainer:after 
{
	content: "."; 
	display: block; 
	height: 0%; /* Need the percent sign there for Firefox for some reason */
	clear: both; 
	visibility: hidden;
}
#innerColumnContainer {display: inline-table;}
	/* Hides from IE-mac \*/
#innerColumnContainer {display: block;}
	/* End hide from IE-mac */
#leftColumn, #middleColumn, #rightColumn, #SOWrap {
	overflow: visible;	/* fix for IE italics bug */
	position: relative;	/* fix some rendering issues */
}
#SOWrap 
{
	float: left;
	margin: 0 -1px 0 0;
	width: 100%;
	z-index: 3;
}
#middleColumn 
{
	float: right;
	margin: 0 0 0 -1px;
	width: 100%;
	z-index: 5;
	border-left: solid 1px #000000;
	border-right: solid 1px #000000;
}
#leftColumn 
{
	float: left;
	margin: 0 1px 0 -14em;
	width: 14em;
	z-index: 4;
}
#rightColumn 
{
	float: right;
	width: 14em;
	margin: 0 -14em 0 1px;
	z-index: 2;
	vertical-align: bottom;
}

#row3 {
  /* This is how the logo image is displayed on the website.  If you need to 
   * change any information in the logo, you need to edit the logo2.jpg file.
   * Because the image is displayed through the stylesheet, once you save the 
   * changes to the image, it will automatically update to all the pages on the 
   * site.  Also, if you wish to change to a different logo image, here is where 
   * you would make that change.
   */               
	background: #ffffff url("images/logo2.jpg") no-repeat bottom left;
	background-repeat: no-repeat;
	height: 110px;
}
a#websiteLogo, a#websiteLogo:visited, a#websiteLogo:hover {
	display: block;
	width: 250px;
	height: 100px;
	padding 0; margin: 0;
	letter-spacing : -1000em;
}

/* alter some HTML elements' default style*/
a, a:link, a:visited, a:active { text-decoration: underline; }
a:hover { text-decoration: none; }
a img { border: none; }
code { font-family: "Courier New", Courier, monospace; }
label { cursor: pointer; }
table { font-size: 100%; }
td, th { vertical-align: top; }

/* horizontal navigation stuff. mostly exactly as seen in the hnav.css stylesheet */
.hnav 
{
	border-top: solid 1px #000000;
	border-bottom: solid 1px #000000;
	border-left: solid 0px #000000;
	border-right: solid 1px #000000;
	margin: 0;
	padding: 3px 0 4px 0;
	white-space: nowrap;
	background-color: #006666;
	color: #fff;
}
.hnav ul span.divider { display: none; }
* html .hnav/* Hide from IE5/Mac (& IE5.0/Win) */
{
	height: 0.01%;	/* holly hack to fix a render bug in IE6/Win */
}
* html .HNAV 
{
	height: auto;	/* above IE6/Win holly hack breaks IE5/Win when page 
			   length get beyond the point that 1% height is taller 
			   than the text height. IE5/Win does not need this 
			   holly hack so we remove it here */
	padding: 0;	/* IE5/Win will resize #hnav to fit the heights of its
			   inline children that have vertical padding. So this
			   incorrect case selector will remove that padding */
}
.hnav ul 
{
	text-align: left;
	list-style-type: none;
	line-height: normal;
	margin: 0;
	padding: 0;
}
.hnav ul li 
{
	display: inline;
	white-space: nowrap;
	margin: 0;
}
.hnav ul li a, .hnav ul li a:link, .hnav ul li a:visited, .hnav ul li a:active 
{
	text-decoration: none;
	margin: 0 -1px 0 0;
	padding: 3px 10px 4px 10px;
	border-left: solid 1px #000;
	border-right: solid 1px #000;
	background-color: #006666;
	color: #ffffff;
}
* html .HNAV ul li a 
{
	/* \*/
	width: 1%;
	/* holly hack for IE5/Win inline padding. this hack fixes different 
	* rendering bugs in 5.0 and 5.5. Width is used instead of height 
	* because if the document is too long, these elements become very tall
	* and disrupt the look of the document. too wide an element is better, 
	* visually, than too tall. */
}
.hnav ul li a:hover 
{
	text-decoration: none;
	background-color: #666666;
	color: #ffffff;
} 
/* vertical navigation stuff. mostly exactly as seen in the vnav.css styleheet */
	.vnav
{
	margin: -1px 0;
}
.vnav ul, .vnav ul li
{
	margin: 0;
	padding: 0;
	list-style-type: none;
	display: block;
}
.vnav ul
{
	border: solid 1px #fff;
	border-bottom-width: 0;
}
.vnav ul li
{
	border-bottom: solid 1px #fff;
}
.vnav ul li a
{
	display: block;
	text-decoration: none;
	padding: 2px 10px;
	color: #ffffff;
	background-color: #666666;
}
.vnav ul li a, .vnav ul li a:link, .vnav ul li a:visited, .vnav ul li a:active 
{
	text-decoration: none;
	margin: 0 -1px 0 0;
	color: #ffffff;
}
* html .vnav ul li a/* hide from IE5.0/Win & IE5/Mac */
{
	height: 0.01%;
}		
* html .vnav ul
{
	position: relative;	/* IE needs this to fix a rendering problem */
}
.vnav h3
{
	margin-bottom: 0;
	padding-bottom: 0;
	font-size: 126%;
}
.vnav ul li a:hover {
	text-decoration: none;
	background-color: #006666;
	color: #ffffff;
}		
#pageWrapper
/****************************** PAGE WIDTH DETERMINED HERE **************************************************/
{
	font-size: 100%;	/* set your default font size here. */
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
/****************************** PAGE WIDTH DETERMINED HERE **************************************************/
#rightColumn .inside
{
	/* if you apply a font size to just #rightColumn, then its width,
	 * which is specified in EMs, will also be affected. you don't want
	 * that. so apply font size changes to the .inside element which exists
	 * inside underneath all three columns
	 */
	font-size: 90%;
}
#footer {
	border: solid 1px #fff;
	border-width: 0px 0;
	border-bottom: solid 0px #000000;
	padding: 0.5em;
	background-color: #006666;
	color: #ffffff;
	text-align: center;
}
#footer img { float: left; }