.mm-menu_offcanvas {
  width: 300px;
  min-width: 240px;
  max-width: 300px;
}

li.menu-name--main.menu-item--active-trail-offcanvas.mm-listitem {
  background: rgb(108, 108, 108);
}

.mm-wrapper_opening .mm-menu_offcanvas.mm-menu_opened~.mm-slideout {
  -webkit-transform: translate3d(300px, 0, 0);
  transform: translate3d(300px, 0, 0);
}

.mm-wrapper_opening .mm-menu_position-right.mm-menu_opened~.mm-slideout {
  -webkit-transform: translate3d(-300px, 0, 0);
  transform: translate3d(-300px, 0, 0);
}

.mm-listitem__text {
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: normal;
  overflow: hidden;
  padding-left: 20px;
  padding-right: 10px;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-preferred-size: 10%;
  flex-basis: 10%;
}

@media only screen and (max-width: 320px) {
  .mm-menu_offcanvas {
    width: 220px;
    min-width: 210px;
    max-width: 220px;
  }

  .mm-wrapper_opening .mm-menu_offcanvas.mm-menu_opened~.mm-slideout {
    -webkit-transform: translate3d(220px, 0, 0);
    transform: translate3d(220px, 0, 0);
  }

  .mm-wrapper_opening .mm-menu_position-right.mm-menu_opened~.mm-slideout {
    -webkit-transform: translate3d(-220px, 0, 0);
    transform: translate3d(-220px, 0, 0);
  }
}