/* =Header - START: header styling*/
#header { height: 112px; overflow: hidden; background-color: #ffffff;}
#header .logo-container {width: 150px; float: left;}
#header .logo {height: 23px; width: 111px; overflow: hidden; display: block; margin-top: 37px;}
#header .header_inside {padding: 0 0 0 12px; }

#header .logo a {
	height:23px;
	width:111px;
	overflow:hidden;
	float:left;
	font-size: 1em;
	line-height: 1em;
	position: relative;	
}
#header .logo a span {
	display:block;
	height:23px;
	width:111px;
	position:absolute;
	left:0;
	top:0;
	z-index:1;
	margin: 0;
	padding:0;
	text-indent: -9999em;
	background:url("gr_logo_honda.gif") top left no-repeat;
}


/* =Header - END: header styling*/

/* =Main Navigation - START: navigation styling*/
#navigation,
#sub-navigation {float: left;}
#navigation .navigation_inside {}
#navigation ul,
#sub-navigation ul {list-style: none; width: 100%; float: left; margin-bottom: 0;}
#navigation ul li,
#sub-navigation ul li {float: left; display: inline;}

/* images for primary main nav */
#navigation ul li a{display: block; border-top: 5px #ffffff solid;}
#navigation ul li a:hover {border-top: 5px #ff8100 solid;}

#navigation ul li a,
#sub-navigation ul li a {
	overflow: hidden;
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1em;
	position: relative;	
	display: block;
}

#navigation ul li a:hover span,
#sub-navigation ul li a:hover span  {
	cursor: pointer;
}
#navigation ul li a span,
#sub-navigation ul li a span {
	display:block;
	position:absolute;
	left:0;
	top: 0;
	z-index:1;
	margin: 0;
	padding:0;
	text-indent: -9999em;
}

/* Primary nav */
#header.primary {height: 180px; width: 964px; margin: 0 auto; }
#header.primary #navigation ul li {margin-left: 20px;}
#header.primary #navigation ul li.firstNavItem {margin-left: 0;}
#header.primary #navigation ul li a span {background:url(bcg_navigation-primary.jpg) 0 -5px no-repeat;}
#header.primary #navigation ul li a,
#header.primary #navigation ul li a span {height:163px; width:140px; }
#header.primary #navigation ul li#navCars a:hover span {background-position: 0 -173px}

#header.primary #navigation ul li#navMotor a span {background-position: -160px -5px}
#header.primary #navigation ul li#navMotor a:hover span {background-position: -160px -173px}
#header.primary #navigation ul li#navMotor a:hover {border-color: #ffb507;}

#header.primary #navigation ul li#navPower a span {background-position: -320px -5px}
#header.primary #navigation ul li#navPower a:hover span {background-position: -320px -173px}
#header.primary #navigation ul li#navPower a:hover {border-color: #6baf14;}

#header.primary #navigation ul li#navMarine a span {background-position: -480px -5px}
#header.primary #navigation ul li#navMarine a:hover span {background-position: -480px -173px}
#header.primary #navigation ul li#navMarine a:hover {border-color: #26a3b2;}

#header.primary #navigation ul li#navWater a span {background-position: -640px -5px}
#header.primary #navigation ul li#navWater a:hover span {background-position: -640px -173px}
#header.primary #navigation ul li#navWater a:hover {border-color: #16639e;}

/* Secondary nav */
#header.secondary {background-color: #ffffff;}
	#header .header_inside-1 
	{
		background: #f7f6f5 url(gr_bg_header.gif) 0 0 repeat-x;
		height: 40px;
		clear: both;
		padding: 0;
	}
	
	#header .header_inside-2 { 
		background: #ffffff; 
		padding: 0;
	}

#header.secondary .logo-container {width: 93px; float: right; margin-right: 12px; position:relative; }
#header.secondary .logo { margin: 0px; width: 93px; height: 40px; position:absolute; left:0; top:0; z-index:999; }
#header.secondary .logo a { width: 93px; height: 40px; }

#header.secondary .logo a span 
{ 
	margin: 0; 
	background: url(gr_logo_honda-2.gif) 0 0 no-repeat;
	width: 93px;
	height: 40px; 
	z-index:999;
	top:0;
	right:0;
}

