/* Global Styles */

body {
	margin-bottom: 40px ; 
	color: #300; 
	background: #ffffff url(../images/site/body-bg.png) repeat center top;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

#container {
	width: 811px;
	margin: 10px auto;
	background: #ffffff url(../images/site/container-bg.png) repeat-y left top;
	position: relative;
}

#branding {
	height: 20px;
	background: #ffffff url(../images/site/branding-bg.png) no-repeat left top;
	margin-bottom: 20px;
}

#branding a { background: #ffffff url(../images/site/headboardslogo.jpg) no-repeat left top;
			  position: absolute; left: 26px; top: 43px; width: 734px; height: 120px; 
			  text-indent: -9999px; border: 10px solid #564c3c; }

#branding p#telno { position: absolute ; right: 30px ; top: 20px ; width: 296px ; height: 17px ; 
                    background: #ffffff url(../images/site/telno.jpg) no-repeat left top ; 
                    text-indent: -9999px ; }
#siteinfo {
	clear: left ;
	height: 83px;
	background: transparent url(../images/site/siteinfo-bg.png) no-repeat left top;
	text-transform: uppercase;
	color: #fff;
	font-size: 8px;
	line-height: 1.0;
	padding-top: 6px;
	padding-left: 45px;
	margin-top: 15px;
}

#siteinfo a { color: #fff; }

#siteinfo #credits { margin-top: 25px; padding-right: 23px; color: #666; text-align: right; }
#siteinfo #credits a { color: #666; }

#siteinfo span#paymentinfo { position: absolute ; left: 0 ; top: 0 ; text-indent: -9999px ; }
/* Navigation */

#navmain {
	position: absolute;
	left: 1px;
	top: 17px;
	padding-left: 20px;
}

#navmain ul {
	width: 546px;
	height: 10px;
	padding: 5px 0;
	list-style: none;
}
#navmain li { float: left; }
#navmain li#navhome { background: transparent url(../images/site/icon-home.png) no-repeat 0 -4px; padding-left: 10px; }
#navmain li a {
	display: block;
	border-right: 1px solid #4f4830;
	color: #362c1c;
	line-height: 1.0;
	font-size: 1.1em;
	padding: 0 10px;
	text-align: center;
}
#navmain li.last a {
	border: 0;
}

#navsupp {
	position: absolute;
	left: 26px;
	top: 190px;
	width: 197px;
	background: #968774;
}

#navsupp p#linkpics { margin-bottom: 0 ; }
#navsupp p#linkpics img { margin: 0 3px 10px ; }

#navsupp h4 {
	font-weight: normal;
	font-size: 11px;
	margin: 0.9em 0 0.7em;
	padding: 0 10px 0 17px ;
	color: #362c1c;
	text-transform: uppercase;
	font-weight: bold ;
	background: transparent url(../images/site/disclosure-up.png) no-repeat 4px top ; 
}

#navsupp .collapsed { 	border-bottom: 5px solid #ffffff; padding-bottom: 2px;}
#navsupp .collapsed h4,
#navsupp .expanded h4 { cursor: pointer ;  }

#navsupp .collapsed h4 { color: #fff ; }
#navsupp .expanded h4 { background-image: url(../images/site/disclosure-down.png) ; }

#navsupp h4.featured { margin: 0 ; border-bottom: 5px solid #fff ; padding: 1em 0 1em 10px ; }
#navsupp h4.featured a { font-weight: bold ; }
#navsupp h4#swatch { background: #968774 url(../images/site/featured-swatch.png) no-repeat right top ; }
#navsupp h4#offers { background: #968774 url(../images/site/featured-offers.png) no-repeat right top ; }

#navsupp ul { 
	border-bottom: 5px solid #ffffff;
	padding-bottom: 15px;
	font-size: 1.1em; 
}
#navsupp ul ul { 
	font-size: 100% ; 
	list-style: square;
	padding-left: 0;
	padding-bottom: 0;
	border-bottom: 0;
}

#navsupp ul ul {
	margin: 6px 0 -3px ;
	list-style-position: inside;
}

#navsupp li { padding: 3px 5px ; margin-left: 9px ; }

#navsupp ul ul li { margin-left: 7px ; color: #fff; }

#navsupp a {
	color: #fff; 
	font-weight: normal;
}
#navsupp li.active li.active a { color: #362c1c; }
#navsupp li.active li.active a:hover { text-decoration: none; cursor: default; }

/* Content Area */

#content {
	margin-left: 240px;
	padding: 155px 0 25px ;
	color: #564c3c;
}

#content-main {
	position: relative ; 
	width: 540px;
	min-height: 1100px;
	-moz-opacity: 0.999 ;
}

