.kurz-marke {
    white-space: nowrap;         /* Verhindert Zeilenumbruch */
    overflow: hidden;            /* Versteckt überlaufenden Text */
    text-overflow: ellipsis;     /* Fügt (...) hinzu */
    display: block;              /* Stellt sicher, dass es sich wie ein Block verhält */
    max-width: 80%;            /* Passe die Breite an, z.B. 200px oder einen Prozentwert */
    /* Optional: Wenn der Platz knapp wird, soll es kleiner werden */
    /* @media (max-width: 768px) {
        max-width: 150px;
    } */
}



.panel-default > .panel-heading {

  color: #fff;
    background-color: blue;
    background-image: linear-gradient(to bottom,blue 0, darkblue 100%);
  }



/* Galerie */
#motnie_galerie ul,
#motnie_galerie li {
	margin: 0.5em;
	padding: 0.1em;
}

#motnie_galerie li {
	display: inline-block;
	list-style-type: none;
    width: 45%; /* prüfen */
    width: 10em;
}

#motnie_galerie img {
	padding: 0;
	margin: 0;
   /* width: 100%;  /* Bild passt sich an verfügbaren Raum im li an */
   height: auto;
   max-width: 90%;


}

/* Galerie ende*/




/*Termine */
.termine1
{
     background-color: #eeeeee;


    margin-right: 0px;
    margin-left: 0px;

    padding-top: 5px;
    padding-bottom: 5px;

    border-bottom:  solid 0px black;


}

.termine2
{
     background-color: #ffffff;
    margin-right: 0px;
    margin-left: 0px;


    padding-top: 5px;
    padding-bottom: 5px;

    border-bottom:  solid 0px black;


}

.monatsbalken
{
    margin-left: 0px;
    margin-right: 0px;
    padding-top: 5px;
    padding-bottom: 5px;

    background-color: blue;
    color: white;
}

/* eigene Termine Hervorheben */

.deggendorf .titel_termin a{

  color: blue;
}

.deggendorf .titel_termin {

  color: blue;
}


/* eigene Termine Hervorheben */

.veranstalter_1 .titel_termin a{

  color: blue;
}

.veranstalter_1 .titel_termin {

  color: blue;
}
/*Termine ende*/


.theme-showcase img
{

    height: auto;
    max-width: 90%;
}

.bild img
{
  height: auto !important;
  width: 50px !important;
  max-width: 50px !important;
  min-width: 50px !important;
}


#JUMBO {
  position: relative;
  background-image: url("../oben1.jpg?v=2");
  background-size: contain ;
  background-repeat: no-repeat;
  margin: 0px;
  padding: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  background-position:bottom ;
  padding-bottom: 24.7916%;
}

.jumbo_1
{
  background-image: url("../oben1.jpg?v=3") !important;
}

.jumbo_2
{
    background-image: url("../oben2.jpg?v=3") !important;
}

.jumbo_3
{
    background-image: url("../oben3.jpg?v=3") !important;
}
.jumbo_4
{
  background-image: url("../oben4.jpg?v=3") !important;
}

.jumbo_5
{
    background-image: url("../oben5.jpg?v=3") !important;
}

.jumbo_6
{
    background-image: url("../oben6.jpg?v=3") !important;
}




body {
	/* background: #eeeeee; */
}

.theme-showcase{
	padding-top: 40px;
	/*background: #ffffff; */

	/* background: #eeeeee; */
}


#fusszeile2 {
	padding: 25px;

}

#fusszeile a {

color: #FFFFFF;

}

.logo-fusszeile {
	padding: 25px;

}


.navbar {
  margin-bottom: 0px;
  }

/* navbar*/

:root {

    /*
    --navbar-haupt-bg: #f57c00;
    --navbar-rahmenfarbe: #ef6c00;
    --navbar-textfarbe: #ffffff;
    --navbar-textfarbe2: #333333; /* dunkler Text für Dropdowns
    --navbar-textfarbe3: #000000; /* noch dunklerer Text für Hover
    --navbar-helle-farbe: #fff3e0;
    --navbar-helle-farbe2:#ffe0b2;
    --navbar-dunkle-farbe: #e65100;
    --navbar-handy-bg: #ffffff;
    */

    --navbar-haupt-bg: blue  ;
    --navbar-rahmenfarbe: darkblue;
    --navbar-textfarbe: #ffffff;
    --navbar-textfarbe2: #333333; /* dunkler Text für Dropdowns */
    --navbar-textfarbe3: #000000; /* noch dunklerer Text für Hover */
    --navbar-helle-farbe: #BEFCFF;
    --navbar-helle-farbe2: #BEFCFF;
    --navbar-dunkle-farbe: royalblue;
    --navbar-handy-bg: #ffffff;
    --navbar-submenu-bg: #ffffff;
}


