/* 把我们所有标签的内外边距清零 */
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td {
    margin: 0;
    padding: 0
}
/* em 和 i 斜体的文字不倾斜 */
em,
i {
    font-style: normal
}
/* 去掉每个li前面的小圆点 */
li {
    list-style: none
}
img {
    border: 0;/* 为了照顾低版本浏览器,如果 图片的外面包含了链接 会出现边框的问题 */
    vertical-align: middle /* 解决图片底侧出现空白缝隙的问题 */
}
button {
    cursor: pointer /* 当我们鼠标经过button时,鼠标变成小手的样子 */
}
a {
    color: #666;
    text-decoration: none
}
a:hover {
    color: #c81623
}
button,
input {
    font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif
}
body {
    /* 抗锯齿性,避免文字被放大后会产生锯齿 */
    -webkit-font-smoothing: antialiased;
    background-color: #fff;
    /* 12px/1.5 表示所有字体的大小为12px,1.5倍的行高 */
    /* "\5B8B\4F53" 代表的是宋体，用这种方式，浏览器的兼容性会比较好。 把中文字体的名称用相应的Unicode编码来代替，这样就可以有效地避免浏览器解释CSS代码时出现乱码的情况*/
    font: 12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;
    color: #666
}

@font-face {
    font-family: 'AlibabaPuHuiTi';
    src: url('/assets/Alibaba-PuHuiTi-B.woff2') format('woff2'),
        url('/assets/Alibaba-PuHuiTi-B.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}



.hide,
.none {
    display: none
}
/* 清除浮动用 */
.clearfix:after {
    visibility: hidden;
    clear: both;
    display: block;
    content: ".";
    height: 0
}
.clearfix {
    *zoom: 1
}

/* 文章列表分页导航栏 */
.pagination { width: 100%; background-color: white;margin-left: 30% ; }
.nav-links { text-align: center; }
.pagination a:hover { color: white; background-color: #ff5c5c; }
.page-numbers { font-size: 1.2rem; padding: 0 0.4rem; border: 1px solid #ccc; color: #595959; }
.current { background-color: #ff5c5c; color: white; }
.dots { border: none; }

/* 评论样式设计 */
.comment_ol {
    background-color: white;
}

.comment {
    /* 文字换行 */
    word-wrap: break-word;
    word-break: normal;
    padding: 10px;
}

.gravatar {
    float: left;
    margin-right: 15px;
}

.gravatar img {
    border: 3px solid #fff;
    box-shadow: 0 0 5px rgba(0,0,0,.15);
    display: inline-block;
    position: relative;
    width: 3.125rem;
}

.comment_content {
    background-color: white;
    border-bottom: 1px solid #ccc;
}

.comment_text {
    font-size: 1.2rem;
    line-height: 2rem;
}

.comment_time {
    color: #ccc;
}

/* =============================导航菜单栏======================= */


.menu-item a {
    padding: 0 5px;
    color: black;
}

.menu-item:hover>a {
    color: white;
}

/* 当鼠标经过菜单栏时,显示子菜单 */
.menu-item:hover>.sub-menu {
    display: block;
}

li:hover {
    color:gray;
}

.current-menu-item {
    background-color: #fff;
    color:gray;
}

.current-menu-item>a {
    color: white;
}

/* 屏幕宽度大于768时的样式,用于让电脑隐藏子菜单,手机不隐藏子菜单,请放于style.css中 */
@media screen and (min-width: 768px) {

    /* 这里的样式是抄的bootstrap5中dropdown-menu的css */
    .sub-menu {
        position: absolute;
        z-index: 1000;
        display: none;
        min-width: 10rem;
        padding: .5rem 0;
        margin: 0;
        font-size: 1rem;
        color:#26f946;
        text-align: left;
        list-style: none;
        background-color: #fff;
        background-clip: padding-box;
        border: 1px solid rgba(0, 0, 0, .15);
        border-radius: .25rem;
    }
}

.sub-menu li {
    /* 这里的样式是抄的bootstrap5中dropdown-item的css */
    display: block;
    width: 100%;
    padding: .25rem 1rem;
    clear: both;
    font-weight: 400;
    color: #c81623;
    text-align: inherit;
    text-decoration: none;
    white-space: nowrap;
    border: 0;
}



.sub-menu>li>.sub-menu {
    left: 100%;
    top: 0;
}

/* 点赞 */
.post-like{text-align:center;padding:2vh}
.post-like a{ background-color:#21759B;border-radius: 3px;color: #FFFFFF;font-size: 12px;padding: 5px 10px;text-decoration: none;outline:none}
.post-like a.done, .post-like a:hover{background-color:#eee;color:#21759B;}
.post-like a.done{cursor:not-allowed}