* {
    margin: 0;
    padding: 0;
}

body {
    margin: 0;
    font-family: Arial, Helvetica, Georgia, Sans-serif;
    font-size: 12px;
    text-align: left;
    background: #f0f0f0;
    color: #000;
}

.clear {
    clear: both;
}

.clear:after {
    visibility: hidden;
    display: block;
    content: " ";
    clear: both;
    height: 0;
}

.hidden {
    display: none;
}

ol, ul, ul li {
    list-style-type: none;
}

input:focus {
    outline: none;
}

small {
    font-size: inherit;
}

pre {
    border: 1px solid #ccc;
    padding: 10px;
    margin-bottom: 1em;
    text-indent: 0;
}

hr {
    height: 1px;
    border: 1px dotted #ccc;
}

a img {
    border: none;
}

a {
    outline: none;
    border-radius: 5px;
    text-decoration: none;
    padding: 2px 4px;
    color: #2ad;
}

a:hover {
    background: #2ad;
    text-decoration: none;
    color: #fff;
}

a:active {
    background: red;
}

li.current a:hover {
    cursor: default;
}

*::-moz-selection {
    background: #ccc;
    outline: 1px solid red;
}

*::selection {
    background: #ccc;
    outline: 1px solid red;
}

#wrapper {
    width: 980px;
    margin: 0 auto;
    padding: 0 20px;
}

#container {
    margin: 10px 5px;
    overflow: hidden;
    text-align: left;
}

.content {
    float: left;
    width: 750px;
}

#sidebar {
    float: right;
    width: 200px;
    padding: 0 10px;
}

footer {
    padding: 10px 10px 40px;
    margin: 10px 0 0;
    line-height: 180%;
    border-top: 1px solid #ccc;
}

header {
    margin: 10px 0;
    position: relative;
}

#hgroup {
    margin-left: 20px;
    margin-bottom: 5px;
    height: 100%;
    font-weight: bold;
}

#hgroup h1 {
    font-size: 40px;
    display: inline-block;
}

#hgroup h1 a {
    color: #888;
}

#hgroup h1 a:hover {
    color: #2ad;
    background-color: #f0f0f0;
    text-decoration: none;
}

.description {
    color: #888;
    font-size: 12px;
    display: inline;
}

#navs {
    border-bottom: 1px solid #CCC;
}

#navs ul {
    margin-left: 20px;
    height: 28px;
    line-height: 27px;
}

#navs li {
    margin-bottom: -1px;
    margin-left: -1px;
    float: left;
}

#navs a {
    border-radius: 0;
    display: block;
    padding: 0 14px;
    border-width: 1px;
    border-style: solid;
    border-color: #ccc;
}

#navs li.current {
    border-bottom: 1px solid #f0f0f0;
}

#navs li.current a {
    color: #888;
    border-bottom-style: none;
}

#navs li a:hover {
    color: #fff;
}

#navs li.current a:hover {
    background-color: #888;
}

.subnav {
    height: 20px;
    font-weight: normal;
    position: absolute;
    right: 14px;
    top: 5px;
}

.subnav li {
    float: left;
    margin-left: 20px;
}

#searchform {
    width: 200px;
    height: 20px;
    background-color: #fff;
    border: 1px solid #ccc;
    position: absolute;
    bottom: 7px;
    right: 14px;
}

#searchform:active {
    border: 1px solid #000;
}

#searchform input[type="search"] {
    padding: 2px 2px 3px;
    color: #ccc;
    font-size: 12px;
    width: 175px;
    border: 0;
    margin-left: -2px;
    -webkit-appearance: textfield;
}
#searchform label {
    font-size: 0;
}

#searchform input[type="search"]:focus {
    color: #000;
}

#searchform .submit {
    background: url(img/mag.gif);
    height: 20px;
    width: 20px;
    border: 0;
    float: right;
    cursor: pointer;
}

#searchform .submit:hover {
    background-position: 0 -20px;
}

.place h2 {
    display: block;
    padding: 5px;
    border: 1px solid #ccc;
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 14px;
}

.post {
    margin: 0 11px;
    text-align: justify;
    border-bottom: 1px solid #ccc;
}

.is_post .post, .is_page .post {
    border-bottom: none;
}

.post h2 {
    margin: 5px 0;
}

.post h2 a {
    color: #000;
    font-size: 16px;
    border-left: 4px solid #ccc;
    border-radius: 0 5px 5px 0;
}

.post h2 a:hover {
    background: #2ad;
    border-left-color: #888;
    text-decoration: none;
    color: #fff;
}

.entry {
    line-height: 150%;
    overflow: hidden;
}

.entry p {
    margin: 5px 0 10px;
}

