/*====================================================================*/
/* YOB Golf */
/* Created 2009 */
/* Global Screen styles */
/*====================================================================*/

/* 
--- PLEASE NOTE ---

Please put any Internet Explorer specific styles/hacks/fixes in 'ie.css'.

Please keep tidy :)

*/
	
/* ------------------------------------------------------------------ */
/* =Globals */
/* ------------------------------------------------------------------ */

/* Resets */

* {margin: 0; padding: 0;}
img {border: 0;}
hr {display: none;}
acronym, abbr {border-bottom: 1px dotted; cursor: help;}
ul, ol {list-style: none;}
address {font-style: normal;}

/* Clearfixes */

.clearfix:after,
#aesthetics:after,
#header div.wrapper:after,
#content div.wrapper:after,
div.form-block:after {display: block; clear: both; visibility: hidden; height: 0; content: ".";}

/* Links */

a {
	font-weight: normal;
	color: #db6300;
	text-decoration: underline;
	}

a:hover,
a:focus {text-decoration: none;}

/* General styles */

.clear {clear: both;}
.small-text {font-size: 0.9em;}
.hide-1 {display: none;} /* For legends and any element you want to hide on the page - doesn't work with table cells and not good if you need screenreaders to read the content */
.hide-2 {position: absolute; left: -1000em;} /* To remove elements off-screen and remove their effect on other elements in the document - doesn't work with table cells */
.hide-3 {text-indent: -1000em;} /* To hide text in a table cell - still read by screen readers */
.hide-4 {visibility: hidden;} /* To hide an element and its contents but still hold its structure on the page */
.hide-5 {visibility: hidden; text-indent: -1000em;} /* To hide an element and its contents but still have its structure have a partial effect on its surrounding elements */

.centre {text-align: center;}

/* ------------------------------------------------------------------ */
/* =Structural */
/* ------------------------------------------------------------------ */

body {
	background: #171717;
	text-align: left;
	font: normal 81.3%/1.3 Tahoma, "Trebuchet MS", Arial, Sans-Serif;
	color: #333;
	}

#container {
	border-bottom: 1px solid #000;
	background: #171717 url(/graphics/structure/bg.gif);
	}
	
#aesthetics {background: url(/graphics/structure/header-bg.gif) repeat-x 50% 0;}

#header div.wrapper {
	position: relative;
	margin: 0 auto;
	width: 960px;
	}
	
#content {
	margin: 0 auto 15px auto;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding: 10px;
	width: 940px;
	background: url(/graphics/structure/bg-white-04.png);	
	}
	
#content div.wrapper {background: #fff url(/graphics/structure/side-col-bg.gif) repeat-y;}

#column-1 {
	float: right;
	padding: 20px;
	width: 645px;
	}

#column-2 {
	float: left;
	padding-bottom: 20px;
	background: #121212;
	width: 232px;
	}
	
/* ------------------------------------------------------------------ */
/* =Header */
/* ------------------------------------------------------------------ */

/* Search form */

#header fieldset {
	float: right;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	padding: 10px;
	background: url(/graphics/structure/bg-white-04.png);
	}

#header input {float: left;}
	
#header input.text {
	border: 0;
	padding: 3px 0 3px 25px;
  width: 12em;
	background: #e8e8e8 url(/graphics/icons/search-magnifying-glass.gif) no-repeat 5px 50%;
	color: #666;
	}
	
#header input.button {
	margin-left: 5px;
	border-bottom: 1px solid #888a8b;
	padding: 2px 5px 1px 5px;
	background: #a7aaac url(/graphics/buttons/grey.gif) repeat-x 0 100%;
	}

#header input.button:hover,
#header input.button:focus {background: #666;}
	
/* Logo */
	
#header h1,	
p#logo {
	overflow: hidden;
	position: absolute;
	top: 10px;
	width: 300px;
	height: 94px;
	background: url(/graphics/logos/logo.png) no-repeat 0 50%;
	}

p#logo a {
	display: block;
	overflow: hidden;
	height: 94px;
	outline: none;
	}

#header h1 img,
p#logo img {
	position: absolute;
	left: -1000em;
	}

/* Navigation */

ul#navigation {
	float: right;
	clear: both;
	margin: 15px 0 15px 310px;
	font-size: 1.2em;
	}

ul#navigation li {float: left;}

