/*
WebControls : Menu Style Sheet
Version 1.0 - Built: Tuesday April 16 2005
Copyright 2004 (c) WebControls Limited. All Rights Reserved.
All Copyright statements must always remain in place in all files at all times
***  PLEASE NOTE: THIS IS NOT FREE SOFTWARE, IT MUST BE LICENSED FOR ALL USE  **** 
This is a commercial software product, please visit http://www.webControls.com for more information.
License Number: Unlicensed
*/

/*  MSDN Silver */ 


/*1. Set font size type and size for both Vertical and Horizontal Menu */
.menuBar a, .menu a , .toolBar a{font-family: Arial,Tahoma,Lucida Sans Unicodem,Menu,Verdana; font-size:9pt;font-weight:100}


/*____________
 Horizontal Menu
_________________*/
/*2. remove margin indents and bullets from list items*/
.menuBar ul {margin:0;padding:0;list-style-type:none;background-color:transparent;height:34px;overflow:hidden}
.menuBar li {position:relative;float:left;margin:3px 1px 0 1px;padding:0;height:34px}
/*3. anchor add extra padding to left and right side to spaceout menu options set default color and background, remove underline decoration*/
.menuBar a {display:block;text-decoration:none;color:white;padding:0px 6px;line-height:34px;}

/*4. set foreground color for hovered item it must set it in this rule*/
.menuBar .hover a {color:black}
/*5. set background color and border for the hover and selected menu item */
/* note: the sum off padding + border + margin should equal the sum of the same attributes defined for  LI element  otherwise your menu will dance*/
.menuBar li.hover     {background-color:orange !important;}
.menuBar li.selected  {background-color:orange !important;}


 

/*7. decorations */ 
.menuBar .separator  {margin:0;height:26px;width:10px;background:url('Images/vSeparator.gif') no-repeat}



/*

Vertical Menu

*/
/*1. remove margin indents and bullets from list items*/
.menu ul {border:1px solid #ccc;z-index:100000}
.menu ul {list-style-type:none; margin:0px;padding:1px; background-color:white}

/*2. set padding between menu and option outline */
.menu li {position:relative;padding:2px}

/*3. submenu right arrow */
.menu .submenu {background:url("Images/rightArrow.gif") no-repeat 99% 50%}
.menu .hoversubmenu {background:url('Images/rightArrow.gif') no-repeat 99% 50%}

/*4. position must be relative very important otherwise IE6 looses the absolely positioned images in quirks mode*/
.menu a {position:relative;display:inline;text-decoration:none;padding:2px 16px 2px 6px;color:black;margin:0px;height:1em;background-color:transparent}

/*5. W3C  doesn't support height on inline items so switch to block.
IE doesn't like block without a width, since we don't want to set widths we like them to be automatic
hence this hack*/
html>body .menu a {display:block;height:1.3em}

/*6. set menu text color */
.menu .hover a {color:black }
/*7. define the menu hover */
.menu .hover { background-color:orange !important; border:1px solid #aaaaaa; padding:1px }

/*8.0 separator line break */
.menu .separator {position:relative;margin-left:0;margin-top:1px;margin-bottom:0px;padding:0px;line-height:1px;border-top:1px solid silver;overflow:hidden}
/*8.1 hacks for ie5.0  ie5 cannot see after  quote**quote */
.menu .separator {top:.5em ; top/**/:0px }

/*9. disabled menu options set color to gray and dim images */
.menu .disable a, .menuBar .disable a {color:#aaa}




/* Shadow */
.shadow {-moz-opacity:3; opacity:0.3; background-color:#333;border:none; 
         filter: progid:DXImageTransform.Microsoft.Shadow(direction=135,color=gray,strength=4);
         }


/* Menu Scroll Bar when menu vertical size greater than available client height*/
a.scrollUp {position:absolute;border:1px solid #ddd;padding:0px;height:13px;overflow:hidden;background: white url('Images/scrollUp.gif') no-repeat 50% 50%}
a.scrollDown {position:absolute;border:1px solid #ddd;padding:0px;height:13px;overflow:hidden;background: white url('Images/scrollDown.gif') no-repeat 50% 50%}
a:hover.scrollDown {border:1px solid #aaaaaa;padding:0px;background-color:lightsteel}
a:hover.scrollUp {border:1px solid #aaaaaa;padding:0px;background-color:lightsteel}
/*W3C Box hack*/
html>body a.scrollUp,html>body a.scrollDown {height:11px}



