main {
	line-height: 1.4;
}

h1 {
	margin-bottom: 0.4em;
}

/* Direct child <p> due to Markdown always wrapping <img>s into a <p>... */
div.img-list > p {
	display: flex;
	align-items: start; /*anti-stretch*/
	flex-wrap: wrap;
	gap: 1em;
}

.below-title {
	display: flex;
	flex-wrap: wrap;
	column-gap: 2em;
	row-gap: 1em;
	align-items: center;
}

.below-title .tags {
	margin: 0;
}

.below-title .published {
	color: #aaaaaa;
	margin-left: auto;
	margin-block: 0;
}

nav.prev-next {
	display: flex;
	align-items: center;
	justify-content: center;

	margin-block: 1em;

	--thin-vertical-spacing: 0.25em;
}

nav.prev-next span {
	padding-inline: 0.5em;
}

@media screen and (max-width: 500px) {
	nav.prev-next {
		flex-direction: column;
	}

	nav.prev-next span {
		display: none;
	}

	nav.prev-next a {
		padding-inline: 1em;
	}

	nav.prev-next:has(span) a:first-child {
		border-bottom: 1px solid var(--main-text-colour);

		padding-bottom: var(--thin-vertical-spacing);
	}

	nav.prev-next:has(span) a:last-child {
		padding-top: var(--thin-vertical-spacing);
	}
}
