/*----------------------------------------------*/

/*
red #e80000
dark red #800000
lilac #817fb4


*/
/*     General site wide
----------------------------------------------*/
body {
	font-size:12px; 
	font-family:Arial, Helvetica, sans-serif; 
	color:#000; 
	margin:0px auto; 
	padding:0px;
	text-align:center;
}
h1 {
	font-size:1.6em;
	color:#000000;
	margin-top:0.5em;
	line-height:1.7em
}

h2 {	
	font-size:1.2em;
	color:#800000;
	margin-bottom:-0.5em;
}

h3 {
	color:#000000;
	font-size:1.2em;
	margin-top:0;
	margin-bottom:0;
}	

a {
	text-decoration:none;
	font-weight:bold;
	color:#800000
} 
a:hover {
	text-decoration:underline !important;
}
a:focus {
	text-decoration:underline !important;
}

img {
	border:none;
	background:none;
}

#access-keys, h1.website {
	position: absolute; 
	width: 250px; 
	left: -3000px; 
	float: left;
}
a em {
	font-style: normal;
	font-weight: normal;
	text-decoration: underline;
   }
/*
S - Skip navigation
1 - Home page
2 - What's new
3 - Site map
4 - Search
5 - Frequently Asked Questions (FAQ)
6 - Help
7 - Complaints procedure
8 - Terms and conditions
9 - Feedback form
0 - Access key details
*/

.cleaner {
	overflow:hidden;
	clear:both;
	height:1px;
	margin-top:-1px
}
.error, .mand {
	color:#e80000;
}

.smaller {
	font-size:smaller;
}
.larger {
	font-size:larger;
}
.center {
	text-align:center;
}

.underline {
	text-decoration:underline;
}

.icon {
	line-height:2em;
	font-weight:bold
}
.icon img{
	margin-bottom:-1.7em;
}
hr {
	height: 3px;
	color:#000000;
	background-color:#000000
}
.right {
	float:right;
}

/*----------------------------------------------*/

/*     Layout for all site 
----------------------------------------------*/

#wrapper {
	width: 70em;	
	margin:0 auto 0 auto;
	padding:0;
	text-align:left;
}

#basket {
	font-size:0.9em;
	float:right;
	margin-top:-8em;	
	text-align:right;
	background:url(../images/icon-basket.jpg) no-repeat;
	padding-left:4.5em;
	padding-top:1em;
	line-height:3em
}
#basket a{	
	color:#000000;
}

/*    primary *navigation
----------------------------------------------*/
.nav {
	padding:0; 
	margin:0 0 0.3em 0; 
	list-style:none; 
	height:3.1em; 
	background:#000000; 
	position:relative; 
	z-index:500;
}
.nav li.top {
	display:block; 
	float:left;
}
.nav li a.top_link {
	display:block; 
	float:left; 
	height:3.1em; 
	line-height:3.1em; 
	color:#ffffff; 
	text-decoration:none; 
	font-size:1em; 
	padding:0 0.1em 0 0.1em; 
	cursor:pointer; 
	background:#000000;
}
.nav li a.top_link span {
	float:left; 
	display:block; 
	padding:0 1em 0 1em; 
	height:3.1em;
}
.nav li a.top_link:hover {
	color:#ffffff; 
	background: #333333; 
	line-height:3.1em;
}

.nav li a.top_link:hover span {
	background:#333333;
}
/* HACK ie 7 & firefox */
.nav li:hover > a.top_link {
	color:#ffffff; 
	background: #333333; 
	line-height:3.1em;
}
.nav li:hover > a.top_link span {
	background: #333333;
}
.nav table {
	border-collapse:collapse; 
	width:0; 
	height:0; 
	position:absolute; 
	top:0; 
	left:0;
}
.nav a:hover {
	visibility:visible; 
	position:relative; 
	z-index:200;
}
.nav li:hover {
	position:relative; 
	z-index:200;
}

/*  'next' level invisible by placing it off screen. */
.nav ul {
	position:absolute; 
	left:-9999px; 
	top:-9999px; 
	width:0; 
	height:0; 
	margin:0; 
	padding:0; 
	list-style:none;
}
.nav ul.sub1 {width:16em;}
.nav ul.sub2 {width:16em;}
.nav ul.sub3 {width:18em;}
.nav ul.sub4 {width:18.7em;}

.nav :hover ul {
	left:0; 
	top:3.1em; 
	background: #cccccc; 
	padding:0.3em; 
	border-left:1px solid #ff0000; 
	white-space:nowrap; 
	height:auto; 
	z-index:300; 
}
.nav :hover ul li {
	display:block; 
	height:2em; 
	position:relative; 
	font-weight:normal; 
	width:auto;
}
.nav :hover ul li a {
	display:block; 
	font-size:0.9em; 
	height:2em; 
	line-height:2em; 
	width:auto; 
	padding:0 0.5em; 
	color:#333333; 
	text-decoration:none;
}
/* HACK ie 5 & 6  */
* html .nav :hover ul li a {
	font-size:0.8em;
}
.nav :hover ul li a:hover {
	background:#333333; 
	color:#ffffff;
}