#content-main a { color: #968774 ; }

#content-main h1,
#content-main h2,
#content-main h3,
#content-main h4,
#content-main h5 { line-height: 1.3; margin-bottom: 1em; font-weight: normal; text-transform: uppercase; color: #362c1c; font-family: "Century Gothic" }

#content-main h1 { font-size: 1.6em; border-bottom: 1px solid #564C3C; }
#content-main h2 { clear: left ; font-size: 1.3em; margin-top: 2em ; border-bottom: 1px solid #968774 ; padding-bottom: 3px ; }
#content-main h3 { font-size: 1.4em; font-style: italic; }
#content-main h4 { font-size: 1.3em; }
#content-main h5 { font-size: 1.2em; }

#content-main p {
	font-size: 1.2em;
	line-height: 1.3;
	margin-bottom: 1em;
}

#content-main ul,
#content-main ol {
	list-style: square;
	margin: 0 20px 15px;
	font-size: 1.2em;
	color: #555;
	line-height: 1.3;
}
#content-main ol { list-style: decimal; }

#content-main ul ul,
#content-main ul ol,
#content-main ol ol,
#content-main ol ul {
	font-size: 1em;
}

#picturebox img {
	margin-bottom: 10px;
}
#picturebox #leftpic,
#picturebox #middlepic { margin-right: 5px; }

/* General forms */

input, select { vertical-align: middle ; }
input.btn { position: relative ; height: 21px ; border: 0 ; padding: 0 6px 3px ;
                               color:#e1dbd6 ; background: #362C1C ; 
                               font: normal bold 12px/12px Verdana,Arial,Helvetica,sans-serif ; }
input.btn:hover { color:#362C1C ; background: #e1dbd6 ; cursor: pointer ; } 

#content-main form { padding: 10px 10px 80px ; background-color: #f6f5f1 ; }

#content-main form h2,
#content-main form h3 { margin: 10px 0 ; padding: 0 5px ; border: 0 ; background-color: #d9d3c7 ; line-height: 1.6 ; }
#content-main form label { float: left ; position: relative ; top: 4px ; width: 16em ; margin: 0 0 0 10px ; text-transform: uppercase ; font: normal bold 1.1em/1.0 "Century Gothic" ; }
#content-main form .radiogroup label,
#content-main form .checkbox label { float: none ; width: auto ; margin: 5px 0 ; top: 2px ; }

#content-main form .text input,
#content-main form input.txt { width: 14em ; margin: 0 10px 5px 0 ; border: none ; padding: 2px 3px ; background-color: #e4dfd9 ; font: 1.2em/1.0 Verdana ; }
#content-main form .checkbox input { width: auto ; margin: 5px 10px ; }
#content-main form select { width: 14.5em ; margin: 0 10px 5px 0 ; border: 2px solid #e4dfd9 ; padding: 0 ; background-color: #e4dfd9 ; font: 1.2em/1.0 Verdana ; } 
#content-main form select.month { width: 7em ; margin-right: 1px ; }
#content-main form select.year { width: 4em ; }
#content-main form textarea { width: 20em ; height: 14em ; margin: 0 10px 5px 0 ; border: none ; padding: 2px 3px ; background-color: #e4dfd9 ; font: 1.2em/1.0 Verdana ; }
#content-main form input.btn { float: right ; width: 120px ; height: 55px ; margin-top: 15px ; border: 0 ; padding: 30px 10px 5px 0 ; color: #fff ; background-color: #afbb4f ; font: normal bold 1.2em/1.0 "Century Gothic" ; cursor: pointer ; }

#content-main form .radiogroup span { display: block ; margin: 0.5em 10px ; }
#content-main form .radiogroup input {margin-right: 10px ; } 
body.checkout #content-main form input#changeDelivery { float: right ; width: 120px ; margin-top: 15px ; border: 0 ; padding: 30px 10px 5px 0 ; color: #fff ; background-color: #afbb4f ; font: normal bold 1.2em/1.0 "Century Gothic" ; cursor: pointer ; }
body.checkout #content-main form input#addPromocode { float: right ; width: 120px ; margin-top: 15px ; border: 0 ; padding: 30px 10px 5px 0 ; color: #fff ; background-color: #afbb4f ; font: normal bold 1.2em/1.0 "Century Gothic" ; cursor: pointer ; }
body.checkout #content-main form input#removePromocode { float: right ; width: 120px ; margin-top: 15px ; border: 0 ; padding: 30px 10px 5px 0 ; color: #fff ; background-color: #afbb4f ; font: normal bold 1.2em/1.0 "Century Gothic" ; cursor: pointer ; }
 
body#shop_services #content-main ul.error { margin: 5px 0 15px ; padding: 15px ; color: #900 ; background-color: #ffdfd9 ; font-weight: bold ; }
body#shop_services #content-main ul.error li { margin: 0 0 5px 10px ; padding-left: 5px ; }

body.checkout #content-main form input#makePayment { float: right ; width: 120px ; margin-top: 15px ; border: 0 ; padding: 30px 10px 5px 0 ; color: #fff ; background-color: #afbb4f ; font: normal bold 1.2em/1.0 "Century Gothic" ; cursor: pointer ; }
body.checkout #content-main form select#howheard { width: 20em ; }

body.checkout #content-main form div.error { margin: 5px -10px ; border: 1px solid #fff ; padding: 5px 10px ; border-left: none ; border-right: none ; color: #900 ; background-color: #ffdfd9 ; }
body.checkout #content-main form div.error p { margin: 0 0 5px 0 ; }
body.checkout #content-main form div.text.error input,
body.checkout #content-main form div.error select { color: #900 ; background-color: #fff ; border-color: #fff ; }
body.checkout #content-main form span.label { float: left ; position: relative ; top: 4px ; width: 16em ; margin: 0 0 0 10px ; text-transform: uppercase ; font: normal bold 0.915em/1.0 "Century Gothic" ; }
body.checkout #content-main form span.tooltiphint { position: relative ; top: -1px ; left: -10px ; padding: 2px 6px ; color: #fff ; background-color: #695d4d ; font-size: 1.2em ; font-weight: bold ; cursor: help ; }
body.checkout #content-main form span.fixedvalue { position: relative ; top: 1px ; color: #000 ; }
body.checkout #content-main p.errorheader { color: #900 ; font-weight: bold ; }
body.checkout #content-main form p { margin: 10px ; }
/* Section specific: home */

body#home #content-main { min-height: 850px ; }
body#home #content-main #list_intro { position: relative; z-index: 10; }
body#home #content-main h1 { padding-top: 380px ; 
                             background: transparent url(/images/site/hb_surround.png) no-repeat left top ; }
