Switch header font to Norwester Pro

templates/article.html

@@ -41,7 +41,7 @@
   <link href="{{base_url}}/css/compute-c23f91.webflow.css" rel="stylesheet" type="text/css">
   <link href="{{base_url}}/css/code-theme.css" rel="stylesheet" type="text/css">
   <script
-    type="text/javascript">!function (o, c) { var n = c.documentElement, t = " w-mod-"; n.className += t + "js", ("ontouchstart" in o || o.DocumentTouch && c instanceof DocumentTouch) && (n.className += t + "touch") }(window, document);</script>
+    type="text/javascript">!function (o, c) {var n = c.documentElement, t = " w-mod-"; n.className += t + "js", ("ontouchstart" in o || o.DocumentTouch && c instanceof DocumentTouch) && (n.className += t + "touch")}(window, document);</script>
   <link href="{{base_url}}/images/favicon.ico" rel="shortcut icon" type="image/x-icon">
   <link href="{{base_url}}/images/webclip.png" rel="apple-touch-icon">
   <link rel="preconnect" href="https://fonts.googleapis.com">
@@ -69,7 +69,7 @@
   </div>
   <div class="w-layout-vflex flex-block-2 purple" style="background-color:#552a85">
     <div id="header-elements">
-      <h1 id="title" class="heading-8">{{title}}</h1>
+      <h1 id="title" class="heading-8 nw-regular">{{title}}</h1>
       <div class="w-layout-hflex flex-block-3">
         {% for author in authors %}
         <img src="{{author.avatar_url}}" loading="lazy" width="32" height="32" alt="{{author.full_name}}'s Avatar"
@@ -114,4 +114,4 @@
   {% endif %}
 </body>
 
-</html>
+</html>

templates/css/norwester-pro.css

@@ -0,0 +1,153 @@
+@font-face {
+  font-family: 'Norwester Pro';
+  font-weight: bold;
+  font-style: normal;
+  font-display: block;
+  src: local('Norwester Pro'),
+    local('NorwesterPro-Regular'),
+    url(/fonts/NorwesterPro-Regular.woff2) format('woff2');
+}
+
+@font-face {
+  font-family: 'Norwester Pro Oblique';
+  font-weight: bold;
+  font-style: normal;
+  font-display: block;
+  src: local('Norwester Pro Oblique'),
+    local('NorwesterPro-RegularOblique'),
+    url(/fonts/NorwesterPro-RegularOblique.woff2) format('woff2');
+}
+
+@font-face {
+  font-family: 'Norwester Pro Regular';
+  font-weight: bold;
+  font-style: normal;
+  font-display: block;
+  src: local('Norwester Pro Regular'),
+    local('NorwesterPro-Regular'),
+    url(/fonts/NorwesterPro-Regular.woff2) format('woff2');
+}
+
+@font-face {
+  font-family: 'Norwester Pro Regular Oblique';
+  font-weight: bold;
+  font-style: normal;
+  font-display: block;
+  src: local('Norwester Pro Regular Oblique'),
+    local('NorwesterPro-RegularOblique'),
+    url(/fonts/NorwesterPro-RegularOblique.woff2) format('woff2');
+}
+
+@font-face {
+  font-family: 'Norwester Pro Rounded';
+  font-weight: bold;
+  font-style: normal;
+  font-display: block;
+  src: local('Norwester Pro Rounded'),
+    local('NorwesterPro-Rounded'),
+    url(/fonts/NorwesterPro-Rounded.woff2) format('woff2');
+}
+
+@font-face {
+  font-family: 'Norwester Pro Rounded Oblique';
+  font-weight: bold;
+  font-style: normal;
+  font-display: block;
+  src: local('Norwester Pro Rounded Oblique'),
+    local('NorwesterPro-RoundedOblique'),
+    url(/fonts/NorwesterPro-RoundedOblique.woff2) format('woff2');
+}
+
+@font-face {
+  font-family: 'Norwester Pro Square';
+  font-weight: bold;
+  font-style: normal;
+  font-display: block;
+  src: local('Norwester Pro Square'),
+    local('NorwesterPro-Square'),
+    url(/fonts/NorwesterPro-Square.woff2) format('woff2');
+}
+
+@font-face {
+  font-family: 'Norwester Pro Square Oblique';
+  font-weight: bold;
+  font-style: normal;
+  font-display: block;
+  src: local('Norwester Pro Square Oblique'),
+    local('NorwesterPro-SquareOblique'),
+    url(/fonts/NorwesterPro-SquareOblique.woff2) format('woff2');
+}
+
+
+.nw-regular {
+  font-family: 'Norwester Pro Regular';
+}
+
+.nw-regular-obl,
+.nw-regular em {
+  font-family: 'Norwester Pro Regular Oblique';
+  font-style: normal;
+}
+
+.nw-rounded {
+  font-family: 'Norwester Pro Rounded';
+}
+
+.nw-rounded-obl,
+.nw-rounded em {
+  font-family: 'Norwester Pro Rounded Oblique';
+}
+
+.nw-square {
+  font-family: 'Norwester Pro Square';
+}
+
+.nw-square-obl,
+.nw-square em {
+  font-family: 'Norwester Pro Square Oblique';
+}
+
+.nw-ss01,
+.nw-salt {
+  /* C ð J Ľ S Ü Z @ & */
+  font-feature-settings: 'ss01';
+}
+
+.nw-uppercase {
+  text-transform: uppercase;
+  /* Default to no ligatures */
+  font-variant-ligatures: none;
+}
+
+.nw-all-small-caps {
+  font-variant-caps: all-small-caps;
+}
+
+.nw-liga {
+  text-transform: uppercase;
+  /* CA CO. EA LA LI LL TH */
+  font-variant-ligatures: common-ligatures;
+}
+
+.nw-liga-off {
+  /* Turn common-ligatures off but keep discretionary */
+  font-feature-settings: 'liga' off;
+}
+
+.nw-dliga {
+  text-transform: uppercase;
+  /* FOR, OF THE, AND, etc */
+  font-variant-ligatures: discretionary-ligatures;
+}
+
+.nw-lining-nums {
+  font-variant-numeric: lining-nums;
+}
+
+.nw-tabular-nums {
+  font-variant-numeric: tabular-nums;
+}
+
+.nw-oldstyle-nums {
+  font-variant-numeric: oldstyle-nums;
+}