*{
    margin: 0;
    padding: 0;
}
body{
    text-align: left;
    margin: 0;
    padding: 0;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif;
    font-size: 16px;
    letter-spacing: 1px;
    box-sizing: border-box;

    overflow-y: scroll; /*主动提供滚动机制*/
    /*scrollbar-base-color: transparent;
    scrollbar-darkshadow-color: transparent;
    scrollbar-highlight-color: transparent;
    scrollbar-face-color: transparent;*/

}
/*说是图片自适应,没看到效果*/
img {
    width: auto;
    max-width: 100%;
}
/*所有a标签都不显示下划线，并且为黑色*/
a{
    text-decoration: none;
    color: inherit;
}
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
    line-height: 2em;
}
h3 {
    display: block;
    font-size: 1.17em;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}
ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}
li {
    display: list-item;
    text-align: -webkit-match-parent;
}
.end{
    color: #999;
    margin-top: 2em;
}

/*首页*/
#index-wrapper {
    max-width: 600px;
    margin: 2em auto;
    text-align: center;
    padding-top: 40px;
}
#index-wrapper h1 {
    font-size: 4em;
    background-size: 106px 64px;
}
#index-wrapper .oj-follow-me {
    padding: 1em;
    border: 1px solid #000;
    border-right: none;
    border-left: none;
    display: inline-block;
    line-height: 1em;
}
#index-wrapper .goto-blog {
    margin: 2em 0 1em;
}
/*调间隔*/
#index-wrapper .goto-blog a{
    margin-left: 10px;
    margin-right: 10px;
}
#index-wrapper a {
    color: #000;
    text-decoration: none;
}
#index-wrapper .recent-posts {
    margin: .5em 0 0;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif;
    font-size: 16px;
    line-height: 1.8em;
    letter-spacing: 1px;
}
#index-wrapper .recent-posts h2 {
    position: relative;
    font-size: .618em;
    font-weight: 100;
    color: #999;
    margin: 0 auto;
    padding: 0;
    line-height: 50px;
}
#index-wrapper .recent-posts ul {
    display: inline-block;
    min-width: 300px;
    background: #f5f5f5;
    list-style: none;
    margin: -3em 0 0;
    padding: 2.5em 1em 2em;
}
#index-wrapper .recent-posts li {
    margin: 0;
    padding: 0;
    text-align: left;
}

#index-wrapper .recent-posts .datetime {
    color: #999;
    font-size: .618em;
    margin-left: .5em;
}
#index-wrapper .footer .emoji {
    display: block;
    font-size: 4em;
    height: 42px;
    line-height: 42px;
}

/*文章列表页面，及文章详细页面 由1000px改为800px*/
.page-wrapper{
    max-width: 800px;
    margin: 0 auto;
    padding: 40px 20px 120px;
}
.page-wrapper a {
    color: inherit;
    box-shadow: 0 1px 0 0 #fff, 0 2px 0 0 #333;
    transition: .3s;
}
.page-wrapper a:hover {
    color: #05c; /*鼠标放上去时的颜色*/
}
.page-wrapper h2, .page-wrapper h3, .page-wrapper h4 {
    margin-top: 2em;
}
.page-card{
    margin-bottom: 4em;
}
.page-time {
    font-size: 12px;
    color: #999;
    margin-bottom: 10px;
}
.post-card h2 {
    font-weight: 400;
    font-size: 24px;
    margin-top: 0;
}
.post-summary span.summary {
    margin-right: 1em;
}
.post-box h1.post-title {
    font-weight: 400;
    font-size: 30px;
    margin: 0;
}
.post-box .post-time, .post-box figcaption {
    font-size: 12px;
    color: #999;
}
.post-box .post-content {
    padding: 1em 0;
}
.post-info {
    font-size: 12px;
    color: #999;
    margin-bottom: 10px;
}
/*设置显示字体的样式*/
#wordsView p{
    color: rgb(0,0,0);
    display: block;
    /*设置字体之间的间距*/
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    /*p内部之间的行间距*/
    line-height: 1.8em;
    /*p与p【段落与段落】之间的间距*/
    margin: .9em 0 0;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif;
    font-size: 16px;
    letter-spacing: 1px;
}
/*分页*/

