:root{--cc-offcanvas-width:340px;--cc-z:99999;--cc-bg:#fff;--cc-overlay:rgba(0,0,0,.45);--cc-speed:.35s}.cc-burger{width:38px;height:30px;display:inline-flex;flex-direction:column;justify-content:space-between;cursor:pointer;z-index:calc(var(--cc-z) + 2)}.cc-burger span{height:3px;width:100%;background:currentColor;border-radius:3px;transition:transform var(--cc-speed),opacity var(--cc-speed)}body.cc-open .cc-burger span:nth-child(1){transform:translateY(13.5px) rotate(45deg)}body.cc-open .cc-burger span:nth-child(2){opacity:0}body.cc-open .cc-burger span:nth-child(3){transform:translateY(-13.5px) rotate(-45deg)}.cc-overlay{position:fixed;inset:0;background:var(--cc-overlay);opacity:0;visibility:hidden;transition:opacity var(--cc-speed),visibility var(--cc-speed);z-index:var(--cc-z)}body.cc-open .cc-overlay{opacity:1;visibility:visible}#offcanvas-menu{position:fixed;top:0;right:0;height:100vh;width:var(--cc-offcanvas-width);transform:translateX(100%);transition:transform var(--cc-speed);z-index:calc(var(--cc-z) + 1);background:var(--cc-bg);box-shadow:-5px 0 25px rgba(0,0,0,.25);border-radius:14px 0 0 14px;overflow:auto}body.cc-open #offcanvas-menu{transform:translateX(0)}body.cc-open{overflow:hidden}@media (max-width:767px){.cc-burger{width:32px!important}}