Different logo on mobile

Hi guys, final question I promise…

The site I’m working on uses two logos, a white one and a black one. The white one changes to the black one when the navbar becomes white (which is great). However I’m having an issue that when the site loads in mobile mode (with the default white bar) the black logo doesn’t display until the user scrolls down. Is there a way via CSS to make sure the black logo displays on load when the navbar is white?

Here’s the css im using at the moment `.navbar-not-transparent .navbar-brand img {
content:url(https://s703486241.websitehome.co.uk/wp-content/uploads/2018/03/The-Fuzz-Black.png);
}`

Thanks!

The page I need help with: [log in to see the link]