nav.mobile-menu{position:fixed;left:0;top:0}#menu-checkbox,.mobile-menu__btn span{display:none}.mobile-menu__btn{display:flex;width:var(--menu-button-width);font-size:25px;height:50px;line-height:50px;padding:0 20px;cursor:pointer;transition:width .3s ease-in-out}.mobile-menu__btn,.sidebar{background-color:#171717;color:var(--header-text-color)}.sidebar{position:fixed;width:min(100vw,500px);height:100vh;z-index:10;transition:transform .3s ease-in-out;transform:translateX(-100vw)}.sidebar ul{padding:0;margin:0;list-style-type:none}.sidebar ul a,.sidebar ul a:visited{position:relative;text-decoration:none;display:block;background-color:transparent;padding:0 20px;font-size:16px;width:100%}.sidebar ul a li i{margin-right:15px}.sidebar ul a.active,.sidebar ul a:hover{background-color:#161920;color:#fff}.sidebar ul a.active:before,.sidebar ul a:hover:before{position:absolute;top:0;left:0;content:"";background-color:var(--color-note);width:4px;height:100%}#menu-checkbox:checked~.sidebar{transform:translateX(0)}#menu-checkbox:checked+.mobile-menu__btn{width:min(100vw,500px);padding:0 20px;background-color:var(--menu-bg-color)}#menu-checkbox:checked+.mobile-menu__btn span{display:inline}