/* @override 
	http://socksofdoom.dev/css/main.css
	http://socksofdoom.dev/css/main.css
	http://localhost/ask_mr_percy/css/main.css
	http://www.socksofdoom.com/css/main.css
*/

body{
	background:  url(header.gif) top center no-repeat;

}
#twitter_conversation, div.intro,div.box, div.joinin,body.about h3{
	font-family: "Comic Sans", "Comic Sans MS" ;
}
div.container{

	width: 710px;
	margin: 0 auto;
	padding-top:120px;
}

div.container h1{
	position: absolute;
	left: -9999px;
}

a img{
	border: none;
}

ul#top_nav{
	
x		background:  url(top_nav_up.gif) top 1 no-repeat;
		height: 59px;
		margin-left: 0px;
		padding:0px;
}


ul#top_nav li{
	text-indent: -9999px;
	margin-right: 0;
	margin-top: 10px;
	list-style: none;

	width:236px;
	height: 45px;
	float: left;
}
ul#top_nav li a{

	display: block;
	height: 45px;
}
ul#top_nav li.book{
	margin-left: 0px;
	background: url(top_nav_up.gif) no-repeat -240px -10px;
	display: block;
	height: 45px;
}

ul#top_nav li.book a.thispage{
	background: url(top_nav_thispage.gif) no-repeat -240px -10px;
}

ul#top_nav li.book a:hover{
	background: url(top_nav_over.gif) no-repeat -240px -10px;

}

ul#top_nav li.percy{
	margin-left: 0px;
	background: url(top_nav_up.gif) no-repeat -4px -10px;
	display: block;
	height: 45px;
}

ul#top_nav li.percy a.thispage{
	background: url(top_nav_thispage.gif) no-repeat -4px -10px;
}

ul#top_nav li.percy a:hover{
	background: url(top_nav_over.gif) no-repeat -4px -10px;
}

ul#top_nav li.contact{
	x margin-left: 20px;
	background: url(top_nav_up.gif) no-repeat -475px -10px;
	display: block;
	height: 45px;
}
ul#top_nav li.contact a.thispage{
	background: url(top_nav_thispage.gif) no-repeat -475px -10px;
}
ul#top_nav li.contact a:hover{
	background: url(top_nav_over.gif) no-repeat -475px -10px;
}

div.wrapper{

	margin: 0 4px;
}


div.intro{
	background: #600 url(/box_top.gif) top left repeat-x;

}
div.intro div.inner{	padding: 10px 40px;
	background: url(/box_bottom.gif) bottom left repeat-x;
}
div.intro img.mr_percy_portrait{
	float: right;
	margin-top: 20px;
	margin-left: 20px;
}

div.intro p{
	color: #fff;
	font-size: 23px;
}

div.intro p a:link,
div.intro p a:visited,
div.intro p a:hover,
div.intro p a:active
{
	color: #00c2c1;
	font-size: 23px;
	text-decoration: none;
}


div.fromthebook{
	background-color: #dbdccf;
}
body.about h3{
	color: #007072;
	font-weight: normal;
	margin-top: 15px;
}

body.about div.fromthebook h3{
	padding: 20px  0 0 20px;
}

div.fromthebook img{
	margin-left: 45px;
	margin-bottom: 30px;
	text-align: center;
}
#twitter_conversation{
	
	height: 450px;
	overflow:auto;
	padding-left: 0;
	position: relative;
	padding-top: 30px;
	background-color: #dbdccf;
	margin-bottom: 0;
	border: 1px solid gray;
}

#twitter_conversation li{
	width: 510px;
	position: relative;
	list-style: none;
	margin: 0;
	margin-left: 80px;
	margin-bottom: 40px;
	margin-top: -24px;
}

#twitter_conversation li.joecreate{
	
	margin-left: 110px;

}

div.tweet{
	background:url(../graphics/new_speech_bubble_box.gif);
	background-color: #fff;
	padding-top: 10px;

}
div.body{position: relative;
	padding: 0 10px 0 10px;
	background:url(../graphics/new_speech_bubble_box.gif) bottom;

}

li.to div.tweet{
	background:url(../graphics/commenter_speech_bubble_box.gif);

}
li.to div.body{
	background:url(../graphics/commenter_speech_bubble_box.gif) bottom;

}

#twitter_conversation p.body{
	position: relative;
	top: -15px;
	font-size: 90%;
	line-height: 1.4;
	letter-spacing: -0.5px;
	z-index: 100;
}
#twitter_conversation li span.author{
	display: none;
}

#twitter_conversation li.dateline{
	margin-top: -5px;
	font-size: 20px;
	color: #007072;
}

