/* CSS Verkehr */

body {
  max-width: 60em;
  margin: 0 auto;
  background-color: #FFEDE0;
  color: black;
  border: 0.5em solid transparent;
  padding-left: 0.5em;
  line-height: 1.5em;
  font-family: Verdana; font-size: 1em; color: black font-weight: normal;
  hyphens: auto;
}

ul {list-style-position: inside;}
li {list-style-position: inside;}

Alfabet {font-family: Verdana; font-size: 40px; color: brown; font-weight: bold;}
a:hover {color: darkblue;}

a.Seitentitel {font-family: Verdana; font-size: 22px; color: darkblue; font-weight: bold;}

a {font-family: Verdana; font-size: 16px;  text-decoration: none; color: brown; font-weight: bold; line-height: 2em;}
a:hover {color: darkblue;}

H1 {font-family: Verdana; font-size: 16px; font-weight: bold; color: darkblue;}

H2 {font-family: Verdana; font-size:16px; font-weight: bold; color: darkblue;}

H3 {font-family: Verdana; font-size: 16px; font-weight: bold; color: darkblue;}

hr {color: skyblue; border-width: 3px;}

a.menue-button {font-size: 30px; color: white;}

bottom-button {font-size: 30px; color: white;}

/*table*/
tr {line-height: 1em;}
td {text-align: left; font-size: 16px; vertical-align: baseline; line-height: 1.5em;}

header {
  display: flex;
  flex-direction: column;
  background-color: transparent;
  width: 100%;
}

a.Seitentitel {
  display: block;
  background-color: transparent;
  margin-top: 1em;
  width: 40%;
}

a.Seitentitel:hover {
  color: brown;
}

Suchen {
  display: block;
  background-color: transparent;
  width: 100%;
}

#steuerung li {
  display: block;
  list-style: none;
  float: left;
  border-radius: 1em;
  flex: 1 1 100%;
}

#steuerung a {
  display: flex;
  float: left;
  color: white;
  background: brown;
  padding: 10px 22px 10px 22px;
  border-radius: 1em;
  text-decoration: none;
  text-align: center;
}

#steuerung a:hover {
  color: black;
  background-color: orange;
}

.menue-button {
  display: block;
  color: white;
  background: brown;
  width:50px;
  height:50px;
  position: absolute;
  top: 5px;
  right: 10px;
  padding: 0.1em;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
}

.menue-button:hover {
  color: black;
  background-color: orange;
}

#steuerung {
  float: left;
  margin-bottom: 15px;
  width: 100%;
}

/* Erweiterung um MENUE-Button */
/* Menü-Button oben rechts einblenden bei kleiner als 800px */
@media only screen and (max-width:799px) {

a.Seitentitel {
  display: block;
  background-color: transparent;
  margin-top: 1em;
  width: 80%;
}

#steuerung {
  float: left;
  width: 100%;
  display: none;
  margin-bottom: 15px;
}

#steuerung li {
  width: 100%;
}

/* Schaltstelle zum Einblenden des Menues */
#nav-menue:target #steuerung {
display: block;
}

/* Kleiner Bildschirm  */
/* Ausblenden des Menues und Funktion des Buttons revers  */
#nav-menue:target .menue-button-beschr-open {
  display: none ;
}

#steuerung a {
  display: block;
  flex-direction: column;
  color: white;
  background: brown;
  margin-top: 5px;
  padding: 10px 40px 10px 40px;
  border-radius: 1em;
  text-decoration: none;
  text-align: center;
  width: 100%;
}

#steuerung a:hover {
  color: black;
  background-color: orange;
}

#AlfaBlock {
  display: block;
  float: left;
  background-color: transparent;
  width: 100%;
  font-size: 40px;
  font-weight: bold;
  color: brown;
}

}

/* Großer Bildschirm  */
@media screen and (min-width: 800px) {

#AlfaBlock {
  display: block;
  float: left;
  width: 100%;
  margin-top: 10px;
  background-color: transparent;
  font-size: 40px;
  font-weight: bold;
  color: brown;
}

}

/* Der Rest ist für alle viewpoints */

Textfeld {
  display: block;
  flex-direction: row;
  align-items: flex-start;
  float: left;
  width: 100%;
  font-family: Verdana; font-size: 16px; color: black;
  hyphens: auto;
}

Abschluss {
  display: inline-block;
  flex-direction: column;
  width: 100%;
}

Abschlusswerbung {
  display: block;
}

.scrollicon {
  text-align: center;
  text-decoration:none;
  width:50px;
  height:50px;
  border-radius:50%;
  color: white;
  background: brown;
  opacity:0.5;
  position:fixed;
  bottom:60px;
  right:120px;
  display:none;
  border:1px solid #333;
}

.scrollicon div{
  font-weight:bold;
  font-size:28px;
  background-color: brown;
  color:white;
  padding-top:12px;
}

Footer {
  display: flex;
  background: transparent;
  border-color: brown;
  font-weight: bold;
  flex-direction: row;
  width: 100%;
  border-radius: 1em;
  border: 3px solid brown;
  justify-content: space-around;
}

.Datenschutz {
  display: block;
  padding-left: 30px;
}

.Impressum {
  display: block;
  padding-right: 30px;
}