@charset "utf-8";
/*
Global Style Sheet

Version:   1.0
Author:    Gary Stanton - Simian Enterprises
Website:   http://www.simianenterprises.co.uk
*/


/* Fonts */
	@font-face {
		font-family: 'GeosansLightRegular';
		src: url('fonts/geosanslight-webfont.eot');
		src: local('☺'), url('/css/fonts/geosanslight-webfont.woff') format('woff'), url('/css/fonts/geosanslight-webfont.ttf') format('truetype'), url('/css/fonts/geosanslight-webfont.svg#webfontTYVWiHMI') format('svg');
		font-weight: normal;
		font-style: normal;
	}
	
	@font-face {
		font-family: 'GeosansLightMediumItalic';
		src: url('/css/fonts/geosanslight-oblique-webfont.eot');
		src: local('☺'), url('/css/fonts/geosanslight-oblique-webfont.woff') format('woff'), url('/css/fonts/geosanslight-oblique-webfont.ttf') format('truetype'), url('/css/fonts/geosanslight-oblique-webfont.svg#webfontmYqvR0mf') format('svg');
		font-weight: normal;
		font-style: normal;
	}
	
	.GeosansLight {font-weight: normal; font-style: normal; line-height:normal; font-family: 'GeosansLightRegular', sans-serif;}
	.GeosansLight-Oblique {font-weight: normal; font-style: normal; line-height:normal; font-family: 'GeosansLightMediumItalic', sans-serif;}


/* Reset styles */
	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 {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline;
	}
	
	strong {
		font-weight: bold;
	}
	
	:focus {
		outline: 0;
	}
	
	body {
		color: black;
		font-size: 75%;
		line-height: 1.5em;
		font-family: Arial, Helvetica, sans-serif;
	}
	
	ol, ul {
		list-style: none;
	}
	
	table {
		border-collapse: separate;
		border-spacing: 0;
	}
	caption, th, td {
		text-align: left;
		font-weight: normal;
	}
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: "";
	}
	blockquote, q {
		quotes: "" "";
	}


/* Generic website styles */
	html {
		height: 100%;
	}
	
	body {
		height: 100%;
		background-color: #6a6a6a;
	}

	/* Grid wrapper for dev */
	#gridWrapper {
		background-image: url(/img/12-col.gif);
		background-repeat: repeat-y;
		background-position: center top;
		opacity: 0.2;
		position: absolute;
		width: 100%;
		height: 100%;
	}
	
	.box {
		padding: 1.417em 1em;
		margin: 1.5em 1em;
		border: 1px solid black;
		line-height: 1.5em;
		background-image: -moz-linear-gradient(top, #fdfdfd, #d5d4d4); /* FF3.6 */
		background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #fdfdfd),color-stop(1, #d5d4d4)); /* Saf4+, Chrome */
		filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#d5d4d4'); /* IE6,IE7 */
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfdfd', endColorstr='#d5d4d4')"; /* IE8 */			
	}
	
	#content {
		float: left;
	}	
	
	/* Pagination */
		p.pagination {
			width: 54.28em;
			text-align: right;
			font-size: 1.167em;
			line-height: 1.286em;
			margin-bottom: 1.286em;
			text-transform: capitalize;
			float: right;
		}	
	
		p.pagination a {
			padding-left: 0.357em;
			padding-right: 0.357em;		
			color: #000;		
			-moz-border-radius: 8px; /* FF1+ */
			-webkit-border-radius: 8px; /* Saf3+, Chrome */
			border-radius: 8px; /* Opera 10.5, IE 9 */
		}	
	
		p.pagination a:hover {
			background-color: #838383;
			color: #FFF;
			text-decoration: none;
		}	
	
		p.pagination strong {
			background-color: #838383;
			color: #FFF;
			padding-left: 0.357em;
			padding-right: 0.357em;
			font-weight: normal;
			-moz-border-radius: 8px; /* FF1+ */
			-webkit-border-radius: 8px; /* Saf3+, Chrome */
			border-radius: 8px; /* Opera 10.5, IE 9 */
		}
	
/* Header styles */
	h1 {
		font-weight: normal; 
		font-style: normal; 
		font-family: 'GeosansLightMediumItalic', sans-serif;
		clear: both;
		color: #fff;
		font-size: 7.5em;
		line-height: 1em;
		position: absolute;
		top: 72px;
	}
	
	h2 {
		font-size: 4em;
		line-height: 1.125em;
		font-family: 'GeosansLightMediumItalic', sans-serif;
		font-weight: bold;
		text-transform: capitalize;
		clear: both;
		color: #363636;
	}
	
	h3 {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 2em;
		line-height: 1.5em;
		font-weight: bold;
		color: #FFF;
	}
	
	h4 {
		font-size: 4em;
		line-height: 1.125em;
		font-family: 'GeosansLightMediumItalic', sans-serif;
		font-weight: bold;
		text-transform: capitalize;
		clear: both;
		color: #fff;
	}	
	
	p {
		font-size: 1.167em;
		line-height: 1.286;
		font-family: Arial, Helvetica, sans-serif;
		color: #FFF;
	}
	
	.joystick {
		background-image: url(/img/structure/pageLayout/joystick.png);
		background-repeat: no-repeat;
		background-position: right;
		padding-right: 60px;
		min-height: 72px;
		float: left;
		text-shadow: #a39d9d 1px 1px 0;
	}

