html, body {
    font-family: 'Poppins', Helvetica, sans-serif;
}

@keyframes slide {
    0% {
        transform: translateX(-25%);
    }

    100% {
        transform: translateX(25%);
    }
}

.mud-wasm {
    animation: slide 3s ease-in-out infinite alternate;
    background-image: linear-gradient(-60deg,#1b84ff 50%,#42A5F5 50%);
    bottom: 0;
    left: -50%;
    opacity: .5;
    position: fixed;
    right: -50%;
    top: 0;
    z-index: -1
}

/* Start index */
.mud-wasm-cont {
    font-family:'Roboto','Helvetica','Arial','sans-serif';
    left: 50%;
    padding: 10vmin;
    position: fixed;
    text-align: center;
    top: 50%;
    transform: translate(-50%,-50%)
}

.mud-wasm-cont h1 {
    color:#fff; 
    font-size:60pt
}
.mud-wasm-cont h3 {
    color:#fff; 
    font-size:20pt
}
.mud-wasm-cont h4 {
    color:#fff; 
    font-size:15pt
}

.linear-progress {
    background: silver;
    width: 50vw;
    margin-top: 40px;
    height: 1.5rem;
    border-radius: 15rem;
    overflow: hidden;
    position: relative;
    min-width: 350px;
}
.linear-progress:after {
    font-weight: bold;
    content: '';
    position: absolute;
    inset: 0;
    background: #fff;
    scale: var(--blazor-load-percentage, 0%) 100%;
    transform-origin: left top;
    transition: scale ease-out 0.5s;
    padding-top: 3px;
    color: #1b84ff;
}

.linear-progress-txt {
    position: relative;
    text-align: center;
    font-weight: bold;
    top: -21px;
    color: #1b84ff;
}
.linear-progress-txt:after {
    content: var(--blazor-load-percentage-text, "Loading");
}
/* End index */

.mud-button, .mud-icon-button {
    box-shadow: none !important;
}

code {
    color: #c02d76;
}

.mud-elevation-0,
.mud-elevation-1,
.mud-elevation-2,
.mud-elevation-3,
.mud-elevation-4,
.mud-elevation-6,
.mud-elevation-8,
.mud-elevation-12,
.mud-elevation-16,
.mud-elevation-24 {
    box-shadow: none !important;
}