@import "./variables.less";
@import (once) "../less2/include/colortheme.less";

#loading {
    position: fixed;
    z-index: 9999999;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background: @bg-loading;
    color: @color-loading;
    text-align: center;
    font-size: 1.5em;
    .loadingContainer {
        margin-top: 50vh;
        transform: translateY(-50%);
    }
    .cryptofist {
        margin-left: auto;
        margin-right: auto;
        height: 300px;
        margin-bottom: 2em;
        @media screen and (max-height: @media-short-screen) {
            display: none;
        }
    }
    .spinnerContainer {
        position: relative;
        height: 100px;
        > div {
            height: 100px;
        }
    }
}
#loadingTip {
    position: fixed;
    z-index: 99999;
    top: 80%;
    left: 0;
    right: 0;
    text-align: center;

    transition: opacity 750ms;
    transition-delay: 3000ms;
    @media screen and (max-height: @media-medium-screen) {
        display: none;
    }
    span {
        background-color: @bg-loading;
        color: @color-loading;
        text-align: center;
        font-size: 1.5em;
        opacity: 0.7;
        font-family: @colortheme_font;
        padding: 15px;
        max-width: 60%;
        display: inline-block;
    }
}