scrolling when mobile menu is open

You have disabled the slideout - that CSS for the font size is specific to that.

I am confused, this conversation started with Leo recommending that I use off canvas instead, which I did and asked if it did not include submenu controls, to which he gave me the code.
I also sent you a screenshot to show what I am talking about.

Sorry my bad the Off Canvas is what i meant ( it used to be called the Slideout )

Well, the off canvas is still on. Are you sure you are looking at the staging copy (staging4.cobbletales.com) and not at the live website?

The code is currently showing you are using 18px:
https://www.screencast.com/t/9vlp7roiD

The parent items are using 19px so the difference is not very noticeable:
https://www.screencast.com/t/DBbrDmxgiD

If that's not the code you are using, then please clear and disable all caching plugins, server cache.

the code is 12px, I have disabled the sg optimiser. What else can I do?

I'm simply not seeing the code being outputted.

Can you make sure there are no syntax errors in your other CSS that might stop this block of code from executing?

You can try moving this block to the top of the Simple CSS editor, or run your entire code through:
https://jigsaw.w3.org/css-validator/#validate_by_input

Putting it at the top solved it! indeed there must have been other css for mobile nav that was conflicting. Phew I thought I was going crazy because you previously told me the code was working;D
Thank you for your help.

If it was just a conflict, then the code would still show when we use browser inspect.

Since the code didn't show and it worked on top of the editor, that is saying there is a syntax error (missing/extra brackets or semicolon etc) in the rest of the CSS.