/*=============== BEGIN MENU ====================*/

#menu {
	width: 220px;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #84caec;
	color: #0b4c74;
	font-size: 12px;
	float: right;
	margin-top: 5px;
	margin-bottom: 5px;
	}

/*The first rule is for the #menu DIV. It defines the space that the menu will occupy, and provides a context for the menu so that we can define the way the list and links will behave inside the DIV. I chose to make the menu fluid, based on the browser’s font size preferences, so (almost) all units are in ems. This includes the width of the menu. The solid black border on the right was based on the original design from Michael. The bottom padding is there to extend the DIV down beyond the menu of links so that you can see the background of the DIV. Again, this follows the original design. The bottom margin is to separate the DIV from what follows it. The colors came from the original design.
*/
	#menu ul, #menu ul li ul {
		list-style: none;
		margin: 0;
		padding: 0;
		border: none;
		}
		
	#menu li, #menu ul li ul li {
		border-bottom: 1px solid #1fa0da;
		margin: 0;
		}
		
	#menu ul li ul {
		border-top: 1px solid #1fa0da;
		margin: 0;
		}

/*Next I defined what the list will look like. Since all the list items were to be links, and the rollover functionality would be built into the CSS for the links, I essentially removed all styling from the lists. I did add a single pixel border on the bottom of each link that matched the background of the #menu DIV, to work as the separator. In the original design, this was an image.
*/
	#menu li a {
		display: block;
		padding: 6px 5px 6px 15px;
		_padding: 6px 5px 6px 15px;
/*		border-left: 10px solid #1E415B;
		border-right: 10px solid #508fc4;*/
		background-color: #84CAEC;
		color: #0b4c74;
		text-decoration: none;
		width: 100%;
		}
	#menu ul li ul li a {
	background-color:#cedfe8;
	}

	html>body #menu li a {
		width: auto;
		}

	#menu li a:hover {
/*		border-left: 10px solid #45acd8;
		border-right: 10px solid #5ba3e0;*/
		background-color: #0E7EB0;
		color: #fff;
		}
	#menu ul li ul li a:hover {
	background-color:#a9d5ea;
	color: #0B4C74;
	}

#menu li a.active {
/*		border-left: 10px solid #1c64d1;
		border-right: 10px solid #5ba3e0;*/
		background-color: #1E415B;
		color: #fff;
		}
		
/*=============== END MENU ====================*/