:root {
  --cover-text-color: #0099ff;
  --highlight: #0099ff;
  --highlight-contrast: white;
  --highlight-inverse: white;
  --highlight-inverse-contrast: black;
  --cover-title-and-description-guard-bg-color: rgba(255, 255, 255, 0.6);
  --cover-title-text-shadow: none;
  --sticky-menu-text-color: #0099ff;
  --section-light-text-color: black;
  --section-light-bg-color: white;
  --section-dark-text-color: var(--section-light-bg-color);
  --section-dark-bg-color: #0099ff;
  --section-uni-quote: grey;
  --section-uni-code-bg-color: #e0ded7;
  --footer-color-background: grey;
  --footer-color: white;
}

body,h1,h2,h3,h4,h5,h6 {
  font-family: "Libre Franklin", sans-serif;
  letter-spacing: 0px;
  -webkit-font-smoothing: antialiased !important;
}
h1 {
  letter-spacing: -1px;
  font-style: italic;
}
.blog-title {
  font-size: 6rem !important;
  font-weight: 900;
}
/* lots of !important directives here to override stuff I don't want to change in upstream style sheet */
.blog-description {
  font-family: "Libre Franklin", sans-serif !important;
  font-size: 2.5rem !important;
  letter-spacing: -0.18rem !important;
  font-weight: 500 !important;
  font-style: italic;
  text-transform: uppercase;
}
a.btn {
  letter-spacing: 0px !important;
  font-size: 1.5rem !important;
  font-weight: 500 !important;
  font-family: "Libre Franklin", sans-serif !important;
}
.fixed-nav {
  font-family: "Libre Franklin", sans-serif;
  font-weight: 700;
  letter-spacing: -0.03em;
}
.button {
  display: inline-block;
  padding: 0.5rem 1rem;
  margin: 0.5rem;
  text-color: white;
  background-color: transparent;
  border-radius: 0.5rem;
  border-width: 0;
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
  text-decoration: none;
  font-size: 1.7rem;
  font-weight: medium;
  text-transform: uppercase;
  cursor: pointer;
  margin-top: 1rem;
  font-family: "Libre Franklin", sans-serif;
  font-weight: 500;

  &:focus {
    outline: 0;
  }

  &:hover,
  &:active {
    text-decoration: none;
  }
}

// Variants
.button--primary,
.button--secondary,
.button--info,
.button--success,
.button--warning,
.button--error {
  padding: 0.5rem 1rem;
  //color: #fff;
}

// Variant + Size
.button--large {
  padding: 0.75rem 1.5rem;
  font-size: 18px;
}
.button--medium {
  padding: 0.5rem 1rem;
  font-size: 16px;
}
.button--small {
  padding: 0.25rem 0.5rem;
  font-size: 12px;
}
.button--primary {
  background-color: #0085fd;
}
.button--secondary {
  background-color: #999;
}
.button--info {
  background-color: #0085fd;
}
.button--success {
  background-color: #2e7d32;
}
.button--warning {
  background-color: #ed8f02;
}
.button--error {
  background-color: #d32f2f;
}
// Disabled
.button--disabled {
  pointer-events: none;
  opacity: 0.25;
}