/* The sidebar menu */
.sidebar {
  height: 100dvh;
  /* Full-height: remove this if you want "auto" height */
  width: var(--sidenavmargin);
  /* Set the width of the sidebar */
  position: fixed;
  /* Fixed Sidebar (stay in place on scroll) */
  z-index: 999999;
  /* Stay on top */
  top: 0;
  /* Stay at the top */
  left: 0;
  background-color: #111;
  /* Black */
  overflow-x: hidden;
  /* Disable horizontal scroll */
  display: hidden;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}


/* The navigation menu links */
.sidebar a {
  padding: 6px 8px 6px 16px;
  color: #818181;
  display: block;
  font-size: 2dvw;
  outline: none;
  overflow: hidden;
  font-size-adjust: 0.5;
  font-weight: bold;
}

.sidebar img {
  width: var(--sidenavimgsize);
  height: var(--sidenavimgsize);
}

#logo{
  margin: 2dvh;
}

.sidebar .content {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 0;
  left: 0;
  left: -50%;
  animation: slide 0.5s forwards;
}

@keyframes slide {
  100% {
    left: 0;
  }
}