/* Progressive Image Container - Custom Breakpoints */
.progressive-image-container {
	display: block;
	width: var(--img-width-full,
			var(--img-width-6xl,
			var(--img-width-5xl,
			var(--img-width-4xl,
			var(--img-width-3xl,
			var(--img-width-2xl,
			var(--img-width-xl,
			var(--img-width-lg,
			var(--img-width-md,
			var(--img-width-sm,
			var(--img-width-xs,
			var(--img-width))))))))))));
	aspect-ratio: var(--img-aspect-full,
			var(--img-aspect-6xl,
			var(--img-aspect-5xl,
			var(--img-aspect-4xl,
			var(--img-aspect-3xl,
			var(--img-aspect-2xl,
			var(--img-aspect-xl,
			var(--img-aspect-lg,
			var(--img-aspect-md,
			var(--img-aspect-sm,
			var(--img-aspect-xs,
			var(--img-aspect))))))))))));
	position: relative;
	overflow: hidden;
}

/* xs: 321px */
@media (min-width: 321px) {
	.progressive-image-container {
		width: var(--img-width-xs, var(--img-width));
		aspect-ratio: var(--img-aspect-xs, var(--img-aspect));
	}
}

/* sm: 361px */
@media (min-width: 361px) {
	.progressive-image-container {
		width: var(--img-width-sm, var(--img-width-xs, var(--img-width)));
		aspect-ratio: var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect)));
	}
}

/* md: 376px */
@media (min-width: 376px) {
	.progressive-image-container {
		width: var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width))));
		aspect-ratio: var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect))));
	}
}

/* lg: 421px */
@media (min-width: 421px) {
	.progressive-image-container {
		width: var(--img-width-lg, var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width)))));
		aspect-ratio: var(--img-aspect-lg, var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect)))));
	}
}

/* xl: 481px */
@media (min-width: 481px) {
	.progressive-image-container {
		width: var(--img-width-xl, var(--img-width-lg, var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width))))));
		aspect-ratio: var(--img-aspect-xl, var(--img-aspect-lg, var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect))))));
	}
}

/* 2xl: 641px */
@media (min-width: 641px) {
	.progressive-image-container {
		width: var(--img-width-2xl, var(--img-width-xl, var(--img-width-lg, var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width)))))));
		aspect-ratio: var(--img-aspect-2xl, var(--img-aspect-xl, var(--img-aspect-lg, var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect)))))));
	}
}

/* 3xl: 737px */
@media (min-width: 737px) {
	.progressive-image-container {
		width: var(--img-width-3xl, var(--img-width-2xl, var(--img-width-xl, var(--img-width-lg, var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width))))))));
		aspect-ratio: var(--img-aspect-3xl, var(--img-aspect-2xl, var(--img-aspect-xl, var(--img-aspect-lg, var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect))))))));
	}
}

/* 4xl: 769px */
@media (min-width: 769px) {
	.progressive-image-container {
		width: var(--img-width-4xl, var(--img-width-3xl, var(--img-width-2xl, var(--img-width-xl, var(--img-width-lg, var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width)))))))));
		aspect-ratio: var(--img-aspect-4xl, var(--img-aspect-3xl, var(--img-aspect-2xl, var(--img-aspect-xl, var(--img-aspect-lg, var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect)))))))));
	}
}

/* 5xl: 981px */
@media (min-width: 981px) {
	.progressive-image-container {
		width: var(--img-width-5xl, var(--img-width-4xl, var(--img-width-3xl, var(--img-width-2xl, var(--img-width-xl, var(--img-width-lg, var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width))))))))));
		aspect-ratio: var(--img-aspect-5xl, var(--img-aspect-4xl, var(--img-aspect-3xl, var(--img-aspect-2xl, var(--img-aspect-xl, var(--img-aspect-lg, var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect))))))))));
	}
}

/* 6xl: 1025px */
@media (min-width: 1025px) {
	.progressive-image-container {
		width: var(--img-width-6xl, var(--img-width-5xl, var(--img-width-4xl, var(--img-width-3xl, var(--img-width-2xl, var(--img-width-xl, var(--img-width-lg, var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width)))))))))));
		aspect-ratio: var(--img-aspect-6xl, var(--img-aspect-5xl, var(--img-aspect-4xl, var(--img-aspect-3xl, var(--img-aspect-2xl, var(--img-aspect-xl, var(--img-aspect-lg, var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect)))))))))));
	}
}

/* full: 1921px */
@media (min-width: 1921px) {
	.progressive-image-container {
		width: var(--img-width-full, var(--img-width-6xl, var(--img-width-5xl, var(--img-width-4xl, var(--img-width-3xl, var(--img-width-2xl, var(--img-width-xl, var(--img-width-lg, var(--img-width-md, var(--img-width-sm, var(--img-width-xs, var(--img-width))))))))))));
		aspect-ratio: var(--img-aspect-full, var(--img-aspect-6xl, var(--img-aspect-5xl, var(--img-aspect-4xl, var(--img-aspect-3xl, var(--img-aspect-2xl, var(--img-aspect-xl, var(--img-aspect-lg, var(--img-aspect-md, var(--img-aspect-sm, var(--img-aspect-xs, var(--img-aspect))))))))))));
	}
}

