/* ====================================================================================== 
	Copyright (C) 2008 JPL Productions & HERSHEY FOODS.  All Rights Reserved. 
	----------------------------------------------------------------------------------- 
	Author(s) : Jeremy Jackson		jjackson@jplcreative.com

	Date      : 1/30/2008  
	Notes     : Navigation css document for Eastern Insurance. 
	----------------------------------------------------------------------------------- 
	Change Log 
        
	Date		Name				Desc 
         
 ========================================================================================= */


/* ******************************************************** */
/* +++++ STRUCTURE: MAIN NAVIGATION +++++ */
ul#main_nav { }
ul#main_nav li { float:left; position:relative; padding:0px; margin:0px; }
ul#main_nav li a { padding:9px 0px 0px 0px; height:22px; display:block; margin:0px; text-align:center; }

/* ******************************************************** */
/* +++++ ESSENTIAL STYLING FOR DROP DOWN NAV +++++ */
#main_nav, #main_nav * { margin:0px; padding:0px; list-style:none; z-index:2; }
#main_nav { line-height:15px; height:30px; width:927px; background:url(/lib/img/nav-background-repeat.jpg) repeat-x 0px 0px #ffffff; margin:0px auto 0px auto; padding:0px 0px 0px 25px;  }
#main_nav li:hover { visibility:inherit; } /* fixes IE7 'sticky bug' */
#main_nav ul { position:absolute; top:-999em; } /* left offset of submenus need to match (see below) */
#main_nav ul li { width:100%;  }
ul#main_nav ul a { width:100%; margin:0px; text-align:left; }
ul#main_nav li:hover ul,
ul#main_nav li.sfHover ul { left:8px; top:31px; /* match top ul list item height */ z-index:9999; padding:0px; margin:0px; }
ul#main_nav li:hover li ul,
ul#main_nav li.sfHover li ul { top:-999em; }
ul#main_nav li ul li { width:100%; height:auto; float:left; background:none; }
ul#main_nav li ul li a { display:block; height:auto; float:left; padding:5px 5px 8px 10px;  }
ul#main_nav ul span { display:block; width:100%; height:15px; float:left; }
ul#main_nav li li:hover ul,
ul#main_nav li li.sfHover ul { left:8em; /* match ul width */ top:0px; }
ul#main_nav li li:hover li ul,
ul#main_nav li li.sfHover li ul { top:-999em; }
ul#main_nav li li li:hover ul,
ul#main_nav li li li.sfHover ul { left:8em; /* match ul width */ top:0px; }
ul#main_nav li.sfHover ul ul { left:180px; z-index:3; } /* second-level fly out */


/* main li widths */
ul#main_nav li#nav_home a { width:41px; }
ul#main_nav li#nav_why a { width:157px; }
ul#main_nav li#nav_agents a { width:123px; }
ul#main_nav li#nav_employers a { width:145px; }
ul#main_nav li#nav_group a { width:197px; }
ul#main_nav li#nav_claims a { width:87px; }
ul#main_nav li#nav_return a { width:149px; }

/* drop downs widths */
ul#main_nav li#nav_why ul { width:200px; }
ul#main_nav li#nav_agents ul { width:200px; }
ul#main_nav li#nav_employers ul { width:200px; }
ul#main_nav li#nav_group ul { width:200px; }
ul#main_nav li#nav_claims ul { width:200px; }
ul#main_nav li#nav_return ul { width:200px; }

/* anchor widths for drop downs */
ul#main_nav li#nav_why ul li a { width:159px; }
ul#main_nav li#nav_agents ul li a { width:159px; }
ul#main_nav li#nav_employers ul li a { width:159px; }
ul#main_nav li#nav_group ul li a { width:159px; }
ul#main_nav li#nav_claims ul li a { width:159px; }
ul#main_nav li#nav_return ul li a { width:159px; }

/* anchor backgrounds on hover */
ul#main_nav li#nav_home a { background:url(/lib/img/nav/nav-home-bg.gif) no-repeat; }
ul#main_nav li#nav_why a { background:url(/lib/img/nav/nav-why-bg.gif) no-repeat; }
ul#main_nav li#nav_agents a { background:url(/lib/img/nav/nav-agents-bg.gif) no-repeat; }
ul#main_nav li#nav_employers a { background:url(/lib/img/nav/nav-employers-bg.gif) no-repeat; }
ul#main_nav li#nav_group a { background:url(/lib/img/nav/nav-group-bg.gif) no-repeat; }
ul#main_nav li#nav_claims a { background:url(/lib/img/nav/nav-claims-bg.gif) no-repeat; }
ul#main_nav li#nav_return a { background:url(/lib/img/nav/nav-return-bg.gif) no-repeat; }