/*   *search bar
----------------------------------------------*/
div#search {
	position:absolute; 
	float: right; 
	margin:0.5em 0 0 0;
	font-size:1em; 
	color:#333333; 
	font-weight:bold; 
	padding:0px; 
	right:4.5em; 
}
div#search input {
	font-size:1em; 
	padding:0.1em;
}
div#search input.button {
	position:absolute; 
	margin-top:-2px;
}

/*     *basket pages
----------------------------------------------*/
table.main-basket {
	width:100%;
	margin-bottom:4em; 
	color:#333333; 
	font-size:1em;
	/*border:1px solid #cccccc*/
}
table.main-basket th {
	background:#cccccc;
	font-size:1em;
	padding:0.2em 0.2em 0.2em 0.4em; 
	margin:0;
}

table.main-basket td {
	font-size:1em;
	padding:0.3em 0 0.3em 0.5em; 
	margin:0;
	border-bottom:1px dotted #cccccc;
}
table.main-basket th.quantity {	
	padding-left:1em;
}
table.main-basket td.quantity input {
	width:2.5em;
}
table.main-basket th.item, table.main-basket td.item { 
	width:30em;
}

table.main-basket td.buttons {
	text-align:left; 
	border:none;
	padding-top:0.5em;
	padding-bottom:0;
}
table.main-basket th.totals, table.main-basket th.total {
	text-align:right; 
	padding-right:1em; 
	border-bottom:none; 
	background:none;
	padding:0.5em 1em 0.5em 0;
}
table.main-basket th.total {
	font-weight:normal;
}
table.main-basket td.totals {
	text-align:right;
	padding-right:0.5em
}
table.main-basket th.finaltotal {
	text-align:right;
	padding-right:1em; 
	font-size:1.2em;
}
table.main-basket td.finaltotal {
	font-weight:bold; 
	font-size:1.2em; 
	background:#cccccc;
	border:none;
	text-align:right;
	padding-right:0.5em
}

table.main-basket th.linetotal, table.main-basket td.linetotal, table.main-basket .vatColumn {
	text-align:right; 
	padding-right:0.5em;
}
.vat {
	font-weight:normal;
	font-size:0.8em;
}
.world {
	margin-left:7em;
}
.paymentlogos img {	
	padding:0.5em;
}



/*    *account login
----------------------------------------------*/
#account-login { 
	background:url(../images/background-login.jpg) repeat-x; 
	padding: 0 0 1.1em 0.5em; 
	font-size:1em; 
	color:#ffffff; 
	margin-bottom:0.5em;
}
#account-login h3{ 
	color:#ffffff; 
	font-size:1em; 
	margin:0 0 1em 0;
	padding-top:0.3em; 
}
	
#account-login input.top{
	margin-bottom:0.7em;
	} 
#account-login label {
	font-size:0.9em;
	color:#ffffff
}	
#account-login .button  {
	float:right;
	margin-top:0.4em;
}

/*    *side navigation menu
----------------------------------------------*/
.side-nav {
	padding:0px; 
	width:17em; 
	position:relative; 
	float:left;
	margin-right:0.8em
}
.side-nav h2, .recent-viewed h3  {
	font-size:1em; 
	color:#ffffff; 
	height:2.5em; 
	line-height:2.5em;
	margin:0 0 0.5em 0;
	text-align:center;
	background:url(../images/background-categories.jpg) repeat-x;
}
.side-nav ul {
	list-style-image:none; 
	list-style:none;
	padding:0 0 1em 0; 
	margin:0px;
}
.side-nav li {
	color:#ff0000;
	text-decoration:none;
	font-size:1em; 
	padding-left:-1em;
	margin: 1em 0 0 0;
	line-height:2em;
}
.side-nav li a{color:#ff0000;}

.side-nav li img{
	float:left;
	margin-right:2px;
}

li.sub-menu {
	margin:0 0 -0.2em 4.5em;
	padding:0em;
}
li.sub-menu a{
	color:#333333;
	font-weight:normal;
	font-size:0.9em
}

/*    *recently viewed
----------------------------------------------*/

.recent-viewed a {
	padding-left:1em; 
	font-size:0.9em; 
	color:#333333;
}
.recent-viewed  {	
	text-align:center;
	font-size:1em;
}
.recent-viewed .text {	
	margin: 0 0.5em 0 0.5em;
	text-align:center;
	color:#333333;
	min-height:2.5em; height:auto !important; height:2.5em;	
	font-size:0.9em;
}
#left-hand-content .recent-viewed a {	
	font-size:0.9em; 
	color:#dd3d14;	
}
#left-hand-content .recent-viewed .text a{	
	color:#333333;	
	font-weight:normal;
}
.recent-viewed img {
	margin:0.5em 0 0 0;
}
/*    *main content (right column)
----------------------------------------------*/
div#maincontent { 
	position:relative;
	float:left;
	width:52.2em;
	padding:0px;
	/*border:1px solid #333333;*/
	margin:0;
}

