@import url("reset.css");
@import url("form.css");

* {
	color: #fff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

html, body {
    height: 100%;
}

h1 {
	font-size: 2em;
	font-weight: bold;
	padding-top: 2px; 
}

h1 em {
	color: #f00;
	font-size: 1em;
	font-style: normal;
	font-weight: bold;
}

h2 {
	background-color: red;
	font-size: 18px;
	padding: 2px 2px;
}

h3 {
	background: #999;
	border: 1px #fff solid;
	display: block;
	font-size: 1.5em;
	margin: 10px 0;
	text-align: center;
}

h4 {
	color: #ffa100;
	font-weight: bold;
	margin-bottom: 10px;
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
	font-weight: inherit;	
}

td {
	padding: 2px 0;
}

pre {
	font-family: "Courier New", Courier, monospace;
	word-wrap: break-word;
}

/* Container Section */

#container {
	background: #000;
	min-height: 100%;
	position: relative;	
}

	* html #container { /* ie 6 fix */
		height: 100%;
	}
	
/* Header Section */

#header {
	background: #000;
    height: 114px;
	position: relative;
    width: 100%;	
}

	#header-logo {
		background: url(../images/logo.jpg) no-repeat;
		float: left;
		height: 84px;
		width: 502px;		
	}

	#header-random {
		border-bottom: 1px #fff solid;
		border-left: 1px #fff solid;
		float: right;
	}
	
	#header-basket {
		left: 30px;		
		padding: 5px;
		position: absolute;
		top: 50px;
		width: 280px;
	}
		
		#header-basket ul {
			margin: 0 auto;		
			overflow: hidden;
			text-align: center;			
		}
		
		#header-basket ul li {
			float: left;
			line-height: 20px;
			padding: 0 10px;
			width: auto;
		}
	
		#header-basket ul li.empty {
			color: #f00;
			font-weight: bold;
		}
	
/* Menu Section */		

#menu {
	background: #808080; 
	border-top: 1px #fff solid;
	border-bottom: 1px #fff solid;
	height: 28px;
	left: 0;
	margin-top: 84px;
	position: absolute;
	width: 502px;
}

	#menu ul li {
		float: left;
	}

	#menu a:link, #menu a:visited, #menu a:active {
		display: block;
		color: #ffffff;
		line-height: 2.3em;
		padding: 0 1em;
	}
	
	#menu li.selected, #menu a:hover {
		background: #f00;
	}		
		
/* Search Bar Section */

#search-bar {
	overflow: hidden;
}

	#search-bar .centerise {
		border-bottom: 1px #fff solid;
		overflow: hidden;
	}
	
	#search-bar h1 {
		float: left;
	}
		
	ul#search {
		border-left: 1px #fff solid;
		background: red;
		float: right;
		padding: 3px 0;
		margin: 0;		
		width: 397px;
	}		
	
		ul#search li {
			display: block;
			float: left;
			margin-left: 8px;
			width: auto !important;
		}
		
			ul#search li label {
				float: none !important;
				font-size: 1.8em;
				margin-left: 0 !important;
				margin-top: 0 !important;
				width: auto !important;
			}
			
			ul#search li input {		
				border: 1px red solid;
				font-size: 1.6em;
				padding: 0 2px;
				width: 210px;
			}
			
			ul#search li input.button {
				background: #f00;
				border: 1px #fff solid;
				color: #fff;
				font-size: 1.4em;
				margin-right: 0 !important;
				width: 44px;
			}
		
/* Inner Container Section */

#inner-container {
/*	background: #000;*/
	clear: both;
	padding-bottom: 75px;
}

	#inner-container:after {
		content: " ";
		display: block;
		clear: both;
	}		


/* Content Section */

#content {
	overflow: hidden;
	padding: 10px 0;
	text-align: left;
	margin-bottom: 30px;
}
	
/* Footer Section */

