
body {
	background-color: linen;
	background-image: none;
}

.project-heading, .project-photos {
	/* Thanks to the cute codepen linked on the next line for the background!
	 * https://codepen.io/matteodesanti/pen/PmQKmV 
	 */
	background-color:#06c;
	background-image: linear-gradient(rgba(255,255,255,0.2) 2px, transparent 2px),
	linear-gradient(90deg, rgba(255,255,255,0.2) 2px, transparent 1px),
	linear-gradient(rgba(255,255,255,0.1) 1px, transparent 1px),
	linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px);
	background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;
	background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px;

	background-attachment: fixed;
}

.project-heading h1 {
	margin-top: 0px;
	padding-top: 100px;
	color: linen;
	font-size: 370%;

	margin-bottom: 0px;
}

.project-stats {
	display: flex;

	gap: 20px;

	color: white;
	font-weight: bold;
}

.project-photos {

}

.project-photos h2 {
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	color: white;
}

.project-photos .flex {
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	justify-content: center;
}

.project-photos img {
	height: 150px;
	width: 200px;
	object-fit: scale-down;

	border-radius: 10px;
	
	transition-duration: 0.5s;
	transition-property: transform, object-fit;

	background-color: #EEEEEE88;
}

.project-photos img:hover {
	transform: scale(300%, 300%) translate(0%, -20%);
}

.project-photos p {
	margin-top: 0px;
	text-align: center;
	color: white;
}

.footerbar-container {
	margin-top: 0px !important;
}
