@charset "utf-8";

/** 
IMPORTANT NOTE: when referencing any ID's, you must define it as:
div#myID or table#myOtherID, as the shopsite comment system is
to start a line with a hash tag. defining a style as just #myID
will comment out that line and consequentially mess everything up.
**/

/************************************/
/*            MAIN STYLES           */
/************************************/

*{
	padding:0;
	margin:0;
	font-size:10pt;
}

HTML {
	height:100%;
	/* allows body to grow to full window height */
}

body{
	background: #F3F5F7 url(http://store.ideas-for-deck-designs.com/media/design/woodBG_fullBG.jpg) repeat-y 1000px 0;
	font-family:Verdana, Geneva, sans-serif;
	position:relative;
	/* otherwise footer will position itself in relation to window height */
	min-height:100%;
	/* makes page start out at least as tall as the browser window */
	margin:0;
	padding:0;
	/* not strictly required but useful. reset to push body to edges of browser window */
}

div#content a{
	color:#AF896B;
	text-decoration:underline;
}

a{
	color:#AF896B;
	text-decoration:none;
}

a img{
	border:none;
}

p{
	padding:5px 0;
}

div#content li{
list-style:circle inside;
}

.centerIt{
	margin:auto;
	text-align:center
}

.hbg{
	border-top: 1px solid #AF896B;
	background:#EAE5CF;
	padding:3px 5px 5px 5px;
	margin-top:10px;
}

div#wrapper{
	width: 1000px;
	position:relative;
	border-right:2px solid #202020;
	background: #F3F5F7 url(http://store.ideas-for-deck-designs.com/media/design/woodBG_full.jpg) repeat-x;
	padding-bottom:20px;
	/* must match or exceed the footer height, so bottom-most content doesn't float bellow footer */
	overflow:hidden;
	/* this will contain any floated elements and push the footer down below them
	   NOTE: do not add a height to this element, or this will fail */
}

/*********** HEADER ***********/
div#header{
	height: 150px;
	background: url(http://store.ideas-for-deck-designs.com/media/design/woodBG_original.jpg);
	margin:0;
	padding:5px;
}
div#header .slideshow{
	display:block;
	position:absolute;
	overflow:hidden;
	top:5px;
	left:230px; 
	height:150px;
	width:765px;
	background:#FFF;
}
div#featuredProduct .slideshow{
	display:block;
	width:300px;
	height:300px;
	overflow:hidden;
	background:#FFF;
}
div#info{
	background:#561212;
	border:2px solid #333333;
	color:#EEEEEE;
	display:block;
	font-weight:bold;
	padding:5px 8px;
	margin-left: 195px;
	text-align:center;
}
div#info p{
	margin-bottom:5px;
}

.ccards{
	position:absolute;
	top:100px;
	right:0;
	background: url(http://store.ideas-for-deck-designs.com/media/design/ccards.png) left top no-repeat;
	padding: 4px 6px 32px 240px;
	z-index: 100;
}

div#search{
	position:absolute;
	top:133px;
	right:5px;
	z-index: 150;
}

/*********** NAV ***********/
div#nav{
	height: 20px;
	border-top: 2px solid #AF896B;
	border-bottom: 2px solid #AF896B;
	background:#EAE5CF;
	color:#AF896B;
	padding:3px 5px 0 5px;
}

div#nav a:link,
div#nav a:visited{
	color: #AF896B;
}

div#nav a:hover,
div#nav a:active{
	color: #960;
}

div#nav li{
	display:inline;
}

/*********** PRODUCT LIST ***********/
div#productList{
	background: URL(http://store.ideas-for-deck-designs.com/media/design/productListBG.gif) no-repeat bottom right;
	width: 175px;
	color:#EAE5CF;
	padding: 0 10px 10px 10px;
	position:absolute;
	left:0px;
}

div#productList ul{
	list-style-type:none;
	list-style-position:outside;
}

div#productList li{
	margin-left:15px;
}

div#productList li.noIndent{
	/*margin:0 0 10px 0;*/
}

div#productList li.liHeader{
	margin: 7px 0 0 0;
	font-weight:bold;
}

div#productList a:link,
div#productList a:visited{
	color: #EAE5CF;
}

div#productList a:hover,
div#productList a:active{
	color: #F3F5F7;
}

/*********** CONTENT AND FOOTER ***********/
div#content{
	margin:10px 10px 0px 200px;
}

div#content h1.name{
font-size:18px;
}

div#text1 p{
font-size:12px;
}

div#footer{
/*	position:absolute;
	bottom:0px;
*/
	/* those two lines will force footer to the bottom of the page. */
	color:#999;
	width: 1000px;
	border-right:2px solid #202020;
	background:#FFF;
	clear:both;
	padding: 16px 0 0 0;
	height:50px;
	z-index: 1;
}

div#footer a{
	color:#999;
}

div#footer ul.footerLinks{
	display:block;
	text-align:center;
	margin:auto;
}

div#footer ul.footerLinks li{
	display:inline;
	border-left: 1px solid #999;
	padding-left:5px;
}

div#footer ul.footerLinks li:first-child{
	display:inline;
	border: none;
}

.red{
	color: #900;
}

.clearit{
	clear:both;
}

hr{
	height:1px;
	width:90%;
	border:none;
	background:#AF896B;
	margin:20px auto;
}

/********** Product Table ***********/

table#productTable td{
	border:5px solid #FBFBFB;
	background: #FBFBFB;
	padding:20px;
}

table.pcs_table td{
	border:5px solid #FBFBFB;
	background: #FBFBFB;
	padding:5px;
}

table#productTable .productGraphic,
table.pcs_table .productGraphic{
	text-align:center;
	display:block;
	margin:auto;
}

table#productTable .productPrice,
table.pcs_table .productPrice{
	float:left;
	color:#900;
}


table#productTable .productPrice strong,
table.pcs_table .productPrice strong{
	font-size:12pt;
}

table#productTable .productSubproduct{
	width:100%;
	float:right;
}

table#productTable .productSubproduct select{
	width:60%;
}

img{
	border:none;
}

.notSale{
	font-size:8pt;
	text-decoration:line-through;
	color:#000;
}

.floatRight{
	float:right;
}

div#links{
	width:138px;
	display:block;
	position:fixed;
	bottom:0;
	left:5px;
	background: url(http://store.ideas-for-deck-designs.com/media/design/linksbg.png) top center no-repeat;
	padding:15px 0 3px 0;
	text-align:center;
	z-index:150;
}
div#links li,
div#links a{
	list-style-type:none;
	color:#FFF;
	font-weight:bold;
	padding:0 0 5px 0;
}


/********** Contact Forms ***********/

fieldset.contact{
	display:inline;
	padding:20px;
	margin:5px;
	background:#F3F5F7;
}
.contact label{
	position:absolute;
	margin:5px;
}
.contact input[type=text], .contact textarea{
	margin:5px 5px 5px 90px;
}
.sentMessage{
	border:1px solid #000;
	display:block;
	width:500px;
	margin:20px auto;
	padding:10px;
	background: #F3F5F7;
}

.sentMessage label{
	position:absolute;
	padding:5px;
}
.sentMessage p{
	margin-left: 90px;
}
img.shipWorldwide{
	position:absolute;
	top:436px;
	left:-2px;
}

ul.salesList{
	margin:5px 5px 5px 30px;
}

ul.salesList li{
	margin:10px 0;
}

.shippinNotes{
	position: absolute;
	top: 322px;
	left: 700px;
	width: 300px;
	color: #900;
}
