I am stumped!
Here’s the desired behavior: A div with a single background image, but half of the div has a dark overlay and the other half a less-dark overlay. There is lots of text, a form, etc, but that should all be unaffected by the overlays.
I managed the desired behavior on the dark overlay, but no on the less-dark overlay. The less-dark overlay is affecting the text in the div.
The problem is near the bottom of the page, in the contact us/experience success area.
FYI, the method I’m using is to enclose the content in a wrapper div, and to use a ::wrapper pseudoelement with the background-color: 0,0,0,0.9 or whatever to darken it. The form-wrapper area is working correctly; the engage-wrapper area is not.
Here is the code:
Here is a deployment: