@charset "UTF-8";
/* CSS-Dokument */

/* @font-face {
    font-family: 'Myriad Apple';
    src: url('fonts/MYRIADAT.TTF') format('truetype');
} */

/* Zentrale Farbfestlegung */
:root {
    /* Add Dark-Mode-Support */
    color-scheme: light dark;
    /* Hauptfarben */
    --ml-basic-color-main: #87a030; /* 2024 alt: #82a008, alt: #31b0d5 */
    --ml-basic-color-main-dark: #87a030; /* 2024 alt: #82a008, alt: #31b0d5 */
    --ml-basic-color-main-background: #f1ecdd; /* 2024 alt: #fdf1e3; alt: #ffffff */
    --ml-basic-color-main-background-dark: #1F1F20;
    --ml-basic-color-main-text: #495057; /* #1F1F20; /* Elemente, die mit Background zusammenhängen */
    --ml-basic-color-main-text-dark: #d7d7d8;
    --ml-basic-color-element-background: #87a030; /* 2024 alt: #82a008, alt: #31b0d5 */
    --ml-basic-color-element-background-dark: #87a030; /* 2024 alt: #82a008, alt: #31b0d5 */
    --ml-basic-color-element-text: #f1ecdd; /* 2024 alt: #fdf1e3; alt: #ffffff */
    --ml-basic-color-element-text-dark: #1F1F20;
    --ml-basic-color-border: #DEE2E6;
    --ml-basic-color-border-dark: #808080;
    --ml-basic-color-card-background: #ffffff;
    --ml-basic-color-card-background-dark: #1F1F20;
    --ml-basic-color-discreet: #777777;
    --ml-basic-color-footer-background: #f1ecdd; /* 2024 alt: #ffecd4; alt: #f5f5f5 */
    --ml-basic-color-footer-background-dark: #303233;
    --ml-basic-color-footer-text: #87a030; /* 2024 alt: #777777 */
    --ml-basic-color-footer-text-dark: #777777;
    --ml-basic-color-listgroup-background: #ffffff;
    --ml-basic-color-listgroup-background-dark: #1F1F20;
    
    /* Elementfarben */
    --ml-color-main: var(--ml-basic-color-main);
    --ml-color-page-background: var(--ml-basic-color-main-background);
    --ml-color-page-text: var(--ml-basic-color-main-text);
    --ml-color-nav-background: var(--ml-basic-color-element-background);
    --ml-color-nav-background-dropdown: var(--ml-basic-color-main-background);
    --ml-color-nav-text: var(--ml-basic-color-element-text);
    --ml-color-h: var(--ml-basic-color-main);
    --ml-color-button-background: var(--ml-basic-color-element-background);
    --ml-color-button-text: var(--ml-basic-color-element-text);
    --ml-color-border: var(--ml-basic-color-border);
    --ml-color-card-background: var(--ml-basic-color-card-background);
    --ml-color-discreet: var(--ml-basic-color-discreet);
    --ml-color-footer-background: var(--ml-basic-color-footer-background);
    --ml-color-footer-text: var(--ml-basic-color-footer-text);
    --ml-color-listgroup-background: var(--ml-basic-color-listgroup-background);
    
    /* Bootstrap-Farben - u.a. für Footer*/
    /* --ml-color-text: #555555; /* bootstrap-farbe*/
    /* --ml-color-text-dezent: #777777; /* bootstrap-farbe*/
    /* --ml-color-border: #dddddd; /* bootstrap-farbe*/
    /* --ml-color-nav-text-x: #9d9d9d; keine Ahnung, für was das war, wird aktuell nicht benutzt*/
}

/* Dark-Mode */

/* Erweiterung Dark-Mode */
.special {
    /* color: var(--special-text-color); */
    /* border: 1px solid var(--border-color); */
}


html {
  position: relative;
  min-height: 100%;
}

body {
    background-color: var(--ml-color-page-background);
    color: var(--ml-color-page-text);
    /*padding-top: 40px; /* damit die Seite nicht unter der nav steht */
    padding-bottom: 80px; /* damit die Seite nicht unter dem footer verschwindet */
}

h1, h2, h3, h4, h5, h6 {
    color: var(--ml-color-h);
}

a:link {
    text-decoration: none; /* Links ohne underline und blau */
}

a:visited {
    text-decoration: none; /* Links ohne underline und blau */
}

.ml-link {
    text-decoration: none; /* Links ohne underline und blau */
    color: var(--ml-basic-color-main);
}

.modal-content {
    background-color: var(--ml-color-page-background);
    color: var(--ml-color-page-text);
}

