Creating double background in survey form

[sroshanahmad]

Tell us what’s happening:
in the survey form, they have 3 backgrounds with 2 being transparent , I’m only able to create 1 transparent background although i have used before and after classes.
Can someone tell me where i’m wrong and guide me

Your code so far
https://codepen.io/sroshanahmad/full/vYLbWxo

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.89 Safari/537.36.

Challenge: Build a Survey Form

Link to the challenge:

freeCodeCamp.org

[samolex]

It should be a mix of linear gradient and background image. You won’t make the linear gradient completely opaque so that the background image will be visible.

Something like: background: linear-gradient(to right, #275e67e0, #275e67e0), url("https://i.imgur.com/GPDYiK.jpg") no-repeat fixed center center;

You can add as many gradients you want…

Your form looks good though.