@charset "utf-8";
/* CSS Document */
/* Knight-Rider Horizontale Linie*/	  
	  
.knight-rider-hr {
    position: relative;
    width: 100%; /* Breite des Trennstrichs */
    height: 3px; /* Dicke des Trennstrichs */
    background-color: #ddd; /* Grundfarbe des Trennstrichs */
    overflow: hidden; /* Verhindert, dass die Animation über den Rand hinausgeht */
    border-radius: 3px; /* Abgerundete Ecken */
}

.knight-rider-bar {
    position: absolute;
    top: 0;
    left: -30%; /* Start außerhalb der Linie */
    width: 30%; /* Breite des animierten Balkens */
    height: 100%;
    background: linear-gradient(90deg, rgba(139, 29, 34, 0) 0%, #8b1d22 50%, rgba(139, 29, 34, 0) 100%);
    animation: knightRiderSlow 4s infinite; /* Langsamere Animation */
    border-radius: 3px; /* Abgerundete Ecken für einen weichen Look */
    box-shadow: 0 0 8px rgba(139, 29, 34, 0.8); /* Leichte Lichtanimation passend zur Farbe */
}

@keyframes knightRiderSlow {
    0% {
        left: -30%; /* Start außerhalb der Linie */
    }
    50% {
        left: 100%; /* Balken bewegt sich über die Linie */
    }
    100% {
        left: -30%; /* Zurück an den Start */
    }
}
