/* Generiert mit PHP - 14.05.2026 11:38 */

/* ========== Modul: base ========== */
/* Stile für body */
body {
  font-family: Arial, sans-serif; /* Eigenschaft: font-family */
  margin: 0; /* Eigenschaft: margin */
  padding: 0; /* Eigenschaft: padding */
  background-color: #f0f5f5; /* Eigenschaft: background-color */
  color: #212121; /* Eigenschaft: color */
  display: flex; /* Eigenschaft: display */
  flex-direction: row; /* Eigenschaft: flex-direction */
  flex-wrap: nowrap; /* Eigenschaft: flex-wrap */
}

/* Stile für body .content */
body .content {
  display: flex; /* Eigenschaft: display */
  flex-direction: column; /* Eigenschaft: flex-direction */
  height: 100vh; /* Eigenschaft: height */
  flex-wrap: nowrap; /* Eigenschaft: flex-wrap */
}

/* Stile für a */
a {
  color: #6682cf; /* Eigenschaft: color */
  text-decoration: none; /* Eigenschaft: text-decoration */
}

/* Stile für .img */
.img {
  display: flex; /* Eigenschaft: display */
  align-items: center; /* Eigenschaft: align-items */
  justify-content: center; /* Eigenschaft: justify-content */
}

/* Stile für .error-message */
.error-message {
  display: block; /* Eigenschaft: display */
  color: #D32F2F; /* Eigenschaft: color */
  font-size: 0.9em; /* Eigenschaft: font-size */
  margin-bottom: 10px; /* Eigenschaft: margin-bottom */
}

/* Stile für .warning */
.warning {
  color: #d65732; /* Eigenschaft: color */
}

/* ========== Modul: navsidebar ========== */
/* Stile für header .NavSidebar-bt */
header .NavSidebar-bt {
  cursor: pointer; /* Eigenschaft: cursor */
  position: absolute; /* Eigenschaft: position */
  top: 50%; /* Eigenschaft: top */
  transform: translateY(-50%); /* Eigenschaft: transform */
  margin: 0 0 0 20px; /* Eigenschaft: margin */
}

/* Stile für header .NavSidebar-bt:hover div */
header .NavSidebar-bt:hover div {
  background-color: #879edf; /* Eigenschaft: background-color */
}

/* Stile für header .NavSidebar-bt div */
header .NavSidebar-bt div {
  width: 35px; /* Eigenschaft: width */
  height: 5px; /* Eigenschaft: height */
  background-color: #3d5eb8; /* Eigenschaft: background-color */
  margin: 6px 0; /* Eigenschaft: margin */
}

/* Stile für body .s-open */
body .s-open {
  display: flex; /* Eigenschaft: display */
  flex-direction: column; /* Eigenschaft: flex-direction */
  padding: 0; /* Eigenschaft: padding */
  background-color: #f9f4e1; /* Eigenschaft: background-color */
  width: auto; /* Eigenschaft: width */
  height: 100vh; /* Eigenschaft: height */
}

/* Stile für body .c-side-open */
body .c-side-open {
  min-width: 0; /* Eigenschaft: min-width */
  flex-grow: 1; /* Eigenschaft: flex-grow */
  width: auto; /* Eigenschaft: width */
}

/* Stile für body .s-closed */
body .s-closed {
  display: none; /* Eigenschaft: display */
  width: 0; /* Eigenschaft: width */
}

/* Stile für body .c-side-closed */
body .c-side-closed {
  width: 100%; /* Eigenschaft: width */
}

/* Stile für nav#NavSidebar .nav-h */
nav#NavSidebar .nav-h {
  display: flex; /* Eigenschaft: display */
  flex-direction: row; /* Eigenschaft: flex-direction */
  gap: 1em; /* Eigenschaft: gap */
  margin: 2em; /* Eigenschaft: margin */
}

/* Stile für nav#NavSidebar .nav-h img */
nav#NavSidebar .nav-h img {
  width: 3em; /* Eigenschaft: width */
  height: 3em; /* Eigenschaft: height */
}

/* Stile für nav#NavSidebar .nav-h p */
nav#NavSidebar .nav-h p {
  font-size: 1.5em; /* Eigenschaft: font-size */
  margin: auto 0; /* Eigenschaft: margin */
  font-weight: 600; /* Eigenschaft: font-weight */
}

/* Stile für nav#NavSidebar .nav-main */
nav#NavSidebar .nav-main {
  display: flex; /* Eigenschaft: display */
  flex-direction: column; /* Eigenschaft: flex-direction */
  gap: 0.4em; /* Eigenschaft: gap */
  margin: 0 1em 1.5em 1em; /* Eigenschaft: margin */
  padding: 0 0 0 2.5em; /* Eigenschaft: padding */
  overflow-y: auto; /* Eigenschaft: overflow-y */
  overflow-x: hidden; /* Eigenschaft: overflow-x */
  direction: rtl; /* Eigenschaft: direction */
  scrollbar-color: #6682cf transparent; /* Eigenschaft: scrollbar-color */
  scrollbar-width: thin; /* Eigenschaft: scrollbar-width */
}

/* Stile für nav#NavSidebar .nav-main > *  */
nav#NavSidebar .nav-main > *  {
  direction: ltr; /* Eigenschaft: direction */
}

/* Stile für nav#NavSidebar .nav-main .disabled-link */
nav#NavSidebar .nav-main .disabled-link {
  color: gray; /* Eigenschaft: color */
}

