.menu-btn {
  position: fixed;
/*
  position: -webkit-sticky;
  position: sticky;
  background-color: #1b3740;
*/
  background-color: transparent;;
  border: none;
  cursor: pointer;
}
/* The side menu container */
.side-menu {
  position: fixed;
  left: -660px; /* start off screen */
  top: 0;
  width: 550px;
  height: 100%;
  background-color: #345;
  color: #fff;
  transition: left 0.3s ease-in-out;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
  border-color: gray;
  border-style: outset;
  border : 5px;
  box-shadow: 10px 10px 5px #000000;
  text-shadow: #000 7px 7px 5px;
  font-size: 0.9em;
   z-index: 9;
}
@media (min-height: 1024px) {
    .side-menu {
        width: 650px;
        font-size: 1.0em;
    }
}
/* Toggle: when we add the 'active' class, slide the menu in */
.side-menu.active {
  left: 0;
}

/* Menu item styling */
.side-menu a {
  color: #fff;
  display: block;
  margin: 1rem 0;
  text-decoration: none;
}
/* Button to open the menu */
.close-btn {
  background-color: #345;
  color: #fff;
  border: none;
  cursor: pointer;
}
.submenu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}

.submenu.open {
  max-height: 100vh;  /* Adjust based on the content */
}
.sub-button {
  background:none;
  border:none;
  margin:0;
  padding:0;
  color: #fff;
  text-shadow: #000 3px 3px 3px;
  font-size: 1.1em;
  font-weight: bold;
}
ul {
  padding-inline-start: 16px;
}