body {padding: 0; max-width: 100vw; display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh;}
body {margin: 0;}
main {margin: auto auto; max-width: 90ch; flex-grow: 0;}
main h1 {font-size: 2em; margin-top: 0.5em;}
p {margin: 0.5em auto; max-width: 70ch; text-align: center;}

body:before {content: ""; display: block; max-width: 100vw; min-width: 99vw; height: 2em; padding: 0; margin: 0; background: var(--headfoot); background-image: var(--imgbg);}

figcaption {max-width: 60ch; margin: 0em auto 0.3em auto;}
figure {margin-bottom: 0.5em; margin-top: 0;}

footer {line-height: 1.2em; padding: 1em 0.5em;}
footer p {max-width: 100ch; margin: 0 auto; text-align: center;}
#rss {text-align: right;}

@media screen and (orientation: landscape) and (min-width: 1000px) {
	.reverse-strip {background: linear-gradient(45deg, rgba(0,0,0,0) 15%, var(--bg-darker) 15%, var(--bg-darker) 85%, rgba(0,0,0,0) 85%);}
	html {max-width: 100vw;}
	main h1 {border-radius: 20px;}
	#rss {margin: -2.8em 1em 0em 0;}
}

@media screen and (max-width: 1000px) {
	footer {font-size: 0.8em;}
	#rss {margin: -1.3em 0 0 0; padding: 0 1em 0em 0;}
	main h1 {font-size: 1.8em; margin-bottom: 0 !important; padding-bottom: 0.2em !important;}
	p {margin: 1em 0.5em;}
	figcaption {margin-bottom: 0.5em;}
	body:before {height: 1em;}
}
