/*
 * TT Organizer: optional mobile hamburger -> X animation.
 * Size is controlled by --tt-mobile-toggle-size, populated from the plugin settings.
 */
@media (max-width:980px){
  .et_mobile_nav_menu .mobile_menu_bar{
    position:relative!important;
    display:inline-block!important;
    width:var(--tt-mobile-toggle-size,44px)!important;
    height:var(--tt-mobile-toggle-size,44px)!important;
    padding:0!important;
    color:transparent!important;
    font-size:0!important;
    line-height:0!important;
    background:
      linear-gradient(#fff,#fff) center/calc(var(--tt-mobile-toggle-size,44px) - 12px) 3px no-repeat!important;
    overflow:visible!important;
  }

  .et_mobile_nav_menu .mobile_menu_bar::before,
  .et_mobile_nav_menu .mobile_menu_bar::after{
    content:""!important;
    position:absolute!important;
    left:6px!important;
    width:calc(var(--tt-mobile-toggle-size,44px) - 12px)!important;
    height:3px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:2px!important;
    background:#fff!important;
    box-shadow:none!important;
    font-family:initial!important;
    font-size:0!important;
    line-height:0!important;
    opacity:1!important;
    transform:translateY(-50%)!important;
    transform-origin:center!important;
    transition:top .22s ease, transform .22s ease, opacity .16s ease!important;
    pointer-events:none!important;
  }

  .et_mobile_nav_menu .mobile_menu_bar::before{ top:27%!important; }
  .et_mobile_nav_menu .mobile_menu_bar::after{ top:73%!important; }

  .et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar,
  .et_mobile_nav_menu .mobile_menu_bar.tt-menu-open{
    background-size:0 0!important;
  }

  .et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::before,
  .et_mobile_nav_menu .mobile_menu_bar.tt-menu-open::before{
    top:50%!important;
    transform:translateY(-50%) rotate(45deg)!important;
  }

  .et_mobile_nav_menu .mobile_nav.opened .mobile_menu_bar::after,
  .et_mobile_nav_menu .mobile_menu_bar.tt-menu-open::after{
    top:50%!important;
    transform:translateY(-50%) rotate(-45deg)!important;
  }
}
