﻿
div#topnav { clear: both; height: 31px; margin: 9px 0 7px; position: relative; z-index: 190 !important; }
div#topnav ul { height: 100%; width: 100%; }

li.tierone { background: transparent url(/en_ca/images/nav/nav-bar.gif) no-repeat 0 0; height: 20px; float: left; margin: 0 4px 0 0; list-style-type: none; overflow: hidden; }
li.tierone a { display: block; width: 100%; height: 100%; }

li#top_nav_about { background-position: 0 0; width: 89px; }
li#top_nav_about:hover { background-position: 0 -26px; }

li#top_nav_heart { background-position: -95px 0; width: 117px; }
li#top_nav_heart:hover { background-position: -95px -26px; }

li#top_nav_healthy { background-position: -218px 0; width: 134px; }
li#top_nav_healthy:hover { background-position: -218px -26px; } 

li#top_nav_whd { background-position: -358px 0; width: 161px; }
li#top_nav_whd:hover { background-position: -358px -26px; } 

li#top_nav_tools { background-position: -525px 0; width: 122px; }
li#top_nav_tools:hover { background-position: -525px -26px; }

li#spacer { background-position: -653px 0; width: 129px; cursor:default; }

#topnav li ul {	position: absolute;	left: -999em; height: auto;	width: 14em; z-index: 500 !important; font-weight: normal; margin: 0 0 0 2px; background-color: white; border-left: 1px solid #8a8a8a; border-right: 1px solid #8a8a8a; border-bottom: 1px solid #8a8a8a; top: 26px; padding: 0; }
#topnav li li {	width:  100%; text-align: left; border-bottom: 1px solid lightGrey; list-style-type: none; font-size: 0.69em; background-color: white; padding: 0; position: relative; z-index: 501 !important; }
#topnav ul ul.tiertwo li { position: relative; z-index: 502 !important; }
#topnav ul ul.tiertwo li a { display: block; width: 100%; height: 100%; color: Black; }
#topnav ul ul.tiertwo li a:hover { color: white; }
#topnav li ul a { text-align: left; padding: 2px 7px; }

#top_nav_whd ul.tiertwo { margin: 0 0 0 -80px !important; width:15em;}
#top_nav_tools ul.tiertwo { margin: 0 0 0 -104px !important; }

#topnav li:hover ul ul, 
#topnav li:hover ul ul ul, 
#topnav li.sfhover ul ul, 
#topnav li.sfhover ul ul ul { left: -999em; }

#topnav li:hover ul, 
#topnav li li:hover ul, 
#topnav li li li:hover ul, 
#topnav li.sfhover ul, 
#topnav li li.sfhover ul, 
#topnav li li li.sfhover ul { left: auto; }

#topnav ul.tiertwo li a:hover { color: White; }

li#top_nav_about ul.tiertwo li:hover { background-color: #e59d13; }
li#top_nav_about ul.tiertwo li.sfhover { background-color: #e59d13; }

li#top_nav_heart ul.tiertwo li:hover { background-color: #6ea2d9; }
li#top_nav_heart ul.tiertwo li.sfhover { background-color: #6ea2d9; }

li#top_nav_healthy ul.tiertwo li:hover { background-color: #e27329; }
li#top_nav_healthy ul.tiertwo li.sfhover { background-color: #e27329; }

li#top_nav_whd ul.tiertwo li:hover { background-color: #6ea2d9;}
li#top_nav_whd ul.tiertwo li.sfhover { background-color: #6ea2d9; }

li#top_nav_tools ul.tiertwo li:hover { background-color: #98b055; }
li#top_nav_tools ul.tiertwo li.sfhover { background-color: #98b055; }