.top {
  @include themify($themes) {
    background-color: themed('single-header-title-background-color');
  }
}

.header {
  @include flexbox();
  @include justify-content(center);
  @include align-items(center);
  @include flex-direction(column);

  &__wrapper {
    @include themify($themes) {
      border-bottom: 1px solid themed('border-line-color');
    }

    .title {
      font-size: 3rem;
      font-weight: 900;
      font-family: $title-font;
      line-height: 3rem;
      overflow-wrap: break-word;
      margin: 2rem 1.5rem;

      @include themify($themes) {
        color: themed("title-color");
      }
    }
  }
}

.blog-header {
  @include flexbox();
  @include justify-content(center);
  @include flex-direction(column);

  &__title {
    line-height: 1.1;
    font-weight: 900;
    font-family: $title-font;
    font-size: 3rem;
    line-height: 3rem;
    overflow-wrap: break-word;

    @include themify($themes) {
      color: themed("title-color");
    }
  }

  &__subtitle {
    line-height: 1.2;
  }

  &__align-left {
    @include align-items(flex-start);
  }

  &__align-center {
    @include align-items(center);
  }

  &__align-right {
    @include align-items(flex-end);
  }
}