.entry img {
    margin: auto;
    max-width: 98%;
}

.protected {
    border: 1px solid #ccc;
    margin: 0 10px 10px;
    padding: 10px;
}

.protected .text {
    border: 1px solid #ccc;
    margin-left: 2em;
    margin-right: 10px;
    padding: 2px 5px 3px;
}

.protected .text:focus {
    box-shadow: 0 0 5px 1px #2ad;
}

.protected input {
    display: inline-block;
    border: 1px solid #ccc;
}

.protected .submit {
    padding: 1px 4px 2px;
}

.more a {
    margin-left: 10px;
    font-size: 14px;
    padding: 3px 6px;
    border-radius: 5px;
}

.more a:hover {
    background: #2ad;
    text-decoration: none;
    color: #fff;
}

.meta {
    margin: 0 0 10px 10px;
    display: block;
    color: #888;
}

.meta>*:not(:last-child) {
    padding-right: 5px;
    margin-right: 5px;
    border-right: 1px solid #ccc;
}

.commentNum {
    float: right;
}

.pagenav {
    margin: 5px 15px;
    padding: 0;
}

.pagenav:empty {
    display: none;
}

.pagenav ol {
    line-height: 200%;
    min-height: 24px;
}

.pagenav ol li {
    display: inline;
    margin: 0 5px 0 0;
}

.pagenav ol li a {
    border: 1px solid #ccc;
    padding: 2px 6px;
    text-decoration: none;
}

.pagenav ol li a:hover {
    border-color: #2ad;
}

.pagenav ol li.current a:hover {
    cursor: normal;
}

.pagenav ol li.current a {
    background: #888;
    color: #fff;
}

.widget {
    margin-bottom: 10px;
}

.widget h3 {
    border-bottom: 1px dotted #888;
    color: #888;
    padding: 3px 0;
    font-size: 12px;
    margin-bottom: 5px;
}

.widget li {
    padding-left: 2px;
    height: 19px;
    line-height: 19px;
    margin: 3px 0;
    overflow: hidden;
    border-left: 3px solid #ccc;
}

.widget li:hover {
    border-color: #888;
}

.info {
    padding: 5px;
    border: 1px solid #888;
    line-height: 150%;
    text-shadow: 1000px 1000px 1px #888;
    transform: translate(-1000px, -1000px);
    -webkit-transform: translate(-1000px, -1000px);
    -moz-transform: translate(-1000px, -1000px);
}

.info:hover {
    background-color: #ccc;
}

.links ul {
    display: block;
    height: 200%;
}

.links li {
    float: left;
    margin: 3px 5px 10px 5px;
    overflow: visible;
    border: none;
}

.links li a {
    border-radius: 0;
    outline: 1px solid #ccc;
    padding: 3px 5px;
}

.links li a:hover {
    outline: 0;
    border-radius: 5px;
    background: #2ad;
    text-decoration: none;
    color: #fff;
}

#copyright {
    float: right;
}

#copyright li {
    float: left;
}

#copyright li:not(:first-child) {
    border-left: 1px solid #ccc;
}

#copyright li a {
    margin: 0 2px;
}

#comments {
    padding: 10px;
}

#comment_header {
    height: 28px;
    line-height: 27px;
    border-bottom: 1px solid #CCC;
}

#comment_header_left {
    float: left;
    margin-left: 20px;
}

#comment_header_left li {
    margin-right: 10px;
    float: left;
}

#comment_header_left li:empty {
    display: none;
}

#comment_header_left a, #comment_header_right a {
    padding: 7px 12px 6px;
    border-radius: 0;
}

#comment_header_right {
    float: right;
    margin-right: 20px;
}

#comment_header li {
    border: 1px solid #ccc;
}

#comment_header_right li.current {
    border-bottom-color: #f0f0f0;
}

#comment_header_right li.current a {
    color: #888;
}

#comment_header_right li.current a:hover {
    background: #888;
    color: #fff;
}

#comment_area, #trackback_area {
    margin: 10px 0;
    border-bottom: 1px solid #ccc;
}

.cancel_comment_reply {
    margin-bottom: 10px;
}

.comment-list {
    list-style: none;
}

.comments-body {
    background: #fff;
    border: 1px solid #ccc;
    margin: 10px;
    padding: 10px;
}

.comments-body.odd:not(.admin-comment) {
    background: #f0f0f0;
}

.admin-comment {
    background: url("img/author.png") no-repeat scroll right bottom #f4f8fd;
}

.comment_closed, .no-comment {
    color: #888;
    margin: 10px;
    padding: 10px;
    border: 1px solid #ccc;
}

.allowed_tag pre {
    white-space: nowrap;
    margin-top: 12px;
}

