Help building CSS reference

Hi there,

I need to remove the header out of the blog post template when it is viewed from a specific page. I’m opening the blog posts in a lightbox with thumbnails, which is why I need to remove the header and menu.

you can view the page here: http://r3demo.com/green-room/
and click one of the blog posts.
it opens the blog post correctly but the logo header content is too big for the lightbox and isn’t necessary anyway.

I had asked a similar question a while back, and the developer then gave me the following css:

.page-id-2526 .single-post #header, .single-post #main-navigation-wrapper, .single-post .breadcrumb-wrapper { display:none !important; }

However, the header content remains. Can you help me get the reference right so I set the display to none?

If you could explain how you got the reference I would be very grateful!

thank you!