Cover Half of Hero Image

Hi guys,
I want my hero image like on website: https://www.elder.org/ where half of it is covered. I know how to put text on it, but I am not sure how to cover half of the image. Anybody can help please? Thanks

Check out this codepen:

Ok. Thank you. I am a complete beginner. I will keep trying. Thank you so much!