/********************
	Part - Style général des carousel
********************/

.carousel .direction {
  z-index: auto
}

.carousel .carousel-item {
  height: 100%
}

.carousel .carousel-item .caption {
  position: absolute;
  color: #fff;
  max-width: 340px
}

.carousel .carousel-item .caption .caption-description p {
  color: #fff
}

.carousel .carousel-control {
  opacity: 1
}

.carousel .carousel-control .icon-next:before,
.carousel .carousel-control .icon-prev:before {
  content: ""
}

.carousel .carousel-control .icon-next i,
.carousel .carousel-control .icon-prev i {
  font-size: 3.125rem;
  color: #fff
}

.carousel .carousel-control .icon-next:hover i,
.carousel .carousel-control .icon-prev:hover i {
  color: #2fb5d2
}

.carousel .carousel-control .icon-prev {
  left: 1rem
}

.carousel .carousel-control .icon-next {
  right: 2rem
}

.carousel .carousel-control.left,
.carousel .carousel-control.right {
  background: none
}

@media (max-width: 767px) {
  .carousel .carousel-item .caption {
    bottom: 5px;
    left: 40px
  }

  .carousel .carousel-item figure {
    margin: 0
  }
}

@media (min-width: 768px) {
  .carousel .carousel-item .caption {
    bottom: 28px;
    left: 90px
  }

  .carousel .carousel-item img {
    width: 100%;
  }
}

/********************
	Part - Style général des items swiper
********************/

.container-primary .swiper-container {
  position: relative;
  width: 94%;
  margin: 0 auto;
}

.swiper-slide {
  height: auto;
}

.swiper-slide > .product-miniature {
  height: 100%;
}

/********************************
	Part - Featured products
********************************/

.featured-products {
  position: relative;
  max-width: var(--container-secondary-max-width);
  padding-bottom: 4em;
  margin: auto;
}

.featured-products h2 {
  text-align: center;
}