ul#navigation a {
	display: block;
	border: solid transparent;
	border-width: 0 1px;
	padding: 13px 15px;
	background: url(/graphics/structure/bg-white-04.png);
	color: #ffae2e;
	text-shadow: 1px -1px 2px #000;
	text-decoration: none;
	outline: none;
	white-space: nowrap;
	}	

ul#navigation :first-child a {
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	}	

ul#navigation :last-child a {
	-moz-border-radius-topright: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-top-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	}	

ul#navigation a.on,
ul#navigation a:hover,
ul#navigation a:focus {background: url(/graphics/structure/bg-black-20.png);}	

ul#navigation a.on {border-color: #4e4e4e;}	
ul#navigation :first-child a.on {border-left-color: transparent;}	
ul#navigation :last-child a.on {border-right-color: transparent;}	

/* ------------------------------------------------------------------ */
/* =Content */
/* ------------------------------------------------------------------ */

/* Formatting */

.formatting p,
.formatting ul,
.formatting ol,
.formatting dl,
.formatting address,
.formatting blockquote {margin-bottom: 1.5em;}

.formatting li {margin: 2px 0;}
.formatting dt {margin: 0.5em 0 0; font-weight: bold;}

.formatting ul {margin-left: 15px; list-style-type: disc;}
.formatting ul ul {margin-top: 0.5em; margin-bottom: 0.5em;}	
.formatting ol {margin-left: 1.6em; list-style-type: decimal;}

/* Headings */

#content h1, h2, h3,	h4, h5, h6 {
	margin: 0 0 0.7em 0;
	font: normal 1em/1.2 "Century Gothic", Tahoma, "Trebuchet MS", Arial, Sans-Serif;
	color: #db6300;
	color: #4f4a42;
	}	

#content h1 {font-size: 1.8em;}
h2 {font-size: 1.5em;}
h3 {font-size: 1.3em;}
h4 {font-size: 1.2em;}	
h5 {font-size: 1.1em;}

#content h1 {
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 3px 5px;
	background: #eee;
	}
	
#content h1 span.sku {
	float: right;
	margin: 0 0 0 15px;
	padding: 6px 0 0 0;
	font-size: 0.6em;
	color: #666;
	}

#column-2 h2 {
	margin-top: 20px;
	padding: 5px 10px;
	background: #292929;
	font-size: 1.6em;
	color: #eee;
	}

/* ------------------------------------------------------------------ */
/* =Brands */
/* ------------------------------------------------------------------ */

#brands {
	border-top: 1px solid #232323;
	border-bottom: 1px solid #232323;
	padding: 10px 0;
	background: #0b0b0b;
	}
	
#brands div.wrapper {
	overflow: hidden;
	margin: 0 auto;
	width: 960px;
	}

#brands ul {
	padding: 0 100px;
	list-style: none;
	text-align: center;
	}

#brands ul li {
	display: inline-block;
	margin: 0;
	}

#brands ul a {outline: none;}
	
#brands ul a img {
	border: 1px solid #0a0a0a;
	padding: 10px;
	}

#brands ul a:hover img,
#brands ul a:focus img {border-color: #222;}

#brands a {color: #856328;}
#brands a:hover,
#brands a:focus {color: #FFAE2E;}

/* ------------------------------------------------------------------ */
/* =Footer */
/* ------------------------------------------------------------------ */

#footer {
	border-top: 1px solid #000;
	padding: 10px 0;
	background: #171717;
	font-size: 0.923em;
	color: #858585;
	}
	
#footer div.wrapper {
	overflow: hidden;
	margin: 0 auto;
	width: 960px;
	}
	
#footer a {color: #856328;}
#footer a:hover,
#footer a:focus {color: #FFAE2E;}

/* Info */

#footer p.info {
	float: right;
	margin: 10px 0 0 20px;
	text-align: right;
	line-height: 1.5;
	}

/* Affiliations */

#footer ul.affiliations {
	padding: 0;
	list-style: none;
	}

#footer ul.affiliations li {
	float: left;
	margin: 10px 0 0 25px;
	}

/* ------------------------------------------------------------------ */
/* =Buttons */
/* ------------------------------------------------------------------ */

a.button,
input.button {
	display: inline-block;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 0;
	border-bottom: 1px solid #efaf6c;
	padding: 0.3em 0.8em;
	background: #efa208 url(/graphics/buttons/orange.gif) repeat-x 0 100%;
	text-align: center;
	line-height: 1.1;
	color: #fff;
	cursor: pointer;
	outline: none;
	text-shadow: 1px -1px 0 rgba(0,0,0,0.5);
	text-decoration: none;
	}
	
