Stack font awesome icons with openlayers

I'm using fontawesome 4.7 and openlayers 5.2 in my project and wanted to create the stacked icon effect.  Basically I want to have two font icons on top of each other.  My code example is using a red circle for the background and a black flag for the foreground.

My first codepen attempt worked out not so bad:
NOTE this is broken for openlayers versions 4.4.+ to 4.6.5:
OL BUG fix https://github.com/openlayers/openlayers/issues/7675

**CLICK RERUN**  bottom right inside codepen
if you cannot see a red circle with a flag

See the Pen stack font-awesome fonts openlayers by Michael Diener (@mdiener21) on CodePen.

If you just want to see the javascript part I also created a github gist
CODE