Option to add a css-class to each instance of a H5P-content

I would love to be able to add a css-class to each instance of any H5P-content.
In Course Presentation it would also be very useful to be able to add a css-class to each slide and in fact even to each piece of added content on the slides. 

I’m using H5P on a wordpress-site, and I am using CSS overrides (https://h5p.org/documentation/for-developers/visual-changes) to change the looks of my h5p-content.

However the css then changes all (the targeted) H5P on my entire site, but in some places I may want to design a different look to a content-type than in other places.

I can target specific H5P-content by using the data-content-id that is created for each instance of h5p-content and in Course Presentation I can target each slide individually since the slides get specific ID’s.

But then I have to add in new selectors in my css every time I make a new h5p-instance that I want to have that specific look.

I end up with a lot of css, and the risk of errors is quite big.

Example:

[data-content-id=“55”] .h5p-mark-the-words .h5p-word-inner p,
[data-content-id=“78] .h5p-mark-the-words .h5p-word-inner p,

[data-content-id=“79”] .h5p-mark-the-words .h5p-word-inner p,

[data-content-id=“80”] .h5p-mark-the-words .h5p-word-inner p,

[data-content-id=“104”] .h5p-mark-the-words .h5p-word-inner p

{text-align: center;}

If I could add a css-class to each H5P-instance, I would only have to make one css-selector, and then just add the class to the H5P-content.

I think this would be a very valuable feature.

Regards, Kasper