.semi-donut{
    --percentage: 0;
    --fill: #ff0;
    width: 200px;
    height: 100px;
    position: relative;
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    overflow: hidden;
    color: var(--contrast);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    box-sizing : border-box;
    &:after{
      content: '';
      width: 200px;
      height: 200px;
      border:50px solid;
      border-color : rgba(0,0,0,0.15) rgba(0,0,0,0.15) var(--fill) var(--fill);
      position: absolute;
      border-radius: 50%;
      left: 0;
      top: 0;
      box-sizing : border-box;
      transform: rotate( calc( 1deg * ( -45 + var(--percentage) * 1.8 ) ) );
      animation : fillAnimation 1s ease-in;
    }
  }
  
  
  @keyframes fillAnimation {
      0% { transform: rotate(-45deg); }
      100% { transform: rotate( calc( 1deg * ( -45 + var(--percentage) * 1.8 ) ) ); }
  }
  
  
  .jv-stats-group svg {
      max-height: 84px;
  }
  .jv-stats-group {
}

.jv-stats-group-container h2 {
    text-align: center;
}

  #jv-stats-total {
      font-size:28px;
      font-weight:600;
      
  }
  
  .jv-loads-group, .snoka-jv-donut-group {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100%;
      flex-direction: column;
  }
  
  .jv-loads-group > span {
      align-self: center;
  }
.jv-stats-group-container{
	background: #ffffff;
    margin: 20px 0;
    padding: 20px;
}