/* Style sheet with blue colours */
/* HEADER: General Tags & Text */

/* HELP: Basic body background for your store. You can use this to alter the background colour for your entire store */
body {
	font-family: Tahoma, verdana, sans-serif;
	background: #FFF url(../images/bg.png) repeat-x;
	margin: 0px;
	padding: 0px;
	height: 100%;
	font-size:100%;
	color: #444; 
}

/* HEADER: Left and Right Menus */
/* HELP: The div container for the left menu in the store<br/><br/> */
#left-menu {
	background-color: #10499e;
	font-size: 1em;
	color: #444;
	width: 200px;
}

/* HELP: The div container for the right menu in the store<br/><br/> */
#right-menu {
	font-size: 1em;
	color: #444;
	width: 200px;
}

/* HELP: Basic store link colour<br/><br/> */
a {
	color:#10499e;
	text-decoration: underline;
}

/* HELP: Basic store link colour (when mouse hovers over it) */
a:hover {
	color:#ed1c24;
	text-decoration: underline;
}

/* HELP: Main page headings, for example product names, section titles etc. */

h1 {
	font-size: 1em;
	font-weight: bold;
	color: #FFF;
	background-color: #10499e;
	padding: 4px;
	margin-bottom: 5px;
	margin-top: 10px;
	clear: both;
}

.title-home { width:530px; height:87px; background: url(../images/title-home.png) no-repeat; float:left; margin: 0 0; } 

/* used on image next to intro text */
.img-home { margin: 10px 0; }

/* HELP: Sub-headings on the page, for example the section and product listing headers on section pages */
h2 {
	font-size: 0.8em;
	font-weight: bold;
	color: #FFF; 
	background-color: #10499e; 
	padding: 3px;
	margin-top: 2px;
	clear: both;
}

h2 a {
	color: #FFF;
	text-decoration:underline;
}

h2 a:hover {
	color: #FFF; 
	text-decoration:none;
}

.special-offer {
	font-size: 1em;
	background-color: #ed1c24;
	padding: 4px;
	margin-top: 10px;
	clear: both;
}

h3 {
	font-size: 1em;
	font-weight: bold;
	color: #10499e; 
	margin-top: 10px;
}

h3 a { text-decoration:none; }
h3 a:hover { text-decoration:underline; color:#ed1c24; }

/* HELP: Standard paragraph formatting for your store. Anything in a &lt;p&gt; tag will be displayed using this. */
p {
	font-size: 0.8em;
	line-height: 1.4em;
}

.light-blue	{ padding: 3px; margin-top: 2px; background:#e4e6f3; }


/* HELP: Formatting for the &lt;strong&gt; HTML tag. By default this shows text in bold */
strong {
	font-weight: bold;
}

/* HELP: Basic styling for all user input form fields, including text boxes, textarea boxes etc. */
input { 
	font-size: 1em;
	font-weight: normal;
	background-color: #FFFFFF; 
	color: #444; 
	border: 1px solid #1a5bb0; 
	height: 1.25em;
	margin-bottom: 1px;
}

textarea { 
	font-size: 1em;
	font-weight: normal;
	background-color: #FFFFFF;
	color: #444; 
	border: 1px solid #1a5bb0; 
	font-family: Tahoma, verdana, sans-serif;
	margin-bottom: 1px;
}

/* HELP: Style for checkboxes to avoid border applied to other input fields and tweak position */
.checkbox {
	position: relative;
	top: 2px;
	border: 0px;
}

/* HELP: Formatting for form select boxes (also called drop-down boxes)<br/><br/> */
select { 
	font-size: 1em;
	font-weight: normal;
	background-color: #FFFFFF; 
	color: #444; 
	border: 1px solid #1a5bb0; 
}

/* HELP: Style for all form buttons used on your store, including form submission buttons */
.button {
	font-size: 0.9em;
	font-weight: bold;
	background-color: #3586ef;
	border: 1px solid #000000;
	color: #ffffff;
	cursor: pointer;
	height: 2em;
	padding-bottom: 1px;
}

/* HELP: Style for all form buttons used on your store when mouse hovers over them */
.button:hover {
	font-size: 0.9em;
	font-weight: bold;
	background-color: #1a5bb0;
	border: 1px solid #000000;
	color: #ffffff;
	cursor: pointer;
	height: 2em;
	padding-bottom: 1px;
}

/* HELP: Style used for places where a smaller text size is required, generally on product templates and product menu box listings */
.smaller-text {
	font-size: 0.8em;
	line-height: 1.4em;
	width: 100%;
}

/* HELP: Style used for places where a smaller text size is required, generally on product templates and product menu box listings */
.our-price {
	font-size: 0.9em;
	font-weight: bold;
	line-height: 1.4em;
	width: 100%;
	margin-top:5px;
}

/* HELP: General styling for main product prices shown in the store, excluding cart and checkout price displays */
.price {
	font-weight: bold;
	font-size: 0.9em;
	line-height: 1.4em;
	color: #ed1c24;
}

/* HELP: Style used for all error text in the store, e.g. form entry validation errors etc. */
.error-text {
	font-size: 0.8em;
	font-weight: bold;
	color: #ff0000;
}

/* HEADER: Page Header */
/* HELP: The main header bar for your store, where your logo, search and mini cart reside */
#header {
	background-color: #FFF;
	margin: 0px;
	width: 100%;
	padding: 0px;
	overflow: auto;
}

#logo-box {
	background-color: #10499e;
	margin: 0px;
	width: 200px;
	height: 200px;
	padding: 0px;
	overflow: hidden;
	float:left;
}

