/* Container für die gesamte Breite */
.layout-page {
    width: 100%;
}

.layout-container {
    /* Maximale Breite */
    margin: 0 auto;
    /* Zentriert den Container */

}

.content-inner,
#header>div,
footer {
    max-width: 1440px;
    margin: 0 auto;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Sicherstellen, dass die Regionen innerhalb des Containers zentriert sind */
.layout-content {
    width: 100%;
    /* Volle Breite für die Layout-Inhalte */
}

/* Basis-Styles für alle Container */
.layout-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0 1em;
    margin: 0 auto;
    /* Abstand zwischen den Elementen */
}


header .layout-container .layout-item:first-child {
    flex: 2;
    /* doppelt so viel Platz wie das andere */
}

header .layout-container .layout-item:last-child {
    flex: 1;
}

/* Spezifische Breiten */
.layout-item[data-width="25"] {
    flex: 0 0 calc(25% - 2em);
}

.layout-item[data-width="33"] {
    flex: 0 0 calc(33.33% - 2em);
}

.layout-item[data-width="50"] {
    flex: 0 0 calc(50% - 2em);
}

.layout-item[data-width="75"] {
    flex: 0 0 calc(75% - 2em);
}

.layout-item[data-width="16"] {
    flex: 0 0 calc(16.66% - 2em);
}

.layout-item[data-width="32"] {
    flex: 0 0 calc(33.33% - 2em);
}

.layout-item[data-width="100"] {
    flex: 0 0 calc(100% - 2em);
}

nav#block-konzerte-fusszeile.contextual-region.block.block-menu.navigation.menu--footer {
    width: 280px;
    margin: 0 auto;
}

/* Responsive Anpassungen */
@media (max-width: 1024px) {
    .layout-item[data-width="25"] {
        flex: 0 0 calc(50% - 2em);
        /* 50% Breite für Bildschirme bis 1024px */
    }

    .view-footer .navigation button {
        width: 24px !important;
    }

    nav#block-konzerte-fusszeile.contextual-region.block.block-menu.navigation.menu--footer {
        width: inherit;
        margin: 0px;
    }
}


@media (max-width: 1024px) {

    .layout-item[data-width="16"] {
        flex: 0 0 calc(100% - 2em);
        /* 100% Breite für Bildschirme bis 600px */
    }

    footer .layout-item[data-width="16"],
    footer .layout-item[data-width="33"] {
        flex: 0 0 calc(50% - 2em);
        /* 100% Breite für Bildschirme bis 600px */
    }

    footer .layout-item[data-width="33"] {
        flex-grow: 0;
    }

    .page-node-type-event div.event-fields.layout-container div.layout-item[data-width="16"] {
        border-right: 0px !important;
    }

    .page-node-type-event div.event-fields.layout-container div.layout-item[data-width="75"]>div {
        padding-left: 1rem;
        padding-right: 1rem !important;
    }
}

@media (max-width: 640px) {

    .layout-item[data-width="33"],
    .layout-item[data-width="50"],
    .layout-item[data-width="75"] {
        flex: 0 0 calc(100% - 2em);
        /* 100% Breite für Bildschirme bis 600px */
    }

    .layout-item[data-width="16"],
    .layout-item[data-width="32"] {
        flex: 0 0 calc(50% - 2em);
        /* 100% Breite für Bildschirme bis 600px */
    }

    footer .layout-item[data-width="16"],
    footer .layout-item[data-width="33"] {
        flex: 0 0 calc(100% - 2em);
        /* 100% Breite für Bildschirme bis 600px */
    }

    nav#main-navigation ul li {
        font-size: 3rem;
    }

    /*
    footer .layout-item.first {
        flex: 0 0 calc(100% - 2em);
    }
*/
    .view-konzerte div.views-field.views-field-field-datum-und-uhrzeit {
        float: left;
    }

    .view-konzerte div.views-field.views-field-field-datum-und-uhrzeit-1 {
        border-right: 0px;
        float: inherit;
    }

    .view-konzerte div.views-field.views-field-field-datum-und-uhrzeit-1,
    .view-konzerte div.views-field.views-field-field-ort {
        padding-left: .75rem;
    }

    #main-content .green .button,
    #main-content .blue .button,
    #main-content .layout-container .green .view-konzerte .views-field.views-field-view-node span.field-content a,
    main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-view-node a,
    div#block-konzerte-views-block-konzerte-block-4 div.views-field.views-field-view-node a,
    div#block-konzerte-views-block-konzerte-block-4 .views-field-view-node span.field-content a,
    #main-content .green .button_link,
    .views-field-field-event__link span.field-content a,
    #main-content .blue .button_link {
        width: 100% !important;
        background-position: right 0.5rem center;
        box-sizing: border-box !important;
        display: block;
    }

    /*

    .view-konzerte div.view-content div.views-row div.views-field.views-field-field-event__link {
        float: none !important;
        margin-top: 0px !important;
        margin-right: 0px !important;
        margin-left: 0;
        padding: .75rem;
        padding-top: 0.75rem;
        padding-top: 0;
    }
    */

    #main-content .green .button.archiv {
        background: url(/themes/custom/konzerte/images/icons/archive_blue.svg);
        background-position: right 0.5rem center;
        background-repeat: no-repeat;

    }

    #main-content .green .button.archiv:hover {
        background: url(/themes/custom/konzerte/images/icons/archive_green.svg);
        background-position: right 0.5rem center;
        background-repeat: no-repeat;
        background-color: var(--color-blue);
        color: var(--color-green);
    }

    #main-content .green .ticket a {
        background: url(/themes/custom/konzerte/images/icons/ticket_green.svg) var(--color-blue);
        background-position: left 0.5rem center;
        background-repeat: no-repeat;
        color: var(--color-green) !important;
        padding: 0.5rem 1rem 0.5rem 3rem !important;
    }

    #main-content .green .ticket a:hover {
        background: url(/themes/custom/konzerte/images/icons/ticket_blue.svg) var(--color-green);
        background-position: left 0.5rem center;
        background-repeat: no-repeat;
        color: var(--color-blue) !important;
        padding: 0.5rem 1rem 0.5rem 3rem !important;
    }

    #main-content .blue .ticket a {
        background: url(/themes/custom/konzerte/images/icons/ticket_green.svg);
        background-position: right 0.5rem center;
        background-repeat: no-repeat;
        background-color: var(--color-blue);
        color: var(--color-green);
    }

    #main-content .blue .ticket a:hover {
        background: url(/themes/custom/konzerte/images/icons/ticket_blue.svg);
        background-position: right 0.5rem center;
        background-repeat: no-repeat;
        background-color: var(--color-green);
        color: var(--color-blue);
    }

    #main-content .blue .calendar a.calbutton {
        background: url(/themes/custom/konzerte/images/icons/calendar_green.svg);
        background-position: right 0.5rem center;
        background-repeat: no-repeat;
        background-color: var(--color-blue);
        color: var(--color-green);
    }

    #main-content .blue .calendar a.calbutton:hover {
        background: url(/themes/custom/konzerte/images/icons/calendar_blue.svg);
        background-position: right 0.5rem center;
        background-repeat: no-repeat;
        background-color: var(--color-green);
        color: var(--color-blue);
    }

    #main-content .blue a.map {
        background: url(/themes/custom/konzerte/images/icons/map_green.svg);
        background-position: right 0.5rem center;
        background-repeat: no-repeat;
        background-color: var(--color-blue);
        color: var(--color-green);
    }

    #main-content .blue a.map:hover {
        background: url(/themes/custom/konzerte/images/icons/map_blue.svg);
        background-position: right 0.5rem center;
        background-repeat: no-repeat;
        background-color: var(--color-green);
        color: var(--color-blue);
    }

    #main-content .blue .backbutton,
    #main-content .blue .backbutton:hover {
        width: 100% !important;
        display: block !important;
        box-sizing: border-box !important;
        background-position-x: 4% !important;
        /*  text-align: right; */
        padding-right: 1.25rem !important;
        padding-left: 3rem !important;
    }

    .flex-1,
    .flex-2 {
        flex: 1 1 100% !important;
    }

    h3 {
        font-size: 1.375rem !important;

    }

    div#konzerte div.view.view-konzerte.view-id-konzerte.view-display-id-block_1 div.view-content div.views-row div.views-field.views-field-title h3.field-content {
        font-size: 1.75rem !important;
        ^
    }

    h1 {
        font-size: 3rem !important;

    }

    h2,
    .quotetitle {
        font-size: 2.2rem !important;
    }

}



