Color layer behind main heading in Monochrome Pro home page

[jbculp]

The home page on monochrome has the main image at the top with a Heading text block (core heading). I would like to add a colored box behind that heading to follow its size. I cannot do it. The box itself does not have a background option.
The additional CSS classes listed in the advanced view are: bold-heading-text fade-in-up.

I cannot find any combination of CSS that would allow me to do a background color or gradient.

Something like this, but this doesn't work.

.has-text-align-left .bold-heading-text .fade-in-up .home-heading {
	background: linear-gradient(135deg,rgba(221,221,221,0.8) 0%,rgb(221,221,221) 100%);
	flex-basis: 65% !important;
}

http://not a live site

[jbculp]

I guess I didn't say that very clearly. The block layout titled slate hero title is what is on the home page. I wanted to put a color layer behind the text area, preferably a gradient layer or at least RGBA so I can put a slight screen behind the text only.

[Author]

Posts