/* Stile für nav#NavSidebar .nav-main .nav-node-container */
nav#NavSidebar .nav-main .nav-node-container {
  display: flex; /* Eigenschaft: display */
  flex-direction: column; /* Eigenschaft: flex-direction */
  gap: 0.4em; /* Eigenschaft: gap */
}

/* Stile für nav#NavSidebar .nav-main .nav-row */
nav#NavSidebar .nav-main .nav-row {
  display: flex; /* Eigenschaft: display */
  justify-content: space-between; /* Eigenschaft: justify-content */
  max-width: 10em; /* Eigenschaft: max-width */
}

/* Stile für nav#NavSidebar .nav-main .nav-row a */
nav#NavSidebar .nav-main .nav-row a {
  oveflow: hiden; /* Eigenschaft: oveflow */
}

/* Stile für nav#NavSidebar .nav-main .nav-row .nav-toggle */
nav#NavSidebar .nav-main .nav-row .nav-toggle {
  display: flex; /* Eigenschaft: display */
  align-items: center; /* Eigenschaft: align-items */
  justify-content: center; /* Eigenschaft: justify-content */
  margin: 0; /* Eigenschaft: margin */
  padding: 0.2em; /* Eigenschaft: padding */
  border: none; /* Eigenschaft: border */
  background: transparent; /* Eigenschaft: background */
  height: 1.2em; /* Eigenschaft: height */
  width: 1.4em; /* Eigenschaft: width */
  cursor: pointer; /* Eigenschaft: cursor */
}

/* Stile für nav#NavSidebar .nav-main .nav-row svg */
nav#NavSidebar .nav-main .nav-row svg {
  marging: 0; /* Eigenschaft: marging */
  max-height: 1em; /* Eigenschaft: max-height */
  max-width: 1em; /* Eigenschaft: max-width */
  fill: #6682cf; /* Eigenschaft: fill */
}

/* Stile für nav#NavSidebar .nav-main .nav-children */
nav#NavSidebar .nav-main .nav-children {
  display: none; /* Eigenschaft: display */
  flex-direction: column; /* Eigenschaft: flex-direction */
  gap: 0.4em; /* Eigenschaft: gap */
  margin: 0 0 0 1em; /* Eigenschaft: margin */
}

/* Stile für nav#NavSidebar .nav-main .is-open > .nav-children */
nav#NavSidebar .nav-main .is-open > .nav-children {
  display: flex; /* Eigenschaft: display */
}

/* Stile für nav#NavSidebar .nav-main .a-bt */
nav#NavSidebar .nav-main .a-bt {
  display: none; /* Eigenschaft: display */
}

/* Stile für nav#NavSidebar .nav-main .nav-node-container.is-open > .nav-row .nav-toggle .a-bt */
nav#NavSidebar .nav-main .nav-node-container.is-open > .nav-row .nav-toggle .a-bt {
  display: block; /* Eigenschaft: display */
}

/* Stile für nav#NavSidebar .nav-main .nav-node-container.is-open > .nav-row .nav-toggle .a-lt */
nav#NavSidebar .nav-main .nav-node-container.is-open > .nav-row .nav-toggle .a-lt {
  display: none; /* Eigenschaft: display */
}

/* ========== Modul: header ========== */
/* Stile für header */
header {
  position: relative; /* Eigenschaft: position */
  background-color: #6682cf; /* Eigenschaft: background-color */
  color: white; /* Eigenschaft: color */
  font-size: 1.2em; /* Eigenschaft: font-size */
  width: 100%; /* Eigenschaft: width */
}

/* Stile für header .header-container */
header .header-container {
  display: flex; /* Eigenschaft: display */
  max-width: 1200px; /* Eigenschaft: max-width */
  margin: auto; /* Eigenschaft: margin */
  padding: 20px 5%; /* Eigenschaft: padding */
  gap: 1.5em; /* Eigenschaft: gap */
  justify-content: space-between; /* Eigenschaft: justify-content */
}

/* Stile für header .title-container */
header .title-container {
  display: flex; /* Eigenschaft: display */
  gap: 1.5em; /* Eigenschaft: gap */
  align-items: center; /* Eigenschaft: align-items */
}

/* Stile für header .title-container .logo-ensemble */
header .title-container .logo-ensemble {
  width: 40%; /* Eigenschaft: width */
  height: 110%; /* Eigenschaft: height */
  padding: 0; /* Eigenschaft: padding */
  margin: 0; /* Eigenschaft: margin */
  position: relative; /* Eigenschaft: position */
}

/* Stile für header .title-container .logo-kanji */
header .title-container .logo-kanji {
  margin: 4% 10%; /* Eigenschaft: margin */
  width: 18%; /* Eigenschaft: width */
}

/* Stile für header .title-container .logo-combat */
header .title-container .logo-combat {
  position: absolute; /* Eigenschaft: position */
  width: 60%; /* Eigenschaft: width */
  top: 5%; /* Eigenschaft: top */
  z-index: 1; /* Eigenschaft: z-index */
}

/* Stile für header .title-container .logo-solei */
header .title-container .logo-solei {
  position: absolute; /* Eigenschaft: position */
  width: 48%; /* Eigenschaft: width */
  top: 5%; /* Eigenschaft: top */
  left: 45%; /* Eigenschaft: left */
}

/* Stile für header .logo-frame */
header .logo-frame {
  width: 16%; /* Eigenschaft: width */
  position: relative; /* Eigenschaft: position */
}