@media (max-width: 480px) {

    .layout-item[data-width="25"],
    .layout-item[data-width="33"] {
        flex: 0 0 calc(100% - 2em);
        /* 100% Breite für Bildschirme bis 600px */
    }

    nav#main-navigation ul li {
        font-size: 2.5rem;
    }

    /*footer div#footertop.layout-container div.layout-item.third {
        border-top: 2px solid var(--color-blue);
        margin-top: 2rem;
        padding-top: 1rem;
    }

    footer .layout-item.second,
    footer .layout-item.third {
        flex: 0 0 calc(50% - 2em);
    }
*/
}

/* Automatische Anpassung bei leeren Items */
.layout-item:empty {
    display: none;
}

/* Dynamische Anpassung der verbleibenden Items */
.layout-item:not(:empty) {
    flex-grow: 1;
}

.layout-item {
    /* Basis-Styling für den Container */



    /* Spezifische Elemente */
    img {
        max-width: 100%;
        width: 100%;
        height: auto;

    }

    iframe,
    video {
        width: 100%;
        max-width: 100%;
        aspect-ratio: 16/9;
    }

    /* Text-Overflow verhindern */
    p,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        overflow-wrap: break-word;
        word-break: break-word;
    }
}

header {
    box-shadow: 0px 10px 10px 0px #0000004D;
    position: relative;
    z-index: 10;
}


/* Hamburger Menu Toggle */
.menu-toggle {
    display: block;
    cursor: pointer;
    padding: 0px;
    position: relative;
    z-index: 1001;
    background: none;
    border: none;
}

.menu-toggle span {
    display: block;
    width: 64px;
    height: 4px;
    background-color: var(--color-blue);
    position: relative;
    transition: all 0.3s ease-in-out;
    text-indent: -9999px;
}

.menu-toggle span::before,
.menu-toggle span::after {
    content: '';
    display: block;
    width: 64px;
    height: 4px;
    background-color: var(--color-blue);
    position: absolute;
    transition: all 0.3s ease-in-out;

}

button#menu-toggle {
    height: 64px;
}

.menu-toggle span::before {
    top: -16px;
}

.menu-toggle span::after {
    top: 16px;
}

/* Show menu when .is-open is present */
nav#main-navigation.main-menu.is-open {
    max-height: 750px;
    /* Or a specific height */
}

/* Animate hamburger to 'X' */
.menu-toggle[aria-expanded="true"] span {
    background-color: transparent;
}

.menu-toggle[aria-expanded="true"] span::before {
    transform: rotate(45deg);
    top: 0;
}

.menu-toggle[aria-expanded="true"] span::after {
    transform: rotate(-45deg);
    top: 0;
}

nav#main-navigation.main-menu {
    display: none;
}

nav#main-navigation.main-menu.is-open {
    display: block;
    background-color: var(--color-blue);
}


.main-menu {
    position: absolute;
    top: 104px;
    left: 0;
    width: 100vw;
    z-index: 1000;
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
    box-shadow: 0 4px 10px #0000001a;
    overflow: visible;
    /* wichtig: ::after sichtbar machen */
}

.block-system-branding-block a.site-logo img {
    max-width: 320px;
}

.region-primary-menu {
    float: right;
}

.main-menu::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 105px;
    bottom: -104px;
    background-color: var(--color-blue);
    pointer-events: none;
    clip-path: polygon(100% 0, 0 90%, 0 0, 100% 0);

    /* #0000004D ≈ 0.302 alpha */
    z-index: 999;
}

nav#main-navigation {
    filter: drop-shadow(0px 10px 10px rgba(0, 0, 0, 0.302));
}

#header.sticky {
    /*  position: sticky;
    top: 0;*/
    background: white;
}

main {
    transition: filter .4s cubic-bezier(.22, .9, .35, 1), transform .4s cubic-bezier(.22, .9, .35, 1);
    will-change: filter;
}

body.menu-open main,
body.menu-open footer {
    filter: blur(2px);
}

@font-face {
    font-family: "Archivo Black";
    src: url("../fonts/ArchivoBlack-Regular.woff2") format("woff2");
    font-weight: 600;
    font-style: bold;
    font-display: swap;
}

@font-face {
    font-family: "Arimo";
    src: url("/fonts/Arimo-VariableFont_wght.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: "Arimo", Arial, Helvetica, sans-serif;

}

nav#main-navigation ul {
    margin: 0 auto;
    max-width: 1440px;
    padding: 1rem;
    font-size: 4rem;
}

nav#main-navigation ul li a {
    text-decoration: none;
    color: var(--color-green);
    width: 100%;
    display: block;
}

nav#main-navigation ul li:hover a {
    font-style: italic;
}

nav#main-navigation ul li {
    border-top: 3px solid var(--color-green);
    padding-bottom: .2rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-green.svg);
    background-position-x: 100%;
    background-position-y: center;
    background-repeat: no-repeat;
    background-size: 2rem;

}

:root {
    --color-blue: #2B30B1;
    --color-green: #C6E348;
    --shadow: 0 4px 10px #0000001a;
}

