/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */
 
.hamburger {
  padding: 0px;
  position: absolute;
  top: 11px;
  right: 0px;
  display: none;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0px solid red;
  /*margin: 20px 0px;*/
  overflow: visible;
  text-align: left;
  z-index: 99;
  -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out
}

.hamburger.is-active {position: fixed;}


.hamburger:focus {outline:0;}

.hamburger p {color: #A0A0A0; display: inline-block; vertical-align: top; font-weight: bold; text-transform: uppercase; text-align: left; font-size: 0.9em; line-height: 1em; padding: 12px 0px 0px 5px; border: 0px solid blue;}

/*.hamburger:hover .hamburger-inner, .hamburger:hover .hamburger-inner::before, .hamburger:hover .hamburger-inner::after { background-color: #940114;}*/
.hamburger:hover p {color: #940114; -moz-transition: all .2s ease-out; -o-transition: all .2s ease-out; transition: all .2s ease-out;}


.hamburger-box {
  width: 44px;
  height: 40px;
  /*background: #fff;*/
  border-radius: 0px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: 8px; 
  margin-left: 10px;}
  
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 24px;
    height: 4px;
    background-color: #fff;
    position: absolute;
   
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
    
	.hamburger-inner::before, .hamburger-inner::after { content: ""; display: block; }
	.hamburger-inner::before { top: 0px; }
	.hamburger-inner::after { bottom: 0px; }




/*
   * Elastic
   */
.hamburger--elastic .hamburger-inner {
  top: 2px;
  transition-duration: 0.275s;
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); }
  .hamburger--elastic .hamburger-inner::before {
    top: 8px;
    transition: opacity 0.125s 0.275s ease; }
  .hamburger--elastic .hamburger-inner::after {
    top: 16px;
    transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55); }

.hamburger--elastic.is-active .hamburger-inner {
 background-color: #4a8dc8;
  transform: translate3d(0, 8px, 0) rotate(135deg);
  transition-delay: 0.075s; }
  .hamburger--elastic.is-active .hamburger-inner::before {
    
    transition-delay: 0s;
    opacity: 0; }
  .hamburger--elastic.is-active .hamburger-inner::after {
    background-color: #4a8dc8;
    transform: translate3d(0, -16px, 0) rotate(-270deg);
    transition-delay: 0.075s; }

/*
   * Elastic Reverse
   */
   
.hamburger--elastic-r .hamburger-inner {
  top: 2px;
  transition-duration: 0.275s;
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); }
  .hamburger--elastic-r .hamburger-inner::before {
    top: 10px;
    transition: opacity 0.125s 0.275s ease; }
  .hamburger--elastic-r .hamburger-inner::after {
    top: 20px;
    transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55); }


.hamburger--elastic-r.is-active .hamburger-inner {
  transform: translate3d(0, 10px, 0) rotate(-135deg);
  transition-delay: 0.075s; }
  .hamburger--elastic-r.is-active .hamburger-inner::before {
    transition-delay: 0s;
    opacity: 0; }
  .hamburger--elastic-r.is-active .hamburger-inner::after {
    transform: translate3d(0, -20px, 0) rotate(270deg);
    transition-delay: 0.075s; }


@media (max-width: 867px) {
	.hamburger { display: inline-block; }
}