/* HELP: Styling for your logo that appears in the main header for the store */
#logo {
	margin: 38px 0 0 37px; border: 0px;
}

/* HELP: This is the right hand section of the header where the top links and search reside */
.header-right {
	float: right;
}

#logo-large {
	margin: 40px 20px 0 50px; border: 0px;
}

#products-pic {
	margin-top: 15px; border: 0px;
}

#call-us {
	margin-top: 0px; border: 0px;
}


/* HELP: This appears under the header and contains the welcome message and the mini cart plus cart and checkout links */
#sub-header {
	font-size: 0.7em;
	font-weight: normal;
	color: #FFF;
	background-color: #ed1c24;
	margin: 0px;
	width: 100%;
	padding: 8px 0;
}

#sub-header a {color: #FFF;}

#sub-header a:hover {text-decoration: none;}

/* HELP: Span used to display the welcome message itself<br/><br/> */
#sub-header span {
	padding-left: 5px;
}

/* HELP: Surrounding container for the top links shown in the right hard part of the store header */
#top-links {
	float: right;
	display: inline;
	padding-right: 5px;
}

/* HELP: Basic styling for the list of links, created with an unordered list. This basically just ensures there are no margins around the list of links */
#top-links-list {
	margin: 0px;
	padding: 0px;
	white-space: nowrap;
}

/* HELP: Each link will have this overall style and this ensures that they are output side by side, rather than below each other */
#top-links-list li {
	display: inline;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	color: #FFF;
	font-weight: normal;
}

/* HELP: Formatting for the actual links themselves<br/> */
#top-links-list a { 
	font-weight: normal;
	font-size: 1em;
	padding: 1px 2px;
	margin-right: 2px;
	margin-bottom: 0px;
	color: #FFF;
	text-decoration: underline;
}

/* HELP: Formatting for the actual links when the mouse hovers over them */
#top-links-list a:hover {text-decoration: none;}

/* HELP: Surrounding container for the mini cart shown in the sub-header section */
#mini-cart {
	float: right;
	display: inline;
}

/* HELP: Basic styling for the mini cart, created with an unordered list. This basically just ensures there are no margins around it */
#mini-cart-list {
	margin: 0px;
	padding: 0px;
}

/* HELP: Each entry will have this overall style and this ensures that they are output side by side, rather than below each other */
#mini-cart-list li {
	display: block;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	color: #444;
	font-weight: bold;
	padding-left: 5px;
}

/* HELP: Formatting for the links within the mini cart<br/> */
#mini-cart-list a { 
	font-weight: bold;
	font-size: 0.75em;
	padding: 1px 2px;
	margin-right: 2px;
	margin-bottom: 0px;
	color: #003366;
	text-decoration: underline;
}

/* HELP: Formatting for the actual links when the mouse hovers over them */
#mini-cart-list a:hover {
	color: #444;
	text-decoration: underline;
}

.mini-cart-left		{ text-align:right; margin: 0 3px; width: 64px; height:64px;}
.mini-cart-right	{ text-align:left; margin-top:10px;}

/* HELP: Styling for the search section of the header bar<br/><br/> */
#search {
	margin-right: 5px; 
	clear: right; 
	padding-top: 10px;
}

/* HELP: Each link will have this overall style and this ensures that they are output side by side, rather than below each other */
#search-list li {
	display: block;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	color: #444;
	font-weight: normal;
}

/* HELP: Formatting for the actual links themselves<br/> */
#search-list a { 
	font-weight: normal;
	font-size: 1em;
	padding: 1px 2px;
	margin-right: 2px;
	margin-bottom: 0px;
	color: #444;
	text-decoration: underline;
}

/* HELP: Formatting for the actual links when the mouse hovers over them */
#search-list a:hover {
	text-decoration: none;
}

/* HELP: The overall container for each menu box in the left and right menus */
.search-box {
	width: 100%;
	margin-top: 10px;
	font-size: 0.75em;
	font-weight: normal;
	padding-bottom: 2px;
	border: 1px solid #10499e;
}

.search-box-input {
	width: 170px;
	margin: 10px 0 5px 15px;
	font-size: 0.9em;
	font-weight: normal;
	padding-bottom: 2px;
	border: 1px solid #10499e;
}


/* HELP: The title for the menu box<br/><br/> */
.search-box-title {
	font-size: 1.1em;
	font-weight: bold;
	color: #ffffff;
	background-color: #10499e;
	width: 100%;
	text-align: center;
	padding: 4px 0;
}

/* HELP: Standard formatting for each menu's content area<br/> */
.search-box-content {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 2px;
	margin-right: 2px;
	text-align: left;
	overflow: auto;
}

/* HELP: The content area of each menu box where the contents in centered, e.g. the newsletter signup box */
.search-box-content-center {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 2px;
	margin-right: 2px;
	text-align: center;
	overflow: auto;
}

/* HELP: Styling for the search button in the search section of the header */
#search-button {
	background-color: #8dbfff;
	font-weight: bold;
	font-size: 0.9em;
	border: 1px solid #000000;
	color: #444;
	cursor: pointer;
	padding-bottom: 1px;
	height: 17px;
	position: relative;
	padding-bottom: 2px;
}