body#home #content-main ul#hbbox { position: absolute ; left: 0 ; top: 0 ; width: 540px ; height: 320px ; list-style: none ;}
body#home #content-main ul#hbbox img { position: absolute ; left: 128px ; bottom: 110px ; z-index: 5 ; border: 1px solid #bbb ; }
body#home #content-main ul#hbbox a { position: absolute ; left: 0 ; bottom: -40px ; width: 480px ; padding-top: 330px ;
                                     color: #564c3c ; font-size: 0.9em ; font-style: italic ; text-align: center ; z-index: 20 ; }

/* Shop: Listing page */

#content-main ul#product_list { list-style: none ; margin: 10px 0 0 8px ; }
#content-main ul#product_list li { position: relative ; float: left ; width: 156px ; min-height: 68px ; margin: 8px ;  border: 1px solid #564C3C ; padding-top: 160px ; line-height: 1.0 ; }
#content-main ul#product_list li a { position: absolute ; left: 0 ; top: 0 ; width: 158px ; height: 230px ; text-indent: -9999px ; }
#content-main ul#product_list li h3 { margin: 0 2px 3px ; font-size: 0.95em ; font-style: normal ; font-weight: bold ; line-height: 1.2 ; text-align: center ; }
#content-main ul#product_list li img { position: absolute ; left: 0 ; top: 0 ; border: 0 ; }
#content-main ul#product_list li p.price { color: #968774 ; font-size: 10px ; font-style: italic ; text-align: center ; }
#content-main ul#product_list li p.info { width: 0 ; height: 0 ; line-height: 0 ; }
#content-main #colourways-wide { width: 512px ; height: 40px ; margin: 15px 0 0 16px ; background: transparent url(/images/site/colourways-wide.png) no-repeat left top ; text-indent: -9999px ; }
#content-main #colourways-wide a { display: block ; width: 512px ; height: 40px ; }

/* Shop: Item page */

#content-main #product_item h1 { margin-bottom: 10px ; }
#content-main #product_item #picbox { position: relative ; width: 540px ; overflow: hidden ; }
#content-main #product_item #picbox img { display: block ; margin: 0 auto ; }
#content-main #product_item #picbox-caption { position: absolute; left: 5px; bottom: 81px; width: 330px;
											  color: #ffffff; background: rgba(86, 76, 60, 0.4); padding: 2px 200px 3px 5px; }
