.accomplishments-section {
  @include section-title-adjustment();

  .card {
    background: $bg-card;
    border-top: 2px solid $accent-color;
    height: 100%;

    &:hover,
    &:focus {
      border-top: 2px solid $hover-over-accent-color;
    }

    .card-header {
      background: none;
      border: none;

      .sub-title {
        color: $muted-text-color;
        margin-top: 0.4rem;
      }
    }

    .card-body {
      padding: 0;
      padding-left: 1rem;
      padding-right: 1rem;
    }

    .card-footer {
      background: $bg-card;
      border: none;
      padding: 0;
      padding-left: 0.7rem;
      padding-bottom: 0.3rem;
    }
  }

  @include media('<=large') {
    width: 100%;
    padding: 0;
    padding-left: 0.2rem;
    padding-right: 0.2rem;
    margin-top: 2rem;

    .container {
      max-width: 100%;
    }
  }

  @include media('<=small') {
    flex: 100%;
    max-width: 100%;
  }
}