:root {
	--textMaxWidth: 70ch;
	--bigTextSpacing: -0.02em;
	--smallTextSpacing: 0em;
}

@media only screen and (min-width:992px) {
	:root {
		/* Text XXL */
		--textXXLsize: 38px;
		--textXXLheightS: 48px;
		--textXXLtopS: -12px;
		--textXXLbottomS: -12px;
		--textXXLheightT: 40px;
		--textXXLtopT: -8px;
		--textXXLbottomT: -8px;

		/* Text XL */
		--textXLsize: 30px;
		--textXLheightS: 36px;
		--textXLtopS: -8px;
		--textXLbottomS: -8px;
		--textXLheightT: 32px;
		--textXLtopT: -6px;
		--textXLbottomT: -6px;

		/* Text L */
		--textLsize: 24px;
		--textLheightS: 32px;
		--textLtopS: -8px;
		--textLbottomS: -8px;
		--textLheightT: 28px;
		--textLtopT: -3px;
		--textLbottomT: -5px;

		/* Text M */
		--textMsize: 19px;
		--textMheightS: 28px;
		--textMtopS: -8px;
		--textMbottomS: -8px;
		--textMheightT: 24px;
		--textMtopT: -3px;
		--textMbottomT: -5px;

		/* Text S */
		--textSsize: 16px;
		--textSheightS: 24px;
		--textStopS: -5px;
		--textSbottomS: -7px;
		--textSheightT: 20px;
		--textStopT: -3px;
		--textSbottomT: -5px;

		/* Text XS */
		--textXSsize: 14px;
		--textXSheightS: 20px;
		--textXStopS: -7px;
		--textXSbottomS: -5px;
		--textXSheightT: 16px;
		--textXStopT: -5px;
		--textXSbottomT: -3px;

		/* Text XXS */
		--textXXSsize: 12px;
		--textXXSheightS: 16px;
		--textXXStopS: -4px;
		--textXXSbottomS: -4px;
		--textXXSheightT: 16px;
		--textXXStopT: -4px;
		--textXXSbottomT: -4px;
	}
}
	
@media only screen and (max-width:991px) {
	:root {
		/* Text XXL */
		--textXXLsize: 25px;

		--textXXLheightS: 36px;
		--textXXLtopS: -12px;
		--textXXLbottomS: -10px;

		--textXXLheightT: 30px;
		--textXXLtopT: -9px;
		--textXXLbottomT: -7px;

		/* Text XL */		
		--textXLsize: 21px;

		--textXLheightS: 30px;
		--textXLtopS: -10px;
		--textXLbottomS: -8px;

		--textXLheightT: 24px;
		--textXLtopT: -7px;
		--textXLbottomT: -5px;

		/* Text L */		
		--textLsize: 18px;

		--textLheightS: 26px;
		--textLtopS: -9px;
		--textLbottomS: -7px;

		--textLheightT: 22px;
		--textLtopT: -7px;
		--textLbottomT: -5px;

		/* Text M */
		--textMsize: 16px;

		--textMheightS: 22px;
		--textMtopS: -6px;
		--textMbottomS: -6px;

		--textMheightT: 20px;
		--textMtopT: -5px;
		--textMbottomT: -5px;

		/* Text S */
		--textSsize: 14px;

		--textSheightS: 20px;
		--textStopS: -7px;
		--textSbottomS: -5px;

		--textSheightT: 16px;
		--textStopT: -4px;
		--textSbottomT: -2px;

		/* Text XS */
		--textXSsize: 12px;

		--textXSheightS: 16px;
		--textXStopS: -4px;
		--textXSbottomS: -4px;

		--textXSheightT: 14px;
		--textXStopT: -3px;
		--textXSbottomT: -3px;

		/* Text XXS */
		--textXXSsize: 10px;
		
		--textXXSheightS: 14px;
		--textXXStopS: -4px;
		--textXXSbottomS: -4px;

		--textXXSheightT: 12px;
		--textXXStopT: -3px;
		--textXXSbottomT: -3px;
	}
}

/* Sizes */

/* Text XXL */
.textXXL :is(p, li) {
	font-size: var(--textXXLsize);
	letter-spacing: var(--bigTextSpacing);
	max-width: unset;
}

.textXXL:not(.tight) > :is(p, li) {
	line-height: var(--textXXLheightS);
	margin-top: var(--textXXLtopS);
	margin-bottom: var(--textXXLbottomS);
}

