/*
----------------------------------------------------------------------------------
	agrave.navigation.css
	TRT 20011018

	Abstract CSS Classes for navigation within the agrave system:

	nvg-menu-title:					Title for menu (not necessary)
	nvg-item:						Base navigation item
	nvg-item-container:				Optional container for use in DHTML Trees
	nvg-item subclasses
		a:link						Standard look for untouched links
		a:active					Definition for "onclick" event
		a:visited					Definition for a visited tree item
		a:hover						Definition for "onmouseover" event

	The idea is that you can nest nvg-item-container elements to create a 
	true DHTML tree structure.

	If you wish to alter ("skin") the navigation widget with your own aesthetic,
	you have two options:

		Option 1:  Redefine the following CSS Classes
		Option 2:  Override the Navigation builder functions

	Option 1 is the simpler solution; only knowledge of CSS(2) is required.
	Option 2 is much more complex, and requires knowledge of the language your
	agrave package is deployed in (ASP JScript, ColdFusion Markup Language, JSP,
	PHP, etc.).
----------------------------------------------------------------------------------
*/

div.nvg-item-container {
	width : 100% ;
/*	border : 1px #dddddd solid ; */
	padding : 2px ;
	display : block ;
}

div.nvg-menu-title {
	width : 100% ;
	font-family : verdana, helvetica ;
	font-size : 11px ;
	font-weight : bold ;
	border-bottom : 1px #dddddd solid ;
	padding-left : 2px ;
	padding-right : 2px ;
}

div.nvg-item {
	width : 100% ;
	font-family : verdana, helvetica ;
	font-size : 11px ;
	padding-left : 15px ;
	padding-right : 2px ;
	border-bottom : 1px #dddddd solid ;
}

div.nvg-item a:link {
	color : #000000 ;
	text-decoration : none ;
}

div.nvg-item a:active {
	color : #000000 ;
	background-color : #b6bdd2 ;
	border : 1px #0a246a solid ;
	text-decoration : none ;
}

div.nvg-item a:visited {
	color : #333333 ;
	text-decoration : none ;
}

div.nvg-item a:hover {
	color : #000000 ;
	background-color : #b6d2bd ;
	border : 1px #0a6a24 solid ;
	text-decoration : none ;
}