.blue {
    background: var(--color-blue);
    color: var(--color-green);
}

.green {
    background: var(--color-green);
    color: var(--color-blue);

}

div#block-konzerte-logofooter img {
    max-width: 100px;
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    #backtotop {
        background: url(/themes/custom/konzerte/images/icons/chevron-top.svg);
        no-repeat center center;
        background-size: auto;
        background-size: 70px 70px;
    }
}

footer a {
    color: var(--color-blue);
    text-decoration: none;
    border-bottom: solid 2px var(--color-blue);
}

footer a:hover {
    color: var(--color-green);
    text-decoration: none;
    border-bottom: solid 2px var(--color-green);
}

footer ul.menu li.menu-item,
footer p {
    margin-bottom: .75rem;
    margin-top: .75rem;
    padding: 0px;
}

footer ul.menu {
    margin: 0px;
}

html {
    line-height: 1.33;
}

footer .layout-item.first {
    margin-bottom: 2rem;
}


@media (min-width: 768px) {
    .webform-flexbox {
        display: block;
        margin: 0px;
    }

    /* 50% Breite für halbe Breite Blöcke */
    #block-konzerte-geschichte,
    #block-konzerte-instrumente,
    #edit-feldgruppe-1,
    #edit-feldgruppe-2,
    main#main-content div.half {
        grid-column: span 1;
        /* Block nimmt eine Spalte ein */
    }

}

@media (min-width: 768px) and (max-width:1024px) {
    .view-footer .dots {
        margin-top: 14rem !important;

    }
}

/*
@media (min-width: 1024px) and (max-width:1440px) {
    div#block-konzerte-footerlinks p a.button {
        padding: .5rem 2rem .5rem 1rem;
        font-size: 1.15rem;
    }
}

*/

@media (max-width: 767px) {

    /* 50% Breite für halbe Breite Blöcke */
    #block-konzerte-geschichte,
    #block-konzerte-instrumente,
    #edit-feldgruppe-1,
    #edit-feldgruppe-2,
    main#main-content div.half,
    #edit-feldgruppe-1--2,
    #edit-feldgruppe-2--2 {
        grid-column: span 2;
        /* Block nimmt eine Spalte ein */
    }

    #edit-feldgruppe-1,
    #edit-feldgruppe-1--2 {
        margin-bottom: 0px;
        margin-top: 0px;
    }

    #edit-feldgruppe-2,
    #edit-feldgruppe-2--2 {
        margin-top: 0px;
    }

    .views-view-grid {
        gap: 0;
        padding: 0.5rem;
    }

    .views-view-grid .views-col {
        flex: 0 0 100%;
        max-width: 100% !important;
        opacity: 0;
        transform: none;
        pointer-events: none;
        position: absolute;
        left: 0;
        top: 0;
        width: 100% !important;
        transition: transform 300ms ease, opacity 300ms ease;
        /* margin-left: .5rem;*/
    }

    .view-footer .dots {
        margin-top: 18rem !important;
    }

    /* nur das jeweils aktive (centerIndex) Element sichtbar machen */
    .views-view-grid .views-col.center {
        opacity: 1;
        pointer-events: auto;
        position: relative;
        z-index: 4;
        transform: none;
    }

    .views-view-grid.horizontal.cols-3 {

        padding: 1rem !important;
        gap: 0rem !important;
    }

    .block-views-blockkonzerte-block-2 .view-konzerte div.view-content div.views-row {
        margin-bottom: 0rem !important;
    }

    div.view-footer div.navigation button {
        display: none;
    }

}


#main-content .layout-container .blue a {
    color: var(--color-green);
}

#main-content .layout-container .green a {
    color: var(--color-blue);
}


/* Container für das Grid-Layout */
#main-content div.region,
div#kontakt form,
div#block-konzerte-konzertorte>div,
div#block-konzerte-webformular-2 form,
div#block-konzerte-videos div.field--name-body {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /* Zwei Spalten mit gleicher Breite */
    gap: 1em;
    /* Abstand zwischen den Elementen */
}

/* 100% Breite für volle Breite Blöcke */
#block-konzerte-page-title,
#block-konzerte-content,
#block-konzerte-content-1,
#block-konzerte-uberuns,
#block-konzerte-konzertorte,
#block-konzerte-webformular,
#block-konzerte-views-block-konzerte-block-1,
#block-konzerte-views-block-konzerte-block-2,
#konzerte,
#kontakt,
#about-us,
#block-konzerte-views-block-konzerte-block-4,
#block-konzerte-views-block-medienblock-block-1,
#block-konzerte-webformular-2,
#block-konzerte-views-block-sponsoren-block-1,
#block-konzerte-titelunterstutzung,
#block-konzerte-views-block-hoerproben-block-1,
#media,
#unterstuetzung,
#presse,
#block-konzerte-backbuttonarchiv,
#block-konzerte-backbuttonstatischeseite,
#block-konzerte-videos,
#block-konzerte-qrcode {
    grid-column: span 2;
    /* Block nimmt beide Spalten ein */
}


div#block-konzerte-primary-local-tasks nav.tabs ul.tabs.primary {
    border-bottom: 2px solid white;
}

div#block-konzerte-qrcode h2 {

    margin-top: 1rem;
}

/*
div#block-konzerte-primary-local-tasks .tabs a.is-active,
div#block-konzerte-primary-local-tasks .tabs a:hover {
    background-color: #040413;
}
    */

.green .webform-submission-form input,
.green .webform-submission-form textarea {
    width: 100%;
    border: 1px solid var(--color-blue);
    background: transparent;
    color: var(--color-blue);
    padding: 0.5em 1rem;
    box-sizing: border-box;
    /* Berücksichtigt Padding und Border in der Breite */
}

.green .webform-submission-form input::placeholder,
.green .webform-submission-form textarea::placeholder {
    color: var(--color-blue);
    opacity: 1;
    font-size: 1.5rem;
}

.blue .webform-submission-form input,
.blue .webform-submission-form textarea {
    width: 100%;
    border: 1px solid var(--color-green);
    background: transparent;
    color: var(--color-green);
    padding: 0.5em 1rem;
    box-sizing: border-box;
    /* Berücksichtigt Padding und Border in der Breite */
}

.blue .webform-submission-form input::placeholder,
.blue .webform-submission-form textarea::placeholder {
    color: var(--color-green);
    opacity: 1;
    font-size: 1.5rem;
}


#main-content .green .button {
    border: 1px solid var(--color-blue);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    text-align: left;
    padding-right: 4rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-blue.svg);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    font-size: 1.25rem;
    line-height: 1.15;
}

#main-content .green .button:hover {
    border: 1px solid var(--color-blue);
    color: var(--color-green);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    text-align: left;
    padding-right: 4rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-green.svg) var(--color-blue);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    cursor: pointer;
    font-size: 1.25rem;
    line-height: 1.15;
}


