/* CSS-Regeln für das "hell" Theme - Menü soll den Inhalt nicht verdeckt */

/* Header - sicherstellen, dass er oben fixiert und sichtbar ist */
#navigation,
nav#navigation {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 10 !important;
  display: block !important;
  visibility: visible !important;
  height: 60px !important;
}

/* Sidebar - sicherstellen, dass sie den Inhalt nicht verdeckt */
#mySidebar {
  position: fixed !important;
  left: 0 !important;
  top: 60px !important;
  width: 200px !important;
  z-index: 2 !important;
  height: calc(100vh - 60px) !important;
  overflow-y: auto !important;
}

/* Main Content - Abstand für fixed Header und Sidebar (für alle Bildschirmgrößen) */
#main {
  margin-left: 200px !important;
  margin-top: 60px !important;
  position: relative !important;
  z-index: 1 !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

/* Bei kleineren Bildschirmen: Sidebar verstecken und Main-Content volle Breite */
@media screen and (max-width: 992px) {
  #navigation,
  nav#navigation {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 10 !important;
    display: block !important;
    visibility: visible !important;
    height: 60px !important;
  }
  #mySidebar {
    display: none !important;
  }
  #main {
    margin-left: 0 !important;
    margin-top: 60px !important;
  }
}

/* Bei größeren Bildschirmen: Zusätzliche Anpassungen */
@media screen and (min-width: 993px) {
  /* Altes Tabellen-Layout: Payload-Bereich muss Abstand zum Menü haben */
  td.payload,
  .payload {
    padding-left: 210px !important; /* 200px für Sidebar + 10px Abstand */
  }
  
  /* Altes Tabellen-Layout: Menü sollte nicht den Inhalt verdeckt */
  td.menu,
  .menu {
    width: 200px !important;
    max-width: 200px !important;
    vertical-align: top !important;
    position: relative !important; /* Nicht fixed im Tabellen-Layout */
  }
  
  /* Altes Tabellen-Layout: nav-Element im Menü sollte nicht fixed sein */
  td.menu nav,
  .menu nav {
    position: relative !important;
  }
}

/* Altes Tabellen-Layout: Menü sollte den Inhalt nicht verdeckt (für alle Bildschirmgrößen) */
td.menu,
.menu {
  position: relative !important; /* Nicht fixed im Tabellen-Layout */
  width: auto !important;
  max-width: 200px !important;
}

/* Altes Tabellen-Layout: nav-Element im Menü sollte nicht fixed sein */
td.menu nav,
.menu nav {
  position: relative !important;
}

/* css/menu_hamburger_hell.css */
  .menu-btn {
    width: 30px;
    margin-left: 8px;
    cursor: pointer;
  }

/* css/crumbs_hell.css */
.crumbs {
	text-align: center;
	display: flex;
	list-style: none;
}

.crumbs__list {
	display: inline; 
}

/*
.crumbs_container{
	background-color: yellow;
}
*/

.crumbs__link {
	display: block;
	font-size: 16px;
	line-height: 40px;
	padding: 0 30px;
	margin-right: 15px;
	position: relative;
	text-decoration: none;
	background-color: #dddddd;
	color: #000000;
}

.crumbs__link::after{
	content: '';
	width:28px;
	height:28px;
	top:6px;
	right: -14px;
	position: absolute;
	background-color: #dddddd;
	transform: rotate(45deg);
	z-index: 1000;
    border-top-right-radius: 5px;
}
.crumbs__link::before{
	content: '';
	width:28px;
	height:28px;
	top:6px;
	left: -14px;
	position: absolute;
	background-color: #f4f4f4;
	transform: rotate(45deg);
	z-index: 900;
	border-top-right-radius: 5px;
}

.crumbs__list:first-child .crumbs__link::before{
  display:none;
}
/*
.crumbs__list:last-child .crumbs__link::after{
	 display:none; 
}
*/

.first-link{
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

.last-link{
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}

#select_langu, #select_service{
	background-color: #dddddd;
}
* {font-size:medium; }
H1 { font-size: 160%;}
H2 { font-size: 150%;}
H3 { font-size: 140%;}
H4 { font-size: 130%;}
H5 { font-size: 120%; }
H6 { font-size: 110%; }