Merge pull request #120 from OpzekerIT/dev

Dev

includes/styles.css

@@ -10,8 +10,13 @@ body, h1, h2, p, ul, li, a {
 
 body {
     font-family: 'Roboto', sans-serif;
-    background: linear-gradient(to right, #0f2027, #203a43, #2c5364);
+    /*background: linear-gradient(to right, #0f2027, #203a43, #2c5364);*/
     color: white;
+    background: url(../images/bck.jpg) no-repeat center center fixed; 
+    -webkit-background-size: cover;
+    -moz-background-size: cover;
+    -o-background-size: cover;
+    background-size: cover;
 }
 
 
@@ -55,8 +60,9 @@ header .banner {
     max-width: 100%; /* Ensures the image is never larger than its container */
     max-height: 200px; /* Maximum height for the image */
     display: block; /* Prevents inline default spacing */
-    margin: 0 auto; /* Centers the image within the header */
+    margin: 40px auto 0px auto; /* Centers the image within the header */
     width: auto; /* Adjusts the width to maintain the aspect ratio */
+    border-radius: 10px;
 }
 
   
@@ -65,7 +71,7 @@ header, main, footer {
     min-width: 800px;
     margin: 5px auto;
     padding: 10px;
-    border: 1px solid rgb(255, 255, 255);
+    /*border: 1px solid rgb(255, 255, 255);*/
     border-radius: 10px;
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
 }
@@ -81,13 +87,14 @@ header h1 {
 }
 
 section h2 {
-    border-bottom: 1px solid white;
     margin-bottom: 10px;
     padding-bottom: 5px;
     font-family: 'Bungee Spice';
     text-align: center; /* Centers the text horizontally */
     margin-left: auto;
     margin-right: auto;
+    margin-top: 40px;
+    margin-bottom: 30px;    
 }
 
 
@@ -146,7 +153,7 @@ table {
 }
 
 table, th, td {
-    border: 1px solid white;
+    border: 1px solid #e6910924;
     border-radius: 1px;
 }
 
@@ -156,7 +163,8 @@ th, td {
 }
 
 th {
-    background-color: #555;
+    background-color: #1e0c0094;
+    color: #ff6000;
 }
 
 tr:hover {
@@ -180,14 +188,6 @@ tr:hover {
 }
 
 
-
-/* Hacker theme styles */
-body {
-    font-family: 'Noto Sans', monospace;
-    background: #0f0f0f; /* Dark background for hacker aesthetic */
-    color: #e69109; /* Bright green text, reminiscent of old terminals */
-}
-
 /* Ensure elements scale well on mobile */
 @media (max-width: 768px) {
     body {
@@ -217,6 +217,7 @@ a {
     padding: 10px 20px;
     text-transform: uppercase;
     transition: background-color 0.3s ease, color 0.3s ease;
+    border-radius: 10px;
 }
 
 .btn:hover {

includes/topnav.css

@@ -7,7 +7,6 @@
     min-width: 800px;
     margin: 5px auto 5px auto;
     padding: 10px;
-    border: 1px solid rgb(255, 255, 255);
     border-radius: 10px;
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
   }
@@ -19,11 +18,11 @@
   
   /* Style navigation menu links */
   .topnav a {
-    color: white;
     padding: 14px 16px;
     text-decoration: none;
     font-size: 17px;
     display: block;
+    border-radius: 10px;
   }
   
   /* Style the hamburger menu */
@@ -34,6 +33,9 @@
     position: absolute;
     right: 0;
     top: 0;
+    margin-top: 10px;
+    margin-right: 10px;
+    border-radius: 10px;
   }
   
   /* Add a grey background color on mouse-over */