changing font and color of header title

S2I/commons/css.py

@@ -70,7 +70,7 @@ css = """
     width: 100%;
     max-width: 400px;
     font-size: 1.2em;
-    color: #fff;
+    color: #333;
     text-shadow: 1px 1px 2px #000;
 }
 
@@ -172,6 +172,11 @@ css = """
     }
 }
 
+#title-container {
+  text-align: center;
+  padding: 2rem 0;
+}
+
 #title {
   font-size: var(--title-font-size);
   color: #333;

app.py

@@ -181,11 +181,12 @@ with gr.Blocks(css=css, theme="NoCrypt/miku@1.2.1") as demo:
                     </div>
                 </body>
                 </html>
-                """
+                """,
+                elem_id='title'
             )
     with gr.Row(elem_id="main_row"):
         with gr.Column(elem_id="column_input"):
-            gr.Markdown("## SKETCH", elem_id="title")
+            gr.Markdown("## SKETCH", elem_id="input_header")
             image = gr.Sketchpad(
                 type="pil",
                 height=512,
@@ -207,7 +208,7 @@ with gr.Blocks(css=css, theme="NoCrypt/miku@1.2.1") as demo:
             )
 
         with gr.Column(elem_id="column_output"):
-            gr.Markdown("## IMAGE GENERATE", elem_id="title")
+            gr.Markdown("## IMAGE GENERATE", elem_id="output_header")
             result = gr.Image(
                 label="Result",
                 height=440,