/*This css covers the basic structure and behavior of a vertical flyout navigation...*/
/*Which means it shouldn't need to much changing*/

/*WARNING: Don't use li elements for styling instead display:inline your li elements*/
/*If you want extra styling then wrap the a tag in other div elements then style those elements*/

ul#nav_body,
ul#nav_body a,
ul#nav_body li,
ul#nav_body ul{/*turn off all the default setting for 'a','li',and 'ul' tags*/
	padding: 0px;
	margin: 0px;
	border: 0px;
}

ul#nav_body li{
	display: inline;
}

ul#nav_body,
ul#nav_body ul{
	list-style: none;
}

ul#nav_body a{
	display:block;
	width: 110px;/*all subnav ul's width is determined by it's parent li's width which is determined by it's child 'a' tag's width*/
	/*so set the a tag width unless you want wierd line wrapping*/
}

ul#nav_body ul{/*all submenus*/
	position: absolute;
	margin-left: -9999px;
}

ul#nav_body ul.hover{/*reveals the subnav ul's by bringing it back from off the screen when someone mouses over its parent li*/
	margin-left: 168px;/*overides ul#nav_body ul*/
	margin-top: -25px;
}

/*barebones aesthetics*/
ul#nav_body a{
	background-color: #eeeeee;
	border: solid 1px black;
}