/**
 * Box Layout Classes
 * @description can be used for either flex or grid classes
 */
@mixin box-layout-classes() {
	.align-items {
		&-start {
			align-items: flex-start;
		}

		&-center {
			align-items: center;
		}

		&-end {
			align-items: flex-end;
		}

		&-stretch {
			align-items: stretch;
		}
	}

	.justify {
		&-start {
			justify-content: flex-start;
		}

		&-end {
			justify-content: flex-end;
		}

		&-left {
			justify-content: left;
		}

		&-right {
			justify-content: right;
		}

		&-center {
			justify-content: center;
		}

		&-space-between {
			justify-content: space-between;
		}

		&-space-evenly {
			justify-content: space-evenly;
		}

		&-space-around {
			justify-content: space-around;
		}
	}
}