/*
font-family: 'Noto Sans', sans-serif;
*/
@layer utilities {
  .content-auto {
    content-visibility: auto;
  }
  .scrollbar::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    transition:all 0.3s ease;
  }
  .scrollbar::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: transparent;
    transition:all 0.3s ease;
  }
  .scrollbar::-webkit-scrollbar-thumb {
    background: rgba(50, 179, 87, 0.8);
    border-radius: 100vh;
    transition:all 0.3s ease;
  }
  .scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(50, 179, 87, 1)
  }
}
/* Root */
:root{
  --primary-1:#dff08a;
  --primary-2:#c3e374;
  --primary-3:#92d23d;
  --primary-4:#33b457;
  --primary-5:#2b7e4a;
  --swiper-theme-color:#92d23d;
  --swiper-navigation-size: 24px;
  --swiper-navigation-sides-offset:10px;
}

/* Common */
*{ outline: none !important; }
html, body { position: relative; min-height: 100%; }
body { font-family: "Noto Sans", sans-serif; margin: 0; padding: 0; }
a{transition: all 0.3s ease;}

.dropdown{position: relative;}
.dropdown .dropdown-toggle{position: relative; padding-right: 16px;}
.dropdown .dropdown-toggle:after{position: absolute; content:'\f078'; font-family: "Font Awesome 6 Pro"; top:0; right: 0; font-size: 80%; transition: all 0.3s ease;}
.dropdown.show .dropdown-toggle:after{transform: rotate(-180deg);}



.section-banner .swiper {
  width: 100%;
  height: 100%;
}

.section-banner .swiper .swiper-wrapper{width: 100%;}

.section-banner .swiper-slide {text-align: center;font-size: 18px;background: #fff;display: flex;justify-content: center;align-items: center;width: 100% !important;
}

.section-banner .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-banner .swiper {
  margin-left: auto;
  margin-right: auto;
}

.product-details  ul {
  list-style: unset;
  margin: 0;
  padding-left: 20px;
}


.mySwiperProductsDetails .swiper-wrapper .swiper-slide {height: auto;}

@media screen and (max-width: 1024px) {
  .section-banner .swiper-slide img {
    object-position: -400px 0px;
  }
}


@media screen and (max-width: 768px) {
  .section-banner .swiper-slide img {
    object-position: -1050px 0px;
  }
}


@media screen and (max-width: 480px) {
  .section-banner .swiper-slide img {
    object-position: -940px 0px;
  }
}