/* Start */
:root {
	--title-color: #689F38; /* Light Green 700 */
	--pri-color: #1976D2; /* Blue 700 */
	--pri-back: #F1F8E9; /* Gray 50 */
	--sec-color: #212121; /* Gray 900 */
	--sec-back: #FAFAFA; /* Gray 50 */
	--link-color: #7C4DFF; /* Deep Purple A200 */
	--clear: #00000000;
	--shadow: #9E9E9E;
	--font-size: 1.1rem;
	--border: solid 0.05rem;
	--footer-height: 5rem;
	--max-width: 45rem;
	--width: 85vw;
	--time: 250ms;
}

/* Element */
body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: var(--pri-color);
	background: var(--sec-back);
	font-size: var(--font-size);
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
}

a, a:focus, a:hover {
	color: var(--link-color);
	text-decoration: none;
	outline: none;
}

/* Id */

#Container {
	width: var(--width);
	max-width: var(--max-width);
	min-height: 95vh;
	border-radius: 0.4rem;
	background: var(--pri-back);
	transition-duration: var(--time);
	filter: drop-shadow(0rem 0rem 0.5rem var(--shadow));
}

#Main {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: calc(95vh - (var(--footer-height) + 3rem));
}

#PageTitle {
	display: flex;
	flex-wrap: wrap;
	margin: 2rem;
	font-size: calc(var(--font-size) * 2);
	color: var(--title-color);
}

/* Class */
.section {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin: 2%;
	transition-duration: var(--time);
}

.section__title {
	font-size: 1.5rem;
}

.section__text {
	color: var(--sec-color);
}