div.navMainContainer ul.navMain li a {
font-family: "Trebuchet MS", Arial;
font-weight: bold;
/* BR: altered in order to avoid main nav menu font size increasing whenever browser text size increases - IE only */
/* font-size: 1.4em; */
/*font-size: 15px;*/
font-size: 14px;
line-height: 1.0em;
text-decoration: none; 
/* letter-spacing: 0.04em; */
}
.navMainContainer a:link { color: #DBE7ED; }
.navMainContainer a:visited { color: #DBE7ED; }
.navMainContainer a:hover { color: #FFFFFF; }
/* The menu adapter renders an unordered list (ul) in HTML for each tier in the menu. */
/* So, effectively says: style all tiers in the menu this way... */
.navMainContainer ul.navMain, 
.navMainContainer ul.navMain ul {
margin-bottom: 0;
}
/* This rule effectively says: style all tiers EXCEPT THE TOP TIER in the menu this way... */
/* In other words, this rule can be used to style the second and third tiers of the menu without impacting */
/* the topmost tier's appearance. */
.navMainContainer ul.navMain ul {
/*width: 204px;*/
width: 180px;
margin-top: 0;
}
/* The menu adapter generates a list item (li) in HTML for each menu item. */
/* Use this rule create the common appearance of each menu item. */
.navMainContainer ul.navMain li ul li {
margin: 0;
padding: 0;
}
/* Within each menu item is a link or a span, depending on whether or not the MenuItem has defined it's */
/* NavigateUrl property. By setting a transparent background image here you can effectively layer two images */
/* in each menu item.  One comes from the CSS rule (above) governing the li tag that each menu item has. */
/* The second image comes from this rule (below). */
.navMainContainer ul.navMain li ul li a,
.navMainContainer ul.navMain li ul li span {
/*	height: 28px; */
font-size: 13px;
font-weight: normal;
background: #6E818B url(images/dsnavBkgArrow_off.gif) top right no-repeat;
margin: 0;
padding: 0.6em 0.5em 0.6em 1.2em;
border: 0;
height: auto; /* fix cut-off of multiline entries, when last in the list */
}
/* When a menu item contains no submenu items it is marked as a "leaf" and can be styled specially by this rule. */
.navMainContainer ul.navMain li.navMain-Item a,
.navMainContainer ul.navMain li.navMain-Item span {
background: #6E818B url(images/dsnavBkg_off.gif) top right no-repeat;
}
/* Not used presently.  This is here if you modify the menu adapter so it renders img tags, too. */
.navMainContainer ul.navMain li a img {
}
/* When you hover over a menu item, this rule comes into play. */
/* Browsers that do not support the CSS hover pseudo-class, use JavaScript to dynamically change the */
/* menu item's li tag so it has the navMain-Hover class when the cursor is over that li tag. */
/* See MenuAdapter.js (in the JavaScript folder). */
.navMainContainer ul.navMain li:hover {
}
.navMainContainer ul.navMain li.navMain-Hover {
/*	background:url("images/mnavSeparator.gif") no-repeat 2px 12px; */
}
.navMainContainer ul.navMain li.navMain-Hover a:hover {
background:url("images/mnavBgSel.gif") repeat-x right top;	  
}
.navMainContainer ul.navMain li.navMain-Hover ul li {
/*	background: #788E99 url(images/dsnavBkg_on.gif) top right no-repeat;
	background:none; */
}
.navMainContainer ul.navMain li.navMain-Hover ul li a:hover {
background: #6E818B url(images/dsnavBkgArrow_on.gif) top right no-repeat;
}
.navMainContainer ul.navMain li.navMain-Hover ul li.navMain-Item a:hover {
background: #6E818B url(images/dsnavBkg_on.gif) top right no-repeat;
}
/* While you hover over a list item (li) you are also hovering over a link or span because */
/* the link or span covers the interior of the li.  So you can set some hover-related styles */
/* in the rule (above) for the li but set other hover-related styles in this (below) rule. */
.navMainContainer ul.navMain li a:hover,
.navMainContainer ul.navMain li span.navMain-Hover {
}
.navMainContainer ul.navMain li a:hover img {
}
.navMainContainer ul.navMain li.navMain-Item a:hover {
}
/* -------------------------------------------------------------------------- */
/* When the Menu control's Orientation property is Horizontal the adapter wraps the menu with DIV */
/* whose class is navMainHorizontal. */
/* Note that the example menu in this web site uses absolute positioning to force the menu to occupy */
/* a specific place in the web page.  Your web site will likely use a different technique to position your */
/* menu.  So feel free to change all the properties found in this CSS rule if you clone this style sheet. */
/* There is nothing, per se, that is magical about these particular property value choices.  They happen to */
/* work well for the sample page used to demonstrate an adapted menu. */
/* #header */
/*.navMainContainer .navMainHorizontal*/
.navMainContainer {
position: relative;
text-align: left;
top: 19px;
left: 264px;
/*	width: 664px;
height: 31px;
overflow: hidden; */
margin: 0;
padding: 0;
}
div.navMainContainer img { vertical-align: bottom; }
.navMainContainer .navMainHorizontal {
text-align: left;
}
/* This rule controls the width of the top tier of the horizontal menu. */
/* BE SURE TO MAKE THIS WIDE ENOUGH to accomodate all of the top tier menu items that are lined */
/* up from left to right. In other words, this width needs to be the width of the individual */
/* top tier menu items multiplied by the number of items. */
.navMainContainer .navMainHorizontal ul.navMain {
text-align: left;
}
/* #header ul */
/*.navMainContainer .navMainHorizontal ul*/
.navMainContainer ul {
background-color: transparent;
margin: 0;
padding: 0; /*10px 10px 0*/
list-style: none;
}
/* #header li */
/*.navMainContainer .navMainHorizontal li*/
.navMainContainer li {
float: left;
background: url("images/mnavSeparator.gif") -1px 14px no-repeat;
margin: 0;
padding: 0 0 0 2px;
}
.navMainContainer li.first /* NOTE: Adaptor must insert class "first" on first menu item for IE */ {
background: none;
}
.navMainContainer ul li:first-child /* NOTE: IE does NOT understand the :first-child selector */ {
background: none;
}
/* #header a */
/*.navMainContainer .navMainHorizontal a*/
.navMainContainer a {
display: block;
/*  background:url("images/Tabs/right.gif") no-repeat right top; */
padding: 12px 13px 22px 15px;/*5px 15px 4px 6px*/
}
.navMainContainer ul li ul li a  {
display: block;
}
/* #header #current */
.navMainContainer .navMainHorizontal #current {
/*background-image:url("images/Tabs/left_on.gif");*/   
}
/* #header #current a */
.navMainContainer .navMainHorizontal #current a {
/*background-image:url("images/Tabs/right_on.gif");
padding-bottom:5px;*/
}
/* This rule effectively says: style all tiers EXCEPT THE TOP TIER in the menu this way... */
/* In other words, this rule can be used to style the second and third tiers of the menu without impacting */
/* the topmost tier's appearance. */
/* Remember that only the topmost tier of the menu is horizontal.  The second and third tiers are vertical. */
/* So, they need a much smaller width than the top tier.  Effectively, the width specified here is simply */
/* the width of a single menu item in the second and their tiers. */
.navMainContainer .navMainHorizontal ul.navMain ul {
/*	font-weight: normal; */
font-size: 0.8em;
margin-top: -1.4em; /* height of the top-tier text; if sized up in browser, this keeps dropdowns in same vert. position */
}
/* Generally, you use this rule to set style properties that pertain to all menu items. */
/* One exception is the width set here.  We will override this width with a more specific rule (below) */
/* That sets the width for all menu items from the second tier downward in the menu. */
.navMainContainer .navMainHorizontal ul.navMain li {
float: left;
/*	background:url("images/mnavBgSel.gif") repeat-x left top; */
margin: 0;
padding: 0 0 0 2px;
}
/* This rule can be used to set styles for the menu items in the second tier (and lower) in the menu. */
/*.navMainContainer .navMainHorizontal ul.navMain li li*/
.navMainContainer li li {
/*	background: #4682B4 url(bg_nav.gif) repeat-x; */
}
/* This rule establishes the width of menu items below the top tier.  This allows the top tier menu items */
/* to be narrower, for example, than the sub-menu items. */
/* This value you set here should be slightly larger than the left margin value in the next rule. See */
/* its comment for more details. */
.navMainContainer .navMainHorizontal ul.navMain ul li {
width: 100%;
margin: 0;
padding: 0;
}
/* Third tier menus have to be positioned differently than second (or top) tier menu items because */
/* they drop to the side, not below, their parent menu item. This is done by setting the last margin */
/* value (which is equal to margin-left) to a value that is slightly smaller than the WIDTH of the */
/* menu item. So, if you modify the rule above, then you should modify this (below) rule, too. */
/*.navMainContainer .navMainHorizontal ul.navMain li ul li ul*/
.navMainContainer .navMainHorizontal ul.navMain ul li ul {
width: 150px;
font-size: 1.0em; /* prevent the font-size reduction in 2nd level from cascading to 3rd */
margin-top: -3.08em; /* move up to match vert position of parent */
/*margin-left: 203px;*/
margin-left: 179px;
padding: 0;
}
/* Third-tier link background and hover */
.navMainContainer .navMainHorizontal ul.navMain ul li ul li a {
background: #7A909C url(images/dssnavBkg_off.gif) top right repeat-x;
margin: 0;
padding: 0.6em 0.5em 0.6em 1.2em;
border: 0;
height: auto; /* fix cut-off of multiline entries, when last in the list */
}
.navMainContainer .navMainHorizontal ul.navMain ul li ul li a:hover {
background: #7B919D url(images/dssnavBkg_on.gif) top right repeat-x;
}