body { 
    font-family: sans-serif; 
    display: flex; 
    align-items: center; 
} 

.audio-player { 
    position: relative; 
    width: 180px; 
    background: #222; 
    color: #fff; 
    padding: 5px; 
    border-radius: 15px; 
    text-align: center; 
    font-family: sans-serif; 
    margin: 0 auto; 
} 

.play-pause { 
    position: relative; 
    display: grid; 
    place-items: center; 
    background-size: cover; 
    background-position: center; 
    text-decoration: none; 
    align-items: center; 
} 

.play-pause img { 
    position: relative; 
    width: 180px; 
    height: 180px; 
    border-radius: 15px; 
    object-fit: cover; 
    box-shadow: 0 4px 10px rgba(0,0,0,0.3); 
    align-items: center; 
} 

#play-pause-icon { 
    position: absolute; 
    padding: 0; 
    width: 40px; 
    height: 40px; 
    line-height: 40px; 
    background-color: rgb(0 0 0 / 65%); 
    color: #ffffff; 
    border: none; 
    border-radius: 4px; 
    cursor: pointer; 
    font-weight: bold; 
    font-size: 1.2rem; 
    top: 130px; 
    left: 12px; 
} 

.play-pause:has(#play-pause-art:hover) #play-pause-icon { 
    background-color: rgb(0 0 0 / 80%); 
} 

#play-pause-art { 
    background: none; 
    border: none; 
    padding: 0; 
    margin: 0; 
    cursor: pointer; 
    outline: inherit; 
} 

.album-title { 
    text-transform: uppercase; 
    text-align: left; 
    font-size: .8rem; 
    margin: 10px; 
    color: #df50a1; 
    letter-spacing: 1px; 
} 

.artist { 
    text-align: left; 
    font-size: .7rem; 
    margin: 0 10px 0; 
    color: #aaa; 
    letter-spacing: 1px; 
} 

#track-title { 
    font-size: .7rem; 
    text-align: left; 
    margin: 10px; 
    color: #aaa; 
    letter-spacing: 1px; 
} 

.progress-container { 
    display: flex; 
    align-items: start; 
    margin: 0px 0; 
    padding: 0 5px; 
    cursor: pointer; 
    width: 100px; 
} 

#progress-bar { 
    display: flex; 
    align-items: start; 
    margin: 0; 
    padding: 0; 
    cursor: pointer; 
    width: 100px; 
} 

.controls { 
    display: flex; 
    align-items: start; 
    margin: 0; 
    padding: 0; 
} 

.controls button { 
    color: white; 
    background: none; 
    border: none; 
    padding: 0; 
    margin: 0; 
    cursor: pointer; 
    outline: inherit; 
    padding: 5px 5px; 
    font-size: 1.2rem; 
} 

.controls button:hover { 
    color: #007bff; 
}