#footer {
	background: #000000; 
    bottom: 0;
	font-size: 0.9em;
	height: 27px;
	line-height: 2.4em;
    position: absolute;
    width: 100%;
}

	#footer span {
		color: #ffffff;
		float: left;
		padding: 0;
	}
	
	#footer ul {
		float: right;
		padding: 0 20px;
	}
	
	#footer ul li {
		display: inline;
		padding: 0 0.5em;
	}
	
	#footer a:link, #footer a:visited, #footer a:active {
		color: #ffffff;
		text-decoration: none;
	}
	
	#footer a:hover  {
		text-decoration: underline;
	}

#footer-info {
	background: #808080 !important;
}


/* Home Section */

#side-left {
	float: left;
}

	#side-left img#part {
		background: url(../images/loader.gif) no-repeat center center;
		height: 350px;
		width: 600px;
	}

#side-right {
	float: right;
	width: 395px;
}

	#side-right div img {
		background: url(../images/loader.gif) no-repeat center center;
		height: 310px;
		width: 310px;
	}

#bike-me {
	float: right;
	width: 56px;
}

/* Paging */

ul.paging {
	clear: both;
}

	ul.paging li {
		clear: none;
		float: left;
		padding-right: 5px;
		width: auto;
	}
	
	ul.paging a:link, ul.paging a:visited, ul.paging a:active {
		color: #fff;
		display: block;
		text-decoration: none;
	}
	
	ul.paging a:hover {
		text-decoration: underline;
	}
	
	ul.paging a.selected:link, ul.paging a.selected:visited, ul.paging a.selected:active, ul.paging a.selected:hover {
		text-decoration: underline;
	}

/* Site Map */	

#site-map {
	list-style: outside disc;
	margin-left: 20px;	
}
	#site-map li strong {
		color: #fff;
	}

	#site-map ul {
		list-style: outside disc;
		margin-left: 30px;
	}

	#site-map li {
		padding: 5px 0 0 !important;
	}

	#site-map li a {
		color: #fff;
	}
	
		#site-map li a:hover {
			text-decoration: underline;
		}

/* Breadcrumb Trails */	

p#trails {
}

	p#trails a:link, p#trails a:visited, p#trails a:active {
		color: #000;
		text-decoration: underline;
	}
	
	p#trails a:hover {
		text-decoration: none;
	}

/* Site Content Section */

#site-content {
	float: left;
}

	#site-content p {
		margin-bottom: 1em;
	}

	#site-content ul {
		list-style: outside disc !important;
	}
	
		#site-content ul li {
			float: none !important;
			padding: 0 !important;
			margin: 0 0 0 20px  !important;
		}

/* Your Details */					

#billing-details {
	float: left;
	width: 46%;
}

#shipping-details { 
	float: right;
	width: 46%;
}

#copy {
	padding: 5px 0 5px 20px;
}

#general-details {
	width: 97%;
}
	
	#general-details label {
		width: 220px;
	}
	
	#general-details textarea {
		height: 50px;
		margin-left: 10px;
		width: 98%;
	}
		
#continue {
	clear: both;
	margin-top: 10px;
}
		
/* Address */		

#billing-address {
	float: left;
	height: 165px;
	width: 300px;
}

#shipping-address {
	float: right;
	height: 165px;
	width: 300px;	
}
		
/* Ordered Layout */

#ordered-items	{
	width: 100%;
}	

	#ordered-items th {
		border-bottom: 1px #fff solid;
		font-weight: bold;
		padding: 7px 0;
	}
	
	#ordered-items td {
		vertical-align: top;
	}	
			
#ordered-total {
	width: 200px;
}

	#ordered-total th {
		font-weight: bold;
	}

/* Order Section */		

#order-result {
}

	#order-result table {
		margin-top: 10px;
	}
	
		#order-result th {
			border-bottom: 1px #fff solid;
			font-weight: bold;
			padding: 0 0 7px;
		}
		
		#order-result td {
			padding: 5px 0;
		}
		
		#order-result td a {
			color: #f00 !important;
			font-weight: bold;
		}

		#order-result td a:hover {
			color: #fff !important;
			text-decoration: underline;
		}

#order-info2 {
}
	
	#order-info2 table {
		margin-top: 10px;
	}
	
		#order-info2 table th {
			font-weight: bold;
			padding: 2px 0;
		}
		
#order-search-form {
}		

	#order-search-form table {
		margin-top: 5px;
	}
	
		#order-search-form table td {
			padding: 3px;
		}

