/*
  Animations
*/
html.mm-opened .mm-page,
html.mm-opened #mm-blocker,
.mm-menu.mm-horizontal ul
{
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  transition-duration: 0.5s;
  
  -webkit-transition-timing-function: ease;
  -moz-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
}
html.mm-dragging.mm-opened .mm-page
{
  -webkit-transition-duration: 0s;
  -moz-transition-duration: 0s;
  -o-transition-duration: 0s;
  transition-duration: 0s;
}
html.mm-opened .mm-page,
html.mm-opened #mm-blocker
{
  -webkit-transition-property: top, right, bottom, left, margin, border-color;
  -moz-transition-property: top, right, bottom, left, margin, border-color;
  -o-transition-property: top, right, bottom, left, margin, border-color;
  transition-property: top, right, bottom, left, margin, border-color;
}
.mm-menu.mm-horizontal ul
{
  -webkit-transition-property: margin-left;
  -moz-transition-property: margin-left;
  -o-transition-property: margin-left;
  transition-property: margin-left;
}
html.mm-accelerated.mm-opening .mm-page,
html.mm-accelerated.mm-opening #mm-blocker,
html.mm-accelerated.mm-opening .mm-menu.mm-horizontal ul
{
  -webkit-transform: translate3d( 0, 0, 0 );
  -moz-transform: translate3d( 0, 0, 0 );
  -o-transform: translate3d( 0, 0, 0 );
  transform: translate3d( 0, 0, 0 );
}

/* top */
html.mm-top.mm-opened .mm-page,
html.mm-top.mm-opened #mm-blocker
{
  margin-top: 0px;
  top: 0%;
  left: 0;
}
html.mm-top.mm-opening .mm-page,
html.mm-top.mm-opening #mm-blocker
{
  margin-top: -65px;
  top: 100%;
}

/* right */
html.mm-right.mm-opened .mm-page,
html.mm-right.mm-opened #mm-blocker
{
  margin-right: 0px;
  right: 0%;
  top: 0;
}
html.mm-right.mm-opening .mm-page,
html.mm-right.mm-opening #mm-blocker
{
  margin-right: -65px;
  right: 100%;
}

/* bottom */
html.mm-bottom.mm-opened .mm-page,
html.mm-bottom.mm-opened #mm-blocker
{
  margin-bottom: 0px;
  bottom: 0%;
  left: 0;
}
html.mm-bottom.mm-opening .mm-page,
html.mm-bottom.mm-opening #mm-blocker
{
  margin-bottom: -65px;
  bottom: 100%;
}

/* left */
html.mm-left.mm-opened .mm-page,
html.mm-left.mm-opened #mm-blocker
{
  margin-left: 0px;
  left: 0%;
  top: 0;
}
html.mm-left.mm-opening .mm-page,
html.mm-left.mm-opening #mm-blocker
{
  margin-left: -65px;
  left: 100%;
}


