* {font-family: 'Roboto', sans-serif;}

html {
	--text-color: #979eab;
	--primary-color: #2d323d;
	--secondary-color: #3f485b;
}

body {
	background-color: var(--primary-color);
	color: var(--text-color);
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	height: 100vh;
	justify-content: space-between;
	overflow: hidden;
}

main {
	overflow: auto;
	padding: 0 calc((100vw - 1440px) * 0.5);

	.navbar {
		width: 100%;
		text-align: start;
	}
}

.poster-wrap {
	text-align: center;
}

input, textarea, a, button {
	cursor: pointer;
}

*:not(input, textarea, a, button) {
	cursor: default;
}

h1, h2, h3 {
	text-align: center;
	margin: 0.5em;
}

fieldset {
	border-color: var(--secondary-color);
	margin: 0.5em;
	overflow: auto;
}

a {
	color: #5f87c5;
	cursor: pointer;

	* {cursor: pointer;}

	&:hover {
		filter: saturate(170%);
	}
}

button {
	width: 10em;
	height: 30px;
	font-size: 11pt;
	color: var(--text-color);
	background-color: #3f485b;
	border: 1px solid rgba(0, 0, 0, 0.637);
	border-radius: 0.25em;

	&:hover {
		background-color: #4f5b74;
	}
}

.faq {
	white-space: pre-line;
	text-align: justify;
	text-indent: each-line 1em;
}

.panel1 {
	width: 100%;
	display: flex;
	justify-content: center;
}

footer {
	margin-top: 1em;
	border-top: 1px solid #13151a;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 2em calc((100vw - 1440px) * 0.5);

	aside {
		display: flex;
		flex-wrap: wrap;
		gap: 0.5em;

		a:last-child {
			color: #9c751a;
			font-weight: bold;
		}
	}
}
