/* Deine Flieder-Anpassungen */ :root { --cassiopeia-color-primary: #C8A2C8; /* Dein Flieder */ --cassiopeia-color-hover: #967BB6; /* Dunkleres Flieder für Links */ --cassiopeia-color-link: #C8A2C8; } /* Hintergrund der gesamten Seite */ body { background-color: #F8F4F9; 

} 

/* Den Header (oberer Bereich) anpassen */ .header { background: linear-gradient(135deg, #C8A2C8 0%, #967BB6 100%); 
                                                     } 

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap'); h1, h2, h3, .site-title { font-family: 'Playfair Display', serif !important; 
                                                                                                               }

/* Styling für die Gedicht-Box */ .lyrik-box { background-color: #ffffff; /* Weißer Hintergrund für den Text */ border: 2px solid #C8A2C8; /* Fliederfarbener Rahmen */ padding: 30px; border-radius: 15px; /* Abgerundete Ecken */ text-align: center; font-style: italic; /* Kursiv wirkt oft poetischer */ box-shadow: 5px 5px 15px rgba(200, 162, 200, 0.2); /* Sanfter fliederfarbener Schatten */ margin-bottom: 20px; } .lyrik-box h3 { color: #967BB6; /* Dunkleres Flieder für die Modulüberschrift */ font-family: 'Playfair Display', serif; }

/* Styling für das Kontaktformular */ .contact-form .btn-primary { background-color: #C8A2C8; /* Dein Flieder */ border-color: #967BB6; color: #ffffff; padding: 10px 25px; border-radius: 5px; transition: all 0.3s ease; } .contact-form .btn-primary:hover { background-color: #967BB6; /* Dunkler bei Mauszeiger */ border-color: #C8A2C8; } /* Die Eingabefelder etwas weicher gestalten */ .contact-form input, .contact-form textarea { border: 1px solid #C8A2C8; background-color: #FDFBFF; } 

p { line-height: 1.8; /* Gibt dem Text mehr Raum zum Atmen */ } 

/* Den gesamten Footer-Bereich stylen */ footer { background-color: #F4EFF6; /* Ein sehr blasses Flieder */ color: #5A5A5A; /* Ein weiches Grau für den Text */ padding: 40px 0; text-align: center; border-top: 1px solid #C8A2C8; /* Eine feine fliederfarbene Trennlinie */ } /* Links im Footer (Impressum, Social Media) */ footer a { color: #967BB6; /* Dunkleres Flieder für Links */ text-decoration: none; margin: 0 10px; font-weight: bold; } footer a:hover { color: #C8A2C8; /* Helleres Flieder beim Drüberfahren */ } /* Copyright-Hinweis kleiner machen */ footer .mod-footer { font-size: 0.9em; margin-top: 20px; }

/* Hauptüberschriften (H1) im Beitrag */
h1, .page-header h1 {
    font-size: 1.8rem;         /* Standardgröße verkleinern */
    color: #705697;           /* Dunkles Flieder / Dusty Purple */
}

/* Artikelüberschriften in der Blog-Ansicht (H2) */
h2, .item-page .page-header h2 {
    font-size: 1.5rem;         /* Etwas kleiner als H1 */
    color: #705697;
}

/* Mobile Anpassung für Smartphones */
@media (max-width: 768px) {
    h1, .page-header h1 {
        font-size: 1.5rem;     /* Auf dem Handy noch kompakter */
    }
    h2 {
        font-size: 1.3rem;
    }
}
/* Erzwungene Anpassung für Cassiopeia */
div.page-header h1, 
article.item-page h1, 
h1, h2 {
    color: #705697 !important;
    font-size: 1.6rem !important;
}
body.site h1, 
body.site .page-header h1, 
body.site h2, 
body.site .item-page .page-header h2 {
    color: #705697 !important;
    font-size: 1.5rem !important;
    display: block !important;
}
/* Grundfarbe der Links im Footer */
footer a {
    color: #000000 !important; /* Ersetze dies durch deine Wunschfarbe */
    text-decoration: none;      /* Entfernt die Unterstreichung, falls gewünscht */
}

/* Farbe, wenn man mit der Maus über den Link fährt (Hover) */
footer a:hover, 
footer a:focus {
    color: #967BB6 !important; /* Farbe beim Drüberfahren */
    text-decoration: none;
}
/* Farbe der Social Icons im Footer */
footer .mod-custom a, 
footer .mod-menu a {
    color: #ffffff !important; /* Deine Wunschfarbe (z.B. Twitter-Blau) */
    font-size: 1.5rem;         /* Optional: Vergrößert die Icons etwas */
    transition: color 0.3s;    /* Macht den Farbübergang weicher */
}

/* Farbe beim Drüberfahren (Hover) */
footer .mod-custom a:hover, 
footer .mod-menu a:hover {
    color: #000000 !important; /* Deine Hover-Farbe */
}
/* Schriftgröße für alle Links im Footer anpassen */
footer a {
    font-size: 0.85rem !important; /* Kleiner als Standard (1rem) */
    font-weight: 400;              /* Optional: Schriftdicke auf normal setzen */
}

/* Falls du ein Menü im Footer nutzt, auch die Listenelemente verkleinern */
footer .mod-menu li {
    font-size: 0.85rem !important;
}

/* Optional: Den gesamten Footer-Text (auch ohne Links) verkleinern */
footer {
    font-size: 0.85rem;
}
/* 1. Den Innenabstand des gesamten Footers reduzieren */
footer.footer {
    padding-top: 1rem !important;    /* Standard ist oft 4rem oder mehr */
    padding-bottom: 1rem !important;
}

/* 2. Die Abstände der Module im Footer minimieren */
footer .mod-menu, 
footer .mod-custom {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* 3. Den Abstand des Copyright-Bereichs (falls vorhanden) verringern */
footer .footer-content {
    margin: 0 !important;
}
/* Linkfarbe im Hauptinhalt */
.com-content-article main a {
    color: #967BB6; /* Ersetze dies mit deinem Farbcode */
    text-decoration: none; /* Optional: Unterstreichung hinzufügen */
}

.joomla-cms-cookie-consent {
    background-color: ##967BB6 !important;
    color: #000000;
}
/* Ändert die Linkfarbe nur innerhalb von Beiträgen auf Flieder */
.com-content-article a {
    color: #C8A2C8; /* Flieder */
    text-decoration: none; /* Unterstrichen für bessere Erkennbarkeit */
}
/* Farbe beim Drüberfahren (Hover) */
.com-content-article a:hover {
    color: #A07AA0; /* Ein etwas dunkleres Flieder/Violett */
    text-decoration: none;
}