/* shadow repeaters for drop downs */
ul#main_nav li#nav_why ul li { width:184px; background:url(/lib/img/nav/nav-employers-list-bg.png) 0px 0px repeat-y; margin:0px; padding:0px; }
ul#main_nav li#nav_agents ul li { width:184px; background:url(/lib/img/nav/nav-employers-list-bg.png) 0px 0px repeat-y; margin:0px; padding:0px; }
ul#main_nav li#nav_employers ul li { width:184px; background:url(/lib/img/nav/nav-employers-list-bg.png) 0px 0px repeat-y; margin:0px; padding:0px; }
ul#main_nav li#nav_group ul li { width:184px; background:url(/lib/img/nav/nav-employers-list-bg.png) 0px 0px repeat-y; margin:0px; padding:0px; }
ul#main_nav li#nav_claims ul li { width:184px; background:url(/lib/img/nav/nav-employers-list-bg.png) 0px 0px repeat-y; margin:0px; padding:0px; }
ul#main_nav li#nav_return ul li { width:184px; background:url(/lib/img/nav/nav-employers-list-bg.png) 0px 0px repeat-y; margin:0px; padding:0px; }

/* shadow bottom for drop downs */
ul#main_nav li#nav_why ul span { width:184px; background:url(/lib/img/nav/nav-employers-list-bottom-bg.png) 0px 0px no-repeat; }
ul#main_nav li#nav_agents ul span { width:184px; background:url(/lib/img/nav/nav-employers-list-bottom-bg.png) 0px 0px no-repeat; }
ul#main_nav li#nav_employers ul span { width:184px; background:url(/lib/img/nav/nav-employers-list-bottom-bg.png) 0px 0px no-repeat; }
ul#main_nav li#nav_group ul span { width:184px; background:url(/lib/img/nav/nav-employers-list-bottom-bg.png) 0px 0px no-repeat; }
ul#main_nav li#nav_claims ul span { width:184px; background:url(/lib/img/nav/nav-employers-list-bottom-bg.png) 0px 0px no-repeat; }
ul#main_nav li#nav_return ul span { width:184px; background:url(/lib/img/nav/nav-employers-list-bottom-bg.png) 0px 0px no-repeat; }

/* hover states for navigation */
#main_nav li#nav_home a:hover { background-position:0px -31px; }
#main_nav li#nav_why:hover a, ul#main_nav li#nav_why.sfHover a,
#main_nav li#nav_agents:hover a, ul#main_nav li#nav_agents.sfHover a,
#main_nav li#nav_employers:hover a, ul#main_nav li#nav_employers.sfHover a,
#main_nav li#nav_group:hover a, ul#main_nav li#nav_group.sfHover a,
#main_nav li#nav_claims:hover a, ul#main_nav li#nav_claims.sfHover a,
#main_nav li#nav_return:hover a, ul#main_nav li#nav_return.sfHover a { color:#ffffff; text-decoration:none; background-position:0px -31px; }
ul#main_nav li#nav_why ul li a, ul#main_nav li#nav_why:hover ul li a, ul#main_nav li#nav_why.sfHover ul li a,
ul#main_nav li#nav_agents ul li a, ul#main_nav li#nav_agents:hover ul li a, ul#main_nav li#nav_agents.sfHover ul li a,
ul#main_nav li#nav_employers ul li a, ul#main_nav li#nav_employers:hover ul li a, ul#main_nav li#nav_employers.sfHover ul li a,
ul#main_nav li#nav_group ul li a, ul#main_nav li#nav_group:hover ul li a, ul#main_nav li#nav_group.sfHover ul li a,
ul#main_nav li#nav_claims ul li a, ul#main_nav li#nav_claims:hover ul li a, ul#main_nav li#nav_claims.sfHover ul li a ,
ul#main_nav li#nav_return ul li a, ul#main_nav li#nav_return:hover ul li a, ul#main_nav li#nav_return.sfHover ul li a { background:none; text-transform:none; color:#022893; font-weight:normal; text-decoration:none; }
ul#main_nav li#nav_why ul li a:hover,
ul#main_nav li#nav_agents ul li a:hover,
ul#main_nav li#nav_employers ul li a:hover,
ul#main_nav li#nav_group ul li a:hover,
ul#main_nav li#nav_claims ul li a:hover,
ul#main_nav li#nav_return ul li a:hover { display:block; background:#dfdfdf; text-decoration:none; }