/* ####################################### */
/* ######### =PRIMARY NAVIGATION ######### */
/* ####################################### */


/* GENERAL
------------------------------------------------*/

div.e-navigation-wrap {
	background: transparent url(/images/body_wrap_bg.jpg) repeat-x 0 40px;
	height: 82px;
}

div.e-navigation-primary {
	background: #000 url(/images/nav_wrap_bg.jpg) no-repeat center 0;
	height: 82px;
}
	





/* TOP LEVEL
------------------------------------------------*/

ul.pri-nav li {
	height: auto;
}

ul.pri-nav li a:link,
ul.pri-nav li a:visited {
	background-color: #111;
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 82px;
	display: block;
	padding: 0;

}

div.e-navigation-primary ul.pri-nav li a:hover,
div.e-navigation-primary ul.pri-nav li a:focus,
div.e-navigation-primary ul.pri-nav li.active-section a:link,
div.e-navigation-primary ul.pri-nav li.active-section a:visited {
	background-position: 0 -82px;
	cursor: pointer;
	outline: 0;
}

ul.pri-nav li#nav_home {
	width: 99px;
}

ul.pri-nav li#nav_home a:link,
ul.pri-nav li#nav_home a:visited {
	background-image: url(/images/nav_home.jpg);
	width: 100%;
}

ul.pri-nav li#nav_about-powabyke {
	width: 103px;
}

ul.pri-nav li#nav_about-powabyke a:link,
ul.pri-nav li#nav_about-powabyke a:visited {
	background-image: url(/images/nav_about.jpg);
	width: 100%;
}

ul.pri-nav li#nav_power-to-be-free {
	width: 144px;
}

ul.pri-nav li#nav_power-to-be-free a:link,
ul.pri-nav li#nav_power-to-be-free a:visited {
	background-image: url(/images/nav_power.jpg);
	width: 100%;
}

ul.pri-nav li#nav_electric-bikes {
	width: 136px;
}

ul.pri-nav li#nav_electric-bikes a:link,
ul.pri-nav li#nav_electric-bikes a:visited {
	background-image: url(/images/nav_our_bikes.jpg);
	width: 100%;
}

ul.pri-nav li#nav_where-to-buy {
	width: 145px;
}

ul.pri-nav li#nav_where-to-buy a:link,
ul.pri-nav li#nav_where-to-buy a:visited {
	background-image: url(/images/nav_buy.jpg);
	width: 100%;
}

ul.pri-nav li#nav_park-and-charge {
	width: 148px;
}

ul.pri-nav li#nav_park-and-charge a:link,
ul.pri-nav li#nav_park-and-charge a:visited {
	background-image: url(/images/nav_park.jpg);
	width: 100%;
}

ul.pri-nav li#nav_faqs {
	width: 142px;
}

ul.pri-nav li#nav_faqs a:link,
ul.pri-nav li#nav_faqs a:visited {
	background-image: url(/images/nav_faqs.jpg);
	width: 100%;
}



div.e-navigation-primary ul.pri-nav li a:link span,
div.e-navigation-primary ul.pri-nav li a:visited span {
	position: absolute;
	left: -9999px;
	padding: 0;
	display: block;
}


/* KILLING IMAGES AND TOP UL STLYES
------------------------------------------------*/

.e-navigation-primary ul ul {
	width: auto; /* tell this to expand to the size of the text in each drop down anchor */
}

.e-navigation-primary ul ul li {	
	line-height: 2.6em;
}


/* Massive load of selectors needed to overide specifity of top level anchor rules. THis is because the top level background images are all referenced by ID which has a higher specifity than classnames. Therefore we need to explicityly overide every ID. If you don't understand please ask Dave and DO NOT ATTEMPT TO HACK!!!!!!!!!!!!! */
ul.pri-nav li#nav_home ul a:link
ul.pri-nav li#nav_home ul a:visited,
ul.pri-nav li#nav_about-powabyke ul a:link,
ul.pri-nav li#nav_about-powabyke ul a:visited,
ul.pri-nav li#nav_power-to-be-free ul a:link,
ul.pri-nav li#nav_power-to-be-free ul a:visited,
ul.pri-nav li#nav_electric-bikes ul a:link,
ul.pri-nav li#nav_electric-bikes ul a:visited,
ul.pri-nav li#nav_where-to-buy ul a:link,
ul.pri-nav li#nav_where-to-buy ul a:visited,
ul.pri-nav li#nav_park-and-charge ul a:link,
ul.pri-nav li#nav_park-and-charge ul a:visited,
ul.pri-nav li#nav_faqs ul a:link,
ul.pri-nav li#nav_faqs ul a:visited {
	background			: 0;
	background			: #222222;
	border-bottom		: 1px solid #555555;
	color				: #fdfdfd;
	display				: 	block;
	height				: 	auto;
	min-width			: 	100px; /* this gives the drop down a min-width of 100px, but the anchor will expand beyond this to "auto" */
	width				: 	auto;
	padding				:	0 1.5em;
	border-left			: 2px solid #555;

}