/* Stile für header .logo-frame .logo-kanji */
header .logo-frame .logo-kanji {
  margin: 4% 0 0 0; /* Eigenschaft: margin */
  width: 17%; /* Eigenschaft: width */
}

/* Stile für header .logo-frame .logo-combat */
header .logo-frame .logo-combat {
  position: absolute; /* Eigenschaft: position */
  width: 68%; /* Eigenschaft: width */
  top: 5%; /* Eigenschaft: top */
  left: 25%; /* Eigenschaft: left */
  z-index: 1; /* Eigenschaft: z-index */
}

/* Stile für header .logo-frame .logo-sun */
header .logo-frame .logo-sun {
  width: 48%; /* Eigenschaft: width */
  position: absolute; /* Eigenschaft: position */
  left: 35%; /* Eigenschaft: left */
}

/* Stile für header .menu-container */
header .menu-container {
  display: flex; /* Eigenschaft: display */
  align-items: center; /* Eigenschaft: align-items */
  gap: 10px; /* Eigenschaft: gap */
}

/* Stile für header a */
header a {
  display: flex; /* Eigenschaft: display */
  align-items: center; /* Eigenschaft: align-items */
}

/* Stile für header a button */
header a button {
  background-color: white; /* Eigenschaft: background-color */
  color: #6682cf; /* Eigenschaft: color */
  border: none; /* Eigenschaft: border */
  padding: 10px 20px; /* Eigenschaft: padding */
  font-size: 1em; /* Eigenschaft: font-size */
  cursor: pointer; /* Eigenschaft: cursor */
  border-radius: 5px; /* Eigenschaft: border-radius */
  transition: background-color 0.3s, color 0.3s; /* Eigenschaft: transition */
  margin: 0; /* Eigenschaft: margin */
}

/* Stile für header button:hover */
header button:hover {
  background-color: #879edf; /* Eigenschaft: background-color */
  color: white; /* Eigenschaft: color */
}

/* Stile für header button:hover a */
header button:hover a {
  color: white; /* Eigenschaft: color */
}

/* ========== Modul: language ========== */
/* Stile für .parent-language-menu */
.parent-language-menu {
  position: relative; /* Eigenschaft: position */
  width: 3em; /* Eigenschaft: width */
  height: 2em; /* Eigenschaft: height */
  margin: 0; /* Eigenschaft: margin */
  padding: 0; /* Eigenschaft: padding */
  min-width: 3.2em; /* Eigenschaft: min-width */
}

/* Stile für .language-menu */
.language-menu {
  width: 3.2em; /* Eigenschaft: width */
  height: 2em; /* Eigenschaft: height */
  position: absolute; /* Eigenschaft: position */
  top: 50%; /* Eigenschaft: top */
  left: 50%; /* Eigenschaft: left */
  transform: translate(-50%, -50%); /* Eigenschaft: transform */
  z-index: 1; /* Eigenschaft: z-index */
}

/* Stile für .button-language-menu .icon */
.button-language-menu .icon {
  position: absolute; /* Eigenschaft: position */
  width: 84%; /* Eigenschaft: width */
  height: 84%; /* Eigenschaft: height */
  top: 6%; /* Eigenschaft: top */
  left: 8%; /* Eigenschaft: left */
  z-index: 1; /* Eigenschaft: z-index */
}

/* Stile für .button-language-menu */
.button-language-menu {
  position: absolute; /* Eigenschaft: position */
  width: 90%; /* Eigenschaft: width */
  height: 90%; /* Eigenschaft: height */
  top: 5%; /* Eigenschaft: top */
  left: 5%; /* Eigenschaft: left */
}

/* Stile für .button-language-menu .flag-german */
.button-language-menu .flag-german {
  display: block; /* Eigenschaft: display */
}

/* Stile für .button-language-menu .flag-uk */
.button-language-menu .flag-uk {
  display: block; /* Eigenschaft: display */
}

/* Stile für .button-language-menu .flag-france */
.button-language-menu .flag-france {
  display: block; /* Eigenschaft: display */
}

/* Stile für .button-language-menu .flag-japan */
.button-language-menu .flag-japan {
  display: block; /* Eigenschaft: display */
}

/* Stile für .scroll-language-menu */
.scroll-language-menu {
  display: none; /* Eigenschaft: display */
}

/* Stile für .scroll-language-menu .flag-german */
.scroll-language-menu .flag-german {
  display: none; /* Eigenschaft: display */
}

/* Stile für .scroll-language-menu .flag-uk */
.scroll-language-menu .flag-uk {
  display: none; /* Eigenschaft: display */
}

/* Stile für .scroll-language-menu .flag-france */
.scroll-language-menu .flag-france {
  display: none; /* Eigenschaft: display */
}

/* Stile für .scroll-language-menu .flag-japan */
.scroll-language-menu .flag-japan {
  display: none; /* Eigenschaft: display */
}

/* Stile für .language-menu:hover .scroll-language-menu */
.language-menu:hover .scroll-language-menu {
  display: block; /* Eigenschaft: display */
  position: absolute; /* Eigenschaft: position */
  width: 100%; /* Eigenschaft: width */
  height: 300%; /* Eigenschaft: height */
  top: 100%; /* Eigenschaft: top */
  left: 0; /* Eigenschaft: left */
}

