/**
 * Layout Utilities
 * Display, overflow, and object-fit
 */

/* ===== Display ===== */
.flex {
	display: flex;
}

.hidden {
	display: none !important;
}

.block {
	display: block;
}

.inline {
	display: inline;
}

.inline-block {
	display: inline-block;
}

.grid {
	display: grid;
}

/* ===== Overflow ===== */
.overflow-visible {
	overflow: visible !important;
}

.overflow-hidden {
	overflow: hidden;
}

.overflow-clip {
	overflow: clip;
}

.overflow-auto {
	overflow: auto;
}

.overflow-x-auto {
	overflow-x: auto;
}

.overflow-y-auto {
	overflow-y: auto;
}

/* ===== Object Fit ===== */
.object-cover {
	object-fit: cover;
}

.object-contain {
	object-fit: contain;
}

.object-fill {
	object-fit: fill;
}

.object-scale-down {
	object-fit: scale-down;
}

figure.object-cover img {
	object-fit: cover;
}

/* ===== Container Max Width ===== */
.max-w-none {
	max-width: none;
}

.max-w-full {
	max-width: 100%;
}

.max-w-screen-sm {
	max-width: 640px;
}

.max-w-screen-md {
	max-width: 768px;
}

.max-w-screen-lg {
	max-width: 1024px;
}

.max-w-screen-xl {
	max-width: 1280px;
}

.max-w-screen-2xl {
	max-width: 1536px;
}

/* Astra container sizing */
.max-w-ast-container {
	max-width: 1240px !important;
	margin-left: auto;
	margin-right: auto;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* ===== Responsive Display ===== */
@media (max-width: 544px) {
	[class~="sm:hidden"] {
		display: none;
	}

	[class~="sm:block"] {
		display: block;
	}

	[class~="sm:inline"] {
		display: inline;
	}

	[class~="sm:inline-block"] {
		display: inline-block;
	}

	[class~="sm:max-w-full"] {
		max-width: 100%;
	}

	[class~="sm:max-w-ast-container"] {
		max-width: 544px;
	}
}

@media (max-width: 781px) {
	[class~="md:hidden"] {
		display: none;
	}

	[class~="md:block"] {
		display: block;
	}

	[class~="md:inline"] {
		display: inline;
	}

	[class~="md:inline-block"] {
		display: inline-block;
	}

	[class~="md:max-w-full"] {
		max-width: 100%;
	}

	[class~="md:max-w-ast-container"] {
		max-width: 768px;
	}
}

@media (min-width: 782px) {
	[class~="lg:hidden"] {
		display: none;
	}

	[class~="lg:block"] {
		display: block;
	}

	[class~="lg:inline"] {
		display: inline;
	}

	[class~="lg:inline-block"] {
		display: inline-block;
	}

	[class~="lg:max-w-full"] {
		max-width: 100%;
	}

	[class~="lg:max-w-ast-container"] {
		max-width: 1240px;
	}
}
