body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	margin: 0;
	padding: 0;
	background-color: #0d0d0d;
	color: #f4f4f4;
	font-family: 'Tektur', monospace;
	background-attachment: fixed;
	background-image: url('/img/background.png');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.site-content { flex: 1; }

h1 {
	text-align: center;
	color: #ff3b2f;
	font-size: 2.8em;
	letter-spacing: 3px;
	text-shadow: 0 0 10px #ff3b2f, 0 0 20px #b30000;
	margin-top: 50px;
	animation: flicker 4s infinite;
}

@keyframes flicker {
	0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
		text-shadow: 0 0 10px #ff3b2f, 0 0 20px #b30000;
	}
	20%, 24%, 55% {
		text-shadow: none;
	}
}

/* Chart container */
.chart-container {
  width: 50%;
  max-width: 1600px;
  height: 250px;     /* controls graph height */
  margin: 20px auto;
  background: rgba(15, 15, 15, 0.9);
  border: 2px solid rgba(255, 59, 47, 0.3);
  border-radius: 15px;
  box-shadow: 0 0 25px rgba(255, 60, 40, 0.2);
  padding: 15px;
}

canvas {
  width: 100% !important;
  height: 100% !important;
}

footer {
	text-align: center;
	margin-top: 50px;
	color: #555;
	font-size: 0.9em;
	padding: 1rem;
}