/* Structual elements only */
/* BDA May 2006            */

body {
	margin:				0;
	padding:			0;
}
p {
	padding: 			0
	margin:				0;
}
/* frame for all pages */
#page_frame  {
	width:				770px;
	margin:				0 auto;
	padding:			0;
}

/* help/login/basket links */
#utility_links {
	padding:			10px 0 4px 0;
	margin:				0;
	
	height:				25px;
}
#utility_links #cart_links {
	float:				right;
	text-align:			right;
	font-size:			1.1em;
}
#utility_links img {
	border:				0;
	margin:				0;
	padding:			0;
}


/* horizontal tab links across page top */
/* this is the container, and does little */
#tab_menu {
	padding:			0;
	margin:				3px 0 0 0;
	height:				41px;
}


#tab_top_row {
	padding:			0;
	margin:				0;
	width:				598px;
	float:				left;
}
#tab_top_row ul {
	margin: 			0;
	padding:	 		0;
}

#tab_top_row ul li {
	padding:			0;
	margin:				0;
	list-style: 		none;
	float:				left;
	width:				99px;
	height:				20px;
	text-align:			center;
}
#tab_top_row ul li.dealer {
	width:				55px;
}
#tab_top_row a {
	padding:				6px 0 10px 0;
	margin:					0;
	display:				block;
	background-image:		url(images/fixed_top_tab.gif);
	background-position:	top left;
	background-repeat:		no-repeat;
}
#tab_top_row a:hover {
	background-image:		url(images/fixed_tab_on.gif);	
}
#tab_top_row a.glow {
	background-image:		url(images/fixed_tab_on.gif);
	font-weight:			bold;
}
/* the dealer tab is different  */
#tab_top_row ul li a.dealer {
	background-image:		url(images/fixed_dealer_tab.gif);
	background-position:	top left;
	background-repeat:		no-repeat;
}
#tab_top_row a.dealer:hover {
	background-image:		url(images/fixed_dealer_tab_on.gif);	
}


/* style commands for the other (bottom) row of tabs */
#tab_bottom_row {
	padding:			0;
	margin:				0;	
	height:				21px;
	width:				598px;

	/* this menu is 'in front'  */
	z-index:			120;
}

#tab_bottom_row ul {
	margin: 			0;
	padding:	 		0;
	width:				596px;

}

#tab_bottom_row ul li {
	padding:			0;
	margin:				0;
	
	list-style: 		none;
	float:				left;
	width:				99px;
	text-align:			center;

}
#tab_bottom_row a {
	padding:				6px 0 3px 0;
	margin:					0;
	display:				block;
	
	
	background-image:		url(images/fixed_tab.gif);
	background-position:	top left;
	background-repeat:		no-repeat;
}
#tab_bottom_row a:hover {
	background-image:		url(images/fixed_tab_on.gif);	
}
#tab_bottom_row a.glow {
	background-image:		url(images/fixed_tab_on.gif);
	font-weight:			bold;
}
/* Win IE realignment  */
/* note the float: forces the overlap in IE  */
* html #tab_top_row {
	width:					594px;
}
* html #tab_bottom_row  {
	width:					594px;
	float:					left;
	height:					20px;
	margin-top:				-3px;
}
* html #tab_top_row a {
	padding:				5px 0 6px 0;
}
* html #tab_top_row {
	padding:				0 0 -5px 0;
}





/* brand switch links are floated to the right of the main menu  */
#brand_links {
	float:				right;
	text-align:			right;
	
	padding:			0;
	margin:				0;
	width:				172px;
}
#brand_links a {
		padding:		0;
		margin:			0;
		border:			0;
		text-decoration:	none;
}
#brand_links img {
		border:			0;
		padding:		0;
		margin:			0 0 0 1px;
}


/* masthead container for adverts and logo   */
#masthead {
	border-top:			2px solid #666;
	border-left:		2px solid #666;
	border-right:		2px solid #666;
	
	height:				100px;
	background-color:	#fff;
	clear:				both;
}
/* Win IE needs a little help with math */
* html #masthead {
	height:				90px;
}
#masthead #logo {
		padding:			0;
		margin:				0;
		float:				right;
}
/* padding for banners */
#masthead #ad_space {
		margin:				7px;
}

