background-blend-mode alternative for internet explorer
<p>I'm using background-blend-mode on my page but IE doesn't support it. </p>

<p>How can I solve this?</p>

<p>My page on Chrome/Firefox:
<a href="https://i.stack.imgur.com/BlWFa.png" rel="noreferrer"><img src="https://i.stack.imgur.com/BlWFa.png" alt="enter image description here"></a></p>

<p>My page on IE:
<a href="https://i.stack.imgur.com/Qedrt.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/Qedrt.jpg" alt="enter image description here"></a></p>

<p>My CSS:</p>

<pre><code>div#background-image-new {
background-image: url("/img/profile_pictures/bg.jpg");
/* z-index: -2; */
background-size: cover;
background-color: rgba(6, 18, 53, 0.75);
background-blend-mode: overlay;
position: fixed;
top: 0;
height: 100vh;
width: 100vw;
z-index: -1;
}
</code></pre>