Mobile Preview from Desktop is different than actual Mobile Site plus White Space on the Right Side

So on desktop Mobile preview, everything is where I'd like it to be, see 1st pic. Notice you can see the menu in the header.  

However, on the actual mobile website (using Android built-in browser and Chrome--not sure if it matters), it'll load the content portion and at first I didn't noticed but then if you "swipe left" slightly, there's this weird white column. It's only meant to scroll down. That's when I also noticed the menu from header is also "missing" but it's not. It's actually on the top right corner of the white column. 

If anyone can help me out that would be great! If it involves any custom coding please walk me through it. I noticed coding in other thread but I wouldn't even know where to enter it! 

I'm hoping it's something simple or some button I forgot to click. 

@Pureform What's the url?

10 hours ago, WCS said:

@Pureform What's the url?

Hi @WCS it is www.pureformoc.com 

@Pureform Thank you! I took a look and while I can see your menu icon, I can also scroll to the left and right. This is usually caused by code that adjusts margins. To fix it:

• Log into the back of your website
• Go to Website > Website Tools > Custom CSS
• Copy and paste the below code, then click Save

html, body {
    overflow-x: hidden}

@Pureform Of course! Happy designing 😊

If you wouldn't mind, please mark my response as the solution. This helps people who are searching for a similar answer find the code.