/*
Theme Name: jeffhung-wordpress-theme
Theme URI: http://www.jeffhung.net/blog/
Description: Theme for JeffHung.Blog
Version: 0.2
Author: Jeff Hung
Author URI: http://www.jeffhung.net/blog/
*/

@import url('docbook.css');

@media screen, projection {

	/* exploit a parsing bug so @media rules are visible to MacIE5 */
	.BeNiceToMacIE5 {
		font-family: "\"}\"";
		font-family: inherit;
	}

	.float-left {
		float: left;
	}
	.float-right {
		float: right;
	}

	body {
		background-color: #fffaf0;
		color: #000;
		margin: 0;
		padding: 0;
		font-family: Verdana, Arial, Helvetica, sans-serif;
	}
	.wrapper {
		margin: 0;
		padding: 0;
/*		border: thin solid #7d5500;*/
	}
	.header {
		/* different color than content */
		background-color: #8ca8e6;
		color: #003399;
		margin: 0;
		padding: 0;
	}
	.container {
		clear: both;
		width: 100%;
		margin: 0;
		padding: 0;
		color: #000;
		background: #fff5e1 url(content-bg.png) 20% 0 repeat-y;
		/* background-color value is for content background.
		   Image is 2000px wide, ~25% is colored, where sidebar should be 
		   (exact pixel count of colored area is actually closer to 26%).
		   Position corresponds to left sidebar, repeat img vertically.
		   Easily modified for right sidebar - just flip the image,
		   change bg position to 75% and change .content to float:left.
		*/
	}
	.content {
		width: 76%;
		float: right;
		margin: 0;
		padding: 1em;
	}
	.sidebar {
		margin-right: 80%;
		padding: 0;
	}
	.clear {
		clear: both;
		height: 1px;
		overflow: hidden;   /* prevent IE expanding the container */
		margin: 0;          /* keep flush with surrounding blocks */
	}
	.footer {
		/* same bg color as .header */
		background-color: #8ca8e6;
		color: #003399;
		margin: 0; /* flush with .container */
		padding: 0.4em;
		border-top: 1px solid #003399;
	}
	.footer p {
		margin: 0;
	}
	.section-bar {
		margin: 0;
		padding: 0;
		background: #003399;
		color: #dddddd;
		font-size: 0.9em;
		clear: both;
	}
	.section-bar ul {
		margin: 0;
		padding: 0.2em 0;
	}
	.section-bar ul li {
		list-style: none;
		display: inline;
		padding: 0;
		text-transform: capitalize;
	}
	.section-bar a,
	.section-bar a:link,
	.section-bar a:active,
	.section-bar a:focus {
		color: #dddddd;
		background: #003399;
		text-decoration: none;
		padding: 0.2em 0.4em;
		outline: none;
	}
	.section-bar a:hover {
		color: #003399;
		background: #dddddd;
		text-decoration: none;
	}

	/* #blog-title */
	div.header h1 {
		margin: 0;
		padding: 0.2em 0.2em 0 0.2em;
	}
	div.header h1#blog-title a {
		text-decoration: none;
		color: #eeeeee;
		background: transparent;
	}
	div.header h1#blog-title:before {
		content: "[";
		color: #ff9800;
		padding-right: 0.2em;
	}
	div.header h1#blog-title:after {
		content: "]";
		color: #ff9800;
		padding-left: 0.2em;
	}

	/* #blog-description */
	div.header div#blog-description {
		margin: 0;
		padding: 0.2em 1em;
		font-size: 0.8em;
		font-style: italic;
