CSS negative z-index not working properly

So I am having a z-index problem on my website, take a look at: https://displee.com/osrs-store

If you look at the header of each step you, you will notice that only step 3 has a ribbon and step 1 and 2 do not (if you don't see this, then try to zoom-in). Step 1 and 2 also should have a ribbon. I cannot seem to fix it, I played around with z-index on all elements and using position relative but it is not working. I think somehow it has to do with the height of my content or something.