/* PLEASE READ STATEMENT ABOVE BEFORE EDITING THIS */
ul.pri-nav li#nav_home ul a:hover
ul.pri-nav li#nav_home ul a:focus,
ul.pri-nav li#nav_about-powabyke ul a:hover,
ul.pri-nav li#nav_about-powabyke ul a:focus,
ul.pri-nav li#nav_power-to-be-free ul a:hover,
ul.pri-nav li#nav_power-to-be-free ul a:focus,
ul.pri-nav li#nav_electric-bikes ul a:hover,
ul.pri-nav li#nav_electric-bikes ul a:focus,
ul.pri-nav li#nav_where-to-buy ul a:hover,
ul.pri-nav li#nav_where-to-buy ul a:focus,
ul.pri-nav li#nav_park-and-charge ul a:hover,
ul.pri-nav li#nav_park-and-charge ul a:focus,
ul.pri-nav li#nav_faqs ul a:hover,
ul.pri-nav li#nav_faqs ul a:focus {
	background-color: #111;
	border-left: 2px solid #CF1B27;
	color: #fff;
}


ul.pri-nav li#nav_home ul a span,
ul.pri-nav li#nav_about-powabyke ul a span,
ul.pri-nav li#nav_power-to-be-free ul a span,
ul.pri-nav li#nav_electric-bikes ul a span,
ul.pri-nav li#nav_where-to-buy ul a span,
ul.pri-nav li#nav_park-and-charge ul a span,
ul.pri-nav li#nav_faqs ul a span {
	position: static;
	left: 0;

}



/* BIKES MENU */

ul.pri-nav li#nav_electric-bikes ul,
ul.pri-nav li#nav_electric-bikes li {
	display: block;
	position: relative;
	background: #222;

}


ul.pri-nav li#nav_electric-bikes ul#seconddrop_electric-bikes li ul {
	left: 0px;	
}


ul.pri-nav li#nav_electric-bikes ul#seconddrop_electric-bikes {
	width: 400px;
	position: absolute;
}

ul.pri-nav li#nav_electric-bikes ul#seconddrop_electric-bikes ul {
	width: 200px;
	float: left;
	position: relative;
}

ul.pri-nav li#nav_electric-bikes li.has-drop {
	float: left;
}

ul.pri-nav li#nav_electric-bikes li.has-drop a.light-link span {
	font-weight: bold;

}






/* ####################################### */
/* ############ CUSTOMER LINKS ########### */
/* ####################################### */

.e-customer-links {
	float: right;
}

ul#customer-links li {
	float: left;
	border-left: 1px solid #444;
}

ul#customer-links li a:link,
ul#customer-links li a:visited {
	padding: 0.5em 1em;
	display: block;
	background-color: #2B3638;
	background-position: 0 0;
	background-repeat: repeat-x;
	background-image: url(/images/top_link_bg.jpg);
	color: #ccc;
	font-size: 0.9em;
	text-decoration: none;
}

ul#customer-links li a:hover,
ul#customer-links li a:focus {
	background-position: 0 -26px;
	background-color: #415054;
	color: #fff;

}




/* ####################################### */
/* ############## BIKE NAV ############### */
/* ####################################### */

#pBikeNav,
.pBikeNav {
	width: 276px;
}

#pBikeNav ul,
.pBikeNav ul {
	margin-top: 2.5em;
	font-size: 0.9em;
}

#pBikeNav ul li,
.pBikeNav ul li {
	margin-bottom: 1em;
	overflow: hidden;
	clear: both;
	padding: 0.5em;
/*	border: 1px dotted #fff;*/
	position: relative;
}



#pBikeNav ul li h5 a:link,
.pBikeNav ul li h5 a:link,
#pBikeNav ul li h5 a:visited,
.pBikeNav ul li h5 a:visited {
	color: #444;
}

#pBikeNav ul li p,
.pBikeNav ul li p {
	color: #666;
}

a.bike-nav-image {	
	float: left;
	display: block;
	margin-right: 1em;
	height: 100px;
	overflow: hidden;
}

a.cover-link {
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

a.cover-link:hover,
a.cover-link:focus {
	border: 1px solid #e1e1e1;
	background: url(/images/zoom_in_bw.png) no-repeat 99% 1%;
}



/* ####################################### */
/* ############## BREADCRUMB ############# */
/* ####################################### */

.e-navigation-breadcrumb {
	margin-bottom: 2em;
}