/* Link styles */
	a {
		color: #4090e1;
		text-decoration: none;
	}
	
	a:hover {
		color: #05e9fd;
		text-decoration: underline;
	}


/* Page layout styles */
	.content {
		padding-left: 0.833em;
		padding-right: 0.833em;
		width: 78.333em;
		margin: auto;
		min-height: 100%;
		max-width: 98%;
		position: relative;
	}

	#logo {
		width: 189px;
		height: 60px;
		display: block;
		position: absolute;
	}
	
	#logo img {
		padding: 0px;
		margin: 0px;
		border: none;
		width: 189px;
		height: 60px;
	}

	#header {
		background-image: url(/img/structure/pageLayout/headerBG.png);
		background-repeat: repeat-x;
		background-position: top;
		background-color: #202020;
		min-height: 179px;
		border-bottom: 1px solid #5b5b5b;
		margin-bottom: 1.5em;
	}


/* Navigation styles */
	#navigation {
		font-size: 1em;
		line-height: 50px;
		float: right;
	}

	#navigation li {
		width: 5em;
		text-align: center;
		padding: 0 0.833em 0 0.833em;
		display: inline-block;
		height: 100%;
		width: 5em;
	}
	
	#navigation li a {
		height: 100%;
		width: 5em;
		display: block;
		color: #FFF;
	}

	#navigation li a:hover {
		background-image: url(/img/structure/pageLayout/navBtnBG.png);
		background-repeat: no-repeat;
		background-position: center;
		text-decoration: none;
	}
	
	
/* Homepage styles */
	#homepageBanner {
		background-image: url(/img/structure/pageLayout/homeInsertCoin.png);
		background-position: 40px 97px;
		background-repeat: no-repeat;
		height: 360px;
	}

	#homepageBanner h1 {
		font-size: 2em;
		text-indent: -999999px;
		background-image: url(/img/structure/pageLayout/homeReplay.png);
		background-repeat: no-repeat;
		display: block;
		width: 534px;
		height: 171px;
		position: absolute;
		right: 0;
	}
	
	#homepageBanner p {
		position: absolute;
		left: 420px;
		top: 234px;
	}
	
	#latestNews {
		width: 51.667em;
		float: left;
		margin-bottom: 3em;
	}
	
	#latestNews h3 {	
		clear: both;
	}
	
	#products {
		width: 	18.333em;
		float: left;
		margin-left: 8.333em;
	}
	
	#products ul li a {
		display: block;
		background-color: #232323;
		clear: both;
		margin-bottom: 1.429em;
		padding: 0.643em;
		height: 106px;
		font-size: 1.167em;
		line-height: 1.286em;
		font-weight: bold;
		color: #FFF;
	}
	
	#products ul li a img {
		float: left;
		margin-right: 0.643em;
	}
	
	#products ul li a:hover {	
		background-color: #3eb4cd;
	}

/* Item grid */
	.itemGrid {
		float: left;
		clear: both;
	}

	.itemGrid li {
		float: left;
		width: 208px;
		height: 208px;
		margin-right: 1.667em;
		margin-bottom: 6em;
		position: relative;
		border: 6px solid #525050;
	}

	.itemGrid li:nth-of-type(4n+4) {
		margin-right: 0;
	}

	.itemGrid li:nth-of-type(4n+5) {
		clear: both;
	}

	.itemGrid img {
		float: left;
		width: 208px;
		height: 208px;
	}
	
	.itemGrid li:hover {
		border: 6px solid #fff;
	}

	.itemGrid li a span {
		font-size: 1.167em;
		line-height: 2.571;
		font-family: Arial, Helvetica, sans-serif;
		font-weight: bold;
		font-style: italic;
		color: #FFF;
		background-color: rgba(0,0,0,0.4);
		display: block;
		height: 3em;
		width: 220px;
		position: absolute;
		bottom: -6px;
		left: -6px;
		text-indent: 10px;
	}
	
