Overlaying a transparent background on an embedded video

Question

I\'ve a video which I\'ve embedded in a fullwidth div panel. I\'m trying to overlay a gradient on top of it, but I can\'t make it work. I\'ve tried adjusting z-index, wrappi

Answer 1

I came across this very same issue and eventually managed to get an aesthetically similar effect simply setting the video with opacity:0.5 over a colored background.

.vid-bg {
  opacity: 0.5; /* ! */
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%; 
  min-height: 100%
}