Your IP : 18.190.176.203
.ui-graph-circle-wrapper {
display: inline-block;
overflow: hidden;
position: relative;
font-size: 0;
}
.ui-graph-circle-number {
position: absolute;
top: 50%;
left: 50%;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-light, 300);
font-size: 72px;
line-height: 72px;
color: #333;
margin: -3% 0 0 -4%;
opacity: 0;
transition: 1s;
z-index: 9;
-webkit-transform: translate(-50%,-50%) translateZ(0);
transform: translate(-50%,-50%) translateZ(0);
will-change: transform;
transform-style: preserve-3d;
}
.ui-graph-circle-counter .ui-graph-circle-number {
transition: none;
}
.ui-graph-font-sm .ui-graph-circle-number {
font-size: 56px;
line-height: 56px;
}
.ui-graph-circle-wrapper-animate .ui-graph-circle-number {
opacity: 1;
}
.ui-graph-circle-number span {
/*content: '%';*/
position: absolute;
right: -27px;
bottom: 5px;
color: #333;
opacity: .3;
font-size: 35px;
line-height: 40px;
-webkit-transform: translateX(0);
transform: translateX(0);
transition: .5s;
}
.ui-graph-circle-number:empty:after {
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
.ui-graph-circle-counter .ui-graph-circle-number {
margin: -3% 0 0 0;
font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
font-weight: var(--ui-font-weight-regular, 400);
}
.ui-graph-circle-bar-bg {
stroke-dashoffset: 0;
transition: stroke-dashoffset 1s linear;
stroke: #e0f5ff;
stroke-width: 7px;
fill: transparent;
stroke-dasharray: 400%
}
.ui-graph-circle-bar-progress {
opacity: .3;
stroke-width: 7px;
fill: transparent;
stroke: #2fc6f6 !important;
transition: 1s cubic-bezier(0.65, 0.07, 0.37, 1.05);
}
.ui-graph-circle-bar-without-animate .ui-graph-circle-bar-progress {
transition: none;
}
.ui-graph-circle-bar-progress-green .ui-graph-circle-bar-progress {
stroke: #47e4c2 !important;
}
.ui-graph-circle-bar-progress-white .ui-graph-circle-bar-progress {
stroke: rgba(255, 255, 255, 0.81) !important;
}
.ui-graph-circle-waves-wrapper {
position: absolute;
overflow: hidden;
top: 19px;
left: 19px;
right: 19px;
bottom: 19px;
z-index: 1;
border-radius: 100%;
background: #fff;
}
.ui-graph-circle-waves {
position: absolute;
top: 100%;
left: 0;
right: 0;
bottom: 0;
height: 100%;
opacity: 0;
transition: 2.5s;
transform: translateY(0);
}
.ui-graph-circle-wrapper-animate .ui-graph-circle-waves {
opacity: 1;
}
/*.ui-graph-circle-waves:before {*/
/* content: '';*/
/* width: 275%;*/
/* height: 203%;*/
/* background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22223%22%20height%3D%22329%22%20viewBox%3D%220%200%20223%20329%22%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%22a%22%20x1%3D%2250%25%22%20x2%3D%2262.226%25%22%20y1%3D%220%25%22%20y2%3D%2281.169%25%22%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23B2E800%22/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%239CD100%22/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Cpath%20fill%3D%22url%28%23a%29%22%20fill-rule%3D%22evenodd%22%20d%3D%22M223%2C0.00779280808%20C217.861166%2C-0.0499158555%20212.594214%2C0.210321957%20207.164491%2C0.874294665%20C200.674683%2C1.66789967%20194.515966%2C2.91909047%20188.688341%2C4.62786707%20C174.665545%2C7.64336851%20152.219591%2C13.1712489%20136.587671%2C16.3604504%20C84.5440868%2C26.9783065%2048.130023%2C-1.03136545%204.4408921e-16%2C0.0294581108%20L0%2C317.841091%20C101.81663%2C330.589083%20161.14996%2C332.308719%20178%2C323%20C180.867706%2C321.41575%20183.704939%2C318.14587%20186.5117%2C313.19036%20C199.166751%2C313.42569%20211.329517%2C313.620189%20223%2C313.773856%20L223%2C0.00779280808%20Z%22%20opacity%3D%22.299%22/%3E%0A%3C/svg%3E%0A') center top repeat-x;*/
/* background-size: auto 100% !important;*/
/* position: absolute;*/
/* z-index: 9;*/
/* top: 5%;*/
/* left: -137%;*/
/* animation: firstWave 3s linear infinite;*/
/*}*/
/*.ui-graph-circle-waves:after {*/
/* content: '';*/
/* width: 229%;*/
/* height: 194%;*/
/* background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22186%22%20height%3D%22315%22%20viewBox%3D%220%200%20186%20315%22%3E%0A%20%20%3Cpath%20fill%3D%22%23B7EB81%22%20fill-rule%3D%22evenodd%22%20d%3D%22M3.06421555e-14%2C0.0400838041%20C4.39622143%2C-0.0997638145%208.95398057%2C0.120334563%2013.7151065%2C0.794768157%20C25.6799746%2C2.48964224%2036.3820041%2C6.20627783%2045.8211951%2C11.9446749%20C46.0186702%2C12.0502981%2046.2119193%2C12.1658503%2046.4008296%2C12.2917905%20C46.472636%2C12.3396614%2046.5444652%2C12.3872984%2046.6163155%2C12.4347028%20C47.063043%2C12.7137817%2047.5068989%2C12.9974581%2047.9478831%2C13.2857319%20C56.4601671%2C18.5547207%2065.0976862%2C20.6966357%2070.6445543%2C22.0075504%20C117.025591%2C32.9689761%20143.926178%2C-0.431333679%20186%2C0.00422621917%20L186%2C315%20L0%2C315%20L0%2C0.0400838041%20Z%22%20opacity%3D%22.455%22/%3E%0A%3C/svg%3E%0A') center top repeat-x;*/
/* background-size: auto 100% !important;*/
/* position: absolute;*/
/* top: 5%;*/
/* left: -114%;*/
/* animation: firstWave 3.5s linear infinite;*/
/* animation-direction: reverse*/
/*}*/
.ui-graph-circle-waves-left {
display: block;
width: 275%;
height: 203%;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22223%22%20height%3D%22329%22%20viewBox%3D%220%200%20223%20329%22%3E%0A%20%20%3Cdefs%3E%0A%20%20%20%20%3ClinearGradient%20id%3D%22a%22%20x1%3D%2250%25%22%20x2%3D%2262.226%25%22%20y1%3D%220%25%22%20y2%3D%2281.169%25%22%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23B2E800%22/%3E%0A%20%20%20%20%20%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%239CD100%22/%3E%0A%20%20%20%20%3C/linearGradient%3E%0A%20%20%3C/defs%3E%0A%20%20%3Cpath%20fill%3D%22url%28%23a%29%22%20fill-rule%3D%22evenodd%22%20d%3D%22M223%2C0.00779280808%20C217.861166%2C-0.0499158555%20212.594214%2C0.210321957%20207.164491%2C0.874294665%20C200.674683%2C1.66789967%20194.515966%2C2.91909047%20188.688341%2C4.62786707%20C174.665545%2C7.64336851%20152.219591%2C13.1712489%20136.587671%2C16.3604504%20C84.5440868%2C26.9783065%2048.130023%2C-1.03136545%204.4408921e-16%2C0.0294581108%20L0%2C317.841091%20C101.81663%2C330.589083%20161.14996%2C332.308719%20178%2C323%20C180.867706%2C321.41575%20183.704939%2C318.14587%20186.5117%2C313.19036%20C199.166751%2C313.42569%20211.329517%2C313.620189%20223%2C313.773856%20L223%2C0.00779280808%20Z%22%20opacity%3D%22.299%22/%3E%0A%3C/svg%3E%0A') center top repeat-x;
background-size: auto 100% !important;
position: absolute;
z-index: 9;
top: 5%;
left: -137%;
}
.ui-graph-circle-waves-right {
display: block;
width: 229%;
height: 198%;
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22186%22%20height%3D%22315%22%20viewBox%3D%220%200%20186%20315%22%3E%0A%20%20%3Cpath%20fill%3D%22%23B7EB81%22%20fill-rule%3D%22evenodd%22%20d%3D%22M3.06421555e-14%2C0.0400838041%20C4.39622143%2C-0.0997638145%208.95398057%2C0.120334563%2013.7151065%2C0.794768157%20C25.6799746%2C2.48964224%2036.3820041%2C6.20627783%2045.8211951%2C11.9446749%20C46.0186702%2C12.0502981%2046.2119193%2C12.1658503%2046.4008296%2C12.2917905%20C46.472636%2C12.3396614%2046.5444652%2C12.3872984%2046.6163155%2C12.4347028%20C47.063043%2C12.7137817%2047.5068989%2C12.9974581%2047.9478831%2C13.2857319%20C56.4601671%2C18.5547207%2065.0976862%2C20.6966357%2070.6445543%2C22.0075504%20C117.025591%2C32.9689761%20143.926178%2C-0.431333679%20186%2C0.00422621917%20L186%2C315%20L0%2C315%20L0%2C0.0400838041%20Z%22%20opacity%3D%22.455%22/%3E%0A%3C/svg%3E%0A') center top repeat-x;
background-size: auto 100% !important;
position: absolute;
top: 5%;
left: -114%;
}
.ui-graph-circle-colorful-sm .ui-graph-circle-waves-wrapper {
top: 14px;
left: 14px;
right: 14px;
bottom: 14px;
}
.ui-graph-circle-colorful-sm .ui-graph-circle-bar-bg,
.ui-graph-circle-colorful-sm .ui-graph-circle-bar-progress {
stroke-width: 3px;
}
.ui-graph-circle-colorful-sm .ui-graph-circle-number {
margin: -1% 0 0 -2%;
font-size: 16px;
line-height: 16px;
}
.ui-graph-circle-colorful-sm .ui-graph-circle-number span {
display: none;
}
.ui-graph-circle-waves-blue .ui-graph-circle-waves-left {
background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22223%22%20height%3D%22329%22%3E%3Cpath%20fill%3D%22%2355D0E0%22%20fill-rule%3D%22evenodd%22%20d%3D%22M223%20.008a119.071%20119.071%200%2000-15.836.866c-6.49.794-12.648%202.045-18.476%203.754-14.022%203.015-36.468%208.543-52.1%2011.732C84.544%2026.978%2048.13-1.03%200%20.03V317.84C101.817%20330.59%20161.15%20332.31%20178%20323c2.868-1.584%205.705-4.854%208.512-9.81%2012.655.236%2024.818.43%2036.488.584V.008z%22%20opacity%3D%22.32%22/%3E%3C/svg%3E');
}
.ui-graph-circle-waves-blue .ui-graph-circle-waves-right {
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22186%22%20height%3D%22315%22%20viewBox%3D%220%200%20186%20315%22%3E%0A%20%20%3Cpath%20fill%3D%22%2331CDFF%22%20fill-rule%3D%22evenodd%22%20d%3D%22M3.06421555e-14%2C0.0400838041%20C4.39622143%2C-0.0997638145%208.95398057%2C0.120334563%2013.7151065%2C0.794768157%20C25.6799746%2C2.48964224%2036.3820041%2C6.20627783%2045.8211951%2C11.9446749%20C46.0186702%2C12.0502981%2046.2119193%2C12.1658503%2046.4008296%2C12.2917905%20C46.472636%2C12.3396614%2046.5444652%2C12.3872984%2046.6163155%2C12.4347028%20C47.063043%2C12.7137817%2047.5068989%2C12.9974581%2047.9478831%2C13.2857319%20C56.4601671%2C18.5547207%2065.0976862%2C20.6966357%2070.6441043%2C22.0075504%20C117.025591%2C32.9689761%20143.926178%2C-0.431333679%20186%2C0.00422621917%20L186%2C315%20L0%2C315%20L0%2C0.0400838041%20Z%22%20opacity%3D%22.410%22/%3E%0A%3C/svg%3E%0A') center top repeat-x;
}
.ui-graph-circle-waves-pale .ui-graph-circle-waves-wrapper {
background-color: transparent;
}
.ui-graph-circle-waves-pale .ui-graph-circle-number {
color: #fff;
}
.ui-graph-circle-waves-pale .ui-graph-circle-waves-left {
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22186%22%20height%3D%22315%22%20viewBox%3D%220%200%20186%20315%22%3E%0A%20%20%3Cpath%20fill%3D%22%23FFFFFF%22%20fill-rule%3D%22evenodd%22%20d%3D%22M3.06421555e-14%2C0.0400838041%20C4.39622143%2C-0.0997638145%208.95398057%2C0.120334563%2013.7151065%2C0.794768157%20C25.6799746%2C2.48964224%2036.3820041%2C6.20627783%2045.8211951%2C11.9446749%20C46.0186702%2C12.0502981%2046.2119193%2C12.1658503%2046.4008296%2C12.2917905%20C46.472636%2C12.3396614%2046.5444652%2C12.3872984%2046.6163155%2C12.4347028%20C47.063043%2C12.7137817%2047.5068989%2C12.9974581%2047.9478831%2C13.2857319%20C56.4601671%2C18.5547207%2065.0976862%2C20.6966357%2070.6432043%2C22.0075504%20C117.025591%2C32.9689761%20143.926178%2C-0.431333679%20186%2C0.00422621917%20L186%2C315%20L0%2C315%20L0%2C0.0400838041%20Z%22%20opacity%3D%22.160%22/%3E%0A%3C/svg%3E%0A') center top repeat-x;
}
.ui-graph-circle-waves-pale .ui-graph-circle-waves-right {
background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22186%22%20height%3D%22315%22%20viewBox%3D%220%200%20186%20315%22%3E%0A%20%20%3Cpath%20fill%3D%22%23FFFFFF%22%20fill-rule%3D%22evenodd%22%20d%3D%22M3.06421555e-14%2C0.0400838041%20C4.39622143%2C-0.0997638145%208.95398057%2C0.120334563%2013.7151065%2C0.794768157%20C25.6799746%2C2.48964224%2036.3820041%2C6.20627783%2045.8211951%2C11.9446749%20C46.0186702%2C12.0502981%2046.2119193%2C12.1658503%2046.4008296%2C12.2917905%20C46.472636%2C12.3396614%2046.5444652%2C12.3872984%2046.6163155%2C12.4347028%20C47.063043%2C12.7137817%2047.5068989%2C12.9974581%2047.9478831%2C13.2857319%20C56.4601671%2C18.5547207%2065.0976862%2C20.6966357%2070.6441043%2C22.0075504%20C117.025591%2C32.9689761%20143.926178%2C-0.431333679%20186%2C0.00422621917%20L186%2C315%20L0%2C315%20L0%2C0.0400838041%20Z%22%20opacity%3D%22.300%22/%3E%0A%3C/svg%3E%0A') center top repeat-x;
}
.ui-graph-circle-bar-stroke-width-10 .ui-graph-circle-bar-bg,
.ui-graph-circle-bar-stroke-width-10 .ui-graph-circle-bar-progress {
stroke-width: 10px;
}
@keyframes firstWave {
0% {
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
100% {
-webkit-transform: translate(50%, 0);
transform: translate(50%, 0);
}
}
@-webkit-keyframes firstWave {
0% {
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
100% {
-webkit-transform: translate(50%, 0);
transform: translate(50%, 0);
}
}
.ui-graph-circle-bar-animate .ui-graph-circle-bar-progress {
opacity: 1;
}