Update style.css

style.css

@@ -1,34 +1,60 @@
-/* Reset some default styles */
-body, h1 {
+body {
+    font-family: 'Bellota', cursive;
+    font-size: 18px;
     margin: 0;
     padding: 0;
+    background-color: #f2f2f2;
 }
 
-/* Apply a background color and center the content */
-body {
-    background-color: #f0f0f0;
+header {
+    background-color: #333;
+    color: #fff;
+    padding: 20px;
+    text-align: center;
+}
+
+.header-content {
     display: flex;
-    justify-content: center;
     align-items: center;
-    height: 100vh;
 }
 
-/* Style the container */
-.container {
+.logo {
+    width: 80px;
+    height: 80px;
+    margin-right: 20px;
+}
+
+header h1 {
+    font-size: 24px;
+}
+
+main {
+    padding: 20px;
+    text-align: center;
+}
+
+section {
     background-color: #fff;
     padding: 20px;
     border-radius: 10px;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
-    text-align: center;
+    margin-bottom: 20px;
 }
 
-/* Style the heading */
-h1 {
+h2 {
+    font-size: 24px;
     color: #333;
-    font-family: Arial, sans-serif;
+    margin-bottom: 10px;
 }
 
-/* Style the embedded space container */
 .gradio-app {
     margin-top: 20px;
 }
+
+footer {
+    background-color: #333;
+    color: #fff;
+    text-align: center;
+    padding: 10px 0;
+    font-size: 14px;
+}