@charset "utf-8";

/* Desktop PC: keep 4-col image size; pagination centered under news */
@media (min-width: 1200px) {
	.bl_slider .block-list {
		position: relative !important;
		overflow: visible !important;
	}

	.bl_slider .swiper-container {
		overflow: hidden !important;
		width: 100% !important;
	}

	/* restore thumbnail size — do not let intrinsic image height blow up */
	.bl_slider .article-item__image-container {
		display: block !important;
		width: 100% !important;
		height: auto !important;
		max-height: none !important;
		overflow: hidden !important;
		margin-bottom: 12px !important;
	}

	.bl_slider .article-item__image-container .aspect-ratio {
		display: block !important;
		width: 100% !important;
		height: 0 !important;
		padding-bottom: 100% !important;
		position: relative !important;
		overflow: hidden !important;
	}

	.bl_slider .article-item__image-container .aspect-ratio img,
	.bl_slider .article-item__image-container .aspect-ratio .article-item__image,
	.bl_slider .article-item__image {
		position: absolute !important;
		inset: 0 !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100% !important;
		height: 100% !important;
		max-width: none !important;
		max-height: none !important;
		object-fit: cover !important;
		object-position: center center !important;
		display: block !important;
		transform: none !important;
	}

	.bl_slider .swiper-pagination,
	.bl_slider .block-list > .swiper-pagination,
	.bl_slider .news-swiper-pagination {
		position: static !important;
		transform: none !important;
		-webkit-transform: none !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		bottom: auto !important;
		width: 100% !important;
		height: auto !important;
		min-height: 140px !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: visible !important;
		text-align: center !important;
		display: -webkit-box !important;
		display: -ms-flexbox !important;
		display: flex !important;
		-webkit-box-pack: center !important;
		-ms-flex-pack: center !important;
		justify-content: center !important;
		-webkit-box-align: center !important;
		-ms-flex-align: center !important;
		align-items: center !important;
		-ms-flex-wrap: wrap !important;
		flex-wrap: wrap !important;
		z-index: 5 !important;
		pointer-events: auto !important;
		box-sizing: border-box !important;
	}

	.bl_slider .swiper-pagination-bullet {
		width: 28px !important;
		height: 3px !important;
		border-radius: 2px !important;
		margin: 0 6px !important;
		display: inline-block !important;
		vertical-align: middle !important;
		background: #c8c8c8 !important;
		opacity: 1 !important;
		-webkit-box-flex: 0 !important;
		-ms-flex: 0 0 auto !important;
		flex: 0 0 auto !important;
	}

	.bl_slider .swiper-pagination-bullet-active {
		background: #1e252c !important;
	}

	.bl_slider {
		padding-bottom: 0 !important;
		margin-bottom: 0 !important;
		position: relative !important;
		z-index: 3 !important;
	}

	.bl_slider .section {
		margin-bottom: 0 !important;
	}

	/* default-critical uses margin-top:-90px which pulls footer over news bars */
	.footer {
		margin-top: 0 !important;
	}
}

/* News block mobile (<1200): taller image + pagination under text */
@media (max-width: 1199px) {
	/* theme.css sets height:50% which clips the image short 閳?unlock it */
	.bl_slider .article-item__image-container {
		display: block !important;
		width: 100% !important;
		height: auto !important;
		max-height: none !important;
		overflow: hidden !important;
		margin-bottom: 12px !important;
	}

	.bl_slider .article-item__image-container .aspect-ratio {
		display: block !important;
		width: 100% !important;
		height: 0 !important;
		/* taller than 4:3 閳?closer to square so image fills the red-box area */
		padding-bottom: 100% !important;
		position: relative !important;
		overflow: hidden !important;
		background: #eee;
	}

	.bl_slider .article-item__image-container .aspect-ratio img,
	.bl_slider .article-item__image-container .aspect-ratio .article-item__image,
	.bl_slider .article-item__image {
		position: absolute !important;
		inset: 0 !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 100% !important;
		height: 100% !important;
		max-width: none !important;
		max-height: none !important;
		object-fit: cover !important;
		object-position: center center !important;
		display: block !important;
		/* custom-styles forces position:relative + height:auto 閳?kill that */
		transform: none !important;
	}

	.bl_slider .article-item {
		height: auto !important;
	}

	.bl_slider .block-list {
		position: relative !important;
		display: block !important;
		overflow: visible !important;
	}

	.bl_slider .swiper-container {
		overflow: hidden !important;
		height: auto !important;
	}

	.bl_slider .art_info {
		padding: 4px 16px 8px !important;
	}

	.bl_slider .art_info h3,
	.bl_slider .art_info h3 a {
		font-size: 15px !important;
		line-height: 1.4 !important;
	}

	/* Pagination stays in normal flow, directly under news text 閳?not over footer */
	.bl_slider .swiper-pagination,
	.bl_slider .block-list > .swiper-pagination,
	.bl_slider .news-swiper-pagination {
		position: static !important;
		transform: none !important;
		-webkit-transform: none !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		bottom: auto !important;
		width: 100% !important;
		height: auto !important;
		margin: 8px 0 16px !important;
		padding: 0 16px !important;
		overflow: visible !important;
		text-align: left !important;
		z-index: 5 !important;
		pointer-events: auto !important;
	}

	.bl_slider .swiper-pagination-bullet {
		width: 28px !important;
		height: 3px !important;
		border-radius: 2px !important;
		margin: 0 4px 0 0 !important;
		display: inline-block !important;
		vertical-align: middle !important;
		background: #c8c8c8 !important;
		opacity: 1 !important;
	}

	.bl_slider .swiper-pagination-bullet-active {
		background: #1e252c !important;
	}

	/* Keep news clear of footer pull-up; spacing owned by footer itself */
	.bl_slider {
		padding-bottom: 60px !important;
		margin-bottom: 0 !important;
		position: relative !important;
		z-index: 2 !important;
	}
}