Graphic fixes & mobile navigation

src/app/views/events/aestiva/aestiva.component.html

@@ -1,10 +1,10 @@
 <div class="invert">
 	<div class="banner d-print-none"></div>
-	<div class="container py-4 px-3">
+	<div class="container">
 		<div>
 			<div class="d-flex align-items-end justify-content-between mb-2">
 				<h1 class="mb-0"><em>Castra Aestiva</em> (Summer Camp)</h1>
-				<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
+				<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
 					<mat-icon class="me-1">print</mat-icon>
 					Print
 				</a>
@@ -21,7 +21,7 @@
 			<h2 class="mb-2">Details</h2>
 			<p>
 				Tom Ross hosts a Castra Aestiva event every Memorial Day weekend (in May) near Tillsonburg Ontario. It's a private multi-day training event involving Romans and their enemies and is the perfect opportunity for new Roman reenactors. Participants
-				sleep in <em>sub pellibus</em> (tents) within the protective walls of the <em>castrum</em> (fort). If May doesn't work for you, consider coming to <a routerLink="/events/hiberna">Castra Hiberna</a> in September.
+				sleep in <em>sub pellibus</em> (tents) within the protective walls of the <em>castrum</em> (fort). If May doesn't work for you, consider coming to <a routerLink="/events/castra-hiberna">Castra Hiberna</a> in September.
 			</p>
 			<h3 class="mb-0">Activities</h3>
 			<ul class="mt-0">

src/app/views/events/aestiva/aestiva.component.scss

@@ -1,6 +1,6 @@
 .banner {
 	width: 100%;
-	height: max(300px, 30vh);
+	height: 50vh;
 	background: white url("/assets/img/interior.jpg") center 35% no-repeat;
 	background-size: cover;
 }

src/app/views/events/agonium/agonium.component.html

@@ -1,8 +1,14 @@
 <div class="invert">
 	<div class="banner d-print-none"></div>
-	<div class="container py-4 px-3">
+	<div class="container">
 		<div>
-			<h1 class="mb-2"><em>Agonium</em> (Janus Festival)</h1>
+			<div class="d-flex align-items-end justify-content-between mb-2">
+				<h1 class="mb-0"><em>Agonium</em> (Janus Festival)</h1>
+				<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
+					<mat-icon class="me-1">print</mat-icon>
+					Print
+				</a>
+			</div>
 			<mat-divider></mat-divider>
 			<br>
 		</div>

src/app/views/events/agonium/agonium.component.scss

@@ -1,6 +1,6 @@
 .banner {
 	width: 100%;
-	height: max(300px, 30vh);
+	height: 50vh;
 	background: white url("/assets/img/agonium.png") center center no-repeat;
 	background-size: cover;
 }

src/app/views/events/calendar/calendar.component.html

@@ -1,6 +1,12 @@
 <div class="invert">
-	<div class="container py-4 px-3">
-		<h1 class="mb-2">Calendar</h1>
+	<div class="container">
+		<div class="d-flex align-items-end justify-content-between mb-2">
+			<h1 class="mb-0">Calendar</h1>
+			<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
+				<mat-icon class="me-1">print</mat-icon>
+				Print
+			</a>
+		</div>
 		<mat-divider class="mb-4"></mat-divider>
 		<iframe src="https://calendar.google.com/calendar/embed?height=600&wkst=1&bgcolor=%23ffffff&ctz=America%2FToronto&showTitle=0&showNav=1&showPrint=1&showTabs=0&showCalendars=0&src=Y18wYTIxNTM3ZDgwMWMzNTQ0MTUwYzk5YTUwNjI5Yjc5MjM0MjYyYjY0YzYyNzZiZTQ3OWJlMzA4OWU0MmM3NTQ5QGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20&color=%23D50000" style="border-width:0" width="100%" height="600" frameborder="0" scrolling="no"></iframe>
 	</div>

src/app/views/events/hiberna/hiberna.component.html

@@ -1,10 +1,10 @@
 <div class="invert">
 	<div class="banner d-print-none"></div>
-	<div class="container py-4 px-3">
+	<div class="container">
 		<div>
 			<div class="d-flex align-items-end justify-content-between mb-2">
 				<h1 class="mb-0"><em>Castra Hiberna</em> (Winter Camp)</h1>
-				<a class="d-flex d-print-none justify-content-center text-muted" href="javascript:window.print()">
+				<a class="d-none d-print-none d-sm-flex justify-content-center text-muted" href="javascript:window.print()">
 					<mat-icon class="me-1">print</mat-icon>
 					Print
 				</a>
@@ -22,7 +22,7 @@
 			<h2 class="mb-2">Details</h2>
 			<p>
 				Tom Ross hosts a Castra Hiberna event every September near Tillsonburg Ontario. It's a private single day event between Romans and their adversaries. It's an excellent opportunity for new Roman reenactors. If May doesn't work for you, consider coming to
-				<a routerLink="/events/aestiva">Castra Aestiva</a> in May.
+				<a routerLink="/events/castra-aestiva">Castra Aestiva</a> in May.
 			</p>
 			<h3 class="mb-0">Activities</h3>
 			<ul class="mt-0">

src/app/views/events/hiberna/hiberna.component.scss

@@ -1,6 +1,6 @@
 .banner {
 	width: 100%;
-	height: max(300px, 30vh);
+	height: 50vh;
 	background: white url("/assets/img/morning-mist.jpg") center center no-repeat;
 	background-size: cover;
 }