.breakdance-swiper-wrapper {
	--swiper-navigation-size: 20px;
	--swiper-pagination-color: #2563eb;
	--swiper-theme-color: #2563eb;
	--swiper-padding-h: 42px;
	--swiper-pagination-progressbar-bg-color: rgba(0, 0, 0, .25);
	--swiper-navigation-sides-offset: 12px;
	position: relative;
	padding: 0 var(--swiper-padding-h);
	width: 100%;
}

.swiper {
	width: 100%;
}

.swiper-button-prev > svg, .swiper-button-next > svg {
	stroke-width: 0;
	stroke: currentColor;
}

.swiper-button-prev, .swiper-button-next {
	position: absolute;
	top: 50%;
	width: var(--swiper-navigation-size);
	height: var(--swiper-navigation-size);
	z-index: 10;
	cursor: pointer;
	align-items: center;
	justify-content: center;
}

.swiper-pagination {
	margin-top: 8px;
	position: initial;
}

.swiper-pagination-bullet {
	bottom: initial;
}

.swiper-pagination-bullet:not(.swiper-pagination-bullet-active):hover {
	opacity: .4;
	transition: opacity .2s ease-in;
}

.breakdance-swiper-wrapper .swiper-pagination-progressbar {
	/* Make sure to update the values in the preset CSS if these change*/
	
	/* make the progressbar match the slider's width when made smaller by the outside arrows */
	width: calc(100% - ( var(--swiper-padding-h) * 2 ));
	left: var(--swiper-padding-h);
}