/* --------- Standard divs  ----------- */	
	/*The universal selector, written "*", matches the name of any element type.*/
	* 
	#visitingtable td {

                border: 1px solid #DDD;

}

 

#visitingtable tr.vtaltcolor {

                background-color: #0079C2;

                color: white;

}

 

#visitingtable tr.vttitle {

                color: white;

                background-color: #666;

}

	
	{		
		margin: 0; 
		padding: 0; 
	}	
	p
	{ font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:1.1em;
	font-style:normal;
	margin-bottom:20px;

	}	
	input, textarea
	{
		font-size: 1em;
	}
	table
	{
		font-size: 1em;
	}
	select
	{
		font-size: 1em;
	}
	ul, ol
	{
		padding-left: 30px;
	}	
	img
	{
		border: 0;
	}	
	.leftfloating
	{
		float: left;
	}
	.rightfloating
	{
		float: right;
	}
	.leftaligned
	{
		text-align: left;
	}
	.centered
	{
		text-align: center;
	}
	.rightaligned
	{
		text-align: right;
	}
	.hidden
	{
		display: none;
	}
	img.borderless
	{
		border: 0;
	}
	.fullwidth
	{
		width: 100%;
	}
	.cleardiv
	{
		clear: both;
	}
	.hideoffscreen
	{
		position: absolute; 
		top: -10000px;		
	}
	