/* Stile für .language-menu:hover .flag */
.language-menu:hover .flag {
  position: relative; /* Eigenschaft: position */
  display: inline-block; /* Eigenschaft: display */
  width: 90%; /* Eigenschaft: width */
  height: 30%; /* Eigenschaft: height */
  top: 5%; /* Eigenschaft: top */
  left: 5%; /* Eigenschaft: left */
  margin: 0; /* Eigenschaft: margin */
  padding: 0; /* Eigenschaft: padding */
}

/* Stile für .language-menu:hover .flag-german */
.language-menu:hover .flag-german {
  position: relative; /* Eigenschaft: position */
  display: block; /* Eigenschaft: display */
}

/* Stile für .language-menu:hover .flag-uk */
.language-menu:hover .flag-uk {
  position: relative; /* Eigenschaft: position */
  display: block; /* Eigenschaft: display */
}

/* Stile für .language-menu:hover .flag-france */
.language-menu:hover .flag-france {
  position: relative; /* Eigenschaft: position */
  display: block; /* Eigenschaft: display */
}

/* Stile für .language-menu:hover .flag-japan */
.language-menu:hover .flag-japan {
  position: relative; /* Eigenschaft: position */
  display: block; /* Eigenschaft: display */
}

/* ========== Modul: main ========== */
/* Stile für main */
main {
  flex-grow: 1; /* Eigenschaft: flex-grow */
  overflow: auto; /* Eigenschaft: overflow */
}

/* Stile für main .main-limit */
main .main-limit {
  padding: 1.6em 5% 3em 5%; /* Eigenschaft: padding */
  max-width: 1200px; /* Eigenschaft: max-width */
  margin: auto; /* Eigenschaft: margin */
}

/* Stile für main section */
main section {
  display: flex; /* Eigenschaft: display */
  flex-direction: column; /* Eigenschaft: flex-direction */
  gap: 1.5em; /* Eigenschaft: gap */
}

/* Stile für main h2 */
main h2 {
  margin: 0; /* Eigenschaft: margin */
}

/* Stile für main .cont img */
main .cont img {
  width: 100%; /* Eigenschaft: width */
  margin-bottom: 15px; /* Eigenschaft: margin-bottom */
}

/* Stile für main .category-breadcrumb */
main .category-breadcrumb {
  margin: 0 0 1.4em 0; /* Eigenschaft: margin */
  color: #6682cf; /* Eigenschaft: color */
}

/* Stile für main .category-breadcrumb .breadcrumb-separator .sep-bread */
main .category-breadcrumb .breadcrumb-separator .sep-bread {
  height: 0.8em; /* Eigenschaft: height */
  margin: 0 0.4em 0 0.2em; /* Eigenschaft: margin */
  fill: #6682cf; /* Eigenschaft: fill */
}

/* Stile für main .category-breadcrumb .breadcrumb-item.bt */
main .category-breadcrumb .breadcrumb-item.bt {
  display: inline-block; /* Eigenschaft: display */
  color: #6682cf; /* Eigenschaft: color */
  padding: 0; /* Eigenschaft: padding */
  border: none; /* Eigenschaft: border */
  background: none; /* Eigenschaft: background */
}

/* ========== Modul: navlink ========== */
/* Stile für main .bt, main a */
main .bt, main a {
  display: block; /* Eigenschaft: display */
  color: #6682cf; /* Eigenschaft: color */
  background-color: #f0f5f5; /* Eigenschaft: background-color */
  border: 1px solid #ddd; /* Eigenschaft: border */
  border-radius: 5px; /* Eigenschaft: border-radius */
  font-size: 1em; /* Eigenschaft: font-size */
  padding: 10px 20px; /* Eigenschaft: padding */
  transition: background-color 0.3s, color 0.3s, transform 0.2s; /* Eigenschaft: transition */
  cursor: pointer; /* Eigenschaft: cursor */
}

/* Stile für main .bt:hover, main a:hover */
main .bt:hover, main a:hover {
  background-color: #7695eb; /* Eigenschaft: background-color */
  color: #FFFFFF; /* Eigenschaft: color */
}

/* Stile für main .cont img */
main .cont img {
  width: 100%; /* Eigenschaft: width */
  margin-bottom: 15px; /* Eigenschaft: margin-bottom */
  background-color: #879edf; /* Eigenschaft: background-color */
  color: #FFFFFF; /* Eigenschaft: color */
}

/* Stile für main .nav */
main .nav {
  display: flex; /* Eigenschaft: display */
  gap: 10px; /* Eigenschaft: gap */
}

/* Stile für main .disabled-link, main .disabled-link:hover  */
main .disabled-link, main .disabled-link:hover  {
  color: #a0a0a0 !important; /* Eigenschaft: color */
  background-color: #f0f5f5; /* Eigenschaft: background-color */
  border-color: #e0e0e0; /* Eigenschaft: border-color */
  box-shadow: none; /* Eigenschaft: box-shadow */
  transition: none; /* Eigenschaft: transition */
}

/* ========== Modul: footer ========== */
/* Stile für footer */
footer {
  background-color: #333; /* Eigenschaft: background-color */
  color: #FFFFFF; /* Eigenschaft: color */
  text-align: center; /* Eigenschaft: text-align */
  padding: 10px; /* Eigenschaft: padding */
  bottom: 0; /* Eigenschaft: bottom */
}

/* ========== Modul: main ========== */
/* Stile für main .home .head h2 */
main .home .head h2 {
  margin-top: 0; /* Eigenschaft: margin-top */
}

/* Stile für main .home .home-intro */
main .home .home-intro {
  --hauteur: 430px; /* Eigenschaft: --hauteur */
}

