.hamburger {
  position: relative;
  margin-top: -1px;
  margin-right: 4px;
  margin-bottom: 0;
  cursor: pointer;
}

.hamburger div {
  position: relative;
  width: 29px;
  height: 3px;
  border-radius: 3px;
  background-color: #fff;
  margin-top: 6px;
  transition: all 0.3s ease-in-out;
}

#toggle {
  display: none;
}

#toggle:checked + .hamburger .top-bun {
  transform: rotate(-45deg);
  margin-top: 15px;
}
#toggle:checked + .hamburger .bottom-bun {
  opacity: 0;
  transform: rotate(45deg);
}
#toggle:checked + .hamburger .meat {
  transform: rotate(45deg);
  margin-top: -3px;
}

#toggle:checked + .hamburger + .nav {
  top: 0;
  transform: scale(1);
}