/*  
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 {
 width:860px;
 margin:0 auto; padding:0;
 line-height:1.4;
 color:#333333;
 font-family:Arial, sans-serif;
 font-size:10pt;
 background:#ffffff url(ori_img/body_bg.png); }

a {
 color:#0000ff;
 text-decoration:none;
 border-bottom:1px dashed #0000ff; }

a:hover	{
 text-decoration:underline;
 color: #ff0000;
 border-bottom:0px;}

form {margin:0;padding:0;}
input, textarea {}

p {margin: 10px 0;}
p.hide {display:none;}

img {border:0; padding: 1px; margin:0;}

/* Some peoples sometime using this class for aligning the image */
img.alignleft, img.left {
 float:left;
 margin:0px 5px 5px 0px; 
 border:1px solid #994400;}

img.alignright, img.right {
 float:right;
 margin:0px 0px 5px 5px;
 border:1px solid #994400;}

img.aligncenter, img.center {
 display:block;
 margin: 0 auto;
 text-align: center;
 border:1px solid #994400;}

.clear {clear:both; overflow:hidden;}

/**********************************/
/* Layout                         */
/**********************************/
#a8 {
 overflow:hidden;
 display:block;
 width:860px;
 padding:0; margin: 0　auto;
 border:1px solid #994400; 
 border-top: 5px solid #994400;}
#a8 p {text-align:center; margin:0; padding:0;}
#a8 img {margin:1px 0px 1px 0px;}
#a8 a, img.a {text-decoration:none; border:0;}

#container,#left,#header,#content,#sidebar,#footer {
 overflow:hidden;
 display:block;}

#container {
 width:860px;
 padding:0; margin: 0　auto;
 border:1px solid #994400; 
 border-top: 5px solid #994400;
 background: #fff url(ori_img/background.jpg) repeat-y top right;}

#left {width: 480px; float:left;margin:0;padding:0;}

.middle {width:170px; margin:0;padding: 0 10px; float:left;}
.right {width:170px; margin:0;padding: 0 10px; float:left;}

#content {padding: 28px;}

#header {
 background:#994400;
 padding: 10px 15px;
 margin-bottom:10px;
 border-bottom: 2px solid #775522;}

#sidebar {width: 380px; float:left; margin:0;padding:0;}

#footer {
 width:860px;
 background: #994400;
 padding:10px 0px 10px 0px;
 margin:0 auto;
 font-size:8pt;
 text-align:center;
 color:#ffffcc;}

/**********************************/
/* Content                        */
/**********************************/
#content h1,h2,h3,h4 {color:#0000ff; line-height:1.2; text-align:-left;}

#content h1 {
 display:inline;
 text-align:left;}

#content h2 {
 font-size:12pt;
 color:#0000ff; 
 margin:0px;
 padding-top:20px;
 text-align:left;}

#content h2 a {font-weight:bold; border:0px;}

#content h2.posttitle {
 font-size:12pt;
 padding: 5px 0px 5px 5px;
 background:transparent url(ori_img/posttitle_bg.png);
 border-left:5px solid #994400;
 border-bottom:1px solid #994400;
 border-top:2px solid #994400;}

#content h2.middle_title {
 margin-top:20px;
 font-size:10pt;
 padding: 3px 0px 3px 5px;
 background:transparent url(ori_img/posttitle_bg.png);
 border-left:10px solid #ccaa66;
 border-bottom:1px solid #ccaa66;
 border-top:2px solid #ccaa66;}

#content h3{
 font-size:10pt;
 padding:5px 0px 0px 5px;
 text-align:left;
 border-left:10px solid #ccaa66;
 border-bottom:1px solid #ccaa66; }

#content h4{font:normal 1.0em "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color:#0D6AA6; text-align:left;}

#content ol, ul {
 margin:5px 20px 5px 25px; padding:0;}
#content li { line-height:1.2; padding-bottom:5px; }

#content blockquote {
 padding:2px 10px 1px 10px;
 margin:5px 10px 5px 10px;
 color:#333333; 
 font-size:10pt;
 border-left: 5px solid #994400;
 border-right: 5px solid #994400;
 line-height:1.4;
 background:#ffff77;}

#content blockquote.code {
 padding:0px 10px 0px 10px;
 margin:5px 10px 5px 10px;
 color:#333333; 
 font-size:10pt;
 border:1px solid #994400;
 border-left: 5px solid #994400;
 border-right:5px solid #994400;
 line-height:1.2;}

#content p.postmetadata {
 clear:both;
 overflow:hidden;
 background:transparent;
 border-top:1px solid #ffaa00;
 border-bottom:2px solid #ffaa00;
 margin-bottom:30px;
 padding:5px 10px;
 font-size:8pt;
 line-height: 1.1;}

#content .post-date {
 font-size:10pt;
 padding-left:20px;
 padding-top: 5px;
 background: transparent url(img/calendar.png) no-repeat top left;
 background-position:0px 5px;}

#content .post-category {
 font-size:10pt;
 padding-left:20px;
 padding-top:0px;
 background: transparent url(img/folder.png) no-repeat top left; }

#content .post-sbm {
 text-align:right; font-size:10pt;
 padding-top:3px; }

#content .post-sbm a {border:0px; text-decoration:none;}

#content strong {background:#ffff00; text-decoration:underline;}