#header.secondary #navigation,
#header.secondary #sub-navigation {width: 921px; margin: 0 auto; float: none; }

#header.secondary #navigation ul { width: auto; }
#header.secondary #sub-navigation ul { width: 100%; padding:12px 0 0 0; }

#header.secondary #navigation ul li.firstNavItem,
#header.secondary #sub-navigation ul li.firstNavItem  {margin-left: 0; }

#header.secondary #navigation ul li.firstNavItem { border: 0;}
	#header.secondary #sub-navigation ul li.firstNavItem {}

#header.secondary #navigation ul li a span {background:url(bcg_navigation-secondary.gif) 0 0 no-repeat;}
	#header.secondary #sub-navigation ul li a span {background:url(bcg_sub-navigation-secondary.gif) 0 0 no-repeat;}

#header.secondary #navigation ul li a,
#header.secondary #navigation ul li a span {height:40px;}
	#header.secondary #sub-navigation ul li a,
	#header.secondary #sub-navigation ul li a span { height: 50px; }

#header.secondary #navigation ul li a {  border-top: none; border-left: 1px solid #f7f6f5; border-right: 1px solid #f7f6f5; }
#header.secondary #navigation ul li a:hover { }
#header.secondary #navigation ul li.active a { border-left: 1px solid #eeeeed; border-right: 1px solid #eeeeed;}
#header.secondary #navigation ul li.active-category a { border-left: 1px solid #eeeeed; border-right: 1px solid #eeeeed;}

#header.secondary #navigation ul li#navHome a { width: 70px; } 
#header.secondary #navigation ul li#navHome a span { background-position: 0 0; width: 70px; } 
#header.secondary #navigation ul li#navHome a:hover span { background-position: 0 -40px; } 
#header.secondary #navigation ul li#navHome.active a span {background-position: 0 -160px}
  
#header.secondary #navigation ul li#navCars a {width: 72px;}
#header.secondary #navigation ul li#navCars a span {background-position: -70px 0; width: 72px;}
#header.secondary #navigation ul li#navCars a:hover span {background-position: -70px -40px; width: 72px;}
#header.secondary #navigation ul li#navCars.active a span { background-position: -70px -160px;}
#header.secondary #navigation ul li#navCars.active a:hover span { background-position: -70px -120px;}
#header.secondary #navigation ul li#navCars.active-category a span,
#header.secondary #navigation ul li#navCars.active-category a:hover span {background-position: -70px -80px; cursor: default}

#header.secondary #navigation ul li#navMotor a {width: 117px;}
#header.secondary #navigation ul li#navMotor a span {background-position: -142px 0; width: 117px;}
#header.secondary #navigation ul li#navMotor a:hover span {background-position: -142px -40px; width: 117px;}
#header.secondary #navigation ul li#navMotor.active a span {background-position: -142px -160px}

#header.secondary #navigation ul li#navPower a {width: 146px;}
#header.secondary #navigation ul li#navPower a span {background-position: -259px 0; width: 146px;}
#header.secondary #navigation ul li#navPower a:hover span { background-position: -259px -40px;}
#header.secondary #navigation ul li#navPower.active a span {background-position: -259px -160px}

#header.secondary #navigation ul li#navMarine a {width: 87px;}
#header.secondary #navigation ul li#navMarine a span {background-position: -405px 0; width: 87px;}
#header.secondary #navigation ul li#navMarine a:hover span { background-position: -405px -40px;}
#header.secondary #navigation ul li#navMarine.active a span {background-position: -405px -160px}

#header.secondary #navigation ul li#navWater a {width: 161px;}
#header.secondary #navigation ul li#navWater a span {background-position: -492px 0; width: 161px;}
#header.secondary #navigation ul li#navWater a:hover span {background-position: -492px -40px}
#header.secondary #navigation ul li#navWater.active a span {background-position: -492px -160px}

#header.secondary #sub-navigation ul li#navNewCars a {width: 96px;}
#header.secondary #sub-navigation ul li#navNewCars a span {background-position: 0 0; width: 96px;}
#header.secondary #sub-navigation ul li#navNewCars a:hover span { background-position: 0px -100px; }
#header.secondary #sub-navigation ul li#navNewCars.active a span,
#header.secondary #sub-navigation ul li#navNewCars.active a:hover span {background-position: 0px -50px; cursor: default}