/* HELP: The search suggest drop down. Do not remove position, left or z-index! */
#search_suggest {	
	position: absolute; 
	background-color: #FFFFFF; 
	text-align: left; 
	border: 1px solid #000000;	
	visibility: hidden;
	width: 150px;
	top: 0px;
	left: 0px;
	z-index: 200;
}	

/* HELP: Styling for link div in the search suggest box */
.suggest_link {
	background-color: #FFFFFF;
	padding: 2px 6px 2px 6px;
	font-weight: normal;
}

/* HELP: Styling for text highlights in search suggest box */
.suggest_link_highlight {
	background-color: #FFCC33;
	font-weight: bold;
}

/* HELP: Styling for link div with mouse over in search suggest box */
.suggest_link_over {
	background-color: #3366CC;
	padding: 2px 6px 2px 6px;
	cursor: pointer;
}

/* HELP: The overall container for each menu box in the left and right menus */
.menu-box-no-border {
	width: 100%;
	margin-bottom: 10px;
	font-size: 0.75em;
	font-weight: normal;
	padding-bottom: 2px;
}

/* HELP: The overall container for each menu box in the left and right menus */
.customer-box {
	width: 100%;
	margin-top: 10px;
	font-size: 0.95em;
	line-height: 1.2em;
	font-weight: normal;
	padding-bottom: 2px;
	background-color: #e4e6f3;
	border: 1px solid #10499e;
}

/* HELP: The title for the menu box<br/><br/> */
.customer-box-title {
	font-size: 1em;
	font-weight: bold;
	color: #ffffff;
	background-color: #10499e;
	width: 100%;
	text-align: center;
	padding: 4px 0;
}

/* HELP: The content area of each menu box where the contents in centered, e.g. the newsletter signup box */
.customer-box-content-center {
	padding-top: 5px;
	padding-bottom: 10px;
	margin-left: 10px;
	margin-right: 10px;
	text-align: center;
	overflow: auto;
}

.left-label { text-align:right; padding-right: 10px; width: 180px;}
.right-label { text-align:left; margin-top:10px;}

/* HELP: The overall container for each menu box in the left and right menus */
.trade-discount-box {
	width: 100%;
	margin-top: 10px;
	font-size: 0.75em;
	font-weight: normal;
	padding-bottom: 2px;
	background:#ed1c24;
	border: 1px solid #ed1c24;
}

/* HELP: The title for the menu box<br/><br/> */
.trade-discount-title { width:177px; height:61px; background: url(../images/title-trade-discount.png) no-repeat; margin:10px 0 5px 10px; }

.trade-discount-subtitle { width:167px; height:72px; background: url(../images/title-sub-trade-discount.png) no-repeat; margin:5px 0 10px 10px; }


/* HELP: Standard formatting for each menu's content area<br/> */
.trade-discount-content {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 10px;
	margin-right: 10px;
	text-align: left;
	overflow: auto;
	color:#FFF;
}

/* HELP: The content area of each menu box where the contents in centered, e.g. the newsletter signup box */
.trade-discount-content-center {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 2px;
	margin-right: 2px;
	text-align: center;
	overflow: auto;
}
/* HELP: The content area of each menu box where the contents in centered, e.g. the newsletter signup box */
.pos-box {
	width: 100%;
	margin-top: 10px;
	font-size: 0.75em;
	font-weight: normal;
	padding-bottom: 2px;
	background-color: #e4e6f3;
	border: 1px solid #10499e;;
}

/* HELP: The overall container for each menu box in the left and right menus */
.newsletter-box {
	width: 100%;
	margin-top: 10px;
	font-size: 0.75em;
	font-weight: normal;
	padding-bottom: 2px;
	background:#10499e;
	border: 1px solid #10499e;
	color:#FFF;
}

.newsletter-box-input {
	width: 170px;
	margin: 10px 0 5px 0px;
	font-size: 0.9em;
	font-weight: normal;
	padding-bottom: 2px;
	border: 1px solid #000;
}

/* HELP: The title for the menu box<br/><br/> */
.pos-title { width:152px; height:91px; background: url(../images/title-pos.png) no-repeat; margin:10px 0 5px 10px; }

.pos-subtitle { width:68px; height:139px; background: url(../images/title-pos2.png) no-repeat; margin:5px 0 10px 10px; float:left; }

.img-pos {margin: 0 10px;}


/* HELP: Standard formatting for each menu's content area<br/> */
.pos-content {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 10px;
	margin-right: 10px;
	text-align: left;
	overflow: auto;
	color:#10499e;
}

/* HELP: The content area of each menu box where the contents in centered, e.g. the newsletter signup box */
.pos-content-center {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 2px;
	margin-right: 2px;
	text-align: center;
	overflow: auto;
	color:#10499e;
}

/* HELP: The overall container for each menu box in the left and right menus */
.menu-box {
	width: 100%;
	margin-top: 10px;
	font-size: 0.75em;
	font-weight: normal;
	padding-bottom: 2px;
	border: 1px solid #10499e;
}

/* HELP: The title for the menu box<br/><br/> */
.menu-box-title {
	font-size: 1.1em;
	font-weight: bold;
	color: #ffffff;
	background-color: #10499e;
	width: 100%;
	text-align: center;
	padding: 4px 0;
}

