body { background-color: white; margin: 0; padding: 0; font-family: 'aleoregular', Verdana, sans-serif}
a { color: #f80000; text-decoration: none; outline-style: none }
a:hover, a:focus, a:active { color: #febcbd}
.flexslider { display: none }
#homeheader  { background-color: white; padding-left: 20px }

h1 { font-size: 2.2em; line-height: 1.2em; font-weight: bold; margin: 20px 0 10px; padding: 0;  }
h1 a { color: black }
h2 { color: black; font-size: 2em; line-height: 1.2em; font-weight: bold; margin: 20px 0 6px 0; padding: 0; font-family: 'aleoregular', Verdana, sans-serif ; }

.slider { position: relative; margin: 0 0 10px!important }

.container { padding-left: 0; padding-right: 0 }
.card-grid-container {/* Setzt das Grid-Verhalten für den Hauptcontainer */display: grid; gap: 15px; /* Abstand zwischen den Cards */padding: 5px; /* Maximale Breite des gesamten Grids */margin: 0 auto; grid-template-columns: 1fr; font-family: 'aleoregular', Verdana, sans-serif ;}
.card-grid-container {/* Nur 1 Spalte, die volle Breite einnimmt */grid-template-columns: 1fr; gap: 15px; padding: 10px; }
.card-item { /* Stellt sicher, dass jede Card flexibel ist */background-color: #ffffff; border: 1px solid #ddd; /* Hinzugefügte Rahmenstruktur */border-radius: 8px; /* Leicht abgerundete Ecken */overflow: hidden; /* Stellt sicher, dass Bilder den Rahmen nicht sprengen */box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Leichter Schatten für Tiefe */transition: transform 0.3s ease, box-shadow 0.3s ease; /* Animation beim Hover */display: flex; flex-direction: column; }

/* Bild-Element innerhalb der Card */
.card-item img { width: 100%; height: 250px; /* Feste Höhe für alle Bilder im Grid */object-fit: cover; /* Stellt sicher, dass das Bild den Bereich füllt, ohne verzerrt zu werden */ display: block; }
.card-item-content { padding: 20px; flex-grow: 1; /* Stellt sicher, dass der Textbereich alle verbleibenden Höhe einnimmt */display: flex; flex-direction: column; }

.tag { font-size: 1.5em; line-height: 1.4; letter-spacing: 0.1em; padding: 8px 15px; font-weight: bold; text-transform: uppercase; color: white; background-color: #febcbd; border-radius: 10px; margin-bottom: 100px; }

.card-title { /* Überschrift dynamische Cards */font-size: 2.2em; line-height: 1.3em; font-weight: bold; color: #f80000; margin-top: -20px; margin-bottom: 0; }
.card-title-fix { /* Überschrift feste Cards */ font-size: 2.2em; line-height: 1.4em; font-weight: bold; color: #f80000; margin-top: -10px; margin-bottom: -5px }
.card-item p { /* Fließtext innerhalb der Card */font-size: 1.3em; line-height: 1.4; color: #6e6e6e; margin-bottom: 0; margin-top: 10px;}
.card-datum { font-size: 2.2em; line-height: 2.5em; font-weight: bold; color: black; margin-bottom: px; margin-top: ; }

#intro  { margin-left: 20px }

#intro p { color: #6e6e6e; font-size: 1.5em; line-height: 1.5em; margin-bottom: 35px; padding-right: 20px;  }
#intro p.tagline { font-size: 1.8em; color: black; font-weight: bold;  }

#homenav {   }
#homenav ul { margin-left: -30px; margin-bottom: 20px }
#homenav li { color: #fff; font-size: 2.2em; line-height: 1.6em; letter-spacing: 0.1em; list-style: none; display: block; }
#homenav li a { color:#ff1648; text-decoration: none; }
#homenav li a:hover,li a.active { color:#febcbd; text-decoration:none }

@media screen and (min-width:40em) 
{
#homeheader { display: none }
.flexslider { display: inline }
.card-grid-container { /* Stellt sicher, dass hier mindestens 2 bis 3 Spalten passen */grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));}
.card-datum { font-size: 1.7em; line-height: 2.7em;  }
.card-title { font-size: 2em }
h2 { font-size: 3em; margin-top: 40px }

}
@media screen and (min-width:55em) 
{


}
@media screen and (min-width:63em) 
{
.card-datum { font-size: 2em; line-height: em;  }	
#homefooter .footercontainer { padding-left: 100px; }
}
@media screen and (min-width:72em) 
{
.card-grid-container {/* Zentriert das Grid *//* Standardmäßig 3 Spalten auf mittleren Bildschirmen */grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; padding: 20px; max-width: 1200px;}
#intro p { max-width: 1000px }
#homenav ul { margin-left: -40px; margin-bottom: 20px }
#homenav li { font-size: 2.2em; line-height: 1.6em; margin-right: 40px; display: inline; }
}
@media screen and (min-width:80em) 
{
#intro {width: 1200px; margin-right: auto; margin-left: auto; padding-left: 30px}
}