/* CSS drop-down menu styles */

body {
	font-size: 100%;
	font-family: Arial, Helvetica, sans-serif;
}
#mainnav {
	width: 898px;
	height: 27px;
	padding-top:3px;
	padding-left:22px;	
	/*padding-top:3px;	
/*  USE MID GREY TO DIFFERENTIATE */											/* MID GREY */
	/*background-color: #999;*/
	background: #ddd url(images/bg_menu_hoverlite.gif) repeat-x;	*/						/* Light blue strip */
	font-family: Trebuchet MS;
	font-size:9pt;
	z-index:1000;
}

/* -------------------------- */
/* We begin by styling the main navigation on the page... */
/* -------------------------- */
/* Overall main navigation styles */
#nav, #nav ul {
	float: left;
	list-style: none;
	line-height: 1em;
/*  USE MID GREY TO DIFFERENTIATE */											/* MID GREY */	
	color: #999;
	background-color: transparent;
	font-weight: bold;
	padding: 0 0 0 0px;
	margin: 0;
}
/* -------------------------- */
/* The top main navigation links */
#nav a {
	display: block;		
	padding: 5px 20px; /* width added to link items */
/*  USE NEARLY BLACK TO DIFFERENTIATE */										/* NEARLY BLACK*/
	/* *********color: #242424;	*/
	color:#675C9E;

/*  USE LIGHT GREY TO DIFFERENTIATE */											/* LIGHT GREY */	
	background-color:#ccc;
	background: url(line.jpg) no-repeat top right; /* puts a "bar" on right of the main nav links */
	text-decoration: none;
}
/* I'm targeting the last main navigation link to have no "bar" on the right side */
#nav a.last {
	background-image: none;
}
#nav a.one, #nav a.two, #nav a.three {
	text-align: left;
	font-size: 1em;
}
#nav li {
	float: left;
	padding: 0;
	height:30px;
}
#nav li a:hover{
/*  USE MAGTENTATO DIFFERENTIATE */												/* MAGENTA */
	/* **********color:magenta;	/*PER addition*/
}
/*#nav li.livepage a:visited, li.livepage a:link{
	color:green;
}*/
/*PER addition of ID on top-level anchors to color selected page. 
  Would need other measures to color the whole li panel as well */

/* Info: This applies to top-left links when selected, PLUS all-level dropdowns:*/  
  
#nav #livepage a:visited, #livepage a:link{
/*  USE GREY TO DIFFERENTIATE */												/* GREEN */

	/*background: #ddd url(images/bg_menu_bg.gif) repeat-x;*/
	/*background-color:yellow;	*/
}


/* -------------------------- */
/* The dropdown links lists */				/* Seems to apply to all drop-down backgrounds */
#nav li ul {
	position: absolute;
	left: -999em;
	height: auto;
	width: 140px; 
	font-weight: normal;
/*  USE GREY TO DIFFERENTIATE */												/* LIGHT GREY */		
	/*border: 1px solid #999;*/
	/* #EC7600 would be dark orange */
/*  USE LIGHT GREY TO DIFFERENTIATE */											/* LIGHT GREY */		
	background-color: #FDE4C6;											  /* THE LIGHT ORANGE */
	margin: 0;
	/* THE DARK ORANGE IS F8A441 */


}
#nav li li {
	padding: 0;
	width: 140px; 
	height:auto;
}
#nav li ul a {
	padding: 5px 10px;
	width: 120px;
	* html width: 100px;
}
/* This controls the flyout location of the second level dropdowns */
#nav li ul ul {
	margin: -2em 0 0 140px;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	left: auto;
}
/* -------------------------- */
/* Here is the background of the main nav link while looking at the dropdown */
#nav li.level0:hover, #nav li.level0.sfhover {

/*  USE BROWN TO DIFFERENTIATE */												/* BROWN */
	background-color: brown;/*#ccc; = gray */
	/* NEW */
	background: url(images/bg_menu_hovering.gif) repeat-x; 		/*added hover graphic*/
	margin-top:-3px;
	padding-top:3px;


}

/* -------------------------- */
/* The dropdown links list colors */
#nav li ul.under a {
/*  USE BLACK TO DIFFERENTIATE */												/* BLACK */
	/*color: #000;*/
	color:675C9E;
	background-image: none;

}
#nav li ul.under a:hover {
/*  USE RED TO DIFFERENTIATE */													/* RED*/
	background: #f00;	/*red*/
