* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	font-family:
		-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial,
		sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-weight: 130;
}

body {
	background-color: #fdfdfd;
	color: #222222;
	padding: 2rem;
	max-width: 800px;
	margin: auto;
	line-height: 1.5;
}

:is(h2, h3, h4, h5) {
  	font-weight: 250;
}

h1 {
	margin-bottom: 0.2rem;
}

h2 {
	font-size: 20px;
}

nav {
	display: inline-block;
	a {
		color: #bbbbbb;
		margin-right: 0.5rem;
		transition: color 0.2s ease-in-out;
	}
	a:hover {
		color: #0070f3;
		text-decoration: none;
	}
}

p {
	margin-bottom: 0.2px;
}

hr {
	height: 1px;
	opacity: 35%;
	background-color: #bbbbbb;
	margin-bottom: 0.5rem;
	margin-top: 0.5rem;
	border: none;
}

a {
	color: #0070f3;
	text-decoration: none;
}

img {
	display: flex;
	border: 1px solid #222222;
	width:60%;
	margin: auto;
}

.img-desc {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: small;
	font-variant: italic;
	text-align: center;
	margin-top: 3px;
	margin-bottom: 3px;
	sub {
		font-family: Georgia, 'Times New Roman', Times, serif;
		font-size: x-small;
	}
}

.blur {
	transition: 0.3s;
	filter: blur(2px);
}

.blur:hover {
	transition: 0.3s;
	filter: blur(0px);
}

.header-directory {
	font-size: 15px;
	font-family: Georgia, "Times New Roman", Times, serif;
}

.spoiler {
	color: #555555;
	filter: blur(4px);
	transition: 0.3s;
}

.spoiler:hover {
	filter: blur(0px);
	transition: 0.3s;
	link {
		color: #0070f3;
		transition: 0.2s;
	}
}