.circle-chart{ width:195px; height:195px;}.circle-chart__circle{ stroke:#00acc1; stroke-width:3; stroke-linecap:round; fill:none; animation:circle-chart-fill 2s reverse; transform:rotate(-90deg); transform-origin:center;}.circle-chart__circle--negative{ transform:rotate(-90deg) scale(1,-1);}.circle-chart__background{ stroke:#efefef; stroke-width:2; fill:none;}.circle-chart__info{ animation:circle-chart-appear 2s forwards; opacity:0; transform:translateY(0.3em);}.circle-chart__percent{ alignment-baseline:central; text-anchor:middle; font-size:8px;}.circle-chart__subline{ alignment-baseline:central; text-anchor:middle; font-size:3px;}.success-stroke{ stroke:#00C851;}.warning-stroke{ stroke:#ffbb33;}.danger-stroke{ stroke:#ff4444;}@keyframes circle-chart-fill{ to{stroke-dasharray:0 100;}}@keyframes circle-chart-appear{ to{ opacity:1; transform:translateY(0); }}