CSS- cant position div off screen without seeing some of it

Hi everyone, I am trying to get a side bar which moves onto the screen when the user clicks the button. Initially I am trying to position it off screen to the left 20% but you can still see it. I cant work out why, please could someone take a quick look at my codepen? Thanks

Did you fix it? I don’t see the menu when it’s closed.

BTW, I would assume you want the menu to overlay and not push content to the side?