 /* common styling */
.menu2 { float: left; font-family: Verdana; font-size: 7.5pt; margin:0; width: 750px; z-index: 400; }
.menu2 ul { padding: 0; margin:0; list-style-type: none; z-index: 400; }
/* if you change this to float right, it does it, but puts them in reverse order! */
.menu2 ul li { float: right; position: relative; padding: 0; z-index: 400; }
.menu2 ul li.group { display: block; text-indent: 4px; background: #666; color: #FFF; width: 120px; padding: 2px 1px; }
/* level 1 links */
.menu2 ul li a, .menu2 ul li a:visited { font-size: 7.5pt; float: left; display: block; text-decoration: none; color: #FFF; padding: 6px 0 0 2px; height: 23px; width: 121px; }
.menu2 ul li:hover { width: auto; }
/* Next 2 - Level 1 Items (Hover)  */
.menu2 ul li a:hover { background: transparent url(../images/nav_tab_over.gif) no-repeat; color:#FFF; text-decoration: none; }
.menu2 ul li:hover a { background: transparent url(../images/nav_tab_over.gif) no-repeat; color:#FFF; text-decoration: none; }
.menu2 ul li ul { display: none; }
.menu2 table { margin: -1px -1px 0 -1px; border-collapse: collapse; font-size: 7.5pt; z-index: 400; }

/* specific to non IE browsers */
/* level 2 item */
.menu2 ul li:hover ul { display: block; position: absolute; top: 29px; background: #FFF; left: 0; width: 152px; z-index: 400; }
.menu2 ul li:hover ul.endstop { left: -90px; }
.menu2 ul li:hover ul li ul { display: none; }
/* level 2 items not selected */
.menu2 ul li:hover ul li a { display: block; background: #FFF; color: #000; height: auto; line-height: 120%; padding: 4px 16px; width: 120px; }
/* seems to be the items that push over */
.menu2 ul li:hover ul li a.drop { background: #FFF url(../images/notch_gray.gif) bottom right no-repeat; }
/* level 2 hover - for items that don't push over */
.menu2 ul li:hover ul li a:hover { background: #008CD3; color: #000; }
/* level 2 hover - for items that push over */
.menu2 ul li:hover ul li a:hover.drop { background: #008CD3 url(../images/notch_red.gif) bottom right no-repeat; color: #000; }
/* level 3 items */
.menu2 ul li:hover ul li:hover ul { display: block; position: absolute; top: 0px; color: #000; left: 152px; width: 152px; background: #FFF; }
.menu2 ul li:hover ul li:hover ul li a { background: #FFF; }
.menu2 ul li:hover ul li:hover ul li.group { width: 152px; padding: 3px 0; }
.menu2 ul li:hover ul li:hover ul.left { left: -152px; }
/* level 3 hovered item */
.menu2 ul li:hover ul li:hover ul li a:hover { background: #008CD3; color: #000; }

/* specific to IE5.5 and IE6 browsers */
/* level 2 item */
.menu2 ul li a:hover ul { display: block; position: absolute; top: 28px; background: #FFF; border-bottom: 1px solid #6E6C6E; left: 0px; z-index: 400; }
.menu2 ul li a:hover ul.endstop { left: -90px; }
.menu2 ul li a:hover ul li a { display: block; color: #000; height: 0px; line-height: 120%; padding: 4px 10px; width: 152px; }
/* seems to be the items that push over */
.menu2 ul li a:hover ul li a.drop { background: #FFF url(../images/notch_gray.gif) bottom right no-repeat; padding-bottom: 5px; }
.menu2 ul li a:hover ul li a ul { visibility: hidden; position: absolute; height:0; width:0; }
/* level 2 hover - for items that don't push over */
.menu2 ul li a:hover ul li a:hover { background: #008CD3;color: #000;  }
/* level 2 hover - for items that push over */
.menu2 ul li a:hover ul li a:hover.drop { background: #008CD3 url(../images/notch_red.gif) bottom right no-repeat; color: #000; }
/* level 3 items */
.menu2 ul li a:hover ul li a:hover ul { visibility: visible; position: absolute; top: 0px; color: #000; left: 172px; width: 152px; background: #FFF; } /* diff between left and width is total of left and right margins of menu2 ul li a:hover ul li above */
.menu2 ul li a:hover ul li a:hover ul.left { left:-172px; }
/* level 3 hovered item */
.menu2 ul li a:hover ul li a:hover ul li a:hover { background: #008CD3; color: #000; }

/* all */
.left {clear:both;}
