* {
            padding: 0;
            margin: 0;
            font-family: 'Audiowide', sans-serif;
        }
        header {
            display: flex;
            align-items: center;
            height: 5rem;
            width: 100vw;
            background-color: rgb(7, 237, 153);
            }
            .header-img {
                left: 0;
                height: 5rem;
                width: auto;
            }
        nav {
            display: flex;
            align-items: center;
            flex-direction: row;
            right: 0;
            }
            .nav-link {
                font-size: 1.5rem;
                color: #000;
                font-family: 'Audiowide';
                margin: 0.5rem;
                padding: 0.5rem;
            }
            .nav-link:hover {
                background-color: #000;
                color: rgb(7, 237, 153);
            }
            .accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
  }

  .tabcontent {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

  }
  .panel {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
  }
  
  /* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
  .active, .accordion:hover {
    background-color: #ccc;
  }
  
  /* Style the accordion panel. Note: hidden by default */
  .panel {
    padding: 0 18px;
    background-color: white;
    display: none;
    overflow: hidden;
  }

  .location-img {
    height: 20rem;
    width: auto;

  }

  .map-img {
    height: 20rem;
    width: auto;
  }

  .audiowide-regular {
    font-family: "Audiowide", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  .container-img {
    height: calc(100vh - 10rem);
    width: 100%;
    background-image: url('Wurzel.JPG');
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
  }
  .main-img {
    height: 100%;
    width: auto;
  }

  #demo {
    position: absolute;
    right: 1rem;
    height: 5rem;
    width: auto;
    font-size: 1.5rem;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
  }

main {
  margin-bottom: 5rem;
}
  .scroll-left {
    display: flex;
    justify-content: center;
    align-items: center;
             height: 5rem;	
             overflow: hidden;
             position: fixed;
             width: 100%;
             bottom: 0;
             background: rgb(7, 237, 153);
            }
            .scroll-left p {
              display: flex;
              align-items: center;
              justify-content: center;
              font-size: 1.5rem;
             position: absolute;
             width: 150%;
             height: 5rem;
             margin: 0;
             text-align: center;
             /* Apply animation to this element */
             animation: scroll-left 20s linear infinite;
            }
            /* Move it (define the animation) */
            @keyframes scroll-left {
             0%   {
             transform: translateX(70%); 		
             }
             100% {
             transform: translateX(-75%); 
             }
    }

    /* Style the tab */
.tab {
  float: left;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
  width: 100vw;
  
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;

}

/* Style the buttons that are used to open the tab content */
.tab button {
  display: flex;
  background-color: inherit;
  color: black;
  padding: 22px 16px;
  width: 100%;
  border: none;
  outline: none;
  text-align: right;
  cursor: pointer;
  flex-direction: column;

}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current "tab button" class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontents {
  float: left;
  padding: 0px 12px;
  border: 1px solid #ccc;
  width: 70%;
  border-left: none;
  height: 42.5%;
  display: flex;
  background-color: rgb(7, 237, 153);
  flex-direction: row;
  padding-right: 2%;
}

.Ayri {
  position: fixed;
  margin-left: 30%;
}

.Text_Artist {
margin-top: 24px;
width: 70%;
padding-left: 1%;
padding-right: 5%;
}

.Text_Workshop {
  width: 100%;
  padding-left: 1%;
  padding-right: 5%;
  }
  

.Garderobe {
  display: flex;
  width: 30%;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;

}

.Künstler {
  width: 30%;
  height: 100%;
  float: left;
  flex-direction: column;
  display: flex;
  justify-content: center;
  position: relative;
}

.Künstler h3 {
  position: absolute;
  top: 0;
  left: 0;
}


.Bilder {
  width: 100%;
  height: auto;
}

.Bild {
  width: 15rem;
  height: 15rem;
}
* {
  box-sizing: border-box;
}

body2 {
  background-color: #f1f1f1;
  padding: 20px;
  font-family: Arial;
}

/* Center website */
.main2 {
  max-width: 1000px;
  margin: auto;
}

h12 {
  font-size: 50px;
  word-break: break-all;
}

.row2 {
  margin: 8px -16px;
}

/* Add padding BETWEEN each column (if you want) */
.column2 {
  padding: 8px;
}

/* Create four equal columns that floats next to each other */
.column2 {
  float: left;
  width: 25%;
}

/* Clear floats after rows */
.row:after2 {
  content: "";
  display: table;
  clear: both;
}

/* Content */
.content2 {
  background-color: white;
  padding: 10px;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 900px) {
  .column2 {
    width: 50%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column2 {
    width: 100%;
  }
}

.Drogen-Tabellen {
width: 40%;
height: 30%;

}

.BI-KA {
  height: 20rem;
  width: auto;
}
