* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body {
	padding: 0 1rem;
	font-family: "Times New Roman", Times, serif;
	font-size: 14px;
	display: flex;
	height: 100vh;
	flex-direction: column;
	align-items: center;
}

header {
	width: 100%;
	display: flex;
	justify-content: space-between;
	opacity: 0.2;
	transition: opacity 0.2s ease-out;
	padding: 1rem 0;
}

header:hover {
	opacity: 1;
	transition: opacity 0.3s ease-out;
}

header * {
	font-weight: normal;
	font-size: 0.95rem;
}

header div {
	display: flex;
}

main {
	flex: 1;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

#sketch-container {
	width: min(600px, 100%);
	max-height: 600px;
	aspect-ratio: 1;
	outline: solid 1px #dadada;
	margin-bottom: 5vh;
}