/* The side navigation menu */
.classSidenav {
    margin-top: calc(var(--header-height) + var(--navbar-height));
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    
    overflow-x: hidden;
    padding-top: 60px;
    transition: 0.5s;
}
  
/* The navigation menu links */
.classSidenav li,
.classSidenav h2 {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 25px;

display: block;
transition: 0.3s;
}

.classSidenav h2{
    margin-top: 0;
}
  
/* When you mouse over the navigation links, change their color */
.classSidenav li:hover {
background-color: var(--hover-bg-color);
}
  
/* Position and style the close button (top right corner) */
.classSidenav .closebtn {
position: absolute;
top: 10px;
right: 10px;
font-size: xx-large;
background-color: transparent;
padding: 0;

}

/* the menu hamburger icon*/
#menuicon {
    width: 35px;
    height: 5px;
    background-color: black;
    margin: 6px 0;
}

input[type="checkbox"] {
    margin-right: 5px;
}