Fixed product image on page scroll, Turbo theme

[PureCare]

Hello everyone, 

(took the pic here : https://community.shopify.com/c/Shopify-Design/Fixed-Sticky-Product-Imaged-on-Page-scroll-VENTURE-th...)

I need to do this to my product page (shown on image) 

Can someone help me with that ? 

Thanks a lot for your help.

[paramSoft]

Please provide website url and if your store is password protected then also provide password

[PureCare]

Hello, this is my store : pure-care.fr and the password is : prohge

Thanks 

[paramSoft · Accepted solution]

Please place this code at the end of theme.scss

@media only screen and (min-width: 768px) {
.product_section .product__images {
position: -webkit-sticky;
position: sticky;
    top: 13%;
}
}

[PureCare]

Thanks you so much ! It works.

When i scroll, there is a menu drop down (sticky like on the image)
How can I add some space between the menu dropdown and the sticky image (arrow in the screen) ?

[paramSoft · Accepted solution]

@media only screen and (min-width: 768px) {
.product_section .product__images {
position: -webkit-sticky;
position: sticky;
    top: 17%; /* change this to set position */
}
}

[paramSoft]

Thank you for update.