#hamburger-icon {
  width: 60px;
  height: 45px;
  position: relative;
  margin: 50px auto;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer; }
  #hamburger-icon span {
    display: block;
    position: absolute;
    height: 9px;
    width: 50%;
    background: #d3531a;
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out; }
    #hamburger-icon span:nth-child(even) {
      left: 50%;
      border-radius: 0 9px 9px 0; }
    #hamburger-icon span:nth-child(odd) {
      left: 0px;
      border-radius: 9px 0 0 9px; }
    #hamburger-icon span:nth-child(1) {
      top: 0px; }
    #hamburger-icon span:nth-child(2) {
      top: 0px; }
    #hamburger-icon span:nth-child(3) {
      top: 18px; }
    #hamburger-icon span:nth-child(4) {
      top: 18px; }
    #hamburger-icon span:nth-child(5) {
      top: 36px; }
    #hamburger-icon span:nth-child(6) {
      top: 36px; }
  #hamburger-icon .open span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    left: 5px;
    top: 7px; }
  #hamburger-icon .open span:nth-child(2) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    left: calc(50% - 5px);
    top: 7px; }
  #hamburger-icon .open span:nth-child(3) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    left: -50%;
    opacity: 0; }
  #hamburger-icon .open span:nth-child(4) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    left: 100%;
    opacity: 0; }
  #hamburger-icon .open span:nth-child(5) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    left: 5px;
    top: 29px; }
  #hamburger-icon .open span:nth-child(6) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    left: calc(50% - 5px);
    top: 29px; }
