@media (prefers-color-scheme: dark) {
	header {opacity: 0.25;}
	body, i, .icon, p {
		color: var(--bg) !important;
	}
	.contentbox {
		background-color: #090909aa !important;
	}
	.icon, .icon i {
		filter: invert(99%) sepia(5%) saturate(42%) hue-rotate(255deg) brightness(112%) contrast(96%) opacity(0.45) !important;
	}
}

@import url(https://fonts.bunny.net/css?family=jetbrains-mono:400,700);

:root {
	--bg: #fafafaaa;
	--txt: #090909;
}

body {
	background-color: var(--txt);
	font-family: 'JetBrains Mono';
}

.bg {
	position: fixed;
	background-image: url('bg.webp');
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	filter: blur(4px);
}

.contentbox {
	text-align: center;
	align-items: center;
	display: block;
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	min-width: 160px;
	top: 40%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: var(--bg);
	border-radius: 1em;
	padding: 2em;
	padding-bottom: 3em;
	padding-left: 2em;
	padding-right: 2em;
}

i {
	font-size: 2.4em;
	color: var(--txt);
}

i:hover {
	opacity: 0.8;
}

a, a:link, a:visited {
	text-decoration: none;
}

.icon {
	filter: invert(0%) sepia(3%) saturate(4754%) hue-rotate(354deg) brightness(92%) contrast(93%) opacity(0.75);
}