body{
	font-family: monospace;
	font-size: larger;
}

header{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 10px 20px;
	box-sizing: border-box;
	overflow: hidden;
	max-height: 20mm;
}

header *{
	display: inline-block;
	vertical-align: middle;
}

header li{
	color: black;
	border: 0.5mm solid;
	border-radius: 1mm;
	padding: 2mm 4mm;
	font-weight: bold;
	transition: 200ms all;
}

header img{
	max-height: 100%;
	height: 20mm;
}

header li:hover{
	background-color: rgb(33, 148, 33);
}

@media (max-width: 768px) {
	header{
		flex-direction: column;
		align-items: flex-start;
		max-height: none;
		padding: 15px;
	}

	header img{
		height: 15mm;
	}

	header li{
		display: block;
		margin-bottom: 5px;
	}
}

/*
header{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 10px 20px;
	box-sizing: border-box;
	overflow: hidden;
	max-height: 20mm;
}

header *{
	display: inline-block;
	vertical-align: middle;
}

header li{
	color: black;
	border: 0.5mm;
	border-radius: 1mm;
	border-style: solid;
	padding-left: 4mm;
	padding-right: 4mm;
	padding-top: 2mm;
	padding-bottom: 2mm;
	font-weight: bold;
	transition: 200ms all;
}

header img{
	max-height: 100%;
	height: 20mm;
}

header li:hover{
	background-color: rgb(33, 148, 33);
}

@media (max-width: 768px) {
	header{
		flex-direction: column;
		align-items: flex-start;
		max-height: none;
		padding: 15px;
	}

	header *{
		display: block;
		margin-bottom: 8px;
	}
}
*/

#images {
	height: 15vw;
	display: flex;
	gap: 4mm;
	margin-top: 6mm;
}

#images div {
	flex: 1;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;

	border: 0.5mm;
	border-radius: 3mm;
	border-style: solid;
	padding: 1mm;
}

.bordered_div{
	margin-top: 4mm;
	border: 0.5mm;
	border-radius: 3mm;
	border-style: solid;
	padding-top: 0mm;
	padding-bottom: 5mm;
	padding-right: 3mm;
	padding-left: 3mm;
}

#images img {
	max-width: 100%;
	max-height: 100%;
	border-radius: 0mm;
}