Update style.css

style.css

@@ -36,25 +36,12 @@ body {
 .container {
   max-width: 800px;
   margin: 50px auto;
-  text-align: center;
-  position: relative;
+  background-color: rgba(0, 0, 0, 0.9); /* Darker transparency for background visibility */
   padding: 20px;
   border-radius: 10px;
+  text-align: center;
   color: #fff;
   box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
-  z-index: 1;
-}
-
-.container::before {
-  content: '';
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(0, 0, 0, 0.6); /* This will control the opacity */
-  border-radius: 10px; /* Apply same border radius */
-  z-index: -1; /* Make sure the background layer is behind the content */
 }
 
 h1 {
@@ -69,8 +56,8 @@ h1 {
   text-align: center;
   line-height: 50px;
   font-size: 24px;
-  font-weight: 400; /* Set to medium weight */
-  color: #000000;
+  font-weight: 500; /* Changed to medium font weight */
+  color: #000;
   margin: 20px 0;
   border-radius: 5px;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
@@ -97,7 +84,6 @@ h1 {
   line-height: 40px;
   cursor: pointer;
   border-radius: 5px;
-  transition: background-color 0.3s;
 }
 
 .seat.selected {
@@ -143,7 +129,6 @@ h1 {
   background-color: #e74c3c;
 }
 
-/* Summary section */
 .summary {
   margin-top: 20px;
   font-size: 18px;
@@ -159,7 +144,6 @@ h1 {
   cursor: pointer;
   margin: 0 auto;
   display: block;
-  transition: background-color 0.3s;
 }
 
 .btn:hover {