/************************************************\
 ******************** MASTER ********************
\************************************************/

/*	Created: 22 September 2009 & 4.20pm
 *	Author: Matthew Holmes <www.ivt.com.au>
*/

/*	TOC
 *	----------------------------------------------
 *	1. Colors
 *	2. Reset
 *	3. Links
 *	4. Typography
 *	5. List
 *	6. Forms
 *	7. Base
 *	8. Misc
*/


/*	1. COLORS
 *	----------------------------------------------
 *	orange		=		#fe880f
 *	blue		=		#02246e
 *	grey		=		#666666
*/


/*	2. RESET - DO NOT REMOVE OR MODIFY
 *	----------------------------------------------
*/

	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, hr {
		margin: 0;
		padding: 0;
		border: 0;
		outline: none;
		font-size: inherit;
		font-family: inherit;
		list-style: none;
		}
		
	body {
		line-height: 1;
		}	
		
	/* tables still need 'cellspacing="0"' in the markup */
	table {
		border-collapse: collapse;
		border-spacing: 0;
		}
		
	blockquote, q {
		quotes: none;
		}
		
	q:before, q:after, blockquote:before, blockquote:after {
		content: "";
		}
		
	/* remember to define focus styles! */
	:focus {
		outline: 0;
		}
		
	legend {
		display: none;
		}
		
	hr {
		height: 1px;
		border: 1px solid #CCC;
		}
		
	/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */
	.clearfix:after {
		clear: both;
		content: ' ';
		display: block;
		font-size: 0;
		line-height: 0;
		visibility: hidden;
		width: 0;
		height: 0;
		}

	.clearfix {
		display: inline-block;
		}

	* html .clearfix {
		height: 1%;
		}

	.clearfix {
		display: block;
		}
		
		
/*	3. LINKS
 *	----------------------------------------------
*/		
	
	a:link, a:active, a:visited {
		color: #ee3224;
		}
	a:hover {
		text-decoration: none;
		}
		
		
/*	6. FORMS 
 *	note: some parts of following css 
 *	is using CSS3 selectors. No IE6 support
 *	----------------------------------------------
*/

	form.search input,
	form.postcode input {
		width: 100px;
		padding: 4px 20px 5px 5px;
		border: 0;
		background: url(../images/search-field.gif) no-repeat;
		color: #666666;
		font-size: 11px;
		}
	form.search legend,
	form#signup_form legend,
	form.search label,
	form.postcode legend,
	form.postcode label,
	.search_form legend,
	.search_form label {
		display: none !important;
		}
		
	.search_form {
		padding: 0 0 20px;
		}
	.search_list {
		padding: 5px 0;
		}
	.search_list a,
	.search_pages a {
		color: #ee3224;
		}
	 
		
		
	form#signup_form { margin: 5px 0 0; }
	form#signup_form legend { display: none; }
	form#signup_form li { margin: 0 0 .75em; }
	form#signup_form label { display: block; float: left; width: 100px; margin-right: 5px; text-align: right; }
	
	form#signup_form fieldset fieldset { margin-left: 105px; }
	form#signup_form fieldset fieldset legend { display: block; }
	
	form#signup_form li ul { width: 300px; }
	form#signup_form li li { float: left; width: 150px; margin: 0; }
	form#signup_form li li label { float: none; width: auto; margin: 0; text-align: left; }
	
	form#signup_form button { margin-left: 105px; }
		
		
		
