svg {
    height: 400px;
    transform: rotate(-90deg);
    width: 400px;
  }
  
  .progressHold {
    position: absolute;
    left: 100px;
    display: block;
    width: 400px;
    height: 400px;
    top: 150px;
}

  .progress-bar__background {
    fill: none;
    stroke: #292b31;
    stroke-width: 1.8;
  }
  
  .progress-bar__progress {
    fill: none;
    stroke: #292b31;
    stroke: #0fecbf;
    stroke-dasharray: 100 100;
    stroke-dashoffset: 100;
    stroke-linecap: round;
    stroke-width: 1.8;
    transition: stroke-dashoffset 1s ease-in-out;
  }

  .zoomFadeOut {
    animation: zoomFadeOut 0.5s forwards;
  }

  @keyframes zoomFadeOut {
    0% {
      transform: scale(1);
      opacity: 1;
    }
    10% {
      transform: scale(1.1);
      opacity: 1;
    }
    100% {
      transform: scale(0);
      opacity: 0;
    }
  }

  @keyframes zomeFadeIn {
    0% {
      transform: scale(0);
      opacity: 0;
    }
    90% {
      transform: scale(1.1);
      opacity: 1;
    }
    100% {
      transform: scale(1);
      opacity: 1;
    }
  }  

  .okHold {
    position: absolute;
    left: 100px;
    display: block;
    width: 400px;
    height: 400px;
    top: 150px;
    opacity: 0;
    zoom: 0;
}
.zoomFadeIn {
    animation: zomeFadeIn 0.5s forwards;
  }
.okHold img {
    width: 404px;
    margin-top: 1px;
}