diff --git a/d2l-typography.scss b/d2l-typography.scss
index 5d012ba..1fdc6dd 100644
--- a/d2l-typography.scss
+++ b/d2l-typography.scss
@@ -1 +1,198 @@
-@import 'node_modules/@brightspace-ui/core/components/typography/typography.scss';
+@mixin d2l-typography {
+
+	color: var(--d2l-color-ferrite, #202122);
+	display: block;
+	font-family: "Lato", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
+	font-size: 0.95rem;
+	font-weight: 400;
+	letter-spacing: 0.01rem;
+	line-height: 1.4rem;
+
+	p {
+		margin: 1rem 0;
+	}
+
+	&:lang(ar),
+	& :lang(ar) {
+		font-family: "Segoe UI", "Geeza Pro", sans-serif;
+	}
+
+	&:lang(ja),
+	& :lang(ja) {
+		font-family: "Hiragino Kaku Gothic Pro", "Meiyro", sans-serif;
+	}
+
+	&:lang(ko),
+	& :lang(ko) {
+		font-family: "Apple SD Gothic Neo", Dotum, sans-serif;
+	}
+
+	&:lang(th),
+	& :lang(th),
+	&:lang(tha),
+	& :lang(tha) {
+		font-family: "Noto Sans Thai", system-ui, Tahoma;
+	}
+
+	&:lang(zh),
+	& :lang(zh) {
+		font-family: "Microsoft YaHei", "Hiragino Sans GB", sans-serif;
+	}
+
+}
+
+@mixin d2l-typography-font-face {
+	@font-face {
+		font-family: "Lato";
+		font-style: normal;
+		font-weight: 400;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/Lato-400.woff2) format("woff2"),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/Lato-400.woff) format("woff");
+	}
+	@font-face {
+		font-family: "Lato";
+		font-style: normal;
+		font-weight: 700;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/Lato-700.woff2) format("woff2"),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/Lato-700.woff) format("woff");
+	}
+	@font-face {
+		font-family: 'Noto Sans Thai';
+		font-style: normal;
+		font-weight: 400;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/NotoSansThai-Regular.woff2) format('woff2'),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/NotoSansThai-Regular.woff) format('woff');
+	}
+	@font-face {
+		font-family: 'Noto Sans Thai';
+		font-style: normal;
+		font-weight: 700;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/NotoSansThai-Bold.woff2) format('woff2'),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/NotoSansThai-Bold.woff) format('woff');
+	}
+	@font-face {
+		font-family: "BC Sans";
+		font-style: normal;
+		font-weight: 300;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-Light.woff2) format("woff2"),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-Light.woff) format("woff");
+	}
+	@font-face {
+		font-family: "BC Sans";
+		font-style: normal;
+		font-weight: 400;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-Regular.woff2) format("woff2"),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-Regular.woff) format("woff");
+	}
+	@font-face {
+		font-family: "BC Sans";
+		font-style: normal;
+		font-weight: 700;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-Bold.woff2) format("woff2"),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-Bold.woff) format("woff");
+	}
+	@font-face {
+		font-family: "BC Sans";
+		font-style: italic;
+		font-weight: 300;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-LightItalic.woff2) format("woff2"),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-LightItalic.woff) format("woff");
+	}
+	@font-face {
+		font-family: "BC Sans";
+		font-style: italic;
+		font-weight: 400;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-Italic.woff2) format("woff2"),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-Italic.woff) format("woff");
+	}
+	@font-face {
+		font-family: "BC Sans";
+		font-style: italic;
+		font-weight: 700;
+		src:
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-BoldItalic.woff2) format("woff2"),
+			url(https://s.brightspace.com/lib/fonts/0.6.4/assets/BCSans-BoldItalic.woff) format("woff");
+	}
+}
+
+@mixin d2l-body-standard {
+	font-size: 0.95rem;
+	font-weight: 400;
+	line-height: 1.4rem;
+	@media (max-width: 615px) {
+		font-size: 0.8rem;
+		line-height: 1.2rem;
+	}
+}
+
+@mixin d2l-body-compact {
+	font-size: 0.8rem;
+	font-weight: 400;
+	line-height: 1.2rem;
+}
+
+@mixin d2l-body-small {
+	color: var(--d2l-color-tungsten, #494c4e);
+	font-size: 0.7rem;
+	font-weight: 400;
+	line-height: 0.9rem;
+	margin: auto;
+}
+
+@mixin d2l-heading-1 {
+	font-size: 2rem;
+	font-weight: 400;
+	line-height: 2.4rem;
+	margin: 1.5rem 0 1.5rem 0;
+	@media (max-width: 615px) {
+		font-size: 1.5rem;
+		line-height: 1.8rem;
+	}
+}
+
+@mixin d2l-heading-2 {
+	font-size: 1.5rem;
+	font-weight: 400;
+	line-height: 1.8rem;
+	margin: 1.5rem 0 1.5rem 0;
+	@media (max-width: 615px) {
+		font-size: 1rem;
+		font-weight: 700;
+		line-height: 1.5rem;
+	}
+}
+
+@mixin d2l-heading-3 {
+	font-size: 1rem;
+	font-weight: 700;
+	line-height: 1.5rem;
+	margin: 1.5rem 0 1.5rem 0;
+	@media (max-width: 615px) {
+		font-size: 0.8rem;
+		font-weight: 700;
+		line-height: 1.2rem;
+	}
+}
+
+@mixin d2l-heading-4 {
+	font-size: 0.8rem;
+	font-weight: 700;
+	line-height: 1.2rem;
+	margin: 1.5rem 0 1.5rem 0;
+}
+
+@mixin d2l-label-text {
+	font-size: 0.7rem;
+	font-weight: 700;
+	letter-spacing: 0.2px;
+	line-height: 1rem;
+}