.my-product-slider{
    max-width:600px;
    margin:0 auto;
    position:relative;
}

.my-slide{
    display:none;
}

.my-slide.active{
    display:block;
}

.my-slide img{
    width:100%;
    height:auto;
    display:block;
}

.my-slider-dots{
    text-align:center;
    margin-top:20px;
}

.my-dot{

    width:12px;
    height:12px;
    border-radius:50%;
    background:#cfcfcf;
    display:inline-block;
    margin:0 6px;
    cursor:pointer;
    transition:.3s;

}

.my-dot.active{
    background:#000;
}