
/* =========================
   PULS7 OnAir Player
========================= */

#player {

    width:min(700px,90%);

    display:flex;
    flex-direction:column;

    align-items:center;
    text-align:center;

    gap:12px;

    font-family:"Inter",sans-serif;

    margin:80px auto 0;
}


/* Live Überschrift */

#player h3 {

    display:flex;
    justify-content:center;
    align-items:center;

    gap:12px;

    font-size:15px;

    text-transform:uppercase;
    letter-spacing:2px;

    color:#ff3b30;

    font-weight:800;

    margin-bottom:10px;
}


/* Live Punkt */

#player h3::before {

    content:"";

    width:10px;
    height:10px;

    background:#ff3b30;

    border-radius:50%;

    animation:pulse 1.5s infinite;
}


/* Zeit */

#player span:nth-child(2) {

    font-size:16px;

    color:#6b7280;

    font-weight:500;
}


/* Sendung */

#player span:nth-child(3) {

    font-size:42px;

    line-height:1.1;

    font-weight:800;

    letter-spacing:-1px;

    color:#111827;
}


/* Moderator */

#player span:nth-child(4) {

    font-size:18px;

    color:#4b5563;

    font-weight:600;
}


/* Play Button */

.player-button {

    margin:35px auto 0;

    width:90px;
    height:90px;

    border:none;
    border-radius:50%;

    background:#ff3b30;

    color:white;

    font-size:36px;

    display:flex;

    align-items:center;
    justify-content:center;

    cursor:pointer;

    box-shadow:0 15px 35px rgba(255,59,48,.35);

    transition:.25s ease;
}


.player-button:hover {

    transform:scale(1.08);

    box-shadow:0 20px 45px rgba(255,59,48,.45);
}


.player-button:active {

    transform:scale(.95);
}


/* Live Animation */

@keyframes pulse {

    0% {
        box-shadow:0 0 0 0 rgba(255,59,48,.6);
    }

    70% {
        box-shadow:0 0 0 12px rgba(255,59,48,0);
    }

    100% {
        box-shadow:0 0 0 0 rgba(255,59,48,0);
    }

}


/* Mobile */

@media(max-width:700px){

    #player span:nth-child(3){

        font-size:30px;

    }


    #player span:nth-child(4){

        font-size:16px;

    }


    .player-button{

        width:75px;
        height:75px;

        font-size:30px;

    }

}