.load-animation {
    position: absolute;
    top: 50%;
    width: 100%;
    text-align: center;
    transform: translate(-50%, -50%);
    left: 50%;
}
.calculating-result-map {
    width: 200px;
    margin: auto;
    -webkit-animation-delay: 800ms;
    animation-delay: 800ms;
    transform:rotate(-28deg);
}

img.img-fluid.calculating-blue {
    width: 140px;
    top: -30px;
}


@-webkit-keyframes spinforward {
    0% {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg);
    }
    55%,
    75%,
    80%,
    100% {
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg);
    }
  }
  
  @keyframes spinforward {
    0% {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg);
    }
    55%,
    75%,
    80%,
    100% {
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg);
    }
  }
  
  @-webkit-keyframes spinbackward {
    0% {
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg);
    }
    55%,
    75%,
    80%,
    100% {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg);
    }
  }
  
  @keyframes spinbackward {
    0% {
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg);
    }
    55%,
    75%,
    80%,
    100% {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg);
    }
  }
  
  .calculating-result {
    position: relative;
    width: 300px;
    height: 300px;
    -webkit-animation-delay: 800ms;
            animation-delay: 800ms;
  }
  
  @media only screen and (max-width: 560px) {
    .calculating-result-map {
      width: 270px;
      height: 270px;
    }
  }
  
  .calculating-result-map .calculating-blue {
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: spinforward 1s infinite linear;
            animation: spinforward 1s infinite linear;
    -webkit-transform: rotate();
            transform: rotate();
  }
  
  @media only screen and (max-width: 560px) {
    .calculating-result-map .calculating-blue {
      width: 170px;
      height: 170px;
    }
  }
  
  .calculating-result-map .calculating-gold {
    position: absolute;
    right: 2.25rem;
    bottom: 1.5625rem;
    -webkit-animation: spinbackward 1s infinite linear;
            animation: spinbackward 1s infinite linear;
    -webkit-transform: rotate();
            transform: rotate();
  }
  
  @media only screen and (max-width: 560px) {
    .calculating-result-map .calculating-gold {
      width: 140px;
      height: 140px;
    }
  }
 /*-- ================================================
        disable button css starts from here
*/
.primary-btn:disabled, .primary-btn.disabled {
    pointer-events: none;
    background-color: #ccc;
    color: #a0a0a0;
}

.disble-btn {
    opacity: .5;
    pointer-events: none;
    cursor: not-allowed;
}
/*-- ================================================
        disable button css ends from here
*/