.containerforCategories{
    width: 100%;
    overflow: hidden;
    height: 550px;
}
.slider-container {
  display: flex;
  flex-wrap: nowrap;
  overflow: hidden;
  width: 100%;
  height: 500px;
  scroll-behavior: smooth;
  background-color: #000;
  margin-top: 25px;
}

.slider-item {
  flex: 0 0 25%;
  height: 100%;
  background-color: #ddd;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  /* border: 1px solid black; */
  margin-right: 10px; /* Add a gap of 10px between the items */
  position: relative;
  overflow: hidden;
}
.slider-item:hover {
  background-color: rgba(221, 221, 221, 0.9);
}

.slider-item:hover .slide-name {
  transform: translateY(0);
}

/* .slider-item {
    flex: 0 0 20%;
    height: 100%;
    background-color: #ddd;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    border: 1px solid black;
    margin-right: 10px;
    
  } */

.slider-item:last-child {
  margin-right: 0;
  /* Remove the margin from the last item to avoid extra gap */
}
.slide-name {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 10px;
  background-color: rgba(221, 221, 221, 0.9);

  /* background-color: #fff; */
  color: #000;
  transform: translateY(100%);
  transition: transform 0.3s ease;
  text-align: center;
}
.slider-controls {
  display: flex;
  justify-content: space-between; /* Adjusts spacing between the buttons */
  align-items: center; /* Centers vertically within the container */
  margin-top: -270px;
  /* position: absolute; */
}

.slider-controls button {
  padding: 5px 10px;
  background-color: #333;
  color: #fff;
  border: none;
  cursor: pointer;
}

#btn1,
#btn2 {
  background: transparent;
  z-index: 1;
}

#btn1 i,
#btn2 i {
  color: green;
  font-size: 34px;
}

/* .slider-controls {
    display: flex;
    justify-content: center;
    margin-top: 10px;
  }
  
  .slider-controls button {
    padding: 5px 10px;
    background-color: #333;
    color: #fff;
    border: none;
    cursor: pointer;
  }
  #btn1, #btn2{
      background: transparent;
      z-index: 1;
  }
  #btn1 i, #btn2 i{
      color: green;
      font-size: 34px;
  }
  #btn1{
      position: relative;
      transform: translate(-1080%, -470%);
  }
  #btn2{
      transform: translate(1080%, -470%);
  
  } */

#image1 {
  background-image: url(../images/Categories/WOMEN.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image2 {
  background-image: url(../images/Categories/MEN.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image3 {
  background-image: url(../images/Categories/KIDS.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image4 {
  background-image: url(../images/Categories/BEAUTY.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image5 {
  background-image: url(../images/Categories/WEDDING.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image6 {
  background-image: url(../images/Categories/Women-Shoes.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image7 {
  background-image: url(../images/Categories/KIDS-SHOES.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image8 {
  background-image: url(../images/Categories/image.png);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image9 {
  background-image: url(../images/Categories/JEWELLERY.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image10 {
  background-image: url(../images/Categories/WOMEN-JACKET.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image11 {
  background-image: url(../images/Categories/COAT-WOMEN.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image12 {
  background-image: url(../images/Categories/Kids-Jackets.png);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image13 {
  background-image: url(../images/Categories/KIDS-COAT.png);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image14 {
  background-image: url(../images/Categories/Perfumes.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image15 {
  background-image: url(../images/Categories/MEN-WATCH.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image16 {
  background-image: url(../images/Categories/WOMEN\ WATCH.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image17 {
  background-image: url(../images/Categories/LADIES-BAG.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
#image18 {
  background-image: url(../images/Categories/MEN-JACKET.jpg);
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