/* crumbtrails   */
#crumbtrail {
	border-left:	2px solid #666;
	border-right:	2px solid #666;
	border-bottom:	2px solid #666;
	
	padding:		2px 0 2px 5px;
}
/* phone number is floated right in this row  */
#phone_no {
	float:			right;
	width:			170px;
	
	font-weight:	bold;
	padding:		1px 10px 1px 0px;
	text-align:		right;
}














/* main content begins and template designs turn on column structure  */
/* main div for all content between crumbs and footer (for bg etc) */
/* default is the two column streucture - nav and content           */
#bg_wire {
	background-image:		url(images/bg_page.gif);
	background-repeat:		repeat-y;
	background-position:	0 0;

}
#bg_wire_3col {
	background-image:		url(images/bg_page_3col.gif);
	background-repeat:		repeat-y;
	background-position:	0 0;
}




/* left navigation column  */
.nav_column {
		width:			160px;
		float:			left;
	
		margin:			0;
		padding:		0;
}

/* why?  i am still asking myself.   */
* html .nav_column {
		margin-right:	-3px;
}



.nav_section_title {
		padding:	3px 0 3px 10px;
		margin:		0 2px;
		height:		16px;
}
.nav_main_section_title {
		margin:			0 2px;
		padding:		3px 0 3px 10px;
		border-top:		2px solid #444;
}
.nav_section_link {
		float:		right;
		width:		40px;
		padding:	20px 0 0 10px;
}
.nav_section_text {
		padding:	7px;
}
.nav_links_section {
		padding:	10px 3px 20px 0px;
}


/* link lists in the navigation section */
.nav_links_section ul {
		list-style-type:	none;
		padding:			0;
		margin:				2px 0;

}
.nav_links_section li {
		padding:		2px;
		margin:			1px 0 0 8px;
}
.nav_links_section li a {
		text-decoration:	none;
		color:				#222;
		padding:			2px 0;
}
.nav_links_section li a:hover {
		background-color:	#23542F;
		color:				#fff;
		text-decoration:	none;
}
.nav_links_section li a.current {
		font-weight:		bold;
}
.nav_links_section li a.current:before {
		content: "\00BB \0020";
}
.nav_links_section li a.lev-0 {
		font-weight:		bold;
}

.nav_links_section h4 {
		margin:				3px 0 3px 10px;
		font-size:			1.2em;
}

.nav_links_section p.news {
		margin:				5px 5px 8px 10px;
		font-size:			90%;
}

/* special offer box in the left hand navigation column  */
.nav_special_offer {
		margin:			10px;
		width:			130px;
		padding:		3px;
		
		background-color:	#111;
		color:				#fff;
		
		border:				1px solid #666;
}
.nav_special_offer_title {
		font-size:			1.2em;
}
.nav_special_offer_title img {
		float:			right;
}
.nav_special_offer_img {
	clear:				right;
	padding:			10px 0;
}
.nav_special_offer_img img {
	float:				right;
	width:				61px;
	margin:				2px;

}
.nav_special_offer_text {
	clear:				right;
	padding:			6px 3px;
}


/* general usage?  */
.reduced_font {
		font-size:			60%;
}







/* site search and forms stuff   ** */
#site_search {
		padding:		3px 0 10px 5px;
}
#site_search form {
		padding:		2px 0;
		margin:			0;
}
#site_search input, #site_search select {
		width:			100px;
		padding:		1px;
		margin:			3px;
		border:			1px solid #444;
		font-size:		1.1em;
}
#site_search select {
	width:				140px;
}
#site_search select option {
		width:			200px;
}

/* these styles are applied to sub categories in the 'search' dropdown  */
/* only going to two at the moment, but many more may be applied        */
#site_search select option.sub_2 {
		padding:		0 0 0 25px;
		color:			#111;
		font-weight:	normal;
}
#site_search input.button {
	height:				24px;
	width:				24px;
	background-image:	url(images/red_button.gif);
	border:				0;
	background-color:	transparent;
}

