#firstcolumnWrapper #navigation {font-size:14px; font-family: verdana, Arial, Helvetica, sans-serif;width:220px;border:none;position:relative;z-index:101010;border-bottom:2px solid #999999; /*position + z-index necessary for subnav to float over content pane on hover in DHHS template*/}
#firstcolumnWrapper #navigation ul {margin:0; padding:0; font-weight: normal;}
#firstcolumnWrapper #navigation li {list-style-type:none;}
/*#navigation li a{padding:80px;}*/

#firstcolumnWrapper #navigation ul.top-level {
background:#026896; /*this color shows through on hover in compat view*/
/*background-image:url(/library/images/blueRightArrow.gif) !important;
/*background-repeat:no-repeat !important;
background-position:2px !important; */
}

/*fade in submenus so that sliding mouse across page doesn't display submenus*/
@-webkit-keyframes fadeIn{
from {opacity:0;}
to {opacity:1;}	
}

@keyframes fadeIn{
from{opacity:0;}
to{opacity:1;}	
}


#firstcolumnWrapper #navigation ul.top-level li {
 /*border-bottom: #fff solid;
 border-top: #fff solid;
 border-width: 1px;*/
 /*margin-left:2px;*/
 margin-top:0;
 padding-top:0;
}

#firstcolumnWrapper #navigation a {
 color: #fff;
 cursor: pointer;
 display:block;
 line-height:1.5em;
 /*background-color: #0474a6 !important;*/
/*background-image:none !important;*/
/*
     background-color: #0474a6; /*#1769ae;*/
	 /*
    background-image: -webkit-gradient(linear, left top, left bottom, from(#04628c), to(#067cb1));
    background-image: -webkit-linear-gradient(top, #0474a6, #067cb1);
    background-image:    -moz-linear-gradient(top, #04628c, #067cb1);
    background-image:     -ms-linear-gradient(top, #04628c, #067cb1);
    background-image:      -o-linear-gradient(top, #04628c, #067cb1);
    background-image:         linear-gradient(top, #04628c, #067cb1);
*/
	background-color: #2273b7;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#2981ca), to(#0b4c82));
    background-image: -webkit-linear-gradient(top, #2981ca, #0b4c82);
    background-image:    -moz-linear-gradient(top, #2981ca, #0b4c82);
    background-image:     -ms-linear-gradient(top, #2981ca, #0b4c82);
    background-image:      -o-linear-gradient(top, #2981ca, #0b4c82);
    background-image:         linear-gradient(top, #2981ca, #0b4c82);

}

#firstcolumnWrapper #navigation ul.top-level{
 width: 100%; /* width necessary to give layout to element for compatibility view; otherwise, there is a vertical gap between links in compat view*/
}

div.sub-level{
width:700px;
left:220px;
top:0;
position:absolute;
width:auto;	
}

#firstcolumnWrapper #navigation ul.top-level li:hover ul li a{
 width: 180px; /* width necessary to give layout to element for compatibility view; otherwise, there is a vertical gap between links in compat view*/
}

#firstcolumnWrapper #navigation ul.top-level li ul li:hover ul{
 /*position:absolute;*/
 left:175px;
 padding:0;
 margin:0;
}

#firstcolumnWrapper #navigation ul.top-level li ul li:hover ul li{
 /*border:1px solid white;*/
}

#firstcolumnWrapper #navigation ul.top-level li ul li ul li:hover{
/* border:1px solid #ccc;*/
}

#firstcolumnWrapper #navigation ul.top-level li a:hover{
/*border-bottom:3px solid #026896 !important;*/
}


#firstcolumnWrapper #navigation li:hover ul.sub-level {
    background-color:#0099cc;
    /*border: #ccc solid;
    border-width: 1px;*/
    display: block;
    position: absolute;
    left: 218px;
}



/*all vertical menus except those with subreverse class should display top-down; this has to be done with Javascript/Jquery for <= IE8*, which don't process pseudo-classes*/
#firstcolumnWrapper #navigation li:hover ul:not(.subreverse).sub-level{
	    top:2px;
}
/* this class is called from javascript.js so that the child menus align with parent in IE 8 and lower, which do not recognize the :not pseudo-class above, which is used to apply the menu 'top' position unless the subreverse class (below) has been added to the submenu to reverse the top-down display so that the menu will fit in the viewport */
.positionSub{
	    top:2px;
}

/*vertical menus with subreverse (i.e., reverse submenu display) class should display bottom-up;*/

#firstcolumnWrapper #navigation li:hover ul.subreverse {
    bottom:5% !important;
}

