header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 0.75rem;
	background: skyblue;
	color: black;
	display: flex;
	justify-content: space-around;
}

body {
	width: 100%;
	height: calc(100vh - 2.5rem - 1.5rem);
	margin-top: 2.5rem;
	background: black;
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
}

main {
	width: 100%;
}

article {
	width: 60%;
	min-width: 20rem;
	margin: auto;
	padding: 0.5rem;
	border: 2px white solid;
	border-radius: 0.2rem;
}

article p {
	margin: 0 0 0.5rem;
}

.button-container {
	max-width: 100%;
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
	background: lightgray;
	padding: 0.5rem;
	border-radius: 0.2rem;
}

button {
	flex: 0 0 5rem;
	padding: 0.5rem;
	margin: 0.25rem;
}

footer {
	display: flex;
	position: fixed;
	bottom: 0;
	left: 0;
	background: gold;
	color: black;
	width: 100%;
	padding: 0.25rem;
}

.footer-text {
	flex: 0 0 100%;
	animation: scroll 10s linear infinite;
}

@keyframes scroll {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(0);
	}
}