Issue with images inside Sliders not being center justified

Design help General
1

I am having an issue creating images for a slider block on this site. You’ll see the “Data Copy Test” page specifically. After the first block of 2 photos, I have a slider block and 18 slides with 18 images. The first few seem fine, but then they are justified left. I don’t know what would be causing the majority of these pictures to not be center justified.

Here is my site Read-Only: [LINK]
(how to share your site Read-Only link)

2

here is how to fix it:

here is more info on classes:

3

@PixelGeek Thank you for the Loom! It was very helpful and fixed the issue I was having for all of the slides not being center justified.

I now find that I’d like to have the slides move if I use cursors on my keyboard’ currently they only work if I click the arrows. I found this thread

So I grabbed the code in the thread, made the ID for slider 3 “slider-3”, did a code embed above this element

  	$(document).on('keyup', function(event) {
	if (event.which === 37) { 
      	$('slider-3 .w-slider-arrow-left').trigger('tap');
    	} 
  	else if (event.which === 39) { 
      	$('slider-3.w-slider-arrow-right').trigger('tap');
    	} 
    });

But the slides don’t work if I use my arrows. Do you know how I would go about doing this?