a {
text-decoration: none;
color: blue}
a:hover {
text-decoration: underline}

h1 {font-size: 170%;}
h2 {font-size: 150%}
table {font-size: 100%}
li {margin: 3px;}

.warning {color: red}

body {
margin-left: 10px;
font-family: 'Century Gothic', arial, helvetica, sans-serif;
color: #477;
font-size: 80%;
background-image: url(images/decor/handleback.jpg);
background-position: bottom right;
background-repeat: no-repeat;
}
div.main {
position: relative;
padding-top: 200px;
}
div.main-with-margin {
position: relative;
padding-top: 200px;
margin: 20px;
}


div#content {
padding-top: 200px;
padding-left: 250px;
padding-right: 250px;
text-align: justify;
}
div#content2 {
padding-top: 200px;
padding-left: 20px;
padding-right: 250px;
text-align: justify;
}
img#featured_product {
border: 1px solid black;
float: right;
margin-left: 5px;
margin-top: 5px;
margin-bottom: 1px;
padding-bottom: 1px;
}

div#header { /* Main header logo */
position: absolute;
top: 0px;
right: 5px;
background-image: url(images/decor/mainlogo4.jpg);
z-index: 1;
/*width: 575px; -- This is for mainlogo.jpg*/
/*width: 780px;*/ /* mainlogo3.jpg */
width: 910px; /*mainlogo4.jpg*/
/*width: 1100px;*/
height: 191px;
}

div#header-bar { /* Header layer to fill gap */
position: absolute;
top: 176px;
left: 0px;
/*width: 421px;*/
width: 200px;
height: 15px;
background-color: #699;
z-index: 2
}

div#top-left-nav { /* top left nav box */
position: absolute;
top: 0px;
left: 0px;
z-index: 2;
background-image: url(images/decor/gradient3.jpg);
width: 200px;
height: 191px;
text-align: right;
}
div#top-left-nav a { /* limks in top left nav */
color: white;
font-family: 'Century Gothic', arial, helvetica, sans-serif;
font-size: 120%;
text-decoration: none;
padding-right: 5px;

}
div#top-left-nav a:hover {
font-weight: bold}

div#top-left-nav div { /* links in top left nav */
height: 25px;
/*min-height: 30px;*/
margin: 5px;
margin-left: 5px;
padding: 2px;
}

div#vertical-bar { /* green-blue vertical strip in header */
position: absolute;
background-color: #9cc;
width: 20px; /*15px*/
height: 211px;
left: 200px;
top: 0px;
z-index: 2 }

div#black-box { /* fixed black background in middle of header */
position: absolute;
background-color: #9cc;/*black;*/
width: 750px;
height: 192px;
left: 220px;
top: 0px
}


div#top-nav { /* Top nav bar */
height: 20px;
width: 99%;
min-width: 740px;
background-color:#699;
position: absolute;
top: 191px;
left: 0px;
color: white;
font-family: 'Century Gothic', arial, helvetica, sans-serif;
}
div#top-nav a { /* Top nav bar links */
color: white;
text-decoration: none;
white-space: no-wrap;
z-index: 4
}


div#top-nav span {
padding: 10px;
}

div#top-nav-links { /* Links in top nav bar */
position: absolute;
color: white;
left: 225px;
top: 192px;
z-index: 5}

div#top-nav-links a {
color: white}
div#top-nav-links a:hover { /* Top nav bar hover */
text-decoration: underline
}


div#right-bar {
position: absolute;
top: 191px;
right: 5px;
width: 16%;/*180px;*/
height: 20px;
background-color: #9cc;
z-index: 4
}


/* left-hand (finish) nav bar */
div#left-nav {
position: absolute;
top: 80px;
color: #699;
}

/* right-hand (type) nav bar */
div#right-nav {
position: absolute;
top: 40px;
right: 2px;
color: #699;
text-align: left}

div#left-nav-container {
position: absolute;
left: 10px;
top: 250px;
left: 10px;
width: 250px;
height: 360px;
background-image: url(images/decor/leftnavlines2.gif);
background-repeat: no-repeat;
background-position: top right;
}


div#right-nav-container {
text-align: right;
position: absolute;
top: 230px;
width: 220px;
height: 500px;
right: 2%;
color: #699;
text-align: left;
background-image: url(images/decor/rightnavlines2.gif);
background-repeat: no-repeat;
background-position: top left;
}
div#right-nav-container2 {
text-align:center;
position: absolute;
top: 230px;
width: 220px;
height: 500px;
right: 2%;
color: #699;
}
div#right-nav-container2 p img {
border:1px solid #000000;
}

