.top-content-bar {
  @extend .typo-13;
  display: flex;
  align-items: center;
  justify-content: center;
  height: auto;
  color: $color-white;
  text-transform: uppercase;

  @include media-breakpoint-up(xl) {
    height: 48px;
  }

  @include media-breakpoint-down(xs) {
    flex-wrap: wrap;
  }
}

.top-content-bar-message {
  @include media-breakpoint-down(xs) {
    padding-bottom: 20px;
  }
}

.top-content-bar-btn {
  margin-left: 20px;
}

.top-content-bar--corporate {
  background-color: $color-outer-space;
}

.top-content-bar--content {
  background-color: $color-deep-sapphire;
}

.top-content-bar--warning {
  background-color: $color-amaranth;
}