Use system font stack

Author: J12934

src/scss/_bootstrap-variables.scss

@@ -20,9 +20,9 @@ $grid-gutter-width: 20px;
 $white: #ffffff;
 $black: #000000;
 $primary: #1c3ed3;
-$iteragenta: #A9218E;
+$iteragenta: #a9218e;
 $iteragentaLight: rgb(170, 77, 151);
-$secureCodeBlue: #3296DC;
+$secureCodeBlue: #3296dc;
 $secondary: #414156;
 
 // Links
@@ -32,9 +32,12 @@ $link-hover-color: lighten($primary, 20%);
 $link-hover-decoration: underline;
 
 // Fonts
-$font-family-base: 'Ubuntu','Livvic', 'Helvetica Neue', Arial, sans-serif,
-  -apple-system;
-$font-family-heading: 'Livvic', 'Helvetica Neue', Arial, sans-serif, -apple-system;
+$font-family-base: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+  Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
+  'Segoe UI Symbol';
+$font-family-heading: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
+  Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
+  'Segoe UI Symbol';
 $font-size-base: 1rem; // Assumes the browser default, typically `16px`
 $font-weight-thin: 200;
 $font-weight-light: 300;