.fade.show {
    opacity: 1;
}
.modal-backdrop.in {
    opacity: 0.9;
}
.success-qa.modal {
    background-color: #0000004d !important;
}
.loading-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 350px;
    height: 350px;
    border: 8px solid #434343;
    border-radius: 50%;
    background: #2b2b2b;
}

    .loading-container::before {
        content: '';
        position: absolute;
        top: -8px;
        left: -8px;
        width: 100%;
        height: 100%;
        border-radius: 50%;
        border: 8px solid #2E7D32;
        border-color: #2E7D32 #2E7D32 transparent transparent;
        transform: rotate(-45deg);
        animation: animateContainerBefore 2s infinite linear;
    }

    .loading-container .center {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(0,-50%);
        width: 50%;
        height: 5px;
        background: transparent;
        animation: animateCenter 2s infinite linear;
    }

        .loading-container .center::before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            transform: translate(54%,-50%);
            width: 50px;
            height: 50px;
            background: #2E7D32;
            box-shadow: 0 0 10px #2E7D32;
            border-radius: 50%;
        }

@keyframes animateCenter {
    0% {
        transform-origin: left;
        transform: translate(0,-50%) rotate(0);
    }

    100% {
        transform-origin: left;
        transform: translate(0,-50%) rotate(360deg);
    }
}

@keyframes animateContainerBefore {
    0% {
        transform: rotate(-45deg);
    }

    100% {
        transform: rotate(315deg);
    }
}


.loading-container h1 {
    position: relative;
    text-align: center;
    line-height: 350px;
    color: #2E7D32;
    font-size: 50px;
    letter-spacing: 5px;
    text-shadow: 0 0 10px #2E7D32;
}