/*	7. BASE
 *	----------------------------------------------
*/
	
	body {
		margin: 18px 0 0;
		background-image: url(../images/plain_final.jpg);
		background-color: #000;
		background-repeat: no-repeat;
		background-position: top center;
		background-attachment: fixed;
		color: #000;
		font: 62.5%/1.6 Arial, Helvetica, sans-serif;
		}
		
	#container {
		width: 980px;
		margin: 0 auto;
		}
		
	#header {
		position: relative;
		height: 80px;
		background: url(../images/bg-header.png) 0 62px no-repeat;
		}

	.accessibility, hr, #header h1 {
		position: absolute !important;
		left: -999em !important;
		}
		
	.right {
		float: right;
		}
		
	
	/* << ----------- STRUCTURE ----------- */
	
	/* -- logo */
	#header div#logo {
		float: left;
		width: 214px;
		padding: 12px 0 0 15px;
		line-height: 0;
		}
	
	/* -- slogan */
	#header div#slogan {
		float: left;
		padding: 15px 152px 0 0;
		}
		
	#header form {
		position: absolute;
		top: 20px;
		right: 20px;
		width: 126px;
		}
	#header form button {
		position: absolute;
		top: 0;
		right: 0;
		display: block;
		width: 25px;
		height: 25px;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
		text-indent: -999em;
		}
	#header p {
		position: absolute;
		top: 47px;
		right: 20px;
		}
		
	
	/* -- navigation */
	#navigation {
		position: relative;
		height: 46px;
		background: url(../images/bg-header.png) 0 -18px no-repeat;
		z-index: 99;
		}
		
		/* primary */
		ul#nav {
			position: relative;
			float: left;
			width: 450px;
			height: 27px;
			margin: 0 0 0 11px;
			}	
		ul#nav li {
			position: relative;
			float: left;
			height: 27px;
			margin: 0;
			padding: 0;
			}
		ul#nav li a {
			display: block;
			height: 27px;
			background-image: url(../images/pri-nav.gif);
			background-repeat: no-repeat;
			text-indent: -999em;
			}
		ul#nav li a.road {
			width: 58px;
			background-position: 0 0;
			}
		ul#nav li a.urban {
			width: 65px;
			background-position: -58px 0;
			}
		ul#nav li a.mountain {
			width: 95px;
			background-position: -123px 0;
			}
		ul#nav li a.lifestyle {
			width: 83px;
			background-position: -218px 0;
			}
		ul#nav li a.womens {
			width: 83px;
			background-position: -301px 0;
			}
		ul#nav li a.youth {
			width: 66px;
			background-position: -384px 0;
			}
		
		ul#nav li a.road:hover,
		ul#nav li:hover a.road {
			background-position: 0 -27px;
			}
		ul#nav li a.urban:hover,
		ul#nav li:hover a.urban {
			background-position: -58px -27px;
			}
		ul#nav li a.mountain:hover,
		ul#nav li:hover a.mountain {
			background-position: -123px -27px;
			}
		ul#nav li a.lifestyle:hover,
		ul#nav li:hover a.lifestyle {
			background-position: -218px -27px;
			}
		ul#nav li a.womens:hover,
		ul#nav li:hover a.womens {
			background-position: -301px -27px;
			}
		ul#nav li a.youth:hover,
		ul#nav li:hover a.youth {
			background-position: -384px -27px;
			}
			
			
			
		ul#nav ul {
			position: absolute;
			top: -999em;
			width: 440px;
			height: auto;
			}
		ul#nav ul ul {
			position: relative;
			top: 0;
			width: auto;
			height: auto;
			padding: 0;
			background: none;
			border: 0;
			}
		ul#nav li:hover ul {
			width: 535px;
			top: 27px;
			left: -10px;
			background: url(../images/drop-arrow.png) -960px 0 no-repeat;
			}
		ul#nav ul div {
			float: left;
			width: 513px;
			margin: 14px 0 0;
			padding: 10px 10px 15px;
			border: 1px solid #999;
			border-top: 0;
			background: #000;
			z-index: 1;
			}
		ul#nav li:hover ul.urban {
			width: 645px;
			left: -68px;
			top: 27px;
			background: url(../images/drop-arrow.png) -896px 0 no-repeat;
			}
		ul#nav ul.urban div {
			width: 623px;
			}
		ul#nav li:hover ul.mountain {
			width: 892px;
			left: -133px;
			background: url(../images/drop-arrow.png) -818px 0 no-repeat;
			}
		ul#nav ul.mountain div {
			width: 870px;
			}
		ul#nav li:hover ul.lifestyle {
			width: 762px;
			left: -228px;
			background: url(../images/drop-arrow.png) -728px 0 no-repeat;
			}
		ul#nav ul.lifestyle div {
			width: 740px;
			}
		ul#nav li:hover ul.womens {
			width: 655px;
			left: -311px;
			background: url(../images/drop-arrow.png) -644px 0 no-repeat;
			}	
		ul#nav ul.womens div {
			width: 633px;
			}
		ul#nav li:hover ul.youth {
			width: 280px;
			left: -90px;
			background: url(../images/drop-arrow.png) -874px 0 no-repeat;
			}
		ul#nav ul.youth div {
			width: 258px;
			}	
		ul#nav li:hover li ul {
			top: 0;
			left: 0;
			width: 120px;
			background: none;
			}
		ul#nav li li {
			float: left;
			width: 115px;
			min-height: 130px;
			height: auto !important;
			height: 130px;
			margin: 0 5px 0 0;
			background: url(../images/dropdown-divider.gif) top right no-repeat;
			}
		ul#nav li li.end {
			background: none;
			}
		ul#nav li li li {
			float: none;
			width: auto;
			min-height: 0;
			height: auto !important;
			margin: 0;
			border: 0;
			background: none;
			}
		ul#nav li li span {
			color: #ee3224;
			font-size: 1.2em;
			font-weight: bold;
			text-transform: uppercase;
			}
		ul#nav li li a {
			float: none;
			width: 120px;
			height: auto;
			text-indent: 0;
			background: none;
			color: #b3b3b3;
			font-size: 1.1em;
			text-decoration: none;
			text-transform: uppercase;
			}
		ul#nav li li a:hover {
			color: #ee3224;
			}
			
		
		/* dropdown image rollover */
		div#map {
			float: left;
			position: relative;
			display: inline;
			margin: 0;
			padding: 0;
			width: auto;
			height: auto;
			border: 0;
			background: none;
			z-index: 99;
			}
		div#mapPoint_road,
		div#mapPoint_urban,
		div#mapPoint_mountain,
		div#mapPoint_lifestyle,
		div#mapPoint_womens,
		div#mapPoint_youth {
			position: absolute;
			top: 60px;
			left: 718px;
			z-index: 99;
			width: auto;
			height: auto;
			background: none;
			}
		div#mapPoint_road {
			left: 370px;
			}
		div#mapPoint_urban {
			left: 470px;
			}
		div#mapPoint_lifestyle {
			left: 590px;
			}
		div#mapPoint_womens {
			left: 485px;
			}
		div#mapPoint_youth {
			left: 410px;
			}
		
			
		
		/* secondary */
		ul#secondary {
			float: right;
			width: 423px;
			height: 27px;
			margin: 0 11px 0 0;
			}
		ul#secondary li {
			float: left;
			height: 27px;
			}
		ul#secondary li a {
			display: block;
			height: 27px;
			background-image: url(../images/sec-nav.gif);
			background-repeat: no-repeat;
			text-indent: -999em;
			}
		ul#secondary li a.team,
		ul#secondary li a.team-on {
			width: 58px;
			background-position: 0 0;
			}
		ul#secondary li a.dealers,
		ul#secondary li a.dealers-on {
			width: 76px;
			background-position: -58px 0;
			}
		ul#secondary li a.myapollo,
		ul#secondary li a.myapollo-on {
			width: 98px;
			background-position: -134px 0;
			}
		ul#secondary li a.downloads,
		ul#secondary li a.downloads-on {
			width: 108px;
			background-position: -232px 0;
			}
		ul#secondary li a.contact,
		ul#secondary li a.contact-on {
			width: 83px;
			background-position: -340px 0;
			}
		ul#secondary li a.team:hover,
		ul#secondary li a.team-on {
			background-position: 0 -27px;
			}
		ul#secondary li a.dealers:hover,
		ul#secondary li a.dealers-on {
			background-position: -58px -27px;
			}
		ul#secondary li a.myapollo:hover,
		ul#secondary li:hover a.myapollo,
		ul#secondary li a.myapollo-on {
			background-position: -134px -27px;
			}
		ul#secondary li a.downloads:hover,
		ul#secondary li a.downloads-on {
			background-position: -232px -27px;
			}
		ul#secondary li a.contact:hover,
		ul#secondary li a.contact-on {
			background-position: -340px -27px;
			}
			
			
		ul#secondary ul {
			position: absolute;
			top: -999em;
			width: 440px;
			height: auto;
			}
		ul#secondary ul ul {
			position: relative;
			top: 0;
			width: auto;
			height: auto;
			padding: 0;
			background: none;
			border: 0;
			}
		ul#secondary li:hover ul {
			width: 535px;
			top: 27px;
			left: 0;
			background: url(../images/drop-arrow.png) -958px 0 no-repeat;
			}
		ul#secondary ul div {
			float: left;
			width: 193px;
			margin: 14px 0 0;
			padding: 10px 10px 15px;
			border: 1px solid #999;
			border-top: 0;
			background: #000;
			z-index: 1;
			}
		ul#secondary li:hover ul.menu_myapollo {
			width: 215px;
			left: 668px;
			top: 27px;
			background: url(../images/drop-arrow.png) -936px 0 no-repeat;
			}
		ul#nav ul.menu_myapollo div {
			width: 193px;
			}
		ul#secondary li li {
			float: none;
			width: auto;
			min-height: 0;
			height: auto !important;
			margin: 0;
			border: 0;
			background: none;
			}
		ul#secondary li li span {
			color: #ee3224;
			font-size: 1.2em;
			font-weight: bold;
			text-transform: uppercase;
			}
		ul#secondary li li a {
			float: none;
			width: 160px;
			height: auto;
			text-indent: 0;
			background: none;
			color: #b3b3b3;
			font-size: 1.1em;
			text-decoration: none;
			text-transform: uppercase;
			}
		ul#secondary li li a:hover {
			color: #ee3224;
			}
			
			
	/* -- content */
	#content {
		background: url(../images/bg-content.png) 0 0 repeat;
		color: #fff;
		font-size: 1.1em;
		}
		
		#record {
			padding: 20px;
			}
			
		h2#content_title {
			padding: 8px 0 13px 20px;
			background: url(../images/title_line.png) left bottom no-repeat;
			font-size: 2em;
			text-transform: uppercase;
			}
			
			
	/* --- compare bikes */
	
	#compareOptions {
		padding: 0 0 15px 148px;
		}
	#compareOptions select {
		width: 250px;
		margin: 0 10px 0 0;
		padding: 2px;
		border: 0;
		}
	#comparison table {
		width: 100%;
		}
	#comparison table th,
	#comparison table td {
		vertical-align: top;
		border-top: 1px solid #666666;
		}
	#comparison table th.thick,
	#comparison table td.thick {
		border-top: 2px solid #999;
		}
	#comparison table th {
		padding: 2px 25px 2px 0;
		text-align: right;
		text-transform: uppercase;
		color: #fff;
		font-weight: normal;
		}
	#comparison table th {
		width: 120px;
		}
	#comparison table td {
		width: 240px;
		padding: 2px 15px 2px 0;
		}
	#comparison img {
		width: 246px;
		height: 159px;
		border: 2px solid #666666;
		margin: 10px 0 5px;
		}
		
	
	/* --- dealers */
	
		/* search form */
		#dealer_search {
			padding: 20px;
			}
		#dealer_search form {
			margin: 0;
			padding: 0;
			}
		#dealer_search form ol li {
			float: left;
			display: inline;
			margin: 0 25px 0 0;
			padding: 0;
			}
		#dealer_search form ol li label {
			display: block;
			margin: 0;
			padding: 0;
			text-transform: uppercase;
			}
		#dealer_search form ol li input,
		#dealer_search form ol li select {
			width: 122px;
			margin: 0;
			padding: 2px;
			border: 0;
			}
		#dealer_search form ol li select {
			padding: 0;
			}
		#dealer_search button {
			width: 63px;
			height: 20px;
			margin: 15px 0 0;
			padding: 0;
			border: 0;
			background: url(../images/dealer-search-btn.png) no-repeat;
			cursor: pointer;
			color: transparent;
			text-transform: capitalize;
			text-indent: -999em;
			}
	
		/* search results */
		#dealer_results,
		#dealer_details {
			padding: 20px 0;
			margin: 0 20px;
			border-top: 1px solid #3f3f3f;
			}
		#dealer_results_list {
			float: left;
			width: 300px;
			}
		#dealer_results_map {
			float: right;
			width: 620px;
			}
		#dealer_results_list table td {
			padding: 15px 10px 15px 10px;
			vertical-align: top;
			}
		#dealer_details h3 {
			font-size: 1.3em;
			font-weight: normal;
			}
		#dealer_results_list a,
		#gmapmarker a,
		#dealer_details h3 {
			color: #ee3224; 
			}
		#gmapmarker {
			color: #000;
			}
		#dealer_details #dealer_results_list {
			position: relative;
			min-height: 360px;
			height: auto !important;
			height: 360px;
			}
		#dealer_details .left {
			float: left;
			}
		#dealer_details .details {
			width: 200px;
			margin: 0 0 0 10px;
			}
		#dealer_details .streetview {
			position: absolute;
			bottom: 0;
			left: 0;
			}
		table.dealer_results tr.elite {
			background: #494747;
			}
		h2#elite_title {
			margin: 15px 0 0;
			background: #582b1f url(../images/bg_elite.gif) 0 0 repeat-x;
			color: #fff;
			font-size: 1.4em;
			text-transform: uppercase;
			text-align: center;
			}
	
	
	/* -- extras */
	#extras {
		margin: 17px 0 0;
		padding: 0 0 15px;
		border-top: 1px solid #595959;
		background: url(../images/bg-extras.png) 0 0 repeat;
		}
	#extras .col {
		float: left;
		display: inline;
		width: 326px;
		margin: 15px 0 0;
		text-align: center;
		border: 0;
		}
	#extras .col form {
		position: relative;
		}
	#extras .col form button {
		position: absolute;
		top: 0;
		right: 100px;
		display: block;
		width: 25px;
		height: 25px;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
		text-indent: -999em;
		}
	#extras .links {
		border-right: 1px solid #595959;
		border-left: 1px solid #595959;
		}
	#extras .bikelink {
		padding: 27px 0 0;
		border: 0;
		}
	#extras h3 {
		margin: 5px 0 12px;
		}
		
		/* links */
		.links ul {
			width: 167px;
			height: 81px;
			margin: 0 auto;
			}
		.links li {
			height: 27px;
			}
		.links li a {
			display: block;
			height: 27px;
			background-image: url(../images/links.png);
			background-repeat: no-repeat;
			text-indent: -999em;
			}
		.links li a.archive {
			background-position: 0 -27px;
			}
		.links li a.register {
			background-position: 0 -54px;.
			}
		
		
	/* -- footer */
	#footer {
		padding: 10px 20px;
		font-size: 1em;
		text-transform: uppercase;
		}
	#footer, #footer a {
		color: #bbb;
		text-decoration: none;
		}
	#footer li {
		float: left;
		padding: 0 25px 0 0;
		}
	#footer li a {
		font-size: 1.2em;
		}
	#footer p {
		text-align: right;
		}
	#footer img { 
		padding: 0 0 0 10px;
		vertical-align: middle;
		}
		
		
