

/* 
# Stepping by one fourth steps ( with half steps too ) */

	:root {
		--sft-text-size-1: .5rem;
		--sft-text-size-2: .625rem;
		--sft-text-size-3: .75rem;
		--sft-text-size-4: .875rem;
		--sft-text-size-5: 1rem;
		--sft-text-size-6: 1.125rem;
		--sft-text-size-7: 1.25rem;
		--sft-text-size-8: 1.375rem;
		--sft-text-size-9: 1.5rem;
		--sft-text-size-10: 1.625rem;
		--sft-text-size-11: 1.75rem;
		--sft-text-size-12: 1.875rem;
	}

	/* 
	# Just the text "size," excluding any other properties which may affect perception of size. */

		/* 
			Notes: 
			These text sizings seem to be a good treatment for text that is layed on UI elements.
			I use the term "UI elements" here as a distinction between text that's used primarily for consumption of "content."
			ie. text labels, titles on panels, any supplemental text. 

		*/

		.sft-text-size-1, .sft-text-size-1 * {
			font-size: var(--sft-text-size-1);
		}

		.sft-text-size-2, .sft-text-size-2 * {
			font-size: var(--sft-text-size-2);
		}

		.sft-text-size-3, .sft-text-size-3 * {
			font-size: var(--sft-text-size-3);
		}

		.sft-text-size-4, .sft-text-size-4 * {
			font-size: var(--sft-text-size-4);
		}

		.sft-text-size-5, .sft-text-size-5 * {
			font-size: var(--sft-text-size-5);
		}

		.sft-text-size-6, .sft-text-size-6 * {
			font-size: var(--sft-text-size-6);
		}

		.sft-text-size-7, .sft-text-size-7 * {
			font-size: var(--sft-text-size-7);
		}

		.sft-text-size-8, .sft-text-size-8 * {
			font-size: var(--sft-text-size-8);
		}

		.sft-text-size-9, .sft-text-size-9 * {
			font-size: var(--sft-text-size-9);
		}

		.sft-text-size-10, .sft-text-size-10 * {
			font-size: var(--sft-text-size-10);
		}

		.sft-text-size-11, .sft-text-size-11 * {
			font-size: var(--sft-text-size-11);
		}

		.sft-text-size-12, .sft-text-size-12 * {
			font-size: var(--sft-text-size-12);
		}


/* 
# Pixel sizes for fonts */

.sft-size-13px {
	font-size: var(--sft-size-13px);
}
	.sft-size-13px--descend, .sft-size-13px--descend * {
		font-size: var(--sft-size-13px);
	}


.sft-size-14px {
	font-size: var(--sft-size-14px);
}
	.sft-size-14px--descend, .sft-size-14px--descend * {
		font-size: var(--sft-size-14px);
	}