a:visited  {color: #000000; text-decoration: none}
a:link  {color: #000000; text-decoration: none}
a:active  {color: #000000; text-decoration: none}
a:hover   { color: #D50000;  text-decoration: underline}

/* --- Divs used for page structure ---*/
	body 
	{
		min-width: 982px;
		/*border: solid thin black;*/
	}	
	
	/* wrapper holds left faux column tab */
	/* nn6/7 will put content out of scrollable reach if auto is used unless the min-width is on body */
	
		#wrapper 
	{ 
		/*border: solid thin orange;*/
		width: 982px;

		align: center;  /*modify this to control width of page. Avoid 100%, otherwise end up with horizontal scrollbar. */		
		/*width: 50%;*/
		margin: 0% 0% 0% 0%;
		background:url(images/pagetile.jpg) repeat-y;
		
		}
		
		

#subnav, #footer 
	{
		/*border: dashed thin green;*/
		clear: both; 
		width: 100%;
				

	}


#homenews 
{ 

width:338px;
padding:8px;
border:2px dotted #CCCCCC;
margin-bottom:30px;
margin-top:15px;
float:left;
height:400px;
}



#homeclinical
{ 

width:338px;
padding:8px;
border:2px dotted #CCCCCC;
margin-bottom:15px;
margin-top:15px;
margin-left:4px;
margin-bottom:30px;
float:left;
height:400px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:1.1em;

}


	#header 
	{
		position: relative; /* contents of header will position themselves relative to this header, rather than the screen. Affects trust logo and quick search */
		clear: both; 
		width: 982px;


	}

	#footer 
	{ 
		padding: 1px 0;
	}

	/* right faux column tab. Area under header (contains #centerwrap, #left and #right) */
	#contentfloatholder 
	{ 
		/*border: solid thin lime;*/
		
		width: 100%;
		border-left:solid 1px #333333;
		border-right:solid 1px #333333;
		
	}

	/* this is for NN6 to clear floats */
	#contentfloatholder:after 
	{		
		content: "."; 
		display: block; 
		height: 0px;
		clear: both; 
		visibility: hidden;

	}

	/* area under #contentfloatholder (contains #center) */
	#centerwrap 
	{
		/*border: solid thin teal;*/
		float: left;
		width: 100%;
		margin: 0% -95% 0% 0%;
		overflow: hidden;
	    float: left; /* required to avoid IE negative margin rendering issues */


	}

	/* main content area inside #centerwrap. Used to house main content area and right area. Space left for left menu. */
	#center 
	{
		/*border: solid thin silver;*/
		margin: 0px 0px 0px 200px; /* place margin on left hand side to make space for left menu. Margin should match #left column width. */
		padding: 0px 7px 0px 15px;

	}
	
	/* breadcrumb (but also see .breadcrumbwithright and .breadcrumbnoright) */
	#breadcrumbdiv
	{
	font-size: 10px;		/*border: solid thin cyan;*/
	text-align: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding-top: 5px;
	padding-bottom:10px;
	padding-right: 5px;
	}

	/* Main content area and right area (This area does not include the left menu).
	   Note: Right margin placed (for more box) instead of in #center to allow some templates (e.g. document list) to override this and not have a right area if required. 
	   Note: Also see .mainareawithright and .mainareanoright */
	#mainareadiv
	{

	}
	
	/* Two classes to handle main and right areas for #mainareadiv, and two for breadcrumb */
	.mainareawithright, .breadcrumbwithright
	{
		margin-right: 0px; /* place margin on right hand side to make space for stuff on the right e.g. more box. Margin should match #right column width. */		
	}
	.mainareanoright, .breadcrumbnoright
	{
		margin-right: 0px; /* no right required, so no margin required */
	}

	/* left column */
	#left 
	{
		/*border: solid thin pink;*/
		float: left;
		width: 200px;	/* note: update #center margin if changing this */
		margin: 0% 0% 0% -4.5%;
		overflow: auto; /* do not let content overflow the fixed width */
	}

	/* right column */
	#right 
	{
		/*border: solid thin pink;*/
		float: right;
		width: 0px;	/* note: update #center margin if changing this */
		margin: 0%;
		overflow: auto; /* do not let content overflow the fixed width */
	}

	/************* IE Mac CSS Only  works for Win too **************/

	* html div#centerwrap 
	{
		margin: 0% -100% 0% 0%;
	}
	* html div#left 
	{
		margin: 0%;
	}	

/* seems to be causing problems in IE...
	div h3, div p 
	{
		margin: 1em 0;
		padding: 0 20px; 
	}
*/

/* -------- header section specific (includes image, trust logo, search, logged in user) ----------*/
	/* div holding header image */
	#headerimgdiv
	{
	float: left;
	width:984;
	}
	.headerimage
	{
		display: inline; /* change from inline to block to remove gap, since in standards-compliance mode images are set to display as inline by default, which leaves a space underneath the image (the baseline underneath inline elements).*/
		/*width: 100%;*/    /* uncomment to have full width image header */
		/*height: 100%;*/ /* only seems to work in Opera */
	}
	
	
/* -------- header section specific (includes image, trust logo, search, logged in user) ----------*/
	/* div holding header image */
	#bigbutdiv
	{
	}
	.bigbut
	{
		display: inline; /* change from inline to block to remove gap, since in standards-compliance mode images are set to display as inline by default, which leaves a space underneath the image (the baseline underneath inline elements).*/


	}
	
	
			/* trust logo div */
	#news2
	{
		align: center;
		top: 0px;
		right: 0px;	
	}

	/* trust logo div */
	#TrustLogoDiv
	{
		display: block;
		position: absolute;
		top: 5px;
		right: 0px;	
	}
	
	#toplinks
	{
	
	background-image: url(../../upload/HoE/vline.gif);
	background-position: left bottom;
	background-repeat:no-repeat;
	width: 250px;
	padding: 0.5em 0.0em 0.0em 0.5em; /* only apply top and bottom padding here, otherwise would exceed left menu area */
	float:left;
	margin-left: 0px;
	text-decoration: none;
	font-size: 9pt;
	text-align: center;
	color: Black;
		}
		
	#qlinkshead
	{
	background-image: url(../../upload/HoE/sidenav-blueQL.gif);
	background-position: left bottom;
	background-repeat:no-repeat;
	width: 196px;
	padding: 7px 0.0px 0.0px 0.0px; /* only apply top and bottom padding here, otherwise would exceed left menu area */
	float:left;
	margin-left: 0px;
	}


	#qlinksicon1
	{
	background-image: url(../../upload/HoE/icon_visitingtimes.gif);
	background-position: left bottom;
	background-repeat:no-repeat;
	width: 190px;
	padding: 1.0em 0.0em 0.0em 0.0em; /* only apply top and bottom padding here, otherwise would exceed left menu area */
	float:left;
	display:inline;
	margin-left: 3px;
			}

	#qlinksicon2
	{
	background-image: url(../../upload/HoE/icon-maps.gif);
	background-position: left bottom;
	background-repeat:no-repeat;
	width: 190px;
	padding: 1.0em 0.0em 0.0em 0.0em; /* only apply top and bottom padding here, otherwise would exceed left menu area */
	float:left;
	margin-left: 3px;
			}
			
	#qlinksicon3
	{
	background-image: url(../../upload/HoE/icon-phone.gif);
	background-position: left bottom;
	background-repeat:no-repeat;
	width: 190px;
	padding: 1.2em 0.0em 0.0em 0.0em; /* only apply top and bottom padding here, otherwise would exceed left menu area */
	float:left;
	margin-left: 3px;

			}
	
    #qlinksicon4
	{
	background-image: url(../../upload/HoE/icon-cancel.gif);
	background-position: left bottom;
	background-repeat:no-repeat;
	width: 190px;
	padding: 1.2em 0.0em 0.0em 0.0em; /* only apply top and bottom padding here, otherwise would exceed left menu area */
	float:left;
	margin-left: 3px;

			}
			
	#qlinksicon5
	{
	background-image: url(../../upload/HoE/icon-quest.gif);
	background-position: left bottom;
	background-repeat:no-repeat;
	width: 190px;
	padding: 1.2em 0.0em 0.0em 0.0em; /* only apply top and bottom padding here, otherwise would exceed left menu area */
	float:left;
	margin-left: 3px;

			}
	
	#qlinkstext
	{
	float:right;
	font-size: 9pt;
	padding-bottom: 8px;
	width: 150px;	
			}
		
	/* quick menu div (contains search and logged in user) */
	#quickmenudiv
	{	
		position: absolute;
		bottom: 30px;
		right: 50px;
		font-size: 8pt;
		color: black;
		background-color: #ffffff; /*NHS Blue*/
		padding: 0px 0px 0px 0px;

	}
	#quicksearchdiv
	{
	float: left;

	}
	#loggedinuserdiv, .searchtext
	{
		font-size: 9pt;
		text-align: left;
		color: Black;
		vertical-align: bottom;
	}
	#loggedinuserdiv
	{
		text-align: right;
	}
	
	/* -- Quick search -- */
	input.quicksearchinput
	{
		vertical-align: top;
		border: 1px solid black;		
	}
	input.SearchButton 
	{
		background: url("/images/ico_find.gif");
		background-repeat: no-repeat;
		padding-bottom:2px;
		width: 23px;
		height:23px;
		border: 0px solid; 
		color: #0000FF; 
		text-decoration: underline;		
		cursor: pointer; 		
	}

/* -------- navigation section specific (includes top menu and quick bar) ----------*/
	/* navigation container */

/*LS testing 10:44 19/12/2006*/

	#subnav a.aboutus {
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	float: left;
	font: bold 11px Arial;
	display: inline;
	background: transparent url(bluebg.gif) top right no-repeat;
	color: white;	padding: 5px 10px; /*padding of tabs*/
	text-decoration: none;
	border-top: 0px solid #d3bdbe; /*top border style*/
	border-bottom: 0px solid #ffa1a3; /*thick bottom border below tabs*/
	border-left: 1px solid #000000; /*left border style*/
	}	
	#subnav a.aboutus:hover{
	
	background: transparent url(bluebgover.gif) top right no-repeat;
	color: white;	}
	
	/* -------- departments*/
	#subnav a.departments {
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	float: left;
	font: bold 11px Arial;
	display: inline;
	background: transparent url(orangebg.gif) top right no-repeat;
	color: white;	padding: 5px 14px; /*padding of tabs*/
	text-decoration: none;
	border-top: 0px solid #d3bdbe; /*top border style*/
	border-bottom: 0px solid #ffa1a3; /*thick bottom border below tabs*/
	
	}	
	#subnav a.departments:hover{
	
	background: transparent url(orangebgover.gif) top right no-repeat;
	color: white;	}
	
		/* -------- patients*/
	#subnav a.patients {
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	float: left;
	font: bold 11px Arial;
	display: inline;
	background: transparent url(redbg.gif) top right no-repeat;
	color: white;	padding: 5px 11px; /*padding of tabs*/
	text-decoration: none;
	border-top: 0px solid #d3bdbe; /*top border style*/
	border-bottom: 0px solid #ffa1a3; /*thick bottom border below tabs*/
	
	}	
	#subnav a.patients:hover{
	
	background: transparent url(redbgover.gif) top right no-repeat;
	color: white;	}
	
			/* -------- gp*/
	#subnav a.gp {
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	float: left;
	font: bold 11px Arial;
	display: inline;
	background: transparent url(purplebg.gif) top right no-repeat;
	color: white;	padding: 5px 11px; /*padding of tabs*/
	text-decoration: none;
	border-top: 0px solid #d3bdbe; /*top border style*/
	border-bottom: 0px solid #ffa1a3; /*thick bottom border below tabs*/
	
	}	
	#subnav a.gp:hover{
	
	background: transparent url(purplebgover.gif) top right no-repeat;
	color: white;	}
	
				/* -------- members*/
	#subnav a.members {
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	float: left;
	font: bold 11px Arial;
	display: inline;
	background: transparent url(navybg.gif) top right no-repeat;
	color: white;	padding: 5px 11px; /*padding of tabs*/
	text-decoration: none;
	border-top: 0px solid #d3bdbe; /*top border style*/
	border-bottom: 0px solid #ffa1a3; /*thick bottom border below tabs*/
	
	}	
	#subnav a.members:hover{
	
	background: transparent url(navybgover.gif) top right no-repeat;
	color: white;	}
	
	
					/* -------- fundraising*/
	#subnav a.fundraising {
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	float: left;
	font: bold 11px Arial;
	display: inline;
	background: transparent url(yellowbg.gif) top right no-repeat;
	color: white;	padding: 5px 9px; /*padding of tabs*/
	text-decoration: none;
	border-top: 0px solid #d3bdbe; /*top border style*/
	border-bottom: 0px solid #ffa1a3; /*thick bottom border below tabs*/
	
	}	
	#subnav a.fundraising:hover{
	
	background: transparent url(yellowbgover.gif) top right no-repeat;
	color: white;	}
	
						/* -------- mediacentre*/
	#subnav a.mediacentre {
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	float: left;
	font: bold 11px Arial;
	display: inline;
	background: transparent url(greenbg.gif) top right no-repeat;
	color: white;	padding: 5px 11px; /*padding of tabs*/
	text-decoration: none;
	border-top: 0px solid #d3bdbe; /*top border style*/
	border-bottom: 0px solid #ffa1a3; /*thick bottom border below tabs*/
	
	}	
	#subnav a.mediacentre:hover{
	
	background: transparent url(greenbgover.gif) top right no-repeat;
	color: white;	}
	
			/* -------- jobs*/
	#subnav a.jobs {
	margin: 0px;
	padding: 0px;
	position: relative;
	overflow: hidden;
	float: left;
	font: bold 11px Arial;
	display: inline;
	background: transparent url(turqbg.gif) top right no-repeat;
	color: white;	padding: 5px 9px; /*padding of tabs*/
	text-decoration: none;
	border-top: 0px solid #d3bdbe; /*top border style*/
	border-bottom: 0px solid #ffa1a3; /*thick bottom border below tabs*/
	border-right: 2px solid #000000; /*left border style*/
	}	
	#subnav a.jobs:hover{
	
	background: transparent url(turqbgover.gif) top right no-repeat;
	color: white;	}
	
	
	