.setwide {
	background:#fff;
	margin-right:2px !important;
}


/* Home page vertical sections   */
/* constructs vertical sections for product section */
/* plus corrections for Win IE                      */
table.thirds {
	border-top:			2px solid #444;
	border-bottom:		1px solid #444;
	background-image:	url(images/bg_tbl_thirds.gif);
	background-repeat:	repeat-y;
}
.product_col_left {
	border-right:		1px solid #444;
	margin:				0;
	padding:			0;
	width:				203px;
}
.product_col_right {
	margin:				0;
	width:				203px;
}
.product_col_center {
	border-right:		1px solid #444;
	padding:			0;
	width:				202px;
}
.product_title a {
	padding:			4px 0 5px 5px;
	margin:				3px;
}

.product_teaser {
	padding:			5px 5px 2px 5px;
	text-align:			center;	
}
.product_teaser .teaser_text {
		padding:		8px 5px 3px 5px;
		height:			65px;
		overflow:		auto;
		text-align:		left;
}
.product_teaser img {
	margin:				5px auto;
	border:				0;

}





/* cuts the site in two horizontally */
/* perhaps used only to align hr     */
/* for different pages               */
#home_split {
	margin:				0;
	padding:			0;
}
/* where search bar is locked with main hr */
#products_split {
	margin:				0;
	padding:			0;
}
#bottom_split {
	clear:				both;
	margin:				0;
	padding:			0;
	
}



/* for main product section headings and product layout  */
/* for main product section headings and product layout  */
#product_header {
	position:			relative;
		
	
}
/* this balances the top nav column with main content */
/* ie heights must in general match                   */
#products_leftbar {
	hedddight:				145px;
}
#product_header h3 {
		font-size:		1.8em;
		font-weight:	bold;
		line-height:	100%;
		
		padding:		10px 5px 10px 175px;
		margin:			0;
}

* html #product_header h3 {
		padding:		15px;
}

#product_header #product_header_img {
	float:				right;
	margin:				25px 25px 0 10px;
	padding:			0;
	
}
#product_header_description {
	margin:					0 105px 10px 175px;
	position:				relative;
}
#product_header p {
	padding:			2px;
	margin:				0;
}




div.category_heading {
	background-color:			#23542F;
	margin:						3px;
}
.category_heading a {
	color:						#fff;
	font-weight:				bolder;
	text-decoration:			none;
	display:block;
	height:20px;
	padding:					6px;
}
.category_heading_blank {
	margin:						0;
	padding:					6px;
}




/* product home page (four column table of product categories (    ***  */
.product_spread {
	margin:				0 2px 0 160px;
	padding:			0;
}
/* style the links within   */

a.prod_link {
	font-weight:		bold;
	text-decoration:	none;
	color:				#111;
	padding:			2px;
}
a.prod_link:hover {
	background-color:	#65876d;
	color:				#fff;
}

a.lert_link {
	font-weight:		bolder;
	color:				#d00;
	text-decoration:	none;
	padding:			1px 3px;
}
a.lert_link:hover {
	background-color:	#d00;
	color:				#fff;
	padding:			1px 3px;
}
/* correction for WIN IE */
* html .product_spread {
	margin:				0 0 0 157px;
	padding:			0;
}

table.four_cell {
		width:				608px;
		margin:				0;
		padding:			0;
		border:				0;
}
table.four_cell_bordered {
	width:				608px;
	border:				0;
	border-top:			2px solid #666;
	margin:				0 0 20px 0;
	padding:			0;
}
.product_spread  img {
	margin:					5px;
}
/* on the same page, uses a table(s) to output product ranges .... */
td.product_table_title {
	height:				22px;
	color:				#fff;
	font-weight:		bold;
	margin:				0;
	text-transform:		uppercase;

}
td.product_table_title a {
	display:				block;
	padding:				3px 0 3px 10px;
	text-decoration:		none;
	color:					#fff;
	margin:					3px;
	background-color:		#65876D;
}
* html td.product_table_title {
	height:				16px;
}
td.product_table_spacer {
	height:				4px;
}
td.product_table_cell {
	width:				25%;
	border:				0;
	border-right:		1px solid #ddd;		
	text-align:			center;
}
/* exactly the same, but lacks the dotted border  */
td.product_table_cell_end {
	width:				25%;
	text-align:			center;
}
td.product_table_rule {
	height:				7px;
}
td.product_table_rule div.table_rule {
	margin:				7px;
	padding:			0;
	border-bottom:		1px solid #ddd;
	height:				1px;
}
#products_text {
	padding:			10px 30px 20px 30px;
	line-height:		170%;
	
	font-size:			1.1em;

}



