Customising the shape of a progress bar?

Hi all, this should be relitively to the point.
Im working on a health bar which depletes from top to bottom, and one of my artists have created me a border for said health bar.
We’ve now ran into an issue which i was expecting which can be seen in the screenshot provided, where the progress bar overlaps the border we have near the bottom.

moralebar.png

Is there any way i can cut out the overlapping parts of the progress bar so that its all contained within the border? And if so how do i do this.

Thanks

take a look at these tutorials: