@charset "utf-8";
/* CSS Document */
#menu { list-style-type:none; margin:0 auto 0px auto; padding:0; width:90px; }
#menu li { padding:0; margin:0; position:relative; width:90px; height:2.8em; z-index:100; }
#menu dl { margin: 0; padding: 0; background: transparent; position:absolute; top:0; left:0; background-color:#302f2d; }
#menu dt { margin:0; padding:0; }
#menu dl.dl2 dt, #menu dl.dl3 dt { display:none; margin-bottom:1px; }
#menu dd { display:none; margin:0; padding:0; color: #fff; width:230px; float:right; clear:right; height:20px; }
#menu li:hover { width:552px; }
#menu li:hover .dl1, #menu li a:hover .dl1 { width:90px; display:block; position:absolute; top:0; left:0; }
#menu li:hover dl.dl1 { background-color:#FFF; }
#menu li:hover dl.dl1 a, #menu li a:hover dl.dl1 a { color:#fe7a00; background-image: url(../img/hover.jpg); background-color:#FFF; }
#menu li:hover .dl2, #menu li a:hover .dl2 { width:230px; display:block; position:absolute; top:0; left:90px; }
#menu li:hover dl.dl2 dt a, #menu li a:hover dl.dl2 dt a { color:#2d2d2d; background:#e8e7e3; }
#menu li:hover .dl3, #menu li a:hover .dl3 { width:230px; display:block; position:absolute; top:0; left:320px; }
#menu li:hover dl.dl3 dt a, #menu li a:hover dl.dl3 dt a { color:#2d2d2d; background:#e8e7e3; }
#menu li:hover dt, #menu a:hover dt { display:block; border:0; width: 230px; }
#menu li:hover dd, #menu li a:hover dd { display:block; }
#menu li a { text-decoration:none; display:block; color:#FFF; font-size:9px; width:83px; padding-left:7px; }
#menu li a:hover { background-color:#FFF; color:#fe7a00; }
#menu dl.dl1 dt a { display:block; color: #ffffff; padding:0; width:83px; padding-left:7px; background-image: url(../img/dot.jpg); background-repeat: no-repeat; background-position: 77px center; }
#menu dl.dl2 dt a, #menu dl.dl2 dt a:hover { display:block; color: #ffffff; padding:0; width:210px; padding-left:20px; border-left-width: 1px; border-left-style: solid; border-left-color: #5c5d61; }
#menu dl.dl3 dt a { display:block; color: #ffffff; padding:0; width:231px; }
#menu dd a:hover { background: #e8e7e3; color:#2d2d2d; }
#menu dd a, #menu dd a:visited { background:#302f2d; color:#fff; padding:0.5em 0; text-decoration:none; display:block; text-align:left; width:200px; padding-left:30px; font-size:11px; border-left-width: 1px; border-left-style: solid; border-left-color: #5c5d61; line-height:10px; }
#menu table { border-collapse:collapse; padding:0; margin:0px; font-size:9px; }
/* default styling */
.nav, .nav ul { list-style-type:none; margin:0; padding:0; }
.nav a { text-decoration:none; }
.nav { font-family: arial, sans-serif; font-size:12px; width:523px; height:33px; margin:0 auto; text-align:center; }
/* needs a background for IE6 - can be a color or a transparent gif */
.nav a { filter: alpha(opacity=90); opacity:0.9; }
/* style the <b> element so that is does not affect the size of the link */
.nav a b { color:#fff; font-weight:normal; display:block; padding:5px 0; margin:0px; border-right:0; }
.nav ul a b { margin:0 1px; border-width:0 1px; }
.nav ul a b.top { margin:0 1px; border-width:1px 1px 0 1px; }
.nav ul a b.bottom { margin:0 1px; border-width:0 1px 1px 1px; }
.nav1 a.main b { background-image:url(../img/topnavbg.jpg); background-repeat: no-repeat; background-position: right center; }
.nav2 a.down b { background-image:url(../img/topproductbg.jpg); background-repeat: no-repeat; background-position: right center; }
/* HEIGHT */
.nav ul ul { top:-25px; } /* position the top of the flyout sub menus */
/* WIDTHS change this WITH CARE to suit your requirements */

/* FOR NAV1 */
.nav1 a b { background-color:#262626; }
.nav1 { width:80px; }
.nav1 a { width:80px; }
/* FOR NAV2 */
.nav .nav2 a b, .nav .nav2 .fly a b { background-color:#262626; }
.nav .nav2a b, .nav .nav2a .fly b { text-align:left; padding-left: 20px; }
.nav2 { width:100px; }
.nav2 a { width:100px; margin-right:-99px; }
.nav2 ul { left:0px; top:1px; } /* center the dropdown */
.nav2 ul a { width:200px; margin-right:-199px; }
.nav2 ul ul { left:199px; }
.nav2a ul a { width:142px; _width:120px; margin-right:-119px; }
.nav2a ul ul { left:142px; _width:120px; }
.nav2b ul a { width:100px; margin-right:-99px; }
.nav2b ul ul { left:100px; }
.nav2c ul a { width:90px; margin-right:-89px; }
.nav2c ul ul { left:90px; }
/* ----------------------------------------------------------------------------	*/

/* DO NOT CHANGE ANYTHING BELOW */
.nav li { float:left; } /* fixes several IE related bugs, and allows for clearing */
.nav ul { float:left; position:relative; z-index:20; } /* necessary for float drop and to stack the <ul>s */
.nav ul li { clear:left; } /* must clear the floated list item inside sublist */
.nav a { position:relative; display:block; } /* needs to have a position, to be above the rest */
.nav b { text-transform: capitalize;}
.nav a.main { float:left; /* necessary for float drop */ margin-top:10000px; } /* bring the top level links back into view */
.nav .drop, .nav .fly { margin-top:-10000px; } /* hide the sub links and their containers, opera has low upper limits */
.nav ul { margin-bottom:-5000px; } /* avoid any interaction between the subs, can be any large size */
/* ----------------------------------------------------------------------------	*/
/* The bit that does ALL the work to bring the sub menus into view */
.nav a:hover, .nav a:focus, .nav a:active { margin-right:0; z-index:10; outline:0; }
.nav a:hover b, .nav a:focus b, .nav a:active b, .nav .nav2 a:hover b, .nav .nav2 a:focus b, .nav .nav2 a:active b { cursor:pointer; background-color:#fe7a00;}
.nav1 a:hover b, .nav1 a:focus b, .nav1 a:active b { text-decoration: underline; }
.nav2 ul a:hover, .nav2 ul a:focus, .nav2 ul a:active { margin-right:-100px; }
.nav2a ul a:hover, .nav2a ul a:focus, .nav2a ul a:active { margin-right:-20px; }
.nav2b ul a:hover, .nav2b ul a:focus, .nav2b ul a:active { margin-right:0; }
.nav2c ul a:hover, .nav2c ul a:focus, .nav2c ul a:active { margin-right:10px; }
.nav3 ul a:hover, .nav3 ul a:focus, .nav3 ul a:active { margin-right:-20px; }
.nav3a ul a:hover, .nav3a ul a:focus, .nav3a ul a:active { margin-right:20px; }
.nav4 ul a:hover, .nav4 ul a:focus, .nav4 ul a:active { margin-right:-30px; }
.nav4a ul a:hover, .nav4a ul a:focus, .nav4a ul a:active { margin-right:0; }
/* OPERA fix */
.nav ul:hover { clear:left; }
.nav span { float:right; padding-right:10px; font-size:4px; font-weight:bold; line-height:20px; }
/* ---------------------------------------------------------------------------- */

[if lte IE 7]> /* bug fixes for IE7 and lower - DO NOT CHANGE */
.nav .fly {
width:99%;
} /* make each flyout 99% of the prevous flyout */
a:active { } /* requires a blank style for :active to stop it being buggy */
.nav ul:hover { clear:none; } /* cancel OPERA fix */

<![endif]