|
|
| (8 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) |
| Zeile 1: |
Zeile 1: |
| /* Allgemeiner Hintergrund */
| |
| body {
| |
| background-color: #1a1a1a; /* Dunkler Hintergrund */
| |
| background-image: url("DEIN-BILD-URL"); /* Optional: Hintergrundbild */
| |
| background-repeat: no-repeat;
| |
| background-size: cover;
| |
| color: #eaeaea; /* Helle Standardtextfarbe */
| |
| font-family: Arial, sans-serif; /* Klare Schriftart */
| |
| }
| |
|
| |
|
| /* Hauptinhaltsbereich */
| |
| #content {
| |
| margin: 50px auto; /* Zentriert den Inhaltsbereich */
| |
| max-width: 1100px; /* Maximale Breite */
| |
| padding: 20px; /* Innenabstand */
| |
| background-color: #ffffff; /* Weißer Hintergrund für den Hauptinhalt */
| |
| border: 1px solid #ccc; /* Dünner Rahmen */
| |
| box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3); /* Schatten für Tiefe */
| |
| color: #333; /* Dunklere Textfarbe für bessere Lesbarkeit */
| |
| }
| |
|
| |
| /* Navigationsleiste (linke Spalte) */
| |
| #column-one {
| |
| background-color: #2d2d2d; /* Dunkelgrauer Hintergrund */
| |
| color: #eaeaea; /* Helle Schriftfarbe */
| |
| padding: 10px; /* Innenabstand */
| |
| border-right: 1px solid #444; /* Trennlinie rechts */
| |
| }
| |
|
| |
| #column-one h5 {
| |
| color: #ffffff; /* Helle Überschriftenfarbe */
| |
| font-size: 1.1em; /* Etwas größere Schriftgröße */
| |
| margin-bottom: 10px; /* Abstand unter Überschrift */
| |
| text-transform: uppercase; /* Überschrift in Großbuchstaben */
| |
| }
| |
|
| |
| /* Links in der Navigationsleiste */
| |
| #column-one a {
| |
| color: #79c0ff; /* Hellblau für Links */
| |
| text-decoration: none;
| |
| }
| |
|
| |
| #column-one a:hover {
| |
| color: #47a3ff; /* Dunkleres Blau beim Hover */
| |
| text-decoration: underline;
| |
| }
| |
|
| |
| /* Titel in der Navigationsleiste */
| |
| #p-navigation {
| |
| margin-bottom: 20px; /* Abstand zur unteren Navigation */
| |
| }
| |
|
| |
| /* Kopfbereich (Header) */
| |
| #p-logo {
| |
| margin: 20px auto; /* Zentriert das Logo */
| |
| }
| |
|
| |
| #p-logo a {
| |
| display: block;
| |
| width: 200px; /* Größe des Logos */
| |
| height: 50px;
| |
| background: url("DEIN-LOGO-URL") no-repeat center center;
| |
| background-size: contain; /* Logo skaliert passend */
| |
| }
| |
|
| |
| /* Links im Hauptinhalt */
| |
| a {
| |
| color: #0077cc; /* Standard-Linkfarbe */
| |
| text-decoration: none; /* Keine Unterstreichung */
| |
| }
| |
|
| |
| a:hover {
| |
| color: #005fa3; /* Dunklere Farbe beim Hover */
| |
| text-decoration: underline;
| |
| }
| |
|
| |
| /* Footer */
| |
| #footer {
| |
| margin-top: 50px; /* Abstand oberhalb des Footers */
| |
| padding: 10px;
| |
| background-color: #2d2d2d; /* Dunkelgrauer Hintergrund */
| |
| color: #eaeaea; /* Helle Textfarbe */
| |
| text-align: center; /* Zentrierter Text */
| |
| border-top: 1px solid #444; /* Trennlinie oben */
| |
| }
| |
|
| |
| /* Tabellen (Optional) */
| |
| table {
| |
| border-collapse: collapse;
| |
| width: 100%;
| |
| background-color: #f9f9f9;
| |
| }
| |
|
| |
| table th,
| |
| table td {
| |
| border: 1px solid #ddd;
| |
| padding: 8px;
| |
| }
| |
|
| |
| table th {
| |
| background-color: #0077cc;
| |
| color: white;
| |
| text-align: left;
| |
| }
| |
