.card {
    height: 100vh;
}
.marquee {
    display: inline-block;
    padding-left: 100%;
    /* show the marquee just outside the paragraph */
    animation: marquee linear infinite;
}
.marquee:hover {
    animation-play-state: paused
}
.status-offline #audio-player {
    display: none;
}
@keyframes marquee {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(-100%, 0);
    }
}
.player-fading {
    opacity: 1;
    animation: player-fading 2s infinite;
}
@keyframes player-fading {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.3;
    }
    100% {
        opacity: 1;
    }
}
.blink {
    animation: blink 2s linear infinite;
}
@keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
    100% {
        opacity: 1;
    }
}