/* ~~~CSS Stylesheet for Zine posrs~~~ */
body {
	background: var(--color-background-alt);
	color: var(--color-text-alt);
}

.title {
	padding: var(--spacing-sml-rem);
	text-align: center;
}

.post {
	display: grid;
	grid-template-areas:
	"nav-top"
    "content"
	"nav-btm";
	align-items: center;
	max-width: var(--element-post);
	background-color: var(--color-background-black);
	border: 2px solid var(--color-yellow-spit);
	border-radius: 6px;
	padding: var(--spacing-sml-rem) var(--spacing-lrg-rem);
	text-align: center;
}

.post > div.content {
	grid-area: content;
	display:flex;
	flex-direction:column;
	gap:var(--spacing-mid-rem);
	max-width: 95vw;
	align-items: center;
}

.post > .content > img {
	margin: auto;
	max-width: 90vw;
	max-height: 90vh;
	width: auto;
	height: auto;
	border: 1px solid var(--color-blue-bruise);
	border-radius: 4px;
}

.post > .content > p {
	padding-bottom: var(--spacing-sml-rem);
}

.post > .content > div.pagination {
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: var(--spacing-sml-rem);
}

.post > div.nav {
	display: flex;
	justify-content: center;
}

.post > .nav > a {
	padding: var(--spacing-sml-rem);
}