/*
  Menu, submenus, items
  - Sizing and positioning
*/
html.mm-opened .mm-page,
.mm-menu,
.mm-menu ul,
.mm-menu div.mm-search,
.mm-menu div.mm-search input
{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

/* html/body */
html.mm-opened,
html.mm-opened body
{
  width: 100%;
  height: 100%;
  overflow: hidden;
}
html.mm-opened body
{
  position: relative;
}

/* menu */
.mm-menu
{
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
  overflow: hidden;
}
.mm-menu:after {
  content: '';
  display: block;
  clear: both;
}
.mm-menu.mm-opened
{
  display: block;
  overflow: scroll;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.mm-menu.mm-opened ~ .mm-menu.mm-opened
{
  display: none;
}
.mm-menu.mm-top > ul
{
  padding-bottom: 105px;
}
.mm-menu.mm-right
{
  padding-left: 65px;
}
.mm-menu.mm-bottom
{
  padding-top: 65px;
}
.mm-menu.mm-left
{
  padding-right: 65px;
}

/* ul/li */
.mm-menu ul,
.mm-menu li
{
  list-style: none;
}
.mm-menu li
{
  position: relative;
}
.mm-menu li:after
{
  content: '';
  display: block;
  width: 100%;
}
.mm-menu ul,
.mm-menu li,
.mm-menu li > a,
.mm-menu li > span
{
  display: block;
  padding: 0;
  margin: 0;
}
.mm-menu a
{
  background: transparent;
}
.mm-menu > ul
{
  background: inherit;
  width: 100%;
  padding: 20px 0 40px 0;
}

/* items */
.mm-menu li > a,
.mm-menu li > span
{
  text-indent: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 40px;
  overflow: hidden;
  padding-right: 5px;
}
.mm-menu a:active
{
  background: none;
}

/* subopen/close */
.mm-menu a.mm-subopen
{
  width: 40px;
  height: 40px;
  padding: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}
.mm-menu a.mm-subopen:before
{
  content: '';
  display: block;
  height: 100%;
}
.mm-menu a.mm-subopen.mm-fullsubopen
{
  border-left: none;
  width: 100%;
}
.mm-menu a.mm-subopen.mm-fullsubopen:before
{
  border-left: none;
}
.mm-menu a.mm-subclose
{
  text-indent: 40px;
  padding-top: 20px;
  margin-top: -20px;
}
.mm-menu a.mm-subopen + a,
.mm-menu a.mm-subopen + span
{
  padding-right: 45px;
}

/* page + blocker */
html.mm-opened .mm-page
{
  background: inherit;
  height: 100%;
  overflow: hidden;
  position: absolute;
}
#mm-blocker
{
  background: #fff;
  opacity: 0;
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 9999;
}
html.mm-opened #mm-blocker,
html.mm-blocking #mm-blocker
{
  display: block;
}

/* vertical submenu */
.mm-menu.mm-vertical ul ul
{
  display: none;
  padding: 10px 0 10px 10px;
}
.mm-menu.mm-vertical li.mm-opened > ul
{
  display: block;
}
.mm-menu.mm-vertical ul ul li:last-child,
.mm-menu.mm-vertical ul ul li:last-child:after
{
  border-bottom-width: 0;
}
.mm-menu.mm-vertical li.mm-opened.mm-selected > a.mm-subopen + a,
.mm-menu.mm-vertical li.mm-opened.mm-selected > a.mm-subopen + span
{
  padding-right: 5px;
  margin-right: 40px;
}
.mm-menu.mm-vertical li.mm-opened.mm-selected > em.mm-counter + a.mm-subopen + a,
.mm-menu.mm-vertical li.mm-opened.mm-selected > em.mm-counter + a.mm-subopen + span
{
  margin-right: 75px;
}

/* horizontal submenu */
.mm-menu.mm-horizontal
{
  white-space: nowrap;
}
.mm-menu.mm-horizontal ul
{
  vertical-align: top;
  margin-left: 0%;
}
.mm-menu.mm-horizontal ul.mm-submenu
{
  display: none;
}
.mm-menu.mm-horizontal ul,
.mm-menu.mm-horizontal ul.mm-submenu.mm-opened
{
  display: inline-block;
}
.mm-menu.mm-horizontal ul.mm-subopening
{
  margin-left: -100%;
  height: 100%;
  overflow: hidden;
}


/*
  Menu, submenus, items
  - Styling (default: dark background)
*/
.mm-menu
{
  background: #333;
}
.mm-menu *
{
  -webkit-text-size-adjust: none;
  text-shadow: 0 1px 2px rgba( 0, 0, 0, 0.3 );
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
}
.mm-menu li
{
  border-bottom: 1px solid rgba( 255, 255, 255, 0.1 );
}
.mm-menu li:after
{
  border-bottom: 1px solid rgba( 0, 0, 0, 0.4 );
}

.mm-menu li,
.mm-menu li > a,
.mm-menu li > span
{
  color: rgba( 255, 255, 255, 0.6 );
  text-decoration: none;
}
.mm-menu li.mm-selected > a,
.mm-menu li.mm-selected > span
{
  background: rgba( 0, 0, 0, 0.2 );
}
.mm-menu li.mm-selected > a.mm-subopen
{
  background: transparent;
}

/* subopen/close */
.mm-menu a.mm-subopen
{
  border-left: 1px solid rgba( 255, 255, 255, 0.1 );
}
.mm-menu a.mm-subopen:before
{
  border-left: 1px solid rgba( 0, 0, 0, 0.4 );
}
.mm-menu a.mm-subclose
{
  background: rgba( 0, 0, 0, 0.2 );
}

/* vertical submenu */
.mm-menu.mm-vertical li.mm-opened > a.mm-subopen,
.mm-menu.mm-vertical li.mm-opened > ul
{
  background: rgba( 255, 255, 255, 0.06 );
}

/* page + blocker */
html.mm-opened .mm-page
{
  box-shadow: 0 0 20px rgba( 0, 0, 0, 0.8 );
}


/*
  Labels
  - Sizing and positioning
*/
.mm-menu li.mm-label
{
  text-transform: uppercase;
  text-indent: 20px;
  line-height: 20px;
}


/*
  Labels
  - Styling
*/
.mm-menu li.mm-label
{
  background: rgba( 255, 255, 255, 0.1 );
  font-size: 11px;
  color: rgba( 255, 255, 255, 0.5 );
}


/*
  Counters
  - Sizing and positioning
*/
.mm-menu em.mm-counter
{
  text-indent: 0;
  text-align: center;
  text-shadow: none;
  line-height: 20px;
  display: block;
  min-width: 20px;
  height: 20px;
  padding: 0;
  position: absolute;
  right: 40px;
  top: 10px;
}
.mm-menu em.mm-counter + a.mm-subopen
{
  padding-left: 35px;
}
.mm-menu em.mm-counter + a.mm-subopen + a,
.mm-menu em.mm-counter + a.mm-subopen + span
{
  padding-right: 80px;
}
.mm-menu em.mm-counter + a.mm-fullsubopen + a,
.mm-menu em.mm-counter + a.mm-fullsubopen + span
{
  padding-right: 70px;
}


/*
  Counters
  - Styling
*/
.mm-menu em.mm-counter
{
  border-radius: 5px;
  background: rgba( 255, 255, 255, 0.1 );
  box-shadow: 0 0 2px rgba( 0, 0, 0, 0.3 );
  font-size: 11px;
  font-weight: bold;
  font-style: normal;
  color: rgba( 255, 255, 255, 0.4 );
}


/*
  Arrows
  - Sizing and positioning
*/
.mm-menu a.mm-subopen:after,
.mm-menu a.mm-subclose:before
{
  content: '';
  border-width: 4px;
  border-style: solid;
  display: block;
  width: 6px;
  height: 6px;
  position: absolute;

  -webkit-transform: rotate( -45deg );
  -moz-transform: rotate( -45deg );
  -o-transform: rotate( -45deg );
  transform: rotate( -45deg );
}
.mm-menu a.mm-subopen:after
{
  border-top: none;
  border-left: none;
  right: 16px;
  top: 16px;
}
.mm-menu a.mm-subclose:before
{
  border-right: none;
  border-bottom: none;
  left: 20px;
  top: 35px;
}
.mm-menu.mm-vertical li.mm-opened > a.mm-subopen:after
{
  -webkit-transform: rotate( 45deg );
  -moz-transform: rotate( 45deg );
  -o-transform: rotate( 45deg );
  transform: rotate( 45deg );
}


/*
  Arrows
  - Styling
*/
.mm-menu a.mm-subopen:after,
.mm-menu a.mm-subclose:before
{
  border-color: rgba( 255, 255, 255, 0.3 );
}


/*
  Search
  - Sizing and positioning
*/
.mm-menu div.mm-search
{
  width: 100%;
  height: 50px;
  padding: 10px;
  position: relative;
  z-index: 1;
}

.mm-menu div.mm-search input
{
  border: none;
  border-radius: 15px;
  line-height: 30px;
  outline: none;
  display: block;
  width: 100%;
  height: 30px;
  margin: 0;
  padding: 0 0 0 10px;
}
.mm-menu li.mm-noresults
{
  border: none;
  display: none;
  padding-top: 30px;
}
.mm-menu li.mm-noresults:after
{
  border: none;
}
.mm-menu.mm-noresults li.mm-noresults
{
  display: block;
}

.mm-menu .mm-noresult,
.mm-menu .mm-nosubresult > a.mm-subopen,
.mm-menu .mm-nosubresult > em.mm-counter
{
  display: none;
}
.mm-menu .mm-nosubresult > a.mm-subopen + a, 
.mm-menu .mm-nosubresult > a.mm-subopen + span
{
  padding-right: 5px;
}


/*
  Search
  - Styling
*/
.mm-menu div.mm-search
{
  background: rgba( 0, 0, 0, 0.2 );
  border-bottom: 1px solid rgba( 255, 255, 255, 0.1 );
}
.mm-menu div.mm-search input
{
  background: rgba( 255, 255, 255, 0.3 );
  color: rgba( 255, 255, 255, 0.9 );
}
.mm-menu li.mm-noresults
{
  color: rgba( 255, 255, 255, 0.4 );
  text-align: center;
}


/*
  Bugfix for browsers without support for overflowscrolling
    - Android < 3
*/
html.mm-no-overflowscrolling.mm-opened,
html.mm-no-overflowscrolling.mm-opened body
{
  overflow: visible;
}
html.mm-no-overflowscrolling.mm-opened body
{
  overflow-x: hidden;
}
html.mm-no-overflowscrolling.mm-opened .mm-page
{
  min-height: 200%;
  position: fixed;
  top: 0;
  z-index: 3;
}
html.mm-no-overflowscrolling .mm-menu
{
  height: auto;
  min-height: 100%;
  overflow: default;
  overflow-x: default;
  overflow-y: default;
  position: relative;
  left: auto;
  top: auto;
}
html.mm-no-overflowscrolling.mm-right .mm-menu
{
  position: absolute;
}

/*
  Sizing and positioning for larger screens
*/
@media all and (min-width: 500px) {
  .mm-menu.mm-right
  {
    left: auto;
    right: 0;
  }
  .mm-menu.mm-left,
  .mm-menu.mm-right
  {
    width: 500px;
  }

  html.mm-left.mm-opening .mm-page,
  html.mm-left.mm-opening #mm-blocker
  {
    left: 500px;
  }
  html.mm-right.mm-opening .mm-page,
  html.mm-right.mm-opening #mm-blocker
  {
    right: 500px;
  }
}