/* Reset CSS (http://meyerweb.com/eric/tools/css/reset/)
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, main {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, main {
	display: block;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Set styles for the page elements 
   supported by the browser
*/

html, body {
  color: #000;
  font-family: 'Inter', sans-serif;
  line-height: 1.6;
}

a {
  color: #000;
  font-weight: bold;
  text-decoration: none;
  #border-bottom: 2px solid rgba(215, 3, 1, 0.5);
  border-bottom: 2px solid rgba(44, 44, 215, 0.5);
}

a:hover {
  background-color: #FFFF66;
  #border-bottom-color: rgba(215, 3, 1, 1);
  border-bottom-color: rgba(44, 44, 215, 1);
}

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

h1, h2, h3, h4, h4, h5, h6 {
  font-weight: bold;
  line-height: 1.4;
}

h1 {
  font-size: 260%;
}

h2 {
  font-size: 220%;
}

h3 {
  font-size: 180%;
}

h4 {
  font-size: 160%;
}

h5 {
  font-size: 130%;
}

h6 {
  font-size: 120%;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  border-bottom: none;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 1);
}

th {
  border-bottom: 1px solid #d3d3d3;
  font-weight: bold;
}

th, td {
  padding: 15px;
  text-align: left;
  vertical-align: top;
}

small {
  font-size: 80%;
}

strong, b {
  font-weight: bold;
}

em, i {
  font-style: italic;
}

ul { 
  list-style-type: disc;
  list-style-position: outside;
  margin-left: 30px;
}

ol { 
  list-style-type: decimal;
  list-style-position: outside;
  margin-left: 30px;
}

ul ul, ol ul { 
  list-style-type: circle;
  list-style-position: outside;
  margin-left: 30px;
}

ol ol, ul ol { 
  list-style-type: lower-latin;
  list-style-position: outside;
  margin-left: 30px;
}

hr {
  background-color: #d3d3d3;
  margin: 20px auto;
}

/* Define the styles for a section 
   containing an iframe element
*/

section.iframe-container {
  overflow: hidden;
  /* 16:9 aspect ratio */
  padding-top: 56.25%;
  position: relative;
}

section.iframe-container iframe {
   border: 0;
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
}

/* Set the spacing between common
   page elements
*/

p + p, p + h1, p + h2, p + h3, p + h4, p + h5, p + h6, p + figure, p + img, p + figure, p + table, 
p + ul, p + ol, p + .iframe-container, p + .highlighter-rouge, figure + p, figure + h1, figure + h2, 
figure + h3, figure + h4, figure + h5, figure + h6, figure + figure, figure + img, figure + table, 
figure + ul, figure + ol, table + p, table + h1, table + h2, table + h3, table + h4, table + h5, 
table + h6, table + figure, table + img, table + ul, table + ol, .iframe-container + p, 
.iframe-container + h1, .iframe-container + h2, .iframe-container + h3, .iframe-container + h4, 
.iframe-container + h5, .iframe-container + h6, .iframe-container + figure, .iframe-container + img, 
.iframe-container + .iframe-container, .iframe-container + table, .iframe-container + ul, 
.iframe-container + ol, .highlighter-rouge + p, .highlighter-rouge + h1, .highlighter-rouge + h2, 
.highlighter-rouge + h3, .highlighter-rouge + h4, .highlighter-rouge + h5, .highlighter-rouge + h6, 
.highlighter-rouge + figure, .highlighter-rouge + img, .highlighter-rouge + .highlighter-rouge, 
.highlighter-rouge + table, .highlighter-rouge + ul, .highlighter-rouge + ol, ul + p, ul + h1, ul + h2, 
ul + h3, ul + h4, ul + h5, ul + h6, ul + figure, ul + img, ul + figure, ul + table, ul + ul, ul + ol, 
ul + .iframe-container, ul + .highlighter-rouge, ol + p, ol + h1, ol + h2, ol + h3, ol + h4, ol + h5, 
ol + h6, ol + figure, ol + img, ol + figure, ol + table, ol + ul, ol + ol, ol + .iframe-container, 
ol + .highlighter-rouge {
  margin-top: 25px;
}

h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p, h1 + figure, h2 + figure, h3 + figure, h4 + figure, 
h5 + figure, h6 + figure, h1 + table, h2 + table, h3 + table, h4 + table, h5 + table, h6 + table, 
h1 + .iframe-container, h2 + .iframe-container, h3 + .iframe-container, h4 + .iframe-container, 
h5 + .iframe-container, h6 + .iframe-container, img + .iframe-container, figure + .iframe-container, 
table + .iframe-container, h1 + .highlighter-rouge, h2 + .highlighter-rouge, h3 + .highlighter-rouge, 
h4 + .highlighter-rouge, h5 + .highlighter-rouge, h6 + .highlighter-rouge, img + .highlighter-rouge, 
figure + .highlighter-rouge, table + .highlighter-rouge, h1 + img, h2 + img, h3 + img, h4 + img, 
h5 + img, h6 + img, h1 + ul, h2 + ul, h3 + ul, h4 + ul, h5 + ul, h6 + ul, h1 + ol, h2 + ol, 
h3 + ol, h4 + ol, h5 + ol, h6 + ol {
  margin-top: 12px;
}

/* Style the figure page element and 
   figcaption used for displaying images
*/

figure.image {
  text-align: center;
}

figure.image figcaption {
  color: #808080;
  margin-top: 5px;
}

/* Begin to style the page structure, 
   e.g. the container (main), header and
   footer
*/

main {
  margin: 0 auto;
  padding: 10px;
  max-width: 780px;
}

header {
  margin-bottom: 70px;
  text-align: center;
}

header a {
  font-weight: normal;
  border-bottom: none;
}

header nav ul {
  margin-left: 0;
}

header nav ul li {
  display: inline;
  margin: 0 5px;
}

header nav ul li a {
  color: #808080;
}

header nav ul li a:hover {
  color: #000;
  background-color: #FFFF66;
}

header section.logo-title {
  font-family: 'Permanent Marker', cursive;
  font-size: 1.4rem;
  line-height: 1.5;
}

footer {
  color: #808080;
  margin: 70px 0 10px 0;
  text-align: center;
}

footer a {
  font-weight: normal;
  border-bottom: none;
}

footer nav {
  margin-bottom: 20px;
}

footer nav ul {
  margin-left: 0;
}

footer nav ul li {
  display: inline;
  margin: 0 5px;
}

footer nav ul li a {
  color: #808080;
}

footer nav ul li a:hover {
  color: #000;
  background-color: #FFFF66;
}

section.page-header {
  margin-bottom: 40px;
  text-align: center;
}

section.page-header h1 {
  display: block;
  margin: 5px 0;
}

section.page-header small {
  color: #808080;
}

summary.article {
  text-align: center;
}

summary.article small {
  color: #808080;
}

summary.article + summary.article {
  margin-top: 70px;
}

.article-summary-header {
  margin-bottom: 12px;
}

.article-summary-header img {
  margin-bottom: 5px;
}

/* Style the related posts */
section.related-posts h2 {
  margin: 70px 0 50px 0;
}

/* Add styles for miscellaneous 
   page elements here
*/

div.highlight {
  font-family:'Courier New', Courier, monospace;
  overflow: auto;
  padding: 10px;
}

.text-center {
  text-align: center;
}

.top-bumper {
  margin-top: 35px;
}

.bottom-bumper {
  margin-bottom: 35px;
}