diff --git a/packages/cxl-ui/scss/cxl-jw-player/cxl-jw-player-chapter-navigation.scss b/packages/cxl-ui/scss/cxl-jw-player/cxl-jw-player-chapter-navigation.scss
index 471389014..1590821a5 100644
--- a/packages/cxl-ui/scss/cxl-jw-player/cxl-jw-player-chapter-navigation.scss
+++ b/packages/cxl-ui/scss/cxl-jw-player/cxl-jw-player-chapter-navigation.scss
@@ -14,6 +14,10 @@
   background: var(--lumo-shade);
   gap: var(--lumo-space-s);
 
+  &[hidden] {
+    display: none;
+  }
+
   .close {
     font-size: var(--lumo-font-size-xs);
     cursor: pointer;