Yes, change the icon using CSS i.e removing the old icon and adding a new. This is my CSS, however I'm stuck in trying to remove the old one, which is icomon I belive i.e. content: "\e60b", and adding svg for the new one
/* clear out the font based icon */
.largePlayBtn.icon-play:before {
content: "";
}
/* replace play button with new: */
.mwPlayerContainer .largePlayBtn, .mwPlayerContainer .largePlayBtn:hover{
background-image: url('http://ressurs.img.no/IMG/mediaspace_dev/custom_skin/play-btn2.png');
background-size: 400px 400px;
background-repeat: no-repeat;
width: 400px;
height: 400px;
padding: 0px;
margin: -200px;
opacity: 0.6;
-moz-border-radius: 100%;
-webkit-border-radius: 100%;
border-radius: 100%;
}
/*black bar with controls*/
.controlsContainer {
height: 2.1em;
opacity: 0.6;
min-height: 100%;
}
.controlBarContainer {
height: 6.31em;
}
.controlBarContainer.open {
height: 6.31em;
}
.scrubber {
height: 0.6em;
}
.btn {
font-family: none !important;
font-size: 1.1em;
min-height: 100%;
}
.icon-play:before {
/* content: "\e60b"; */
background-image: url ('http://ressurs.img.no/IMG/mediaspace_dev/custom_skin/play-btn2.png');
}
button.btn.comp.fullScreenBtn.pull-right.display-high.icon-expand{
background-image: url ('http://ressurs.img.no/IMG/mediaspace_dev/custom_skin/play-btn2.png');
}