html, body {
  height: 100%; /* Make sure body and html fill the viewport */
  margin: 0;
}

.main {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  justify-content: space-between; /* push main and footer apart */
  transition: background-image 0.5s ease;
  padding-left: 1rem;
  padding-right: 1rem;
}

.content {
  position: relative;
}

.glossar{
  padding: 1rem;
}

/* The background overlay div */
#bg-overlay {
  position: fixed; /* fixed so it stays behind everything */
  top: 0; left: 0; right: 0; bottom: 0;
  background-size: cover;
  background-position: center;
  opacity: 0.3; /* control your background image opacity here */
  z-index: -1;  /* behind all content */
  pointer-events: none; /* clicks pass through */
}

* {
  font-family: 'Courier New', Courier, monospace;
  color: red ;
  /* color: #696969; */
  font-size: 1rem;
  line-height: 1.3rem;
}

h1{
  padding: 2px 2px;
 /* border-style: dotted; */
  text-align: center;
  letter-spacing: 0.5px;;
  padding-top: 10px;
  line-height: 130%;
  padding-bottom: 4px;
  
}

.anpassen{
  padding-left: 14px;
  /*letter-spacing: px;*/
  z-index: auto;
 
}

.divider{
  border-bottom: 1px solid red;
}

.spacing{
  letter-spacing: 4px;
}

.small_spacing{
  letter-spacing: 2px;
}

.spacingg{
  letter-spacing: 4.2px;
}

.line{
  line-height: 70%;
  font-family: 'Courier New', Courier, monospace;
  z-index: 1;

}
.info{
  font-size: 1rem;
}
.kursivb{
  font-family:'Snell Roundhand','Apple Chancery';
  font-size: 1.5rem;
}
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

li {
  list-style: none;
}

/* .untermenu {
  display: none;
}

.untermenu.offen {
  display: block;
}
*/

.menupunkt {
  cursor: pointer;
  user-select: none;
}

.audio_1{
  padding-top: 4px;
  padding-bottom: 6px;
}

.impressum{

}

.impressum {
font-size: 0.7rem;
}

audio{
width: 100%;
}

/* Tabs in der Liste  */
.gap_1 {
  display: inline-block;
   /* Abstand vor FÜR */
}

.gap_2 {
  display: inline-block;
  width: 1em; /* Abstand nach FÜR */
}


/*  Erster Versuch mit marquee, jedoch soll marquee veraltet sein */
.bottom-bar{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #DAA520;
  color: aliceblue;
  padding: 10px;
  box-sizing: border-box;
  overflow: hidden; /
}

marquee{
  white-space: nowrap;
}

img{
  width: 50px;
}

.bilder > img {
  display: none;
}

.bild_1{
  position: absolute;
  top: 136px;
  left: 0px;
}

.bild_2{
  position: absolute;
  top: 630px;
  left: 255px;
  z-index: 1;
}

.bild_3{
  position: absolute;
  top: 180px;
  left: 135px;
}

.bild_4{
  position: absolute;
  top: 290px;
  left: 184px;
}
.bild_5{
  position: absolute;
  top: 580px;
  left: 90px;
}

.bild_6{
  position: absolute;
  top: 505px;
  left: 340px;
}

.bild_7{
  position: absolute;
  top: 255px;
  right: 10px;
}

.bild_8{
  position: absolute;
  top:450px;
  left: 225px;
}

.bild_9{
  position: absolute;
  top:475px;
  left: 18px;
}