#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)}#menu__toggle:checked~.menu__btn>span::after{top:0;transform:rotate(90deg)}#menu__toggle:checked~.menu__box{visibility:visible;left:0}.menu__btn{display:-ms-flexbox;display:flex;position:relative;width:18px;height:18px;cursor:pointer;z-index:4}.menu__btn>span,.menu__btn>span::before,.menu__btn>span::after{display:block;position:absolute;width:100%;height:2px;background-color:#555;transition-duration:.25s}.menu__btn>span::before{content:"";top:-8px}.menu__btn>span::after{content:"";top:8px}.menu__box{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;position:fixed;visibility:hidden;top:0;left:-100%;z-index:3;width:300px;height:100%;margin:0;padding:70px 0;list-style:none;background-color:#fff;box-shadow:1px 0px 6px rgba(0,0,0,.2);transition-duration:.25s}.menu__item{display:block;padding:12px 24px;color:#333;font-family:Lava,"Helvetica Neue",serif,Calibri,Tahoma,Arial;font-size:14px;text-decoration:none;transition-duration:.25s}.menu__item:hover{background-color:#f5f5f5}