/*
 * mm-basic
 *
 * Here we overide the mmenu module mm-basic theme css
 *
 * [1] Correct the off canvas slide behaviour
 */
/*
 * Global Ignite Variables
 *
 * 1. Ignite custom typography settings for prose (See _prose.scss for explanation).
 *
 * 2. Establish custom spacing variables based on line height to
 *    facilitate vertical rhythm
 *
 * 3. Black/white colour variables
 *
 * 4. Brand visited & focused styles
 *
 * 5. Brand border
 *
 */
/* [1] */
/* [2] */
/* [3] */
/* [4] */
/* [5] */
/* [1] */
html.mm-slide.mm-right.mm-opened .mm-menu {
  transform: translateX(100%);
}

html.mm-slide.mm-right.mm-opening .mm-menu {
  transform: translateX(0%);
}

.mm-menu {
  background-color: #1f2c33;
}
.mm-menu .mm-list {
  padding: 0;
  margin-left: 0;
  margin-right: 0;
}
.mm-menu .mm-list > li:after {
  border-color: transparent;
  border-bottom-width: 0 !important;
}

.mm-list > li > span {
  padding: 0;
}

.mm-menu .mm-list > li > a.mm-subopen:before {
  border-color: rgba(0, 0, 0, 0.5);
}

.mm-menu .mm-list > li > a.mm-subopen:after,
.mm-menu .mm-list > li > a.mm-subclose:before {
  border-color: #ffffff;
}

.mm-list > li > a {
  font-size: 16px;
  padding: 16px;
  color: #ffffff;
  border-bottom: 1px rgba(0, 0, 0, 0.5) solid;
}
.mm-list > li > a:focus {
  outline-offset: 0;
  outline: none;
}
.mm-list > li > a:hover, .mm-list > li > a.active {
  background-color: black;
}
.mm-list a.mm-subclose:before {
  margin-bottom: -11px;
}
.mm-list.nav > li > a:focus {
  background-color: black;
}

.mm-list a.mm-subclose {
  margin-top: -10px;
}

.mm-menu .mm-list > li > a.mm-subclose {
  color: #ffffff;
}
