html {
  scroll-behavior: smooth;
}
img {
  max-width: 100%;
  height: auto;
}
.article-container table {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
  max-width: 100%;
}
figure.highlight,
pre {
  -webkit-overflow-scrolling: touch;
}
@media screen and (max-width: 768px) {
  #page-header.nav-fixed > #nav,
  #nav {
    padding: 0 0.5rem !important;
  }
  #site-name {
    font-size: 1rem !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #toggle-menu {
    padding: 0 0.5rem;
  }
  #toggle-menu a {
    font-size: 1.2rem;
  }
  #recent-posts > .recent-post-item {
    margin: 12px 0 !important;
    border-radius: 12px !important;
  }
  #recent-posts > .recent-post-item > .post_cover {
    padding: 10px 0 10px 10px;
  }
  #recent-posts > .recent-post-item > .recent-post-info {
    padding: 14px 14px 14px 10px;
  }
  #recent-posts > .recent-post-item > .recent-post-info > .article-title {
    font-size: 1.15rem;
    line-height: 1.35;
    margin-bottom: 6px;
  }
  #recent-posts > .recent-post-item > .recent-post-info > .article-meta-wrap {
    font-size: 12px;
  }
  #recent-posts > .recent-post-item > .recent-post-info > .content {
    font-size: 13.5px;
    line-height: 1.7;
    -webkit-line-clamp: 3;
  }
  #article-container {
    font-size: 15px;
    line-height: 1.85;
    word-break: break-word;
  }
  #article-container h1 {
    font-size: 1.45rem;
    margin: 1.2em 0 0.6em;
  }
  #article-container h2 {
    font-size: 1.3rem;
    margin: 1.1em 0 0.55em;
  }
  #article-container h3 {
    font-size: 1.15rem;
    margin: 1em 0 0.5em;
  }
  #article-container h4 {
    font-size: 1.05rem;
  }
  #article-container h5,
  #article-container h6 {
    font-size: 1rem;
  }
  #article-container p {
    margin: 0.75em 0;
    letter-spacing: 0.2px;
  }
  #article-container blockquote {
    padding: 8px 12px;
    font-size: 14.5px;
  }
  #article-container code {
    font-size: 13px;
    padding: 1px 5px;
    word-break: break-word;
  }
  #article-container figure.highlight,
  #article-container pre {
    font-size: 13px;
    line-height: 1.6;
    margin: 1em -4px;
    border-radius: 10px;
  }
  #article-container figure.highlight .code-container,
  #article-container pre .code-container {
    font-size: 13px;
  }
  #article-container ul,
  #article-container ol {
    padding-left: 1.4em;
  }
  #article-container ul li,
  #article-container ol li {
    margin: 0.3em 0;
  }
  #article-container img {
    border-radius: 8px;
  }
  #post-meta,
  .post-meta {
    font-size: 12.5px;
  }
  .layout {
    padding: 0 !important;
  }
  #content-inner {
    margin: 0 !important;
    padding: 8px !important;
  }
  #post > .post-info {
    padding: 0 12px;
  }
  #post {
    padding: 10px 14px !important;
  }
  #aside-content {
    width: 80vw !important;
    max-width: 320px;
  }
  .card-widget {
    padding: 14px !important;
    margin-bottom: 12px !important;
  }
  .card-widget .item-headline {
    font-size: 14px;
  }
  #pagination {
    margin: 10px 0;
  }
  #pagination .page-number,
  #pagination .next_page,
  #pagination .prev_page {
    font-size: 14px;
    padding: 6px 10px;
  }
  #rightside {
    bottom: 40px !important;
  }
  #rightside #rightside-config-hide button,
  #rightside #rightside-config-show button {
    width: 36px;
    height: 36px;
    line-height: 36px;
  }
  #footer {
    padding: 18px 14px !important;
  }
  #footer #footer-wrap {
    font-size: 12.5px;
    line-height: 1.8;
  }
  #card-toc {
    width: 100% !important;
  }
  .article-sort-item-title {
    font-size: 1.05rem;
  }
  .article-sort-item-time {
    font-size: 12px;
  }
  .tag-cloud-list > a {
    font-size: 14px !important;
    padding: 2px 6px;
  }
  .error-content {
    padding: 0 20px;
  }
  .error-content .error-title {
    font-size: 4rem;
  }
}
@media screen and (max-width: 375px) {
  #article-container {
    font-size: 14.5px;
  }
  #article-container h1 {
    font-size: 1.35rem;
  }
  #article-container h2 {
    font-size: 1.2rem;
  }
  #recent-posts > .recent-post-item > .recent-post-info > .article-title {
    font-size: 1.05rem;
  }
}
@media (hover: none) {
  a,
  button {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
  }
}
