Custom header looks different on mobile - How to fix?

[Shane_94]

Hey guys - so I have two problems...

The first is that I am using a custom pattern for my header, utility bar, and footer background. For some reason, they look absolutely terrible on my actual mobile and nothing like they do on the "mobile view" on the website, is there any way of making these look the same? 

The second problem is I wanted the utility bar and the header to be flush (or even somehow just moulded together and use the same image to make the pattern flush) is there a way I can fix both of these problems?

I am using the Dawn theme 

Here is my store: https://manningtree-vintage-vibes.myshopify.com/
The password is: teefai

Thank you in advance!