assets/css/sass/_media.sass
// - - - - - - - - - - Media - - - - - - - - - - //

@media only screen and (max-width : 960px)
  .chapters
    padding: 2rem 0
    .chapter
      width: 49%
      margin: 0 0.5% 1% 0.5%

@media only screen and (max-width : 768px)
  #banner
    .content
      padding: 7rem 0
      .title
        font-size: 2.5rem
        margin: 0 0 1rem 0
      .sub_title
        font-size: 1.35rem
        line-height: 2rem
        font-style: italic

  .chapters
    .chapter_inner
      .chapter_number
        font-size: 0.7rem
        margin: 0 0 0.5rem 0

      .chapter_title
        font-size: 1.35rem
        margin: 0 0 0.3rem 0

  .pagination
    padding: 2rem 0 6rem
    a
      padding: 0.5rem 0.8rem
      margin-left: 1rem

  .newsletter
    padding: 2rem 0
    .newsletter_title
      font-size: 1.75rem
      margin: 0 0 0.8rem
    form
      width: 550px
      label
        font-size: 1.1rem
      .newsletter_box
        padding: 2rem 0
      .email_input
        width: 100%
        padding: 1rem 2.5rem
        border-radius: 2.5rem
        font-size: 0.9rem
      .subscribe_btn
        width: 110px
        padding: 1.1rem
        font-size: 0.7rem
        top: 32px

  .social_footer
    padding: 2rem 0
    a
      padding: 0.5rem 1rem
      font-size: 1.35rem
      border-radius: 0.3rem

  .copyright
    padding: 1rem 0
    p
      font-size: 0.7rem

  .post
    header
      .post_meta
        font-size: 0.8rem
      .post_title
        font-size: 1.6rem

  .author
    .author_social
      span
        font-size: 0.7rem

@media only screen and (max-width : 600px)
  .chapters
    padding: 2rem 0
    .chapter
      width: 99%
      margin: 0 0.5% 2% 0.5%

  .copyright
    p
      font-size: 0.6rem

  blockquote
    font-size: 1.1rem
    padding-left: 1rem
    p
      font-size: 1.1rem

  p
    font-size: 1rem

@media only screen and (max-width: 550px)
  .post
    header
      .post_meta
        padding: 0.3rem 1rem
        font-size: 0.5rem
      .post_title
        font-size: 1.3rem

  .post_footer
    .post_share
      float: none
      margin-bottom: 0.5rem
    .post_tag
      float: none

  .author
    .author_image
      float: none
      display: block
      border-radius: 50%
      width: 100px
      height: 100px
      margin: 0 auto 1.75rem
    .author_info
      padding: 0
      text-align: center
      .author_title
        font-size: 1.2rem
        margin-top: 0
    .author_social
      span
        display: inline-block
        padding-right: 0.5rem
        margin: 0 0.5rem 0.5rem 0

  .recent_box
    .recent_title
      font-size: 1.3rem
    .recent_list
      .recent_item
        width: 100%
        margin: 0 0 0.5rem

  .social_footer
    a
      padding: 0.3rem 0.8rem
      font-size: 1.10rem

@media only screen and (max-width: 320px)
  .post
    header
      .post_meta
        padding: 0.1rem 0.8rem
        font-size: 0.3rem
      .post_title
        padding: 0.8rem
        font-size: 1.2rem