Update app.py

app.py

@@ -99,18 +99,42 @@ def main():
                 """
         st.markdown(hide_streamlit_style, unsafe_allow_html=True)
     
-         # Use columns to layout the title and image
-        col1, col2 = st.columns([0.8, 0.2])  # Adjust the ratio according to your needs
+         # Create a two-column layout with a custom ratio
+        col1, col2 = st.columns([0.8, 0.2])
 
         with col1:
+            # Use custom CSS to align the text vertically
             st.markdown("""
-                <h1 style="float: left; margin:0; padding:0; display: inline;">
-                    Welcome to BinDocs ChatBot!
-                </h1>
+                <style>
+                .title {
+                    display: flex;
+                    align-items: center;  /* This will vertically center the title in the column */
+                    height: 100%;
+                }
+                </style>
+                <div class="title">
+                    <h1>Welcome to BinDocs ChatBot!</h1>
+                </div>
                 """, unsafe_allow_html=True)
 
         with col2:
-            st.image('BinDoc Logo (Quadratisch).png', width=150, use_column_width=False)  # Adjust the width as needed
+            # Align the image to the center of the column
+            st.markdown("""
+                <style>
+                .logo {
+                    display: flex;
+                    align-items: center;  /* This will vertically center the logo in the column */
+                    height: 100%;
+                }
+                img {
+                    vertical-align: middle;  /* Align the image vertically */
+                }
+                </style>
+                <div class="logo">
+                    <img src="BinDoc Logo (Quadratisch).png" alt="BinDocs Logo" width="100%">  /* Adjust the path and size as needed */
+                </div>
+                """, unsafe_allow_html=True)
+