/* reset browser styles */
html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote {
 padding: 0;
 margin: 0;
 font-size: 100%;
 font-weight: normal;
}
ol { 
  margin-left: 1.4em; 
  list-style: decimal; 
}
ul { 
  margin-left: 1.4em; 
  list-style:square; 
}
img {
  border: 0;
}
/* end reset browser styles */

body {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #FFF;
	background-color: #000;
	font-size: .8em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.5em;
}
#container {
	width: 958px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #000000;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	margin-top:20px;
	border: 1px solid #000000;
	text-align: left; /* this overrides the text-align: center on the body element. */
}
#header {
	width: 958px;
	background: #DDDDDD;
	background-image:url(images/header.jpg);
	height:168px;
}
#mainContent {
	width: 958px;
	background-image:url(images/background.jpg);
	float:left;
}
#footer {
	width: 958px;
	background-image:url(images/footer.jpg);
	background-repeat:no-repeat;
	float:left;
	height:55px;
	text-align: center;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#menuBar {
	width:132px;
	height:185px;
	float:left;
	margin:4px;
}

#bodyArea {  /* this area is on inner pages, not the front. It's full width. The front page needs to be divided to allow for the What's Hot area */
	margin-left:160px;
	margin-top:20px;
	width: 760px;
	
	margin-bottom:60px;
}
		  
#frontBodyArea {  /* this area is on front pages, not the inner pages. It's half width to allow for the What's Hot area */
	margin-left:20px;
	margin-top:20px;
	margin-bottom:60px;
	width: 350px;
	float:left;
	/* the background for this div is a single vertical line. It will run along the right side and act as a divider between this column and the next */
	/* so the images is positioned to the right, and only repeats in the y direction (up and down) */
	background-image:url(images/VertLine.jpg);
	background-position:right;
	background-repeat:repeat-y;
	padding-right:20px;
}
#whatsHot {    
	margin-left:20px;
	margin-top:40px;
	width: 330px;
	float:left;
}
#leftColumn {  /* this area is used on pages that need two columns in the bodyArea div  */
	width: 400px;
	float:left;
	margin-bottom:100px;
	margin-left:50px;
}

#rightColumn {  /* this area is used on pages that need two columns in the bodyArea div  */
	width: 300px;
	float: left;
	margin-bottom:100px;
}



.footerText {
	color:#cccccc;
	font-family: Arial, Helvetica, sans-serif;
	font-size: .9em;
	line-height: 1.5em;
}
.floatImageLeft {
	float: left;
	margin-right: 10px;
	margin-bottom: 5px;
}
h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 2em;
	line-height: 2em;
	font-weight: bold;
	color: #ffffcc;
}
.coloredHeadings {
	color: #FF9;
}


.iFrameFormatting {
	border: medium inset #999;
}

table {
	text-align: center;
}

CAPTION.MYTABLE
  {
     background-color:#553c31;
     color:white;
	 font-size:1em;
     border-style:solid;
     border-width:2px;
     border-color:black;
  }

  TABLE.MYTABLE
  { 
     font-family:arial;
     font-size:10pt;
     background-color:#c5c5c5;
     width:500px;
     border-style:solid;
     border-color:black;
     border-width:2px;
  }

  TH.MYTABLE
  {
     font-size:10pt;
     background-color:black;
     color:white;
  }


  TR.MYTABLE
  { 
  }

  TD.MYTABLE
  {  
     font-size:10pt;
     background-color:#cccccc;
     color:black;
     border-style:solid;
     border-width:1px;
     text-align:center;
  }

a:link {
	color: #99ccff;
}
a:visited {
	color: #99ccff;
}