

* { margin: 0px; padding: 0px; }
body { background: #fff url(fader.jpg) repeat-x; }


/* * * * * * *   layout   * * * * * * */
body { text-align: center; }
#header h1, #content, #footer #f1 { width: 910px; margin: 0px auto; }

#header { margin-bottom: 30px; }
#main { float: left; display: inline; /* ie double margin bug*/ }
#side { float: right; width: 160px; }
#main, #side { margin-bottom: 30px; }

#main { width: 720px; margin-right: 15px; } 

/*
NARROW
#main { width: 580px; margin-right: 85px; }
*/


/* * * * * * *   header  * * * * * * */
#header {
	background: #fff; border-bottom: 2px solid #ddd;
	height: 60px; display: block; }

#header h1 {
	background: #fff url(tj.jpg) no-repeat center bottom;
	height: 60px; display: block; }

#header a {
	width: 230px; height: 60px; display: block;
	text-decoration: none; }

#header span { visibility: hidden; }


/* * * * * * *   footer  * * * * * * */
#footer {
	background: #fff url(footer.jpg) repeat-x center top;
	font: bold 11pt/15pt "trebuchet ms", arial, tahoma, sans serif; color: #aaa;
	padding: 10px; 
	clear: both; display: block; }


/* * * * * * *   typography  * * * * * * */
#main { text-align: left; }

.entry, .photo { margin: 0pt 0px 24pt 0px;}

#main a, .entry a, .photo a { text-decoration: none; color: #e70; font-weight: bold; }
#main a:hover, .entry a:hover, .photo a:hover { text-decoration: underline; }
#main p, .entry p, .photo p {
	font: 10pt/18pt "trebuchet ms", arial, tahoma, sans serif; color: #4d4d4d;
	margin: 0px 12pt 8pt; }

#main h1 {
	font: bold 25pt "trebuchet ms", arial, tahoma, sans serif; color: #f00;
	text-align: center; }

#main h2 {
	font: bold 17pt "trebuchet ms", arial, tahoma, sans serif; color: #c00;
	margin: 0px 0px 8pt;
	}

.date {
	font: bold 12pt "trebuchet ms", arial, tahoma, sans serif; color: #500;
	margin: -8pt 0px 0px;
	display: block; }

#main h3 {
	font: bold 12pt "trebuchet ms", arial, tahoma, sans serif; color: #500;
	margin: 0pt 12pt; }

.category, .colour, .comments { font: 10pt/18pt "trebuchet ms", arial, tahoma, sans serif; color: #999; }
.comments { float: right; }

.entry ul, .entry ol {
	font: 10pt/15pt "trebuchet ms"; color: #4d4d4d; padding: 0pt 30pt;
	}

.entry li {
	padding: 0pt 5pt;
	}

.entry blockquote p {
	font-style: italic; padding: 0pt 10pt;
	}


/* * * * * * *   side  * * * * * * */
#side { text-align: left; }
#side p { font: bold 10pt/18pt "trebuchet ms", arial, tahoma, sans serif; color: #4d4d4d; margin: 4pt 0px;}
#side a { text-decoration: none; color: #e70; font-weight: bold; }
#side a:hover { text-decoration: underline; }
#side h2 {
	font: bold 8pt/15pt "trebuchet ms"; color: #aaa;
	text-transform: uppercase;
	}

#side ul { margin: 0px 0px 20px; }

#side li {
	font: bold 10pt/15pt "trebuchet ms";
	list-style: none;
	}

#side li a {
	color: #e70; text-decoration: none;
	}

#side li span { color: #ccc; }

#nav { list-style: none; margin-bottom: 10px; }
#nav li { display: inline; /* ie list spacing bug */ }
#nav li a {
	font: bold 13px trebuchet ms, arial, tahoma; color: #555; text-decoration: none; text-align: center;
	padding: 5px 5px 5px 31px; margin-bottom: 1px;
	display: block; 
	background-repeat: no-repeat; background-position: 10px center;  }
#nav li a:hover { text-decoration: none;  color: #f00; }

#log a { background-image: url(nav_diary.png); }
#photos a { background-image: url(nav_photos.png); }
#home a { background-image: url(nav_home.png); }
#links a { background-image: url(nav_links.png); }
#latest a { background-image: url(nav_latest.png); }


/* comments */
#comments a:hover { text-decoration: none; }
fieldset { margin: 20px; border: 0px; }

label {
	font: bold 8pt/15pt "trebuchet ms"; color: #bbb;
	text-transform: uppercase;
	}
input, textarea {
	font: bold 10pt/15pt "trebuchet ms"; color: #555;
	margin: 0px 0px 10px; padding: 5px; width: 150px;
}

textarea { width: 350px; height: 150px; }

.pic { display: block; float:left; text-align: center; }
.pic input { width: 32px; }

input[type=submit] { color: #555; padding: 5px; }
#comments h1 { margin: 40px 0px 10px; }

.comment {
	font: bold 10pt/15pt "trebuchet ms"; color: #aaa;
	width: 85%; margin: 10pt;
}

.comment img { float: left; margin-right: 8px; }

#comments p, .comment a {
	font: bold 15px/32px "trebuchet ms"; color: #666;
	text-decoration: none; height: 32px;
	}

.comment .says {
	margin: 0px 50px 30px 42px;
}

/* * * * * * *   photos  * * * * * * */

.thumbnail { float: left; clear: none; margin: 10px; }
.thumbnail img { border: 0px; }
.thumbnail a { border: 3px solid #ddd; display: block; }
.thumbnail a:hover { border: 3px solid #eee; }


/* * * * * * *   extras  * * * * * * */
::-moz-selection { background: #fca; }
table * { border: 1px solid #f0f; }


#verse {font: italic 17px/18px "georgia"; letter-spacing: .5pt; color: #a33; margin: 20px 0px; }
#verse address { color: #a88; text-align: right; margin-top: 6px;}
