/* 
Theme Name: TypoXP
Theme URI: http://www.sunaryohadi.info/
Description: A Typo eXPerimental. Clean, three columns, fixed width. With icons and almost no graphics. Great for 'text-heavy' theme lover.
Version: 1.0.3
Author: Sunaryo Hadi
Author URI: http://www.sunaryohadi.info/

 TypoXP v1.0.3
 http://www.sunaryohadi.com/themes/

 The CSS, XHTML and design is released under GPL:
 http://www.opensource.org/licenses/gpl-license.php
 
*/
/**********************************/
/* General */
/**********************************/
body { font: 0.8em/1.5em Verdana, Arial, Helvetica, sans-serif; color: #333; background: #666; margin:0; padding:0; min-width:980px; }
a { color: #0D6AA6; text-decoration: none; }
a:visited { color: #08466E; }
a:hover { text-decoration: underline; color: #f60; }
a.def:hover { text-decoration: none; border-bottom: 1px dashed #f60; cursor: help; }
form { margin:0;padding:0; }
input, textarea { font: 1.0em Verdana, Arial, Helvetica, sans-serif; color: #333; }
p { margin: 10px 0; }
pre { margin: 10px 0; font-size:1.2em; text-align:left; color: #008; overflow: auto; }
img { border:1px solid #EEE; padding: 1px; margin:0; }
/* Some peoples sometime using this class for aligning the image */
div.alignleft, img.alignleft, img.left { float:left; margin-right: 10px; margin-left: 0px; }
div.alignright, img.alignright, img.right { float:right; margin-left: 10px; margin-right: 0px; }
.clear { clear:both; overflow:hidden; }

/**********************************/
/* Layout */
/**********************************/
#container,#left,#header,#content,#sidebar,#footer { overflow:hidden; display:block; }
#container { width:960px; padding:0; margin: 0 auto; 
border-top: 5px solid #191970; border-bottom: 3px solid #708090; background: #fff url(img/verdana-bg.gif) repeat-y top right; }
#left { width: 560px; float:left;margin:0;padding:0; text-align: justify; }
.middle { width:180px;margin:0;padding: 0 10px; float:left; }
.right { width:180px;margin:0;padding: 0 10px; float:left}
#content { padding: 0 28px 28px 28px; }
#header { background: #708090; padding: 10px 15px; margin-bottom: 10px;border-bottom: 2px solid #191970; }
#sidebar { width: 400px; float:left;margin:0;padding:0; }
#footer { width:960px; padding: 3px 0px 0 20px; margin:0; font-size: 0.86em; height: 30px; text-align:right; color:#999; }

/**********************************/
/* Content */
/**********************************/
#content h1,h2,h3,h4 { line-height:1.2em;text-align:left; }
#content h1 { color:#0D6AA6; text-transform:uppercase; letter-spacing:0.05em;display:inline;
font:normal 1.8em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; text-align:left; }
#content h2 { font: 1.5em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color:#0D6AA6; 
margin:0px; padding-top: 20px; text-align:left; }
#content h2.pagetitle { font-size: 1.8em; color: #f90; padding: 20px 0 0 0; }
#content p.pagesubtitle { color: #f90; margin: 0; padding: 0; }
#content h3{ font:normal 1.2em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color:#0D6AA6; text-align:left; margin-bottom:0; line-height:1em;}
#content h4{ font:normal 1.0em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color:#0D6AA6; text-align:left; }
#content blockquote { padding:0 0 0 10px;margin:5px 0px 5px 20px; 
font-size: 1.0em; border-left: 5px solid #b0c4de; line-height: 1.2em; }
#content p.postmetadata { clear:both; overflow:hidden;background: #f7f7f7; padding:5px 10px; line-height: 1.0em; }
code { font-size:1.2em; text-align:left; margin:0;padding:0; color: #008; }
#content li { padding-bottom: 5px; }
#content .post-date { font-size:0.8em; padding-top: 0; background-position:0% 5px; }
/* #content .navigation { padding-top: 20px; } */
.aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.wp-caption img { margin: 0; padding: 0; border: 0 none; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 4px 4px 5px; margin: 0; }
table.data { border: none; padding: 0; }
table.data th, table.data td { border: 1px solid #f3f3f3; font-size: 11px; margin: 0; padding: 4px; text-align: left; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
table.data th { vertical-align: bottom; }

/**********************************/
/* Header */
/**********************************/
#header h1 { color:#FFF; text-transform:uppercase; letter-spacing:1px;display:inline; 
font:bold 2.0em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;margin:0;padding:0; }
#header h1 a { color: #eee; }
#header h1 a:hover { color: #fc0; text-decoration:none; }
#header h2{ font: 1.0em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color:#DDD;text-transform:uppercase;
letter-spacing:0.05em; margin:0;padding:0; }

/**********************************/
/* Sidebar */
/**********************************/
#sidebar a:hover { text-decoration:none; color: #f60; }
#sidebar ul { margin: 0 0 10px 0; padding:0; list-style-type: none;border-top: 1px solid #eee; }
#sidebar h2 { font: bold 1.1em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color:#333; margin:0 0 2px 0; padding:0; 
padding-left: 20px; border-bottom: 1px solid #eee; text-transform:uppercase; }
#sidebar #header h2 { padding-left: 0; border:0; color: #CCC}
#sidebar h2.about { background: transparent url(img/pages.png) no-repeat top left; }
#sidebar h2.cats { background: transparent url(img/box.png) no-repeat top left; }
#sidebar h2.cal { background: transparent url(img/calendar.png) no-repeat top left; }
#sidebar h2.search { background: transparent url(img/search.png) no-repeat top left; }
#sidebar h2.file { background: transparent url(img/file.png) no-repeat top left; }
#sidebar ul.recent li { line-height:1.3em; padding-bottom:3px; }
#sidebar h2.widgettitle { background: transparent url(img/twitter.png) no-repeat top left; }
#sidebar h2.widgettitle a { color:#333; }
#sidebar ul.tweets li { line-height:1.3em; padding-bottom:3px; }
#sidebar h2.feeds { background: transparent url(img/feeds.png) no-repeat top left; }
#sidebar h2.credits { background: transparent url(img/credits.png) no-repeat top left; }
#sidebar h2.blogroll { background: transparent url(img/link.png) no-repeat top left; }
#sidebar h2.neighblogs { background: transparent url(img/neighblogs.png) no-repeat top left; }
#sidebar h2.comment { background: transparent url(img/comment.png) no-repeat top left; }
#sidebar h2.copyleft { background: transparent url(img/copyleft.gif) no-repeat top left; }
#sidebar ul { margin-top: 5px; }
#sidebar ul li { /*background: transparent url(img/none) no-repeat top left;*/ padding-left: 0px; border-bottom: 0px solid #f0f0f0; }
#sidebar ul li ul { border-top: 0px solid #f0f0f0; margin:0; }
#sidebar ul li ul li { padding-left:20px; padding-right:20px; border:none; }
#sidebar .middle ul li ul li { padding-right:0; }
#sidebar .right ul li ul li { padding-right:0; }
#sidebar ul li p { padding-left:20px; padding-right:20px; border:none; margin:0; }
/* #sidebar ul.links li { float:left;display: inline;overflow:hidden;border:none; padding-left:0; padding-right:5px; } */
#sidebar ul.links li { padding-left: 0; }
#sidebar ul.links li h2 { color: #666; border:none; margin:0; padding-top:2px; } 
#sidebar ul.links li ul li { padding-left:20px; color: #666; }
#sidebar img { margin:2px 0 0 0; padding:2px 0 0 0; border: none; }

/**********************************/
/* Footer */
/**********************************/
#footer .copyright a { color:#999; }
#footer .copyright a:hover { color:#FF0;text-decoration:none;border-bottom:1px dashed #900; }

/**********************************/
/* Calendar */
/**********************************/
#wp-calendar { width: 150px; color: #999; line-height:1.0em; }
#wp-calendar caption { font-weight:bold; color: #666; line-height: 16px; text-transform: uppercase; letter-spacing: 1px; }
#wp-calendar .today { background:#FBFCF4; }

/* *********************************** */
/* Comments Div */
/* *********************************** */
h3#comments, h3#respond { border-top:1px solid #CCC; padding-top: 10px; padding-left: 20px;color:#0D6AA6; font-size: 1.2em; font-weight: bold; }
h3#comments { background: transparent url(img/comment.png) no-repeat top left;background-position:0% 12px; }
h3#respond { background: transparent url(img/edit.png) no-repeat top left;background-position:0% 12px; }
cite { position:relative;color: #999;padding:0;margin:0;font-weight:bold; }
.alt { background: #f7f7f7; }
.commentbody { color: #595949; font-size: 1.0em; margin: 0 0 5px 0;padding: 10px 15px 10px 15px; background: #FAFAF5; border: 1px solid #f0f0e0; list-style:none; }
.commentbody p { line-height: 1.2em; margin:0 0 0.5em 0; padding:0; }
.commentlink { font-size: 1.0em; }
.commentlist { list-style: none; margin:0; padding:0px; }
.commentcount { font: bold 2.2em Georgia,sans-serif; color: #e0e0d0; float: right; }
.gravatar { float:left; padding: 1px; margin: 4px 10px 5px 0; background: #fff; width: 25px; height: 25px; }
#recentcomments ul { border: none; }
