.ml-5{
    margin-left: 5px;
}

.confirm-anim-dots {
    position: absolute;
    display: none !important;
    margin-left: 1px;
    width: 5px;
    height: 5px;
    border-radius: 100px;
    background-color: var(--white-color);
    -webkit-animation-name: confirmAnim;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-name: confirmAnim;
    -moz-animation-duration: 1s;
    -moz-animation-iteration-count: infinite;
    -ms-animation-name: confirmAnim;
    -ms-animation-duration: 1s;
    -ms-animation-iteration-count: infinite;
    -o-animation-name: confirmAnim;
    -o-animation-duration: 1s;
    -o-animation-iteration-count: infinite;
    animation-name: confirmAnim;
    animation-duration: 1s;
    animation-iteration-count: infinite;
  }

  .active_confirm_anim .confirm-anim-dots {
    position: relative;
    display: block !important;
    opacity: 1;
  }

  .active_confirm_anim .anim-dots {
    margin-left: 5px;
  }

  .confirm-anim-dots:nth-child(1) {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
  }

  .confirm-anim-dots:nth-child(2) {
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
  }

  .confirm-anim-dots:nth-child(3) {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
  }

  .confirm-anim .confirm-anim-dots {
    opacity: 1;
  }

    
  @-webkit-keyframes confirmAnim {
    0% {
      opacity: 0;
    }

    50% {
      opacity: 0.5;
    }

    100% {
      opacity: 1;
    }
  }

  @keyframes confirmAnim {
    0% {
      opacity: 0;
    }

    50% {
      opacity: 0.5;
    }

    100% {
      opacity: 1;
    }
  }