@charset "utf-8";

/*     Main Body
----------------------------------------------*/
body {
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
color:#333;
text-align:center;
margin:0 auto;
padding:0;
}

/*     General layout for all pages
----------------------------------------------*/
#holder {
width:951px;
text-align:left;
border:#5a5721 0px solid;
vertical-align:top;
margin:0 auto;
padding:0;
}

#Content {
float:left;
width:100%;
margin:0;
padding:0;
}

/* ----------- Home page stuff
---------------------------------*/

#homeLeft {
position:relative;
float:left;
width:600px;
padding-top:10px;
padding-left:10px;
}

#homeRight {
position:relative;
float:left;
width:186px;
padding-left:20px;
text-align:right;
}

#homeBottom {
position:relative;
float:left;
background:#FFFFFF;
width:940px;
margin: 0px 0px 20px 5px;
}

#homeBottomProduct {
position:relative;
float:left;
background:url(images/dottedline.gif) right repeat-y;
width:310px;
margin: 0px 0px 0px 3px;
}

#homeBottom .last{
background:url(images/dottedline2.gif) right repeat-y;
}


/* ----------------- About Page
-----------------------------------*/

.about /* full width */ {
position:relative;
float:left;
width:98%;
padding-left:10px;
}

.aboutImg {
padding:0 30px 100px 0;
}


/*  SPECIFIC */



.ProductIcons {
padding:0 10px 0 4px;
}

.ProdPageLeftMenu {
position:relative;
float:left;
width:400px;
}

.ProdPageImages {
position:relative;
float:left;
width:500px;
}
.ProductsTitleLeft {
position:relative;
float:left;
width:600px;
}

.ProductsTitleRight {
position:relative;
float:Right;
width:300px;
text-align:right;
padding-right:12px;
}

.ProductSections {
position:relative;
background:#d1d061 url(images/dottedline.gif) right repeat-y;
float:left;
width:230px;
padding:10px;
}

.ProductMain {
position:relative;
float:left;
width:650px;
padding:0 10px 10px;
}



/* -----------  Page -------------- */


.Icons {
padding:0 10px 0 4px;
}

.ProdPageLeftMenu {
position:relative;
float:left;
width:400px;
}

.ProdPageImages {
position:relative;
float:left;
width:500px;
}

.sTitleLeft {
position:relative;
float:left;
width:600px;
padding:0px;
}

.sTitleRight {
position:relative;
float:Right;
width:300px;
text-align:right;
padding-right:12px;
}

.Sections {
position:relative;
background:#d1d061 url(images/dottedline.gif) right repeat-y;
float:left;
width:230px;
padding:10px;
}

.Main {
position:relative;
float:left;
width:650px;
padding:0 10px 10px;
}


/* ------------- Stockists ----------------- */
.Stockists {
position:relative;
float:left;
width:174px;
padding-right:10px;
}

.StockTxt {
padding:20px;
}


/* --- Water Marks for Application page
 ------------------------------------------ */
 
.WoodFibreWM {
background:#e1da51 url(images/woodfibre_wm.gif) left repeat-x;
}

.HempWM {
background:#e1da51 url(images/hemp_wm.gif) left no-repeat;
}

.WoolWM {
background:#e1da51 url(images/wool_wm.gif) left no-repeat;
}

.Legend {
position:relative;
float:left;
}


/* --- Legend and image placer for application page
 -------------------------------------------------- */

.YellowNumbers {
border:0;
margin:0;
padding:0 10px 6px 0;
}

.LegendTXT {
line-height:40px;
}

.HouseIMG {
margin-top:-200px;
position:relative;
float:right;
}


/* -------------- footer ------------- */

#footer {
clear:both;
height:68px;
width:951px;
background:url(images/footer.gif) bottom no-repeat;
padding:0;
margin:0 auto 20px auto;
}

.footerLeft {
position:relative;
float:left;
width:510px;
margin:46px 0 0 10px;
}

