html, body {
  height: 100%;
}

body {
    font-family:Tahoma, Geneva, sans-serif;
    font-size:10pt;
    color: #2F4F2F; /* statt #185B17 */
    background-color: #CDE3B2; /* statt #CDF28C */
    padding:0;
    margin:0;
}

section {
    width:100%;
    height:100%;
    padding:0;
    margin-left:auto;
    margin-right: auto;
}

.mobile {
    padding:5px;
    margin:5px;
    width:auto;
}

header {
    width:100%;
    height:8%;
    background-color:#4A7043; /* statt #185B17 */
    color:#E6F2E6;            /* statt #CDF28C */
}

nav {
    padding:0;
    width:100%;
    height:5%;
}

main {
    width:100%;
    height:83%;
    overflow:auto;
}

footer{
    width:100%;
    height:4%;
    text-align: right;
    background-color:#4A7043; /* statt #185B17 */
    color:#E6F2E6;            /* statt #CDF28C */
}

footer td, 
footer p{
    color:#E6F2E6;
}

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

table.maintext {
    border: none;
    margin:0px;
    padding:0px;
    width:100%;
    text-align:left;
}

th.nav,td.nav {
    padding: 0px;
    border:2px solid #8e8e8e
}

button {
    -webkit-appearance: none;
    cursor: pointer;
    font-size:11pt;
    background-color:#A8C49C;  /* statt #BAEA5C */
    color:#2F4F2F;             /* statt #185B17 */
    border:0px;
}

button.text {
    -webkit-appearance: none;
    cursor: pointer;
    font-size:11pt;
    background-color:#A8C49C;  /* statt #BAEA5C */
    color:#2F4F2F;             /* statt #185B17 */
    border:0px;
}

button.nav {
    height:100%;
    width:100%;
}

button.footer {
    height:100%;
    width:100px;
}

button.selected {
    background-color:#4A7043; /* statt #185B17 */
    color:#E6F2E6;            /* statt #CDF28C */
}

button:hover, button:focus {
    background-color: #B8D4AC;  /* statt #8e8e8e */
}

button:active {
    background-color: #ffffff;
    color:#000000;
}

h1 {
    padding:10px;
}

a {
  color: #4A7043;             /* moosgrün – passend zum Design */
  text-decoration: underline; /* dauerhaft unterstrichen */
  text-decoration-thickness: 1px;  /* feine Linie */
  text-underline-offset: 2px;     /* etwas Abstand zur Schrift */
  font-weight: 500;
}

a:hover,
a:focus {
  color: #2F4F2F;             /* dunkler beim Hover */
  text-decoration-thickness: 2px;  /* leicht kräftiger beim Hover */
}

a:visited {
  color: #4A7043;             /* gleich wie normaler Link */
}

@media print {
  /* Navigation, Footer, Sidebar ausblenden */
  nav, footer, .sidebar, .menu, .header, .no-print {
    display: none !important;
  }

  @media print {
  /* 1) Nichts künstlich auf eine Seite zwingen */
  html, body, main,
  table.maintext, table.maintext tr, table.maintext td {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* 2) Einspaltig: Tabelle und Zellen stapeln */
  table.maintext,
  table.maintext tr,
  table.maintext td {
    display: block !important;
    width: 100% !important;
  }
  table.maintext { table-layout: auto !important; }
  table.maintext colgroup,
  table.maintext thead,
  table.maintext tfoot { display: none !important; }

  /* Abstand zwischen den "gestapelten" Spalten (Text oben, Bild unten) */
  table.maintext td + td { margin-top: 10mm; }

  /* 3) Inhalt darf über Seiten umbrechen */
  .cell-splittable {
    break-inside: auto !important;
    page-break-inside: auto !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* 4) Bilder behalten, aber nicht zersägen */
  td img {
    max-width: 100% !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* 5) Falls irgendwo Columns aktiv sind → deaktivieren */
  main, table.maintext, .content, .page {
    column-count: auto !important;
    column-width: auto !important;
    column-gap: normal !important;
  }

  /* Seitenränder */
  @page { margin: 15mm; }
}