/* *************************** Ladewartezeit ******************************** */

@keyframes BREATHE {
    90% {
        color: rgba(0, 0, 0, 0.3);
    }
}

div#loading {
    position: absolute;
    left: 50px;
    top: 50px;
    font: 2em "Calibri";
    text-transform: uppercase;
}

.letter {
    animation: BREATHE linear infinite 1s;
    display: inline-block;
}




@keyframes FLOW {
    90% {
        color: rgba(255, 255, 240, 0.95);
    }
}

.point {
    animation: FLOW linear infinite 1s;
    display: inline-block;
}

.point:nth-of-type(8) {
    animation-delay: 0.1s;
}
.point:nth-of-type(9) {
    animation-delay: 0.2s;
}
.point:nth-of-type(10) {
    animation-delay: 0.3s;
}
.point:nth-of-type(11) {
    animation-delay: 0.4s;
}
.point:nth-of-type(12) {
    animation-delay: 0.5s;
}
.point:nth-of-type(13) {
    animation-delay: 0.6s;
}
.point:nth-of-type(14) {
    animation-delay: 0.7s;
}