/* Product Page */

	/* Product Details */
		#productDetailsDiv {
			float: right;
			width: 31.667em;
			position: relative;
			margin-bottom: 1.5em;
		}
		
		#productDetailsDiv h2 {
			font-size: 2em;
			line-height: 1.125em;
			font-weight: bold;
			text-transform: uppercase;
			display: block;
			height: 2.25em;
			margin-bottom: 0;
		}

		#productDetailsDiv #description {
			text-align: justify;
		}


	/* Product Image */
		#productImageDiv {
			/* border: 1px solid #9d9d9d; */
			float: left;
			width: 528px;
			background-image: url(/img/elements/loadingSml.gif);
			background-repeat: no-repeat;
			background-position: 180px 180px;
		}
		
		#productImageDiv #productImageLink {
			float: left;
			border: 1px solid black;			
		}

		#productImageDiv #productImage {
			display: block;
			width: 524px;
			height: 295px;
			float: left;
			border: 1px solid black;
		}
		
		#alternatePhotos {
			float: left;
			margin-left: 1.667em;
			margin-bottom: 9px;
		}	
	
		#alternatePhotos li {
			margin-bottom: 27px;
		}

		#alternatePhotos li.endRow {
		}
		
		#alternatePhotos li img {
			border: 1px solid #000;
			width: 106px;
			height: 106px;
			display: block;
		}

		#alternatePhotos li img:hover {
			border: 1px solid #38bbff;
		}


	/* Product attibutes */	
		#productAttributes {
			font-size: 0.833em;
			line-height: 1.3em;
			margin-top: 10px;
			text-transform: uppercase;
		}

		#productAttributes li ul li {
			float: left;
			margin-right: 10px;
		}

		#productAttributes li ul li:after {
			content: ",";	
		}


	/* Related products */
		#relatedItems {
			border-top: 1px solid #000;
			margin-top: 1.5em;
			margin-bottom: 1.5em;
			font-size: 1em;
			width: 100%;
			clear: both;
			float: left;
			padding-top: 1.417em;
		}	

		#relatedItems p.heading {
			font-size: 2em;
			line-height: 0.75em;
			font-weight: bold;
			text-transform: uppercase;
			margin-bottom: 0.75em;
		}	
		
	/* Product page facebox */
		#facebox h2 {
			font-size: 1.5em;
			line-height: 1em;
			font-weight: bold;
			display: block;
			font-family: Arial, Helvetica, sans-serif;
		}
		
		#facebox div.content img {
			width: 524px;
			height: 295px;
			display: block;
			clear: both;
		}
		
		#facebox #description {
			clear: both;
			width: auto;
			color: #000;
			text-align: justify;
		}
		
		#facebox .content {
			width: auto;
			
		}

/* News */
	#news #article {
		width: 58.333em;	
		float: left;
		color: #FFF;
		margin-right: 1.667em;
		margin-bottom: 1.5em;
	}
	
	#news #article h2+div {
		width: 45em;
		margin-left: 13.333em;
		margin-bottom: 3em;
	}

	#news #article h2+div p {
		text-align: justify;
	}

	#news #recentArticles {
		width: 17.5em;
		float: right;
		background-color: #817f7f;
		margin-bottom: 1.5em;
		position: absolute;
		right: 0;
	}
	
	#news #recentArticles h3 {
		background-image: url(/img/structure/pageLayout/recentArticles.png);
		background-repeat: no-repeat;
		font-size: 1.167em;
		height: 60px;
		line-height: 3.857em;
		margin-top: -9px;
		text-align: left;
		text-indent: 65px;
		margin-bottom: 12px;
	}
	
	#news #recentArticles p.date {
		background-image: none;
		width: auto;
		height: auto;
		text-align: left;
		display: block;
		width: 13.571em;
		padding-left: 0.714em;
		padding-right: 0.714em;
	}
	
	#news #recentArticles a {
		color: #FFF;
		font-weight: bold;
		font-size: 1.167em;
		line-height: 1.286em;
		padding-left: 0.714em;
		padding-right: 0.714em;
		display: block;
		padding-bottom: 1.214em;
		margin-bottom: 1.214em;
		border-bottom: 1px solid #434242;
	}
	
	#news h2 {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 2em;
		line-height: 1.125em;
		color: #FFF;
		width: 29.167em;
		clear: right;
		text-transform: none;
		margin-bottom: 0.375em;
	}
	
	#news p.date {
		background-image: url(/img/structure/pageLayout/newsDateBG.png);
		background-repeat: no-repeat;
		background-position: center;
		width: 11.429em;
		height: 105px;
		float: left;
		text-align: center;
		display: block;
	}
	
	#news p.date .day {	
		font-size: 3.429em;
		display: block;
		line-height: 1em;
		font-weight: bold;
		margin-top: 0.5em;
		margin-left: 2px;
	}

	#news p.date .month {	
		font-size: 1.167em;
		display: block;
		line-height: 1.286em;
		font-weight: bold;
		text-transform: uppercase;
		margin-left: 2px;		
	}
	

