.embla {
  /* position: relative; */
  overflow: hidden;
  --slide-size-lg: calc(100% / var(--slide-desk));
  --slide-size-sm: calc(100% / var(--slide-tab));
  --slide-size-s: calc(100% / var(--slide-mob));
}
  
.embla__viewport{
    overflow:hidden;
}

.embla__container{
	display:flex;
  touch-action: pan-y pinch-zoom;
  margin-left: calc(var(--slide-gap-lg) * -1);
}

.embla__slide{
  flex: 0 0 var(--slide-size-lg);
	display:flex;
    min-width:0;
    box-sizing: border-box;
    padding-left: var(--slide-gap-lg);
}

.embla__dots{
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
}

button.embla__dot {
    width: 8px;
    height: 8px;
    border-radius: 100% !important;
    padding: 0px;
    border: none;
    background: #525C61 !important;
    opacity: 0.5;
}

button.embla__dot.is-active {
    background: #525C61 !important;
    opacity: 1 !important;
}

button.embla__button:hover {
  background: #525C61 !important;
  opacity: 1 !important;
}

button.embla__button {
  border-radius: 50%;
  width: 55px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px !important;
}

.embla__button img {
  width: 17px;
}

.embla__button.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.embla__button:hover img {
  filter: brightness(0) invert(1);
}

.embla__button.is-disabled:hover {
  opacity: 0.5 !important;
}


/* For tablets */
@media (max-width: 1024px) {
  .embla__container {
    margin-left: calc(var(--slide-gap-sm) * -1);
  }
  .embla__slide {
    flex: 0 0 var(--slide-size-sm);
    padding-left: var(--slide-gap-sm);
  }
  button.embla__button {
    width: 40px;
    height: 40px;
  }
  .embla__button img {
    width: 13px;
  }
} 
  
  /* For mobile */
  @media (max-width: 768px) {
    .embla__container {
      margin-left: calc(var(--slide-gap-s) * -1);
    }
    .embla__slide {
      flex: 0 0 var(--slide-size-s);
      padding-left: var(--slide-gap-s);
    }

    button.embla__button {
      width: 35px;
      height: 35px;
    }
}