body {
	width: 80vw;
	min-height: 80vh;
	padding: 10vh 10vw;
	margin: 0;

	background-image: url("./laserprism_blur.png");
	background-position: center;
	background-color: #3578ff;
	background-blend-mode: luminosity;
}

.title-container {
	display: flex;

	flex-direction: row;
	align-items: center;
}

h1 {
	margin: 0 32px;
	
	font-family: "Inter", sans-serif;
	font-size: 48px;
	font-weight: 900;
	letter-spacing: -0.05em;
	
	color: white;
}

.logo {
	width: 64px;
	height: 64px;
	margin-bottom: 32px;
}

.link-icon {
	width: 64px;
	height: 64px;
	margin-right: 32px;
	display: inline-block;

	background-color: black;
}

.cat-link {
	height: 64px;
	margin-bottom: 32px;
	display: flex;

	flex-direction: row;
}

.cat-link-title-box {
	height: 64px;
	padding: 0px 16px;
	display: inline-flex;

	transform: none;

	align-items: center;
	justify-content: center;

	background-color: black;

	transition: all 0.125s;
}

.cat-link-title-box:hover {
	transform: scale(1.025, 1.025);

	background-color: #333333;
}

.cat-link-title-box:active {
	transform: scale(0.975, 0.975);

	background-color: black;
}

.cat-link-title-box:active .cat-link-title {
	color: #cccccc;
}

.cat-link-title {
	font-family: "Inter", sans-serif;
	font-size: 36px;
	letter-spacing: -0.075em;
	text-decoration: none;
	vertical-align: baseline;

	color: white;

	transition: color 0.125s;
}

.cat-link-title strong {
	font-weight: 900;
}