Decrease background image brightness without affecting its content

Question

I want to decrease the brightness of header background Image without affecting brightness of content

I.e header background Image brightness should be decrease but header content brightness should be same ( no change )

My CSS Code

 header {
   background-image: url(assets/bg.jpg);
   background-repeat: none;
   background-attachment: scroll;
   background-position: center center;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   background-size: cover;
   -o-background-size: cover;
   text-align: center;
   color: #fff;
  }
header .intro-text {
 padding-top: 100px;
 padding-bottom: 50px;
}


header .intro-text .intro-lead-in {
 font-family: "Playfair Display",sans-serif;
 font-style: italic;
 font-size: 22px;
 line-height: 22px;
 margin-bottom: 25px;
}

My HTML code

 <header>
    <div class="container">
    <div class="slider-container">
    <div class="intro-text">
        <div class="intro-lead-in">Welcome To Our Studio!</div>
        <div class="intro-heading">It's Nice To Meet You</div>
        <a href="#about" class="page-scroll btn btn-xl">Tell Me More</a>
    </div>
    </div>
 </div>
 </header>