@charset "utf-8";
/* CSS Document */

@import url('reset.css');

body {
	background: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	color: #FFF;
}

#wrap {
}

.container {
	margin: 0 auto;
	width: 960px;
}

#branding {
	margin: 18px 0 16px;
	height: 37px;
	font-family: "Eurostile";
	font-size: 14px;
}

	#branding .container {
		background: url('/img/branding-logo.gif') 98% 50% no-repeat;
		height: 37px;
	}

	#branding h1 {
		float: left;
		font-size: 16px;
	}
	
		#branding h1 a {
			float: left;
			display: block;
			background: url('../img/branding-h1.jpg') 12px 13px no-repeat;
			border-right: 2px solid #cecece;
			padding: 0 12px;
			width: 157px;
			height: 37px;
			line-height: 37px;
			color: #dcdcdc;
			text-align: center;
			text-decoration: none;
			text-indent: -9999px;
		}
		
	#branding #description {
		float: left;
		background: url('../img/branding-description.jpg') 12px 5px no-repeat;
		padding: 0 12px;
		width: 116px;
		height: 37px;
		line-height: 19px;
		text-indent: -9999px;
	}
	
	#branding #navigation {
		float: left;
		margin-left: 13px;
	}
	
		#branding #navigation li {
			float: left;
			margin-left: 6px;
		}
		
			#branding #navigation li a {
				background-repeat: no-repeat;
				float: left;
				display: block;
				border-left: 1px solid #586b62;
				padding: 0 9px;
				height: 37px;
				line-height: 37px;
				color: #dcdcdc;
				text-decoration: none;
				text-indent: -9999px;
			}
			
			#branding #navigation li a:hover, #branding #navigation li.selected a {
				color: #e2700a;
			}
			
		#branding #navigation #home a {
			background-image: url('../img/navigation-sprite.jpg');
			background-position: 0 0;
			width: 35px;
		}
			
			#branding #navigation #home a:hover {
				background-image: url('../img/navigation-sprite.jpg');
				background-position: 0 100%;
			}
			
		#branding #navigation #illustration a {
			background-image: url('../img/navigation-sprite.jpg');
			background-position: -44px 0;;
			width: 65px;
		}
			
			#branding #navigation #illustration a:hover {
				background-position: -44px 100%;
			}
			
		#branding #navigation #identity a {
			background-image: url('../img/navigation-sprite.jpg');
			background-position: -118px 0;
			width: 45px;
		}
			
			#branding #navigation #identity a:hover {
				background-position: -118px 100%;
			}
			
		#branding #navigation #design a {
			background-image: url('../img/navigation-sprite.jpg');
			background-position: -172px 0;
			width: 40px;
		}
			
			#branding #navigation #design a:hover {
				background-position: -172px 100%;
			}
			
		#branding #navigation #profile a {
			background-image: url('../img/navigation-sprite.jpg');
			background-position: -221px 0;
			width: 40px;
		}
			
			#branding #navigation #profile a:hover {
				background-position: -221px 100%;
			}
			
		#branding #navigation #contact a {
			background-image: url('../img/navigation-sprite.jpg');
			background-position: -270px 0;
			width: 49px;
		}
			
			#branding #navigation #contact a:hover {
				background-position: -270px 100%;
			}
			
		#branding #navigation #links a {
			background-image: url('../img/navigation-sprite.jpg');
			background-position: -327px 0;
			width: 31px;
		}
			
			#branding #navigation #links a:hover {
				background-position: -327px 100%;
			}
			
		#branding #navigation li.first-child {
			margin-left: 0;
		}

#content {
	margin-bottom: 22px;
}

	#content .container {
		position: relative;
	}

#billboard {
	border: 2px solid #98aba2;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	margin: 0 0 15px;
	padding: 5px;
}

	#billboard .inner {
		background: #98aba2 url(../img/billboard-default.gif) 0 0 no-repeat;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		height: 300px;
		color: #FFF;
	}
	
		#billboard .inner * {
			text-indent: -9999px;
		}
		
#select {
	margin-bottom: 20px;
	height: 222px;
}

	#select li {
		float: left;
		margin-right: 24px;
	}
	
		#select li .thumbnail {
			display: block;
			border: 2px solid #98aba2;
			border-radius: 7px;
			-moz-border-radius: 7px;
			-webkit-border-radius: 7px;
			width: 218px;
			height: 218px;
		}

			#select li .thumbnail img {
				position: absolute;
				left: -9999px;
			}
			
			
		#select #racing_colours .thumbnail {
			background: url(../img/thumb-racing_colours.jpg) 0 0 no-repeat;
		}
		
		#select #racing_colours .details {
			background: #FFF url(../img/billboard-racing_colours.jpg) 0 0 no-repeat;
			padding: 12px 741px 12px 12px;
			width: 193px;
			height: 276px;
			font-size: 12px;
			line-height: 16.2px;
			color: #000;
		}
		
			#select #racing_colours .details a {
				color: #00F;
			}
		
		#select #soonr .thumbnail {
			background: url(../img/thumb-soonr.jpg) 0 0 no-repeat;
		}
		
		#select #soonr .details {
			background: #FFF url(../img/billboard-soonr.jpg) 0 0 no-repeat;
			padding: 12px 741px 12px 12px;
			width: 193px;
			height: 276px;
			font-size: 12px;
			line-height: 16.2px;
			color: #FFF;
		}
		
			#select #soonr .details a {
				color: #FFF;
			}
		
		#select #twenty_four .thumbnail {
			background: url(../img/thumb-24.jpg) 0 0 no-repeat;
		}
		
		#select #twenty_four .details {
			background: #FFF url(../img/billboard-24.jpg) 0 0 no-repeat;
			padding: 24px 226px 12px 410px;
			width: 310px;
			height: 264px;
			font-size: 12px;
			line-height: 16.2px;
			color: #000;
		}
		
			#select #twenty_four .details a {
				color: #154ecf;
			}
		
		#select #vox .thumbnail {
			background: url(../img/thumb-vox.jpg) 0 0 no-repeat;
		}
		
		#select #vox .details {
			background: #FFF url(../img/billboard-vox.jpg) 0 0 no-repeat;
			padding: 52px 76px 12px 590px;
			width: 280px;
			height: 236px;
			font-size: 12px;
			line-height: 16.2px;
			color: #000;
		}
		
			#select #vox .details a {
				color: #275bf0;
			}
			
		#select li .details {
			display: none;
			position: absolute;
			left: 0;
			top: 0;
			border-radius: 2px;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			margin: 7px;
			overflow: auto;
		} .no_js #select li .details { display: block; left: -9999px; }
		
			#select li .details h3 {
				height: 0;
				overflow: hidden;
			}
			
			#select li .details p {
				margin-bottom: 1em;
			}
		
		.no_js #select li:hover .details {
			left: 0;
		}
			
		#select li a:hover, #select li.selected a {
			border-color: #e57e3c;
		}

	#select li.last-child {
		margin-right: 0;
	}

