Update app.py

app.py

@@ -132,35 +132,19 @@ body {
     font-family: Arial, sans-serif;
     background-color: #f0f2f5;
 }
-
-h1, h2, p {
+h1, h2, p, .container .examples {
     color: #333;  /* Darker color for better visibility */
 }
-
-/* Examples section styling */
-.gr-examples-title {
-    color: #333 !important;  /* Make sure the Examples title is visible */
+.container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 20px;
 }
-
-.gr-examples-btn {
-    color: #333 !important;  /* Set the color for each example button to dark */
-}
-
-.gr-examples {
-    color: #333 !important;  /* Apply color to the whole examples section */
-}
-
-.gr-suggestions li {
-    color: #333 !important;  /* Ensure suggestions are visible */
-}
-
-/* Customize the appearance of the course results */
 .results-container {
     display: flex;
     flex-wrap: wrap;
     justify-content: space-between;
 }
-
 .course-card {
     background-color: white;
     border-radius: 8px;
@@ -170,33 +154,27 @@ h1, h2, p {
     width: 48%;
     transition: transform 0.2s;
 }
-
 .course-card:hover {
     transform: translateY(-5px);
 }
-
 .course-image {
     width: 100%;
     height: 150px;
     object-fit: cover;
 }
-
 .course-info {
     padding: 15px;
 }
-
 .course-info h3 {
     margin-top: 0;
     font-size: 18px;
     color: #333;
 }
-
 .course-info p {
     color: #666;
     font-size: 14px;
     margin-bottom: 10px;
 }
-
 .course-link {
     display: inline-block;
     background-color: #007bff;
@@ -207,11 +185,9 @@ h1, h2, p {
     font-size: 14px;
     transition: background-color 0.2s;
 }
-
 .course-link:hover {
     background-color: #0056b3;
 }
-
 .no-results {
     text-align: center;
     color: #666;