diff --git a/src/style.css b/src/style.css
index 92bfd20..4491390 100644
--- a/src/style.css
+++ b/src/style.css
@@ -1,4 +1,4 @@
-/* Global styles */
+/* --- Global styles --- */
 h1,
 h2,
 h3,
@@ -15,61 +15,6 @@ body {
     font-family: 'Roboto', sans-serif;
 }
 
-.login-container {
-    background-image: url('./assets/images.jpg');
-    /* Replace with your logo path */
-    background-repeat: no-repeat;
-    background-position: center top;
-    /* Center the logo at the top */
-    background-size: 80x 80px;
-    /* Adjust the size of the logo */
-    padding-top: 60px;
-    /* Add padding to create space for the logo */
-    text-align: center;
-    /* Center text and form elements */
-}
-
-.logo {
-    width: 80px;
-    /* Set the width of the logo */
-    height: 80px;
-    /* Set the height of the logo */
-    border-radius: 50%;
-    /* Make the logo circular */
-    background-image: url('./assets/images.jpg');
-    /* Replace with your logo path */
-    background-size: cover;
-    /* Cover the entire area */
-    margin: 0 auto 20px;
-    /* Center the logo and add space below */
-}
-
-.mb-3 {
-    margin-bottom: 15px;
-    /* Space between form groups */
-}
-
-.scrolling-background {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100vh;
-    background-image: url('./assets/after-sunset-minimal-4k-zm-3840x2400.jpg');
-    background-repeat: repeat-x;
-    background-size: auto 100%;
-    animation: scroll-bg 30s linear infinite;
-    z-index: -2;
-}
-
-.logo {
-    display: block;
-    margin: 0 auto 20px;
-    /* Center the logo and add space below */
-    max-width: 100px;
-    /* Adjust the size as needed */
-}
-
 @keyframes scroll-bg {
     from {
         background-position: 0 0;
@@ -90,6 +35,21 @@ body {
     z-index: -1;
 }
 
+.scrolling-background {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100vh;
+    background-image: url('./assets/after-sunset-minimal-4k-zm-3840x2400.jpg');
+    background-repeat: repeat-x;
+    background-size: auto 100%;
+    animation: scroll-bg 30s linear infinite;
+    z-index: -2;
+}
+
+/* --- Widget Styling --- */
+
 .widget {
     border: 1px solid rgb(0, 0, 0, 0.20);
     background-color: rgb(31, 35, 39, 0.9);
@@ -110,7 +70,7 @@ body {
     text-align: center;
 }
 
-/* Layout Specific Styles */
+/* --- Layout Specific Styles --- */
 .centered-layout {
     display: flex;
     justify-content: center;
@@ -139,7 +99,7 @@ body {
 }
 
 
-/* Modal Styles */
+/* --- Modal Styles --- */
 .modal-overlay {
     position: fixed;
     top: 0;
@@ -166,7 +126,7 @@ body {
     /* Maximum width */
 }
 
-/* Responsive adjustments (example) */
+/* --- Responsive adjustments (example) --- */
 @media (max-width: 768px) {
     .three-column-layout {
         grid-template-columns: 1fr;
@@ -182,4 +142,40 @@ body {
         grid-template-columns: 1fr;
         /* Stack even if collapsed */
     }
+}
+
+/* --- Custom styles --- */
+
+.login-container {
+    background-image: url('./assets/images.jpg');
+    /* Replace with your logo path */
+    background-repeat: no-repeat;
+    background-position: center top;
+    /* Center the logo at the top */
+    background-size: 80x 80px;
+    /* Adjust the size of the logo */
+    padding-top: 60px;
+    /* Add padding to create space for the logo */
+    text-align: center;
+    /* Center text and form elements */
+}
+
+.logo {
+    display: block;
+    margin: 0 auto 20px;
+    /* Center the logo and add space below */
+    max-width: 100px;
+    /* Adjust the size as needed */
+    width: 80px;
+    /* Set the width of the logo */
+    height: 80px;
+    /* Set the height of the logo */
+    border-radius: 50%;
+    /* Make the logo circular */
+    background-image: url('./assets/images.jpg');
+    /* Replace with your logo path */
+    background-size: cover;
+    /* Cover the entire area */
+    margin: 0 auto 20px;
+    /* Center the logo and add space below */
 }
\ No newline at end of file