@import url("https://fonts.googleapis.com/css2?family=Rowdies:wght@300;400;700&family=Barlow:wght@100;200;300;400;500;600;700;800;900&family=Barlow+Condensed:wght@100;200;300;400;500;600;700;800;900&family=Barlow+Semi+Condensed:wght@100;200;300;400;500;600;700;800;900");

:root {
  --font-family: "Barlow";
  --font-family-display: "Rowdies";
  --font-family-display-inner: "Barlow Condensed";
  --font-family-display-deep: "Barlow Condensed";
  --font-family-highlight: "Barlow";
  --font-family-lead: "Barlow Semi Condensed";
  --font-family-game-name: "Rowdies";
  --black: #333333;
  --base-font-size: 18px;
  --font-family-blockquote: "Barlow Semi Condensed";
}

html {
  font-size: var(--base-font-size);
}

body {
  font-size: 100%;
  color: var(--black);
}

body,
#toc a {
  font-family: var(--font-family);
}

h1,
h2,
h3,
h4,
h5,
h6,
#toctitle,
.sidebarblock > .content > .title {
  color: var(--black);
}

h1,
h2 {
  font-family: var(--font-family-display);
  font-weight: 400;
  text-transform: uppercase;
}

h3,
h4,
h5,
h6,
#toctitle,
.sidebarblock > .content > .title {
  font-family: var(--font-family-display-inner);
  font-weight: 500;
}

h5,
h6 {
  font-family: var(--font-family-display-deep);
  font-weight: 600;
  font-style: italic;
}

.rules-el {
  font-family: var(--font-family-highlight);
  font-weight: 600;
}

.lead {
  font-family: var(--font-family-lead);
  font-style: italic;
}

.game-name {
  font-family: var(--font-family-game-name);
  text-transform: uppercase;
  font-weight: 900;
}

.exampleblock.example-of-play p {
  margin: 0;
}

.quoteblock blockquote {
  line-height: 1.5;
  padding: 0.25rem;
  font-family: var(--font-family-blockquote);
}