/* HELP: Standard formatting for each menu's content area<br/> */
.menu-box-content {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 2px;
	margin-right: 2px;
	text-align: left;
	overflow: auto;
}

/* HELP: The content area of each menu box where the contents in centered, e.g. the newsletter signup box */
.menu-box-content-center {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-left: 2px;
	margin-right: 2px;
	text-align: center;
	overflow: auto;
}

/* HELP: List formatting for the top level sections shown in the left menu. The links themselves will use the standard a and a:hover formatting. */
#menu-section-list {
	margin: 0px; padding: 0px;
}


/* HELP: List formatting for the sub-sections shown in the left menu. The links themselves will use the standard a and a:hover formatting. */
#menu-section-list ul {
	margin: 0px; padding: 0px;
}

#menu-section-list li {
	list-style-type: none; border-bottom: 1px solid #F00; padding: 6px 0 6px 20px;
}

#menu-section-list a {
	color:#FFF; text-decoration:none; text-transform:uppercase; font-weight:bold;
}

#menu-section-list a:hover {
	font-weight:normal; padding: 6px 0 6px 0;
}

/* HELP: List formatting for the customer account links in the left menu. Also used for open account etc. links if customer is customer is not logged in */
#customer-links {
	margin: 0px; padding: 0px;
}

#customer-links ul {
	margin: 0px; padding: 0px;
}

#customer-links li {
	list-style-type: none; border-bottom: 1px solid #F00; padding: 6px 0 6px 20px;
}

#customer-links a {
	 color:#FFF; text-decoration:none; font-weight:bold;
}

#customer-links a:hover {
	 font-weight:normal; padding: 6px 0 6px 0;
}

/* HELP: List formatting for the news links in the left menu. The links themselves use the standard a and a:hover formatting */
#news-links {
	margin: 0px; padding: 0px; color:#FFF;
}

#news-links ul {
	margin: 0px; padding: 0px;
}

#news-links li {
	list-style-type: none; border-bottom: 1px solid #F00; padding: 6px 0 6px 20px;
}

#news-links a {
	color:#FFF; text-decoration:none; text-transform:uppercase; font-weight:bold;
}

#news-links a:hover {
	font-weight:normal; padding: 6px 0 6px 0;
}

/* HELP: Used to surround the product lists shown in the right menu in your store */
.menu-product-list {
	clear: both; padding-top: 2px;
	margin-bottom: 2px;
}

/* HELP: Used to format the small thumbnail images shown in product lists on the right menu in your store */
.menu-product-image {
	margin-right: 5px; float: left; position: relative;
}

/* HEADER: Main Content */
/* HELP: Basic style for the main content section of all the pages in your store. This is the section between the left and right menus. */
#main-content {
	color: #444;
	background-color: #ffffff;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: 1em;
}

/* HELP: Style for the breadcrumb div shown above all the main content titles */
#breadcrumb {
	font-size: 0.7em;
	border: 1px solid #003366;
	width: 100%;
	margin-bottom: 10px;
}

/* HELP: Style for the breadcrumb links<br/><br/> */
#breadcrumb a {
	text-decoration: none;
}

/* HELP: Style for the breadcrumb links when the mouse hovers over them<br/><br/> */
#breadcrumb a:hover {
	text-decoration: none;
}


/* HELP: Style for the title of the breadcrumb trail shown within the breadcrumb div */
#breadcrumb-title {
	font-weight: normal;
	color: #ffffff;
	background-color: #10499e;
	padding-left: 3px;
	padding-right: 3px;
	margin-right: 3px;
	font-weight: bold;
	border-right: 1px solid #0b51ab;
}

/* HEADER: Page Footer */
/* HELP: Containing div for the footer shown on every page in your store */
#footer {
	color: #444;
	margin: 0px;
	padding: 20px 0;
	width: 100%;
	clear: both;
	text-align: center;
}

/* HELP: Basic list formatting for the list of links in the footer<br/> */
.footer-links {
	margin-left: 0;
	padding-left: 0;
	white-space: nowrap;
	margin-top: 0px;
	padding-top: 0px;
	margin-bottom: 0px;
	margin-right: 0px;
	font-size: 0.7em;
	padding-bottom: 10px;
}

/* HELP: Style for each entry in the list of links<br/><br/> */
.footer-links li {
	font-weight: bold;
	display: inline;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	padding-left: 2px;
	padding-right: 2px;
}

/* HELP: Style for each actual link in the footer links<br/><br/> */
.footer-links a { 
	padding: 1px 1px;
	margin: 2px 2px 0px 0px;
	white-space: nowrap;
	text-decoration: underline;
	font-weight: normal;
	color: #10499e;
}

/* HELP: Style for each link in the footer links list when the mouse hovers over it */
.footer-links a:hover {
	text-decoration: underline;
	font-weight: normal;
	color: #ed1c24;
}

/* HELP: Formatting for the users online section of the store footer */
#users-online {
	font-size: 0.7em;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	clear: both;
}

/* HELP: Formatting for the copyright section of the store footer */
#copyright {
	font-size: 0.7em;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	clear: both;
}

/* HEADER: Section Page Style */
/* HELP: Container for the content (sub-sections &amp; products) on the section pages */
.section-content {
	clear: both; padding-top: 10px;
}

/* HELP: Container for each sub-section listed on a section page<br/><br/> */
.sub-sections {
	width: 100%; clear: both; text-align: left;
}

