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?