@charset "utf-8";
/* CSS Document for WTW70 menu*/

div.menu {  /* this is the style for the main menu div */
	margin: 0px auto;
	position: relative;
    text-align:center;
	margin-top: 115px; /* menu distance from top of document */
	background-color: transparent;
	}

.nav{ /* this is the style for all menus unless overridden below */
	list-style:none;
	position:relative;
    font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size:12px; /* main top menu and submenus */
	font-weight:bold;
	border:0px solid black;
	border-width:0px 0px; 
	margin:0px auto;
	padding:0px;
	padding-top:0px;
	text-align:center;
	}

.nav a{
	display:inline-block;
	padding: 5px 10px 5px; /* padding around text within menu blocks top/R+L/bottom */
	color:white; /* text color of link when not hovering */
	background-color:transparent; /* background color of link when not hovering */
	text-decoration:none; /* decoration of link when not hovering */
}

/*	#nav a:hover{ /* */
/*	color:green; /* text color of link while hovering */
/*	background-color:white; /* background color while hovering */ 
/*	text-decoration:none; /* remove or add underline link while hovering */
/*	} /* */

.nav ul{
	position:absolute;
	z-index:10;
	/*top:100%; Uncommenting this makes the dropdowns work in IE7 but looks a little worse in all other browsers. Your call. */
	left:-9999px;
	margin:0px;
	padding:0px;
	text-align:left;
	font-weight:bold;
	border-style:solid;
	border-color:black;
	border-width:1px 1px 0px 1px; /* top,right, bottom, left */
	background-color:red; /* dropdown color when hovering in top-menu */
	}

.nav ul li{
	display:block;
	border-style:solid;
	border-color:black;
	border-width:0px 0px 1px 0px; /* top,right, bottom, left */
	}

.nav li{
	position:relative;
	display:inline;
	}

.nav li:hover ul{
	left:0px;
	}

.nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	color:black;  /* top-level and sub-menu text color when hovering in top-menu */
	background-color:white;  /* top-level and sub-menu background color when hovering in top-menu */
	text-decoration:none;  /* top-level state when hovering in top-menu or sub-menu  */
	}

.nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	color:black; /* sub-menu text color when not hovering over item in sub-menu */
	background-color:#eeeeee; /* sub-menu background color when not hovering over item in sub-menu */
	text-decoration:none;
	}

.nav li:hover ul a:hover{
	color:white;  /* sub-menu text color when hovering in sub-menu */
	font-weight:bold;   /* sub-menu text weight when hovering in sub-menu */
	background-color:black;  /* sub-menu background color when hovering in sub-menu */
	text-decoration:none;
	}

.nav ul a{
	white-space:nowrap;
	display:block;
	border-bottom:0px solid #ccc;
	}

/* not sure what the current and parent do
.current {
	color:red;
	font-weight: bold;
	font-style: italic;
}

.parent {
	color:red;
	font-size: 16px;
	font-style: italic;
}
*/

/* .nav .parent a { 
	color: #bc360a;
	font-style: italic;
	} */

/* .nav .parent a:hover {
	color: white; 
	font-weight: bold;
	font-style: xitalic;
	} */

.nav li:hover .submenu  a { /* style when hovering over specific submenu items */
	color: black; 
	font-style: normal;
}

.nav li:hover .current  a { /* style when hovering over specific submenu items */
	color: #bc360a; /* darker-orangish red color  #bc360a */
	font-weight: bold;
	font-style: italic;
}