Alot of CSS Changes don't ask stupid Nogger

static/style.css

@@ -1,20 +1,47 @@
-.background_image {
-    background-image: url("/img/trlbg1.jpg");
-}
-
 body {
+    background-image: url("/static/img/trlbg1.jpg");
+    background-repeat: no-repeat;
+    background-attachment: fixed;
+    background-size: cover;
+    position: relative; /* This allows the z-index on children elements to work */
+    z-index: -1; /* Send the background behind the content */
     font-family: Arial, sans-serif;
     margin: 20px;
 }
 
+header nav {
+    margin-bottom: 20px;
+}
+
+header nav a {
+    color: #4CAF50;
+    text-decoration: none;
+    font-weight: bold;
+    padding: 10px 20px;
+}
+
+header nav a:hover {
+    color: #45a049;
+}
+
 h1 {
     color: #333;
+    margin-bottom: 20px;
+}
+
+.background-roster {
+    background-color: rgba(255, 255, 255, 0.8); /* Semi-transparent background for better readability */
+    padding: 20px;
+    border-radius: 10px;
+    z-index: 1;
 }
 
 table {
     width: 100%;
     border-collapse: collapse;
     margin-bottom: 20px;
+    overflow: hidden;
+    background-color: rgba(255, 255, 255, 0.8);
 }
 
 table, th, td {
@@ -22,12 +49,13 @@ table, th, td {
 }
 
 th, td {
-    padding: 8px;
+    padding: 10px;
     text-align: left;
 }
 
 th {
-    background-color: #f2f2f2;
+    color: #333;
+    background-color: rgba(255, 255, 255, 0.9);
 }
 
 button {
@@ -58,4 +86,15 @@ input {
     margin-top: 8px;
     margin-right: 16px;
     font-size: 17px;
+}
+
+
+main{
+    position: relative;
+    z-index: 1;
+    background-color: rgba(255, 255, 255, 0.9);
+    margin-top: 10%;
+    padding: 20px 35px 35px 35px;
+    border-radius: 10px;
+    border: 2px solid black;
 }