.hamburger {
  position: sticky;
  width: 50px;
  height: 20px;
  right: 0;
  z-index: 10000;
}

.bar {
  display: block;
  position: absolute;
  width: 100%;
  height: 2px;
  transition: top 0.2s, transform 0.2s, opacity 0.2s;
}
.bar:nth-child(1) {
  top: 0;
  background: #000;
}
.bar:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
  background: #000;
}
.bar:nth-child(3) {
  top: 100%;
  transform: translateY(-100%);
  background: #000;
}
.bar.active:nth-child(1) {
  top: 50%;
  transform: translateY(-50%) rotate(135deg);
  background: #fff;
}
.bar.active:nth-child(2) {
  transform: translate(50%, -50%);
  opacity: 0;
  background: #fff;
}
.bar.active:nth-child(3) {
  top: 50%;
  transform: translateY(-50%) rotate(-135deg);
  background: #fff;
}/*# sourceMappingURL=hamburger.css.map */