@charset "UTF-8";
/* open-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans Regular";
  font-style: normal;
  font-weight: 400;
  src: url("../Fonts/open-sans-v44-latin-regular.woff2") format("woff2"), url("../Fonts/open-sans-v44-latin-regular.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* open-sans-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Open Sans Bold";
  font-style: normal;
  font-weight: 600;
  src: url("../Fonts/open-sans-v44-latin-600.woff2") format("woff2"), url("../Fonts/open-sans-v44-latin-600.ttf") format("truetype"); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: "Quorum";
  font-style: normal;
  font-weight: normal;
  src: url("../Fonts/quorum.woff2") format("woff2");
}
/*
Sass function and mixin to use rem units with optional pixel fallback.
(https://github.com/pierreburel/sass-rem)

IT License

Copyright (c) 2017 Pierre Burel

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/
/*
You can totally disable rem units by setting $rem-px-only to true (for a lt-ie9 only stylesheet for example).

------- Pixel Fallback (zuerst px Wert, dann rem Wert in CSS) --------------------------
$rem-fallback: true;

.demo {
  @include rem(font-size, 24px); // Simple
  @include rem(padding, 5px 10px); // Multiple values
  @include rem(border-bottom, 1px solid black); // Multiple mixed values
  @include rem(box-shadow, 0 0 2px #ccc, inset 0 0 5px #eee); // Comma-separated values
  // Multiple properties
  @include rem((
    margin: 10px 5px,
    text-shadow: (1px 1px #eee, -1px -1px #eee) // Parentheses needed because of comma
  ));
}
*/
body {
  font-family: "Open Sans Regular", Helvetica, Arial, sans-serif;
}

legend, strong {
  font-family: "Open Sans Bold", Helvetica, Arial, sans-serif;
}

h3, h2, h1 {
  font-family: "Quorum", "Open Sans Bold", Helvetica, Arial, sans-serif;
}

body {
  font-size: 14px;
  font-size: 0.875rem;
}
@media (max-width: 576px) {
  body {
    font-size: 13px;
    font-size: 0.8125rem;
  }
}

a {
  color: #891813;
  text-decoration: none;
}
a:hover, a:visited, a:active, a:focus {
  color: #891813;
  text-decoration: underline;
}

/* Überschriften */
.frame-layout-400 h1:after, .frame-layout-400 h2:after {
  display: block;
  content: "";
  width: 60px;
  height: 2px;
  margin-top: 2px;
  background-color: #891813;
}

h1 {
  color: #891813;
}
@media (max-width: 576px) {
  h1 {
    font-size: 24px;
    font-size: 1.5rem;
  }
}

h2 {
  color: #891813;
}
@media (max-width: 576px) {
  h2 {
    font-size: 20px;
    font-size: 1.25rem;
  }
}

h3 {
  font-size: 20px;
  font-size: 1.25rem;
  color: #444444;
}

.ce-headline-center {
  text-align: center;
}

img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.darken {
  filter: brightness(50%);
}

nav ul {
  margin: 0;
  padding: 0;
}
nav ul li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mainContent .frame, .frame-type-grid .frame {
  margin-bottom: 30px;
}
@media screen and (min-width: 992px) {
  .mainContent .frame, .frame-type-grid .frame {
    margin-bottom: 60px;
  }
}
.mainContent .frame-none, .frame-type-grid .frame-none {
  margin-bottom: 0;
}

/* Hellgrüner Hintergrund bei CE-Elementen / Container-Elementen */
.frame-bg-lightgreen, .frame-layout-100 {
  padding: 20px 0;
}
@media (min-width: 992px) {
  .frame-bg-lightgreen, .frame-layout-100 {
    padding: 60px 0;
  }
}

.ce-bodytext table, .ce-bodytext tr, .ce-bodytext td {
  border: none;
}
.ce-bodytext .contenttable {
  background-color: transparent !important;
}
.ce-bodytext td {
  padding-bottom: 8px;
  vertical-align: top;
}
.ce-bodytext td:first-of-type {
  padding-right: 10px;
  padding-bottom: 3px;
  white-space: nowrap;
}

.btn {
  border: none;
  border-radius: 0;
  background-color: #891813;
  color: white;
  padding: 15px 25px;
}
.btn:hover, .btn:active, .btn:focus {
  background-color: #444444;
  text-decoration: none;
}
.btn:visited {
  color: white;
}