/* Stile für main .home .home-intro .img-border */
main .home .home-intro .img-border {
  height: var(--hauteur, 430px); /* Eigenschaft: height */
  float: right; /* Eigenschaft: float */
  shape-outside: polygon(300px calc(var(--hauteur, 430px) - 420px), 300px var(--hauteur, 430px), 0 var(--hauteur, 430px), 0 calc(var(--hauteur, 430px) - 60px), 35px calc(var(--hauteur, 430px) - 80px), 39px calc(var(--hauteur, 430px) - 140px), 141px calc(var(--hauteur, 430px) - 210px), 156px calc(var(--hauteur, 430px) - 290px), 180px calc(var(--hauteur, 430px) - 340px), 225px calc(var(--hauteur, 430px) - 420px)); /* Eigenschaft: shape-outside */
}

/* Stile für main .home .home-intro .t2 */
main .home .home-intro .t2 {
  display: none; /* Eigenschaft: display */
}

/* Stile für main .home .home-intro .t3 */
main .home .home-intro .t3 {
  display: none; /* Eigenschaft: display */
}

/* Stile für main .home .home-intro .t4 */
main .home .home-intro .t4 {
  display: none; /* Eigenschaft: display */
}

/* Stile für main .home .home-intro .img-border img */
main .home .home-intro .img-border img {
  display: block; /* Eigenschaft: display */
  width: 100%; /* Eigenschaft: width */
  height: 100%; /* Eigenschaft: height */
  object-fit: cover; /* Eigenschaft: object-fit */
}

/* Stile für main .home .home-intro::after */
main .home .home-intro::after {
  content: ""; /* Eigenschaft: content */
  display: block; /* Eigenschaft: display */
  clear: both; /* Eigenschaft: clear */
}

/* Stile für main .home .home-intro h2 */
main .home .home-intro h2 {
  font-size: 1.8em; /* Eigenschaft: font-size */
  margin: 0.5em 0 0.5em 0; /* Eigenschaft: margin */
}

/* Stile für main .home .home-intro p */
main .home .home-intro p {
  font-size: 1.2em; /* Eigenschaft: font-size */
}

/* ========== Modul: cat ========== */
/* Stile für main .nav-tiles */
main .nav-tiles {
  display: grid; /* Eigenschaft: display */
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); /* Eigenschaft: grid-template-columns */
  gap: 25px; /* Eigenschaft: gap */
  margin: 0; /* Eigenschaft: margin */
}

/* Stile für main .nav-tiles .nav-tile */
main .nav-tiles .nav-tile {
  position: relative; /* Eigenschaft: position */
  border: 1px solid #ddd; /* Eigenschaft: border */
  overflow: hidden; /* Eigenschaft: overflow */
  padding: 0; /* Eigenschaft: padding */
  border-radius: 12px; /* Eigenschaft: border-radius */
  aspect-ratio: 1/1; /* Eigenschaft: aspect-ratio */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* Eigenschaft: transition */
}

/* Stile für main .nav-tiles .nav-tile:hover */
main .nav-tiles .nav-tile:hover {
  transform: translateY(-5px) scale(1.02); /* Eigenschaft: transform */
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2); /* Eigenschaft: box-shadow */
  border-color: #6682cf; /* Eigenschaft: border-color */
}

/* Stile für main .nav-tiles .nav-tile.disabled-link */
main .nav-tiles .nav-tile.disabled-link {
  border: 1px solid #999; /* Eigenschaft: border */
  transform: none; /* Eigenschaft: transform */
  box-shadow: none; /* Eigenschaft: box-shadow */
  pointer-events: none; /* Eigenschaft: pointer-events */
  cursor: default; /* Eigenschaft: cursor */
}

/* Stile für main .nav-tiles .nav-tile.disabled-link .image-container */
main .nav-tiles .nav-tile.disabled-link .image-container {
  filter: grayscale(100%) brightness(0.75); /* Eigenschaft: filter */
  transform: none; /* Eigenschaft: transform */
}

/* Stile für main .nav-tiles .nav-tile.disabled-link span */
main .nav-tiles .nav-tile.disabled-link span {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.25)); /* Eigenschaft: background */
}

/* Stile für main .nav-tiles .nav-tile .image-container */
main .nav-tiles .nav-tile .image-container {
  position: absolute; /* Eigenschaft: position */
  top: 0; /* Eigenschaft: top */
  left: 0; /* Eigenschaft: left */
  right: 0; /* Eigenschaft: right */
  bottom: 0; /* Eigenschaft: bottom */
  background-size: cover; /* Eigenschaft: background-size */
  background-position: center; /* Eigenschaft: background-position */
  transition: transform 0.3s ease; /* Eigenschaft: transition */
}

/* Stile für main .nav-tiles .nav-tile .image-container img */
main .nav-tiles .nav-tile .image-container img {
  width: 100%; /* Eigenschaft: width */
  height: 100%; /* Eigenschaft: height */
}

/* Stile für main .nav-tiles .nav-tile:hover .image-container */
main .nav-tiles .nav-tile:hover .image-container {
  transform: scale(1.05); /* Eigenschaft: transform */
}

