Как наложить картинку на блок?

#box { 
 width: 100%; 
 height: 150px; 
 background-color: #15B575; 
 } 
 
#logo { 
 margin-top: 50px; 
  position: absolute; 
  top:0; 
  left:0; 
  right:0; 
  bottom: 0; 
  z-index: 2; 
} 
header { 
position: relative; 
}

<header> 
  <div id='box'></div> 
  <img id='logo' scr='somefoto'> 
</header>

#box { 
  position: absolute; 
 
  /* Просто для демонстрации */ 
  width: 300px; 
  height: 200px; 
  background-color: #ccc; 
} 
 
#logo { 
  position: relative; 
 
  /* Просто для демонстрации */ 
  left: 30px; 
  top: 20px; 
  right: 40px; 
}

<div id="box"> 
  <img id="logo" src="http://lorempixel.com/output/nature-q-c-200-100-6.jpg" /> 
</div>