$table-cell-padding: 1rem / 2;

.sl-c-table {
  margin: 1.5rem 0;
  border: 0;
  width: 100%;
  max-width: 100%;

  td,
  th {
    border: 0;
    padding: .75rem $table-cell-padding;
    vertical-align: top;
  }

  th,
  caption {
    text-align: left;
  }

  @include sl-breakpoint--medium-max {

    &-responsive {
      margin-bottom: 1.5rem;
      width: 100%;
      overflow: {
        x: auto;
        y: hidden;
      }

      table { margin-bottom: 0; }

      td { white-space: nowrap; }
    }
  }
}