@import url("./fontawesome.min.css");
@import url("./solid.min.css");
@import url("https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap");

:root {
  --ltaccent: #eee;
  --main: #000;
	--lt: #aaa;
	--mid: #626060;
  --bg: #fff;
  --ldcvia: #e0000a;
}

html { margin: 0; padding: 0 }

body {
	margin: 0;
	padding: 0;
	justify-content: center;
	font-family: 'Inter Tight', sans-serif;
	font-size: 1.7em;
	font-weight: 300;
	background-color: var(--bg);
  color: var(--main);
}

header, footer {
  background-color: var(--ltaccent);
  color: var(--main);
	margin: 0;
	padding: 1em .5em
}

img { width: 100%; max-width: 100%; height: auto }

/* Header logo */
.logo { width: 200px; height: 200px }
/* Footer logo */
.footer-logo { float: left; width: 80px; height: 80px; padding: 0em 1em 0 0 }

h1, h2, h3, h4 { text-align: center }
h1 { color: var(--ldcvia); font-size: 2.3em; font-weight: 700 }
h2 { font-size: 2em; font-weight: 600 }
h3 { font-size: 1.5em; font-weight: 600 }
h4 { font-size: 1.25em; font-weight: 400 }

/* General links */
a { text-decoration: none; color: var(--ldcvia) }
a:hover, a:active { text-decoration: underline }
/* … other than home */
a.home { margin: 0; display: block; text-decoration: none }
.inline a { padding: .25em }

/* Positioning and layout */
.container { width: 85%; margin: .75em auto }

/* Lists and blog metadata */
.fa-li { font-family: 'FontAwesome' }
.date { margin: 0 0 1em 0; font-size: 80%; font-weight: 600; color: var(--mid) }

/* General lists */
ul, ol { padding: 0; margin: 0 0 1em 2.25em; }
ul ul, ul ol, ol ol, ol ul{ margin-bottom:0 }
li { line-height: 1.3em; margin: 0 0 .25em 0 }
.footer-links, .inline { list-style: none; margin: 0 0 .75em 0 }
.inline li {
	font-size: 80%;
	font-weight: 600;
	color: var(--mid);
	display: inline-block
}

.footer-links li {
	padding-left: 1em;
	font-size: 60%;
	color: var(--mid);
	display: inline-block
}

/* Next / previous links, bottom of blog post or page */
.pagination {
	text-align: center;
	margin: 2em 0;
	padding-top: 1em;
	border-top: .1em dotted var(--lt)
}

.pagination li {
	line-height: 1.3em;
	padding: 1em;
	width: 15%;
}
/* Navigation styling in blog */
.disabled { color: var(--lt); cursor: not-allowed }

abbr {
	cursor: help;
	text-decoration: none;
	border-bottom: .1em dotted var(--lt)
}

blockquote {
	font-style: italic;
	margin: 0;
	padding-left: .5em;
	border-left: .1em solid var(--lt)
}

blockquote em { font-style: normal }

/* Smaller screens */
@media only screen and (max-width: 768px) {
	body { font-size: 1.2em }
	footer { text-align: center }
	.footer-logo { float: none; margin-bottom:.75em; padding: 0 }
	.footer-links li { font-size: 75% }
}

/* Larger screens */
@media only screen and (min-width: 1280px) {
  .container { width: 65% }
}