/*-----------------------------------------------
|   Progress bar and circle
-----------------------------------------------*/
.progress-circle {
  height: 15.625rem;
  position: relative;
  font-family: $font-family-base;
  .progressbar-text{
    text-align: center;
    margin-bottom: 0;
    line-height: 1;
    span{
      font-size:  map_get($font-sizes, 0);
      display: block;
    }
    .value{
      font-weight: $font-weight-light;
      font-size: map_get($font-sizes, 5);
    }
    b{
      font-size:  map_get($font-sizes, 4);
      font-weight: $font-weight-light;
    }
  }
  svg {
    height: 100%;
    display: block;
  }
}

.progress-line{
  position: relative;
  font-family: $font-family-base;
  font-weight: $font-weight-normal;
  .progressbar-text{
    position: absolute;
    width: 100%;
    left: 0;
    top: - map_get($spacers, 3);
    padding: 0;
    margin: 0;
    .value{
      right: 0;
      position: absolute;
    }
  }
  &:not(:last-child){
    margin-bottom: 40px;
    @include media-breakpoint-up(md){
      margin-bottom: 46px;
    }
    @include media-breakpoint-up(xl){
      margin-bottom: 40px;
    }
  }
}