html {
	--text-color: hsl(0, 0%, 20%);
	--background-color: hsl(0, 0%, 100%);
	--nav-background-color: hsl(0, 0%, 87%);
	--link-color: hsl(188, 100%, 28%);
	--link-hover-color: hsl(188, 100%, 44%);
	--link-active-color: hsl(188, 97%, 66%);
	--link-visited-color: hsl(188, 94%, 18%);
}

@media (prefers-color-scheme: dark) {
	html {
		--text-color: #fff;
		--background-color: #333;
		--nav-background-color: hsl(0, 0%, 12%);
		--link-color: hsl(188, 100%, 44%);
		--link-hover-color: hsl(188, 100%, 35%);
		--link-active-color: hsl(188, 100%, 27%);
		--link-visited-color: hsl(188, 66%, 47%);
	}
}

body {
	display: block;
	margin: 2em auto;
	padding: 0 .5em;

	font-size: 1.125em;
	line-height: 1.5;
	font-family: system, sans-serif;
	text-rendering: optimizeLegibility;

	color: var(--text-color);
	background: var(--background-color);

}

#logo {
	display: block;
	text-align: center;
	font-size: 2em;
	font-weight: normal;
}

nav {
	display: flex;
	justify-content: center;
	gap: 1em;
}

nav .icon {
	background-size: 1em 1em;
	background-repeat: no-repeat;
	background-position: left;
	text-indent: 1.25em;
}

.rss {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNDU1LjczMSA0NTUuNzMxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Im0wIDBoNDU1LjczMXY0NTUuNzMxaC00NTUuNzMxeiIgZmlsbD0iI2Y3ODQyMiIvPjxnIGZpbGw9IiNmZmYiPjxwYXRoIGQ9Im0yOTYuMjA4IDE1OS4xNmMtNjEuNzYzLTYxLjc2My0xNDMuOTQyLTk1Ljc3OC0yMzEuMzk4LTk1Ljc3OHY2NC4zNDhjNzAuMjY4IDAgMTM2LjI4OCAyNy4zMjEgMTg1Ljg5OCA3Ni45MzEgNDkuNjA5IDQ5LjYxIDc2LjkzMSAxMTUuNjMgNzYuOTMxIDE4NS44OThoNjQuMzQ4Yy0uMDAxLTg3LjQ1Ni0zNC4wMTYtMTY5LjYzNi05NS43NzktMjMxLjM5OXoiLz48cGF0aCBkPSJtNjQuMTQzIDE3Mi4yNzN2NjQuMzQ4Yzg0Ljg4MSAwIDE1My45MzggNjkuMDU2IDE1My45MzggMTUzLjkzOWg2NC4zNDhjMC0xMjAuMzY0LTk3LjkyMi0yMTguMjg3LTIxOC4yODYtMjE4LjI4N3oiLz48Y2lyY2xlIGN4PSIxMDkuODMzIiBjeT0iMzQ2LjI2IiByPSI0Ni4wODgiLz48L2c+PC9zdmc+');
}

