body .page-list {
  .page-list-container {
    font-size: 15px;
    line-height: 1.6em;
  }

  .page-list-ul {
    padding-left: 0;
    margin: 0;

    > li {
      margin: 0;
      list-style: none;

      > a {
        padding: 0px;
        color: inherit;

        &:hover {
          color: inherit;
        }
      }
    }

    .picture {
      width: 16px;
      height: 16px;
    }

    .page-list-meta {
      font-size: 0.9em;

      > span {
        margin-right: 0.3rem;
      }

      i {
        margin-right: 2px;
      }
    }

    // after second level indent
    .page-list-ul {
      padding-left: 2rem;
    }

    // override .page-list-ul
    &.page-list-ul-flat {
      padding-left: 0;
    }
  }
}

.popular-page-high {
  font-size: 1.1em;
  font-weight: bold;
  color: darken($red, 5%);
}

.popular-page-mid {
  font-weight: bold;
  color: #e47800;
}

.popular-page-low {
  color: #ab7c7c;
}

.card-timeline {
  border: 1px solid $gray-300;
  > .card-header {
    background-color: $gray-300;
  }
}