/* ######################################################################### */
/* 

At this point all browser styles have been reset, now we're starting with a clean slate 

TIPS: 
1. to vertically align text within it's container just make it's line-height the same as the container height
2. when using transparent pngs as backgrounds make sure to include the filter workaround for ie6 and below
3. if centering the container div on the page make sure to set the body to "text-align: center" then the container div to "text-align: left"
4. use as few selectors as possible
5. use the body id="PAGEID" selector to show/hide navigation or cause elements on the page to act differently than the rest
6. use the CSS "sliding door" rollover method http://alistapart.com/articles/slidingdoors2/ instead of javascript
7. on ie6 "border: 1px dotted red" doesn't work. ie6 can't render anything other than a solid line under 2px
8. use the clearfix class workaround to make a block containing floated elements stretch to emcompass them

*/

/* DOMAIN styles */

/* default page colors and fonts */
body {color: #221d1b; font-family:Georgia, "Times New Roman", Times, serif; font-size:13px; line-height:17px; letter-spacing: 0px; background: #fff; background-image:url(../images/bg_body.jpg); background-repeat:repeat-x;}

a {color: #b40707; text-decoration: none;}
a:visited {color: #b40707; text-decoration: none;}
a:hover {color: #b40707; text-decoration: underline;}
a:active {color: #b40707; text-decoration: none;}


/* ######################################################################### */
/* STRUCTURE */

#container{
	margin:auto;
	width:900px;
}

#content{
  	width: 900px;
	padding-bottom: 30px;
}

#header{
	widh:875px;
	height:140px;
	float:right;
	
}

#logo{
	float:left;
  	display: block;
	width: 274px;
    height:107px;
	background-image:url(../images/logo_horseshoe.jpg);
	background-repeat:no-repeat;
	padding-top:15px;
	padding-left:45px;
}

#content_left {
	width:450px;
	float:left;
	padding-top:55px;
	/* background-color:#999999; */
}



#content_right {
	width:387px;
	float:right;
	padding-top:78px;
	padding-right:28px;
	padding-left:35px;

}

#content_products {
	width:900px;
	padding-left:30px;
	padding-right:30px;
	padding-top:50px;
}

#product_thumbs {
	float:left;
	width:275px;
	height:250px;
	padding:0 5px 5px 5px;

}

#product_thumbs p {
	color:#000;
	padding-left:15px;
	font-weight:bold;
}

#product_thumbs a {
	color:#000;
}


#product_thumbs_detail {
	float:left;
	width:174px;
	margin:0 15px 20px 20px;
	font-size:12px;
	font-family:"Times New Roman", Times, serif;
	text-align:center;
}

#product_thumbs_detail a {
	color:#000;
	padding-left:15px;
	font-weight:bold;
}


/* ######################################################################### */
/* APPEARANCE */

.red_font {
	color:#ab0c09;
}

/* navigation */


#navigation {
	width:515px;
	margin-top:75px;
  	font-size: .7em;
	float:left;
	padding-left:50px;
}

#navigation li{
  display: inline;
}

#navigation a{
	color:#d1b6b3;
	font-size:13px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:bold;
	padding-left:12px;
	letter-spacing: 1px;
	text-decoration:none;
	
}

#navigation a:hover {
	color:#fff;
	text-decoration:none;
}

#navigation li .active {
	color:#fff;
	text-decoration:none;
}

/* SUB navigation */


#navigation_sub {
	width:545px;
  	font-size: .8em;
	float:left;
	padding-left:370px;
	margin-top:-10px;
	margin-bottom:-10px;
}


#navigation_sub li{
  display: inline;
}

#navigation_sub a{
	color:#005342;
	font-size:10px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	padding:0 10px 0 15px;
	letter-spacing: .01em;
	border-left:#999999 solid 1px;
	
}

#navigation_sub a:hover {
	color:#005342;
	text-decoration:underline;
}

#navigation_sub li .active {
	color:#005342;
	font-weight:bold;
}





/* content */
#content h1{
  	color: #000;
	letter-spacing: -1px;
	line-height: 35px;
    padding: 12px 0px 15px 0px;
	font-size: 31px;
	font-weight: bold;
}


#content h2{
  	color: #080a0a;
	letter-spacing:normal;
	font-size:17px;
	line-height:21px;
	font-weight: bold;
}

#content h3{
  	color: #990000;
	letter-spacing:normal;
	font-size:15px;
	font-weight: bold;
	padding-top:15px;
}

dt {
	font-weight: bold;
}

dd {
	padding-bottom:14px;
}

strong {
	font-weight:bold;
}


#column h3 {
	padding-top:25px;

}

#content ul{
  list-style-type: square;
  margin: 20px;
}

#content strong{font-weight: bold;}
#content em{font-style: normal;}
#content p{
  margin: 1em 0;
}


/* footer */
#footer_wood {
    width:auto;
	height:30px;
	background-image:url(../images/bg_wood_bottom.jpg);
	background-repeat:repeat-x;
}

#footer_container {

	background-image:url(../images/bg_footer.png);
	background-repeat:repeat-x;
	height:1700px;	

}

#footer_content{

  	width: 900px;
	margin:auto;
	background-repeat:repeat-x;
	color:#fff;
}

#footer_thumbs {
	width:133px; 
	height:75px; 
	float:left; 

	padding-right:7px;
	padding-bottom:15px;
}

#footer_thumbs p a{
	line-height:30px;
	color:#fff; 
	font-size:11px;
	padding-left:10px;
}



#footer_content_right a {
	color:#ba874e;
}

#footer_content h2 {
	font-size:15px;
	padding-bottom:15px;
	font-weight:bold;


}


#footer_content_left {
	width:450px;
	float:left;
	margin:30px 0 0 0;

}

#footer_content_right {
	width:387px;
	padding-right:28px;
	padding-left:35px;
	float:right;
	padding-top:30px;

}

#dotted_line_footer {
	margin-top:15px;
	background-image:url(../images/dotted_line_footer.jpg); 
	background-repeat:repeat-x;

}


/* WORKAROUNDS */

/* clearfix, put on block elements that contain floated elements */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-block;}
/* \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* */