* {
	box-sizing: border-box;
}
p {
	
}
body {
	margin: 0;
	background-color: #2C3531;
}
.container {
	display: grid;
	grid-template-columns: 3fr 1fr;
	grid-template-areas:
		"header header"
		"nav nav"
		"main aside"
		"footer footer";
	min-height: 100vh;
}
header { 
	grid-area: header;
	background-color: #2C3531;
	align-items: center;
	padding: 15px 25px;
}
.logo {
	width: 75;
	margin-right: auto;
	border-radius: 100px;
}
h1 {
	text-align: center;
	font-size: 100;
	color: white;
}
nav { 
	position: sticky;
	top: 0;
	grid-area: nav; 
	background-color: #2C3531;
	margin-left: auto;
	gap: 25px;
}
nav ul {
	list-style-type: none;
	display: flex;
	justify-content: space-around;
}
nav a {
	display: block;
	padding: 10px 20px;
	background-color: D1E8E2;
	color: white;
	text-decoration: none;
	border-radius: 5px;
}
nav a:hover {
	background-color: #116466;
	color: white;
	box-shadow: 5px 5px 5px #2C3531;
}
main {
	grid-area: main; 
	background-color: #116466;
	border-radius: 50px;
	padding: 15px 25px;
	
	}
aside { 
	grid-area: aside; 
	background-color: #D3D3D3;
	padding: 15px 25px;
	border-radius: 50px;
}
table {
	width: 50%;
	border-collapse: collapse;
	margin: 20px auto;
}
th {
	background-color: #2C3531; 
	color: white;
	padding: 12;
	text-align: center;
	border: 1px solid black;
}
td{
	padding: 10px;
	border: 1px solid black;
}
tr:nth-child(even) {
	background-color: #D1E8E2;
}
tr:nth-child(odd) {
	background-color: #D3D3D3;
}
footer { 
	grid-area: footer; 
	background-color: #D1E8E2;
}
@media (max-width: 600px) {
	.container {
		grid-template-columns: 1fr;
	}
	nav ul {
		flex-direction: column;
	}
}