#storeLoader{

    position: fixed;
    top: 0;
    left: 0;

    width: 100vw;
    height: 100vh;

    display: none;

    justify-content: center;
    align-items: center;

    z-index: 999999;

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

    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

/* Popup Box */
.storeLoaderBox{

    position: relative;

    width: 180px;
    height: 180px;

    display: flex;
    justify-content: center;
    align-items: center;

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

    border-radius: 24px;

    box-shadow:
    0 10px 35px rgba(0,0,0,.15);
}

/* Expand loader when retry appears */

.storeLoaderBox{

    transition:
    height .30s ease,
    width .30s ease;

}

.storeLoaderBox.retryMode{

    height:235px;

}
/* Rings */

.loaderRing{

    position: absolute;

    border-radius: 50%;

    border: 5px solid transparent;

    animation: spin 1.2s linear infinite;
}

/* Stop animation when retry mode */
.storeLoaderBox.retryMode .loaderRing{

    animation-play-state: paused;

    opacity:.45;

}

.loader1{

    width: 120px;
    height: 120px;

    border-top-color: #ff4d4d;
}

.loader2{

    width: 90px;
    height: 90px;

    border-top-color: #00c853;

    animation-duration: 1s;
}

.loader3{

    width: 60px;
    height: 60px;

    border-top-color: #2962ff;

    animation-duration: .8s;
}

/* Center Icon */

.loaderCenter{

    position: absolute;

    display: flex;
    justify-content: center;
    align-items: center;

    width: 54px;
    height: 54px;

    border-radius: 50%;

    background: #fff;

    box-shadow:
    0 3px 12px rgba(0,0,0,.10);

    font-size: 24px;

    color: #ff9800;
}

/* Text */

.loaderText{

    position:absolute;

    left:15px;
    right:15px;

    bottom:45px;

    text-align:center;

    font-size:13px;

    font-weight:700;

    color:#444;

    line-height:18px;

    transition:.25s;

}

@keyframes spin{

    from{
        transform: rotate(0deg);
    }

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


.loaderPlaceholder{

    position:absolute;

    top:12px;
    left:20px;
    right:20px;

    height:18px;

    border-radius:6px;

    background:
    linear-gradient(
        90deg,
        #f0f0f0 25%,
        #fafafa 50%,
        #f0f0f0 75%
    );

    background-size:200% 100%;

    animation:placeholderMove 1.5s infinite;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:10px;
    font-weight:700;

    color:#c4c4c4;

    letter-spacing:1px;
}


@keyframes placeholderMove{

    0%{
        background-position:200% 0;
    }

    100%{
        background-position:-200% 0;
    }
}


.loaderLogoBg{

    position:absolute;

    width:120px;
    height:120px;

    object-fit:contain;

    opacity:.06;

    pointer-events:none;

    user-select:none;
}

#loaderRetry{

    position:absolute;

    bottom:6px;

    left:50%;

    transform:translateX(-50%);

    display:none;

    padding:8px 18px;

    border-radius:30px;

    background:#006FFF;

    color:#fff;

    font-size:13px;

    font-weight:700;

    cursor:pointer;

    transition:.25s;

}

#loaderRetry:hover{

    transform:
    translateX(-50%)
    scale(1.05);

}



/*boytom loader */



#bottomLoader{

    position:fixed !important;

    left:50% !important;

    bottom:60px !important;

    transform:translateX(-50%) !important;

    display:none;

    justify-content:center;

    align-items:center;

    width:48px;

    height:48px;

    z-index:999999;

}

.bottomLoaderSpinner{

    position:absolute;

    inset:0;

    margin:auto;

    width:45px;

    height:45px;

    border:5px solid rgba(0,0,0,.15);

    border-top:9px solid #007bff;

    border-radius:50%;

    animation:bottomSpin .8s linear infinite;

}

.bottomLoaderLogo{

    position:absolute;

    left:50%;

    top:50%;

    transform:translate(-50%,-50%);

    width:40px;

    height:40px;

    object-fit:contain;

    border-radius:50%;

    z-index:5;

}

@keyframes bottomSpin{

    from{
        transform:rotate(0deg);
    }

    to{
        transform:rotate(360deg);
    }

}