/* CSS Reset Stylesheet */
/* Flaming Bucket Technologies, flamingbucket.com     */
/* Based on http://meyerweb.com/eric/tools/css/reset/ */
/*----------------------------------------------------*/
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,
b, u, i, center,
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-size: 100%;
	vertical-align: baseline;
	background: transparent;

}

body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }

/* Remember to define focus style */
:focus { outline: 0; }

/* Remember to highlight inserts */
ins { text-decoration: none; }
del { text-decoration: line-through; }

/* Tables need cellspacing='0' in the markup */
table { border-collapse: collapse; border-spacing: 0; }

/* Generic Content Style
----------------------------------------------------------------------------------------------*/
/*
	TO DO
	+ More specific tagging, avoids conflicts.
		- Start generic, cascade down to specific styles.

*/
body { font: 11px Verdana, Arial, Helvetica, sans-serif; color: #404040; background: white url(Image/background.png) repeat-x; }

/* Headings */
h1 { margin-top: 32px; width: 100%; height: 142px; background: url(Image/header.png) top center no-repeat; }
h2 { font: 24px Arial, Helvetica, sans-serif; }
h3 {
	font: 14px Arial, Helvetica, sans-serif;
	background: url(Image/h3.png) repeat-x; color: #999;
/*	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px; */
	padding: 6px 0; padding-left: 10px;
	border: 1px solid #ccc;

}

/* Input */
input { background: #fafafa; border: 1px solid #000; padding: 2px; }
select { background: #fafafa; border: 1px solid #000; padding: 2px; }
textarea { background: #fafafa; border: 1px solid #000; padding: 2px; }

/* Tables */
table { margin: 5px 0; border: 1px solid #ededed; width: 100%;}
tr { height: 40px;}
th { background: #fafafa; color: #666; text-align: left; }
td { vertical-align: top; }

/* Anchor elements / links! */
a { text-decoration: none; }
a:link { color: #999; }
a:visited { color: #999; }
a:hover { color: #333; text-decoration: underline; }
a:focus { }
a:active { color: #999; }

/* Definition lists */
dl { margin-bottom: 10px; }
dt { font-weight: bold; }
dd { margin-bottom: 10px; }

/* Unordered lists */
ul { }
ul li { background: url(Image/primaryBullet.png) no-repeat 0 3px; padding-left: 18px; line-height: 20px; }
ul.frontLinkBox { list-style: none; }

/* Alignment */
.centreAlign { text-align: center; }
.justifyAlign { text-align: justify; }
.leftAlign { text-align: left; }
.rightAlign { text-align: right; }

/* Paragraphs, general formatting */
p { padding: 5px 0; }
.bold { color: #666; font-weight: bold; }
.italic { font-style: italic; }

/* Specific client front page content
----------------------------------------------------------------------------------------------*/
#bigAdBox { width: 280px; height: 200px; float: left; overflow: hidden; }
#imageScroller { width: 280px; height: 200px; }
.productReel { margin: 10px auto; width: 560px; overflow: hidden; }
.productReel .productBox {
	width: 172px; float: left; text-align: center;
	border: 1px solid #999; overflow: hidden;

}
.productReel .productBox .productImage { background: white; width: 172px; overflow: hidden; }
.productReel .productBox a { }
.productReel .productBox img:hover { opacity: 0.6; }
.productReel .productBox .productText { margin-top: 10px; padding: 5px 0; border-top: 1px solid #999; background: url(Image/h3.png) no-repeat; color: #444; }

/* frontBoxes */
#frontBoxes { margin: 0 auto; width: 935px; height: 480px; }
.frontBox { margin-left: 18px; background: pink; width: 286px; height: 480px; float: left; position: relative; }
.frontBox img { margin-bottom: 100px; }
.frontBox ul.frontLinkBox { margin-left: 20px; margin-bottom: 20px; font: 18px "Myriad Roman", "Myriad Pro", Arial, Helvetica, sans-serif; }
.frontBox ul.frontLinkBox li { background: url(Image/blackArrowBullet.gif) no-repeat 0 8px; padding-left: 20px; }
.frontBox ul.frontLinkBox li a { text-decoration: none; }
#leftFrontBox { background: url(Image/leftFrontBackground.png); }
#leftFrontBox ul.frontLinkBox li { background: url(Image/redArrowBullet.gif) no-repeat 0 7px; }
#leftFrontBox ul.frontLinkBox li:hover { background: url(Image/blackArrowBullet.gif) no-repeat 0 7px; }
#leftFrontBox a { color: #cc0000; }
#leftFrontBox a:hover { color: #333; }
#middleFrontBox { background: url(Image/middleFrontBackground.png); }
#middleFrontBox ul.frontLinkBox li { background: url(Image/orangeArrowBullet.gif) no-repeat 0 8px; }
#middleFrontBox ul.frontLinkBox li:hover { background: url(Image/blackArrowBullet.gif) no-repeat 0 8px; }
#middleFrontBox a { color: #f47921; }
#middleFrontBox a:hover { color: #333; }
#rightFrontBox { background: url(Image/rightFrontBackground.png); }
#rightFrontBox ul.frontLinkBox li { background: url(Image/blueArrowBullet.gif) no-repeat 0 8px; }
#rightFrontBox ul.frontLinkBox li:hover { background: url(Image/blackArrowBullet.gif) no-repeat 0 8px; }
#rightFrontBox a { color: #017ac0; }
#rightFrontBox a:hover { color: #333; }

/* Large QOP Divisions
----------------------------------------------------------------------------------------------*/
#wrapper { margin: 0 auto; width: 960px; position: relative; }
#inner-wrapper { margin-top: 20px; padding: 0; }

/* header */
#header { }
#header h1 a { width: 900px; height: 142px; display: block; opacity: 0; color: #fefeff; }
p.logged-in-as { text-align: right; display: block; position: absolute; top: 0; right: 0px; display: none; }

/* header -> top-links */
#top-links { float: right; color: white; width: 195px; height: 32px; position: relative; bottom: 174px; right: 16px; background: url(Image/tabLinksBlack.png); }
#top-links ul { list-style: none; }
#top-links li { margin-top: 8px; float: left; text-align: center; width: 95px; background: none; padding: 0; line-height: normal; }
#top-links a { color: white; text-decoration: none; }
#top-links a:hover { color: #680000; }

/* header -> top-links */
#tab-links { float: left; color: white; width: 195px; height: 32px; position: absolute; top: -32px; left: 555px; background: url(Image/tabLinksBlack.png); }
#tab-links ul { list-style: none; }
#tab-links li { margin-top: 8px; float: left; text-align: center; width: 95px; background: none; padding: 0; line-height: normal; }
#tab-links a { color: white; text-decoration: none; }
#tab-links a:hover { color: #777; }

/* header -> top-search */
#top-search { display: none; }

/* primary -> main content area */
#primary { width: 960px; overflow: hidden; }
#primary ul { margin-left: 20px; }
#primary p { padding: 0 20px; padding-bottom: 10px;}
#primaryLeft { float: left; width: 570px; }
#primaryRight { float: right; width: 180px; }
#primary fieldset {display:block;}
#primary fieldset li { display:block;}
#primary fieldset legend { padding-top: 10px; padding-bottom: 10px;}
#primary fieldset li.text { height: 30px;}
#primary fieldset li.select { height: 30px;}
#primary fieldset span.input-info { position:absolute; margin-left: 250px; margin-top: 4px;}
#primary fieldset label { display:block; width: 60px;}
#primary fieldset input { position:relative; display:block; margin-left: 150px; margin-bottom: 10px;}
#primary fieldset select { position:relative; display:block; margin-left: 150px; margin-top: -10px;}

/* primaryRight -- vertical menu on the right */
#primaryRight ul { margin-bottom: 10px; padding-bottom: 20px; background: #fafafa; }
#primaryRight li { color: black; }
#primaryRight li a { padding-top: 7px; padding-left: 18px; width: 150px; display: block; }
#primaryRight li a:hover { text-decoration: none; }

/* secondary */
#secondary { width: 170px; float: left; } /* Extra side menus */
#login { display: none; }
#mini-basket { display: none; }
#mini-enquiry-basket { display: none; }

/* tertiary -- vertical menu on the left */
#tertiary { display: none; }

/* footer */
#footer { width: 100%; margin-top: 100px; height: 87px; background: black url(Image/footerBackground.png) repeat-x; position: absolute; left: 0; color: #eee; }
#footer .content { height: 67px; background: url(Image/footerCurve.png) right no-repeat; }
#footer ul { }
#footer li { display: inline; margin: 0 12px; }
#footer #meta { margin-top: 20px; text-align: center; }
#footer #back-to-top { display: none; } /* Link back to the top of the page */

/* footer -> bottom links */
#footer #bottom-links { padding: 0 20px;width: 100%; height: 40px; }
#footer #bottom-links a { text-decoration: none; }
#footer #bottom-links a:link { color: white; }
#footer #bottom-links a:visited { color: white; }
#footer #bottom-links a:active { color: white; }
#footer #bottom-links a:hover { text-decoration: underline; }

/* LOGIN PAGE
----------------------------------------------------------------------------------------------*/
.text label { padding-top: 5px; display: block; width: 100px; float: left; }
.text input { margin-bottom: 10px; }
.submit input { cursor: pointer; }