#header {}
#header > .content-wrapper {}

/*----------------------------------------------------------------------*/

#header > .content-wrapper > .title {
	text-align: center;
	text-transform: uppercase;
    font-family: "Stretch Pro";
}
@media (min-width: 900px) {
	#header > .content-wrapper > .title { font-size: 50px; }
	#header > .content-wrapper > .title:not(:last-child) { margin-bottom: 50px; }
}
@media (max-width: 899.99px) {
	#header > .content-wrapper > .title { font-size: 24px; }
	#header > .content-wrapper > .title:not(:last-child) { margin-bottom: 30px; }
}

/*----------------------------------------------------------------------*/

#header > .content-wrapper > .slider-wrapper {}
#header > .content-wrapper > .slider-wrapper > .swiper {}

/*----------------------------------------------------------------------*/

#header > .content-wrapper > .slider-wrapper > .pagination {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	column-gap: 10px;
	margin-top: 25px;
}
#header > .content-wrapper > .slider-wrapper > .pagination:empty { display: none; }
#header > .content-wrapper > .slider-wrapper > .pagination > .swiper-pagination-bullet {
	position: relative;
	display: block; height: 12px; width: 30px;

	background-color: transparent;
	background-clip: content-box;
	border: solid 1px #000;
	border-radius: 6px;
	
	opacity: 1;
	
	transition:
		width			 1s ease-out,
		background-color 1s ease-out;
}
#header > .content-wrapper > .slider-wrapper > .pagination > .swiper-pagination-bullet-active {
	width: 12px;
	background-color: #000;
}
#header > .content-wrapper > .slider-wrapper > .pagination > .swiper-pagination-bullet-active + .swiper-pagination-bullet {
	width: 70px;
}