:root {
	--genwidth: 750px;
	--fg: #d5d5d5;
	--fg2: #db7346;
	--bg: #384744;
	--bg2: #2e554d;
	--border: #99b5af;
}

body {
	background: var(--bg);
}

header {
	color: var(--fg);
	font-family: century gothic;
}

main {
	max-width: var(--genwidth);
	margin: auto;
	font-size: large;
	text-align: center;
}

footer {
	max-width: var(--genwidth);
	margin: 0 auto;
	margin-top: 3em;
	padding: 1em;
	border-style: dashed;
	border-width: 2px 0px 0px 0px;
	border-color: var(--border);
	text-align: center;
	font-family: century gothic;
	font-weight: bold;
	clear: both;
}

article {
	background: var(--bg2);
	color: var(--fg2);
	border-radius: 5px;
	margin: 1em;
	padding: 0 2em;
	border: 3px solid var(--border);
}

h1, h2 {
	text-align: center;
	max-width: var(--genwidth);
	margin-left: auto;
	margin-right: auto;
}

h1 {font-size: xxx-large; }

h2 {font-size: xx-large; font-style: serif;}

a {color: beige;}

ul {text-align: left}

code {font-size: small;overflow-wrap: break-word;}

figure.profile {
	display: block;
	margin-block-start: 1em;
	margin-block-end: 1em;
	margin-inline-start: 0.5em;
	margin-inline-end: 0.5em;
}

.profile {text-align:center;}

.profile img {max-height:350px;max-width:100%;margin:1em auto;}

.menu {
	padding: 20px;
	display: flex;
	flex-wrap: wrap;
}

.menu a.button {
	background: var(--bg);
	color: var(--fg);
	margin: 0.5em auto;
	border-radius: 8px;
	border: 2px solid var(--border);
	padding: 15px 32px;
	cursor: pointer;
	text-decoration: none;
}

.menuitem {
	background: var(--bg);
	color: var(--fg);
	margin: 1em auto;
	text-align: center;
	padding: 1em;
	padding-top: 0em;
	border-radius: 8px;
	border: 2px solid var(--border);
	overflow: hidden;
}

.menuitem figure {float: right; margin: 0em 1em;}

.qr {width: 150px;}