.theme
{
	background: #fff;
	color: #222f;
	border-color: #222f;
}
.theme-glass
{
	background: #fffa;
	color: #222f;
	border-color: #222f;
}
@media (prefers-color-scheme: dark)
{
	.theme.adaptive
	{
		background: #222;
		color: #fff;
		border-color: #fff;
	}
	.theme-glass.adaptive
	{
		background: #222a;
		color: #fff;
		border-color: #fff;
	}
}
@media (prefers-reduced-motion: reduce)
{
	.background.adaptive
	{
		animation-iteration-count: 0;
		backdrop-filter: hue-rotate(312deg);
	}

	.cursor.adaptive
	{
		animation-iteration-count: 0;
	}
}
.background
{
	background-color: #b22;
}
body
{
    font-family: Hermit, Monospace, Courier New;
    margin: 0 0 0 0;
}
.primary
{
	min-height: 100vh;
}
main
{
	top: 0px;
	left: 0px;
	margin: 10vh 10vw 10vh 10vw;
	padding: 5vh 5vw 5vh 5vw;
	border-style: none;
	border-radius: 30px;
	min-height: 50vh;
}
.menu
{
	display: none;
}
header, footer
{
	font-size: 3vh;
	text-align: center;
	align-items: center;
	position: relative;
	left: 0px;
	padding: 0 5vw 0 5vw;
	display: grid;
	grid-template-columns: auto auto auto;
	height: 10vh;
}
.greeting
{
	font-size: 2.7vh;
	margin: 0 0 0 0;
}
.artpage
{
	place-items: center;
	display: grid;
	grid-template-columns: 20% 30% 20% 30%;
}
.artpage > p
{
	font-size: 2vh;
	margin: 2vw 2vw 2vw 2vw;
	padding: 2vw 2vw 2vw 2vw;
}
@media (max-width: 900px)
{
	.artpage
	{
		grid-template-columns: 40% 60%;
	}
}