body {
  background-color:#013109;
  font-family: Verdana, Helvetica, Arial, sans-serif;
  font-size:90%;
  width:auto;
  max-width:100em;
  min-width:50em;
  display:flex;
  flex-direction: column;
  margin-top:0;
}

div#content {
 background-color:#f8fff9;
 color:#000;
 padding:10px 10px 30px 10px;
 border-radius:3px;
 order:2;
}

div#content h1 {
 color:#013109;
 font-size:180%;
}

div#content h2 {
 color:#013109;
 font-size:140%;
}

div#content h3 {
 color:#013109;
 font-size:120%;
}


div#header {
  width: auto;
  max-width: 100em;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 0;
  margin-right: 0;
  background-image: url('/daten/grafik/logo.png');
  background-repeat: no-repeat;
  background-position: right top;
  padding-right: 0;
  background-size: max(150px, min(230px, calc(100vw - 54em)));
  order:1;
}

div#header #logotext {
  color:#f8fff9;
  font-size:50pt;
  font-weight:bold;
}

div#header #logocredits {
  color:#f8fff9;
  font-size:100%;
  font-weight:bold;
}

a {
 color:#013109;
 text-decoration:none;
}
a:hover {
 color:#016109;
 border-bottom:dotted 1px #016109;
}
a:visited {
 color:#016109;
}

a img {
	border:none;
}

#header a, #footer a {
 color:#f8fff9;
 text-decoration:none;
}
#header a:hover , #footer a:hover {
 color:#ded;
 border-bottom:dotted 1px #ded;
}
#header a:visited, #footer a:visited {
 color:#fff;
}

#header #topnavigation {
  margin-top:.75em;
  color:#aba;
}

#footer {
 text-align:right;
 font-size:70%;
 color:#aba;
 margin:5px 0;
 width:100%;
 order:3;
}

form {
 margin:10px 0;
 border:solid 1px #013109;
 padding:10px;
 border-radius:3px;
}


form#searchform {
	border:none;
	display:inline;
    margin:0 0 0 2px;
    padding:0;
}

form#searchform div {
	display:inline;
	margin:0;
	padding:0;
	white-space: nowrap;
}

form#searchform input {
	width:15em;
	font-size:90%;
	border:solid 1px #fff;
	font-family:Verdana,sans-serif;
	padding:1px;
	margin:0;
    border-top-left-radius:3px;
    border-bottom-left-radius:3px;
}

form#searchform input.button {
	background-color:#013109;
	color:#fff;
	border:solid 1px #fff;
	padding:0 1px;
	text-align:center;
	margin:0;
	font-weight:bold;
	font-family:Verdana,sans-serif;
    width:1.5em;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px;
    border-top-left-radius:0px;
    border-bottom-left-radius:0px;

}

textarea {
  width:99%;
}

div.table {
 margin:10px 0;
}

table {
 border:solid 2px #013109;
 border-spacing:0;
 border-radius:3px;
}

table td, table th {
 font-size:75%;
 border-left:solid 1px #013109;
 border-top:solid 1px #013109;
 background-color:#f8fff9;
}

td:last-child {
 border-right:solid 1px #013109; 
}

tr:last-child td {
 border-bottom:solid 1px #013109; 
}

th:last-child {
 border-right:solid 1px #f8fff9; 
}

tr:last-child th {
 border-bottom:solid 1px #f8fff9; 
}

table th {
  color:#f8fff9;
  background-color:#013109;
  border-color:#f8fff9;
}

table *.right {
 text-align:right;
}

table td strong {
 color:#c02;
}

img {
 border-radius:3px;
}

div#content img {
	max-width:100%;
}

.minitext {
 font-size:80%;
}

div#content table.matrix thead {
      position:sticky;
      top:0;
}


@media screen and  (min-width : 1rem)  and ( max-width : 50rem) {

	body {
      width:auto;
      max-width:100em;
      min-width:23em;
    }
	div#header
	{
	  background-size: 90px;
	  min-width:22.7em;
    }
    
    div#header #logotext {
      font-size:180%;
    }
    
    div#header #logocredits {
      padding-right:95px;
    }
    
    div#content table.matrix {
      display:block;
      max-width: fit-content;
      overflow-x: auto;
    }
    
    div#content div.table.matrix:before {
      content:'Scroll table horizontally to see all columns';
      font-size:60%;
      margin:0;
      display:inline-block;
      color:#666;
    }

}