@use "@/src/assets/scss/variables" as *;
@use "@/src/assets/scss/partial" as *;

.TestimonialSliderWrapper {
  .SwiperSliderWrap {
    .SwiperSlideItem {
      .SwiperSlideImg {
        transition: 0.3s all;
      }
      .SwiperSlideContent {
        transition: 0.3s all;
        h4,
        p {
          transition: 0.3s all;
        }
      }
      &:hover {
        .SwiperSlideImg {
          @media (min-width: $sm) {
              transform: translate(5px ,-10px);
              rotate: -1.5deg;
            }
            @media (min-width: $md) {
              transform: translate(5px, -15px);
            }
            @media (min-width: $xxl) {
              transform: translate(0px ,-15px);
            }
        }
        .SwiperSlideContent {
          background-color: $primaryColor;
          transform: translate(0px ,15px);
          @media (min-width: $sm) {
            rotate: 2deg;
            transform: translate(20px, 10px);
          }
          @media (min-width: $md) {
            transform: translate(18px ,50px);
          }
          @media (min-width: $xl) {
            transform: translate(25px ,70px);
          }
          @media (min-width: $xxl) {
            transform: translate(25px ,70px);
          }
          h4,
          p {
            color: $whiteColor;
          }
          .QuoteIcon{
            background-color: $whiteColor;
          }
        }
      }
    }
  }
}