#content-main #product_item #picbox #thumbs { height: 53px ; margin: 10px 0 ; padding: 5px ; background: #968774 ; }
#content-main #product_item #picbox #thumbs a { float: left ; width: 49px ; height: 49px ; overflow: hidden ; border: 1px solid #564C3C ; margin: 1px ; }
#content-main #product_item #picbox #thumbs a:hover { border-color: #fff ; }
#content-main #product_item form { clear: left ;  margin: 16px 0 ; padding: 10px ; color: #fff ; background: #968774 ; }
#content-main #product_item form h2 { margin: 0 0 10px ; border: 0 ; color: #362C1C ; background-color: transparent ; }
#content-main #product_item form p { position: relative ; padding-left: 23px ; }
#content-main #product_item form p input.btn { float: none ; margin-top: -39px ; }
#content-main #product_item form p input#wallmountingChanger { margin-left: 10px ; }
#content-main #product_item form p select { margin: -3px 0 0 10px ; font-size: 1em ; width: 26em ; }
#content-main #product_item form p span { position: absolute ; left: 0px ; top: -7px ; font-weight: bold ; font-size: 1.7em ; color: #e1dbd6 ;}
#content-main #product_item form p label { top: 1px ; width: auto ; margin-left: 30px ; font-weight: bold ; }
#content-main #product_item p#available { text-align: right ; }
#content-main #product_item p#available a { color: #564C3C ; }
#content-main #product_item p#option_upholstery a { position: relative ; padding: 3px 6px ; color:#e1dbd6 ; background: #362C1C ; 
                                             font-weight: bold ; white-space: nowrap ; }
#content-main #product_item p#option_upholstery a:hover { color:#362C1C ; background: #e1dbd6 ; text-decoration: none ; } 
#content-main #product_item p#option_woodfinish a { position: relative ; padding: 3px 6px ; color:#e1dbd6 ; background: #362C1C ; 
                                             font-weight: bold ; white-space: nowrap ; }
#content-main #product_item p#option_woodfinish a:hover { color:#362C1C ; background: #e1dbd6 ; text-decoration: none ; } 
#content-main #product_item form p.buy { margin-left: -5px ; margin-bottom: 0 ; padding: 3.5em 0 0 ; text-align: right ; }
#content-main #product_item form p.buy span.price { position: relative ; float: left ; padding: 0 5px ; color: #fff ; font-size: 1.8em ; }
#content-main #product_item form p.buy span.rrp { position: relative ; float: left ; padding: 6px 5px 0 ; color: #fff ; font-size: 1.3em ; font-weight: normal ; font-style: italic ; }
#content-main #product_item #colourways { position: absolute ; width: 201px ; height: 201px ; right: 0 ; bottom: 93px ; background: transparent url(/images/site/colourways.png) no-repeat left top ; text-indent: -9999px ; }
#content-main #product_item #note { font-size: 1em ; margin: -5px 0 10px ; font-style: italic ; }

/* Shop: Swatch viewer */

body#swatch { margin-bottom: 0 ; background-attachment: fixed ; }
body#swatch #content-main { width: 670px ; min-height: 0 ; height: auto ; overflow: hidden ; padding: 0 ; }
body#swatch h1,body#swatch h4 { position: absolute ; left: 0 ; top: 0 ; text-indent: -9999px ; }
body#swatch #navswatch ul { height: 40px ; margin: 0 ; background: #564C3C ; list-style: none ; }
body#swatch #navswatch ul li { float: left ; padding-top: 10px ; margin-left: 5px ; }
body#swatch #navswatch ul li a { float: left ; display: block ; height: 30px ; padding: 0 10px ; 
                                 color: #fff ; background: #968774 ; 
                                 font-size: 1em ; font-weight: bold ; line-height: 30px ; }
body#swatch #navswatch ul li.active a { color: #968774 ; background: #f7f5f3 ; cursor: default ; }
body#swatch #navswatch ul li#navclose { float: right ; margin-right: 10px ; }
body#swatch #navswatch ul li#navclose a { background: #261c0c ; }
body#swatch ul#swatchlist { margin: 0 ; padding: 10px ; width: 340px ; 
                            list-style: none ; }    
body#swatch ul#swatchlist p.desc { font-size: 100% ; }
body#swatch ul#swatchlist p.desc img { margin-bottom: 1em ; } 

body#swatch #swatchlist.js h2 { width: 402px ; margin: 0 0 10px 20px ; padding-top: 10px ; }
body#swatch #swatchlist.js ul { width: 402px ; list-style: none ; }
body#swatch #swatchlist.js li { float: left ; height: 60px ; margin: 0 7px 10px 0 ; } 
body#swatch #swatchlist.js h3 { position: fixed ; right: 10px ; top: 245px ; width: 230px ; }
body#swatch #swatchlist.js p.desc { position: fixed ; right: 10px ; top: 10px ; width: 230px ; font-size: 0.833em ; }
body#swatch #swatchlist.js p.desc img { margin-bottom: 3.1em ; } 
body#swatch #swatchlist.js a { position: relative; display: block; }
body#swatch #swatchlist.js div.active { position: absolute; left: 0; top: 0; display: none; }

