#sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  right: 0;
  background: #292929;
  overflow-x: hidden;
  padding-top: 3rem;
}

#sidenav a {
  text-decoration: none;
  color: #888;
  display: block;
  margin: .7rem;
  cursor: pointer;
}

#sidenav a:hover {
  color: #ccc;
}

#sidenav a.selected {
  display: list-item;
  list-style-type: square;
  list-style-position: inside;
}

#sidenav .closebtn {
  position: absolute;
  top: 1rem;
  right: 1.5rem;
  font-size: 2rem;
  margin: 0;
}

#sidenav select {
  color: white;
  background: #222;
  border: #ccc .2rem solid;
  width: 100%;
  font-size: 1rem;
  padding: .7rem;
}

#sidenav input + label {
    width: 3.4rem;
    text-align: center;
}

@media screen and (max-height: 450px) {
  .sidenav {
    padding-top: 1rem;
  }
  .sidenav a {
    font-size: 1rem;
  }
}