The 2nd flexslider image changes position with some screen resolutions

Hi, Firstly we would like to say we are very happy with canvas. It's an awesome template and very exciting to work with.

We have noticed a small issue with the flexslider image positioning with some screen resolutions. Just for background information, if you look at our site on a desktop https://inguinalhernia.net/ you see the 2 superimposed images in the flexslider at the top, the 1st image with the pad and the 2nd image without the pad.

Everything looks fine until we view the website with some mobile phone screen resolutions:

iPhone 4 (320x480) = WORKS FINE
iPhone 5 (320x568) = WORKS FINE
iPhone 6 (375x667) = The 2nd flexslider image appears approx. 20 pixels further down than the 1st flexslider image.
iPhone 6 Plus (414x736) = Same issue. The 2nd flexslider image appears approx. 20 pixels further down than the 1st flexslider image.
Nexus 5x (412x684) = Same issue. The 2nd flexslider image appears approx. 20 pixels further down than the 1st flexslider image.
Nexus 5 (360x598) = Same issue. The 2nd flexslider image appears approx. 20 pixels further down than the 1st flexslider image.
Nexus 7 (600x960) = WORKS FINE
Nexus 10 (800x1280) = WORKS FINE
iPad Pro (1024x1366) = WORKS FINE
iPad (768x1024) = WORKS FINE

We checked the screen resolutions on our own mobile devices and used this website: http://www.infobyip.com/testwebsiteresolution.php?url=&width=2560&height=1440&in_browser=true

We've added 3 images to show the 2nd flexslider image appearing approx. 20 pixels further down than the 1st flexslider image.

We would be very grateful if you could look at this for us.

Thank you.
Jeremy

Hi, We have spotted the issue. It's with the different number of rows for the heading <h2 class="mb-4">Scientifically Designed Hernia Truss</h2>
We can make both headings with a more similar number of charachters so they BOTH use the same number of rows.

PROBLEM FIXED & NO NEED TO REPLY