html, body {
	height: 100%;
}
/* fixes IE6 */
* html #container, 
* html #container_tile,
* html #page {
	height: 100%;
}
#container,
#container_tile,
#page {
	min-height: 100%;
}
/* don't change css above - this makes the page bg stuff align correctly */

body, div, table, tr, th, td, form, img, p {
	border: 0;
	margin: 0;
	padding: 0;
}

p {
	line-height: 20px;
	margin: 10px 0 10px 0;
}

a {
	text-decoration: none;
}

h2 {
	margin: 10px 0 10px 0;
	padding: 0;
}

/*********************/
/* appearance styles */
/*********************/

/* background-color styles */

body {
	background-color: #DCEAE4;
}
#header {
	background-color: #B4C8C0;
}
#main,
#content
{
	background-color: #C1D1CB;
}
#content_left, 
#content_right,
#content_inside,
#content_cart
{
	background-color: #F2F4F3;
}
#footer {
	background-color: #AABEB7;
}

/* border styles */

h2 {
	border: 0;
	border-bottom: 1px solid #721A2D;
}
#header, #main, #footer {
	border-right: 4px solid #7D9F92;
}
#content_right img {
	border: 2px solid #B0C4BD;
}
#footer {
	border-bottom: 1px solid #7D9F92;
}

/* color styles */

body, div, table, tr, th, td, form, img, p {
	color: #394842;
}
#menu .submenu_link .menu_link {
	color: #245F7D; /* submenu item color , teal from 'Crafted in the USA' image */
}
.red {
	color: #721A2D; /* submenu item color , teal from 'Crafted in the USA' image */
}

h2, h2 a, h3, h5,
.error,
.errorMessage,
.required,
a#selected,
#menu .submenu_link a#selected,
#content_right p 
{
 	color: #721A2D; /* dark red from text in content header image */
}
h1, h4, h6, a  {
	color: #317358; /* dark green from text in flash */
}
a:hover {
	color: #6AA08C;
}
#webdevelopment {
	color: #666666;
}

/* font styles */

body, div, table, tr, th, td, form, img, p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
}
#menu {
	font-size: 12px;
	font-weight: bold;
}
#menu .submenu_link .menu_link {
	font-size: 12px;
	font-weight: normal;
}
h1 {
	font-size: 130%;
	font-weight: bold;
	line-height:120%;
}
h2 {
	font-size: 140%;
}
h3 {
	font-size: 130%;
}
h4 {
	font-size: 120%;
}
h5 {
	font-size: 110%;
}
h6{
	font-size: 100%;
}


/* text styles */

.menu_link,
#sideicons,
#webdevelopment,
#content2 #content_inside h1 
{
	text-align: right;
}
#page {
	text-align: center;
}
#layout,
#content_inside,
#content_left, 
#content_right,
#content_cart
{
	text-align: left;
}

/*****************/
/* layout styles */
/*****************/

#page {
	position: relative;
	bottom: 0;
	height: 100%;
	min-height: 100%;
	top: 0;
	width: 100%;
}

/* bg effect styles */

#container {
	background-image: url(../images/body_bg_grad.jpg);
	background-position: bottom left;
	background-repeat: repeat-x;
	width: 100%;
}
#container_tile {
	background-image: url(../images/bg_tile.gif);
	background-position: bottom left;
	background-repeat: repeat;
	height: auto !important;
	width: 100%;
}

#layout {
	height: auto;
	width: 1000px;
}

/* logo styles */

#logo {
	height: 103px;
	left: 75px;
	position: relative;
	top: 30px;
	width: 179px;	
	z-index: 400;
}

/* header, main, footer styles */

#header, #main, #footer {
	left: 165px;
	position: relative;
	top: -103px; /* this is necessary cause of the logo image being over top the header and main areas was making these drop down 103px */
	width: 707px; /* 711 (original width) - 4px (right border) */
}

/*---------------*/
/* header styles */
/*---------------*/

#header {
	background-image: url(../images/header_bg.jpg);
	background-repeat: repeat-x;
	height: 81px;
}

#header_slogan {
	float: left;
	left: 20px;
	position: relative;
	top: 5px;
}

#header_menu {
	float: right;
	position: relative;
	top: 45px;
}

#header_menu img {
	padding: 10px;
}

/*-------------*/
/* main styles */
/*-------------*/

#main {
	height: 100%;
