/*=========================================================
-----   ** 07. demon navbar-toggler x animation **    -----
=========================================================*/

.icon-bar {
  width: 25px;
  height: 3px;
  background-color: #039be5;
  display: block;
  transition: all 0.2s;
  margin: 4px 0;
  position: relative;
  left: 0;
}

.navbar-toggler {
  border: none;
  background: transparent !important;
  .top-bar {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    transform-origin: 10% 10%;
  }
  .middle-bar {
    opacity: 0;
  }
  .bottom-bar {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    transform-origin: 10% 90%;
  }
  &.collapsed {
    .top-bar {
      -webkit-transform: rotate(0);
      -moz-transform: rotate(0);
      -o-transform: rotate(0);
      transform: rotate(0);
    }
    .middle-bar {
      opacity: 1;
    }
    .bottom-bar {
      -webkit-transform: rotate(0);
      -moz-transform: rotate(0);
      -o-transform: rotate(0);
      transform: rotate(0);
    }
  }
}