#breadcrumb {
	font-size:0.8em;
	margin-bottom:5px; 
	color:#333333; 
	font-weight:bold;
	border-bottom:1px dotted #cccccc;
}
#breadcrumb a {
	color:#666666;
}

/*     *footer  
----------------------------------------------*/
#footer { 
	background:#000000; 
	height:3em; 
	color:#ffffff;
	font-size:0.9em;
	position:relative;
	float:left;
	width:100%;
	line-height:1.5em;
	margin-bottom:1em;
	margin-top:1em
}
#footer ul{
	list-style: none; 
	float:left;
	margin:0 0 0 0.5em;
	padding:0
}
#footer li {
	display:block; 
	float:left; 
	padding:0.8em 0.4em;
}
#footer a {
	color:#ffffff;
	font-weight:normal
}
.copyright{
	text-align:right;
	margin-top:5px;
	color:#333333;
	font-size:0.9em
}
.copyright a{
	font-size:0.8em;
	color:#333333;
}
.telephone {
	float:right !important;
}

/*----------------------------------------------*/

/*     page specific 
----------------------------------------------*/

/*     *homepage 
----------------------------------------------*/
.special-offers {
	margin-top:0.5em;
}
.special-offers img.middle{
	margin:0 0.4em 0 0.4em;
}
.product-sections {
	margin-top:1em;
}
.product-sections a{
	color:#000000;
}
.product-sections{
	float:left;
}

.productSection1, .productSection2, .productSection3, .productSection4, .productSection5, .productSection6, .productSection7, .productSection8, .productSection9, .productSection10, .productSection0{
	color:#ffff00;
	font-size:0.8em;
	text-align:center;
	margin:0 1.2em 0.5em 1em;
	padding-top:0.1em;
	width:14em;
	float:left;
}
.product-sections h3, .BestSellercontainer h3 {
	height:2.4em;
	padding-top:0.6em;
	line-height:1.1em
}
.BestSellercontainer h3 {
	height:1.5em;
	color:#ffffff;
}
.product-sections img, .BestSellercontainer img {
	padding:0.6em;
}

.product-sections h3 a, .BestSellercontainer h3 a{
	color:#ffffff;
	display:block;
	width:8em;
	margin:0 auto 0 auto
}



