"concluding" */ --typo-p-concluding-colour: var(--pattern-strong-text-colour); --typo-p-concluding-font-face: 'poppins'; --typo-p-concluding-font-size: 16px; --typo-p-concluding-font-weight: normal; --typo-p-concluding-font-style: normal; --typo-p-concluding-line-height: 1.5; --typo-p-concluding-letter-spacing: var(--pattern-letter-spacing-body); --typo-p-concluding-text-transform: none; --typo-p-concluding-text-align: left; --typo-p-concluding-margin: 2.5rem 0 0.7rem; /*
"article-intro" */ --template-articles-intro-colour: var(--typo-p-large-colour); --template-articles-intro-font-face: var(--typo-p-large-font-face); --template-articles-intro-font-size: var(--typo-p-large-font-size); --template-articles-intro-font-weight: var(--typo-p-large-font-weight); --template-articles-intro-font-style: normal; --template-articles-intro-line-height: var(--typo-p-large-line-height); --template-articles-intro-letter-spacing: var(--typo-p-large-letter-spacing); --template-articles-intro-text-transform: var(--typo-p-large-text-transform); --template-articles-intro-text-align: var(--typo-p-large-text-align); /*
"cta" */
--typo-p-cta-colour: var(--pattern-strong-text-colour);
--typo-p-cta-font-face: 'poppins';
--typo-p-cta-font-size: 16px;
--typo-p-cta-font-weight: normal;
--typo-p-cta-font-style: normal;
--typo-p-cta-line-height: 1.5;
--typo-p-cta-letter-spacing: var(--pattern-letter-spacing-body);
--typo-p-cta-text-transform: none;
--typo-p-cta-text-align: left;
--typo-p-cta-margin: 2.5rem 0 0.7rem;
/* Labels */
/* Label 2XL */
/* Label XL */
/* Label L */
--typo-data-label-l-colour: var(--pattern-strong-text-colour);
--typo-data-label-l-font-face: 'poppins';
--typo-data-label-l-font-size: 20px;
--typo-data-label-l-font-weight: normal;
--typo-data-label-l-font-style: normal;
--typo-data-label-l-line-height: 1;
--typo-data-label-l-letter-spacing: var(--pattern-letter-spacing-body);
--typo-data-label-l-text-transform: none;
--typo-data-label-l-text-align: left;
--typo-data-label-l-margin-bottom: 0 0 0.7rem;
/* Label M */
--typo-data-label-m-colour: var(--pattern-strong-text-colour);
--typo-data-label-m-font-face: 'poppins';
--typo-data-label-m-font-size: 16px;
--typo-data-label-m-font-weight: normal;
--typo-data-label-m-font-style: normal;
--typo-data-label-m-line-height: 1;
--typo-data-label-m-letter-spacing: var(--pattern-letter-spacing-body);
--typo-data-label-m-text-transform: none;
--typo-data-label-m-text-align: left;
--typo-data-label-m-margin-bottom: 0 0 0.7rem;
/* Label S */
--typo-data-label-s-colour: var(--pattern-strong-text-colour);
--typo-data-label-s-font-face: 'poppins';
--typo-data-label-s-font-size: 13px;
--typo-data-label-s-font-weight: normal;
--typo-data-label-s-font-style: normal;
--typo-data-label-s-line-height: 1;
--typo-data-label-s-letter-spacing: var(--pattern-letter-spacing-body);
--typo-data-label-s-text-transform: none;
--typo-data-label-s-text-align: left;
--typo-data-label-s-margin-bottom: 0 0 0.7rem;
/* Label XS */
/* Label 2XS */
/* Data */
/* Data 4XL */
/* Data 3XL */
/* Data 2XL */
/* Data XL */
/* Data L */
--typo-data-l-colour: var(--meta-swatch-colour-3);
--typo-data-l-font-face: 'poppins';
--typo-data-l-font-size: 28px;
--typo-data-l-font-weight: bold;
--typo-data-l-font-style: normal;
--typo-data-l-line-height: 1;
--typo-data-l-letter-spacing: var(--pattern-letter-spacing-body);
--typo-data-l-text-transform: none;
--typo-data-l-text-align: left;
--typo-data-l-margin-bottom: 0 0 0.7rem;
/* Data M */
--typo-data-m-colour: var(--meta-swatch-colour-3);
--typo-data-m-font-face: 'poppins';
--typo-data-m-font-size: 16px;
--typo-data-m-font-weight: bold;
--typo-data-m-font-style: normal;
--typo-data-m-line-height: 1;
--typo-data-m-letter-spacing: var(--pattern-letter-spacing-body);
--typo-data-m-text-transform: none;
--typo-data-m-text-align: left;
--typo-data-m-margin-bottom: 0 0 0.7rem;
/* Data S */
--typo-data-s-colour: var(--meta-swatch-colour-3);
--typo-data-s-font-face: 'poppins';
--typo-data-s-font-size: 13px;
--typo-data-s-font-weight: bold;
--typo-data-s-font-style: normal;
--typo-data-s-line-height: 1;
--typo-data-s-letter-spacing: var(--pattern-letter-spacing-body);
--typo-data-s-text-transform: none;
--typo-data-s-text-align: left;
--typo-data-s-margin-bottom: 0 0 0.7rem;
/* Data XS */
/* Data 2XS */
/* Data 3XS */
/* Forms */
/* Fields */
/* Password show button default */
/* Icon default */
/* Icon active - if not set - the default will be applied */
/* Layout */
--pattern-layout-spacer-top-s: 24px;
--pattern-layout-spacer-sections-s: 32px;
--pattern-layout-spacer-components-s: 24px;
--pattern-layout-spacer-content-s: 8px;
--pattern-layout-spacer-bottom-s: 24px;
--pattern-layout-spacer-top-ml: 32px;
--pattern-layout-spacer-sections-ml: 48px;
--pattern-layout-spacer-components-ml: 32px;
--pattern-layout-spacer-content-ml: 8px;
--pattern-layout-spacer-bottom-ml: 64px;
--layout-icon-size: 24px;
--pattern-icon-size: 18px;
--layout-sub-width: 472px;
/* Colour */
--pattern-interaction-colour: var(--meta-swatch-colour-1);
--pattern-negative-colour: var(--meta-swatch-colour-2);
--pattern-headings-colour: var(--meta-swatch-colour-1);
--pattern-strong-text-colour: var(--meta-swatch-mono-1);
--pattern-subtle-text-colour: var(--meta-swatch-mono-2);
--pattern-disabled-opacity: 0.2;
--pattern-hover-colour: var(--meta-swatch-mono-3);
--pattern-keyline-colour: var(--meta-swatch-mono-7);
--pattern-card-bg-colour: var(--meta-swatch-mono-5);
--pattern-indicator-colour: var(--meta-swatch-colour-5);
--pattern-data-value-colour: var(--meta-swatch-gradient-3);
--pattern-data-whole-colour: var(--meta-swatch-mono-4);
/* Motion */
--motion-hover-transition-duration: 150ms;
--motion-page-transition-duration: 250ms;
--motion-expand-transition-duration: 150ms;
--motion-curve-ease-out: ease-out;
--motion-curve-ease-in-out-back: cubic-bezier(0.530, 0.005, 0.180, 1.410);
/* Effects */
--effect-card-border: none;
--pattern-border-radius-m: 8px;
--effect-card-border-radius: 24px;
--effect-keyline-width: 1px;
--effect-keyline-width-menu: 1px;
--effect-forms-border-width: 1px;
--effects-indicator-width: 4px;
--pattern-elevation-low: 0px 4px 6px -2px rgba(0, 0, 0, 0.12);
--pattern-depression-low: inset 0px 2px 6px rgba(0, 0, 0, 0.1);
--pattern-indicator-width: 2px;
--pattern-card-border: 1px solid var(--meta-swatch-mono-3);
--pattern-keyline-width: 1px;
--navbar-icons-bg-border-radius: 50%;
/* Vars to check if we can delete */
/* elements */
--footer-text-colour: var(--meta-swatch-mono-5);
--footer-text-font-face: var(--typo-p-small-font-face);
--footer-text-font-size: var(--typo-p-small-font-size);
--footer-text-font-weight: var(--typo-p-small-font-weight);
--footer-text-font-style: var(--typo-p-small-font-style);
--footer-text-line-height: var(--typo-p-small-line-height);
--footer-text-letter-spacing: var(--typo-p-small-letter-spacing);
--footer-text-text-transform: var(--typo-p-small-text-transform);
--footer-text-text-align: center;
--footer-text-margin: 0;
/* Footer - Legal */
/* Container */
/* Text */
--footer-legal-text-margin: 1.5rem auto;
--footer-legal-text-colour: var(--meta-swatch-mono-5);
--footer-legal-text-font-face: var(--typo-p-small-font-face);
--footer-legal-text-font-size: var(--typo-p-small-font-size);
--footer-legal-text-font-weight: var(--typo-p-small-font-weight);
--footer-legal-text-font-style: var(--typo-p-small-font-style);
--footer-legal-text-line-height: var(--typo-p-small-line-height);
--footer-legal-text-letter-spacing: var(--typo-p-small-letter-spacing);
--footer-legal-text-text-transform: var(--typo-p-small-text-transform);
--footer-legal-text-text-align: center;
--footer-legal-link-color: var(--meta-swatch-colour-1);
/* Goal row */
/* Block container */
/* Text container */
/* Heading */
/* Sub Heading */
/* Detail container */
/* Score container */
/* Score & target group */
/* Target icon */
/* Low Priority container */
/* Low Priority label */
/* Action container */
/* Score indicator layout */
/* Score indicator label */
/* Score indicator On (Reached) */
/* Score indicator OFF (Not reached) */
/* Score indicator TARGET */
/* Badge container */
/* Badge label */
/* Goal row header */
/* Block container */
/* Detail container */
/* Icon */
/* Label & Icon containers */
/* Labels */
/* Knowledge Section Container */
--knowledge-section-container-margin: 0 0 12px;
/* Knowledge Item */
/* Container */
--knowledge-item-bg-colour: transparent;
/* Indicator */
--knowledge-item-indicator-width: var(--pattern-indicator-width);
--knowledge-item-indicator-on-colour: transparent;
--knowledge-item-indicator-off-colour: transparent;
--knowledge-item-indicator-hover-colour: transparent;
/* Keylines */
--knowledge-item-keyline: 12px solid transparent;
--knowledge-item-keyline-last: none;
--knowledge-item-keyline-margin: 0;
--knowledge-item-keyline-max-width: 720px;
/* Button */
--knowledge-item-btn-min-height: 100%;
--knowledge-item-btn-max-width: 100%;
--knowledge-item-btn-margin: 0 0 12px;
--knowledge-item-btn-padding: 16px;
--knowledge-item-btn-bg-colour: transparent;
--knowledge-item-btn-border: 2px solid var(--meta-swatch-colour-1);
--knowledge-item-btn-border-radius-first: var(--btn-border-radius);
--knowledge-item-btn-border-radius: var(--btn-border-radius);
--knowledge-item-btn-border-radius-last: var(--btn-border-radius);
--knowledge-item-btn-box-shadow: none;
/* Description */
/* Graphics layout */
/* Image layout */
/* Status icon layout */
/* Dynamic statuses (colours) */
/* Labels container */
--knowledge-item-labels-padding: 0;
/* Label */
--knowledge-item-label-colour: var(--typo-p-small-colour);
--knowledge-item-label-font-family: var(--typo-p-small-font-face);
--knowledge-item-label-font-size: var(--typo-p-small-font-size);
--knowledge-item-label-weight: var(--typo-p-small-font-weight);
--knowledge-item-label-font-weight: var(--typo-p-small-font-weight);
--knowledge-item-label-font-style: var(--typo-p-small-font-style);
--knowledge-item-label-line-height: var(--typo-p-small-line-height);
--knowledge-item-label-letter-spacing: var(--typo-p-small-letter-spacing);
--knowledge-item-label-text-transform: var(--typo-p-small-text-transform);
--knowledge-item-label-align: var(--typo-p-small-text-align);
--knowledge-item-label-text-align: var(--typo-p-small-text-align);
--knowledge-item-label-padding: 0;
/* Status label */
--knowledge-item-status-label-display: none;
/* Action icon */
--knowledge-item-action-bg-height: 32px;
--knowledge-item-action-bg-width: 24px;
--knowledge-item-action-bg-margin: none;
--knowledge-item-action-icon-color: var(--meta-swatch-colour-1);
--knowledge-item-action-icon-size: var(--pattern-icon-size);
/* Time stamp container */
/* Time label */
/* Time icon */
/* Knowledge Section Header */
/* Container */
--knowledge-section-margin: 0 0 8px;
/* Keylines */
--knowledge-section-keyline-top-margin: 0px 16px;
--knowledge-section-keyline-top-first: none;
--knowledge-section-keyline-top: 1px solid var(--meta-swatch-mono-7);
--knowledge-section-keyline-bottom-margin: 0px 16px;
--knowledge-section-keyline-bottom: none;
/* Icon */
--knowledge-section-icon-display: none;
/* Heading */
--knowledge-section-heading-colour: var(--typo-h-medium-colour);
--knowledge-section-heading-font-family: var(--typo-h-medium-font-face);
--knowledge-section-heading-size: var(--typo-h-medium-font-size);
--knowledge-section-heading-font-weight: var(--typo-h-medium-font-weight);
--knowledge-section-heading-font-style: var(--typo-h-medium-font-style);
--knowledge-section-heading-line-height: var(--typo-h-medium-line-height);
--knowledge-section-heading-letter-spacing: var(--typo-h-medium-letter-spacing);
--knowledge-section-heading-text-transform: var(--typo-h-medium-text-transform);
--knowledge-section-heading-text-align: var(--typo-h-medium-text-align);
/* Sub heading */
--knowledge-section-sub-heading-colour: var(--meta-swatch-mono-1);
--knowledge-section-sub-heading-font-family: var(--typo-p-medium-font-face);
--knowledge-section-sub-heading-size: var(--typo-p-medium-font-size);
--knowledge-section-sub-heading-font-weight: var(--typo-p-medium-font-weight);
--knowledge-section-sub-heading-font-style: var(--typo-p-medium-font-style);
--knowledge-section-sub-heading-line-height: var(--typo-p-medium-line-height);
--knowledge-section-sub-heading-letter-spacing: var(--typo-p-medium-letter-spacing);
--knowledge-section-sub-heading-text-transform: var(--typo-p-medium-text-transform);
--knowledge-section-sub-heading-text-align: left;
/* Spacing */
--knowledge-section-spacer-top: 24px;
--knowledge-section-spacer-middle: 0;
--knowledge-section-spacer-bottom: 8px;
/* Marketplace */
/* Container */
--marketplace-container-background: transparent;
--marketplace-container-padding: 0;
/* Content container */
--marketplace-content-container-background: transparent;
--marketplace-content-container-padding: 0;
/* Grid container */
--marketplace-grid-container-background: #B9D5CA;
--marketplace-grid-container-padding: 24px;
--marketplace-grid-container-border-radius: 12px;
--marketplace-grid-container-padding-ml: 50px 150px;
--marketplace-grid-container-border-radius-ml: 12px;
/* Grid */
--marketplace-grid-columns: 3;
--marketplace-grid-rows: 3;
--marketplace-grid-column-gap: 24px;
--marketplace-grid-row-gap: 24px;
--marketplace-grid-columns-ml: 3;
--marketplace-grid-rows-ml: 3;
--marketplace-grid-column-gap-ml: 40px;
--marketplace-grid-row-gap-ml: 40px;
/* Headings container */
--marketplace-headings-container-background: transparent;
--marketplace-headings-container-padding: 0;
/* Heading */
--marketplace-heading-colour: var(--typo-h-medium-colour);
--marketplace-heading-font-face: var(--typo-h-medium-font-face);
--marketplace-heading-font-size: var(--typo-h-medium-font-size);
--marketplace-heading-font-weight: var(--typo-h-medium-font-weight);
--marketplace-heading-font-style: var(--typo-h-medium-font-style);
--marketplace-heading-line-height: var(--typo-h-medium-line-height);
--marketplace-heading-letter-spacing: var(--typo-h-medium-letter-spacing);
--marketplace-heading-text-transform: var(--typo-h-medium-text-transform);
--marketplace-heading-text-align: var(--typo-h-medium-text-align);
--marketplace-heading-margin: var(--typo-h-medium-margin);
/* Sub heading */
--marketplace-sub-heading-colour: var(--typo-p-medium-colour);
--marketplace-sub-heading-font-face: var(--typo-p-medium-font-face);
--marketplace-sub-heading-font-size: var(--typo-p-medium-font-size);
--marketplace-sub-heading-font-weight: var(--typo-p-medium-font-weight);
--marketplace-sub-heading-font-style: var(--typo-p-medium-font-style);
--marketplace-sub-heading-line-height: var(--typo-p-medium-line-height);
--marketplace-sub-heading-letter-spacing: var(--typo-p-medium-letter-spacing);
--marketplace-sub-heading-text-transform: var(--typo-p-medium-text-transform);
--marketplace-sub-heading-text-align: var(--typo-p-medium-text-align);
--marketplace-sub-heading-margin: var(--typo-p-medium-margin);
/* Marketplace Grid Item */
/* Image container */
--marketplace-grid-item-image-width: 80px;
--marketplace-grid-item-image-height: auto;
--marketplace-grid-item-image-padding: 0;
--marketplace-grid-item-image-border-radius: 16px;
--marketplace-grid-item-image-margin: 0 0 6px 0;
--marketplace-grid-item-image-width-ml: 100px;
--marketplace-grid-item-image-height-ml: auto;
--marketplace-grid-item-image-padding-ml: 0;
--marketplace-grid-item-image-border-radius-ml: 16px;
/* Image container - Partner */
--marketplace-grid-item-image-partner-background: transparent;
--marketplace-grid-item-image-partner-border: none;
--marketplace-grid-item-image-partner-box-shadow: none;
/* Image container - Group */
--marketplace-grid-item-image-group-background: transparent;
--marketplace-grid-item-image-group-border: none;
--marketplace-grid-item-image-group-box-shadow: none;
/* Label */
--marketplace-grid-item-label-colour: var(--typo-p-small-colour);
--marketplace-grid-item-label-font-family: var(--typo-p-small-font-face);
--marketplace-grid-item-label-font-size: var(--typo-p-small-font-size);
--marketplace-grid-item-label-font-weight: var(--typo-p-small-font-weight);
--marketplace-grid-item-label-font-style: var(--typo-p-small-font-style);
--marketplace-grid-item-label-line-height: var(--typo-p-small-line-height);
--marketplace-grid-item-label-letter-spacing: var(--typo-p-small-letter-spacing);
--marketplace-grid-item-label-text-transform: var(--typo-p-small-text-transform);
--marketplace-grid-item-label-text-align: center;
--marketplace-grid-item-label-margin: 0;
--marketplace-grid-item-label-text-shadow: none;
--marketplace-grid-item-label-ml-colour: var(--typo-p-medium-colour);
--marketplace-grid-item-label-ml-font-family: var(--typo-p-medium-font-face);
--marketplace-grid-item-label-ml-font-size: var(--typo-p-medium-font-size);
--marketplace-grid-item-label-ml-font-weight: var(--typo-p-medium-font-weight);
--marketplace-grid-item-label-ml-font-style: var(--typo-p-medium-font-style);
--marketplace-grid-item-label-ml-line-height: var(--typo-p-medium-line-height);
--marketplace-grid-item-label-ml-letter-spacing: var(--typo-p-medium-letter-spacing);
--marketplace-grid-item-label-ml-text-transform: var(--typo-p-medium-text-transform);
--marketplace-grid-item-label-ml-text-align: center;
--marketplace-grid-item-label-ml-margin: 0;
--marketplace-grid-item-label-ml-text-shadow: none;
/* Partner Label */
--marketplace-grid-partner-colour: var(--typo-p-small-colour);
--marketplace-grid-partner-font-family: var(--typo-p-small-font-face);
--marketplace-grid-partner-font-size: var(--typo-p-small-font-size);
--marketplace-grid-partner-font-weight: var(--typo-p-small-font-weight);
--marketplace-grid-partner-font-style: var(--typo-p-small-font-style);
--marketplace-grid-partner-line-height: var(--typo-p-small-line-height);
--marketplace-grid-partner-letter-spacing: var(--typo-p-small-letter-spacing);
--marketplace-grid-partner-text-transform: var(--typo-p-small-text-transform);
--marketplace-grid-partner-text-align: center;
--marketplace-grid-partner-margin: var(--typo-p-small-margin);
--marketplace-grid-partner-text-shadow: none;
--marketplace-grid-partner-ml-colour: #222222;
--marketplace-grid-partner-ml-font-family: var(--typo-p-medium-font-face);
--marketplace-grid-partner-ml-font-size: var(--typo-p-medium-font-size);
--marketplace-grid-partner-ml-font-weight: var(--typo-p-medium-font-weight);
--marketplace-grid-partner-ml-font-style: var(--typo-p-medium-font-style);
--marketplace-grid-partner-ml-line-height: var(--typo-p-medium-line-height);
--marketplace-grid-partner-ml-letter-spacing: var(--typo-p-medium-letter-spacing);
--marketplace-grid-partner-ml-text-transform: var(--typo-p-medium-text-transform);
--marketplace-grid-partner-ml-text-align: center;
--marketplace-grid-partner-ml-margin: var(--typo-p-medium-margin);
--marketplace-grid-partner-ml-text-shadow: none;
/* Partner Description */
/* Marketplace Grid Badge */
/* Container */
--marketplace-grid-badge-padding: 0 4px 0 2px;
--marketplace-grid-badge-border-radius: 12px;
/* Icon */
--marketplace-grid-badge-icon-size: 18px;
--marketplace-grid-badge-icon-margin: 0 2px 0 0;
/* Label */
--marketplace-grid-badge-label-font-size: var(--typo-p-small-font-size);
--marketplace-grid-badge-label-font-face: var(--typo-p-small-font-face);
--marketplace-grid-badge-label-font-weight: var(--typo-p-small-font-weight);
--marketplace-grid-badge-label-font-style: var(--typo-p-small-font-style);
--marketplace-grid-badge-label-line-height: 1;
--marketplace-grid-badge-label-letter-spacing: var(--typo-p-small-letter-spacing);
--marketplace-grid-badge-label-text-transform: var(--typo-p-small-text-transform);
--marketplace-grid-badge-label-text-align: left;
--marketplace-grid-badge-label-padding: 0;
/* State - Positive */
--marketplace-grid-badge-positive-background: var(--meta-swatch-mono-5);
--marketplace-grid-badge-positive-border: none;
--marketplace-grid-badge-positive-box-shadow: drop-shadow(0px 4px 6px rgba(0, 0, 0, 0.4));
--marketplace-grid-badge-positive-icon-color: var(--meta-swatch-colour-3);
--marketplace-grid-badge-label-positive-colour: var(--meta-swatch-mono-2);
/* State - Negative */
--marketplace-grid-badge-negative-background: var(--meta-swatch-mono-5);
--marketplace-grid-badge-negative-border: none;
--marketplace-grid-badge-negative-box-shadow: drop-shadow(0px 4px 6px rgba(0, 0, 0, 0.4));
--marketplace-grid-badge-negative-icon-color: var(--meta-swatch-colour-4);
--marketplace-grid-badge-label-negative-colour: var(--meta-swatch-mono-2);
/* State - Unknown */
--marketplace-grid-badge-unknown-background: var(--meta-swatch-mono-5);
--marketplace-grid-badge-unknown-border: none;
--marketplace-grid-badge-unknown-box-shadow: drop-shadow(0px 4px 6px rgba(0, 0, 0, 0.4));
--marketplace-grid-badge-unknown-icon-color: var(--meta-swatch-colour-1);
--marketplace-grid-badge-label-unknown-colour: var(--meta-swatch-mono-2);
/* Marketplace Modal Badge */
/* Container */
/* Icon */
/* Label */
/* State - Positive */
/* State - Negative */
/* State - Unknown */
/* Marketplace Group Item */
/* Container */
--marketplace-group-item-background: transparent;
--marketplace-group-item-padding: 8px 16px;
/* Image */
--marketplace-group-item-image-width: 38px;
--marketplace-group-item-image-height: 38px;
--marketplace-group-item-image-size: cover;
--marketplace-group-item-image-background: var(--meta-swatch-mono-4);
--marketplace-group-item-image-border-radius: 8px;
--marketplace-group-item-image-border: none;
--marketplace-group-item-image-margin: 8px 12px 8px 0;
/* Heading */
--marketplace-group-item-heading-colour: var(--typo-h-small-colour);
--marketplace-group-item-heading-font-face: var(--typo-h-small-font-face);
--marketplace-group-item-heading-font-size: 16px;
--marketplace-group-item-heading-font-weight: var(--typo-h-small-font-weight);
--marketplace-group-item-heading-font-style: var(--typo-h-small-font-style);
--marketplace-group-item-heading-line-height: var(--typo-h-small-line-height);
--marketplace-group-item-heading-letter-spacing: var(--typo-h-small-letter-spacing);
--marketplace-group-item-heading-text-transform: var(--typo-h-small-text-transform);
--marketplace-group-item-heading-text-align: var(--typo-h-small-text-align);
--marketplace-group-item-heading-margin: var(--typo-h-small-margin);
/* Explainer */
--marketplace-group-item-explainer-colour: var(--typo-p-small-colour);
--marketplace-group-item-explainer-font-size: var(--typo-p-small-font-size);
--marketplace-group-item-explainer-font-face: var(--typo-p-small-font-face);
--marketplace-group-item-explainer-font-weight: var(--typo-p-small-font-weight);
--marketplace-group-item-explainer-font-style: var(--typo-p-small-font-style);
--marketplace-group-item-explainer-line-height: var(--typo-p-small-line-height);
--marketplace-group-item-explainer-letter-spacing: var(--typo-p-small-letter-spacing);
--marketplace-group-item-explainer-text-transform: var(--typo-p-small-text-transform);
--marketplace-group-item-explainer-text-align: var(--typo-p-small-text-align);
--marketplace-group-item-explainer-margin: var(--typo-p-small-margin);
/* Nested badge block */
/* Icon container */
--marketplace-group-item-icon-container-display: flex;
--marketplace-group-item-icon-container-background: var(--btn-minor-icon-bg-color);
--marketplace-group-item-icon-container-margin: 0 0 0 8px;
--marketplace-group-item-icon-container-border-radius: var(--btn-icon-border-radius);
--marketplace-group-item-icon-container-border: var(--btn-minor-icon-border);
/* Icon */
--marketplace-group-item-icon-size: 24px;
--marketplace-group-item-icon-colour: var(--btn-minor-icon-color);
/* Keyline top */
/* Keyline bottom */
--marketplace-group-item-keyline-bottom-border-bottom: 1px solid var(--meta-swatch-mono-8);
--marketplace-group-item-keyline-bottom-padding: 4px;
/* Module Nav */
/* Container */
/* Module nav items */
/* Modal grid */
/* Item */
/* Item button */
/* Nav bars - App */
/* Logo */
--nav-top-logo-width: auto;
--nav-top-logo-height: 40px;
/* Top background */
--theme-nav-top-bg-colour: var(--meta-swatch-mono-4);
--app-top-nav-height: 64px;
/* Top keyline */
--theme-nav-top-keyline: 1px solid var(--meta-swatch-mono-7);
/* Top indicator */
--theme-nav-top-indicator-off-colour: transparent;
--theme-nav-top-indicator-on-colour: var(--meta-swatch-colour-4);
--theme-nav-top-indicator-hover-colour: transparent;
/* Top icons */
--nav-top-icon-size: var(--pattern-icon-size);
--nav-top-icon-position: 10px;
--theme-nav-top-icon-bg-colour: transparent;
--theme-nav-top-icon-off-colour: var(--meta-swatch-colour-1);
--theme-nav-top-icon-on-colour: var(--meta-swatch-colour-1);
/* Top labels */
--nav-top-label-position: 35px;
--nav-top-label-font-family: 'poppins';
--nav-top-label-font-size: 12px;
--nav-top-label-font-weight: normal;
--nav-top-label-font-style: normal;
--nav-top-label-line-height: 1;
--nav-top-label-letter-spacing: 0;
--nav-top-label-text-transform: none;
--nav-top-label-text-align: center;
--theme-nav-top-label-off-colour: var(--meta-swatch-colour-1);
--theme-nav-top-label-on-colour: var(--meta-swatch-colour-1);
/* Bottom background */
--theme-nav-bottom-bg-colour: var(--meta-swatch-mono-5);
/* Bottom keyline */
--theme-nav-bottom-keyline: 1px solid var(--meta-swatch-mono-7);
/* Bottom indicator */
--theme-nav-bottom-indicator-off-colour: transparent;
--theme-nav-bottom-indicator-on-colour: var(--meta-swatch-colour-4);
--theme-nav-bottom-indicator-hover-colour: var(--meta-swatch-colour-4);
/* Bottom icons */
--nav-bottom-icon-size: var(--pattern-icon-size);
--nav-bottom-icon-position: 6px;
--theme-nav-bottom-icon-bg-colour: transparent;
--theme-nav-bottom-icon-off-colour: var(--meta-swatch-colour-1);
--theme-nav-bottom-icon-on-colour: var(--meta-swatch-colour-1);
/* Bottom labels */
--nav-bottom-label-position: 26px;
--nav-bottom-label-font-family: 'poppins';
--nav-bottom-label-font-size: 12px;
--nav-bottom-label-font-weight: normal;
--nav-bottom-label-font-style: normal;
--nav-bottom-label-line-height: 1;
--nav-bottom-label-letter-spacing: 0;
--nav-bottom-label-text-transform: none;
--nav-bottom-label-text-align: center;
--theme-nav-bottom-label-off-colour: var(--meta-swatch-colour-1);
--theme-nav-bottom-label-on-colour: var(--meta-swatch-colour-1);
/* Nav bar - Web */
/* Block container */
--nav-bar-web-background: #F8F8F8;
--nav-bar-web-background-m: #F8F8F8;
--nav-bar-web-background-l: #F8F8F8;
--nav-bar-web-padding-top: 0px;
--nav-bar-web-padding-top-m: 0px;
--nav-bar-web-padding-top-l: 0px;
--nav-bar-web-padding-bottom: 0px;
--nav-bar-web-padding-bottom-m: 0px;
--nav-bar-web-padding-bottom-l: 0px;
--nav-bar-web-border-bottom: none;
--nav-bar-web-grid-max-width: 900px;
/* Content */
--nav-bar-web-content-align-items: center;
/* Logo */
--nav-bar-web-logo-height: 36px;
--nav-bar-web-logo-height-m: 36px;
--nav-bar-web-logo-height-l: 36px;
/* Icons container */
/* Icons -> Profile */
/* Profile text */
/* Icons -> Icon */
--nav-bar-web-icon-size: var(--pattern-icon-size);
--nav-bar-web-icon-menu-color: var(--meta-swatch-colour-1);
--nav-bar-web-icon-close-color: var(--meta-swatch-colour-1);
/* Links container */
--nav-bar-web-links-gap: 0;
--nav-bar-web-links-gap-m: 36px;
--nav-bar-web-links-gap-l: 36px;
/* Links container collapsed*/
--nav-bar-web-links-collapsed-padding: 0px;
--nav-bar-web-links-collapsed-height: 100%;
/* Link container */
--nav-bar-web-link-border-bottom: 1px solid var(--meta-swatch-mono-2);
--nav-bar-web-link-border-bottom-m: none;
--nav-bar-web-link-border-bottom-l: none;
--nav-bar-web-link-height: 48px;
--nav-bar-web-link-colour: var(--meta-swatch-colour-1);
--nav-bar-web-link-colour-hover: var(--meta-swatch-colour-1);
--nav-bar-web-link-text-decoration-hover: underline;
/* Current link highlights */
--nav-bar-web-link-current-label-colour: var(--meta-swatch-colour-1);
--nav-bar-web-link-current-label-colour-hover: var(--meta-swatch-colour-1);
/* Page Actions */
/* Container */
/* Label */
/* Buttons container */
/* Button */
/* Button label */
/* Button icon */
--page-actions-button-icon-size: 24px;
--page-actions-button-icon-colour: var(--meta-swatch-colour-1);
--page-actions-button-icon-margin: 8px 0 0 0;
/* Repeater */
/* Block Container */
--repeater-padding: 32px 16px 24px;
--repeater-margin: 0;
--repeater-background: var(--meta-swatch-colour-1);
/* Content Container */
/* Heading */
--repeater-heading-colour: var(--typo-h-medium-colour);
--repeater-heading-font-family: var(--typo-h-medium-font-family);
--repeater-heading-font-size: var(--typo-h-medium-font-size);
--repeater-heading-font-size-m: var(--typo-h-medium-font-size);
--repeater-heading-font-size-l: var(--typo-h-medium-font-size);
--repeater-heading-font-weight: var(--typo-h-medium-font-weight);
--repeater-heading-font-style: var(--typo-h-medium-font-style);
--repeater-heading-line-height: var(--typo-h-medium-line-height);
--repeater-heading-letter-spacing: var(--typo-h-medium-letter-spacing);
--repeater-heading-text-transform: var(--typo-h-medium-text-transform);
--repeater-heading-text-align: var(--typo-h-medium-text-align);
--repeater-heading-text-padding: 0;
--repeater-heading-text-margin: 0 0 8px;
/* Sub heading */
--repeater-sub-heading-colour: var(--typo-p-medium-colour);
--repeater-sub-heading-font-family: var(--typo-p-medium-font-family);
--repeater-sub-heading-font-size: var(--typo-p-medium-font-size);
--repeater-sub-heading-font-size-m: var(--typo-p-medium-font-size);
--repeater-sub-heading-font-size-l: var(--typo-p-medium-font-size);
--repeater-sub-heading-font-weight: var(--typo-p-medium-font-weight);
--repeater-sub-heading-font-style: var(--typo-p-medium-font-style);
--repeater-sub-heading-line-height: var(--typo-p-medium-line-height);
--repeater-sub-heading-letter-spacing: var(--typo-p-medium-letter-spacing);
--repeater-sub-heading-text-transform: var(--typo-p-medium-text-transform);
--repeater-sub-heading-text-align: left;
--repeater-sub-heading-text-padding: 0;
/* Empty state paragraph */
--empty-p-colour: var(--meta-swatch-mono-5);
--empty-p-font-size: var(--typo-p-medium-font-size);
--empty-p-font-family: 'face1';
--empty-p-font-weight: 390;
--empty-p-font-style: normal;
--empty-p-line-height: 1.2;
--empty-p-letter-spacing: 0;
--empty-p-text-transform: none;
--empty-p-text-align: center;
--empty-p-padding: 40px 0 80px;
--empty-p-background: transparent;
--empty-p-border-radius: var(--pattern-border-radius);
/* Dots */
--repeater-dots-padding: 16px;
--repeater-dot-padding: 5px;
--repeater-dot-size: 8px;
/* Arrows - NEED REFACTOR AND ADD PROPER VARS */
--app-card-slider-button-icon-color: var(--meta-swatch-colour-1);
--app-card-slider-button-icon-size: var(--pattern-icon-size);
/* Link */
--repeater-link-colour: var(--typo-data-label-l-colour);
--repeater-link-font-size: var(--typo-data-label-l-font-size);
--repeater-link-font-family: var(--typo-data-label-l-font-family);
--repeater-link-font-weight: var(--typo-data-label-l-font-weight);
--repeater-link-font-style: var(--typo-data-label-l-font-style);
--repeater-link-line-height: var(--typo-data-label-l-line-height);
--repeater-link-letter-spacing: var(--typo-data-label-l-letter-spacing);
--repeater-link-text-transform: var(--typo-data-label-l-text-transform);
--repeater-link-margin: 0 auto;
--repeater-link-padding: 0;
--repeater-link-padding-m: 0;
--repeater-link-padding-l: 0;
--repeater-link-width: 100%;
--repeater-link-width-m: 100%;
--repeater-link-width-l: 100%;
/* Carousel Container */
--repeater-carousel-container-padding: 0;
/* Items Container */
--repeater-items-padding-top: 0px;
--repeater-items-padding-right: 0px;
--repeater-items-padding-bottom: 0px;
--repeater-items-padding-left: 0px;
--repeater-items-margin: 0;
--repeater-items-columns: repeat(1, 1fr);
--repeater-items-col-gap: 24px;
--repeater-items-row-gap: 24px;
--repeater-items-slick-list-padding: 16px 0;
--repeater-items-columns-m: repeat(2, 1fr);
--repeater-items-columns-l: repeat(2, 1fr);
/* Item */
--repeater-item-margin: 0 6px;
--repeater-item-slider-gap: 12px;
/* Button icon */
/* Option 1 */
--opt1-block-border-radius: var(--card-border-radius);
--opt1-block-border-radius-m: var(--card-border-radius);
--opt1-block-border-radius-l: var(--card-border-radius);
--opt1-block-background: #EEEEEE;
--opt1-content-background: transparent;
--opt1-heading-color: var(--meta-swatch-colour-1);
--opt1-sub-heading-color: var(--meta-swatch-mono-1);
--opt1-empty-p-colour: var(--meta-swatch-mono-1);
--opt1-empty-p-background: transparent;
--opt1-link-color: var(--meta-swatch-colour-1);
--opt1-link-background: transparent;
--opt1-pager-icons-color: var(--meta-swatch-colour-1);
--opt1-pager-dot-on-color: #009754;
--opt1-pager-dot-off-color: var(--meta-swatch-mono-2);
/* Option 2 */
/* Option 3 */
/* Option 4 */
/* Option 5 */
/* Repeater Item / Card */
/* Block container */
--card-background: var(--meta-swatch-mono-5);
--card-border: none;
--card-border-radius: 8px;
--card-box-shadow: 0;
/* Image wrapper */
/* Image */
/* Play icon */
--card-play-icon-size: 80px;
--card-play-icon-color: rgba(255,255,255,0.8);
/* Content */
/* Body */
--card-body-padding: 16px;
--card-body-padding-m: 16px;
--card-body-padding-l: 16px;
--card-heading-colour: var(--meta-swatch-colour-1);
--card-heading-font-family: var(--typo-h-medium-font-face);
--card-heading-font-size: 24px;
--card-heading-font-size-m: 24px;
--card-heading-font-size-l: 24px;
--card-heading-font-weight: var(--typo-h-medium-font-weight);
--card-heading-font-style: var(--typo-h-medium-font-style);
--card-heading-line-height: var(--typo-h-medium-line-height);
--card-heading-letter-spacing: 0;
--card-heading-text-transform: none;
--card-heading-text-align: left;
--card-heading-padding: 0 0 8px;
--card-heading-padding-m: 0 0 8px;
--card-heading-padding-l: 0 0 8px;
--card-excerpt-colour: var(--typo-p-medium-colour);
--card-excerpt-font-family: var(--typo-p-medium-font-face);
--card-excerpt-font-size: var(--typo-p-medium-font-size);
--card-excerpt-font-weight: var(--typo-p-medium-font-weight);
--card-excerpt-font-style: var(--typo-p-medium-font-style);
--card-excerpt-line-height: var(--typo-p-medium-line-height);
--card-excerpt-label-spacing: var(--typo-p-medium-letter-spacing);
--card-excerpt-text-transform: var(--typo-p-medium-text-transform);
--card-excerpt-text-align: left;
--card-excerpt-padding: 0;
--card-excerpt-padding-m: 0;
--card-excerpt-padding-l: 0;
/* Footer */
--card-footer-padding: 0 16px 16px;
/* Badge */
--card-footer-badge-label-colour: var(--typo-p-small-colour);
--card-footer-badge-label-font-family: var(--typo-p-small-font-family);
--card-footer-badge-label-font-size: var(--typo-p-small-font-size);
--card-footer-badge-label-font-weight: var(--typo-p-small-font-weight);
--card-footer-badge-label-font-style: var(--typo-p-small-font-style);
--card-footer-badge-label-line-height: var(--typo-p-small-line-height);
--card-footer-badge-label-spacing: var(--typo-p-small-letter-spacing);
--card-footer-badge-label-text-transform: var(--typo-p-small-text-transform);
--card-footer-badge-label-text-align: left;
--card-footer-badge-label-padding: 0 4px;
/* Icon */
--card-label-icon-size: var(--pattern-icon-size);
--card-label-icon-color: var(--meta-swatch-colour-1);
/* Label */
--card-label-colour: var(--typo-p-small-colour);
--card-label-font-family: var(--typo-p-small-font-family);
--card-label-font-size: var(--typo-p-small-font-size);
--card-label-font-weight: var(--typo-p-small-font-weight);
--card-label-font-style: var(--typo-p-small-font-style);
--card-label-line-height: var(--typo-p-small-line-height);
--card-label-label-spacing: var(--typo-p-small-letter-spacing);
--card-label-text-transform: var(--typo-p-small-text-transform);
--card-label-text-align: left;
--card-label-padding: 0 4px;
/* Indicator */
/* Action icon (favourite / save etc.) */
--card-action-icon-size: var(--pattern-icon-size);
--card-action-icon-color: var(--meta-swatch-colour-1);
/* Share Save */
/* Sidebar */
/* Sidebar */
/* Open button */
/* Page header */
--sidebar-page-header-keyline: 1px solid var(--meta-swatch-mono-7);
--sidebar-page-template-keyline: var(--sidebar-page-header-keyline);
/* Page footer */
--sidebar-page-footer-keyline: var(--sidebar-page-header-keyline);
/* Table List */
/* Item */
--tl-icon-margin: 0;
--tl-icon-padding: 22px 0;
--tl-icon-keyline: 1px solid var(--meta-swatch-mono-8);
--tl-item-margin: 0;
--tl-item-padding: 16px 0;
--tl-item-keyline: 1px solid var(--meta-swatch-mono-7);
--tl-item-border-width: 0 0 1px 0;
--tl-item-border-color: var(--meta-swatch-mono-7);
--tl-item-border-style: solid;
--tl-item-direction: row;
--tl-item-align-items: center;
--tl-item-justify-content: space-between;
/* Content container */
/* Label container */
/* Label */
--tl-item-label-colour: var(--typo-p-medium-colour);
--tl-item-label-font-family: var(--typo-p-medium-font-face);
--tl-item-label-font-size: var(--typo-p-medium-font-size);
--tl-item-label-font-weight: var(--typo-p-medium-font-weight);
--tl-item-label-font-style: var(--typo-p-medium-font-style);
--tl-item-label-line-height: var(--typo-p-medium-line-height);
--tl-item-label-letter-spacing: var(--typo-p-medium-letter-spacing);
--tl-item-label-text-transform: var(--typo-p-medium-text-transform);
--tl-item-label-text-align: left;
/* Badge */
/* Sub header */
/* Label Info */
/* Value */
--tl-item-value-colour: var(--typo-p-medium-colour);
--tl-item-value-font-family: var(--typo-p-medium-font-face);
--tl-item-value-font-size: var(--typo-p-medium-font-size);
--tl-item-value-font-weight: 500;
--tl-item-value-font-style: var(--typo-p-medium-font-style);
--tl-item-value-line-height: var(--typo-p-medium-line-height);
--tl-item-value-letter-spacing: var(--typo-p-medium-letter-spacing);
--tl-item-value-text-transform: var(--typo-p-medium-text-transform);
--tl-item-value-text-align: var(--typo-p-medium-text-align);
/* Icon */
--tl-item-icon-bg-size: var(--pattern-icon-size);
--tl-item-icon-padding: 0;
--tl-item-icon-margin: 0;
--tl-item-icon-border-radius: 0;
--tl-item-icon-bg-colour: transparent;
--tl-item-icon-colour: var(--meta-swatch-colour-1);
--tl-item-icon-size: 18px;
/* Tabs */
/* Tabs */
/* Tab - off */
/* Tab - on */
/* Tab - back */
/* Targeted Links */
/* Block container */
--targeted-links-padding: 0 0 12px 0;
--targeted-links-padding-m: 0 0 32px 0;
--targeted-links-padding-l: 0 0 32px 0;
--targeted-links-background: #EEEEEE;
/* Grid container */
/* Heading block overrides */
/* Carousel Nav */
--targeted-links-dots-padding: 16px;
--targeted-links-dots-gap: 5px;
--targeted-links-dots-size: 8px;
--targeted-links-dots-on-color: #009754;
--targeted-links-dots-off-color: var(--meta-swatch-mono-2);
--targeted-links-button-icon-size: 24px;
--targeted-links-button-icon-color: var(--meta-swatch-colour-1);
/* Whole block style options */
/* Option 1 */
/* Option 2 */
/* Option 3 */
/* Item styles (old, but still in use) */
/* Item container */
/* Cover image */
--targeted-links-cover-image-padding: 24px;
--targeted-links-cover-image-padding-m: 24px;
--targeted-links-cover-image-padding-l: 24px;
--targeted-links-cover-image-height: 200px;
--targeted-links-cover-image-height-m: 200px;
--targeted-links-cover-image-height-l: 200px;
--targeted-links-cover-image-object-fit: contain;
--targeted-links-item-cover-image-padding: 24px;
--targeted-links-item-cover-image-padding-m: 24px;
--targeted-links-item-cover-image-padding-l: 24px;
--targeted-links-item-cover-image-height: 200px;
--targeted-links-item-cover-image-height-m: auto;
--targeted-links-item-cover-image-height-l: auto;
--targeted-links-item-cover-image-width-m: 50%;
--targeted-links-item-cover-image-width-l: 50%;
--targeted-links-item-cover-image-object-fit: contain;
/* Body */
/* Header */
/* Icon */
/* Heading */
/* Paragraph */
/* Inline image */
/* Buttons container */
/* Button block overrides */
/* Item style option overrides */
/* Option 1 */
--targeted-links-item-background-opt1: var(--meta-swatch-colour-5);
/* Option 2 */
--targeted-links-item-background-opt2: url(/config/images/yellow-box-bg.png) no-repeat top center cover var(--meta-swatch-colour-5);
/* Option 3 */
/* Option 4 */
/* Option 5 */
/* Targeted Links Item / Card */
/* Option 1 */
/* New external container */
/* Item container */
--targeted-links-item-opt1-background: var(--meta-swatch-mono-5);
--targeted-links-item-opt1-border-radius: 12px;
--targeted-links-item-opt1-box-shadow: 0;
--targeted-links-item-opt1-flex-direction: column;
--targeted-links-item-opt1-flex-direction-m: row;
--targeted-links-item-opt1-flex-direction-l: row;
/* Cover image */
--targeted-links-item-cover-image-opt1-padding: 0;
--targeted-links-item-cover-image-opt1-padding-m: 0;
--targeted-links-item-cover-image-opt1-padding-l: 0;
--targeted-links-item-cover-image-opt1-width: 100%;
--targeted-links-item-cover-image-opt1-width-m: 50%;
--targeted-links-item-cover-image-opt1-height-m: 100%;
--targeted-links-item-cover-image-opt1-width-l: 50%;
--targeted-links-item-cover-image-opt1-height-l: 100%;
--targeted-links-item-cover-image-opt1-object-fit: cover;
/* Body */
--targeted-links-item-body-opt1-padding: 28px;
--targeted-links-item-body-opt1-padding-m: 28px;
--targeted-links-item-body-opt1-padding-l: 28px;
--targeted-links-item-body-opt1-gap: 0;
--targeted-links-item-body-opt1-gap-m: 0;
--targeted-links-item-body-opt1-gap-l: 0;
/* Header */
--targeted-links-item-header-opt1-padding: 0 0 16px;
--targeted-links-item-header-opt1-padding-m: 0 0 16px;
--targeted-links-item-header-opt1-padding-l: 0 0 16px;
--targeted-links-item-header-opt1-justify-content: left;
--targeted-links-item-header-opt1-justify-content-m: left;
--targeted-links-item-header-opt1-justify-content-l: left;
--targeted-links-item-header-opt1-align-items: left;
--targeted-links-item-header-opt1-align-items-m: left;
--targeted-links-item-header-opt1-align-items-l: left;
/* Icon */
/* External Heading */
/* Heading */
--targeted-links-item-heading-opt1-color: var(--meta-swatch-colour-1);
--targeted-links-item-heading-opt1-font-family: var(--typo-h-medium-font-face);
--targeted-links-item-heading-opt1-font-weight: var(--typo-h-medium-font-weight);
--targeted-links-item-heading-opt1-font-style: var(--typo-h-medium-font-style);
--targeted-links-item-heading-opt1-line-height: var(--typo-h-medium-line-height);
--targeted-links-item-heading-opt1-letter-spacing: var(--typo-h-medium-letter-spacing);
--targeted-links-item-heading-opt1-text-transform: var(--typo-h-medium-text-transform);
--targeted-links-item-heading-opt1-text-align: left;
--targeted-links-item-heading-opt1-font-size: 24px;
--targeted-links-item-heading-opt1-font-size-m: 24px;
--targeted-links-item-heading-opt1-font-size-l: 24px;
/* Paragraph */
--targeted-links-item-p-opt1-font-family: var(--typo-p-medium-font-face);
--targeted-links-item-p-opt1-color: var(--meta-swatch-mono-1);
--targeted-links-item-p-opt1-font-size: 16px;
--targeted-links-item-p-opt1-font-size-m: 16px;
--targeted-links-item-p-opt1-font-size-l: 16px;
--targeted-links-item-p-opt1-font-weight: var(--typo-p-medium-font-weight);
--targeted-links-item-p-opt1-font-style: var(--typo-p-medium-font-style);
--targeted-links-item-p-opt1-line-height: var(--typo-p-medium-line-height);
--targeted-links-item-p-opt1-letter-spacing: var(--typo-p-medium-letter-spacing);
--targeted-links-item-p-opt1-text-transform: var(--typo-p-medium-text-transform);
--targeted-links-item-p-opt1-text-align: left;
--targeted-links-item-p-opt1-padding: 0 0 16px;
--targeted-links-item-p-opt1-padding-m: 0 0 16px;
--targeted-links-item-p-opt1-padding-l: 0 0 16px;
/* Paragraph links */
/* Inline image */
--targeted-links-item-inline-image-opt1-height: 200px;
--targeted-links-item-inline-image-opt1-height-m: 200px;
--targeted-links-item-inline-image-opt1-height-l: 200px;
/* Buttons container */
--targeted-links-item-buttons-align-opt1-items: center;
--targeted-links-item-buttons-align-opt1-items-m: center;
--targeted-links-item-buttons-align-opt1-items-l: center;
/* Button block overrides */
/* Option 2 */
/* New external container */
/* Item container */
--targeted-links-item-opt2-background: var(--meta-swatch-mono-5);
--targeted-links-item-opt2-border-radius: 20px;
--targeted-links-item-opt2-box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.08);
--targeted-links-item-opt2-flex-direction: column;
--targeted-links-item-opt2-flex-direction-m: row;
--targeted-links-item-opt2-flex-direction-l: row;
/* Cover image */
--targeted-links-item-cover-image-opt2-width: 100%;
--targeted-links-item-cover-image-opt2-height: auto;
--targeted-links-item-cover-image-opt2-width-m: 50%;
--targeted-links-item-cover-image-opt2-height-m: 100%;
--targeted-links-item-cover-image-opt2-width-l: 50%;
--targeted-links-item-cover-image-opt2-height-l: 100%;
/* Body */
--targeted-links-item-body-opt2-padding: 24px;
--targeted-links-item-body-opt2-padding-m: 32px;
--targeted-links-item-body-opt2-padding-l: 32px;
--targeted-links-item-body-opt2-gap: 12px;
--targeted-links-item-body-opt2-gap-m: 12px;
--targeted-links-item-body-opt2-gap-l: 12px;
/* Header */
--targeted-links-item-header-opt2-padding: 0;
--targeted-links-item-header-opt2-padding-m: 0;
--targeted-links-item-header-opt2-padding-l: 0;
/* Icon */
/* External Heading */
/* Heading */
--targeted-links-item-heading-opt2-color: var(--meta-swatch-colour-1);
--targeted-links-item-heading-opt2-font-size: 24px;
--targeted-links-item-heading-opt2-font-size-m: 24px;
--targeted-links-item-heading-opt2-font-size-l: 24px;
--targeted-links-item-heading-opt2-font-weight: 700;
--targeted-links-item-heading-opt2-text-align: left;
/* Paragraph */
/* Paragraph links */
/* Inline image */
/* Buttons container */
/* Button block overrides */
/* Option 3 */
/* New external container */
/* Item container */
/* Cover image */
/* Body */
/* Header */
/* Icon */
/* External Heading */
/* Heading */
/* Paragraph */
/* Paragraph links */
/* Inline image */
/* Buttons container */
/* Button block overrides */
/* Option 4 */
/* New external container */
/* Item container */
/* Cover image */
/* Body */
/* Header */
/* Icon */
/* External Heading */
/* Heading */
/* Paragraph */
/* Paragraph links */
/* Inline image */
/* Buttons container */
/* Button block overrides */
/* Option 5 */
/* New external container */
/* Item container */
/* Cover image */
/* Body */
/* Header */
/* Icon */
/* External Heading */
/* Heading */
/* Paragraph */
/* Paragraph links */
/* Inline image */
/* Buttons container */
/* Button block overrides */
/* Tools */
/* Accordion Result */
/* Heading */
/* Status indicator */
/* Button block overrides */
/* Heading */
/* Status indicator */
/* Button block overrides */
/* Affordability Result */
/* Overview section */
/*CARD*/
/* Card container */
/* Info icon container */
/* Loan deposit difference */
/* Icon */
/* Paragraph */
/* Value */
/* Donut */
/* LTV Donut */
/* Donut Value*/
/* Donut label */
/* Donut icon */
/* Edit section */
/* Buttons */
/* MODAL */
/* Image */
/* Title */
/* Icon container */
/* Icon */
/* Card */
/* Heading */
/* OFFERS POINTS */
/* Info item block */
/* Info label */
/* Info value */
/* Dot */
/* Line */
/* Banks List */
/* Container */
/* Bank Logo */
/* Bank Name - optional */
/* Loader bar */
/* Borrowing Power Result */
/* Block Container */
/* Inner container */
/* Content container */
/* Columns container */
/* Dataviz */
/* Dataviz icons */
/* Dataviz labels */
/* Dataviz values */
/* Breakdown heading */
/* Also style Sub block / Breakdown card */
/* Controls container */
/* Controls heading */
/* Controls list */
/* Segmented label */
/* Brighter Smile Survey Result */
/* Description */
/* Message */
/* Total */
/* Breakdown container */
/* Breakdown item */
/* Icon container */
/* Icon */
/* Breakdown item label */
/* Breakdown item value */
/* Budget Result */
/* Block container */
/* Message */
/* Message Header */
/* Message Icon */
/* Message Heading */
/* Message Text */
/* Breakdowns */
/* Total & income */
/* Total */
/* Income */
/* Spending */
/* Table */
/* Row */
/* Row Labels */
/* Row Label */
/* Row Status */
/* Row Status Icon */
/* Row Status Label */
/* Row Values */
/* Row Value */
/* Row Calc Value */
/* Chart background defaults */
/* Carbon Calculator Result */
/* Block container */
/* Content container */
/* Dataviz container */
/* Dataviz info icon */
/* Dataviz heading */
/* Dataviz sub heading */
/* Dataviz chart container */
/* Dataviz chart label */
/* Dataviz chart value */
/* Dataviz chart bar */
/* Dataviz footer */
/* Cards container */
/* Cards heading */
/* Cards items container */
/* Card */
/* Card icon */
/* Card heading */
/* Card value */
/* Card footer */
/* Carbon Calculator Widget */
/* Block container */
/* Header */
/* Content container */
/* Cards */
/* Card */
/* Card heading */
/* Dataviz */
/* Dataviz headings */
/* Dataviz bars */
/* Dataviz values */
/* Dataviz measures */
/* Dataviz icon */
/* Message container */
/* Message words */
/* Message heading */
/* Message sub heading */
/* Message icon */
/* Checklist Widget */
/* Progress tracker */
/* Climate Persona Result */
/* Block container */
/* Content container */
/* Heading */
/* Card container */
/* Card Header */
/* Card Header icon */
/* Card Heading */
/* Card Sub Heading */
/* Dataviz container */
/* Dataviz info icon */
/* Dataviz heading */
/* Dataviz sub heading */
/* Dataviz chart container */
/* Dataviz chart value */
/* Dataviz chart label */
/* Dataviz chart bar */
/* Dataviz footer */
/* Deposit Builder */
/* Block container */
/* Deposit Builder Result */
/* Block Container */
/* Inner container */
/* Block Container */
/* Chart container */
/* Chart */
/* Container */
/* Account colours */
/* Account cards */
/* Account buttons */
/* Headings */
/* Legend */
/* Balances */
/* Totals */
/* Difference label */
/* Difference */
/* Indicator */
/* Keylines */
/* Breakdown */
/* Container */
/* Headings */
/* Balances */
/* Translate numbers */
/* Account tables */
/* Account table heading */
/* Icons */
/* Keylines */
/* Confirmation */
/* Container */
/* Icon Container */
/* Icon */
/* Message */
/* Timeline */
/* Container */
/* Headings */
/* Values */
/* Lines */
/* Downsizing widget */
/* Heading */
/* Card */
/* Output */
/* Label */
/* Dataviz */
/* Dataviz Label */
/* Dataviz Data */
/* FF Messages Widget */
/* Block container */
/* Content container */
/* Grid container */
/* Icon layout */
/* Labels */
/* Positive message */
/* Negative message */
/* FF Scorecards Widget */
/* Section container */
/* Section heading overrides */
/* Section paragraph */
/* Score card containers */
/* Scorecard label top */
/* Scorecard label bottom */
/* Scorecard value */
/* Scorecard donut */
/* Donut Info icon */
/* Donut label */
/* Scorecard pursuits icon */
/* Finance Summary Widget */
/* Container */
/* Heading */
/* Subheading */
/* Card */
/* Card Info */
/* Card Info Icon */
/* Card Paragraph */
/* Card Value */
/* Card Value Icon */
/* Doughnut */
/* Doughnut Value */
/* Doughnut Label */
/* Rental Block */
/* Rental Label */
/* Rental Prime Label */
/* Flow Playback Result */
/* Block container */
/* Content container */
/* Items */
/* Item container */
/* Text container */
/* Heading */
/* Sub heading */
/* Detail container */
/* Indicator layout */
/* Indicator ON */
/* Indicator OFF */
/* Goal Scorecard Widget */
/* Block container */
/* Scores container */
/* Score item container */
/* Score item label */
/* Label off state overrides */
/* Score indicator layout */
/* Score indicator ON */
/* Score indicator off */
/* Update container */
/* Update label */
/* High Priority Goals Widget */
/* Block container */
/* Content container */
/* Header container */
/* Heading */
/* Sub heading */
/* Button container */
/* Inflation Poll Result */
/* Heading */
/* Description */
/* Label */
/* Card container */
/* Card heading */
/* Card label */
/* Card value today */
/* Card value future */
/* Value colour overrides */
/* Investor Persona */
/* Content container */
/* Words container */
/* Heading */
/* Title */
/* Description */
/* Image */
/* LifeScore Widget */
/* Block container */
/* Heading */
/* Sub Heading */
/* Body */
/* Breakdown */
/* Money Basics Result */
/* Dataviz */
/* Info icon */
/* Chart */
/* Chart item */
/* Bar */
/* Chart item text */
/* Actions */
/* Money Basics Widget */
/* Heading */
/* Card */
/* Dataviz */
/* Avg score */
/* Score donut */
/* Score donut data */
/* Score data */
/* Score heading */
/* Score legend */
/* Score legend item */
/* Score legend indicator */
/* Score legend label */
/* Score timestamp */
/* Score info icon */
/* Chart */
/* Chart item */
/* Chart bar whole */
/* Chart bar value */
/* Chart bar words */
/* Chart bar label */
/* Chart bar data */
/* Nested Page actions overrides */
/* Mortgage Passport Result */
/* Container */
/* Widget Wrapper */
/* Item */
/* Icon */
/* Label */
/* Value */
/* Mortgage Tools Widget */
/* Container */
/* Image */
/* Body */
/* Heading */
/* Sub heading */
/* Cards container */
/* Card */
/* Card Heading */
/* Metrics container */
/* Metric */
/* Metric Label */
/* Metric Value */
/* Button */
/* Button Label */
/* Button Icon */
/* Part time and pension impact Result */
/* Body */
/* Sticky dataviz */
/* Header */
/* Detail contains Comparison and Expenditure */
/* Comparison text */
/* Expenditure container */
/* Table grid */
/* Table breakdown */
/* Header */
/* Breakdown inner container */
/* Breakdown footer / Illustrative figures */
/* Informer overrides */
/* Wheels container */
/* Part time widget */
/* Heading */
/* Card */
/* Output */
/* Label */
/* Data */
/* Label - comparison */
/* Pension impact widget */
/* Heading */
/* Card */
/* Output */
/* Label */
/* Data */
/* Pension finder result */
/* Positive Impact Widget */
/* Block container */
/* Content container */
/* Points breakdown*/
/* Profile Result */
--profile-result-button-justify-content: ;
/* Profile Widget */
/* Block container */
/* My profile heading (My profile) */
/* My profile current */
/* My profile current heading */
/* My profile card - ON */
/* My profile card header container */
/* My profile card heading */
/* My profile card icon */
/* My profile card body text */
/* My profile card - OFF */
/* My profile card header container */
/* My profile card heading */
/* My profile card icon */
/* My profile card body text */
/* Other profiles container */
/* Other profiles accordion item */
/* Header container */
/* Text container */
/* Accordion icon */
/* Image */
/* Body container */
/* Progress Widget */
/* Heading */
/* Card */
/* Module */
/* Module header */
/* Module heading */
/* Module link icon */
/* Module statuses */
/* Module status icon overrides */
/* Special status icon styles */
/* Property Breakdown */
/* Container */
/* Header */
/* Heading */
/* Row */
/* Row label */
/* Row value */
/* Property Goal Result */
/* Block Container */
/* Inner container */
/* Input container */
/* Data row */
/* Input group container */
/* Dataviz (top of result page) */
/* Property goal dataviz container */
/* Dataviz container inner */
/* Donut container */
/* Donut */
/* Donut value */
/* Donut value complete*/
/* Donut label */
/* Property goal output container */
/* Property goal output */
/* Property goal button container */
/* Property goal button */
/* Breakdown card */
/* Container */
/* Breakdown block */
/* Total */
/* Vars to help it look right */
/* Row */
/* Row value */
/* Row value suffix */
/* Row link */
/* Dataviz Explainer */
/* Property goal explainer container */
/* Property goal explainer icon */
/* Property goal explainer paragraph */
/* Property goal explainer link */
/* Property Goal Widget (Road) */
/* Container */
/* Content Container */
/* Header Container */
/* Body Container */
/* Heading */
/* Heading */
/* Property Goal Widget (progress bar) */
/* Container */
/* Heading */
/* Dataviz */
/* Progress bar */
/* Progress bar value */
/* Savings table */
/* Savings item */
/* Table label */
/* Table total (data) */
/* Table row informer */
/* Property Portfolio Result */
/* Container */
/* Indicator icon */
/* Heading */
/* Sub heading */
/* Data icon */
/* Savings Plan Result */
/* Block Container */
/* Inner container */
/* Content container */
/* Content heading */
/* Content subheading */
/* Columns container */
/* Dataviz */
/* Dataviz item */
/* Donuts */
/* Dataviz headings */
/* Dataviz labels */
/* Dataviz values */
/* Dataviz suffix */
/* Breakdown heading */
/* Also style Sub block / Breakdown card */
/* Controls container */
/* Controls heading */
/* Controls list */
/* Savings Plan Dataviz */
/* Container */
/* Dataviz widget */
/* Label */
/* Value */
/* Value suffix */
/* Breakdown */
/* Container */
/* Row */
/* Row value */
/* Row value suffix */
/* Row link */
/* Total */
/* Sus scores widget */
/* Main block */
/* Cards */
/* Card */
/* Card heading */
/* Overall score card */
/* Overall score value */
/* Overall score legend */
/* Overall score timestamp */
/* Breakdown info icon */
/* Breakdown scores */
/* Break down score row */
/* Breakdown score row label */
/* Breakdown score row value */
/* Breakdown score buttons */
/* Message */
/* Message icon */
/* Message label */
/* Score history rows */
/* Score history row label */
/* Score history row value */
/* Score history row bar */
/* Target card (for SBC) */
/* Main Wrapper */
/* Card container */
/* Header */
/* Header - Scores */
/* Header - Score Item */
/* Header - Score Circle */
/* Header - Score Circle Value */
/* Header - Score Circle Label */
/* Header - Score Arrow */
/* Body - Option Items */
/* Body - List Item */
/* Body - View Item */
/* Body - View Item Value */
/* Body - View Item Label */
/* Body - Target Badge */
/* Body - Form/Inputs */
/* Footer */
/* Footer - Info Footer */
/* Footer - Info Text */
/* Uni Savings Result */
/* Dataviz */
/* Heading */
/* Sticky */
/* Total */
/* Total value */
/* Total label */
/* Bar container */
/* Bar */
/* Legend */
/* Cards */
/* Info */
/* Adjust your answers */
/* Segmented button and wheels container */
/* Wheel */
/* Uni Modal */
/* Uni Modal Values container */
/* Values */
/* Chart */
/* Labels */
/* Uni savings widget */
/* Heading */
/* Card */
/* Output */
/* Total */
/* Total label */
/* Total data */
/* Stacked bar */
/* Legend */
/* Legend item */
/* Legend indicator */
/* Legend Label */
/* VM What's In Reach dataviz */
/* VM plan breakdown */
/* VM plan dataviz */
/* VM plan widget */
/* VM plan page header */
/* VM points card */
/* VM points widget */
/* VM product prompt */
/* Sustainability */
/* FF template heading overrides */
/* FF Messages spacer */
/* Goal Indicator */
/* Pursuit Indicator */
/* FF KPI Detail */
/* Item */
/* Icon */
/* Label */
/* Templates */
/* Default */
--theme-template-align-content: normal;
--theme-bottom-nav-bg-colour: var(--meta-swatch-mono-5);
--theme-top-nav-bg-colour: var(--meta-swatch-mono-5);
--theme-top-nav-bg-image-url: var(--theme-bg-image-url);
--theme-top-nav-bg-image-repeat: var(--theme-bg-image-repeat);
--theme-top-nav-bg-image-size: var(--theme-bg-image-size);
--theme-top-nav-bg-image-position: var(--theme-bg-image-position);
/* Discovering */
/* Dashboard */
/* Widget bottom link */
/* Landing */
--template-landing-spacer-sections-s: var(--pattern-layout-spacer-sections-s);
--template-landing-spacer-components-s: var(--pattern-layout-spacer-components-s);
--template-landing-spacer-content-s: var(--pattern-layout-spacer-content-s);
--template-landing-spacer-sections-ml: var(--pattern-layout-spacer-sections-ml);
--template-landing-spacer-components-ml: var(--pattern-layout-spacer-components-ml);
--template-landing-spacer-content-ml: var(--pattern-layout-spacer-content-ml);
/* Tour */
--template-tour-spacer-top-s: 16px;
--template-tour-spacer-middle-upper-s: 16px;
--template-tour-spacer-middle-lower-s: 16px;
--template-tour-spacer-bottom-s: 16px;
--template-tour-spacer-top-ml: 24px;
--template-tour-spacer-middle-upper-ml: 16px;
--template-tour-spacer-middle-lower-ml: 8px;
--template-tour-spacer-bottom-ml: 16px;
--template-tour-order-image: 1;
--template-tour-order-message: 2;
--template-tour-order-input: 3;
/* Playing */
/* Lifescore home */
/* Lifescore reward */
/* Learning */
/* Content Feed */
/* Content container */
--pt-feed-content-padding: 24px 0;
/* Grid */
--pt-feed-content-grid-template-columns: 1;
--pt-feed-content-grid-template-columns-m: 3;
--pt-feed-content-grid-template-columns-l: 3;
--pt-feed-content-column-gap: 24px;
--pt-feed-content-row-gap: 24px;
/* Grid items */
/* Filters container */
/* Each individual filter */
/* Empty state paragraph */
--pt-feed-empty-p-colour: var(--meta-swatch-mono-1);
--pt-feed-empty-p-font-size: 18px;
--pt-feed-empty-p-font-family: 'face1';
--pt-feed-empty-p-font-weight: normal;
--pt-feed-empty-p-font-style: normal;
--pt-feed-empty-p-text-align: center;
--pt-feed-empty-p-padding: 48px 0;
/* Articles list */
/* Blog list */
--template-blog-editorial-cards-columns: 2;
--template-blog-editorial-cards-gap-row: 16px;
--template-blog-editorial-cards-gap-column: 16px;
/* Article */
/* Story */
/* these next 3 vars need the px unit, even if zero */
/* Video in story slide */
/* Image in story slide */
/* Video */
/* AI Coach */
/* Doing */
/* Checklist */
/* Filters container */
/* Each individual filter */
/* Start */
/* Section start */
/* Question */
--question-template-body-padding: 24px 0;
--question-template-body-padding-m: 48px 0;
--question-template-body-padding-l: 48px 0;
/* Checkpoint (Updating & Done) */
--template-checkpoint-icon-colour: var(--meta-swatch-colour-1);
--template-checkpoint-icon-size: 40px;
--template-checkpoint-label-colour: var(--meta-swatch-colour-1);
--template-checkpoint-label-face: 'poppins';
--template-checkpoint-label-size: 16px;
--template-checkpoint-label-weight: bold;
--template-checkpoint-label-font-style: normal;
--template-checkpoint-label-line-height: 1.2;
--template-checkpoint-label-letter-spacing: var(--pattern-letter-spacing-body);
--template-checkpoint-label-text-transform: none;
--template-checkpoint-label-text-align: center;
/* Savings Plan Results */
--widget-plan-spacer-sections-s: var(--pattern-layout-spacer-sections-s);
--widget-plan-spacer-components-s: var(--pattern-layout-spacer-components-s);
--widget-plan-spacer-content-s: var(--pattern-layout-spacer-content-s);
--widget-plan-spacer-sections-ml: var(--pattern-layout-spacer-sections-ml);
--widget-plan-spacer-components-ml: var(--pattern-layout-spacer-components-ml);
--widget-plan-spacer-content-ml: var(--pattern-layout-spacer-content-ml);
/* Result */
--template-result-page-heading-align: left;
--template-result-par-heading-align: left;
/* Custom */
--template-custom-spacer-sections-s: var(--pattern-layout-spacer-sections-s);
--template-custom-spacer-components-s: var(--pattern-layout-spacer-components-s);
--template-custom-spacer-content-s: var(--pattern-layout-spacer-content-s);
--template-custom-spacer-sections-ml: var(--pattern-layout-spacer-sections-ml);
--template-custom-spacer-components-ml: var(--pattern-layout-spacer-components-ml);
--template-custom-spacer-content-ml: var(--pattern-layout-spacer-content-ml);
/* 12 Column Content Grid */
/* Account */
/* Account Home */
--template-account-editorial-cards-columns: 2;
--template-account-editorial-cards-gap-row: 16px;
--template-account-editorial-cards-gap-column: 16px;
/* Account Detail */
/* Account Business Profiles */
/* Sustainability */
/* Goals list */
/* Goal */
/* Misc */
/* VM WIR */
/* Pension Finder Results */
/* Property */
} /* End of default vars */
/* Themes */
/* Discovering */
:root.dashboard {
/* All types - Main container */
--page-template-heading-margin: 32px 0 8px 0;
--pattern-layout-spacer-top-s: 0px;
--pattern-layout-spacer-components-s: 16px;
--pattern-layout-spacer-bottom-s: 0px;
--pattern-layout-spacer-top-ml: 0px;
--pattern-layout-spacer-components-ml: 16px;
--pattern-layout-spacer-bottom-ml: 0px;
--input-group-align: left;
--cover-img-object-border-radius: 16px;
}
:root.ai {
--forms-input-text-order-field: 0;
}
:root.landing {
--typo-h1-margin: 0.07rem 0;
--typo-h2-margin: 0.07rem 0;
--typo-h3-margin: 0.07rem 0;
--pattern-layout-spacer-top-s: 16px;
--pattern-layout-spacer-bottom-s: 16px;
--pattern-layout-spacer-bottom-ml: 24px;
--input-group-align: left;
}
:root.landing1 {
}
:root.tour {
}
:root.tour1 {
}
:root.tour2 {
}
:root.tour3 {
}
:root.tour4 {
}
:root.tour5 {
}
/* Learning */
:root.lifescore-home {
}
:root.lifescore-reward {
}
:root.coins {
}
:root.vm-lifescore-home {
}
/* Educating */
:root.feed {
--theme-bg-colour: #EEEEEE;
--theme-template-bg-colour: #EEEEEE;
}
:root.articles {
}
:root.blog {
}
:root.article {
/* 12 Column Content Grid */
}
:root.story {
/* Before */
/* Current */
/* After */
}
/* DO NOT remove space in next selector */
:root .story1 {
/* Slide container */
/* Page header */
/* Words */
/* Quick feedback */
/* Text links */
}
/* DO NOT remove space in next selector */
:root .story2 {
/* Slide container */
/* Page header */
/* Words */
/* Quick feedback */
/* Text links */
}
/* DO NOT remove space in next selector */
:root .story3 {
/* Slide container */
/* Page header */
/* Words */
/* Text links */
}
/* DO NOT remove space in next selector */
:root .story4 {
/* Slide container */
/* Page header */
/* Words */
/* Feedback */
/* Button */
/* Quick feedback */
/* Text links */
}
/* DO NOT remove space in next selector */
:root .story5 {
/* Slide container */
/* Page header */
/* Words */
/* Quick feedback */
/* Text links */
}
:root.video {
}
/* Doing */
:root.checklist {
--pattern-layout-spacer-bottom-ml: 24px;
}
:root.start {
--pattern-layout-spacer-top-s: 16px;
--pattern-layout-spacer-bottom-s: 0px;
--pattern-layout-spacer-bottom-ml: 0px;
}
:root.question {
--theme-template-align-content: end;
/* Segmented buttons */
}
:root.onboarding {
}
:root.checkpoint {
}
:root.result {
--pattern-layout-spacer-top-s: 16px;
--pattern-layout-spacer-bottom-ml: 0px;
}
:root.my-plan {
}
:root.investor-quiz {
}
:root.inflation-poll {
}
:root.vm-wiwr {
}
:root.vm-plan {
}
:root.vm-deposit-builder {
}
:root.help {
}
/* Account */
:root.account-complete {
}
:root.account-signup {
}
:root.account-login {
}
:root.account-signin {
}
:root.account-reset-password {
}
:root.account-home {
/* Label */
/* Field */
/* Link */
/* Accordion */
}
:root.account-home-option {
--pattern-layout-spacer-components-s: 0px;
--pattern-layout-spacer-components-ml: 0px;
--input-explainer-margin: 0 200px 0 0;
--input-explainer-padding: 0;
}
/* Sustainability */
:root.vm-ff-goal {
}
:root.goals {
}
:root.goal {
}
:root.goal-prioritisation {
}
:root.goal-performance {
}
:root.positive-impact {
}
:root.engaged {
/* Indicator */
/* Keylines */
/* Button */
/* Labels container */
/* Activity Label */
/* Status Label */
/* Status */
/* Action icon */
/* New dynamic statuses */
}
/* Misc */
:root.property-page {
/* Property header*/
}
*/
--typo-quote-bg-colour: transparent;
--typo-quote-colour: var(--meta-swatch-colour-1);
--typo-quote-font-face: 'poppins';
--typo-quote-font-size: 24px;
--typo-quote-font-weight: normal;
--typo-quote-font-style: italic;
--typo-quote-line-height: 1.2;
--typo-quote-letter-spacing: var(--pattern-letter-spacing-body);
--typo-quote-text-transform: none;
--typo-quote-text-align: left;
--typo-quote-padding: 2rem 0;
--typo-quote-margin: 0;
--typo-quote-max-width: 100%;
--typo-quote-border-top: 1px solid var(--meta-swatch-mono-8);
--typo-quote-border-bottom: 1px solid var(--meta-swatch-mono-8);
/* */
--type-quote-cite-colour: var(--pattern-strong-text-colour);
--type-quote-cite-font-face: 'poppins';
--type-quote-cite-font-size: 15px;
--type-quote-cite-font-weight: normal;
--type-quote-cite-font-style: italic;
--type-quote-cite-line-height: 1.5;
--type-quote-cite-letter-spacing: var(--pattern-letter-spacing-body);
--type-quote-cite-text-transform: none;
--type-quote-cite-text-align: left;
/* Share menu */
/* Container */
/* Button container */
/* Button background */
/* Button label */
/* URL container */
/* URL text */
/* URL button OFF */
/* URL button ON */
/* Split */
/* Block Container */
/* Both Article Containers */
/* Grid Container */
/* Container 1 */
/* Container 2 */
/* Image */
/* Split heading */
/* Split emphasis */
/* Split buttons */
/* Split List */
/* Text - Headings */
/* Container */
--page-template-heading-container-bg-colour: transparent;
--page-template-heading-container-padding: 0 0 8px;
--page-template-heading-container-border: none;
--page-template-heading-container-border-radius: 0px;
--page-template-heading-container-box-shadow: none;
/* Heading */
--page-template-heading-colour: var(--typo-h-medium-colour);
--page-template-heading-font-family: var(--typo-h-medium-font-face);
--page-template-heading-font-face: var(--page-template-heading-font-family);
--page-template-heading-font-size: var(--typo-h-medium-font-size);
--page-template-heading-font-weight: var(--typo-h-medium-font-weight);
--page-template-heading-font-style: var(--typo-h-medium-font-style);
--page-template-heading-line-height: var(--typo-h-medium-line-height);
--page-template-heading-letter-spacing: var(--typo-h-medium-letter-spacing);
--page-template-heading-text-transform: var(--typo-h-medium-text-transform);
--page-template-heading-text-align: var(--typo-h-medium-text-align);
--page-template-par-heading-colour: var(--typo-p-medium-colour);
--page-template-par-heading-font-face: var(--typo-p-medium-font-face);
--page-template-par-heading-font-size: var(--typo-p-medium-font-size);
--page-template-par-heading-font-weight: var(--typo-p-medium-font-weight);
--page-template-par-heading-font-style: var(--typo-p-medium-font-style);
--page-template-par-heading-line-height: var(--typo-p-medium-line-height);
--page-template-par-heading-letter-spacing: var(--typo-p-medium-letter-spacing);
--page-template-par-heading-text-transform: var(--typo-p-medium-text-transform);
--page-template-par-heading-text-align: var(--typo-p-medium-text-align);
--page-template-par-heading-margin: var(--typo-p-medium-margin);
/*
*/
--typo-h1-colour: var(--pattern-headings-colour);
--typo-h1-font-face: 'adelle-sans';
--typo-h1-font-size: 32px;
--typo-h1-font-weight: bold;
--typo-h1-font-style: normal;
--typo-h1-line-height: 1.3;
--typo-h1-letter-spacing: var(--pattern-letter-spacing-display);
--typo-h1-text-transform: none;
--typo-h1-text-align: left;
--typo-h1-margin: 1.5rem 0 0.7rem;
/*
*/
--typo-h2-colour: var(--pattern-headings-colour);
--typo-h2-font-face: 'adelle-sans';
--typo-h2-font-size: 24px;
--typo-h2-font-weight: bold;
--typo-h2-font-style: normal;
--typo-h2-line-height: 1.3;
--typo-h2-letter-spacing: var(--pattern-letter-spacing-display);
--typo-h2-text-transform: none;
--typo-h2-text-align: left;
--typo-h2-margin: 0 0 0.7rem 0;
/*
*/
--typo-h3-colour: var(--pattern-headings-colour);
--typo-h3-font-face: 'adelle-sans';
--typo-h3-font-size: 20px;
--typo-h3-font-weight: bold;
--typo-h3-font-style: normal;
--typo-h3-line-height: 1.3;
--typo-h3-letter-spacing: var(--pattern-letter-spacing-display);
--typo-h3-text-transform: none;
--typo-h3-text-align: left;
--typo-h3-margin: 1.5rem 0 0.7rem;
/*
*/
--typo-h4-colour: var(--pattern-headings-colour);
--typo-h4-font-face: 'adelle-sans';
--typo-h4-font-size: 16px;
--typo-h4-font-weight: bold;
--typo-h4-font-style: normal;
--typo-h4-line-height: 1.3;
--typo-h4-letter-spacing: var(--pattern-letter-spacing-display);
--typo-h4-text-transform: none;
--typo-h4-text-align: left;
--typo-h4-margin: 1.5rem 0 0.7rem;
/*
*/
--typo-h5-colour: var(--pattern-headings-colour);
--typo-h5-font-face: 'adelle-sans';
--typo-h5-font-size: 16px;
--typo-h5-font-weight: bold;
--typo-h5-font-style: normal;
--typo-h5-line-height: 1.3;
--typo-h5-letter-spacing: var(--pattern-letter-spacing-display);
--typo-h5-text-transform: none;
--typo-h5-text-align: left;
--typo-h5-margin: 1.5rem 0 0.7rem;
/*
*/
--typo-h6-colour: var(--pattern-headings-colour);
--typo-h6-font-face: 'adelle-sans';
--typo-h6-font-size: 16px;
--typo-h6-font-weight: bold;
--typo-h6-font-style: normal;
--typo-h6-line-height: 1.3;
--typo-h6-letter-spacing: var(--pattern-letter-spacing-display);
--typo-h6-text-transform: none;
--typo-h6-text-align: left;
--typo-h6-margin: 1.5rem 0 0.7rem;
/* Text - Links */
/* */
--typo-a-link-border-radius: 0;
--typo-a-link-bg-colour: transparent;
--typo-a-link-colour: inherit;
--typo-a-link-font-weight: inherit;
--typo-a-link-font-style: inherit;
--typo-a-link-letter-spacing: inherit;
--typo-a-link-text-decoration: underline;
--typo-a-link-text-transform: inherit;
--typo-a-link-padding-bottom: none;
--typo-a-link-border-bottom: none;
--typo-a-link-position-top: 0;
/* :hover */
--typo-a-hover-border-radius: 0;
--typo-a-hover-bg-colour: transparent;
--typo-a-hover-colour: inherit;
--typo-a-hover-font-weight: inherit;
--typo-a-hover-font-style: inherit;
--typo-a-hover-letter-spacing: inherit;
--typo-a-hover-text-decoration: underline;
--typo-a-hover-text-transform: inherit;
--typo-a-hover-padding-bottom: inherit;
--typo-a-hover-border-bottom: inherit;
--typo-a-hover-position-top: 0;
/* :active */
--typo-a-active-border-radius: 0;
--typo-a-active-bg-colour: transparent;
--typo-a-active-colour: inherit;
--typo-a-active-font-weight: inherit;
--typo-a-active-font-style: inherit;
--typo-a-active-letter-spacing: inherit;
--typo-a-active-text-decoration: underline;
--typo-a-active-text-transform: inherit;
--typo-a-active-padding-bottom: inherit;
--typo-a-active-border-bottom: inherit;
--typo-a-active-position-top: 0;
/* :visited */
--typo-a-visited-border-radius: 0;
--typo-a-visited-bg-colour: transparent;
--typo-a-visited-colour: inherit;
--typo-a-visited-font-weight: inherit;
--typo-a-visited-font-style: inherit;
--typo-a-visited-letter-spacing: inherit;
--typo-a-visited-text-decoration: underline;
--typo-a-visited-text-transform: inherit;
--typo-a-visited-padding-bottom: inherit;
--typo-a-visited-border-bottom: none;
--typo-a-visited-position-top: 0;
/* Text - Lists */
/*
*/
--typo-ul-colour: var(--pattern-strong-text-colour);
--typo-ul-font-face: 'poppins';
--typo-ul-font-size: 16px;
--typo-ul-font-weight: normal;
--typo-ul-font-style: normal;
--typo-ul-line-height: 1.6;
--typo-ul-letter-spacing: var(--pattern-letter-spacing-body);
--typo-ul-text-transform: none;
--typo-ul-text-align: left;
--typo-ul-margin: 0;
--typo-ul-padding: 0 0 0 20px;
--typo-ul-style-type: disc;
--typo-ul-style-position: outside;
--typo-ul-list-style-image: none;
--typo-ul-list-item-margin: 0;
--typo-ul-list-item-padding: 0 0 16px 4px;
/*
*/
--typo-ol-colour: var(--pattern-strong-text-colour);
--typo-ol-font-face: 'poppins';
--typo-ol-font-size: 16px;
--typo-ol-font-weight: normal;
--typo-ol-font-style: normal;
--typo-ol-line-height: 1.6;
--typo-ol-letter-spacing: var(--pattern-letter-spacing-body);
--typo-ol-text-transform: none;
--typo-ol-text-align: left;
--typo-ol-margin: 0 0 0.7rem;
--typo-ol-padding: 0 0 0 1.4rem;
--typo-ol-style-type: lower-alpha;
--typo-ol-style-position: outside;
--typo-ol-list-style-image: none;
--typo-ol-list-item-margin: 0 0 0.7rem 0;
--typo-ol-list-item-padding: 0;
/* Text - Paragraphs */
/* These extend 'Global / Text' vars */
/* .typography-extended p */
--typo-p-font-face: var(--typo-p-medium-font-face);
--typo-p-colour: var(--typo-p-medium-colour);
--typo-p-margin: 0 0 0.7rem;
/* Trust card */
/* Content container */
/* Header container */
/* Body container */
/* Header image */
/* Partner container */
/* Header paragraph */
/* Header heading */
/* Item */
/* Item header */
/* Item icon*/
/* Item heading */
/* Item body */
/* Toast */
/* Container */
--toast-position-s: bottom;
--toast-position-ml: right top;
--toast-height: auto;
--toast-width: 100%;
--toast-bg-colour: var(--meta-swatch-mono-4);
--toast-border: 1px solid var(--meta-swatch-mono-3);
--toast-border-radius: 12px;
--toast-margin: 16px;
--toast-padding: 16px 16px;
/* Comms icon */
--toast-comms-icon-display: none;
--toast-comms-icon-colour: var(--meta-swatch-colour-1);
--toast-comms-icon-size: 24px;
--toast-comms-icon-margin: auto 16px auto 0;
--toast-comms-icon-position: flex-start;
/* Dismiss icon */
--toast-dismiss-icon-display: flex;
--toast-dismiss-icon-colour: var(--meta-swatch-mono-8);
--toast-dismiss-icon-size: 24px;
--toast-dismiss-icon-margin: auto 0 auto 12px;
--toast-dismiss-icon-position: flex-end;
/* Message text */
--toast-message-colour: var(--typo-p-small-colour);
--toast-message-font-family: var(--typo-p-small-font-face);
--toast-message-font-size: var(--typo-p-small-font-size);
--toast-message-font-weight: var(--typo-p-small-font-weight);
--toast-message-font-style: var(--typo-p-small-font-style);
--toast-message-line-height: 1.6;
--toast-message-letter-spacing: var(--typo-p-small-letter-spacing);
--toast-message-text-transform: var(--typo-p-small-text-transform);
--toast-message-text-align: var(--typo-p-small-text-align);
/* Tooltip */
--tooltip-padding: 8px;
--tooltip-border-radius: 4px;
--tooltip-background: var(--meta-swatch-mono-5);
--tooltip-border: 1px solid var(--meta-swatch-mono-3);
--tooltip-box-shadow: 0px 4px 10px -3px rgba(0, 0, 0, 0.16);
--tooltip-text-color: var(--typo-data-label-xs-colour);
--tooltip-text-font-family: var(--typo-data-label-xs-font-face);
--tooltip-text-font-size: var(--typo-data-label-xs-font-size);
--tooltip-text-font-weight: var(--typo-data-label-xs-font-weight);
--tooltip-text-font-style: var(--typo-data-label-xs-font-style);
--tooltip-text-line-height: var(--typo-data-label-xs-line-height);
--tooltip-text-letter-spacing: var(--typo-data-label-xs-letter-spacing);
--tooltip-text-text-transform: var(--typo-data-label-xs-text-transform);
--tooltip-text-text-align: var(--typo-data-label-xs-text-align);
/* Video embed */
--wp-block-embed-margin: 0 0 24px 0;
/* Video overlay */
/* Block container */
/* Video container */
/* Close container */
/* Close icon */
/* Dataviz */
/* Breakdown card */
/* Container */
/* Data row */
/* Operator icon */
/* Label value */
/* Label */
/* Calc value */
/* Info icon */
/* Total row */
/* Total row - value */
/* Total row - label */
/* Total row operator icon */
/* Job card */
/* Container */
/* Found indicator */
/* Logo */
/* Logo background colors */
/* Logo text colors */
/* Time range label */
/* Body */
/* Header container */
/* Employer heading */
/* Difficulty indicator */
/* Card icons */
/* Info row */
/* Info row label */
/* Info row data */
/* Button container */
/* Letter Link */
/* LifeScore Dataviz */
/* Block container */
/* Item */
/* Icon BGs */
/* Icon */
/* Words containers */
/* Labels */
/* Values */
/* Left colors */
/* Right colors */
/* Property card */
/* Container */
/* Image */
/* Information icon container */
/* Info icon */
/* Property card on portfolio */
/* Section */
/* Action btn */
/* Action btn label */
/* Action btn icon */
/* Property CTA */
/* Container */
/* Label */
/* Property Stats */
/* Container */
/* Item container */
/*Icon */
/* Value */
/* Label */
/* Property Id */
/* Container */
/* Label container */
/* Label */
/*Image */
/* Property Total */
/* Container */
/* Label Container */
/* Label */
/* Value Container */
/* Value */
/* Property Card */
/* Metabox */
/* Container */
--template-articles-metabox-display: flex;
--template-articles-metabox-direction: row;
--template-articles-metabox-align: center;
--template-articles-metabox-justify: space-between;
--template-articles-metabox-padding: 16px;
--template-articles-metabox-bg-colour: var(--meta-swatch-mono-5);
--template-articles-metabox-border: var(--pattern-card-border);
--template-articles-metabox-border-radius: var(--pattern-border-radius-m);
--template-articles-metabox-box-shadow: none;
/* Text */
--template-articles-metabox-colour: var(--typo-p-small-colour);
--template-articles-metabox-font-family: var(--typo-p-small-font-face);
--template-articles-metabox-font-size: var(--typo-p-small-font-size);
--template-articles-metabox-font-weight: var(--typo-p-small-font-weight);
--template-articles-metabox-font-style: var(--typo-p-small-font-style);
--template-articles-metabox-line-height: 1.6;
--template-articles-metabox-letter-spacing: var(--typo-p-small-letter-spacing);
--template-articles-metabox-text-transform: var(--typo-p-small-text-transform);
/* Back icon */
--template-articles-metabox-back-display: flex;
--template-articles-metabox-back-icon-colour: var(--meta-swatch-mono-2);
--template-articles-metabox-back-icon-size: var(--layout-icon-size);
/* Layout */
--template-articles-metabox-list-display: flex;
--template-articles-metabox-list-direction: column;
--template-articles-metabox-list-margin: 0;
--template-articles-metabox-list-padding: 0;
/* Item */
--template-articles-metabox-item-margin: 0;
--template-articles-metabox-item-padding: 0;
--template-articles-metabox-item-border: 0;
--template-articles-metabox-item-border-colour: none;
/* Feedback */
/* Activity Progress */
/* Container */
/* Content container */
/* Label */
/* Items container */
/* Single Item */
/* Article read */
/* Icon */
--template-articles-done-icon-colour: var(--meta-swatch-mono-5);
--template-articles-done-icon-size: 32px;
/* Icon background */
--template-articles-done-icon-bg-size: 48px;
--template-articles-done-icon-bg-colour: var(--meta-swatch-colour-4);
--template-articles-done-icon-bg-border-radius: 50%;
--template-articles-done-icon-bg-border: none;
/* Keyline */
--template-articles-done-keyline: 1px solid var(--pattern-keyline-colour);
--template-articles-done-keyline-gutter: 12px;
/* Progress Indicator */
/* Wrapper - to set the bg color*/
/* Items parent container */
/* Items */
/* Keyline*/
/* Item layout */
/* Text description */
/* Icon */
/* Item states */
/* Done - Before */
/* Current */
/* To do - After */
/* Label */
/* Smart banner */
/* Container */
--smart-banner-container-height: 84px;
--smart-banner-container-padding: 16px;
/* Icon */
--smart-banner-icon-close-size: 24px;
/* Image */
--smart-banner-image-size: 64px;
--smart-banner-image-object-fit: contain;
/* Text container */
--smart-banner-text-container-gap: 2px;
--smart-banner-text-container-margin: 0 12px 0 4px;
/* Button */
--smart-banner-button-margin: 0 0 0 12px;
--smart-banner-button-padding: 0 10px;
/* iOS */
--smart-banner-ios-container-background: #FFFFFF;
--smart-banner-ios-icon-close-colour: var(--meta-swatch-colour-1);
--smart-banner-ios-heading-colour: #000000;
--smart-banner-ios-subheading-colour: #666666;
--smart-banner-ios-subheading-font-size: 14px;
--smart-banner-ios-button-background: var(--meta-swatch-colour-1);
--smart-banner-ios-button-label-colour: var(--meta-swatch-mono-5);
/* Android */
--smart-banner-android-container-background: #FFFFFF;
--smart-banner-android-icon-close-colour: var(--meta-swatch-colour-1);
--smart-banner-android-heading-colour: #000000;
--smart-banner-android-subheading-colour: #666666;
--smart-banner-android-subheading-font-size: 14px;
--smart-banner-android-button-background: var(--meta-swatch-colour-1);
--smart-banner-android-button-label-colour: var(--meta-swatch-mono-5);
/* Pager indicators (dots) */
/* Forms */
/* Button */
/* All types - Main container */
--btn-align: center;
--btn-width: 100%;
--btn-max-width: 100%;
--btn-height: auto;
--btn-margin: 0;
--btn-padding: 0;
--btn-border-radius: 8px;
--btn-effect-disabled: var(--pattern-disabled-opacity);
/* All types - Companion */
--btn-companion-height: var(--btn-height);
--btn-companion-width: var(--btn-height);
--btn-companion-margin: 0 0 0 8px;
/* All types - Icon container */
--btn-icon-display: none;
--btn-icon-border-radius: none;
--btn-icon-width: auto;
--btn-icon-height: auto;
--btn-icon-margin: 0;
/* All types - SVG */
--btn-svg-size: var(--pattern-icon-size);
/* All types - label */
--btn-label-padding: 12px 8px;
--btn-label-text-transform: none;
--btn-label-face: 'poppins';
--btn-label-font-size: 16px;
--btn-label-font-weight: bold;
--btn-label-letter-spacing: var(--pattern-letter-spacing-body);
--btn-label-text-align: center;
/* Major */
--btn-major-background: var(--meta-swatch-colour-1);
--btn-major-border: 2px solid transparent;
--btn-major-box-shadow: none;
--btn-major-icon-color: var(--meta-swatch-mono-5);
--btn-major-icon-bg-color: transparent;
--btn-major-icon-border: none;
--btn-major-label-color: var(--meta-swatch-mono-5);
--btn-major-label-font-weight: var(--btn-label-font-weight);
/* Minor */
--btn-minor-background: var(--meta-swatch-mono-5);
--btn-minor-border: 2px solid var(--meta-swatch-colour-1);
--btn-minor-box-shadow: none;
--btn-minor-icon-color: var(--meta-swatch-colour-1);
--btn-minor-icon-bg-color: transparent;
--btn-minor-icon-border: none;
--btn-minor-label-color: var(--meta-swatch-colour-1);
--btn-minor-label-font-weight: var(--btn-label-font-weight);
/* Diminished */
/* Negative */
--btn-negative-background: var(--meta-swatch-mono-5);
--btn-negative-border: 2px solid var(--meta-swatch-colour-1);
--btn-negative-box-shadow: none;
--btn-negative-icon-color: var(--meta-swatch-colour-1);
--btn-negative-icon-bg-color: transparent;
--btn-negative-icon-border: none;
--btn-negative-label-color: var(--meta-swatch-colour-1);
--btn-negative-label-font-weight: var(--btn-label-font-weight);
/* Destructive */
--btn-destructive-background: var(--meta-swatch-mono-4);
--btn-destructive-border: 2px solid var(--meta-swatch-colour-1);
--btn-destructive-box-shadow: none;
--btn-destructive-icon-color: var(--meta-swatch-colour-1);
--btn-destructive-icon-bg-color: transparent;
--btn-destructive-icon-border: none;
--btn-destructive-label-color: var(--meta-swatch-colour-1);
--btn-destructive-label-font-weight: var(--btn-label-font-weight);
/* Special */
--btn-special-background: var(--meta-swatch-mono-4);
--btn-special-border: 2px solid var(--meta-swatch-colour-1);
--btn-special-box-shadow: none;
--btn-special-icon-color: var(--meta-swatch-colour-1);
--btn-special-icon-bg-color: transparent;
--btn-special-icon-border: none;
--btn-special-label-color: var(--meta-swatch-colour-1);
--btn-special-label-font-weight: var(--btn-label-font-weight);
/* Temporary link styles */
/* Checkbox */
/* Checkbox group legend */
--input-checkbox-group-legend-color: var(--meta-swatch-colour-1);
--input-checkbox-group-legend-font-size: 24px;
--input-checkbox-group-legend-font-size-m: 24px;
--input-checkbox-group-legend-font-size-l: 24px;
--input-checkbox-group-legend-font-weight: 700;
--input-checkbox-group-legend-padding: 16px 0 0 0;
--input-checkbox-group-legend-padding-m: 16px 0 0 0;
--input-checkbox-group-legend-padding-l: 24px 0 0 0;
/* Checkbox group item */
/* Checkbox group label */
--input-checkbox-group-label-color: var(--pattern-headings-colour);
--input-checkbox-group-label-font-size: var(--typo-h-medium-font-size);
--input-checkbox-group-label-font-size-m: var(--typo-h-medium-font-size);
--input-checkbox-group-label-font-size-l: var(--typo-h-medium-font-size);
--input-checkbox-group-label-font-family: var(--typo-h-medium-font-face);
--input-checkbox-group-label-font-weight: var(--typo-h-medium-font-weight);
--input-checkbox-group-label-font-style: var(--typo-h-medium-font-style);
--input-checkbox-group-label-line-height: var(--typo-h-medium-line-height);
--input-checkbox-group-label-letter-spacing: var(--typo-h-medium-letter-spacing);
--input-checkbox-group-label-text-transform: var(--typo-h-medium-text-transform);
--input-checkbox-group-label-text-align: var(--typo-h-medium-text-align);
--input-checkbox-group-label-padding: 36px 0 4px 0;
--input-checkbox-group-label-padding-m: 36px 0 4px 0;
--input-checkbox-group-label-padding-l: 36px 0 4px 0;
/* Outer container */
/* Container */
--input-checkbox-container-padding: 8px 0;
--input-checkbox-container-direction: row;
--input-checkbox-container-align-items: center;
--input-checkbox-container-justify-content: space-between;
--input-checkbox-container-border-width: 0;
--input-checkbox-container-border-style: none;
--input-checkbox-container-border-color: transparent;
--input-checkbox-disabled-opacity: var(--pattern-disabled-opacity);
/* Label & info icon container */
--input-checkbox-label-direction: row-reverse;
--input-checkbox-label-justify-content: space-between;
--input-checkbox-label-align-items: center;
/* Image */
--input-checkbox-image-size: 56px;
--input-checkbox-image-size-m: 56px;
--input-checkbox-image-size-l: 56px;
--input-checkbox-image-border-radius: 8px;
--input-checkbox-image-margin: 0 12px 0 0;
--input-checkbox-image-margin-m: 0 12px 0 0;
--input-checkbox-image-margin-l: 0 12px 0 0;
/* Labels container */
/* Label */
--input-checkbox-label-colour-on: var(--meta-swatch-mono-1);
--input-checkbox-label-colour: var(--meta-swatch-mono-1);
--input-checkbox-label-font-family: var(--typo-form-value-font-face);
--input-checkbox-label-font-size: var(--typo-form-value-font-size);
--input-checkbox-label-font-weight: var(--typo-form-label-font-weight);
--input-checkbox-label-font-style: var(--typo-form-value-font-style);
--input-checkbox-label-line-height: var(--typo-form-value-line-height);
--input-checkbox-label-letter-spacing: var(--typo-form-value-letter-spacing);
--input-checkbox-label-text-transform: var(--typo-form-value-text-transform);
--input-checkbox-label-text-align: left;
--input-checkbox-label-margin: 0 16px 0 0;
/*Sub label*/
--input-checkbox-sublabel-colour: var(--meta-swatch-mono-1);
--input-checkbox-sublabel-font-size: 14px;
--input-checkbox-sublabel-font-weight: normal;
--input-checkbox-sublabel-line-height: 1.5;
--input-checkbox-sublabel-letter-spacing: -0.03rem;
/* Label opt 2 */
--input-checkbox-label-opt2-colour: var(--meta-swatch-mono-1);
--input-checkbox-label-opt2-font-family: var(--typo-form-value-font-face);
--input-checkbox-label-opt2-font-size: 18px;
--input-checkbox-label-opt2-font-weight: bold;
--input-checkbox-label-opt2-font-style: var(--typo-form-value-font-style);
--input-checkbox-label-opt2-line-height: var(--typo-form-value-line-height);
--input-checkbox-label-opt2-letter-spacing: var(--typo-form-value-letter-spacing);
--input-checkbox-label-opt2-text-transform: var(--typo-form-value-text-transform);
--input-checkbox-label-opt2-text-align: left;
/* Option explainer */
/* Informer / Info icon */
--input-checkbox-informer-margin: 0 0 0 8px;
/* Field */
--input-checkbox-off-background-colour: rgba(24, 116, 77, 0.2);
--input-checkbox-off-border: none;
--input-checkbox-off-icon-colour: transparent;
--input-checkbox-off-icon-size: var(--pattern-icon-size);
--input-checkbox-off-border-radius: 4px;
--input-checkbox-off-box-shadow: none;
--input-checkbox-on-background-colour: var(--meta-swatch-colour-4);
--input-checkbox-on-border: none;
--input-checkbox-on-icon-colour: var(--meta-swatch-mono-5);
--input-checkbox-on-icon-size: var(--pattern-icon-size);
--input-checkbox-on-border-radius: 4px;
--input-checkbox-on-box-shadow: none;
--swatch-forms-checkbox-bg-on: var(--meta-swatch-colour-1);
--swatch-forms-checkbox-border-on: 1px solid var(--meta-swatch-colour-1);
--swatch-forms-checkbox-icon-on: var(--meta-swatch-mono-5);
--swatch-forms-checkbox-bg-off: transparent;
--swatch-forms-checkbox-border-off: 1px solid var(--meta-swatch-mono-2);
--swatch-forms-checkbox-icon-off: var(--meta-swatch-mono-2);
--effect-forms-checkbox-border-radius: 50%;
/* Checkbox epic */
/* Selected state */
/* Checkbox epic group */
/* Error message */
/* Container */
--forms-error-padding: 2px 0 0 0;
--forms-error-background-color: transparent;
/* Label */
--forms-error-label-colour: var(--meta-swatch-colour-6);
--forms-error-label-font-family: var(--typo-form-label-font-face);
--forms-error-label-font-size: var(--typo-form-label-font-size);
--forms-error-label-font-weight: var(--typo-form-label-font-weight);
--forms-error-label-font-style: var(--typo-form-label-font-style);
--forms-error-label-line-height: var(--typo-form-label-line-height);
--forms-error-label-letter-spacing: var(--typo-form-label-letter-spacing);
--forms-error-label-text-transform: var(--typo-form-label-text-transform);
--forms-error-label-text-align: var(--typo-form-label-text-align);
/* Icon */
--forms-error-icon-display: none;
--forms-error-icon-size: var(--pattern-icon-size);
--forms-error-icon-colour: var(--meta-swatch-colour-12);
--forms-error-icon-margin: 0 4px 0 0;
/* Explainer message */
/* Container */
--forms-explainer-padding: 2px 0 0 0;
--forms-explainer-padding-m: 2px 0 0 0;
--forms-explainer-padding-l: 2px 0 0 0;
/* Label */
--forms-explainer-label-colour: var(--meta-swatch-mono-1);
--forms-explainer-label-font-size: 14px;
--forms-explainer-label-font-size-m: 14px;
--forms-explainer-label-font-size-l: 14px;
--forms-explainer-label-font-weight: 400;
/* Container */
--input-explainer-margin: 0 8px 0 0;
--input-explainer-padding: 4px 0 0 0;
--input-explainer-padding-m: 4px 0 0 0;
--input-explainer-padding-l: 4px 0 0 0;
--input-explainer-background-color: transparent;
--input-explainer-label-colour: var(--typo-p-small-colour);
--input-explainer-label-font-family: var(--typo-p-small-font-face);
--input-explainer-label-font-size: var(--typo-p-small-font-size);
--input-explainer-label-font-weight: var(--typo-p-small-font-weight);
--input-explainer-label-font-style: var(--typo-p-small-font-style);
--input-explainer-label-letter-spacing: var(--typo-p-small-letter-spacing);
--input-explainer-label-line-height: var(--typo-p-small-line-height);
--input-explainer-label-text-transform: var(--typo-p-small-text-transform);
--input-explainer-label-text-align: left;
/* File upload */
--input-file-padding: 0;
--input-file-gap: 8px;
--input-file-border-radius: none;
--input-file-background: transparent;
--input-file-border: none;
--input-file-labels-gap: 4px;
--input-file-label-color: var(--typo-p-medium-colour);
--input-file-label-font-family: var(--typo-p-medium-font-face);
--input-file-label-font-size: var(--typo-p-medium-font-size);
--input-file-label-font-weight: var(--typo-p-medium-font-weight);
--input-file-label-font-style: var(--typo-p-medium-font-style);
--input-file-label-line-height: var(--typo-p-medium-line-height);
--input-file-label-letter-spacing: var(--typo-p-medium-letter-spacing);
--input-file-label-text-transform: var(--typo-p-medium-text-transform);
--input-file-label-text-align: left;
/* Filter toggle (Saved stuff) */
/* Block container */
--filter-toggle-padding: 10px 16px;
--filter-toggle-margin: 16px auto 16px 0;
--filter-toggle-background: var(--meta-swatch-mono-5);
--filter-toggle-border: 2px solid var(--meta-swatch-colour-1);
--filter-toggle-border-radius: 9px;
--filter-toggle-box-shadow: none;
/* Label */
--filter-toggle-label-colour: var(--meta-swatch-colour-1);
--filter-toggle-label-font-size: 12px;
--filter-toggle-label-font-family: 'poppins';
--filter-toggle-label-font-weight: var(--btn-label-font-weight);
--filter-toggle-label-font-style: normal;
--filter-toggle-label-line-height: 1.2;
--filter-toggle-label-text-transform: none;
--filter-toggle-label-margin: 0 0 0 6px;
/* Icon container */
--filter-toggle-icon-bg-height: var(--pattern-icon-size);
--filter-toggle-icon-bg-width: var(--pattern-icon-size);
/* Icon */
--filter-toggle-icon-size: var(--pattern-icon-size);
--filter-toggle-icon-colour: var(--meta-swatch-colour-1);
/* State overrides */
--filter-toggle-background-on: var(--meta-swatch-mono-5);
--filter-toggle-border-on: 1px solid var(--meta-swatch-colour-1);
--filter-toggle-label-colour-on: var(--meta-swatch-mono-2);
--filter-toggle-icon-colour-on: var(--meta-swatch-colour-1);
/* Informer */
/* Block container */
/* Icon */
/* Content / Paragraph */
/* Content / List items */
/* Button */
/* Interactive variant */
/* Block container */
/* Icon */
/* Content / Paragraph */
/* Content / List items */
/* Links */
/* Button */
/* Input Group & Labels */
/* Form container */
/* Input group */
--input-group-align: center;
--input-group-max-width: 100%;
--input-group-spacer: 12px;
--input-container-direction: column;
--input-container-align-items: normal;
--input-container-justify-content: normal;
--input-container-padding: 0;
--input-container-border-width: 0;
--input-container-border-style: none;
--input-container-border-color: transparent;
--input-label-margin: 0 0 8px 0;
--input-label-direction: row;
--input-label-justify-content: flex-start;
--input-label-align-items: center;
--input-informer-margin: 0 8px 0 0;
--input-informer-padding: 0;
--input-informer-border: none;
--input-informer-border-radius: none;
--input-informer-background-color: transparent;
--input-informer-box-shadow: none;
--input-informer-icon-size: 24px;
--input-informer-icon-colour: var(--meta-swatch-colour-4);
/* Labels */
--typo-form-label-colour: var(--meta-swatch-colour-1);
--typo-form-label-font-face: 'poppins';
--typo-form-label-font-size: 13px;
--typo-form-label-font-weight: normal;
--typo-form-label-font-style: italic;
--typo-form-label-line-height: 1.2;
--typo-form-label-letter-spacing: var(--pattern-letter-spacing-body);
--typo-form-label-text-transform: none;
--typo-form-label-margin-bottom: 8px;
/* Values */
--typo-form-value-colour: var(--meta-swatch-colour-1);
--typo-form-value-font-face: 'poppins';
--typo-form-value-font-size: 16px;
--typo-form-value-font-weight: normal;
--typo-form-value-font-style: normal;
--typo-form-value-line-height: 1.2;
--typo-form-value-letter-spacing: var(--pattern-letter-spacing-body);
--typo-form-value-text-transform: none;
--typo-form-value-margin-bottom: 8px;
--input-explainer-label-margin: 8px 0 0 0;
--input-label-block-margin: 0 0 4px 0;
--input-label-block-direction: row;
--input-label-block-justify-content: flex-start;
--input-label-block-align-items: center;
--input-label-inline-margin: 0 4px 0 0;
--input-label-inline-direction: row;
--input-label-inline-justify-content: flex-start;
--input-label-inline-align-items: center;
--input-informer-block-margin: 0 4px 0 0;
--input-informer-inline-margin: 0 4px 0 0;
/* Input menu */
/* Container */
--forms-input-menu-margin: 0;
--forms-input-menu-padding: 0;
--forms-input-menu-border-width: 0;
--forms-input-menu-background-color: var(--meta-swatch-mono-5);
--forms-input-menu-border-radius: 0 8px 8px 0;
--forms-input-menu-box-shadow: none;
/* Item */
--forms-input-menu-item-padding: 8px;
--forms-input-menu-item-keyline: 1px solid var(--meta-swatch-mono-3);
--forms-input-menu-item-label-colour: var(--typo-form-label-colour);
--forms-input-menu-item-label-font-family: var(--typo-form-label-font-face);
--forms-input-menu-item-label-font-size: var(--typo-form-label-font-size);
--forms-input-menu-item-label-font-weight: var(--typo-form-label-font-weight);
--forms-input-menu-item-label-font-style: var(--typo-form-label-font-style);
--forms-input-menu-item-label-line-height: var(--typo-form-label-line-height);
--forms-input-menu-item-label-letter-spacing: var(--typo-form-label-letter-spacing);
--forms-input-menu-item-label-text-transform: var(--typo-form-label-text-transform);
--forms-input-menu-item-label-text-align: var(--typo-form-label-text-align);
/* Popover */
/* Option container */
--popover-padding: 16px 20px;
--popover-bg-colour: var(--meta-swatch-mono-5);
--popover-border: 1px solid var(--meta-swatch-mono-3);
--popover-border-radius: 8px;
--popover-box-shadow: 0px 16px 48px rgba(0, 0, 0, 0.24);
/* Option */
--popover-option-min-height: 40px;
--popover-option-padding: 16px 20px;
--popover-option-margin: 0;
--popover-option-keyline: 1px solid var(--meta-swatch-mono-3);
/* Option label */
--popover-option-label-colour: var(--typo-p-medium-colour);
--popover-option-label-font-face: var(--typo-p-medium-font-face);
--popover-option-label-font-size: var(--typo-p-medium-font-size);
--popover-option-label-font-weight: bold;
--popover-option-label-font-style: var(--typo-p-medium-font-style);
--popover-option-label-line-height: var(--typo-p-medium-line-height);
--popover-option-label-letter-spacing: var(--typo-p-medium-letter-spacing);
--popover-option-label-text-transform: var(--typo-p-medium-text-transform);
--popover-option-label-text-align: left;
--popover-option-label-margin: 0;
/* Hover */
--popover-option-hover-bg-colour: var(--meta-swatch-mono-4);
/* Popover menu */
--popover-menu-padding: 0;
--popover-menu-max-height: 220px;
--popover-menu-border-width: 1px;
--popover-menu-border-style: solid;
--popover-menu-border-color: var(--meta-swatch-mono-3);
--popover-menu-background-color: var(--meta-swatch-mono-5);
--popover-menu-border-radius: 8px;
--popover-menu-box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
/* Popover menu item */
/* Container */
--popover-menu-item-padding: 16px 20px;
--popover-menu-item-height: 40px;
--popover-menu-item-border-width: 0;
--popover-menu-item-background-color: var(--meta-swatch-mono-5);
--popover-menu-item-border-radius: 8px;
--popover-menu-item-box-shadow: none;
/* Label */
--popover-menu-item-label-colour: var(--typo-p-medium-colour);
--popover-menu-item-label-font-family: var(--typo-p-medium-font-face);
--popover-menu-item-label-font-size: var(--typo-p-medium-font-size);
--popover-menu-item-label-font-weight: var(--typo-p-medium-font-weight);
--popover-menu-item-label-font-style: var(--typo-p-medium-font-style);
--popover-menu-item-label-line-height: var(--typo-p-medium-line-height);
--popover-menu-item-label-letter-spacing: var(--typo-p-medium-letter-spacing);
--popover-menu-item-label-text-transform: var(--typo-p-medium-text-transform);
--popover-menu-item-label-text-align: var(--typo-p-medium-text-align);
--popover-menu-item-label-margin: 0 8px 0 0;
/*Label overrides */
/* Hover overrides */
--popover-menu-item-background-color-hover: var(--meta-swatch-mono-7);
/* Focus overrides */
/* Icon */
--popover-menu-item-icon-size: var(--pattern-icon-size);
--popover-menu-item-icon-margin: 0;
--popover-menu-item-icon-colour: var(--meta-swatch-colour-1);
/* Option group headings */
/* Quick feedback */
/* Container */
/* Content container */
/* Header container */
/* Heading */
/* Items container */
/* Item */
/* Icon container */
/* Icon*/
/* Label */
/*ICON STATE OVERRIDES*/
/* Unanswered */
/* Answered */
/* Selected */
/* Radio buttons */
/* Checkbox group legend */
/* Radio group item */
/* Outer container */
--input-radio-disabled-opacity: var(--pattern-disabled-opacity);
/* Container */
--input-radio-container-padding: 8px 0;
--input-radio-container-direction: row-reverse;
--input-radio-container-justify-content: space-between;
--input-radio-container-align-items: center;
--input-radio-container-border-width: 0;
--input-radio-container-border-style: none;
--input-radio-container-border-color: transparent;
/* Label & info icon container */
--input-radio-label-direction: row-reverse;
--input-radio-label-justify-content: space-between;
--input-radio-label-align-items: center;
/* Image */
/* Labels container */
/* Label */
--input-radio-label-colour: var(--typo-form-value-colour);
--input-radio-label-font-family: var(--typo-form-value-font-face);
--input-radio-label-font-size: var(--typo-form-value-font-size);
--input-radio-label-font-weight: var(--typo-form-value-font-weight);
--input-radio-label-font-style: var(--typo-form-value-font-style);
--input-radio-label-line-height: var(--typo-form-value-line-height);
--input-radio-label-letter-spacing: var(--typo-form-value-letter-spacing);
--input-radio-label-text-transform: var(--typo-form-value-text-transform);
--input-radio-label-text-align: left;
--input-radio-label-margin: 0 16px 0 0;
/*Sub label*/
/* Label opt 2 */
/* Option explainer */
/* Informer / Info icon */
--input-radio-informer-margin: 0 0 0 8px;
/* Field */
--input-radio-off-background-colour: rgba(24, 116, 77, 0.2);
--input-radio-off-border: none;
--input-radio-off-icon-colour: transparent;
--input-radio-off-icon-size: var(--pattern-icon-size);
--input-radio-off-border-radius: 50%;
--input-radio-off-box-shadow: none;
--input-radio-on-background-colour: var(--meta-swatch-colour-4);
--input-radio-on-border: none;
--input-radio-on-icon-colour: var(--meta-swatch-mono-5);
--input-radio-on-icon-size: var(--pattern-icon-size);
--input-radio-on-border-radius: 50%;
--input-radio-on-box-shadow: none;
/* Link */
/* Required indicator */
/* Segmented button */
/* Container */
--forms-segmented-btn-height: auto;
--forms-segmented-btn-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.08) inset;
--forms-segmented-btn-border: 1px solid #f2f2f2;
--forms-segmented-btn-border-radius: 6px;
--forms-segmented-btn-bg-colour: #F2F2F2;
--forms-segmented-btn-padding: 1px;
--forms-segmented-btn-flex-direction: row;
--forms-segmented-btn-flex-direction-m: row;
--forms-segmented-btn-flex-direction-l: row;
/* Item layout */
--forms-segmented-btn-item-height: 46px;
--forms-segmented-btn-item-height-m: 46px;
--forms-segmented-btn-item-height-l: 46px;
--forms-segmented-btn-item-padding: 0px 8px;
--forms-segmented-btn-item-margin: none;
--forms-segmented-btn-item-margin-m: none;
--forms-segmented-btn-item-margin-l: none;
/* Item common props */
--forms-segmented-btn-item-label-face: var(--typo-form-label-font-face);
--forms-segmented-btn-item-label-font-size: 13px;
--forms-segmented-btn-item-sublabel-face: var(--typo-form-label-font-face);
/* Item off */
--forms-segmented-btn-item-off-outer-radius: 5px;
--forms-segmented-btn-item-off-inner-radius: 2px;
--forms-segmented-btn-item-off-bg-colour: #FFFFFF;
--forms-segmented-btn-item-off-border: none;
--forms-segmented-btn-item-off-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.16);
--forms-segmented-btn-item-off-label-colour: var(--typo-form-label-colour);
--forms-segmented-btn-item-off-label-weight: var(--typo-form-label-font-weight);
--forms-segmented-btn-item-off-label-font-style: normal;
--forms-segmented-btn-item-off-label-line-height: var(--typo-form-label-line-height);
--forms-segmented-btn-item-off-label-letter-spacing: var(--typo-form-label-letter-spacing);
--forms-segmented-btn-item-off-label-text-transform: var(--typo-form-label-text-transform);
/* Item on */
--forms-segmented-btn-item-on-outer-radius: 5px;
--forms-segmented-btn-item-on-inner-radius: 2px;
--forms-segmented-btn-item-on-bg-colour: #F2F2F2;
--forms-segmented-btn-item-on-border: 1px solid #f2f2f2;
--forms-segmented-btn-item-on-box-shadow: none;
--forms-segmented-btn-item-on-label-colour: var(--meta-swatch-mono-10);
--forms-segmented-btn-item-on-label-weight: var(--typo-form-label-font-weight);
--forms-segmented-btn-item-on-label-font-style: normal;
--forms-segmented-btn-item-on-label-line-height: var(--typo-form-label-line-height);
--forms-segmented-btn-item-on-label-letter-spacing: var(--typo-form-label-letter-spacing);
--forms-segmented-btn-item-on-label-text-transform: var(--typo-form-label-text-transform);
/* Label */
/* Select menu */
--select-container-padding: 16px 0 0;
/* Field */
--select-field-padding: 16px 20px;
--select-field-border-width: 1px;
--select-field-border-style: solid;
--select-field-border-color: var(--meta-swatch-mono-3);
--select-field-background-color: var(--meta-swatch-mono-5);
--select-field-border-radius: 8px;
--select-field-box-shadow: none;
/* Label */
--select-label-colour: var(--typo-form-label-colour);
--select-label-font-family: var(--typo-form-label-font-face);
--select-label-font-size: var(--typo-form-label-font-size);
--select-label-font-weight: var(--typo-form-label-font-weight);
--select-label-font-style: var(--typo-form-label-font-style);
--select-label-line-height: var(--typo-form-label-line-height);
--select-label-letter-spacing: var(--typo-form-label-letter-spacing);
--select-label-text-transform: var(--typo-form-label-text-transform);
--select-label-text-align: var(--typo-form-label-text-align);
/* Value */
--select-value-colour: var(--typo-form-value-colour);
--select-value-font-family: var(--typo-form-value-font-face);
--select-value-font-size: var(--typo-form-value-font-size);
--select-value-font-weight: bold;
--select-value-font-style: var(--typo-form-value-font-style);
--select-value-line-height: var(--typo-form-value-line-height);
--select-value-letter-spacing: var(--typo-form-value-letter-spacing);
--select-value-text-transform: var(--typo-form-value-text-transform);
--select-value-text-align: var(--typo-form-value-text-align);
/* Icon */
--select-icon-size: var(--pattern-icon-size);
--select-icon-colour: var(--meta-swatch-colour-1);
--select-icon-margin: 0;
/* Switch */
/* Container */
--input-switch-container-padding: 8px 0;
--input-switch-container-direction: row;
--input-switch-container-justify-content: space-between;
--input-switch-container-justify-align-items: center;
--input-switch-container-border-width: 0;
--input-switch-container-border-style: none;
--input-switch-container-border-color: transparent;
/* Control layout */
--input-switch-body-width: 56px;
--input-switch-body-height: 28px;
--input-switch-body-padding: 2px;
--input-switch-body-border-radius: 16px;
--input-switch-handle-size: 28px;
/* Body off */
--input-switch-off-body-bg-colour: var(--meta-swatch-mono-3);
--input-switch-off-body-border: none;
--input-switch-off-body-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.08);
--input-switch-off-handle-bg-colour: var(--meta-swatch-colour-1);
--input-switch-off-handle-border: none;
--input-switch-off-handle-box-shadow: none;
/* Body on */
--input-switch-on-body-bg-colour: var(--meta-swatch-colour-4);
--input-switch-on-body-border: none;
--input-switch-on-body-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
--input-switch-on-handle-bg-colour: var(--meta-swatch-colour-1);
--input-switch-on-handle-border: none;
--input-switch-on-handle-box-shadow: none;
/* Body mandatory */
--input-switch-mandatory-body-background: var(--meta-swatch-colour-1);
--input-switch-mandatory-body-border: none;
--input-switch-mandatory-body-border-radius: 20px;
--input-switch-mandatory-body-box-shadow: none;
--input-switch-mandatory-body-padding: 6px 20px;
/* Body label */
--input-switch-mandatory-body-label-colour: var(--meta-swatch-mono-5);
--input-switch-mandatory-body-label-font-family: var(--typo-data-label-s-font-face);
--input-switch-mandatory-body-label-font-size: var(--typo-data-label-s-font-size);
--input-switch-mandatory-body-label-font-weight: 390;
--input-switch-mandatory-body-label-font-style: var(--typo-data-label-s-font-style);
--input-switch-mandatory-body-label-line-height: var(--typo-data-label-s-line-height);
--input-switch-mandatory-body-label-letter-spacing: var(--typo-data-label-s-letter-spacing);
--input-switch-mandatory-body-label-text-transform: var(--typo-data-label-s-text-transform);
--input-switch-mandatory-body-label-text-align: var(--typo-data-label-s-text-align);
--input-switch-disallowed-body-background: var(--meta-swatch-mono-4);
--input-switch-disallowed-body-label-colour: var(--meta-swatch-mono-2);
/* Label */
--input-switch-label-direction: row;
--input-switch-label-justify-content: flex-start;
--input-switch-label-align-items: center;
--input-switch-label-colour: var(--typo-form-label-colour);
--input-switch-label-font-family: var(--typo-form-label-font-face);
--input-switch-label-font-size: 16px:;
--input-switch-label-font-weight: bold;
--input-switch-label-font-style: none;
--input-switch-label-line-height: var(--typo-form-label-line-height);
--input-switch-label-letter-spacing: var(--typo-form-label-letter-spacing);
--input-switch-label-text-transform: var(--typo-form-label-text-transform);
--input-switch-label-text-align: var(--typo-form-label-text-align);
--input-switch-label-margin: 0 8px 0 0;
--input-switch-informer-margin: 0 8px 0 0;
/* Text area */
/* Container */
/* Field container */
--forms-textarea-padding: 12px 8px;
--forms-textarea-width: 100%;
--forms-textarea-height: auto;
--forms-textarea-border-width: 1px;
--forms-textarea-border-style: solid;
--forms-textarea-border-color: var(--meta-swatch-mono-8);
--forms-textarea-background-color: transparent;
--forms-textarea-border-radius: 0;
--forms-textarea-box-shadow: none;
/* Label */
--forms-textarea-label-colour: var(--typo-form-label-colour);
--forms-textarea-label-font-family: var(--typo-form-label-font-face);
--forms-textarea-label-font-size: var(--typo-form-label-font-size);
--forms-textarea-label-font-weight: var(--typo-form-label-font-weight);
--forms-textarea-label-font-style: var(--typo-form-label-font-style);
--forms-textarea-label-line-height: var(--typo-form-label-line-height);
--forms-textarea-label-letter-spacing: var(--typo-form-label-letter-spacing);
--forms-textarea-label-text-transform: var(--typo-form-label-text-transform);
--forms-textarea-label-text-align: var(--typo-form-label-text-align);
/* Informer */
/* Placeholder */
--forms-textarea-placeholder-colour: var(--meta-swatch-mono-2);
--forms-textarea-placeholder-font-family: var(--typo-form-value-font-face);
--forms-textarea-placeholder-font-size: 16px;
--forms-textarea-placeholder-font-weight: var(--typo-form-value-font-weight);
--forms-textarea-placeholder-font-style: var(--typo-form-value-font-style);
--forms-textarea-placeholder-line-height: var(--typo-form-value-line-height);
--forms-textarea-placeholder-letter-spacing: var(--typo-form-value-letter-spacing);
--forms-textarea-placeholder-text-transform: var(--typo-form-value-text-transform);
--forms-textarea-placeholder-text-align: var(--typo-form-value-text-align);
/* Value */
--forms-textarea-value-colour: var(--typo-form-value-colour);
--forms-textarea-value-font-family: var(--typo-form-value-font-face);
--forms-textarea-value-font-size: var(--typo-form-value-font-size);
--forms-textarea-value-font-weight: var(--typo-form-value-font-weight);
--forms-textarea-value-font-style: var(--typo-form-value-font-style);
--forms-textarea-value-line-height: var(--typo-form-value-line-height);
--forms-textarea-value-letter-spacing: var(--typo-form-value-letter-spacing);
--forms-textarea-value-text-transform: var(--typo-form-value-text-transform);
--forms-textarea-value-text-align: var(--typo-form-value-text-align);
/* Text input */
/* Layout order */
/* Container */
/* Field container */
--forms-input-padding: 12px 8px;
--forms-input-width: 100%;
--forms-input-height: auto;
--forms-input-border-width: 1px;
--forms-input-border-style: solid;
--forms-input-border-color: var(--meta-swatch-mono-8);
--forms-input-background-color: transparent;
--forms-input-border-radius: 0;
--forms-input-box-shadow: none;
--forms-input-action-button-icon-size: var(--pattern-icon-size);
--forms-input-action-button-icon-color: var(--meta-swatch-mono-2);
/* Label */
--forms-input-label-colour: var(--typo-form-label-colour);
--forms-input-label-font-family: var(--typo-form-label-font-face);
--forms-input-label-font-size: var(--typo-form-label-font-size);
--forms-input-label-font-weight: var(--typo-form-label-font-weight);
--forms-input-label-font-style: var(--typo-form-label-font-style);
--forms-input-label-line-height: var(--typo-form-label-line-height);
--forms-input-label-letter-spacing: var(--typo-form-label-letter-spacing);
--forms-input-label-text-transform: var(--typo-form-label-text-transform);
--forms-input-label-text-align: var(--typo-form-label-text-align);
/* Informer */
/* Placeholder */
--forms-input-placeholder-colour: var(--meta-swatch-mono-2);
--forms-input-placeholder-font-family: var(--typo-form-value-font-face);
--forms-input-placeholder-font-size: 16px;
--forms-input-placeholder-font-weight: var(--typo-form-value-font-weight);
--forms-input-placeholder-font-style: var(--typo-form-value-font-style);
--forms-input-placeholder-line-height: var(--typo-form-value-line-height);
--forms-input-placeholder-letter-spacing: var(--typo-form-value-letter-spacing);
--forms-input-placeholder-text-transform: var(--typo-form-value-text-transform);
--forms-input-placeholder-text-align: var(--typo-form-value-text-align);
/* Value */
--forms-input-value-colour: var(--typo-form-value-colour);
--forms-input-value-font-family: var(--typo-form-value-font-face);
--forms-input-value-font-size: var(--typo-form-value-font-size);
--forms-input-value-font-weight: var(--typo-form-value-font-weight);
--forms-input-value-font-style: var(--typo-form-value-font-style);
--forms-input-value-line-height: var(--typo-form-value-line-height);
--forms-input-value-letter-spacing: var(--typo-form-value-letter-spacing);
--forms-input-value-text-transform: var(--typo-form-value-text-transform);
--forms-input-value-text-align: var(--typo-form-value-text-align);
/* Code validation */
/* Validation container */
--forms-input-validation-container-gap: 8px;
--forms-input-validation-container-gap-m: 8px;
--forms-input-validation-container-gap-l: 8px;
--forms-input-validation-container-flex-direction: row;
--forms-input-validation-container-flex-direction-m: row;
--forms-input-validation-container-flex-direction-l: row;
/* Redeem button */
--forms-input-validation-btn-width: 100%;
--forms-input-validation-btn-max-width: fit-content;
--forms-input-validation-btn-max-width-m: fit-content;
--forms-input-validation-btn-max-width-l: fit-content;
--forms-input-validation-btn-height: 46px;
--forms-input-validation-btn-height-m: 46px;
--forms-input-validation-btn-height-l: 46px;
/* Confirmation text */
--forms-input-validation-confirmation-padding: 2px 0 0 0;
--forms-input-validation-confirmation-padding-m: 2px 0 0 0;
--forms-input-validation-confirmation-padding-l: 2px 0 0 0;
--forms-input-validation-confirmation-colour: #00663D;
--forms-input-validation-confirmation-font-family: var(--typo-form-label-font-face);
--forms-input-validation-confirmation-font-size: var(--typo-form-label-font-size);
--forms-input-validation-confirmation-font-weight: var(--typo-form-label-font-weight);
--forms-input-validation-confirmation-font-style: normal;
--forms-input-validation-confirmation-line-height: var(--typo-form-label-line-height);
--forms-input-validation-confirmation-letter-spacing: var(--typo-form-label-letter-spacing);
--forms-input-validation-confirmation-text-transform: var(--typo-form-label-text-transform);
--forms-input-validation-confirmation-text-align: var(--typo-form-label-text-align);
/* Password validation */
/* Check if we can delete */
--account-password-tick-off-colour: rgba(85, 85, 85, 0.1);
--account-password-tick-on-colour: var(--meta-swatch-colour-12);
--input-tick-container-padding: 0;
--input-tick-container-direction: row-reverse;
--input-tick-container-align-items: left;
--input-tick-container-justify-content: flex-end;
--input-tick-container-border-width: 0;
--input-tick-container-border-style: none;
--input-tick-container-border-color: transparent;
--input-tick-label-direction: row;
--input-tick-label-justify-content: flex-start;
--input-tick-label-align-items: center;
--input-tick-label-colour: var(--typo-p-small-colour);
--input-tick-label-font-face: var(--typo-p-small-font-face);
--input-tick-label-font-family: var(--typo-p-small-font-face);
--input-tick-label-font-size: var(--typo-p-small-font-size);
--input-tick-label-font-weight: var(--typo-p-small-font-weight);
--input-tick-label-font-style: var(--typo-p-small-font-style);
--input-tick-label-line-height: var(--typo-p-small-line-height);
--input-tick-label-letter-spacing: var(--typo-p-small-letter-spacing);
--input-tick-label-text-transform: var(--typo-p-small-text-transform);
--input-tick-label-text-align: left;
--input-tick-label-margin: 0 0 0 8px;
--forms-wheel-informer-margin: 0 8px 0 0;
/* These should be the new controls */
--swatch-forms-tick-size: var(--pattern-icon-size);
/* Block container */
--password-validation-gap: 4px;
--password-validation-gap-m: 4px;
--password-validation-gap-l: 4px;
/* Heading */
--password-validation-heading-font-family: var(--typo-p-medium-font-face);
--password-validation-heading-font-size: var(--typo-p-medium-font-size);
--password-validation-heading-colour: var(--typo-p-medium-colour);
--password-validation-heading-font-weight: var(--typo-p-medium-font-weight);
--password-validation-heading-font-style: var(--typo-p-medium-font-style);
--password-validation-heading-line-height: var(--typo-p-medium-line-height);
--password-validation-heading-letter-spacing: var(--typo-p-medium-letter-spacing);
--password-validation-heading-text-transform: var(--typo-p-medium-text-transform);
--password-validation-heading-text-align: left;
/* Tick list */
--password-validation-tick-list-padding: 0 0 8px 0;
--password-validation-tick-list-padding-m: 0 0 8px 0;
--password-validation-tick-list-padding-l: 0 0 8px 0;
/* Tick row */
--password-validation-tick-row-direction: row-reverse;
--password-validation-tick-row-align-items: center;
--password-validation-tick-row-justify-content: flex-end;
/* Tick Row Label */
/* Tick Row Icon */
--password-validation-icon-size: 18px;
--password-validation-icon-fill-off: var(--meta-swatch-mono-8);
--password-validation-icon-fill-on: var(--meta-swatch-colour-1);
/* Wheel input */
/* Container */
--forms-wheel-container-max-width: var(--btn-max-width);
--forms-wheel-text-margin-bottom: var(--pattern-form-label-margin-bottom);
--forms-wheel-label-width: 27.5%;
--forms-wheel-value-width: 45%;
/* Grips */
--forms-wheel-grip-container-height: 48px;
--forms-wheel-grip-container-bg-colour: var(--meta-swatch-mono-8);
--forms-wheel-grip-container-border: none;
--forms-wheel-grip-container-border-radius: 6px;
--forms-wheel-grip-container-shadow: var(--pattern-depression-low);
/* Field */
--forms-wheel-grips-height: 32px;
--forms-wheel-grips-width: 2px;
--forms-wheel-grips-colour: var(--meta-swatch-mono-7);
--forms-wheel-grips-vertical-position: center;
/* Stepper buttons */
--forms-wheel-stepper-width: 24px;
--forms-wheel-stepper-height: 48px;
--forms-wheel-stepper-margin: 12px;
--forms-wheel-stepper-bg-colour: transparent;
--forms-wheel-stepper-border: none;
--forms-wheel-stepper-border-radius: 0;
--forms-wheel-stepper-icon-size: var(--pattern-icon-size);
--forms-wheel-stepper-icon-on-colour: var(--meta-swatch-mono-12);
--forms-wheel-stepper-icon-off-colour: var(--meta-swatch-mono-7);
--forms-wheel-stepper-disabled-opacity: var(--pattern-disabled-opacity);
/* Frame */
--forms-wheel-frame-display: none;
--forms-wheel-fade-colour: none;
/* Value indicator */
--forms-wheel-indicator-on-colour: transparent;
--forms-wheel-indicator-off-colour: transparent;
--forms-wheel-indicator-width: 2px;
--forms-wheel-indicator-arrowhead-display: none;
--forms-wheel-indicator-height: 100%;
--forms-wheel-indicator-align: 0;
/* Label */
--forms-wheel-label-direction: row;
--forms-wheel-label-justify-content: flex-start;
--forms-wheel-label-align-items: center;
--forms-wheel-label-colour: var(--typo-form-label-colour);
--forms-wheel-label-font-face: var(--typo-form-label-font-face);
--forms-wheel-label-font-size: var(--typo-form-label-font-size);
--forms-wheel-label-font-weight: var(--typo-form-label-font-weight);
--forms-wheel-label-font-style: var(--typo-form-label-font-style);
--forms-wheel-label-line-height: var(--typo-form-label-line-height);
--forms-wheel-label-letter-spacing: var(--typo-form-label-letter-spacing);
--forms-wheel-label-text-transform: var(--typo-form-label-text-transform);
--forms-wheel-value-colour: var(--typo-form-value-colour);
--forms-wheel-value-font-face: var(--typo-form-value-font-face);
--forms-wheel-value-font-size: var(--typo-form-value-font-size);
--forms-wheel-value-font-weight: var(--typo-form-value-font-weight);
--forms-wheel-value-font-style: var(--typo-form-value-font-style);
--forms-wheel-value-line-height: var(--typo-form-value-line-height);
--forms-wheel-value-letter-spacing: var(--typo-form-value-letter-spacing);
--forms-wheel-value-text-transform: var(--typo-form-value-text-transform);
--forms-wheel-value-text-align: center;
--forms-wheel-computed-colour: var(--typo-form-value-colour);
--forms-wheel-computed-font-face: var(--typo-form-value-font-face);
--forms-wheel-computed-font-size: var(--typo-form-value-font-size);
--forms-wheel-computed-font-weight: var(--typo-form-value-font-weight);
--forms-wheel-computed-font-style: var(--typo-form-value-font-style);
--forms-wheel-computed-line-height: var(--typo-form-value-line-height);
--forms-wheel-computed-letter-spacing: var(--typo-form-value-letter-spacing);
--forms-wheel-computed-text-transform: var(--typo-form-value-text-transform);
/* Navigation */
/* Accordion (Old - but still used in places) */
/* Block Container */
/*
List Container */
--accordion-v2-padding: 0;
--accordion-v2-border: none;
--accordion-v2-border-radius: 12px;
--accordion-v2-item-keyline: 1px solid var(--swatch-accordion-keyline);
/*
*/
--acc-list-background: var(--meta-swatch-mono-5);
--acc-list-gap: 2px;
--acc-list-gap-m: 2px;
--acc-list-gap-l: 2px;
--acc-list-padding: 0;
--acc-list-border: none;
--acc-list-border-radius: 12px;
--accordion-v2-item-keyline: 1px solid var(--swatch-accordion-keyline);
/* Item