adjusting styles

src/app/card/card.component.scss

@@ -17,6 +17,7 @@
     .tui-card-title {
         padding: 16px 16px 0 16px;
         font-size: mat-font-size($tech-ui-typography, subheading-2);
+        font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
         color: mat-color($primary);
     }
 

src/app/dashboard/dashboard.component.scss

@@ -1,5 +1,6 @@
 .header {
-  margin: 20px 3vw 20px 3vw;
+  margin: 15px 3vw 12px 3vw;
+  font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
 }
 
 .progress {

src/app/lists/status-list/status-list.component.html

@@ -1,4 +1,4 @@
-<app-card>
+<app-card class="status-list">
     <div fxLayout="row" fxLayoutAlign="space-between start">
         <app-card-title>{{title | uppercase}}</app-card-title>
         <app-list-toggle (listTypeEvent)="onToggle($event)" class="tui-card-toggle"></app-list-toggle>

src/app/lists/status-list/status-list.component.scss

@@ -1,7 +1,3 @@
-.tui-card-toggle {
+.status-list .tui-card-toggle {
     padding: 16px 16px 0 16px;
 }
-
-.tui-card-content {
-    padding-top: 0;
-}

src/styles.scss

@@ -96,6 +96,7 @@ $tech-ui-dark-theme: mat-dark-theme($tech-ui-primary, $tech-ui-accent, $tech-ui-
     text-decoration: underline;
     color: #303030;
 }
+
 @media (prefers-color-scheme: dark) {
     @include angular-material-theme($tech-ui-dark-theme);
     @include tui-card-theme($tech-ui-dark-theme);
@@ -111,6 +112,10 @@ $tech-ui-dark-theme: mat-dark-theme($tech-ui-primary, $tech-ui-accent, $tech-ui-
     }
 } 
 
+.status-list .tui-card .tui-card-content {
+    padding-top: 0;
+}
+
 // Chart.js styles
 #chartjs-tooltip {
     /* max z-index value */