/*End testing */


	/* quick bar - holds login, sitemap and print buttons */
	#quickbar
	{
		float: left;
		padding: 5px 8px 5px 8px;
	}

	/* top menu */
	#topmenucontrol
	{
		padding: 0px 0px 0px 0px;
	}

	a.menuhead
	{
		font-size: 1em;
		color: White;
		text-decoration: none;
		margin: 0px 0px 0px 0px;		
	}

	a.activemenuhead
	{
		font-size: 1em;
		color: White;
		font-weight: bold;
		text-decoration: none;
		margin: 0px 0px 0px 0px;
	}

	a.menuhead:hover, a.activemenuhead:hover
	{
		color: black; /*NHS Yellow*/
		text-decoration: none;
	}

/* ------ Links -------- */


/* --------- Left column area ----------- */


	
	/* menu content in left column */
	#leftmenudiv
	{
	background-image: url(../images/jobnav_pbg.gif); /* NHS Dark Blue (primary) */
	background-position: center top;
	background-repeat: repeat-y;
	width: 196px;
	height:auto;
	padding: 0.0em 0em 0.0em 0em; /* only apply top and bottom padding here, otherwise would exceed left menu area */
	margin-left:4px;
	vertical-align:baseline;
	
	}
	
	/* set common style for menu item, home page menu item and heading/top-level menu item */
	div.menuitem, div.menuitemhome, div.menuitemheading
	{
	background-image: url(../images/submenu_rulerbg.gif);
	background-position: left bottom;
	background-repeat: repeat-x;
	width: 190px;
    height:22px;
	float:inherit;
	font:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:22px;
	margin-left: 2px;
	text-decoration: none;
	}

	/* styles for menu item */
	div.menuitemhome, div.menuitemheading
	{
		background-color: #ededed; /* NHS Dark Blue (primary) */
		
	}	
	div.menuitem
	{
		background-color: #ededed; /*NHS Blue*/
	}	
	div.menuitemheading
	{
		font-weight: bold;
	}	
	
	/* styles for menu hyperlinks */	
	.menulink
	{
		color: Black;	
		text-decoration: none;
		
	}	
	a.menulink:hover
	{
		color: Red; /*NHS Yellow*/
		text-decoration: none;
	}

	/* styles for selected menu item hyperlinks */
	.menulinkactive
	{
		color: Black;
		font-weight: bold;
		text-decoration: none;
	}
	a.menulinkactive:hover
	{
		color: Black; /*NHS Yellow*/
		text-decoration: none;
	}
	
	/* styles for submenu items and selected items */
	div.menuitemselected
	{
		background-image: url(../images/submenu_rulerbg.gif);
		background-position: left bottom;
		background-repeat: repeat-x;
		width: 188px;
		padding: 0.2em 0em 0.5em 0.2em;		
		float: left;
		font-weight: bold;
		text-decoration: none;
		background-color: #fff; /*NHS Dark blue (secondary)*/
		color: #cccccc;
		margin-left: 2px;
	}
	div.menuitemexpanded
	{
		background-image: url(../images/submenu_rulerbg.gif);
		background-position: left bottom;
		background-repeat: repeat-x;
		width: 188px;
		padding: 0.2em 0em 0.5em 0.2em;	
		float: left;
		background-color: #ffffff; /*NHS Dark blue (secondary)*/
		color: White;
		text-decoration: none;
		margin-left: 2px;
	}
	div.menuitemchild
	{
		width: 188px;
		padding: 0.2em 0em 0.5em 0.2em;	
		float: left;
		background-color: #cccccc; /*NHS Light blue*/
		color: black;
		text-decoration: none;
		margin-left: 2px;
	}
		div.menuitemchildchild
	{
		width: 188px;
		padding: 0.2em 0em 0.5em 0.2em;
		float: left;
		background-color: #ffffff; /*NHS Light blue*/
		color: black;
		text-decoration: none;
		margin-left: 2px;
	}