div#left-nav div {border: 1px solid black; margin-bottom: 20px;}
div#left-nav div a {padding-left: 5px; margin-top; 5px; color: #699; background-color: #eee; background-position: right; background-repeat: no-repeat;}
div#right-nav div {border: 1px solid black; margin: 10px;}
div#right-nav div a {padding-left: 5px; margin-top; 25px; color: #699; background-color: #eee; background-position:right; background-repeat: no-repeat;}

/*div#left-nav a:hover {
color: #669}*/
/*div#left-nav a {
font-weight: bold;
text-align: center}*/

/* left nav bar menu items */
div#left-nav div#steel a {
display: block;
background-image: url(images/decor/steel1.jpg);
width: 180px;
height: 53px;
font-weight: bold;}

div#left-nav div#brass  a {
display: block;
background-image: url(images/decor/brass1.jpg);
width: 180px;
height: 53px;
font-weight: bold}

div#left-nav div#other a {
display: block;
background-image: url(images/decor/other1.jpg);
width: 180px;
height: 53px;
font-weight: bold}

div#left-nav div#fastdelivery a {
	display: block;
	background-image: url(images/decor/fastdelivery.gif);
	width: 180px;
	height: 53px;
	font-weight: bold;
}

div#left-nav div a:hover{
background-color: #eff;
}

/* right nav bar menu items */
div#right-nav div#rose a {
display: block;
background-image: url(images/decor/rose1.jpg);
width: 160px;
height: 53px;
font-weight: bold;}

div#right-nav div#backplate  a {
display: block;
background-image: url(images/decor/backplate1.jpg);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#pull a {
display: block;
background-image: url(images/decor/pullhandles1.jpg);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#knobs a {
display: block;
background-image: url(images/decor/knobs1.jpg);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#cabinet a {
display: block;
background-image: url(images/decor/cabhandles1.jpg);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#accessories a {
display: block;
background-image: url(images/decor/accessories1.jpg);
width: 160px;
height: 53px;
font-weight: bold}


div#right-nav div#hinges a {
display: block;
background-image: url(images/decor/hinges1.gif);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#thumbturns a {
display: block;
background-image: url(images/decor/thumbturns1.gif);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#lockslatches a {
display: block;
background-image: url(images/decor/lockslatches1.gif);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#letterplates a {
display: block;
background-image: url(images/decor/letterplates1.gif);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#hooks a {
display: block;
background-image: url(images/decor/hooks1.gif);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#escutcheons a {
display: block;
background-image: url(images/decor/escutcheons1.gif);
width: 160px;
height: 53px;
font-weight: bold}

div#right-nav div#doordecoratives a {
display: block;
background-image: url(images/decor/doordecoratives1.gif);
width: 160px;
height: 53px;
font-weight: bold}









div#right-nav div a:hover{
background-color: #eff;
}

div#choose-by-finish {
position: absolute;
top: 0px;
background-color: #809dad;
color: white;
padding-left: 3px;
padding-right: 3px;
width: 200px;
height: 40px;
border: 1px solid black;
}
div#suppliers {
position: absolute;
top: 380px;
}
div#suppliers a:hover {text-decoration:none}

div#choose-by-type {
position: absolute;
top: 0px;
left: 0;
background-color: #809dad;
color: white;
padding-left: 3px;
padding-right: 3px;
width: 200px;
height: 40px;
border: 1px solid black;
}

div#company_address {
position: absolute;
top: 650px;
left: 20px;
background-color: #9cc;
color: black;
font-size: 100%;
border: 1px solid black;
padding: 5px;
-moz-opacity: 0.6;
filter:alpha(opacity=60);
}

img.featured_product {
float: left;
margin-right: 5px;
}

div#footer {
position: relative;
height: 90px;
width: 99%;
top: 10px;
/*bottom: 0%;*/
padding: 5px;
margin-top: 50px;
text-align: center;
font-size: 100%;
border-top: 1px dotted #008;
text-align: center;
}

div#footer a:hover
{text-decoration: underline}

h2 {border-bottom: 1px dotted #699}

div#search { /* Search box */
position: absolute;
right: 50px;
top: 220px
}

