html, body {min-height: 100%; margin-bottom: 1px;} /* Force vertical scrollbar to always appear in Firefox */

body {
	margin: 15px 0;
	background-color: #fff;
	font-family: Verdana, sans-serif;
	font-size: 70%;
	color: #666;
	text-align: center;
}

h1, h2, h3, h4, h5, h6 {margin: 0 0 1em; padding: 0; font-weight: bold;}
h1 {font-size: 120%; color: #0075ba; width: 180px; height: 0px; background: top left no-repeat; padding-top: 25px; overflow: hidden;}
h2 {font-size: 120%; color: #0075ba;}
h3 {font-size: 100%; color: #0075ba;}
h4 {font-size: 100%; color: #666;}
h5 {font-size: 100%; color: #0075ba; margin-bottom: 0.2em;}
h6 {font-size: 100%; color: #0075ba; background-color: #bcdcfc; margin: 1.5em 0 0.5em; padding: 2px;} /* glossary page letter headings */

a {color: #0075ba; font-weight: bold;}
a:hover {color: #000;}

a img {border: none;}
a.skipNav {position: absolute; left: -1000px;}

p {margin: 0; padding: 0 0 1.3em; line-height: 1.3em;}
p.back2top {text-align: right;}

ol, ul {margin: 0 0 1.3em; padding-left: 3em; line-height: 1.3em;}
li {margin: 0 0 0.3em; padding: 0;}

div.clear {clear: both;}

.border {border: 1px solid #999}


/* page layout */
#pageWrapper {width: 770px; position: relative; margin-left: auto; margin-right: auto; text-align: left;}
#header {width: 750px; margin: 0 10px; overflow: hidden; height: 1%;}
#logo {float: left;}
#contentWrapper {width: 573px; float: right;}
#content {width: 563px;  padding: 10px 0; overflow: hidden;}
#contentLeftColumn {width: 262px; float: left; padding: 0 10px; margin-right: 38px;}
#contentRightColumn {width: 223px; float: left; background-color: #f3f3f3; padding: 10px;}
#footer {width: 565px; background-color: #ebebeb; margin: 0 10px; padding: 13px 0 9px 185px;}


/* search */
#search { float: right; color: #0075ba;	margin-top: 10px;}

form.search {margin: 0; padding: 0;}
form.search label {font-family: Verdana, sans-serif; font-size: 100%; font-weight: bold; padding-right: 3px;}
form.search input.text {width: 150px; height: 1.3em; font-family: Verdana, sans-serif; font-size: 100%; padding: 2px; vertical-align: middle;}
form.search input.go {
	font-family: Verdana, sans-serif;
	font-size: 100%;
	color: #0075ba;
	font-weight: bold;
	background: none;
	border: none;
	margin-bottom: 2px;
	padding: 2px 0;
	vertical-align: bottom;
	cursor: pointer;
}


/* header navigation */
#headerNav {width: 750px; color: #666; margin: 0 10px 8px; text-align: right;}

#headerNav ul {list-style: none; margin: 0; padding: 0; line-height: 1.2em;}
#headerNav li {display: inline; border-right: 1px solid #666; padding: 0 13px 0 9px;}
#headerNav li.last {border: 0; padding-right: 0;}

#headerNav a {color: #666; text-decoration: none;}
#headerNav a:visited {color: #666; text-decoration: none;}
#headerNav a:hover {color: #0075ba; text-decoration: underline;}


/* title bar */
#titleBar {width: 730px; background-color: #0075ba; color: #fff; margin: 0 10px 2px; padding: 4px 10px;}
#titleBar p {font-weight: bold; padding: 0; line-height: 1.4em;}

#titleBar a {color: #fff; text-decoration: none;}
#titleBar a:visited {color: #fff; text-decoration: none;}
#titleBar a:hover {color: #fff; text-decoration: underline;}

#titleBarLinks {float: right;}
#titleBarLinks ul {list-style: none; margin: 0; padding: 0;}
#titleBarLinks li {display: inline; border-right: 1px solid #fff; padding: 0 12px 0 8px;}
#titleBarLinks li.last {border: 0; padding-right: 0;}


/* left navigation */
#leftColumn {width: 167px; float: left;	margin-bottom: 10px; padding: 0 20px 0 10px;}

#leftNav {padding-bottom: 15px;}
#leftNav a {
	display: block;
	width: 145px;
	color: #666;
	border-bottom: 1px dotted #666;
	text-decoration: none;
	font-weight: bold;
	padding: 8px 10px;
}
#leftNav a:hover {color: #0075ba; text-decoration: none;}
#leftNav a.current {color: #0075ba;}
#leftNav a.sub {border-bottom: none;}

#leftNav .subNav {width: 165px; border-bottom: 1px dotted #666; margin: 0 10px; padding-bottom: 8px;}
#leftNav .subNav a {font-size: 90%; color: #999; border-bottom: none; padding: 3px 10px;}
#leftNav .subNav a:hover, #leftNav .subNav a.current {color: #0075ba;}


/* page headings */
h1.about-us {background-image: url(../images/headings/about_us.gif);}
h1.accessibility {background-image: url(../images/headings/accessibility.gif);}
h1.basket {background-image: url(../images/headings/shopping_basket.gif);}
h1.checkout {background-image: url(../images/headings/checkout.gif);}
h1.contact-us {background-image: url(../images/headings/contact_us.gif);}
h1.cust-details {background-image: url(../images/headings/customer_details.gif);}
h1.cust-serv {background-image: url(../images/headings/customer_service.gif);}
h1.delivery {background-image: url(../images/headings/delivery_policy.gif);}
h1.directions {background-image: url(../images/headings/find_us.gif);}
h1.enquiry {background-image: url(../images/headings/enquiry_form.gif);}
h1.faqs {background-image: url(../images/headings/faqs.gif);}
h1.glossary {background-image: url(../images/headings/glossary.gif);}
h1.links {background-image: url(../images/headings/links.gif);}
h1.mailing-list {background-image: url(../images/headings/mailing_list.gif);}
h1.notes {background-image: url(../images/headings/notes.gif);}
h1.our-products {background-image: url(../images/headings/our_products.gif);}
h1.our-staff {background-image: url(../images/headings/our_staff.gif);}
h1.privacy {background-image: url(../images/headings/privacy.gif);}
h1.range {background-image: url(../images/headings/range_fabrics.gif);}
h1.returns {background-image: url(../images/headings/returns_policy.gif);}
h1.samples {background-image: url(../images/headings/sample_book.gif);}
h1.search {background-image: url(../images/headings/search.gif);}
h1.shipping {background-image: url(../images/headings/shipping_details.gif);}
h1.shopping-online {background-image: url(../images/headings/shopping_online.gif);}
h1.sitemap {background-image: url(../images/headings/sitemap.gif);}
h1.stage {background-image: url(../images/headings/stage_fabrics.gif);}
h1.tandc {background-image: url(../images/headings/tandc.gif);}
h1.unsubscribe {background-image: url(../images/headings/unsubscribe.gif);}


/* content header image on home page */
#contentHeaderHome {
	width: 573px;
	position: relative;
	height: 278px;
	margin-top: -5px;
	background: url(/images/content_headers/content_header_home.jpg) top left no-repeat;
}
#introText {width: 150px; position: absolute; top: 135px; left: 18px;}

form#homeSearch {margin: 0; padding: 0; position: absolute; bottom: 42px; left: 18px;}
form#homeSearch label {color: #fff; font-family: Verdana, sans-serif; font-size: 100%; font-weight: bold; padding-right: 5px;}
form#homeSearch input.text {width: 150px; font-family: Verdana, sans-serif; font-size: 100%; padding: 2px; vertical-align: middle;}
form#homeSearch input.go {
	font-family: Verdana, sans-serif;
	font-size: 100%;
	color: #fff;
	font-weight: bold;
	background: none;
	border: none;
	margin-bottom: 2px;
	padding: 2px 0;
	vertical-align: bottom;
	cursor: pointer;
}

#leftHeading {width: 100px; position: absolute; bottom: 0; left: 10px;}
#rightHeading {width: 100px; position: absolute; bottom: 0; left: 330px;}


/* content header */
#contentHeader {
	width: 573px;
	margin-top: -5px;
}
#contentHeading {font-size: 200%; color: #666; text-transform: capitalize; margin: 20px 0 30px;}
#contentHeading span {color: #4ca7fc;}

#heading {
	width: 400px;
	position: relative;
	top: -23px;
	font-weight: bold;
	color: #0075ba;
	padding: 2px 10px;
	line-height: 19px;
	margin-bottom: -23px;
}

/* content footer */
#contentFooter {
	width: 543px;
	position: relative;
	background-color: #bcdcfc;
	color: #0075ba;
	font-weight: bold;
	padding: 2px 10px;
	margin-right: 10px;
	text-align: center;
	overflow: hidden;
}
#contentFooter p {padding: 0; line-height: 19px;}
#contentFooter p.left {float: left;}
#contentFooter p.center {width: 50px; margin-left: auto; margin-right: auto;}
#contentFooter p img {margin-right: 20px;}

#contentHeader a, #contentFooter a {text-decoration: none;}


/* mailing list sign-up */
form.mailingList {margin: 0; padding: 0;}
form.mailingList input.text {width: 160px; height: 1.3em; font-size: 100%; margin: -4px 5px 0; padding: 2px; vertical-align: top;}
form.mailingList input.submit {padding: 0;}


/* forms */
form {font-family: Verdana, sans-serif; margin: 0 0 15px; padding: 0;}
form input {font-family: Verdana, sans-serif; font-size: 100%; padding: 2px;}
form select {font-family: Verdana, sans-serif; font-size: 100%;}
form textarea {font-family: Verdana, sans-serif; font-size: 100%; padding: 2px;}
.formItem {margin-top: 2px; padding-bottom:2px; overflow: hidden;}
.formLabel {float: left; text-align: right; width: 120px; margin: 3px 10px 0 10px; padding:0;}

form.quantity {margin: 0;}


/* product pages */
div.productList {width: 584px; margin-left: -11px; padding: 0; overflow: hidden;}

.productBrief {width: 125px; float: left; padding: 0 10px 20px 11px; line-height: 1.3em;}
.productBrief p {padding-top: 0.3em; padding-bottom: 0;}
.productBrief p.blue {color: #0075ba; font-weight: bold;}
.productBrief img.moreInfo {border-top: 1px dotted #666; margin-top: 5px;}

.productImage {float: left; width: 200px; height: 170px; overflow: hidden; margin-right: 10px;}
.productListImage {width: 125px; height: 110px; overflow: hidden}

.productDetail {margin-bottom: 10px; overflow: hidden}
.productText {width: 333px; float: left; background-color: #efefef; padding: 10px;}

.fabricRange {background-color: #efefef; margin-bottom: 10px; padding: 10px;}
.fabricRange p {padding: 5px 0;}


/* shopping basket */
table.basket th {background-color: #0075ba; color: #fff; padding: 4px 3px;}
table.basket td {background-color: #f5f5f5; padding: 4px 3px;}
table.basket td.price {background-color: #ddd;}
table.basket td.blank {background-color: #fff;}
table.basket td.checkout {background-color: #0075ba;}
table.basket td.buttons {background-color: #ddd; font-weight: bold; color: #999;}


/* search results */
table.searchResults td {padding: 4px;}
table.searchResults td.shaded {background-color: #f9f9f9;}


/* general content styles */
p.specialOffer {border-bottom: 1px dashed #666; padding-bottom: 5px; margin-bottom: 5px;}
p.specialOffer span.price {font-weight: bold; color: #0075ba;}
p.specialOffer#last {border: 0; padding: 0; margin: 0;}
p.specialOffer a {text-decoration: none; color: #666}
p.specialOffer a:hover {color: #000;}
p.warning {font-weight: bold; color: #CC0000;}

.contentLeft {width: 390px; float: left; margin: 0; padding: 0;}
.contentRight {width: 150px; float: right; margin: 0; padding: 0;}
.contentRight img {border: 1px solid #999; margin-bottom: 1em;}

div.profile {border-bottom: 1px solid #ccc; overflow: hidden; margin-bottom: 15px;}
div.profile img {float: right; margin-left: 15px; margin-bottom: 15px;}
div.profile p {width: 395px;}

.blue {color: #0075ba;}
.mandatory {color: #f00;}
.errorbox {background-color: #efefef; padding: 10px;}
div.links {padding: 0.5em 0;}
.about {border-top: 1px solid #999; clear: both; padding-top: 1em; display: inline-block;}
.footnote {clear: both; border-top: 1px solid #666; border-bottom: 1px solid #666; margin-bottom: 1.5em; padding-top: 1em;}

div.glossary {border-bottom: 1px solid #bcdcfc; padding: 5px 0;}
div.glossary ol {margin: 0.2em 0 0;}

#mapZoom {width: 430px; text-align: center; font-weight: bold; margin-top: 0.5em;}

ul.sitemap li {margin-bottom: 0.4em;}
ul.sitemap ul {margin: 0.4em 0;}

.pdf {vertical-align: middle; margin-right: 5px;}


/* hacks to correct padding not being added to width in ie5.5 */
*html #titleBar {width: 750px; w\idth: 730px;}
*html #leftNav a {width: 165px; w\idth: 145px;}
*html #leftNav .subNav a {width: 155px; w\idth: 135px;}
*html #footer {width: 750px; w\idth: 565px;}
*html #contentRightColumn {width: 243px; w\idth: 223px;}
*html #contentLeftColumn {width: 282px; w\idth: 262px;}