@import '../settings/variables';
@import '../tools/mixins/breakpoints';

.c-sub-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  padding: $gutter-big 0;
  background-color: $color-background-alternative;
  z-index: $layer-sticky;

  @include media-breakpoint-up(md) {
    width: calc(100% - #{$aside-width});
  }

  &--alternate {
    background-color: $color-background-alternative;
    padding: 0;
    @include media-breakpoint-up(lg) {
      background-color: white;
      border-top: $sub-bar-border solid $color-neutral;
      border-bottom: $sub-bar-border solid $color-neutral;
    }
  }
}