body {
	background: #AAD2BA;
	font-family: Arial, Helvetica, sans-serif;
}

#portrait {
	width: 25%;
	float: left;
	padding: 10px;
}

.grid-container {
  display: grid;
  grid-template-columns: auto auto auto auto auto auto auto auto auto auto;
  gap: 0px;
  padding: 0px;
}

.grid-container > div {
  padding: 0px;
  font-size: 30px;
  margin: 0;
}
.item2 {
	display: flex;
	align-items: center;
  grid-column-start: 2;
  grid-column-end: 11;
  padding: 70px;
  justify-content: center;
  font-size: 32px;
}
.item4 {
  grid-column-start: 2;
  grid-column-end: 10;
}
#content {
	padding: 10px;
	border-color: white;
}
.item7 {
  grid-column-start: 2;
  grid-column-end: 10;
  background-color: white;
  border-color: black;
	border-style: solid;
	text-align: left;
}
h1 {
	text-align: center;
	padding: 70px 0;
}
li:hover:not(.active) {
	background-color: #0BB4D5;
	border-radius: 7px 7px 0 0;
	border-color: #0BB4D5;
}

.active {
	background-color: white;
	border-radius: 10px 10px 0 0;
	border-color: white;
}
ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	border-color: #E7D6B7;

}
li {
	float: left;
	border-style: solid;
	border-radius: 10px 10px 0 0;
	background-color: #46C2C4;
	border-color: #46C2C4;
}
li a {
	display: block;
	color: black;
	padding: 14px 16px;
	text-decoration: none;
}
li.active {
	
}
li.notselected {

}