add background overlay without ::before code example
Example 1: how to css after elements for background overlays
.banner::after { content: ""; // ::before and ::after both require content position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: linear-gradient(120deg, #eaee44, #33d0ff); opacity: .7;}
Example 2: how to css after elements for background overlays
.banner::after, .banner::before { ...}