.owl-carousel-separate {
	padding: 0 15px;

	.owl-stage {
		margin-left: auto;
		margin-right: auto;
	}
}

.separate-owl-nav {
	.owl-prev,
	.owl-next {
		position: relative;
		z-index: 0;
		display: inline-flex;
		justify-content: center;
		align-items: center;
		width: px-to-rem( 80px );
		height: px-to-rem( 80px );
		font-size: px-to-rem( 24px );
		color: $dark;
		transition: $transition-base;

		&::after {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			z-index: -1;
			content: '';
			border-radius: 50%;
			background-color: $white;
			transition: inherit;
		}

		&:hover {
			color: $primary;

			&::after {
				box-shadow: $box-shadow;
				transform: scale( 1.1 );
			}
		}
	}

	> * + * {
		margin-left: px-to-rem( 20px );
	}
}

* + .owl-carousel-separate { margin-top: 30px }


// Media
@include media-breakpoint-up(md) {
	.owl-carousel-separate {
		margin-left: px-to-rem( -20px );
		margin-right: px-to-rem( -10px );
		padding: 0;
		width: auto;

		.owl-stage-outer {
			overflow: visible;
		}
	}
}

@include media-breakpoint-up(lg) {
	* + .owl-carousel-separate { margin-top: px-to-rem( 110px * $lg-multiplier ) }
}

@include media-breakpoint-up(xxl) {
	.owl-carousel-separate {
		width: auto;
		margin-left: px-to-rem( -80px );
		margin-right: px-to-rem( -40px );
	}

	* + .owl-carousel-separate { margin-top: px-to-rem( 110px ) }
}