/* Grundlayout */
body {
margin: 0;
padding: 0;
background-color: #f7f7f7;
font-family: Arial, Helvetica, sans-serif;
}

.header-banner {
width: 100%;
height: 120px;
background-color: rgba(87, 206, 205);
}

/* Karten-Container */
iframe {
width: 100%;
border: none;
border-radius: 6px;
}

/* Typografie */
/* Typografie */
h1 {
font-size: 28px;
font-weight: 600;
margin-bottom: 10px;
margin-top: 20px;
margin-left: 20px;
font-family: Arial

}

h2 {
font-size: 28px;
font-weight: 600;
margin-bottom: 10px;
}

h5 {
margin-top: 18px;
margin-bottom: 5px;
font-size: 18px;
}




/* Links */
a {
text-decoration: none;
}

/* Tabs */
.nav-tabs .nav-link {
font-size: 16px;

padding: 10px 16px;
}

.nav-tabs .nav-link.active {
background-color: #57cecd;
color: white;
}

.tab-content {
padding: 20px;
}

/* Responsive Anpassungen */
@media (max-width: 992px) {
h2 {
font-size: 24px;
}

h5 {
font-size: 16px;
}

.header-banner {
height: 90px;
}
}

@media (max-width: 768px) {
iframe {
height: 380px;
}

h2 {
font-size: 22px;
}
}

@media (max-width: 576px) {
iframe {
height: 320px;
}

h2 {
font-size: 20px;
}

.tab-content {
padding: 15px;
}
}

h2, h5, p {
margin-left: 0;
margin-right: 0;
}

iframe {
margin: 0;
}

.small-gap {
margin-bottom: 1rem; /* Viertel Zeile */
}




.nav-link active {
  background-color: #57cecd;  /* ausgewählt */
  color: white;               /* Textfarbe im aktiven Zustand */
  font-weight: 600;
  border-color: #57cecd;
}
.nav-link {
  color: black;               /* Textfarbe im aktiven Zustand */
  font-weight: 600;
}



.value-bold {
  font-weight: 700; /* fett */
}









.layout-table {
width: 100%;
border-collapse: collapse;
}

.toc-cell {
width: 250px; /* Breite des Inhaltsverzeichnisses */
vertical-align: top;
position: sticky;
top: 10px; /* Abstand von oben beim Scrollen */
height: 100vh; /* Vollbild-Höhe */
overflow-y: auto; /* Falls TOC länger als Bildschirm */
background-color: #f9f9f9;
padding-top: 30px;
}





canvas {
max-width: 300px;
max-height: 300px;
}