@import url('https://fonts.googleapis.com/css2?family=Lobster&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');

body {
	font-family: "Noto Sans", "Avenir Next", system-ui, sans-serif;
	font-size: 100%;
	line-height: 144%;
	margin: 0;
}

header {
	min-height: 33vh;
	background-color: #eee;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

h1 {
	font-family: "Lobster", sans-serif;
	font-size: 8vw;
}

main {
	margin: 0 1em;
	display: flex;
	flex-direction: row;
	gap: 1em;
}

table.first-data {
	/*border: 1px solid #888;*/
	width: 30%;
	border-spacing: 2px;
	border-collapse: separate;
	text-align: right;
	font-variant-numeric: tabular-nums lining-nums;
	caption-side: bottom;
}
table.first-data tr>* {
	/*border: 1px solid #aaa;*/
	padding: .1em .25em;
	background-color: #eee;
	min-width: 5em;
}
table.first-data th {
	background-color: #ccc;
}

table.first-data tr>*:nth-child(odd) {
	background-color: #ddd;
}
table.first-data tr>*:nth-child(even) {
	background-color: #edd;
}

table.first-data thead th:first-child {
	background-color: #fff0;
}

table.first-data caption {
	font-style: italic;
	margin-top: 1em;
}

p {
	font-variant-numeric: proportional-nums oldstyle-nums;
    font-feature-settings: "onum" 1; 
}

footer {
	padding: 1em;
	font-size: 8pt;
	font-style: italic;
	text-align: center;
	background-color: white;
	color: black;