html {
	line-height: 1.3;
	-webkit-text-size-adjust: 100%
}

body {
	background-color: rgba(255, 255, 255);
	font-family: -apple-system, "BlinkMacSystemFont", "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	margin: 0;
	padding: 0;
}

.container {
	display: grid;
	grid-template:
		"head head" 7em
		"nav main" auto
		"foot foot" 2em / 15em 1fr;
	margin: 0 auto;
	min-height: 100vh;
	padding: 0;
	max-width: 60em;
}

header {
	grid-area: head;
	padding: 0 1em 2em 1em;
}

header h1 {
	font-size: 2em;
}

nav {
	background-color: rgb(250, 250, 250);
	border-radius: 10px;
	grid-area: nav;
	padding: 1em;
}

nav > ul {
	list-style-type: none;
	padding: 0;
}

nav > ul > li > ul {
	list-style-type: square;
}

main {
	grid-area: main;
	padding: 1em;
}

footer {
	font-size: 0.6em;
	grid-area: foot;
	padding: 1em;
	text-align: right;
}

@media (max-width: 800px) {
	.container {
		grid-template:
			"head" 7em
			"main" auto
			"nav" auto
			"foot" 2em / 1fr;
	}
}

img {
	max-width: 100%;
	margin: 0 auto;
	max-height: 75vh;
	border-radius:4px
}

a {
	border-bottom: 1px solid rgb(217, 217, 217);
	color: rgb(26, 26, 26);
	text-decoration: none;
	padding: 0 0.1em;
}

a:hover {
	background: rgb(255, 250, 241);
	color:  #000 !important;
}

h1, h2, h3, h4, h5, h6 {
	line-height: 1.3;
	margin-bottom: 0;
	padding-bottom: 0;
}

:is(h1, h2, h3) {
	line-height: 1.2;
}

:is(h1, h2) {
	max-width: 40ch;
}

:is(h2, h3):not(:first-child) {
	margin-top: 2em;
}

hr {
	margin: 4em auto;
	border: 0;
	height: 1px;
	background: #ccc;
}


code:not([class*="language"]) {
	font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace;
	font-size: 1.75ex;
	color: #444;
	background-color: rgba(0, 0, 0, 0.1);
	padding-right: 0.15em;
	padding-left: 0.15em;
}

pre code {
	margin: 2rem 0;
	padding: 0.5em 1rem;
	display: block;
	border-left: 3px solid rgba(0, 0, 0, 0.35);
	background-color: rgba(0, 0, 0, 0.05);
	border-radius: 0 0.25rem 0.25rem 0;
	overflow-x: auto;
	font-size: 0.8em !important;
}

blockquote {
	margin: 2rem 0;
	padding: 0.5em 1rem;
	border-left: 3px solid rgba(0, 0, 0, 0.35);
	background-color: rgba(0, 0, 0, 0.05);
	border-radius: 0 0.25rem 0.25rem 0;
}

a.feed {
	color: #f26522;
}

a.feed:hover {
	background: none !important;
	color: #bc4e1b !important;
}