/*
==============================================
=Navigation
==============================================\
----------------------------------------------
Main Navigation
----------------------------------------------
*/

#main-menu{
height:28px;
background:url(/images/ui/main-menu-bg.gif) no-repeat;
background-position:top;
margin:0 0 16px 0;
font-size:11px;
}
#account-wrapper #main-menu{
background:url(/images/ui/account-menu-bg.gif) repeat-x;
padding:0 0 0 32px;
}
#main-menu #nav-login{
line-height:27px;
margin:0 10px 0 0;
float:right;
}
#account-wrapper #nav-login{
margin:0 32px 0 0;
}
#main-menu #nav{
width:527px;
height:28px;
background:url(/images/ui/main-menu-sprite.gif) no-repeat;
background-position:top left;
margin:0;
padding:0;
list-style:none;
}
#account-wrapper #main-menu #nav{
background:url(/images/ui/account-menu-sprite.gif) no-repeat;
background-position:top left;
}

#main-menu #nav ul{
margin:0;
padding:0;
list-style:none;
}
#main-menu #nav li {
background:none;
float:left;
margin:0;
padding:0;
}
#main-menu #nav a {
height:28px;
display:block;
}

#main-menu .menu1 {left:0; width:55px;}
#main-menu .menu2 {left:55px; width:72px;}
#main-menu .menu3 {left:127px; width:54px;}
#main-menu .menu4 {left:181px; width:75px;}
#main-menu .menu5 {left:256px; width:71px;}
#main-menu .menu6 {left:327px; width:83px;}
#main-menu .menu7 {left:410px; width:51px;}
#main-menu .menu8 {left:461px; width:65px;}
/*
 * Original menu items for when promotions come back in 
#main-menu .menu5 {left:256px; width:81px;}
#main-menu .menu6 {left:337px; width:71px;}
#main-menu .menu7 {left:408px; width:83px;}
#main-menu .menu8 {left:491px; width:51px;}
#main-menu .menu9 {left:542px; width:65px;} */

#main-menu .menu1 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) 0 -28px no-repeat;}
#main-menu .menu2 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -55px -28px no-repeat;}
#main-menu .menu3 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -127px -28px no-repeat;}
#main-menu .menu4 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -181px -28px no-repeat;}
#main-menu .menu5 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -256px -28px no-repeat;}
#main-menu .menu6 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -327px -28px no-repeat;}
#main-menu .menu7 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -410px -28px no-repeat;}
#main-menu .menu8 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -461px -28px no-repeat;}

/*
 * Original menu items for when promotions come back in 
#main-menu .menu5 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -256px -28px no-repeat;}
#main-menu .menu6 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -337px -28px no-repeat;}
#main-menu .menu7 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -408px -28px no-repeat;}
#main-menu .menu8 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -491px -28px no-repeat;}
#main-menu .menu9 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -542px -28px no-repeat;}
*/

#products #main-menu .menu2 {background:transparent url(/images/ui/main-menu-sprite.gif) -55px -56px no-repeat;}
#plans #main-menu .menu3 {background:transparent url(/images/ui/main-menu-sprite.gif) -127px -56px no-repeat;}
#rates #main-menu .menu4 {background:transparent url(/images/ui/main-menu-sprite.gif) -181px -56px no-repeat;}
#business #main-menu .menu5 {background:transparent url(/images/ui/main-menu-sprite.gif) -256px -56px no-repeat;}
#account #main-menu .menu6 {background:transparent url(/images/ui/main-menu-sprite.gif) -327px -56px no-repeat;}
#help #main-menu .menu7 {background:transparent url(/images/ui/main-menu-sprite.gif) -410px -56px no-repeat;}
#contact #main-menu .menu8 {background:transparent url(/images/ui/main-menu-sprite.gif) -461px -56px no-repeat;}

/*
 * Original menu items for when promotions come back in 
#promotions #main-menu .menu5 {background:transparent url(/images/ui/main-menu-sprite.gif) -256px -56px no-repeat;}
#business #main-menu .menu6 {background:transparent url(/images/ui/main-menu-sprite.gif) -337px -56px no-repeat;}
#account #main-menu .menu7 {background:transparent url(/images/ui/main-menu-sprite.gif) -408px -56px no-repeat;}
#help #main-menu .menu8 {background:transparent url(/images/ui/main-menu-sprite.gif) -491px -56px no-repeat;}
#contact #main-menu .menu9 {background:transparent url(/images/ui/main-menu-sprite.gif) -542px -56px no-repeat;}
*/

/* Removed ref to #main-menu as IE does weird things for no apparent reason */

#products .menu2 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -55px -56px no-repeat;}
#plans .menu3 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -127px -56px no-repeat;}
#rates .menu4 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -181px -56px no-repeat;}
#business .menu5 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -256px -56px no-repeat;}
#account .menu6 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -327px -56px no-repeat;}
#help .menu7 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -410px -56px no-repeat;}
#contact .menu8 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -461px -56px no-repeat;}

/*
 * Original menu items for when promotions come back in 
#promotions .menu5 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -256px -56px no-repeat;}
#business .menu6 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -337px -56px no-repeat;}
#account .menu7 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -408px -56px no-repeat;}
#help .menu8 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -491px -56px no-repeat;}
#contact .menu9 a:hover {background:transparent url(/images/ui/main-menu-sprite.gif) -542px -56px no-repeat;}
*/

#account-wrapper .menu1 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) 0 -28px no-repeat;}
#account-wrapper .menu2 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -55px -28px no-repeat;}
#account-wrapper .menu3 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -127px -28px no-repeat;}
#account-wrapper .menu4 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -181px -28px no-repeat;}
#account-wrapper .menu5 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -256px -28px no-repeat;}
#account-wrapper .menu6 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -327px -28px no-repeat;}
#account-wrapper .menu7 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -410px -28px no-repeat;}
#account-wrapper .menu8 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -461px -28px no-repeat;}

