Try adjusting banner

app.py

@@ -76,14 +76,10 @@ def yt_transcribe(yt_url):
 
 
 with gr.Blocks() as demo:
-    gr.HTML(
-        """
-        <div style="text-align: center;">
-            <img src="thonburian-whisper-logo.png" alt="Thonburian Whisper Logo" style="width:300px; margin-bottom:20px;">
-            <h1>Thonburian Whisper Demo 🇹🇭</h1>
-        </div>
-        """
-    )
+    with gr.Row(elem_id="banner"):
+        gr.Image(value="thonburian-whisper-logo.png", show_label=False, container=False, width=400)
+
+    gr.Markdown("# Thonburian Whisper Demo 🇹🇭", elem_id="title")
     
     with gr.Tab("Transcribe Audio"):
         gr.Markdown(
@@ -116,5 +112,10 @@ with gr.Blocks() as demo:
         yt_transcribe_btn.click(fn=yt_transcribe, inputs=yt_url_input, outputs=[yt_html_output, yt_text_output])
 
 
+css = """
+#banner {display: flex; justify-content: center; align-items: center; margin-bottom: 20px;}
+#title {text-align: center; margin-bottom: 30px;}
+"""
+
 if __name__ == "__main__":
-    demo.queue().launch()
+    demo.queue().launch(css=css)