body {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
    border: thin solid #68A225;
}

.container-header {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: "logo nav";
    background-image: url("../../../../../images/headers/HintergrundlogoAGB3.gif");
    background-repeat: no-repeat;
    min-height: 130px;
}
.container-header .container-topbar {
    padding: .5em;
}
.container-header .container-topbar {
    grid-area: top;
}
.container-header .container-below-top {
    grid-area: below;
    justify-content: flex-end;
}
.container-header .grid-child:has(.navbar-brand) {
    grid-area: logo;
    justify-content: flex-start;
    padding: 0;
}

.container-header .container-nav {
    grid-area: nav;
    justify-content: flex-end;
    align-items: flex-start;
    padding-top: 2em;
}

.metismenu.mod-menu .mm-collapse {
 color: #000;
 background-color: rgb(204, 255, 204);
 font-size: 1.2rem;
 flex: unset;
}

.metismenu.mod-menu .mm-collapse .metismenu-item a {
    color: #000;
}

.container-header .navbar-toggler {
 color:  #265C00;
 border: 2px solid #265C00;
}

@media (width >= 991.98px) {
    .container-header {
        grid-template-columns: 
            [full-start] minmax(0,1fr) 
            [main-start] repeat(4,minmax(0,19.875rem))
            [main-end] minmax(0,1fr)[full-end];
        grid-template-areas: ". logo nav nav nav.";
        gap: 0 2rem;
    }
    .container-header:has(.container-below-top, .container-topbar) {
        grid-template-areas: ". top top below below ." 
                             ". logo nav nav nav .";
    }
}

.lupe {
  width: 1em;
}

.myfooter li {
  float: left;
}
.footer .grid-child {
  padding: 0;
  justify-content: center;
}

.randr.item-image {
  padding-right: .5em;
  max-width: 40%;
}

.kleines_bild {
  max-width: 160px;
}


.boxed {
  max-width: 100%;
}

.blog h1 {
  font-weight: 300;
}

.spalte-re {
  color: #68A225;
  background-color: white;
  padding: .4em;
}

.card-header {
  color: #265C00;
background-color: #ccffcc;
}

.moduletable {
  color: #265C00;
  background-color: white;
}
.mod-articles-link  {
  color: #68A225;
}

/* noch nötig?  */
.altenachrichten ul,li {font-size: 18px; line-height: 1.5;}


/*<!-- Für Galerieübersichten -->*/
#galerie_raster img {
	float: left;
	margin: 5px;
	border-color: black;
	border-style: solid;
	border-width: 1px;
	width: 200px;
}


/*<!-- Exklusives Akkordeon für Menu -->*/

#klappe {
	max-width: 300px;
	display: block;
	align-items: start;
}
details {
	border: thin solid gainsboro;
	transition: all .5s;
	color:#333;
}

details a {
	color:#333;
	text-decoration: none;
}
details a:hover {
	color:#333;
	text-decoration: underline;
}

summary {
	position: relative;
	line-height: 300%;
	padding-left: 0;
}

summary::marker,
summary::-webkit-details-marker {
	color: transparent;
}

summary::after {
	position: absolute;
	top: 0;
	right: 1em;
	content: '+';
	font-size: 1em;
	font-weight: bold;
	color: green;
	transition: transform .2s;
}

details[open] summary::after {
	transform: rotate(45deg);
	color: red;
}

details[open] summary {
	background: #DBFFB2FF;
}

#klappe .content a {
	padding: .5em;
	color:black;
	font-size: 14px;
	text-decoration: none;
}

#klappe .content a:hover {
	padding: .5em;
	color:black;
	font-size: 14px;
	text-decoration: underline;
}	

#klappe .content ul li {
	list-style-type: none;
  /*
    margin-left: -18px;   es gibt einen Konflikt mit den Listen bei Bäume durch eine direktformatierung eines HTML-Elements zu Beginn der bilderloesen Liste */
    width: 200px;
}

/*<!-- ENDE - Exklusives Akkordeon für Menu -->*/


/* Spezielle Listen für Baumtabelle */
.baumtabelle ul {
     list-style-type: none;
     padding-left: .5em;
}
/*
.baumtabelle li:first-child {
    margin-left: -1em;
}
*/
.baumtabelle li:first-child:before {
    content: "Rang: ";
    font-weight: bold;
}

.baumtabelle li:nth-child(3):before {
    content: "lat.: ";
}
.baumtabelle li:nth-child(4):before {
    content: "Pflanzjahr: ";
}
.baumtabelle li:nth-child(5):before {
    content: "Höhe: ";
}
.baumtabelle li:nth-child(5):after {
    content: " m";
}
.baumtabelle li:nth-child(6):before {
    content: "Holzmenge: ";
}
.baumtabelle li:nth-child(6):after {
    content: " m³";
}


/*Das Label #artikel stellt die Grundformatierung in Nachrichtenartikeln (Aktuelles) dar*/
#artikel p {
	font-size: 18px;
	line-height: 1.5;
}
#artikel a {
	text-decoration: underline;
}
#artikel a:focus {
	background-color: #265C00FF;
	color: white;
	}
#artikel a:hover {
	background-color: #265C00FF;
	color: white; 
}


