Clean up css

static/main.css

@@ -1,22 +1,24 @@
-html{
+/* GLOBAL CONFIGURATIONS */
+/* BASIS */
+html {
     font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
     font-size: 0.9em;
 }
 
-/* Header */
-header{
+
+/* HEADER, NAVIGATION BAR AND FOOTER FOR base.html */
+header {
     display: block;
     vertical-align: middle;
-    background: #4444
+    background: #4444;
 }
 
-/* Navigation bar */
-nav{
-    /* background-color: #CCCCFF; */
-    background-color: #2E296C  
+/* a number of configurations for the navigation bar and its links */
+nav {
+    background-color: #2E296C;
 }
 
-nav > ul{
+nav ul {
     list-style-type: none;
     margin: 0;
     padding: 0;
@@ -28,67 +30,34 @@ nav ul li {
     padding: 14px 16px;
 }
 
-li a{
+nav li a {
     text-decoration: none;
     color: white;
     font-weight: bold;
 }
 
-.active{
+/* active navigation bar field: color highlight */
+.active {
     background-color: #7470A8;
 }
 
-/*Buttons*/
-.button{
-    background-color: #0D2B4A;
-    border: none;
-    border-radius: 4px;
-    color: white;
-    padding: 15px 32px;
-    text-align: center;
-    display: inline-box;
+footer {
+	color: grey;
+	text-align: center;
+	font-size: small;
 }
 
-.button:hover {
-  box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
+
+/* HEADLINES */
+/* this might unorthodoxal, but all h2 headlines are lavender-colored to spice up the boredom of a wall of black text */
+h2 {
+	color: #7470A8;
 }
 
-.btn-group{
-    position: relative;
-    left: 25%;
-}
-
-.btn-group button {
-  background-color: #2E296C; /* Green background */
-  color: white; /* White text */
-  padding: 10px 24px; /* Some padding */
-  cursor: pointer; /* Pointer/hand icon */
-  width: 50%; /* Set a width if needed */
-  display: block; /* Make the buttons appear below each other */
-}
-
-.btn-group button:not(:last-child) {
-  border-bottom: none; /* Prevent double borders */
-}
-
-/* Add a background color on hover */
-.btn-group button:hover {
-  background-color: #7470A8;
-}
-
-input {
-	border: 2px solid grey; 
-}
-
-/* Remove underline effect if links are inside a div (cf. index.html) */
-div a {
-    text-decoration: none;
-    color: #2E296C;
-    font-weight: bold;
-}
 
+/* IMAGES */
 /* logo image class */
-.logo {
+img.logo {
 	width: 150px; 
 }
 
@@ -96,11 +65,45 @@ img {
     border: 0px;
 }
 
-/* house patron images */
-img.patron {
-	width: 6.5cm;
+
+/* BUTTONS */
+.btn-group {
+    position: relative;
+    left: 25%;
 }
 
+.btn-group button {
+  background-color: #2E296C; 
+  color: white;
+  padding: 10px 24px; 
+  cursor: pointer;
+  width: 50%;
+  display: block;
+}
+
+/* Add a background color on hover */
+.btn-group button:hover {
+  background-color: #7470A8;
+}
+
+
+/* INPUT FIELDS */
+input {
+	border: 2px solid grey; 
+}
+
+
+/* LINKS */
+ a {
+    text-decoration: none;
+    color: #2E296C;
+    font-weight: bold;
+}
+
+
+/* CONFIGURATIONS TAILORED TO SPECIFIC PAGES */
+/* houses.html HOUSES OVERVIEW */
+/* each house has its own font-colour for headlines etc. */
 .hopper {
 	color: #041635;
 }
@@ -121,30 +124,21 @@ img.patron {
 	color: #802F32;
 }
 
-/* headline for header */
-header h1 {
-	display: inline;
-        vertical-align: center;
+/* house patron images */
+img.patron {
+	width: 6.5cm;
 }
 
-/* headline color for index.html */
-h2 {
-	color: #7470A8;
-}
 
-/* view answers page: highlight chosen options */
+/* view_answers ANSWER OVERVIEW */
+/* highlight the chosen answer */
 .choice {
 	font-weight: 900;
 }
 
-/* table for admin view */
+
+/* admin_form and admin_solution ADMIN TABLES */
 table, th, td {
 	border: 1px solid black;
 	border-collapse: collapse;
 }
-
-footer {
-	color: grey;
-	text-align: center;
-	font-size: small;
-}