Update styles.css

styles.css

@@ -1,27 +1,34 @@
 /* styles.css */
 
-footer { display: none !important; }
-.output-markdown { display: none !important; }
-footer { visibility: hidden; }
+/* Improved Naming Convention */
+.hidden {
+    display: none !important;
+}
+
+.hidden-visibility {
+    visibility: hidden;
+}
 
-.hover\:bg-orange-50:hover {
+/* Improved Hover Effect Naming */
+.hover-bg-orange-50:hover {
     --tw-bg-opacity: 1 !important;
-    background-color: rgb(229,225,255) !important;
+    background-color: rgb(229, 225, 255) !important;
 }
 
-img.gr-sample-image:hover, video.gr-sample-video:hover {
+.gr-sample-hover:hover {
     --tw-border-opacity: 1;
     border-color: rgb(37, 56, 133) !important;
 }
 
-.gr-button-lg {
+/* Improved Button Styling */
+.button-lg {
     z-index: 14;
     width: 113px;
     height: 30px;
-    left: 0px;
-    top: 0px;
-    padding: 0px;
-    cursor: pointer !important; 
+    left: 0;
+    top: 0;
+    padding: 0;
+    cursor: pointer !important;
     background: none rgb(17, 20, 45) !important;
     border: none !important;
     text-align: center !important;
@@ -34,14 +41,14 @@ img.gr-sample-image:hover, video.gr-sample-video:hover {
     box-shadow: none !important;
 }
 
-.gr-button-lg:hover {
+.button-lg:hover {
     z-index: 14;
     width: 113px;
     height: 30px;
-    left: 0px;
-    top: 0px;
-    padding: 0px;
-    cursor: pointer !important; 
+    left: 0;
+    top: 0;
+    padding: 0;
+    cursor: pointer !important;
     background: none rgb(66, 133, 244) !important;
     border: none !important;
     text-align: center !important;