Bueno no vi la necesidad de utilizar el after o before , Prueba este código: 


<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-css -->

    #image {
      background-image:url(http://www.gelfuzion.com/img/slides/nivo/bg-1.jpg);
      height: 500px;
      max-width: 100%;
      position:relative;  
      

    }

    #container {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background:rgba(0,0,0,0.6);
    }
       
    .detalle {
      color:#fff;
    }

<!-- language: lang-html -->

    <div id="image">
      <div id="container">
        <div class="detalle">
          <h2>TITLE TITLE</h2>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt neque harum a, cum natus fugit quidem, odio ea. Error ad a placeat omnis tempora nisi rerum, minima earum, sed dolor?</p>
        </div>
      </div>
    </div>

<!-- end snippet -->