On my website I’ve got an header element with a cart icon inside.
When I hover over the cart icon, the products inside the cart are being displayed underneath the cart icon.
The problem is that the element displaying the products is being displayed underneath the page content..

I’ve tried fine-tuning the positioning and z-index of the header parent and child elements, but nothing seems to work..

Heres a link to my page:
My webpage

If you click on the add to cart button on this product and then hover over the cart icon in the header, you will see the problem..