/*  USE WHITE TO DIFFERENTIATE */												/* WHITE */
	color: #fff;		/*white*/
	background: url(images/bg_menu_doubles_hover.gif) repeat-x; 	/*double hover graphic*/		
}
/* -------------------------- */
/* The background of the second level links while looking at the dropdown under it... */
/* (This means bg of first-level drop-down when you are hovering over second-level flyout)*/
#nav li ul.under li:hover a.daddy, #nav li ul.under li.sfhover a.daddy {
/*  USE WHITE TO DIFFERENTIATE */												/* WHITE */
	color: #fff;
	/* Was next line, but gave wrong bacground when third level hovered */
	/* background: url(images/bg_menu_selected.gif) repeat-x;	*/
}
#nav li ul.under li:hover, #nav li ul.under li.sfhover {
/* This puts level3 color or graphic on selection above current level when current item hovered
/*  USE WHITE TO DIFFERENTIATE */												/* WHITE */	
	color: #fff;
/*  USE BLACK TO DIFFERENTIATE */												/* BLACK */	
	background-color: black; /*#f00*/
	/* NEW */
	background: url(images/bg_menu_doubles_hover.gif) repeat-x; 		/*added hover graphic*/		
}

#nav li.menufeature{
	/*border-right-style:dashed;*/
	border-right-width:thin;
	/* puts a "bar" on right of the main nav links: */	
	/*background: url(images/brown-dash.gif) no-repeat top right; */


}
#nav li.menufeature a:link, #nav li.menufeature a:visited {
	/*border-right-style:dashed;*/
	border-right-width:thin;
	/* puts a "bar" on right of the main nav links:: */	
	/*background: url(images/brown-dash.gif) no-repeat top right; */
	
}
#nav li.menufeature a:hover{
/*  USE LIGHT GREY TO DIFFERENTIATE */											/* LIGHT GREY */		
	background-color:#ccc;	/* light gray*/
	background: url(images/bg_menu_hovering.gif) repeat-x; 	/*added hover graphic*/	
	margin-top:-3px;
	padding-top:8px;
			
}

/* Here is the background of the main nav link while looking at the dropdown */
	/* NEW */
#nav li.menufeature:hover, #nav li.menufeature.sfhover {

/*  USE BROWN TO DIFFERENTIATE */												/* BROWN */
	/*background-color: brown;/*#ccc; = gray */
	/* NEW */
	
}

#nav li #livepage {
	background-color:#7D9DE8;	/* emulates mid-blue that is defined differently for other li's */
	background: url(images/bg_menu_selected.gif) repeat-x;
	height:20px;
	margin-top:-3px;
	padding-top:8px;
}

/* NEW ******** to make drop-downs start in line with bottom of menu bar */
/* Needs to be compensated for in livepage 'under' below, which otherwise wd be -5px;*/
#nav ul.under{
margin-top:5px;
}

#livepage ul.under{
	margin-top:-5px;
}
	
#nav li.level0 a:hover{
/* NEW */
	background: url(images/bg_menu_hovering.gif) repeat-x; 	/*added hover graphic*/	
	margin-top:-3px;
	padding-top:8px;
		
}

/* NEW */
/* Inserts top-level divider LI after a PageMenuOnly link with HasPopup set (proxy for this)*/
#nav li.divider{
	padding: 10px 1px;
	width:1px;
	background: url(images/brown-dash.gif) no-repeat top right;
}

/* ----------------  */
/* END OF MAIN MENU  */
/* ----------------  */





/* ------------------------------------------------------------------------------ */
/* SIDE MENU FOLLOWS */
/* ------------------------------------------------------------------------------ */

#sidenav {
	width: 175px;
	height: 27px;
	color: #ACACFF;
	/*background: #ddd ;*/
	font-family: Trebuchet MS;
	font-size:12.5pt;	
}


/* Begin by styling the side menu navigation on the page... */
/* -------------------------------------------------------- */

/* Overall main navigation styles */
#navnew, #navnew ul {
	float: left;
	list-style: none;
	line-height: 1.2em;
	color: #999;
	background-color: transparent;
	/*font-weight: bold;	*/
	padding: 0;
	margin: 0;
}
/* -------------------------- */
/* The top main navigation links */
#navnew a {
	display: block;
	width:130px;	/*PER add to create consistent width on side menu*/
	padding: 5px 0px;
	/*Color: #675C9E;	*/
	
	/* -------------------------------------------------------------------------------------------*/	
	/* MAIN LEFT-HAND NAVIGATION LINK COLOUR BEFORE HOVER*/
	color:#FE9931;
	/* -------------------------------------------------------------------------------------------*/
	
	background-color:#ccc;
	background: url(line.jpg) no-repeat top right; /* puts a "bar" on right of the main nav links */
	text-decoration: none;
}
/* I'm targeting the last main navigation link to have no "bar" on the right side */
#navnew a.last {
	background-image: none;
}
#navnew a.one, #navnew a.two, #navnew a.three {
	text-align: left;
	font-size: 1em;
}
#navnew li {
	float: left;
	padding: 0;
	margin-left:0px;
	text-indent:0px;	
	margin-bottom:7px;
}
#navnew li a:hover{
	/*color:blue;	/*PER addition*/										/* BLUE FOR HOVERED LINKS */
}
/*#nav li.livepage a:visited, li.livepage a:link{
	color:green;
}*/
/*PER addition of ID on top-level anchors to color selected page. 
  Would need other measures to color the whole li panel as well */
