.clearfix::after {
    content: '';
    display: table;
    clear: both
}

@media screen and (min-width:980px) {
    body .page__post {
        margin-right: 30px
    }
}

.page__content {
    overflow: hidden
}

.post__cover {
    width: 100%
}

.post__cover>img {
    display: block;
    text-align:center;
}

.post__info {
    margin: 60px 0
}

.post__title {
    font-size: 2em;
    color: #242f35;
    margin: .5em 0;
    font-weight: 400;
    line-height: 1
}

.post__mark {
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.mark__block {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 15px
}

.mark__block .mark__icon {
    font-size: 18px;
    margin-right: 5px
}

.mark__block .mark__list {
    list-style: none;
    margin: 0;
    padding: 0
}

.mark__block .mark__item {
    float: left;
    margin-right: 5px
}

.mark__block .mark__item>span {
    vertical-align: middle
}

.mark__block .mark__item>a {
    font-size: inherit;
    text-decoration: none;
    transition: color .3s;
    color: #666;
    vertical-align: middle
}

.mark__block .mark__item>a:hover {
    color: #19abd6
}

.mark__block .mark__item:not(:last-child)::after {
    display: inline-block;
    content: ','
}

.post__content {
    word-wrap: break-word;
    overflow-wrap: break-word
}

.post__content h1 {
    font-size: 2em
}

.post__content h2 {
    font-size: 1.8em
}

.post__content h3 {
    font-size: 1.6em
}

.post__content h4 {
    font-size: 1.4em
}

.post__content h5 {
    font-size: 1.2em
}

.post__content h6 {
    font-size: 1em
}

.post__content a,
.post__content abbr,
.post__content acronym,
.post__content address,
.post__content applet,
.post__content big,
.post__content blockquote,
.post__content body,
.post__content caption,
.post__content cite,
.post__content code,
.post__content dd,
.post__content del,
.post__content dfn,
.post__content div,
.post__content dl,
.post__content dt,
.post__content em,
.post__content fieldset,
.post__content form,
.post__content h1,
.post__content h2,
.post__content h3,
.post__content h4,
.post__content h5,
.post__content h6,
.post__content html,
.post__content iframe,
.post__content img,
.post__content ins,
.post__content kbd,
.post__content label,
.post__content legend,
.post__content li,
.post__content object,
.post__content ol,
.post__content p,
.post__content pre,
.post__content q,
.post__content s,
.post__content samp,
.post__content small,
.post__content span,
.post__content strike,
.post__content strong,
.post__content sub,
.post__content sup,
.post__content table,
.post__content tbody,
.post__content td,
.post__content tfoot,
.post__content th,
.post__content thead,
.post__content tr,
.post__content tt,
.post__content ul,
.post__content var {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-family: inherit;
    vertical-align: baseline
}

.post__content blockquote,
.post__content dl,
.post__content h1,
.post__content h2,
.post__content h3,
.post__content h4,
.post__content h5,
.post__content h6,
.post__content img,
.post__content ol,
.post__content p,
.post__content ul {
    margin: 0;
    outline: 0;
    border: 0
}

.post__content blockquote:not(:last-child),
.post__content dl:not(:last-child),
.post__content h1:not(:last-child),
.post__content h2:not(:last-child),
.post__content h3:not(:last-child),
.post__content h4:not(:last-child),
.post__content h5:not(:last-child),
.post__content h6:not(:last-child),
.post__content img:not(:last-child),
.post__content ol:not(:last-child),
.post__content p:not(:last-child),
.post__content ul:not(:last-child) {
    margin-bottom: 21px
}

.post__content h1,
.post__content h2,
.post__content h3,
.post__content h4,
.post__content h5,
.post__content h6 {
    line-height: 1;
    font-weight: 400;
    color: #242f35;
    margin-top: 35px
}

.post__content dl,
.post__content ol,
.post__content ul {
    padding-left: 1.5em
}

.post__content blockquote {
    position: relative;
    padding: 1.5em;
    border-left: 5px solid #e4e4e4;
    background-color: rgba(164, 177, 191, .1);
    overflow: hidden
}

.post__content a {
    color: #19abd6;
    transition: color .3s;
    text-decoration: none
}

.post__content a:active,
.post__content a:hover {
    color: #3ac0e8;
    text-decoration: underline
}

.post__content .highlight {
    background-color: #272822;
    margin: 21px 0;
    color: #fff;
    padding: .5em;
    -webkit-overflow-scrolling: touch;
    overflow: auto;
    font-size: 12px;
    font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier, monospace
}

.post__content .highlight+.post__content .highlight {
    margin: 10px 0
}

.post__content .highlight+.post__content .highlight:last-child {
    margin-bottom: 21px
}

.post__content .highlight table {
    width: auto;
    margin: 0;
    border: 0
}

.post__content .highlight table tr td,
.post__content .highlight table tr th {
    border: 0;
    padding: 0;
    background-color: transparent !important
}

.post__content .highlight .line {
    height: 22px
}

.post__content .highlight .gutter pre {
    min-width: 18px;
    margin-right: .8em;
    text-align: right;
    color: #8f908a
}

.post__content .highlight .code .tag .name {
    color: #f92672
}

.post__content .highlight .code .tag .attr {
    color: #74e22e
}

.post__content .highlight .code .tag .string {
    color: #e6db74
}

.post__content .highlight .code .comment {
    color: #75715e
}

.post__content .highlight .code .keyword {
    color: #66d9ef
}

.post__content .highlight .code .attr {
    color: #e6db74
}

.post__content .highlight .code .literal,
.post__content .highlight .code .number {
    color: #ae81ff
}

.post__content .highlight .code .string {
    color: #e6db74
}

.post__content .highlight .code .built_in {
    color: #66d9ef
}

.post__content .highlight .code .function {
    color: #66d9ef
}

.post__content .highlight .code .function .params {
    color: #fd9720
}

.post__content code {
    padding: 0 .4em;
    margin: 0;
    background-color: rgba(27, 31, 35, .05);
    border-radius: 3px;
    font-weight: 400;
    word-break: break-all
}

.post__content hr {
    border: 0;
    border-top: 1px solid #e4e4e4;
    margin: 1.5em 0
}

.post__content img {
    max-width: 100%
}

.post__content img:not(:last-child) {
    margin-bottom: 10px
}

.post__content table {
    width: 100%;
    border: 1px solid #d8e5f3;
    border-collapse: collapse
}

.post__content table th {
    font-weight: 700
}

.post__content table td,
.post__content table th {
    padding: .5em;
    text-align: left;
    border: 1px solid #ddd
}

.post__content table tbody>tr:nth-child(2n+1)>td {
    background-color: rgba(102, 128, 153, .05)
}

.post__content .post-announce {
    margin: 2em 0
}

.post__content .post__prevs {
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    font-size: 0;
    font-weight: 700;
    padding-top: 10px;
    border-top: 1px dashed #ddd
}

.post__content .post__prev {
    -ms-flex: 1 0 0;
    flex: 1 0 0;
    overflow: hidden
}

.post__content .post__prev>a {
    font-size: 14px;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #666;
    text-decoration: none;
    cursor: pointer;
    transition: color .3s;
    text-decoration: none
}

.post__content .post__prev>a.actived {
    color: #3ac0e8
}

.post__content .post__prev>a:active,
.post__content .post__prev>a:hover {
    color: #3ac0e8
}

.post__content .post__prev>a>i {
    font-size: 16px
}

.post__content .post__prev--right {
    text-align: right
}