/* MAIN NAV */
.mainnav{width:960px; height:42px; position:relative; z-index:100;font-family:Verdana,Arial,Helvetica,sans-serif;background-image: url(/img/nav_bg.gif);}
/* hack to correct IE5.5 faulty box model */
* html .mainnav {width:960px; width:960px;}
/* remove all the bullets, borders and padding from the default list styling */
.mainnav ul {padding:0;margin:0;list-style-type:none;}
.mainnav ul ul {width:220px;}

/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.mainnav li {float:left; position:relative;}

/* style the links for the top level */
.mainnav a, .mainnav a:visited 
{display:block;font-size:13px;text-decoration:none; color:#636768; height:42px; border-right:1px solid #a6a7ab;background-image: url(//www.iogear.com//img/nav_bg.gif); padding: 0 21px 0 21px; line-height:42px; font-weight:bold;
}
.mainnav a:hover{color:#FFF !important;}


/* a hack so that IE5.5 faulty box model is corrected */
* html .mainnav a, * html .mainnav a:visited {width:200px; width:138px;}

/* style the second level background */
.mainnav ul ul a.drop, .mainnav ul ul a.drop:visited{background-image:none !important; color:#ffffff;}


/* style the second level hover */
.mainnav ul ul a.drop:hover{background-image:none !important; color:#ffffff;}
.mainnav :hover > a, .mainnav ul ul :hover > a{color:#FFF;  background-image:url(//www.iogear.com//img/nav_bg_over.gif);}
.mainnav ul ul :hover > a{ background-color:#000; color:#FFF;}


/* style the third level background */
.mainnav ul ul ul a, .mainnav ul ul ul a:visited{background-image:none !important; color:#ffffff; height:auto; line-height:1em; padding:8px 0px 8px 20px; width:200px; border-width:0 1px 0px 1px; font-weight: normal; text-align: left; 
}
/* style the third level hover */
.mainnav ul ul ul a:hover{background-color:#a1a09f; background-image:none !important; color:#ffffff; }
.mainnav ul ul{visibility:hidden;position:absolute;top:42px;left:0;width:220px; height:240px !important;}

/* another hack for IE5.5 */
* html .mainnav ul ul {top:30px;t\op:31px;}
/* position the third level flyout menu */
.mainnav ul ul ul{left:220px; top:-1px; width:220px;}

/* position the third level flyout menu for a left flyout */
.mainnav ul ul ul.left {left:-149px;}
/* style the table so that it takes no ppart in the layout - required for IE to work */
.mainnav table {position:absolute; top:0; left:0; border-collapse:collapse;;}

/* style the second level links */
.mainnav ul ul a, .mainnav ul ul a:visited {background-image:none !important; color:#ffffff; height:auto; line-height:1em; padding:8px 0px 8px 20px; width:200px; border-width:0 0px 0px 1px; font-weight: normal; text-align: left;
}
/* yet another hack for IE5.5 */
* html .mainnav ul ul a, * html .mainnav ul ul a:visited {width:220px;width:220px;}

/* style the top level hover */
.mainnav a:hover, .mainnav ul ul a:hover{color:#000; background-color:#a1a09f;}
.mainnav a:hover{color:#3d4041; background-image:url(//www.iogear.com/img/nav_bg_over.gif);
}

/* make the second level visible when hover on first level list OR link */
.mainnav ul li:hover ul,
.mainnav ul a:hover ul{visibility:visible;}
/* keep the third level hidden when you hover on first level list OR link */
.mainnav ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.mainnav ul :hover ul :hover ul{ visibility:visible;}


.mainnav ul ul a{ border:0 none !important; font-family:Arial,Helvetica,sans-serif !important; font-size:13px !important; }
.mainnav ul ul{  height:240px !important; padding-top:10px; background-color:#3d4041; filter: none; -moz-opacity: 0.92; KhtmlOpacity: .92; opacity: .92;}
/* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=92)"; filter: alpha(opacity=92); -moz-opacity: 0.92; KhtmlOpacity: .92; opacity: .92; */
.mainnav ul ul ul{  height: auto !important; background-color:#484c4e; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=95)"; filter: alpha(opacity=95); }
.mainnav ul ul ul.extItem, .mainnav ul ul ul.extItem li{ width:260px !important;}
.mainnav ul ul ul.extItem a{ width:240px !important;}
.mainnav ul ul.extHeight{ height:260px !important;}

a.itson{color:#FFF !important; background-image:url(//www.iogear.com//img/nav_bg_over.gif) !important;}
a.ilogo{display:block; margin-top:35px; outline:0 none; width:200px; height:40px;}