/*Font-size is set for all menu items here*/
#nav {
	margin: 0;
	padding:0;
	font-size: 60%;
	font-family: Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
	font-weight:bold;
	color:black
}
#nav li {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
/*border top is set to zero to allow the top of the first dropdown to abut the bottom of our buttons*/
#nav ul {
	margin: 0;
	padding: 0;
	z-index: 10000;
	border-top: 0;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #666666;
}
/*top border is put back on for flyouts*/
#nav ul li ul {
	border-top: 1px solid #666666;
	border-right: 1px solid #000000;
	border-bottom: 1px solid #000000;
	border-left: 1px solid #666666;
}
/*this is all we need for top-level links*/
.button_box
{
	display: block;
	border:dotted 1px black;
	width: 175px; float:left;clear:none
}
.button_table
{
	display:table;
	height:inherit
}
#nav .button_table li {
	display:table-cell;
	vertical-align:middle;
text-decoration: none;
}
#nav .button_table li a{
text-decoration: none;
	display:block;
	width:171px;
	padding:4px 0 4px 4px;
		color:black
}
/*This rule styles the sub-menu links*/
#nav ul a, #nav ul a:visited,#nav .button_table ul a, #nav .button_table ul a:visited {
	padding: 4px 10px 4px 16px;
	width:149px;
	display:block;
	background-color:rgb(234,234,187);
	color: black;
}

#nav .button_table .green_button a{background-color:rgb(17,131,38); color:#FFFFFF}
#nav .button_table .red_button a{background-color:rgb(205,55,0); color:#FFFFFF}
#nav .pale_green_button a{background-color:#d2eabb}
#nav .pale_gray_button a{background-color:rgb(234,234,187)}


#nav .green_button a:hover, #nav .green_button a:active, #nav .green_button a:focus
 {
	/* background-position: left bottom; */
		background-color: rgb(53,202,57);
}
#nav .red_button a:hover, #nav .red_button a:active, #nav .red_button a:focus
{
	/* background-position: left bottom; */
		background-color: rgb(255,111,67);
}

/*This is top-level only and is the rule that shifts the background image so that we now
see the bottom one. It is deployed via multiple selectors for hovering, tab key access,
and so it stays persistent when its associated sub-menu is open*/
#nav a:hover, #nav a:active, #nav a:focus
{
	/* background-position: left bottom; */
		background-color: rgb(214,214,177);
}



/*the sub-menu hovers*/
#nav ul a:hover, #nav ul a:active, #nav ul a:focus,
#nav .button_table ul a:hover, #nav .button_table ul a:active, #nav .button_table ul a:focus {
	background-color: rgb(214,214,177);
/*	letter-spacing: 0.01px; */
}


#nav ul li, #nav .button_table ul li {
	display:block; float: none; clear:both; font-weight:normal;
}
/* 2nd and subsequent Submenu widths */
#nav ul, #nav ul li {
	width: 175px;
}

.filters{
	margin:			0;
	padding:		0;
	list-style:		none;
}
.filters ul {
	position:		absolute;
	display:none;
	top:			23px;
	left:			5px;
	width:			15em; /* left offset of submenus need to match (see below) */
}

.filters ul li {
	width:			100%;
}
.filters li:hover{
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.filters li{
	float:			left;
	position:		relative;
}
.filters a{
	display:		block;
	position:		relative;
}


.filters {
	float:			left;
	clear:both;
	margin: 1em 0 0 0;
}


.filters li{
	list-style:none;
}

.filters  li li{
}

.filters li li a{
	border-top:		1px solid #ccc 
}

ul.filters{
	clear:none;
}