/* Stile für main .nav-tiles .nav-tile span */
main .nav-tiles .nav-tile span {
  position: absolute; /* Eigenschaft: position */
  bottom: 0; /* Eigenschaft: bottom */
  left: 0; /* Eigenschaft: left */
  right: 0; /* Eigenschaft: right */
  font-size: 1.2em; /* Eigenschaft: font-size */
  font-weight: 600; /* Eigenschaft: font-weight */
  text-align: center; /* Eigenschaft: text-align */
  color: #FFFFFF; /* Eigenschaft: color */
  padding: 0.6em 0.4em 0.8em 0.4em; /* Eigenschaft: padding */
  text-shadow: 1px 1px 3px rgba(0,0,0,0.8); /* Eigenschaft: text-shadow */
  background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.3)); /* Eigenschaft: background */
  transition: all 0.3s ease; /* Eigenschaft: transition */
}

/* Stile für main .nav-tiles .nav-tile:hover span */
main .nav-tiles .nav-tile:hover span {
  padding: 0.8em 0.4em 1em 0.4em; /* Eigenschaft: padding */
  font-size: 1.25em; /* Eigenschaft: font-size */
}

/* Adaptiver-Kategorien-Stile */

@media screen and (max-width: 1370px) {
  .c-side-open main .nav-tiles {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); /* Eigenschaft: grid-template-columns */
    gap: 18px; /* Eigenschaft: gap */
  }
}

@media screen and (max-width: 1078px) {
  .c-side-closed main .nav-tiles {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); /* Eigenschaft: grid-template-columns */
    gap: 18px; /* Eigenschaft: gap */
  }
}

@media screen and (max-width: 900px) {
  .c-side-open main .nav-tiles .bt, .c-side-open main .nav-tiles a {
    padding: 0; /* Eigenschaft: padding */
  }
}

@media screen and (max-width: 740px) {
  .c-side-open main .nav-tiles {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); /* Eigenschaft: grid-template-columns */
    gap: 18px; /* Eigenschaft: gap */
  }
}

@media screen and (max-width: 660px) {
  .c-side-open main .nav-tiles {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); /* Eigenschaft: grid-template-columns */
    gap: 18px; /* Eigenschaft: gap */
  }
  .c-side-open main .nav-tiles .nav-tile span {
    padding: 0.65em 0.3em 0.8em 0.3em; /* Eigenschaft: padding */
    font-size: 1em; /* Eigenschaft: font-size */
  }
  .c-side-closed main .nav-tiles {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); /* Eigenschaft: grid-template-columns */
    gap: 18px; /* Eigenschaft: gap */
  }
}

@media screen and (max-width: 600px) {
  .c-side-closed main .nav-tiles .bt, .c-side-closed main .nav-tiles a {
    padding: 0; /* Eigenschaft: padding */
  }
  .c-side-open main .nav-tiles {
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); /* Eigenschaft: grid-template-columns */
    gap: 18px; /* Eigenschaft: gap */
  }
  .c-side-open main .nav-tiles .nav-tile span {
    padding: 0.4em 0.2em 0.6em 0.2em; /* Eigenschaft: padding */
    font-size: 0.8em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 400px) {
  .c-side-closed main .nav-tiles {
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); /* Eigenschaft: grid-template-columns */
    gap: 18px; /* Eigenschaft: gap */
  }
  .c-side-closed main .nav-tiles .nav-tile span {
    padding: 0.65em 0.3em 0.8em 0.3em; /* Eigenschaft: padding */
    font-size: 1em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 320px) {
  .c-side-closed main .nav-tiles {
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); /* Eigenschaft: grid-template-columns */
    gap: 18px; /* Eigenschaft: gap */
  }
  .c-side-closed main .nav-tiles .nav-tile span {
    padding: 0.4em 0.2em 0.6em 0.2em; /* Eigenschaft: padding */
    font-size: 0.8em; /* Eigenschaft: font-size */
  }
}

