Hi there,

I am trying to resolve an issue on the following web page:

https://chatterleyluxuries.com/produ...-fountain-pen/

If you click on the large image of the pen at the top, you'll see the overlay works perfectly and is seamless when navigating through the slideshow.

However, if you scroll down the page to the gallery of images at the bottom and click on one of them, the overlay appears in the bottom right of the screen. The CSS
for that particular overlay is:

Code CSS:
#TB_overlay {
    position: fixed;
    z-index: 10100;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
}

And for the window inside the overlay:

Code CSS:
#TB_window {
    position: fixed;
    z-index: 10102 !important;
    color: rgb(0, 0, 0);
    text-align: left;
    border: 1px solid rgb(85, 85, 85);
    box-shadow: 0px 4px 30px rgb(0, 0, 0);
    display: none;
    background: none repeat scroll 0% 0% rgb(255, 255, 255);
    top: 50%;
    left: 50%;
}

I need to get this fixed ASAP so if anyone can point me in the right direction, I'd be very grateful.