.product {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.main-view {
    width: 300px;
    /* Adjust the width as needed */
    height: 400px;
    /* Adjust the height as needed */
    overflow: hidden;
    cursor: pointer;
}

.main-view img {
    width: 100%;
    height: auto;
    transition: transform 0.3s;
}

.image-thumbnails {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

.thumbnail {
    margin: 0 5px;
    cursor: pointer;
}

.thumbnail img {
    width: 60px;
    /* Adjust the thumbnail size as needed */
    height: auto;
}

.main-view.enlarged img {
    transform: scale(1.5); /* Apply the zoom effect */
}