#main-content .blue .button {
    border: 1px solid var(--color-green);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    text-align: left;
    padding-right: 4rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-green.svg);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    line-height: 1.15;
    color: var(--color-green);
}

#edit-pass {
    display: block;
}

#main-content .blue .button:hover {
    border: 1px solid var(--color-green);
    color: var(--color-blue);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    text-align: left;
    padding-right: 4rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-blue.svg) var(--color-green);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    cursor: pointer;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    line-height: 1.15;
}

#main-content .blue .backbutton {
    border: 1px solid var(--color-green);
    border-radius: 70px;
    width: fit-content;
    padding-left: 4rem;
    padding-right: 2rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-left-green.svg);
    background-position: left 0.5rem center;
    background-repeat: no-repeat;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    line-height: 1.15;
}

#main-content .blue .backbutton:hover {
    border: 1px solid var(--color-green);
    color: var(--color-blue);
    border-radius: 70px;
    width: fit-content;
    padding-left: 4rem;
    padding-right: 2rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-left-blue.svg) var(--color-green);
    background-position: left 0.5rem center;
    background-repeat: no-repeat;
    cursor: pointer;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    line-height: 1.15;
}

#main-content .blue .button_link {
    border: 1px solid var(--color-green);
    color: var(--color-green);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    padding-right: 1rem;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    display: inline-flex;
    text-align: center;
    line-height: 1.15;
}

#main-content .blue .button_link:hover {
    border: 1px solid var(--color-green);
    background: var(--color-green);
    color: var(--color-blue);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    padding-right: 1rem;
    cursor: pointer;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    display: inline-flex;
    text-align: center;
    line-height: 1.15;
}

#main-content .green .button_link {
    border: 1px solid var(--color-blue);
    color: var(--color-blue);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    padding-right: 1rem;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    display: inline-flex;
    text-align: center;
    line-height: 1.15;
}

#main-content .green .button_link:hover {
    border: 1px solid var(--color-blue);
    background: var(--color-blue);
    color: var(--color-green) !important;
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    padding-right: 1rem;
    cursor: pointer;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    display: inline-flex;
    text-align: center;
    line-height: 1.15;
}

.views-field-field-event__link span.field-content a {
    background: url(/themes/custom/konzerte/images/icons/ticket_green.svg) var(--color-blue);
    color: var(--color-green) !important;
    padding: .5rem 1rem .5rem 3.5rem;
    border: 1px solid var(--color-blue);
    background-repeat: no-repeat;
    background-position: left 0.5rem center;
    border-radius: 70px;
    width: fit-content;
    text-decoration: none;
    font-size: 1.25rem;
    display: inline-flex;
    text-align: center;
    line-height: 1.15;
}

.views-field-field-event__link span.field-content a:hover {
    background: url(/themes/custom/konzerte/images/icons/ticket_blue.svg) var(--color-green);
    color: var(--color-blue) !important;
    padding: .5rem 1rem .5rem 3.5rem;
    border: 1px solid var(--color-blue);
    background-repeat: no-repeat;
    background-position: left 0.5rem center;
    border-radius: 70px;
    width: fit-content;
    text-decoration: none;
    font-size: 1.25rem;
    display: inline-flex;
    text-align: center;
    line-height: 1.15;
}

.expand-collapse a.ec-toggle-link.ecf-open,
.expand-collapse a.ec-toggle-link.ecf-close {
    color: var(--color-blue) !important;
    border: 1px solid var(--color-blue);
    border-radius: 70px;
    padding: .45rem 3rem .45rem 1rem;
    margin-bottom: 1rem;
    float: left;
    background: var(--color-green);
    text-decoration: none;
    margin-top: 0.5rem;
    font-size: 1.25rem;
    line-height: 1.15;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-blue.svg) var(--color-green);
    padding: .45rem 3rem .45rem 1rem;
    background-position: right 0.5rem center;
    background-repeat: no-repeat;

}

.expand-collapse a.ec-toggle-link.ecf-open:hover,
.expand-collapse a.ec-toggle-link.ecf-close:hover {
    color: var(--color-green) !important;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-green.svg) var(--color-blue) !important;
    padding: .45rem 3rem .45rem 1rem;
    background-position: right 0.5rem center !important;
    background-repeat: no-repeat !important;
}

#main-content .layout-container .blue .expand-collapse div.ec-content p a,
#main-content .layout-container .blue .node--type-teammitglied div a {
    color: var(--color-blue)l;

}


span.field-content.button a,
span.field-content.button a:hover {
    text-decoration: none;
}

.path-archiv .view-konzerte div.view-content div.views-row div.views-field.views-field-view-node {
    padding: 1rem;
}

#main-content .layout-container .green .view-konzerte .views-field.views-field-view-node span.field-content a,
main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-view-node a,
div#block-konzerte-views-block-konzerte-block-4 div.views-field.views-field-view-node a,
div#block-konzerte-views-block-konzerte-block-4 .views-field-view-node span.field-content a {
    border: 1px solid var(--color-blue);
    color: var(--color-blue);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    padding-right: 3rem;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    display: inline-flex;
    text-align: center;
    background-image: url(/themes/custom/konzerte/images/icons/chevron-right-blue.svg);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    line-height: 1.15;

}

#main-content .layout-container .green .view-konzerte .views-field.views-field-view-node span.field-content a:hover,
main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-view-node a:hover,
div#block-konzerte-views-block-konzerte-block-4 .views-field-view-node span.field-content a:hover {
    border: 1px solid var(--color-blue);
    background: var(--color-blue);
    color: var(--color-green);
    border-radius: 70px;
    width: fit-content;
    padding-left: 1rem;
    padding-right: 3rem;
    cursor: pointer;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    display: inline-flex;
    text-align: center;
    background-image: url(/themes/custom/konzerte/images/icons/chevron-right-green.svg);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    line-height: 1.15;
}

#main-content .blue a[href$=".pdf"].button {
    border: 1px solid var(--color-green);
    border-radius: 70px;
    width: fit-content;
    padding-left: 2rem;
    padding-right: 4rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-down-green.svg);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    line-height: 1.15;
}

#main-content .blue a[href$=".pdf"].button:hover {
    border: 1px solid var(--color-green);
    color: var(--color-blue);
    border-radius: 70px;
    width: fit-content;
    padding-left: 2rem;
    padding-right: 4rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-down-blue.svg) var(--color-green);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    cursor: pointer;
    text-decoration: none;
    padding-top: 0.45em;
    padding-bottom: 0.45em;
    font-size: 1.25rem;
    line-height: 1.15;
}

/*
.view-konzerte .views-field.views-field-view-node span.field-content a {
    margin-left: 0.75rem;
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;

}
   

.view-konzerte .views-field.views-field-view-node span.field-content {
    width: 50%;
    display: inline-block;
}
 */
