/* =========================================
GLOBAL FONT
========================================= */

html,
body,
button,
input,
select,
textarea{
    font-family:'Montserrat',sans-serif;
}

/* =========================================
ACTION LOADING
========================================= */

#unlocked-action-loading{

    font-family:'Montserrat',sans-serif;

    position:fixed;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(15,15,15,.20);

    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);

    z-index:999999;

    opacity:0;

    visibility:hidden;

    pointer-events:none;

    transition:
        opacity .25s ease,
        visibility .25s ease;

}

/* =========================================
BOX
========================================= */

.unlocked-action-loading-box{

    text-align:center;

    max-width:500px;

    padding:40px;

}

/* =========================================
TITLE
========================================= */

.unlocked-action-loading-title{

    font-family:'Montserrat',sans-serif;

    margin:0;

    font-size:32px;

    font-weight:700;

    color:#FFFFFF;

}

/* =========================================
SUBTITLE
========================================= */

.unlocked-action-loading-subtitle{

    font-family:'Montserrat',sans-serif;

    margin-top:18px;

    color:rgba(255,255,255,.88);

    font-size:16px;

    font-weight:500;

}



/* =========================================
SHOW
========================================= */

#unlocked-action-loading.show{

    opacity:1;

    visibility:visible;

    pointer-events:auto;

}

#unlocked-action-loading.hide{

    opacity:0;

    visibility:hidden;

    pointer-events:none;

}

/* =========================================
LINEAR LOADER
========================================= */

.unlocked-loading-bar{

    width:220px;

    height:4px;

    margin:28px auto 0;

    overflow:hidden;

    border-radius:999px;

    background:rgba(255,255,255,.15);

}

.unlocked-loading-bar span{

    display:block;

    width:40%;

    height:100%;

    border-radius:999px;

    background:#FFFFFF;

    animation:unlockedLoadingBar 1s linear infinite;

}

@keyframes unlockedLoadingBar{

    0%{

        transform:translateX(-120%);

    }

    100%{

        transform:translateX(320%);

    }

}