.mastodon {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2MS4wNzY5NTRtbSIgaGVpZ2h0PSI2NS40NzgzMW1tIiB2aWV3Qm94PSIwIDAgMjE2LjQxNDQgMjMyLjAwOTc2Ij4KICA8cGF0aCBmaWxsPSIjMmI5MGQ5IiBkPSJNMjExLjgwNzM0IDEzOS4wODc1Yy0zLjE4MTI1IDE2LjM2NjI1LTI4LjQ5MjUgMzQuMjc3NS01Ny41NjI1IDM3Ljc0ODc1LTE1LjE1ODc1IDEuODA4NzUtMzAuMDgzNzUgMy40NzEyNS00NS45OTg3NSAyLjc0MTI1LTI2LjAyNzUtMS4xOTI1LTQ2LjU2NS02LjIxMjUtNDYuNTY1LTYuMjEyNSAwIDIuNTMzNzUuMTU2MjUgNC45NDYyNS40Njg3NSA3LjIwMjUgMy4zODM3NSAyNS42ODYyNSAyNS40NyAyNy4yMjUgNDYuMzkxMjUgMjcuOTQyNSAyMS4xMTYyNS43MjI1IDM5LjkxODc1LTUuMjA2MjUgMzkuOTE4NzUtNS4yMDYyNWwuODY3NSAxOS4wOXMtMTQuNzcgNy45MzEyNS00MS4wODEyNSA5LjM5Yy0xNC41MDg3NS43OTc1LTMyLjUyMzc1LS4zNjUtNTMuNTA2MjUtNS45MTg3NUM5LjIzMjM0IDIxMy44MiAxLjQwNjA5IDE2NS4zMTEyNS4yMDg1OSAxMTYuMDkxMjVjLS4zNjUtMTQuNjEzNzUtLjE0LTI4LjM5Mzc1LS4xNC0zOS45MTg3NSAwLTUwLjMzIDMyLjk3NjI1LTY1LjA4MjUgMzIuOTc2MjUtNjUuMDgyNUM0OS42NzIzNCAzLjQ1Mzc1IDc4LjIwMzU5LjI0MjUgMTA3Ljg2NDg0IDBoLjcyODc1YzI5LjY2MTI1LjI0MjUgNTguMjExMjUgMy40NTM3NSA3NC44Mzc1IDExLjA5IDAgMCAzMi45NzUgMTQuNzUyNSAzMi45NzUgNjUuMDgyNSAwIDAgLjQxMzc1IDM3LjEzMzc1LTQuNTk4NzUgNjIuOTE1Ii8+CiAgPHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE3Ny41MDk4NCA4MC4wNzd2NjAuOTQxMjVoLTI0LjE0Mzc1di01OS4xNWMwLTEyLjQ2ODc1LTUuMjQ2MjUtMTguNzk3NS0xNS43NC0xOC43OTc1LTExLjYwMjUgMC0xNy40MTc1IDcuNTA3NS0xNy40MTc1IDIyLjM1MjV2MzIuMzc2MjVIOTYuMjA3MzRWODUuNDIzMjVjMC0xNC44NDUtNS44MTYyNS0yMi4zNTI1LTE3LjQxODc1LTIyLjM1MjUtMTAuNDkzNzUgMC0xNS43NCA2LjMyODc1LTE1Ljc0IDE4Ljc5NzV2NTkuMTVIMzguOTA0ODRWODAuMDc3YzAtMTIuNDU1IDMuMTcxMjUtMjIuMzUyNSA5LjU0MTI1LTI5LjY3NSA2LjU2ODc1LTcuMzIyNSAxNS4xNzEyNS0xMS4wNzYyNSAyNS44NS0xMS4wNzYyNSAxMi4zNTUgMCAyMS43MTEyNSA0Ljc0ODc1IDI3Ljg5NzUgMTQuMjQ3NWw2LjAxMzc1IDEwLjA4MTI1IDYuMDE1LTEwLjA4MTI1YzYuMTg1LTkuNDk4NzUgMTUuNTQxMjUtMTQuMjQ3NSAyNy44OTc1LTE0LjI0NzUgMTAuNjc3NSAwIDE5LjI4IDMuNzUzNzUgMjUuODUgMTEuMDc2MjUgNi4zNjg3NSA3LjMyMjUgOS41NCAxNy4yMiA5LjU0IDI5LjY3NSIvPgo8L3N2Zz4K');
}

/*
code {
	font-family: "fira mono", "fira-mono", monospace;
	background: #eee;
	border-radius: .125em;
} */

p > code {
	padding: 0 .25em;
}

figure {
	margin: 0;
}

figcaption {
	font-size: .85em;
}
article header {
	overflow: hidden;
}

article header .meta {
	font-size: .825em;
}

article header > * {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	flex-direction: column;
}

article header > * > * {
	flex-grow: 1;
}

article header > * > :first-child {
	flex-basis: 0;
	flex-grow: 999;
	min-width: 50%;
}

main > footer {
	grid-column: 2 / 3;
}

