@media (max-width: 1100px) {
  
}

@media (max-width: 992px) {
    .burger.active {
        transform: rotate(90deg);
      }
    
      .burger.active .line.middle {
        display: none;
      }
    
      .burger.active .line.top {
        transform: translateY(2px) rotate(44deg);
        -webkit-transform: translateY(2px) rotate(44deg);
        -moz-transform: translateY(2px) rotate(44deg);
        -ms-transform: translateY(2px) rotate(44deg);
        -o-transform: translateY(2px) rotate(44deg);
}
    
      .burger.active .line.bottom {
        transform: translateY(-4px) rotate(-45deg);
        -webkit-transform: translateY(-4px) rotate(-45deg);
        -moz-transform: translateY(-4px) rotate(-45deg);
        -ms-transform: translateY(-4px) rotate(-45deg);
        -o-transform: translateY(-4px) rotate(-45deg);
}
      .line {
        width: 100%;
        height: 2px;
        background-color: #fff;
      }
}