:root {
  background-image: url("https://cat-tastrophy.neocities.org/Chlorella-sorokiniana.jpg");
  background-color: #397a3b;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.container {
  display: grid;
	grid-template-areas:
		'header header'
		'navi navi'
		'sidebar content'
		'footer footer';
	grid-template-columns: 100px 600px;
	grid-template-rows: 150px 60px 500px 100px;
	place-content: center;
  gap: 5px;
  padding: 10px;
	position: static;

}
.container > div {
	font-family: copse;
	background-color: #bde3a0;
	padding: 10px;
	border: solid #77957d 5px
  }
.header {
	grid-area: header;
}
.navigation {
	grid-area: navi;
}
.button {
	font-family: copse;
	font-weight: bold;
	font-size: 16px;
	border: none;
}
.diatoms:hover {
	width:200px;
	height:33px;
	font-size: 22px;
}
.diatoms {
	background-image: url("https://cat-tastrophy.neocities.org/pinnularia-dactylus-transp2.png");
	background-size: cover;
	background-color: transparent;
	width: 150px;
	height: 25px;
}
.sidebar {
	grid-area: sidebar;
}
.content {
	grid-area: content;
	font-size: 22px;
	overflow: scroll;
}
.footer {
	grid-area: footer;
}