.loading-bar {
    display: flex;
    height: 8px;
    width: 100%;
    max-width: 350px;
    border-radius: 50px;
    box-shadow: 0px 0px 3px #343434;
  }
  
  @-webkit-keyframes progress-animation {
    0% {
      width: 0%;
    }
    20% {
      width: 10%;
    }
    40% {
      width: 30%;
    }
    50% {
      width: 60%;
    }
    85% {
      width: 90%;
    }
  }
  
  @keyframes progress-animation {
    0% {
      width: 0%;
    }
    20% {
      width: 10%;
    }
    40% {
      width: 30%;
    }
    50% {
      width: 60%;
    }
    85% {
      width: 90%;
    }
      100%{
      width: 100%;
    }
  }
  .loading-bar .loading-cont {
    /* overflow: hidden; */
    border-radius: 50px;
    width: 100%;
    /* box-shadow: -4px 0px 7px 2px #ffffff4f; */
  background: #343434;}
  
.loading-bar .loading-cont .progress-bar {
    display: flex;
    height: 100%;
    width: 86%;
    background: #409be9;
    background: #00e4d0;
    background: linear-gradient(90deg, #00e4d0 0%, #009eeb 100%, black 100%);
 
    box-shadow: -4px 0px 9px 2px #ffffff4f;
  border-radius: 50px 0 0 50px;}