/* YesMobile v1.1 – auto-generated – do not edit manually */

@media (max-width: 1024px) {

  /* Drawer panel */
  .canvas-menu {
    background: #ffffff !important;
    color: #333333 !important;
    border-radius: 0px !important;
    transition: all 500ms cubic-bezier(0.29, 0.63, 0.44, 1) !important;
    width: 280px !important;
    box-shadow: 0 0 30px rgba(0,0,0, 0.3) !important;
  }

  /* Menu text */
  .canvas-menu a,
  .canvas-menu li,
  .canvas-menu .mm-listitem,
  .canvas-menu .mm-listitem a {
    color: #333333 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
  }

  /* Header */
  .canvas-menu .canvas-header-box {
    background: #f5f5f5 !important;
    color: #333333 !important;
    min-height: 50px !important;
    padding: 0 16px !important;
    border-bottom: 1px solid #e0e0e0 !important;
  }

  /* Close button */
  .canvas-menu .canvas-header-box .close-box i {
    color: #333333 !important;
    font-size: 24px !important;
  }
  .canvas-menu .canvas-header-box .close-box {
    cursor: pointer;
    padding: 8px;
    transition: opacity 200ms ease !important;
  }
  .canvas-menu .canvas-header-box .close-box:hover { opacity: 0.7; }

  /* Menu items */
  .canvas-menu .mm-listitem,
  .canvas-menu #canvas-main-menu li {
    padding: 0 !important;
    border-bottom: 1px solid #eeeeee !important;
  }
  .canvas-menu .mm-listitem a,
  .canvas-menu #canvas-main-menu li > a {
    padding: 12px 16px !important;
    display: block;
    transition: background 200ms ease, color 200ms ease !important;
  }
  .canvas-menu .mm-listitem a:hover,
  .canvas-menu #canvas-main-menu li > a:hover {
    background: #f5f5f5 !important;
    color: #000000 !important;
  }
  .canvas-menu .mm-listitem.mm-listitem_selected > a,
  .canvas-menu #canvas-main-menu li.active > a {
    background: #e8e8e8 !important;
    color: #000000 !important;
  }

  /* Submenu arrows */
  .canvas-menu .mm-listitem .mm-btn_next,
  .canvas-menu .mm-listitem a.mm-next,
  .canvas-menu li > a.mm-next {
    border-color: #eeeeee !important;
    background: transparent !important;
    width: 80px !important;
    transition: background 200ms ease, color 200ms ease !important;
  }
  .canvas-menu .mm-listitem .mm-btn_next:hover,
  .canvas-menu .mm-listitem a.mm-next:hover,
  .canvas-menu li > a.mm-next:hover {
    background: #f0f0f0 !important;
  }
  .canvas-menu .mm-listitem .mm-btn_next::after,
  .canvas-menu .mm-listitem a.mm-next::after,
  .canvas-menu li > a.mm-next::after {
    border: none !important;
    content: "\f2fb" !important;
    font-family: "Material-Design-Iconic-Font" !important;
    font-size: 24px !important;
    color: #999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    transform: none !important;
  }
  .canvas-menu .mm-listitem .mm-btn_next::before,
  .canvas-menu .mm-listitem a.mm-next::before,
  .canvas-menu li > a.mm-next::before {
    display: none !important;
  }
  .canvas-menu .mm-listitem .mm-btn_next:hover::after,
  .canvas-menu .mm-listitem a.mm-next:hover::after,
  .canvas-menu li > a.mm-next:hover::after {
    color: #000000 !important;
  }

  /* Overlay */
  .canvas-overlay { background-color: #000000 !important; opacity: 0 !important; transition: opacity 500ms cubic-bezier(0.29, 0.63, 0.44, 1) !important; }
  body.canvasmenu-right .canvas-overlay { opacity: 0.5 !important; visibility: visible !important; }

  /* Body transition */
  body { transition: all 500ms cubic-bezier(0.29, 0.63, 0.44, 1) !important; }

  /* Direction: right */
  .canvas-menu.drawer-left { right: -280px !important; left: auto !important; top: 0; bottom: 0; height: 100% !important; }
  body.canvasmenu-right { right: 280px !important; left: -280px !important; }
  body.canvasmenu-right .canvas-menu.drawer-left.active { right: 0 !important; }

  /* Hamburger button */
  .show_menutop i,
  ._mobile_menutop i,
  #_mobile_menutop i { color: #333333 !important; font-size: 28px !important; }

  /* Scrollbar */
  .canvas-menu::-webkit-scrollbar { width: 4px; }
  .canvas-menu::-webkit-scrollbar-track { background: #f0f0f0; }
  .canvas-menu::-webkit-scrollbar-thumb { background: #cccccc; border-radius: 4px; }
  .canvas-menu { scrollbar-width: thin; scrollbar-color: #cccccc #f0f0f0; }

  /* Logo */
  .canvas-menu .canvas-header-box::before {
    content: '';
    display: block;
    width: 100%;
    height: 40px;
    background: url('/img/opalmobilemenu/menu-logo.jpg') no-repeat center / contain;
    margin-bottom: 4px;
  }

}
