/* ----------------------------------------------------------------------------
Starts out with a 'clean' document, without standard whitespace
---------------------------------------------------------------------------- */
*, html{margin: 0;padding: 0;}
a img{ border:none;
}

/* ----------------------------------------------------------------------------
The code below is needed for clearing floats...
LINK: http://www.positioniseverything.net/easyclearing.html

Add a .clearfix class to the element you need to have expand: (the 'container')
---------------------------------------------------------------------------- */
.clearfix:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.clearfix {display:inline-block;}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */
/* ----------------------------------------------------------------------------
End Clearing code
---------------------------------------------------------------------------- */

.center{
	text-align:center;
}
.right{
	float:right;
	clear:both;
}
body{
font-size: 62.5%;
font-family:lucida grande, Helvetica, Arial, Geneva, sans-serif;
font-weight:normal;
color:#333;
background:#eae2c9;
}

div#add{
	float:right;
	width:100px;
	margin:0 44px;
	background: #eae2c9;	
}

div#wrap{
	width:700px;
	padding:5px;
	margin:0 auto;
	background: #fff url("../images/bgwrap.gif");
}
div#top{
	background: #eae2c9 url("../images/bgtop.gif") no-repeat;
	height:37px;
	width:710px;
	margin:0 auto;
	padding:0;
}

div#head{
	background:#fff url("../images/lead.jpg") no-repeat;
	color:#fff;
	padding:0;
	height:215px;
	width:690px;
	margin:10px 0 0 7px;
}
div#head h1{ display:none;}

div#content{
	width:660px;
	padding:20px;
	border:solid 0px red;}

img.payoff{
	margin:0 0 12px 0;
}

div#pictures a img{
	padding:3px;
	margin: 0 0 0 1px;
	border: solid 1px #ddd;
}

div#set{
	width:274px;
	height:214px;
	padding:20px;
	margin:24px 0px;
	background:#fcfcfb url("../images/bgitems.gif") no-repeat;
	float:left;
	border:1px #ddd dotted;
	
}
div#set.fivepack{
	margin:24px 0 0 26px;
}
div#price{
	display:inline;
}
div#price2{
	display:inline;
}
div#paypal{
	margin-top:14px;
	margin-left:-7px;
}
div#misc{
	border-top:#ddd dotted 1px;
	border-bottom:#ddd dotted 1px;
	padding:10px;
	margin:20px;
	
}

div#left{
	width:420px;
	float:left;
}
div#right{
	float: right;
	width: 195px;
	}
	
	
hr{
	border:0;
	border-bottom: solid 1px #eee;
	margin:24px 0;
}
div#footer{
	width:710px;
	height: 40px;
	margin:0 auto;
	padding:20px 0;
	background: transparent url("../images/bgfooter.gif") no-repeat;
}
ul#foot li{
	display:inline;
	color:#a6a494;
	text-transform: uppercase;
	margin:0 10px; 
}

ul#foot li a{
	color:#a6a494;
}
#foot a.current{
	color:#898167;
	font-weight:bold;
	border: none;
	}


/* ----------------------------------------------------------------------------
Typography
---------------------------------------------------------------------------- */

h2{
	font-family:lucida grande, Helvetica, Arial;
	text-shadow: #ccc 1px 1px 1px;
	text-transform: uppercase;
	color:#444;
	font-size:1.6em;
	line-height:1.3em; 
	margin: 0 0 10px 0;
}
h3{
	font-size:1.4em;
	text-shadow: #d9d1b9 1px 1px 1px;
	margin-bottom: 5px;
}

h3.price{
	font-size:1.6em;
	text-shadow: #ddd 1px 1px 1px;
	letter-spacing:-1px;
	padding:28px 0 10px 0;
	margin:0;
	width:74px;
	height:50px;
	color:#333;
	background:#fff url("../images/price.gif") no-repeat;
	float:right;
	clear:left;
	text-align:center;
}

h4{
	font-size:1.2em;
	margin: 0 0 4px 0;
	color:#444;
	font-weight:bold;
}
p{
	font: normal 1.2em "Lucida Grande", Helvetica, arial, sans-serif;
	line-height:1.8em;
	margin-bottom: 20px;
	color: #333;
}
div#right p{
	margin: 0 0 12px 0;
	font-size:1.1em;
	line-height:1.6em;
}
div#twitter_div ul{
	margin:5px 5px 0 0;
}
div#twitter_div ul li{
	background: url("../images/twitter.gif") left 5px no-repeat;
	margin:5px 0;
	padding: 5px 0 0 24px;
	list-style:none;
}

a {
	color: #04699a;
	border-bottom: 1px dotted #ccc;
	text-decoration: none;
}

a:hover {
	color: #000;
}