.hamburger {
  padding: 15px 5px;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  background-color: transparent; }
  .hamburger__container {
    width: 36px;
    height: 24px;
    position: relative; }
  .hamburger:hover .hamburger__inner {
    transform: translate(-51px, 50%);
    opacity: 0; }
  .hamburger:hover .hamburger__inner::before, .hamburger:hover .hamburger__inner::after {
    transform: translate(102px, 0);
    opacity: 0; }
  .hamburger.is-active .hamburger__inner {
    display: none; }
  .hamburger__inner {
    width: 100%;
    height: 2px;
    background-color: #000000;
    border-radius: 4px;
    position: absolute;
    transition-property: transform, opacity;
    transition-timing-function: ease;
    transition-duration: 0.4s;
    top: 50%;
    transform: translate(5px, -50%);
    opacity: 1; }
    .hamburger__inner::before, .hamburger__inner::after {
      width: 100%;
      height: 2px;
      background-color: #000000;
      border-radius: 4px;
      position: absolute;
      transition-property: transform, opacity;
      transition-timing-function: ease;
      transition-duration: 0.4s;
      content: "";
      opacity: 1;
      transform: translate(-5px, 0); }
    .hamburger__inner::before {
      top: -13px; }
    .hamburger__inner::after {
      top: 13px; }
  .hamburger:hover .hamburger__hidden {
    opacity: 1;
    transform: translate(0, -50%); }
  .hamburger:hover .hamburger__hidden::before, .hamburger:hover .hamburger__hidden::after {
    opacity: 1;
    transform: translate(0, 0); }
  .hamburger.is-active .hamburger__hidden {
    opacity: 1;
    transform: rotate(45deg); }
  .hamburger.is-active .hamburger__hidden::before {
    transform: translate(0, 13px) rotate(90deg);
    transform-origin: center; }
  .hamburger.is-active .hamburger__hidden::after {
    transform-origin: center;
    transform: translate(0, -13px) rotate(0); }
  .hamburger__hidden {
    opacity: 0;
    width: 100%;
    height: 2px;
    background-color: #000000;
    border-radius: 4px;
    position: absolute;
    transition-property: transform, opacity;
    transition-timing-function: ease;
    transition-duration: 0.4s;
    background-color: #000000;
    top: 50%;
    transform: translate(51px, -50%); }
    .hamburger__hidden::before, .hamburger__hidden::after {
      width: 100%;
      height: 2px;
      background-color: #000000;
      border-radius: 4px;
      position: absolute;
      transition-property: transform, opacity;
      transition-timing-function: ease;
      transition-duration: 0.4s;
      background-color: #000000;
      content: "";
      transform: translate(102px, 0); }
    .hamburger__hidden::before {
      top: -13px; }
    .hamburger__hidden::after {
      top: 13px; }

/*# sourceMappingURL=hamburger.css.map */