.img-magnifier-container {
    position: relative;
}

.img-magnifier-glass {
    position: absolute;
    /*pointer-events: none;*/
    /*    display: none;*/
    border: 3px solid #000;
    /*    border-radius: 50%;
*/
    /*cursor: none;*/
    /*Set the size of the magnifier glass:*/
    width: 600px;
    height: 600px;
    z-index: 30;
}

@media only screen and (max-width: 1200px) {
    .img-magnifier-glass {
        width: 250px;
        height: 250px;
    }
}
@media only screen and (max-width: 800px) {
    .img-magnifier-glass {
        width: 200px;
        height: 200px;
    }
}

.show-magnifier {
    /*position: fixed;*/
    top: 40px;
    right: 100px;
    background-color: transparent;
    border: none;
    outline: none;
    height: 40px;
    width: 40px;
    z-index: 10;
}
    .show-magnifier svg {
        height: 40px;
        width: 40px;
        z-index: 10;
        filter: invert(100%) sepia(72%) saturate(2%) hue-rotate(137deg) brightness(104%) contrast(101%);
}

.zoom-in{
    /*position: fixed;*/
    top: 40px;
    right: 160px;
    background-color: transparent;
    border: none;
    outline: none;
    height: 40px;
    width: 40px;
    z-index: 10;
}

.zoom-in svg {
        height: 40px;
        width: 40px;
        z-index: 10;
        filter: invert(100%) sepia(72%) saturate(2%) hue-rotate(137deg) brightness(104%) contrast(101%);
    }
.zoom-out {
    /* position: fixed; */
    top: 40px;
    right: 220px;
    background-color: transparent;
    border: none;
    outline: none;
    height: 40px;
    width: 40px;
    z-index: 10;
}

.zoom-out svg {
    height: 40px;
    width: 40px;
    z-index: 10;
    filter: invert(100%) sepia(72%) saturate(2%) hue-rotate(137deg) brightness(104%) contrast(101%);
}

.show-magnifier2 {
    background-color: transparent;
    border: none;
    outline: none;
    height: 40px;
    width: 40px;
    z-index: 10;
}

    .show-magnifier2 svg {
        color: black;
        height: 40px;
        width: 40px;
        z-index: 10;
        filter: invert(100%) sepia(72%) saturate(2%) hue-rotate(137deg) brightness(104%) contrast(101%);
    }


.zoom-in2 {
    color: black;
    background-color: transparent;
    border: none;
    outline: none;
    height: 40px;
    width: 40px;
    z-index: 10;
}

    .zoom-in2 svg {
        height: 40px;
        width: 40px;
        z-index: 10;
        filter: invert(100%) sepia(72%) saturate(2%) hue-rotate(137deg) brightness(104%) contrast(101%);
    }

.zoom-out2 {
    color: black;
    background-color: transparent;
    border: none;
    outline: none;
    height: 40px;
    width: 40px;
    z-index: 10;
}

    .zoom-out2 svg {
        height: 40px;
        width: 40px;
        z-index: 10;
        filter: invert(100%) sepia(72%) saturate(2%) hue-rotate(137deg) brightness(104%) contrast(101%);
    }