text over image does not work when i resize the browser window

I want the text to be displayed over image. It works well when I see in full screen in my laptop. but when decrease the browser size the text sits over the image but the text does not get wrapped to be over the image itself. can anyone help me?

HTML: We have high customer rating from all our customers. css:

.image {

  position: relative;
}

.text-over {
width:100%;
  z-index: 1;
   position: absolute; 
  color: white;

  font-size:100%;
 bottom:0;
  background-color:#FF0000;

}
.img-responsive{max-width :100%;}