.f-button.is-arrow {
  --f-button-width: var(--f-arrow-width, 60px);
  --f-button-height: var(--f-arrow-height, 60px);
  --f-button-svg-width: var(--f-arrow-svg-width, 24px);
  --f-button-svg-height: var(--f-arrow-svg-height, 24px);
  --f-button-svg-stroke-width: var(--f-arrow-svg-stroke-width, 1.75);
  --f-button-border-radius: var(--f-arrow-border-radius, 8px);
  --f-button-bg: var(--f-arrow-bg, #F0500C);
  --f-button-hover-bg: var(--f-arrow-hover-bg, var(--f-arrow-bg));
  --f-button-active-bg: var(--f-arrow-active-bg, var(--f-arrow-hover-bg));
  --f-button-shadow: var(--f-arrow-shadow);
  --f-button-color: var(--f-arrow-color);
  --f-button-hover-color: var(--f-arrow-hover-color, var(--f-arrow-color));
  --f-button-active-color: var( --f-arrow-active-color, var(--f-arrow-hover-color));
  overflow: visible
}
.f-button svg{
	color: #fff;
}
.f-button.is-arrow.is-prev,
.f-button.is-arrow.is-next {
  position: absolute;
  transform: translate(0);
  z-index: 20
}

.is-horizontal .f-button.is-arrow.is-prev,
.is-horizontal .f-button.is-arrow.is-next {
  inset: 50% auto auto;
  transform: translateY(-50%)
}

.is-horizontal.is-ltr .f-button.is-arrow.is-prev {
  left: var(--f-arrow-pos, 5%)
}

.is-horizontal.is-ltr .f-button.is-arrow.is-next {
  right: var(--f-arrow-pos, 5%)
}

.is-horizontal.is-rtl .f-button.is-arrow.is-prev {
  right: var(--f-arrow-pos, 0);
  transform: translateY(-50%) rotateY(180deg)
}

.is-horizontal.is-rtl .f-button.is-arrow.is-next {
  left: var(--f-arrow-pos, 0);
  transform: translateY(-50%) rotateY(180deg)
}

.is-vertical.is-ltr .f-button.is-arrow.is-prev,
.is-vertical.is-rtl .f-button.is-arrow.is-prev {
  top: var(--f-arrow-pos, 0);
  right: auto;
  bottom: auto;
  left: 50%;
  transform: translate(-50%)
}

.is-vertical.is-ltr .f-button.is-arrow.is-next,
.is-vertical.is-rtl .f-button.is-arrow.is-next {
  top: auto;
  right: auto;
  bottom: var(--f-arrow-pos, 0);
  left: 50%;
  transform: translate(-50%)
}

.is-vertical .f-button.is-arrow.is-prev svg,
.is-vertical .f-button.is-arrow.is-next svg {
  transform: rotate(90deg)
}


@media (max-width: 1280px){
	.is-horizontal.is-ltr .f-button.is-arrow.is-prev {
	  left: var(--f-arrow-pos, 22px)
	}

	.is-horizontal.is-ltr .f-button.is-arrow.is-next {
	  right: var(--f-arrow-pos, 22px)
	}
}