diff --git a/templates/index.html b/templates/index.html
index cbd48cf..d3f3c89 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -15,13 +15,13 @@
 			<a href="https://www.youtube.com/watch?v=zm8Sx6cVbmM">
 				<div class="title">Afterglow</div>
 				<img src="/showreel/afterglow.png" />
-				<div class="summary">Work-in-progress immersive sim experiment built using a the Ona game engine.</div>
+				<div class="summary">Work-in-progress immersive sim experiment built using the Ona game engine.</div>
 			</a>
 
 			<a href="https://www.youtube.com/watch?v=ijJhM8nfthw">
 				<div class="title">Afterglow</div>
 				<img src="/showreel/afterglow-menu.png" />
-				<div class="summary">Work-in-progress immersive sim experiment built using a the Ona game engine.</div>
+				<div class="summary">Work-in-progress immersive sim experiment built using the Ona game engine.</div>
 			</a>
 
 			<a href="https://sauce.pizzawednes.day/protectorate/game">
@@ -121,34 +121,44 @@
 </style>
 
 <script type="module">
-const slideshowIntervalSeconds = 7.5; 
+const slideshowIntervalSeconds = 5; 
 
 window.addEventListener("load", async () => {
-	let slideshows = document.getElementsByClassName("slideshow")
+	let slideshows = document.getElementsByClassName("slideshow");
 
 	for (let slideshow of slideshows) {
 		if (!slideshow.hasChildNodes()) {
 			continue;
 		}
 
-		let slideIndex = 0
+		let slideIndex = 0;
+		let intervalId;
 
-		setInterval(() => {
-			let children = slideshow.children
+		const startSlideshow = () => {
+			intervalId = setInterval(() => {
+				let children = slideshow.children;
+				slideIndex = (slideIndex + 1) % children.length;
 
-			slideIndex = (slideIndex + 1) % children.length
+				for (let index = 0; index < children.length; index += 1) {
+					children[index].style.display = (index === slideIndex) ? "block" : "none";
+				}
+			}, slideshowIntervalSeconds * 1000);
+		};
 
-			for (let index = 0; index < children.length; index += 1)
-				children[index].style.display = (index == slideIndex) ? "block" : "none"
-		}, slideshowIntervalSeconds * 1000)
+		slideshow.addEventListener("mouseenter", () => {
+			clearInterval(intervalId);
+		});
 
-		let children = slideshow.children
+		slideshow.addEventListener("mouseleave", startSlideshow);
 
-		children[0].style.display = "block"
+		let children = slideshow.children;
+		children[0].style.display = "block";
 
 		for (let index = 1; index < children.length; index += 1) {
-			children[index].style.display = "none"
+			children[index].style.display = "none";
 		}
+
+		startSlideshow();
 	}
 });
 </script>