/* --------- Right column area ----------- */	
	/* box container for content appearing on the right hand side (e.g. the more box) */
	.rightcolbox
	{
		border: solid 1px #999999; /*colour = NHS Black Secondary*/
		
		/* The right column box is not displayed correctly in IE5.x. Need to set the width to correct this */
		width: 108.5%; /* hack for IE5.0 - will not render properly in other browsers. Note: IE5.5 does not require this hack. */
		width/**/: auto;  /* fix for non IE5.0 browsers. IE5 will ignore this because of the comment before the colon. */
	}

	/* header div inside a right col box */
	.rightcolboxheader
	{
		padding: 0.2em 0.5em 0.2em 0.5em;		
		color: White;
	}

	/* hyperlink inside right col box header */	
	.rightcolboxheader a
	{
		color: White;
	}
	
	/* content div inside a right col box */	
	.rightcolboxcontent
	{
		padding: 0.0em 0.5em 0em 0.5em;
	}
	
	/* header for homepage news box */
	#newsheaderdiv
	{
		background-color: #009933; /*NHS Green*/
	}
	
	/* header for more box */
	#moreheaderdiv
	{
		background-color: #009933; /*NHS Green*/
	}
	
	/* header for homepage events */
	#eventsheaderdiv
	{
		background-color: #CC0000; /*NHS Red*/
	}


