/* area header */
header .Logo img { height: 49px; }
header.scrolled .Logo img { height: 35px; }
header nav.navBlockdrop { --top-margin: 5px; }
header.scrolled nav.navBlockdrop { --top-margin: 0px; }

header div.addons {
  margin-left: 0;
  margin-right: 0;
}

.miniSpalten {
  display: flex;
  flex-wrap: wrap;
  text-align: center;
  justify-content: space-between;
  gap: 10px;
}

.Karte, .Karte h3 {
	transition: all calc(var(--transition-time)*2);
}

.Karte:hover, .Karte:hover h3 {
	color: var(--font-color-light);
	transition: all calc(var(--transition-time)*2);
}
.Karte:hover {
	background: var(--logo-color-1);
}



.Karte h3 {
padding-top: 10px;
}
h1 {
	font-size:40px;
	padding-top: 34px;
}


h2 {
font-size: 30px;
  color: var(--logo-color-2);
  line-height:110%;
}


.miniSpalten p {
 padding: 0px 10px 8px 10px;
 font-size: 14px
}

.miniSpalten > * {
  flex-basis: 15%;
  border: 1px solid silver;
}

@media (max-width: 1200px) { .miniSpalten >  * { flex-basis: 22%; } }
@media (max-width: 1000px) { .miniSpalten >  * { flex-basis: 30%; } }
@media (max-width: 800px) { .miniSpalten >  * { flex-basis: 48%; } }
@media (max-width: 600px) { .miniSpalten >  * { flex-basis: 100%; } }


.button {
	background: var(--logo-color-2);
	color: var(--font-color-light);
	padding: 10px;
	border-radius: 6px;
	text-decoration: none
}
.button:hover {
	background: var(--logo-color-1);
	text-decoration: none
}

@media (max-width: 1599px) { header .navidrop, header .navMega { display: none; } }
@media all and (min-width: 1600px) { header .navBlockdrop { display: none; } }
@media all and (max-width: 1599px) { header div.addons { margin-right: 60px; } }