diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 379b4bb..cd259ca 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -420,6 +420,34 @@
 	</p>
 </section>
 
+<section class="videos-body">
+	<h1 class="title">Some videos we've posted before:</h1>
+	<div id="videos-container">
+		<iframe
+			id="undercity"
+			width="560"
+			height="315"
+			src="https://www.youtube-nocookie.com/embed/kaEFv7e49mo?si=uYq4Ee3RWX6rqfBv&amp;controls=0"
+			title="YouTube video player"
+			frameborder="0"
+			allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+			referrerpolicy="strict-origin-when-cross-origin"
+			allowfullscreen
+		></iframe>
+		<iframe
+			id="shipwrecked"
+			width="560"
+			height="315"
+			src="https://www.youtube-nocookie.com/embed/uXWMr0gdLJA?si=Vb4hK6MBO0E5RDWB&amp;controls=0"
+			title="YouTube video player"
+			frameborder="0"
+			allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+			referrerpolicy="strict-origin-when-cross-origin"
+			allowfullscreen
+		></iframe>
+	</div>
+</section>
+
 <section class="past-events">
 	<h1 class="title">In the past year, we have organized...</h1>
 	<div class="programs-grid">
diff --git a/src/routes/page.css b/src/routes/page.css
index 932f545..a2ad602 100644
--- a/src/routes/page.css
+++ b/src/routes/page.css
@@ -829,8 +829,46 @@ u:hover {
 }
 
 @keyframes underline-flicker {
-	0%   { transform: scaleX(1); transform-origin: right; }
-	49%  { transform: scaleX(0); transform-origin: right; }
-	50%  { transform: scaleX(0); transform-origin: left; }
-	100% { transform: scaleX(1); transform-origin: left; }
-}
\ No newline at end of file
+	0% {
+		transform: scaleX(1);
+		transform-origin: right;
+	}
+	49% {
+		transform: scaleX(0);
+		transform-origin: right;
+	}
+	50% {
+		transform: scaleX(0);
+		transform-origin: left;
+	}
+	100% {
+		transform: scaleX(1);
+		transform-origin: left;
+	}
+}
+
+#videos-container {
+	display: flex;
+	flex-direction: row;
+	text-align: center;
+	align-items: center;
+	justify-content: center;
+	gap: 2vw;
+}
+
+.videos-body {
+	max-width: 80%;
+	margin: auto auto 5rem auto;
+	text-align: center;
+}
+
+.videos-body .title {
+	color: var(--color-text-dim);
+	margin-bottom: 3rem;
+}
+
+#undercity,
+#shipwrecked {
+	width: clamp(250px, 35vw, 750px);
+	height: clamp(100px, 35vh, 750px);
+}