@charset "utf-8";
/* CSS Document */
/*--------------Vertical Navigation ----------------*/
 
#navigation{
	width: 100%;
	display:block;
	margin-top: 0em;
}
#navigation ul {
	margin: 0px;
	padding:0;
	list-style-type: none;
	text-align: center;
}
#navigation ul li{
	display: block;
	height:45px;
	text-align: center;
	list-style: none;
	margin-top: 30px;
	width: 150px;
}
/*The ul li is where you set the height of your box for the navigation.  If you are applying an image to go underneath
the li make the box approximately the same height as the image.  There you will also have to set a top maring so 
the images aren't on top of each other. */
#navigation ul li a{
	text-decoration:none;
	color: #FFFFFF;
	height:46px;
	display:block;
	background: url(images/woodbtnhvr.png) no-repeat center center;
	font: bold 18px "Times New Roman", Times, serif;
	border:0;
	padding: 18px 0px 0px;
	width: 150px;
}

/*The ul li a is where you want to put your padding in for your text so that is lies directly over the image*/
/*#navigation li#active a {
	color:#333333;
	text-decoration: none;
	display:block;
	font-weight: bold;
	text-transform: uppercase;
}
 */
 
#navigation a:hover {
	color:#FFFFFF;
	display: block;
	background: url(images/woodbtndark.png) no-repeat center center;
}
/*dont' add any font sizes in the a:hover area.  It will conflict with the ul li a and cause your images ot move. let the ul li a direct the size of the font*/
/*--------------Horizontal Navigation ----------------*/
 
#navbar{
	width: 100%;
	height: 5em;
	background-color: #708dab;
	padding: 0;
	border: 0;	 
	 
}
#navbar ul {
	border: 0;
	margin: 0px 1px 0px 0px;
	padding: 0 0 0px;
	list-style-type: none;
	text-align: center;
}
#navbar ul li {
	display: block;
	float: left;
	text-align: center;
	padding: 0;
	margin: 0;
}

#navbar ul li a {
	width: 108px;
	height: 3em;
	padding: 0;
	border-right: 2px solid #708dab;
	color: #fff;
	text-decoration: none;
	display: block;
	text-align: center;
	background-color: #993300;

}

#navbar ul li a:hover {
	color:#07257D;
	background-color: #DFEADF; 	
}

#navbar a:active {
	background-color: #eeeadd;
	color: #000;
}
#navbar li#active a {
	background: #eeeadd;
	color: #000;
}
