/*
	Author: Evan Allrich
	Email: eallrich@gmail.com
	Website: http://www.unguku.com/
	Version: 1.8
	Updated: April 10, 2009
*/

* {
	border:				0;
	margin:				0;
	padding:			0;
}


/* ***********************************
	general
   *********************************** */
.left {
	float:				left;
	margin:				0 10px 0 0;
}

.right {
	float:				right;
	margin:				0 0 0 10px;
}

a {
	color:				#440044;
	text-decoration:	none;
}
	
a:hover {
	color:				#666;
	text-decoration:	underline;
}


/* ***********************************
	body
   *********************************** */
body {
	background:			#fff url('images/header.jpg') repeat-x top;
	color:				#FFFFFF;
	font-family: 		Verdana, "Trebuchet MS", Georgia, "Times New Roman", Times, serif;
	font-size: 			0.9em;
}


/* ***********************************
	header
   *********************************** */
#header {
	background:			url('images/header_image.jpg');
	background-repeat:	no-repeat;
	height:				88px;
	margin:				0 auto;
	position:			relative;
	width:				760px;
}

#header h1 {
	color:				#555555;
	font-size:			40px;
	font-weight:		400;
	left:				71px;
	letter-spacing:		-2px;
	position:			absolute;
	top:				59px;
}

#header a {
	color:				#555;
	text-decoration:	none;
}

#header a:hover {
	color:				#555;
	text-decoration:	none;
}

#mainlink {
	position:			relative;
	width:				72px;
	height:				21px;
	color:				#FFF;
	text-align:			center;
}

#mainlink.home {
	left:				34px;
}

#mainlink.files {
	top:				-21px;
	left:				110px;
}

#mainlink.blog {
	top:				-42px;
	left:				186px;
}

#mainlink.about {
	top:				-63px;
	left:				262px;
}

#mainlink a {
	text-decoration:	none;
	color:				#FFF;
	height:				56px;
	display:			block;
	width:				72px;
}

#mainlink a:hover {
	background-color:	#660066;
	color:				#EEE;
	text-decoration:	none;
}


/* ***********************************
	content
   *********************************** */
#content {
	height:				auto;
	margin:				0 auto;
	width:				700px;
}

#content:after {
	clear:				both;
	content:			'.';
	display:			block;
	height:				0;
	visibility:			hidden;
} 


/* ***********************************
	main
   *********************************** */
#main {
	float:				left;
	position:			relative;
	left:				30px;
	width:				500px;
}

#main p {
	color:				#444;
	line-height:		18px;
	padding:			5px;
	font-size:			12px;
	position:			relative;
	left:				10px;
	width:				480px;
}

#main p a {
	text-decoration: 	underline;
}

#main h1 {
	font-size:			18px;
	font-weight:		400;
	color:				#660066;
	line-height:		25px;
	padding:			0 6px;
}

#main h1:hover {
	text-decoration:	underline;
}

#main h6 {
	font-size:			18px;
	font-weight:		400;
	color:				#660066;
	line-height:		25px;
	padding:			0 6px;
}

#main h2 {
	font-size:			13px;
	font-weight:		300;
	border-bottom:		2px solid #660066;
	color:				#444;
	line-height:		25px;
	padding:			0 20px;
}

#main h3 {
	font-size:			15px;
	font-weight:		300;
	color:				#660066;
	position:			relative;
	left:				15px;
}

#main h3:hover {
	text-decoration:	underline;
}

#afterpost a {
	text-decoration: 	none;
	margin:				10px 0 10px 0;
}

#afterpost a:hover {
	color:				#666;
	text-decoration:	underline;
}

#main.endpost {
	float:				none;
	margin:				0 auto;
	position:			relative;
	border-bottom:		1px solid #660066;
	width:				100px;
}


/* ***********************************
	comments
	
	These settings are based on the ones
		Shamus Young uses on Twenty Sided Tale:
			http://www.shamusyoung.com/twentysidedtale
   *********************************** */
#comment {
	float:				left;
	position:			relative;
	width:				500px;
	color:				#444;
}

#comment p {
	width:				430px;
}

#comment.formcontainer {
	width:				450px;
	padding:            5px;
    border:             1px dotted #888;
  	background-color:	#CC99FF;
	float:				left;
	position:			relative;
	left:				15px;
}

#comment.commentcontainer
{
    width:              500;
    max-width:          500;
}

#comment.oddcomment {
    padding:            5px;
    width:              450px;
    border:             1px dotted #888;
  	background-color:	#FFCC99;
	float:				left;
	position:			relative;
	left:				15px;
}

#comment.evencomment {
	padding:            5px;
    width:              450px;
    border:             1px dotted #888;
  	background-color:	#99FFFF;
	float:				left;
	position:			relative;
	left:				15px;
}

#comment.admincomment {
    padding:            5px;
    width:              450px;
	border:             2px dotted #330066;
	background-color:	#CC99FF;
	float:				left;
	position:			relative;
	left:				15px;
}

#comment.comment_name {
    font-size:          larger;
}

#comment.commenttext {
    max-width:          440;
    overflow-x:         hidden;
}

#comment.commentdata {
    font-size:          x-small;
	text-decoration:	none;
}

#comment.date {
    margin-top:         100px;
    font-family:        Verdana, Tahoma, Helvetica, Arial, sans-serif;
    font-size:          large;
    color:              #888888;
    font-variant:       small-caps;
}



/* ***********************************
	sidebar
   *********************************** */
#sidebar {
	float:				right;
	width:				150px;
}

#sidebar h1 {
	border-bottom:		2px solid #660066;
	color:				#444;
	font-size:			15px;
	font-weight:		400;
	line-height:		30px;
	padding:			0 10px;
}

#sidebar ul {
	margin:				5px;
}

#sidebar ul li {
	border-bottom:		1px solid #660066;
	list-style:			none;
	padding:			2px 1px;
	font-size:			13px;
	width:				120px;
}

#sidebar ul li a {
	color:				#333;
	display:			block;
	font-family:		Geneva;
	padding:			3px;
	text-decoration:	none;
}

#sidebar ul li a:hover {
	color:				#000;
	background-color:	#CC99CC;
}


/* ***********************************
	footer
   *********************************** */
#footer {
	margin:				10px auto;
	width:				760px;
}

#footer:after {
	clear:				both;
	content:			'.';
	display:			block;
	height:				0;
	visibility:			hidden;
}

#footer p {
	border-top:			2px solid #660066;
	color:				#555;
	font-size:			90%;
	line-height:		20px;
	padding:			10px;
	text-align:			center;
}

#footer a {
	color:				#b484da;
	text-decoration:	none;
}

#footer a:hover {
	color:				#666;
	text-decoration:	underline;
}