.pager {
    line-height: 3em;
    font-size: 80%;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif;
    letter-spacing: 1px;
}
.pager .pager_span, .pager .pager_a {
    display: inline-block;
    line-height: 1.5em;
    padding: 2px .5em;
    margin-right: 3px;
    background: #333;
    color: #fff;
    border-radius: 1px;
    border: 1px solid #333;
    text-decoration: none;
}
.pager .pager_span{
    background: #fff;
    color: #333;
}
.pager .pager_a {
    box-shadow: none;
}


/*留言*/
.contact-form>h3 {
    font-size: 24px;
    margin-bottom: 20px;
}

.page-wrapper h2, .page-wrapper h3, .page-wrapper h4 {
    margin-top: 2em;
}



form {
    display: block;
    margin-top: 0em;
}
.post-comments {
    padding-bottom: 40px;
    font-size: 14px;
}
.post-comments>h3 {
    font-size: 24px;
    margin-bottom: 20px;
}
.In, .contact-form .ln {
    margin-bottom: 20px;

    margin-top:20px;
}
.comment-form label, .contact-form label {
    display: block;
    margin-bottom: 5px;
}
label {
    cursor: default;
}
.comment-form textarea, .contact-form textarea {
    height: 12em;
}

.comment-form input, .comment-form textarea, .contact-form input, .contact-form textarea {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 8px;
    border: 1px solid #999;
    font-size: 16px;
    line-height: 1.8em;
    border-radius: 0;
    -webkit-appearance: none;
}
.comment-form .ln.submit, .contact-form .ln.submit {
    text-align: right;
    padding-bottom: 60px;
}
.comment-form input[type=button], .contact-form input[type=button] {
    background: #333;
    color: #fff;
    border: #333;
    width: auto;
    padding: 12px 2em;
    margin-top: 2em;
    cursor: pointer;
}
/*留言按钮样式*/
/* 默认样式 */
.In.submit input[type="submit"] {
    background: #4a4a4a; /* 默认深灰色背景 */
    color: #fff; /* 白色文字 */
    border: none; /* 无边框 */
    border-radius: 5px; /* 圆角 */
    font-size: 16px; /* 字体大小 */
    padding: 10px 20px; /* 内边距 */
    cursor: pointer; /* 鼠标变为手型 */
    transition: background-color 0.2s ease; /* 背景色平滑过渡 */
}

/* 鼠标悬浮效果 */
.In.submit input[type="submit"]:hover {
    background: #5a5a5a; /* 比默认稍浅的灰色 */
}

/* 鼠标按下效果 */
.In.submit input[type="submit"]:active {
    background: #666666; /* 更浅的灰色 */
}

.contact-form .inform {
    margin: 20px 0;
}

/*sucess*/
.inform-wrapper {
    max-width: 480px;
    margin: 40px auto;
    font-size: 16px;
    box-sizing: border-box;
    background: #f5f5f5;
    padding: 40px 20px;
}
.inform-wrapper>.title {
    font-size: 24px;
    margin-bottom: 2em;
}
.inform-wrapper>.title a {
    color: inherit;
}
.inform-wrapper .nav {
    margin-top: 40px;
    font-size: 12px;
}
.inform-wrapper .nav a {
    margin-right: 1em;
}
.inform-wrapper a {
    color: #05c;
}

.no-record {
    color: #999;
    font-style: italic;
    padding: 2em 0;
}

.post-neighbors {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    font-size: 12px;
    padding: 20px 0;
    margin: 20px 0 40px;
}
/*上 右 下 左*/
.post-previous {
    padding: 5px 0;
    margin: 5px 0 5px;
}

/* 调整验证码外观区域 */
#captcha-container {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
/* 验证码图片 */
#captcha-image {
    width: 100px; /* 固定验证码图片宽度 */
    height: 40px; /* 固定验证码图片高度 */
    background: #f8f8f8; /* 设置占位背景颜色 */
    border: 1px solid #ddd;
    border-radius: 4px;
    display: inline-block;
    visibility: hidden; /* 保持占位，但图片不可见 */
    margin-right: 15px; /* 增加验证码与输入框之间的距离 */

}

.captcha-tip {
    margin-left: 10px;
    font-size: 12px;
    color: #999;
}

/* 验证码输入框 */
#comment-captcha {
    width: 260px; /*修改为适中的宽度*/
    height: 40px;
    padding: 5px 10px;
    border: 2px solid #ddd;
    border-radius: 5px;
    font-size: 14px;
}