@ukho/admiralty-core 0.0.5 → 0.0.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukho/admiralty-core",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -66,5 +66,5 @@
   "license": "MIT",
   "url": "https://github.com/UKHO/admiralty-design-system",
   "repository": "git://github.com/UKHO/admiralty-design-system.git",
-  "gitHead": "e3cfd9f946ac4be4c56e79b04f003e6b930d000e"
+  "gitHead": "a28205ebd0a98e72712ca92e58174356c67e5296"
 }

package/styles/core.css

@@ -0,0 +1 @@
+@charset "UTF-8";/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}details,main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;color:#09315b}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}[hidden],template{display:none}@font-face{font-family:JohnstonITC;src:url("./webfonts/JohnstonITC/medium/JohnstonITCStd-Medium.woff2") format("woff2");src:url("./webfonts/JohnstonITC/medium/JohnstonITCStd-Medium.woff") format("woff");font-weight:400;font-style:normal}@font-face{font-family:JohnstonITC;src:url("./webfonts/JohnstonITC/bold/JohnstonITCStd-Bold.woff2") format("woff2");src:url("./webfonts/JohnstonITC/bold/JohnstonITCStd-Bold.woff") format("woff");font-weight:700;font-style:normal}@font-face{font-family:JohnstonITC;src:url("./webfonts/JohnstonITC/italic/JohnstonITCStd-MediumIta.woff2") format("woff2");src:url("./webfonts/JohnstonITC/italic/JohnstonITCStd-MediumIta.woff") format("woff");font-weight:400;font-style:italic}@font-face{font-family:JohnstonITC;src:url("./webfonts/JohnstonITC/light/JohnstonITCStd-Light.woff2") format("woff2");src:url("./webfonts/JohnstonITC/light/JohnstonITCStd-Light.woff") format("woff");font-weight:300;font-style:normal}@font-face{font-family:JohnstonITC;src:url("./webfonts/JohnstonITC/light-italic/JohnstonITCStd-LightIta.woff2") format("woff2");src:url("./webfonts/JohnstonITC/light-italic/JohnstonITCStd-LightIta.woff") format("woff");font-weight:300;font-style:italic}@media (max-width:479px) and (min-width:0px){.tablet-only,.tablet-or-desktop{display:none}}@media (min-width:1024px){.not-desktop,.phone-only,.phone-or-tablet,.tablet-only{display:none}}@media (max-width:1023px) and (min-width:480px){.phone-only{display:none}}*{margin:0;padding:0;border:0;font-family:JohnstonITC,Helvetica,sans-serif;font-size:18px;line-height:24px;font-weight:300;color:#333}a:focus{outline:#ffdd00 solid 3px;outline-offset:1px}h1{font-family:JohnstonITC,Helvetica,sans-serif;color:#09315b;font-weight:400;font-size:48px;line-height:60px;margin:0 0 30px}@media (max-width:1023px){.desktop-only{display:none}*{font-size:16px}h1{font-size:46px;line-height:54px}}h2{font-family:JohnstonITC,Helvetica,sans-serif;color:#09315b;font-weight:400;font-size:36px;line-height:48px;margin-bottom:18px}@media (max-width:1023px){h2{font-size:34px;line-height:42px}}h3,h4,h5{font-family:JohnstonITC,Helvetica,sans-serif;color:#09315b;font-weight:400;font-size:21px;line-height:30px;margin-bottom:12px}@media (max-width:1023px){h3,h4,h5{font-size:20px;line-height:30px}}h6{font-family:JohnstonITC,Helvetica,sans-serif;color:#09315b;font-weight:400;font-size:18px;line-height:24px;margin-bottom:12px}p{font-family:JohnstonITC,Helvetica,sans-serif;margin-bottom:30px}.intro{font-family:JohnstonITC,Helvetica,sans-serif;font-size:28px;line-height:36px;margin-bottom:30px}@media (max-width:1023px){h6{font-size:16px}.intro{font-size:26px}}.small{font-family:JohnstonITC,Helvetica,sans-serif;font-size:16px}blockquote{font-family:JohnstonITC,Helvetica,sans-serif;line-height:30px;width:100%;padding:24px 18px;border-left:5px solid #09315b;margin-bottom:30px;background:#eee}ul{font-family:JohnstonITC,Helvetica,sans-serif;list-style:none}ol a,ul a{font-weight:300}ul li{margin-bottom:12px}ul li:before{content:"■";font-size:18px;color:#09315b;vertical-align:text-bottom;margin-right:12px}@media (max-width:1023px){.small{font-size:14px;line-height:22px}blockquote{line-height:24px}ul li:before{font-size:8px}}ol{font-family:JohnstonITC,Helvetica,sans-serif;list-style:none;counter-reset:li}ol li:before{content:counter(li) ".";color:#03284f;font-size:18px;margin-right:12px}ol li{counter-increment:li;margin-bottom:12px}.white-text *{color:#fff}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;border:0!important;white-space:nowrap!important}

