Product image stuck at top of page, won't get below header (broadcast theme)

[TimTakeTwo]

Hello,

My website is https://taketwojewelry.com/

for some reason product image at product pages is all the way at the top instead of below header. This is happening on both desktop and mobile.

Can someone please assist?

Thank you in advance.

[Abdosamer]

Hi @TimTakeTwo , go to theme.css and add the following code :

@media (max-width:749px){

.product__images--mobile-thumbs .product__slides {
   
    margin-top: 5rem !important;
}

}

Result:

[TimTakeTwo]

hello,

any solution for desktop?

[Abdosamer]

@TimTakeTwo , Add the following code :

.product__images--mobile-thumbs .product__slides {
    margin-top: 7rem !important;
}

[TimTakeTwo]

Thank you!!!

[TimTakeTwo]

Hello, sorry this seems to work and help make the desktop picture go down but seems to make the mobile picture go down even more compared to 5rem which was perfect. Could you please help?

[Abdosamer]

@TimTakeTwo , change this code :

.product__images--mobile-thumbs .product__slides {
    margin-top: 7rem !important;
}

to this :

@media (min-width:990px){
  .product__images--mobile-thumbs .product__slides {
    margin-top: 7rem !important;
}

}

[TimTakeTwo]

Thank you so much!