@font-face {
	font-family: "EDS Open Sans";
	src: url("./fonts/open-sans-eds.woff2") format("woff2-variations");
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
}

:root {
	--eds-design-font-family: "EDS Open Sans", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--eds-type-display: 700 50px/58px var(--eds-design-font-family);
	--eds-type-h1: 700 38px/44px var(--eds-design-font-family);
	--eds-type-h2: 700 30px/36px var(--eds-design-font-family);
	--eds-type-h3: 600 22px/28px var(--eds-design-font-family);
	--eds-type-body-large: 600 18px/28px var(--eds-design-font-family);
	--eds-type-body: 400 16px/24px var(--eds-design-font-family);
	--eds-type-ui: 600 16px/20px var(--eds-design-font-family);
	--eds-type-small: 400 14px/21px var(--eds-design-font-family);
	--eds-type-label: 700 13px/18px var(--eds-design-font-family);
}

.eds-type-display {
	font: var(--eds-type-display) !important;
	font-synthesis: none !important;
}

.eds-type-h1 {
	font: var(--eds-type-h1) !important;
	font-synthesis: none !important;
}

.eds-type-h2 {
	font: var(--eds-type-h2) !important;
	font-synthesis: none !important;
}

.eds-type-h3 {
	font: var(--eds-type-h3) !important;
	font-synthesis: none !important;
}

.eds-type-body-large {
	font: var(--eds-type-body-large) !important;
	font-synthesis: none !important;
}

.eds-type-body {
	font: var(--eds-type-body) !important;
	font-synthesis: none !important;
}

.eds-type-ui {
	font: var(--eds-type-ui) !important;
	font-synthesis: none !important;
}

.eds-type-small {
	font: var(--eds-type-small) !important;
	font-synthesis: none !important;
}

.eds-type-label {
	font: var(--eds-type-label) !important;
	font-synthesis: none !important;
}

@media (max-width: 767px) {
	:root {
		--eds-type-display: 700 40px/44px var(--eds-design-font-family);
		--eds-type-h1: 700 28px/34px var(--eds-design-font-family);
		--eds-type-h2: 700 24px/30px var(--eds-design-font-family);
		--eds-type-h3: 600 20px/26px var(--eds-design-font-family);
		--eds-type-body-large: 500 16px/24px var(--eds-design-font-family);
		--eds-type-body: 400 15px/22px var(--eds-design-font-family);
	}
}
