@font-face
{
	font-family		: Plex;
	src			: url(font/IBMPlexSans-Text.ttf);
}
@font-face
{
	font-family		: PlexMono;
	src			: url(font/IBMPlexMono-Text.ttf);
}
@font-face
{
	font-family		: PlexSerif;
	src			: url(font/IBMPlexSerif-Text.ttf);
}

:root
{
	color-scheme		: light dark;
	--bg-color		: light-dark(#F4F4F4, #161616);
	--fg-color		: light-dark(#161616, #F4F4F4);
	--link-color		: light-dark(darkslateblue, lightblue);
	--email-color		: light-dark(#D37137, #E09F79);
	--header-color		: #8BB333;
}

*
{
	font-family		: inherit;
	color			: var(--fg-color);
}

html
{
	height			: 100vh;
}

body
{
	font-family		: Plex;
	background-color	: var(--bg-color);
	margin			: 25px;
}

a {
	color			: var(--link-color);
	text-decoration		: inherit;
}

footer {
	text-align		: center;
	padding			: 0.2em;
	position		: absolute;
	bottom			: 0;
	align-content		: center;
	left			: 0;
	right			: 0;
}

h2
{
	font-family		: PlexMono;
	font-weight		: bold;
	font-size		: x-large;
	text-decoration		: underline var(--header-color);
	margin			: 0;
}
h3
{
	font-family		: PlexMono;
	font-weight		: bold;
	font-size		: large;
}

pre
{
	padding			: 2px 4px;
	background-color	: black;
	color			: white;
	border-radius		: 4px;
	white-space		: pre-wrap;
}

.logo
{
	font-family		: PlexMono;
	font-size		: xxx-large;
	font-weight		: bold;
	text-decoration		: underline #3875D3;
}
.logo-nix
{
	font-family		: PlexMono;
	font-size		: xxx-large;
	font-weight		: bold;
	text-decoration		: underline #F92828;
}