svg circle center alignment not working in IE11

Question

I am working on a circular progressbar using css.In it i have a circle which comes inside svg.The problem is that the circle gets cut off in IE11.please help to solve this.Thanks for the help in advance

My Code

.percent {
    position: relative;
    width: 130px;
    height: 130px;
    border-radius: 50%;
    }
    
    svg {
    position: relative;
    width: 130px;
    height: 130px;
    }
    
    svg circle {
    width: 100%;
    height: 100%;
   /* margin-left:auto;
    margin-right:auto;
    display:block;not working*/
    fill: none;
    stroke: #dbdbdc;
    stroke-width: 6;
    -webkit-transform: translate(5px, 5px);
    transform: translate(5px, 5px);
}

<div class="percent">
                                    <svg class="Malware">
                                        <circle cx="60" cy="60" r="60"></circle>
                                        <circle cx="60" cy="60" r="60"></circle>
                                   </svg>
                                    <div class="number">
                                        <h2>91</h2>
                                    </div>
                                </div>

My issue

THE DESIRED OUTPUT