.page-max-width, .frame-pageMaxWidth {
  max-width: 1440px;
  margin: 0 3%;
}
@media (min-width: 1200px) {
  .page-max-width, .frame-pageMaxWidth {
    margin: 0 5%;
  }
}
@media (min-width: 1600px) {
  .page-max-width, .frame-pageMaxWidth {
    max-width: 1440px;
    margin: 0 auto;
  }
}
@media (min-width: 1600px) {
  .frame-layout-300 {
    padding-left: 6rem;
    padding-right: 6rem;
  }
}

/* ------------------------------------------------------------------------------- */
#mainFooter {
  /* *******************************  Footer Upper Area ****************************************  */
  /* *******************************  Footer Main Area ****************************************  */
  /* *******************************  Footer Lower Area ****************************************  */
}
#mainFooter .footer-upper {
  background-color: #444444;
  color: white;
}
#mainFooter .footer-upper h4 {
  color: white;
}
#mainFooter .footer-upper .footer-upper-inner .col-12 {
  margin-bottom: 30px;
  margin-bottom: 1.875rem;
}
#mainFooter .footer-upper .footer-upper-inner .logo-footer {
  background-color: white;
  max-width: 240px;
  padding: 0 20px 20px;
  padding: 0 1.25rem 1.25rem;
}
@media (min-width: 992px) {
  #mainFooter .footer-upper .footer-upper-inner .col-12 {
    margin-bottom: 0;
    padding-top: 30px;
    padding-top: 1.875rem;
    padding-bottom: 30px;
    padding-bottom: 1.875rem;
  }
  #mainFooter .footer-upper .footer-upper-inner .col-12:first-of-type {
    padding-top: 0;
  }
  #mainFooter .footer-upper .footer-upper-inner .col-12:last-of-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
  }
}
#mainFooter .footer-main {
  padding: 20px 0;
  padding: 1.25rem 0;
}
#mainFooter .footer-main h4 {
  margin-bottom: 15px;
}
#mainFooter .footer-main h4:after {
  display: block;
  content: "";
  width: 20%;
  height: 2px;
  margin-top: 8px;
}
#mainFooter .footer-main a, #mainFooter .footer-main a:visited, #mainFooter .footer-main a:active, #mainFooter .footer-main a:focus {
  color: #891813;
}
#mainFooter .footer-main a:hover, #mainFooter .footer-main a:visited:hover, #mainFooter .footer-main a:active:hover, #mainFooter .footer-main a:focus:hover {
  text-decoration: none;
}
#mainFooter .footer-main nav ul li {
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}
#mainFooter .footer-main address {
  margin: 0;
}
#mainFooter .footer-main .col-12 {
  margin-bottom: 30px;
  margin-bottom: 1.875rem;
}
#mainFooter .footer-lower {
  background-color: #f4f2ef;
  color: #444444;
  font-size: 0.93em;
  padding: 15px;
  padding: 0.9375rem;
}
#mainFooter .footer-lower nav ul li {
  border-right: 1px solid #050505;
  padding: 0 8px;
  padding: 0 0.5rem;
}
#mainFooter .footer-lower nav ul li:last-of-type {
  border-right: none;
}
#mainFooter .footer-lower a, #mainFooter .footer-lower a:visited, #mainFooter .footer-lower a:active, #mainFooter .footer-lower a:focus {
  color: #050505;
  text-decoration: none;
}
#mainFooter .footer-lower .col-12 {
  margin-bottom: 10px;
  margin-bottom: 0.625rem;
}
#mainFooter .footer-upper {
  color: white;
}

/*!
 * Copyright (c) 2026. Oliver Haßler, Kreativoli Mediendesign
 */
.border-4 {
  border: 4px solid #f4f2ef;
  padding: 10px;
  padding: 0.625rem;
  margin-bottom: 10px;
  margin-bottom: 0.625rem;
}
@media (min-width: 992px) {
  .border-4 {
    padding: 30px;
    padding: 1.875rem;
    margin-bottom: 35px;
    margin-bottom: 2.1875rem;
  }
}

.notice-text {
  padding: 15px 8px;
  padding: 0.9375rem 0.5rem;
  margin-bottom: 10px;
  margin-bottom: 0.625rem;
}
@media (min-width: 992px) {
  .notice-text {
    max-width: 80%;
    padding: 30px 15px;
    padding: 1.875rem 0.9375rem;
    margin-bottom: 20px;
    margin-bottom: 1.25rem;
  }
}