/* Motnie Navbar Balken*/
.navbar-motnie {
    background-color: var(--navbar-haupt-bg);   /* Haupt-Farbe */
    background-image: linear-gradient(to bottom,var(--navbar-haupt-bg) 0,var(--navbar-rahmenfarbe) 100%);
    border-color: var(--navbar-rahmenfarbe);
}

/* Menü-Links */
.navbar-motnie .navbar-nav > li > a {
    color: var(--navbar-textfarbe);
}

/* Hover im Menübalken */
.navbar-motnie .navbar-nav > li > a:hover,
.navbar-motnie .navbar-nav > li > a:focus {
    background-color: var(--navbar-rahmenfarbe);
    color: var(--navbar-textfarbe);
}

/* Brand (Titel links) */
.navbar-motnie .navbar-brand {
    color: var(--navbar-textfarbe);
}

.navbar-motnie .navbar-brand:hover,
.navbar-motnie .navbar-brand:focus {
    color: var(--navbar-helle-farbe);
}


/* Toggle Button (Mobile) */
.navbar-motnie .navbar-toggle {
    border-color: var(--navbar-textfarbe);
}

.navbar-motnie .navbar-toggle .icon-bar {
    background-color: var(--navbar-textfarbe);
}

/* =====================================
   SUBMENÜ – HARTES OVERRIDE
   ===================================== */

/* 1. Untermenü */
.navbar-motnie .dropdown-menu {
    background-color: var(--navbar-submenu-bg);
    border: 1px solid var(--navbar-rahmenfarbe);
}

/* Submenü-Container */
.navbar-motnie .dropdown-submenu > .dropdown-menu {
    background-color: var(--navbar-submenu-bg);
    border: 1px solid var(--navbar-rahmenfarbe);
    margin-top: -1px;
}

/* Alle Submenülinks */
.navbar-motnie .dropdown-menu > li > a {
    color: var(--navbar-textfarbe2);
    background-color: transparent;
}


/* ===============================
   SUBMENU-PFEIL (SEHR WICHTIG)
   =============================== */
/* Pfeilfarbe Standard Submenü*/
.navbar-motnie .dropdown-submenu > a:after {
    /* border-left-color: var(--navbar-haupt-bg) !important; */
    border-left-color: black !important;
}

/* Pfeilfarbe Hover Submenüs */
.navbar-motnie .dropdown-submenu:hover > a:after {
    border-left-color: var(--navbar-textfarbe3) !important;
}

/* Trennlinie im Submenü */
.navbar-motnie .dropdown-menu .divider {
    background-color: var(--navbar-rahmenfarbe);
}

/* geöffneter Menüpunkt im Balken */
.navbar-motnie .nav .open > a,
.navbar-motnie .nav .open > a:hover,
.navbar-motnie .nav .open > a:focus {
    background-color: var(--navbar-dunkle-farbe);
    color: var(--navbar-textfarbe);
}

/* 2. Submenü-Ebene in Navbar Hover */
.navbar-motnie .dropdown-submenu .dropdown-menu > li > a:hover,
.navbar-motnie .dropdown-submenu .dropdown-menu > li > a:focus {
    background-color: var(--navbar-helle-farbe);
    background-image: linear-gradient(to bottom,var(--navbar-helle-farbe) 0,var(--navbar-helle-farbe) 100%);
    color: var(--navbar-textfarbe3);
}

/* 1. Submenü-Ebene in Navbar Hover */
.navbar-motnie .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-motnie .navbar-nav > li > .dropdown-menu > li > a:focus {
    background-color: var(--navbar-helle-farbe);
    background-image: linear-gradient(to bottom, var(--navbar-helle-farbe) 0%, var(--navbar-helle-farbe) 100%);
    color: var(--navbar-textfarbe3);
}

/* Aktiver Menüpunkt in den Submenüs */
.navbar-motnie .dropdown-menu > .active > a,
.navbar-motnie .dropdown-menu > .active > a:hover,
.navbar-motnie .dropdown-menu > .active > a:focus {
    background-color: var(--navbar-dunkle-farbe) !important;
    background-image: linear-gradient(to bottom, var(--navbar-dunkle-farbe) 0%, var(--navbar-dunkle-farbe) 100%)!important;
    color: var(--navbar-textfarbe) !important;
}

/* Aktiver Menüpunkt im Balken*/
.navbar-motnie .navbar-nav > .active > a,
.navbar-motnie .navbar-nav > .active > a:hover,
.navbar-motnie .navbar-nav > .active > a:focus {
    background-color: var(--navbar-dunkle-farbe) !important;
    color: var(--navbar-textfarbe) !important;
}

