.gsc-circle-progress{
   &.text-left, &.text-right{
      display: flex;
      align-items: center;
   }
   &.text-left{
      .circle-progress{
         margin-right: 20px;
      }
   }
   &.text-right{
      .title{
         order: 1;
      }
      .circle-progress{
         order: 2;
         margin-left: 20px;
      }
   }
   &.text-center{
      text-align: center;
      .title{
         margin-bottom: 20px;
      }
   }
   position: relative;
   .circle-progress{ 
      position: relative;
      display: inline-block;
      text-align: center;
      height: 106px;
      strong{
         position: absolute;
         top: 50%;
         left: 50%;
         display: block;
         transform: translateY(-50%) translateX(-50%);
         font-size: 24px;
         line-height: 1;
         margin-top: 0;
         color: $black;
         font-weight: 400;
         i{
            font-style: normal;
         }
      }
   }
   .title{
      position: relative;
      font-size: 20px;
      font-weight: 500;
      line-height: 30px;
      color: $theme-color-2;
   }
}