* {
  box-sizing: border-box;
  margin:0;
  padding:0;/*sämtliche Außen- und Innenabstände auf "Null"*/
}
body {
background-color: #822122;
font-family: Verdana;
color: #595a5c;
}

#page { /*Seite zentrieren*/
  background-color: white;
  position: absolute;
  width: 60%;
  left: 50%;
  margin-left: -30%;/*negativer hälftigen Wert der #page-Breite*/
}
#zus {
  width: 100%;
  overflow: auto;
}
.hlogo {
  float: left;
  width: 25%;
  padding: 0px;  /* Innen top right bottom left*/
}
.hlogo img {
   width: 100%; height: auto;
}
.htxt {
  float: left;
  width: 75%;
  background-color: white;
  padding: 110px 10px 10px 10px;  /*Innen top right bottom left*/
}
.menu {
  float: left;
  width: 25%;
  background-color: white;
  padding: 14px 0px 0px 0px; /* Innen top right bottom left*/
}
.nav-menue {
  float: left;
  padding: 10px;  /* Innen top right bottom left*/
}

/*Beginn Steuerung*/

#steuerung li {
        list-style: none; /*float: left; Anordnung nebeneinander*/
}
#steuerung a {
        display: block;
        padding: 8px 8px 8px 16px;  /*Innen top right bottom left*/
        text-decoration: none;
        color: #595a5c;
        background-color: white;
}
.menue-button {
        display: none;
}
#steuerung {
        float: left;
}
#steuerung a:hover {
        color: #595a5c;
        background: #eb7621;
}
/*Ende Steuerung*/

.main {
  float: left;
  width: 75%;
  background-color: white;
  padding: 10px 30px 10px 10px;  /*Innen top right bottom left*/
  overflow: hidden;
}
.main ul {
    list-style-type: circle;
    margin: 0;
    padding: 12px 0px 6px 17px;  /*Innen top right bottom left*/
}
.main li {
    padding: 0px 0px 6px 0px;  /*Innen top right bottom left*/
}

p {
color: #595a5c;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
text-align: justify;
margin: 0;
padding:  12px 0px 6px 0px; /*Innen top right bottom left*/
}

.top {
text-align: right;
padding:  6px 0px 12px 0px; /*Innen top right bottom left*/
}

.kurz {
text-align: left;
}

H1 {
color: #822122;
font-size: 20px;
margin: 0;
padding: 10px 0px 3px 0px; /*Innen top right bottom left*/
border-bottom: 1px solid #822122;
}
/*H2 {
color: #546c8e;
font-size: 18px;
margin: 0;
padding: 10px 0px 5px 0px;
}

H3 {
color: #000000;
font-size: 16px;
margin: 0;
padding: 10px 0px 5px 0px;
}
*/
H5 {
color: #595a5c;
font-size: 36px;
font-weight: normal;
margin: 0;
padding:0;
}
H6 {
color: #595a5c;
font-size: 22px;
font-weight: normal;
margin: 0;
padding:0;
}
a:link {
color: #822122;
outline: none;
-moz-outline: none;
text-decoration: none;
}
a:hover {
color: #eb7621;
text-decoration: underline;
}
a:active {
color: red;
text-decoration: underline;
}
a:visited {
color: #822122;
text-decoration: none;
}

@media only screen and (max-width:1600px) {
  /* For medium monitor: */
  #page { /*Seite zentrieren verkleinern*/
  width: 66%;
  left: 50%;
  margin-left: -33%;/*negativer hälftigen Wert der #page-Breite*/
  }
  H5 {
  font-size: 34px;
  }
  .htxt {
  padding: 90px 10px 10px 10px;  /*Innen top right bottom left*/
  }
}
@media only screen and (max-width:1280px) {
  /* For small monitor: */
  #page { /*Seite zentrieren verkleinern*/
  width: 76%;
  left: 50%;
  margin-left: -38%;/*negativer hälftigen Wert der #page-Breite*/
  }
  H5 {
  font-size: 32px;
  }
  H6 {
  font-size: 20px;
  }
  .htxt {
  padding: 80px 10px 10px 10px;  /*Innen top right bottom left*/
  }
}
@media only screen and (max-width:1024px) {
  /* For tablets: */
  #page { /*Seite zentrieren*/
  width: 86%;
  left: 50%;
  margin-left: -43%;/*negativer hälftigen Wert der #page-Breite*/
  }
  H5 {
  font-size: 30px;
  }
  H6 {
  font-size: 18px;
  }
  .hlogo {
  width: 30%;
  }
  .htxt {
  width: 70%;
  padding: 100px 0px 10px 10px;  /*Innen top right bottom left*/
  }
  .menu {
  width: 30%;
  }
  .main {
  width: 70%;
  padding: 10px 10px 10px 10px;  /*Innen top right bottom left*/
  }
}
@media only screen and (max-width:800px) {
  /* For mobile phones: */
  #page { /*Seite zentrieren*/
  width: 90%;
  left: 50%;
  margin-left: -45%;/*negativer hälftigen Wert der #page-Breite*/
  }
  H5 {
  font-size: 28px;
  }
  H6 {
  font-size: 18px;
  }
  .htxt {
  width: 100%;
  padding: 0px 10px 0px 10px;  /*Innen top right bottom left*/
  }
  .hlogo {
    width: 100%;
  }
  .main {
    width: 100%;
    padding: 10px
  }
  .hlogo img {
  width: 150px; height: auto
  }

/* CSS für MENÜ-Button und entsprechende Steuerung:
Menü-Button oben rechts einblenden bei kleiner als 600px */
        .menue-button {
                background-color: white;
                display: block;
                position: absolute;
                right: 0;
                top: 0;
                padding: 10px 10px 0px 10px; /* Innen top right bottom left*/
                cursor: pointer;
                text-decoration: none;
        }
        .menu {
                float: left;
                width: 70%;
                position: absolute;
                right: 0;
                top: 0;
                padding: 0; /* Innen top right bottom left*/
        }
        #steuerung {
                float: left;
                width: 100%;
                display: none;
                position: absolute;
                right: 0;
                top: 40px;
        }
        #steuerung li {
                width: 100%;
                border-bottom: 2px solid silver;
        }
        #steuerung a {
        background-color: lightgray;
        }
}

/* die Magie, um die Steuerung einzublenden (auch auf mobile Devices) */
#nav-menue:target
#steuerung {
        display: block;
}
/* ausblenden des Menü-Buttons zum öffnen - somit wird der zum Schließen sichtbar */
#nav-menue:target
.menue-button-beschr-open {
        display: none ;
}