@media (max-width: 979px) {
  .responsive .row-offcanvas {
    position: relative;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    transition: all .25s ease-out;
  }
  .responsive .row-offcanvas-left {
    left: 0;
  }
  .responsive .row-offcanvas-left
		.sidebar-offcanvas {
    left: -50%;
    right: auto;
  }
  .responsive .row-offcanvas-left.active
		.sidebar-offcanvas {
    left: 0;
    right: auto;
  }
  .responsive .row-offcanvas-left.active {
    left: 50%;
  }
  .responsive .row-offcanvas-left.active
		.sidebar-offcanvas {
    left: 0%;
  }
  .responsive .sidebar-offcanvas {
    position: fixed !important;
    top: 0 !important;
    width: 50%;
    height: auto;
    overflow-y: auto;
    -webkit-transition: all 0.6s;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    transition: all 0.6s;
  }
  .responsive .sidebar-offcanvas ul {
    width: 100% !important;
  }
}
@media (max-width: 599px) {
  .responsive .row-offcanvas-left
		.sidebar-offcanvas {
    left: -320px;
  }
  .responsive .row-offcanvas-left.active {
    left: 320px;
  }
  .responsive .sidebar-offcanvas {
    width: 320px;
  }
}