absolutely positioned div inside relatively positionsed div is not moving [on hold]

On my website I have 2 col-xs-6 inside a row. Both columns have an image in each and I want to add text over the top that will move when they do due to img-responsive, however the text doesn't seem to sit in the div but instead on top of it, heres a snip of the code http://ift.tt/1ONfhM4

Edit: this is not my website but a small snippet of it hence the single col-xs-6

Edit 2: I want my text to stay centered on top of the image when the image is resized, see http://ift.tt/18JzrDB for a working example, when the browser is resized the images resize as well as the image stays centered on the image and moves with it, this is what I want to achieve.

via Chebli Mohamed