/* -------- Content area ------------------- */


/* -------- Footer area -------------------- */
	#footerdiv
	{
		width: 100%;
		float:left;
		height: 75px;
		border-left:solid 1px #333333;
		border-right:solid 1px #333333;
		white-space:inherit;


	}
	#footermaindiv
	{
		padding-top: 0.5em;
		height: 50px;
		float: left;
		width: 100%;	

	}
	#footerleftdiv
	{
		float: left;
		width: 100%; 
		text-align: left;

	}
	#footermiddlediv
	{
		float: left;
		width: 0%; 
		text-align: center;

	}
	#footerrightdiv
	{
		float: right;
		width: 0%; 
		text-align: right;
	
	}


/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

#navbar{
width:970px;
margin-left:5px;
background-image:url(navbar_black.jpg);
background:url(navbar_black.jpg);
background-repeat:repeat-x;
overflow: hidden;
position: relative;
left:0;
top:0;


}

#navbar2{
width:100%;
border-left:solid 1px #333333;
border-right:solid 1px #333333;
}





.mattblacktabs.aboutus{
margin: 0px;
padding: 0;
float: left;
font:  11px Verdana;
overflow: hidden;
margin-bottom: 1em;
border: 1px solid #625e00;
border-width: 1px 0;

}

.mattblacktabs a.aboutus{
float: left;
color: white;
padding: 9px 11px;
text-decoration: none;
border-right: 1px solid white;
background-image:url(navbar_black.jpg);
background-repeat:repeat-x;
}


.mattblacktabs a:visited.aboutus{
color: white;
}

.mattblacktabs a:hover.aboutus{
color: white;
display: inline;
background: transparent url(navbar_blue.jpg) center center repeat-x; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */
}


.arrowlistmenu{
width: 180px; /*width of accordion menu*/
}

.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font: bold 14px Arial;
color: white;
background: black url(titlebar.png) repeat-x center left;
margin-bottom: 10px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 4px 0 4px 10px; /*header text is indented 10px*/
cursor: hand;
cursor: pointer;
}

.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background-image: url(titlebar-active.png);
}

.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 2px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li .opensubheader{ /*Open state CSS for sub menu header*/
background: lightblue !important;
}

.arrowlistmenu ul li .closedsubheader{ /*Closed state CSS for sub menu header*/
background: lightgreen !important;
}

.arrowlistmenu ul li a{
color: #A70303;
background: url(arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 90%;
}

.arrowlistmenu ul li a:visited{
color: #A70303;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
background-color: #F3F3F3;
}

.arrowlistmenu ul li a.subexpandable:hover{ /*hover state CSS for sub menu header*/
background: lightblue;
}