/* three column layout    */
.general_space {
	margin:					0;
	padding:				0;

}



/* on a singular product page and the buy buttons and all that */
/* related products on the right edge */
#related_products {
	width:			148px;
	float:			right;
	padding:		0 2px 0 0;

}
#related_products p {
	margin:			4px;
}
#related_products .rel_title {
	background-color:		#65876D;
	color:					#fff;
	padding:				4px 0 3px 4px;
	margin:					0;
	
	font-size:				1em;
	font-weight:			bold;
	text-transform:			uppercase;
}
#related_products table {
	margin:					0 0 15px 0;
}
td.related_product_table_cell {

	border-bottom:		1px dotted #222;
	width:				120px;
	padding:			5px;
	margin:				2px 2px 15px 5px;
	text-align:			center;
}









/* three column layout     */
#center_column h2 {
	padding:				10px 0 10px 0;
	margin:					0;
	line-height:			100%;
	font-size:				1.6em;
	
}
#center_column h3 {
	padding:				10px 0 5px 0;
	margin:					0;
	line-height:			100%;
	font-size:				1.2em;
	
}
#center_column h4 {
	padding:				10px 0 5px 15px;
	margin:					0;
	line-height:			100%;
	font-size:				1.6em;
	
}
#center_column {
	padding:				2px 0;
	margin:					0 152px 0 160px;
	font-size:				110%;
}
#center_column p {
	margin:					5px 15px 5px 0;
	line-height:			140%;
}

#product_display_img {
	float:					right;
	width:					150px;
	margin:				20px 25px;

}
.center_column_content {
	padding:				5px 15px;
	line-height:			140%;
	height:					1%;
}
.center_column_content p {
	margin:					1px 0;
	padding:				1px 0;
}
.center_column_content a {
	text-decoration:		none;
	font-weight:			bold;
	color:					#444;
}
.center_column_content a:hover {
	background-color:		#FFB51E;	
	color:					#000;
}
#icon_row {
	
	height:					50px;
	border-top:				1px solid #444;
	
	padding:				10px;
	margin:					5px 10px;
}
#icon_row img {
	margin:					2px 10px 2px 1px;
	border:					0;

}

.setwide {
	background:#fff;
	margin-right:2px !important;
}

.availability_box {
	border:					1px solid #ddd;
	padding:				3px;
	margin:					15px 7px 5px 12px;
	line-height:			140%;
	
	text-align:				left;
}
.availability_box a {
	text-decoration:		none;
	color:					#222;
}
.availability_box a:hover {
	background-color:		#FFB51E;
}
.availability_heading {
	background-color:		#FFB51E;
	color:					#111;
	font-weight:			bold;
	padding:				2px;
	letter-spacing:			1px;
}

.availability_box table {
	width:					390px;
	
}
.availability_box table td {
	border:					1px solid #eee;
}
.availability_box a {
	display:				block;
	padding:				2px;
}


/* table of sub-group products     */
#product_ordering {
	border-top:				2px solid #444;
	margin:					10px 0 0 0;	
}
/* remove this and YOU can scrape up the remains of the page in IE  */
* html #product_ordering {
	margin:					0;
}
#product_ordering form {
		padding:			0;
		margin:				0;

}
#product_ordering_title {
	background-color:		#65876D;
	color:					#fff;
	
	font-size:				1.2em;
	font-weight:			bold;
	text-transform:			uppercase;
	
	padding:				4px 0 3px 5px;
	margin:					3px;
}
#product_order {
	 width:					96%;
	 margin:				0 5px 25px 5px;
	 padding:				0;
}

