body{margin: 0; padding: 0; font: 12px Arial, Helvetica, sans-serif; border-top: 6px solid #032e5f; background-color: #0063B1; text-align: center}
a, a:visited{color: #197bc7; text-decoration: none} 
a:hover, a:active{text-decoration: underline}
a img{border: 1px solid #F2F2F2; padding: 4px;}
a:hover img{border-color: #ccc}
h1{font-size: 2em; letter-spacing: -2px; line-height: 1em}
h2{font-size: 1.4em}
h3{font-size: 1.2em}
p.caption{border-radius: 4px; -moz-border-radius: 4px; background-color: #f2f2f2}
code{background-color:#f2f2f2}
pre{ height: auto; background: #f2f2f2; width: 540px; overflow-x: scroll; border: 1px dotted #ccc; border-left:0; border-right:0; padding: 5px}
fieldset{margin: 0; padding: 0; border: 0}
.alignleft, .left{float: left; margin: 0 10px 10px 0}
.alignright, .right{float: right; margin: 0 0 10px 10px}

#container { margin: 0 auto; width: 828px; text-align: left; }

/* Header Styles */
#header { background: url("images/header-bg.gif") no-repeat bottom left; height: 126px; position: relative; }

#header h1 { color: white;
  float: left;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: normal;
  margin: 67px 0 0;
  padding: 0;
  position: relative;
  width: 227px;
}

#header h1 a { display: block; color: white; font: normal 18px Arial, Verdana, Tahoma; }
#header h2 {display: block; position: absolute; bottom: 9px; color: white; font: italic 14px Georgia, "Times New Roman", Times, serif; }

#header form{float: left; margin: 0; padding: 0; width: 478px; height: 32px; background: url("images/header-searchform-bg.png") no-repeat top left}
#header form input#query{margin-left: 38px; height: 20px; width: 360px; background-color: #9db3df; border: 1px solid #d8eeff; vertical-align: middle}
#header form input#submit{vertical-align: middle; margin-left: 5px}

#rss{float: right; background: url("images/header-rss-icon.jpg") no-repeat top left; display: block; width: 27px; height: 27px; text-indent: -9999px}

/* Primary Navigation */

#primary_navigation { float: right; width: 550px; height: 40px; overflow: hidden; margin-top: 30px; }
#primary_navigation ul { float: right; }
#primary_navigation li { float: left; list-style: none; margin-right: 6px }
#primary_navigation li.active a { font-weight: bold; }
#primary_navigation li a { color: white; font-size: 11px; text-decoration: none; display: block; padding: 4px 7px; }
#primary_navigation li a:hover {text-decoration: underline}

/* Main Content Styles */
#main { background: #313131 url("images/content-bg.png") top right; min-height: 500px; }
#location_0 { display:inline; float:left; margin-left:227px; padding: 0 20px 10px 20px; width:562px; }
#location_0 div.blog_component .blog_post { margin: 0 0 20px; padding: 0 0 30px; border-bottom: 2px solid #E9E9E9; }
#location_0 div.blog_component .blog_post.first { background: url("images/latest-post.png") no-repeat top left; border-bottom: 5px solid #E9E9E9; margin: 0 0 20px 0; padding: 12px 0 30px; }
#location_0 div.blog_component .blog_post.last { border-bottom: none; }

#location_0 h3 { margin-bottom: 4px; font-size: 2em; letter-spacing: -2px; line-height: 1em; }
#location_0 h3 a { color: black; text-decoration: none; }
#location_0 h3 a:hover { color:#999; text-decoration: none }

#location_0 .blog_post .date, #location_0 .blog_post .tags { font-size: 11px; }
#location_0 .blog_post .date { color: #000 }
#location_0 .blog_post .date_prefix { color: #999; }
#location_0 .blog_post .post_wrapper { overflow: auto; }

#location_0 .blog_post .comments { padding-right: 3px; float: left; padding-left: 23px; margin: 8px 0 0 0; background: url("images/bubble.png") no-repeat top left; font-size: 11px; height: 18px;}
#location_0 .blog_post .category { float: left; font-size: 11px; margin: 8px 0 0 0; height: 18px; display:block; text-transform: lowercase; color: #999;}
#location_0 .blog_post .tags { color: #999; display: block; clear: both; padding-top:10px; }

/* Sidebar Styles */

#sidebar-content li { line-height: 1.2em; margin-bottom: 6px; }
#sidebar-content a { color: #C6FF3F }

#sidebar-content .component { color: white; }
#sidebar-content .component div { margin: 15px; }
#sidebar-content .component h2 { font-size: 1.5em; font-weight: normal; padding-bottom: 0; margin:15px; }

#location_1 { float: left; width: 226px; background-color: #313131; margin-left: -830px }

/* Component Styles */
.component ul{margin: 10px 0 0 .4em; padding: 0 0 0 1em}
.component ul li{margin: 0 0 0 .4em; padding: 0; line-height: 1.7em; list-style-image:url("images/ico-category.png"); list-style-position:outside}
.component ul li.tweet { list-style-image:url("images/ico-twitter.gif");margin-bottom:13px; }

.component ul li a{color: white; text-decoration: none}
.component ul li a:hover{text-decoration: underline}

/* Comment Styles */
#comments {clear: both; width: 601px; margin: 40px 0 20px -20px; background: url("images/comments-header.png") no-repeat top left; padding-top: 40px}

.comment { width: 601px; padding: 30px 0 10px 0; background: url("images/comments-separator.png") no-repeat top left }
.comment.owner { background: url("images/comments-author-separator.png") no-repeat top left; }
.comment_metadata { float: left; width: 227px; color: #ccc; display: block; }
.comment_metadata { text-align: right; background: url("images/avatar-speech.png") no-repeat top right }
.comment_metadata .comment_name {font: 14px Georgia, "Times New Roman", Times, serif; color: #CCCCCC; display: block; margin-top: 15px}
.comment_metadata .date { display: block; margin: 10px 0 0 0; font-size: 10px; color: #197BC7; }
.comment_metadata .comment_name a { color: black; text-decoration: none}
.comment_metadata .comment_name a:hover { text-decoration: underline}
.comment div.content { float: left; width: 330px; margin: 0 0 20px 20px; }
.comment.first { padding: 10px 0; background: none; }

.comment.owner div.comment_metadata, .comment.owner div.content { margin-top: 15px; }
.comment_number { display: none; }

.comment { border-bottom: none; margin-bottom: 0; }
.comment .avatar { display: block; float: right; margin: 10px 20px 10px 10px; }
.comment .avatar img { border: none; }
.comment.featured { border: none; }
.comment.owner { border: none; }

#comment_form label { float: none; width: auto; padding-left: 0px; }
#comment_form_area input { width: 160px; border: 1px inset #aaa; color: black; padding: 3px 0; text-indent: 4px }
#comment_form_area .textarea_wrapper { padding-top: 15px; }
#comment_form_area .textarea_wrapper textarea { width: 320px; height: 155px; }
#comment_form_area input[type="submit"] { width: auto; border: 1px outset #ccc; background: #e2e2e2; color: black; padding: 3px 6px; font: bold 16px Arial, Helvetica, sans-serif }
#comment_form_area label { display: block; color: black; line-height: 1.4em; margin-top: 7px; margin-bottom: 3px; font-size: 11px }
#comment_form_area .textarea_wrapper label { display: none; }
#comment_form .submit_wrapper { padding: 0; }
#comment_form .input_wrapper input { width: 160px; }
#comment_form #input_fields_wrapper { float: left; width:220px; height: 220px;}

/* Blog Post Styles*/
#show_blog_post #comment_title { display: none; }
#show_blog_post .blog_post { border: none !important; margin: 0; padding: 0 !important; }
#show_blog_post { background: none; }

/* Footer Styles */
#footer{width: 828px;  height: 40px; background: url("images/footer-top.jpg") no-repeat top left; clear: both; padding-top: 15px; font-size: 10px; text-transform: uppercase; color: white}
#footer a{color: white}
#footer a:hover{color:#FFFF66; border-bottom: 1px solid white; text-decoration: none}
#footer .inner{width: 828px; text-align: left; margin: 0 auto; }

.inner h2{margin-top: 15px; font: italic 15px Georgia, "Times New Roman", Times, serif; color:#C6FF40;}
.inner h2 img{vertical-align:text-bottom}
.inner #location_2 {float: right; width: 590px;}
.inner #lastfmrecords { height: 200px;}
.inner #lastfmrecords, 
.inner #lastfmrecords li{ margin: 0; padding: 0; list-style-type: none;}

#location_3 .component ul li { list-style-image: none; margin: 0 0 7px 0; }
#location_3 ul li{margin-bottom: 7px}

#sidebar-content .friendfeed_component div { margin: 10px; }
#sidebar-content .lastfm_component div { margin: 5px; }
#sidebar-content .flickr_gallery_component div, #sidebar-content .image_gallery_component div { margin: 0 5px 5px 5px; }
div.lastfm_component .lastfm_entry { padding: 0; }

.cropped_images { padding:0 0 15px 5px; }

/* Friendfeed Component */
.friendfeed_entry { padding: 5px 0; margin: 0; }
.friendfeed_entry .date { margin-top: 5px; }

.flickr_gallery_component .image a:hover img, .image_gallery_component .image a:hover img { border:1px solid white; }
.flickr_gallery_component .image img, .image_gallery_component .image a img { border:1px solid #459DDF; }

.inner #location_3 { width: 200px; float: left; }
.inner #location_3 ul, #footer #location_3 ul li {margin: 0; padding: 0; list-style: none; color: #C6FF40; }
.inner #location_3 a {color: white; background: none;}
.inner #location_3 a:hover {background: none;}

.inner .credits {clear: both; padding: 10px 0; color: white;}
.inner .credits a {clear: both; padding: 10px 0; color: #C6FF40;}
.inner .credits a:hover {color: white;}

/* Clear Styles */
.clearboth{clear: both}
.clearfix:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0}
.clearfix {display: inline-block}
html[xmlns] .clearfix {display: block}
* html .clearfix {height: 1%}