footer, article > footer {
	display: flex;
	justify-content: space-between;
	margin: .5em 0;
	max-width: 100%;
}

footer > * {
	margin-right: .5em;
}

@supports(gap: .25em) {
	footer {
		gap: .25em;
	}

	footer > * {
		margin-right: inherit;
	}
}

li + li {
	margin-top: 0.25em;
}

article > *, blockquote > *, h2 {
	max-width: 36rem;
	margin: 0;
}

article > * + *, blockquote * + * {
	margin-top: 1em;
}

article > :is(header, img, figure) {
	max-width: 100%;
	font-size: 1em;
}

footer a {
	min-width: 36px;
	max-width: 50%;
}

footer a img {
	filter: grayscale();
	transition: filter .2s, transform .2s;
	border-radius: .25em;
}

footer a.current_post img {
	filter: unset;
}
footer a:hover img,
footer a:focus img,
footer a:active img {
	filter: unset;
	transition: filter .15s;
	box-shadow: 0 0 6px 0 black;
	transform: translateY(2px) rotate(4deg) translate3d(0,0,0);
	transition: transform .2s;
}

a[rel="prev"]:before, a[rel="next"]:after {
	background-size: contain;
	background-repeat: no-repeat;
	width: .75em;
	height: .75em;
	content: " ";
	display: inline-block;
}

a[rel="prev"]:before {
	background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAyMSAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE5IDJMMyAxOEwxOSAzNCIgc3Ryb2tlPSIjMzMzMzMzIiBzdHJva2Utd2lkdGg9IjMiLz4KPC9zdmc+Cg==');
	background-position: left;
}

a[rel="next"]:after {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAyMSAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIgMkwxOCAxOEwyIDM0IiBzdHJva2U9IiMzMzMzMzMiIHN0cm9rZS13aWR0aD0iMyIvPgo8L3N2Zz4K");
	background-position: right;
}

nav {
	margin-left: auto;
}

nav h2 {
	margin: 0;
	font-size: 1.25em;
	font-weight: bold;
}

nav aside {
	max-width: 15em;
	background: var(--nav-background-color);
	padding: 1em 2em 1em;
	border-radius: .6em;
	border-bottom-right-radius: 0;
	border-top-right-radius: 0;
	font-size: .8em;
}

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

nav a {
	display: block;
	padding: .25em 0;
}

nav a.active {
	font-weight: 500;
	text-decoration: none;
	color: var(--link-visited-color);
}

img, picture {
	max-width: 100%;
	height: auto;
	max-height: 98vh;
	border-radius: .25em;
	width: auto;
}

a {
	color: var(--link-color);
}

article a:visited {
	color: var(--link-visited-color);
}

a:hover, a:focus,
article a:hover,
article a:focus {
	color: var(--link-hover-color);
}

a:active,
article a:active {
	color: var(--link-active-color);
}

h1, h2, h3 {
	margin: 1em 0 .5em 0;
}

h1 {
	font-size: 2em;
	font-weight: normal;
}

h2 {
	font-size: 1.4em;
    line-height: 1.125;
	margin-bottom: 0;
	font-weight: normal;
}

h2 a {
	text-decoration: none;
}

h1 a {
	text-decoration: none;
}

h3 {
	margin-top: 1.5em;
	margin-bottom: 0.25em;
}

h3 + p {
	margin-top: 0;
}

.previous {
	margin: 0 auto 0 0;
}

.previous::before {
	content: "« ";
}

.next {
	margin: 0 0 0 auto;
}

.next::after {
	content: " »";
}

code pre {
	font-family: "fira mono", "fira-mono", monospace !important;
	font-size: .85em;
	background: var(--background-color);
	border-radius: .25em;
	padding: .5em;
	tab-size: 2;
	overflow-x: scroll;
}

blockquote {
    border-left: 4px solid var(--link-color);
    padding: 0 1em;
    margin-left: .25em;
}

body .blocks-gallery-grid body  .blocks-gallery-image, body .blocks-gallery-grid .blocks-gallery-item, body .wp-block-gallery body .blocks-gallery-image, body .wp-block-gallery body .blocks-gallery-item {
	margin: 0 0 1em 0;
	width: 100%;
}