.footerRight {
position:relative;
float:right;
width:300px;
text-align:right;
margin:48px 10px 0 0;
}




/* -------- Other Stuff
---------------------------------------*/


.DottedSpacer {
position:relative;
float:left;
width:100%;
height:4px;
background:url(images/dottedline.gif) repeat-x;
}

.sustainIMG {
padding:0 0 120px 40px;
}

.cleaner {
overflow:hidden;
clear:both;
height:1px;
}

#access-keys {
position:absolute;
width:250px;
left:-3000px;
float:left;
}


/* Texts sizes and stuff */
h1 {
font-family:Arial, Helvetica, sans-serif;
font-size:20px;
color:#595226;
font-weight:700;
margin:0 0 10px 0;
}


h2 {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
letter-spacing:-1px;
color:#5a5721;
font-weight:700;
margin:0;
}

h3 {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#4c4919;
font-weight:700;
margin:0;
}

h4 {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#4c4919;
font-weight:700;
margin:0;
}

.grey
{
	color:#666666;
}


.theColour { /* darker colour if displayed on green bg */
color:#333;
}

.smaller {
font-size:11px;
}

.main12 {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#4c4919;
}

.main11 {
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#4c4919;
}

.lite12 {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#808100;
font-weight:700;
}

.liter12 {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#ece571;
}

.grn12 {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#39650f;
font-weight:700;
}

.txtAligner {
margin:0 8px 0 0;
}


/* links */

a:link,a:visited,a:active {
color:#7D7D20;
}

a:hover {
color:#7D7D20;
text-decoration:none;
}

a.brownlink:link,a.brownlink:visited,a.brownlink:active {
color:#4c4919;
text-decoration:none;
}
a.brownlink:hover {
color:#5a5721;
text-decoration:underline;
}



a.greenlink:link,a.greenlink:visited,a.greenlink:active {
color:#39650f;
text-decoration:none;
}
a.greenlink:hover {
color:#5a5721;
text-decoration:underline;
}

a.litelink:link,a.litelink:visited,a.litelink:active {
color:#ece571;
text-decoration:none;
}

a.litelink:hover {
color:#fefbc9;
text-decoration:underline;
}


/*_____________ Nav Start _____________*/


#navholder {
position:relative;
z-index:200;
width:960px;
left:0;
top:-30px;
}

#nav {
position:relative;
list-style:none;
width:750px;
font-family:arial, verdana, sans-serif;
left:10px;
margin:0;
padding:0;
}

#nav li.top {
display:block;
float:left;
}

#nav li a.top_link {
display:block;
float:left;
height:16px;
line-height:20px;
color:#ece571;
text-decoration:none;
font-weight:700;
font-size:12px;
cursor:pointer;
padding:0;
}

#nav li a.top_link span {
float:left;
display:block;
padding:0 10px;
}

#nav li a.top_link:hover {
color:#5a5721;
background:#ece571;
}

#nav li:hover > a.top_link span {
background:#ece571;
}

#nav li:hover > a.top_link {
color:#5a5721;
}

#nav table {
border-collapse:collapse;
width:0;
position:absolute;
top:0;
left:0;
margin:0;
}

#nav li:hover {
position:relative;
z-index:200;
}

#nav a:hover {
visibility:visible;
position:relative;
z-index:200;
}

#nav ul {
position:absolute;
left:-9999px;
top:-9999px;
width:0;
height:0;
list-style:none;
margin:0;
padding:0;
}

#nav :hover ul {
left:0;
top:20px;
white-space:nowrap;
width:140px;
height:auto;
z-index:1000;
background:#5a5721;
padding:8px 10px 10px 5px;
}

#nav :hover ul li a {
display:block;
list-style:none;
font-size:12px;
height:20px;
line-height:20px;
width:auto;
color:#ece571;
font-weight:700;
text-decoration:none;
padding:0 5px;
}

