How to hide .flier on blog posts?

Site URL: https://www.mdwfair.com/atlas

Blog Page Link: https://www.mdwfair.com/atlas

Example Blog Post Link: https://www.mdwfair.com/mdwatlas/indigenousartalliance

The .flier (floating green map) is currently appearing by Settings > Advanced > Code Injection 

I'd like to make it not appear on Blog Posts since it makes the text/articles hard to read. I thought just adding this to

Blog Settings > Page Header Code Injection could work but its had no effect:

.flier {
display: none !important;}

Would appreciate any help!

Add the following to Blog Settings > Advanced > Page Header Code Injection for the blog page.

<style>

  .flier {
  
    display : none;
    
    }
    
  </style>

Then leave it in place so we can see why it is not working. Let us know when you add the code.