.foxy.foxy-vertical-slide
{
	overflow: hidden;
}

.foxy.foxy-vertical-slide .foxy-departed,
.foxy.foxy-vertical-slide .foxy-current
{
	visibility: visible;
}

@keyframes foxy-vertical-slide-departed-forward
{
	0%
	{
		transform: none;
	}
	
	100%
	{
		transform: translateY(calc(var(--full-height) * -1 - var(--slide-gap)));
	}
}

.foxy.foxy-vertical-slide.foxy-direction-forward .foxy-departed
{
	animation-name: foxy-vertical-slide-departed-forward;
	transform: translateY(calc(var(--full-height) * -1 - var(--slide-gap)));
}

@keyframes foxy-vertical-slide-departed-backward
{
	0%
	{
		transform: none;
	}
	
	100%
	{
		transform: translateY(calc(var(--full-height) + var(--slide-gap)));
	}
}

.foxy.foxy-vertical-slide.foxy-direction-backward .foxy-departed
{
	animation-name: foxy-vertical-slide-departed-backward;
	transform: translateY(calc(var(--full-height) + var(--slide-gap)));
}

@keyframes foxy-vertical-slide-current-forward
{
	0%
	{
		transform: translateY(calc(var(--full-height) + var(--slide-gap)));
	}
	
	100%
	{
		transform: none;
	}
}

.foxy.foxy-vertical-slide.foxy-direction-forward .foxy-current
{
	animation-name: foxy-vertical-slide-current-forward;
}

@keyframes foxy-vertical-slide-current-backward
{
	0%
	{
		transform: translateY(calc(var(--full-height) * -1 - var(--slide-gap)));
	}
	
	100%
	{
		transform: none;
	}
}

.foxy.foxy-vertical-slide.foxy-direction-backward .foxy-current
{
	animation-name: foxy-vertical-slide-current-backward;
}

.foxy.foxy-vertical-slide .foxy-arrows
{
	position: static;
}

.foxy.foxy-vertical-slide:where(:not(.foxy-vertical)) .foxy-bullets
{
	bottom: 0;
	position: absolute;
	top: auto;
}