details {
	background-color: #ddd;

	border: 3px solid #bbb;
	border-radius: 5px;

	padding: 5px;
}
details:hover {
	box-shadow: 0 5px 8px 0 #ccc;
}
summary {
	display: block;

	border-radius: 5px;
}
summary:active {
	background-color: #ccc;
}
summary img {
	max-height: 15em;

	vertical-align: middle;

	border: 3px solid #bbb;
	border-radius: 6px;

	margin: 4px;
}
summary table {
	width: 100%;
}

.project_desc {
	text-align: end;
}

#projects_overview {
	display: flex;
	gap: 8px;

	width: 100%;
	height: auto;
}
#projects_overview button {
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 1 0 0;

	color: #000;

	background-color: #ddd;

	border: 3px solid #bbb;
	border-radius: 5px;

	padding: 16px;
}
#projects_overview button:hover {
	box-shadow: 0 5px 8px 0 #ccc;
}
#projects_overview button:active {
	background-color: #ccc;
}
#projects_overview button div img {
	display: block;

	width: 100%;
	min-height: 100%;
}
#projects_overview button div {
	display: flex;
	align-items: center;

	overflow: hidden;

	width: 100%;
	height: 15em;

	border: 3px solid #bbb;
	border-radius: 6px;
}