/* Based partially on Matthew Carroll's keyboard accessible flavor of Suckerfish 
 * Dropdowns by Patrick Griffiths and Dan Webb. 
 * http://carroll.org.uk/sandbox/suckerfish/bones2.html
 */

/* ----[ LINKS ]----*/

/* all menu links */

#mainnav a, #subMenusContainer a{ text-decoration:none; display:block; font-family:Verdana, Geneva, sans-serif; color:#363636; }

/* Just main menu links --[for non-javascript users this applies to submenu links as well]*/
#mainnav a{ margin:0; float:left; }
#mainnav a:hover{ display:block; background-color:none; }

/* Just sub menu links */
#subMenusContainer a, #mainnav li li a{ text-align:left; background-color:#FFF; padding:5px 15px; }
#subMenusContainer a.bottom, #mainnav li li a.bottom{ text-align:left; background-color:#fff; padding:5px 15px; -moz-border-radius-bottomleft: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-left-radius: 3px; -webkit-border-bottom-right-radius: 3px; }


/* All menu links on hover or focus */
#subMenusContainer a:hover, #subMenusContainer a.subMenuParentBtnFocused{ background-color:#0099D8; color:#FFF; }

/* sub menu links on hover or focus */
#subMenusContainer a:hover, #subMenusContainer a.subMenuParentBtnFocused { background-color:#0099D8; color:#FFF; }

/* Parent Sub Menu Links ---[javascript users only]*/
.subMenuParentBtn{ 
/*background: url(img/arrow_right.gif) right center no-repeat;  
*/}

/* Parent Sub Menu Links on hover or focus ---[javascript users only]*/
.subMenuParentBtnFocused{ 
/*background: url(img/arrow_right_over.gif) right center no-repeat;  
*/}

/* Parent Main Menu Links ---[javascript users only]*/
.mainMenuParentBtn{
/*background: url(img/arrow_down.gif) right center no-repeat; 
*/}

/* Parent Main Menu Links on hover or focus ---[javascript users only]*/
.mainMenuParentBtnFocused{
/*background: url(img/arrow_down_over.gif) right center no-repeat; 
*/}

/* ----[ OLs ULs, LIs, and DIVs ]----*/

/* Submenu Outer Wrapper - each submenu is inside a div with this class - javascript users only */
.smOW{ 
display:none; 
position: absolute; 
overflow:hidden; 
/*the 2px left & right padding lets you have a 1px border 
  on the ul or ol inside since overflow is set to hidden*/
padding:0 2px;
margin:0 0 0 -2px;
}

/* All ULs and OLs */
#mainnav, #mainnav ul, #mainnav ol, #subMenusContainer ul, #subMenusContainer ol { padding: 0; margin: 0; list-style: none; line-height: 1.3em; *zoom:0 !important; }

/* All submenu OLs and ULs */
#mainnav ol, #mainnav ul {
/*border around submenu goes here*/ 
border:0 none;
left:0;
*zoom:0 !important;
width:416px;
}

#subMenusContainer{display:block; position:absolute; top:0px; left:0; width:100%; height:0; overflow:visible; z-index:1000000000; }

#subMenusContainer ul, #subMenusContainer ol {
/*border around submenu goes here*/ 
-moz-border-radius-bottomleft: 4px;
-moz-border-radius-bottomright: 4px;
-webkit-border-bottom-left-radius: 4px;
-webkit-border-bottom-right-radius: 4px;
background:#fff;
border:1px solid #CCCCCC;
left:0;
*zoom:0 !important;
}

#subMenusContainer li{ list-style: none; *zoom:0 !important; }
#subMenusContainer li.sub-category a { margin-left:10px; background:url(img/arrow2-blue.png) no-repeat scroll 15px transparent; }
#subMenusContainer li.sub-category a:hover { margin-left:0px; text-indent:20px; background:url(img/arrow2-white.png) no-repeat scroll 25px transparent; background-color:#0099d8; }

/* main menu ul or ol element */
#mainnav{
display:block;
list-style:none;
margin:0 0 0 0;
z-index:5;
text-align: center;
display:block;
*zoom:0 !important;
width:416px;
height:25px;
}

/* List items in main menu --[for non-javascript users this applies to submenus as well]  */
#mainnav li { 
/*great place to use a background image as a divider*/
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
}

#mainnav li.products { 
/*great place to use a background image as a divider*/
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
width:72px;
height:25px;
-moz-border-radius:0;
-webkit-border-radius:0;
}

#mainnav li.products a { 
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
background:url(img/matrix-mainnav.gif) no-repeat scroll 0 0 transparent;
width:72px;
height:25px;
text-indent:-9000px;
}

#mainnav li.products a:hover { background:url(img/matrix-mainnav.gif) repeat scroll 0 -25px transparent; width:72px; }
#mainnav li.products a.selected, #mainnav li.products a.selected:hover { background:url(img/matrix-mainnav.gif) repeat scroll 0 -50px transparent; width:72px; }
#mainnav li.products .sub a { text-indent:0px; }
#mainnav li.products .sub a:hover { background-color:#0099d8; color:#FFF; width:100%; }
#mainnav li.products { margin-left:0px; }

#mainnav li.services { 
/*great place to use a background image as a divider*/
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
width:66px;
height:25px;
-moz-border-radius:0;
-webkit-border-radius:0;
}

#mainnav li.services a { 
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
background:url(img/matrix-mainnav.gif) no-repeat scroll -72px 0 transparent;
width:66px;
height:25px;
text-indent:-9000px;
}

