.hamburger {
  padding: calc((3em - 9px) / 6) 0;
}
.hamburger .line {
  width: 3em;
  height: 3px;
  background-color: #183964;
  display: block;
  margin: calc((3em - 9px) / 3) auto;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.hamburger .line:nth-child(1) {
  margin: 0;
}
.hamburger .line:nth-child(3) {
  margin: 0;
}
.hamburger:hover {
  cursor: pointer;
}
.hamburger.hamburger-close.active .line:nth-child(1) {
  -webkit-transform: translateY(1em) rotate(45deg);
  -moz-transform: translateY(1em) rotate(45deg);
  -ms-transform: translateY(1em) rotate(45deg);
  -o-transform: translateY(1em) rotate(45deg);
}
.hamburger.hamburger-close.active .line:nth-child(2) {
  opacity: 0;
}
.hamburger.hamburger-close.active .line:nth-child(3) {
  -webkit-transform: translateY(-1em) rotate(-45deg);
  -moz-transform: translateY(-1em) rotate(-45deg);
  -ms-transform: translateY(-1em) rotate(-45deg);
  -o-transform: translateY(-1em) rotate(-45deg);
}
.hamburger.hamburger-left.active .line:nth-child(1) {
  -webkit-transform: translateX(-6px) rotate(-45deg);
  -moz-transform: translateX(-6px) rotate(-45deg);
  -ms-transform: translateX(-6px) rotate(-45deg);
  -o-transform: translateX(-6px) rotate(-45deg);
}
.hamburger.hamburger-left.active .line:nth-child(2) {
  opacity: 0;
}
.hamburger.hamburger-left.active .line:nth-child(3) {
  -webkit-transform: translateY(-6px) rotate(45deg);
  -moz-transform: translateY(-6px) rotate(45deg);
  -ms-transform: translateY(-6px) rotate(45deg);
  -o-transform: translateY(-6px) rotate(45deg);
}
.hamburger.hamburger-left.active .line:nth-child(1) {
  -webkit-transform: translateX(6px) rotate(45deg);
  -moz-transform: translateX(6px) rotate(45deg);
  -ms-transform: translateX(6px) rotate(45deg);
  -o-transform: translateX(6px) rotate(45deg);
}
.hamburger.hamburger-left.active .line:nth-child(2) {
  opacity: 0;
}
.hamburger.hamburger-left.active .line:nth-child(3) {
  -webkit-transform: translateY(6px) rotate(-45deg);
  -moz-transform: translateY(6px) rotate(-45deg);
  -ms-transform: translateY(6px) rotate(-45deg);
  -o-transform: translateY(6px) rotate(-45deg);
}
@media only screen and (min-width: 320px) {
  .hamburger {
    padding: calc((2rem - 9px) / 6) 0;
  }
  .hamburger .line {
    width: 2rem;
    height: 3px;
    margin: calc((2rem - 9px) / 3) auto;
  }
  .hamburger.hamburger-close.active .line:nth-child(1) {
    -webkit-transform: translateY(0.66666666666667rem) rotate(45deg);
    -moz-transform: translateY(0.66666666666667rem) rotate(45deg);
    -ms-transform: translateY(0.66666666666667rem) rotate(45deg);
    -o-transform: translateY(0.66666666666667rem) rotate(45deg);
  }
  .hamburger.hamburger-close.active .line:nth-child(3) {
    -webkit-transform: translateY(-0.66666666666667rem) rotate(-45deg);
    -moz-transform: translateY(-0.66666666666667rem) rotate(-45deg);
    -ms-transform: translateY(-0.66666666666667rem) rotate(-45deg);
    -o-transform: translateY(-0.66666666666667rem) rotate(-45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(1) {
    -webkit-transform: translateX(-6px) rotate(-45deg);
    -moz-transform: translateX(-6px) rotate(-45deg);
    -ms-transform: translateX(-6px) rotate(-45deg);
    -o-transform: translateX(-6px) rotate(-45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(3) {
    -webkit-transform: translateY(-6px) rotate(45deg);
    -moz-transform: translateY(-6px) rotate(45deg);
    -ms-transform: translateY(-6px) rotate(45deg);
    -o-transform: translateY(-6px) rotate(45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(1) {
    -webkit-transform: translateX(6px) rotate(45deg);
    -moz-transform: translateX(6px) rotate(45deg);
    -ms-transform: translateX(6px) rotate(45deg);
    -o-transform: translateX(6px) rotate(45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(3) {
    -webkit-transform: translateY(6px) rotate(-45deg);
    -moz-transform: translateY(6px) rotate(-45deg);
    -ms-transform: translateY(6px) rotate(-45deg);
    -o-transform: translateY(6px) rotate(-45deg);
  }
}
@media only screen and (min-width: 568px) {
  .hamburger {
    padding: calc((2rem - 9px) / 6) 0;
  }
  .hamburger .line {
    width: 2rem;
    height: 3px;
    margin: calc((2rem - 9px) / 3) auto;
  }
  .hamburger.hamburger-close.active .line:nth-child(1) {
    -webkit-transform: translateY(0.66666666666667rem) rotate(45deg);
    -moz-transform: translateY(0.66666666666667rem) rotate(45deg);
    -ms-transform: translateY(0.66666666666667rem) rotate(45deg);
    -o-transform: translateY(0.66666666666667rem) rotate(45deg);
  }
  .hamburger.hamburger-close.active .line:nth-child(3) {
    -webkit-transform: translateY(-0.66666666666667rem) rotate(-45deg);
    -moz-transform: translateY(-0.66666666666667rem) rotate(-45deg);
    -ms-transform: translateY(-0.66666666666667rem) rotate(-45deg);
    -o-transform: translateY(-0.66666666666667rem) rotate(-45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(1) {
    -webkit-transform: translateX(-6px) rotate(-45deg);
    -moz-transform: translateX(-6px) rotate(-45deg);
    -ms-transform: translateX(-6px) rotate(-45deg);
    -o-transform: translateX(-6px) rotate(-45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(3) {
    -webkit-transform: translateY(-6px) rotate(45deg);
    -moz-transform: translateY(-6px) rotate(45deg);
    -ms-transform: translateY(-6px) rotate(45deg);
    -o-transform: translateY(-6px) rotate(45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(1) {
    -webkit-transform: translateX(6px) rotate(45deg);
    -moz-transform: translateX(6px) rotate(45deg);
    -ms-transform: translateX(6px) rotate(45deg);
    -o-transform: translateX(6px) rotate(45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(3) {
    -webkit-transform: translateY(6px) rotate(-45deg);
    -moz-transform: translateY(6px) rotate(-45deg);
    -ms-transform: translateY(6px) rotate(-45deg);
    -o-transform: translateY(6px) rotate(-45deg);
  }
}
@media only screen and (min-width: 768px) {
  .hamburger {
    padding: calc((3rem - 9px) / 6) 0;
  }
  .hamburger .line {
    width: 3rem;
    height: 3px;
    margin: calc((3rem - 9px) / 3) auto;
  }
  .hamburger.hamburger-close.active .line:nth-child(1) {
    -webkit-transform: translateY(calc(3rem / 3)) rotate(45deg);
    -moz-transform: translateY(calc(3rem / 3)) rotate(45deg);
    -ms-transform: translateY(calc(3rem / 3)) rotate(45deg);
    -o-transform: translateY(calc(3rem / 3)) rotate(45deg);
  }
  .hamburger.hamburger-close.active .line:nth-child(3) {
    -webkit-transform: translateY(calc(3rem / -3)) rotate(-45deg);
    -moz-transform: translateY(calc(3rem / -3)) rotate(-45deg);
    -ms-transform: translateY(calc(3rem / -3)) rotate(-45deg);
    -o-transform: translateY(calc(3rem / -3)) rotate(-45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(1) {
    -webkit-transform: translateX(calc(3px * 2)) rotate(-45deg);
    -moz-transform: translateX(calc(3px * 2)) rotate(-45deg);
    -ms-transform: translateX(calc(3px * 2)) rotate(-45deg);
    -o-transform: translateX(calc(3px * 2)) rotate(-45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(3) {
    -webkit-transform: translateY(calc(3px * -2)) rotate(45deg);
    -moz-transform: translateY(calc(3px * -2)) rotate(45deg);
    -ms-transform: translateY(calc(3px * -2)) rotate(45deg);
    -o-transform: translateY(calc(3px * -2)) rotate(45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(1) {
    -webkit-transform: translateX(calc(3px * 2)) rotate(45deg);
    -moz-transform: translateX(calc(3px * 2)) rotate(45deg);
    -ms-transform: translateX(calc(3px * 2)) rotate(45deg);
    -o-transform: translateX(calc(3px * 2)) rotate(45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(3) {
    -webkit-transform: translateY(calc(3px * 2)) rotate(-45deg);
    -moz-transform: translateY(calc(3px * 2)) rotate(-45deg);
    -ms-transform: translateY(calc(3px * 2)) rotate(-45deg);
    -o-transform: translateY(calc(3px * 2)) rotate(-45deg);
  }
}
@media only screen and (min-width: 1200px) {
  .hamburger {
    padding: calc((3rem - 9px) / 6) 0;
  }
  .hamburger .line {
    width: 3rem;
    height: 3px;
    margin: calc((3rem - 9px) / 3) auto;
  }
  .hamburger.hamburger-close.active .line:nth-child(1) {
    -webkit-transform: translateY(1rem) rotate(45deg);
    -moz-transform: translateY(1rem) rotate(45deg);
    -ms-transform: translateY(1rem) rotate(45deg);
    -o-transform: translateY(1rem) rotate(45deg);
  }
  .hamburger.hamburger-close.active .line:nth-child(3) {
    -webkit-transform: translateY(-1rem) rotate(-45deg);
    -moz-transform: translateY(-1rem) rotate(-45deg);
    -ms-transform: translateY(-1rem) rotate(-45deg);
    -o-transform: translateY(-1rem) rotate(-45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(1) {
    -webkit-transform: translateX(-6px) rotate(-45deg);
    -moz-transform: translateX(-6px) rotate(-45deg);
    -ms-transform: translateX(-6px) rotate(-45deg);
    -o-transform: translateX(-6px) rotate(-45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(3) {
    -webkit-transform: translateY(-6px) rotate(45deg);
    -moz-transform: translateY(-6px) rotate(45deg);
    -ms-transform: translateY(-6px) rotate(45deg);
    -o-transform: translateY(-6px) rotate(45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(1) {
    -webkit-transform: translateX(6px) rotate(45deg);
    -moz-transform: translateX(6px) rotate(45deg);
    -ms-transform: translateX(6px) rotate(45deg);
    -o-transform: translateX(6px) rotate(45deg);
  }
  .hamburger.hamburger-left.active .line:nth-child(3) {
    -webkit-transform: translateY(6px) rotate(-45deg);
    -moz-transform: translateY(6px) rotate(-45deg);
    -ms-transform: translateY(6px) rotate(-45deg);
    -o-transform: translateY(6px) rotate(-45deg);
  }
}