#artikel h1 {
	line-height: 1.5;
	font-size: 36px;
	margin-bottom: 15px;
	color: #265C00FF;
}
#artikel h2 {
	line-height: 1.5;
	font-size: 28px;
	margin-bottom: 10px;
	color: #265C00FF;
}

#artikel figcaption {
margin: 5px 10px 0px 0px ;
font-style: italic;
font-size: 10pt;
line-height: 1.5;
}



/*Sonderformatierung für Bluetenartikel aus alterbotgarten.de*/

#bluetenartikel p,a {
	font-size: 18px;
	line-height: 1.5;
}
#bluetenartikel .imgLeft {
	float: left;
	margin: 0px 30px 30px 0px;
}
#bluetenartikel h1 {
	line-height: 1.5;
	font-size: 28px;
	margin-bottom: 15px;
}
#bluetenartikel p {
	clear: both;
	margin: 10px 0px 5px 0px;
}

#bluetenartikel li {
    font-size: 18px;
	line-height: 1.5;
}

#bluetenartikel table {
  	max-width: 100%;
	margin: 0px 10px 10px 10px;
	border-left: 1px solid #ede9dd;
	border-top: 1px solid #ede9dd;
}

#bluetenartikel table td, #bluetenartikel table th {
	border-right: 1px solid #ede9dd;
	border-bottom: 1px solid #ede9dd;
	padding: 5px;
	font-size: 80%;
	line-height: 1;
}
/*Die Klasse Reference bezieht sich auf Quellenangaben*/
#bluetenartikel .reference  a {
	font-size: 14px;
}
#bluetenartikel .reference {
	color: grey;
	font-size: 14px;
}
/*
#backlink {
      font-size: 120%;
      text-decoration: underline;
      color: green;
      display: inline;
}

/* Menupunkt hervorheben 
#Home .Home_akt {color: #265C00FF !important;}
#Kontakt .Kontakt_akt {color: #265C00FF !important;}
#Anfahrt .Anfahrt_akt {color: #265C00FF !important;}
#Impressum_ABG .Impressum_ABG_akt {color: #265C00FF !important;}
#Projekt_ABG .Projekt_ABG_akt {color: #265C00FF !important;}
#Garten .Garten_akt {color: #265C00FF !important;}
#Lehrpfade .Lehrpfade_akt {color: #265C00FF !important;}
#Karte_Rundgang .Karte_Rundgang_akt {color: #265C00FF !important;}
#Heilpflanzenbeete .Heilpflanzenbeete_akt {color: #265C00FF !important;}
#Was_blueht .Was_blueht_akt {color: #265C00FF !important;}
#Pflanzenarten .Pflanzenarten_akt {color: #265C00FF !important;}
#Voegel .Voegel_akt {color: #265C00FF !important;}
#Virtueller .Virtueller_akt {color: #265C00FF !important;}
#Gartenvideo .Gartenvideo_akt {color: #265C00FF !important;}
#Groesste_Baeume .Groesste_Baeume_akt {color: #265C00FF !important;}
#Gartendenkmal .Gartendenkmal_akt {color: #265C00FF !important;}
#Geschichte .Geschichte_akt {color: #265C00FF !important;}
#Zeittafel .Zeittafel_akt {color: #265C00FF !important;}
#Literatur .Literatur_akt {color: #265C00FF !important;}
#Fotoserien .Fotoserien_akt {color: #265C00FF !important;}
#Freundeskreis .Freundeskreis_akt {color: #265C00FF !important;}
#Verein .Verein_akt {color: #265C00FF !important;}
#Newsletter .Newsletter_akt {color: #265C00FF !important;}
#Links .Links_akt {color: #265C00FF !important;}
#Aktuelles .Aktuelles_akt {color: #265C00FF !important;}

*/


/* Anweisungen für Panorama-Plugin*/
   #panowrapper {
            display: none;
            font-family: Arial, sans-serif;
            box-sizing: border-box;
            position: fixed;
            top: 0;
            left: 0;
            width:100%;
            height:100%;
            z-index: 10000;
            background-color: rgba(0,0,0,0.5);
        }

        #panowrapper a.close {
            position: absolute;
            font-size: 15px;
            top: 10px;
            right: 10px;
            display: block;
            box-sizing: border-box;
            height: 30px;
            padding: 5px 10px 5px 45px;
            background-image: url(/panoramen/close.png);
            background-position: 15px 3px;
            background-repeat: no-repeat;
            color: #fff;
            text-decoration: none;
            z-index: 1000;
        }


        #pano {
            position: absolute;
            box-sizing: border-box;
            width: 100%;
            height: 100%;
            z-index: 100;

        }

        a.popupclose {
            font-size: 12px!important;
            line-height: 20px!important;
            padding: 0 25px!important;
            color: #333!important;
            width: 100%!important;
            background: url(/panoramen/closepopup.png) 5px 0 no-repeat;
        }


/* leaflet 
#map { height: 380px; }

#container{
    position:static;
    width:100%;
  	overflow:visible;
} 
#top{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    z-index:999;
}
#slider{
    position:relative;
  	left:0px;
  	top:0px;
    width:100%;
	z-index:2;
}
#bottom{
    position:relative;
	top:52px;
	left:0;
    width:100%;
    z-index:2;
}
*/