.modal-backdrop{
    z-index: 5;
}
/* PRELODER */
/* Loader Styles start here */
.loader-wrapper {
    --line-width: 5px;
    --curtain-color: #f1faee;
    --outer-line-color: #a8dadc;
    --middle-line-color: #457b9d;
    --inner-line-color: #1d3557;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
  }
  
  .loader {
    display: block;
    position: relative;
    top: 50%;
    left: 50%;
    /*   transform: translate(-50%, -50%); */
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border: var(--line-width) solid transparent;
    border-top-color: var(--outer-line-color);
    border-radius: 100%;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    z-index: 1101;
  }
  
  .loader:before {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    right: 4px;
    bottom: 4px;
    border: var(--line-width) solid transparent;
    border-top-color: var(--inner-line-color);
    border-radius: 100%;
    -webkit-animation: spin 3s linear infinite;
    animation: spin 3s linear infinite;
  }
  
  .loader:after {
    content: "";
    position: absolute;
    top: 14px;
    left: 14px;
    right: 14px;
    bottom: 14px;
    border: var(--line-width) solid transparent;
    border-top-color: var(--middle-line-color);
    border-radius: 100%;
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
  }
  
  @-webkit-keyframes spin {
    0% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
    }
  
    100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  
  @keyframes spin {
    0% {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
    }
  
    100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  
  .loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    background: var(--curtain-color);
    width: 51%;
    height: 100%;
    z-index: 1100;
  }
  
  .loader-wrapper .loader-section.section-left {
    left: 0
  }
  
  .loader-wrapper .loader-section.section-right {
    right: 0;
  }
  
  /* Loaded Styles */
  .loaded .loader-wrapper .loader-section.section-left {
    transform: translateX(-100%);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
  }
  
  .loaded .loader-wrapper .loader-section.section-right {
    transform: translateX(100%);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
  }
  
  .loaded .loader {
    opacity: 0;
    transition: all 0.3s ease-out;
  }
  
  .loaded .loader-wrapper {
    visibility: hidden;
    transform: translateY(-100%);
    transition: all .3s 1s ease-out;
  }
  
  /* PRELODER END*/
  
  /* Alert message style */
  .alert-modal .check-img {
    margin-top: -40px;
  }
  body.modal-open{
    padding:0 !important;
  }
  .modal-open .alert-modal.modal{
    overflow: hidden;
  }
  .header-text {
    font-size: 28px;
    margin-top: 8px;
  }
  
  .alert-modal .border-none {
    border-width: 0;
  }
  
  .alert-modal .modal-header {
    justify-content: center;
    align-content: center;
    padding-bottom: 0;
  }
  
  .alert-modal .btn {
    display: block;
    width: 100%;
  }
  
  @media (min-width: 576px) {
    .alert-modal .modal-dialog {
        max-width: 380px;
        margin: 1.75rem auto;
    }
  }
  
  /* alert message style end */

  .btn.x-small{
      padding: 4px 4px;
  }
  .text-truncate{
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .bg-silver {
    background-color: #dbdad7 !important;
  }
  .bg-gold {
    background-color: #f4d781 !important;
  }