package/styles/core.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../src/scss/_reset.scss","../src/scss/normalize.css","../src/scss/vars/_colours.scss","../src/scss/base/_fonts.scss","../src/scss/vars/_responsive.scss","../src/scss/base/_responsive.scss","../src/scss/base/_typography.scss","../src/scss/vars/_typography.scss","../src/scss/base/_a11y.scss"],"names":[],"mappings":"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","file":"core.css","sourcesContent":["* {\r\n  margin: 0;\r\n  padding: 0;\r\n  border: 0;\r\n}\r\n","/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\r\n\r\n/* Document\r\n   ========================================================================== */\r\n\r\n/**\r\n * 1. Correct the line height in all browsers.\r\n * 2. Prevent adjustments of font size after orientation changes in iOS.\r\n */\r\n\r\nhtml {\r\n  line-height: 1.15; /* 1 */\r\n  -webkit-text-size-adjust: 100%; /* 2 */\r\n}\r\n\r\n/* Sections\r\n   ========================================================================== */\r\n\r\n/**\r\n * Remove the margin in all browsers.\r\n */\r\n\r\nbody {\r\n  margin: 0;\r\n}\r\n\r\n/**\r\n * Render the `main` element consistently in IE.\r\n */\r\n\r\nmain {\r\n  display: block;\r\n}\r\n\r\n/**\r\n * Correct the font size and margin on `h1` elements within `section` and\r\n * `article` contexts in Chrome, Firefox, and Safari.\r\n */\r\n\r\nh1 {\r\n  font-size: 2em;\r\n  margin: 0.67em 0;\r\n}\r\n\r\n/* Grouping content\r\n   ========================================================================== */\r\n\r\n/**\r\n * 1. Add the correct box sizing in Firefox.\r\n * 2. Show the overflow in Edge and IE.\r\n */\r\n\r\nhr {\r\n  box-sizing: content-box; /* 1 */\r\n  height: 0; /* 1 */\r\n  overflow: visible; /* 2 */\r\n}\r\n\r\n/**\r\n * 1. Correct the inheritance and scaling of font size in all browsers.\r\n * 2. Correct the odd `em` font sizing in all browsers.\r\n */\r\n\r\npre {\r\n  font-family: monospace, monospace; /* 1 */\r\n  font-size: 1em; /* 2 */\r\n}\r\n\r\n/* Text-level semantics\r\n   ========================================================================== */\r\n\r\n/**\r\n * Remove the gray background on active links in IE 10.\r\n */\r\n\r\na {\r\n  background-color: transparent;\r\n}\r\n\r\n/**\r\n * 1. Remove the bottom border in Chrome 57-\r\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\r\n */\r\n\r\nabbr[title] {\r\n  border-bottom: none; /* 1 */\r\n  text-decoration: underline; /* 2 */\r\n  text-decoration: underline dotted; /* 2 */\r\n}\r\n\r\n/**\r\n * Add the correct font weight in Chrome, Edge, and Safari.\r\n */\r\n\r\nb,\r\nstrong {\r\n  font-weight: bolder;\r\n}\r\n\r\n/**\r\n * 1. Correct the inheritance and scaling of font size in all browsers.\r\n * 2. Correct the odd `em` font sizing in all browsers.\r\n */\r\n\r\ncode,\r\nkbd,\r\nsamp {\r\n  font-family: monospace, monospace; /* 1 */\r\n  font-size: 1em; /* 2 */\r\n}\r\n\r\n/**\r\n * Add the correct font size in all browsers.\r\n */\r\n\r\nsmall {\r\n  font-size: 80%;\r\n}\r\n\r\n/**\r\n * Prevent `sub` and `sup` elements from affecting the line height in\r\n * all browsers.\r\n */\r\n\r\nsub,\r\nsup {\r\n  font-size: 75%;\r\n  line-height: 0;\r\n  position: relative;\r\n  vertical-align: baseline;\r\n}\r\n\r\nsub {\r\n  bottom: -0.25em;\r\n}\r\n\r\nsup {\r\n  top: -0.5em;\r\n}\r\n\r\n/* Embedded content\r\n   ========================================================================== */\r\n\r\n/**\r\n * Remove the border on images inside links in IE 10.\r\n */\r\n\r\nimg {\r\n  border-style: none;\r\n}\r\n\r\n/* Forms\r\n   ========================================================================== */\r\n\r\n/**\r\n * 1. Change the font styles in all browsers.\r\n * 2. Remove the margin in Firefox and Safari.\r\n */\r\n\r\nbutton,\r\ninput,\r\noptgroup,\r\nselect,\r\ntextarea {\r\n  font-family: inherit; /* 1 */\r\n  font-size: 100%; /* 1 */\r\n  line-height: 1.15; /* 1 */\r\n  margin: 0; /* 2 */\r\n}\r\n\r\n/**\r\n * Show the overflow in IE.\r\n * 1. Show the overflow in Edge.\r\n */\r\n\r\nbutton,\r\ninput { /* 1 */\r\n  overflow: visible;\r\n}\r\n\r\n/**\r\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\r\n * 1. Remove the inheritance of text transform in Firefox.\r\n */\r\n\r\nbutton,\r\nselect { /* 1 */\r\n  text-transform: none;\r\n}\r\n\r\n/**\r\n * Correct the inability to style clickable types in iOS and Safari.\r\n */\r\n\r\nbutton,\r\n[type=\"button\"],\r\n[type=\"reset\"],\r\n[type=\"submit\"] {\r\n  -webkit-appearance: button;\r\n}\r\n\r\n/**\r\n * Remove the inner border and padding in Firefox.\r\n */\r\n\r\nbutton::-moz-focus-inner,\r\n[type=\"button\"]::-moz-focus-inner,\r\n[type=\"reset\"]::-moz-focus-inner,\r\n[type=\"submit\"]::-moz-focus-inner {\r\n  border-style: none;\r\n  padding: 0;\r\n}\r\n\r\n/**\r\n * Restore the focus styles unset by the previous rule.\r\n */\r\n\r\nbutton:-moz-focusring,\r\n[type=\"button\"]:-moz-focusring,\r\n[type=\"reset\"]:-moz-focusring,\r\n[type=\"submit\"]:-moz-focusring {\r\n  outline: 1px dotted ButtonText;\r\n}\r\n\r\n/**\r\n * Correct the padding in Firefox.\r\n */\r\n\r\nfieldset {\r\n  padding: 0.35em 0.75em 0.625em;\r\n}\r\n\r\n/**\r\n * 1. Correct the text wrapping in Edge and IE.\r\n * 2. Correct the color inheritance from `fieldset` elements in IE.\r\n * 3. Remove the padding so developers are not caught out when they zero out\r\n *    `fieldset` elements in all browsers.\r\n */\r\n\r\nlegend {\r\n  box-sizing: border-box; /* 1 */\r\n  color: inherit; /* 2 */\r\n  display: table; /* 1 */\r\n  max-width: 100%; /* 1 */\r\n  padding: 0; /* 3 */\r\n  white-space: normal; /* 1 */\r\n}\r\n\r\n/**\r\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\r\n */\r\n\r\nprogress {\r\n  vertical-align: baseline;\r\n}\r\n\r\n/**\r\n * Remove the default vertical scrollbar in IE 10+.\r\n */\r\n\r\ntextarea {\r\n  overflow: auto;\r\n}\r\n\r\n/**\r\n * 1. Add the correct box sizing in IE 10.\r\n * 2. Remove the padding in IE 10.\r\n */\r\n\r\n[type=\"checkbox\"],\r\n[type=\"radio\"] {\r\n  box-sizing: border-box; /* 1 */\r\n  padding: 0; /* 2 */\r\n}\r\n\r\n/**\r\n * Correct the cursor style of increment and decrement buttons in Chrome.\r\n */\r\n\r\n[type=\"number\"]::-webkit-inner-spin-button,\r\n[type=\"number\"]::-webkit-outer-spin-button {\r\n  height: auto;\r\n}\r\n\r\n/**\r\n * 1. Correct the odd appearance in Chrome and Safari.\r\n * 2. Correct the outline style in Safari.\r\n */\r\n\r\n[type=\"search\"] {\r\n  -webkit-appearance: textfield; /* 1 */\r\n  outline-offset: -2px; /* 2 */\r\n}\r\n\r\n/**\r\n * Remove the inner padding in Chrome and Safari on macOS.\r\n */\r\n\r\n[type=\"search\"]::-webkit-search-decoration {\r\n  -webkit-appearance: none;\r\n}\r\n\r\n/**\r\n * 1. Correct the inability to style clickable types in iOS and Safari.\r\n * 2. Change font properties to `inherit` in Safari.\r\n */\r\n\r\n::-webkit-file-upload-button {\r\n  -webkit-appearance: button; /* 1 */\r\n  font: inherit; /* 2 */\r\n}\r\n\r\n/* Interactive\r\n   ========================================================================== */\r\n\r\n/*\r\n * Add the correct display in Edge, IE 10+, and Firefox.\r\n */\r\n\r\ndetails {\r\n  display: block;\r\n}\r\n\r\n/*\r\n * Add the correct display in all browsers.\r\n */\r\n\r\nsummary {\r\n  display: list-item;\r\n}\r\n\r\n/* Misc\r\n   ========================================================================== */\r\n\r\n/**\r\n * Add the correct display in IE 10+.\r\n */\r\n\r\ntemplate {\r\n  display: none;\r\n}\r\n\r\n/**\r\n * Add the correct display in IE 10.\r\n */\r\n\r\n[hidden] {\r\n  display: none;\r\n}\r\n","/* Core Palette */\r\n$colour-admiralty-blue: #09315b;\r\n$colour-black: #000000;\r\n$colour-white: #ffffff;\r\n$colour-dark-blue: #03284f;\r\n$colour-bg: #ffffff;\r\n\r\n/* Supporting Palette */\r\n$colour-text: #333333;\r\n$colour-line: #d0d0d0;\r\n$colour-bg-grey: #eeeeee;\r\n$colour-bg-text: #ffffff;\r\n$colour-bg-header: #d8d8d8;\r\n$colour-divider: #d8d8d8;\r\n$colour-bg-footer: #b3bcc8;\r\n\r\n/* Secondary Palette */\r\n$colour-teal: #007e97;\r\n$colour-bright-blue: #65c4db;\r\n$colour-green: #989b00;\r\n\r\n/* Digital Product Colours */\r\n$colour-product-raster-chart: #ef3e33;\r\n$colour-product-list-of-lights: #00a996;\r\n$colour-product-passage-planner: #85a4d1;\r\n$colour-product-tide: #fcd446;\r\n$colour-product-vector-chart: #de0076;\r\n$colour-product-nautical-publications: #7577c0;\r\n$colour-product-digital-publications: #83afb4;\r\n$colour-product-digital-radio-signals: #75cff5;\r\n\r\n/* Utility Colours */\r\n$colour-utility-warning: #e3660e;\r\n$colour-utility-warning-bg: #f8ede3;\r\n$colour-utility-error: #e20d0d;\r\n$colour-utility-error-bg: #f7e1e1;\r\n$colour-utility-success: #47a234;\r\n$colour-utility-success-bg: #e7f1e5;\r\n$colour-utility-info: #0177c1;\r\n$colour-utility-info-bg: #e0ecf3;\r\n$colour-utility-focus: #ffdd00;\r\n\r\n/* Button Colours */\r\n/* Primary */\r\n$colour-button-standard: $colour-admiralty-blue;\r\n$colour-button-border-standard: $colour-admiralty-blue;\r\n$colour-button-hover: #03284f;\r\n$colour-button-border-hover: #03284f;\r\n$colour-button-deselected: #adadad;\r\n$colour-button-border-deselected: #adadad;\r\n$colour-button-selected: #ffffff;\r\n$colour-button-border-selected: $colour-admiralty-blue;\r\n$colour-button-text: #ffffff;\r\n$colour-button-text-selected: $colour-admiralty-blue;\r\n$colour-button-border-selected: $colour-admiralty-blue;\r\n$colour-button-icon: #ffffff;\r\n$colour-button-icon-selected: $colour-admiralty-blue;\r\n/* Secondary */\r\n$colour-button-secondary-standard: #ffffff;\r\n$colour-button-secondary-border-standard: #05284e;\r\n$colour-button-secondary-hover: #eeeeee;\r\n$colour-button-secondary-border-hover: #05284e;\r\n$colour-button-secondary-deselected: #adadad;\r\n$colour-button-secondary-border-deselected: #adadad;\r\n$colour-button-secondary-selected: #05284e;\r\n$colour-button-secondary-border-selected: #05284e;\r\n$colour-button-secondary-text: #05284e;\r\n$colour-button-secondary-text-selected: #ffffff;\r\n$colour-button-secondary-icon: #05284e;\r\n$colour-button-secondary-icon-selected: #ffffff;\r\n\r\n/* Link Colours */\r\n$colour-link: $colour-admiralty-blue;\r\n\r\n/* Nav colours */\r\n$colour-nav-item: #333333;\r\n$colour-nav-main-bg-hover: #eef3f4;\r\n$colour-nav-bg-hover: #f0f0f0;\r\n$colour-nav-bg: #f8f8f8;\r\n$colour-nav-subitem: $colour-admiralty-blue;\r\n$colour-nav-subitem-icon: $colour-admiralty-blue;\r\n\r\n/* Table colours */\r\n$colour-table-row-bg: $colour-bg;\r\n$colour-table-row-alt-bg: #eef3f4;\r\n\r\n/* Tab colours */\r\n$colour-tab-active: #ffffff;\r\n$colour-tab-inactive: #eeeeee;\r\n$colour-tab-hover: #eef3f4;\r\n\r\n/* form text input colours */\r\n$colour-textinput-border: $colour-dark-blue;\r\n$colour-textinput-border-active: $colour-utility-info;\r\n$colour-textinput-border-disabled: #adadad;\r\n$colour-textinput-border-valid: $colour-utility-success;\r\n$colour-textinput-border-invalid: $colour-utility-error;\r\n$colour-textinput-text: $colour-admiralty-blue;\r\n$colour-textinput-text-active: $colour-utility-info;\r\n$colour-textinput-text-disabled: #adadad;\r\n$colour-textinput-text-valid: $colour-utility-success;\r\n$colour-textinput-text-invalid: $colour-utility-error;\r\n$colour-textinput-icon-valid: $colour-utility-success;\r\n$colour-textinput-icon-invalid: $colour-utility-error;\r\n$colour-textinput-bg: #f6f6f6;\r\n$colour-errormessage-text: $colour-utility-error;\r\n\r\n/* form textarea colours */\r\n$colour-textarea-border: $colour-dark-blue;\r\n$colour-textarea-border-focused: $colour-utility-info;\r\n\r\n/* radio button */\r\n$colour-radio: $colour-dark-blue;\r\n\r\n/* checkbox */\r\n$colour-checkbox: $colour-dark-blue;\r\n\r\n/* code snippet */\r\n$colour-codesnippet-bg: $colour-bg-grey;\r\n$colour-codesnippet-line: $colour-line;\r\n\r\n@function darken($color) {\r\n  $darker-color: scale-color($color, $lightness: -19%, $saturation: 60%);\r\n  @return $darker-color;\r\n}\r\n\r\n@function lighten($color) {\r\n  $lighter-color: scale-color($color, $lightness: 10%, $saturation: -25%);\r\n  @return $lighter-color;\r\n}\r\n","$font-path: './webfonts' !default;\r\n\r\n@font-face {\r\n  font-family: 'JohnstonITC';\r\n  src: url('#{$font-path}/JohnstonITC/medium/JohnstonITCStd-Medium.woff2') format('woff2');\r\n  src: url('#{$font-path}/JohnstonITC/medium/JohnstonITCStd-Medium.woff') format('woff');\r\n  font-weight: 400;\r\n  font-style: normal;\r\n}\r\n\r\n@font-face {\r\n  font-family: 'JohnstonITC';\r\n  src: url('#{$font-path}/JohnstonITC/bold/JohnstonITCStd-Bold.woff2') format('woff2');\r\n  src: url('#{$font-path}/JohnstonITC/bold/JohnstonITCStd-Bold.woff') format('woff');\r\n  font-weight: bold;\r\n  font-style: normal;\r\n}\r\n\r\n@font-face {\r\n  font-family: 'JohnstonITC';\r\n  src: url('#{$font-path}/JohnstonITC/italic/JohnstonITCStd-MediumIta.woff2') format('woff2');\r\n  src: url('#{$font-path}/JohnstonITC/italic/JohnstonITCStd-MediumIta.woff') format('woff');\r\n  font-weight: 400;\r\n  font-style: italic;\r\n}\r\n\r\n@font-face {\r\n  font-family: 'JohnstonITC';\r\n  src: url('#{$font-path}/JohnstonITC/light/JohnstonITCStd-Light.woff2') format('woff2');\r\n  src: url('#{$font-path}/JohnstonITC/light/JohnstonITCStd-Light.woff') format('woff');\r\n  font-weight: 300;\r\n  font-style: normal;\r\n}\r\n\r\n@font-face {\r\n  font-family: 'JohnstonITC';\r\n  src: url('#{$font-path}/JohnstonITC/light-italic/JohnstonITCStd-LightIta.woff2') format('woff2');\r\n  src: url('#{$font-path}/JohnstonITC/light-italic/JohnstonITCStd-LightIta.woff') format('woff');\r\n  font-weight: 300;\r\n  font-style: italic;\r\n}\r\n","$max-content-width: 1284px;\r\n\r\n/* Device Sizes - matching layout breakpoints */\r\n$device-size-desktop: 1024px;\r\n$device-size-tablet: 480px;\r\n$device-size-phone: 0px;\r\n","@use \"../vars/responsive\";\r\n\r\n@mixin not-desktop() {\r\n  @media (max-width: responsive.$device-size-desktop - 1px) {\r\n    @content;\r\n  }\r\n}\r\n\r\n@mixin desktop-only() {\r\n  @media (min-width: responsive.$device-size-desktop) {\r\n    @content;\r\n  }\r\n}\r\n\r\n@mixin tablet-only() {\r\n  @media (max-width: responsive.$device-size-desktop - 1px) and (min-width: responsive.$device-size-tablet) {\r\n    @content;\r\n  }\r\n}\r\n\r\n@mixin tablet-or-desktop() {\r\n  @media (min-width: responsive.$device-size-phone + 1px) {\r\n    @content;\r\n  }\r\n}\r\n\r\n@mixin phone-or-tablet() {\r\n  @media (max-width: responsive.$device-size-desktop - 1px) and (min-width: responsive.$device-size-phone) {\r\n    @content;\r\n  }\r\n}\r\n\r\n@mixin phone-only() {\r\n  @media (max-width: responsive.$device-size-tablet - 1px) and (min-width: responsive.$device-size-phone) {\r\n    @content;\r\n  }\r\n}\r\n\r\n.desktop-only {\r\n  @include not-desktop {\r\n    display: none;\r\n  }\r\n}\r\n\r\n.not-desktop {\r\n  @include desktop-only {\r\n    display: none;\r\n  }\r\n}\r\n\r\n.tablet-only {\r\n  @include desktop-only {\r\n    display: none;\r\n  }\r\n  @include phone-only {\r\n    display: none;\r\n  }\r\n}\r\n\r\n.tablet-or-desktop {\r\n  @include phone-only {\r\n    display: none;\r\n  }\r\n}\r\n\r\n.phone-or-tablet {\r\n  @include desktop-only {\r\n    display: none;\r\n  }\r\n}\r\n\r\n.phone-only {\r\n  @include desktop-only {\r\n    display: none;\r\n  }\r\n  @include tablet-only {\r\n    display: none;\r\n  }\r\n}\r\n","@use \"../vars/colours\";\r\n@use \"responsive\";\r\n@use \"../vars/typography\";\r\n\r\n* {\r\n  font-family: typography.$font-family;\r\n  font-size: typography.$font-size-normal;\r\n  line-height: typography.$font-line-height-normal;\r\n  font-weight: typography.$font-weight-light;\r\n  color: colours.$colour-text;\r\n  @include responsive.not-desktop {\r\n    font-size: 16px;\r\n  }\r\n}\r\n\r\na {\r\n  color: colours.$colour-admiralty-blue;\r\n  &:focus {\r\n    outline: 3px solid colours.$colour-utility-focus;\r\n    outline-offset: 1px;\r\n  }\r\n}\r\n\r\nh1 {\r\n  font-family: typography.$font-family;\r\n  color: colours.$colour-admiralty-blue;\r\n  font-weight: typography.$font-weight-medium;\r\n  font-size: 48px;\r\n  line-height: 60px;\r\n  margin: 0 0 30px 0;\r\n  @include responsive.not-desktop {\r\n    font-size: 46px;\r\n    line-height: 54px;\r\n  }\r\n}\r\n\r\nh2 {\r\n  font-family: typography.$font-family;\r\n  color: colours.$colour-admiralty-blue;\r\n  font-weight: typography.$font-weight-medium;\r\n  font-size: 36px;\r\n  line-height: 48px;\r\n  margin-bottom: 18px;\r\n  @include responsive.not-desktop {\r\n    font-size: 34px;\r\n    line-height: 42px;\r\n  }\r\n}\r\n\r\nh3,\r\nh4,\r\nh5 {\r\n  font-family: typography.$font-family;\r\n  color: colours.$colour-admiralty-blue;\r\n  font-weight: typography.$font-weight-medium;\r\n  font-size: 21px;\r\n  line-height: 30px;\r\n  margin-bottom: 12px;\r\n  @include responsive.not-desktop {\r\n    font-size: 20px;\r\n    line-height: 30px;\r\n  }\r\n}\r\n\r\nh6 {\r\n  font-family: typography.$font-family;\r\n  color: colours.$colour-admiralty-blue;\r\n  font-weight: typography.$font-weight-medium;\r\n  font-size: 18px;\r\n  line-height: 24px;\r\n  margin-bottom: 12px;\r\n  @include responsive.not-desktop {\r\n    font-size: 16px;\r\n  }\r\n}\r\n\r\np {\r\n  font-family: typography.$font-family;\r\n  margin-bottom: 30px;\r\n}\r\n\r\n.intro {\r\n  font-family: typography.$font-family;\r\n  font-size: 28px;\r\n  line-height: 36px;\r\n  margin-bottom: 30px;\r\n  @include responsive.not-desktop {\r\n    font-size: 26px;\r\n  }\r\n}\r\n\r\n.small {\r\n  font-family: typography.$font-family;\r\n  font-size: 16px;\r\n  @include responsive.not-desktop {\r\n    font-size: 14px;\r\n    line-height: 22px;\r\n  }\r\n}\r\n\r\nblockquote {\r\n  font-family: typography.$font-family;\r\n  line-height: 30px;\r\n  width: 100%;\r\n  padding: 24px 18px;\r\n  border-left: 5px solid colours.$colour-admiralty-blue;\r\n  margin-bottom: 30px;\r\n  background: #eeeeee;\r\n  @include responsive.not-desktop {\r\n    line-height: 24px;\r\n  }\r\n}\r\n\r\nul {\r\n  font-family: typography.$font-family;\r\n  list-style: none;\r\n  a {\r\n    font-weight: typography.$font-weight-light;\r\n  }\r\n\r\n  li {\r\n    margin-bottom: 12px;\r\n  }\r\n\r\n  li:before {\r\n    content: '\\25A0';\r\n    font-size: 18px;\r\n    color: colours.$colour-admiralty-blue;\r\n    vertical-align: text-bottom;\r\n    margin-right: 12px;\r\n    @include responsive.not-desktop {\r\n      font-size: 8px;\r\n    }\r\n  }\r\n}\r\n\r\nol {\r\n  font-family: typography.$font-family;\r\n  list-style: none;\r\n  counter-reset: li;\r\n\r\n  a {\r\n    font-weight: typography.$font-weight-light;\r\n  }\r\n\r\n  li:before {\r\n    content: counter(li) '.';\r\n    color: colours.$colour-dark-blue;\r\n    font-size: 18px;\r\n    margin-right: 12px;\r\n  }\r\n\r\n  li {\r\n    counter-increment: li;\r\n    margin-bottom: 12px;\r\n  }\r\n}\r\n\r\n.white-text {\r\n  * {\r\n    color: colours.$colour-white;\r\n  }\r\n}\r\n","$font-weight-medium: normal;\r\n$font-weight-light: 300;\r\n$font-family: 'JohnstonITC', Helvetica, sans-serif;\r\n$font-size-normal: 18px;\r\n$font-line-height-normal: 24px;\r\n","/* Use for content that should be read by screen readers but not seen */\r\n.visually-hidden {\r\n  position: absolute !important;\r\n  width: 1px !important;\r\n  height: 1px !important;\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n  overflow: hidden !important;\r\n  clip: rect(0 0 0 0) !important;\r\n  -webkit-clip-path: inset(50%) !important;\r\n  clip-path: inset(50%) !important;\r\n  border: 0 !important;\r\n  white-space: nowrap !important;\r\n}\r\n"]}