/***************      *colours      ******************/	
/**************************************************************************/
/* 	2	Casual clothing			#68918e dark green
	6	Eye protection			#e38d72 brown
	1	Fall Arrest				#ce86b7 purple
	0	First Aid				#e38d72 brown
	5	Hand Protection			#6cbfdf dark blue
	10	Head Protection			#fd7d96 pink
	8	Hearing Protection		#ff9471 orange
	3	Outdoor Clothing		#78aec9 light blue
	9	Protective Workwear		#bfdf6d green
	7	Respiratory Protection	#ffab19 yellow
	4	Safety Boots & Shoes	#6cbfdf dark blue
*/
.productSection1 .imageBorder { border:1px solid #ce86b7;} 
.productSection2 .imageBorder { border:1px solid #64bc9f;}
.productSection3 .imageBorder { border:1px solid #78aec9;} 
.productSection4 .imageBorder { border:1px solid #6a6ba4;} 
.productSection5 .imageBorder { border:1px solid #6cbfdf;} 
.productSection6 .imageBorder { border:1px solid #e38d72;} 
.productSection7 .imageBorder { border:1px solid #fac02c;}
.productSection8 .imageBorder {border:1px solid #ff9471;}
.productSection9 .imageBorder { border:1px solid #bfdf6d;} 
.productSection10 .imageBorder { border:1px solid #fd7d96;} 
.productSection0 .imageBorder { border:1px solid #e38d72;}

.productSection1 h3 { background:url(../images/section-fallarrest.jpg) no-repeat;}
.productSection2 h3 { background:url(../images/section-casual.jpg) no-repeat;}
.productSection3 h3 { background:url(../images/section-outdoor.jpg) no-repeat;}
.productSection4 h3{ background:url(../images/section-foot.jpg) no-repeat;}
.productSection5 h3 { background:url(../images/section-hand-protection.jpg) no-repeat;}
.productSection6 h3 { background:url(../images/section-eye.jpg) no-repeat;}
.productSection7 h3{ background:url(../images/section-respiratory.jpg) no-repeat;}
.productSection8 h3 { background:url(../images/section-hearing.jpg) no-repeat;}
.productSection9 h3 { background:url(../images/section-workwear.jpg) no-repeat;}
.productSection10 h3 { background:url(../images/section-head.jpg) no-repeat;}
.productSection0 h3 { background:url(../images/section-eye.jpg) no-repeat;}


/*     *plain pages
----------------------------------------------*/
h1 {
	color:#ffffff;
	background:url(../images/background-brand-h2.gif) repeat-x;
	padding:1em 0 0.2em 0.3em;
	margin-top:0.2em;
}

form {
	margin:0;
	color:#666666;
	
}
legend {
	color:#000000;
	font-weight:bold;
	background:#fff;
	padding:0.5em
}
fieldset {
	border:1px dashed #e80000;
	margin-bottom:1em;
	padding:1em;
}

/*     *contact page
----------------------------------------------*/
.contact-form form, .register-form {
	margin:0;
	color:#666666;
	width:42em;
	margin-left:5em;	
}
.contact-form legend {
	display:none
}

.contact-form label/*, .email-form label*/{ 
	float: left; 
	width: 10.5em; 
	padding: 0; 
	margin: 0.7em 0.5em 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right;
}
.contact-form input.main, .contact-form select/*, .email-form input.main*/{
	margin:0.3em 0.2em 0 0;
	padding:0.1em;
	font-size:1.1em;
	border:1px solid #00;
	color:#666666;
}
.contact-form textarea {	
 	color:#666666;	
	margin:0.3em 0 0 0;
}
.contact-form input.main {
	height:1.3em;
}
.contact-form .button {
	margin-left:11em;
	margin-top:0.5em;
}

/*     *login page 
----------------------------------------------*/

.login-form fieldset {
	margin:0 0.5em 0 0.5em;	
	width:22.8em;
	float:left;
	min-height:13.8em; height:auto !important; height:13.8em;	
}



/* hack for ie 6 only */

* html .login-form fieldset{
	margin:0 0.3em 0 0.3em;	
}


input.login, select.login {
	margin:0.3em 0.2em 0 0;
	padding:0.1em;
	height:1.3em;
	font-size:1.1em;
	line-height:1.4em;
	color:#666666;
}

.login-form label{ 
	float: left; 
	width: 6em; 
	padding: 0; 
	margin: 0.7em 0.5em 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right;
}

.login-form .button {
	margin-left:6.5em;
	margin-top:0.5em;
}


/*     *logout page 
----------------------------------------------*/

.main-form label{ 
	float: left; 
	width: 10em; 
	padding: 0; 
	margin: 0.7em 0.5em 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right;
}
.main-form input.main, .main-form select.main {
	margin:0.3em 0.2em 0 0;
	padding:0.1em;
	font-size:1.1em;
	line-height:1.4em;
	color:#666666;
}
.main-form .button {
	margin-left:10.5em;
	margin-top:0.5em;
}
/*     *brochure page
----------------------------------------------*/

.brochureList {
	padding-bottom:2em;	
}
.brochureList h2 {
	font-size:1em;
	text-decoration:underline;
	margin-bottom:0.5em
}
.brochureList ul {
	list-style:none;
}

.brochureList ul li {
	width:12em;
	float:left;
	text-align:center;
	margin:0 2em 0 1em
}

/*     *register page 
----------------------------------------------*/
.register-form {
	width:46em;
	margin-left:2em;
}
.register-form label{ 
	float: left; 
	display:block;
	clear:left;
	width: 14em; 
	padding: 0; 
	margin: 0.7em 0.5em 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right;
}

.register-form input{float:left; margin:0.1em 0.5em 0 0; display:inline;}
.register-form input.reg, .register-form select{
	margin:0.3em 0.2em 0 0;
	padding:0.1em;
	font-size:1.1em;
	line-height:1.4em;
	color:#666666;
}
.register-form input.reg, .main-form input.main {	
	height:1.3em;
}
.register-form .button {
	margin-left:14em;
	margin-top:0.5em;
}

.vat {
	font-weight:normal;
	font-size:0.8em;
}
.world {
	margin-left:7em;
}
.paymentlogos img {	
	padding:0.5em;
}
.details {
	clear:both;
}
.field, .info {
	float:left;
	margin:0 1em 0 0;
	text-align:right;
	padding:0;
	line-height:1.6em
}

.field {
	width:14em;	
	font-weight:bold;
	position:relative;
	clear:left;
}
#maincontent h3 {
	color:#333333;
	font-size:1.2em;
	margin-top:0;
	margin-bottom:1em;
	border-bottom:1px dashed #800000
}




