/* ------------------------------------
 * JieXiang
 *
 * @author	ShingChi
 * @link	http://lcz.me
 * @update	2012-05-04 20:36
 * --------------------------------- */


/* Google fonts */
@import url('http://fonts.googleapis.com/css?family=Ovo');
@import url('http://fonts.googleapis.com/css?family=Rokkitt');

/* ------------------
 * BASE
 * --------------- */
 
/* reset */
html, body, div, header, section, article, footer, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, code, del, em, img, q, dl, dt, dd, ol, ul, li, table, caption, tbody, tfoot, thead, tr, th, td, hr { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }

/* general */
html { height: 100%; overflow-y: scroll; }
body { height: 100%; background-color: #fff; color: #838E92; font: 75%/1.5 sans-serif; }
body:before { content: ""; height: 100%; float: left; width: 0; margin-top: -9999em; }

/* links */
a { -moz-transition: all 0.1s linear; -webkit-transition: all 0.1s linear; -o-transition: all 0.1s linear; transition: all 0.1s linear; }
a:link { -webkit-tap-highlight-color: #719825; }
.post-title a, a { border-bottom: 1px solid #DDD; text-decoration: none; } /* 1 */
a:hover { background: #EBEEF0; } /* 1 */

::selection { color: white; text-shadow: none; } /* 1 */

/* headings */
h1, h2, h3, h4, h5, h6 { font-weight: normal; letter-spacing: -.025em }
h1 { font-size: 24px; margin-bottom: 10px; }
h2 { font-size: 18px; margin-bottom: 8px; }
h3 { font-size: 14px; margin-bottom: 6px; }
h4, h5, h6 { font-weight: normal; font-size: 12px; margin-bottom: 4px; }
h1,h2,h3,h4,h5,h6,
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a { color: #1C140D; }

/* images */
img { max-width: 100% !important; font-style: italic; }
a img, img { color: #999; }
p { margin-bottom: 20px; }

/* lists */
ul { list-style-position: outside; margin: 0 0 0 20px; }
ul ul { list-style: disc; }
ol { list-style-type: decimal; }
li { list-style-position: inside; }

/* ------------------
 * GLOBAL
 * --------------- */
body { font: normal 14px/1.4 'Ovo', Georgia, serif; }
h2 { margin-bottom: 16px; line-height: 1.6em; }
pre { max-height: 500px; margin: 20px 0; padding: 20px; overflow: auto; background-color: #EEE; font-size: small; font-family: monospace, sans-serif; }
blockquote { quotes: none; margin: 20px; padding-left: 20px; border-left: 3px solid #CCC; color: #666; /*font-style: italic; */}
select, input, textarea, button { margin: 0; padding: 5px; font: 99%/1.5 sans-serif; }
input, textarea { border: 1px solid #DADEE1; }
.button { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
input[type="button"], input[type="submit"], input[type="image"], button, .button, label { cursor: pointer; }
small { font-size: 85%; }
.highlight { padding: 1px; background-color: lightYellow; }


/* ------------------
 * LAYOUT
 * --------------- */
#wrapper { position: relative; z-index: 20; width: 100%; min-width: 1010px; min-height: 100%; }
#page { width: 100%; overflow: hidden; padding-bottom: 80px; }


/* -----------------
 * HEADER
 * -------------- */
header[role="banner"] { position: relative; z-index: 50; width: 930px; margin: 40px auto; padding: 0 40px; }

#logo { float: left; width: 170px; margin: 0 40px 0 0; }

#site-title a, 
#site-title a:hover { border: 0; background: none; } /* 1 */
nav[role="navigation"] ul li a, 
#social-menu a { border: 0; color: #485358; }

#site-title, #site-description { margin: 0; }
#site-title { font: 24px/1 'Rokkitt', Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; }
#site-title a { -moz-transition: opacity 0.1s linear; -webkit-transition: opacity 0.1s linear; -o-transition: opacity 0.1s linear; transition: opacity 0.1s linear; }
#logo:not(.home) #site-title a:hover { margin-left: -20px; padding-left: 20px; background: url(images/home.png) no-repeat 0 5px; }
#site-description { color: #838E92; font-size: 12px; line-height: 1.6em; }

nav[role="navigation"] { float: left; height: 35px; margin: 0 0 0 30px; }
nav[role="navigation"] ul { list-style: none; margin: 0; padding: 0; line-height: 35px; }
nav[role="navigation"] ul li { position: relative; float: left; z-index: 40; margin: 0 10px; padding-left: 2px; padding-right: 2px; }
nav[role="navigation"] ul li a { display: block; position: relative; height: 35px; font: 16px 'Microsoft YaHei', Arial, sans-serif; text-decoration: none; text-transform: uppercase; }
/* nav[role="navigation"] ul li.current a { color: #719825; } * 1 */
nav[role="navigation"] ul li a:hover, #social-menu a:hover { background: none; } /* 1 */

#social-menu { list-style: none; float: right; }
#social-menu li { float: left; margin: 0 10px; }
#social-menu a { display: block; height: 15px; padding: 0 0 0 20px; font: 16px 'Rokkitt', Arial, sans-serif; text-decoration: none; }
#social-menu li.twitter a { background: url(images/icon-twitter.png) no-repeat left center; }
#social-menu li.rss a { background: url(images/icon-rss.png) no-repeat left center; }


/* -----------------
 * MAIN & CONTENT
 * -------------- */
#main { width: auto; }

#page-title-bg { position: relative; z-index: 20; width: 100%; min-width: 960px; } /* 1 */
.page-title-inner { position: relative; left: -255px; width: 680px; margin: 0 0 0 50%; padding: 40px; }
.page-title { margin: 0; font: normal normal 48px/1 'Rokkitt', Arial, sans-serif; text-transform: uppercase;  letter-spacing: .05em; } /* 1 */
.page-title-inner .cross { position: absolute; top: 0; left: -5000px; width: 5000px; height: 100%; } /* 1 */
.page-description { margin-bottom: -20px; padding-bottom: 20px; color: white; font-size: 18px; }

#container { width: 930px; margin: 0 auto; padding: 0 40px; }
#content { float: right; width: 680px; padding: 40px; padding-right: 0; }


/* ------------------
 * ARTICLE
 * --------------- */
.post { position: relative; z-index: 30; margin: 0 0 30px 0; padding: 0 0 10px 0; border-bottom: 1px solid #EEE; }
.post-title { margin-bottom: 16px; }
.post p { line-height: 1.7; }/*chinese*/

/* ------------------
 * POST
 * --------------- */
#content > article { width: auto; float: none; margin: 0; border: 0; }
.post ol, .post ul { margin: 0 0 20px 20px; }


/* ------------------
 * COMMENTS
 * --------------- */
#comments, .respond { padding-top: 20px; }
#comments h3 { margin-bottom: 40px; padding-top: 10px; font: 16px 'Rokkitt', Arial, sans-serif; text-transform: uppercase; }
#comments h3, #site-info { border-top: 4px solid #E4E7EA; }
#comments ol, #comments ol, #comments li { list-style: none; padding: 0; }
#comments .comment-list li.comment { clear: both; padding: 40px 0; }
#comments .comment-list li.comment, #comments .comment-list ol.children li.comment { border-top: 1px solid #E4E7EA; }
#comments .comment-list .comment:first-child, .children .comment-list .comment { padding: 0; border: 0; }

.comment-list .comment-body { padding-bottom: 20px; }
#comments > .comment-list { margin: 0 0 -20px 0; padding: 0; }
.comment-list .comment-author { font-weight: bold; font-size: 14px; }
.comment-list .comment-author img { float: left; margin-right: 10px; }
.comment-list .comment-author cite { font: normal 16px 'Rokkitt', Arial, sans-serif; }
.comment-list .comment-author cite a { border: 0; }
.comment-list .comment-meta { margin-bottom: 20px; font-size: 12px; }
.comment-list .comment-meta a { border: none; color: #838E92; }
.comment-list .comment-meta a :hover { color: #719825; }

#comments p { clear: both; margin-bottom: 20px; }
.comment-list p, .comment-list .reply { padding-left: 50px; }

.comment-list p, .comment-list .reply { padding-left: 50px; }
#comments #submit, .reply a { width: auto; padding: 6px 10px 5px; border: 0; font: normal 12px/1.4 'Ovo', Georgia, serif; text-decoration: none; text-transform: uppercase; cursor: pointer; 
-moz-transition: all 0.1s linear; 
-webkit-transition: all 0.1s linear; 
-o-transition: all 0.1s linear; 
transition: all 0.1s linear; 
} /* 1 */
.comment-list .reply a:hover { text-decoration: none; } /* 1 */
#comments .comment-list .children { margin: 20px 0 0 0; padding-left: 50px; }

#comments .comment-list #comment_form { margin-top: 20px; }
#comments .comment-list .respond { margin: 0 0 40px 50px; }
#comments .respond p { padding: 0; }
#comments input { width: 45%; margin: 0 10px 10px 0; padding: 5px; }
#comments textarea { width: 95%; margin-right: 10px; padding: 5px; resize: vertical; }

.respond label.banmail { float: right; margin-right: 5%; padding-right: 0; }
#comments .respond label.banmail input { width: 14px; margin-right: 5px; padding: 0; vertical-align: -2px; }

/* ------------------
 * pagination
 * --------------- */
.pagination ol { margin: 0; }
.pagination ol li { list-style: none; float: left; margin: 0 3px 0 0;  }
.pagination ol li a { display: block; padding: 4px 10px 2px; border: 1px solid #E4E7EA; font-size: 12px; }
.pagination ol li.current a { background: #E4E7EA; }


/* ------------------
 * aside
 * --------------- */
aside[role="complementary"] { position: relative; float: left; z-index: 20; width: 170px; margin: 40px 40px 0 0; }
.widget { margin: 0 0 40px 0; }
.widget ul { list-style: none; margin: 0; }
.widget li { margin-bottom: 10px; }
.widget li a { border: none; } /* 1 */
.widget li a:hover { background: none; } /* 1 */
.widget-title { margin-bottom: 20px; font: normal normal 14px/1 'Rokkitt', Arial, sans-serif; letter-spacing: .05em; text-transform: uppercase; }

/** sidebg */
/* #sidebar, #sidebg { background: #98CC33; } * 1 */
#sidebg { position: absolute; top: 0; left: 0; z-index: 10; width: 50%; height: 100%; margin-left: -255px; }


/* ------------------
 * FOOTER
 * --------------- */
#bottom { position: relative; clear: both; z-index: 100; height: 80px; margin: -80px 0 0 0; }
footer[role="contentinfo"] { position: relative; left: 105px; width: 720px; margin: 0 auto; font-size: 12px; text-transform: uppercase; }
#site-info { margin: 0 0 0 40px; padding: 20px 0 0 0; }
#site-info p { margin: 0; }


/* ------------------
 * HELPERS
 * --------------- */
.left { float: left; }
.right { float: right; }
.hide { display: none; }
.ir { display: block; text-indent: -9999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
.clearfix:before, .clearfix:after, .cf:before, .cf:after { content: ""; display: block; overflow: hidden; }
.clearfix:after, .cf:after { clear: both; }
.clearfix, .cf { zoom: 1; }