[Plugin: BxSlider WP] Target centered slide in carousel

I used some code from this question so my carousel has a centered image with the next and previous images to the left and right.

I’m now trying to add an opacity to the left and right images but keep the centered image at full opacity to keep focus on it.

My markup looks like this:

<ul class="bxslider">
<li><img src="image.jpg"></li>
<li><img src="image2.jpg"></li><!-- this slide is centered when you land on the page--!>
<li><img src="image3.jpg"></li>
<li><img src="image4.jpg"></li>
<li><img src="image5.jpg"></li>
</ul>

If i try and target it using css nth-child(2) then (obviously) only the second list item will hold full opacity and all the others are still at half opacity when the carousel gets moved along.

I need to find a way to target the second li to keep the opacity at 1, even when the carousel moves along.

E.g. When the user moves the carousel along image 3 will become the ‘active’ slide and then next image 4 – these current slides will be at full opacity whilst all the others will be at half.

Any ideas on how to achieve this?

(Another solution i’ve thought of is to make an overlay for the whole slider, but it’s not the most responsive friendly way to do it!)