input.button {padding: 0.2em 0.8em;}
  
div.buttons a.right,
div.buttons input.right {float: right;}

a.button:hover,
a.button:focus,
input.button:hover,
input.button:focus {
	border-bottom-color: #cd4e01;
	background: #cd4e01;
	}

/* ------------------------------------------------------------------ */
/* =Forms */
/* ------------------------------------------------------------------ */

/* Fieldsets */

fieldset {border: 0;}
	
fieldset.styled {
	margin: 0 0 1.5em 0;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	padding: 15px;
	background: #eee;
	}
	
fieldset.medium {width: 70%;}
		
/* Legends */

legend {display: none;}

/* Structure */

div.form-block {margin: 0.7em 0;}
	
span.label {
	float: left;
	margin: 0 10px 0 0;
	padding: 4px 0 0 0;
	width: 25%;
	text-align: left;
	font-weight: bold;
	}
	
span.field {
	display: block;
	overflow: hidden;
	padding: 0 5px 0 0;
	}
	
/* Labels */

label {line-height: 1.2;}
	
div.form-block label {
	display: block;
	position: relative;
	}
	
span.label em {
	font-size: 0.85em;
	font-style: normal;
	font-weight: normal;
	color: #777;
	}
	
/* Form elements */
			
input,
textarea,
select {
	font: 1em Tahoma, "Trebuchet MS", Arial, Sans-Serif;
	color: #333;
	vertical-align: middle;
	}

input.text,
textarea,
select {
	border: 1px solid;
	border-color: #b5b5b5 #c9c9c9 #e2e2e2 #c9c9c9;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 3px 0 3px 3px;
	background: #fff;
	}

span.field input.text,
span.field textarea,
span.field select {width: 100%;}
		
select {padding: 2px;}
option {padding: 0 2px;}

/* Form errors */

#content h3.error {
  padding: 6px 0 6px 30px;
  background: transparent url(/graphics/form_error.gif) no-repeat 0 50%;
  color: #ae1c12;
  }
  
#content p.error {
  margin: 10px 0;
  border: 1px solid #e7a4a4;
  padding: 15px;
  background: #fdeaea;
  color: #64140f; 
  }
  
div.error_summary {
  margin: 10px 0;
  border: 1px solid #e7a4a4;
  padding: 15px;
  background: #fdeaea;
  color: #64140f; 
 	}
  
#content div.error_summary ul {
  margin: 10px 0 15px 20px;
  line-height: 1.2;
  list-style: none;
  }

#content div.error_summary li {
  padding: 1px 0 1px 10px;
  background: url(/graphics/arrow_link.gif) no-repeat 0 0.5em;
  } 

form.default div.form_block.error input.text,
form.default div.form_block.error textarea,
form.default div.form_block.error select {
	margin-top: 4px; 
	background: #fdeaea;
  }
  
form.default div.form_block.error div.form_left label,
#content form.default div.form_block.error div.form_left p {
	display: block;
	padding: 4px 20px 0 28px;
	background: url(/graphics/form_error.gif) no-repeat;
  color: #ae1c12;
  }
  
form.default div.form_block.error label {color: #ae1c12;}
form.default label em {font-weight: normal;}

#content h3.success {
  padding: 6px 0 6px 30px;
  background: transparent url(/graphics/form_success.gif) no-repeat 0 50%;
  color: #0d5300;
  }
  
#content p.success {
  margin: 10px 0;
  border: 1px solid #70b963;
  padding: 15px;
  background: #e3ffde;
  color: #0d5300;
  } 

/* ------------------------------------------------------------------ */
/* =Tables */
/* ------------------------------------------------------------------ */

/* Default table styles */

table {
	margin: 0 0 1.5em 0;
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
	text-align: left;
	font-size: 0.9em;
	}

table.unit_price {width: 60%;}
	
caption {display: none;}
	
th {	
	border: 1px solid #888;
	padding: 7px;
	background: #555;
	color: #ebe7e4;
	font-weight: bold;
	font-size: 1.1em;
	}	
	
td {	
	border: 1px solid #ddd;
	padding: 3px 7px;
	background: #F2F2F2;
	}

td.number {
	border-color: #efc58a;
	border-right-width: 1px;
	background: #fcd59d;
	}	
	
