Need help to put an Image behind header background color, specifically on blog posts

Site URL: https://klfoundation.ca

Hi,

Through a little trial and error and pulling other helpful code from other post i was able to put a colour background on the blog post page of a site im working on, Unfortunately ive not been able to figure out how to add a image to look similar to the other pages headers.

Page im working on https://www.klfoundation.ca/news/blog-post-title-four-a8knm

Page sample of how i want it to look (just the image part behind the colour) https://www.klfoundation.ca/getinvolved

the current ccs code im using is (i know the nav-folder is not relevant to this, but wanted all the code im using there for completions sake);

- - -

.collection-type-blog-basic-grid.view-item .header-announcement-bar-wrapper {
    background: rgba(255,77,0,0.9) !important;
}
.header-nav-folder-content {
   background: rgba(0,0,0,0.5) !important;
}

- - -

Any help on what i would need would be supper helpful, the image i want in the background is already uploaded to the site as its just a repeat of the landing image - IMG_0395

Hi,

You want to add an image behind orange color? This will be same for all blog posts, or each blog post will have a different image