html, body, #bodywrapper, #body {
	width: 100%;
	height: 100%;
	position: relative;
	margin: 0;
	overflow: hidden;
	padding: 0;
}

#body {
	cursor: default;
	background: var(--background-color);
	display: flex;
	font: 14px Alegreya;
	border: 1px solid var(--separator-color-transparent);
}

.background-image {
	position: absolute;
	width: 120vmax;
	height: 120vmax;
	display: flex;
	justify-content: center;
	align-items: center;
	align-self: center;
	left: -10vmax;

	> img {
		opacity: .15;
		width: 100vmax;
		height: 100vmax;
	}
}

#body.show-animations {
	@keyframes rotateBackground {
		from {
			transform: rotate(0deg);
		}
		to {
			transform: rotate(360deg);
		}
	}

	.background-image > img {
		animation-name: rotateBackground;
		animation-timing-function: linear;
		animation-duration: 300s;
		animation-iteration-count: infinite;
	}
}

.loading-wrapper {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	@keyframes rotateLoading {
		from {
			transform: rotate(0deg);
		}
		to {
			transform: rotate(360deg);
		}
	}

	.loading {
		width: 80px;
		height: 80px;
		border-radius: 50%;
		border-width: 3px;
		border-color: var(--accent-color) transparent;
		border-style: solid;
		animation-name: rotateLoading;
		animation-timing-function: linear;
		animation-duration: 2s;
		animation-iteration-count: infinite;
	}

	.loading-text {
		margin-top: 24px;
		color: var(--accent-color);
		font: 500 14px "Alegreya Sans";
	}
}

section#content {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	position: relative;
}

.small-info-text {
	font: 500 12px Alegreya Sans;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--separator-color-halftransparent);
}

ul:not(.list-wrapper) {
	list-style: none outside none;
	margin: 0;
	padding: 0;

	li {
		padding-left: 18px;

		&::before {
			position: absolute;
			content: "";
			transform: rotate(45deg);
			width: 6px;
			height: 6px;
			background: var(--separator-color-transparent);
			margin-top: 8px;
			margin-left: -17px;
		}

		em {
			font-weight: 400;
		}
	}
}
