h1 {
	font-size: 24px;
	font-weight: 700;
	color:#2a3582;
	
}
.center {
	text-align: center;
}

#content {
	font-size: 2vw;
	position: relative;
	background: #fff;
	/* 		url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAADCAYAAABS3WWCAAAAE0lEQVQImWN4//79f4b///9DCABXRQvFYqkKhAAAAABJRU5ErkJggg==); */
	padding: 1.5rem;
	/* 	padding-right: 28%; */
	padding-right: 0%;
	text-align: justify;
}
#sidebar {
	background: #600;
	color: #fff;
	position: absolute;
	right: 1rem;
	top: 1rem;
	width: 25%;

	padding: 0.5rem;
	font-size: 1.35vw;
	display: none;
}

ul#contactsheet {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
}

ul#contactsheet:after {
	content: "";
	display: block;
	flex-grow: 10; /* Prevent justify/stretch of last photo. 10 seems best
} */

/* ul::after {
	content: "";
	flex-grow: 10;
} */

#contactsheet li {
	/* 	height: 40vh; */
	overflow: hidden;
	flex-grow: 1;
	/* 	margin: 0 0.5rem 0.5rem 0; */
	margin: 0 1.5rem 1.5rem 0;
	list-style: none; /* override common/Normalize */
	border: 1px solid #333;
}
ul#contactsheet {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	align-items: baseline;
}
#contactsheet img {
	max-height: 100%;
	min-width: 100%;
	object-fit: cover;
	vertical-align: bottom;
	/*	border: 1px solid #333;
 	filter: grayscale(35%);
	-webkit-filter: grayscale(35%);
	transition: filter 0.35s, border-color 0.35s ; */
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;

	/* 	border-radius: 0.6rem;
	box-shadow: 0.3rem 0.3rem 0.3rem #655; */
}
#contactsheet img:hover {
	/* 	border-color: #c60;
	box-shadow: 0.3rem 0.3rem 0.3rem #974; */
	/* 	border-color: #f2693e; */
	filter: none;
	/* 	-webkit-filter: grayscale(0);
	transition: filter 0.35s, border-color 0.35s ;
	-webkit-transform: scale(1.3); */
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}

/* Portrait: */
@media (max-aspect-ratio: 1 / 1) {
	#contactsheet li {
		height: 30vh;
	}
}

/* Short screens: */
@media (max-height: 480px) {
	#contactsheet li {
		height: 80vh;
	}
}

/* Smaller screens in portrait: */
@media (max-aspect-ratio: 1 / 1) and (max-width: 480px) {
	ul#contactsheet {
		flex-direction: row;
	}

	#contactsheet li {
		height: auto;
		width: 100%;
	}

	#contactsheet img {
		width: 100%;
		max-height: 75vh;
		min-width: 0;
	}
}