tr.even td {background: #fff;}
table .right {text-align: right;}
table .centre {text-align: center;}

/* Basket page table */

table.basket th,
table.basket td {
	border-right: 0;
	padding: 10px;
	font-size: 1.1em;
	}

table.basket td {
	border-bottom-color: #fff;
	padding: 4px 10px;
	background: #eee;
	}	

tr.update_basket td {
	background: #d3d3d3;
	font-weight: bold;
	}
		
table.basket td.delete {
	padding: 0;
	width: 30px;
	background: #f8f8f8;
	}
		
tr.update_basket td strong {
	padding: 2px 5px;
	background: #fff;
	color: #ac5100;
	}
		
table.basket td.delete a {
	display: block;
	padding: 4px 10px;
	background: url(/graphics/delete_icon.gif) no-repeat 50% 50%;
	text-indent: -1000em;
	}

/* ------------------------------------------------------------------ */
/* =Home banners */
/* ------------------------------------------------------------------ */

#home-banners {margin: 0 0 15px 0;}

#home-banners div.wrapper {
	position: relative;
	margin: 0 auto;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding: 10px;
	width: 940px;
	min-height: 330px;
	background: url(/graphics/structure/bg-white-04.png);
	}

#home-banners div.banner img {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 1;
	}
	
#home-banners div.banner div.text {
	position: relative;
	z-index: 2;
	padding: 25px;
	width: 310px;
	min-height: 280px;
	background: url(/graphics/structure/bg-black-70.png);
	font: normal 1.6em/1.3 "Century Gothic", "Trebuchet MS", Arial, Sans-Serif;
	color: #fff;
	text-shadow: 1px -1px 2px #000;
	}

#home-banners div.banner div.text p {margin: 0 0 1em 0;}
#home-banners div.banner div.text p.button {margin-bottom: 0;}

#home-banners div.banner div.text strong {
	display: block;
	font-size: 1.3em;
	color: #fed99f;
	}

#home-banners div.banner div.text em {
	font-weight: bold;
	font-style: normal;
	color: #fed99f;
	}
	
#home-banners div.banner div.text a.button {
	display: block;
	margin: 0 auto;
	width: 60%;
	font-weight: bold;
	}

/* ------------------------------------------------------------------ */
/* =Home funnels */
/* ------------------------------------------------------------------ */

#home-funnels {
	margin: 0 auto 15px auto;
	width: 960px;
	}
	
#home-funnels ul {overflow: hidden;}

#home-funnels ul li {
	float: left;
	margin: 0 20px 0 0;
	width: 225px;
	}

#home-funnels ul li.last {margin-right: 0;}

#home-funnels ul a {
	display: block;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding: 10px;
	background: url(/graphics/structure/home-funnels-bg.png) repeat-x;
	color: #b5ac9a;
	text-decoration: none;
	outline: none;
	}	

#home-funnels ul a:hover,
#home-funnels ul a:focus {
	background-image: url(/graphics/structure/home-funnels-bg-on.png);
	color: #fab939;
	}	

#home-funnels ul a img {
	display: block;
	margin: 0 0 10px 0;
	}
	
#home-funnels ul a strong {
	display: block;
	margin: 0 0 5px 0;
	padding: 0 0 10px 0;
	background: url(/graphics/structure/dark-underline.png) repeat-x 0 100%;
	font: normal 1.25em/1.2 "Century Gothic", "Trebuchet MS", Arial, Sans-Serif;
	color: #fab939;
	}

#home-funnels ul a:hover strong,
#home-funnels ul a:focus strong {color: #fff;}	

#home-funnels ul a span.small-text {display: block;}	

/* ------------------------------------------------------------------ */
/* =Product category listing */
/* ------------------------------------------------------------------ */

ul.categories {
	overflow: hidden;
	margin-left: 0;
	list-style: none;
	text-align: center;
	}
	
ul.categories li {
	position: relative;
	float: left;
	margin: 0 15px 15px 0;
	}
		
ul.categories a {
	display: block;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding: 10px 10px 45px 10px;
	width: 125px;
	height: 9.5em;
	background: #2e2e2e url(/graphics/structure/categories-bg.gif) no-repeat 10px 10px;
	color: #fab939;
	text-decoration: none;
	line-height: 1.1;
	}
		
ul.categories a:hover,
ul.categories a:focus {
	background-color: #bbb;
	color: #333;
	}

