@media (max-width:800px)  {
  .column { margin: auto; }
  .main { margin: 24px; }
  .row { flex-direction: column; }

  .blog-index {
    .preview { padding: 0; }
    .image {
      height: 100px;
      margin: auto;
      width: 100%;
    }
  }

  .content {
    padding: 0 0 36px 0;
    width: 100%;
  }

  .footer {
    padding: 36px 12px;
    .sticker { display: none; }
  }

  .header {
    padding: 24px;

    .sticker { display: none; }
    .nav {
      ul {
        text-align: start;
        width: fit-content;
      }
    }
  }

  .thumbnail {
    margin: 0 24px;
    min-width: 75%;
  }

  .thumbnail-list {
    display: flex;
    flex-direction: row;
    overflow-x: scroll;
    padding-bottom: 24px;
    scrollbar-color: var(--moaning-maroon) var(--pretty-in-pink);
    scrollbar-width: auto;
    scrollbar-gutter: stable;
  }

  .sidebar {
    border-top: 8px dotted var(--pretty-in-pink);
    width: 100%;

    h2 { margin: 28px auto; }

    .break { display: none; }
    .more { display: none; }
  }
}

@media (min-width:801px)  {
  .column { margin: 0; }
  .footer { padding: 36px 15%; }
  .main { margin: 48px; }
  .row { flex-direction: row; }

  .blog-index {
    .preview { padding: 0 0 0 24px;}
    .image {
      width: 200px;
    }
  }

  .content {
    padding: 0 48px 0 0;
    width: 75%;
  }

  .header {
    padding: 36px 72px;

    .nav {
      ul {
        text-align: end;
        width: 270px;
      }
    }
  }

  .thumbnail-list {
    display: flex;
    flex-direction: column;
  }

  .sidebar {
    max-width: 500px;
    min-width: 300px;
    width: 25%;
  }
}