#header.secondary #sub-navigation ul li#navUsedCars a {width: 139px;}
#header.secondary #sub-navigation ul li#navUsedCars a span {background-position: -96px 0px; width: 139px;}
#header.secondary #sub-navigation ul li#navUsedCars a:hover span { background-position: -96px -100px; }
#header.secondary #sub-navigation ul li#navUsedCars.active a span,
#header.secondary #sub-navigation ul li#navUsedCars.active a:hover span {background-position: -96px -50px; cursor: default}

#header.secondary #sub-navigation ul li#navSpecial a {width: 129px;}
#header.secondary #sub-navigation ul li#navSpecial a span {background-position: -235px 0px; width: 129px;}
#header.secondary #sub-navigation ul li#navSpecial a:hover span { background-position: -235px -100px; }
#header.secondary #sub-navigation ul li#navSpecial.active a span,
#header.secondary #sub-navigation ul li#navSpecial.active a:hover span {background-position: -235px -50px; cursor: default}

#header.secondary #sub-navigation ul li#navForOwners a {width: 114px;}
#header.secondary #sub-navigation ul li#navForOwners a span {background-position: -364px 0; width: 114px;}
#header.secondary #sub-navigation ul li#navForOwners a:hover span { background-position: -364px -100px; }
#header.secondary #sub-navigation ul li#navForOwners.active a span,
#header.secondary #sub-navigation ul li#navForOwners.active a:hover span {background-position: -364px -50px; cursor: default}

#header.secondary #sub-navigation ul li#navFindDealer { float: right; margin-right: 12px; height:50px; }

#header.secondary #sub-navigation ul li#navFindDealer a {width: 101px; }
#header.secondary #sub-navigation ul li#navFindDealer a span {background-position: -478px 0;  width: 101px;}
#header.secondary #sub-navigation ul li#navFindDealer a:hover span {background-position: -478px -100px; }
#header.secondary #sub-navigation ul li#navFindDealer.active a span,
#header.secondary #sub-navigation ul li#navFindDealer.active a:hover span {background-position: -478px 0px; cursor: default }




#sub-navigation ul li .dealerUtils {text-align: right; padding:17px 0 0 0; font-size: 1.083em; line-height: 1.154em; color: #464646;  }
#sub-navigation ul li .dealerUtils img { margin-top: 4px; }
#sub-navigation ul li .dealerUtils a.dealerTitle {font-weight: bold; text-decoration: none;  }
#sub-navigation ul li .dealerUtils a.dealerTitle:hover {font-weight: bold; text-decoration: underline;}
#sub-navigation ul li .dealerUtils a {font-size: 1em; display: inline; width: auto; height: auto; border: none; color: #f12a36; }
#sub-navigation ul li .dealerUtils a:hover {border: none;}
#header.secondary #sub-navigation ul li .dealerUtils a.dealerChange {font-size: 0.769em; line-height: 1.9em; color: #f0646c; overflow:visible; height: auto; display: inline; } /* 10px / 16px */

#header.secondary #sub-navigation ul li#navFindDealer a.dealerChange,
#header.secondary #sub-navigation ul li#navFindDealer a.dealerTitle { width: auto;  }

#header.secondary #sub-navigation ul li#navFindDealer a.dealerTitle {line-height:1.47em; height: 16px;  display: inline-block;}

*html #dealer_detail_container { float: right; margin-right: 12px; display: inline; }
*html #dealer_detail_container p.dealerUtils { width: 400px; }

/* =Main Navigation - END: navigation styling*/


/* Expanding/Contracting navigation in showrooms */
a#header_collapse-expand { background:url(tab_header.gif) no-repeat; display:block; width:140px; height:34px; margin:auto; }
a#header_collapse-expand.active { background-position:bottom; }
	a#header_collapse-expand span { display:none; }

#header.collapsible { margin:0 auto; z-index:999; width:100%; position:absolute; overflow:visible; background:none; height:auto !important; }
#collapsible-content { height:0; display:none; }
a#honda-logo { background:url(gr_logo_honda-4.png) no-repeat; width:93px; height:40px; position:absolute; top:2px; left:50%; margin-left:355px; display:block; }
a#honda-logo span { display:none; }   