ul.categories a strong {
	display: block;
	position: absolute;
	bottom: 5px;
	left: 0;
	right: 0;
	padding: 10px;
	background: #2e2e2e;
	font-weight: normal;
	text-shadow: 1px -1px 1px #000;
	cursor: pointer;
	}
	
ul.categories a:hover strong,
ul.categories a:focus strong {
	background-color: #bbb;
	text-shadow: none;
	}

/* ------------------------------------------------------------------ */
/* =Product brand listing */
/* ------------------------------------------------------------------ */

ul.brands-nav {
	margin-left: 0;
	list-style: none;
	text-align: left;
	}
	
ul.brands-nav li {
	display: inline;
	margin: 10px;
	}
	
ul.brands-nav a {
	outline: none;
	text-decoration: none;
	}
		
ul.brands-nav a img {
	border: 1px solid #fff;
	width: 190px;
	height: 127px;
	}
		
ul.brands-nav a:hover img,
ul.brands-nav a:focus img {border-color: #ddd;}

/* ------------------------------------------------------------------ */
/* =Category Navigation */
/* ------------------------------------------------------------------ */

ul.nav-categories {
	margin: 0;
	list-style: none;
	font-size: 1.1em;
	line-height: 1.1;
	}

ul.nav-categories li {margin: 0;}

ul.nav-categories a {	
	display: block;
	padding: 2px 15px 2px 20px;
	background:transparent url(/graphics/icons/nav-arrow.gif) no-repeat scroll 10px 50%;
	color: #bbb;
	text-decoration: none;
	}

ul.nav-categories a.on,
ul.nav-categories a:hover,
ul.nav-categories a:focus {	
	background-color: #2c2c2c;
	color: #FAB939;
	}	

ul.nav-categories a.on {color: #FFAE2E;}

/* Sub navs */

ul.nav-categories ul {	
	margin: 5px 0;
	list-style: none;
	font-size: 0.8em;
	}

ul.nav-categories ul ul {
	margin: 2px 0 5px 0;
	font-size: 1em;
	}

ul.nav-categories ul a {
	padding-left: 30px;
	background-position: 20px 50%;
	color: #eee;
	}

ul.nav-categories ul ul a {
	padding-left: 45px;
	background-position: 30px 50%;
	}

/* ------------------------------------------------------------------ */
/* =Products page */
/* ------------------------------------------------------------------ */

#column-1 #product_image h2,
#column-1 #product_info h2 {
	margin-top: 1em;
	border-bottom: 1px solid #ddd;
	padding: 0 0 4px 0;
	font-size: 1.1em;
	font-weight: bold;
	}
	
/* Product image */

#product_image {
	float: left;
	margin: 0 1.5% 0 0;
	width: 36%;
	text-align: center;
	}

#product_image h2,
#product_image p,
#product_image ul {text-align: left;}

/* Product info */
	
#product_info {
	float: right;
	width: 60%;
	}
		
#product_info ul {
	margin-left: 0;
	list-style: none;
	font-size: 0.9em;
	}
	
#product_info ul li {
	padding: 0 0 0 10px;
	background: url(/graphics/list_arrow.gif) no-repeat 0 0.5em;
	}

/* Thumbnail images */

ul.thumbnails {
	overflow: hidden;
	margin: 0;
	list-style: none;
	}

ul.thumbnails li {
	float: left;
	margin: 5px 7px;
	border: 1px solid #ddd;
	}

ul.thumbnails a {
	display: block;
	border: 1px solid #fff;
	width: 58px;
	height: 58px;
	text-decoration: none;
	}

ul.thumbnails li:hover,	
ul.thumbnails a:hover,
ul.thumbnails a:focus {border-color: #f1994a;}
	

/* ------------------------------------------------------------------ */
/* =Embroidery list */
/* ------------------------------------------------------------------ */

ul#embroiodery {
	overflow: hidden;
	margin-left: 0;
	list-style: none;
	}
	
ul#embroiodery li {
	float: left;
	margin: 0 10px 10px 0;
	}
	
ul#embroiodery a {
	display: block;
	border: 3px solid #ccc;
	padding: 0;
	background: #333;
	text-decoration: none;
	color: #fff;
	}
	
ul#embroiodery a:hover,
ul#embroiodery a:focus {border-color: #E38918;}
	
/* ------------------------------------------------------------------ */
/* =Maps */
/* ------------------------------------------------------------------ */

#map,
#stockists_map {
  margin: 0 0 1.5em 0;
  height: 300px;
	}

#stockists_map {height: 650px;}