table.thumbs {
width: 100%
}

td.thumbnail {
border-bottom: 1px solid #699;
padding: 5px;
width: 150px;
/*font-size: 90%*/
}
td.thumbnail img {
border: 1px solid gray;
padding: 3px;
margin: 3px;
}
td.thumbnail a {
color: #477; /*#699*/;
}

div.page_list { /* Page list generated by SmartyPaginate on thumbnails pages  */
position: relative;
margin-left: 400px;
margin-top: 0px; padding-top: 0px;
top: -20px;
}
form#sort_options {margin: 0px}

img.product_image { /* Main product image on product page */
border: 1px solid gray;
padding: 5px;
margin: 5px;
position: relative;
left: 1%; /*5%;*/
background: white;
}


table.cart_summary { /* Shows number of items and cart total */
position: absolute;
left: 5px;
top: 175px;
width: 180px;
color: black;
font-size: 95%;
font-weight: bold;
z-index:3}
table.cart_summary a {
color: white}
table.cart_summary img {
border: none}

div.product_description {
position: relative;
left: 1%; /*5%;*/
width: 360px;
padding-bottom: 20px;
}

table.product_details {
position: relative;
left: 3%; /*8%*/
font-size: 100%
}
table.product_details td.product_attribute {
text-align: right;
font-weight: bold}

div#buy-options {
position: absolute;
margin-left: 390px; /*380px*/
left: 2%; /*5%*/
top: 290px;
z-index: 10;
}

div#product_rhs {
position: absolute;
top: 0%;
padding-top: 220px;
/*right: 1%;*/
left: 45%;
/*right: 0px;*/
padding-left: 290px;
/*width: 180px;*/
width:auto;
text-align: right;
/*text-align: left*/
}


div.matching_products {
}
div.other_colors {
}
div#enhancements {
position: relative;
left: 5%}

a img {
border: 1px solid gray}

table.cart {
border: 1px solid gray;
margin-left: 5%;}

table.cart td {
padding-left: 10px;
padding-right: 10px;}
table.cart th {
background-color: #ddd}

table.cart a img {border:none}
table.shipping th
{background-color: #ddf;
font-weight: normal;
 border-bottom: 1px solid #ccc}
table.shipping td
{font-size: 80%;}
table.cart th.total {width: 10%;}
table.shipping th#carriage {width: 10%;  border-bottom: 1px solid #ccc}
table.shipping td{border-bottom: 1px solid #ccc}

table.shipping th#VAT_deduction {color: red}
table.shipping tr#total th {font-weight: bold}
table.shipping tr#total th {font-weight: bold}

.flat {
background-color: #9cc;
border: 1px solid gray;
cursor: pointer;
font-weight: bold;
padding: 2px;
}
.white-button {
background-color: white;
border: 1px solid gray;
cursor: pointer;
}
/* Measurements on product page */
input.measurement {border:none; color: #477; background:white; font-size: 80%}
input#toggle_button {position: absolute; bottom: -50px; z-index:10; border: 1px solid gray; font-size: 80% }
input#current_unit {position: absolute; bottom: -20px; z-index:5; border: none; font-size: 80%; font-weight: bold; }

table#measurements {position: absolute; bottom: -120px; left: 150px; z-index: 5; border: 1px solid gray}


table.cart_options {
width: 650px;}
.removeItem {text-align: center}
.removeItem  a {
color: red;}
.removeItem a:hover {
font-weight: bold;
text-decoration: none}
td.checkout {width: 10%}

p.note {font-weight: bold; text-align: left}
p.sub_note {text-align: left;}

/* Billing address on checkout page */
table#addresses td#billing_details
{border-left: 1px solid #ccc}

/* Shipping notes on checkout page */
td.shipping {
font-size: 90%;
text-align: right;
}
th#VAT_deduction {color: red; font-weight: normal} /* VAT deduction cell on checkout */
th#carriage {font-weight: normal} /* Carriage cost cell on checkout */

form#search_form {
margin-bottom: 0px;
}


/* FAQ page */
dd {margin-bottom: 5px; margin-top: 5px}
dt {margin-top: 10px; font-weight: bold}

div#diagram {
position: absolute;
top: 360px; /*380px */
margin-left: 420px;
left: 1%; /*5%*/
background-repeat: no-repeat;
}

span.red {color:red}

div#advsearch {
margin-left: 250px;
}