// Section
$title-section-font: 'bold';
$title-section-size: 5; // 28px

$title-example-font: 'regular';
$title-example-size: 0; // 16px

.karl-Section__title {
  margin-top: k-px-to-rem(32px);
  margin-bottom: k-px-to-rem(16px);

  @include k-typographyFont($title-section-font);
  @include k-typographyFontSize($title-section-size);

  color: map-get($k-colors, 'font-1');

  @include k-media-max('xs') {
    text-align: center;
  }
}

// Section Example
.karl-Example {
  clear: both;

  @include k-media-max('xs') {
    text-align: center;
  }
}

.karl-Example__title {
  @include k-typographyFont($title-example-font);
  @include k-typographyFontSize($title-example-size);
  font-style: italic;

  color: map-get($k-colors, 'font-2');
  text-align: left;

  @include k-media-max('xs') {
    text-align: center;
  }
}

// GitHub Ribbon
.karl-GithubRibbon {
  z-index: 4;
  position: fixed;
  top: 0;
  right: 0;
  border: 0;
}