#mainnav li.services a:hover { background:url(img/matrix-mainnav.gif) repeat scroll -72px -25px transparent; width:66px; }
#mainnav li.services a.selected, #mainnav li.services a.selected:hover { background:url(img/matrix-mainnav.gif) repeat scroll -72px -50px transparent; width:66px; }
#mainnav li.services .sub a { text-indent:0px; }
#mainnav li.services .sub a:hover { background-color:#0099d8; color:#FFF; width:100%; }
#mainnav li.services, li.sub-category a { text-indent:10px; }

#mainnav li.solutions-for { 
/*great place to use a background image as a divider*/
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
width:106px;
height:25px;
-moz-border-radius:0;
-webkit-border-radius:0;
}

#mainnav li.solutions-for a { 
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
background:url(img/matrix-mainnav.gif) no-repeat scroll -138px 0 transparent;
width:106px;
height:25px;
text-indent:-9000px;
}

#mainnav li.solutions-for a:hover { background:url(img/matrix-mainnav.gif) repeat scroll -138px -25px transparent; width:106px; }
#mainnav li.solutions-for a.selected, #mainnav li.solutions-for a.selected:hover { background:url(img/matrix-mainnav.gif) repeat scroll -138px -50px transparent; width:106px; }
#mainnav li.solutions-for .sub a { text-indent:0px; }
#mainnav li.solutions-for .sub a:hover { background-color:#0099d8; color:#FFF; width:100%; }
#mainnav li.solutions-for, li.sub-category a { text-indent:10px; }

#mainnav li.why-nextgen { 
/*great place to use a background image as a divider*/
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
width:93px;
height:25px;
-moz-border-radius:0;
-webkit-border-radius:0;
}

#mainnav li.why-nextgen a { 
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
background:url(img/matrix-mainnav.gif) no-repeat scroll -244px 0 transparent;
width:93px;
height:25px;
text-indent:-9000px;
}

#mainnav li.why-nextgen a:hover { background:url(img//matrix-mainnav.gif) repeat scroll -244px -25px transparent; width:93px; }
#mainnav li.why-nextgen a.selected, #mainnav li.why-nextgen a.selected:hover { background:url(img/matrix-mainnav.gif) repeat scroll -244px -50px transparent; width:93px; }
#mainnav li.why-nextgen .sub a { text-indent:0px; }
#mainnav li.why-nextgen .sub a:hover { background-color:#0099d8; color:#FFF; width:100%; }
#mainnav li.why-nextgen, li.sub-category a { text-indent:10px; }

#mainnav li.community { 
/*great place to use a background image as a divider*/
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
width:79px;
height:25px;
-moz-border-radius:0;
-webkit-border-radius:0;
}

#mainnav li.community a { 
display:block;
list-style:none;
position:relative;
float:left;
*zoom:0 !important;
background:url(img/matrix-mainnav.gif) no-repeat scroll -337px 0 transparent;
width:79px;
height:25px;
text-indent:-9000px;
}

#mainnav li.community a:hover { background:url(img/matrix-mainnav.gif) repeat scroll -337px -25px transparent; width:79px; }
#mainnav li.community a.selected, #mainnav li.community a.selected:hover { background:url(img/matrix-mainnav.gif) repeat scroll -337px -50px transparent; width:79px;  }
#mainnav li.community .sub a { text-indent:0px; left:-60px; }
#mainnav li.community .sub a:hover { background-color:#0099d8; color:#FFF; }
#mainnav li.community, li.sub-category a { text-indent:10px; }


/* --------------------------[ The below is just for non-javscript users ]--------------------------*/

#mainnav li:hover {background-position: 0 0;} /* IE8 fix for Sticky menus) */
#mainnav li li:hover {background-position: 0 0;} /* IE8 fix for Sticky menus) */
#mainnav li li li:hover {background-position: 0 0;} /* IE8 fix for Sticky menus) */

#mainnav li li{float:none; *zoom:0 !important; }

#mainnav li li a{ /* Just submenu links*/
position:relative;
float:none;
width:auto;
*zoom:0 !important;
}

#mainnav li ul { /* second-level lists */
position: absolute;
width: 25em;
margin-left: -1000em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
margin-top:2.2em;
*zoom:0 !important;
}

/* third-and-above-level lists */
#mainnav li ul ul { margin: -1em 0 0 -1000em; *zoom:0 !important; }
#mainnav li:hover ul ul {margin-left: -1000em; *zoom:0 !important; }

 /* lists nested under hovered list items */
#mainnav li:hover ul{margin-left: 0; *zoom:0 !important; }
#mainnav li li:hover ul {margin-left: 10em; margin-top:-2.2em; *zoom:0 !important;}

/* extra positioning rules for limited noscript keyboard accessibility */
#mainnav li a:focus + ul {  margin-left: 0; margin-top:0em; width:25em; *zoom:0 !important; }
#mainnav li li a:focus + ul { left:0; margin-left: 0; margin-top:-2.2em; *zoom:0 !important;}
#mainnav li li a:focus {left:0;  margin-left:0;   margin-top:0; *zoom:0 !important;}
#mainnav li li li a:focus {left:0; margin-left: 2010em; width: 10em;  margin-top:-1em; *zoom:0 !important;}
#mainnav li:hover a:focus{ margin-left: 0; *zoom:0 !important; }
#mainnav li li:hover a:focus + ul { margin-left: 10em; *zoom:0 !important; }