/* HELP: Style for the section thumbnails shown on section pages, both for the section and sub-section listings */
.section-thumbnail {
	float: left; margin-right: 5px; padding: 3px;
}

/* HELP: Style for the display of the sub-section title on section pages */
.sub-section-title, .sub-section-title a {
	font-weight: bold;
	font-size: 0.9em;
	text-decoration: none;
}


/* HEADER: Paging Styles */
/* HELP: Container for the paging links on section and search pages */
.pages-container {
	top: 0px;
	padding: 1px;
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 0.6em;
	text-align: right;
}

/* HELP: Basic list formatting for the paging links, including previous and next links */
.pages-list {
	margin-left: 0px;
	padding-left: 0px;
	white-space: nowrap;
	margin-top: 0px;
	padding-top: 0px;
	margin-bottom: 0px;
	margin-right: 0px;
}

/* HELP: Formatting for each entry in the paging links<br/><br/> */
.pages-list li {
	color: #444;
	display: inline;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	margin: 0px;
	margin-left: 1px;
	margin-right: 1px;
}

/* HELP: Display style for the page entry in the list that you are currently viewing */
.pages-list span { 
	padding: 5px;
	padding-top: 3px;
	padding-bottom: 3px;
	margin: 0px; 
	color: #444;
	background-color: #8dbfff;
	border: 1px solid #000000;
}

/* HELP: Actual clickable link for page numbers and previous and next links */
.pages-list a { 
	padding-top: 3px;
	padding-bottom: 3px;
	margin: 0px; 
	color: #003366;
	background-color: #e4effa;
	padding-left: 5px;
	padding-right: 5px;
	border: 1px solid #000000;
}

/* HELP: Clickable link style when mouse hovers over it<br/><br/> */
.pages-list a:hover {
	text-decoration: underline;
	color: #ff8d29;
	background-color: #1a5bb0;
}


/* HEADER: Product Listing Styles */

/* HELP: Styling for the product thumbnails shown in the main content where products are listed, e.g. section pages */
.product-thumbnail {
	margin-right: 5px; padding: 3px; padding-left: 0px; border: 0px;
}

/* HELP: Used for the product lists if you've selected to show a single column in the template options */
.product-single {
	clear: both; text-align: left;
	margin-left: auto; margin-right: auto;
	zoom: 1;
}

/* HELP: Used for the left hand column on product lists if you've selected to show two columns in the template options */
.product-column-left {
	width: 48%; float: left;
}

/* HELP: Used for the right hand column on product lists if you've selected to show two columns in the template options */
.product-column-right {
	width: 48%; float: right;
}

/* HELP: Container used if you have selected to show two columns for products in the template options */
.product-double {
	width: 100%; clear: both; text-align: left;
}

.product-content { width:349px; }

/* HELP: Additional formatting for product titles shown on section/search pages */
.section-product-title, .section-product-title a {
	font-weight: bold;
	font-size: 1em;
	text-decoration: none;
	color:#10499e;
}

/* HELP: Gap between products if you have selected two columns for products in the template options */
.product-gap {
	width:2%; float: left;
}

/* HELP: Vertical separator been products on product listing pages, e.g. section pages */
.product-separator {
	clear: both; 
	border: 0px; 
	margin-bottom: 8px; 
	height: 5px;
	border-bottom: 1px dotted #bbbbbb; 
	background: #ffffff; 
	color: #ffffff;
}

/* HEADER: Other Product Styles */

/* HELP: Used to contain the product flags where ever they appear, e.g. section pages, product pages */
.product-flag-container { float: right; width: 66px; margin: 0 5px; }

/* HELP: Used to style each individual product flag when displayed<br/><br/> */

.new-product-flag { width:66px; height:66px; background: url(../images/sticker-new-product.png) no-repeat; border:0; margin-bottom: 3px; }
.special-product-flag { width:66px; height:66px; background: url(../images/sticker-special-product.png) no-repeat; border:0; margin-bottom: 3px; }
.top-product-flag { width:66px; height:66px; background: url(../images/sticker-top-product.png) no-repeat; border:0; margin-bottom: 3px; }


/* HELP: Styling for the product image shown on the product page.<br/><br/> */
.product-image {
	float: left; margin-right: 10px;
	margin-bottom: 10px;
}

/* HELP: Container for add to basket, add to wishlist and more info links */
.links-container {
	font-weight: bold;
	margin: 3px;
}

/* HELP: Style for product links, e.g. add to wishlist and more info links */
.product-link {
	font-size: 0.7em;
	font-weight: bold;
	border: 0px;
	color: #f08100;
	padding: 0px;
	margin: 0px;
	white-space: nowrap;
	cursor: pointer;
	text-decoration: underline;
}

/* HELP: Style for product links, e.g. add to wishlist and more info links when mouse hovers over it */
.product-link:hover {
	color: #003366;
	text-decoration: underline;
}

/* HELP: Style for product add to cart buttons in your store<br/><br/> */
.product-add {
	font-size: 0.7em;
	font-weight: bold;
	background-color: #1a5bb0;
	color: #ffffff;
	padding: 2px;
	border: 1px solid #000000;
	cursor: pointer;
	height: 2em;
}

/* HELP: Style for product add to cart buttons in your store, when mouse hovers over them */
.product-add:hover {
	background-color: #f08100;
}

