.bars{
  display: none;
}
@media screen and (max-width: 1279px) {
  .bars {
    display: block;
    position: absolute;
    background: #dd0a0c;
    z-index: 12;
    right: 0;
    top: 0px;
  }
  .c-hamburger {  
    -webkit-transition: background 0.3s; /* Safari */
    transition: background 0.3s;display: block;position: relative;overflow: hidden;margin: 0;padding: 0;
    width: 40px;height: 40px;font-size: 0;text-indent: -9999px;appearance: none;box-shadow: none;
    border-radius: none;border: none;cursor: pointer;transition: background 0.3s;margin: 0;
    padding-left: 5px;padding-right:5px;
  }
  .c-hamburger:focus {outline: none;
  }
  .c-hamburger span {display: block;position: absolute;top: 19px;left: 10px;right: 10px;height: 2px;
    background: #ffffff;
  }
  .c-hamburger span::before,
  .c-hamburger span::after {position: absolute;display: block;left: 0;width: 100%;height: 2px;
    background-color: #ffffff;content: "";
  }
  .c-hamburger span::before {top: -7px;}
  .c-hamburger span::after {bottom: -7px;}
  .c-hamburger--htx {background-color: transparent;opacity: 1;}
  .c-hamburger--htx span {transition: background 0s 0.3s;}
  .c-hamburger--htx span::before,.c-hamburger--htx span::after {transition-duration: 0.3s, 0.3s;
    transition-delay: 0.3s, 0s;
  }
  .c-hamburger--htx span::before {transition-property: top, transform;}
  .c-hamburger--htx span::after {transition-property: bottom, transform;}
  .c-hamburger--htx.is-active span {background: none;}
  .c-hamburger--htx.is-active span::before {top: 0;transform: rotate(45deg);}
  .c-hamburger--htx.is-active span::after {bottom: 0;transform: rotate(-45deg);}
  .c-hamburger--htx.is-active span::before,
  .c-hamburger--htx.is-active span::after {transition-delay: 0s, 0.3s;}
}