body{
font-family: Arial, sans-serif;
margin:0;
background:#fff;
color:#000;
}

/* HEADER */

header{
background:#7b1e2b;
color:white;
padding:1.5rem 2rem;
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
}

header h1{
margin:0;
font-size:1.6rem;
}

header h1 a{
color:white;
text-decoration:none;
}

/* NAVIGATION */

nav ul{
list-style:none;
margin:0;
padding:0;
display:flex;
gap:1.5rem;
}

nav li{
position:relative;
}

nav a{
color:white;
text-decoration:none;
}

nav a:hover{
text-decoration:underline;
}

nav ul ul{
display:none;
position:absolute;
background:white;
color:black;
border:1px solid #ccc;
list-style:none;
padding:0.5rem 0;
margin:0;
min-width:200px;
z-index:10;
}

nav ul li:hover > ul{
display:block;
}

nav ul ul li{
padding:0.3rem 1rem;
white-space:nowrap;
}

nav ul ul a{
color:black;
}

/* HERO 

.hero{
text-align:center;
padding:4rem 1rem;
background:#f7f7f7;
border-bottom:1px solid #ccc;
}

.hero h2{
font-size:2.2rem;
margin-bottom:0.5rem;
}

*/


/* CONTENT */

.content{
max-width:1000px;
margin:3rem auto;
padding:0 1rem;
line-height:1.7;
}

.content h3{
margin-top:0;
font-size:1.5rem;
}

/* BUTTONS */

.button{
display:inline-block;
margin-top:20px;
padding:12px 22px;
background:#7b1e2b;
color:white;
text-decoration:none;
border:none;
border-radius:4px;
font-weight:bold;
cursor:pointer;
}

.button:hover{
background:#5e1821;
text-decoration:none;
}

/* INFO-BOXEN */

.info-box{
background:#f5f5f5;
padding:20px;
border-left:5px solid #7b1e2b;
margin-top:25px;
border-radius:4px;
}

.hinweis{
margin-top:30px;
padding:16px 20px;
background:#fff4f4;
border:1px solid #e0bcbc;
border-left:5px solid #7b1e2b;
border-radius:4px;
}

/* FORMULARE */

.kontakt-form{
max-width:700px;
margin-top:25px;
}

.form-group{
margin-bottom:18px;
}

.form-group label{
display:block;
margin-bottom:6px;
font-weight:bold;
}

.form-group input,
.form-group select,
.form-group textarea{
width:100%;
padding:10px;
border:1px solid #ccc;
border-radius:4px;
font-size:14px;
box-sizing:border-box;
}

.form-group textarea{
min-height:120px;
resize:vertical;
}

/* DOKUMENTENLISTE */

.dokumente-liste{
margin-top:20px;
}

.dokumente-liste ul{
list-style:none;
padding-left:0;
}

.dokumente-liste li{
padding:8px 0;
border-bottom:1px solid #eee;
}

.dokumente-liste a{
text-decoration:none;
color:#7b1e2b;
font-weight:500;
}

.dokumente-liste a:hover{
text-decoration:underline;
}

/* VORSTAND */

.vorstand-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:30px;
margin-top:30px;
}

.vorstand-card{
text-align:center;
background:#fafafa;
padding:20px;
border-radius:6px;
box-shadow:0 2px 6px rgba(0,0,0,0.08);
}

.vorstand-card img{
width:140px;
height:140px;
object-fit:cover;
border-radius:50%;
margin-bottom:10px;
}

.vorstand-card h4{
margin:10px 0 5px 0;
}

.vorstand-card p{
margin:3px 0;
font-size:0.9rem;
}

.section-title{
margin-top:40px;
color:#7b1e2b;
}

/* POSTADRESSE */

.postadresse{
margin-top:40px;
padding:20px;
background:#f5f5f5;
border-left:5px solid #7b1e2b;
border-radius:4px;
}

/* FOOTER */

footer{
border-top:1px solid #ccc;
text-align:center;
padding:1rem;
font-size:0.9rem;
}

footer a{
color:#7b1e2b;
text-decoration:none;
margin:0 0.5rem;
}

footer a:hover{
text-decoration:underline;
}

/* MOBILE */

@media (max-width:768px){

header{
flex-direction:column;
align-items:flex-start;
}

nav ul{
flex-direction:column;
gap:0.5rem;
}

nav ul ul{
position:static;
}

}

/* News */

.content {
  max-width: 1000px;
  margin: 0 auto;
  padding: 2rem 1rem;
}

.news-artikel {
  border-bottom: 1px solid #ccc;
  padding: 1.5rem 0;
}

.news-artikel:last-child {
  border-bottom: none;
}

.news-artikel h3 {
  margin: 0 0 0.5rem 0;
}

.news-datum {
  font-size: 0.95rem;
  margin-bottom: 1rem;
  color: #555;
}

.news-artikel a {
  color: #000;
  text-decoration: underline;
}

.news-artikel a:hover {
  text-decoration: none;
}





/* TRAINING */

.training-table{
width:100%;
border-collapse:collapse;
margin:20px 0 30px 0;
}

.training-table th,
.training-table td{
border:1px solid #ccc;
padding:12px;
text-align:left;
vertical-align:top;
}

.training-table th{
background:#f5f5f5;
font-weight:bold;
}

.content h4,
.content h5{
margin-top:30px;
}

.content ul{
line-height:1.7;
padding-left:20px;
}

.content hr{
margin:40px 0;
border:0;
border-top:1px solid #ccc;
}

/* KALENDER */

.kalender-box{
margin-top:30px;
background:#fff;
border:1px solid #ddd;
border-radius:6px;
overflow:hidden;
box-shadow:0 2px 6px rgba(0,0,0,0.05);
}

.kalender-box iframe{
display:block;
width:100%;
min-height:800px;
}

/* Den alten HERO Block oben bitte komplett löschen! */

/* Nutze nur noch diesen Block hier: */
.hero {
    /* WICHTIG: Prüfe, ob die Datei wirklich platz.jpeg (kleingeschrieben) heißt */
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), 
                      url('images/platz.jpeg'); 
    
    background-size: cover;           
    background-position: center;      
    background-repeat: no-repeat;
    
    min-height: 450px;                
    display: flex;
    align-items: center;              
    justify-content: center;          
    
    color: #ffffff !important;        
    text-align: center;
    padding: 20px;
    border-bottom: 1px solid #ccc;
}

.hero-content h2 {
    font-size: 2.5rem;
    margin-bottom: 15px;
    color: #ffffff !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
}

.hero-content p {
    font-size: 1.3rem;
    color: #ffffff !important;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}

header h1 a {
    display: flex;
    align-items: center; /* Logo und Text vertikal mittig ausrichten */
    gap: 15px;           /* Abstand zwischen Logo und Text */
    text-decoration: none;
}

.logo {
    height: 70px;        /* Hier kannst du die Höhe deines Logos anpassen */
    width: auto;         /* Breite passt sich automatisch an */
    display: block;
}

/* Falls der Text mobil zu viel Platz wegnimmt, kann man ihn kleiner machen */
@media (max-width: 768px) {
    .logo {
        height: 40px;
    }
    header h1 {
        font-size: 1.2rem;
    }
}