.wp-block-gallery .blocks-gallery-grid {
	display: grid;
	list-style: none;
	padding: 0;
	margin: 0;
	gap: .5em;
}

.wp-block-gallery.columns-3 .blocks-gallery-grid {
	grid-template-columns: 1fr 1fr 1fr;
}

.quicklink h2::before {
	content: "🔗 ";
	font-size: .5em;
	vertical-align: middle;
}

.books h2::before {
	content: "📖 ";
	font-size: .95em;
	vertical-align: middle;
}

dl {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin: .5em 0 0 0;
}

dt {
	font-weight: bold;
	padding-right: .5em;
}

dd {
	margin: 0;
}


article > .gallery {
	margin: 0 1em;
	max-width: 100%;
}

article .gallery > * {
	display: block;
	margin: 1em auto;
	text-align: center;
}

@media screen and (min-width: 500px) {
	main {
		grid-template-columns: 1fr minmax(300px, 32em) 1fr;
		grid-column-gap: 1em;
		display: grid;
	}

	 {

	}

	article, main > header {
		grid-column: 1 / 4;
		grid-template-columns: 1fr 1fr minmax(300px, 32em) 1fr 1fr;
		grid-column-gap: 1em;
		display: grid;
	}

	article > *, main > header > h1 {
		grid-column: 2 / 5;
	}

	article.post.fotos > img, article.post.fotos > picture {
		grid-column: 1 / 7;
		justify-self: center;
	}

}

/**
 * GHColors theme by Avi Aryan (http://aviaryan.in)
 * Inspired by Github syntax coloring
 */

 code[class*="language-"],
 pre[class*="language-"] {
	 color: #393A34;
	 font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
	 direction: ltr;
	 text-align: left;
	 white-space: pre;
	 word-spacing: normal;
	 word-break: normal;
	 font-size: .9em;
	 line-height: 1.2em;

	 -moz-tab-size: 4;
	 -o-tab-size: 4;
	 tab-size: 4;

	 -webkit-hyphens: none;
	 -moz-hyphens: none;
	 -ms-hyphens: none;
	 hyphens: none;
 }

 pre > code[class*="language-"] {
	 font-size: 1em;
 }

 pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
 code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
	 background: #b3d4fc;
 }

 pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
 code[class*="language-"]::selection, code[class*="language-"] ::selection {
	 background: #b3d4fc;
 }

 /* Code blocks */
 pre[class*="language-"] {
	 padding: 1em;
	 margin: .5em 0;
	 overflow: auto;
	 border: 1px solid #dddddd;
	 background-color: white;
 }

 /* Inline code */
 :not(pre) > code[class*="language-"] {
	 padding: .2em;
	 padding-top: 1px;
	 padding-bottom: 1px;
	 background: #f8f8f8;
	 border: 1px solid #dddddd;
 }

 .token.comment,
 .token.prolog,
 .token.doctype,
 .token.cdata {
	 color: #999988;
	 font-style: italic;
 }

 .token.namespace {
	 opacity: .7;
 }

 .token.string,
 .token.attr-value {
	 color: #e3116c;
 }

 .token.punctuation,
 .token.operator {
	 color: #393A34; /* no highlight */
 }

 .token.entity,
 .token.url,
 .token.symbol,
 .token.number,
 .token.boolean,
 .token.variable,
 .token.constant,
 .token.property,
 .token.regex,
 .token.inserted {
	 color: #36acaa;
 }

 .token.atrule,
 .token.keyword,
 .token.attr-name,
 .language-autohotkey .token.selector {
	 color: #00a4db;
 }

 .token.function,
 .token.deleted,
 .language-autohotkey .token.tag {
	 color: #9a050f;
 }

 .token.tag,
 .token.selector,
 .language-autohotkey .token.keyword {
	 color: #00009f;
 }

 .token.important,
 .token.function,
 .token.bold {
	 font-weight: bold;
 }

 .token.italic {
	 font-style: italic;
 }