@import url('http://fonts.googleapis.com/css?family=Open+Sans:400,700');

#wrapper{
}
.progress{
    width: 100px;
    height: 100px;
}
.track, .fill{
    fill: rgba(0, 0, 0, 0);
    stroke-width: 5;
}
.track{
    stroke: #cecece;
}
.fill{
    stroke: rgb(255, 255, 255);
    stroke-dasharray: 150.72259521484375;
    stroke-dashoffset: 150.72259521484375;
    transition: stroke-dashoffset 1s;
}
.progress.blue > .fill{
    stroke: rgb(41, 170, 227);
}
.progress.pink > .fill{
    stroke: rgb(157, 51, 143);
}
.progress.green > .fill{
    stroke: rgb(33, 157, 100);
}
.progress.yellow > .fill{
    stroke: rgb(157, 154, 0);
}
.progress.orange > .fill{
    stroke: rgb(157, 83, 3);
}
.display{
    font-family: 'Open Sans';
    fill:rgba(0, 0, 0, 0.5);
    text-anchor: middle;
}