<commit_before>/*
Typography

This framework uses [Bourbon](https://github.com/thoughtbot/bourbon) and [Neat](https://github.com/thoughtbot/neat) to provide a consistent 16 column responsive grid layout with basic content styling and good typographic defaults.

The framework aims to meet common government typographic needs:

- clear and consistent headings and labels
- legible body paragraphs
- easy-to-use input fields.

It is designed to provide:

- the highest standards of usability and accessibility
- a consistent visual voice of credibility and warmth
- ease-of-use across Australian Government digital platforms.

The following guidance may change to apply only to content inside an `article`.

Style guide: Typography
*/

/*
Typeface

The framework is currently testing the open source [Open Sans font family](https://www.google.com/fonts/specimen/Open+Sans) in 3 styles:

- regular 400
- regular 400 italic
- regular 600 bold

The framework is likely to change to a different primary typeface. We are currently testing the use of webfonts generally.

We aim to spend a spike in the future to properly test and optimise any usage of webfonts.

Style guide: Typography.1 Typeface
*/

/*
Font stacks

```
$base-serif: 'Book Antiqua', Georgia, 'Bitstream Vera Serif', serif;
$base-sans-serif: 'Open Sans', Verdana, 'Bitstream Vera Sans', sans-serif;
$base-monospace: 'Lucida Sans Typewriter', 'Lucida Console', Monaco, 'Bitstream Vera Sans Mono', monospace;
```

We have not decided on using a webfont but the font stacks should still achieve a high degree of coverage across a range of browsers and operating systems using the fall-backs (roughly 95% coverage).

Currently you will need to `link` to Open Sans via the HTML `head` to support Internet Explorer.

Style guide: Typography.1 Typeface.1 Font stacks
*/

/*
Pairing style examples

#### Open Sans regular 400

<p class='abstract'>ABCDEFGHIJKLMNOPQRSTUVWXYZ<br />
abcdefghijklmnopqrstuvwxyz<br />
1234567890(!@#s%g.,?:;)</p>

#### Open Sans bold 400

<p class='abstract'><strong>ABCDEFGHIJKLMNOPQRSTUVWXYZ<br />
abcdefghijklmnopqrstuvwxyz<br />
1234567890(!@#s%g.,?:;)</strong></p>

We will provide a full HTML test page showing all possible pairings.

Style guide: Typography.1 Typeface.2 Pairing style examples
*/

/*
Headings & body copy

The type sizes are designed for legibility and readability. We are currently testing this.

They are initially based on a perfect fourth modular scale.

Style guide: Typography.2 Headings & body copy
*/

/*
Breakpoints

- Mobile (extra small devices): 4 columns, 420px maximum
- Tablet (small devices): 8 columns, 768px maximum
- Desktop (medium devices): 12 columns, 1200px maximum

You should think about this in parallel with the [grid breakpoints](grid-settings-2-screen-size). **FIX ANCHOR LINK**

Style guide: Typography.2 Headings & body copy.1 Breakpoints
*/

/*
Font size & line height defaults

Use relative units to allow for variety across a user's browser and device screen size.

This table shows the default font size in pixels and line height in ems for styles.

<table style="width:100%;">
  <tr>
    <th>Style</th>
    <th>Mobile</th>
    <th>Tablet</th>
    <th>Desktop</th>
  </tr>
  <tr>
    <td>h1 / .display </td>
    <td>51px / 3.1875em</td>
    <td>57px / 3.5625em<br></td>
    <td>51px / 3.1875em</td>
  </tr><commit_msg>Fix anchor link<commit_after>/*
Typography

This framework uses [Bourbon](https://github.com/thoughtbot/bourbon) and [Neat](https://github.com/thoughtbot/neat) to provide a consistent 16 column responsive grid layout with basic content styling and good typographic defaults.

The framework aims to meet common government typographic needs:

- clear and consistent headings and labels
- legible body paragraphs
- easy-to-use input fields.

It is designed to provide:

- the highest standards of usability and accessibility
- a consistent visual voice of credibility and warmth
- ease-of-use across Australian Government digital platforms.

The following guidance may change to apply only to content inside an `article`.

Style guide: Typography
*/

/*
Typeface

The framework is currently testing the open source [Open Sans font family](https://www.google.com/fonts/specimen/Open+Sans) in 3 styles:

- regular 400
- regular 400 italic
- regular 600 bold

The framework is likely to change to a different primary typeface. We are currently testing the use of webfonts generally.

We aim to spend a spike in the future to properly test and optimise any usage of webfonts.

Style guide: Typography.1 Typeface
*/

/*
Font stacks

```
$base-serif: 'Book Antiqua', Georgia, 'Bitstream Vera Serif', serif;
$base-sans-serif: 'Open Sans', Verdana, 'Bitstream Vera Sans', sans-serif;
$base-monospace: 'Lucida Sans Typewriter', 'Lucida Console', Monaco, 'Bitstream Vera Sans Mono', monospace;
```

We have not decided on using a webfont but the font stacks should still achieve a high degree of coverage across a range of browsers and operating systems using the fall-backs (roughly 95% coverage).

Currently you will need to `link` to Open Sans via the HTML `head` to support Internet Explorer.

Style guide: Typography.1 Typeface.1 Font stacks
*/

/*
Pairing style examples

#### Open Sans regular 400

<p class='abstract'>ABCDEFGHIJKLMNOPQRSTUVWXYZ<br />
abcdefghijklmnopqrstuvwxyz<br />
1234567890(!@#s%g.,?:;)</p>

#### Open Sans bold 400

<p class='abstract'><strong>ABCDEFGHIJKLMNOPQRSTUVWXYZ<br />
abcdefghijklmnopqrstuvwxyz<br />
1234567890(!@#s%g.,?:;)</strong></p>

We will provide a full HTML test page showing all possible pairings.

Style guide: Typography.1 Typeface.2 Pairing style examples
*/

/*
Headings & body copy

The type sizes are designed for legibility and readability. We are currently testing this.

They are initially based on a perfect fourth modular scale.

Style guide: Typography.2 Headings & body copy
*/

/*
Breakpoints

- Mobile (extra small devices): 4 columns, 420px maximum
- Tablet (small devices): 8 columns, 768px maximum
- Desktop (medium devices): 12 columns, 1200px maximum

You should think about this in parallel with the [grid breakpoints](section-grid.html#kssref-grid-3-breakpoints).

Style guide: Typography.2 Headings & body copy.1 Breakpoints
*/

/*
Font size & line height defaults

Use relative units to allow for variety across a user's browser and device screen size.

This table shows the default font size in pixels and line height in ems for styles.

<table style="width:100%;">
  <tr>
    <th>Style</th>
    <th>Mobile</th>
    <th>Tablet</th>
    <th>Desktop</th>
  </tr>
  <tr>
    <td>h1 / .display </td>
    <td>51px / 3.1875em</td>
    <td>57px / 3.5625em<br></td>
    <td>51px / 3.1875em</td>
  </tr>
{'fraction_non_alphanumeric': 0.09654350417163289, 'fraction_numerical': 0.026221692491060787, 'mean_word_length': 4.289992119779354, 'pattern_counts': {'":': 0, '<': 67, '<?xml version=': 0, '>': 67, 'https://': 6, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '332386', 'n_tokens_mistral': 2209, 'n_tokens_neox': 1994, 'n_words': 820}