﻿div#header { background-color: #ff6900; }
div.fixed-bottom {
    background-color: #53565a;
    color:#ffffff;
}
.nw { white-space:nowrap }
.u { text-decoration:underline }
.i { font-style: italic }

div#blazor-error-ui {
    display: none;
}

.spinner {
    position: absolute;
    border: 16px solid silver;
    border-top: 16px solid #337AB7;
    animation: spinClockwise 700ms linear infinite;
    border-radius: 50%;
    height: 80px;
    width: 80px;
    top: 50%;
    left: 50%;
    margin: 400px 0px 0px -40px;
}

.spinnerSmall {
    animation: spinCounterClockwise 700ms linear infinite;
    border: 4px solid silver;
    border-top: 4px solid white;
    position: absolute;
    border-radius: 50%;
    height: 40px;
    width: 40px;
    top: 50%;
    left: 50%;
    margin: -20px 0px 0px -20px;
}

.spinnerFile {
    position: relative;
    border: 16px solid silver;
    border-top: 16px solid #337AB7;
    animation: spinClockwise 700ms linear infinite;
    border-radius: 50%;
    height: 80px;
    width: 80px;
    top: 10%;
    left: 50%;
    margin: 40px 0px 0px -40px;
}

.spinnerSmallFile {
    animation: spinCounterClockwise 700ms linear infinite;
    border: 4px solid silver;
    border-top: 4px solid white;
    position: absolute;
    border-radius: 50%;
    height: 40px;
    width: 40px;
    top: 50%;
    left: 50%;
    margin: -20px 0px 0px -20px;
}


@keyframes spinClockwise {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes spinCounterClockwise {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(-720deg)
    }
}