/* HELP: Overall container for the product extra fields section of the product pages */
.product-extra-fields {
	float: left; margin-left: 5px; text-align: left;
}

/* HEADER: Product Option Tables */

/* HELP: Overall container for the product options section of the product pages */
.product-options-container {
	float: right; width: 100%;
}

/* HELP: Container for the table used to display attribute combinations, option stock levels and price combinations on product page template */
.product-table-div {
	text-align: center;
}

/* HELP: Table used to display attribute combinations, option stock levels and price combinations */
.product-table {
	margin: 10px auto;
	padding: 0px;
	width: 100%;
	border: 0px;
}

/* HELP: Caption shown about a product option table on the product page template */
.product-table caption {
	font-weight: bold;
	font-size: 0.70em;
	margin-left: auto;  margin-right: auto;
	text-align: right;
}

/* HELP: Header table cell for the product options table<br/><br/> */
.product-table th {
	font-weight: bold;
	font-size: 0.8em;
	background-color: #e4e6f3;
	padding: 4px;
	text-align: left;
	vertical-align: top;
}

/* HELP: Normal table cell for the product options table<br/><br/> */
.product-table td {
	font-weight: normal;
	font-size: 0.70em;
	background-color: #FFF;
	padding: 4px;
	text-align: left;
}

/* HEADER: Cart Table Styles */
/* HELP: Overall container the cart on your cart.html template<br/><br/> */
.cart-div {
	text-align: center;
}

/* HELP: Style for the cart table itself<br/><br/> */
.cart-table {
	margin-left: auto; margin-right: auto;
	padding: 0px;
	border: 0px;
	font-size: 0.70em;
}

/* HELP: Style for caption tag above the cart table<br/><br/> */
.cart-table caption {
	font-size: 0.70em;
	border-bottom: 1px dotted #000000;
	margin-left: auto;  margin-right: auto;
}

/* HELP: Style for table header cells<br/><br/> */
.cart-table th {
	font-weight: bold;
	border-bottom: 1px dotted #000000;
	padding: 2px;
	text-align: left;
	vertical-align: top;
}

/* HELP: Style for table header sells with right justification<br/><br/> */
.cart-table th.right {
	font-weight: bold;
	border-bottom: 1px dotted #000000;
	padding: 2px;
	text-align: right;
	vertical-align: top;
}

/* HELP: Style for table header totals<br/><br/> */
.cart-table th.total {
	font-weight: bold;
	border-top: 1px dotted #000000;
	text-align: right;
	vertical-align: top;
}

/* HELP: Style for normal table cells<br/><br/> */
.cart-table td {
	font-weight: normal;
	padding: 2px;
	text-align: left;
	vertical-align: top;
}

/* HELP: Style for normal table cells, with right justification<br/><br/> */
.cart-table td.right {
	font-weight: normal;
	padding: 2px;
	text-align: right;
	vertical-align: top;
}

/* HEADER: Send To Friend Styles */

/* HELP: Container for the send to a friend links shown in the store<br/><br/> */
.send-friend {
	font-weight: bold;
	font-size: 0.8em;
	margin-right: 5px;
	margin-top: 3px;
}

/* HELP: Style used for the send to friend link itself within the send-friend container */
.send-friend a {
	text-decoration: none; 
	color:#10499e;
}

/* HELP: Style used for the send to friend link, when the mouse hovers over it, within the send-friend container */
.send-friend a:hover { 
	color:#ed1c24; 
	text-decoration: underline; 
	cursor: pointer;
}

/* HEADER: Account Styles */

/* HELP: Used as a container for the account home page information for both customer accounts and affiliate accounts */
#account-summary {
	margin-left: auto; margin-right: auto; text-align: center; width: 420px;
}

/* HELP: Style for the left column of the account home page information */
#account-summary-left {
	float: left; width: 200px; text-align: left;
}

/* HELP: Style for the right column of the account home page information */
#account-summary-right {
	float: right; width: 200px; text-align: left;
}

/* HEADER: Form Entry Tables */

/* HELP: Container for form entry tables<br/><br/> */
.form-div {
	text-align: center;
}

/* HELP: Table definition for form entry tables<br/><br/> */
.form-table {
	margin-left: auto;  margin-right: auto;
	padding: 0px;
	border: 0px;
}

/* HELP: Caption styler shown above form entry tables<br/><br/> */
.form-table caption {
	font-size: 0.70em;
	border-bottom: 1px dotted #444;
	margin-left: auto;  margin-right: auto;
}

/* HELP: Header table cell<br/><br/> */
.form-table th {
	font-weight: bold;
	font-size: 0.8em;
	padding: 2px;
	text-align: left;
	vertical-align: top;
	padding-top: 3px;
}

/* HELP: Normal table cell<br/><br/> */
.form-table td {
	font-weight: normal;
	font-size: 0.8em;
	padding: 2px;
	text-align: left;
}

/* HELP: Style for the table row that contains the submit button for the form<br/><br/> */
.form-table td.submit-row {
	border-top: 1px dotted #444;
	text-align: right;
}

/* HELP: Select box (drop-down) formatting for the form<br/><br/> */
.form-table select {
	font-size: 1em; 
	font-weight: normal;
	background-color: #FFFFFF; 
	color: #000000;
	border: 1px solid #30799E;
}


/* HEADER: General Table Styles */
/* HELP: Container for general tables used throughout the store templates<br/><br/> */
.general-table-div {
	text-align: center;
}