/*		color: #dddddd;*/
	}

	/* .google-search */
	div.header .google-search {
		float: right;
		padding: 0.2em;
	}
	div.header .google-search {
		text-transform: lowercase;
	}
	div.header .google-search input,
	div.header .google-search font {
		font-size: small;
	}
	div.header .google-search input#sbi,
	div.header .google-search input#sbb {
		border: 1px solid #003399;
		font-family: Verdana, Arial, Helvetica, sans-serif;
	}
	div.header .google-search input#sbi {
		padding-left: 2px;
		padding-right: 2px;
		color: #8c18e6;
	}
	div.header .google-search table {
		background-color: transparent;
	}
	div.header .google-search tr,
	div.header .google-search td {
		padding: 0;
		margin: 0;
	}

	/* .google-adsense */
	div.post div.google-adsense {
		margin: 1em;
		text-align: center;
	}

	/* sidebar */

	.sidebar div,
	.sidebar h3,
	.sidebar h4,
	.sidebar ul,
	.sidebar li {
		margin: 0;
		padding: 0;
	}
	.sidebar ul {
		font-size: 92%;
	}
	.sidebar li {
		list-style: none;
	}
	.sidebar h3 {
		font-size: 1em;
		font-weight: bold;
		padding-top: 0.5em;
		padding-bottom: 0.5em;
	}
	.sidebar ul li {
		margin: 0;
		border-bottom: 1px solid #999999;
		padding: 0.4em;
	}
	.sidebar ul ul {
		margin: 0 0 0 1.0em;
	}
	.sidebar ul ul ul {
		margin: 0 0 0 0.5em;
	}
	.sidebar ul ul li {
		list-style: square;
		border: none;
		margin: 0;
		padding: 0;
	}

	/* #about */
	li#about {
		font-size: 0.8em;
	}
	li#about img {
		float:left;
		margin: 4px 6px 4px 0;
		border: 1px solid #999999;
	}
	li#about p {
		margin: 2px 0 6px 0;
	}
	li#about a,
	li#about a:link,
	li#about a:active,
	li#about a:focus {
		display: block;
		text-decoration: none;
		padding: 2px;
		color: #999999;
	}
	/*
	li#about a:hover {
		color: #444444;
		background-color: #999999;
	}
	*/
	li#about em {
	/*	color: #6b448c;*/
	/*	font-weight: bold;*/
		font-style: normal;
	}
	li#about a:hover em {
		color: #6b448c;
	}

	/* .sidebar-list */
	li.sidebar-list ul li,
	li.sidebar-list ul li a {
		color: #999999;
	}
	li.sidebar-list ul li a {
		display: block;
		text-decoration: none;
	}
	li.sidebar-list ul li:hover a {
		color: #444444;
	}
	li.sidebar-list ul li a:hover {
		color: #003399;
	}
	li.sidebar-list select {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 0.8em;
		width: 100%;
	}
	li.sidebar-list ul li:hover a span.recent-response-author {
		color: #444444;
	}
	li.sidebar-list ul li a span.recent-response-on {
		display: list-item;
		list-style: none;
		font-size: 70%;
	}
	li.sidebar-list ul li a span.recent-response-on:before {
		content: '» ';
	}
	li.sidebar-list ul li a span.awstats-top-list-count {
		font-size: 70%;
	}

	div.st-tag-cloud a.st-tags,
	div.st-tag-cloud a.st-tags:link,
	div.st-tag-cloud a.st-tags:active,
	div.st-tag-cloud a.st-tags:focus {
		text-decoration: none;
	}
	div.st-tag-cloud a.st-tags:hover {
		text-decoration: underline;
	}

	/* .post */
	div.post {
		margin: 0.5em 0 3em 0;
/*		border: 1px solid black;*/
	}

	/* .post-title */
	div.post h3.post-title {
		margin: 0.3em 0;
	}
	div.post h3.post-title a {
		display: block;
/*
		margin: 0.5em 0 0.2em 0;
		padding-bottom: 0.1em;
*/
		font-weight: bold;
	}
	div.post h3.post-title a,
	div.post h3.post-title a:link,
	div.post h3.post-title a:active,
	div.post h3.post-title a:focus {
		margin-top: 0.5em;
		font-size: 1.2em;
		font-weight: bold;
		text-decoration: none;
		border-bottom: 1px solid #0066cc;
	}
	div.post h3.post-title a:hover {
		text-decoration: none;
		color: #002255;
		border-bottom: 1px solid #002255;
	}

	/* .post-meta-brief */
	div.post div.post-meta-brief {
		color: #77778e;
/*		font-size: small;*/
		font-size: 0.6em;
	}
	div.post div.post-meta-brief a,
	div.post div.post-meta-brief a:link,
	div.post div.post-meta-brief a:active,
	div.post div.post-meta-brief a:focus {
		text-decoration: none;
		color: #552bff;
	}
	div.post div.post-meta-brief a:hover {
		text-decoration: underline;
	}
	div.post div.post-meta-brief span.entry-shareon {
/*		float: right;*/
	}
	div.post div.post-meta-brief span.entry-shareon img {
		border: none;
	}

	div.post div.post-meta {
		padding: 1em;
		margin: 2em 0;
		color: #77778e;
		font-style: normal;
		background-color: #f8f8f8;
		border-top: 1px solid #dddddd;
		border-bottom: 1px solid #dddddd;
	}
	div.post div.post-meta a,
	div.post div.post-meta a:link,
	div.post div.post-meta a:active,
	div.post div.post-meta a:focus {
		text-decoration: none;
		color: #552bff;
	}
	div.post div.post-meta a:hover {
		text-decoration: underline;
	}
	div.post div.post-meta abbr {
		border: none;
	}

	/* .read-more */
	div.post div.read-more {
		padding-left: 0.2em;
		color: #aa99aa;
	}
	div.post div.read-more a,
	div.post div.read-more a:link,
	div.post div.read-more a:active,
	div.post div.read-more a:focus {
		color: #aa99aa;
		text-decoration: none;
	}
	div.post div.read-more a:hover {
		color: #87449f;
		text-decoration: underline;
	}

	/* .post .post-excerpt */
	div.post div.post-excerpt {
		font-size: 0.8em;
	}

	/* .post .post-content */
