.brand-logo img{
max-width: 310px;
  width: 140px;
}

@media (width >= 992px) {
.navbar-brand {
    display: flex;
    justify-content: flex-end; 
    width: 100%;               
}

.grid-child .navbar-brand img {
    margin-left: auto;
    display: block;    
}
}

/* Anker */
.sprungmarke {
    visibility: hidden;
    height: 0px !important;
    position: absolute;
    margin: -150px;
}

/* Untermenu */
.metismenu.mod-menu.menu-horizontal {
 justify-content: center !important;
}

/* Navigationsbar */
.container-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "top below"
                       "logo logo"
                       "nav nav";
}

.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;
}
.container-header .container-nav {
  grid-area: nav;
}

@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 1rem;
   }
   
  .container-header:has(.container-below-top, .container-topbar) {
   grid-template-areas: ". top top below below ."
                        ". logo nav nav nav .";
  }
}


/* Banner */
  .container-banner img {
	width: 100%;
}

/* Inhalt */
.site-grid > .grid-child.container-component {
    grid-column: full-start / full-end !important;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.container-component > main {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;  
    padding-right: 20px; 
    width: 100%;
}


/* Konzept */
.start {
    display: flex;
    /*flex-wrap: wrap;*/
	text-align: center;
}

.themen {
    display: flex;
    flex-wrap: wrap;
  	flex-direction: column; 
	background-color: #ccdee5;
	text-align: center;
  	border-radius: 14px;
  	margin-top: 26px;
}

.themen p, h1, h2, h3, h4, h5{
  /*padding:10px;*/
}
.leistung {
	text-align: center;
  	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  	padding:10px;
}

.box p {
line-height: 200%;
  }



@media (max-width: 768px) {
    .leistung {
        flex-direction: column; 
    }
  	.themen {
        flex-direction: column; 
    }
  	.start {
        flex-direction: column; 
    }
 	.box p{
   		margin-left: 0px;
       line-height: 140%;
	}

}



@media (max-width: 1200px) {

  #djslider121{
    width: 500px !important;
    height: 229 !important;
     }

}



@media (max-width: 480px) {
.navi-box {
        /*flex: 0 1 calc(50% - 10px); */
      width: 120px !important;
      height: 120px !important;
    }
}



.start img {
	width: 50%;
}

.title{
	width: 100%;
	/*background-color: white;*/
}

.title h2{
	margin: 20px 0px;
}

.navi {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
  	justify-content: space-evenly;
    background-color: #179c7d;
    padding: 10px;
  	border-radius: 14px;
}

.navi-box {
  	width: 180px; 
    height: 180px; 
    margin: 5px; 
    position: relative;
    text-align: center;
}




.box {
    flex: 1;
    min-width: 300px; 
	min-height: 150px;
    margin: 0px;
	text-align:left;
    position: relative; 
}


.box h5{
	padding: 20px;
}
.box p{
  margin-left: 10px;
}
.box img {
width: 100%;
}
.box ul, li{
list-style-type: square;
}


.navi-box img {
    width: 100%; 
    height: 100%; 
    object-fit: cover;
}


.navi-box #Bild-H {
    display: none; /* Hover-Bild standardmäßig ausblenden */
  	border-radius: 14px;
}

.navi-box:hover #Bild-A {
    display: none; /* Standardbild ausblenden beim Hover */
  	border-radius: 14px;
}

.navi-box:hover #Bild-H {
    display: block; /* Hover-Bild anzeigen beim Hover */
  	border-radius: 14px;
}



.navi-box h1{
text-align: center;
}
	
.a-button{
	/*width: 80%;*/
	text-align: center;
	border: 1px solid #179c7d;;
	color: #179c7d !important;
	background-color: white;
	padding:10px 30px;
	margin: 10px;
	font-size: 18px;
	text-decoration: none;
	float:left;
}
