/* All Screens */


.flex-row, .flex-row-reverse {
	display:flex;
	flex-direction:row;
	align-items:stretch;
	gap:var(--rhythm);
}

.flex-row-reverse {flex-direction:row-reverse;}
.flex-column {display:flex; flex-direction:column;}
.flex-column-reverse {display:flex; flex-direction:column-reverse;}
.flex-none {display:unset}
.flex-align-start {align-items:flex-start}
.flex-align-end {align-items:flex-end}
.flex-align-center {align-items:center}
.flex-align-stretch {align-items:stretch}
.flex-align-content-start {align-content:flex-start}
.flex-align-content-end {align-content:flex-end}
.flex-align-content-center {align-content:center}
.flex-align-content-stretch {align-content:stretch}
.flex-align-space-between {align-content:space-between}
.flex-align-space-around {align-content:space-around}
.flex-align-self-start {align-self:flex-start}
.flex-align-self-end {align-self:flex-end}
.flex-align-self-center {align-self:center}
.flex-align-self-stretch {align-self:stretch}
.flex-justify-start {justify-content: flex-start}
.flex-justify-end {justify-content: flex-end}
.flex-justify-center {justify-content: center}
.flex-justify-between {justify-content: space-between}
.flex-justify-around {justify-content: space-around}
.flex-justify-evenly {justify-content: space-evenly}
.flex-shrink-0 {flex-shrink: 0}
.flex-shrink, .flex-shrink-1 {flex-shrink: 1}
.flex-shrink-2 {flex-shrink: 2}
.flex-grow-0 {flex-grow:0}
.flex-grow, .flex-grow-1 {flex-grow: 1}
.flex-grow-2 {flex-grow:2}
.flex-grow-3 {flex-grow:3}
.flex-grow-4 {flex-grow:4}
.flex-wrap {flex-wrap:wrap}
.flex-wrap-reverse {flex-wrap:wrap-reverse}

.flex-center {
	display:flex;
	justify-content:center;
	align-items:center;
}

/* Small Screens */
@container (min-width: 640px) {

	.sm\:flex-row,
	.sm\:flex-row-reverse {
		display:flex; 
		flex-direction:row; 
		align-items:stretch; 
		gap:var(--rhythm);
	}

	.sm\:flex-row-reverse {flex-direction:row-reverse}
	.sm\:flex-column {display:flex; flex-direction:column}
	.sm\:flex-column-reverse {display:flex; flex-direction:column-reverse}
	.sm\:flex-none {display:unset}
	.sm\:flex-align-start {align-items:flex-start}
	.sm\:flex-align-end {align-items:flex-end}
	.sm\:flex-align-center {align-items:center}
	.sm\:flex-align-stretch {align-items:stretch}
	.sm\:flex-align-content-start {align-content:flex-start}
	.sm\:flex-align-content-end {align-content:flex-end}
	.sm\:flex-align-content-center {align-content:center}
	.sm\:flex-align-content-stretch {align-content:stretch}
	.sm\:flex-align-space-between {align-content:space-between}
	.sm\:flex-align-space-around {align-content:space-around}
	.sm\:flex-align-self-start {align-self:flex-start}
	.sm\:flex-align-self-end {align-self:flex-end}
	.sm\:flex-align-self-center {align-self:center}
	.sm\:flex-align-self-stretch {align-self:stretch}
	.sm\:flex-justify-start {justify-content: flex-start}
	.sm\:flex-justify-end {justify-content: flex-end}
	.sm\:flex-justify-center {justify-content: center}
	.sm\:flex-justify-between {justify-content: space-between}
	.sm\:flex-justify-around {justify-content: space-around}
	.sm\:flex-justify-evenly {justify-content: space-evenly}
	.sm\:flex-shrink-0 {flex-shrink: 0}
	.sm\:flex-shrink, .flex-shrink-1 {flex-shrink: 1}
	.sm\:flex-shrink-2 {flex-shrink: 2}
	.sm\:flex-grow-0 {flex-grow:0}
	.sm\:flex-grow, .flex-grow-1 {flex-grow: 1}
	.sm\:flex-grow-2 {flex-grow:2}
	.sm\:flex-grow-3 {flex-grow:3}
	.sm\:flex-grow-4 {flex-grow:4}
	.sm\:flex-wrap {flex-wrap:wrap}
	.sm\:flex-wrap-reverse {flex-wrap:wrap-reverse}
}

