.index-title
  display table
  width 100%
  height calc(100vh - 130px)
  text-align center
  font-size: 2em;
  margin-bottom: 80px
  div.index-banner
    display table-cell 
    vertical-align middle
    padding 0 1em
    .homepage-meta
      margin-top: 10px;
      span
        font-size: 2.3rem;
      .index-social-meta-icon::before
        margin-right 3px
      .index-social-meta-title
        white-space nowrap
      .meta-block
        .meta-block-list
          line-height: 1.5em
          margin: 0 auto
          width max-content
          text-align: left 


.more-articles
  text-align center
  a
    font-size:1.5em
    color: var(--text-secondary-color);
    &:hover
      text-decoration: none
      color: black

.index-section-title
  text-align: center; 
  font-size: 2.2rem
  margin: .5em

.recently-updated.archive,
.recommend.archive
  margin: 1em auto


@media only screen and (min-width: 770px) 
  .homepage-meta
    .meta-block
      display: none

@media only screen and (max-width: 769px) 
  .homepage-meta
    .meta-inline
      display: none

@media only screen and (max-width: 600px) 
  .index-title 
    font-size: 2.4rem;
  .index-section-title
    font-size: 2.23rem

@media only screen and (max-width: 400px) 
  .index-title 
    font-size: 2.08rem;
  .index-section-title
    font-size: 1.92rem