/* 2025-01-19 */

a:link { text-decoration: none; color: #333333; }
a:visited { text-decoration: none; color: #333333; }
a:active { color: #FF0000; }
a:hover { text-decoration: underline; color: rgb(160,113,79); background-color: #ffffee; }

body
{
    display: grid;
    grid-template:
                   "head"
                   "main_0"
                   "main_1"
                   "main_2"
                   "foot";
    margin: 0em auto 0em auto;
    color: rgb(90,90,90);
    background-color: rgb(200,200,200);
    font-family: "Source Sans Pro", Aptos, Calibri, Verdana, sans-serif;
    font-size: 1.2em;
    min-width: 13em;
    max-width: 78em;
}

h1
{
    font-family: "Source Sans Pro", Aptos, Calibri, Verdana, sans-serif;
    padding: 0em 0em 0em 0em;
    font-variant: small-caps;
    letter-spacing: 0.1em;
}

h2
{
    font-family: "Source Sans Pro", Aptos, Calibri, Verdana, sans-serif;
    padding: 0em 0em 0em 0em;
    font-variant: small-caps;
    letter-spacing: 0.1em;
}

h3
{
    font-family: "Source Sans Pro", Aptos, Calibri, Verdana, sans-serif;
    padding: 0em 0em 0em 0em;
    font-size: 1.15em;
    font-variant: small-caps;
    font-weight: bold;
    letter-spacing: 0.1em;
}

h4
{
    font-family: "Source Sans Pro", Aptos, Calibri, Verdana, sans-serif;
    padding: 0em 0em 0em 0em;
    font-size: 1.10em;
    /*font-variant: small-caps;*/
    font-weight: bold;
    letter-spacing: 0.1em;
}

p
{ 
    -webkit-hyphens: auto;
    hyphens: auto;
}

hr
{
    width: 100%; color: silver; background-color: silver; height: 1px; margin-left: 0px; text-align: left; border: 0px solid silver;
}

.bottom_line
{
    border-bottom: 1px dotted brown;
}

.seitenbreite
{
    width: 843px;
}

.links
{
    float: left; min-width: 10em; max-width: 30em;
    padding-top: 0em;
    padding-right: 1em;
    padding-bottom: 0em;
    padding-left: 1em;
}

article {
    -webkit-column-count: 4;  
    -webkit-column-width: 20em; 
    columns: 4 20em;  
    -ms-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;  
    padding-top: 2em;
    padding-right: 1.5em;
    padding-bottom: 1.5em;
    padding-left: 2em;
}

header
{
  grid-area: head;
  padding: 0em 0em 0em 0em;
}

#kopfbild
{
  grid-area: kopfbild;
}

nav
{
  grid-area: nav;
  position: -webkit-sticky;
  position: sticky;
  top: 0em;
  padding: 0em;
  margin: 0em;
  line-height: 180%;
  letter-spacing: 0.1em;
  font-size: 1.2em;
  /* position: -webkit-static;
  position: static;
  top: auto; */ /* Menü ausgeblendet */
  hyphens: none;
  -ms-hyphens: none;
  -webkit-hyphens: none;
}

nav ul
{
  display: flex;
  flex-flow: row wrap;
  /* justify-content: flex-start; ODER alternativ: space-around */
  padding: 0.8em 0.8em 0.8em 0.4em;
  margin: 0em;
}

nav li
{
  /* display: inline; */
  list-style: none;
  font-weight: normal;
  font-variant: normal;
  color: #333333;
  padding-top: 0em;
  padding-bottom: 0em;
  padding-left: 1.5em;
}

nav a
{
  /* display: block; */
  margin: 0em;
  padding: 0em 0em 0em 0em;
  text-decoration: none;
  font-weight: bold;
}

.haussymbol
{
  font-size: 1.6em; font-weight: bold;
}

.pfeilsymbole
{
  font-size: 0.8em; font-weight: bold;
}

.telsymbol
{
  font-size: 1.6em; font-weight: bold;
}

#titelbild
{
  margin: 0em;
  padding: 0em;
  /* background-repeat: repeat-y; 
  background-position: right bottom; */
}

.textbild
{
  margin: 0em;
  padding: 0em 0em 0em 0em;
}

img.textbildlinks {
  margin: 0em;
  padding: 0em 0.8em 0.8em 0em;
  float: left;
}

.textbildrechts {
  margin: 0em;
  padding: 0em 0em 0.8em 0.8em;
  float: right;
}

#foot
{
  background-color: rgb(228,242,224);
<!--  white-space: nowrap; -->
  font-size: 88%;
}

section
{
  background-color: rgb(228,242,224);
}

.small-screen
{
  padding: 0em 1.3em 0em 1.3em;

@media (min-width: 40em)
{
  padding: 0em 5em 0em 5em;
}
}

.Inhalte-werden-zentriert
{
    display: table;
    margin-left: auto;
    margin-right: auto;
}

img
{
    width: 70%;
}

@media (min-width: 40em)
{ 
 #vollbild
 {
    width: 35%;
  }
}

@media (min-width: 55em)
{ 
 #vollbild
 {
    width: 30%;
  }
}
