Update app.py

app.py

@@ -152,7 +152,7 @@ def html_with_progress(label, progress):
         <div style="width: 70%; background-color: lightgrey; border-radius: 80px; overflow: hidden; margin-bottom: 20px;">
             <div style="width: {progress}%; height: 15px; background-color: #4CAF50; border-radius: 80px;"></div>
         </div>
-        <h2 style="font-style: italic; color: #555;">{label}</h2>
+        <h2 style="font-style: italic; color: #555 !important;">{label}</h2>
     </div>
     """
 
@@ -1227,8 +1227,6 @@ js_code = """
             }
         });
     });
-
-    // Start observing the document body for changes
     observer.observe(document.body, { childList: true, subtree: true });
     console.log("Started observing DOM for lecture container");
 }
@@ -1238,15 +1236,14 @@ js_code = """
 with gr.Blocks(
     title="Agent Feynman",
     css="""
-    h1 {text-align: center}
-    h2 {text-align: center}
+    h1 {text-align: center; color: white !important;}
+    h2 {text-align: center; white !important;}
     #lecture-container {font-family: 'Times New Roman', Times, serif;}
     #slide-content {font-size: 48px; line-height: 1.2;}
     #form-group {box-shadow: 0 0 2rem rgba(0, 0, 0, .14) !important; border-radius: 30px; font-weight: 900; color: #000; background-color: white;}
     #download {box-shadow: 0 0 2rem rgba(0, 0, 0, .14) !important; border-radius: 30px;}
     #slide-display {box-shadow: 0 0 2rem rgba(0, 0, 0, .14) !important; border-radius: 30px; background-color: white;}
     .gradio-container { background: linear-gradient(135deg, #2a2a2a, #6a6a6a); box-shadow: 0 0 2rem rgba(255, 255, 255, 0.14);padding-top: 30px;}
-    .gradio-container.gradio-container-5-28-0 .contain h2 {color: black !important;}
     button {transition: background-color 0.3s;}
     button:hover {background-color: #e0e0e0;}
     """,