/**
 * Screen styles for TRAK Cycles
 * Author Matthew Holmes <www.ivt.com.au>
 * Created 19 Feb, 2008
 */
 
 @import "thickbox.css";
 
 body {
 	margin: 0;
 	padding: 0;
 	background: #000;
 	color: #777;
 	font: 62.5%/1.6 Tahoma, "Lucida Grande", Arial, Helvetica, sans-serif;
 	}
 	
 	
 	/* links */
 	a {
 		color: #db2020;
 		}
 	a:hover {
 		text-decoration: none;
 		}
 	a:focus {
 		outline: none;
 		}
 	a img {
 		border: 0;
 		}
 		
 		
 	/* common elements */
 	h1, h2, h3, h4, h5, h6, form {
 		margin: 0;
 		}
 	h3 strong, .noshow, #product_tabs, .path {
 		display: none !important;
 		}
 		
 		
 		
 		
 		/* -- structure
 		---------------------------------*/
 		#container {
 			width: 980px;
 			margin: 50px auto 0;
 			background: #fff;
 			}
 			
 			
 			/* using clearfix solution to reduce any html markup just apply class="clearfix" to any div you want. */
 			.clearfix:after {
 				display: block;
 				clear: both;
 				height: 0;
 				content: ".";
 				visibility: hidden;
 				}
 			* html .clearfix { /* ie hack it needs to use height: 1%, does not support the :after pseudoclass */
 				height: 1%;
 				}
 			*+ html .clearfix {
 				height: 1%;
 				}
 				
 				
 			
 			/* -- header */
 			#header {
 				position: relative;
 				height: 73px;
 				background: #53575d url(../webimage/bg-header.gif) no-repeat;
 				}
 			#header h1 a {
 				position: absolute;
 				top: 23px;
 				right: 20px;
 				}
 				
 				
 				/* navigation */
 				ul#nav {
 					position: absolute;
 					bottom: 17px;
 					left: 20px;
 					margin: 0;
 					padding: 0;
 					list-style: none;
 					}
 				#nav li {
 					float: left;
 					margin: 0 16px 0 0;
 					}
 				#nav li a {
 					padding: 3px 7px;
 					color: #fff;
 					font-size: 1.4em;
 					text-decoration: none;
 					text-transform: uppercase;
 					}
 				#nav li a:hover, #nav li a.on {
 					background: #37393f;
 					}
 			
 			
 			/* -- banner */
 			#banner {
 				position: relative;
 				height: 378px;
 				background: #eee;
 				}
 			ul#brands {
 				margin: 0;
 				padding: 0;
 				list-style: none;
 				}
 			#brands li {
 				display: block;
 				width: 196px;
 				margin: 0;	
 				padding: 0;
 				}
 			#brands li a {
 				display: block;
 				width: 196px;
 				height: 26px;
 				background: url(../webimage/btn-brands.gif) no-repeat;
 				text-indent: -999em;
 				}
 			#brands ul {
 				position: absolute;
 				top: 26px;
 				left: -999em;
 				width: 195px;
 				margin: 0;
 				padding: 0;
 				list-style: none;
 				background: #fff;
 				text-align: center;
 				-moz-opacity: 0.9;
 				opacity: 0.9;
 				filter: alpha(opacity=80);
 				border: 1px solid #bbb;
 				border-right: 0;
 				border-top: 0;
 				}
 			#brands li li {
 				width: 100%;
 				display: block;
 				margin: 0;
 				padding: 0;
 				border-bottom: 1px solid #bbb;
 				}
 			#brands li li.end {
 				border: 0;
 				}
 			#brands li li a {
 				width: 196px;
 				height: auto;
 				padding: 6px 0;
 				background: none;
 				text-indent: 0;
 				}
 			#brands li:hover ul ul, #brands li.hover ul ul {
				left: -999em;
				}
			#brands li:hover ul, #brands li.hover ul {
				left: auto;
				}
 			
 			
 			/* -- main-body */
 			#main-body {
 				background: url(../webimage/bg-bottom-container.gif) bottom no-repeat;
 				}
 			#sidebar {
 				position: relative;
 				float: right;
 				width: 196px;
 				padding: 0 0 20px;
 				}
 			#content {
 				float: left;
 				width: 742px;
 				padding: 0 20px 20px;
 				font-size: 1.2em;
 				}
 			#inner-content {
 				padding: 0 20px;
 				}
 				
 				
 				
 				h2#content-title {
 					margin: 0 0 8px;
 					color: #db2020;
 					font-size: 1.8em;
 					border-bottom: 1px solid #dedede;
 					}
 				
 				.medium_image {
 					float: right;
 					margin: 35px 0 0;
 					}
 				
 				
 				div#title {
 					height: 80px;
 					margin: 0;
 					padding: 0;
 					background: #fff;
 					}
 				div#title h2 {
 					padding: 15px 20px;
 					background: url(../webimage/bg-title-right-corner.gif) bottom right no-repeat;
 					color: #fff;
 					font-size: 1.8em;
 					font-weight: normal;
 					}
 				div#title div div {
 					display: block;
 					background: url(../webimage/bg-title-left-corner.gif) bottom left no-repeat;
 					}
 				div#title div {
 					background: #dedede url(../webimage/bg-title.gif) repeat-x;
 					}
 				div#title a {
 					position: absolute;
 					top: 25px;
 					right: 20px;
 					display: none;
 					}
 				
 				
 				ul#sidenav {
 					margin: 20px 0 0;
 					padding: 0;
 					list-style: none;
 					}
 				#sidenav li {
 					display: block;
 					width: 100%;
 					border-bottom: 1px solid #dedede;
 					}
 				#sidenav li a {
 					display: block;
 					padding: 5px 5px 5px 22px;
 					background: url(../webimage/icon-arrow.gif) 5px 11px no-repeat;
 					font-size: 1.2em;
 					}
 				#sidenav li.on a {
 					font-weight: bold;
 					font-size: 1.4em;
 					background: url(../webimage/icon-arrow.gif) 5px 13px no-repeat;
 					}
 				#sidenav ul {
 					display: none;
 					}
 					
 					
 				/* search */
 				#sidebar form {
 					padding: 7px 10px;
 					border: 1px solid #dedede;
 					border-right: 0;
 					}
 				#sidebar form p {
 					margin: 0;
 					}
 				#sidebar form input {
 					width: 110px;
 					margin: 0 3px 0 0;
 					}
 				#sidebar form button {
 					width: 54px;
 					height: 22px;
 					border: 0;
 					background: url(../webimage/btn-search.gif) no-repeat;
 					text-indent: -999em;
 					cursor: pointer;
 					}
 				
 				
 		
					
				div#bike-content {
 					position: relative;
 					width: 702px;
 					margin: 35px 0 0;
 					}
 				
				div#Mongoose {
					position: absolute;
					top: 0;
					right: 0;
					width: 180px;
					height: 29px;
					display: block;
					background: url(../webimage/mongoose-code.gif) no-repeat;
					text-indent: -999em;
					}
				div#GT {
					position: absolute;
					top: 0;
					right: 0;
					width: 130px;
					height: 34px;
					display: block;
					background: url(../webimage/gt-code.gif) no-repeat;
					text-indent: -999em;
					}
				div#Trek {
					position: absolute;
					top: 10px;
					right: 0;
					width: 120px;
					height: 18px;
					display: block;
					background: url(../webimage/trek-code.gif) no-repeat;
					text-indent: -999em;
					}
				div#Pinarello, div#pinarello {
					position: absolute;
					top: 0;
					right: 0;
					width: 150px;
					height: 30px;
					display: block;
					background: url(../webimage/pinarello-code.gif) no-repeat;
					text-indent: -999em;
					}
				div#BMC {
					position: absolute;
					top: -45px;
					right: 0;
					width: 120px;
					height: 75px;
					display: block;
					background: url(../webimage/bmc-code.gif) no-repeat;
					text-indent: -999em;
					}
					
				table#bike_spec_table {
					clear: both;
					width: 100%;
					border-collapse: collapse;
					}
				table#bike_spec_table th, table#bike_spec_table td {
					padding: 5px 15px;
					border-bottom: 1px solid #fff;
					text-align: left;
					background: #eee;
					}
				table#bike_spec_table th {
					background: #ccc;
					}
					
					
				table.info_table {
					border-collapse: collapse;
					border-top: 1px solid #ddd;
					border-left: 1px solid #ddd;
					}
				table.info_table td {
					padding: 5px;
					border-right: 1px solid #ddd;
					border-bottom: 1px solid #ddd;
					}
					
					
				table.products_category_table, table.knowledge_category_table {
					width: 100%;
					border-collapse: collapse;
					}
				table.products_category_table td, table.knowledge_category_table td {
					width: 240px;
					height: 120px;
					padding: 15px 0;
					vertical-align: middle;
					text-align: center;
					}
				table.products_category_table a.cat_link, table.knowledge_category_table a.cat_link {
					font-size: 1.3em;
					}
					
				table.products_list_table {
					width: 100%;
					}
				table.products_list_table td {
					padding: 15px 0;
					text-align: center;
					vertical-align: middle;
					}
					
				p.notice {
					padding: 0 0 10px;
					color: #db2020;
					}
					
				div#price {
					color: #db2020;
					font-size: 1.2em;
					font-weight: bold;
					}
				div#price_list {
					font-size: .9em;
					}
				div#price span, div#price_list span,
				div#price input, div#price_list input, button.priceConversionButton {
					display: none;
					}
					
					
				/* signup form */
				form#signup_form, form#update-form, form#passwordForm,
				form#signup_form fieldset, form#update-form fieldset, form#passwordForm fieldset {
					margin: 0;
					padding: 0;
					border: 0;
					}
				form#signup_form legend, form#update-form legend, form#passwordForm legend {
					display: none;
					}
				form#signup_form fieldset fieldset legend, form#update-form fieldset fieldset legend {
					display: block;
					}
				form#signup_form ol, form#update-form ol, form#passwordForm ol {
					list-style: none;
					margin: 0;
					padding: 0;
					}
				form#signup_form li, form#update-form li, form#passwordForm li {
					clear: both;
					margin: 0 0 .75em;
					padding: 0;
					}
				form#signup_form label, form#update-form label, form#passwordForm label {
					float: left;
					display: block;
					width: 100px;
					text-align: right;
					margin-right: 5px;
					}
				form#signup_form label:after, form#update-form label:after {
					content: ":";
					}
				form#signup_form .state, form#update-form .state {
					float: left;
					margin: 0 0 .75em;
					}
				form#signup_form #state_field {
					margin: 0;
					padding: 0;
					}
				form#signup_form .receive_email, form#update-form .receive_email,
				form#signup_form .security_code_fieldset, form#update-form .security_code_fieldset {
					margin-left: 105px;
					}
				form#signup_form .receive_email legend, form#update-form .receive_email legend,
				form#signup_form .security_code_fieldset legend, form#update-form .security_code_fieldset legend {
					margin: 0;
					padding: 0;
					}
				form#signup_form .security_code_fieldset, form#update-form .security_code_fieldset {
					text-align: left;
					}
				form#signup_form .receive_email ul, form#update-form .receive_email ul,
				form#signup_form .state ul, form#update-form .state ul {
					list-style: none;
					margin: .3em 0 0;
					padding: 0;
					}
				form#signup_form li li, form#update-form li li {
					float: left;
					width: 48%;
					margin: 0;
					padding: 0;
					clear: none;
					}
				form#signup_form .receive_email label:after, form#update-form .receive_email label:after,
				form#signup_form .state label:after, form#update-form .state label:after {
					content: "";
					}
				form#signup_form .receive_email label, form#update-form .receive_email label,
				form#signup_form .state label, form#update-form .state label {
					display: inline;
					width: auto;
					margin: 0;
					}
				form#signup_form button, form#update-form button, form#passwordForm button {
					cursor: pointer;
					margin-left: 105px;
					}
					
				form#signup_form button.signup_button {
					display: block;
					width: 54px;
					height: 22px;
					border: 0;
					background: url(../webimage/btn-send.gif) no-repeat;
					text-indent: -999em;
					}
					
					
				/* main search */
				div.search_form fieldset {
					margin: 0;
					padding: 0;
					border: 0;
					}
				div.search_form label,
				div.search_form legend {
					display: none;
					}
				div.search_form input {
					margin: 0 3px 0 0;
					}
				div.search_form button {
					width: 54px;
 					height: 22px;
 					border: 0;
 					background: url(../webimage/btn-search.gif) no-repeat;
 					text-indent: -999em;
 					cursor: pointer;
					}
				
				/* gallery */
				ul.gallery_list {
					margin: 0 auto;
					padding: 0;
					width: 702px;
					overflow: hidden;				
				}
				ul.gallery_list li {
					float: left;
					padding: 25px 20px;
					width: 190px;
					list-style: none;
					text-align: center;
				}
				ul.gallery_list li a.cat_link {
					font-size: 1.3em;
					font-weight: bold;				
				}
				ul.gallery_list li a.prod_link {
					display: block;
					margin: 5px 0; 
					font-weight: bold;	
				}
				ul.gallery_list .short_desc {
					font-size: 1em;
				}				
				ul.gallery_list .gallery_title {
					width: 190px;
				}		
				ul.gallery_list li.end {
					padding: 25px 20px;
					
					}
				#display_public_media {
					display: none;
					}	
 			
 			
 			/* -- footer */
 			#footer {
 				width: 980px;
 				margin: 0 auto 50px;
 				background: url(../webimage/bg-footer.gif) no-repeat;
 				color: #fff;
 				font-size: 1.1em;
 				}
 			#footer p {
 				margin: 0;
 				}
 			#footer a {
 				color: #fff;
 				}
 			#footer .copyright {
 				float: left;
 				padding: 15px 20px;
 				}
 			#footer .powered {
 				float: right;
 				padding: 15px 20px;
 				}