/*
	div.post div.post-content {
		overflow: auto;
	}
*/
	div.post div.post-content p {
		margin: 1em 0;
	}
	div.post div.post-content a,
	div.post div.post-content a:link,
	div.post div.post-content a:active,
	div.post div.post-content a:focus {
		text-decoration: none;
	/*	text-decoration: none; */
	/*	border-bottom: 1px dotted #999999; */
	}
	div.post div.post-content a:hover {
		text-decoration: underline;
	/*	text-decoration: none; */
	/*	border-bottom: 1px solid #aaaaaa; */
	}
	div.post div.post-content li {
/*		list-style: square;*/
	}
	div.post div.post-content img {
		border: 0;
	}
	div.post div.post-content a>img {
		border: 0;
	}
	div.post div.post-content blockquote {
		border-left: 4px solid #e6e6fe;
		margin-left: 0.4em;
		padding: 0 0 0 0.6em;
	}
	div.post div.post-content {
		line-height: 1.5em;
	}
	div.post div.post-content pre.code,
	div.post div.post-content pre.docbook-programlisting {
		line-height: 1.2em;
		overflow: auto;
	}
	div.post div.post-content pre.code span.emphasis,
	div.post div.post-content pre.docbook-programlisting span.emphasis {
	/*	font-style: italic;*/
		background-color: #ff8888;
	}

	div.post div.post-others {
		margin: 1em 0.3em;
		padding: 0 0.5em;
		border: 1px dotted #00FFFF;
		font-size: 0.8em;
		clear: both;
	}
	div.post div.post-others .post-others-random {
		width: 50%;
		float: right;
	}

	/* .footer */
	.footer {
		font-size: 0.8em;
		text-align: right;
	}
