﻿.burger,
.burger:before,
.burger:after {
  position: absolute;
  top: 28px;
  left: 18px;
  width: 25px;
  height: 3px;
  background: #622d49;
  
    transition: background 0.3s, transform 0.3s, top 0.3s;
    -webkit-transition: background 0.3s, -webkit-transform 0.3s, top 0.3s;
    -moz-transition: background 0.3s, -moz-transform 0.3s, top 0.3s;
    -ms-transition: background 0.3s, -ms-transform 0.3s, top 0.3s;

}

.burger:before {
  top: -8px;
  left: 0;
  content: "";
}

.burger:after {
  top: 8px;
  left: 0;
  content: "";
}

.open .burger {
  background: transparent;
}

.open .burger:after, .open .burger:before {
    background: #df7826;
}

.open .burger:before {
  top: 0;

  -webkit-transform: rotate3d(0, 0, 1, -45deg);
  -moz-transform: rotate3d(0, 0, 1, -45deg);
  -ms-transform: rotate3d(0, 0, 1, -45deg);
  transform: rotate3d(0, 0, 1, -45deg);
}

.open .burger:after {
  top: 0;

  -webkit-transform: rotate3d(0, 0, 1, 45deg);
  -moz-transform: rotate3d(0, 0, 1, 45deg);
  -ms-transform: rotate3d(0, 0, 1, 45deg);
  transform: rotate3d(0, 0, 1, 45deg);
}

//Modernizr fallback
.no-csstransforms3d .open .burger:before{
    transform: rotate(-45deg);
}

.no-csstransforms3d .open .burger:after{
    transform: rotate(45deg);
}