:root {
  --fs: 1rem; //font-size
  --lh: 1.5; //line-height
  --lhh: 1.2; //line-height headers
  --fw: 400; //font-weight
  --fh: 700; //font-weight h1-h6
  // Responsive typography
  @if $enable-responsive-typography {
    @if map-get($breakpoints, "sm") {
      @media (min-width: map-get($breakpoints, "sm")) {
        --fs: 1rem;
      }
    }
    @if map-get($breakpoints, "md") {
      @media (min-width: map-get($breakpoints, "md")) {
        --fs: 1.04rem;
      }
    }
    @if map-get($breakpoints, "lg") {
      @media (min-width: map-get($breakpoints, "lg")) {
        --fs: 1.08rem;
      }
    }
    @if map-get($breakpoints, "xl") {
      @media (min-width: map-get($breakpoints, "xl")) {
        --fs: 1.12rem;
      }
    }
  }
}

// Typography
h1,
h2,
h3,
h4,
h5,
h6 {
  padding-left: 0;
  color: var(--f2);
  margin-bottom: var(--s1);
  margin-top: var(--s2);
  font-weight: var(--fh);
  font-size: var(--fs);
  line-height: var(--lhh);
}
h1 {
  font-size: 2rem;
}
h2 {
  font-size: 1.75rem;
}
h3 {
  font-size: 1.5rem;
}
h4 {
  font-size: 1.25rem;
}
h5 {
  font-size: 1.125rem;
}
header h1 {
  margin-top: 0;
}
a {
  color: var(--a1);
  text-decoration: none;
}
a:hover {
  color: var(--a2);
  text-decoration: underline;
}
h1 a, h2 a, main nav a {
  color: var(--f2);
  text-decoration:none;
  &:hover {
    color: var(--a3);
    text-decoration: none;
  }
}
article {
  padding-bottom: .2rem;
}

// Abbreviations
// 1. Remove underline decoration in Chrome, Edge, IE, Opera, and Safari
abbr[title] {
  border-bottom: var(--bw) dotted;
  text-decoration: none; // 1
  cursor: help;
}

// Highlighted text
mark {
  background-color: var(--c4);
  color: var(--c1);
  vertical-align: baseline;
  padding: .1rem .4rem;
}
blockquote {
  margin-left: 0;
  padding: .5rem 0 .5rem 1.5rem;
  border-left: .25rem solid var(--c3);
}
blockquote > :last-child {
  margin-bottom: 0;
}
small {
  font-size: .875rem;
}

.footnote-definition sup, .footnote-definition p {
  display: inline;
}
/* Prevent `sub` and `sup` elements from affecting the line height in all browsers. */
sub,
sup {
  font-size: .75em;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -.25em;
}
sup {
  top: -.5em;
}

address,
blockquote,
dl,
figure,
form,
ol,
p,
pre,
table,
ul {
  margin: var(--s1) 0;
  color: var(--f1);
  font-style: normal;
  font-weight: var(--fw);
  font-size: var(--fs);
}

/* Lists */
ul,
ol {
  padding-right: 0;
  padding-left: var(--s2);

  li {
    margin-bottom: var(--s1);
  }
}

ul li {
  list-style: square;
}

// Ins
ins {
  color: var(--cg);
  text-decoration: none;
}

// del
del {
  color: var(--cr);
}