@import url('https://fonts.cdnfonts.com/css/fantasque-sans-mono');

body {
	background-color: black;
	color: plum;
	font-family: 'Fantasque Sans Mono', sans-serif;
	font-size: 20px
}

main, footer, header {
	max-width: 700px;
	margin-left: 5vw;
	margin-right: 5vw;
}

p {
	line-height: 1.25;
}

a {
	color: pink;
}

img {
	max-width: 100%;
}

li {
	margin-bottom: .5em;
}

#title {
	display: inline;
}
span.subtitle {
	font-style: italic;
}


ul.homepage-posts {
	padding-left: 1em;;
}
ul.homepage-posts .post {
	display: flex;
	justify-content: space-between;
	margin-bottom: 1em;
}
ul.homepage-posts .post a {
	width: 75%;
}
ul.homepage-posts .post .date{
	width: 20%;
	text-align: right;
}

blockquote {
	margin-left: 1em;
	padding-left: 1em;
	border-left: solid  3px;
}

pre {
	overflow-x: auto;
}

dd {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

dt {
	font-weight: bold;
}

/* Style the list */
ol.breadcrumb {
	padding: 10px 16px;
	list-style: none;
	background-color: indigo;
}

/* Display list items side by side */
ol.breadcrumb li {
	display: inline;
	font-size: 18px;
}

/* Add a slash symbol (/) before/behind each list item */
ol.breadcrumb li+li:before {
	padding: 1px;
	color: lightgray;
	content: "/\00a0";
}

/* Add a color to all links inside the list */
ol.breadcrumb li a {
	color: skyblue;
	text-decoration: none;
}

/* Add a color on mouse-over */
ol.breadcrumb li a:hover {
	color: #01447e;
	text-decoration: underline;
}

footer span {
	display: inline-block;
}