/* ========== Modul: home ========== */
@media screen and (max-width: 1200px) {
  .c-side-open main .home .home-intro .img-border.t1 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t2 {
    display: block; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t3 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t4 {
    display: none; /* Eigenschaft: display */
  }
}

@media screen and (max-width: 1090px) {
  .c-side-open main .home .home-intro .img-border.t1 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t2 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t3 {
    display: block; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t4 {
    display: none; /* Eigenschaft: display */
  }
}

@media screen and (max-width: 950px) {
  .c-side-open main .home .home-intro .img-border.t1 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t2 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t3 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-open main .home .home-intro .img-border.t4 {
    display: block; /* Eigenschaft: display */
  }
}

@media screen and (max-width: 900px) {
  .c-side-closed main .home .home-intro .img-border.t1 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t2 {
    display: block; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t3 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t4 {
    display: none; /* Eigenschaft: display */
  }
}

@media screen and (max-width: 790px) {
  .c-side-closed main .home .home-intro .img-border.t1 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t2 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t3 {
    display: block; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t4 {
    display: none; /* Eigenschaft: display */
  }
}

@media screen and (max-width: 650px) {
  .c-side-closed main .home .home-intro .img-border.t1 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t2 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t3 {
    display: none; /* Eigenschaft: display */
  }
  .c-side-closed main .home .home-intro .img-border.t4 {
    display: block; /* Eigenschaft: display */
  }
}

/* ========== Modul: base ========== */
@media screen and (max-width: 1000px) {
  .s-open .nav-h {
    gap: 0.8em; /* Eigenschaft: gap */
    margin: 1.4em; /* Eigenschaft: margin */
  }
  .s-open .nav-main {
    margin: 0 1em 1em 1.5em; /* Eigenschaft: margin */
  }
}

@media screen and (max-width: 760px) {
  .s-open .nav-h {
    gap: 0.5em; /* Eigenschaft: gap */
    margin: 1em; /* Eigenschaft: margin */
  }
  .s-open .nav-h img {
    width: 2.5em; /* Eigenschaft: width */
    height: 2.5em; /* Eigenschaft: height */
  }
  .s-open .nav-main {
    margin: 0 1em 1em 1em; /* Eigenschaft: margin */
  }
}

@media screen and (max-width: 550px) {
  body .s-open {
    width: 100%; /* Eigenschaft: width */
  }
  body .s-open .nav-h {
    margin: 1em 1em 1em 2em; /* Eigenschaft: margin */
  }
  body .s-open .nav-main {
    margin: 0 1em 1em 2em; /* Eigenschaft: margin */
  }
  body .c-side-open {
    display: none; /* Eigenschaft: display */
  }
  body .s-open .NavSidebar-bt {
    display: block; /* Eigenschaft: display */
  }
}

@media screen and (max-width: 370px) {
  body .s-open .NavSidebar-bt {
    margin: 0.3em 0 0 0.2em; /* Eigenschaft: margin */
    top: 0; /* Eigenschaft: top */
  }
}

@media screen and (max-width: 320px) {
  body .s-open .nav-h {
    margin: 1em; /* Eigenschaft: margin */
  }
  body .s-open .nav-main {
    margin: 0 1em 1em 1em; /* Eigenschaft: margin */
  }
}

@media screen and (max-width: 1680px) {
  .c-side-open header h1 {
    margin: 0 0 0 0.5em; /* Eigenschaft: margin */
  }
}

@media screen and (max-width: 1600px) {
  .c-side-open header .NavSidebar-bt {
    margin: 0 0 0 5%; /* Eigenschaft: margin */
  }
  .c-side-open header h1 {
    margin: 0 0 0 1.8em; /* Eigenschaft: margin */
  }
}

@media screen and (max-width: 1380px) {
  .c-side-closed header h1 {
    margin: 0 0 0 0.5em; /* Eigenschaft: margin */
  }
}

@media screen and (max-width: 1300px) {
  .c-side-closed header .NavSidebar-bt {
    margin: 0 0 0 5%; /* Eigenschaft: margin */
  }
  .c-side-closed header h1 {
    margin: 0 0 0 1.8em; /* Eigenschaft: margin */
  }
  .c-side-open header .banner-icon {
    font-size: 1.4em; /* Eigenschaft: font-size */
  }
  .c-side-open header .banner-text {
    margin: 0.5em 0; /* Eigenschaft: margin */
    font-size: 1em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 1200px) {
  .c-side-open header .banner-text {
    margin: 0.3em 0; /* Eigenschaft: margin */
    font-size: 0.9em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 1000px) {
  .content header .header-container {
    padding: 1.2em 5%; /* Eigenschaft: padding */
  }
  .content header h1 {
    margin: 0 0 0 1.6em; /* Eigenschaft: margin */
  }
  .c-side-closed header .banner-icon {
    font-size: 1.4em; /* Eigenschaft: font-size */
  }
  .c-side-closed header .banner-text {
    margin: 0.5em 0; /* Eigenschaft: margin */
    font-size: 1em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 900px) {
  .c-side-open header .logo-frame {
    width: 25%; /* Eigenschaft: width */
  }
  .c-side-closed header .logo-frame {
    width: 22%; /* Eigenschaft: width */
  }
}

@media screen and (max-width: 760px) {
  .c-side-open header .header-container {
    padding: 0.8em 5%; /* Eigenschaft: padding */
  }
  .c-side-open header .NavSidebar-bt {
    width: 1.8em; /* Eigenschaft: width */
  }
  .c-side-open header h1 {
    font-size: 1.5em; /* Eigenschaft: font-size */
    margin: 0 0 0 1.7em; /* Eigenschaft: margin */
  }
  .c-side-open  .language-menu {
    width: 3em; /* Eigenschaft: width */
    height: 1.82em; /* Eigenschaft: height */
  }
  .c-side-open header .banner-text {
    margin: 0.2em 0; /* Eigenschaft: margin */
    font-size: 0.7em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 700px) {
  .c-side-closed header .banner-text {
    margin: 0.3em 0; /* Eigenschaft: margin */
    font-size: 0.9em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 665px) {
  .c-side-open header .header-container {
    padding: 0.6em 5%; /* Eigenschaft: padding */
    gap: 0; /* Eigenschaft: gap */
  }
  .c-side-open header .NavSidebar-bt {
    width: 1.5em; /* Eigenschaft: width */
  }
  .c-side-open header h1 {
    font-size: 1.2em; /* Eigenschaft: font-size */
    margin: 0 0 0 1.6em; /* Eigenschaft: margin */
  }
  .c-side-open  .language-menu {
    width: 2.5em; /* Eigenschaft: width */
    height: 1.6em; /* Eigenschaft: height */
  }
  .c-side-closed header .logo-frame {
    width: 25%; /* Eigenschaft: width */
  }
}

@media screen and (max-width: 600px) {
  .c-side-open header .header-container {
    padding: 0.5em 5%; /* Eigenschaft: padding */
  }
  .c-side-open header .NavSidebar-bt {
    width: 1.2em; /* Eigenschaft: width */
  }
  .c-side-open header h1 {
    font-size: 1.1em; /* Eigenschaft: font-size */
    margin: 0 0 0 1.8em; /* Eigenschaft: margin */
  }
  .c-side-open  .language-menu {
    width: 2.3em; /* Eigenschaft: width */
    height: 1.4em; /* Eigenschaft: height */
  }
}

@media screen and (max-width: 550px) {
  .c-side-closed header .banner-text {
    margin: 0.2em 0; /* Eigenschaft: margin */
    font-size: 0.7em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 470px) {
  .c-side-closed header .header-container {
    padding: 0.8em 5%; /* Eigenschaft: padding */
  }
  .c-side-closed header .NavSidebar-bt {
    width: 1.8em; /* Eigenschaft: width */
  }
  .c-side-closed header h1 {
    font-size: 1.5em; /* Eigenschaft: font-size */
    margin: 0 0 0 1.7em; /* Eigenschaft: margin */
  }
  .c-side-closed  .language-menu {
    width: 3em; /* Eigenschaft: width */
    height: 1.82em; /* Eigenschaft: height */
  }
}

@media screen and (max-width: 375px) {
  .c-side-closed header .header-container {
    padding: 0.6em 5%; /* Eigenschaft: padding */
    gap: 0; /* Eigenschaft: gap */
  }
  .c-side-closed header .NavSidebar-bt {
    width: 1.5em; /* Eigenschaft: width */
  }
  .c-side-closed header h1 {
    font-size: 1.2em; /* Eigenschaft: font-size */
    margin: 0 0 0 1.6em; /* Eigenschaft: margin */
  }
  .c-side-closed  .language-menu {
    width: 2.5em; /* Eigenschaft: width */
    height: 1.6em; /* Eigenschaft: height */
  }
}

@media screen and (max-width: 300px) {
  .c-side-closed header .header-container {
    padding: 0.5em 5%; /* Eigenschaft: padding */
  }
  .c-side-closed header .NavSidebar-bt {
    width: 1.2em; /* Eigenschaft: width */
  }
  .c-side-closed header h1 {
    font-size: 1.1em; /* Eigenschaft: font-size */
    margin: 0 0 0 1.8em; /* Eigenschaft: margin */
    max-width: 80%; /* Eigenschaft: max-width */
    overflow: hidden; /* Eigenschaft: overflow */
    white-space: nowrap; /* Eigenschaft: white-space */
  }
  .c-side-closed  .language-menu {
    width: 2.3em; /* Eigenschaft: width */
    height: 1.4em; /* Eigenschaft: height */
  }
}

@media screen and (max-width: 1300px) {
  .c-side-closed main .main-limit {
    padding: 1.4em 5% 2em 5%; /* Eigenschaft: padding */
  }
  .c-side-closed main .category-breadcrumb {
    margin: 0 0 1.2em 0; /* Eigenschaft: margin */
  }
}

@media screen and (max-width: 1000px) {
  .c-side-closed main .main-limit {
    padding: 1.4em 5% 2em 5%; /* Eigenschaft: padding */
  }
  .c-side-closed main .category-breadcrumb {
    margin: 0 0 1.2em 0; /* Eigenschaft: margin */
  }
}

@media screen and (max-width: 850px) {
  .c-side-closed main .main-limit {
    padding: 1.1em 5% 1.5em 5%; /* Eigenschaft: padding */
  }
  .c-side-closed main .category-breadcrumb {
    margin: 0 0 1em 0; /* Eigenschaft: margin */
  }
  .c-side-closed main .category-breadcrumb a {
    font-size: 0.9em; /* Eigenschaft: font-size */
  }
  .c-side-closed main .category-breadcrumb .breadcrumb-separator .sep-bread {
    height: 0.7em; /* Eigenschaft: height */
  }
  .c-side-closed main .main-limit section {
    gap: 1.2em; /* Eigenschaft: gap */
  }
  .c-side-closed main .main-limit h2 {
    font-size: 1.2em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 550px) {
  .c-side-closed main .main-limit {
    padding: 1.1em 5% 1.5em 5%; /* Eigenschaft: padding */
  }
  .c-side-closed main .category-breadcrumb {
    margin: 0 0 1em 0; /* Eigenschaft: margin */
  }
  .c-side-closed main .category-breadcrumb a {
    font-size: 0.9em; /* Eigenschaft: font-size */
  }
  .c-side-closed main .category-breadcrumb .breadcrumb-separator .sep-bread {
    height: 0.7em; /* Eigenschaft: height */
  }
  .c-side-closed main .main-limit section {
    gap: 1.2em; /* Eigenschaft: gap */
  }
  .c-side-closed main .main-limit h2 {
    font-size: 1.2em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 900px) {
  .c-side-open main .bt, .c-side-open main a {
    padding: 0.5em 1em; /* Eigenschaft: padding */
  }
}

@media screen and (max-width: 600px) {
  .c-side-closed main .bt, .c-side-closed main a {
    padding: 0.5em 1em; /* Eigenschaft: padding */
  }
}

@media screen and (max-width: 900px) {
  .c-side-open footer {
    padding: 0.5em 1em; /* Eigenschaft: padding */
  }
  .c-side-open footer span {
    font-size: 0.8em; /* Eigenschaft: font-size */
  }
  .c-side-open footer a {
    font-size: 1em; /* Eigenschaft: font-size */
  }
}

@media screen and (max-width: 600px) {
  .c-side-closed footer {
    padding: 0.5em 1em; /* Eigenschaft: padding */
  }
  .c-side-closed footer span {
    font-size: 0.8em; /* Eigenschaft: font-size */
  }
  .c-side-closed footer a {
    font-size: 1em; /* Eigenschaft: font-size */
  }
}

/* ========== ENDE CSS-GENERIERUNG ========== */