/*
	.footer .copyright-notice {
		width: 49%;
		text-align: left;
	}
	.footer .powered-by {
		width: 49%;
		float: right;
		text-align: right;
	}
*/
	.footer a,
	.footer a:link,
	.footer a:active,
	.footer a:focus {
		text-decoration: none;
	}
	.footer a:hover {
		text-decoration: underline;
	}

	/* .pagenavi */
	.pagenavi {
		display: block;
		font-size: 0.8em;
		margin: 0;
		padding: 0;
	}
	body.is-single #pagenavi-above {
		display: none;
	}
	.pagenavi .pagenavi-prev {
		width: 49%;
		text-align: left;
	}
	.pagenavi .pagenavi-next {
		width: 49%;
		float: right;
		text-align: right;
	}
	.pagenavi a,
	.pagenavi a:link,
	.pagenavi a:active,
	.pagenavi a:focus {
		text-decoration: none;
	}
	.pagenavi a:hover {
		text-decoration: underline;
	}

	.pagebar {
		text-align: center;
		font-size: 0.8em;
	}

	.commentlist li .comment-avatar {
		float: right;
		margin: 3px;
	}

} /* @media screen, projection */

@media print {

	.header         { display: none; }
	.section-bar    { display: none; }
	.sidebar        { display: none; }
	.post-meta      { display: none; }
	.comments       { display: none; }
	.google-adsense { display: none; }
	.hidden-in-print { display: none; }

	/* .post-title */
	div.post h3.post-title {
		margin: 0.3em 0;
	}
	div.post h3.post-title a {
		display: block;
		font-weight: bold;
	}
	div.post h3.post-title a {
		margin-top: 0.5em;
		font-size: 1.2em;
		font-weight: bold;
		text-decoration: none;
		border-bottom: 1px solid #0066cc;
	}

	/* .post-meta-brief */
	div.post div.post-meta-brief {
		color: #77778e;
		font-size: 0.6em;
	}
	div.post div.post-meta-brief a {
		text-decoration: none;
		color: #552bff;
	}

	/* .post-meta */
	div.post div.post-meta {
		padding: 1em;
		margin: 2em 0;
		color: #77778e;
		font-style: normal;
		background-color: #f8f8f8;
		border-top: 1px solid #dddddd;
		border-bottom: 1px solid #dddddd;
	}
	div.post div.post-meta a {
		text-decoration: none;
	}
	div.post div.post-meta abbr {
		border: none;
	}

	/* .post-content img */
	div.post div.post-content img {
		border: 0;
	}
	div.post div.post-content a>img {
		border: 0;
	}

	div.post div.post-others {
		display: none;
	}

	/* .footer */
	.footer {
		margin-top: 1em;
		border-top: 1px solid #dddddd;
		text-align: right;
		font-size: 0.8em;
	}
	.footer p { margin: 0; }
	.footer .copyright-notice {
		float: left;
		text-align: left;
	}
}

/* footnote */
div.post div.post-content sup.footnote-identifier-link-sup {
	font-size: xx-small;
}
div.post div.post-content ol.footnotes {
	counter-reset: footnote_counter;
	list-style-type: none;
	list-style-image: none;
	padding: 0;
	margin: 0;
	margin-left: 2.5em;
	font-size: small;
}
div.post div.post-content ol.footnotes li.footnote {
	text-indent: -2.5em;
	list-style-type: none;
	list-style-image: none;
}
div.post div.post-content ol.footnotes li.footnote:before {
	display: marker;
	content: "[" counters(footnote_counter, ".") "]";
	padding-right: 0.9em;
	text-align: right;
	counter-increment: footnote_counter;
}
div.post div.post-content hr.footnotes-sep-top {
	/* @see http://www.blakems.com/experimental/hr/ */
	text-align: left;   /*this will align it for IE*/
	margin: 0 auto 0 0; /*this will align it left for Mozilla*/
	border: none 0;
	border-top: 1px solid #999999; /*the border*/
	height: 1px; /*whatever the total width of the border-top and border-bottom equal*/
	/* below are my settings */
	width: 30%;
	size: 1px;
	margin-top: 2em;
}

/*
.post-title {
	text-shadow: #8ca8e6 2px 2px 1px;
}
*/