/* Footer */
	#footer {
		clear: both;
		display: block;
		background-color: #1e1e1e;
		background-image: url(/img/structure/pageLayout/footerBG.gif);
		background-position: bottom;
		background-repeat: repeat-x;
		position: relative;
		width: 100%;
		height: 341px;
		border-top: 1px solid #3c3c3c;
	}
	
	#footer p {
		font-size: 1em;
		line-height: 1.5em;
	}
	
	#footer #twitter {
		float: left;
		width: 18.3em;
		background-image: url(/img/structure/pageLayout/footerTwitter.jpg);
		background-position: bottom;
		background-repeat: no-repeat;
		padding-right: 0.833em;
		margin-top: 3em;
		min-height: 16.5em;
		position: relative;
	}
	
	#footer #RSS {
		float: left;
		width: 18.3em;
		background-image: url(/img/structure/pageLayout/footerRSS.jpg);
		background-position: bottom;
		background-repeat: no-repeat;
		padding-left: 0.833em;
		padding-right: 0.833em;
		margin-left: 6.667em;
		margin-right: 6.667em;		
		margin-top: 3em;
		min-height: 16.5em;
		position: relative;
	}	
	
	#footer #copyright {
		float: left;
		width: 25em;
		padding-left: 0.833em;
		margin-top: 3em;
		min-height: 16.5em;
	}	
	
	#footer #twitter p, #footer #RSS p {
		width: 11.667em;	
	}
	
	#footer #twitter p a, #footer #RSS p a {
		position: absolute;
		bottom: 13px;
		font-size: 1.167em;
		line-height: 0.778em;
		padding-top: 4px;
		padding-bottom: 5px;
		padding-left: 60px;
		color: #FFF;
		font-weight: bold;
		display: block;
		width: 100%;
	}	

	#footer #credits {
		position: absolute;
		bottom: 0;
		background-image: url(/img/structure/pageLayout/footerLogo.png);
		background-position: right;
		background-repeat: no-repeat;
		width: 100%;
		height: 35px;
		padding-top: 18px;
	}
	
	#footer #credits a {
		color: #FFF;
		font-weight: bold;
	}


/* Contact form */
	#frmContact fieldset {
		background-color: transparent !important;
		background-image: none !important;
		border: none !important;
	}
	
	#frmContact legend {	
		display: none;
	}
	
	#frmContact label {		
		color: #FFF;
	}

/* Facebox styles */
.facebox h1 {
	font-size: 1.5em;
	line-height: 1em;
	text-align: center;
	margin-bottom: 1em;
}

.facebox p {
	text-align: center;
	margin-bottom: 1.5em;
}

.facebox form fieldset {
	border: 0px;
	background: none;
}

.facebox form fieldset legend {
	text-indent: -999999px;
}

/* CMS Containers */
.cmsContainer {
	clear: both;
	display: block;
}

/* Column definitions */
.text {
	}

.text p {
	margin-bottom: 1.5em;
}

.text h2 {
}

.text dl dt {
	font-weight: bold;
}

.text dl dd {
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.text ul li {
	list-style: circle;
	margin-left: 3em;
	margin-bottom: 0.75em;
}



/* Button styles
Thanks to Kevin Hale @ Particle Tree
http://particletree.com/features/rediscovering-the-button-element */

a.button {
    display:block;
    float:left;
    margin:4px 7px 4px 0;
    background: #f7f7f7;
    border:1px solid #c2c2c2;
    border-top:1px solid #ddd;
    border-left:1px solid #ddd;

    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size: 1em;
    line-height: 1.5em;
    text-decoration: none;
    font-weight: bold;
    color: #565656;
    cursor: pointer;
    padding: 5px 12px 6px 9px; /* Links */

	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;

    width: auto;
    overflow: visible;
}

a.button img {
    margin: -1px 6px -4px 0 !important;
    padding: 0;
    border: none;
    width: 16px;
    height: 16px;
}

/* STANDARD */

a.button:hover {
    background-color:#dff4ff;
    border:1px solid #c2e1ef;
    color:#336699;
}
a.button:active {
    background-color:#6299c5;
    border:1px solid #6299c5;
    color:#fff;
}

/* POSITIVE */

a.button.positive {
    color:#529214;
}
a.button.positive:hover {
    background-color:#E6EFC2;
    border:1px solid #C6D880;
    color:#529214;
}
a.button.positive:active {
    background-color:#529214;
    border:1px solid #529214;
    color:#fff;
}

/* NEGATIVE */

a.button.negative {
    color:#d12f19;
}
a.button.negative:hover {
    background:#fbe3e4;
    border:1px solid #fbc2c4;
    color:#d12f19;
}
a.button.negative:active {
    background-color:#d12f19;
    border:1px solid #d12f19;
    color:#fff;
}