@media (prefers-color-scheme: light) {
	:root {
		--background-color: #f6f5f4;
		--text-color: black;
		--link-color: darkblue;
	}
}

@media (prefers-color-scheme: dark) {
	:root {
		--background-color: #191919;
		--text-color: #E9E9E9;
		--link-color: cyan;
	}
}

:root {
	--h1-font-size: 3.225rem;
	--h2-font-size: 2.825rem;
	--h3-font-size: 2.225rem;
	--h4-font-size: 1.665rem;
	--default-font-size: 1.375rem;
	--h6-font-size: 1.185rem;
}

body {
	font-family: "Atkinson Hyperlegible", sans-serif;
	text-align: center;
	font-size: var(--default-font-size);
	max-width: 600px;
	margin: auto;
	background-color: var(--background-color);
	color: var(--text-color)
}


a {
	font-size: var(--default-font-size);
	color: var(--link-color);
}

h1 {
	font-size: var(--h1-font-size);
}

h2 {
	font-size: var(--h2-font-size);
} 

h3 {
	font-size: var(--h3-font-size);
}

h4 {
	font-size: var(--h4-font-size);
}

h5 {
	font-size: var(--default-font-size);
}

h6 {
	font-size: var(--h6-font-size);
}