.card {
    background-color: var(--ml-color-card-background);
    border-color: var(--ml-color-border);
    color: var(--ml-color-page-text);
}

.list-group-item {
    background-color: var(--ml-color-listgroup-background);
    border-color: var(--ml-color-border);
    color: var(--ml-color-page-text);
}


/* Styling für Bilder - Steelbook-Design - ANFANG */
.ml-steelbook {
    /* Rahmen und abgerundete Ecken für das Cover */
    border: 1px solid;
    border-color: #808080;
    border-radius: 1em;
}
/* Styling für Bilder - Steelbook-Design - ENDE */



/* Button anpassen - ANFANG */
.ml-btn-custom {
    background-color: var(--ml-color-button-background);
    color: var(--ml-color-button-text);
}

.ml-btn-custom:focus {
    color: var(--ml-color-button-text);
}

.ml-btn-custom:hover {
    color: var(--ml-color-button-text);
}
/* Button anpassen - ENDE */



/* Button anpassen - ANFANG */
.ml-btn-custom-outline {
    color: var(--ml-color-button-background);
    border-color: var(--ml-color-button-background);
}
/* Button mit Mauseffekt */
.ml-btn-custom-outline:hover {
    background-color: var(--ml-color-button-background);
    color: var(--ml-color-button-text);
}
/* Button anpassen - ENDE */





/* Button-Dropdown anpassen - START */
.ml-btn-dropdown-menu {
    background-color: var(--ml-color-nav-background); /* Hintergrundfarbe Dropdown-Menü */
}

.ml-btn-dropdown-menu a {
    color: var(--ml-color-nav-text); /*Schriftfarbe Text im Dropdown-Menü*/
}

.ml-btn-dropdown-menu a:hover,
.ml-btn-dropdown-menu a:focus,
.ml-btn-dropdown-menu> .active > a:hover,
.ml-btn-dropdown-menu> .active > a:focus,
.ml-btn-dropdown-menu> .open >a {
    color: var(--ml-color-nav-background); /* Textfarbe von Dropdown bei hover; Farbe wechseln Hintergrund - Text */
    background-color: var(--ml-color-nav-background-dropdown);
}
/* Button-Dropdown anpassen - ENDE */



/* Fett und mit Farbe - ANFANG*/
.ml-bold-color {
    color: var(--ml-color-h);
    font-weight: bold;
}
/* Fett und mit Farbe - ENDE*/



/* Formatierung Nummerierung Aufzählung - ANFANG */
.ml-row-num {
    color: var(--ml-color-main);
    font-weight: bold;
}
/* Formatierung Nummerierung Aufzählung - ENDE */



/* Formatierung Row Count - ANFANG */
.ml-row-count {
    color: var(--ml-color-discreet);
    margin-left: 1em;
    margin-bottom: 1em;
}
/* Formatierung Row Count - ENDE */



body > .container {
  padding: 60px 15px 0;
}

.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

code {
  font-size: 80%;
}



/* Summary & Details im Bootstrap-Style - ANFANG*/
/* by Marco Linke */
details { /* zugeklappter Zustand */
    border: 1px solid var(--ml-color-border); /* Rahmenfarbe im Bootstrap-Style */
    border-radius: 5px;
    color: var(--ml-color-page-text); /* Textfarbe im Bootstrap-Style */
    margin-top: 0em;
    margin-right: 0em;
    margin-bottom: 0.5em;
    margin-left: 0em;
    padding-top: 0.8em;
    padding-right: 0.5em;
    padding-bottom: 0.8em;
    padding-left: 1.1em;
}

details[open] {
    /* background: #E1E1E1; */ /* Hintergrundfarbe details bei open */
}
    
summary {
    /* background: -webkit-linear-gradient(top, #FAFAFA 50%, #E1E1E1 50%); */
    border-radius: 5px;
    /* font-weight: bold; */
    cursor: pointer;
    outline: none; /* Entfernt den blauen Rahmen nach expant Klick */
    margin-top: -1%;
    margin-right: -1%;
    margin-bottom: -1%;
    margin-left: -1%;
    padding-top: 0.8em;
    padding-right: 0.3em;
    padding-bottom: 0.8em;
    padding-left: 0.3em;
    position: relative;
    width: 102%;
}
    
summary:hover, details[open] summary {
    /* background: #E1E1E1; */ /* Hintergrundfarbe Summary bei open */
}
    
summary::-webkit-details-marker {
    display: none; /* Standard-Dreieck ausblenden */
}
    
