How to change the transparency of the central element in a cyclic carousel?

Question

css

There is a looped carousel owl carousel 2 in which the elements are initially translucent, and on hover they become opaque. I want to make sure that regardless of the number of items in the carousel, the central block is always opaque. I tried to do it through :nth-child() , but the problem is that additional cloned blocks are created in the looped carousel and it is not possible to make the central element opaque - what can I do?
fiddle

Answer 1

nth-of-type - works with a bang
https://jsfiddle.net/1csmn6g6/
But since you have the number of blocks on the page, it depends on the viewport, it's better to calculate the number of .owl-item.active in js and set the middle class, recalculate when changing the frame