#footertop {
    margin-top: 4rem;
}

.mainmenu,
#block-konzerte-site-branding {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.content-inner .region {
    padding-top: 1rem;
    padding-bottom: 2rem;
}

.stripe_5,
.stripe_1 {
    position: relative;
}

.path-frontpage .stripe_5 .content-inner::before,
.path-frontpage .stripe_1 .content-inner::before,
.page-node-type-event .stripe_1 div.content-inner::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 105px;
    top: -1px;
    background-color: var(--color-blue);
    pointer-events: none;
    clip-path: polygon(100% 0, 0 90%, 0 0, 100% 0);
    z-index: 999;
}


.path-frontpage .stripe_3 div.content-inner::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 105px;
    background-color: var(--color-blue);
    pointer-events: none;
    clip-path: polygon(100% 0, 0 90%, 0 0, 100% 0);
    z-index: 999;
    margin-top: -0.01rem;
}

.path-frontpage .stripe_2 div.content-inner::before,
.path-frontpage .stripe_4 div.content-inner::before,
.path-node .stripe_4 div.content-inner::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 105px;
    background-color: var(--color-green);
    pointer-events: none;
    clip-path: polygon(100% 0, 0 90%, 0 0, 100% 0);
    z-index: 999;
    margin-top: -0.01rem;
}

.page-node-type-page:not(.path-frontpage) .stripe_4 div.content-inner::before {
    background-color: transparent;
}

.stripe_5 .content-inner {
    margin-top: 6rem;
}

.path-frontpage .region-content-stripe-2,
.path-frontpage .region-content-stripe-3,
.region-content-stripe-4 {
    padding-top: 8rem !important;
}

.region-content-stripe-3 {
    padding-bottom: 4rem !important;
}

main#main-content p,
main#main-content li,
footer p,
footer li,
div.layout-item div {
    font-size: 1.5rem;
    line-height: 1.33;
    letter-spacing: -0.5%;
}

main#main-content p.quotetitle {
    font-size: 3.2rem;

}

div.typewriter p {
    max-width: 840px;
    margin: 0 auto;
    text-align: center;
    font-style: italic;
}

.path-frontpage div#block-konzerte-content h1.page-title {
    margin-bottom: 0px;
}

#block-konzerte-views-block-konzerte-block-2 {
    margin-top: 2rem;
}

.path-frontpage div#block-konzerte-page-title h1.page-title,
.page-node-type-event div#block-konzerte-page-title h1.page-title {
    display: none;
}

main#main-content #kontakt h2,
h1,
main#main-content div#konzerte h2 {
    font-size: 5rem;
    border-top: none;
    font-weight: 400;
    line-height: 1;
}

main#main-content h2 {
    font-size: 3.2rem;
    line-height: 1;
    padding-top: .5rem;
}

main#main-content .blue h2 {
    border-top: 4px solid var(--color-green);
}

main#main-content .green h2 {
    border-top: 4px solid var(--color-blue);
}


main#main-content div.layout-container .block h2 {
    font-weight: 400;
    margin-bottom: 2rem;
}


h3,
.node--type-teammitglied .field--name-field-vorname,
.node--type-teammitglied .field--name-field-nachname {
    font-family: Archivo Black;
    font-weight: 400;
    font-size: 1.75rem;
    line-height: 1.33;
    letter-spacing: -0.5%;
    text-transform: uppercase;

}

main#main-content #kontakt h2 {
    margin-bottom: 0px !important;
}


.masked-text {
    color: transparent;
    background-image: url('/sites/default/files/2025-08/8a9c92720bedca0f23fed5e48b7110a7a2b9c0e7.jpg');
    background-size: 200%;
    /* Enlarged for smooth animation */
    background-position: 0 50%;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: animate-background 5s infinite alternate linear;
}

@keyframes animate-background {
    0% {
        background-position: 0 50%;
    }

    100% {
        background-position: 100% 50%;
    }
}

.event-ort {
    margin-top: 1rem;
    margin-bottom: 2rem;
}

.addtocal-container {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

div.addtocal-container div.field time.datetime {
    display: none;
}

.page-node-type-event div.event-fields.layout-container,
.path-archiv div.layout-page main#main-content div.views-element-container div.views-row {
    border-top: 4px solid var(--color-green);
    border-bottom: 2px solid var(--color-green);
    border-left: 1px solid var(--color-green);
    border-right: 1px solid var(--color-green);
}

.path-archiv div.layout-page main#main-content div.views-element-container div.views-row .views-field-title {
    border-top: 1px solid var(--color-green);
    clear: left;
}

.path-archiv div.layout-page main#main-content div.views-element-container div.views-row .views-field-field-content {
    border-bottom: 1px solid var(--color-green);
}

.view-konzerte div.view-content div.views-row {
    border-top: 4px solid var(--color-blue);
    border-bottom: 2px solid var(--color-blue);
    border-left: 1px solid var(--color-blue);
    border-right: 1px solid var(--color-blue);
}

.view-konzerte div.view-content div.views-row {
    margin-bottom: 2rem;

}

.view-konzerte div.view-content div.views-row .views-field-title {
    border-top: 1px solid var(--color-blue);
}


.view-konzerte div.view-content div.views-row .views-field-title h3,
.view-konzerte div.view-content div.views-row .views-field-field-datum-und-uhrzeit,
.view-konzerte div.view-content div.views-row .views-field-field-content>* {
    padding-left: .75rem;
    padding-right: .75rem;
}

.view-konzerte div.view-content div.views-row .views-field-field-content {
    border-bottom: 1px solid var(--color-blue);
}



.view-konzerte div.view-content div.views-row .views-field-title h3.field-content a {
    text-decoration: none;
}


.page-node-type-event div.event-fields.layout-container div.layout-item .node-title {
    border-top: 0px !important;
    margin-top: 1rem;
    margin-bottom: 1rem !important;
    padding-left: 1rem;
    padding-right: 1rem;
}

.page-node-type-event div.event-fields.layout-container div.layout-item[data-width="100"] {

    border-bottom: 1px solid var(--color-green);
}

.page-node-type-event div.event-fields.layout-container div.layout-item[data-width="16"] {
    border-right: 1px solid var(--color-green);
}

.page-node-type-event div.event-fields.layout-container div.layout-item[data-width="16"]>div {
    padding-left: 1rem;
    padding-right: 1rem;
}

.page-node-type-event div.event-fields.layout-container div.layout-item[data-width="16"] .event-date {
    padding-top: 1.5rem;
}

.page-node-type-event div.event-fields.layout-container div.layout-item[data-width="75"]>div {
    padding-right: 1.5rem;
    padding-bottom: 1rem;
}

.back {
    margin-top: 4rem;
    margin-bottom: 4rem;
}