summary:before{
    border-radius: 5px;
    content: "∨"; /* Symbol geschlossen */
    float: right; /* Symbol rechts anzeigen */
    display: block;
    margin-top: 0em;
    margin-right: 0.3em;
    margin-bottom: 0em;
    margin-left: 1em;
    padding-top: 0em;
    padding-right: 0em;
    padding-bottom: 0em;
    padding-left: 0em;
    text-align: center;
    width: 20px;}

details[open] summary {
    padding-bottom: 2em; /* Details aufgeklappt, Abstand nach dem Summary */
}

details[open] summary:before {
    content: "∧"; /* Symbol offen */
    float: right; /* Symbol rechts anzeigen */
    margin-top: 0em;
    margin-right: 0.3em;
    margin-bottom: 0em;
    margin-left: 1em;
    padding-top: 0em;
    padding-right: 0em;
    padding-bottom: 0em;
    padding-left: 0em;
}
/* Summary & Details - ENDE */



/* Umstyling NAV - ANFANG */
.ml-navbar {
    background-color: var(--ml-color-nav-background); /* Hintergrundfarbe Navbar */
    color: var(--ml-color-nav-text); /* Schriftfarbe Navbar */
    border-radius:0; /* nicht abgerundet */
}

.ml-navbar .navbar-nav > li > a {
    color: var(--ml-color-nav-text); /* Schriftfarbe navbar Hauptzeile */
    outline: none; /* Entfernt den blauen Rahmen nach expant Klick */
}

.ml-navbar .navbar-nav > .active > a {
    color: var(--ml-color-nav-text);
    background-color:transparent;
}

.ml-navbar .navbar-nav > li > a:hover,
.ml-navbar .navbar-nav > li > a:focus,
.ml-navbar .navbar-nav > .active > a:hover,
.ml-navbar .navbar-nav > .active > a:focus,
.ml-navbar .navbar-nav > .open >a {
    text-decoration: none;
    background-color: var(--ml-color-nav-background); /* Textfarbe von Dropdown; Farbe wechseln Hintergrund - Text */
}

.ml-navbar .navbar-brand {
    color: var(--ml-color-nav-text); /* Schriftfarbe Nav-Brand-Text */
    /* font-size: 26px; */
}

.ml-navbar .navbar-toggler {
    background-color: transparent; /* Hintergrundfarbe der drei Striche - Mobile Ansicht */
}

.ml-navbar .navbar-toggler-icon {
    color: var(--ml-color-nav-text); /* Farbe der drei Striche - Mobile Ansicht */
}

.ml-navbar .nav-item .dropdown-menu {
    background-color: var(--ml-color-nav-background); /* Hintergrundfarbe Dropdown-Menü */
}

.ml-navbar .nav-item .dropdown-header {
    color: var(--ml-color-nav-text); /*Schriftfarbe Überschriften im Dropdown-Menü*/
}

.ml-navbar .nav-item .dropdown-divider {
    border-color: var(--ml-color-nav-text); /* Farbe des Trenners */
}

.ml-navbar .nav-item .dropdown-menu a {
    color: var(--ml-color-nav-text); /*Schriftfarbe Text im Dropdown-Menü*/
}

.ml-navbar .nav-item .dropdown-menu a:hover,
.ml-navbar .nav-item .dropdown-menu a:focus,
.ml-navbar .nav-item .dropdown-menu > .active > a:hover,
.ml-navbar .nav-item .dropdown-menu > .active > a:focus,
.ml-navbar .nav-item .dropdown-menu > .open >a {
    color: var(--ml-color-nav-background); /* Textfarbe von Dropdown bei hover; Farbe wechseln Hintergrund - Text */
    background-color: var(--ml-color-nav-background-dropdown);
}
/* Umstyling NAV - ENDE */





/* Footer - ANFANG */
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px;
  background-color: var(--ml-color-footer-background);
}

.container .text-muted {
    margin: 20px 0;
}

.footer > .container {
    padding-right: 15px;
    padding-left: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.text-muted {
    color: var(--ml-color-footer-text);
}

.text-muted a:link {
    text-decoration: none; /* Links ohne underline und blau */
    color: var(--ml-color-footer-text);
}

.text-muted a:visited {
    text-decoration: none; /* Links ohne underline und blau */
    color: var(--ml-color-footer-text);
}

.text-footer {
    color: var(--ml-color-footer-text);
}

.text-footer a:link {
    text-decoration: none; /* Links ohne underline und blau */
    color: var(--ml-color-footer-text);
}

.text-footer a:visited {
    text-decoration: none; /* Links ohne underline und blau */
    color: var(--ml-color-footer-text);
}

/* Footer - ENDE */


/* Farben für freie/gebuchte Events */
.ml-event-red {
    color: red;
}

.ml-event-green{
    color: green;
}