CSS to change play-button/icon

Hi,

we tried to change the play-button with the code from the docs (below), put in additional CSS.
But without effect on the page. Just when the lightbox opens up, the new icon is vissible for very short time. So it′s present “somwhere” but is not shown…
How to solve that the new icon appears already on the pages?

.is-splash.flowplayer .fp-player .fp-ui,
.is-paused.flowplayer .fp-player .fp-ui {
background: url (https://alinaolson.com/wp-content/uploads/2021/02/video-play-button.png) center no-repeat;
background-size: 50%;
}
.is-seeking.flowplayer .fp-ui { background: none; }
.flowplayer .fp-ui > .fp-play { display: none }