body#swatch a#swatchrequester { display: block ; margin-top: 10px ; padding: 2px 7px 3px ; color: #E1DBD6 ; background-color: #24190b ; font-size: 1.2em ; } 
body#swatch a#swatchrequester:hover { background-color: #E1DBD6 ; color: #24190b ; text-decoration: none ; } 

/* Shop: basket */

body#basket #content-main form { background-color: transparent ; padding: 0 ; }
body#basket #content-main form input.btn { position: relative ; top: -3px ; float: none ; width: auto ; height: auto ; margin: 0 ; padding: 1px 10px 2px ; background-color: #564C3C ; }
body#basket #content-main form select { width: auto ; }
body#basket #content-main ul { list-style-type: none ; margin: 0 ; }
body#basket #content-main ul li { padding-left: 0 ; }
body#basket #content-main h2 { border-bottom-color: #968774 ; }
body#basket #content-main h2 a { color: #564C3C ; }
body#basket #content-main ul li img { float: left ; margin: 0 15px 15px 0 ; border: 1px solid #968774 ; }
body#basket #content-main ul li p { margin-left: 0 ; font-size: 100% ; }
body#basket #content-main p#baskettotals { clear: left ; padding: 10px ; color: #fff ; background: #968774 ; text-align: right ; }
body#basket #content-main p#baskettotals input.btn { float: left ; position: relative ; top: -2px ;  }
body#basket #content-main p#basketactions { text-align: right ; }
body#basket #content-main p#basketactions input.btn { background-color: #AFBB4F ; }
body#basket #content-main ul#product_list li img { border: none ; }
body#basket #content-main form.quickbuy input.btn { margin-top: 7px; }

/* Shop: checkout */

body.checkout #content-supp { position: absolute ; left: 26px ; top: 180px ; width: 197px ; background-color: #fff ; text-align: center ; }
body.checkout #content-supp img { margin-bottom: 5px ; }
body.checkout #content-supp p { margin-bottom: 15px ; }

body.checkout table#order_breakdown { width: 100% ; font-family: "Century Gothic" ; font-size: 1.1em ; }
body.checkout table#order_breakdown td { padding: 10px 5px 5px ; border-bottom: 5px solid #f6f5f1 ; }
body.checkout table#order_breakdown td.qty {  background-color: #fff ; }
body.checkout table#order_breakdown td.desc { border-right: 5px solid #f6f5f1 ; background-color: #fff ; }
body.checkout table#order_breakdown td.subtotal { width: 80px ; text-align: right ; background-color: #fff ; }
body.checkout table#order_breakdown td.delivery { padding: 0 ; border: 5px solid #f6f5f1 ; border-left: none ; background: transparent ; text-align: right ; }
body.checkout table#order_breakdown td.delivery strong { padding: 12px ; 10px ; background-color: #d9d3c7 ; line-height: 30px ; }
body.checkout table#order_breakdown td.vat { font-size: 0.9em ; }
body.checkout table#order_breakdown td.total { color: #fff ; background-color: #62654a ; font-weight: bold ; text-align: right ;  }
body.checkout table#order_breakdown td p { margin-bottom: 5px ; }

/* Misc */

#paymentproviders { background: #fff; color: #968774 ; line-height: 1.3 ; }
#paymentproviders p { margin-bottom: 5px ; }

body#shop_services .swatch { float: left ; width: 115px ; height: 85px ; margin: 10px 5px 15px ; text-align: center ; }
body#shop_services #content-main form .swatch img { margin-bottom: 3px ; }
body#shop_services #content-main form .swatch .checkbox input { margin: 2px 0 0 0 ; }
body#shop_services #content-main form .swatch label { font-size: 1em ; }
body#special_offers #content-main #picbox { float: left ; margin: 3px 10px 10px 0 ; border: 1px solid #938775 ; }

/* Thickbox */

#TB_window { border-color: #564C3C ; }
#TB_title { background: #968774 ; color: #eee ; }
#TB_title a { color: #fff !important ; }

/* Tooltip */

#tooltip {
	background-color:#EEEEEE;
	border:1px solid #111111;
	opacity:0.95;
	padding:5px;
	position:absolute;
	z-index:3000;
}

#tooltip h3, #tooltip div {
	margin:0pt;
}