#nav :hover ul li a:hover {
background:#d8d969;
color:#5a5721;
}

strong.normal{font-weight:normal; font-style:normal;}

#banner{background-image:url(images/banner_bg.jpg); height:206px;}
#logo{padding-top: 10px; padding-bottom: 20px; padding-left:10px;}
#fp_pic img {border-style: none;}
#bg{margin:0px auto; padding:0px; text-align:center; background:url(images/bg.png) repeat-y center #f5f5f5;}
#fp_box_container{float:left; width:100%; margin:0; padding:0;}
#fp_box{width:310px; height:200px; border-right:thin; border-color:#666666; float:left;}
#homeBottom h3 {font-size:14px; margin: 10px 0px 10px 5px;}
#homeBottom p {margin:10px 10px 10px 5px;}
#fp_adspace {float:right; background-color:#FFFFFF; width:250px; height:110px; margin: 10px 0px 0px 10px;}
#tabber_container {width:670px;}

#product_container {float:right; width:245px; background-color:#FFFFFF; border: #ebebeb solid 1px; margin-top:0px;}
#product_container h3 {background:#999999; font-size:16px; color:#FFFFFF; padding:5px 5px 5px 10px; font-weight:normal;}
#product_container .buy_now {padding: 20px 0 20px 0; text-align:center; border-bottom: 1px solid #E1E1E1;}
#product_container .downloads {padding: 20px 0 20px 0; border-bottom: 1px solid #E1E1E1; float:left;}
#product_container .downloads p {display:inline-block; float:left; width:180px; margin: 10px 0 2px 0;}
#product_container .downloads img {float:left; padding:0 15px 0 20px; margin-top:3px;}
#product_container img {border:0px;}
#product_woodfibre img {padding:0 20px 0 0;}
#product_woodfibre .woodfibre_pic {width:100px;}

#fp_news {float:right; width:320px;}
#fp_news h3 {padding-top: 10px;}
#fp_news p {display:inline-block; float:left; width:280px; margin: 10px 0 2px 0;}
#fp_news img {float:left; padding:0 10px 0 0; margin-top:3px; display:block;}


/* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */

/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
 display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
	width:670px;
	overflow:auto;
}
.tabberlive {
 margin-top:1em;
}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav
{
 margin:0;
 padding: 3px 0;
 border-bottom: 1px solid #dfdfdf;
 font: bold 14px Verdana, sans-serif;
}

ul.tabbernav li
{
 list-style: none;
 margin: 0;
 display: inline;
}

ul.tabbernav li a
{
 padding: 3px 0.9em;
 margin-left: 3px;
 border: 1px solid #dfdfdf;
 border-bottom: none;
 background: #dedede;
 text-decoration: none;
}

ul.tabbernav li a:link { color: #448; }
ul.tabbernav li a:visited { color: #667; }

ul.tabbernav li a:hover
{
 color: #000;
 background: #e2e1a6;
 border-color: #dfdfdf;
}

ul.tabbernav li.tabberactive a
{
 background-color: #fff;
 border-bottom: 1px solid #fff;
}

ul.tabbernav li.tabberactive a:hover
{
 color: #000;
 background: white;
 border-bottom: 1px solid #dfdfdf;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
 padding:20px 5px 5px 5px;
 border:1px solid #ebebeb;
 border-top:0;

 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:200px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 /* overflow:auto; */
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
 display:none;
}
.tabberlive .tabbertab h3 {
 display:none;
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
 height:200px;
 overflow:auto;
}
.contactUsBox { position:relative; float:left; width:300px; padding:10px 10px 10px 0px; background:#FFFFFF; border:#000000 0px solid; margin-right:30px;}
.contactUsBox label {width:100px; float:left; display:block;}
.contactUsBox{float:left; display:inline;}
.redText {	color:#FF0000;}
.ProductsTitleRight { position:relative;float:Right; width:300px; text-align:right; padding-right:12px;}

