/* Extra-Breakpoint für mittlere Geräte (max-width: 500px) */
@media (max-width: 500px) {
    .countdown-container {
        padding: 1rem 1.5rem;
    }

    .countdown-container h2 {
        font-size: 1.8rem;
        margin-bottom: 0rem;
        line-height: 0.9em;
    }
    
    #countdown {
        font-size: 1.5rem;
        letter-spacing: 1px;
    }
    
    .countdown-date {
        font-size: 0.8rem;
        margin-top: 0.3rem;
    }

    .date-day, .date-month {
        font-size: 1.2em;
    }

    .date-year {
        font-size: 1.3em;
        line-height: 0.4em;
    }

    .left-info, .right-info {
        font-size: 1.5rem;
        padding-left: 10px;
    }

    .left-info h2 {
        font-size: 1.7rem;
        margin-bottom: 0.5rem;
    }

    /* Schriftgrößen für more-details reduzieren */
    .more-details {
        font-size: 0.8rem;
        padding-left: 10px;
    }

    .more-details h2 {
        font-size: 1.3rem;
        margin-bottom: 0.5rem;
        line-height: 0.9em;
    }

    .band-liste {
        font-size: 1.2rem;
        line-height: 1em;
        padding-left: 2px;
    }

    .band-liste li {
        margin-bottom: 0.3rem;
    }
    .tickets-btn {
        font-size: 1rem;
        line-height: 0.4rem;
    }
}

/* Extra-Breakpoint für sehr kleine Geräte (max-width: 426px) */
@media (max-width: 426px) {
    body {
        /* font-size: 9pt; */
    }
    
    h1, h2, h3, h4, h5, h6 {
    }
    
    .hero-section {
        min-height: calc(62vw + 470px);
    }

    .countdown-container h2 {
        font-size: 2rem;
    }
    
    #countdown {
        font-size: 1.1rem;
    }
    
    .tickets-btn {
        font-size: 1.2rem;
    }
    
    .navbar-list {
        padding: 0rem 0.25em 3em 0.25em;
        gap: 0.5rem;
    }
    
    nav a {
        padding: 6px 8px;
        font-size: 0.8rem;
    }
    
    main .content,
    .band-carousel,
    .zwei-button-likedivs {
        padding: 15px 10px;
    }

    .tickets-btn {
        font-size: 1rem;
    }
    


}

/* Extra-Breakpoint für sehr kleine Geräte (max-width: 426px) */
@media (max-width: 360px) {
    .cdright {
        top: 550px;
    }
}