#submenu {
  display: none;
  list-style: none;
  background: linear-gradient(to left, rgba(0, 3, 13, 0.9), rgba(0, 3, 13, 1));
  border:1px solid white;
  top: 100px;
  right: 0;
  width: 30vw;
  position: fixed;
  z-index: 3;
  margin-bottom: 0;
  margin-top: 0;
  height: 100vh;
  color: white;
  top:80px;
}

#submenu li {
  padding: 10px;
}

#submenu li:hover {
  background-color: #f0f0f0;
}

#zahnrad {
  display: inline;
  height: 22px;
  margin-left: 32px;
  z-index: 5;
  position: relative;
  transition: transform 0.1s ease-out; 

}

#zahnrad:hover {
  transform: scale(1.3);
  transition: transform 0.1s ease-out;
  cursor: pointer;
  /* Stil für das Overlay */
}

#overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* Weichzeichnungseffekt */
  z-index: 2;
  /* Über dem Rest der Seite */
}

#iconstrich {
  color: white;
  display: inline;
  font-size: 18px;
  margin-top: -10px;
  margin-left: 32px;
}

#submenu2 {
  display: none;
  list-style: none;
  background: linear-gradient(to right, rgba(0,0,0, 0.9), rgba(0,0,0, 1));
  border-right:1px solid white;
  border-top:1px solid white;
  top: 100px;
  left: 0;
  position: fixed;
  z-index: 3;
  margin-bottom: 0;
  margin-top: 0;
  height: 74vh;
  color: white;
  padding-left:0;
  width:30vw;
}


.barpoint2{
  margin:1.5vw;
  font-size:3vw;
  background:rgb(31, 31, 31,0.3);
  padding-left:10%;
  border-radius:1vw;
}

#iconbar2{
  list-style-type: none;
  padding: 0;
  align-items: center;
  display: flex;
  height:3vw;
}
.icons2{
  
  display: inline;
  height: 80%;
  margin-top:10%;
  position: relative;
  margin-right:3vw;
  transition: transform 0.1s ease-out; 
}