/* HELP: Sryling for the table tag itself, overall styling for the table<br/><br/> */
.general-table {
	margin-left: auto;  margin-right: auto;
	padding: 0px;
	border: 0px;
}

/* HELP: Container for caption tag shown above general tables<br/><br/> */
.general-table caption {
	font-weight: bold;
	font-size: 0.70em;
	margin-left: auto;  margin-right: auto;
	text-align: right;
}

/* HELP: Style for table header cell<br/><br/> */
.general-table th {
	font-weight: bold;
	font-size: 0.70em;
	border-bottom: 1px dotted #000000;
	padding: 2px;
	text-align: left;
	vertical-align: top;
}

/* HELP: Style for normal table cell<br/><br/> */
.general-table td {
	font-weight: normal;
	font-size: 0.70em;
	padding: 2px;
	text-align: left;
}

/* HELP: Style for normal table cell with bold font styling<br/><br/> */
.general-table td.bold {
	font-weight: bold;
	font-size: 0.70em;
	padding: 2px;
	text-align: left;
}

/* HEADER: Advanced Styles */
html {
	font-size: 100%;
	margin: 0px;
	padding: 0px;
	overflow: -moz-scrollbars-vertical;
	overflow-x: hidden;

}

/* HELP: Simple style for forms to avoid any unplanned gaps */
form {
	margin: 0px;
	padding: 0px;
}

.clear-left {
	clear: left;
}

.clear-both {
	clear: both;
}

.float-right {
	float: right;
}

.float-left {
	float: left;
}

.center {
	text-align: center;
}

/* >> The Magnificent CLEARFIX: Updated to prevent margin-collapsing on child elements << j.mp/bestclearfix */
.clearfix:before, .clearfix:after {
  content: "\0020"; display: block; height: 0; visibility: hidden;	
} 

.clearfix:after { clear: both; }
/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix { zoom: 1; }

.margin-top { margin-top:10px; }
.margin-top-20 { margin-top:20px; }


/* for image replacement */

.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }

/* HOME image replacement */

.open-account { width:200px; height:34px; background: url(../images/btn-new-account.png) no-repeat; margin: 0 auto; } 

.forgot-password { width:200px; height:34px; background: url(../images/btn-forgot-password.png) no-repeat; margin: 0 auto; } 

.login { width:200px; height:34px; background: url(../images/btn-login.png) no-repeat; border:0; margin: 10px auto; }

/* RIGHT MENU image replacement */

.checkout { width:110px; height:24px; background: url(../images/btn-checkout.png) no-repeat; border:0; }
.checkout:hover { background: url(../images/btn-checkout-over.png) no-repeat; }

.view-basket { width:110px; height:24px; background: url(../images/btn-view-basket.png) no-repeat; border:0; }
.view-basket:hover { background: url(../images/btn-view-basket-over.png) no-repeat; }

