Custom Hamburger Invert on certain pages

I have implemented a forced custom hamburger which works great. However, on some pages, I need to invert this (along with the logo) to show better. Is it possible when using a custom image? 

https://dinosaur-horse-8k34.squarespace.com/ranchroastedcoffee

Pw: notyet

<style>
 .header-title-logo img {
    -webkit-filter: invert(100%);
    filter: invert(100%);
  filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1');
  }
</style>

I have the above code which works great on inverting the logo, however, I can't find the right code to target the hamburger 😞

With Burger, use this

<style>
  .burger-inner>div {
  	background-color: black !important;
  }
</style>