.page-node-type-event .field--name-field-datum-und-uhrzeit {
    display: block;
}


div.event-fields.layout-container div.layout-item div.event-date div.field.field--name-field-datum-und-uhrzeit.field--type-datetime.field--label-hidden.field__item span.addtocal-container.add-to-calendar,
div.event-toggle span.smart-date--date,
div.event-toggle span.smart-date--time {
    display: none;

}

.addtocal-container,
span.add-to-calendar {
    display: none;
}

    {
    display: none;
    /* Standardmäßig versteckt */
}

.addtocal-container.visible {
    display: block;
    /* Sichtbar, wenn die Klasse 'visible' hinzugefügt wird */
}

.event-toggle {
    margin-top: 1rem;
}

div.views-row span.views-field.views-field-field-event__link {
    float: right;

    margin-top: 0.5rem;
    margin-right: .5rem;
}

.path-frontpage #konzerte {
    margin-top: 4rem;
}

@media (min-width: 641px) {

    .view-konzerte div.views-field.views-field-field-datum-und-uhrzeit,
    .view-konzerte div.views-field.views-field-field-datum-und-uhrzeit-1 {
        border-right: 1px solid var(--color-blue);
        padding-right: 1rem;
        margin-right: 1rem;
        float: left;
    }

    .path-archiv div.views-field.views-field-field-datum-und-uhrzeit,
    .path-archiv .view-konzerte div.views-field.views-field-field-datum-und-uhrzeit-1 {
        border-right: 1px solid var(--color-green);
    }


}

.view-konzerte div.view-content div.views-row .views-field-title h3 {
    margin-bottom: 1rem;
}

.view-konzerte .views-field-field-content div.field-content p {
    margin-top: 0px;
    margin-bottom: 0px;
}



label.addtocal__label {
    border-right: 0px;
    background: none;

}


/* Container */
.views-view-grid.horizontal.cols-3 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 1rem;
    overflow: visible;
    /* Ändere von visible zu hidden */
    padding: 1rem 5%;
}

/* Spalten (Cards) */
.views-view-grid .views-col {
    transition: transform 350ms ease, opacity 350ms ease;
    flex: 1 1 30%;
    /* Flex-Wachstum und -Schrumpfen anpassen */
    max-width: 33.3333%;
    /*  box-sizing: border-box;*/
}


/* mittleres Element hervorheben */
.views-view-grid .views-col.center {
    transform: scale(1.18);
    z-index: 3;
}

/* links/rechts etwas "versenken" */
/* links/rechts etwas "versenken" */
.views-view-grid .views-col.left,
.views-view-grid .views-col.right {
    transform: scale(0.95);
    z-index: 2;
    opacity: 0.95;
    /* Füge etwas Abstand hinzu */
}


/* deaktivierte Übergänge wenn nötig */
.views-view-grid .views-col.hidden {
    opacity: 0;
    pointer-events: none;
}

.view-footer {
    position: relative;
}

/* Pfeile */
.view-footer .navigation {
    position: relative;
    top: 50%;
    left: 0;
    right: 0;
    pointer-events: none;
    /* Buttons selbst bekommen pointer-events */
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    padding: 0 0.5rem;
    margin-top: -16rem;
}

.view-footer .navigation button {
    pointer-events: auto;
    background: none;
    border: 0px;
    padding: 0px;
    cursor: pointer;
    width: 48px;
}

/* Dots unterhalb — die vorhandene .dots wird genutzt */
.view-footer .dots {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1.6rem;
    position: relative;
    z-index: 5;
    margin-top: 12rem;
}

.view-footer .dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid var(--color-green);
    background: var(--color-blue);
    display: inline-block;
    cursor: pointer;
}

.view-footer .dot.active {
    background: var(--color-green);
}


div#block-konzerte-views-block-konzerte-block-2 div.field__item img.image-style-large,
.block-views-blockteam-block-1 .field--name-field-featured-image picture img {
    clip-path: polygon(0 20%, 100% 0%, 100% 80%, 0 100%);
}


div#block-konzerte-views-block-konzerte-block-2 .views-field-title,
div#block-konzerte-views-block-konzerte-block-2 .views-field-field-content,
div#block-konzerte-views-block-konzerte-block-2 .views-field-view-node {
    background: var(--color-green);
}


main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-title h3.field-content a,
main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-field-content div.field-content,
main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-view-node a {
    color: var(--color-blue);

}

main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-title {
    margin-top: -5rem;
    padding-top: 5rem;
}

main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-field-content {
    border-bottom: 0px;
    margin-top: -1.2rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 1rem;
}


main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-view-node a,
main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-view-node a:hover,
main#main-content div#block-konzerte-views-block-konzerte-block-2 .views-field-field-content div.field-content p {
    font-size: 1rem;
    text-decoration: none;
}

main#main-content div#block-konzerte-views-block-konzerte-block-2 div.views-field.views-field-view-node {
    padding-bottom: 1rem;
    margin-top: -1rem;
}

div#block-konzerte-views-block-konzerte-block-2 div.view-content div.views-view-grid div.views-col.left,
div#block-konzerte-views-block-konzerte-block-2 div.view-content div.views-view-grid div.views-col.right {
    filter: blur(1px);
}


div#block-konzerte-views-block-konzerte-block-2 div.view-content div.views-view-grid div.left {
    z-index: 0;
    position: relative;
}


div#block-konzerte-views-block-konzerte-block-2 div.view-content div.views-view-grid div.center {
    z-index: 1;
    position: relative;
}

body {
    hyphens: auto;
}



@keyframes typewriter {
    from {
        width: 0;
    }

    to {
        width: 100%;
    }
}

#author {
    opacity: 0;

}


.addtocal__link {
    display: inline-block;
    width: 2rem;
    height: 2.25rem;
}

.addtocal__google,
.addtocal__outlook,
.addtocal__ical {
    mask-size: 2rem;
}

.addtocal__label {
    width: 1rem !important;
}

div#block-konzerte-views-block-konzerte-block-4 div.views-field.views-field-title h3.field-content a {
    color: var(--color-blue);
}

.page-node-type-event .stripe_1 div.content-inner div.region.region-content-stripe-1 {
    padding-top: 6rem;
}

.page-node-type-event div.layout-page main#main-content div.layout-container .stripe_0 {
    padding-bottom: 3rem;
}

form#user-login-form input#edit-name {
    display: block;
}

#block-konzerte-views-block-konzerte-block-4 {
    margin-bottom: 3rem;
}

.path-archiv div.view-content div.views-row span.views-field.views-field-view-node span.field-content.button {
    padding-top: .5rem !important;
    padding-bottom: 0.5rem !important;
    margin-top: .5rem;
    margin-bottom: .5rem;
    margin-left: .75rem;
    text-decoration: none !important;
}