#twitter_conversation li.to{
	padding-top: 1em;
	position: relative;
	margin: 0;
	left:80px;
}
#twitter_conversation li.to div.tweet{
	position: relative;
	top: -40px;
}
#twitter_conversation li img{
	position: absolute;
	bottom: -10px;

	}
	
#twitter_conversation li.Zee_Beatty img{
	left: -54px;
}

#twitter_conversation li.to img, #twitter_conversation li.from.Mr_Percy img{
	right: -54px;
	
}
#twitter_conversation li a.image:hover{
	background-color: none;
}
#twitter_conversation li a.image{
	position: absolute;
	display: block;
	z-index: 10;

	bottom: -0px;
	height: 31px;
	width: 35px ;
	padding: 0;
	margin: 0;
	background-image:  url(../graphics/new_speech_bubble_arrows.gif);
}
#twitter_conversation li.to a.image{
		background-image:  url(../graphics/commenter_speech_bubble_arrows.gif);
	}
#twitter_conversation li.to a.image, #twitter_conversation li.Mr_Percy a.image{
	right: -17px;
	background-position: right;
}
#twitter_conversation li.Zee_Beatty a.image{
	left: -17px;
	background-position: left;
}

#twitter_conversation li a{
	font-weight: bold;
	
	padding: 0px 5px;
	margin: 0 -5px;
}
#twitter_conversation li a:hover{
		background-color: #e6eef3;
}
#twitter_conversation li p{margin-bottom:0;}
#twitter_conversation li p,#twitter_conversation li a{
	color: #2f678a;
}
#twitter_conversation li span{
	color:#aaa	;
	padding-right:0.3em;
	font-size:12px;
}
#twitter_conversation li.Zee_Beatty p,#twitter_conversation li.Zee_Beatty a{
	color: #701400;
}

#twitter_conversation li.Mr_Percy p,#twitter_conversation li.Mr_Percy a{
	color: #0c7173;
}

a:link,
a:visited,
a:hover,
a:active
 {
	color: #600;
	text-decoration:none;
}



div.joinin{
	margin-top: 10px;
	x padding: 10px 40px;
	background-color: #dbdccf;
	
	x color: #000;
}
div.joinin div.inner{
	background-color: #86eaeb;
	padding: 10px 0 10px 200px;
}
div.joinin h3{
	float: left;
	position: absolute;
	margin: 8px 0 0 -180px;
	border-color: #600;
	color: #600;
	font-size: 150%;
	
}

div.joinin p,
div.joinin a{
	color: #000;
	clear: both;
	font-size: 14px;
	line-height:1.4ems;
	font-family: verdana;
}

div.joinin a{
	font-weight: bolder;
	x text-decoration: underline;
	
}

div.joinin p{
	margin-right: 15px;
}

div.joinin p.followbutton{
	clear: none;
	float: left;
	margin-right: 20px;
	margin-top: -10px;
}
div.joinin p img{
	float: right;
	x position: relative;
	margin: 0px 0 0 15px;
}


div.boxes{
	margin-top: 10px;
	display:block;
	float: left;
}

div.box{
	float: left;
	margin-right: 16px;
	background: #600 url(/box_top.gif) top left repeat-x;
	width: 223px;

}
div.box div.inner{

	background: url(/box_bottom.gif) bottom left repeat-x;
}
div.box *{
	color:#fff;
	text-decoration: none;
	
}

div.buyprinted{
	margin-right: 0;
	background-position: top center;
}

div.buyprinted div.inner{
	background-position: bottom center;
}

div.buyebook{
	background-position: top right;
}
div.buyebook div.inner{
	background-position: bottom right;
}
img.boxicon{
	float: left;
	margin: 5px 0 0 5px;
}

span.title{
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	display: block;
	margin-left: 70px;
	font-weight: bold;
	font-size: 15px;
}
span.description{
	display: block;
	font-size: 9px;
	text-align: center;
	padding-bottom: 5px;
}

div.about{
	background-color: #dbdccf;
	overflow: auto;
margin-top: 10px;
padding-bottom: 10px;
line-height: 1.4em;

}
div.about p{
	font-family: Verdana, Arial,sans-serif;
	font-size: 12px;
}
div.col1,div.col2{
	width: 45%;
	float: left;
	margin-left: 3%;
}


p.moredetails{
	font-family: Verdana, Arial,sans-serif;
	font-size: 20px !important;
}

.smallprint {
	font: 0.7em verdana;
}	

form {
	font: 0.9em verdana;
	}

input{
	width: 300px;
}

textarea {
	height: 100px;
	width: 300px;
}

label.short {
	width: 300px;
	display: block;
	background-color: ;
}