@media (max-width:767px) {

    /* Navbar-Balken bleibt kräftig */
    .navbar-motnie {
       background-color: var(--navbar-haupt-bg);
    }

    /* =====================================
    MOBILE: WEISSER COLLAPSE + LESBARE MENÜS
    ===================================== */

    /* Weißer Hintergrund mit Schatten beim Aufklappen */
    .navbar-motnie .navbar-collapse {
        background-color: var(--navbar-handy-bg);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
    }

    /* 1. Menüebene – Text wieder dunkel */
    .navbar-motnie .navbar-nav > li > a {
        color: var(--navbar-textfarbe2);
    }


    /* Ebene 2 Schatten hinzufügen zur Abgrenzung*/
    .navbar-motnie .navbar-nav > li > .dropdown-menu {

        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
    }

    /* Submenü-Struktur statt Farbe */
    .navbar-motnie .dropdown-submenu > .dropdown-menu {
        border-left: 5px solid var(--navbar-rahmenfarbe);
        margin-left: 10px;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08) !important;
    }

    /* =====================================
    MOBILE: EINRÜCKUNG  DER SUBMENÜS
    ===================================== */

    /* Ebene 2 einrücken */
    .navbar-motnie .navbar-nav > li > .dropdown-menu > li > a {
        padding-left: 30px;
    }

    /* Ebene 3 */
    .navbar-motnie .dropdown-submenu > .dropdown-menu > li > a {
        padding-left: 45px;
    }

    /* Ebene 4 (falls vorhanden) */
    .navbar-motnie .dropdown-submenu .dropdown-submenu > .dropdown-menu > li > a {
        padding-left: 60px;
    }

    /* Ebene 5 (falls vorhanden) */
    .navbar-motnie .dropdown-submenu .dropdown-submenu .dropdown-submenu> .dropdown-menu > li > a {
        padding-left: 75px;
    }

        /* Sehr dezenter Hover / Fokus */
    .navbar-motnie .navbar-nav > li > a:hover,     /* Hover / Fokus 1. Ebene */
    .navbar-motnie .navbar-nav > li > a:focus,
    .navbar-motnie .dropdown-menu > li > a:hover,
    .navbar-motnie .dropdown-menu > li > a:focus {
        background-color: var(--navbar-helle-farbe);
        color: var(--navbar-textfarbe3);
    }

    /* Aktiver Menüpunkt (mobil zurückhaltend) */
    .navbar-motnie .navbar-nav > li > a:hover
    .navbar-motnie .navbar-nav > li > a:focus,
    .navbar-motnie .nav .open > a,
    .navbar-motnie .nav .open > a:hover,
    .navbar-motnie .nav .open > a:focus,
    .navbar-motnie .navbar-nav .open .dropdown-menu>.active>a,
    .navbar-motnie .navbar-nav .open .dropdown-menu>.active>a:focus,
    .navbar-motnie .navbar-nav .open .dropdown-menu>.active>a:hover,
    .navbar-motnie .navbar-nav > .active > a, /* Aktiver Punkt 1. Ebene */
    .navbar-motnie .navbar-nav > .active > a:hover,
    .navbar-motnie .navbar-nav > .active > a:focus,
    .navbar-motnie .dropdown-menu > .active > a,
    .navbar-motnie .dropdown-menu > .active > a:hover,
    .navbar-motnie .dropdown-menu > .active > a:focus {
        background-color: var(--navbar-helle-farbe2) !important;   /* leicht stärker, aber dezent */
        background-image: linear-gradient(to bottom, var(--navbar-helle-farbe2) 0%, var(--navbar-helle-farbe2) 100%) !important;
        color: var(--navbar-textfarbe3)!important;
        font-weight: 600;
    }

/* =====================================
   MOBILE: BOOTSTRAP-CARETS DREHEN
   ===================================== */

    /* Caret Grundzustand */
    .navbar-motnie .caret {
        transition: transform 0.2s ease;
        transform: rotate(-90deg);
        margin-left: 6px;
        opacity: 0.6;
        border-width: 5px 5px 0;
    }

    /* Geöffnet → Caret nach unten drehen */
    .navbar-motnie .dropdown.open > a .caret,
    .navbar-motnie .dropdown-submenu.open > a .caret {
        transform: rotate(0deg);
        opacity: 0.9;
    }

    /* Pfeil für Submenü nach unten drehen wenn offen */
    .dropdown-submenu.open > a:after {
        transform: rotate(90deg);
    }
}

/* Fußzeile */

#fusszeile {
    /* background-color: blue; */
    background-image: linear-gradient(to bottom,var(--navbar-haupt-bg) 0,var(--navbar-rahmenfarbe) 100%);
        background-image: linear-gradient(to bottom,var(--navbar-rahmenfarbe) 0,var(--navbar-haupt-bg) 100%);
    color: #FFFFFF;
    padding: 25px;
}