legend {
  font-size: 18px;
  font-size: 1.125rem;
}

form .form-group {
  margin-bottom: 15px;
  margin-bottom: 0.9375rem;
  padding: 15px;
  padding: 0.9375rem;
  background-color: #f4f2ef;
  /* Der äußere Container */
  /* Checkbox unsichtbar machen */
  /* Der Hintergrund / die Schiene */
  /* Der runde Knauf des Schalters */
  /* Standard-Standardtext (AUS) */
  /* Zustand: AKTIVIERT (EIN) */
  /* Text zu "EIN" ändern und nach links verschieben */
}
form .form-group .control-label {
  display: none;
}
form .form-group label {
  margin-bottom: 15px;
  margin-bottom: 0.9375rem;
}
form .form-group input {
  border: none;
  border-bottom: 1px solid #444444;
  background-color: #f4f2ef;
  width: 100%;
  height: 35px;
  border-radius: 0;
}
form .form-group input:focus {
  background-color: white;
  border-bottom: 1px solid #050505;
}
form .form-group .switch {
  position: relative;
  display: inline-block;
  width: 75px;
  height: 34px;
  margin-bottom: 0;
}
form .form-group .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
form .form-group .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #444444;
  transition: 0.4s;
  border-radius: 34px;
}
form .form-group .slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  transition: 0.4s;
  border-radius: 50%;
}
form .form-group .slider:after {
  content: "Nein";
  position: absolute;
  color: white;
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
  top: 9px;
  right: 10px; /* Rechts platziert, wenn AUS */
  transition: 0.4s;
}
form .form-group input:checked + .slider {
  background-color: #4CAF50; /* Grüner Hintergrund für EIN */
}
form .form-group input:checked + .slider:before {
  transform: translateX(41px);
}
form .form-group input:checked + .slider:after {
  content: "Ja";
  left: 12px; /* Links platziert, wenn EIN */
  right: auto;
}
@media (min-width: 992px) {
  form .form-group {
    margin-bottom: 25px;
    margin-bottom: 1.5625rem;
    padding: 25px;
    padding: 1.5625rem;
  }
}

/* ==========  Veranstaltungsblock ============ */
@media (min-width: 992px) {
  /* Macht das Accordion auf großen Bildschirmen zur echten Tabelle */
  #ticketAccordion {
    display: table !important;
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 8px !important; /* 0px horizontal, 8px vertikaler Abstand */
  }
  /* Erzwingt, dass die Zeilen die volle Breite des Elternelements einnehmen */
  #ticketAccordion .d-lg-table-row {
    display: table-row !important;
    width: 100% !important;
  }
  /* KORREKTUR: Verhindert, dass das Collapse-Div die Spalten auf 50% staucht */
  #ticketAccordion .accordion-collapse {
    display: table-row !important;
    width: 100% !important;
  }
  /* Schaltet die Mobil-Animation auf Desktop komplett ab */
  #ticketAccordion .accordion-collapse.collapse:not(.show),
  #ticketAccordion .accordion-collapse.collapsing {
    display: table-row !important;
    transition: none !important;
    height: auto !important;
  }
  /* Cards auf Desktop als Tabellenzeilen-Wrapper neutralisieren */
  #ticketAccordion .card {
    display: table-row-group !important; /* Bettet die Card sauber in die Table-Struktur ein */
    border: none !important;
    background: transparent !important;
  }
  /* HIER PASSIERT DIE MAGIE FÜR DIE ZEILEN */
  #ticketAccordion .card-body {
    background-color: #f4f2ef !important; /* Ihr dezenter Hintergrund (z. B. Bootstrap light-gray) */
    /* Oben und unten ein weißer Rahmen, der wie ein Abstand (Margin) wirkt */
    border-top: 4px solid #ffffff !important;
    border-bottom: 4px solid #ffffff !important;
  }
  /* Dezente Trennlinien zwischen den Tabellenzeilen */
}
.typo3-messages li {
  list-style: none;
}

.accordion-button:not(.collapsed) {
  color: #891813 !important;
}
.form-group {
  margin-bottom: 25px;
  margin-bottom: 1.5625rem;
  padding: 25px;
  padding: 1.5625rem;
  background-color: #f4f2ef;
}

.bg-light {
  background-color: #f4f2ef !important;
}

/*# sourceMappingURL=layout.css.map */