#product_order td.light {
	background-color:		#DDE9D3;
	padding:				5px 0 5px 5px;
}
#product_order td.prodcode {
	background-color:		#EEE;
	padding:				5px 0 5px 5px;
}

#product_order thead td {
	border-bottom:			2px solid #444;
	padding:				5px 0;
	
	font-weight:			bold;
	
}
#product_order tbody td {
	border-bottom:			1px solid #444;
	padding:				5px 0;
}

#product_order input {
	border:				1px solid #666;
	padding:			1px;
	margin:				0;
	
	font-size:			0.8em;
}
#product_order input.cart_submit {
	width:				46px;
	height:				22px;
	background-image:	url(images/add_button_46x22_on.gif);
	border:				0;
	font-size:			0;
}

/*  formatting the checkout and basket editor  */
/* similar to product_order (on product details template)  */

#checkout_table  {
	 width:					440px;
	 margin:				10px 5px 25px 5px;
	 padding:				0;

}
#checkout_table thead td {
	font-weight:			bold;
}
#checkout_table tbody td {
	padding:				5px 0;
}
#checkout_table tbody tr.ul td {
	border-bottom:			1px solid #444;
	padding:				5px 0;
}
#checkout_table input, #checkout_table select, #payment_form input, #payment_form select {
	border:				1px solid #888;
	border-left:		2px solid #888;
	background-color:	#E3EDE0;
	padding:			2px;
	margin:				4px;

}
#payment_form input.single {
	width:				50px;
}
/* basket alert abs position and disappear  */
#basket_alert {
	z-index:		100;
	width:			100px;
	background-color:	yellow;
	border:			5px solid #444;
	margin:			10px auto;

}
	

/* generic form wrapper class  ---------- */
.pj_form_wrapper {
	border:				1px solid #bbb;
	border-right:		3px solid #bbb;
	padding:			5px;
	margin:				15px;
	background:			url(images/form_corner.gif) top right no-repeat;
}
.pj_form_wrapper table thead {
	font-weight:		bold;
}

.pj_form_wrapper input, .pj_form_wrapper select,.pj_form_wrapper textarea {
	border:				1px solid #888;
	background-color:	#E3EDE0;
	padding:			2px;
	margin:				4px;
}





#footer {
	clear:				both;

	border-left:		2px solid #666;
	border-right:		2px solid #666;
	border-bottom:		2px solid #666;
	
	margin:				0 0 5px 0;
}
#footer_links {
	border-top:			15px solid #999;
	padding:			4px;
	margin:				0;
	
	text-align:			center;
	border-bottom:		2px solid #666;
}
#footer_links ul {
	margin:				0;
	padding:			0;
}
#footer_links ul li {
	list-style-type:	none;
	display:			inline;
	
	padding:			1px 5px 1px 1px;
	margin:				0;
}
#footer_links a.current {
	font-weight:		bold;
}

#footer_cobrand {
	background-image:		url(images/footer_grad_bg.gif);
	background-repeat:		no-repeat;
	background-position:	160px 0;
	
	height:					80px;
}
#footer_cobrand img {
	padding:			0;
	margin:				8px 5px 0 5px;
	border:				0;
	
}
#footer_cobrand p {
		margin:			0;
		padding:		20px 5px 5px 5px;
}
#footer_cobrand #small_left {
	float:				left;
	width:				160px;
	background-color:	#000;
	color:				#fff;
	height:				80px;
}
#footer_cobrand #small_left p {
		margin:			0;
		padding:		5px;
}
#footer_cobrand #small_left img {
	border:				1px solid #fff;
}

#footer_cobrand #lrg_center {
	margin:				0 310px 0 0;
	border-right:		2px solid #444;
	height:				80px;
}
#footer_cobrand #lrg_center img {
	padding:			0 5px 0 5px;
}
#footer_cobrand #lrg_right {
	float:				right;
	width:				300px;

}
#footer_cobrand #lrg_right img {
	padding:				5px 5px 0 0;
}

#makers_mark {
	float:			right;
	text-align:		right;
}