/**********************************/
/* Navigation                     */
/**********************************/
.navigation {
 margin-top:20px;
 padding:5px 0px 0px 5px;
 border-top:2px solid #DFD8A1; }
.navigation p {margin:0; padding:0; }

.navigation strong {
 background:transparent;
 border:0px; }

/**********************************/
/* Header                         */
/**********************************/
#header h1 {
 color:#ffffcc;
 display:inline; 
 font-size:14pt;
 font-weight:bold;
 margin:0;padding:0;}

#header h1 a {color:#ffffcc; border:0px;}
#header h1 a:hover {color: #fc0; text-decoration:none;}

#header h2{
 color:#ffffcc;
 font-size:10pt;
 font-weight:normal;
 margin:0;padding:0;}

/**********************************/
/* Sidebar                        */
/**********************************/
#sidebar a {color:#333333; border:0px;}
#sidebar a:hover {text-decoration:undeline; color: #f60;}

#sidebar ul {
 margin: 0 0 10px 0;
 padding:0;
 list-style-type:none; }

#sidebar h2 {
 font-size:10pt;
 font-weight:bold;
 color:#333333;
 margin:0; padding:2px 0px 1px 0px; 
 padding-left: 20px;
 border-top:2px solid #775522;
 border-bottom:1px solid #775522;}

#sidebar #header h2 {padding-left: 0; border:0; color:#ffffcc; font-weight:normal;}
#sidebar h2.about {background:transparent url(img/user.png) no-repeat top left;}
#sidebar h2.cats {background:transparent url(img/folder.png) no-repeat top left;}
#sidebar h2.cal {background:transparent url(img/cal.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 h2.meta {background:transparent url(img/meta.png) no-repeat top left;}
#sidebar h2.blogroll {background:transparent url(img/link.png) no-repeat top left;}
#sidebar h2.comment {background:transparent url(img/comment.png) no-repeat top left;}
#sidebar ul {margin-top: 5px;}
#sidebar ul li {background: transparent url(img/none) no-repeat top left; padding-left: 0px;}
#sidebar ul li ul {border-top: 0px solid #f0f0f0; margin:0;}
#sidebar ul li ul li {padding-left:20px; border:none;}
#sidebar ul.links li {float:left;display: inline;overflow:hidden;border:none; padding-left:0px;}
#sidebar ul.links li h2 {color: #666;}
#sidebar ul.links li ul li {padding-left:20px;}
#sidebar img {margin:2px 0 0 0; padding:2px 0 0 0; border: none;}

/**********************************/
/* Footer                         */
/**********************************/
#footer .copyright a {color:#ffaa00; border:0px;}
#footer .copyright a:hover {color:#ffaa00;text-decoration:underline;}

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

#wp-calendar a {
 font-weight:bold;
 color:#0000ff;
 text-decoration:none; }

/**********************************/
/* Search                         */
/**********************************/
#side-search {
 margin:5px 20px 0px 10px; padding:5px 5px 5px 0px; }

#searchform {
 padding-bottom: 0px;
 margin: 0px; }

#searchbox, #s { width:70%; }

.search {
 text-align: left;
 padding: 5px 0 0 0;
 margin: 0px; }

fieldset {
 border:0px;
 margin:0px; padding:0px; }

/* *********************************** */
/* 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; 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; width: 520px; 
text-align: right; position:absolute;	left:0;}
.gravatar {float:left; padding: 1px; margin: 5px 5px 5px 0; background: #fff; width: 40px; height: 40px;}
#recentcomments ul {border: none;}

/*****************************/
/*** comments Form ***/
/*****************************/
#commentform { width:97%; }

#commentform a {
 font-weight: bold;
 text-decoration: none;
}

#commentform a:hover {
 text-decoration: underline;
}

#comment {
 width: 99%;
 border: 1px solid #013300;
 background: #fff;
}

#author {
 border: 1px solid #000;
 background: #fff;
}

#email {
 border: 1px solid #000;
 background: #fff;
}

#url {
 border: 1px solid #000;
 background: #fff;
}

#submit {}

#submit:hover {}

/*****************************/
/*** comments Display ***/
/*****************************/
h3.comments-header {font-size:10pt; color:#000066;
 font-weight:bold;
 margin:0 0 5px 0; padding:2px 0px 2px 5px;
 background:#F8F8F8;
 border-left:5px solid #000066;
 border-top:1px solid #000066;
 border-bottom:1px solid #000066; }

h3.comments-header2 {font-size:10pt; color:#000066; 
 font-weight:bold;
 margin:30px 0 5px 0; padding:2px 0px 2px 5px;
 background:#F0F0F0;
 border-left:5px solid #000066;
 border-top:1px solid #000066;
 border-bottom:1px solid #000066; }

ol li.odd { background:#ffeeaa;
 border-top:2px solid #ccaa66;
 border-bottom:2px solid #ccaa66;
 padding:5px;
 margin-bottom:5px;}

ol li.even { background:#ffdd99;
 border-top:2px solid #ccaa66;
 border-bottom:2px solid #ccaa66;
 padding:5px;
 margin-bottom:5px;}

/**********************************/
/* BPList - NO IMAGE A */
/**********************************/
div.blogpeople-main p { 
padding:5px 0; }

div.blogpeople-main p a {
margin:0 0 0 1px; }

div.blogpeople-main img {border:0px;}

span.blogpeople-linklist {
display:block; 
padding:0 0 0 5px;
color:#0000ff;
font-weight:bold;
border-left:10px solid #ccaa66;
border-bottom:1px solid #ccaa66;
}

div.blogpeople-powered-by a {border:none;}