.textXXL.tight > :is(p, li) {
	line-height: var(--textXXLheightT);
	margin-top: var(--textXXLtopT);
	margin-bottom: var(--textXXLbottomT);
}

/* Text XL */
.textXL :is(p, li) {
	font-size: var(--textXLsize);
	letter-spacing: var(--bigTextSpacing);
	max-width: unset;
}

.textXL:not(.tight) > :is(p, li) {
	line-height: var(--textXLheightS);
	margin-top: var(--textXLtopS);
	margin-bottom: var(--textXLbottomS);
}

.textXL.tight > :is(p, li) {
	line-height: var(--textXLheightT);
	margin-top: var(--textXLtopT);
	margin-bottom: var(--textXLbottomT);
}

/* Text L */
.textL > :is(p, li, a) {
	font-size: var(--textLsize);
	letter-spacing: var(--bigTextSpacing);
}

.textL:not(.tight) > :is(p, li, a) {
	line-height: var(--textLheightS);
	margin-top: var(--textLtopS);
	margin-bottom: var(--textLbottomS);
}

.textL.tight > :is(p, li, a) {
	line-height: var(--textLheightT);
	margin-top: var(--textLtopT);
	margin-bottom: var(--textLbottomT);
}

/* Text M */
.textM > :is(p, li, a) {
	font-size: var(--textMsize);
	letter-spacing: var(--bigTextSpacing);
}

.textM:not(.tight) > :is(p, li, a),
div:not(.titleXXL, .titleXL, .titleL, .titleM, .titleS, .titleXS, .titleXXS, .titleXXXS, .textXXL, .textXL, .textL, .textM, .textS, .textXS) > p {
	line-height: var(--textMheightS);
	margin-top: var(--textMtopS);
	margin-bottom: var(--textMbottomS);
}

.textM.tight > :is(p, li, a) {
	line-height: var(--textMheightT);
	margin-top: var(--textMtopT);
	margin-bottom: var(--textMbottomT);
}

/* Text S */
.textS > :is(p, li, a) {
	font-size: var(--textSsize);
	letter-spacing: var(--smallTextSpacing);
}

.textS:not(.tight) > :is(p, li, a) {
	line-height: var(--textSheightS);
	margin-top: var(--textStopS);
	margin-bottom: var(--textSbottomS);
}

.textS.tight > :is(p, li, a) {
	line-height: var(--textSheightT);
	margin-top: var(--textStopT);
	margin-bottom: var(--textSbottomT);
}

/* Text XS */
.textXS :is(p, li) {
	font-size: var(--textXSsize);
	letter-spacing: var(--smallTextSpacing);
}

.textXS:not(.tight) > :is(p, li) {
	line-height: var(--textXSheightS);
	margin-top: var(--textXStopS);
	margin-bottom: var(--textXSbottomS);
}

.textXS.tight > :is(p, li) {
	line-height: var(--textXSheightT);
	margin-top: var(--textXStopT);
	margin-bottom: var(--textXSbottomT);
}

/* Text XXS */
.textXXS :is(p, li) {
	font-size: var(--textXXSsize);
	letter-spacing: var(--smallTextSpacing);
}

.textXXS:not(.tight) > :is(p, li) {
	line-height: var(--textXXSheightS);
	margin-top: var(--textXXStopS);
	margin-bottom: var(--textXXSbottomS);
}

.textXXS.tight > :is(p, li) {
	line-height: var(--textXXSheightT);
	margin-top: var(--textXXStopT);
	margin-bottom: var(--textXXSbottomT);
}

/* Weights */

.titleWeight :is(p, span, li, a) {
	font-weight: var(--titleWeight);
	font-family: var(--titleFont);
}

:is(.textXXL, .textXL) :is(b, strong),
.titleWeight:is(.textXXL, .textXL) :is(p, span, li, a) {
	letter-spacing: var(--bigTitleSpacing);
}

:is(.textL, .textM, .textS, .textXS, .textXXS) :is(b, strong),
.titleWeight:is(.textL, .textM, .textS, .textXS, .textXXS) :is(p, span, li, a) {
	letter-spacing: var(--smallTitleSpacing);
}

/* Horisontal */
:is(.textXXL, .textXL, .textL, .textM, .textS, .textXS, .textXXS).center {
	text-align: center;
}

:is(.textXXL, .textXL, .textL, .textM, .textS, .textXS, .textXXS).right {
	text-align: right;
}


/* Color */

.opacity-color :is(p) {
	color: var(--contentOpacityColor);
}