Update app.py

app.py

@@ -222,13 +222,13 @@ header p {
 }
 
 .pre-tabs h2 {
-    font-size: 2.5em;
+    font-size: 2.9em;
     color: #333333;
     margin-bottom: 15px;
 }
 
 .pre-tabs p {
-    font-size: 1.2em;
+    font-size: 1.6em;
     color: #555555;
     line-height: 1.8;
 }
@@ -303,29 +303,35 @@ footer p {
     line-height: 1.6;
     margin-bottom: 20px;
 }
-
-footer .social-links {
+/* Link Styling */
+.social-links {
     display: flex;
     justify-content: center;
-    gap: 15px;
-    margin-top: 20px;
+    gap: 15px; /* Space between links */
 }
 
-footer .social-links a {
+.social-link {
+    display: inline-block;
     text-decoration: none;
-    font-size: 1.1em;
+    color: #ffffff;
+    background-color: #6a1b9a; /* Purple button background */
     padding: 10px 20px;
-    border-radius: 8px;
+    border-radius: 30px;
+    font-size: 16px;
     font-weight: bold;
-    background: #ffffff;
-    color: #6a1b9a;
-    transition: transform 0.3s, background 0.3s;
+    transition: all 0.3s ease;
+    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
 }
 
-footer .social-links a:hover {
-    background: #64b5f6;
-    color: #ffffff;
-    transform: scale(1.1);
+.social-link:hover {
+    background-color: #8c52d3; /* Darker shade on hover */
+    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
+    transform: translateY(-2px);
+}
+
+.social-link:active {
+    transform: translateY(1px);
+    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
 }
 """
 
@@ -486,7 +492,7 @@ demo.launch()
 # }
 
 # header p {
-#     font-size: 1.2em;
+#     font-size: 1.7em;
 #     line-height: 1.8;
 # }
 
@@ -724,7 +730,7 @@ demo.launch()
 #     # Post-Tabs Section
 #     gr.Markdown("""
 #     <section class="post-tabs">
-#         <h2>Ready to Compete?</h2>
+#         <h3>Ready to Compete?</h3>
 #         <p>
 #             Submit your predictions today and make your mark in advancing mobile AI technologies. 
 #             Show the world what your model can achieve!
@@ -736,7 +742,7 @@ demo.launch()
 #     # Footer Section
 #     gr.Markdown("""
 #     <footer>
-#         <h2>Stay Connected</h2>
+#         <h3>Stay Connected</h3>
 #         <p>
 #             Follow us on social media or contact us for any queries. Let's shape the future of AI together!
 #         </p>