#preview, .info #main {
	border: 2px solid #98aba2;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	margin: 0 0 15px;
	padding: 5px;
	font-size: 13px;
	line-height: 18px;
}

	#preview .inner, .info #main .inner {
		position: relative;
		background-color: #FFF;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		min-height: 530px;
		color: #000;
	} .info #main .inner { padding: 15px; }
	
	.profile.info #main .inner, .links.info #main .inner {
		padding: 15px 660px 15px 15px;
	}
	
	.profile.info #main .inner {
		background: #FFF url('/img/profile-background.jpg') 100% 100% no-repeat;
	}
	
	.links.info #main .inner {
		background: #FFF url('/img/links-background.jpg') 100% 100% no-repeat;
	}
	
	.gallery #preview {
		background: url(../img/loading.gif) 50% 50% no-repeat;
	}
	
	.gallery #preview .inner {
		height: 395px;
		min-height: 0;
	}
	
	.gallery #preview .inner.loading {
		background: #FFF url('/img/loading.gif') 50% 50% no-repeat;
	}
	
	.gallery #preview img {
		margin-left: -15px;
	}
	
	.info #main h2 {
		font-size: 48px;
		line-height: 52px;
		font-weight: bold;
	}
	
	.info #main ul, .info #main ol {
	}
	
		.info #main ul li, .info #main ol li {
			margin-bottom: 20px;
		}
		
			.info #main ul li a, .info #main ol li a {
				text-decoration: none;
			}
			
			.info #main ul li a:hover, .info #main ol li a:hover {
				text-decoration: underline;
			}
		
	.info #main a {
		color: #000;
	}
	
	.info #main strong {
		font-weight: bold;
	}
	
	.info #main em {
		font-style: italic;
	}

.gallery #main {
	background-color: #FFF;
	background-position: 100% 100%;
	background-repeat: no-repeat;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	margin: 0 9px 20px;
	padding: 3px 0 0 3px;
	width: 936px;
	overflow: hidden;
}

	.gallery #main a.button {
		display: block;
		background-position: 50% 50%;
		background-repeat: no-repeat;
		width: 23px;
		height: 144px;
		float: left;
		z-index: 1000;
	}
	
		.gallery #main #previous {
			background-image: url('../img/button-previous.gif');
			margin-right: 3px;
		}
		
		.gallery #main #previous.disabled {
			background-image: url('../img/button-previous-disabled.gif');
		}
		
		.gallery #main #next {
			background-image: url('../img/button-next.gif');
		}
		
		.gallery #main #next.disabled {
			background-image: url('../img/button-next-disabled.gif');
		}
		
	.gallery #main .container {
		float: left;
		overflow: hidden;
		z-index: 500;
	}

	.gallery #main .thumbnails {
		margin-bottom: 3px;
		height: 144px;
	}

		.gallery #main .thumbnails li {
			float: left;
			margin: 0 3px 3px 0;
		}
		
			.gallery #main .thumbnails li a {
				display: block;
				float: left;
				width: 144px;
				height: 144px;
				overflow: hidden;
			}
			
			.gallery #main .thumbnails li a.selected, .gallery #main .thumbnails li a:hover {
				border: 2px solid #e57e3c;
				width: 140px;
				height: 140px;
			}
			
				.gallery #main .thumbnails li a.selected img, .gallery #main .thumbnails li a:hover img {
					margin: -2px 0 0 -2px;
				}
				
		
		
	/*.gallery #main .ui-slider {
		position: relative;
		background: url('/img/scroll-path.gif') 0 0 repeat-x;
		margin: 9px 6px 7px;
		height: 2px;
	}

		.gallery #main .ui-slider .ui-slider-handle {
			position: absolute;
			background: url('/img/scroll-bar.gif') 0 0 no-repeat;
			margin: -5px -6px;
			width: 12px;
			height: 12px;
		}*/

#site_info {
	clear: both;
	margin-bottom: 20px;
	font-family: "Eurostile";
	font-size: 11px;
	color: #afaaaa;
}

	#site_info .container {
	}
	
		#site_info .container #copyright {
			background: url('../img/site_info-copyright.jpg') 0 0 no-repeat;
			margin: 0 15px;
			height: 11px;
			text-indent: -9999px;
		}