home slider css

/* Increase the image size in the slider */

.container {

    width: 100%;

    max-width: 90%;

    /* margin: 0 auto; */

}

.custom-slider.slick-initialized.slick-slider  {

  position: absolute;

  width: 111.11%; /* Set width to 100% to make it stretch */

  top: -45px; /* Position at the top of container-a */

  left: -6%; /* Position at the left edge of container-a */

  background-color: #ffffff; /* Optional: Background color for visibility */

  /* Add other styles as needed */

}

/* Position the left arrow */

.custom-slider .slick-prev {

    left: 5%; /* Adjust the left position as needed */

    top: 50%; /* Align vertically to the center of the image */

    transform: translateY(-50%); /* Center vertically */

    z-index: 1; /* Ensure the arrow is on top of the image */

    position: absolute; /* Set position to absolute */

}

/* Position the right arrow */

.custom-slider .slick-next {

    right: 5%; /* Adjust the right position as needed */

    top: 50%; /* Align vertically to the center of the image */

    transform: translateY(-50%); /* Center vertically */

    z-index: 1; /* Ensure the arrow is on top of the image */

    position: absolute; /* Set position to absolute */

}