body {
	font-family: Arial, sans-serif;
	margin: 0;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	background-color: #121212;
	color: #ffffff;
}
.header {
	background-color: #1f1f1f;
	padding: 20px;
	text-align: center;
	box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.header h1 {
	margin: 0;
	padding: 0;
	font-size: 2em;
	color: #4caf50;
}
.main {
	display: flex;
	flex: 1;
	flex-direction: row;
}
.sidebar {
	width: 200px;
	background-color: #1f1f1f;
	padding: 20px;
	box-shadow: 2px 0 5px rgba(0,0,0,0.1);
}
.sidebar button {
	display: flex;
	align-items: center;
	width: 100%;
	margin: 10px 0;
	padding: 10px;
	background-color: #333333;
	border: none;
	cursor: pointer;
	color: #ffffff;
}
.sidebar button:hover {
	background-color: #4caf50;
}
.sidebar button img {
	width: 64px;
	height: 64px;
	margin-right: 10px;
}
.content {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.content img {
	max-width: 100%;
	height: auto;
}
@media (max-width: 600px) {
	.main {
		flex-direction: column;
	}
	.sidebar {
		width: 100%;
		box-shadow: none;
	}
}
