/* FONTS */
/* https://gwfh.mranftl.com/fonts */
/* source-sans-3-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/source-sans-3-v18-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/source-sans-3-v18-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/source-sans-3-v18-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/source-sans-3-v18-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* Colors */
:root {
  --col1: #EAE7DC; /* background */
  --col2: #807F7C; /* text */
  --col3: #E85A4F; /* h, hover */
  --col4: #E98074; /* href */
  --col5: #32302F; /* pre background */
  --col6: #D8C3A5; /* mark*/
}

/* Core Stuff */
* {
	font-family: "Source Sans 3", sans-serif;
	font-optical-sizing: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 18px;
	line-height: calc(5px + 2ex + 5px);
}

body {
	max-width: 768px;
	margin: 0 auto;
	padding: 1em;
	background-color: var(--col1);
	color: var(--col2);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--col3);
	font-weight: 700;
}

h1 {
	font-size: 2.33rem;
}

h2 {
	font-size: 1.88rem;
}

h3 {
	font-size: 1.66rem;
}

h4 {
	font-size: 1.44rem;
	/*margin: 1.44rem 0;*/
}

h5 {
	font-size: 1.22rem;
	/*margin: 1.22rem 0;*/
}

h6 {
	font-size: 1rem;
	/*margin: 1rem 0;*/
}

a {
	color: var(--col4);
	font-size: inherit;
}

a:hover {
	color: var(--col3);
}

i {
	font-size: inherit;
}

hr {
	border: 1px dashed var(--col4);
}

mark {
	background-color: var(--col6);
}

pre, code {
	background: var(--col5);
	color: var(--col1);
	border-radius: 3px;
	padding: .25rem;
	text-wrap: auto;
}

blockquote {
	border-left: 10px solid var(--col4);
	margin: 0;
	padding: 0 2rem;
}

/* SITE */

.subtitle {
	color: var(--col5);
	font-style: italic;
	margin-top: -1rem;
}