.path-archiv #main-content .layout-container .blue div.view-content div.views-row span.views-field.views-field-view-node span.field-content.button:hover a {
    color: var(--color-blue);
    text-decoration: none;
}

.path-archiv #main-content .layout-container .blue div.view-content div.views-row span.views-field.views-field-view-node span.field-content.button a {
    text-decoration: none;
}

.path-archiv #main-content .layout-container .blue div.view-content div.views-row span.views-field.views-field-view-node span.field-content.button {
    padding-left: .5rem;
}

form#views-exposed-form-konzerte-page-1 fieldset {
    border: 0px;
    padding-left: 0px;
    margin-left: 0px;
    margin: 0px;
}

form#views-exposed-form-konzerte-page-1 fieldset ul {
    display: flex;
    list-style-type: none;
    padding-left: 0px;
    flex-wrap: wrap;
}

form#views-exposed-form-konzerte-page-1 fieldset ul li {
    margin-bottom: 1.5rem;
}

form#views-exposed-form-konzerte-page-1 fieldset ul li a {
    padding: 0.45rem 1.5rem;
    border: 1px solid var(--color-green);
    border-radius: 70px;
    margin-right: 1rem;
}

form#views-exposed-form-konzerte-page-1 fieldset ul li a:hover,
.bef-link--selected {
    background-color: var(--color-green);
    color: var(--color-blue) !important;
    cursor: pointer;
}

form#views-exposed-form-konzerte-page-1 fieldset ul li a,
main#main-content div#konzerte .view-konzerte div.view-footer p a.button,
main#main-content .view-pressespiegel div.view-footer p a.button {
    text-decoration: none;
}

main#main-content div#konzerte .view-konzerte div.view-footer p a.button,
main#main-content .view-pressespiegel div.view-footer p a.button {
    padding-top: .55rem;
    padding-bottom: .55rem;
    padding-left: 1rem;
}

main#main-content .view-konzerte div.views-row span.views-field.views-field-view-node span.field-content a,
main#main-content .view-konzerte div.views-row span.views-field.views-field-view-node span.field-content a :hover {
    padding-top: .475rem !important;
    padding-bottom: .475rem !important;
}

.slick__slide .field__item {
    width: 90%;
    margin: 0 auto;
}

.blue nav.slick__arrow button.slick-prev.slick-arrow {
    background-image: url(/themes/custom/konzerte/images/icons/chevron-left-green.svg);
}

.blue nav.slick__arrow button.slick-next.slick-arrow {
    background-image: url(/themes/custom/konzerte/images/icons/chevron-right-green.svg);
}

.slick__arrow .slick-prev {
    background-image: url(/themes/custom/konzerte/images/icons/media-left.svg);
    background-repeat: no-repeat;
    background-position-x: 118%;
    background-size: cover;
    height: 60px;
}

/* Pfeil rechts (invertiert) */
.slick__arrow .slick-next {
    background-image: url(/themes/custom/konzerte/images/icons/media-right.svg);
    background-repeat: no-repeat;

    background-size: cover;
    height: 64px;
}

.slick-prev::before,
.slick-next::before {
    content: none;
}

.page-node-type-page main#main-content div.layout.layout--onecol div.layout__region.layout__region--content,
.page-node-type-page:not(.path-frontpage) div#block-konzerte-content div.node__content .field--type-text-long {
    max-width: 1092px;
    margin: 0 auto;
    margin-bottom: 4rem;
}

#block-konzerte-page-title h1.page-title {
    margin-top: -1rem;
    margin-bottom: 1rem;
}

#block-konzerte-webformular-2 {
    margin-top: -4rem;
}

.page-node-type-page .slick-slide>div {
    /* width: 90%;*/
    margin: 0 auto;
    max-width: 1298px;
}

div#block-konzerte-views-block-hoerproben-block-1 div.view-content div.views-row,
#media div.view-content div.views-row {
    margin-bottom: 1rem;
}

.view-team div.view-content div article h2 {
    display: none;
}

.node--type-teammitglied .field--name-field-vorname {
    background: var(--color-green);
    margin-top: -7rem;
    padding-top: 8rem;
    padding-left: 1rem;
    color: var(--color-blue)
}

.node--type-teammitglied .field--name-field-nachname,
.node--type-teammitglied .field--name-field-e-mail-adresse,
.node--type-teammitglied .field--name-field-beschreibung {
    background: var(--color-green);
    margin-top: -1rem;
    padding-top: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    color: var(--color-blue);
}

.node--type-teammitglied .field--name-field-e-mail-adresse {
    padding-bottom: 1rem;
}

.block-views-blockteam-block-1 li.grid div.grid__content {
    margin-bottom: 2rem;
}

.green .view-id-pressespiegel div.view-content div.views-row {
    border-top: 2px solid var(--color-blue);
    border-left: 1px solid var(--color-blue);
    border-right: 1px solid var(--color-blue);
    margin-bottom: 1rem;

}

.blue .view-id-pressespiegel div.view-content div.views-row {
    border-top: 2px solid var(--color-green);
    border-left: 1px solid var(--color-green);
    border-right: 1px solid var(--color-green);
    margin-bottom: 1rem;

}

.view-id-pressespiegel div.view-content div.views-row>span,
.view-id-pressespiegel div.view-content div.views-row>div {
    padding-left: .75rem;
    padding-right: .75rem;
}

.green .view-id-pressespiegel div.view-content div.views-row div.views-field-title {
    border-top: 1px solid var(--color-blue);
    border-bottom: 1px solid var(--color-blue);
}

.blue .view-id-pressespiegel div.view-content div.views-row div.views-field-title {
    border-top: 1px solid var(--color-green);
    border-bottom: 1px solid var(--color-green);
}

.green .view-id-pressespiegel .views-field-field-datum {
    border-right: 1px solid var(--color-blue);
    padding-right: 1rem;
    float: left;
}

.blue .view-id-pressespiegel .views-field-field-datum {
    border-right: 1px solid var(--color-green);
    padding-right: 1rem;
    float: left;
}

.green .view-id-pressespiegel .views-field-field-organ {
    border-right: 1px solid var(--color-blue);
    padding-right: 1rem;
    margin-right: 1rem;
    display: inline-block;
}

.blue .view-id-pressespiegel .views-field-field-organ {
    border-right: 1px solid var(--color-green);
    padding-right: 1rem;
    margin-right: 1rem;
    display: inline-block;
}

.view-id-pressespiegel h3 a {
    text-decoration: none;
}

.view-id-pressespiegel .views-field-field-pdf {
    float: right;
    margin-top: 4rem;
}

.green .view-id-pressespiegel .views-field-field-pdf a {
    text-decoration: none;
    border: 1px solid;
    border-radius: 70px;
    padding: .45rem 1rem;
    padding-right: 1rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-down-blue.svg);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    padding-right: 4rem;
}

