:root{
	--bg-color: #ffffff
	--text-color: #000000
}

body {
	background-color: var(--bg-color);
	color: var(--text-color);
	font-family: Arial, sans-serif;
	margin: 40px;
	text-align: center;
	transition: background-color 0.3s, color 0.3s;
}

html, body {
	height: 100%;
	margin: 0;
	display: flex;
	flex-direction: column;
}

.page-content {
	flex: 1; /* Takes up available vertical space */
	padding: 20px;
}

.footer-links{
	text-align: center;
	padding: 20px;
	line-height: 1.6;
}

.line-block{
	width: max-content; /* Shrink to fit content width */
	margin: 40px auto 0; /* Center horizontally */
	text-align: left; /* Align link text to the left */
	line-height: 1.6; /* Optional: adds vertical spacing */
}

h1 {
			color: 2D455E;
}

.dark-mode{
	--bg-color: #121212;
	--text-color: #f5f5f5;
}

.left-align {
	text-align: left;
}

a {
	color: #0077ff;
	text-decoration: none;
}

a:visited {
	color: #5599ff;
}

a:hover,
a: focus {
	text-decoration: underline;
}

.dark-mode a {
	color: #66ccff;
}

.dark-mode a:visited {
	color: #88ddff;
}

button {
	margin-top: 20px;
	padding: 10px 20px;
	font-size: 1rem;
	cursor: pointer;
}