/* 公共细节样式 */
* {
    box-sizing: border-box;
}

/* -------------------------------- a link 样式定制---------------------------------- */
#header a,
/*头部两个*/
#sideBar a,
/*右侧所有*/
.postTitle a

/*列表和正文的头部*/
    {
    text-decoration: none;
    position       : relative;
    padding-bottom : 4px;
}

#header a::before,
#sideBar a::after,
.postTitle a::after {
    content      : '';
    display      : inline-block;
    border-bottom: 2px solid currentColor;
    position     : absolute;
    bottom       : 0;
    left         : 0;
    width        : 100%;
    transform    : rotateY(90deg);
    transition   : all .25s;
}

#header a {
    color: #333;
}

#header h1 a {
    font-family: auto;
    color      : white;
}

.postTitle a {
    color: black;
}

#sideBar a {
    color: #666;
}


#header a:hover,
#sideBar a:hover,
.postTitle a:not(#cb_post_title_url):hover {
    color: #c05b4d;
}

#header a:hover::before,
#sideBar a:hover::after,
.postTitle a:hover::after {
    transform: rotateY(0);
}


/* -------------------- 固定好的 公共样式补充------------------- */
#under_post_kb,
#cnblogs_c1,
#ad_t2,
#under_post_news,
#top_nav,
#cnblogs_c2 {
    /* 文章详情底部一些列广告都屏蔽 */
    display: none;
}

img {
    border: 1px solid #ddd;
}

.flex-middle {
    display    : flex;
    align-items: center;
}

pre {
    white-space: pre-wrap;

}

.blogpost-body blockquote {
    background  : #edd;
    border-width: 0;
    border-left : 4px solid #d6c593;
    margin      : 0;
    color       : #233;
}

.cnblogs_code_toolbar {
    /* 代码的粘贴‘图标’ */
    text-align: right;
}

.flex1 {
    flex: 1;
}

#topics p,
#topics li {
    color         : #555;
    font-size     : 14px;
    letter-spacing: 1px;
}

#topics p strong {
    color: #222;
}

/* --------------------------- body 背景，滚动条 定制 ---------------------- */

body {
    background-image: linear-gradient(135deg, rgb(192, 248, 248), rgb(203, 212, 184));
    padding         : 0;
    margin          : 0;
}

body::-webkit-scrollbar {
    width        : 10px;
    border-radius: 9px;
    background   : rgba(81, 110, 163, 0.5);
}

body::-webkit-scrollbar-button {
    height: 0;
}

body::-webkit-scrollbar-thumb {
    background   : rgba(36, 149, 241, 0.5);
    border-radius: 9px;
}

/* --------------------------------1 header -----------------------------------------*/
#header {
    display         : flex;
    justify-content : space-between;
    align-items     : center;
    flex-wrap       : wrap;
    position        : sticky;
    top             : 0;
    z-index         : 2;
    box-shadow      : 0 10px 20px -13px #333;
    background-image: linear-gradient(155deg, rgb(70, 31, 102), rgb(137, 199, 240));


}


/* header 左侧 */
#lnkBlogLogo {
    display: none;
    /* TODO 移出logo */
}

#blogTitle>h2 {
    padding    : 5px 0 0 5px;
    margin     : 0;
    font-size  : 12px;
    color      : wheat;
    font-weight: normal;

}

#header h1 {
    margin     : 0;
    font-weight: normal;
    min-width  : 250px;
}

#header h1 a::after {
    content: '的博客';
}

/* header 右侧 */
#navigator>ul {
    list-style: none;
    display   : flex;
    margin    : 0;
    padding   : 0;
    min-width : 420px;
}

#navigator>ul>li {
    padding: 3px 6px;
    margin : 0 10px;
}

#navigator>.blogStats {
    display: none;
    /* 移出 总览 */
}


/* ------------------------- 中间main总体：layout ---------------------- */
#main {
    display        : flex;
    align-items    : flex-start;
    justify-content: space-between;
    flex-wrap      : wrap;
    width          : calc(100vw - 10px);
    margin         : 42px auto 30px;
}

#main>.clear {
    display: none;
}

