fixed mobile nav via z-index change on modal.show

_includes/js/homepage-zindex-js.html

@@ -0,0 +1,18 @@
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+  // Select the modal and the tv image container
+  var offcanvasNavbar = document.getElementById('offcanvasNavbar');
+  var tvImageContainer = document.getElementById('tvimage-container');
+
+  // Listen for the show event
+  offcanvasNavbar.addEventListener('show.bs.offcanvas', function () {
+    tvImageContainer.style.zIndex = "-1"; // Set z-index to -1 when modal is shown
+  });
+
+  // Listen for the hide event
+  offcanvasNavbar.addEventListener('hide.bs.offcanvas', function () {
+    tvImageContainer.style.zIndex = ""; // Remove z-index when modal is hidden
+  });
+});
+
+</script>

_layouts/mainstreet-home.html

@@ -1,14 +1,14 @@
 ---
 # Default home page with boxes providing collection stats
 layout: default
-custom-foot: js/interviews-js.html;js/youtube-clips-modal.html
+custom-foot: js/interviews-js.html;js/youtube-clips-modal.html;js/homepage-zindex-js.html
 ---
 <div class="container-fluid">
 
   <div class="row my-2">
 
     <div class="col-12 col-lg-6 py-0 text-center">
-      <div class="tvimage-container position-relative">
+      <div id="tvimage-container" class="position-relative">
           <a data-bs-toggle="modal" data-bs-target="#videoClipModal" data-bs-youtubeid="NVs2-8j8bh4">
               <!-- Ensure this a-tag has the stretched-link class to make the entire div clickable -->
               <figure class="figure mx-3">

_sass/_custom.scss

@@ -165,25 +165,25 @@
 
   // Home page TV effect with button
 
-  .tvimage-container {
+  #tvimage-container {
     cursor: pointer;
     overflow: hidden;
 
 }
 
-.tvimage-container:hover figure img {
+#tvimage-container:hover figure img {
     filter: brightness(85%);
 }
 
-.tvimage-container .figure {
+#tvimage-container .figure {
     margin: 0;
 }
 
 .position-absolute {
     z-index: 2;
 }
 
-.tvimage-container a::before {
+#tvimage-container a::before {
     content: "";
     position: absolute;
     top: 0;