.sglisten-comprehend .audio-player {
    height: 50px;
    margin-top: 10px;
    display: flex;
    padding: 0px 10px;
    width: fit-content;
    align-items: center;
    border-radius: 200px;
    box-sizing: border-box;
    justify-content: center;
    background-color: #f8f8f8;
    border: 1px solid rgba(133, 133, 133, 1);
}

.sglisten-comprehend .button-transparent {
    border: none;
    padding: 4px;
    background: none;
}

.sglisten-comprehend .player-slider {
    width: 200px;
    margin: 5px;
    cursor: pointer;
    appearance: none;
    background: transparent;
}

.sglisten-comprehend .player-slider:focus {
    border-radius: 200px;
    outline: 2px solid #f8f8f8;
}

.sglisten-comprehend .player-slider::-webkit-slider-runnable-track {
    background: linear-gradient(to right,
            rgba(110, 90, 239, 1) 0%,
            rgba(110, 90, 239, 1) var(--progress),
            #d8d4f2 var(--progress),
            #d8d4f2 100%);
    border-radius: 20px;
}

.sglisten-comprehend .player-slider::-moz-range-track {
    background: linear-gradient(to right,
            rgba(110, 90, 239, 1) 0%,
            rgba(110, 90, 239, 1) var(--progress),
            #d8d4f2 var(--progress),
            #d8d4f2 100%);
    border-radius: 20px;
}

.sglisten-comprehend .player-time {
    width: 90px;
    text-align: center;
    color: rgba(133, 133, 133, 1);
}

.sglisten-comprehend .speed-control {
    color: rgba(117, 117, 117, 1);
    cursor: pointer;
}

.sglisten-comprehend textarea:focus {
    border-color: #a3a3a3;
    background-color: #F6F6F6;
}

.sglisten-comprehend .purple {
    accent-color: #6E5AEF;
}

.sglisten-comprehend .fa-clock, .sglisten-comprehend .react_time_text {
    font-size: 20px;
}

.listen-comprehend-start-instructions {
    text-align: justify;
}

.sglisten-comprehend .top-margin-60 {
    margin-top: 60px;
}
