.bg-mask {
    min-width: 100%;
    min-height: 100%;
    position: absolute;
    background: radial-gradient(rgba(0, 0, 0, .5) 20%, #000 85%);
    z-index: 1;
}
        .ob-radio-player {
            
            height: 380px;
            background-color: #000;
            color: #fff;
            font-family: Arial, sans-serif;
            position: relative;
            overflow: hidden;
            
            display: inline-block;
            cursor: pointer;
        }
        .ob-radio-player2 {
            
            height: 760px;
            background-color: #000;
            color: #fff;
            font-family: Arial, sans-serif;
            position: relative;
            overflow: hidden;
            
            display: inline-block;
            cursor: pointer;
        }
        @media (max-width: 480px) {
    .ob-radio-player2 {
      height: 520px;
    }
  }
        .ob-background {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-size: cover;
            background-position: center;
            transition: opacity 0.5s ease-in-out;
        }
        .ob-background.active {
            opacity: 1;
        }
        .ob-background.inactive {
            opacity: 0;
        }
        .ob-content {
            position: relative;
            z-index: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 140%;
            padding: 20px;
            box-sizing: border-box;
        }
        .ob-logo {
           width: 150px;
    height: 140px;
    margin-top: 30px;
    margin-bottom: -30px;
        }
        .ob-playing-now {
            font-size: 12px;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #858079;
        }
        .ob-track-title {
            font-size: 13px;
    color: #da4fff;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    font-weight: 700;
        }
        .ob-track-title2 {
            font-size: 13px;
    color: #da4fff;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    font-weight: 700;
        }
        .ob-track-titleb {
            font-size: 13px;
    color: #a83900;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    font-weight: 700;
        }
        .ob-track-artist {
            font-size: 12px;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #858079;
        }
        .ob-track-artist2 {
            font-size: 12px;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #858079;
        }
        .ob-listen-now-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgb(217 79 253 / 40%);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayb {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgb(168 57 0 / 41%);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayc {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgb(14 211 247 / 53%);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayd {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(255, 48, 108, 0.53);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlaye {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgb(203 23 23 / 56%);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayf {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(125, 125, 125, 0.28);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(128, 128, 128, 0.6);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayh {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgb(205 190 146 / 68%);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayi {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(255, 164, 48, 0.52);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayj {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgb(83 8 50 / 70%);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayk {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(255, 252, 255, 0.27);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-overlayl {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgb(124 208 82 / 58%);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
            pointer-events: none;
            z-index: 6;
        }
        .ob-listen-now-text {
            color: white;
            font-size: 1.5em;
            font-weight: bold;
            text-transform: uppercase;
            animation: pulse2 2s infinite;
        }
        @keyframes pulse2 {
            0% { transform: scale(1); }
            50% { transform: scale(1.1); }
            100% { transform: scale(1); }
        }