diff --git a/frontend-tools/video-js/src/VideoJS.css b/frontend-tools/video-js/src/VideoJS.css
index cd39e985..996f6ef8 100644
--- a/frontend-tools/video-js/src/VideoJS.css
+++ b/frontend-tools/video-js/src/VideoJS.css
@@ -1767,11 +1767,7 @@ button.vjs-button > .vjs-icon-placeholder:before {
     display: flex !important;
     align-items: center !important;
     gap: 10px !important;
-    background: rgba(0, 0, 0, 0.7) !important;
     padding: 8px 12px !important;
-    border-radius: 8px !important;
-    backdrop-filter: blur(4px) !important;
-    border: 1px solid rgba(255, 255, 255, 0.1) !important;
     max-width: calc(100% - 40px) !important;
     box-sizing: border-box !important;
     transition: opacity 0.3s ease-in-out !important;
@@ -1822,7 +1818,7 @@ button.vjs-button > .vjs-icon-placeholder:before {
 }
 
 .vjs-embed-info-overlay .embed-title-container a:hover {
-    color: #009931 !important;
+    color: #ccc !important;
 }
 
 /* Responsive styles for smaller screens */
diff --git a/frontend-tools/video-js/src/components/overlays/EmbedInfoOverlay.js b/frontend-tools/video-js/src/components/overlays/EmbedInfoOverlay.js
index d4f2f244..269c4217 100644
--- a/frontend-tools/video-js/src/components/overlays/EmbedInfoOverlay.js
+++ b/frontend-tools/video-js/src/components/overlays/EmbedInfoOverlay.js
@@ -39,11 +39,7 @@ class EmbedInfoOverlay extends Component {
             display: flex;
             align-items: center;
             gap: 10px;
-            background: rgba(0, 0, 0, 0.7);
             padding: 8px 12px;
-            border-radius: 8px;
-            backdrop-filter: blur(4px);
-            border: 1px solid rgba(255, 255, 255, 0.1);
             max-width: calc(100% - 40px);
             box-sizing: border-box;
             transition: opacity 0.3s ease-in-out;
@@ -148,7 +144,7 @@ class EmbedInfoOverlay extends Component {
 
             // Add hover effect
             titleLink.addEventListener('mouseenter', () => {
-                titleLink.style.color = '#009931';
+                titleLink.style.color = '#ccc';
             });
 
             titleLink.addEventListener('mouseleave', () => {
@@ -190,24 +186,34 @@ class EmbedInfoOverlay extends Component {
         // Show/hide with controls
         player.on('useractive', () => {
             overlay.style.opacity = '1';
+            overlay.style.visibility = 'visible';
         });
 
         player.on('userinactive', () => {
-            overlay.style.opacity = '0.7';
+            overlay.style.opacity = '0';
+            overlay.style.visibility = 'hidden';
         });
 
         // Always show when paused
         player.on('pause', () => {
             overlay.style.opacity = '1';
+            overlay.style.visibility = 'visible';
         });
 
         // Hide during fullscreen controls fade
         player.on('fullscreenchange', () => {
             setTimeout(() => {
                 if (player.isFullscreen()) {
-                    overlay.style.opacity = player.userActive() ? '1' : '0.7';
+                    if (player.userActive()) {
+                        overlay.style.opacity = '1';
+                        overlay.style.visibility = 'visible';
+                    } else {
+                        overlay.style.opacity = '0';
+                        overlay.style.visibility = 'hidden';
+                    }
                 } else {
                     overlay.style.opacity = '1';
+                    overlay.style.visibility = 'visible';
                 }
             }, 100);
         });