/* Category
 ***********/

.classification {
  margin-bottom: $default-spacing-bottom;
  text-align: center;

  .categories {
    @media screen and (width <= $header-centered) {
      display: block;
      margin: 0;
    }
  }
}

.classification-icon {
  fill: $black;
  height: 21px;
  position: relative;
  top: 4px;
  width: 18px;
}

.archive-categories {
  .archive-headline {
    @media screen and (width <= $archive-two-lines) {
      lost-column: 10/12;
      lost-move: 1/12;
    }
  }
}

.categories {
  display: inline;
  margin-bottom: 0;

  .classification & {
    margin-right: 15px;
  }

  .archive-posts & {
    clear: both;
    display: block;
    lost-column: 10/12;
    lost-move: 1/12;
    margin-bottom: calc($default-spacing-bottom * 2);
  }
}

.categories-item {
  display: inline-block;
}

.categories-link {
  @mixin link-colors $white, $white, $white, $white, $white;
  background: $dark-grey;
  border-radius: 5px;
  border-width: 0;
  color: $white;
  font-size: $font-scale-small;
  hyphens: manual;
  letter-spacing: 0.1em;
  padding-bottom: 2px;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 3px;
  text-decoration: none;
  text-shadow: none;
  text-transform: uppercase;
  white-space: nowrap;

  &:hover {
    background: $link-color;
    color: $white;
  }
}