#navnew #livepage a:visited, #navnew #livepage a:link{

	/* ---------------------------------------------------------------------*/	
	/* MAIN LEFT-HAND NAVIGATION LIVEPAGE LINK */	
	color:#E50188;
	/* ---------------------------------------------------------------------*/			

	/*background: #ddd url(images/bg_menu_bg.gif) repeat-x;	*/
	/*background-color:yellow;*/										/*YELLOW TO HIGHLIGHT*/

}


/* -------------------------- */
/* The dropdown links lists */
#navnew li ul {
	position: absolute;
	left: -999em;
	height: auto;
	width: 140px; 
	font-weight: normal;
	/* CHANGED THE NEXT THREE*/	
	border:solid #DFDFDF 0px;
	border-left-width:1px;
	border-bottom-width:1px;	
	/*background-color: #ccc;*/
	background-color: #EFEFEF;				/* background-colour of flyout UL lists*/	
	background-color: #FCEAC6;	
	margin: 0;
}

#navnew li li {
	padding: 0;
	width: 140px; 
	margin-bottom:2px;	
}
#navnew li ul a {
	padding: 5px 10px;
	width: 120px;
	* html width: 100px;
}
/* This controls the flyout location of the second level dropdowns */
#navnew li ul ul {
	margin: -2em 0 0 140px;
}
#navnew li:hover ul ul, #navnew li:hover ul ul ul, #navnew li.sfhover ul ul, #navnew li.sfhover ul ul ul {
	left: -999em;
}
/* This sets the amount of indent of the second-level menu flyout */
#navnew li:hover ul, #navnew li li:hover ul, #navnew li li li:hover ul, #navnew li.sfhover ul, #navnew li li.sfhover ul, #navnew li li li.sfhover ul {
	top:inherit;
	margin-top:-20px;
	left:155px;
	/*left: 150px;top:110px;*/
}
/* -------------------------- */
/* Here is the background of the main nav link while looking at the dropdown */
#navnew li:hover, #navnew li.sfhover {
	/*background-color: #EFEFEF;*/
	
	/* ----------------------------------------------------------------------------------------------------*/
	/* MAIN LEFT-HAND NAVIGATION LINK BACKGROUND DURING HOVER*/	
	/*background-color: #FCEAC6;
	/* ----------------------------------------------------------------------------------------------------*/		

}
/* -------------------------- */
/* The dropdown links list colors */
#navnew li ul.under a {
	/*color: #000;*/				/* blacl*/
	color:#675C9E;
	background-image: none;
}
#navnew li ul.under a:hover {
	background: orange;	/*#f00;	/*red*/
	color: #fff;		/*white*/
}
#navnew #livepage li ul.under a:hover {
	background: orange;	/*#f00;	/*red*/
	color: #fff;		/*white*/
}
#navnew #livepage ul{
	color:white;
	/*background-color: pink;				/* background-colour of flyout UL lists*/	
}

/* -------------------------- */
/* The background of the second level links while looking at the dropdown under it... */
#navnew li ul.under li:hover a.daddy, #navnew li ul.under li.sfhover a.daddy {
	color: #fff;
}
#navnew li ul.under li:hover, #navnew li ul.under li.sfhover {
	color: #fff;
	background-color: #f00;
}

#navnew li.menufeature{
	border-right-style:dashed;
	border-right-width:thin;
	
}
/* -------------------------- */
/* Side menu ends */ 
/* -------------------------- */
#content {
	clear: left;
}
/* -------------------------- */

#sitemapnav li{
	list-style-type:none;
}

#navnew a:hover, #navnew a.sfhover {

	/* ------------------------------------------------------------------------------------------------*/
	/* FORCING ROLLOVER COLOUR ON MAIN LEFT-HAND MENU ITEMS*/
	color:red;
	/* ------------------------------------------------------------------------------------------------*/	
}