.breadcrumb {
  font-size: 0.875rem;
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 1rem 2rem; }
  @media (min-width: 55em) {
    .breadcrumb {
      margin: 1rem 0; } }

.breadcrumb--container {
  background-color: #FFF;
  display: -ms-flexbox;
  display: flex; }

.breadcrumb__link {
  color: #36424a;
  text-decoration: underline; }

.breadcrumb__current {
  color: #36424a;
  text-transform: capitalize; }

.breadcrumb__item {
  position: relative;
  margin: 0 0 0 2rem; }
  .breadcrumb__item:first-child {
    margin: 0; }
  .breadcrumb__item::after {
    transform: rotate(15deg) translateY(-50%);
    border-right: 0.1em solid currentColor;
    height: 1rem;
    content: '';
    top: 50%;
    right: -1rem;
    position: absolute; }
  .breadcrumb__item:last-child::after {
    display: none; }