/*
menubar is the root UL and menubar ul applies to all the sub-menu ULs.
We set padding and margin to zero to eliminate all indentation, turn bullets off,
and set a font-family different from the global font-family declared for the
body element above. This sets font for just the menu. Do not add a font-size here.
*/
#menubar, #menubar ul {
	padding: 0;
	margin: 0;
	list-style: none;
	font-family:  Trebuchet MS, Comic Sans MS, Tahoma, Arial, sans-serif;
	font-size:17px; 
	z-index:200;
}

#menuwrapper {
	text-align:left;
	padding-left:0px; /*sets indent of entire nav bar from left */
	padding-right:0px;
	float:left;
	width: 1000px; /*if increase padding-left, need to subtract from here*/
	border-bottom:2px #46290f solid; /*bottom border on nav bar*/
	border-top:2px #46290f solid;
}

/*
Root-Level Links.  Do not change the first two properties.*/
#menubar a {
	display: block;
	text-decoration: none;
	padding: 0px;
	color: #46290f; /*font color of all links*/
}

#menubar a.trigger, #menubar a.noTrigger, #menubar a.firstItem {
width:auto; /*sets the width of the root link boxes. If set to auto, will set it based on the text size of each root link. Ie. will be spaced evenly.*/
background:url(../images/tennisBall.jpg) no-repeat left center;
padding-left:15px; /*inset of text in root link*/
padding-right: 18px; /*alters right distance to next link & distance between text and right background*/
line-height: 50px; /*Changes the vertical alignment of the text. If this is the same as height value, the background image and the text will be centered wrt each other.*/
}

#menuwrapper #menubar #logout a {
	line-height: 50px; 
}

/*
The Root-Level list items. Floating left allows
them to appear horizontally. Width is for IE5 Mac. The last rule in
this style sheet will set the width for this element to auto for all
other browsers - hiding it from IE5 Mac. The width is proportional.
As you add and edit root menu items, you will need to test this width
to ensure it is wide enough to accomodate all text.
*/
#menubar li {
	float: left;
	background:url(../images/vertical_divider.jpg) no-repeat right center;
	margin-right: 18px; /*distance from vertical divider to next link (tennis ball)*/
}

#menuwrapper #menubar a.firstItem {
	margin-left: 15px; /*sets the indent of the first item on the left*/
}

#menubar #logout, #menubar .subtitle, #menubar #lastItem {
	background:none;
}

#menubar li ul, #menubar ul li  { /*drop-down menu items*/
width: 168px;
font-size:16px;
}

#menubar ul li { /*where to change the position of the drop-down links*/
position:relative; 
top:-1px;
border-left:1px #000000 solid;
border-right:1px #000000 solid;
border-bottom:1px #000000 solid;
}

/*
Sub-Menu Unordered Lists describes each dropdown sub-menu grouping. 
Positioned Absolutely to allow them to appear below their root trigger.
Set to display none to hide them until trigger is moused over.
Background Color must be set or problems will be encountered in MSIE.
Right and bottom borders are set to simulate a raised look.
A gradient background image is assigned.
*/
#menubar li ul {
	position: absolute;
	display: none;
	background-color:none;
}

#menuwrapper #menubar ul li{
	top:0;
	left: -19px; /*sets the offset of the drop-down box from the root level link*/
}

/*
The sub-menu links.*/
#menubar ul li a {
	padding: 4px 5px; /*the padding for the drop down links*/
	color: #000000;
}

#menuwrapper #menubar .subtitle {
	background-color:#FFFFFF;
	text-align:center;
	padding: 3px 0px;
}

/*changes the hover characteristics of root links (and all sublinks, unless you specify each link you want it to apply to)*/
#menubar li:hover a.trigger, #menubar a.trigger:focus, #menubar li.p7hvr a.trigger, #menubar li:hover a.noTrigger, #menubar a.noTrigger:focus, #menubar li.p7hvr a.noTrigger, #menubar li:hover a.firstItem, #menubar a.firstItem:focus, #menubar li.p7hvr a.firstItem {
	text-decoration:underline;
}

/*
Set the Sub-Menu UL to be visible when its associated
Root-Level link is moused over. The second selector is 
assigned to IE5 and IE6 via the P7_ExpMenu script.
*/
#menubar li:hover ul, #menubar li.p7hvr ul, #menubar  li.p7hvr a ul {
	display: block;
	background-color:none;
}

/*
Sets the Text color of the Sub-Level links when the Root-Level
menu items are moused over. The second selector is 
assigned to IE5 and IE6 via the P7_ExpMenu script.
The color set should match the normal Sub-Level link color
in the rule: #menubar ul li a. The background color must be
transparent to allow the underlying gradient background on the UL
to show through.
*/
#menubar li:hover ul a, #menubar li.p7hvr ul a {
	background-color: #FFFFFF;
}

/*changes the sub-links before they are moused over
#menuwrapper #menubar li:hover ul a, #menuwrapper #menubar li.p7hvr ul a {
	text-decoration: none;
}*/

/*changes the sub-links appearance when they are moused over*/
#menubar ul a:hover, #menubar ul.p7hvr a, #menubar #logout a:hover {
	color: #3393f3;
}

/* The single backslash \ character inside this comment
causes IE5 Mac to ignore the following rule, which allows other
browsers to render top-level menu items to their natural width.
Do not edit this rule in any way. */
#menubar li {width: auto;}