/*
 * Fonts
 */
@font-face {
  font-family: "Inria Serif";
  src: local("Inria Serif"), local("InriaSerif"), local("InriaSerif-Regular"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Regular.eot") format("embedded-opentype"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Regular.woff") format("woff"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Regular.ttf") format("truetype"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Regular.svg") format("svg");
  font-style: normal;
}
@font-face {
  font-family: "Inria Serif";
  src: local("Inria Serif Bold"), local("InriaSerifBold"), local("InriaSerif-Bold"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Bold.eot") format("embedded-opentype"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Bold.woff") format("woff"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Bold.ttf") format("truetype"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Bold.svg") format("svg");
  font-style: normal;
  font-weight: bold;
}
@font-face {
  font-family: "Inria Serif";
  src: local("Inria Serif Italic"), local("InriaSerifItalic"), local("InriaSerif-Italic"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Italic.eot") format("embedded-opentype"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Italic.woff") format("woff"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Italic.ttf") format("truetype"), url("/assets/InriaFonts/fonts/InriaSerif/Web/InriaSerif-Italic.svg") format("svg");
  font-style: italic;
}
@font-face {
  font-family: "Inria Sans";
  src: local("Inria Sans"), local("InriaSans"), local("InriaSans-Regular"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Regular.eot") format("embedded-opentype"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Regular.woff") format("woff"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Regular.ttf") format("truetype"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Regular.svg") format("svg");
  font-style: normal;
}
@font-face {
  font-family: "Inria Sans";
  src: local("Inria Sans Bold"), local("InriaSansBold"), local("InriaSans-Bold"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Bold.eot") format("embedded-opentype"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Bold.woff") format("woff"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Bold.ttf") format("truetype"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Bold.svg") format("svg");
  font-style: normal;
  font-weight: bold;
}
@font-face {
  font-family: "Inria Sans";
  src: local("Inria Sans Italic"), local("InriaSansItalic"), local("InriaSans-Italic"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Italic.eot") format("embedded-opentype"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Italic.woff") format("woff"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Italic.ttf") format("truetype"), url("/assets/InriaFonts/fonts/InriaSans/Web/InriaSans-Italic.svg") format("svg");
  font-style: italic;
}
:root {
  --font-sans: Inria Sans, sans-serif;
  --font-serif: Inria Serif, serif;
  --background: white;
  --grey-on-white: hsl(0, 0%, 50%);
  --accent-lighter: hsl(var(--c-hue, 199), 98%, 88%);
  --accent-light: hsl(var(--c-hue, 199), 98%, 68%);
  --accent: hsl(var(--c-hue, 199), 98%, 50%);
  --accent-dark: hsl(var(--c-hue, 199), 98%, 32%);
  --accent-darker: hsl(var(--c-hue, 199), 98%, 12%);
  --accent-darkerer: hsl(var(--c-hue, 199), 98%, 6%);
  --margin-inter-section: calc(2rem + 10vh);
}

body {
  font-family: "Inria Sans", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Inria Serif", serif;
}

aside.browsewrap {
  height: 110vh;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  align-content: center;
}
aside.browsewrap p {
  opacity: 0.8;
}
aside.browsewrap a {
  color: black;
}

hr {
  display: block;
  margin: 2em auto;
  width: calc(100% - 4rem);
  border-style: solid;
  border-width: 1px;
  border-color: hsl(0, 0%, 50%);
}

.draft-notice {
  background-color: hsl(var(--c-hue, 199), 98%, 88%);
  border-color: hsl(var(--c-hue, 199), 98%, 12%);
  font-size: 3rem;
  text-align: center;
  line-height: 1, 5;
}

/**
 * Thanks to https://product.voxmedia.com/2019/6/17/18524029/the-ballad-of-drop-caps-and-design-systems for this pattern
 */
.drop-cap {
  display: inline-block;
  height: calc(4rem + 5vw);
  width: calc(4rem + 5vw);
  box-sizing: border-box;
  padding: 5vw 0.3rem 0 1.3rem;
  margin-right: 0.1em;
  margin-top: calc(-1 * (2.9rem + 5vw));
  margin-left: calc(-1 * (2rem + 5vw));
  float: left;
  clear: left;
  text-align: right;
  line-height: 1;
  font-size: 3rem;
  font-family: "Inria Serif", serif;
  font-feature-settings: "ss01";
  border: 1px solid hsl(var(--c-hue, 199), 98%, 32%);
  background-color: hsl(var(--c-hue, 199), 98%, 88%);
}
.drop-cap::after, .drop-cap::before {
  content: "";
  display: block;
}
.drop-cap::before {
  margin-bottom: 1.4rem;
}
.drop-cap::after {
  margin-top: -0.05em;
}

/*# sourceMappingURL=story.css.map */