#menu__toggle{opacity:0}#menu__toggle:checked~.menu__btn>span{transform:rotate(45deg)}#menu__toggle:checked~.menu__btn>span::before{top:0;transform:rotate(0);background-color:#000}#menu__toggle:checked~.menu__btn>span::after{top:0;transform:rotate(90deg);background-color:#000}#menu__toggle:checked~.menu__box{visibility:visible;left:0}.menu__btn{display:flex;align-items:center;position:fixed;top:23px;left:19px;width:20px;height:20px;cursor:pointer;z-index:1000}.menu__btn>span,.menu__btn>span::before,.menu__btn>span::after{display:block;position:absolute;width:100%;height:2px;background-color:#fff;transition-duration:.25s}.menu__btn>span::before{content:'';top:-8px}.menu__btn>span::after{content:'';top:8px}.menu__box{display:block;position:fixed;visibility:hidden;top:0;left:-100%;width:300px;height:97%;text-align:left;margin:0;padding:7% 0 0 8%;list-style:none;background-color:#f6fbff;box-shadow:1px 0 6px rgba(0,0,0,.2);transition-duration:.25s;z-index:999;overflow:auto}.menu__item{display:block;padding:0 0 7% 7%;color:#333;font-family:roboto,sans-serif;font-size:17px;font-weight:600;text-decoration:none;transition-duration:.25s}.menu__item:hover{}.menu__item a{color:#000;text-decoration:none;font-weight:500}.menu__item ul{list-style:none;padding:5px 0 0 14px;font-size:14px}.menu__item>ul>li{padding:17px 0 0}.menu__item a:hover{text-decoration:underline}.menu__item-submenu{margin:0 0 0 5%}#projects{display:none}.invis{display:none}.toggle_show_menu{display:block}.menu__arrow::before{float:right;color:gray}.menu__arrow::after{content:"";margin:1px .5em;display:inline-block;border:7px solid transparent;border-top:8px solid gray;border-bottom:0}.menu_arrow-down::after{border-top:0;border-bottom:8px solid gray}