.supplier-loader {
    height: 100%;
    width:  100%;
    background-color: black;
    position: fixed !important;
    z-index: 10000;
    opacity: .4;
    display: flex;
    justify-content: center;
    align-items: center;
}

#loader {
    /* border: 2px solid white; */
    height: 50px;
    width: 50px;
    transform-origin: bottom center;
    animation: rotate 3s linear infinite;
    z-index: 10000;
}

.loader-hide {
    display: none;
}

.loader-form-load {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate (-5%, -50%);
}

 .circle {
    display: inline-block;
    background-color: rgb(197, 202, 207);
     height: 50px;
    width: 50px;
    border-radius: 50%;
    transform: scale(0);
    animation: grow 0.9s linear infinite;
    margin: -10px;
}

.circle:nth-child(2) {
    background-color: rgb(240, 231, 240);
    animation-delay: 0.74s;
}

@keyframes rotate {
    to {
        transform: rotate(360deg);
    }
}

@keyframes grow {
    50% {
        transform: scale(1);
    }
}