.avatar {
    border: 1px solid #ccc;
    background: #fff;
    width: 50px;
    height: 50px;
    padding: 2px;
    display: inline;
    float: left;
    margin: 0 10px 0 0;
}

.avatar:hover {
    border: 1px solid #3ae;
    background: #9de;
}

.author_avatar:hover {
    background: none;
}

.comment-meta>cite {
    display: block;
    margin-bottom: 5px;
}

.comment-act {
    float: right;
}

.comment-act a {
    border-radius: 0;
    border: 1px solid #2ad;
    text-transform: uppercase;
}

.children .comments-body {
    margin: 10px 0 0;
}

.comment-content {
    padding-top: 10px;
    line-height: 150%;
}

.comment_form_wrapper {
    background: #fafafa;
    border: 1px solid #ccc;
    padding: 10px;
}

#comments>#respond {
    margin: 10px 10px 0;
}

#comments-body>#respond {
    margin-top: 10px;
}

#comment_textarea {
    margin: 10px 0;
}

#comment_textarea .comment {
    border: 1px solid #ccc;
    height: 150px;
    overflow: auto;
    resize: vertical;
    width: 98%;
    padding: 5px;
    color #ccc;
}

#comment_textarea .comment:focus {
    color: #000;
}

#submit_comment_wrapper {
    text-align: center;
    margin-top: 10px;
}

.submit_comment, .comment_msg {
    outline: none;
    border: 1px solid #ccc;
    background: #fff;
    padding: 5px 10px 6px;
}

.submit_comment {
    float: right;
}

.submit_comment:hover {
    border-color: #2ad;
    color: #2ad;
}

.comment_msg {
    float: left;
    color: green;
}

.comment_msg.error {
    color: red;
}

#guest_info {
    margin-left: 5px;
}

#guest_info>div {
    margin-bottom: 10px;
}

#guest_info label {
    width: 50px;
    display: inline-block;
}

#guest_info input {
    width: 50%;
    height: 18px;
    padding-left: 5px;
    padding-bottom: 2px;
    border: 1px solid #ccc;
}

.commentform input:focus, .commentform textarea:focus {
    box-shadow: 0 0 4px #2ad;
    outline: none;
}

#return_top a {
    color: #888;
    background-color: #e0e0e0;
    outline: 0;
    text-transform: uppercase;
    bottom: 20px;
    display: block;
    position: fixed;
    right: 20px;
    font-size: 16px;
    font-weight: bold;
    transform: rotate(90deg);
    transform-origin: 100px 10px;
    -moz-transform: rotate(90deg);
    -moz-transform-origin: 100px 10px;
    -webkit-transform: rotate(90deg);
    -webkit-transform-origin: 100px 10px;
}

#return_top a:hover {
    background-color: #2ad;
    color: #fff;
}

/* 动画效果 */
@media screen and (min-width:768px) {
    a, .ani, .anis *:not(.na) {
        -webkit-transition: all .25s ease-in-out;
        -moz-transition: all .25s ease-in-out;
        transition: all .25s ease-in-out;
    }

    #sidebar li {
        -webkit-transition: color, background-color .25s ease-in-out;
        -moz-transition: color, background-color .25s ease-in-out;
        transition: color, background-color .25s ease-in-out;
    }

    ol.linenums li {
        -webkit-transition: background .25s ease-in-out;
        -moz-transition: background .25s ease-in-out;
        transition: background .25s ease-in-out;
    }
}

@media screen and (max-width:980px) {
    #wrapper {
        width: auto;
    }

    #hgroup .subnav, #searchform {
        display: none;
    }

    .description {
        display: block;
    }

    #navs {
        border-bottom-style: none;
    }

    #navs ul {
        margin-left: 0;
    }

    .content {
        width: auto;
    }

    .entry .more, .post .meta > :nth-last-of-type(2), .commentNum {
        display: none;
    }

    #sidebar {
        width: auto;
        float: none;
    }

    .widget {
        width: 30%;
    }

    .widget {
        float: left;
        margin-left: 10px;
    }

    .widget:first-child, .widget:nth-last-child(2), .links {
        display: none;
    }

    #copyright > :nth-child(n+3) {
        display: none;
    }
}

@media screen and (max-width:640px) {
    .smallscreen {
        display: block;
    }

    .widget {
        width: 48%;
    }

    #return_top a {
        transform: none;
        -moz-transform: none;
        -webkit-transform: none;
        position: absolute;
        bottom: auto;
    }
}

@media screen and (max-width:480px) {
    .widget {
        width: 98%;
    }
}

/* html5 for IE */
article, aside, dialog, footer, header, section, footer, nav, figure, menu {
    display: block
}