How come Spotify can do it and it works in my browser?
play-button::before {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
element {
}
.no-touch .container.tracklist-view .play-button:hover, .no-touch .play-button:hover {
border-color: #1ed760;
}
.play-button {
background-color: rgba(0,0,0,.7);
position: relative;
z-index: 10;
-webkit-transform: scale(.6);
transform: scale(.6);
border: 1px solid #a0a0a0;
border-top-color: rgb(160, 160, 160);
border-right-color: rgb(160, 160, 160);
border-bottom-color: rgb(160, 160, 160);
border-left-color: rgb(160, 160, 160);
}
.play-button {
position: absolute;
width: 64px;
height: 64px;
left: 7px;
top: 7px;
background-color: transparent;
background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTIyNiAxNDgxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0wIDEzOTRWODdDMCA0Ni4zIDEzLjMgMTkuOCA0MCA3LjUgNjYuNy00LjggOTguNy4zIDEzNiAyM2wxMDM0IDYzNGMzNy4zIDIyLjcgNTYgNTAuMyA1NiA4M3MtMTguNyA2MC4zLTU2IDgzTDEzNiAxNDU4Yy0zNy4zIDIyLjctNjkuMyAyNy44LTk2IDE1LjUtMjYuNy0xMi4zLTQwLTM4LjgtNDAtNzkuNXoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=");
background-repeat: no-repeat;
background-size: 24px;
background-position: 58% 50%;
border-radius: 500px;
border: 1px solid #a0a0a0;
cursor: pointer;
}
body, button {
font-family: Circular,Helvetica,Arial,sans-serif;
}
html * {
text-decoration: none;
box-sizing: border-box;
}
body, button, div, html, p, span {
margin: 0;
padding: 0;
line-height: 1em;
}
body {
font-weight: 300;
font-size: 14px;
color: #fff;
}
html {
color: #fff;
}