28Px Admin Bar Problem IOS Mobile View

I’m having a rather bizarre problem when viewing my site https://www.officerofthewatch.co.uk on an IOS (IPhone 6) in portrait mode. The top of the page is extended down by 28px (the length of the admin bar). The admin bar then appears below this white space and over my website logo. The bar also moves/causes problems when the main navigation menu is opened. It only occurs in portrait mode on my iPhone and works on computer browsers without issue. I’m going to try a range of other mobile browsers over the coming days to identify the extent of this issue. I’ve uploaded screenshots for reference.

https://officerofthewatch.co.uk/wp-content/uploads/2016/02/20160228_231456000_iOS.png

https://officerofthewatch.co.uk/wp-content/uploads/2016/02/20160228_231442000_iOS.png

I wouldn’t be so concerned if it was just myself who see’s the admin bar but it’s a user content generation website so any registered user will have this issue.

Has anyone had any experience of this or a solution?