/**************************************************************

Isle of Wight Timber Stylesheet

Author: MP - Flip Media (UK) Limited
Copyright 2008 - Do not reuse any part of this stylesheet without the permission of Isle of Wight Timber or Flip Media.

STYLESHEET CONTENTS
1. Fonts
	  a. Font Sizing
2. HTML Tags
3. Page Structure
4. Page Section Formatting
      a. Header
	  b. Footer
	  c. Navigation
	  d. Content Column
	  e. Info Column
	  z. Buttons 
5. Clear/Float fix	  
6. General Formatting Classes

***************************************************************/

/********************* Fonts ********************/
body {	
	font-family: Arial, "Lucida Sans", Helvetica, sans-serif;}	
	
/* For text under 14px */	
#breadcrumbs {
	font-family: Verdana, Arial, Helvetica, sans-serif;}	
	
/* -------- Font Sizing -------- */		

body {
	font-size:62.5%} /* set the default to 10px */

#footer {
	font-size: 1.1em;}

#footer a{
	font-size: 1.2em;}

p, 
.slides h2, 
#header h1,
#productDesc h2 {
	font-size: 1.3em;}

.quote, .quote p {
	font-size: 1.8em;}
	
.services li {
	font-size: 1.9em;}

h3 {
	font-size: 2.2em;}

h2 {
	font-size: 2.5em;}

.phone {
	font-size: 3.8em;}
	
/* -------- End Font Sizing -------- */	
	
/********************* End Fonts ********************/

/********************* HTML Tags ********************/

* { margin: 0px;
	padding: 0px;
	border: 0px;}

html {	}	

body {
	background: url(../images/pageBG3.jpg) top left no-repeat #000;
	color: #FFF;}

p {
	line-height: 125%;
	margin-bottom: 25px;}

p, p a  {	
	color: #FFF;}
	

li {
	}

a, a:active {
	outline: none;}
	
a:hover {
	}
	
p a {
	text-decoration: underline;
	font-weight: bold;}	
p a:hover {
	text-decoration: none;}	

h1 {
	font-weight: normal;
	line-height: 36px;}
	
h2 {
	margin-bottom: 15px;}
	
h3 {
	color: #A4AC18;
	margin-bottom: 15px;
	clear: both;
	}
	
h4 {
	}		
	
/********************* End HTML Tags *********************/
		
/********************* Page Structure *********************/

#container {
	width: 871px;
	padding: 0 0 0 80px;}
	
#header {	
	height: 318px;}
	
#footer {	
	border-top: 1px solid #3E3E3E;
	padding: 12px 0 40px 0;
	margin: 35px 0 0 0;}
					
#content {		
	clear: both;}
	
#contentColumn {		
	width: 540px;
	float: left;}
	
#infoColumn {
	width: 264px;
	float: left;
	margin-left: 33px;}	
	
/********************* End Page Structure *********************/
	
/********************* Specific formatting *********************/

/* -------- Header -------- */
	
.phone {
	color: #A8B023;
	font-weight: bold;
	margin-top: 90px;}
	
.phone span {
	color: #FFF;}		

/* -------- End Header -------- */

/* -------- Footer -------- */

#footer a {
	color: #FFF;
	text-decoration: none;}
	
#footer a:hover {
	text-decoration: underline;}

/* -------- End Footer -------- */

/* -------- Navigation -------- */
/* -------- End Navigation -------- */

/* -------- Content Column -------- */

ul.services {
	float: left;
	margin-bottom: 20px;}

ul.services li {
	width: 235px;
	list-style-type: none;
	background: url(../images/tick.png) left no-repeat;
	behavior: url(iepngfix.htc);
	padding: 0 0 0 34px;
	line-height: 180%;
	border-bottom: 1px solid #726661;
	font-weight: bold;}

ul.services li.last {
	border-bottom: none;}
	
.address, .telEmail {
	float: left;
	width: 269px;}	

.telEmail span, .telEmail span a {
	font-weight: bold;
	color: #A8B023;}
/* -------- End Content Column -------- */

/* -------- Info Column -------- */

.quote, .quote p {
	color: #A8B023;
	width: 235px;
	background: #585858;
	padding: 15px 14px 15px 15px;
	margin: 0;}
	
.quoteBy {
	color: #A8B023;
	background:url(../images/bubbleBottom.gif) 65px 0 no-repeat;
	padding-left: 115px;
	line-height: 40px;}

#products {
	width: 262px;
	margin: 0 0 35px 0;
	height: 170px;
	vertical-align: middle;
	border: 1px solid #585858;
	background-color: #000;}
	
#products .control{	
	float: left;
	margin: 76px 0 0 15px;}

#products #nextProd {
	float: right;
	margin-right: 15px;}	

#prodShow {
	width: 163px;
	background-color: #000;
	margin: 0 0 10px 20px;
	float: left;
	height: 170px;}	

#prodShow li, #productDesc li {	
	list-style-type: none;}

#productDesc {
	height: 250px;
	width: 264px;}

#productDesc h2 {
	color: #A4AC18;
	margin-bottom: 5px;}

#productDesc p {
	color: #A8A8A8;}
	

/* -------- End Info Column -------- */

/* -------- Buttons -------- */

.blueBuyNowBtn, .redBuyNowBtn, .greyBuyNowBtn, .sbCheckout, .searchButton {	
	overflow: hidden;	
	cursor: pointer; /* hand-shaped cursor */}

.blueBuyNowBtn {
	background:transparent url(../images/BtnBlueBuyNow.png) top left no-repeat;
	width: 90px;
	height: 25px;
	margin-top: 5px;
	padding-top: 25px;}
	
	
/* -------- End Buttons -------- */

/********************* End Specific formatting *********************/

/********************* Clearing Div Fixes *********************/

.clearfix:after, 
#footer:after,
#productDesc:after { 
	content: "."; 
	display: block; 
	clear: both; 
	visibility: hidden; 
	line-height: 0; 
	height: 0; } 

.clearfix, 
#footer,
#productDesc { 
	display: inline-block; } 

html[xmlns] .clearfix, 
html[xmlns] #footer, 
html[xmlns] #productDesc { 
	display: block; } 

* html .clearfix, 
* html #footer, 
* html #productDesc  { 
	height: 1%; }

/********************* End Clearing Div Fixes *********************/


/********************* General Formatting *********************/

.left {
	float:left;}

.right {
	float:right;}
	
.clear {
	clear:both;}	

.title {
	width: 390px;
	padding: 10px 0 0 0;}	
	
#container a.blockLink {
	background:url(../images/blockLinkBG.gif) right no-repeat #333;
	padding: 3px 14px 3px 6px;
	color: #FFF;
	font-weight: bold;
	text-decoration: none;}	
	
#container p.tick {
	background:url(../images/tickBullet.gif) left no-repeat;
	padding-left: 22px;
	color: #333;
	font-style:italic;
	margin: 20px 0;}	
	
	
	
/********************* End General Formatting *********************/
