
 .progress-style{
    display: flex;
    align-items: center;
}
.progress-style .description{
    margin-left: 32px;
}

.progress_circle {
   width: 200px;
   min-width: 200px;
   height: 200px;
   background: none;
   position: relative;
 }
 
 .progress_circle::after {
   content: "";
   width: 94%;
   height: 94%;
   border-radius: 50%;
   border: 10px solid var(--color-decorative-text);
   position: absolute;
   top: 5px;
   left: 5px;
 }
 
 .progress_circle>span {
   width: 50%;
   height: 100%;
   position: absolute;
   top: 0;
   z-index: 1;
 }
 
 .progress_circle .progress-left {
   left: 0;

 }
 
 .progress_circle .progress-bar {
   width: 100%;
   height: 100%;
   background: none;
   border-width: 20px;
   border-style: solid;
   border-color:var(--color-theme-secondary);
   position: absolute;
   top: 0;
   transition: transform .7s ease-in-out;
 }
 
 .progress_circle .progress-left .progress-bar {
   left: 100%;
   border-top-right-radius: 100px;
   border-bottom-right-radius: 100px;
   border-left: 0;
   -webkit-transform-origin: center left;
   transform-origin: center left;
   transition-delay: .7s;
 }
 
 .progress_circle .progress-right {
   right: 0;
 }
 
 .progress_circle .progress-right .progress-bar {
   left: -100%;
   border-top-left-radius: 100px;
   border-bottom-left-radius: 100px;
   border-right: 0;
   -webkit-transform-origin: center right;
   transform-origin: center right;
 }
 
 .progress_circle .progress-value {
   position: absolute;
   top: 0;
   left: 0;
 }
 .progress-style .description p{margin:0;}

 .progress_circle .progress-value .qreate-progress-heading {color:var(--color-theme-primary);}
 .progress_circle .progress-value .qreate-progress-heading.percentage {color:var(--color-theme-secondary);}

 @media(max-width: 479px){
    .progress-style{
      flex-direction: column;
    }

    .progress-style .description {
      margin-left: 0;
      margin-top: 32px;
      text-align: center;
    }
}
