:root{--menubutton-background-color:transparent;--menubutton-border-width:0;--menubutton-border-radius:0;--menubutton-border-color:#fff;--menubutton-bar-color:var(--gray_dark);--menubutton-bar-height:5px;--menubutton-icon-width:70%;--menubutton-background-color-hover:transparent;--menubutton-border-color-hover:var(--orange);--menubutton-bar-color-hover:var(--orange)}.menubutton{background-color:var(--menubutton-background-color);border:var(--menubutton-border-width) solid var(--menubutton-border-color);border-radius:var(--menubutton-border-radius);cursor:pointer;display:block;height:44px;overflow:hidden;position:relative;touch-action:manipulation;transition-duration:.2s;width:44px}.menubutton:not(.menubutton--active):is(:hover,:focus){background-color:var(--menubutton-background-color-hover);border-color:var(--menubutton-border-color-hover)}.menubutton:not(.menubutton--active):is(:hover,:focus) .menubutton__icon,.menubutton:not(.menubutton--active):is(:hover,:focus) .menubutton__icon:after,.menubutton:not(.menubutton--active):is(:hover,:focus) .menubutton__icon:before{background-color:var(--menubutton-bar-color-hover)}.menubutton__icon{left:50%;top:50%;transform:translate(-50%,-50%);width:var(--menubutton-icon-width)}.menubutton__icon,.menubutton__icon:after,.menubutton__icon:before{background-color:var(--menubutton-bar-color);display:block;height:var(--menubutton-bar-height);position:absolute;transition-duration:.2s}.menubutton__icon:after,.menubutton__icon:before{content:"";left:0;top:0;transform-origin:50% 50%;width:100%}.menubutton__icon:before{transform:translateY(calc(-6px + var(--menubutton-bar-height)*-1))}.menubutton__icon:after{transform:translateY(calc(6px + var(--menubutton-bar-height)*1))}.menubutton--active .menubutton__icon{background-color:transparent;transform:translate(-50%,-50%)}.menubutton--active .menubutton__icon:before{transform:translateY(0) rotate(-35deg)}.menubutton--active .menubutton__icon:after{transform:translateY(0) rotate(35deg)}