large space to the right and the mobile menu

Hi Leanne,

Can you clear cache and disable cache plugin so I can have a closer look at the codes?

This is done. Please take a look now.

(Also can you delete my email on this post title)

You have this CSS:
https://www.screencast.com/t/RotovsJUIY6Z

form.search-form.navigation-search {
    max-width: 400px;
    top: 40px;
    z-index: 10;
    border: 1px solid #DDD;
    border-top: 0;
    left: 50%;
}

Remove the left: 50%; or if it's needed for desktop then add this CSS for mobile:

@media (max-width: 768px) {
form.search-form.navigation-search {
    left: 0;
}
}

Adding
@media (max-width: 768px) {
form.search-form.navigation-search {
left: 0;
}
}

Did not fix it. So, I just removed the whole thing and that solved the problem.

Thank you.

The mobile CSS might be overridden by other CSS.

But glad it worked by removing the CSS :)