/*.loader {
    position: fixed;
    z-index: 999999;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    display: flex !important;
    justify-content: center;
    align-items: center;
    background-color: black;
    opacity:0.7;
}

    .loader > img {
        height: 80px;
        width: 80px;
    }

    .loader.hidden {
        animation: fadeout-loader 1s;
        animation-fill-mode: forwards;
    }

@keyframes fadeout-loader {
    100% {
        opacity: 0;
        visibility: hidden;
    }
}*/

.progressbar {
    /* position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            width: 150px;
            height: 150px;
            z-index: 9999;*/
    position: fixed;
    z-index: 999999;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    display: flex !important;
    justify-content: center;
    align-items: center;
    background-color: black;
    opacity:0.9;
}

.progress-loader {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100px;
    height: 100px;
    z-index: 9999;
}

.loader {
    width: calc(100% - 0px);
    height: calc(100% - 0px);
    /*border: 8px solid #162534;*/
    border-top: 8px solid #A100FF;
    border-radius: 50%;
    animation: rotate 5s linear infinite;
}

.progressbar.hidden {
    animation: fadeout-loader 1s;
    animation-fill-mode: forwards;
}

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

@keyframes fadeout-loader {
    100% {
        opacity: 0;
        visibility: hidden;
    }
}