#progressBar{aspect-ratio:1/1;background-color:var(--color-background-one);border-radius:50%;bottom:50%;display:-webkit-box;display:-ms-flexbox;display:flex;position:fixed;right:.5rem;width:3rem;z-index:99999;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-shadow:5px 5px 10px -5px rgba(0,0,0,.5),-5px -5px 10px -5px hsla(0,0%,100%,.5);box-shadow:5px 5px 10px -5px #00000080,-5px -5px 10px -5px #ffffff80;justify-content:center}#progressBar .block{-webkit-box-shadow:inset 0 0 10px rgba(0,0,0,.5);box-shadow:inset 0 0 10px #00000080;height:2.5rem;width:2.5rem}#progressBar .block,#progressBar .box{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;border-radius:50%;justify-content:center}#progressBar .box{height:calc(100% - .5rem);width:calc(100% - .5rem);-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-box-shadow:0 0 10px rgba(0,0,0,.5);box-shadow:0 0 10px #00000080;color:var(--color-text);-ms-flex-direction:column;flex-direction:column}#progressBar .box:before{border-radius:50%;content:"";height:calc(100% + 28px);position:absolute;width:calc(100% + 28px)}#progressBar .box .number span{color:var(--color-text)}#progressBar .box .number .num{font-size:.5rem;font-weight:500}#progressBar .box .number .sub{font-size:.5rem}#progressBar .box .title{color:var(--color-text);font-size:.3rem;font-weight:500}#progressBar .dots{border-radius:50%;display:block;height:100%;position:absolute;-webkit-transition:opacity 1s ease,-webkit-transform 1s;transition:opacity 1s ease,-webkit-transform 1s;transition:transform 1s,opacity 1s ease;transition:transform 1s,opacity 1s ease,-webkit-transform 1s;width:100%;z-index:2}#progressBar .dots:after{background-color:var(--fc-background-webkit);border-radius:50%;-webkit-box-shadow:0 0 5px 2px #585858;box-shadow:0 0 5px 2px #585858;content:"";height:.2rem;left:50%;position:absolute;top:.02rem;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translate(-50%);width:.2rem}#progressBar .svg{height:100%;position:absolute;width:100%;fill:none;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg)}#progressBar .circle{stroke:url(#gradientStyle);stroke-width:.2rem;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:linear;animation-timing-function:linear;color:#2e2e2e;color:#fff;-webkit-transition:stroke-dashoffset 1s;transition:stroke-dashoffset 1s}.element{opacity:0;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-transition:all .5s;transition:all .5s;visibility:hidden}.visible{opacity:1;-webkit-transform:translate3d(-1rem,0,0);transform:translate3d(-1rem,0,0);-webkit-transition:all 1s;transition:all 1s;visibility:visible}