diff --git a/public_html/css/hpr.css b/public_html/css/hpr.css
index 85bf937..8210858 100644
--- a/public_html/css/hpr.css
+++ b/public_html/css/hpr.css
@@ -54,6 +54,8 @@ https://creativecommons.org/publicdomain/
 	--font-size-default: clamp(1rem, 15px + 0.3vw, 1.07rem);
 	--font-size-emphasis: clamp(1.1rem, 15px + 0.3vw, 1.25rem);
 
+	--episode-nav-padding: clamp(0.15em, 15px + 0.3vw, 0.4em);
+	--show-notes-pre-background: #f9e9c2; 
 	--logo-font-family: var(--font-family-hpr);  
 	--logo-font-weight: bolder;
 	--logo-font-size: 7.5rem;
@@ -745,6 +747,16 @@ fieldset > table td input[type="radio"] {
 	clip: rect(0, 0, 0, 0);
 	border: 0;
 }
+#show_notes {
+	max-width: 98vw;
+}
+#show_notes pre
+{
+    background-color: var(--show-notes-pre-background);
+    border: 1px solid #ddd;
+    overflow: scroll;
+	padding: 0.1em 0;
+} 
 nav.episodes {
 	color: var(--background-primary);
 	font-size: 0.9em;
@@ -771,7 +783,7 @@ nav.episodes span:nth-child(n+3) a {
 }
 nav.episodes span.no-link, 
 nav.episodes span a {
-	padding: 0.3em 0.4em 0.1em 0.4em;
+	padding: 0.3em var(--episode-nav-padding) 0.1em var(--episode-nav-padding);
 	display: inline-block;
 	min-width: 4.4em;
 	min-height: 1.5em;
@@ -921,6 +933,7 @@ nav.episodes span a:hover svg #bar {
 		--shadow-secondary-color: hsl(0, 0%, 40%);
 		--input-border-primary: var(--shadow-secondary-color);
 		--lane-button-color: #d5e6ea;	
+		--show-notes-pre-background: #b54c08;
 	}
 	body > header {
 		background-image: url("/images/main-header-background-dark.png");
diff --git a/templates/content-episode.tpl.html b/templates/content-episode.tpl.html
index 4fc71f1..18861eb 100644
--- a/templates/content-episode.tpl.html
+++ b/templates/content-episode.tpl.html
@@ -26,7 +26,7 @@ Hosted by <a href="<!--% absolute_path(baseurl) %-->correspondents/<!--% zero_pa
 <h3><!--% show_series(episode.series, episode.seriesid, "Part of the series") %--></h3> 
 <p><em><!--% episode.series_description %--></em></p>
 	</header>
-	<div><!--% episode.notes %--></div>
+	<div id="show_notes"><!--% episode.notes %--></div>
 <footer>
 <p>
 <!--% episode_navigation %-->