/* Navigation Secton */

#navigation {	
	border: 1px white solid;	
	float: left;
	margin-right: 10px;
	width: 250px;
}

#navigation h2 {
 	background: #808080;
 	border-bottom: 1px white solid;	
}

#navigation ul {
	overflow: hidden;
}

	#navigation ul li {
		border-top: 1px #1a1a1a solid;		
		display: block;		
	}
	
		#navigation ul li a {
			display: block;
			padding: 5px ;
			text-align: left;
			width: 250px;
		}

			#navigation ul li a:hover, #navigation ul li a.selected {
				background: red;
			}

/* Products Section */

ul#box-catalogue {
	overflow: hidden;
	width: 840px;
}

	ul#box-catalogue li {
		border: 1px white solid;	
		display: block;
		float: left;
		margin: 0 10px 5px 0;
		width: 260px;
		text-align: center;
	}

		ul#box-catalogue li img {
			background: url(../images/loader.gif) no-repeat center center;
			height: 150px;
			margin:  0 auto;
			text-align: center;
			width: 150px;
		}
	
		ul#box-catalogue li a {
			border-top: 1px white solid;	
			display: block;
			height: 3em;
			line-height: 1.5em;						
			padding: 2px 5px;
		}

			ul#box-catalogue li a:hover {
				background: red;
			}

/* Components Section */

ul#box-component {
	overflow: hidden;
	width: 500px;
}

	ul#box-component li {
		border: 1px white solid;	
		display: block;
		float: left;
		margin: 0 10px 5px 0;
		width: 235px;
		text-align: center;
	}

		ul#box-component li a {
			display: block;
			height: 2em;
			line-height: 2em;						
			padding: 2px 5px;
		}
		
			ul#box-component li a:hover {
				background: red;
			}
	

table#parts {
	border: 1px #fff solid;
}

	table#parts th  {
		border-bottom: 1px #fff solid;
		background: #f00;
		padding: 5px 3px;
	}

	table#parts td  {
		padding: 5px 3px;
	}

	
		table#parts tr.odd {
		} 

		table#parts tr.even {
			background: #333;
		} 

/* Search Error */

#search-error {
	
}
	#search-error strong {
		font-weight: bold;
		font-style: italic;
	}

	#search-error span {
		display: block;
		margin: 5px 0;
	}
			
	#search-error ul {
		list-style: inside disc !important;
		margin-left: 10px;
	}		

/* Misc Section */

.no-border {
	border: none !important;
}

.centerise {
	display: block;
	margin: 0 auto;
	text-align: center;
	width: 900px;	
}

#credit-cards {
	bottom: 20px;
	color: #fff;
	height: 87px;
	overflow: hidden;
	position: absolute;
	width: 900px;
	text-align: center;
}

#credit-card-logos {
	background: #fff;
	margin: 0 auto;
}

	#credit-card-logos table {
		width: 500px;
		margin: 0 auto;
	}

#shop-images {
	float: left;
	padding-right: 10px;
	width: 300px;
}

#updated {
	margin: 0 auto; 
	text-align: center; 
	width: 260px; 
}

	#updated div {
		color: #00FF66;
		font-size: 1.5em;
		font-weight: bold;
		margin-bottom: 10px;
	}
	
#box-info {
	border: 1px white solid;
	margin: 10px 0 0 0;
	overflow: hidden;
	padding: 5px;
	float: left;
	width: 227px;
}	
	
a#back {
	background: #808080;
	border: 1px #fff solid;
	display: block;
	height: 3em;
	line-height: 1.5em;						
	padding: 2px 5px;
	margin: 10px 0 5px 0;
	width: 227px;
	float: left;
	
}


	a#back:hover {
		background: #000;
	}
	
	
	ul.formPosting {
	
}	

	ul.formPosting li {
		margin-bottom: 10px;
	}		
	
		ul.formPosting li input {
			width: 250px;
		}
		
		ul.formPosting li textarea {
			width: 250px;
			height: 90px;
		}
		
		ul.formPosting li textarea.texteditor {
			width: 350px;
			height: 300px;
		}
		
		form button {
			color: #000000;
		}