/*
 * Original menu items for when promotions come back in 
#account-wrapper .menu5 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -256px -28px no-repeat;}
#account-wrapper .menu6 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -337px -28px no-repeat;}
#account-wrapper .menu7 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -408px -28px no-repeat;}
#account-wrapper .menu8 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -491px -28px no-repeat;}
#account-wrapper .menu9 a:hover {background:transparent url(/images/ui/account-menu-sprite.gif) -542px -28px no-repeat;}
*/

#main-menu ul span{
display:none;
}

/*
Little bit naughty here. Span hooks to create vertically extending dropdown backgrounds that aren't just solid blocks.
IE 6.0 doesn't like this too much, needs a JavaScript fix to understand the :hover pseudoclass on the li
*/

#main-menu #nav .dropdown{
position:absolute;
width:155px;
padding:3px 5px 5px 5px;
left:-999px;
}
#main-menu #nav .dropdown li{
width:155px;
}
#main-menu #nav li:hover .dropdown, #main-menu #nav li.sfhover .dropdown{
left:auto;
background:url(/images/ui/dropdown-bottom-bg.gif) no-repeat;
background-position:bottom;
z-index:1000;
}
#main-menu #nav .dropdown a{
height:auto;
margin:0;
color:#545454;
display:block;
}
#main-menu #nav .dropdown span{
width:135px;
padding:3px 10px;
display:block;
}
#main-menu #nav .dropdown li:hover, #main-menu #nav .dropdown li.sfhover{
background:url(/images/ui/hover-bg-m.gif) repeat-y;
}
#main-menu #nav .dropdown li:hover a, #main-menu #nav .dropdown li.sfhover a{
background:url(/images/ui/hover-bg-t.gif) no-repeat;
background-position:top;
color:#fff;
text-decoration:none;
cursor:pointer;
}
#main-menu #nav .dropdown li:hover span, #main-menu #nav .dropdown li.sfhover span{
background:url(/images/ui/hover-bg-b.gif) no-repeat;
background-position:bottom;
}
/*
----------------------------------------------
Left Hand Navigation
----------------------------------------------
*/
#lhn-wrapper{
width:165px;
background:url(/images/ui/lhn-bg-b.gif) no-repeat;
background-position:bottom;
margin:0 0 10px 0;
}
#lhn{
background:url(/images/ui/lhn-bg-t.gif) no-repeat;
background-position:top;
padding:5px 5px 4px 5px;
line-height:18px;
font-size:11px;
}
#lhn h2, #lhn p{
padding:0 9px;
}
#lhn .lhnmain{
margin:0 0 2px 0;
}
#lhn .lhnmain:hover, #lhn .lhnmain .sfhover{
background:url(/images/ui/hover-bg-m.gif) repeat-y;
}
#lhn .lhnmain:hover a, #lhn .lhnmain .sfhover a{
background:url(/images/ui/hover-bg-t.gif) no-repeat;
background-position:top;
color:#fff;
text-decoration:none;
cursor:pointer;
}
#lhn .lhnmain:hover span, #lhn .lhnmain .sfhover span{
background:url(/images/ui/hover-bg-b.gif) no-repeat;
background-position:bottom;
color:#fff;
}
#lhn .lhnmain a{
height:auto;
margin:0;
color: #44a2be;
display:block;
text-decoration:none;
}
#lhn .lhnmain span{
width:143px;
padding:3px 6px 3px 6px;
margin:0;
display:block;
}
.lhnmain .lhn-selected{
background:url(/images/ui/current-bg-m.gif) repeat-y;
}
.lhnmain .lhn-selected a{
background:url(/images/ui/current-bg-t.gif) no-repeat;
background-position:top;
color:#fff;
text-decoration:none;
font-weight:bold;
}
.lhnmain .lhn-selected span{
background:url(/images/ui/current-bg-b.gif) no-repeat;
background-position:bottom;
color:#fff;
}
.lhnmain:hover .lhn-selected, .lhnmain .sfhover .lhn-selected{
background:url(/images/ui/hover-bg-m.gif) repeat-y;
}
#lhn .lhnsub{
height:auto;
background:url(/images/ui/bullet-03.gif) no-repeat;
background-position:9px 0.9em;
margin:0;
}
#lhn .lhnsub a{
display:block;
font-size:11px;
}
#lhn .lhnsub span{
color:#12678e;
padding:4px 0 4px 20px;
margin:0 0 2px 0;
display:block;
}
#lhn .lhnsub:hover, #lhn .lhnsub .sfhover{
background:#def3f9 url(/images/ui/bullet-03.gif) no-repeat;
background-position:9px 0.9em;
}
#lhn .lhnsub:hover a, #lhn .lhnsub .sfhover a{
background:url(/images/ui/shover-bg-t.gif) no-repeat;
background-position:top;
text-decoration:none;
cursor:pointer;
}
#lhn .lhnsub:hover span, #lhn .lhnsub .sfhover span{
background:url(/images/ui/shover-bg-b.gif) no-repeat;
background-position:bottom;
}
.lhnsub .lhn-selected{
background:#edf8e1 url(/images/ui/bullet-03.gif) no-repeat;
background-position:9px 0.9em;
}
.lhnsub .lhn-selected a{
background:url(/images/ui/shover-bg-t.gif) no-repeat;
background-position:top;
text-decoration:none;
font-weight:bold;
}
.lhnsub .lhn-selected span{
background:url(/images/ui/shover-bg-b.gif) no-repeat;
background-position:bottom;
}