/* TOP NAVIGATION STYLES */

/* At the time that this css was developed, the navigation markup followed this structure:

<div class="menu">
    <ul class="navItems">
        <li>Products|Industries|About (with an <a> link)
            <ul (first flyout level) class="industriesMenu|aboutMenu|productsMenu">
                <li>First flyout level item
                    <a> For the item itself
                    <ul> (second flyout level)
                        <li>Second flyout level item
                            <a> For the item itself
                            <ul> (third flyout level)
                                <li>Third flyout level item 
                                    <a> For the item itself

IE6 renders this with industriesMenu cell nested tables.

* html hacks are utilized to get things to look right in IE6.

*/

/* Resets */
.menu {border:0;font-weight:inherit;font-style:inherit;font-size:100%;line-height:1;font-family:inherit;text-align:left;vertical-align:baseline;margin:0;padding:0;}
.menu table{border-collapse:collapse;border-spacing:0;}
.menu ul{list-style:none;}

.expanded, .expanded:hover { background: url(/images/arrow.gif) no-repeat 205px 8px; }

/* First level - image buttons */
.menu { font-size: 12px; width: 174px; position: absolute; top: 21px; left: 12px; z-index: 10;}
* html .menu { left: 3px;} /* IE6-specific positioning */
.menu ul { list-style:none; text-align:center; padding:0; }
.menu li { position:relative; float:left; z-index:150; }
.menu ul li a { float:left; display:block; width:174px; text-decoration:none; color:#fff; }

/* General second level - first flyout level */
.menu ul ul { display: none; position:absolute; top:0; left:174px; z-index:100; margin:0; padding-top:14px; width: 228px; }
.menu ul ul li { position:static; clear:both; padding: 0; }
.menu ul ul li a { display:block; height:auto; border-left:10px solid #E26A1E; text-decoration:none; text-align:left; font-family: Helvetica, Verdana, Arial, Sans-Serif; line-height: 1.2; color:#fff; font-size:10px; font-weight:400; padding:4px 8px 4px 8px; }
.menu ul.navItems ul li a:hover { background-color:#bd4900; text-decoration:none; cursor: hand; cursor: pointer; }

/* General third level - second flyout level */
.menu ul ul ul { display: none; top:0; left:228px; width:228px; margin:0; padding-top:14px;}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul { display: none; }
/* make the third level visible when you hover over second level list OR link */
.menu ul ul ul li a { display:block; height:auto; border-left:10px solid #BD4900; text-decoration:none; text-align:left; font-family: Helvetica, Verdana, Arial, Sans-Serif; line-height: 1.2; color:#fff; font-size:10px; font-weight:400; padding:4px 8px 4px 8px; }
.menu ul.navItems ul ul li a:hover { background-color:#982b00; text-decoration:none; cursor: hand; cursor: pointer; }

/* General fourth level - third flyout level */
.menu ul ul ul ul { display: none; top:0; left:228px; width:228px; margin:0; padding-top:14px; }
/* keep the fourth level hidden when you hover on first 2 levels list OR link */
.menu ul :hover ul :hover ul ul { display: none; }
/* make the fourth level visible when you hover over 3rd level list OR link */
.menu ul ul ul ul li a { display:block; height:auto; border-left:10px solid #982B00; text-decoration:none; text-align:left; font-family: Helvetica, Verdana, Arial, Sans-Serif; line-height: 1.1; color:#fff; font-size:10px; font-weight:400; padding:4px 8px 4px 8px; }
.menu ul.navItems ul ul ul li a:hover { background-color:#762100; text-decoration:none; cursor: hand; cursor: pointer; }

.menu ul ul.industriesMenu a, .menu ul ul.aboutMenu a, .menu ul ul.productsMenu a, .menu ul ul.aboutMenu ul li a { width:201px; }
.menu ul ul.industriesMenu, .menu ul ul.aboutMenu, .menu ul ul.aboutMenu ul, .menu ul ul.productsMenu, .menu ul ul.productsMenu ul { height:196px; }

/* style the link hover */
* html .menu ul.navItems a:hover { text-decoration:none; cursor: hand; cursor: pointer; }
.menu ul.navItems :hover > a { text-decoration:none; cursor: hand; cursor: pointer; }
* html .menu ul.navItems ul a:hover { background-color:#bd4900; text-decoration:none; cursor: hand; cursor: pointer; }
.menu ul.navItems ul :hover > a { background-color:#bd4900; text-decoration:none; cursor: hand; cursor: pointer; }
* html .menu ul.navItems ul ul a:hover { background-color:#982b00; text-decoration:none; cursor: hand; cursor: pointer; }
.menu ul.navItems ul ul :hover > a { background-color:#982b00; text-decoration:none; cursor: hand; cursor: pointer; }

/* Products */
.menu ul.navItems a:hover { text-decoration:none; color:#fff; }
.menu .productsMenu { background:#e26a1e; }
.menu ul.productsMenu li { clear:both; }
.menu ul.navItems ul ul { background:#bd4900; }
.menu ul.navItems ul ul ul { background:#982b00; }
#prodContainer { height: 70px; width: 174px; }
#products { background-position: 0 0; display: block; height: 70px; text-indent: -9000px; width:174px; }
li:hover #products, a:hover #products { background-position: 100% 0; }

/* Industries Served */
#indContainer { height: 70px; width: 174px; }
#indContainer ul { background: #00a28d; top: -70px; }
#indContainer ul ul { background:#007566; top: 0; }
#industries { background-position: 0 0; display: block; height: 70px; text-indent: -9000px; width:174px; }
li:hover #industries, a:hover #industries { background-position: 100% 0; }

.menu .industriesMenu a { border-color: #00A28D; }
.menu ul.navItems ul.industriesMenu li a:hover { background-color:#007566; text-decoration:none; }
* html .menu ul.navItems ul.industriesMenu a:hover { background-color:#007566; text-decoration:none; }
.menu ul.navItems ul.industriesMenu :hover > a { background-color:#007566; text-decoration:none; }

/* About Laird Technologies */
#aboutContainer { height: 70px; width: 174px; }
#aboutContainer ul { background: #606bb0; top: -140px; }
#aboutContainer ul ul { background: #33419c; top: 0; }
#about { background-position: 0 0; display: block; height: 70px; text-indent: -9000px; width:174px; }
li:hover #about, a:hover #about { border-style: none; border-color: inherit; border-width: 0; background-position: 100% 0; }

.menu .aboutMenu a { border-color: #606BB0; }
.menu .aboutMenu ul a { border-color: #33419C; }
.menu ul.navItems ul.aboutMenu li a:hover { background-color:#33419C; text-decoration:none; }
* html .menu ul.navItems ul.aboutMenu a:hover { background-color:#33419C; text-decoration:none; }
.menu ul.navItems ul.aboutMenu :hover > a { background-color:#33419C; text-decoration:none; }
.menu ul.navItems ul.aboutMenu ul li a:hover { background-color:#19204F; text-decoration:none; }
* html .menu ul.navItems ul.aboutMenu ul a:hover { background-color:#19204F; text-decoration:none; }
.menu ul.navItems ul.aboutMenu ul :hover > a { background-color:#19204F; text-decoration:none; }