/*
#firstcolumnWrapper #navigation li:hover .sub-level li:last-child{
	border-bottom:3px solid #026896 !important;
}

#firstcolumnWrapper #navigation li:hover .sub-level li:first-child{
	border-top:3px solid #026896 !important;
}
*/

#firstcolumnWrapper #navigation a:hover{
 /*text-decoration:underline;*/
 /*border-left:3px solid #fff;*/
 /*background:none;*/
-webkit-transition: background-color 100ms linear; /*delay mouseover color transition */
transition: background-color 100ms linear;
}


#firstcolumnWrapper #navigation ul.top-level li a, #firstcolumnWrapper #navigation div ul.sub-level li a, #firstcolumnWrapper #navigation ul.sub-level li a{
	padding:7px 5px 7px 5px;
}


#firstcolumnWrapper #navigation .top-level a:hover{
	text-decoration:underline;
	color:#f2eeee !important;
  	background-color: #008ac8 !important;
	background-image:none !important;

}

#firstcolumnWrapper #navigation li:hover {
 /*background: #026896;*/
 /*border-left:3px solid #fff;*/
 position: relative;
}

/*Second Level*/

#firstcolumnWrapper #navigation ul.sub-level, #firstcolumnWrapper #navigation ul.sub-level li ul.sub-level {
    display: none;
	/* to edit in WYSIWYG mode */
}



#firstcolumnWrapper #navigation .sub-level {
font-size:13px;	
}


#firstcolumnWrapper #navigation ul.sub-level li {
    float:left;
	margin-top:0;
	padding-top:0;
	/*border-left:3px solid #1286ba !important;
	border-right:3px solid #1286ba !important;
    border-bottom: 1px solid #f2eeee;*/
}

#firstcolumnWrapper #navigation ul.sub-level li:hover {
	/*border-left:3px solid #006699 !important;
	border-right:3px solid #006699 !important;
	border-bottom:1px solid #006699 !important;*/
}

#firstcolumnWrapper #navigation .sub-level {
    /*text-decoration:underline;*/
}

#firstcolumnWrapper #navigation .sub-level a:hover{
    text-decoration:underline;
		color:#f2eeee !important;
}

/*Third Level*/
#firstcolumnWrapper #navigation .sub-level .sub-level a{
    text-decoration:none !important;
	background-color: #008ac8 !important;
	background-image:none !important;
	border:1px solid #fff;
	}

#firstcolumnWrapper #navigation .sub-level .sub-level a:hover{
    text-decoration:underline !important;
	background-color: #2273b7 !important;
	background-image:none !important;
	border:1px solid #ccc;
	}

/*Fourth Level*/
#firstcolumnWrapper #navigation .sub-level .sub-level .sub-level a:hover{
    text-decoration:underline;
}


/*RESET STYLES*/

/* hide or show menus when a parent list item is hovered */

#firstcolumnWrapper #navigation .sub-level {
	display:none;
}

#firstcolumnWrapper #navigation li:hover .sub-level {
display:block;
-webkit-animation: fadeIn 2s; /*fade in submenus so that sliding mouse across page doesn't display submenus*/
animation: fadeIn 2s;
}

#firstcolumnWrapper #navigation li:hover .sub-level ul{
	float:left;
	border-left:1px solid #ccc;
}




/* default state of 3rd level is hidden */
#firstcolumnWrapper #navigation li:hover .sub-level .sub-level {
	display:none;
}

/* show 3rd level when 2nd level is hovered */
#firstcolumnWrapper #navigation .sub-level li:hover .sub-level {
	display:block;
}

/* if nav has a fourth level... don't show 4th when 2nd level is hovered*/
#firstcolumnWrapper #navigation li:hover .sub-level .sub-level .sub-level{
	display:none;
}

/* if nav has a fourth level... show it when the 3rd level is hovered*/

#firstcolumnWrapper #navigation .sub-level li:hover .sub-level li:hover .sub-level{
	display:block;
}

/* if nav has a Fifth Level... don't show 5th level when 3rd is hovered*/
#firstcolumnWrapper #navigation li:hover .sub-level li:hover .sub-level .sub-level .sub-level {
	display:none;
}

/* if nav has a fifth level... show it when the 4th level is hovered */
#firstcolumnWrapper #navigation .sub-level li:hover .sub-level li:hover .sub-level li:hover .sub-level{
	display:block;
}

/* nav probably shouldn't go six levels but if so add last 2 selectors above; add grandparent li:hover and .sub-level to first and li:hover .sub-level to 2nd */