new-mktg.scss

/* Styles not incorporated into Primer yet
------------------------------------------------------------------------------*/

// Position utils
@media (min-width: $width-lg) {
  .top-lg-n9 {
    top: -$spacer-9;
  }
}

// Type
.text-blue-mktg {
  color: $blue-500 !important;
}

.text-white-fade {
  color: $white-fade-70 !important;
}

// Text styling
.underline-dashed {
  display: inline;
  padding-bottom: $spacer-1;
  background-image: linear-gradient(to right, $gray-300 50%, rgba(255, 255, 255, 0) 0%);
  background-repeat: repeat-x;
  background-position: bottom;
  background-size: 10px 1px;
}

// Arrow links
.Bump-link-symbol {
  display: inline-block;
  transition: $transition-time / 2;
  transform: translateX(0);
}

.Bump-link:hover .Bump-link-symbol {
  transform: translateX(3px);
}

.Bump-link--hover .Bump-link-symbol {
  color: inherit;
  opacity: 0;
  transition: $transition-time / 2;
  transform: translateX(0);
}

.Bump-link--hover:hover .Bump-link-symbol {
  opacity: 1;
  transform: translateX(3px);
}

// Background
.bg-blue-dark {
  background-color: $blue-800 !important;
}

// stylelint-disable primer/no-unused-vars

// Typography

$marketing-font-path: "/assets/fonts/alliance/";
$font-family-mktg: "Alliance No.1", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
$font-weight-extrabold: 800 !default;

.font-mktg {
  font-family: $font-family-mktg;
}

// Type
@font-face {
  font-family: "Alliance No.1";
  font-style: normal;
  font-weight: $font-weight-normal;
  src: local("Alliance No.1 Regular"), local("alliance-no-1-regular"), url("#{$marketing-font-path}alliance-no-1-regular.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Alliance No.1";
  font-style: normal;
  font-weight: $font-weight-semibold;
  src: local("Alliance No.1 Medium"), local("alliance-no-1-medium"), url("#{$marketing-font-path}alliance-no-1-medium.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Alliance No.1";
  font-style: normal;
  font-weight: $font-weight-bold;
  src: local("Alliance No.1 Bold"), local("alliance-no-1-bold"), url("#{$marketing-font-path}alliance-no-1-bold.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Alliance No.1";
  font-style: normal;
  font-weight: $font-weight-extrabold;
  src: local("Alliance No.1 ExtraBold"), local("alliance-no-1-extrabold"), url("#{$marketing-font-path}alliance-no-1-extrabold.woff") format("woff");
  font-display: swap;
}