/* Menu drop-down outer container. Defines the width of the menu. Amount of content defines the height */
.menuDropDown {
	width: 150px;
	/*width: 130px;*/
	position: absolute;
	z-index: 10;
	left: -6px;
	top: 16px;
	display: none; 
}
/* Top and bottom 'bars' containing the rounded corners, in 4 parts */
.menuDropDown .topBarLeft, .menuDropDown .topBarRight, .menuDropDown .bottomBarLeft, .menuDropDown .bottomBarRight {
	float: left;
	width: 50%;
	background-repeat: no-repeat;
}
.menuDropDown .topBar, .menuDropDown .topBarLeft, .menuDropDown .topBarRight {
	height: 5px;
}
.menuDropDown .topBarLeft {
	background-image: url('/img/menu/menu-drop-top_l.png'); background-position: left;
	float: left;
}
.menuDropDown .topBarRight {
	background-image: url('/img/menu/menu-drop-top_r.png'); background-position: right;
	float: right;
}
.menuDropDown .bottomBar, .menuDropDown .bottomBarLeft, .menuDropDown .bottomBarRight {
	height: 12px;
}
.menuDropDown .bottomBarLeft {
	background-image: url('/img/menu/menu-drop-bot_l.png');  background-position: left;
	float: left;
}
.menuDropDown .bottomBarRight {
	background-image: url('/img/menu/menu-drop-bot_r.png');  background-position: right;
	float: right;
}

/* Container DIVs for the actual menu content. 2 containers to allow a left and right background image */
.menuDropDown .menuContentOuter {
	width: 100%;
	background-image: url('/img/menu/menu-left-repeat.png');
	background-position: left;
	background-repeat: repeat-y;
}
.menuDropDown .menuContent {
	background-image: url('/img/menu/menu-right-repeat.png');
	background-position: right;
	padding: 0px 8px;
	background-repeat: repeat-y;
}

/* Style of the 'a' menu items */
a.menuDrop, a.menuDropFirst, a.menuDropLast {
/*	background-color: #ffffff; */
	background-image: url('/img/menu/menu-horiz-repeat.png');
	background-position: top left;
	background-repeat: repeat-x;
	display: block;
	padding: 4px 2px 4px 5px;
	font-family: Arial;
	color: rgb(106,115,123);
	text-decoration: none;
	font-size: 11px;
	/* line-height: 13px; */
}
a.menuDropLast {
	padding: 4px 2px 1px 5px;
}
a.menuDropFirst {
/*	background-color: #ffffff; */
	background-image: url('/img/menu/menu-horiz-repeat-first.png');
	background-repeat: repeat-x;
	background-position: top left;
	padding: 1px 2px 4px 5px;
}
a.menuDrop:hover, a.menuDropFirst:hover, a.menuDropLast:hover {
/*	color: rgb(162,194,151);*/   /*Green*/
        color: rgb(102,153,120); 
	/*   color: rgb(50,50,50); */ /*Dark Grey*/
}


a.menuDropper {
	/*   background-image: url('Menu-green-blob.gif');
	background-repeat: no-repeat; */
	/*position: relative;*/ /* This needs to be the anchor for the drop down position? */
	display: block; /*float: left; A wrapper div does the "relative" positioning, and the float:left*/
	/*width: 137px; less padding*/
	/* width: 133px; */
	width: 153px;
	height: 16px;
	line-height: 16px;
	padding: 0px 0px 0px 5px;
	/*   margin: 0px 3px 0px 0px; */
	color: #ffffff;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	font-family: Arial;
}
/*a.menuDropper:hover {
   background-image: url('Menu-grey-blob.gif');
}*/

div.menuPositioner, div.menuPositionerActive {
	background-color: rgb(173,217,182);
	background-image: url('/img/menu/MenuBlob-137.gif');
	background-repeat: no-repeat;
	width: 137px; /* width: 117px; */
	height: 16px;
	margin: 0px 3px 0px 0px;

	position: relative;
	float: left;
}
div.menuPositioner:hover {
	background-color: rgb(102,102,102);
	background-image: url('/img/menu/MenuBlobSel-137.gif');
}
div.menuPositionerActive {
	background-image: url('/img/menu/MenuBlobSel-137.gif');
}

div.menuPositioner:hover div.menuDropDown, div.menuPositionerActive:hover div.menuDropDown {
	display: block;
}