Inserir RGBA sobre background-image

Pessoal, atualmente eu tenho uma div que no CSS contém meu background image. Veja:

<div class="banner-wrap">

e meu CSS:

.banner-wrap {
    background-attachment: scroll;
    background-clip: border-box;
    background-image: url("../images/b-1.jpg");
    background-origin: padding-box;
    background-position: center center;
    background-repeat: repeat-x;
    background-size: cover !important;
    min-height: 677px;
    opacity: 1;
    position: relative;
}

Em cima do background-image eu quero colocar um RGBA, para esmaecer um pouco a imagem, por exemplo aqui: http://www.flatiron.com/

Como posso fazer isso?