/*	height: 663px;  /* 688 (total height) - 14 (top padding) - 11 (bottom padding) */
	padding: 14px 14px 11px 13px;
	width: 680px; /* 707 (total width) - 14 (right padding) - 13 (left padding) */
}
#main_image {
}
#content {
	height: 100%;
	margin-top: 13px;
	width: 680px; /* 707 (total width) - 14 (right padding) - 13 (left padding) */
}
#content2 #content_inside h1,
#content_cart h1.pageHdr
{
	margin-left: 50px;
}
.pageHdr {
	text-align: right;
}

/*-------------*/
/* menu styles */
/*-------------*/

#menu {
	height: auto;
	line-height: 150%;
	padding: 15px 0 15px 5px;
	position: absolute;
	top: 135px;
	width: 160px;	
	z-index: 100;
}
#sideicons {
	height: auto;
	padding: 15px 0 15px 5px;
	position: absolute;
	top: 325px;
	width: 160px;	
	z-index: 100;
}
.menu_link {
	display: block;
	padding: 1px;
	width: 155px;	
}
.menu_image {
	height: 10px;
	margin-left: 5px;
	padding-left: 10px;
	width: 10px;
}
a#selected .menu_image {
	background-image: url(../images/menu_arrow_red.gif);
	background-position: center;
	background-repeat: no-repeat;
}
a:hover .menu_image {
	background-image: url(../images/menu_arrow.gif);
	background-position: center;
	background-repeat: no-repeat;
}

/*---------------*/
/* footer styles */
/*---------------*/

#footer {
	background-image: url(../images/footer_bg.jpg);
	background-repeat: repeat-x;
	clear: both; /* this is needed to clear the content float values so the footer lines up under main / content area correctly */
	height: 31px;
}
#webdevelopment {
	height: 14px;
	padding: 10px 5px 5px 5px;
	width: 693px;
}

/********************/
/* home page styles */
/********************/

#content_left, #content_right {
	height: auto;
/*	height: 294px; /* 320 (total height) - 13px (top padding) - 13px (bottom padding) */
}
#content_left {
	float: left;
	padding: 13px;
	width: 382px; /* 406 (total width) - 13px (right padding) - 13px (left padding) */
}
#content_right {
	float: right;
	padding: 13px 11px 13px 11px;
	width: 240px; /* 262 (total width) - 11px (right padding) - 11px (left padding) */
}
#content_clear { /* this div was added purely to fix the height issue for the main div on the home page */
	clear: both;
}

/**********************/
/* inside page styles */
/**********************/

#content_inside,
#content_cart
{
	height: auto;
/*	height: 294px; /* 320 (total height) - 13px (top padding) - 13px (bottom padding) */
	padding: 13px;
	width: 654px; /* 680 (total width) - 13px (right padding) - 13px (left padding) */
}


/*********************/
/* cartweaver styles */
/*********************/

table#cart, table#cart th, table#cart td,
table#billing, table#billing th, table#billing td,
table#carddata, table#carddata th, table#carddata td,
table#login, table#login th, table#login td,
table#registration, table#registration th, table#registration td,
table#confirmation, table#confirmation th, table#confirmation td
{
	border: 1px solid #7D9F92;
	border-collapse: collapse;
}
table#cart th, 
table#billing th,
table#carddata th,
table#login th,
table#registration th,
table#confirmation th
{
	background-color: #C1D1CB;
}
table#cart td,
table#billing td,
table#carddata td,
table#login td,
table#confirmation td
{
	background-color: #E6E6E6;
}

table#tableProductDetails,
table#tableSearchResults td
{
	background-color: #FFFFFF;
	border: 1px solid #C1D1CB;
}
table#tableProductDetails,
{
	margin: 0;
	width: 654px;
}
table#registration,
table#cart,
table#confirmation {
	width: 100%;
}
table#tableProductDetails td,
table#confirmation td
{
	padding: 5px;
}
.productOrderBox {
	background-color: #E6E6E6;
	padding: 5px;
}
table#tableSearchResults td {
	margin: 10px;
	width: 45%;
}
table.tabularData {
	margin-bottom: 10px;
}

table.tabularData td, table.tabularData th {
	padding: 5px;
}
/* altRowEven & altRowOdd are used to style alternating table rows. */
table#registration .altRowEven {
	background-color: #E6E6E6;
}
table#registration .altRowOdd{
	background-color: #D6D6D6;
}

/* gallery page */

.gallery_image {
	margin: 5px;
}

/* fixes it so the HD logo doesn't have a border around it */

img.noborder {
	border: 0;
}
