body { padding: 0;margin: 0;padding: 2rem;background: #f5f5f5;max-width: 1800px;margin-left: auto;margin-right: auto;}
@font-face {
	font-family: Baskerville-Bold;
	src: url(../../fonts/Baskerville-Bold.ttf);
}
body.full-window { padding: 0; }
#unity-container.unity-desktop { width: 100%;position: relative;max-width: 1800px; }
#unity-container.unity-mobile { position: fixed; width: 100%; height: 100% }
#unity-container.full-window { width: 100%;max-width: 100%;height: 100%;position: fixed;left: 0; }
#unity-canvas { background: #231F20; width: 100% !important;max-width: 1800px;margin-left: auto;margin-right: auto;display: block; }
.unity-mobile #unity-canvas { width: 100%; height: 100% }
#unity-canvas.full-window { height: 100% !important;max-width: 100%; }
#unity-loading-bar { position: absolute;width: 240px; left: 50%;top: 300px; transform: translateX(-50%);display: none; }
#unity-logo { display: none;width: 154px; height: 130px; background: url('unity-logo-dark.png') no-repeat center }
#unity-progress-bar-empty { width: 240px; height: 18px; border-radius: 10px;border: 2px solid white;clip-path: inset(0 round 10px);  }
#unity-progress-bar-full { width: 0%; height: 18px; background-color: white;position: relative;top: -2px; }
#unity-footer { position: absolute;width: 100%;top: 10px;left: 50%;transform: translateX(-50%);box-sizing: border-box;padding-right: 10px; }
.unity-mobile #unity-footer { display: none }
#unity-webgl-logo { display: none;float:left; width: 204px; height: 38px; background: url('webgl-logo.png') no-repeat center }
#unity-build-title { display: none;float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
#unity-fullscreen-button { cursor:pointer; float: right; width: 30px; height: 30px; background: url('full-screen-icon-white.png') no-repeat center;background-size: contain;opacity: 0.7; }
#unity-fullscreen-button.exit-button { background: url('exit-full-screen-icon-white.png') no-repeat center;background-size: contain; }
#unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }

.page-content { width: 100%;margin-left: auto;margin-right: auto;line-height: 160%;padding: 30px 20px 50px 20px;box-sizing: border-box;background-color: #fdfdfd;border: 1px solid #e6e6e6; }
.page-content #main-title { text-align: center;font-size: 37px;margin-top: 0;margin-bottom: 28px;font-family: Baskerville-Bold, serif; }
.page-content p { font-size: 20px;line-height: 166%;max-width: 1024px;margin-left: auto;margin-right: auto; }
.navbar.home { border: 1px solid #e6e6e6; }
.decorated-title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	margin: 3rem;
}

.decorated-title img {
	height: 20px; 
}

.decorated-title h2 {
	margin: 0;
	font-size: 1.7rem;
	font-weight: bold;
	text-align: center;
	white-space: nowrap;
}

/*
@media only screen and (min-width: 1801px) {
	#unity-canvas {
		border-radius: 10px;
	}
}
*/

/** Highlights gallery **/
.gallery {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 6rem;
	max-width: 800px;
	margin: auto;
}

.card {
	background: white;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	display: flex;
	flex-direction: column;
}

.card-image-container {
	position: relative;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
}

.card-image-container img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.gallery .card {
	max-width: 350px;
	margin-left: auto;
	margin-right: auto;
}

.hover-overlay {
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.6);
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem;
	font-size: 0.95rem;
	text-align: center;
	opacity: 0;
	transition: opacity 0.3s ease;
	line-height: 160%;
	overflow: auto;
	display: -webkit-box;
/*
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
*/
}

.card-image-container:hover .hover-overlay {
	opacity: 1;
}
.card-title {
	padding: 1rem;
	font-weight: bold;
	text-align: center;
	line-height: 120%;
}

#main-message {
    text-align: center;
    font-size: 20px;
    color: #888;
    margin-top: 100px;
    margin-bottom: 50px;
}