.green .view-id-pressespiegel .views-field-field-pdf a:hover {
    background: url(/themes/custom/konzerte/images/icons/chevron-down-green.svg);
    background-color: var(--color-blue);
    color: var(--color-green);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
}

#main-content .layout-container .green .view-id-pressespiegel .views-field-field-pdf a:hover {
    color: var(--color-green);
}

.blue .view-id-pressespiegel .views-field-field-pdf a {
    text-decoration: none;
    border: 1px solid;
    border-radius: 70px;
    padding: .45rem 1rem;
    padding-right: 1rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-down-green.svg);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    padding-right: 4rem;
}

.blue .view-id-pressespiegel .views-field-field-pdf a:hover {
    background: url(/themes/custom/konzerte/images/icons/chevron-down-blue.svg);
    background-color: var(--color-green);
    color: var(--color-blue);
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
}

#main-content .layout-container .blue .view-id-pressespiegel .views-field-field-pdf a:hover {
    color: var(--color-blue);
}

.block-views-exposed-filter-blockkonzerte-page-1 form#views-exposed-form-konzerte-page-1 div.form--inline div.form-actions {
    display: none;
}

#block-konzerte-views-block-konzerte-block-2 .view-konzerte div.view-content div.views-row div.views-field.views-field-view-node {
    padding: .75rem;
    display: block;
}

.stripe_1 .view-konzerte div.view-content div.views-row div.views-field.views-field-view-node {
    padding: .75rem;
    display: inline-flex;
}

#main-content .layout-container .blue .button a:hover,
#main-content .layout-container .blue .button:hover a {
    color: var(--color-blue);
}

.view-konzerte div.view-content div.views-row div.views-field.views-field-field-event__link {
    margin-right: .75rem;
    margin-top: .75rem;
    margin-bottom: .75rem;
    display: inline-flex;
}

.event-flyer.ticket,
.event-plakat.plakat,
.event-flyer.flyer {
    margin-bottom: 1rem;
}

html {
    scroll-behavior: smooth;
}

a.back-to-top,
a.back-to-top:hover {
    text-decoration: none;
    border: 0px;
}

a.back-to-top img {
    max-width: 80px;
}

main#main-content div.half {
    margin-bottom: 2rem;
}

h3 a {
    text-decoration: none;
}

h4 {
    margin-bottom: 0px;
}

h4+p {
    margin-top: 0px;
}

.flex {
    display: flex;
    flex-wrap: wrap;
}

.flex-1 {
    flex: 1;
}

.flex-2 {
    flex: 2;
}

.qr-code {
    max-width: 220px;
    margin-right: 2rem;
}

.margin-top-0 {
    margin-top: 0px;
}

div#block-konzerte-qrcode div.field--name-body {
    margin-top: 3rem;
    margin-bottom: 2rem;
}

.page-node-type-page div#block-konzerte-content div.slide__content div.media picture img {
    max-width: 1094px;
    margin: 0 auto;
}

div#block-konzerte-views-block-konzerte-block-2 div.view-content div.views-field.views-field-title h3.field-content {
    font-size: 1.5rem;
}

@media (min-width: 1200px) {
    h3 {
        hyphens: none;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    h3 {
        hyphens: auto;
    }
}

@media (min-width: 460px) and (max-width: 767px) {
    h3 {
        hyphens: none;
    }
}

footer p a.button {
    border: 1px solid var(--color-blue);
    border-radius: 70px;
    padding: .5rem 3rem .5rem 1rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-blue.svg);
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    display: inline-block;
    text-align: center;
}

footer p a.button:hover {
    border: 1px solid var(--color-blue);
    border-radius: 70px;
    padding: .5rem 3rem .5rem 1rem;
    background: url(/themes/custom/konzerte/images/icons/chevron-right-white.svg) var(--color-blue);
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    color: white;
    background-size: 12px;
    display: inline-block;
    text-align: center;
}

footer div#block-konzerte-footerlinks div p {
    margin-bottom: 1.5rem;
}

span.addtocal-container.add-to-calendar {
    margin-top: .5rem;
}

div#konzerte .view-konzerte div.view-footer {
    margin-top: 4rem;
}

div.event-flyer.flyer a.button_link,
div.event-plakat.plakat a.button_link,
div.event-toggle.calendar div.addtocal-toggle a.calbutton.button_link,
div.event-link.ticket a.button_link {
    width: auto !important;
    display: block !important;
}

.node--type-teammitglied .field--name-field-beschreibung.clamp {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 3;
    /* gewünschte Zeilen */
}

.node--type-teammitglied .field--name-field-beschreibung.expanded {
    -webkit-line-clamp: none;
}

.node--type-teammitglied .field--name-field-beschreibung .toggle-link {
    cursor: pointer;
    color: #0066cc;
    text-decoration: underline;
    margin-top: 0.5rem;
    display: inline-block;
}

.gap-1 {
    gap: 1rem;
}

div#block-konzerte-footerlinks table a article {
    margin-right: 1rem;
}

div#block-konzerte-footerlinks a.fb {
    display: inline-block;
    width: 48px;
    height: 48px;
    background: url(/sites/default/files/2025-09/facebook.svg) no-repeat center / contain;
    transition: background-image .2s ease;
    text-decoration: none;
    border: none;
}

div#block-konzerte-footerlinks a.fb:hover {
    background: url(/sites/default/files/2025-09/facebook_hover.svg) no-repeat center / contain;
}

div#block-konzerte-footerlinks a.ig {
    display: inline-block;
    width: 48px;
    height: 48px;
    background: url(/sites/default/files/2025-09/instagram.svg) no-repeat center / contain;
    transition: background-image .2s ease;
    text-decoration: none;
    border: none;
}

div#block-konzerte-footerlinks a.ig:hover {
    background: url(/sites/default/files/2025-09/instagram_hover.svg) no-repeat center / contain;
}

div#block-konzerte-footerlinks a.yt {
    display: inline-block;
    width: 48px;
    height: 48px;
    background: url(/sites/default/files/2025-09/youtube.svg) no-repeat center / contain;
    transition: background-image .2s ease;
    text-decoration: none;
    border: none;
}

div#block-konzerte-footerlinks a.yt:hover {
    background: url(/sites/default/files/2025-09/youtube_hover.svg) no-repeat center / contain;
}

span.addtocal-container.add-to-calendar.visible label.addtocal__label {
    display: none;
}

span.addtocal-container.add-to-calendar.visible {
    text-align: center;
    float: none;
}

h3 a:hover {
    border-bottom: 2px solid;
}

div.event-date div.field--name-field-datum-und-uhrzeit span.smart-date--date {
    margin-right: 1rem;
}

.blue fieldset.captcha {
    border: 1px solid var(--color-green) !important;
}

.green fieldset.captcha {
    border: 1px solid var(--color-blue) !important;
}