Admin Bar Issue with GeneratePress

I am having an issue where if you view these websites on a phone or inspect and pick a mobile device the admin bar is all messed up. It appears about an inch from the top of the screen.

Just wondering how I might be able to fix it. I am using GeneratePress theme and I have a child theme which I can add custom css but it doesn't seem to override the CSS from the Custom Admin Bar from the Ultimate Branding plugin.
Examples:
http://technology.dearbornschools.org/
http://howard.dearbornschools.org/
http://schoolimprovement.dearbornschools.org/

Any ideas on how to make the admin bar stick to the top?
[image pos="0"]