/*	8. MISC
 *	----------------------------------------------
*/

	/*#content,
	#extras,
	.links li a {
		behavior: url(/sb/styles/home/css/iepngfix.htc);
		}*/

	/* -- corner radius */
	.corner-top {
		-moz-border-radius-topleft: 10px;
		-webkit-border-top-left-radius: 10px;
		-moz-border-radius-topright: 10px;
		-webkit-border-top-right-radius: 10px;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
		}
		
	.corner-bottom {
		-moz-border-radius-bottomleft: 10px;
		-webkit-border-bottom-left-radius: 10px;
		-moz-border-radius-bottomright: 10px;
		-webkit-border-bottom-right-radius: 10px;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
		}
		
	.search-corner-top {
		-moz-border-radius-topleft: 5px;
		-webkit-border-top-left-radius: 5px;
		-moz-border-radius-topright: 5px;
		-webkit-border-top-right-radius: 5px;
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
		}
		
	.search-corner-bottom {
		-moz-border-radius-bottomleft: 5px;
		-webkit-border-bottom-left-radius: 5px;
		-moz-border-radius-bottomright: 5px;
		-webkit-border-bottom-right-radius: 5px;
		border-bottom-left-radius: 5px;
		border-bottom-right-radius: 5px;
		}
		
	.corner-top-left {
		-moz-border-radius-topleft: 10px;
		-webkit-border-top-left-radius: 10px;
		border-top-left-radius: 10px;
		}
		
	.corner-top-right {
		-moz-border-radius-topright: 10px;
		-webkit-border-top-right-radius: 10px;
		border-top-right-radius: 10px;
		}
		
	.corner-bottom-left {
		-moz-border-radius-bottomleft: 10px;
		-webkit-border-bottom-left-radius: 10px;
		border-bottom-left-radius: 10px;
		}
		
	.corner-bottom-right {
		-moz-border-radius-bottomright: 10px;
		-webkit-border-bottom-right-radius: 10px;
		border-bottom-right-radius: 10px;
		}

	
