:root {

	--font-default-family: "Work Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;

	--font-default-weight: 400;
	--font-default-weight-medium: 500;
	--font-default-weight-semibold: 600;
	--font-default-weight-bold: 700;

	--font-default-size: 22px;
	--font-default-size-menu: 14px;
	--font-default-size-footer: 20px;
	--font-default-line-height: 1.3;
	--font-default-italic: italic;

	--color-white: #fff;
	--color-black: #000;
	--color-grey-light: #eee;

	--color-text: var(--color-black);

	--content-max-width: 1140px;

	--color-red: #b4012b;
	--color-blue: #008cd1;
	--color-orange: #EF7207;
	--color-green: #519F21;

	--color-highlight: var(--color-red);
	--color-highlight-alternate: var(--color-blue);

	--spacing-quarter: 10px;
	--spacing-half: 20px;
	--spacing: 40px;
	--spacing-double: 80px;
	--spacing-tripple: 120px;
	--spacing-quadruple: 160px;

	--header-height: 60px;
	--subheader-height-closed: 110px;
	--subheader-height: 0px;

	--footer-height: 114px;

	--global-min-width: 380px;

}

body:has(.subheader) {
	--subheader-height: var(--subheader-height-closed);
}

@media ( max-width: 1040px ) {

	:root {
		--font-default-size: 20px;
		--font-default-size-footer: 16px;
		--header-height: 51px;
	}

	body:has(.subheader) {
		--subheader-height: 0px;
	}

}

@media ( max-width: 840px ) {

	:root {
		--font-default-size: 18px;
	}

}

@media ( max-width: 640px ) {

	:root {
		--font-default-size: 16px;
		--font-default-size-footer: 14px;
	}

}