Im trying to create a gallery slider using slick slider js library. Everything is running however I’m having trouble with some styling. I want the effect of the gallery center image to be a little popped up- with the other 2 images in the background. A regular gallery carousel and mobile responsive. For some reason- I can’t achieve the affect and any styles I add is making the slides jump up- getting a strange effect. And the widths are messed up totally responsively. Im not sure why none of my styles are working correctly.
I attached my html code(without the actual image links) and how I initial it in my js. I also attached some css that I had implemented (I had originally fully styled it- but I took out the styles because it really got messy).

Any advice how to proceed will be greatly appreciated

<div class="slider">
<section class="coverflow">
     <div class="slide-container">
<span class="slide-number">01</span>
      <img src="/">
    </div>
<div class="slide-container">
<span class="slide-number">02</span>
      <img src="">
    </div>
<div class="slide-container">
<span class="slide-number">03</span>
      <img src="">
    </div>
<div class="slide-container">
<span class="slide-number">04</span>
      <img src="">
</div>
<div class="slide-container">
<span class="slide-number">05</span>
      <img src="">
    </div>
<div class="slide-container">
<span class="slide-number">06</span>
      <img src="">
</div>
  </section>

<div class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100">
    <span class="slider__label sr-only">
  </div>
  </span>
</div> <!-- end content -->
</div>

 $(".coverflow").slick({
    dots: false,
    arrows:true,
    infinite: true,
    centerMode: true,
    centerPadding: '150px',
    variableWidth: true,
    focusOnSelect: true,
    speed: 1000,
    autoplay:true,
    autoplaySpeed: 3000,
    slidesToShow: 3,
    slidesToScroll: 1,
      responsive: [
{
  breakpoint: 1024,
  settings: {
    slidesToShow: 1,
    slidesToScroll: 1,
  },
},

],
});
});

.slide-container{
margin-right:50px;
margin-left:50px;

}