How to create a zoom for a picture

if you want to create a zoom for a picture with transition:

1) You need to add css code, for this you need to go to theme files:

2) find asset - customproductbuilder.css if exist, else you need to create this file, more information here https://buildateam.zendesk.com/hc/en-us/articles/360025877352-Manually-Adding-Custom-Product-Builder-To-a-New-Theme

3) Add css code to customproductbuilder.css

@media only screen and (min-width: 1020px) {

 #product-builder .cpb-layout .cpb-preview-sticky {
  transition: transform .6s ease;
 }

 #product-builder .cpb-layout .cpb-preview-sticky:hover {
  transform: scale(1.5) translateX(50px) !important;
  transition: transform .6s ease;
  z-index: 9;
 }

}

Zoomed image:

*It works on PC version