image overlay in css
background: linear-gradient(0deg, rgba(0, 0, 0, 0.86), rgba(0, 0, 0, 0.86)), url(your-img-path);
overlay color on image css
footer#site-footer{
position:relative;
}
footer#site-footer:before { /* use before property (pseudo-element) */
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.3);
}