Как под див засунуть изображение?

Добрый день, в css не силён, уже который день не выходит. Играл с отребутами relative и obsalute, но не выходит нужное. Нужно что бы див чуть наезжал на картинку, и в зависимости от расширения экрана картинка должна находится в центре

Стрелки поставил

.top {
position: relative;
display: block;
font-size: 15px;
background: url('top.png') center;
text-aling: center;
text-shadow: 0 0 5px red;
height: 30px;
margin-top: -3px;
line-height: 21px;
width: 100%;
}


.log {
margin-left: 3%;
margin-right: 3%;
text-aling: center;
display:block !important;
}

.log img{
position: absolute;
top: -24px;
left: 0px;
margin-top: -20px;
width: 100%;
}


<div class="top"><center>Поражение</center></div>
<div class="bmenu">
<img class="log" src="defeat.png" alt="">

</div>

Исходник

css-ом

bmshot, Точно

div.picture {
background-image:url('/image.png');
}