Erster Wurf des Mockups

buildtime/static/css/scpq_header.css

@@ -4,6 +4,12 @@
 header {
     display: flex;
     justify-content: flex-start;
+    flex-direction: row;
+    @media (max-width: 768px) {
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+    }
     align-items: center;
 
     height: var(--header-height);
@@ -21,28 +27,22 @@ header img {
     padding-right: 16px; /* Space between the image and the header text */
 }
 
+header h1 {
+    font-weight: 600;
+    font-size: 2em; /* Adjust the font size as needed */
+    margin-left: 5px;
+    padding: 16px;
+    @media (max-width: 768px) {
+        font-size: 1em; /* Adjust the font size for smaller screens */
+        padding: 0px; /* Adjust the padding for smaller screens */
+    }
+}
+
 header p {
     font-weight: 100;
     margin-left: 16px;
     padding-right: 16px;
 }
 
-nav {
-    margin: 16px;
-    padding: 10px;  
-}
 
-nav ul {
-    list-style-type: none; /* Entfernt die Standard-Aufzählungszeichen */
-    display: flex; /* Macht die Liste horizontal */
-    gap: 20px; /* Abstand zwischen den Listenelementen */
-}
 
-nav ul li a {
-    text-decoration: none; /* Entfernt die Unterstreichung */
-    color: var(--secondary-font-color); /* Setzt die Schriftfarbe */
-}
-nav ul li a:hover {
-    text-decoration: underline; /* Unterstreichung beim Überfahren mit der Maus */
-    font-weight: bold; /* Macht den Text fett */
-}