/* NOTES: */


body {
margin: 0px;
padding: 0px;
font: 12px Arial, Helvetica, sans-serif;
line-height: 16px;
color:#fff;
background: #B3B3B3 url(../images/bgFade.gif) 0 0 repeat-x;
text-align:center;
}

.clear-both { clear:both; }
p { font-size:12px; font-family: Arial, Helvetica, sans-serif; color:#ffffff; line-height: 16px; margin: 8px 0 8px 0; }
a {  color:#CCCCCC;  text-decoration:none; }
a:hover {  color:#CCCCCC; text-decoration:underline;  }

/*____________________________________ MAIN CONTAINER ____________________________________*/

#mainContainer { background-color:#000000;  width: 800px; padding: 0 95px 0 95px; background:url(../images/bgMain.gif) 0 0 repeat-y; margin-left: auto; margin-right: auto; margin-top:0; text-align: left;  }
#top { height: 315px; width: 800px; padding: 0 95px; margin-left: auto; margin-right: auto; margin-top: 0; background:url(../images/bgTop.gif) 0 0 no-repeat;}

/*____________________________________ HEADER ____________________________________*/

#header { height: 64px; width: 800px; position:relative;}
#right_container{ width: 400px; height: 102px; float:right; padding: 0; margin: 0;}
a#headerLogoLeft { display:block; height:57px; width:171px; margin: 0 0 0 10px; padding: 0 0 0 0; float:left; text-align:left; background:url(../images/logo.gif) 0 0 no-repeat; }

#terms { font-size:10px; display:block;   margin: 18px 10px 0 0; padding: 0 0 0 0; float:right; text-align:left; }
#terms a { color:#fff; text-decoration:none; }
#terms a:hover { color:#CCCCCC; text-decoration:none; }
/*____________________________________ BANNER ____________________________________*/

#banner_left { width: 535px; height: 250px; padding: 0; margin:0; float:left; }
#banner_right { width: 265px; height: 250px; padding: 0; margin:0; float:right; background: url(../images/banners/banner_right.jpg) 0 0 no-repeat;}
#banner_rightVisa { width: 265px; height: 250px; padding: 0; margin:0; float:right; background: url(../images/banners/banner_rightLogos.gif) 0 0 no-repeat;}

.marginTop { margin: 25px 0 0 0; }

/*____________________________________ NAV ____________________________________*/

#subnav { position:relative; width:800px; text-align:center; margin: 0 0 18px; 0; padding: 0 0 0 0; height:30px; background: #FFF url(../images/bgBelowSubNav.gif) repeat-x;}
#subnav ul { margin: 0; padding: 0; list-style: none;}	
#subnav li { display:inline; }
#subnav li a {text-transform:uppercase; font-size: 10px; padding: 0 14px 0 14px; border-right: 1px solid #000; line-height: 30px; color:#333333; font-weight: normal; text-decoration:none;}
#subnav li a:hover, #subnav li .active_link { text-decoration: none; color:#308a0E; }
#subnav li.last a { padding-right: 0; border-right: none; }

/*_________________*/

#nav {height:38px; width:800px; text-align:center; margin: 0 0 0 0; padding: 0 0 0 0; background: #000 url(../images/bgNav.gif) repeat-x; text-align:center;}
#nav ul { margin: 0; padding: 0; list-style: none;}	
#nav li { display:inline; }
#nav li a { text-transform:uppercase; font-size: 12px; padding: 0 14px 0 14px; border-right: 1px solid #fff; line-height: 38px; color:#FFFFFF; font-weight: normal; text-decoration: none; }
#nav li a:hover, #nav li .active_link { text-decoration: none; color:FF0000; }
#nav li.last a { padding-right: 0; border-right: none; }

#left .active_link { text-decoration: underline; color:#FF0000; }
/*____________________________________ BELOW NAV ____________________________________*/

#below_nav { width: 800px; height: 38px; margin: 0 0 18px 0; background: #FFF url(../images/bgBelowNav.gif) repeat-x; text-align:center;}
#below_navNoTop { width: 800px; height: 38px; margin: 0 0 0 0; background: #FFF url(../images/bgBelowNav.gif) repeat-x; text-align:center;}


/*____________________________________ LISTINGS PAGE ____________________________________*/


div.listings {  padding:0; margin: 20px 25px 0 25px; background: #3F3F3F url(../images/listings_top.gif) 0 0 no-repeat;}
div.listings_bot { height: 19px; padding:0; margin: 0 0 0 0; background: #3F3F3F url(../images/listings_bot.gif) 0 0 no-repeat;}
#listings .pbox { margin: 0px 0px 0 0px; padding: 0; }
div.listingstitle { margin: 18px 0px 10px 12px; padding: 0; font-weight: bold; color:#FF6600; font-size:16px; float:left;}
#listings .line_top {  border-bottom: 1px solid #000;  }
#listings .line_mid {  border-top: 1px solid #666666;  border-bottom: 1px solid #000;  }
#listings .line_bot {  border-top: 1px solid #666666;  }
.producttable { margin: 0 0 0 16px;}

/*____________________________________ RIGHT COLUMN ____________________________________*/

#right { width: 580px; float: right; padding:0; margin: 40px 0 0 0; }
#right p { margin: 8px 0 8px 0; }
#tyre_select { width: 530px; height:206px; padding:0; margin: 20px 0 0 25px; background: #3F3F3F url(../images/tyre_select_rightBotBg.gif) right bottom no-repeat; float:left;}
#tyre_select .left { float:left; width: 297px; padding:0; margin: 0 0 0 0; background-color:#000000; }
#tyre_select .right { float:right; width: 233px; padding:0; margin: 0 0 0 0; background: url(../images/tyre_select_rightTopBg.gif) right top no-repeat; }
#productTitle { font-size:16px; padding: 0 0 0 18px;  width:300px; height:42px; margin: 0 0 0 0; background:url(../images/icon_product.gif) left top no-repeat; color:#308a0E; }
.listingTitle { font-size:13px; line-height: 13px; font-weight: bold; color:#308a0E; }
.listingSubTitle { font-size:13px; line-height: 13px; font-weight: normal; color:#999999; }
#noteMoreRight { padding:0 3px 0 0; margin: 0 8px 0 0; float:left; font-size:9px; }
#noteMoreRight a { color:#308a0E; text-decoration:none; }
#noteMoreRight a:hover { color:#999999; text-decoration:none; }
#listings .displayLeft { width:200px; float:left; padding: 8px 0 0 0; }
#listings .displayRight { width:300px; float:right; }
#product { margin: 0 0 8px 0;}
#product .displayLeft { width:300px; float:left; padding: 8px 0 0 0; }
#product .displayRight { width:200px; float:right; }

/*____________________________________ PARAGRAPH BOX (pbox) ____________________________________*/

div.pbox { margin: 25px 25px 0 25px; padding: 0; }
div.pbox_linebot { margin: 25px 25px 0 25px; padding: 0 0 10px 0; border-bottom: 1px solid #cccccc; }
div.pbox a, div.pbox_linebot a { color: #fff; text-decoration: none; }
div.pbox a:hover, div.pbox_linebot a:hover { color:#666666; text-decoration: none; }	 
div.pbox_linebot p, div.pbox p { margin: 10px 0 0 0;}


/*____________________________________ LEFT COLUMN ____________________________________*/

#leftContainer { width: 200px; float: left; padding:0; margin: 40px 0 0 0; }
div.leftTopTab { float:left; width:185px; height:38px; padding:0; margin:0 0 0 15px; line-height: 13px; background: url(../images/left_column_topTab.gif) 0 0 no-repeat; }
div.leftTopTab .pbox { margin: 12px 12px 12px 12px; text-align:center; font-size:14px; font-weight:bold; color:#FFFFFF; }
div.leftTop { float:left; width:185px; height:14px; padding:0 0 0 0; margin:0 0 0 15px;  background: url(../images/left_column_top.gif) 0 0 no-repeat; }
div.leftBot { float:left; width:185px; height:14px;  padding:0 0 0 0; margin:0 0 0 15px; background: url(../images/left_column_bot.gif) 0 0 no-repeat; }
#leftContainer .left { float:left; width:185px; padding:0 0 0 0; margin:0 0 0 15px; line-height: 13px; background: url(../images/bgLeft.gif) 0 0 repeat; }
#callUs { width:185px; padding:0 0 0 0; margin:0 0 0 15px;}
div.left .pbox { margin: 10px 0 10px 20px; padding: 0; }
div.left .pbox p { margin: 7px 0 0 0; }
div.leftTitle { font-size:12px; font-weight:bold; padding: 0 0 0 15px; line-height:12px; margin: 6px 0 0 20px; background:url(../images/left_arrow.gif) 0 0 no-repeat; color:#FF6600; }

div.leftTitleTop { font-size:12px; font-weight:bold; padding: 0 0 0 5px; line-height:12px; margin: 12px 0 0 20px; background:url(../images/left_arrow.gif) 0 0 no-repeat; color:#FF6600; }


/*____________________________________ WIDE COLUMN ____________________________________*/
	
#wide { width: 800px; float: left; padding:0; margin:0 0 0 0; }
#wide .nospace {  margin:0;  }

/*____________________________________ TITLES ____________________________________*/

.title { margin: 0 25px 0 25px; padding: 0 0 8px 0; font-size:16px; line-height:21px;  font-weight: normal; color:#fff; border-bottom: 1px solid #ffffff;  }
.subtitle { margin: 0 0 0 0; padding: 0 0 0 0; font-size:14px; line-height:16px;  font-weight: normal; color:#666666; }
.bodytitle { text-transform:capitalize; margin: 0 0 0 0; padding: 0 0 0 25px; font-size:13px; line-height:21px; background:url(../images/body_arrows.gif) center left no-repeat; font-weight: bold; color:#FF6600; }

/*____________________________________ CONTENT AREA ____________________________________*/

#content { margin: 0; width:800px; padding:0; }

/*____________________________________ GALLERY ____________________________________*/

.gallery_holder { margin: 15px 115px 15px 115px; padding: 0; text-align:center; position:relative;}
#gallery { margin: 0; width: 440px; padding: 0;}
#gallery ul { margin:0; padding:0; list-style: none;  }
#gallery ul li { float:left; margin:5px 10px 10px 0; }

/*____________________________________ MISC ____________________________________*/
.image { float: left; margin: 10px 0 0 7px; padding: 0; }
div.noteMore { padding:0 3px 0 0; margin: 0 8px 0 0; float:left; font-size:9px; }
div.noteMore a { color:#666666; text-decoration:none; }
div.noteMore a:hover { color:#999999; text-decoration:none; }
.floatimgRight { margin-left: 15px; float: right; clear: both;  }

strong {  color:#FF6600; font-weight:bold;  }
strong a {  color: #FF6600; text-decoration: none;  }
strong a:hover {  color: #FF6600; text-decoration: undeline;  }


/*____________________________________ LISTS & BULLETS ____________________________________*/
#bulletFirst{ padding: 3px 0 3px 25px; width:485px; margin: 20px 0 6px 16px; background:url(../images/iconArrow.gif) left top no-repeat; color:#308a0E;}
#bullet    { padding: 3px 0 3px 25px; width:485px; margin: 6px 0 6px 16px; background:url(../images/iconArrow.gif) left top no-repeat; color:#308a0E;}
#bulletLast{ padding: 3px 0 3px 25px; width:485px; margin: 6px 0 20px 16px; background:url(../images/iconArrow.gif) left top no-repeat; color:#308a0E;}

ol { list-style-position: outside; color:#308a0E;}
ul { list-style-position: outside; list-style-image:url("../images/bullet_square.gif"); color:#308a0E; line-height:18px;}

#leftlist {  margin: 0 10px 10px 10px; padding: 0; font-size: 14px; color:#000; }
#leftlist ul {  margin-left: 0px; padding-left: 0px;  }
#leftlist li { padding: 2px 0 10px 0; color:#000; list-style: none; list-style-position: outside; }

/*_ FROM ALAN J BIS - works well :)
ul {  margin-left: 0px; padding-left: 0px;  }
ul li {  display: list-item; margin: 0 0 10px 5px; list-style: none outside;  }

ol {  margin-left: 0px; padding-left: 0px; color: #999;  }
ol li {  display: list-item; margin: 0 0 10px 25px; list-style: decimal outside;  }
_*/

/*____________________________________ COLOURS ____________________________________*/

.gmt {  color:#308a0E;  }
.light {  color:#999999;  }
.fix {  color:#000000;  }

/*____________________________________ BORDERS AND DIVIDERS ____________________________________*/

div .divider { display:block; height:1px; margin: 0 0 0 0; padding:0; border-bottom: 1px solid #CCC; border-bottom-width:1px; position:relative; }
.lineBelow {  border-bottom: 1px solid #FF6600;  }
#hrdivider { height:2px;  margin: 6px 6px 6px 6px; background: url(../images/hr.gif) 0 0 repeat-x; clear:both;}
.hrdividerproduct { height:2px;  margin: 6px 12px 6px 12px; background: url(../images/hr.gif) 0 0 repeat-x; clear:both;}
.imageBorder { border:2px solid #ccc;  }
.large_imageBorder { border:2px solid #FF6600;  }

#sizesavailable .linebelow {  border-bottom: 1px solid #666666;  }
.availableTop { background: #000 url(../images/alternative_top.gif) 0 0 no-repeat; padding:6px; }
/*____________________________________ PADDING ____________________________________*/

.padmid { padding:6px; background-color:#000000;}

/*____________________________________ HEADERS ____________________________________*/

/***H1***/
h1 {font-size:18px; margin: 0 0 25px 0; padding: 0; line-height: 18px; font-weight: bold; color:#FFF; }
h1.listing { color:#FF6600; }

/***H2***/
h2 {  font-size:16px; margin: 12px 0 12px 0; padding: 0; line-height: 16px; font-weight: bold; color:#FF6600;  }

/***H3***/
h3 {font-size:13px; margin: 12px 0 12px 0; padding: 0; line-height: 16px;font-weight: bold; color:#FFFFFF; }

/***NO SPACE***/
h1.nospace, h2.nospace { margin-bottom:4px; } 
h3.spacesml { margin-bottom:6px; } 
.no_top_space {  margin-top:0;}



/*____________________________________ FOOTER ____________________________________*/

#footer { width: 800px; padding: 0 95px; height:56px; background: #808A92 url(../images/bgFooter.gif) no-repeat; margin-left: auto; margin-right: auto; margin-bottom:0px; }
#footer a { color: #CCCCCC; text-decoration: none; margin-right: 6px; margin-left: 6px; }
#footer a:hover { text-decoration: underline; }
a#webtheoria  { float: right; width: 104px; height:27px; color:#CCCCCC; margin: 15px 10px 0 0; background: url(../images/webtheoria.gif) no-repeat; }	
a#microsat  { float: right; width: 104px; height:30px; color:#CCCCCC; margin: 15px 10px 0 0; background: url(../images/microsat_logo.gif) no-repeat; }	
a#netimpact  { float: right; width: 104px; height:30px; color:#CCCCCC; margin: 15px 10px 0 0; background: url(../images/netimpact_logo.gif) no-repeat; }	

#copyright { float: left; width: 400px; color:#999; margin: 20px 10px 0 20px; font-size:10px; text-align:left;  }	

/********** FORMS *********/

input, textarea, select, option {  font: 11px Verdana, Arial, Helvetica, san-serif; color: #666;  }
input.field {  border: 1px solid #ccc; background-color: #eee; width: 180px; padding: 2px;  }
input.field.ext {  width: 30px;  }
input.field.postcode {  width: 90px;  }
textarea {  border: 1px solid #ccc; background-color: #eee; width: 180px; padding: 2px;  }
textarea.wide {  width: 360px;  }
select {  border: 1px solid #ccc; color: #333; background-color: #eee; margin: 0px  }
option {  color: #fff; background-color: #333; padding: 2px;  }
input.button {  background: #ccc url(../images/btn_bg.gif) repeat 20px 50px; padding: 2px;  }
input.btn_go { width:72px; height:22px;  }
input.btn_addToCart { width:125px; height:28px;  }
input.btn_register { width:105px; height:28px;  }

.asterisk { color:#FF0000;}









