/* Global styles for the SushiTamDa application */

:root .lpx-brand-logo {
    --lpx-logo: url('/images/logo/leptonx/logo-light.png');
    --lpx-logo-icon: url('/images/logo/leptonx/logo-light-thumbnail.png');
}

/*.spinner {
    width: 40px;
    height: 40px;
    display: block;
    position: fixed;
    top: calc( 50% - ( 40px / 2) );
    right: calc( 50% - ( 40px / 2) );
}*/

.spinner {
    width: 200px;
    height: 200px;
    display: block;
    position: fixed;
    top: calc(50% - (200px / 2));
    right: calc(50% - (200px / 2));
    text-align: center;
}

.double-bounce1, .double-bounce2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #333;
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
    animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
    0%, 100% {
        -webkit-transform: scale(0.0)
    }

    50% {
        -webkit-transform: scale(1.0)
    }
}

@keyframes sk-bounce {
    0%, 100% {
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    }

    50% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
    }
}

#ApplicationContainer > div:first-child:not(:only-child) {
    display: none !important;
}

.mud-nav-item a {
    text-decoration: none !important;
}

#branding-sushitamda {
    font-family: 'Dancing Script', cursive;
    font-size: 1.75em;
    color: lightseagreen;
}

.mud-button {
    text-transform: none !important;
}

.cover {
    display: flex;
    height: calc(100vh - 48px);
    text-shadow: 0 0.05rem 0.1rem rgba(0, 0, 0, .5);
    box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
    background-position: center center !important;
}

.cover-bg {
    background: linear-gradient(to bottom, rgba(22, 22, 22, 0.3) 25%, rgba(22, 22, 22, 0.4) 75%, #161616 100%), url(./images/cover.jpg);
    background-size: cover;
}

.thumb-bg {
    background-image: linear-gradient(135deg, lightgreen, lightyellow);
}