/* Medium Screens */
@container (min-width: 768px) {

	.md\:flex-row,
	.md\:flex-row-reverse {
		display:flex; 
		flex-direction:row; 
		align-items:stretch; 
		gap:var(--rhythm);
	}

	.md\:flex-row-reverse {flex-direction:row-reverse}
	.md\:flex-column {display:flex; flex-direction:column}
	.md\:flex-column-reverse {display:flex; flex-direction:column-reverse}
	.md\:flex-none {display:unset}
	.md\:flex-align-start {align-items:flex-start}
	.md\:flex-align-end {align-items:flex-end}
	.md\:flex-align-center {align-items:center}
	.md\:flex-align-stretch {align-items:stretch}
	.md\:flex-align-content-start {align-content:flex-start}
	.md\:flex-align-content-end {align-content:flex-end}
	.md\:flex-align-content-center {align-content:center}
	.md\:flex-align-content-stretch {align-content:stretch}
	.md\:flex-align-space-between {align-content:space-between}
	.md\:flex-align-space-around {align-content:space-around}
	.md\:flex-align-self-start {align-self:flex-start}
	.md\:flex-align-self-end {align-self:flex-end}
	.md\:flex-align-self-center {align-self:center}
	.md\:flex-align-self-stretch {align-self:stretch}
	.md\:flex-justify-start {justify-content: flex-start}
	.md\:flex-justify-end {justify-content: flex-end}
	.md\:flex-justify-center {justify-content: center}
	.md\:flex-justify-between {justify-content: space-between}
	.md\:flex-justify-around {justify-content: space-around}
	.md\:flex-justify-evenly {justify-content: space-evenly}
	.md\:flex-shrink-0 {flex-shrink: 0}
	.md\:flex-shrink, .flex-shrink-1 {flex-shrink: 1}
	.md\:flex-shrink-2 {flex-shrink: 2}
	.md\:flex-grow-0 {flex-grow:0}
	.md\:flex-grow, .flex-grow-1 {flex-grow: 1}
	.md\:flex-grow-2 {flex-grow:2}
	.md\:flex-grow-3 {flex-grow:3}
	.md\:flex-grow-4 {flex-grow:4}
	.md\:flex-wrap {flex-wrap:wrap}
	.md\:flex-wrap-reverse {flex-wrap:wrap-reverse}
}

/* Large Screens */
@container (min-width: 1024px) {

	.lg\:flex-row,
	.lg\:flex-row-reverse {
		display:flex; 
		flex-direction:row; 
		align-items:stretch; 
		gap:var(--rhythm);
	}

	.lg\:flex-row-reverse {flex-direction:row-reverse}
	.lg\:flex-column {display:flex; flex-direction:column}
	.lg\:flex-column-reverse {display:flex; flex-direction:column-reverse}
	.lg\:flex-none {display:unset}
	.lg\:flex-align-start {align-items:flex-start}
	.lg\:flex-align-end {align-items:flex-end}
	.lg\:flex-align-center {align-items:center}
	.lg\:flex-align-stretch {align-items:stretch}
	.lg\:flex-align-content-start {align-content:flex-start}
	.lg\:flex-align-content-end {align-content:flex-end}
	.lg\:flex-align-content-center {align-content:center}
	.lg\:flex-align-content-stretch {align-content:stretch}
	.lg\:flex-align-space-between {align-content:space-between}
	.lg\:flex-align-space-around {align-content:space-around}
	.lg\:flex-align-self-start {align-self:flex-start}
	.lg\:flex-align-self-end {align-self:flex-end}
	.lg\:flex-align-self-center {align-self:center}
	.lg\:flex-align-self-stretch {align-self:stretch}
	.lg\:flex-justify-start {justify-content: flex-start}
	.lg\:flex-justify-end {justify-content: flex-end}
	.lg\:flex-justify-center {justify-content: center}
	.lg\:flex-justify-between {justify-content: space-between}
	.lg\:flex-justify-around {justify-content: space-around}
	.lg\:flex-justify-evenly {justify-content: space-evenly}
	.lg\:flex-shrink-0 {flex-shrink: 0}
	.lg\:flex-shrink, .flex-shrink-1 {flex-shrink: 1}
	.lg\:flex-shrink-2 {flex-shrink: 2}
	.lg\:flex-grow-0 {flex-grow:0}
	.lg\:flex-grow, .flex-grow-1 {flex-grow: 1}
	.lg\:flex-grow-2 {flex-grow:2}
	.lg\:flex-grow-3 {flex-grow:3}
	.lg\:flex-grow-4 {flex-grow:4}
	.lg\:flex-wrap {flex-wrap:wrap}
	.lg\:flex-wrap-reverse {flex-wrap:wrap-reverse}
}