Large gap on mobile view! How do I fix this?

How do I fix this? I’ve set everything as full width on mobile view and it still doesn’t fix the screen properly?! I’ve tried changing the spacing, but nothing works. When I go to my website on my phone and you zoom out, it looks like this. 
 

website: www.sharibalog.com.au

Scrolling text in Announcement Bar (above header) caused this

You can consider removing it or add this to Website > Website Tools (under Not Linked) > Custom CSS

body {
    overflow-x: hidden;
}