@media screen and (max-width:767px) {
    #blogTitle h1 {
        position   : static;
        padding-top: 0 !important;
    }
}

@media screen and (max-width:1299px) {
    #header {
        padding: 12px calc(50% - 440px);
    }

    #mainContent,
    #sideBar {
        max-width: 800px;
        width    : 100%;
        margin   : auto;
    }
}

@media screen and (min-width:1300px) {
    #header {
        padding: 12px 8% 12px 12%;
    }

    #main {
        padding: 0 5vw 0 18vw;
    }

    #mainContent {
        max-width: 1050px;
        width    : 70%;
    }

    #sideBar {
        max-width: 350px;
        width    : 16%;
        min-width: 250px;
    }
}

/*--------------- 2 中间基本样式 和 layout无关的：--------------- */
#sideBar ul {
    list-style: none;
    padding   : 0;
}

#sideBar li {
    width        : 100%;
    white-space  : nowrap;
    overflow     : hidden;
    text-overflow: ellipsis;
    padding      : 3px 0 10px;
}

#profile_block,
#sidebar_scorerank li {
    color: #666;
}

#sideBar h3 {
    font-weight: normal;
}

/* 2 中间内容： */
#topics {
    background-color: white;
    border-radius   : 4px;
    padding         : 16px 50px 30px;
}

#cb_post_title_url {
    font-weight: normal;
    font-size  : 32px;
}

/* --------------------------------------底部细节 --------------------- */
#topics .postDesc {
    /* 总介 */
    color    : #aaa;
    font-size: 14px;
    padding  : 6px 0;
}

#footer {
    /* 页脚 @copyright */
    text-align: center;
    color     : #999;
    font-size : 12px;
    padding   : 0 0 16px;
}


#green_channel {
    /* 分享不要 border 了 */
    border: none;
}

#author_profile {
    display: none;
}

#div_digg {
    /* 推荐和反对 与 分享放在一行 */
    margin-top: -62px;
}

/* ----------------------- 评论相关：----------------------- */
#blog-comments-placeholder {
    margin-top: 32px;
}

.feedback_area_title {
    padding-bottom: 14px;
}

.feedbackItem {
    background   : white;
    padding      : 16px 32px;
    font-size    : 12px;
    border-radius: 4px;
}

.feedbackItem a {
    color          : #666;
    text-decoration: none;
}

.feedbackItem:not(:last-child) {
    margin-bottom: 18px;
}

#comment_nav a {
    color    : #666;
    font-size: 12px;
    padding  : 8px;
}

#commentform_title {
    margin-bottom: 2px;
}

#commentbox_opt,
#commentbox_opt input {
    margin   : 2px 0;
    font-size: 12px;
}

#commentbox_opt input {
    background   : transparent;
    color        : #c05b4d;
    border       : 1px solid #c05b4d;
    border-radius: 4px;
    cursor       : pointer;

}

#commentbox_opt input:hover {
    box-shadow : 0 0 8px -2px;
    text-shadow: 0 0 20px;
}

#commentbox_opt a {
    color          : #666;
    text-decoration: none;
}

#commentbox_opt a:hover {
    text-decoration: underline;
    color          : #333;

}

#tip_comment2~p {
    display: none;
}

/* --------------------------首页列表----------------------------- */
.day:not(:last-child) {
    margin: 0 0 40px;
}

.day {
    background-color: white;
    padding         : 22px 42px;
    border-radius   : 6px;
    box-shadow      : 0 5px 18px -8px #999;
}

.postTitle a {
    font-size     : 26px;
    padding-bottom: 8px;
}

.dayTitle a {
    float          : right;
    color          : #999;
    text-decoration: none;
}

.dayTitle a:hover {
    color: #666;
}

.c_b_p_desc {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size  : 14px;
    padding    : 10px 0;
    color      : #666;
}

.c_b_p_desc a {
    color          : cornflowerblue;
    text-decoration: none;
}

.c_b_p_desc a:hover {
    text-decoration: underline;
    color          : rgb(56, 113, 218);
}

.postDesc,
.postDesc a {
    font-size: 12px;
    color    : #999;
}

.postDesc a:hover {
    color: #555;
}

/* ---- */