.divider {
  border-bottom: 1px solid $color--grey;
}

.divider--top {
  border-bottom: 0;
  border-top: 1px solid $color--grey;
}

// background/color mappings
.bg-brand {
  &--blue,
  &--yellow {
    .divider {
      border-color: $color-alpha--two-30;
    }
  }

  &--dark-blue,
  &--turquoise,
  &--red,
  &--gradient-orange {
    .divider {
      border-color: $color-alpha--four-50;
    }
  }

  &--off-white {
    .divider{
      border-color: $color--grey;
    }
  }
  &--dark-grey {
    .divider {
      border-color: $color-brand--six;
    }
  }

}