.search-btn { width:110px; height:24px; background: url(../images/btn-search.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }
.search-btn:hover { background: url(../images/btn-search-over.png) no-repeat; }

.search-recent { width:110px; height:24px; background: url(../images/btn-search-recent.png) no-repeat; border:0; margin: 5px auto; }
.search-recent:hover { background: url(../images/btn-search-recent-over.png) no-repeat; }

.search-advanced { width:110px; height:24px; background: url(../images/btn-search-advanced.png) no-repeat; border:0; margin: 5px auto; }
.search-advanced:hover { background: url(../images/btn-search-advanced-over.png) no-repeat; }

input.join-now { width:110px; height:24px; background: url(../images/btn-join-now.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }
input.join-now:hover { background: url(../images/btn-join-now-over.png) no-repeat; }


/* CREATE NEW ACCOUNT image replacement */

.create-account { width:200px; height:34px; background: url(../images/btn-create-account.png) no-repeat; border:0; cursor:pointer; margin: 10px auto; }

/* SECTION image replacement */

.product-buttons-left { margin: 0; }
.product-buttons-right { margin: 0 40px 0 0; }

input.add-to-basket { width:110px; height:24px; background: url(../images/btn-add-to-basket.png) no-repeat; border:0; cursor:pointer; margin: 5px 0; float:left; }
input.add-to-basket:hover { background: url(../images/btn-add-to-basket-over.png) no-repeat; }

.more-info { width:110px; height:24px; background: url(../images/btn-more-info.png) no-repeat; border:0; cursor:pointer; margin: 5px 0 0 10px; float:left; }
.more-info:hover { background: url(../images/btn-more-info-over.png) no-repeat; }

/* PRODUCT image replacement */

input.add-to-basket-product { width:110px; height:24px; background: url(../images/btn-add-to-basket.png) no-repeat; border:0; cursor:pointer; margin: 5px 0; }
input.add-to-basket-product:hover { background: url(../images/btn-add-to-basket-over.png) no-repeat; }

.wish-list { width:110px; height:24px; background: url(../images/btn-wish-list.png) no-repeat; border:0; cursor:pointer; margin: 5px 0; }
.wish-list:hover { background: url(../images/btn-wish-list-over.png) no-repeat; }

.review { width:110px; height:24px; background: url(../images/btn-review.png) no-repeat; border:0; cursor:pointer; margin: 0; }
.review:hover { background: url(../images/btn-review-over.png) no-repeat; }

/* CONTACT image replacement */

input.send-email { width:110px; height:24px; background: url(../images/btn-send-email.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }
input.send-email:hover { background: url(../images/btn-send-email-over.png) no-repeat; }

/* RETRIEVE PASSWORD image replacement */

input.new-password { width:200px; height:34px; background: url(../images/btn-new-password.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

/* ACCOUNT image replacement */

.edit-account { width:110px; height:24px; background: url(../images/btn-edit-account.png) no-repeat; border:0; cursor:pointer; margin: 0 auto; margin-top:16px; }
.edit-account:hover { background: url(../images/btn-edit-account-over.png) no-repeat; }

.edit-address { width:110px; height:24px; background: url(../images/btn-edit-address.png) no-repeat; border:0; cursor:pointer; margin: 0 auto; margin-top:16px; }
.edit-address:hover { background: url(../images/btn-edit-address-over.png) no-repeat; }

.order-history { width:110px; height:24px; background: url(../images/btn-order-history.png) no-repeat; border:0; cursor:pointer; margin: 0 auto; margin-top:16px; }
.order-history:hover { background: url(../images/btn-order-history-over.png) no-repeat; }

.wish-list-red { width:110px; height:24px; background: url(../images/btn-wish-list-red.png) no-repeat; border:0; cursor:pointer; margin: 0 auto; margin-top:16px; }
.wish-list-red:hover { background: url(../images/btn-wish-list-red-over.png) no-repeat; }

.log-out { width:110px; height:24px; background: url(../images/btn-log-out.png) no-repeat; border:0; cursor:pointer; margin: 0 auto; margin-top:16px; }
.log-out:hover { background: url(../images/btn-log-out-over.png) no-repeat; }

input.update-account { width:200px; height:34px; background: url(../images/btn-update-account.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

.new-delivery-address { width:200px; height:34px; background: url(../images/btn-new-delivery-address.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

input.save-address { width:200px; height:34px; background: url(../images/btn-save-address.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

input.update-wish-list { width:200px; height:34px; background: url(../images/btn-update-wish-list.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

.clear-wish-list { width:200px; height:34px; background: url(../images/btn-clear-wish-list.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

input.form-input-center { margin:20px 0 0 80px; }

/* REVIEWS image replacement */

input.submit-review { width:200px; height:34px; background: url(../images/btn-submit-review.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

/* EMAIL PAGE TO A FRIEND image replacement */

input.send-page { width:110px; height:24px; background: url(../images/btn-send-page.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }
input.send-page:hover { background: url(../images/btn-send-page-over.png) no-repeat; }

.close-window { width:110px; height:24px; background: url(../images/btn-close-window.png) no-repeat; border:0; cursor:pointer; margin: 0 auto; }
.close-window:hover { background: url(../images/btn-close-window-over.png) no-repeat; }

/* GIFT CERT image replacement */

input.gift-cert { width:200px; height:34px; background: url(../images/btn-gift-cert.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

/* CHECKOUT ETC image replacement */

input.use-new-address { width:200px; height:34px; background: url(../images/btn-use-new-address.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

.select-address { width:110px; height:24px; background: url(../images/btn-select-address.png) no-repeat; border:0; cursor:pointer; margin: 5px 0; }
.select-address:hover { background: url(../images/btn-select-address-over.png) no-repeat; }

input.change-country { width:110px; height:24px; background: url(../images/btn-change-country.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }
input.change-country:hover { background: url(../images/btn-change-country-over.png) no-repeat; }

input.change-shipping { width:110px; height:24px; background: url(../images/btn-change-shipping.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }
input.change-shipping:hover { background: url(../images/btn-change-shipping-over.png) no-repeat; }

input.apply-code { width:110px; height:24px; background: url(../images/btn-apply-code.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }
input.apply-code:hover { background: url(../images/btn-apply-code-over.png) no-repeat; }

.update-basket { width:110px; height:24px; background: url(../images/btn-update-basket.png) no-repeat; border:0; cursor:pointer; margin:10px 0 0 60px; float:left; }
.update-basket:hover { background: url(../images/btn-update-basket-over.png) no-repeat; }

.empty-basket { width:110px; height:24px; background: url(../images/btn-empty-basket.png) no-repeat; border:0; cursor:pointer; margin:10px; float:left; }
.empty-basket:hover { background: url(../images/btn-empty-basket-over.png) no-repeat; }

.checkout-basket { width:110px; height:24px; background: url(../images/btn-checkout.png) no-repeat; border:0; margin:10px; float:left; }
.checkout-basket:hover { background: url(../images/btn-checkout-over.png) no-repeat; }

input.change-shipping-step2 { width:110px; height:24px; background: url(../images/btn-change-shipping.png) no-repeat; border:0; cursor:pointer; float:right; margin: 5px 0 5px 10px; }
input.change-shipping-step2:hover { background: url(../images/btn-change-shipping-over.png) no-repeat; }

input.continue { width:200px; height:34px; background: url(../images/btn-continue.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }

input.submit-order { width:200px; height:34px; background: url(../images/btn-submit-order.png) no-repeat; border:0; cursor:pointer; margin: 5px auto; }


/* SEARCH RESULTS image replacement */

.goto-section { width:110px; height:24px; background: url(../images/btn-goto-section.png) no-repeat; border:0; cursor:pointer; margin: 5px 0 10px 0; float:left; }
.goto-section:hover { background: url(../images/btn-goto-section-over.png) no-repeat; }