/*===================================================================================*/
/*  Global | Variables | Partial
/*===================================================================================*/
.burger {
  width: 6rem;
  height: 6rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #ffffff;
}
.burger__bars {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  height: 21px;
}
.burger__bar {
  display: block;
  background-color: #202243;
  height: 3px;
  width: 21px;
  right: 0;
  -webkit-transition: width 200ms ease-in-out, opacity 200ms ease-in-out, -webkit-transform 200ms ease-in-out;
  transition: width 200ms ease-in-out, opacity 200ms ease-in-out, -webkit-transform 200ms ease-in-out;
  transition: width 200ms ease-in-out, transform 200ms ease-in-out, opacity 200ms ease-in-out;
  transition: width 200ms ease-in-out, transform 200ms ease-in-out, opacity 200ms ease-in-out, -webkit-transform 200ms ease-in-out;
}
.burger__bar--middle {
  width: 30px;
}
.opened .burger__bar--top {
  -webkit-transform: translateY(9px) rotate(45deg) scaleX(1.33);
  transform: translateY(9px) rotate(45deg) scaleX(1.33);
}
.opened .burger__bar--middle {
  -webkit-transform: rotate(135deg) scaleX(1.33);
  transform: rotate(135deg) scaleX(1.33);
  width: 21px;
}
.opened .burger__bar--bottom {
  -webkit-transform: translateY(-9px) rotate(315deg) scaleX(1.33);
  transform: translateY(-9px) rotate(315deg) scaleX(1.33);
}
.burger:hover:not(.opened) .burger__bar {
  width: 30px;
}
.burger.opened:hover .burger__bar--top {
  -webkit-transform: translateY(9px) rotate(45deg) scaleX(1);
  transform: translateY(9px) rotate(45deg) scaleX(1);
}
.burger.opened:hover .burger__bar--middle {
  -webkit-transform: rotate(135deg) scaleX(1);
  transform: rotate(135deg) scaleX(1);
}
.burger.opened:hover .burger__bar--bottom {
  -webkit-transform: translateY(-9px) rotate(315deg) scaleX(1);
  transform: translateY(-9px) rotate(315deg) scaleX(1);
}
/*# sourceMappingURL=burger.css.map */