<style>

.zoom {
    transition: transform ease-in-out 0.5s;
    cursor: zoom-in;
}

.image-zoom-large {
    transform: scale(1.2);
    cursor: zoom-out;
    height: auto;
    width: auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    z-index: 3;
    position: absolute;
    left: 10%;
}

</style>
<script>

document.querySelectorAll('.zoom').forEach(item => {
    item.addEventListener('click', function () {
        this.classList.toggle('image-zoom-large');
    })
});
</script>
