@font-face {
    font-family: 'AGDelta';
    src: url('../assets/fonts/AGDeltaVARVF.woff2') format('woff2-variations'), url('../assets/fonts/AGDeltaVARVF.woff2') format('woff2 supports variations');
    font-style: normal bold;
    font-weight: 400 700;
}

@font-face {
    font-family: 'AGMore-Headline';
    src: url('../assets/fonts/AGMore-Headline.otf') format('opentype');
    font-style: normal bold;
    font-weight: 500 700;
}

@font-face {
    font-family: 'Mont Regular';
    src: url('../assets/fonts/MontRegular.woff2') format('woff2'), url('../assets/fonts/MontRegular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Mont Bold';
    src: url('../assets/fonts/MontBold.woff2') format('woff2'), url('../assets/fonts/MontBold.woff') format('woff');
    font-weight: 400 800;
    font-style: normal bold;
}

:root {
    /* Primary colours */
    --black: 30, 32, 25;
    --white: 255, 255, 255;
    /* Group colour */
    --group-colour: 0, 72, 30;
    --tonal-green: 4, 106, 56;
    /* Info States */
    --state-valid: 131, 202, 17;
    --state-valid-light: 233, 248, 225;
    --state-error: 205, 61, 61;
    --state-error-light: 245, 231, 231;
    --state-pending: 255, 138, 0;
    --state-info: 61, 136, 205;
    --state-info-light: 231, 239, 245;
    /* Opacity */
    --text-opacity: 1;
    --bg-opacity: 1;
    --ald-border-opacity: 1;
    /* Form colour */
    --form-grey: 242, 242, 242
}

.aldermore {
    --primary-colour: 255, 205, 0;
    --primary-colour-hover: 255, 220, 77;
    --primary-colour-pressed: 242, 199, 4;
    --secondary-colour: 11, 73, 88;
    --secondary-colour-hover: 74, 75, 70;
    --secondary-colour-pressed: 52, 54, 47;
    --secondary-light-colour-hover: 232, 233, 232;
    --secondary-light-colour-pressed: 210, 210, 209;
    --soft-primary: 218, 247, 213;
    --grey-light: 248, 248, 248;
}

.motonovo {
    --primary-colour: 0, 159, 190;
    --primary-colour-hover: 77, 188, 210;
    --primary-colour-pressed: 0, 122, 146;
    --secondary-colour: 11, 73, 88;
    --secondary-colour-hover: 74, 75, 70;
    --secondary-colour-pressed: 52, 54, 47;
    --secondary-light-colour-hover: 232, 233, 232;
    --secondary-light-colour-pressed: 210, 210, 209;
    --navy-primary: 11, 73, 88;
    --grey-light: 248, 248, 248;
}

.aldermoreRebrand {
    --primary-colour: 79, 226, 0;
    --primary-colour-hover: 149, 238, 102;
    --primary-colour-pressed: 114, 232, 51;
    --secondary-colour-hover: 120, 121, 117;
    --secondary-colour-pressed: 75, 77, 71;
    --secondary-light-colour-hover: 232, 233, 232;
    --secondary-light-colour-pressed: 210, 210, 209;
    --soft-primary: 218, 247, 213;
    --grey-light: 245, 244, 247;
}

.motonovoRebrand {
    --primary-colour: 0,225, 255;
    --primary-colour-hover: 163, 244, 255;
    --primary-colour-pressed: 92, 236, 255;
    --secondary-colour-hover: 120, 121, 117;
    --secondary-colour-pressed: 75, 77, 71;
    --secondary-light-colour-hover: 232, 233, 232;
    --secondary-light-colour-pressed: 210, 210, 209;
    --soft-primary: 199, 239, 255;
    --grey-light: 245, 244, 247;
}

.colour__swatch {
    column-gap: 1.25rem;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 2rem;
    row-gap: 3rem;
}

.background__primary-soft {
    background-color: rgb(var(--soft-primary));
}

.background__primary {
    background-color: rgb(var(--primary-colour));
}

.background__secondary {
    background-color: rgb(var(--secondary-colour));
}

.background__group {
    background-color: rgb(var(--group-colour));
}

.background__group-tonal {
    background-color: rgb(var(--tonal-green));
}

.background__grey-light {
    background-color: rgb(var(--grey-light));
}

.background__white {
    background-color: rgb(var(--white));
}

.background__black {
    background-color: rgb(var(--black));
}

.background__state-error {
    background-color: rgba(var(--state-error), var(--bg-opacity));
}

.background__state-error--light {
    background-color: rgb(var(--state-error-light));
}

.background__state-error.transparent {
    --bg-opacity: 0.1;
}

.background__state-info {
    background-color: rgba(var(--state-info), var(--bg-opacity));
}

.background__state-info--light {
    background-color: rgb(var(--state-info-light));
}

.background__state-info.transparent {
    --bg-opacity: 0.1;
}

.background__state-valid {
    background-color: rgba(var(--state-valid), var(--bg-opacity));
}

.background__state-valid--light {
    background-color: rgb(var(--state-valid-light));
}

.background__state-valid.transparent {
    --bg-opacity: 0.1;
}

.border__state-error {
    border-color: rgb(var(--state-error));
    border-width: 0.0625rem;
    border-style: solid;
}

.border__state-info {
    border-color: rgb(var(--state-info));
    border-width: 0.0625rem;
    border-style: solid;
}

.border__state-valid {
    border-color: rgb(var(--state-valid));
    border-width: 0.0625rem;
    border-style: solid;
}

.text__white {
    color: rgb(var(--white));
}

.text__black {
    color: rgb(var(--black));
}

.text__primary {
    color: rgb(var(--primary-colour));
}

.text__error {
    color: rgb(var(--state-error));
}

.text__info {
    color: rgb(var(--state-info));
}

/* 

Basic font 'utility' classes that replace the inital Tailwind config  
and base element style selectors.

*/

:root {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: antialiased;
    --font-input-default: 1.125rem;
    --font-label-default: 0.875rem;
    --font-a-default: 1rem;
    --font-a-highvp: 1rem;
    --font-span-default: 0.875rem;
    --font-span-small-default: 0.75rem;
    --font-span-large-default: 1.5rem;
    /* hierarchy headers default */
    --font-h1-default: 2.5rem;
    --font-h2-default: 2rem;
    --font-h3-default: 1.75rem;
    --font-h4-default: 1.5rem;
    --font-h5-default: 1.375rem;
    --font-h6-default: 1.25rem;
    /* hierarchy headers medium */
    --font-h1-medium: 2.75rem;
    --font-h2-medium: 2.125rem;
    --font-h3-medium: 1.875rem;
    --font-h4-medium: 1.625rem;
    --font-h5-medium: 1.375rem;
    --font-h6-medium: 1.25rem;
    /* hierarchy headers large */
    --font-h1-large: 3rem;
    --font-h2-large: 2.25rem;
    --font-h3-large: 2rem;
    --font-h4-large: 1.75rem;
    --font-h5-large: 1.5rem;
    --font-h6-large: 1.25rem;
    /* homepage headers default */
    --font-h1-default-homepage: 3.375rem;
    --font-h2-default-homepage: 2.25rem;
    --font-h3-default-homepage: 2rem;
    --font-h4-default-homepage: 1.75rem;
    --font-h5-default-homepage: 1.5rem;
    --font-h6-default-homepage: 1.25rem;
    /* homepage headers medium */
    --font-h1-medium-homepage: 3.625rem;
    --font-h2-medium-homepage: 2.25rem;
    --font-h3-medium-homepage: 2rem;
    --font-h4-medium-homepage: 1.75rem;
    --font-h5-medium-homepage: 1.5rem;
    --font-h6-medium-homepage: 1.25rem;
    /* homepage headers large */
    --font-h1-large-homepage: 4rem;
    --font-h2-large-homepage: 2.25rem;
    --font-h3-large-homepage: 2rem;
    --font-h4-large-homepage: 1.75rem;
    --font-h5-large-homepage: 1.5rem;
    --font-h6-large-homepage: 1.25rem;
    /* paragraph fonts */
    --font-p-default: 1rem;
    --font-p-large: 1.125rem;
    --font-p-subtitle: 0.875rem;
    --font-p-caption: 0.75rem;
    --font-body-copy: 'Mont Regular','Arial', 'sans-serif';
    --font-body-copy-bold: 'Mont Bold','Arial', 'sans-serif';
    --font-headline: 'Mont Bold','Arial', 'sans-serif';
}

    :root .font-regular {
        font-family: var(--font-body-copy);
    }

    :root .font-bold {
        font-family: var(--font-body-copy-bold);
        font-weight: 400;
    }

    :root .font-headline {
        font-family: var(--font-headline);
    }

    :root .font-display {
        font-family: var(--font-heavy);
    }

    :root .font-header {
        font-family: var(--font-headline);
    }

    :root .font-paragraph {
        font-family: var(--font-body-copy);
    }

    :root .font-colour__white {
        color: rgb(var(--white));
        opacity: var(--text-opacity);
    }

    :root .font-colour__black {
        color: rgb(var(--black));
        opacity: var(--text-opacity);
    }

    :root .font-colour__violet {
        color: rgb(var(--violet));
        opacity: var(--text-opacity);
    }

    :root .font-colour__cassis {
        color: rgb(var(--cassis));
        opacity: var(--text-opacity);
    }

    :root .font-colour__verdant {
        color: rgb(var(--verdant));
        opacity: var(--text-opacity);
    }

    :root .font-colour__teal {
        color: rgb(var(--teal));
        opacity: var(--text-opacity);
    }

    :root .font-colour__form-red {
        color: rgb(var(--form-red));
        opacity: var(--text-opacity);
    }

    :root h1 {
        font-family: var(--font-headline);
        font-size: var(--font-size, var(--font-h1-default));
        letter-spacing: calc(var(--font-size, var(--font-h1-default)) * -0.02);
        line-height: 120%;
    }

@media (min-width: 640px) {

    :root h1 {
        --font-size: var(--font-h1-medium)
    }
}

@media (min-width: 1024px) {

    :root h1 {
        --font-size: var(--font-h1-large)
    }
}

:root h1.homepage {
    --font-size: var(--font-h1-default-homepage);
}

@media (min-width: 640px) {

    :root h1.homepage {
        --font-size: var(--font-h1-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root h1.homepage {
        --font-size: var(--font-h1-large-homepage)
    }
}

:root h2 {
    --font-family: var(--font-headline);
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h2-default));
    letter-spacing: calc(var(--font-size, var(--font-h2-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root h2 {
        --font-size: var(--font-h2-medium)
    }
}

@media (min-width: 1024px) {

    :root h2 {
        --font-size: var(--font-h2-large)
    }
}

:root h2.homepage {
    --font-size: var(--font-h2-default-homepage);
}

@media (min-width: 640px) {

    :root h2.homepage {
        --font-size: var(--font-h2-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root h2.homepage {
        --font-size: var(--font-h2-large-homepage)
    }
}

:root h3 {
    --font-family: var(--font-headline);
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h3-default));
    letter-spacing: calc(var(--font-size, var(--font-h3-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root h3 {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    :root h3 {
        --font-size: var(--font-h3-large)
    }
}

:root h3.homepage {
    --font-size: var(--font-h3-default-homepage);
}

@media (min-width: 640px) {

    :root h3.homepage {
        --font-size: var(--font-h3-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root h3.homepage {
        --font-size: var(--font-h3-large-homepage)
    }
}

:root h4 {
    --font-family: var(--font-headline);
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h4-default));
    letter-spacing: calc(var(--font-size, var(--font-h4-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root h4 {
        --font-size: var(--font-h4-medium)
    }
}

@media (min-width: 1024px) {

    :root h4 {
        --font-size: var(--font-h4-large)
    }
}

:root h4.homepage {
    --font-size: var(--font-h4-default-homepage);
}

@media (min-width: 640px) {

    :root h4.homepage {
        --font-size: var(--font-h4-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root h4.homepage {
        --font-size: var(--font-h4-large-homepage)
    }
}

:root h5 {
    --font-family: var(--font-headline);
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h5-default));
    letter-spacing: calc(var(--font-size, var(--font-h5-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root h5 {
        --font-size: var(--font-h5-medium)
    }
}

@media (min-width: 1024px) {

    :root h5 {
        --font-size: var(--font-h5-large)
    }
}

:root h5.homepage {
    --font-size: var(--font-h5-default-homepage);
}

@media (min-width: 640px) {

    :root h5.homepage {
        --font-size: var(--font-h5-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root h5.homepage {
        --font-size: var(--font-h5-large-homepage)
    }
}

:root h6 {
    --font-family: var(--font-headline);
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h6-default));
    letter-spacing: calc(var(--font-size, var(--font-h6-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root h6 {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    :root h6 {
        --font-size: var(--font-h6-large)
    }
}

:root h6.homepage {
    --font-size: var(--font-h6-default-homepage);
}

@media (min-width: 640px) {

    :root h6.homepage {
        --font-size: var(--font-h6-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root h6.homepage {
        --font-size: var(--font-h6-large-homepage)
    }
}

:root .masthead-header {
    --font-size: var(--font-h1-default);
}

@media (min-width: 640px) {

    :root .masthead-header {
        --font-size: var(--font-h1-medium)
    }
}

@media (min-width: 1024px) {

    :root .masthead-header {
        --font-size: var(--font-h1-large)
    }
}

:root .masthead-header.homepage {
    --font-size: var(--font-h1-default-homepage);
}

@media (min-width: 640px) {

    :root .masthead-header.homepage {
        --font-size: var(--font-h1-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root .masthead-header.homepage {
        --font-size: var(--font-h1-large-homepage)
    }
}

:root .component-header-largest {
    --font-size: var(--font-h2-default);
    font-size: var(--font-size);
}

@media (min-width: 640px) {

    :root .component-header-largest {
        --font-size: var(--font-h2-medium)
    }
}

@media (min-width: 1024px) {

    :root .component-header-largest {
        --font-size: var(--font-h2-large)
    }
}

:root .component-header-largest.homepage {
    --font-size: var(--font-h2-default-homepage);
}

@media (min-width: 640px) {

    :root .component-header-largest.homepage {
        --font-size: var(--font-h2-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root .component-header-largest.homepage {
        --font-size: var(--font-h2-large-homepage)
    }
}

:root .component-header-large {
    --font-size: var(--font-h3-default);
    --line-height: 120%;
    font-size: var(--font-size);
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root .component-header-large {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    :root .component-header-large {
        --font-size: var(--font-h3-large)
    }
}

:root .component-header-large.homepage {
    --font-size: var(--font-h3-default-homepage);
}

@media (min-width: 640px) {

    :root .component-header-large.homepage {
        --font-size: var(--font-h3-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root .component-header-large.homepage {
        --font-size: var(--font-h3-large-homepage)
    }
}

:root .component-header-medium {
    --font-family: var(--font-headline);
    --font-size: var(--font-h4-default);
    font-family: var(--font-family);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-h4-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root .component-header-medium {
        --font-size: var(--font-h4-medium)
    }
}

@media (min-width: 1024px) {

    :root .component-header-medium {
        --font-size: var(--font-h4-large)
    }
}

:root .component-header-medium.homepage {
    --font-size: var(--font-h4-default-homepage);
}

@media (min-width: 640px) {

    :root .component-header-medium.homepage {
        --font-size: var(--font-h4-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root .component-header-medium.homepage {
        --font-size: var(--font-h4-large-homepage)
    }
}

:root .component-header-small {
    --font-family: var(--font-headline);
    --font-size: var(--font-h5-default);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-h5-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root .component-header-small {
        --font-size: var(--font-h5-medium)
    }
}

@media (min-width: 1024px) {

    :root .component-header-small {
        --font-size: var(--font-h5-large)
    }
}

:root .component-header-small.homepage {
    --font-size: var(--font-h5-default-homepage);
}

@media (min-width: 640px) {

    :root .component-header-small.homepage {
        --font-size: var(--font-h5-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root .component-header-small.homepage {
        --font-size: var(--font-h5-large-homepage)
    }
}

:root .component-header-smallest {
    --font-family: var(--font-headline);
    --font-size: var(--font-h6-default);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-h6-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    :root .component-header-smallest {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    :root .component-header-smallest {
        --font-size: var(--font-h6-large)
    }
}

:root .component-header-smallest.homepage {
    --font-size: var(--font-h6-default-homepage);
}

@media (min-width: 640px) {

    :root .component-header-smallest.homepage {
        --font-size: var(--font-h6-medium-homepage)
    }
}

@media (min-width: 1024px) {

    :root .component-header-smallest.homepage {
        --font-size: var(--font-h6-large-homepage)
    }
}

:root p,
:root ol,
:root ul {
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-p-default));
    /* The value after --font-size is a fallback if the variable has not been defined. */
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

    :root p.bold {
        font-family: var(--font-body-copy-bold);
    }

    :root p.large {
        --font-size: var(--font-p-large)
    }

    :root p.subtitle {
        --font-size: var(--font-p-subtitle)
    }

    :root p.caption {
        --font-size: var(--font-p-caption)
    }

:root a {
    text-decoration: inherit;
}

:root a {
    font-size: var(--font-size, var(--font-a-default));
    letter-spacing: calc(var(--font-size, var(--font-a-default)) * -0.02);
    --line-height: 160%;
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    line-height: var(--line-height);
}

    :root a.underline {
        text-decoration: underline;
        text-decoration-thickness: 0.1rem;
        text-underline-offset: 0.25rem;
    }

:root span {
    font-family: var(--font-family, var(--font-body-copy));
    font-weight: normal;
    font-size: var(--font-size, var(--font-span-default));
    line-height: var(--line-height, 160%);
    letter-spacing: calc(var(--font-size, var(--font-span-default)) * -0.02);
}

    :root span.small-label {
        --font-size: var(--font-label-default);
    }

    :root span.large-label {
        --font-size: var(----font-span-large-default);
        --line-height: 120%;
    }

:root label {
    --font-size: var(--font-label-default);
    --font-family: var(--font-body-copy);
    --line-height: 160%;
    color: rgb(var(--black));
    font-family: var(--font-family);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    line-height: var(--line-height);
}

    :root label.disabled {
        color: rgb(var(--black));
        opacity: 40%;
    }

:root input {
    font-size: var(--font-size, var(--font-input-default));
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
}

    :root input.lg-line-height {
        --line-height: 160%;
    }

:root textarea {
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    line-height: 160%;
    --font-size: 0.875rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
}

:root b, :root strong {
    --font-family: var(--font-body-copy-bold);
    font-weight: normal
}

:root .bold_on_hover_fix span::before {
    content: attr(data-title);
    content: attr(data-title) / "";
    display: block;
    font-family: var(--font-body-copy-bold);
    font-weight: bold;
    height: 0;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    visibility: hidden;
}

@media speech {

    :root .bold_on_hover_fix span::before {
        display: none
    }
}

.aldermoreRebrand, .motonovoRebrand {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: antialiased;
    --font-input-default: 1.125rem;
    --font-label-default: 0.875rem;
    --font-a-default: 1rem;
    --font-a-highvp: 1rem;
    --font-span-default: 0.875rem;
    --font-span-small-default: 0.75rem;
    --font-span-large-default: 1.5rem;
    /* hierarchy headers default */
    --font-h1-default: 4.25rem;
    --font-h2-default: 2rem;
    --font-h3-default: 1.75rem;
    --font-h4-default: 1.5rem;
    --font-h5-default: 1.375rem;
    --font-h6-default: 1.25rem;
    /* hierarchy headers medium */
    --font-h1-medium: 4.625rem;
    --font-h2-medium: 2.125rem;
    --font-h3-medium: 1.875rem;
    --font-h4-medium: 1.625rem;
    --font-h5-medium: 1.375rem;
    --font-h6-medium: 1.25rem;
    /* hierarchy headers large */
    --font-h1-large: 5rem;
    --font-h2-large: 2.25rem;
    --font-h3-large: 2rem;
    --font-h4-large: 1.75rem;
    --font-h5-large: 1.5rem;
    --font-h6-large: 1.25rem;
    /* homepage headers default */
    --font-h1-default-homepage: 4.75rem;
    --font-h2-default-homepage: 2.25rem;
    --font-h3-default-homepage: 1.75rem;
    --font-h4-default-homepage: 1.75rem;
    --font-h5-default-homepage: 1.5rem;
    --font-h6-default-homepage: 1.25rem;
    /* homepage headers medium */
    --font-h1-medium-homepage: 5rem;
    --font-h2-medium-homepage: 2.25rem;
    --font-h3-medium-homepage: 1.875rem;
    --font-h4-medium-homepage: 1.75rem;
    --font-h5-medium-homepage: 1.5rem;
    --font-h6-medium-homepage: 1.25rem;
    /* homepage headers large */
    --font-h1-large-homepage: 6.25rem;
    --font-h2-large-homepage: 2.25rem;
    --font-h3-large-homepage: 2rem;
    --font-h4-large-homepage: 1.75rem;
    --font-h5-large-homepage: 1.5rem;
    --font-h6-large-homepage: 1.25rem;
    /* paragraph fonts */
    --font-p-default: 1rem;
    --font-p-large: 1.125rem;
    --font-p-subtitle: 0.875rem;
    --font-p-caption: 0.75rem;
    --font-body-copy: 'AGDelta','Arial', 'sans-serif';
    --font-headline: 'AGMore-Headline','Arial', 'sans-serif';
}

.font-regular {
    font-family: var(--font-body-copy);
    font-weight: normal;
}

.font-bold {
    font-family: var(--font-body-copy);
    font-weight: bold;
}

.font-headline {
    font-family: var(--font-headline);
}

.font-display {
    font-family: var(--font-heavy);
}

.font-header {
    font-family: var(--font-headline);
}

.font-paragraph {
    font-family: var(--font-body-copy);
}

.font-colour__white {
    color: rgb(var(--white));
    opacity: var(--text-opacity);
}

.font-colour__black {
    color: rgb(var(--black));
    opacity: var(--text-opacity);
}

.font-colour__violet {
    color: rgb(var(--violet));
    opacity: var(--text-opacity);
}

.font-colour__cassis {
    color: rgb(var(--cassis));
    opacity: var(--text-opacity);
}

.font-colour__verdant {
    color: rgb(var(--verdant));
    opacity: var(--text-opacity);
}

.font-colour__teal {
    color: rgb(var(--teal));
    opacity: var(--text-opacity);
}

.font-colour__form-red {
    color: rgb(var(--form-red));
    opacity: var(--text-opacity);
}

h1 {
    font-family: var(--font-headline);
    font-size: var(--font-size, var(--font-h1-default));
    letter-spacing: calc(var(--font-size, var(--font-h1-default)) * -0.02);
    line-height: 100%;
}

@media (min-width: 640px) {

    h1 {
        --font-size: var(--font-h1-medium)
    }
}

@media (min-width: 1024px) {

    h1 {
        --font-size: var(--font-h1-large)
    }
}

h1.homepage {
    --font-size: var(--font-h1-default-homepage);
}

@media (min-width: 640px) {

    h1.homepage {
        --font-size: var(--font-h1-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h1.homepage {
        --font-size: var(--font-h1-large-homepage)
    }
}

h2 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h2-default));
    letter-spacing: calc(var(--font-size, var(--font-h2-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h2 {
        --font-size: var(--font-h2-medium)
    }
}

@media (min-width: 1024px) {

    h2 {
        --font-size: var(--font-h2-large)
    }
}

h2.homepage {
    --font-size: var(--font-h2-default-homepage);
}

@media (min-width: 640px) {

    h2.homepage {
        --font-size: var(--font-h2-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h2.homepage {
        --font-size: var(--font-h2-large-homepage)
    }
}

h3 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h3-default));
    letter-spacing: calc(var(--font-size, var(--font-h3-default)) * -0.02);
    --line-height: 120%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h3 {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    h3 {
        --font-size: var(--font-h3-large)
    }
}

h3.homepage {
    --font-size: var(--font-h3-default-homepage);
}

@media (min-width: 640px) {

    h3.homepage {
        --font-size: var(--font-h3-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h3.homepage {
        --font-size: var(--font-h3-large-homepage)
    }
}

h4 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h4-default));
    letter-spacing: calc(var(--font-size, var(--font-h4-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h4 {
        --font-size: var(--font-h4-medium)
    }
}

@media (min-width: 1024px) {

    h4 {
        --font-size: var(--font-h4-large)
    }
}

h4.homepage {
    --font-size: var(--font-h4-default-homepage);
}

@media (min-width: 640px) {

    h4.homepage {
        --font-size: var(--font-h4-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h4.homepage {
        --font-size: var(--font-h4-large-homepage)
    }
}

h5 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h5-default));
    letter-spacing: calc(var(--font-size, var(--font-h5-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h5 {
        --font-size: var(--font-h5-medium)
    }
}

@media (min-width: 1024px) {

    h5 {
        --font-size: var(--font-h5-large)
    }
}

h5.homepage {
    --font-size: var(--font-h5-default-homepage);
}

@media (min-width: 640px) {

    h5.homepage {
        --font-size: var(--font-h5-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h5.homepage {
        --font-size: var(--font-h5-large-homepage)
    }
}

h6 {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-h6-default));
    letter-spacing: calc(var(--font-size, var(--font-h6-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    h6 {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    h6 {
        --font-size: var(--font-h6-large)
    }
}

h6.homepage {
    --font-size: var(--font-h6-default-homepage);
}

@media (min-width: 640px) {

    h6.homepage {
        --font-size: var(--font-h6-medium-homepage)
    }
}

@media (min-width: 1024px) {

    h6.homepage {
        --font-size: var(--font-h6-large-homepage)
    }
}

.masthead-header {
    --font-size: var(--font-h1-default);
}

@media (min-width: 640px) {

    .masthead-header {
        --font-size: var(--font-h1-medium)
    }
}

@media (min-width: 1024px) {

    .masthead-header {
        --font-size: var(--font-h1-large)
    }
}

.masthead-header.homepage {
    --font-size: var(--font-h1-default-homepage);
}

@media (min-width: 640px) {

    .masthead-header.homepage {
        --font-size: var(--font-h1-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .masthead-header.homepage {
        --font-size: var(--font-h1-large-homepage)
    }
}

.component-header-largest {
    --font-size: var(--font-h2-default);
    font-size: var(--font-size);
}

@media (min-width: 640px) {

    .component-header-largest {
        --font-size: var(--font-h2-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-largest {
        --font-size: var(--font-h2-large)
    }
}

.component-header-largest.homepage {
    --font-size: var(--font-h2-default-homepage);
}

@media (min-width: 640px) {

    .component-header-largest.homepage {
        --font-size: var(--font-h2-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-largest.homepage {
        --font-size: var(--font-h2-large-homepage)
    }
}

.component-header-large {
    --font-size: var(--font-h3-default);
    --line-height: 120%;
    font-size: var(--font-size);
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    .component-header-large {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-large {
        --font-size: var(--font-h3-large)
    }
}

.component-header-large.homepage {
    --font-size: var(--font-h3-default-homepage);
}

@media (min-width: 640px) {

    .component-header-large.homepage {
        --font-size: var(--font-h3-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-large.homepage {
        --font-size: var(--font-h3-large-homepage)
    }
}

.component-header-medium {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h4-default);
    font-weight: bold;
    font-family: var(--font-family);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-h4-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    .component-header-medium {
        --font-size: var(--font-h4-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-medium {
        --font-size: var(--font-h4-large)
    }
}

.component-header-medium.homepage {
    --font-size: var(--font-h4-default-homepage);
}

@media (min-width: 640px) {

    .component-header-medium.homepage {
        --font-size: var(--font-h4-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-medium.homepage {
        --font-size: var(--font-h4-large-homepage)
    }
}

.component-header-small {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h5-default);
    font-size: var(--font-size);
    font-weight: bold;
    letter-spacing: calc(var(--font-size, var(--font-h5-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    .component-header-small {
        --font-size: var(--font-h5-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-small {
        --font-size: var(--font-h5-large)
    }
}

.component-header-small.homepage {
    --font-size: var(--font-h5-default-homepage);
}

@media (min-width: 640px) {

    .component-header-small.homepage {
        --font-size: var(--font-h5-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-small.homepage {
        --font-size: var(--font-h5-large-homepage)
    }
}

.component-header-smallest {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h6-default);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-h6-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

@media (min-width: 640px) {

    .component-header-smallest {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    .component-header-smallest {
        --font-size: var(--font-h6-large)
    }
}

.component-header-smallest.homepage {
    --font-size: var(--font-h6-default-homepage);
}

@media (min-width: 640px) {

    .component-header-smallest.homepage {
        --font-size: var(--font-h6-medium-homepage)
    }
}

@media (min-width: 1024px) {

    .component-header-smallest.homepage {
        --font-size: var(--font-h6-large-homepage)
    }
}

p,
ol,
ul {
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    font-size: var(--font-size, var(--font-p-default));
    /* The value after --font-size is a fallback if the variable has not been defined. */
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
}

    p.bold {
        font-family: var(--font-body-copy-bold);
        font-weight: bold;
    }

    p.large {
        --font-size: var(--font-p-large)
    }

    p.subtitle {
        --font-size: var(--font-p-subtitle)
    }

    p.caption {
        --font-size: var(--font-p-caption)
    }

a {
    text-decoration: inherit;
    color: inherit;
}

a {
    font-size: var(--font-size, var(--font-a-default));
    letter-spacing: calc(var(--font-size, var(--font-a-default)) * -0.02);
    --line-height: 160%;
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    line-height: var(--line-height);
}

    a.bold {
        font-family: var(--font-body-copy-bold);
        font-weight: 700;
    }

    a.underline {
        text-decoration: underline;
    }

span {
    font-family: var(--font-family, var(--font-body-copy));
    font-weight: normal;
    font-size: var(--font-size, var(--font-span-default));
    line-height: var(--line-height, 160%);
    letter-spacing: calc(var(--font-size, var(--font-span-default)) * -0.02);
}

    span.small-label {
        --font-size: var(--font-label-default);
    }

    span.large-label {
        --font-size: var(----font-span-large-default);
        --line-height: 120%;
    }

    span.bold {
        font-family: var(--font-body-copy-bold);
    }

label {
    --font-size: var(--font-label-default);
    --font-family: var(--font-body-copy);
    --line-height: 160%;
    color: rgb(var(--black));
    font-family: var(--font-family);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    line-height: var(--line-height);
}

    label.disabled {
        color: rgb(var(--black));
        opacity: 40%;
    }

input {
    font-size: var(--font-size, var(--font-input-default));
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    --line-height: 160%;
    line-height: var(--line-height);
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
}

    input.lg-line-height {
        --line-height: 160%;
    }

textarea {
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    line-height: 160%;
    --font-size: 0.875rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
}

.bold_on_hover_fix span::before {
    content: attr(data-title);
    content: attr(data-title) / "";
    display: block;
    font-weight: bold;
    height: 0;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    visibility: hidden;
}

@media speech {

    .bold_on_hover_fix span::before {
        display: none
    }
}

button {
    background-color: rgb(var(--transparent));
    background-image: none;
    text-transform: none;
    font-family: var(--font-bold);
    font-size: var(--font-size);
    line-height: 160%;
    letter-spacing: calc(var(--font-size) * -0.02);
}

ol,
ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

    ul.chevron-primary {
        display: block;
    }

    ul.bullet-point li {
        display: block;
        font-family: var(--font-body-copy);
        font-size: var(---font-p-default);
        list-style: none;
        padding-left: 1.25rem;
        position: relative;
    }

        ul.bullet-point li::before {
            background: currentColor;
            border-radius: 50%;
            content: "";
            height: 0.25rem;
            left: 0rem;
            margin-left: 0.5rem;
            position: absolute;
            top: 0.6rem;
            width: 0.25rem;
        }

audio,
img,
iframe,
canvas,
embed,
object,
svg,
video {
    vertical-align: middle;
}

img,
video {
    max-width: 100%;
    height: auto;
}

[role='button'],
button {
    cursor: pointer;
}

.chevron-icon__svg svg {
    display: inline-block;
    height: 1.25rem;
    margin-right: 0.5rem;
    stroke: currentcolor;
    stroke-width: 2;
    width: 1.25rem;
    vertical-align: middle;
    flex-shrink: 0;
    margin-top: 0.25rem;
}

.chevron-icon__svg__transition {
    transform: translateX(var(--ald-translate-x)) translateY(var(--ald-translate-y)) rotate(var(--ald-rotate)) skewX(var(--ald-skew-x)) skewY(var(--ald-skew-y)) scaleX(var(--ald-scale-x)) scaleY(var(--ald-scale-y));
    transition-duration: 200ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.close-icon__svg {
    cursor: pointer;
    z-index: 10;
    color: rgb(var(--white));
}

    .close-icon__svg svg {
        display: inline-block;
        stroke: currentcolor;
        height: 1rem;
        transition: all 0.2s;
        stroke-width: 1;
        width: 1rem;
    }

        .close-icon__svg svg:hover {
            stroke-width: 2;
        }

.menu-bar__button-icon__svg {
    display: inline-block;
    flex: none;
    height: 1.75rem;
    margin-right: 0.5rem;
    stroke: currentcolor;
    stroke-width: 2;
    transition: all 0.2s;
    width: 1.75rem;
    vertical-align: middle;
}

@media (min-width: 380px) {
    .menu-bar__button-icon__svg__mobile {
        margin-right: 0rem;
        height: 1.5rem;
        width: 1.5rem;
    }
}

.menu-bar__button-icon__hide {
    display: none !important;
}

.navigation__mobile__chevron-icon {
    display: inline-block;
    height: 0.75rem;
    stroke: currentColor;
    stroke-width: 2;
    vertical-align: middle;
    transition: all 0.2s;
    width: 0.75rem;
}

.navigation__mobile__chevron-icon__right {
    margin-left: 1.25rem;
}

.navigation__mobile__chevron-icon__left {
    margin-right: 0.625rem;
}

/* This file contains the default classes for handling outline */

/* an override for a TW default. But maybe wise to leave in place and have local class overrides */

.ald-bold {
    --font-family: var(--font-bold);
}

.ald-underline {
    text-decoration: underline;
}

.ald-underline-hover:hover {
    text-decoration: underline;
}

.ald-focus:focus {
    outline: 2px solid rgb(var(--teal));
    outline-offset: 2px;
}

.ald-focus__button:focus {
    outline: 2px solid rgb(var(--teal));
    outline-offset: -2px;
}

.ald-hidden {
    display: none;
}

.text-block p,
.text-block h2,
.text-block h3,
.text-block h4,
.text-block ul {
    margin-bottom: 0.75rem;
}

.text-block table {
    margin-bottom: 2rem;
}

.text-block p,
.text-block a {
    font-size: 0.875rem;
}

.text-block a {
    font-family: var(--font-body-copy-bold);
    font-weight: bold;
    text-decoration: underline;
}

.text-block .lead-paragraph {
    font-family: var(--font-body-copy-bold);
    font-size: 1.125rem;
}

.text-block strong {
    font-family: var(--font-body-copy-bold);
}

@media screen and (min-width: 768px) {
    .text-block p,
    .text-block a {
        font-size: 1rem;
    }
}

.text-block ul,
.text-block ol {
    display: grid;
    font-family: var(--font-body-copy);
    font-size: var(--font-p-default);
    margin-left: 0.625rem;
    padding-left: 0.5rem;
    row-gap: 0.75rem;
}

.text-block li ul,
.text-block li ol {
    padding-top: 0.5rem;
}

.text-block ul li {
    display: block;
    font-family: var(--font-body-copy);
    font-size: var(---font-p-default);
    list-style: none;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    position: relative;
}

    .text-block ul li::before {
        background: currentColor;
        border-radius: 50%;
        content: "";
        height: 0.25rem;
        left: 0rem;
        margin-left: 0.5rem;
        position: absolute;
        top: 0.6rem;
        width: 0.25rem;
    }

.text-block ol li {
    font-size: var(--font-size);
    list-style-type: decimal;
}

.group_page.divider__hr {
    border-color: rgba(var(--white), 1);
}

.divider__hr {
    border-top-width: 0.0625rem;
    border-color: rgba(var(--black), 0.2);
    margin-top: 1.25rem;
}

@media screen and (min-width: 640px) {

    .divider__hr {
        margin-top: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .divider__hr {
        margin-top: 3rem
    }
}

.awards {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding: 2.5rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .awards {
        padding: 4rem 2.5rem
    }
}

@media screen and (min-width: 1440px) {

    .awards {
        padding: 5rem 14.75rem
    }
}

.awards ul {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 3rem;
    height: auto;
    justify-content: center;
    list-style-type: none;
    margin-top: 3rem;
}

    .awards ul li {
        height: auto;
        width: auto;
    }

        .awards ul li a {
            cursor: pointer;
        }

.navigation-menu__main-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 9999;
}

@media screen and (min-width: 1024px) {
    .navigation-menu__main-container {
        position: unset;
        top: unset;
    }
}

.navigation-menu__main-container__group {
    position: relative;
    z-index: 999999;
}

.navigation-menu__top-bar-container {
    align-items: center;
    background-color: rgb(var(--white));
    display: flex;
    gap: 2rem;
    padding-bottom: 1rem;
    padding-top: 1.5rem;
    position: sticky;
    top: 0;
}

.navigation-menu__top-bar-container__group {
    align-items: flex-start;
    background-color: rgb(var(--group-colour));
    display: flex;
    gap: 2rem;
    padding-bottom: 1.875rem;
    padding-top: 1.875rem;
    position: sticky;
    top: 0;
}

@media screen and (min-width: 1024px) {

    .navigation-menu__top-bar-container__group {
        padding-bottom: 0
    }
}

.navigation-menu__top-bar-icon-container {
    display: flex;
    flex: 1 1 auto;
    gap: 2rem;
}

@media screen and (min-width: 640px) {
    .navigation-menu__top-bar-container {
        position: unset;
        top: unset;
    }
}

@media (min-width: 1024px) {
    .navigation-menu__top-bar-container {
        position: unset;
        top: unset;
    }
}

@media (min-width: 1280px) {
    .navigation-menu__top-bar-container {
        position: unset;
        top: unset;
    }
}

@media screen and (min-width: 1440px) {
    .navigation-menu__top-bar-container {
        position: unset;
        top: unset;
    }
}

.navigation-menu__menu-bar-container {
    display: none;
    padding-top: 1rem;
    width: 100%;
}

@media (min-width: 1024px) {
    .navigation-menu__menu-bar-container {
        display: block;
    }
}

.navigation-menu__menu-bar-container_group {
    display: none;
    width: 100%;
}

@media (min-width: 1024px) {
    .navigation-menu__menu-bar-container_group {
        display: block;
    }
}

.navigation-menu__dropdown-container {
    cursor: pointer;
    display: flex;
    gap: 1.5rem;
    list-style-type: none;
}

.navigation-menu__item__group {
    display: flex;
}

    .navigation-menu__item__group span {
        color: rgb(var(--white));
        --font-size: var(--font-p-default);
    }

    .navigation-menu__item__group svg {
        color: rgb(var(--white));
    }

.navigation-menu__logo-container {
    display: flex;
    justify-content: flex-start;
    position: sticky;
    top: 0;
}

@media (min-width: 1024px) {
    .navigation-menu__logo-container {
        position: unset;
        top: unset;
    }
}

.navigation-menu-partner__logo-container {
    align-items: center;
    background-color: rgb(var(--white));
    display: flex;
    justify-content: flex-start;
    position: sticky;
    top: 0;
}

@media (min-width: 1024px) {
    .navigation-menu-partner__logo-container {
        flex: none;
        position: unset;
        top: unset;
    }
}

.navigation-menu__logo-link__a {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 100%;
}

.navigation-menu__logo-link__a__group div {
    display: inline-block;
    width: 15.625rem;
}

.navigation-menu__logo-link__a__group svg {
    height: 2rem;
    width: 8.125rem;
}

.navigation-menu__logo-link__a svg {
    height: unset;
    width: unset;
}

.navigation-menu__logo__img > div > svg {
    height: 1rem;
    margin-left: 3rem;
    margin-top: 2rem;
    width: 7.5rem;
}

.navigation-menu__centre-bar-container {
    align-items: center;
    background-color: rgb(var(--light-grey-tint));
    display: none;
    flex: 1 1 auto;
    justify-content: center;
}

@media screen and (min-width: 1024px) {

    .navigation-menu__centre-bar-container {
        display: inline-block
    }
}

.navigation-menu-partner__centre-bar-container {
    align-items: center;
    background-color: rgb(var(--white));
    display: flex;
    flex: 1 1 auto;
    justify-content: flex-start;
}

@media screen and (min-width: 1024px) {
    .navigation-menu-partner__centre-bar-container {
        display: flex;
        max-height: 100%;
    }
}

.navigation-menu-partner__centre-bar-container a img {
    height: 1.75rem;
}

@media screen and (min-width: 1024px) {
    .navigation-menu-partner__centre-bar-container a img {
        height: 1.625rem;
    }
}

.navigation-menu__centre-bar-container__intermediaries {
    background-color: rgb(var(--dark-grey-tint));
    flex: 0 1 auto;
    width: 11rem;
}

.navigation-menu__centre-bar-link__a {
    align-self: center;
    --font-size: 1.125rem;
    text-decoration: none;
}

    .navigation-menu__centre-bar-link__a:hover {
        border-bottom-width: 0.125rem;
        border-color: rgb(var(--aldermore-yellow));
        font-weight: bold;
    }

.navigation-menu__centre-bar-link__a__intermediaries {
    border-bottom-width: 0.125rem;
    border-color: rgb(var(--dark-grey-tint));
    color: rgb(var(--white));
    font-family: var(--font-bold);
    padding-bottom: 0.25rem;
}

.navigation-menu__button-bar-container {
    display: flex;
    flex: none;
    gap: 0.75rem;
    width: fit-content;
}

.navigation-menu__button-bar-container__group {
    display: flex;
    flex: none;
    gap: 0.75rem;
    width: fit-content;
}

    .navigation-menu__button-bar-container__group .navigation__mobile__menu-container-full svg {
        color: rgb(var(--white));
    }

    .navigation-menu__button-bar-container__group svg {
        background-color: rgb(var(--group-colour));
        color: rgb(var(--white));
    }

    .navigation-menu__button-bar-container__group .navigation_ul_recursive {
        background-color: rgb(var(--tonal-green));
    }

        .navigation-menu__button-bar-container__group .navigation_ul_recursive li {
            background-color: rgb(var(--tonal-green));
        }

        .navigation-menu__button-bar-container__group .navigation_ul_recursive svg {
            background-color: rgb(var(--tonal-green));
        }

    .navigation-menu__button-bar-container__group .navigation__mobile__menu-container {
        top: 5.70rem;
    }

.navigation-menu__button-content__container {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
}

@media (min-width: 380px) {
    .navigation-menu__button-content__container {
        flex-direction: column-reverse;
    }
}

@media (min-width: 1024px) {
    .navigation-menu__button-content__container {
        flex-direction: row;
    }
}

.navigation-menu__button {
    align-items: center;
    display: flex;
    font-family: var(--font-body-copy);
    font-weight: bold;
    font-size: var(--font-p-subtitle);
    gap: 0.25rem;
    height: 2.25rem;
    justify-content: center;
    padding: 0 0.75rem 0 0.75rem;
}

    .navigation-menu__button div {
        align-items: center;
        display: flex;
        gap: 0.25rem;
        justify-content: center;
    }

    .navigation-menu__button svg {
        color: rgb(var(--black));
        height: 0.75rem;
        width: 0.75rem;
    }

    .navigation-menu__button span {
        align-items: center;
        font-weight: bold;
    }

@media screen and (min-width: 640px) {

    .navigation-menu__button {
        gap: 0.375rem;
        min-width: 5.625rem;
        padding: 0 1rem 0 1rem
    }
}

.navigation-menu__button.primary {
    background-color: rgb(var(--primary-colour), 0.8);
    color: rgb(var(--black));
}

.navigation-menu__button.secondary {
    background-color: rgb(var(--black));
    --btn-colour-hover: var(--secondary-colour-hover);
    color: rgb(var(--white));
}

    .navigation-menu__button.secondary svg {
        color: rgb(var(--primary-colour));
    }

.navigation-menu__button__visible-desktop-only {
    display: none !important;
}

@media (min-width: 1024px) {
    .navigation-menu__button__visible-desktop-only {
        display: inline-block !important;
    }
}

.navigation-menu__button__black {
    background-color: rgb(var(--black));
    border-color: rgb(var(--black));
    color: rgb(var(--white));
}

    .navigation-menu__button__black:hover {
        color: rgb(var(--black));
    }

.navigation-menu__button__yellow {
    background-color: rgb(var(--aldermore-yellow));
    border-color: rgb(var(--aldermore-yellow));
    color: rgb(var(--black));
}

.navigation-menu__button-caption__span {
    display: none;
    --font-size: 0.625rem;
    margin-top: 0.25rem;
}

@media (min-width: 380px) {
    .navigation-menu__button-caption__span {
        display: inline-block;
    }
}

@media (min-width: 1024px) {
    .navigation-menu__button-caption__span {
        --font-size: 1.125rem;
        margin: 0rem 0.25rem 0rem 0rem;
    }
}

.navigation-menu__dropdown-header {
    width: auto;
}

    .navigation-menu__dropdown-header .highlight div {
        align-items: center;
        display: flex;
    }

        .navigation-menu__dropdown-header .highlight div span {
            flex-shrink: 0;
        }

    .navigation-menu__dropdown-header .highlight:after {
        border-bottom: 2px solid rgb(var(--primary-colour));
        content: '';
        display: block;
        padding-top: 2rem;
        transition: 0.3s;
        width: 0;
    }

    .navigation-menu__dropdown-header div:hover:after {
        width: 100%;
    }

    .navigation-menu__dropdown-header span {
        display: inline-block;
        font-weight: normal;
        transition: font-weight 0.3s;
    }

    .navigation-menu__dropdown-header:hover span {
        font-weight: bold;
    }

.navigation-menu__dropdown__full-container__group {
    background-color: rgb(var(--tonal-green));
    color: rgb(var(--white));
    display: none;
    flex-direction: column;
    height: auto;
    justify-content: space-between;
    position: absolute;
    top: 5.60rem;
    z-index: 20;
}

.navigation-menu__dropdown__full-container {
    background-color: rgb(var(--black));
    color: rgb(var(--white));
    display: none;
    flex-direction: column;
    height: auto;
    justify-content: space-between;
    position: absolute;
    z-index: 20;
}

.navigation-menu__dropdown__show {
    display: flex !important;
}

.navigation-menu__dropdown-section-header__container {
    align-items: center;
    border-bottom-width: 0.063rem;
    border-color: rgba(var(--white), 20%);
    display: flex;
    justify-content: space-between;
    margin-top: 2.5rem;
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
    width: auto;
}

.navigation-menu__dropdown-menus__container {
    display: flex;
    gap: 2rem;
    height: auto;
    width: auto;
}

.navigation-menu__dropdown-menus__container__group {
    display: flex;
    gap: 2rem;
    height: auto;
    justify-content: space-between;
    width: auto;
}

.navigation-menu__dropdown-single-menu__container {
    display: flex;
    flex-direction: column;
}

.navigation-menu__dropdown-single-menu__item {
    margin-bottom: 0.75rem;
}

    .navigation-menu__dropdown-single-menu__item:first-child {
        margin-bottom: 1.25rem;
    }

    .navigation-menu__dropdown-single-menu__item:last-child {
        margin-bottom: 1.75rem;
    }

.navigation-menu__dropdown-single-menu__transition {
    transform: translateX(var(--ald-translate-x)) translateY(var(--ald-translate-y)) rotate(var(--ald-rotate)) skewX(var(--ald-skew-x)) skewY(var(--ald-skew-y)) scaleX(var(--ald-scale-x)) scaleY(var(--ald-scale-y));
    transition-duration: 200ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

    .navigation-menu__dropdown-single-menu__transition:hover {
        --ald-translate-x: 0.75rem;
    }

.navigation__menu-item__link {
    align-items: flex-start;
    background-color: rgb(var(--transparent));
    color: rgb(var(--white));
    display: inline-flex;
    flex-direction: row-reverse;
    justify-content: center;
    padding-bottom: 0.125rem;
    padding-right: 0.5rem;
    padding-top: 0.125rem;
    place-items: center;
    text-align: left;
    text-decoration: none;
}

@media (min-width: 768px) {
    .navigation__menu-item__link {
        --font-size: 1.125rem;
    }
}

.navigation__menu-item__link:active {
    font-weight: bold;
}

.navigation__menu-item__link:hover {
    font-weight: bold;
}

.navigation__menu-item__span {
    border-bottom-width: 0.125rem;
    border-color: rgb(var(--black));
    font-family: var(--font-book);
    --font-size: 0.875rem;
}

@media (min-width: 768px) {
    .navigation__menu-item__span {
        --font-size: 1.125rem;
    }
}

.navigation__menu-item__span:hover {
    border-color: rgb(var(--aldermore-yellow));
}

.clicked-nav svg {
    transform: rotate(180deg);
}

.clicked-nav span {
    font-weight: bold;
}

.clicked-nav div:after {
    width: 100%;
}

.section-header {
    border: 2px solid rgb(var(--black));
    --font-family: var(--font-bold);
    --font-size: 1.125rem;
    margin-left: -0.375rem;
    margin-top: -0.375rem;
    padding: 0.25rem;
}

    .section-header:hover {
        border-bottom: 0.125rem solid var(--aldermore-yellow);
    }

.navigation__mobile__menu-container-full {
    align-items: center;
    cursor: pointer;
    display: flex;
}

@media (min-width: 1024px) {
    .navigation__mobile__menu-container-full {
        display: none;
    }
}

.navigation__mobile__sub-menu-container {
    background-color: rgb(var(--white));
    color: rgb(var(--black));
    flex-direction: column;
    height: 100%;
}

.navigation__mobile__sub-menu-container__intermediaries {
    background-color: rgb(var(--dark-grey-tint));
    color: rgb(var(--white));
}

.navigation__mobile__hamburger-menu__button {
    color: rgb(var(--black));
    display: inline-block;
    height: fit-content;
    justify-content: center;
    margin-left: 1rem;
    width: fit-content;
}

@media screen and (min-width: 640px) {
    .navigation__mobile__hamburger-menu__button {
        margin-left: 1.5rem;
    }
}

@media (min-width: 1024px) {
    .navigation__mobile__hamburger-menu__button {
        --font-size: 1.125rem;
        height: auto;
        padding: 1.5rem 1.5rem 1.25rem 1.5rem;
        width: auto;
    }
}

.navigation__mobile__hamburger-menu__caption-container {
    align-items: center;
    display: flex;
    flex-direction: column-reverse;
}

.navigation__mobile__hamburger-menu__caption_span {
    display: none;
    --font-size: 0.625rem;
    margin-top: 0.25rem;
}

@media (min-width: 380px) {
    .navigation__mobile__hamburger-menu__caption_span {
        display: inline-block;
    }
}

.navigation__mobile__menu-container {
    background-color: rgb(var(--black));
    color: rgb(var(--white));
    left: 0px;
    position: absolute;
    top: 4.70rem;
    width: 100%;
    z-index: 20;
}

.navigation__mobile__menu-container__hide {
    display: none;
}

.navigation__mobile__menu-item__li {
    align-items: flex-start;
    background-color: rgb(var(--black));
    border-bottom: 1px solid rgba(var(--white), 0.2);
    display: flex;
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

@media screen and (min-width: 640px) {
    .navigation__mobile__menu-item__li {
        margin-left: 2.5rem;
        margin-right: 2.5rem;
    }
}

.navigation_ul_recursive {
    padding-top: 2.5rem;
}

    .navigation_ul_recursive .navigation__mobile__menu-item__li:first-child {
        padding-top: 0;
    }

    .navigation_ul_recursive.subnav-open {
        padding-top: 0;
    }

.navigation__mobile__menu-item__transition {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.navigation__mobile__menu-heading {
    align-items: center;
    color: rgb(var(--primary-colour));
    display: flex;
    --font-size: 0.875rem;
    justify-content: space-between;
    width: 100%;
}

    .navigation__mobile__menu-heading span {
        font-weight: 700;
    }

    .navigation__mobile__menu-heading:hover {
        cursor: default;
    }

.navigation__mobile__menu-item__base {
    align-items: flex-start;
    color: rgb(var(--white));
    cursor: pointer;
    display: flex;
    --font-size: 0.875rem;
    height: 100%;
    width: 100%;
}

    .navigation__mobile__menu-item__base span {
        font-weight: 700;
    }

.navigation__mobile__menu-item__button {
    border-color: rgb(var(--black));
    justify-content: space-between;
}

.navigation-menu__button-bar-container__group .navigation__mobile__menu-item__link {
    color: rgb(var(--white));
}

.navigation__mobile__menu-item__link {
    border-color: rgb(var(--white));
    color: rgb(var(--black));
    --font-family: var(--font-bold);
    justify-content: space-between;
}

.navigation__mobile__menu-item__help-link {
    border-color: rgb(var(--black));
    --font-family: var(--font-bold);
    justify-content: space-between;
}

.navigation__mobile__menu-item__link__intermediaries {
    border-color: rgb(var(--dark-grey-tint));
}

.navigation-menu__button-bar-container__group .navigation__mobile__sub-menu__base {
    border-color: rgba(var(--white), 20%);
}

.navigation__mobile__sub-menu__base {
    align-items: center;
    border-bottom-width: 0.062rem;
    border-color: rgba(var(--black), 20%);
    display: flex;
    justify-content: flex-start;
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

@media screen and (min-width: 640px) {
    .navigation__mobile__sub-menu__base {
        margin-left: 2.5rem;
        margin-right: 2.5rem;
    }
}

.navigation__mobile__sub-menu-heading {
    background-color: rgb(var(--black));
    border-bottom-width: 0.187rem;
    border-color: rgb(var(--primary-colour));
    color: rgb(var(--white));
    margin-left: 0;
    margin-right: 0;
}

button.subnav-button > span,
button.submenu-button > span {
    color: rgb(var(--white));
    overflow: hidden;
}

.subnav-link > span,
.submenu-link > span {
    overflow: hidden;
}

.subnav-link.navigation__mobile__menu-item__link__intermediaries > span {
    border-bottom: 2px solid rgb(var(--dark-grey-tint));
    color: rgb(var(--white));
}

.subnav-link.navigation__mobile__menu-item__link__intermediaries:hover > span {
    border-bottom: 2px solid rgb(var(--aldermore-yellow));
}

.subnav-link.navigation__mobile__menu-item__link__intermediaries > svg {
    stroke: rgb(var(--white));
}

.subnav {
    left: 100%;
    overflow: hidden;
    position: absolute;
    top: 0px;
    transition: all;
    width: 0px;
}

.subnav-open {
    left: 0px;
    width: 100%;
}

.is-intermediaries a span {
    border-bottom: 2px solid rgb(var(--dark-grey-tint));
}

#Mobile_Nav_Button svg path {
    stroke: rgb(var(--white));
}

#Mobile_Nav_Button:hover svg path {
    stroke: rgb(var(--black));
}

.nav-dropdown-width {
    width: 89%;
}

.mobile-nav-dropdown-width {
    width: 94%;
}

.navigation-menu-chevron {
    flex-shrink: 0;
    height: 1rem;
    transition: all 0.2s;
    width: 1rem;
}

.navigation-menu-chevron__rotate {
    transform: rotate(180deg);
}

.navigation-menu-close__icon:hover {
    color: rgb(var(--aldermore-yellow));
}

/* Intermediaries Navigation CSS */

.navigation-menu__customer-bar {
    align-items: center;
    background: rgb(var(--black));
    display: flex;
    line-height: 1.4rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

    .navigation-menu__customer-bar .navigation-menu__customer-tab {
        align-items: center;
        background: transparent;
        border: 0;
        color: rgb(var(--white));
        cursor: pointer;
        display: flex;
        font-family: var(--font-body-copy);
        font-size: var(--font-p-subtitle);
        font-weight: normal;
        justify-content: center;
        line-height: 1.4rem;
        padding: 0.75rem 1.25rem;
    }

.navigation-menu__customer-tab.active {
    background: rgb(var(--white));
    color: rgb(var(--black));
    font-family: var(--font-body-copy-bold);
}

@media screen and (min-width: 640px) {
    .navigation-menu__customer-bar {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .navigation-menu__customer-bar {
        line-height: 1.4rem;
        padding-left: 3rem;
        padding-right: 3rem;
    }
}

.navigation-menu__button.transparent {
    background: transparent;
    background-image: none;
    color: rgb(var(--black));
    font-family: var(--font-body-copy-bold);
    font-size: 0.875rem;
    line-height: 1.4rem;
}

    .navigation-menu__button.transparent svg {
        color: rgb(var(--black));
        height: 1rem;
        width: 1rem;
    }

    .navigation-menu__button.transparent span {
        font-family: var(--font-body-copy-bold);
        font-size: var(--font-p-subtitle);
        line-height: 1.4rem;
    }

.navigation-menu__button.intermediaries-login {
    color: rgb(var(--white));
}

    .navigation-menu__button.intermediaries-login svg {
        color: rgb(var(--white));
    }

.navigation-menu__menu-bar-intermediaries {
    height: 3.625rem;
    padding-bottom: 0;
    padding-top: 0;
}

.navigation-menu_intermediaries-dropdown {
    height: 100%
}

btn.navigation_menu_intermediaries-dropdown {
    align-items: center;
    display: box;
    height: 100%;
    justify-content: center;
}

.navigation-menu__button.intermediaries-login span,
.navigation-menu__button.transparent span {
    font-family: var(--font-body-copy-bold);
}

/* css for intermediaries */

.navigation-menu__customer-bar + .navigation-menu__top-bar-container
.navigation-menu__logo-container {
    flex-shrink: 0;
}

/* css for intermediaries */

.navigation-menu__customer-bar + .navigation-menu__top-bar-container
.navigation-menu__logo-link__a svg {
    flex-shrink: 0;
    height: 2.125rem;
    width: 6.187rem;
}

/*Media query for main menu*/

@media (min-width: 375px) and (max-width: 639px) {
    .navigation_mobile_menu_intermediaries {
        top: 3.7rem;
    }
}

@media (min-width: 640px) and (max-width: 1024px) {
    .navigation_mobile_menu_intermediaries {
        top: 6.7rem;
    }
}

@media screen and (max-width: 638px) {
    /* CSS for mobile navigation */
    .navigation-menu__customer-bar {
        display: none;
    }
}

.navigation-menu_intermediaries-dropdown-menu
.navigation-menu__dropdown-header .highlight:after {
    padding-top: 1rem;
}

@media (min-width: 1024px) and (max-width: 1060px) {

    ul.navigation-menu_intermediaries-dropdown-menu {
        display: flex;
        gap: 0.75rem;
        justify-content: space-between;
    }

        ul.navigation-menu_intermediaries-dropdown-menu > li {
            flex: 0 0 auto;
        }
}

.navigation_menu_intermediaries-dropdown span {
    font-size: var(--font-p-default);
}

.navigation-menu__menu-bar-intermediaries
.navigation-menu__dropdown-header
.highlight:after {
    border-bottom: 2px solid rgb(var(--black));
}

.navigation_menu_intermediaries-dropdown:hover span {
    font-family: var(--font-body-copy-bold);
}

.navigation_menu_intermediaries-dropdown.clicked-nav span {
    font-family: var(--font-body-copy-bold);
}

.navigation-menu__button.primary.intermediaries-login {
    color: rgb(var(--white));
}

    .navigation-menu__button.primary.intermediaries-login svg {
        color: rgb(var(--white));
    }

@media screen and (max-width: 375px) {

    .navigation-menu__button.primary.intermediaries-login {
        background: transparent;
        border: none;
        color: rgb(var(--black));
        min-width: auto;
        padding: 0;
    }

        .navigation-menu__button.primary.intermediaries-login svg {
            color: rgb(var(--black));
            height: 1rem;
            width: 1rem;
        }

        .navigation-menu__button.primary.intermediaries-login span {
            font-family: var(--font-body-copy-bold);
            font-size: 0.875rem;
        }
}

.cta-btn {
    align-items: center;
    display: flex;
    font-family: var(--font-body-copy-bold);
    font-weight: bold;
    font-size: var(--font-p-subtitle);
    gap: 0.375rem;
    height: 2.25rem;
    justify-content: center;
    min-width: 5.625rem;
    padding: 0 0.75rem;
    /* 
    This is needed as if the class is used on an anchor tag, the anchor will be default occupy all space
    whereas the button will not.
   */
    width: fit-content;
}

.cta-btn-background {
    --btn-colour-hover: var(--primary-colour-hover);
    background-image: linear-gradient(135deg, rgb(var(--btn-colour-hover)) 50%, transparent 51%);
    /* some initial size to get the slanted appearance */
    background-position: -6.25rem -6.25rem;
    /* negative positioning to hide it initially */
    background-repeat: no-repeat;
    background-size: 0.25rem 17.25rem;
    transition: all ease 0.5s;
}

.cta-btn:disabled {
    opacity: 0.4;
    pointer-events: none;
}

.cta-btn:hover {
    /* 200% because gradient is colored only for 50% */
    background-position: 0rem 0rem;
    background-size: 200% 200%;
}

.cta-btn-background:hover {
    /* 200% because gradient is colored only for 50% */
    background-position: 0rem 0rem;
    background-size: 200% 200%;
}

.cta-btn div {
    display: flex;
    justify-content: center;
}

.cta-btn .left-icon {
    align-items: center;
    padding-right: 0.25rem;
}

.cta-btn .right-icon {
    align-items: center;
    padding-left: 0.25rem;
}

.cta-btn svg {
    color: rgb(var(--white));
    display: flex;
    height: 1rem;
    width: 1rem;
}

.cta-btn-primary {
    color: rgb(var(--white));
    background-color: rgb(var(--primary-colour));
}

    .cta-btn-primary:active {
        background: rgb(var(--primary-colour-pressed));
    }

.cta-btn-black {
    color: rgb(var(--white));
    background-color: rgb(var(--black));
    --btn-colour-hover: var(--secondary-colour-hover);
}

    .cta-btn-black:active {
        background: rgb(var(--secondary-colour-pressed));
        outline: 0.0625rem solid rgb(var(--black));
    }

.cta-btn-white {
    color: rgb(var(--black));
    background-color: rgb(var(--white));
    --btn-colour-hover: var(--secondary-light-colour-hover);
    outline: 0.1rem solid rgb(var(--black));
}

    .cta-btn-white svg {
        color: rgb(var(--black))
    }

    .cta-btn-white:active {
        background: rgb(var(--secondary-light-colour-pressed));
    }

.cta-chip {
    align-items: center;
    background: rgb(var(--white));
    border: 0.0625rem solid rgb(var(--black));
    border-radius: 2rem;
    color: rgb(var(--black));
    cursor: pointer;
    display: flex;
    font-family: var(--font-body-copy);
    --font-size: var(--font-p-caption);
    gap: 0.5rem;
    height: 2.25rem;
    justify-content: center;
    padding: 0.75rem;
    width: fit-content;
}

    .cta-chip svg {
        display: flex;
        flex-shrink: 0;
        height: 0.75rem;
        width: 0.75rem;
    }

    .cta-chip:hover {
        background-color: rgb(var(--secondary-light-colour-hover));
    }

    .cta-chip:active {
        background: rgb(var(--black));
        color: rgb(var(--white));
    }

        .cta-chip:active span {
            color: rgb(var(--white));
            font-weight: bold;
        }

    .cta-chip:disabled {
        opacity: 0.4;
        pointer-events: none;
    }

.cta-chip-icon {
    width: 2.25rem;
}

.cta-banner {
    align-items: baseline;
    background-color: rgb(var(--primary-colour));
    cursor: pointer;
    display: flex;
    font-weight: bold;
    --font-size: 1.25rem;
    gap: 0.5rem;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

    .cta-banner:active {
        background-color: rgb(var(--primary-colour-pressed));
    }

    .cta-banner:hover {
        text-decoration: underline;
    }

@media (min-width: 640px) {

    .cta-banner {
        align-items: center;
        justify-content: center
    }
}

.cta-banner svg {
    flex-shrink: 0;
    height: 1.5rem;
    position: relative;
    top: 0.35rem;
    width: 1.5rem;
}

@media (min-width: 640px) {

    .cta-banner svg {
        top: 0
    }
}

.disabled {
    opacity: 0.4;
    pointer-events: none;
}

.cta-banner-primary {
    color: rgb(var(--white));
}

.cta-banner-black {
    background-color: rgb(var(--black));
    --btn-colour-hover: var(--secondary-colour-hover);
    color: rgb(var(--white));
}

    .cta-banner-black:active {
        background-color: rgb(var(--secondary-colour-pressed));
    }

    .cta-banner-black svg {
        color: rgb(var(--white));
    }

.cta-banner-white {
    background-color: rgb(var(--grey-light));
    --btn-colour-hover: var(--secondary-light-colour-hover);
}

    .cta-banner-white:active {
        background-color: rgb(var(--secondary-light-colour-pressed));
    }

.ald-cta-load-more {
    padding: 0.75rem 4rem;
    font-family: var(--font-bold);
    --font-size: 1.125rem;
    line-height: 160%;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    background-color: rgb(var(--aldermore-yellow));
}

    .ald-cta-load-more:active {
        background-color: rgb(var(--black));
        color: rgb(var(--white));
        text-decoration: none;
    }

.cta_quick_link {
    align-items: flex-start;
    background-color: rgb(var(--transparent));
    cursor: pointer;
    display: flex;
    font-family: var(--font-body-copy);
    font-size: var(--font-p-default);
    gap: 0.25rem;
    transition: font-weight 0.3s;
    width: fit-content;
}

    .cta_quick_link svg {
        flex-shrink: 0;
        height: 1rem;
        margin-top: 0.25rem;
        width: 1rem;
    }

.cta_quick_link__group svg {
    color: rgb(var(--primary-colour));
}

.disabled {
    opacity: 0.4;
    pointer-events: none;
}

.cta_quick_link span {
    display: inline-block;
    --font-size: var(--font-p-default);
    font-weight: normal;
    transition: font-weight 0.3s;
}

.cta_quick_link:hover span {
    font-family: var(--font-body-copy-bold);
}

.cta_title_link:hover {
    text-decoration: underline;
    transition: font-weight 0.3s;
    font-family: var(--font-body-copy-bold);
}

/*CSS changes for the intermediaries page to ensure that the chevron icon is correct for the page.*/

.navigation__mobile__sub-menu-container li:first-child button.cta_quick_link svg, .navigation__mobile__sub-menu-container li button.subnav-link svg, .navigation_ul_recursive li button.submenu-button svg {
    margin-top: 0.5rem;
}

nav.navigation_mobile_menu_intermediaries .navigation_ul_recursive li:first-child a span {
    color: rgb(var(--white));
}

.cta_quick_link_nav {
    background-color: rgb(var(--transparent));
    color: rgb(var(--black));
    cursor: pointer;
    display: inline-block;
    --font-family: var(--font-body-copy);
    --font-size: var(--font-p-default);
    font-weight: normal;
    padding-top: 0.5rem;
    width: fit-content;
}

    .cta_quick_link_nav svg {
        height: 0.75rem;
        width: 0.75rem;
    }

.cta_quick_link_nav__content {
    gap: 0.25rem;
}

    .cta_quick_link_nav__content span {
        display: inline-block;
        font-weight: normal;
        transition: font-weight 0.3s;
    }

    .cta_quick_link_nav__content:hover span {
        font-weight: bold;
    }

.cta_quick_link_nav:after {
    border-bottom: 2px solid rgb(var(--primary-colour));
    content: '';
    display: block;
    transition: width 0.3s, font-weight 0.3s;
    width: 0;
}

.cta_quick_link_nav:hover:after {
    width: 100%;
}

.disabled {
    opacity: 0.4;
    pointer-events: none;
}

.cta_quick_link_nav.active span {
    font-weight: 700;
}

.cta_quick_link_nav.active:after {
    width: 100%;
}

.cta_textlink {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.25rem;
    cursor: pointer;
    --font-size: var(--font-p-default);
}

    .cta_textlink span {
        font-weight: normal;
        transition: font-weight 0.3s;
    }

    .cta_textlink:hover span {
        text-decoration: underline;
        font-weight: bold;
    }

    .cta_textlink:focus {
        text-decoration: underline;
    }

    .cta_textlink svg {
        display: inline-block;
        height: 1.25rem;
        margin-right: 0.25rem;
        margin-left: 0.625rem;
        stroke: currentcolor;
        stroke-width: 3;
        width: 1.25rem;
        vertical-align: middle;
        transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    .cta_textlink:hover svg {
        transform: translateX(0.625rem);
    }

@media screen and (min-width: 768px) {
    .ald_cta_textlink {
        font-size: 1rem;
    }
}

.cta_textlink__grid {
    color: rgb(var(--black));
    --font-family: var(--font-body-copy);
    display: grid;
    justify-content: space-between;
    width: 100%;
    gap: 1rem;
    grid-template-columns: 1fr 1rem;
    text-align: left;
    --font-size: var(--font-p-default);
    padding-right: 1.25rem;
}

@media screen and (min-width: 768px) {

    .cta_textlink__grid {
        padding-right: 2rem
    }
}

.cta_textlink__grid svg {
    height: 1rem;
    stroke-width: 1;
    width: 1rem;
}

.ald_cta_textlink_white {
    color: rgb(var(--white));
}

.ald-cta-titlelink {
    display: flex;
    flex-direction: row;
    padding: 0.25rem 0.375rem;
    text-align: left;
    --font-family: var(--font-light);
    color: rgb(var(--black));
    background-color: rgb(var(--white));
    min-width: 7rem;
    max-width: 18.43rem;
    max-height: 6rem;
    --font-size: 1.875rem;
}

    .ald-cta-titlelink:hover {
        text-decoration: underline;
    }

    .ald-cta-titlelink:active {
        text-decoration: underline;
    }

    .ald-cta-titlelink:focus {
        text-decoration: underline;
        color: rgb(var(--black));
        background-color: rgb(var(--white));
    }

    .ald-cta-titlelink svg {
        height: 2.25rem;
        width: 2.25rem;
        align-self: flex-end;
        stroke: currentcolor;
        color: rgb(var(--black));
        transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    .ald-cta-titlelink:hover svg {
        transform: translateX(0.625rem);
    }

    .ald-cta-titlelink:active svg {
        transform: translateX(0.625rem);
    }

.cta-angled {
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(var(--black));
    background-color: rgb(var(--aldermore-yellow));
    --font-family: var(--font-bold);
    --font-size: 1.125rem;
    transition: clip-path 200ms cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    clip-path: polygon(4% 30%, 100% 10%, 100% 100%, 6.5% 100%);
}

    .cta-angled:hover,
    .cta-angled active {
        clip-path: polygon(0% 30%, 100% 0%, 100% 100%, 3.5% 100%);
    }

    .cta-angled:active {
        background-color: rgb(var(--black));
        color: rgb(var(--white));
    }

    .cta-angled div {
        margin-top: 1.5rem;
    }

    .cta-angled:focus div {
        outline: 2px solid rgb(var(--teal));
        outline-offset: -2px;
    }

    .cta-angled svg {
        display: inline-block;
        height: 1.25rem;
        width: 1.25rem;
        stroke: currentcolor;
        margin-right: 0.625rem;
        transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    .cta-angled:hover svg {
        transform: translateX(0.625rem);
    }

    .cta-angled:active svg {
        transform: translateX(0.625rem);
    }

.cta-angled-full {
    height: 5rem;
    padding-left: 1.25rem;
    width: 15.625rem;
}

@media screen and (min-width: 640px) {

    .cta-angled-full {
        height: 6rem;
        padding-left: 1.5rem;
        width: 18rem
    }
}

.cta-angled-reduced {
    height: 3.75rem;
    width: 10.625rem;
    padding-left: 1.5rem;
    align-content: space-evenly;
}

@media screen and (min-width: 640px) {

    .cta-angled-reduced {
        height: 5rem;
        width: 15.625rem
    }
}

.table_product_summary {
    overflow-x: auto;
}

.table_product_summary__table {
    width: 100%;
}

.table_product_summary__table_row {
    display: flex;
    justify-content: flex-start;
    width: 100%;
}

.table_product_summary__table tr:nth-child(odd) {
    background-color: rgb(var(--grey-light));
}

.table_product_summary_double_access .table-product-summary__table-header {
    width: 0;
}

.table_product_summary_double_access table {
    border-spacing: 0rem;
}

    .table_product_summary_double_access table .table-product-summary__table-header {
        border-bottom: 0.0625rem solid rgba(var(--black), 0.2);
    }

.table-product-summary__table-header {
    color: rgb(var(--black));
    font-family: var(--font-body-copy-bold);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%; /* 25.6px */
    min-width: 9.375rem;
    --padding: 1rem;
    padding: var(--padding);
    text-align: left;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .table-product-summary__table-header {
        --font-size: 1rem;
        min-width: 12.5rem;
        --padding: 1rem
    }
}

.table-product-summary__table-data {
    color: rgb(var(--black));
    flex-grow: 1;
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%;
    min-width: 9.375rem;
    padding: 1rem;
    text-align: end;
}

@media screen and (min-width: 768px) {

    .table-product-summary__table-data {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

.table_product_summary_double_access .table-product-summary__table-data__horizontal {
    width: 0;
}

.table_product_summary_double_access tr:nth-child(odd) {
    border-bottom: 0.0625rem solid rgba(var(--black), 0.2);
}

.table-product-summary__table-data__horizontal {
    color: rgb(var(--black));
    flex-grow: 1;
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%;
    min-width: 9.375rem;
    padding: 1rem 1.375rem 1rem 1rem;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .table-product-summary__table-data__horizontal {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem 1.125rem 1rem 1rem
    }
}

@media screen and (min-width: 1024px) {

    .table-product-summary__table-data__horizontal {
        padding: 1rem
    }
}

.table-product-summary__table-data__horizontal.clear-border {
    border-right: 0.0625rem solid transparent;
}

    .table-product-summary__table-data__horizontal.clear-border.clear-bottom {
        border-bottom: 0rem;
    }

.table_product_summary_double_access tr td:last-child {
    border-right: 0rem;
}

.table_product_summary_double_access tr:last-child td {
    border-bottom: 0rem;
}

.horizontal_headers-cell {
    min-width: 25rem;
}

/* Styles for Tickbox/Checkbox */

.tickbox__label {
    --font-family: var(--font-body-copy);
    --font-size: 0.875rem;
    font-weight: normal;
    align-self: center;
    display: inline-block;
    word-break: break-word;
}

.tickbox-filter__label {
    margin-left: 0rem;
}

    .tickbox-filter__label:has(>input:checked) span {
        font-weight: bold;
        transition: ease-in-out 0.3s;
    }

    .tickbox-filter__label:has(>input:disabled) {
        color: rgba(var(--white), 40%);
    }

.blog-quote-container__full {
    align-items: center;
    display: flex;
    flex-direction: column;
    overflow-y: hidden;
    text-overflow: ellipsis;
}

.blog-quote-container {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
    width: 100%;
}

@media (min-width: 640px) {
    .blog-quote-container {
        margin-top: 3rem;
        margin-bottom: 3rem;
    }
}

@media (min-width: 1024px) {
    .blog-quote-container {
        height: auto;
        margin-top: 4rem;
        margin-bottom: 4rem;
        width: 42rem;
    }
}

.bloq-quote__quote {
    margin-bottom: 1rem;
}

.blog-quote__divider {
    border-top-width: 0.125rem;
    margin-bottom: 1rem;
    width: 4.875rem;
}

.blog-quote__author {
    margin-bottom: 1rem;
}

.alert-hidden {
    display: none !important;
}

.alert-text p {
    --font-size: 1rem;
    margin-left: 1rem;
    margin-right: 1rem;
    max-width: 49.125rem;
}

.alert-text a {
    text-decoration: underline;
    font-weight: bold;
}

.alert-text.collapsed {
    overflow: hidden;
    max-height: 1.5rem;
}

    .alert-text.collapsed p {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

input[type="date"] {
    appearance: none;
    background: rgb(var(--white));
    color: rgb(var(--black));
    -moz-appearance: none;
    -webkit-appearance: none;
}

.form-control {
    position: relative;
}

    .form-control input, .form-control textarea, .form-control select {
        height: 3rem;
        width: 17.875rem;
        border: 1px solid rgba(var(--black), 0.2);
        color: rgb(var(--black));
        display: block;
        font-family: var(--font-body-copy);
        padding: 1rem;
        padding-right: 2.5rem;
    }

        .form-control input:disabled, .form-control textarea:disabled, .form-control select:disabled {
            background-color: rgb(var(--form-grey));
            color: rgb(var(--black));
            opacity: 40%;
        }

    .form-control input, .form-control textarea, .form-control select {
        background-color: rgb(var(--form-grey));
    }

    .form-control input, .form-control select {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        height: fit-content;
    }

    .form-control textarea {
        height: 7.75rem;
    }

    .form-control:focus {
        background-color: rgb(var(--white));
    }

.form-control__error {
    border-color: rgb(var(--state-error));
}

    .form-control__error input {
        border-color: rgb(var(--state-error));
        background-color: rgb(var(--white));
    }

    .form-control__error textarea {
        border-color: rgb(var(--state-error));
        background-color: rgb(var(--white));
    }

    .form-control__error select {
        border-color: rgb(var(--state-error));
    }

.form-control-error__p {
    margin-left: 0.25rem;
    color: rgb(var(--state-error));
}

.form-control-info__p {
    margin-left: 0.25rem;
    color: rgb(var(--state-info));
}

.form-control__label-container {
    display: flex;
    align-items: center;
    gap: 0;
    min-height: 3.375rem;
    padding-bottom: 0.5rem;
    width: 17.875rem;
}

.form-control__label {
    cursor: pointer;
    display: inline-block;
    margin-bottom: 0.5rem;
    vertical-align: top;
    width: 13rem;
}

.form-control__input-textfield {
    --font-size: 0.875rem;
}

.form-control input.form-control__input-textfield:focus,
.form-control input.form-control__input-textfield:focus-within,
.form-control.select select:focus {
    outline: none;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
}

.form-control input.form-control__input-textfield:focus,
.form-control input.form-control__input-textfield:focus-within,
.form-control.select select:focus,
.form-control textarea:focus {
    background-color: rgb(var(--white));
    border-color: rgb(var(--black));
    font-family: var(--font-body-copy-bold);
    font-weight: bold;
}

.form-control__input-numeric {
    --font-family: var(--font-bold);
    --font-size: 1.6rem;
}

@media screen and (min-width: 768px) {

    .form-control__input-numeric {
        --font-size: 2.25rem
    }
}

.form-control-notification__label {
    padding-left: 0.5rem;
    padding-top: 0.25rem;
}

@media screen and (min-width: 768px) {

    .form-control-notification__label {
        padding-top: 0.5rem
    }
}

.form-info {
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    width: 20rem;
}

    .form-info svg {
        align-self: flex-start;
        flex-shrink: 0;
        height: 0.75rem;
        margin-top: 0.25rem;
        width: 0.75rem;
    }

    .form-info p {
        overflow: hidden;
    }

.form-error {
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    width: 17.875rem;
}

    .form-error svg {
        align-self: flex-start;
        flex-shrink: 0;
        height: 0.75rem;
        margin-top: 0.15rem;
        width: 0.75rem;
    }

    .form-error p {
        overflow: hidden;
    }

.form-error__extra {
    margin-top: 1.25rem;
}

.multiselect-box {
    border: 1px solid rgba(var(--black), 0.2);
    background-color: rgb(var(--form-grey));
    position: relative;
    background-image: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" width="8" height="5" viewBox="0 0 8 5" fill="%231e2019"><path d="M4 4.93333L0 0.933333L0.933333 0L4 3.06667L7.06667 0L8 0.933333L4 4.93333Z" fill="%231e2019"/></svg>');
    background-repeat: no-repeat;
    background-position: right .75rem center;
    border: 1px solid rgba(var(--black), 0.2);
    max-width: 286px;
}

.mutliselectdropdown {
    height: 3rem;
    width: 17.775rem;
}

.select--error select {
    border-color: rgb(var(--form-red));
}

.multiselect {
    position: relative;
}

.multiselectlist {
    background-color: rgb(var(--form-grey));
    /* border: 1px solid rgba(var(--black), 0.2); */
    border-top: none;
    display: flex;
    flex-direction: column;
    height: 12rem;
    overflow-y: scroll;
    position: absolute;
    width: 100%;
    z-index: 30;
}

@media screen and (min-width: 640px) {

    .multiselectlist {
        width: 17.87rem
    }
}

.multiselectlist.hidden {
    display: none;
}

.multiselectlist__item {
    background-color: rgb(var(--form-grey));
    border: 1px solid rgba(var(--black), 0.2);
    color: rgb(var(--black));
    display: flex;
    height: 3rem;
}

    .multiselectlist__item .checkbox-container {
        height: 3rem;
        margin-bottom: 0;
        width: 100%;
    }

    .multiselectlist__item:hover {
        background-color: white;
    }

        .multiselectlist__item:hover .checkbox-container input[type="checkbox"] {
            --border: var(--black);
        }

.form-control-option__radio-button {
    align-items: center;
    appearance: none;
    display: flex;
    cursor: pointer;
    justify-content: center;
    vertical-align: middle;
}

.form-control-option__label {
    --font-family: var(--font-body-copy);
    --font-size: 0.875rem;
    align-self: center;
    display: flex;
    font-weight: normal;
    text-transform: capitalize;
    word-break: break-word;
}

.form-control-option__label-radio {
    display: flex;
}

.form-control-option__container {
    align-items: center;
    display: flex;
}

/* CSS for column layout for form controls */

.form-control__section__grid-1 {
    display: grid;
    justify-content: start;
    --r_gap: 1rem;
    --c_gap: 1.25rem;
    row-gap: var(--r_gap);
    column-gap: var(--c_gap);
}

@media screen and (min-width: 640px) {
    .form-control__section__grid-1 {
        --c_gap: 2.5rem;
    }
}

.form-control__section__grid-2 {
    display: grid;
    justify-content: start;
    --r_gap: 1rem;
    --c_gap: 1.25rem;
    row-gap: var(--r_gap);
    column-gap: var(--c_gap);
}

@media (min-width: 640px) {
    .form-control__section__grid-2 {
        --c_gap: 2.5rem;
        --r_gap: 1rem;
    }
}

@media (min-width: 1024px) {
    .form-control__section__grid-2 {
        grid-auto-flow: column;
    }

        .form-control__section__grid-2 div:nth-child(2n + 1) {
            grid-column: 1;
        }

        .form-control__section__grid-2 div:nth-child(2n + 2) {
            grid-column: 2;
        }
}

.form-control__section__grid-3 {
    display: grid;
    justify-content: start;
    --r_gap: 1rem;
    --c_gap: 1.25rem;
    row-gap: var(--r_gap);
    column-gap: var(--c_gap);
}

@media (min-width: 640px) {
    .form-control__section__grid-3 {
        --c_gap: 2.5rem;
        --r_gap: 1rem;
    }
}

@media (min-width: 1024px) {
    .form-control__section__grid-3 {
        grid-auto-flow: column;
    }

        .form-control__section__grid-3 div:nth-child(2n + 1) {
            grid-column: 1;
        }

        .form-control__section__grid-3 div:nth-child(2n + 2) {
            grid-column: 2;
        }
}

@media screen and (min-width: 1280px) {
    .form-control__section__grid-3 {
        grid-auto-flow: column;
    }

        .form-control__section__grid-3 div:nth-child(3n + 1) {
            grid-column: 1;
        }

        .form-control__section__grid-3 div:nth-child(3n + 2) {
            grid-column: 2;
        }

        .form-control__section__grid-3 div:nth-child(3n + 3) {
            grid-column: 3;
        }
}

@media (min-width: 1024px) {
    .form-control__section__grid-2 .ang-input:nth-child(2n + 1) {
        grid-column: 1;
    }

    .form-control__section__grid-2 .ang-input:nth-child(2n + 2) {
        grid-column: 2;
    }
}

@media (min-width: 1024px) {
    .form-control__section__grid-3 .ang-input:nth-child(2n + 1) {
        grid-column: 1;
    }

    .form-control__section__grid-3 .ang-input:nth-child(2n + 2) {
        grid-column: 2;
    }
}

@media screen and (min-width: 1280px) {
    .form-control__section__grid-3 .ang-input:nth-child(3n + 1) {
        grid-column: 1;
    }

    .form-control__section__grid-3 .ang-input:nth-child(3n + 2) {
        grid-column: 2;
    }

    .form-control__section__grid-3 .ang-input:nth-child(3n + 3) {
        grid-column: 3;
    }
}

/* Download Card */

.card-download {
    display: flex;
    flex-direction: column;
    padding: 1.875rem;
    width: 18.75rem;
}

/* Card Download Long */

.card-download-long {
    height: 18.875rem;
}

.card-download-long__container {
    height: 11.875rem;
}

.card-download-long__title {
    display: -webkit-box;
    line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.card-download-long__content {
    height: auto;
    overflow-wrap: break-word;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.card-download-long__a {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 0.25rem;
    width: fit-content;
}

    .card-download-long__a svg {
        height: 0.75rem;
        width: 0.75rem;
    }

.card-download-long__p {
    display: -webkit-box;
    line-clamp: 4;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

/* Card Download Short */

.card-download-short {
    height: 12.5rem;
}

.card-download-short__title {
    display: -webkit-box;
    height: 6rem;
    line-clamp: 4;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

/* Card Download Group */

.card-download-group {
    display: flex;
    flex-wrap: wrap;
    gap: 1.75rem;
}

    .card-download-group li {
        list-style-type: none;
    }

.download--card-text-button {
    padding-top: 1.25rem;
}

.contact-card {
    align-items: flex-start;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    flex-shrink: 0rem;
    height: 13.625rem;
    padding: 1.875rem;
    width: 18.75rem;
}

.wider_card {
    width: 23.4375rem;
}

.contact-card-no-link {
    cursor: none;
    pointer-events: none;
}

.contact-card svg {
    display: flex;
    flex-shrink: 0;
    height: 1.5rem;
    margin-bottom: 0.5rem;
    width: 1.5rem;
}

.contact-card-type__container {
    padding-top: 0.75rem;
    padding-bottom: 1rem;
    width: 100%;
}

.contact-card-anchor-text {
    --font-family: var(--font-body-copy);
    font-weight: bold;
    font-family: var(--font-family);
    --font-size: var(--font-h6-default);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (min-width: 640px) {

    .contact-card-anchor-text {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    .contact-card-anchor-text {
        --font-size: var(--font-h6-large)
    }
}

.contact-card__a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.contact-card-copy {
    --font-size: var(--font-p-default)
}

.contact-card-group {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-top: 1.25rem;
}

@media screen and (min-width: 768px) {

    .contact-card-group {
        gap: 1.75rem;
        margin-top: 1.75rem
    }
}

.contact-card-group li {
    list-style-type: none;
}

.message-cta {
    display: flex;
}

    .message-cta svg {
        --size: 1rem;
        height: var(--size);
        margin-left: 0.5rem;
        margin-top: 0.25rem;
        width: var(--size);
    }

/*  */

.accordion-alert {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-family: var(--font-body-copy);
    justify-content: center;
    max-height: 1000px;
    padding: 1.25rem;
    transition: max-height 0.2s;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .accordion-alert {
        padding-left: 2.25rem;
        padding-right: 2.25rem
    }
}

@media screen and (min-width: 1280px) {

    .accordion-alert {
        padding-left: 3rem;
        padding-right: 3rem
    }
}

.accordion-alert .alert-bell {
    align-self: flex-start;
    display: flex;
}

.accordion-alert svg {
    --height: 1.5rem;
    --width: 1.5em;
}

.accordion-alert .state-valid svg {
    color: rgb(var(--state-valid));
}

.accordion-alert .state-info svg {
    color: rgb(var(--state-info));
}

.accordion-alert .alert-chevron {
    align-self: flex-start;
    display: grid;
}

    .accordion-alert .alert-chevron svg {
        color: rgb(var(--black));
        flex-shrink: 0;
        height: 1rem;
        width: 1rem;
    }

.accordion-alert .alert-chevron-div {
    width: 1rem;
    height: 1rem;
}

.accordion-alert.collapsed {
    max-height: 5.5rem;
}

    .accordion-alert.collapsed .alert-chevron svg {
        transform: rotate(180deg);
    }

.accordion_flex {
    background-color: rgb(var(--white));
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    position: relative;
}

    .accordion_flex > div {
        flex-grow: 1;
    }

@media screen and (min-width: 1024px) {
    .accordion_flex {
        flex-direction: row;
    }
}

.accordion_flex .card-more-faq__anchor {
    height: fit-content;
    width: 100%;
}

@media screen and (min-width: 1024px) {
    .accordion_flex .card-more-faq__anchor {
        flex-shrink: 0;
        position: sticky;
        top: 0;
        width: 21rem;
    }
}

.accordion_fullwidth {
    background-color: rgb(var(--white));
    height: 100%;
    padding: 2.5rem 1.25rem 2.5rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .accordion_fullwidth {
        padding: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .accordion_fullwidth {
        padding: 3rem
    }
}

.accordion_fullwidth__section:not(:nth-child(1)):not(:nth-child(2)) {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 0.0625rem;
    padding-top: 2rem;
}

@media screen and (min-width: 640px) {

    .accordion_fullwidth__section:not(:nth-child(1)):not(:nth-child(2)) {
        padding-top: 2rem
    }
}

.accordion_fullwidth__section:not(:first-child) {
    padding-bottom: 2rem;
}

@media screen and (min-width: 640px) {

    .accordion_fullwidth__section:not(:first-child) {
        padding-bottom: 2rem
    }
}

.accordion_fullwidth__title-banner {
    display: flex;
    gap: 1.25rem;
    justify-content: space-between;
    width: 100%;
}

    .accordion_fullwidth__title-banner svg {
        cursor: pointer;
        flex-shrink: 0;
        height: var(--size);
        justify-self: right;
        width: var(--size);
        margin-left: auto;
        --size: 1.5rem;
        stroke-width: 2;
    }

@media screen and (min-width: 640px) {

    .accordion_fullwidth__title-banner svg {
        margin-right: 2rem
    }
}

.accordion_form__fullwidth {
    width: 100%;
    height: 100%;
    margin-top: 1.25rem;
}

    .accordion_form__fullwidth .accordion_form__section {
        cursor: pointer;
        border-bottom: 1px solid rgba(var(--black), 0.2);
        --padding-bottom: 1.5rem;
        --padding-top: 1.5rem;
        padding-bottom: var(--padding-bottom);
        padding-top: var(--padding-top);
    }

        .accordion_form__fullwidth .accordion_form__section:first-child {
            border-top: 1px solid rgba(var(--black), 0.2);
        }

@media screen and (min-width: 640px) {
    .accordion_form__fullwidth .accordion_form__section {
        --padding-bottom: 1.75rem;
        --padding-top: 1.75rem;
    }
}

@media screen and (min-width: 768px) {
    .accordion_form__fullwidth .accordion_form__section {
        --padding-bottom: 2rem;
        --padding-top: 2rem;
    }
}

.accordion_form__fullwidth .accordion_form__title_banner {
    display: flex;
}

    .accordion_form__fullwidth .accordion_form__title_banner svg {
        flex-shrink: 0;
        cursor: pointer;
        stroke: currentcolor;
        stroke-width: 2;
        --size: 1rem;
        height: var(--size);
        width: var(--size);
        margin-left: auto;
        margin-right: 1.25rem;
    }

@media screen and (min-width: 640px) {

    .accordion_form__fullwidth .accordion_form__title_banner svg {
        margin-right: 1.5rem
    }
}

.accordion_form__fullwidth .accordion_form__header {
    cursor: pointer;
}

.accordion_form__fullwidth .accordion_form__border {
    border-top-width: 1px;
    border-color: rgb(var(--mid-grey-tint));
    padding-bottom: 1.25rem;
}

.accordion-border {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 0.0625rem;
}

.accordion_flex .accordion-border {
    padding-bottom: 0rem;
    padding-top: 0;
}

.accordion__header {
    margin-bottom: 1.25rem;
}

.accordion__section-links__header {
    color: rgb(var(--black));
    cursor: pointer;
    font-family: var(--font-body-copy);
    --font-size: 1.125rem;
    font-size: var(--font-size);
    font-weight: 400;
    line-height: 160%;
    text-align: left;
}

    .accordion__section-links__header.font-bold {
        font-weight: bold;
    }

.accordion__section-link__p {
    color: rgb(var(--black));
    --font-size: 1rem;
    font-size: var(--font-size);
    padding-right: 1.5rem;
    padding-top: 1.25rem;
}

.business-finance {
    display: flex;
    flex-direction: column-reverse;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .business-finance {
        flex-direction: row
    }
}

.business-finance__container {
    color: rgb(var(--black));
    padding: 2.25rem 1.25rem 2.25rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .business-finance__container {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .business-finance__container {
        padding: 5rem 2.5rem 5rem 3rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .business-finance__container {
        padding: 7.5rem 4.25rem 7.5rem 3rem
    }
}

.business-finance__header {
    margin-bottom: 0.75rem;
    width: 100%;
}

.business-finance__p {
    margin-bottom: 2.5rem;
}

.bf-image-container {
    width: 100%;
    display: flex;
}

@media screen and (min-width: 1024px) {

    .bf-image-container {
        width: 50%
    }
}

.bf-image-angle {
    object-fit: cover;
    height: 17.5rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .bf-image-angle {
        height: unset
    }
}

.mortgages-block {
    color: rgb(var(--black));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .mortgages-block {
        flex-direction: row
    }
}

.mortgages-block__text-container {
    padding: 2.25rem 1.25rem 2.25rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .mortgages-block__text-container {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .mortgages-block__text-container {
        padding: 5rem 3rem 5rem 2.5rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .mortgages-block__text-container {
        padding: 7.5rem 3rem 7.5rem 4.25rem
    }
}

.mortgages-block__header {
    margin-bottom: 0.75rem;
    width: 100%;
}

.mortgages-block__p {
    margin-bottom: 2.5rem;
}

.mortgages-block-image__container {
    width: 100%;
    display: flex;
}

@media screen and (min-width: 1024px) {

    .mortgages-block-image__container {
        width: 50%
    }
}

.mortgages-block-image-angle {
    object-fit: cover;
    height: 17.5rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .mortgages-block-image-angle {
        height: unset
    }
}

.card-group {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1.875rem;
}

.card {
    align-items: flex-start;
    cursor: pointer;
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    height: 19.75rem;
    overflow: hidden;
    padding: 1.875rem;
    position: relative;
    width: 22.875rem;
}

.card__content {
    height: auto;
    overflow-wrap: break-word;
}

/* This breakpoint is required to cope with the margin-side added to the container causing the card to overflow the container on smaller mobile sizes. This correction is also seen on article-listing-blog */

@media screen and (min-width: 430px) {
    .card {
        width: 22.875rem;
    }
}

.card__content .category {
    font-weight: 700;
}

.card-animation:hover {
    box-shadow: 0rem 0rem 1rem 0.2rem rgba(var(--black), 0.15), 0px 0px 0px 0px inset;
}

.card-animation {
    display: inline-block;
    overflow: hidden;
    position: relative;
    transform: perspective(0.0625rem) translateZ(0);
    -webkit-transform: perspective(0.0625rem) translateZ(0);
    vertical-align: middle;
}

    .card-animation::before {
        background: rgb(var(--primary-colour));
        bottom: 0;
        content: "";
        height: 0.25rem;
        left: 0;
        position: absolute;
        right: 100%;
        transition-duration: 0.3s;
        transition-property: right;
        transition-timing-function: ease-out;
        -webkit-transition-duration: 0.3s;
        -webkit-transition-property: right;
        -webkit-transition-timing-function: ease-out;
        z-index: -1;
    }

    .card-animation:hover:before, .card-animation:focus:before, .card-animation:active:before {
        right: 0;
    }

.card-label {
    --font-size: var(--font-p-default);
    font-weight: bold;
}

    .card-label svg {
        height: 0.75rem;
        width: 0.75rem;
    }

.card-link-container_blog {
    bottom: 1.875rem;
    display: flex;
    justify-content: flex-end;
    padding: 0rem 1.875rem 1.875rem 1.875rem;
}

.card-link-container_img {
    bottom: 0rem;
    display: flex;
    justify-content: flex-end;
    margin-top: auto;
}

.card-link-container {
    display: flex;
    justify-content: flex-end;
    margin-top: auto;
}

.card__content > .card-link-container {
    bottom: 1.875rem;
    display: flex;
    justify-content: flex-end;
    padding-top: 1.5rem;
    position: fixed;
    width: 19.125rem;
}

.card-link {
    align-items: center;
    background-color: rgb(var(--primary-colour));
    display: flex;
    height: 2.5rem;
    justify-content: center;
    padding: 0.25rem;
    width: 2.5rem;
}

.card-grey {
    background-color: rgb(var(--grey-light));
}

.card__header {
    width: 100%;
}

.card__p {
    display: -webkit-box;
    margin-top: 1.25rem;
    margin-bottom: 1.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.card.blog {
    width: 100%;
    margin: 0;
}

.card.listing-blog {
    width: 100%;
    height: 24.25rem;
    margin: 0;
}

.title-link-card__article {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    flex-wrap: wrap;
    height: 100%;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.title-link-card__article_img {
    height: 100%;
}

.title-link-card__image-container {
    height: 15rem;
    overflow: hidden;
}

.title-link-card__image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
    transform: scale(1,1);
    -webkit-transform: scale(1,1);
    transition: all 1s;
    transition-timing-function: ease-in-out;
    width: 100%;
}

.title-link-card__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    height: 15.75rem;
    padding: 1.875rem;
    width: 100%;
}

.title-link-card__content__img {
    height: 20rem;
}

.title-link-card__cta {
    display: flex;
    margin-bottom: 0.75rem;
}

.title-link-card__title {
    display: flex;
    font-family: var(--font-body-copy);
    font-weight: bold;
    justify-content: flex-start;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.title-link-card__p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 3;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.title-link-card__a {
    z-index: 10;
}

.card-more-faq__title {
    padding-bottom: 1.25rem;
}

.card-more-faq {
    color: rgb(var(--white));
    cursor: pointer;
    display: flex;
    flex-direction: column;
    height: 13rem;
    overflow: hidden;
    padding: 1.875rem;
    width: 21rem;
}

.card-more-faq__anchor {
    display: inline-block;
}

.card-more-faq__link {
    margin-top: auto;
    text-decoration: underline;
    text-decoration-thickness: 0.1rem;
    text-underline-offset: 0.25rem;
}

    .card-more-faq__link svg {
        height: 0.75rem;
        width: 0.75rem;
    }

.card-more-faq__link-primary {
    color: rgb(var(--primary-colour));
}

.card-more-faq-grey-light {
    color: rgb(var(--black));
}

.card-more-faq-white {
    border: 0.0625rem solid;
    border-color: rgba(var(--black), 0.1);
    color: rgb(var(--black));
}

@media (max-width: 440px) {
    .card-link-container {
        padding-right: 1.5rem;
    }
}

.card-title-link__section-wide {
    width: 36rem;
    height: 15.75rem;
}

.card-title-link__section-narrow {
    width: 24rem;
    height: 18rem;
}

.card-title-link__section-narrow-image {
    width: 24rem;
    height: 35rem;
}

.card-title-link__section-flex {
    display: flex;
    flex-wrap: wrap;
}

.checkbox-group .checkbox-container:first-child {
    margin-top: 1.25rem;
}

.checkbox-container {
    align-items: center;
    background-color: rgb(var(--form-grey));
    border: 1px solid rgba(var(--black), 0.2);
    cursor: pointer;
    display: flex;
    height: fit-content;
    margin-bottom: 0.75rem;
    max-width: 100%;
    min-height: 3rem;
    padding: 0.5rem 1rem;
    width: fit-content;
}

    .checkbox-container .tickbox__label {
        display: flex;
        align-items: center;
        width: 100%;
        cursor: pointer;
    }

    .checkbox-container:hover {
        background-color: rgb(var(--secondary-light-colour-hover));
        border-color: rgb(var(--black));
    }

        .checkbox-container:hover input[type="checkbox"]:not(:checked) {
            background-color: rgb(var(--secondary-light-colour-hover));
        }

    .checkbox-container:has(input:checked) {
        background-color: rgb(var(--white));
        border-color: rgb(var(--black));
        --font-family: var(--font-body-copy-bold);
    }

    .checkbox-container.checkbox-error {
        background-color: rgb(var(--white));
        border-color: rgb(var(--state-error));
    }

    .checkbox-container:has(input:disabled) {
        opacity: 50%;
        pointer-events: none;
    }

input[type="checkbox"] {
    align-self: center;
    appearance: none;
    --background: var(--form-grey);
    background-color: rgb(var(--background, --form-grey));
    --border: var(--black);
    border: 0.0625rem solid rgb(var(--border, --black));
    color: rgb(var(--form-grey));
    cursor: pointer;
    display: inline-block;
    flex-shrink: 0;
    height: 1rem;
    position: relative;
    margin-bottom: 0.1rem;
    margin-right: 0.5rem;
    width: 1rem;
}

    input[type="checkbox"].anchor__checkbox-styling {
        background-color: rgb(var(--form-grey));
        border-color: rgba(var(--black),0.1);
        margin-right: 0.75rem;
    }

    input[type="checkbox"]:before {
        content: '';
        display: block;
        left: 0;
        top: 0;
        position: absolute;
    }

    input[type="checkbox"]:checked {
        --background: var(--black);
        --border: var(--black);
    }

        input[type="checkbox"]:checked.anchor__checkbox-styling {
            background-color: rgb(var(--primary-colour));
            border-color: rgb(var(--primary-colour));
        }

        input[type="checkbox"]:checked:before {
            border: 0.0625rem solid rgb(var(--white));
            border-width: 0 0.0625rem 0.0625rem 0;
            height: 0.625rem;
            left: 0.3rem;
            transform: rotate(45deg);
            top: 0.05rem;
            width: 0.3125rem;
        }

    input[type="checkbox"]:disabled {
        background-color: rgba(var(--white), 40%);
        border-color: rgba(var(--black), 40%);
        cursor: not-allowed;
    }

        input[type="checkbox"]:disabled.anchor__checkbox-styling {
            background-color: rgba(var(--white), 40%);
            border-color: rgba(var(--black), 40%);
        }

        input[type="checkbox"]:disabled + label {
            color: rgba(var(--black), 40%);
        }

.anchor__checkbox-container {
    column-gap: 0.75rem;
}

.anchor__checkbox-label {
    align-items: center;
    background-color: rgb(var(--white));
    border: 0.0625rem solid rgba(var(--black),0.1);
    box-shadow: 0rem 0.25rem 0.625rem -0.1875rem rgba(var(--black), 0.1);
    cursor: pointer;
    display: flex;
    padding: 0.75rem;
    width: fit-content;
}

    .anchor__checkbox-label:hover {
        background-color: rgb(var(--form-grey));
    }

    .anchor__checkbox-label:has(>input:checked) {
        border-color: rgb(var(--black));
    }

    .anchor__checkbox-label:has(>input:disabled) {
        background-color: rgba(var(--white), 40%);
        border-color: rgba(var(--black), 40%);
        cursor: not-allowed;
    }

.checkbox-group .radio-container:first-child {
    margin-top: 1.25rem;
}

.radio-container {
    align-items: center;
    background-color: rgb(var(--form-grey));
    border: 1px solid rgba(var(--black), 0.2);
    cursor: pointer;
    display: flex;
    height: fit-content;
    margin-bottom: 0.75rem;
    max-width: 100%;
    min-height: 3rem;
    padding: 0.5rem 1rem;
    width: fit-content;
}

    .radio-container:hover {
        background-color: rgb(var(--secondary-light-colour-hover));
        border-color: rgb(var(--black));
    }

.radio-custom {
    align-items: center;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
}

    .radio-custom:before {
        align-items: center;
        content: '';
        background: rgb(var(--form-grey));
        border: 0.0625rem solid rgb(var(--black));
        display: flex;
        vertical-align: middle;
        width: 1.25rem;
        height: 1.25rem;
        padding: 0.125rem;
        text-align: center;
        border-radius: 50%;
    }

    .radio-custom:checked:before {
        background-color: rgb(var(--white));
        background-image: url('data:image/svg+xml; utf8, <svg width="25" height="25" viewBox="0 0 50 50" fill="%231e2019" stroke="%234FE200" xmlns="http://www.w3.org/2000/svg"><circle cx="25" cy="25" r="10" stroke="%231e2019" stroke-width="1" fill="%231e2019" /></svg>');
        background-repeat: no-repeat;
        background-position: center;
        border-color: rgb(var(--black));
    }

    .radio-custom:hover:before {
        border-color: rgb(var(--black));
    }

    .radio-custom:disabled:before {
        background-color: rgba(var(--form-grey), 20%);
        border-color: rgba(var(--black), 40%);
        cursor: not-allowed;
    }

.radio-container:has(input:disabled) {
    opacity: 50%;
    pointer-events: none;
}

.radio-container:has(input:checked) {
    background-color: rgb(var(--white));
    border-color: rgb(var(--black));
}

    .radio-container:has(input:checked) label {
        --font-family: var(--font-body-copy-bold);
    }

.radio-container.error {
    border-color: rgb(var(--state-error));
}

.radio-label__text {
    flex-direction: column;
}

.document-table-container {
    display: block;
    margin-bottom: 4rem;
    margin-top: 4rem;
    overflow-x: auto;
    table-layout: auto;
    max-width: 100%;
}

@media screen and (min-width: 640px) {

    .document-table-container {
        margin-bottom: 5rem;
        margin-top: 5rem
    }
}

.document-table-row {
    border-top: 0.0625rem solid rgba(var(--black), 0.2);
    background-color: rgb(var(--white));
    color: rgb(var(--black));
    --font-family: var(--font-body-copy);
    font-family: var(--font-family);
    --font-size: 1rem;
    font-size: var(--font-size);
    line-height: 160%;
    letter-spacing: calc(var(--font-size) * -0.02);
}

@media screen and (min-width: 768px) {

    .document-table-row {
        --font-size: 1rem
    }
}

.document-table-row td:first-child,
th:first-child {
    border: none;
}

.document-table-row td:first-child,
td:nth-child(2),
td:last-child,
td:nth-last-child(2),
th:last-child {
    border-right: none;
}

.document-table-container td:first-child,
th:first-child {
    border-left: none;
}

.document-table-container td:first-child,
td:last-child,
td:nth-last-child(2),
th:last-child {
    border-right: none;
}

.document-table-container tr:nth-child(odd) {
    background-color: rgb(var(--grey-light));
}

.document-table-cell {
    min-width: 8.5rem;
    padding: 1rem 2.5rem 1rem 0rem;
    text-align: left;
}

@media screen and (min-width: 1024px) {
    .document-table-cell {
        min-width: 12.5rem;
        padding: 1rem 5rem 1rem 0rem;
    }
}

@media screen and (min-width: 1280px) {
    .document-table-cell {
        min-width: 18rem;
    }
}

.document-name-column {
    width: 100%;
}

@media screen and (min-width: 1024px) {
    .document-name-column {
        width: 100%;
    }
}

@media screen and (min-width: 1280px) {
    .name-column {
        width: 100%;
        padding: 1rem 5rem 1rem 0rem;
    }
}

.document-table-cell-sidebar {
    min-width: 0.375rem;
    text-align: left;
}

.document-table-cell-sidebar-popular {
    background-color: rgb(var(--secondary-colour));
}

.document-table-header {
    background-color: rgb(var(--white)) !important;
    color: rgb(var(--black));
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 120%;
}

@media screen and (min-width: 768px) {

    .document-table-header {
        --font-size: 1rem
    }
}

.document-table-header-cell {
    min-width: 8.75rem;
    padding: 1rem 1rem 1rem 0rem;
    text-align: left;
}

@media screen and (min-width: 1024px) {
    .document-table-header-cell {
        min-width: 15rem;
    }
}

@media screen and (min-width: 1280px) {
    .document-table-header-cell {
        min-width: 20rem;
    }
}

.document-name-header {
    min-width: 20rem;
    width: 100%;
}

@media screen and (min-width: 1280px) {
    .document-name-header {
        width: 100%;
    }
}

.document-table-header-cell.most-popular {
    padding-left: 1rem;
}

.document-table-header-cell:first-child button {
    padding-left: 5.50rem;
}

@media screen and (min-width: 1024px) {

    .document-table-header-cell:first-child button {
        padding-left: 6.25rem
    }
}

.document-table-header-cell button {
    color: rgb(var(--black));
    display: flex;
    justify-content: flex-start;
    width: 100%;
}

    .document-table-header-cell button p {
        font-family: var(--font-body-copy-bold);
        padding-right: 0.5rem;
    }

.document-table-sort-marker {
    float: right;
}

    .document-table-sort-marker:focus-visible {
        outline: 2px solid rgb(var(--teal));
        outline-offset: -2px;
    }

.header-sort svg {
    height: 1rem;
    width: 1rem;
    transition: all 200ms ease-in-out;
}

.document-table-popular-header {
    background-color: rgb(var(--secondary-colour));
    color: rgb(var(--white));
    font-family: var(--font-body-copy-bold);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%;
    padding: 1rem;
    text-align: left;
}

@media screen and (min-width: 768px) {

    .document-table-popular-header {
        --font-size: 1rem
    }
}

.document-table-popular-header td:last-child,
th:last-child {
    border-right: none;
}

.document-table-row:hover {
    cursor: pointer;
    font-family: var(--font-body-copy-bold);
    letter-spacing: calc(var(--font-size) * -0.05);
}

.document-table-icon-column {
    border-right: none !important;
    padding: 0.69rem 1.5rem 0.69rem 1.06rem;
    width: 2rem;
}

    .document-table-icon-column svg {
        color: rgb(var(--black));
        height: 0.75rem;
        width: 0.75rem;
    }

@media screen and (min-width: 1024px) {

    .document-table-icon-column {
        padding: 0.69rem 2rem 0.69rem 1.06rem
    }
}

.document-table-icon-column div {
    align-items: center;
    background-color: rgb(var(--primary-colour));
    display: flex;
    justify-content: center;
    padding: 0.75rem 1rem;
}

.document-table-new-lozenge-column {
    padding: 1rem 1.75rem 1rem 0.5rem;
    width: 5rem;
}

@media screen and (min-width: 768px) {
    .document-table-new-lozenge-column {
        padding: 1rem 1.75rem 1rem 0.5rem;
    }
}

.document-table-new-lozenge {
    background-color: rgb(var(--black));
    border-radius: 2rem;
    color: rgb(var(--white));
    flex-shrink: 0;
    --font-size: 0.75rem;
    font-size: var(--font-size);
    font-weight: bold;
    height: 1.5rem;
    padding: 0.5rem;
    text-align: center;
}

.rotate-header-chevron svg {
    transform: rotate(180deg);
}

#button {
    margin-top: 100px;
}

#tooltip {
    background: #333;
    color: white;
    display: none;
    font-family: var(--font-body-copy);
}

    #tooltip[data-show] {
        display: block;
    }

#arrow,
#arrow::before {
    position: absolute;
    width: 0.5rem;
    height: 0.5rem;
    background: inherit;
}

#arrow {
    visibility: hidden;
}

    #arrow::before {
        visibility: visible;
        content: '';
        transform: rotate(45deg);
    }

/* color for help icon svg */

.question-mark-black-tooltip {
    color: rgb(var(--black));
}

.question-mark-white-tooltip {
    color: rgb(var(--white));
}

.question-mark-grey-tooltip {
    color: rgb(var(--form-grey));
}

.question-mark-secondary-tooltip {
    color: rgb(var(--secondary-colour));
}

/* color for tooltip box */

.tooltip-main {
    border-radius: 0;
    color: rgb(var(--black));
}

.black-tooltip {
    background-color: rgb(var(--black));
    color: rgb(var(--white));
}

.white-tooltip {
    background-color: rgb(var(--white));
    color: rgb(var(--black));
}

.grey-tooltip {
    background-color: rgb(var(--form-grey));
    color: rgb(var(--black));
}

.secondary-tooltip {
    background-color: rgb(var(--secondary-colour));
    color: rgb(var(--white));
}

.tooltip-container {
    padding: 0.375rem !important;
    background-color: unset !important;
}

#tooltip[data-popper-placement^='top'] > .tooltip-main > #arrow {
    bottom: 0.125rem;
}

#tooltip[data-popper-placement^='bottom'] > .tooltip-main > #arrow {
    top: 0.125rem;
}

#tooltip[data-popper-placement^='left'] > .tooltip-main > #arrow {
    right: -0.25rem;
}

#tooltip[data-popper-placement^='right'] > .tooltip-main > #arrow {
    left: -0.25rem;
}

.tooltip__header {
    --font-size: 1rem;
    font-family: var(--font-body-copy);
    font-size: var(--font-size);
    letter-spacing: -0.015rem;
    margin: 0;
}

.tooltip-text-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.tooltip-text {
    font-size: 0.75rem;
    letter-spacing: -0.015rem;
    text-align: left;
}

    .tooltip-text p a {
        color: unset !important;
        font-weight: bold;
        font-family: var(--font-body-copy);
        font-size: 1rem;
        letter-spacing: -0.015rem;
        margin: 0;
        text-decoration: underline !important;
    }

.tooltip-box {
    padding-top: 1rem;
    padding-bottom: 1rem;
    ;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
}

.tooltip-main {
    z-index: inherit;
}

.tooltip-help-icon {
    cursor: pointer;
    z-index: 10;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    padding-bottom: 0.75rem;
    padding-top: 0.75rem;
}

    .tooltip-help-icon svg {
        height: 1rem;
        width: 1rem;
    }

.int-banner-only {
    background-color: rgb(var(--black));
    color: rgb(var(--white));
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    --padding-x: 0rem;
    --padding-y: 1rem;
    padding: var(--padding-y) var(--padding-x);
    text-align: center;
}

    .int-banner-only p {
        display: inline;
    }

    .int-banner-only a {
        color: rgb(var(--primary-colour));
        display: inline;
        font-family: var(--font-body-copy);
        font-weight: bold;
    }

.int-banner {
    align-items: center;
    display: flex;
    height: 21rem;
    justify-content: center;
    overflow: hidden;
}

.intermediaries-banner__header {
    color: rgb(var(--white));
    padding-bottom: 0.75rem;
}

.int-banner-container {
    background-color: rgba(0,0,0,1); /* Black background with opacity */
    height: 100%;
}

.int-banner-text-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    position: absolute;
}

.int-banner-image {
    height: 100%;
    object-fit: cover;
    opacity: 0.4;
}

:root {
    --left-image-copy-mobile-angle: polygon(0 0, 100% 0, 100% 91%, 0 100%);
    --right-image-copy-mobile-angle: polygon(0 0, 100% 0, 100% 100%, 0 91%);
}

@media screen and (min-width: 1280px) {

    .left-image-height {
        min-height: 46.875rem
    }
}

.image-copy .circle {
    display: none;
}

@media screen and (min-width: 768px) {

    .image-copy .circle {
        display: block;
        width: 15rem;
        height: 15rem;
        border-radius: 50%;
        position: absolute;
        opacity: 10%;
        left: 60%;
        top: 34rem;
        margin-bottom: -2rem
    }
}

@media screen and (min-width: 1280px) {

    .image-copy .circle {
        left: 75%;
        top: 75%
    }
}

.image-copy-list {
    height: auto;
    display: flex !important; /*important used to override other display properties such as on the .yellow class as needs to flex to a 2 column list*/
    height: auto;
    flex-grow: 0;
    width: 100%;
    column-gap: 4.688rem;
    row-gap: 0.938rem;
    flex-flow: column;
}

@media screen and (min-width: 1280px) {

    .image-copy-list {
        flex-flow: column wrap;
        max-height: calc(100% - 30rem)
    }
}

.image-copy-list li {
    width: 100%;
}

@media screen and (min-width: 1280px) {

    .image-copy-list li {
        width: 23.625rem
    }
}

.left-circle {
    border-radius: 50%;
    margin-right: auto;
    margin-left: auto;
    margin-top: 1.75rem;
    position: relative;
    left: 0rem;
    top: 0rem;
    width: 100%;
    height: 13.938rem;
    width: 13.938rem;
}

@media screen and (min-width: 380px) {

    .left-circle {
        height: 20.938rem;
        width: 20.938rem
    }
}

@media screen and (min-width: 768px) {

    .left-circle {
        left: 0rem;
        top: -4rem;
        width: 44.5rem;
        height: 44.5rem
    }
}

@media screen and (min-width: 1280px) {

    .left-circle {
        position: absolute;
        width: 39rem;
        height: 39rem;
        left: 5%;
        top: 0rem
    }
}

.image-copy .angled {
    display: none;
}

@media screen and (min-width: 768px) {

    .image-copy .angled {
        display: block;
        position: absolute;
        height: 53.75rem;
        width: 86.875rem;
        transform-origin: center;
        transform: translateX(0%) translateY(0%) rotate(45deg);
        left: -27rem;
        top: -40rem;
        opacity: 10%
    }
}

@media screen and (min-width: 1280px) {

    .image-copy .angled {
        left: -25rem;
        top: 25.75rem
    }
}

.left-image {
    position: relative;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 13.125rem;
    clip-path: var(--right-image-copy-mobile-angle);
}

@media screen and (min-width: 380px) {

    .left-image {
        height: 18.125rem
    }
}

@media screen and (min-width: 768px) {

    .left-image {
        top: -5rem;
        left: -5rem;
        height: 45.625rem;
        clip-path: polygon(0 0, 95% 0, 88% 99%, 0 90%)
    }
}

@media screen and (min-width: 1280px) {

    .left-image {
        position: absolute;
        left: 0px;
        top: 0px;
        width: 50%;
        height: 43.75rem;
        clip-path: polygon(0 0, 95% 0, 88% 99%, 0 90%)
    }
}

.left-full {
    top: 0px;
    left: 0px;
    width: 100%;
    clip-path: var(--left-image-copy-mobile-angle);
}

@media screen and (min-width: 768px) {

    .left-full {
        position: relative;
        width: cal(120% + 10rem);
        top: -5rem
    }
}

@media screen and (min-width: 1280px) {

    .left-full {
        top: 0px;
        left: 0px;
        width: 50%;
        height: 100%;
        position: absolute;
        clip-path: polygon(0 0, 98% 0, 88% 100%, 0 100%)
    }
}

.right-image {
    position: relative;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 13.125rem;
    clip-path: var(--left-image-copy-mobile-angle);
}

@media screen and (min-width: 380px) {

    .right-image {
        height: 18.125rem
    }
}

@media screen and (min-width: 768px) {

    .right-image {
        top: -5rem;
        right: -5rem;
        height: 45.938rem;
        clip-path: polygon(8% 0, 100% 0, 100% 85%, 18% 92%)
    }
}

@media screen and (min-width: 1280px) {

    .right-image {
        position: absolute;
        right: 0px;
        top: 0px;
        width: 50%;
        height: 43.75rem;
        clip-path: polygon(8% 0, 100% 0, 100% 85%, 18% 92%)
    }
}

.right-bullet-image,
.right-bottom-down {
    position: relative;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 13.125rem;
    clip-path: var(--left-image-copy-mobile-angle);
}

@media screen and (min-width: 380px) {

    .right-bullet-image,
    .right-bottom-down {
        height: 18.125rem
    }
}

@media screen and (min-width: 768px) {

    .right-bullet-image,
    .right-bottom-down {
        top: -5rem;
        right: -5rem;
        height: 45.625rem;
        clip-path: polygon(0 0, 100% 0, 100% 92%, 8% 98%)
    }
}

@media screen and (min-width: 1280px) {

    .right-bullet-image,
    .right-bottom-down {
        position: absolute;
        right: 0px;
        top: 0px;
        width: 40%;
        height: 42.625rem;
        clip-path: polygon(0 0, 100% 0, 100% 92%, 10% 98%)
    }
}

.right-bottom-up {
    position: relative;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 13.125rem;
    clip-path: var(--right-image-copy-mobile-angle);
}

@media screen and (min-width: 380px) {

    .right-bottom-up {
        height: 18.125rem
    }
}

@media screen and (min-width: 768px) {

    .right-bottom-up {
        top: -5rem;
        right: -10rem;
        width: 46.875rem;
        height: 45.625rem;
        clip-path: polygon(15% 0, 100% 0, 100% 100%, 5% 90%)
    }
}

@media screen and (min-width: 1280px) {

    .right-bottom-up {
        position: absolute;
        right: 0px;
        top: 0px;
        width: 30%;
        height: 42.625rem;
        clip-path: polygon(15% 0, 100% 0, 100% 100%, 5% 90%)
    }
}

.image-copy__container {
    container-type: inline-size;
    min-height: 16rem;
    position: relative;
    width: 100%;
}

.image-copy__cta {
    height: auto;
    padding-top: 2.5rem;
}

@media (max-width: 375px) {

    .image-copy__cta button {
        width: 100%
    }
}

.image-copy__header {
    --font-size: 2rem;
    width: 100%;
    padding-bottom: 0.75rem;
}

@media (min-width: 640px) {
    .image-copy__header {
        --font-size: 2.125rem;
    }
}

@media screen and (min-width: 1280px) {
    .image-copy__header {
        --font-size: 2.25rem;
    }
}

.image-copy-default__container {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.image-copy-default__content {
    display: flex;
    flex-direction: column;
    width: 100%;
}

@media screen and (min-width: 1024px) {
    @media screen and (min-width: 1024px) {
        .image-copy-default__content__left {
            flex-direction: row
        }
    }

    @media screen and (min-width: 1024px) {

        .image-copy-default__content__right {
            flex-direction: row-reverse
        }
    }
}

.image-copy-default__image__container {
    display: flex;
    height: 17.5rem;
    overflow: hidden;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-default__image__container {
        height: auto;
        width: 50%
    }
}

.image-copy-default__image {
    align-self: stretch;
    object-fit: cover;
    position: absolute;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-default__image {
        flex: 1 1 0;
        height: 100%
    }
}

.image-copy-default__text__left {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    height: fit-content;
    justify-content: flex-start;
    padding: 2.25rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .image-copy-default__text__left {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-default__text__left {
        padding: 5rem 3rem 5rem 2.5rem;
        width: 50%
    }
}

.image-copy-default__text__right {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-start;
    padding: 2.25rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .image-copy-default__text__right {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-default__text__right {
        padding: 5rem 2.5rem 5rem 3rem;
        width: 50%
    }
}

.image-copy-narrow__container {
    height: 100%;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.image-copy-narrow__content {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__content {
        justify-content: space-between;
        position: relative
    }

    @media screen and (min-width: 1024px) {

        .image-copy-narrow__content__left {
            flex-direction: row
        }
    }

    @media screen and (min-width: 1024px) {

        .image-copy-narrow__content__right {
            flex-direction: row-reverse
        }
    }
}

.image-copy-narrow__image__container {
    display: flex;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__image__container {
        width: 35%
    }
}

.image-copy-narrow__image {
    align-self: stretch;
    height: 17.5rem;
    object-fit: cover;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__image {
        flex: 1 1 0;
        height: 100%;
        width: 35%
    }
}

.image-copy-narrow__text__left {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-start;
    padding: 2.25rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .image-copy-narrow__text__left {
        padding: 5rem 2.5rem 5rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__text__left {
        padding: 5rem 3rem 5rem 2.5rem;
        width: 65%
    }
}

@media screen and (min-width: 1280px) {

    .image-copy-narrow__text__left {
        padding: 5rem 3rem 5rem 2.5rem
    }
}

@media screen and (min-width: 1440px) {

    .image-copy-narrow__text__left {
        padding: 5rem 3rem 5rem 4.25rem
    }
}

.image-copy-narrow__text__right {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    justify-content: flex-start;
    padding: 2.25rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .image-copy-narrow__text__right {
        padding: 5rem 2.5rem 5rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__text__right {
        padding: 5rem 2.5rem 5rem 3rem;
        width: 65%
    }
}

@media screen and (min-width: 1280px) {

    .image-copy-narrow__text__right {
        padding: 5rem 2.5rem 5rem 3rem
    }
}

@media screen and (min-width: 1440px) {

    .image-copy-narrow__text__right {
        padding: 5rem 4.25rem 5rem 3rem
    }
}

.image-copy-narrow {
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-between;
    min-height: 100vw;
    overflow: hidden;
}

.image-copy-narrow-column {
    display: flex;
    flex-direction: column;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow-column {
        gap: 1rem;
        flex-direction: row
    }
}

.image-copy-narrow-column div {
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow-column div {
        width: 50%
    }
}

.image-copy-narrow-column ul {
    margin-left: 0;
    padding-left: 0;
}

@media screen and (min-width: 1024px) {

    .narrow-list__mobile {
        display: none
    }
}

.narrow-list ul {
    margin-left: 0.625rem;
    padding-bottom: 2.5rem;
    padding-top: 2.5rem;
    row-gap: 0.25rem;
}

@media screen and (min-width: 1024px) {

    .narrow-list ul {
        padding-top: 2rem
    }
}

.narrow-list ul li p {
    word-break: break-word;
}

.image-copy-narrow__list {
    display: none;
    padding-left: 0.5rem;
}

@media screen and (min-width: 380px) {

    .image-copy-narrow__list {
        column-gap: 2.5rem;
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }
}

@media screen and (min-width: 1024px) {

    .image-copy-narrow__list {
        display: none
    }
}

.narrow-list_large {
    display: none;
    padding-left: 0.5rem;
}

@media screen and (min-width: 1024px) {

    .narrow-list_large {
        display: grid;
        column-gap: 2.5rem;
        grid-template-columns: calc(50% - 1.25rem) calc(50% - 1.25rem)
    }
}

.narrow-list_large li {
    padding-right: 0 !important;
}

.narrow-list_large p {
    word-break: break-word;
}

.blog-loadmore-fade {
    -webkit-mask-image: linear-gradient(to bottom, #ffffff, #ffffff, #ffffff, transparent);
}

.calendar {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 1rem;
}

@media screen and (min-width: 640px) {

    .calendar {
        width: 24rem
    }
}

.calendar input {
    z-index: 10;
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 5rem;
    border: 2px solid rgb(var(--mid-grey-tint));
    cursor: pointer;
    padding: 0 1.25rem;
}

@media screen and (min-width: 768px) {

    .calendar input {
        padding: 0 1.875rem
    }
}

.calendar input:hover {
    border-color: rgb(var(--aldermore-yellow));
}

.calendar input:focus {
    border-color: rgb(var(--transparent));
    outline: 2px solid rgb(var(--teal));
    outline-offset: -2px;
}

.calendar span {
    position: absolute;
    top: 0;
    z-index: 20;
    display: block;
    width: 0.5rem;
    height: 5rem;
    border-left-width: 0.5rem;
    cursor: pointer;
    border-color: rgb(var(--form-red));
}

.calendar:hover span {
    display: none;
}

.calendar input:not(:disabled):focus {
    outline: 2px solid rgb(var(--teal));
}

.calendar--error input {
    border-color: rgb(var(--form-red));
}

.calendar input:disabled:hover {
    cursor: not-allowed;
    border-color: rgb(var(--mid-grey-tint));
}

#calendar.form-control__input-textfield {
    padding-right: 1rem;
}

.textfield {
    position: relative;
    width: 100%;
    height: auto;
}

@media screen and (min-width: 640px) {

    .textfield {
        width: 24rem
    }
}

.textfield input {
    width: 100%;
    height: 5rem;
    border: 2px solid rgb(var(--mid-grey-tint));
    cursor: pointer;
    padding: 0 1.25rem;
}

@media screen and (min-width: 768px) {

    .textfield input {
        padding: 0 1.875rem
    }
}

.textfield input:hover {
    border-color: rgb(var(--aldermore-yellow));
}

.textfield input:focus {
    border-color: rgb(var(--transparent));
    outline: 2px solid rgb(var(--teal));
    outline-offset: -2px;
}

.textfield input:disabled {
    cursor: not-allowed;
}

.textfield input:not(:disabled):focus {
    outline: 2px solid rgb(var(--teal));
}

.textfield--error input {
    border-color: rgb(var(--form-red));
}

.textfield input:disabled:hover {
    cursor: not-allowed;
    border-color: rgb(var(--mid-grey-tint));
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    --font-size: var(--font-p-subtitle);
    appearance: none;
    background-color: rgb(var(--form-grey));
    font-family: var(--font-body-copy);
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    padding: 1rem 2.125rem 1rem 1rem;
    cursor: inherit;
    text-overflow: ellipsis;
}

.select {
    display: grid;
    cursor: pointer;
    align-items: center;
    background-color: rgb(var(--form-grey));
    max-width: 17.875rem;
    max-height: 2.875rem;
}

.select--error select {
    border-color: rgb(var(--form-red));
}

.select select,
.select::before {
    grid-area: select;
}

.select:before {
    content: '';
    justify-self: end;
    background-image: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" width="8" height="5" viewBox="0 0 8 5" fill="%231e2019"><path d="M4 4.93333L0 0.933333L0.933333 0L4 3.06667L7.06667 0L8 0.933333L4 4.93333Z" fill="%231e2019"/></svg>');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 0.5rem;
    height: 0.3rem;
    margin-right: 1rem;
    pointer-events: none;
    z-index: 25;
}

.select--disabled:before {
    content: '';
    justify-self: end;
    background-image: url('data:image/svg+xml; utf8, <svg xmlns="http://www.w3.org/2000/svg" width="8" height="5" viewBox="0 0 8 5" fill="%231e2019"><path d="M4 4.93333L0 0.933333L0.933333 0L4 3.06667L7.06667 0L8 0.933333L4 4.93333Z" fill="%231e2019"/></svg>');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 0.5rem;
    height: 0.3rem;
    margin-right: 1rem;
}

.select--disabled {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 0.40;
}

.select:focus {
    outline: none;
}

.savings-block {
    display: flex;
    flex-direction: column-reverse;
    overflow: hidden;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .savings-block {
        flex-direction: row
    }
}

.savings-block__header {
    padding-bottom: 0.75rem;
}

.savings-block__p {
    padding-bottom: 2.5rem;
}

.savings-block__text-container {
    padding: 2.25rem 1.25rem 2.25rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .savings-block__text-container {
        padding: 4.25rem 2.5rem 4.25rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .savings-block__text-container {
        padding: 5rem 2.5rem 5rem 3rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .savings-block__text-container {
        padding: 7.5rem 4.25rem 7.5rem 3rem
    }
}

.savings-block__flex-button-block {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@media screen and (min-width: 1280px) {

    .savings-block__flex-button-block {
        width: 40%
    }
}

.savings-block__fscs {
    height: fit-content;
    margin-top: 2.5rem;
    width: fit-content;
    --size: 5rem;
}

    .savings-block__fscs a {
        height: fit-content;
        width: fit-content;
    }

    .savings-block__fscs svg {
        height: var(--size);
        width: var(--size);
    }

.savings-block__image-container {
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .savings-block__image-container {
        display: flex;
        height: unset;
        width: 50%
    }
}

.savings-block__image-container img {
    object-fit: cover;
    height: 17.5rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .savings-block__image-container img {
        height: 100%
    }
}

.masthead-homepage-container {
    container-type: inline-size;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-homepage-container {
        height: 38.5rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-homepage-container {
        height: 32.5rem
    }
}

.masthead-homepage-content {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-homepage-content {
        flex-direction: row-reverse
    }
}

.masthead-homepage-content .masthead-homepage-content__image {
    height: 17.5rem;
    object-fit: cover;
    width: 100%;
}

@media (min-width: 1024px) {

    .masthead-homepage-content .masthead-homepage-content__image {
        height: 100%;
        width: 40%
    }
}

.masthead_homepage__text {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 3rem 2rem;
    position: relative;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .masthead_homepage__text {
        padding: 3rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead_homepage__text {
        padding: 5rem 7.5rem 5rem 7.5rem;
        width: 60%
    }
}

.masthead_homepage__heading {
    margin-bottom: 1rem;
}

.masthead-container {
    background-color: rgb(var(--pale-grey-tint));
}

    .masthead-container.white_bg {
        background-color: rgb(var(--white));
    }

.masthead-and-blackbox-container {
    position: relative;
}

@media screen and (min-width: 1024px) {

    .masthead-small {
        height: 20.625rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-medium {
        height: 28.75rem
    }
}

.masthead-black-box {
    background-color: rgb(var(--black));
    border-bottom: 0.25rem solid rgb(var(--primary-colour));
    color: rgb(var(--white));
    display: flex;
    flex-direction: column;
    padding: 1.88rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-black-box {
        width: 19.75rem
    }
}

.masthead-black-box__li {
    align-items: center;
    display: flex;
    padding-top: 1rem;
}

    .masthead-black-box__li:first-child {
        padding-top: 0;
    }

    .masthead-black-box__li svg {
        display: inline;
        flex-shrink: 0;
        height: 1rem;
        width: 1rem;
    }

.masthead-content {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-content {
        flex-direction: row-reverse
    }
}

.masthead-image {
    height: 17.5rem;
    object-fit: cover;
    width: 100%;
}

@media (min-width: 1024px) {

    .masthead-image {
        height: 100%;
        width: 40%
    }
}

.masthead-container {
    height: 100%;
    position: relative;
    width: 100%;
}

.masthead-blackbox {
    position: inherit;
}

@media screen and (min-width: 1024px) {

    .masthead-blackbox {
        bottom: 0;
        position: absolute;
        right: 3rem
    }
}

.masthead-text-container {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    max-width: 100%;
    overflow: hidden;
    padding: 3rem 2rem;
    position: relative;
}

@media screen and (min-width: 640px) {

    .masthead-text-container {
        padding: 3rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-text-container {
        max-width: 60%;
        padding: 3rem;
        padding-right: 7.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-text-container.title-and-image {
        padding: 3rem;
        padding-right: 7.5rem
    }
}

.masthead-title-header {
    --font-size: 1.875rem;
}

@media screen and (min-width: 640px) {

    .masthead-title-header {
        --font-size: 2.5rem
    }
}

@media screen and (min-width: 768px) {

    .masthead-title-header {
        --font-size: 3rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-title-header {
        --font-size: 2.25rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-title-header {
        --font-size: 3rem
    }
}

.masthead__header {
    margin-bottom: 1rem;
}

.masthead__header_logo {
    width: calc(100% - 5rem)
}

/* mast head title only */

.masthead-type-only-container {
    align-items: flex-start;
    border-bottom: 0.25rem solid rgb(var(--primary-colour));
    color: rgb(var(--black));
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 2.5rem 1.25rem;
}

@media screen and (min-width: 376px) {

    .masthead-type-only-container {
        padding-left: 2.5rem;
        padding-right: 2.5rem
    }
}

@media screen and (min-width: 768px) {

    .masthead-type-only-container {
        padding-left: 3rem;
        padding-right: 3rem
    }
}

.masthead-type-only-container .backlink {
    margin-bottom: 1.5rem;
    margin-top: 0;
}

.masthead-type-only-container-onlyTitle {
    padding: 4rem 2rem;
}

@media screen and (min-width: 376px) {

    .masthead-type-only-container-onlyTitle {
        padding: 5rem 2.5rem
    }
}

@media screen and (min-width: 768px) {

    .masthead-type-only-container-onlyTitle {
        padding: 5rem 3rem
    }
}

.masthead-type-only__subheader {
    margin-top: 0.75rem;
}

.masthead-type-only__metrics-container {
    align-items: center;
    display: flex;
    margin-right: 1rem;
}

@media (min-width: 768px) {

    .masthead-type-only__metrics-container {
        margin-right: 0px
    }
}

.masthead-type-only__metrics-labels {
    background: rgb(var(--grey-light));
    border: 0.0625rem solid rgba(var(--black), 0.1);
    padding: 1rem 0.75rem;
}

.masthead-type-only__metrics-first-word {
    font-weight: bold;
}

.masthead-type-only__metrics-bullet {
    margin: 0rem 0.3rem;
}

/* masthead - black box */

.masthead-black-box__header {
    padding-bottom: 0.75rem;
}

.masthead-black-box__cta {
    display: flex;
    justify-content: center;
}

@media screen and (min-width: 640px) {

    .masthead-black-box__cta {
        justify-content: flex-start
    }
}

@media screen and (min-width: 1024px) {

    .masthead-black-box__cta {
        justify-content: center
    }
}

.masthead-black-box__cta a, .masthead-black-box__cta button {
    width: 100%;
    min-width: 100%;
}

@media screen and (min-width: 640px) {

    .masthead-black-box__cta a, .masthead-black-box__cta button {
        width: 30%;
        min-width: 30%
    }
}

@media screen and (min-width: 1024px) {

    .masthead-black-box__cta a, .masthead-black-box__cta button {
        width: 100%;
        min-width: 100%
    }
}

.masthead-black-box-cta-margin {
    margin-bottom: 0.75rem;
}

.masthead-black-box__link-title {
    --font-size: 1rem;
    margin-left: 0.25rem;
}

.masthead-black-box__link-a {
    --font-family: var(--font-body-copy);
}

.masthead-black-box__hr {
    margin: 1rem 0;
    border-top-width: 1px;
    border-color: rgba(var(--white), 0.5);
}

.masthead-black-box__secondary-title {
    padding-bottom: 0.25rem;
}

.masthead-black-box__p {
    --font-size: 0.875rem;
}

.masthead-group-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    min-height: 17rem;
    position: relative;
    width: 100%;
}

.masthead-group-background-pattern {
    height: 100%;
    left: 0;
    object-fit: none;
    position: absolute;
    top: 0;
    width: 100%;
}

.masthead-group-content {
    background: linear-gradient(180deg, rgba(var(--group-colour), 1), rgba(var(--group-colour), 0));
    padding: 3rem 1.25rem;
    position: relative;
    text-align: center;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .masthead-group-content {
        padding: 4rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-group-content {
        padding: 4rem 8.75rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-group-content {
        padding: 4rem 16.75rem
    }
}

@media screen and (min-width: 1440px) {

    .masthead-group-content {
        padding: 4rem 21.75rem
    }
}

.masthead-group-content-noCopy {
    padding: 8.75rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .masthead-group-content-noCopy {
        padding: 7rem 2.5rem
    }
}

@media screen and (min-width: 768px) {

    .masthead-group-content-noCopy {
        padding: 7rem 4.5rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead-group-content-noCopy {
        padding: 7rem 12.5rem
    }
}

@media screen and (min-width: 1280px) {

    .masthead-group-content-noCopy {
        padding: 7rem 20.5rem
    }
}

@media screen and (min-width: 1440px) {

    .masthead-group-content-noCopy {
        padding: 7rem 25.5rem
    }
}

.masthead_group__heading {
    --font-size: 2.625rem;
    font-family: var(--font-body-copy);
}

@media screen and (min-width: 640px) {

    .masthead_group__heading {
        --font-size: 2.875rem
    }
}

@media screen and (min-width: 1024px) {

    .masthead_group__heading {
        --font-size: 3rem
    }
}

.masthead_group__description {
    margin-top: 0.75rem;
}

.masthead-group-content__image {
    height: 17.5rem;
    margin-bottom: 3rem;
    object-fit: cover;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .masthead-group-content__image {
        margin-bottom: 4rem;
        width: 43.5rem
    }
}

.faq-common-request__header {
    margin-bottom: 0.75rem;
}

@media screen and (min-width: 768px) {

    .faq-common-request__header {
        margin-bottom: 1.25rem
    }
}

.faq-item {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 1px;
    padding: 1.25rem 0;
    text-align: left;
}

    .faq-item:focus-visible {
        outline-offset: -2px;
    }

@media screen and (min-width: 768px) {

    .faq-item {
        padding: 2rem 0
    }
}

.common-requests {
    padding: 2.25rem 1.25rem;
    text-align: left;
}

.common-requests__grid {
    display: grid;
    --columns: 1;
    grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
}

@media screen and (min-width: 640px) {

    .common-requests__grid {
        --columns: 2
    }
}

@media screen and (min-width: 768px) {

    .common-requests__grid {
        --columns: 3
    }
}

@media screen and (min-width: 1024px) {

    .common-requests__grid {
        --columns: 4
    }
}

.requests-cta {
    padding: 0.625rem 0;
}

    .requests-cta:focus {
        outline: none;
    }

@media screen and (min-width: 768px) {

    .requests-cta {
        padding-bottom: 1rem
    }
}

.process-block {
    background-color: rgb(var(--white));
}

.process-block__content-container {
    display: flex;
    flex-direction: column;
    padding: 2.5rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .process-block__content-container {
        padding: 4 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .process-block__content-container {
        padding: 5rem 5rem
    }
}

@media screen and (min-width: 1280px) {

    .process-block__content-container {
        padding: 5rem 7.5rem
    }
}

.process-block_header {
    margin-bottom: 1.75rem;
}

@media screen and (min-width: 640px) {

    .process-block_header {
        width: 100%
    }
}

.process-block__step-item__container {
    display: flex;
    background-color: rgb(var(--grey-light));
    flex-direction: column;
    list-style-type: none;
    margin-bottom: 2.5rem;
}

@media screen and (min-width: 640px) {

    .process-block__step-item__container {
        flex-direction: row;
        flex-shrink: 0;
        margin-bottom: 3rem;
        width: fit-content
    }
}

.process-step {
    align-items: center;
    border-bottom: 1px solid rgb(var(--black));
    cursor: pointer;
    display: flex;
    padding: 1.25rem 1.5rem;
}

@media screen and (min-width: 640px) {

    .process-step {
        border-left: 1px solid transparent;
        padding: 0
    }
}

.process-step.selected {
    border-bottom: 4px solid rgb(var(--primary-colour));
    background-color: rgb(var(--white));
}

@media screen and (min-width: 640px) {

    .process-step.selected {
        --font-family: var(--font-body-copy-bold);
        z-index: 10
    }
}

.process-step.selected h5 {
    font-weight: bold;
}

.process-step.selected h3 {
    font-weight: bold;
}

.process-step.selected p {
    font-weight: bold;
}

.process-step.selected hr {
    display: none;
}

.process-block__step-item__container-button {
    display: flex;
    flex-direction: row;
    height: 100%;
    text-align: left;
    /* text-decoration: dotted; */
    flex: 1;
}

@media screen and (min-width: 640px) {

    .process-block__step-item__container-button {
        flex-direction: column;
        gap: 1rem;
        min-width: 8.75rem;
        padding: 1.25rem 1.5rem
    }
}

@media screen and (min-width: 1280px) {

    .process-block__step-item__container-button {
        flex-direction: row
    }
}

.process-block__step-item__container-icon {
    align-items: center;
    display: flex;
    border-color: rgb(var(--black));
    border-radius: 50%;
    border-width: 2px;
    flex-shrink: 0;
    height: 2rem;
    justify-content: center;
    margin-right: 1rem;
    width: 2rem;
}

@media screen and (min-width: 640px) {

    .process-block__step-item__container-icon {
        margin-bottom: 0;
        margin-right: 0
    }
}

.selected .process-block__step-item__container-icon {
    background-color: rgb(var(--primary-colour));
    color: rgb(var(--white));
}

.selected .process-block__step-item__container-icon {
    border-width: 0;
}

.process-block__step-item__layout {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

    .process-block__step-item__layout h4 {
        display: block;
    }

@media screen and (min-width: 640px) {

    .process-block__step-item__layout h4 {
        display: none
    }
}

.process-block__step-item__layout p {
    display: block;
}

@media screen and (min-width: 640px) {

    .process-block__step-item__layout p {
        display: block
    }
}

.process-block__step-text__container {
    display: none;
    position: relative;
}

@media screen and (min-width: 640px) {

    .process-block__step-text__container {
        display: flex
    }
}

.process-block__step-content {
    color: rgb(var(--black));
    cursor: default;
    display: none;
    width: 100%;
}

    .process-block__step-content h3 {
        --font-family: var(--font-body-copy);
        --font-size: var(--font-p-default);
        font-weight: normal;
        --line-height: 160%;
    }

    .process-block__step-content.selected {
        display: block;
    }

@media screen and (min-width: 640px) {

    .process-block__step-content.selected {
        display: block
    }
}

.process-block-step-index__title {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-p-default);
    font-weight: normal;
    --line-height: 160%;
    margin-bottom: 0.5rem;
}

@media screen and (min-width: 640px) {

    .process-block-step-index__title {
        display: none
    }
}

.process-block-step__label {
    font-family: var(--font-bold);
    margin-bottom: 1rem;
}

.process-block-step__p {
    margin-top: 0.5rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .process-block-step__p {
        width: 46rem
    }
}

.process-block-step__button-container {
    margin-top: 1.75rem;
}

.process-block-step__button-cta {
    --font-size: 0.875rem;
    align-items: center;
    border-color: rgb(var(--white));
    border-width: 1px;
    color: rgb(var(--white));
    display: inline-flex;
    padding: 1rem;
    text-decoration: none;
}

.process-block-step__title {
    padding-right: 0.75rem;
}

@media (min-width: 640px) {
    .process-block-step__title {
        padding-right: 0rem;
    }
}

.process-step.selected .process-block-step__title {
    font-family: var(--font-body-copy-bold);
    ;
}

.process-step-mobile-content {
    color: rgb(var(--black));
    display: none;
    width: 100%;
}

    .process-step-mobile-content button {
        width: 100%;
    }

@media screen and (min-width: 640px) {

    .process-step-mobile-content button {
        width: unset
    }
}

.process-step-mobile-content.selected {
    background-color: rgb(var(--white));
    display: block;
    padding: 2.5rem 0;
}

@media screen and (min-width: 640px) {

    .process-step-mobile-content.selected {
        display: none
    }
}

.process-step-plus-minus__container {
    align-items: center;
    display: flex;
    margin-left: auto;
}

@media screen and (min-width: 640px) {

    .process-step-plus-minus__container {
        display: none
    }
}

.process-step-plus-minus__container > svg {
    height: 1rem;
    stroke: currentColor;
    stroke-width: 2;
    width: 1rem;
}

.process-minus.show {
    display: block;
}

.process-minus.hide {
    display: none;
}

.process-plus.show {
    display: block;
}

.process-plus.hide {
    display: none;
}

.process_divider__hr {
    border-top: 1px solid rgb(var(--black), 20%);
    display: block;
    margin-bottom: 2rem;
    margin-top: 2rem;
}

@media screen and (min-width: 640px) {

    .process_divider__hr {
        display: none
    }
}

@media screen and (min-width: 640px) {

    .process-block-vertical-divider {
        width: auto;
        height: auto;
        border-color: rgb(var(--black), 20%);
        border-right-width: 1px
    }
}

/* Chrome, Safari, Edge, Opera */

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */

input[type='number'] {
    -moz-appearance: textfield;
}

.suitable-for {
    display: inline-block;
    height: fit-content;
    max-height: 40rem;
    position: relative;
}

.suitable-for__container {
    display: flex;
    flex-direction: column;
}

    .suitable-for__container li {
        margin-bottom: 0.25rem;
    }

.event-listing {
    height: 25.75rem;
    margin: 0;
    padding: 0;
    position: relative;
}

.event-listing-container {
    display: flex;
    flex-direction: column;
    padding: 1.875rem;
}

.product-card-event-list__item {
    align-items: center;
    display: flex;
    padding-bottom: 0.75rem;
}

    .product-card-event-list__item svg {
        flex-shrink: 0;
        height: 1.5rem;
        margin-right: 1rem;
        width: 1.5rem;
    }

    .product-card-event-list__item:last-of-type {
        padding-bottom: 1rem;
    }

.product-card-event-list__item-text {
    display: flex;
    flex-direction: column;
}

a:hover .lead-blog-image img {
    transform: scale(1.1);
}

.lead-blog {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

@media screen and (min-width: 1280px) {

    .lead-blog {
        flex-direction: row;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 64rem
    }
}

@media screen and (min-width: 1440px) {

    .lead-blog {
        width: 72.75rem
    }
}

.lead-blog-image {
    flex: 50%;
}

    .lead-blog-image figure {
        height: 15.5rem;
        overflow: hidden;
        width: 100%;
    }

@media screen and (min-width: 1280px) {

    .lead-blog-image figure {
        height: 100%
    }
}

.lead-blog-image figure img {
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease-in-out;
    transform: scale(1);
    width: 100%;
}

.lead-blog-container {
    display: flex;
    flex-direction: column;
    flex: 1 1 0%;
    flex: 100%;
    padding: var(--padding-top) var(--padding-side);
    --padding-top: 4rem;
    --padding-side: 2rem;
}

@media screen and (min-width: 640px) {

    .lead-blog-container {
        --padding-side: 3.5rem
    }
}

@media screen and (min-width: 768px) {

    .lead-blog-container {
        --padding-side: 5rem
    }
}

@media screen and (min-width: 1280px) {

    .lead-blog-container {
        --padding-side: 3.75rem;
        flex: 50%;
        height: 29.75rem
    }
}

@media screen and (min-width: 1440px) {

    .lead-blog-container {
        --padding-side: 5.625rem
    }
}

.lead-blog-container h2 {
    display: -webkit-box;
    margin-bottom: 1.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    white-space: normal;
}

.lead-blog-container p {
    display: -webkit-box;
    margin-bottom: 3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    white-space: normal;
}

@media screen and (min-width: 640px) {

    .lead-blog-container p {
        -webkit-line-clamp: 3
    }
}

.lead-blog-container .category {
    font-weight: 700;
}

.lead-blog-container :last-child {
    margin-top: auto;
}

.blog-category {
    height: 1.25rem;
    max-width: 5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media screen and (min-width: 380px) {

    .blog-category {
        max-width: 50%
    }
}

.blog-read-time {
    flex-shrink: 0;
}

.blog-date {
    flex-shrink: 0;
}

.blog__p {
    display: -webkit-box;
    margin-bottom: 2rem;
    margin-top: 0.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    white-space: normal;
}

.blog_details {
    padding-bottom: 1.25rem;
}

.lead-blog__a {
    /* important needed here as the z-index it overrides is imported later, so this will never be used otherwise */
    z-index: 1 !important;
}

.listing-blog__container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 2rem;
}

.article-listing-blog {
    position: relative;
    text-align: left;
    width: 100%;
}

/* This breakpoint is required for cope with the fact that the iPhone
  14 is 390px and with the margin-side added to the container at a value
  of 375px there would not be enough room and the card will overflow the container */

@media screen and (min-width: 430px) {

    .article-listing-blog {
        width: 23.4375rem
    }
}

.article-listing-image {
    display: flex;
    width: 100%;
    height: 11.875rem;
}

    .article-listing-image img {
        object-fit: cover;
        width: 100%;
    }

.listing-blog-category {
    height: 1.25rem;
    max-width: 5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.listing-blog-banner__container {
    z-index: 0;
}

.listing-blog-copy__container {
    height: auto;
    width: 100%;
    z-index: 20;
}

.listing-blog {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.listing-blog__no-image {
    height: 22.125rem;
}

.listing-blog__content {
    padding: 1.875rem 1.875rem 0rem 1.875rem;
    height: 17.75rem;
}

.listing-blog__title {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.bdm-card {
    display: flex;
    flex-direction: column;
}

@media screen and (min-width: 640px) {

    .bdm-card {
        flex-direction: row;
        width: 35.125rem
    }
}

@media screen and (min-width: 1024px) {

    .bdm-card {
        width: 46.875rem
    }
}

.bdm-card__image {
    width: 100%;
    flex-grow: 0;
}

@media screen and (min-width: 640px) {

    .bdm-card__image {
        width: 12.5rem
    }
}

.bdm-card__image img {
    object-fit: cover;
    width: 100%;
    height: 14.25rem;
}

@media screen and (min-width: 640px) {

    .bdm-card__image img {
        height: 100%
    }
}

.bdm-card__content {
    flex-grow: 1;
    height: auto;
}

.bdm-card__content__section {
    display: flex;
    flex-direction: column;
    margin: 1.5rem 1.75rem;
}

    .bdm-card__content__section hr {
        border-top: 1px solid currentcolor;
        opacity: 50%;
        margin-bottom: 1.25rem;
        margin-top: 1.25rem;
        width: 3.125rem;
    }

.bdm-card__header_title {
    margin-bottom: 1.25rem;
}

.bdm-card__header_name {
    margin-bottom: 0.25rem;
}

.bdm-card__telephone {
    margin-bottom: 0.25rem;
}

.bdm-card__a-email {
    text-decoration: underline;
}

.nav-footer-container__full {
    /* flex flex-col w-full text-white */
    color: rgb(var(--black));
    display: flex;
    flex-direction: column;
    width: 100%;
}

.nav-footer-top__container__full {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
}

@media (min-width: 1024px) {
    .nav-footer-top__container__full {
        flex-direction: row;
    }
}

.nav-footer-top-left__container {
    /* md:p-desktop p-mobile lg:px-20 md:px-14 */
    background-color: rgb(var(--secondary-colour-pressed));
    color: rgb(var(--white));
    flex-direction: column;
    padding-bottom: 2.5rem;
    padding-top: 2.5rem;
    text-align: center;
    width: 100%;
}

.nav-footer__contact-us-container__full {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nav-footer__contact-us-container__cta button {
    width: 19.625rem;
}

@media (min-width: 376px) {
    .nav-footer__contact-us-container__cta button {
        width: 11.5rem;
    }
}

.nav-footer__social-container__full {
    display: flex;
    margin-top: 0.625rem;
    width: 100%;
}

@media (min-width: 768px) {
    .nav-footer__social-container__full {
        margin-top: 1.25rem;
    }
}

.nav-footer-top-right__container {
    align-items: center;
    background-color: rgb(var(--secondary-colour-hover));
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 3rem;
    padding-bottom: 3rem;
    width: 100%;
}

@media (min-width: 640px) {
    .nav-footer-top-right__container {
        padding-top: 3.875rem;
        padding-bottom: 3.875rem;
    }
}

.nav-footer-bottom__container__full {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 3.5rem;
    padding-top: 3.5rem;
    width: 100%;
}

.nav-footer__menu-item__link {
    padding-bottom: 1.5rem;
}

    .nav-footer__menu-item__link a {
        font-weight: 400;
    }

/* one column */

.nav-footer-bottom__container__menu-one-column {
    flex-direction: column;
    width: 100%;
}

@media (min-width: 768px) {
    .nav-footer-bottom__container__menu-one-column {
        display: none;
    }
}

/* two columns */

.nav-footer-bottom__container__menu-two-column {
    display: none;
}

@media (min-width: 768px) {
    .nav-footer-bottom__container__menu-two-column {
        display: inline-flex;
        flex-direction: column;
        justify-content: flex-start;
        width: 49%;
    }

    #column1 {
        order: 1;
    }

    #column2 {
        order: 3;
    }

    #column3 {
        order: 2;
    }
}

@media (min-width: 1024px) {
    .nav-footer-bottom__container__menu-two-column {
        display: none;
    }
}

/* three columns */

.nav-footer-bottom__container__menu-three-column {
    display: none;
}

@media (min-width: 1024px) {
    .nav-footer-bottom__container__menu-three-column {
        display: inline-flex;
        flex-direction: column;
        justify-content: flex-start;
        width: 33%;
    }
}

.nav-footer-disclaimer__container {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
    width: 100%;
}

.nav-footer__menu-title__span {
    border-color: rgb(var(--black));
    font-family: var(--font-body-copy);
    font-weight: bold;
    --font-size: 1.125rem;
}

.nav-footer__menu-item__link-container {
    height: auto;
    padding-bottom: 1.75rem;
    width: 100%;
}

.nav-footer__p {
    --line-height: 160%;
    margin-bottom: 1.6875rem;
    width: 19.4375rem;
}

@media (min-width: 640px) {
    .nav-footer__p {
        width: 28.875rem;
    }
}

.nav-footer__p_disclaimer {
    --font-size: 0.75rem;
    --line-height: 160%;
    letter-spacing: -0.24px;
}

.nav-footer__icon-bar__container {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

    .nav-footer__icon-bar__container > a:not(:first-child) {
        padding-top: 1.75rem;
    }

@media (min-width: 640px) {
    .nav-footer__icon-bar__container {
        flex-wrap: nowrap;
        flex-direction: row;
        justify-content: space-evenly;
    }
}

@media (min-width: 640px) {
    .nav-footer__icon-bar__container > a:not(:first-child) {
        padding-left: 2.25rem;
        padding-top: 0rem;
    }
}

@media (min-width: 768px) {
    .nav-footer__icon-bar__container {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
}

.nav-footer__icon-bar__bottom {
    border-color: rgba(var(--white), 0.2);
    border-top-width: 0.0625rem;
    margin-top: 0rem;
}

.product-card-clamp {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
}

.product-card-suitable__span {
    font-family: var(--font-book);
}

.product-card-mortgage__header {
    --font-size: 1.75rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    width: 100%;
}

@media (min-width: 640px) {
    .product-card-mortgage__header {
        --font-size: 3rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 110%;
    }
}

@media (min-width: 640px) {
    .product-card-mortgage__row-title {
        --font-size: 3rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 110%;
    }
}

@media (min-width: 640px) {
    .product-card-mortgage__bullets-header {
        --font-size: 1.5rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
    }
}

.product-card-mortgage__p {
    --font-size: 0.75rem;
    overflow-wrap: break-word;
}

@media screen and (min-width: 1024px) {

    .product-card-mortgage__p {
        --font-size: 0.875rem;
        margin-top: 1.25rem
    }
}

.product-card-mortgage__p-tooltip {
    display: flex;
    justify-content: flex-end;
}

.product-card-mortgage__endtext {
    width: 100%;
    height: auto;
    padding: 1.25rem;
    padding-right: 0.5rem;
    margin-top: 0;
    margin-bottom: 7rem;
    z-index: 1;
}

@media screen and (min-width: 640px) {

    .product-card-mortgage__endtext {
        padding-left: 3.5rem;
        padding-right: 3.5rem
    }
}

@media screen and (min-width: 1024px) {

    .product-card-mortgage__endtext {
        padding: 2.5rem;
        width: 60%;
        margin-bottom: -0.5rem
    }
}

.product-card-mortgage__rate-header {
    width: auto;
}

@media (min-width: 640px) {
    .product-card-mortgage__rate-header {
        --font-size: 1.5rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
    }
}

.product-card-mortgage__rate-value__label {
    display: block;
    font-family: var(--font-heavy);
    --font-size: 1.875rem;
    margin-top: 0rem;
    position: relative;
    width: auto;
}

@media screen and (min-width: 640px) {

    .product-card-mortgage__rate-value__label {
        --font-size: 4rem;
        top: 0.25rem
    }
}

.product-card-mortgage__rate-percent__label {
    font-family: var(--font-heavy);
    --font-size: var(--font-span-large-default);
}

@media screen and (min-width: 640px) {

    .product-card-mortgage__rate-percent__label {
        --font-size: 2.25rem
    }
}

.product-card-mortgage__rate-caption {
    display: block;
    font-family: var(--font-book);
    --font-size: var(--font-span-small-default);
    position: relative;
    top: -0.25rem;
    width: auto;
}

@media screen and (min-width: 640px) {

    .product-card-mortgage__rate-caption {
        --font-size: var(--font-span-default)
    }
}

.product-card-mortage-suitable__li {
    margin-bottom: 0.5rem;
    overflow-wrap: break-word;
}

@media screen and (min-width: 640px) {

    .product-card-mortage-suitable__li {
        margin-left: 0.5rem
    }
}

.product-card-mortage-suitable__li:first-child {
    margin-top: 0rem;
}

.product-card-savings-product {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.product-card-savings__header {
    --font-size: var(--font-h4-default);
}

@media (min-width: 640px) {

    .product-card-savings__header {
        --font-size: var(--font-h4-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__header {
        --font-size: var(--font-h4-large)
    }
}

.product-card-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 2.5rem 1.25rem;
    width: 100%;
    z-index: 1;
}

@media screen and (min-width: 640px) {

    .product-card-container {
        padding: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .product-card-container {
        padding: 2.5rem 3rem
    }
}

.product-card-container .savings-header {
    display: flex;
    flex-direction: column;
    height: auto;
    padding-bottom: 1rem;
    width: 100%;
}

.product-card-container .content {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    height: auto;
}

@media screen and (min-width: 1280px) {

    .product-card-container .content {
        flex-wrap: nowrap;
        justify-content: center;
        width: 60rem
    }
}

.product-card-container .content .column {
    display: flex;
    flex-wrap: wrap;
}

@media screen and (min-width: 1280px) {

    .product-card-container .content .column {
        justify-content: space-between
    }
}

.product-card-container .content .content-first {
    padding-bottom: 2rem;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .product-card-container .content .content-first {
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .product-card-container .content .content-first {
        padding-bottom: 0rem;
        width: 40%
    }
}

.product-card-container .content .content-first .aertext {
    height: auto;
    margin-top: 0.75rem;
    width: 90%;
    z-index: inherit;
}

@media screen and (min-width: 640px) {

    .product-card-container .content .content-first .aertext {
        width: 60%
    }
}

@media screen and (min-width: 768px) {

    .product-card-container .content .content-first .aertext {
        width: 80%
    }
}

.product-card-container .content .content-second {
    padding-bottom: 2rem;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .product-card-container .content .content-second {
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .product-card-container .content .content-second {
        padding-bottom: 0rem;
        width: 30%
    }
}

.product-card-container .content .content-second .terms {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
}

.product-card-container .content .content-third {
    width: 100%;
}

@media screen and (min-width: 768px) {

    .product-card-container .content .content-third {
        width: 60%
    }
}

@media screen and (min-width: 1024px) {

    .product-card-container .content .content-third {
        position: relative
    }
}

@media screen and (min-width: 1280px) {

    .product-card-container .content .content-third {
        width: 30%
    }
}

.product-card-container .content .content-third ul {
    margin-bottom: 2.5rem;
}

@media screen and (min-width: 1024px) {

    .product-card-container .content .content-third ul {
        margin-left: 0
    }
}

.term-column {
    display: flex;
    flex-direction: column;
    width: 100%;
}

@media screen and (max-width: 375px) {

    .term-column button {
        width: 100%
    }
}

.product-card-savings__column__rate-header {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h6-default);
    --line-height: 160%;
    padding-bottom: 0.5rem;
}

@media (min-width: 640px) {

    .product-card-savings__column__rate-header {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__column__rate-header {
        --font-size: var(--font-h6-large)
    }
}

.product-card-savings__column__header {
    --font-family: var(--font-body-copy);
    --font-size: var(--font-h6-default);
    font-weight: 400;
    --line-height: 160%;
    padding-bottom: 0.25rem;
}

@media (min-width: 640px) {

    .product-card-savings__column__header {
        --font-size: var(--font-h6-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__column__header {
        --font-size: var(--font-h6-large)
    }
}

.suitable-if-you {
    font-weight: bold;
}

.product-card-savings__mid-column-top__header {
    --font-size: var(--font-p-large);
    font-size: var(--font-size);
    width: 60%;
}

.product-card-savings__mid-column-bottom__header {
    --font-size: var(--font-p-large);
    font-size: var(--font-size);
    margin-top: 1.25rem;
}

@media (min-width: 1024px) {
    .product-card-savings__mid-column-bottom__header {
        width: 60%;
    }
}

.product-card-savings__p {
    --font-size: var(--font-p-subtitle);
    overflow-wrap: break-word;
}

.product-card-savings__rate-list__container {
    height: auto;
    width: 100%;
}

    .product-card-savings__rate-list__container .rate-list-item {
        align-items: flex-end;
        display: flex;
        flex: 0 1 auto;
        width: auto;
    }

.rate-divider:first-of-type {
    border-color: rgba(var(--black), 0.2);
    border-top-width: 0.0625rem;
    margin: 1.25rem 0rem;
    width: 100%;
}

@media screen and (min-width: 768px) {

    .rate-divider:first-of-type {
        width: 15rem
    }
}

.product-card-savings__rate-value__label {
    align-items: baseline;
    display: inline-flex;
    --font-size: var(--font-h3-default);
    font-weight: bold;
    --line-height: 120%;
    position: relative;
}

@media (min-width: 640px) {

    .product-card-savings__rate-value__label {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__rate-value__label {
        --font-size: var(--font-h3-large)
    }
}

.product-card-savings__rate-type__label {
    font-family: var(--font-body-copy);
    --font-size: var(--font-p-default);
    margin-left: 0.5rem;
    width: 100%;
}

@media screen and (min-width: 380px) {

    .product-card-savings__rate-type__label {
        width: 50%
    }
}

@media screen and (min-width: 1024px) {

    .product-card-savings__rate-type__label {
        width: 33%
    }
}

.product-card-savings__caption {
    --font-size: var(--font-h5-default);
    font-weight: bold;
}

@media (min-width: 640px) {

    .product-card-savings__caption {
        --font-size: var(--font-h5-medium)
    }
}

@media (min-width: 1024px) {

    .product-card-savings__caption {
        --font-size: var(--font-h5-large)
    }
}

.product-card-savings-suitable__li {
    overflow-wrap: break-word;
}

    .product-card-savings-suitable__li:first-child {
        margin-top: 0rem;
    }

.product-card-at-a-glance {
    width: 100%;
    height: 50%;
}

.product-card-at-a-glance__container {
    display: flex;
    flex-direction: column;
    padding: 3rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .product-card-at-a-glance__container {
        padding: 5rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .product-card-at-a-glance__container {
        padding: 5rem 6.9375rem
    }
}

@media screen and (min-width: 1280px) {

    .product-card-at-a-glance__container {
        padding: 5rem 12.1875rem
    }
}

@media screen and (min-width: 1440px) {

    .product-card-at-a-glance__container {
        padding: 5rem 17.1875rem
    }
}

.product-card-at-a-glance__content {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

@media screen and (min-width: 1024px) {

    .product-card-at-a-glance__content {
        flex-direction: row
    }
}

.product-card-at-a-glance__p-content {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    padding: 2rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .product-card-at-a-glance__p-content {
        width: 17.1875rem
    }
}

.product-card-at-a-glance__flex {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.product-card-at-a-glance__ul li {
    margin-bottom: 0.375rem;
}

.product-card-at-a-glance__header {
    padding-bottom: 1.75rem;
}

.product-card-at-a-glance__p-tagline {
    padding-bottom: 0.5rem;
}

.product-card-at-a-glance__p-number {
    padding-bottom: 0.5rem;
}

.product-card-half-height-card {
    display: inline-block;
    height: 19.5rem;
    overflow: hidden;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .product-card-half-height-card {
        width: 39rem
    }
}

.product-card-half-height-card__content {
    height: 19.5rem;
    padding: 1.875rem;
    position: relative;
}

    .product-card-half-height-card__content .header {
        margin-bottom: 0.75rem;
    }

    .product-card-half-height-card__content .copy {
        display: -webkit-box;
        margin-bottom: 4.25rem;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .product-card-half-height-card__content .ctaButton {
        bottom: 1.875rem;
        position: absolute;
    }

.product-card-half-height-alert svg {
    height: 1.5rem;
    width: 1.5rem;
}

.product-card-half-height-alert {
    margin-bottom: 1rem;
}

.half-height-card-alert-content {
    height: 100%;
    padding: 1.875rem;
}

.half-height-card-alert-content__button-row {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
}

    .half-height-card-alert-content__button-row div {
        position: relative;
    }

        .half-height-card-alert-content__button-row div svg {
            height: 2rem;
            width: 2rem;
        }

    .half-height-card-alert-content__button-row .close-hitbox {
        cursor: pointer;
    }

        .half-height-card-alert-content__button-row .close-hitbox svg {
            height: 1.5rem;
            stroke: currentcolor;
            width: 1.5rem;
        }

.half-height-card-alert-content__copy {
    display: flex;
    margin-top: 1rem;
}

.alertContent__p {
    color: rgb(var(--white));
    display: -webkit-box;
    overflow: hidden;
    padding-right: 1.875rem;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 10;
}

.product-card-suitable-for__header {
    margin-bottom: 0.75rem;
    width: 100%;
}

.product-card-suitable-for__sub-header {
    margin-bottom: 0.75rem;
    width: 100%;
}

.product-card-suitable-for__p {
    margin-bottom: 1.5rem;
}

.product-card-suitable-for__ul {
    font-size: var(--font-p-subtitle);
    margin-bottom: 2rem;
}

.product-card-event-list__header {
    margin-bottom: 1rem;
    -webkit-line-clamp: 3;
    width: 100%;
}

.product-card-event-section__title {
    width: 5rem;
}

@media (min-width: 768px) {
    .product-card-event-section__title {
        width: 6rem;
    }
}

.product-card-event-section__caption {
    font-weight: bold;
}

.mp-bg-placement-bl {
    transform-origin: center;
    transform: translateX(-13%) translateY(84%) rotate(41deg);
}

.mp-bg-placement-mobile {
    height: 60%;
    transform-origin: center;
    transform: translateX(-10%) translateY(-15%) rotate(19deg);
}

.mp-bg-placement-mobile-2 {
    height: 55%;
    transform-origin: center;
    transform: translateX(-10%) translateY(-15%) rotate(-19deg);
}

.product-card-background-top-left-down {
    transform-origin: center;
    transform: translateX(-50%) translateY(-75%) rotate(19deg);
}

.product-card-background-top-left-up {
    transform-origin: center;
    transform: translateX(-50%) translateY(-25%) rotate(-14deg);
}

.product-card-background-bottom-left {
    transform-origin: center;
    transform: translateX(-13%) translateY(84%) rotate(41deg);
}

.product-card-background-mobile {
    height: 60%;
    transform-origin: center;
    transform: translateX(-10%) translateY(-15%) rotate(19deg);
}

.product-card-background-mobile-2 {
    height: 55%;
    transform-origin: center;
    transform: translateX(-10%) translateY(-15%) rotate(-19deg);
}

.product-card-absolute-button {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}

.product-card-absolute-background {
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
}

/*css to manage card title for different viewports*/

@media screen and (min-width: 375px) and (max-width: 640px) {
    section.card-title-link__section-wide {
        width: 100%;
    }
}

.product-section-savings__container {
    background-color: rgb(var(--white));
    height: auto;
    overflow: hidden;
    padding: 2.5rem 1.25rem;
    width: 100%;
}

@media (min-width: 640px) {

    .product-section-savings__container {
        padding: 2.5rem
    }
}

@media (min-width: 1024px) {

    .product-section-savings__container {
        padding: 3rem
    }
}

.product-section-savings__content_container {
    display: block;
}

@media (min-width: 1280px) {

    .product-section-savings__content_container {
        display: flex
    }
}

.product-section-savings__header {
    margin-bottom: 1.125rem;
}

.product-section-savings__rate__container {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

@media (min-width: 768px) {

    .product-section-savings__rate__container {
        flex-direction: row;
        gap: 2.5rem;
        justify-content: flex-start
    }
}

@media (min-width: 1024px) {

    .product-section-savings__rate__container {
        gap: 5rem
    }
}

.product-section-savings__aer-container {
    position: relative;
    width: fit-content;
}

@media screen and (min-width: 768px) {

    .product-section-savings__aer-container {
        width: 15rem
    }
}

.product-section-savings__aer-label {
    align-items: flex-end;
    display: flex;
    flex-direction: row;
}

@media screen and (min-width: 768px) {
    .product-section-savings__aer-label.additional-rate {
        bottom: 1rem;
        position: absolute;
    }
}

.product-section-savings__aer-caption {
    --font-size: 1.75rem;
    font-weight: bold;
    --line-height: 120%;
    margin-right: 0.5rem;
    margin-top: 0.25rem;
}

@media screen and (min-width: 1024px) {

    .product-section-savings__aer-caption {
        font-size: 2rem
    }
}

.product-section__flex-row__full-width {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

@media screen and (min-width: 640px) {

    .product-section__flex-row__full-width {
        flex-direction: row;
        gap: 2rem;
        justify-content: space-between
    }
}

.product-section-savings__title {
    --font-family: var(--font-body-copy);
    --font-size: 1.125rem;
    font-weight: 400;
    line-height: 160%;
}

.product-section-savings__rate-caption {
    --font-family: var(--font-body-copy);
    font-size: 1.375rem;
    font-weight: bold;
    max-width: 1rem;
}

@media screen and (min-width: 768px) {

    .product-section-savings__rate-caption {
        font-size: 1.5rem
    }
}

.product-section__flex-column__full-width {
    display: flex;
    flex-direction: column;
    margin-top: 1.25rem;
    width: 100%;
}

.product-section-savings__p {
    --font-size: 0.875rem;
    margin-top: 1.5rem;
}

@media screen and (min-width: 640px) {

    .product-section-savings__p {
        --font-size: 0.875rem
    }
}

@media screen and (min-width: 1024px) {

    .product-section-savings__p {
        width: 43.3125rem
    }
}

.product-section__term-info {
    display: flex;
    flex-direction: row;
    margin-top: 2rem;
}

@media screen and (min-width: 1280px) {

    .product-section__term-info {
        display: inline-block;
        margin-left: 7.5rem;
        margin-top: 0
    }
}

.product-section__flex-column {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 100%;
}

@media (min-width: 640px) {

    .product-section__flex-column {
        flex-direction: row;
        gap: 3rem
    }
}

@media (min-width: 1280px) {

    .product-section__flex-column {
        flex-direction: column;
        gap: 1.25rem
    }
}

.product-section__divider {
    border-top: 1px solid;
    border-color: rgba(var(--black));
    opacity: 20%;
    margin-bottom: 1.25rem;
    margin-top: 1.25rem;
    width: 100%;
}

    .product-section__divider.last-rate {
        border-top-width: 0;
        margin-bottom: 0;
        margin-top: 0;
    }

.turnaround-times__container-full {
    height: auto;
    padding: 3rem 1.25rem;
}

@media (min-width: 640px) {
    .turnaround-times__container-full {
        padding: 5rem 2.5rem;
    }
}

@media (min-width: 1024px) {
    .turnaround-times__container-full {
        padding: 5rem 3rem;
    }
}

.turnaround-times__header {
    padding-bottom: 1.75rem;
}

.turnaround-times__container-content__ul {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: flex-start;
}

@media (min-width: 1024px) {
    .turnaround-times__container-content__ul {
        flex-direction: row;
    }
}

.turnaround-times__card {
    display: flex;
    flex-shrink: 0;
    margin-bottom: 0.5rem;
    overflow: hidden;
    padding: 2.25rem 2rem;
    position: relative;
    width: 21rem
}

@media (min-width: 1024px) {
    .turnaround-times__card {
        width: 23.5rem;
    }
}

.turnaround-times__card-content {
    display: flex;
    flex-direction: row;
    min-height: 8rem;
}

    .turnaround-times__card-content svg {
        flex-shrink: 0;
        height: 8.625rem;
        left: 15rem;
        opacity: 0.05;
        position: absolute;
        width: 8.625rem;
    }

@media (min-width: 1024px) {
    .turnaround-times__card-content svg {
        left: 17.5rem;
    }
}

.turnaround-times__content__li {
    flex-shrink: 0;
}

.turnaround-times__sub-header {
    --font-family: var(--font-body-copy);
    font-size: var(--font-p-default);
    letter-spacing: calc(var(--font-size, var(--font-p-default)) * -0.02);
    --line-height: 160%;
    padding-bottom: 0.5rem;
}

.turnaround-times__p-time {
    --font-size: var(--font-h3-default);
    font-weight: bold;
    --line-height: 120%;
    padding-bottom: 0.25rem;
}

@media (min-width: 640px) {

    .turnaround-times__p-time {
        --font-size: var(--font-h3-medium)
    }
}

@media (min-width: 1024px) {

    .turnaround-times__p-time {
        --font-size: var(--font-h3-large)
    }
}

.unique-selling-points__section__grid {
    background-color: rgb(var(--white));
    display: grid;
}

@media (min-width: 640px) {
    .unique-selling-points__section__grid {
        grid-auto-flow: column;
    }

    .unique-selling-point-block:nth-child(2n + 1) {
        grid-column: 1;
    }

    .unique-selling-point-block:nth-child(2n + 2) {
        grid-column: 2;
    }
}

@media screen and (min-width: 768px) {
    .unique-selling-points__section__grid {
        grid-auto-flow: column;
    }

    .unique-selling-point-block:nth-child(4n + 1) {
        grid-column: 1;
    }

    .unique-selling-point-block:nth-child(4n + 2) {
        grid-column: 2;
    }

    .unique-selling-point-block:nth-child(4n + 3) {
        grid-column: 3;
    }

    .unique-selling-point-block:nth-child(4n + 4) {
        grid-column: 4;
    }
}

.unique-selling-points__container__block {
    padding: 2rem 1.25rem;
    width: 100%;
}

@media (min-width: 640px) {
    .unique-selling-points__container__block {
        padding: 3rem 2.5rem;
    }
}

@media (min-width: 1024px) {
    .unique-selling-points__container__block {
        padding: 4rem 3rem;
    }
}

.unique-selling-point-block {
    min-width: 10.25rem;
    padding: 2.5rem 1.25rem;
}

@media screen and (min-width: 640px) {

    .unique-selling-point-block {
        padding: 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .unique-selling-point-block {
        padding: 3rem
    }
}

.unique-selling-point-block h6 {
    margin-bottom: 0.25rem;
}

.unique-selling-points__point_multi_item {
    width: 100%;
}

.unique-selling-points__point_single_item {
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .unique-selling-points__point_single_item {
        width: 39rem
    }
}

.unique-selling-points__point__layout {
    align-items: center;
    display: flex;
    flex-direction: column;
}

.unique-selling-points__block {
    display: grid;
    gap: 3rem;
}

@media (min-width: 1024px) {

    .unique-selling-points__block {
        gap: 4rem
    }
}

@media (min-width: 1024px) {
    .unique-selling-points__block {
        padding-left: 3.5rem;
        padding-right: 3.5rem;
    }
}

.unique-selling-points__block.block__columns__1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 1024px) {
    .unique-selling-points__block.block__columns__2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .unique-selling-points__block.block__columns__3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .unique-selling-points__block.block__columns__4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.unique-selling-points__point {
    border-radius: 50%;
    padding: 0.5rem;
}

.unique-selling-points__point__single {
    height: 3.5rem;
    margin-bottom: 2rem;
    width: 3.5rem;
}

.unique-selling-points__point__block {
    height: 3.5rem;
    margin-bottom: 2rem;
    width: 3.5rem;
}

.unique-selling-points__header {
    color: rgb(var(--black));
    margin: auto;
    padding-bottom: 2.5rem;
    text-align: center;
}

@media screen and (min-width: 1024px) {

    .unique-selling-points__header {
        padding-bottom: 3rem;
        width: 75%
    }
}

@media (min-width: 768px) {
    .unique-selling-points__header {
        width: 80%;
    }
}

@media (min-width: 1024px) {
    .unique-selling-points__header {
        width: 75%;
    }
}

.unique-selling-points__sub-header {
    align-items: center;
    display: flex;
    margin-bottom: 1rem;
}

.unique-selling-points-block__sub-header {
    margin-bottom: 0.25rem;
    overflow-wrap: break-word;
    text-align: center;
    width: 100%;
}

.unique-selling-points-block__p {
    text-align: center;
}

.video-wrapper-container {
    width: 0px;
    height: 0px;
}

.video-wrapper {
    z-index: 0;
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    width: 100%;
}

    .video-wrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

@media screen and (min-width: 1024px) {

    .video-block__container-full {
        height: 25.875rem
    }
}

@media screen and (min-width: 1280px) {

    .video-block__container-full {
        height: 27.25rem
    }
}

.video-block_container-full__video-only {
    height: 36rem;
}

.video-block__container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

@media screen and (min-width: 1024px) {

    .video-block__container {
        flex-direction: row-reverse
    }
}

@media screen and (min-width: 1024px) {

    .video-block__container__video-left {
        flex-direction: row
    }
}

.video-block__container-image {
    z-index: 1;
    height: 36rem;
    overflow: hidden;
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
}

    .video-block__container-image::after {
        background: rgba(var(--black), 0.5);
        content: '';
        inset: 0;
        pointer-events: none;
        position: absolute;
    }

.video-block__container-image-with-text {
    height: 17.5rem;
}

@media screen and (min-width: 1024px) {

    .video-block__container-image-with-text {
        aspect-ratio: unset;
        height: 100%;
        width: 50%
    }
}

.video-block__image {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.video-block__play-button__container {
    height: 5rem;
    left: 50%;
    margin-left: -2.5rem;
    margin-top: -2.5rem;
    padding: 0.75rem;
    position: absolute;
    top: 50%;
    width: 5rem;
}

.play-button svg {
    color: rgb(var(--white));
    height: 5rem;
    position: relative;
    width: 5rem;
    z-index: 100;
}

.video-block__container-text {
    display: flex;
    flex-shrink: 0;
    height: 100%;
    padding: 2.5rem 1.25rem;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .video-block__container-text {
        padding: 3rem 2.5rem
    }
}

@media screen and (min-width: 1024px) {

    .video-block__container-text {
        padding: 4rem 3.5rem 4rem 3rem;
        width: 50%
    }
}

@media screen and (min-width: 1280px) {

    .video-block__container-text {
        padding: 4rem 4.25rem 4rem 3rem
    }
}

@media screen and (min-width: 1440px) {

    .video-block__container-text {
        padding: 5rem 4.25rem 5rem 3rem
    }
}

@media screen and (min-width: 1024px) {

    .video-block__container-text__left {
        padding: 4rem 3rem 4rem 3.5rem
    }
}

@media screen and (min-width: 1280px) {

    .video-block__container-text__left {
        padding: 4rem 3rem 4rem 4.25rem
    }
}

@media screen and (min-width: 1440px) {

    .video-block__container-text__left {
        padding: 5rem 3rem 5rem 4.25rem
    }
}

.video-block__container-text section {
    display: flex;
    flex-direction: column;
}

.video-block__container-text .video-cta {
    margin-top: auto;
}

.video-block__layout-text {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    padding-bottom: 1.25rem;
    padding-top: 1.25rem;
}

@media screen and (min-width: 640px) {

    .video-block__layout-text {
        padding-top: 2rem;
        padding-bottom: 2rem
    }
}

@media screen and (min-width: 1024px) {

    .video-block__layout-text {
        padding-bottom: 0rem;
        padding-top: 0rem
    }
}

.video-block__p {
    margin-bottom: 2.5rem;
    margin-top: 0.5rem;
}

.filters__container-full {
    background-color: rgb(var(--light-grey-tint));
    color: rgb(var(--black));
    width: 100%;
    word-break: break-all;
}

.filters__container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
}

@media (min-width: 768px) {
    .filters__container {
        column-gap: 0.75rem;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        width: 50%
    }
}

@media screen and (min-width: 1024px) {
    .filters__container {
        column-gap: 0.75rem;
        width: 100%;
    }
}

.filters-caption-alignment {
    margin-top: 1.25rem;
}

.featured-link {
    cursor: pointer;
    display: flex;
    height: 12.75rem;
    position: relative;
    width: 100%;
}

@media screen and (min-width: 640px) {

    .featured-link {
        height: 10.75rem
    }
}

.featured-link__image {
    display: none;
    overflow: hidden;
}

@media screen and (min-width: 1024px) {

    .featured-link__image {
        display: inline-block;
        width: 30%
    }
}

.featured-link__image img {
    height: 100%;
    object-fit: cover;
    transition: all 500ms cubic-bezier(0.4, 0, 0.2, 1);
    width: 100%;
}

.featured-link:hover .featured-link__image img {
    transform: scale(1.1, 1.1);
}

.featured-link__title {
    --font-size: var(--font-span-large-default);
    --font-family: var(--font-bold);
    justify-content: center;
    margin-left: 1.25rem;
    text-align: left;
}

@media screen and (min-width: 1024px) {

    .featured-link__title {
        --font-size: 3rem;
        margin-left: 5rem;
        margin-right: 5rem
    }
}

.featured-link__text {
    align-items: center;
    display: flex;
    justify-content: center;
    overflow: hidden;
    padding-right: 2rem;
    width: 100%;
}

@media screen and (min-width: 1024px) {

    .featured-link__text {
        width: 70%
    }
}

.featured-link__text div {
    align-items: center;
    display: flex;
    flex-basis: content;
    justify-content: center;
    padding: 4rem 0rem 4rem 2rem;
    text-align: left;
}

@media screen and (min-width: 640px) {

    .featured-link__text div {
        padding: 0
    }
}

.featured-link__text div .featured-link__label {
    display: inline-block;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    text-wrap: pretty;
}

.featured-link__text div svg {
    display: inline-block;
    flex-shrink: 0;
    height: var(--size);
    margin-left: 0.75rem;
    --size: 2rem;
    transition: transform 300ms ease-in-out;
    width: var(--size);
}

.featured-link:hover .featured-link__text svg {
    transform: translateX(0.625rem);
}

.featured-link:active .featured-link__text svg {
    transform: translateX(0.625rem);
}

.featured-link:focus .featured-link__text svg {
    transform: translateX(0.625rem);
}

.featured-link__text__no-image:hover svg {
    transform: translateX(0.625rem);
}

.featured-link__text__no-image:active svg {
    transform: translateX(0.625rem);
}

.featured-link__text__no-image:focus svg {
    transform: translateX(0.625rem);
}

.featured-link__text__no-image {
    align-items: center;
    display: flex;
    justify-content: center;
    padding-right: 2rem;
    width: 100%;
}

    .featured-link__text__no-image div {
        align-items: center;
        display: flex;
        flex-basis: content;
        justify-content: center;
        padding: 4rem 0rem 4rem 2rem;
        text-align: left;
    }

@media screen and (min-width: 640px) {

    .featured-link__text__no-image div {
        padding: 0
    }
}

.featured-link__text__no-image div .featured-link__label_no-image {
    display: inline-block;
    text-align: center;
    text-wrap: pretty;
}

.featured-link__text__no-image div svg {
    display: inline-block;
    flex-shrink: 0;
    height: var(--size);
    margin-left: 0.75rem;
    --size: 2rem;
    transition: transform 300ms ease-in-out;
    width: var(--size);
}

.anchor-link__nav-bar__container-full {
    overflow: auto;
    padding-left: 3rem;
}

.anchor-link__nav-bar__container-layout {
    height: 2.3125rem;
    width: 45rem;
}

@media screen and (min-width: 640px) {

    .anchor-link__nav-bar__container-layout {
        width: 100%
    }
}

.anchor-link__nav-bar__container-content {
    align-items: center;
    display: flex;
    gap: 1.75rem;
    height: 100%;
}

.anchor-link__nav-bar__a {
    align-items: center;
    display: flex;
    height: 1.8125rem;
}

    .anchor-link__nav-bar__a:focus-visible {
        outline-offset: -1px;
    }

.anchor-link__nav-bar__label {
    border-bottom-width: 0.125rem;
    border-color: transparent;
    --font-size: var(--font-p-large);
    --font-family: var(--font-body-copy-bold);
    transition: all 0.3s ease-in-out;
}

    .anchor-link__nav-bar__label:hover {
        text-decoration: underline;
    }

    .anchor-link__nav-bar__label:active {
        border-color: rgb(var(--state-info));
    }

.anchor-link__tab-bar__container-full {
    overflow: auto;
}

.anchor-link__tab-bar__container-layout {
    background-color: rgb(var(--white));
    height: 3.75rem;
    width: 45rem;
}

@media screen and (min-width: 640px) {

    .anchor-link__tab-bar__container-layout {
        height: 4.3125rem;
        width: 100%
    }
}

.anchor-link__tab-bar__container-content {
    align-items: center;
    display: flex;
    height: 100%;
}

.anchor-link__tab-bar__a {
    background-color: rgb(var(--grey-light));
    border-bottom-width: 0.125rem;
    border-color: rgba(var(--black), 10%);
    display: flex;
    height: 100%;
    justify-content: center;
    padding-bottom: 1.25rem;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 1.25rem;
    width: 100%;
}

    .anchor-link__tab-bar__a.active {
        background-color: rgb(var(--white));
        border-color: rgb(var(--black));
        --font-family: var(--font-body-copy-bold);
        font-synthesis: none;
    }

    .anchor-link__tab-bar__a:focus-visible {
        outline-offset: -1px;
    }

    .anchor-link__tab-bar__a.active > span {
        font-weight: 700;
    }

    .anchor-link__tab-bar__a:last-child {
        border-right-width: 0px;
    }

    .anchor-link__tab-bar__a:hover {
        background-color: rgb(var(--grey-light));
        border-color: rgb(var(--black));
    }

.anchor-link__tab-bar__label {
    align-self: center;
    display: flex;
    --font-size: var(--font-p-large);
    white-space: nowrap;
}

.tab-bar__label {
    height: auto;
    width: auto;
    position: absolute;
    padding-left: 2rem;
    padding-right: 2rem;
    white-space: nowrap;
}

.tab__panels {
    display: flex;
    margin-left: 3.125rem;
    margin-right: 3.125rem;
}

.tab__panel {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

    .tab__panel.ald-hidden {
        display: none;
    }

.tab__panel__card {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 2.5rem;
}

.tab__panel__card-content {
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
}

.tab__panel__header {
    --font-size: 0.875rem;    
    margin-bottom: 0.625rem;
    --font-family: var(--font-bold);
}

@media screen and (min-width: 640px) {

    .tab__panel__header {
        --font-size: 1.5rem;        
        margin-bottom: 1.25rem;
        max-width: 40rem
    }
}

.tab__panel__card_header {
    margin-top: 0.625rem;
    margin-bottom: 0.625rem;
    max-width: 39.0625rem;
    --font-size: 0.75rem;
}

@media screen and (min-width: 640px) {

    .tab__panel__card_header {
        --font-size: 1.125rem;
        margin-top: 1.25rem;
        margin-bottom: 1.25rem
    }
}

.group {
    color: #FFFFFF;
}

.group-container {
    background-color: #00481E;
}

.social-icons-list__container {
    align-items: center;
    display: flex;
    gap: 1.5rem;
    justify-content: center;
    width: 100%;
}

.social-icons__a {
    align-items: center;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.social-icons__svg {
    display: block;
    flex: none;
    height: 2.5rem;
    width: 2.5rem;
}

.social-icons-caption__span {
    display: none;
    font-family: var(--font-body-copy);
    --font-size: 0.75rem;
}

@media (min-width: 768px) {
    .social-icons-caption__span {
        display: flex;
    }
}

.ald_table__container {
    overflow-x: auto;
    width: 100%;
}

div.ald_table__container > table {
    background-color: rgb(var(--white));
    color: rgb(var(--black));
    width: 100%;
}

    div.ald_table__container > table > tbody {
        width: 100%;
    }

    div.ald_table__container > table > thead, tbody > tr > th {
        color: rgb(var(--black));
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        --padding: 1rem;
        padding: var(--padding);
        text-align: left;
    }

    div.ald_table__container > table > tbody > tr > th {
        background-color: rgb(var(--white));
        color: rgb(var(--black));
    }

    div.ald_table__container > table > thead, tbody {
        width: 100%;
    }

        div.ald_table__container > table > thead, tbody > tr {
            width: 100%;
        }

    div.ald_table__container > table:has(tbody) > tr > th:first-child {
        padding-left: 5.3125rem;
    }

    div.ald_table__container > table > thead > tr > td, th {
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        padding: 1rem;
    }

@media screen and (min-width: 768px) {

    div.ald_table__container > table > thead > tr > td, th {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

div.ald_table__container > table > tbody > tr > td, th {
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%; /* 25.6px */
    min-width: 9.375rem;
    padding: 1rem;
}

@media screen and (min-width: 768px) {

    div.ald_table__container > table > tbody > tr > td, th {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

div.ald_table__container > table > tbody > tr > td:first-child {
    padding-left: 5.3125rem;
}

div.ald_table__container > table > tbody > tr > th:first-child {
    padding-left: 5.3125rem;
}

div.ald_table__container > table > thead > tr > th:first-child {
    padding-left: 5.3125rem;
}

/* group table variant styling */

.group_page .ald_table__container__group {
    color: rgb(var(--white));
    overflow-x: auto;
    width: 100%;
}

.group_page div.ald_table__container > table {
    background-color: rgb(var(--group-colour));
    border: 0.0625rem solid rgba(var(--white), 0.2);
    color: rgb(var(--white));
    width: 100%;
}

    .group_page div.ald_table__container > table > tbody {
        width: 100%;
    }

    .group_page div.ald_table__container > table > thead > tr > th {
        background-color: rgb(var(--group-colour));
        color: rgb(var(--white));
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        --padding: 1rem;
        padding: var(--padding);
        text-align: left;
    }

    .group_page div.ald_table__container > table > tbody > tr > th {
        background-color: rgb(var(--group-colour));
        color: rgb(var(--white));
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        --padding: 1rem;
        padding: var(--padding);
        text-align: left;
    }

    .group_page div.ald_table__container > table > thead, tbody {
        width: 100%;
    }

        .group_page div.ald_table__container > table > thead, tbody > tr {
            width: 100%;
        }

    .group_page div.ald_table__container > table:has(tbody) > tr > th:first-child {
        padding-left: 5.3125rem;
    }

    .group_page div.ald_table__container > table > thead > tr > td, th {
        font-family: var(--font-body-copy);
        --font-size: 1rem;
        font-size: var(--font-size);
        letter-spacing: calc(var(--font-size) * -0.02);
        line-height: 160%; /* 25.6px */
        min-width: 9.375rem;
        padding: 1rem;
    }

@media screen and (min-width: 768px) {

    .group_page div.ald_table__container > table > thead > tr > td, th {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

.group_page div.ald_table__container > table > tbody > tr > td, th {
    font-family: var(--font-body-copy);
    --font-size: 1rem;
    font-size: var(--font-size);
    letter-spacing: calc(var(--font-size) * -0.02);
    line-height: 160%; /* 25.6px */
    min-width: 9.375rem;
    padding: 1rem;
}

@media screen and (min-width: 768px) {

    .group_page div.ald_table__container > table > tbody > tr > td, th {
        --font-size: 1rem;
        min-width: 12.5rem;
        padding: 1rem
    }
}

.group_page div.ald_table__container > table > tbody > tr > td:first-child {
    padding-left: 5.3125rem;
}

.group_page div.ald_table__container > table > tbody > tr > th:first-child {
    padding-left: 5.3125rem;
}

.group_page div.ald_table__container > table > thead > tr > th:first-child {
    padding-left: 5.3125rem;
}

.table_generic_header {
    font-family: var(--font-body-copy-bold);
}

.table_data_row_border {
    border-top: 0.0625rem solid rgba(var(--black), 0.2);
}

.page-control-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    column-gap: 1.875rem;
}

.page-control-container__column_3 {
    width: calc(33% - 1.875rem);
    min-width: 320px;
    flex-grow: 1;
}

.page-control-container__column_2 {
    width: calc(50% - 1.875rem);
    min-width: 320px;
    flex-grow: 1;
}

.page-control-container__column {
    display: flex;
    flex-direction: column;
}

.page-control-container__column_align-left {
    align-items: flex-start;
}

.page-control-container__column_align-centre {
    align-items: center;
}

.page-control-container__column_align-right {
    align-items: flex-end;
}

/**
 * Faux Box Link Object
 *
 * Base upon The Guardian implementation of this model.
 *
 * Example:
 *  <div class="box u-faux-box-link">
 *      <h1>This is a title</h1>
 *      <p>This is a standfirst paragraph
 *          <a class="u-faux-box-link__promote" href="https://bbc.co.uk">This is a link</a></p>
 *      <a href="https://studiobonito.co.uk" class="u-faux-link__overlay">Studio Bonito yo!</a>
 *  </div>
 *
 */

/* Base faux box link */

.u-faux-box-link {
    position: relative;
}

/* Overlay styling */

.u-faux-box-link__overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    text-indent: 200%;
    white-space: nowrap;
    background: transparent;
    z-index: 1;
}

/* The link that can be clicked on. */

.u-faux-box-link__promote {
    position: relative;
    z-index: 1;
}

.release-log-container-header {
    padding: 3rem 7.5rem 1.25rem;
}

.release-log-container-sprints {
    padding: 0 7.5rem;
}

.release-log-sprint-title {
    margin-bottom: 1.25rem;
}

.release-log-update {
    margin-bottom: 1.25rem;
}

.release-log-container-sprints:last-of-type {
    padding-bottom: 3rem;
}

:root {
    --icon-width-sm: 2rem;
    --icon-height-sm: 2rem;
    --icon-width-md: 2.5rem;
    --icon-height-md: 2.5rem;
    --icon-width-xl: 6.25rem;
    --icon-height-xl: 6.25rem;
    --stoke-white: rgb(var(--white));
    --stroke-black: rgb(var(--black));
    --ald-border-width: 2px;
}

*, :after, :before {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border: 0 solid;
}

html {
    background-color: rgb(var(--grey-light));
}

body {
    max-width: 90rem;
    /* Need important here to override storybook default margin */
    margin: 0 auto !important;
    background-color: rgb(var(--white));
    /* Set the default pen colour to our defined black */
    color: rgb(var(--black));
}

.icon-sm {
    width: var(--icon-width-sm);
    height: var(--icon-height-sm);
}

.icon-md {
    width: var(--icon-width-md);
    height: var(--icon-height-md);
}

.icon-xl {
    width: var(--icon-width-xl);
    height: var(--icon-height-xl);
}

.icon-fill-white {
    color: rgb(var(--white));
}

.icon-fill-black {
    color: rgb(var(--black));
}

.svg {
    transition: all 0.2s;
}

.outer:active .svg {
    stroke: white;
}

.flex-column-container {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.hidden {
    display: none;
}

/* Sitewide margin and paddings */

.form-margin-top {
    margin-top: 1.25rem;
}

.form-margin-bottom {
    margin-bottom: 1.25rem;
}

.margin-bottom {
    margin-bottom: 1.25rem;
}

@media screen and (min-width: 640px) {
    .margin-bottom {
        margin-bottom: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .margin-bottom {
        margin-bottom: 3rem;
    }
}

.padding-side {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

@media screen and (min-width: 640px) {
    .padding-side {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .padding-side {
        padding-left: 3rem;
        padding-right: 3rem;
    }
}

/* Left padding */

.padding-left {
    padding-left: 1.25rem;
}

@media screen and (min-width: 640px) {
    .padding-left {
        padding-left: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .padding-left {
        padding-left: 3rem;
    }
}

/* Right padding */

.padding-right {
    padding-right: 1.25rem;
}

@media screen and (min-width: 640px) {
    .padding-right {
        padding-right: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .padding-right {
        padding-right: 3rem;
    }
}

.margin-side {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
}

@media screen and (min-width: 640px) {
    .margin-side {
        margin-left: 2.5rem;
        margin-right: 2.5rem;
    }
}

@media screen and (min-width: 1024px) {
    .margin-side {
        margin-left: 3rem;
        margin-right: 3rem;
    }
}

.stop-scrolling {
    height: 100%;
    overflow: hidden;
}

table {
    border-collapse: collapse;
}

.ios_colour_fix {
    color: rgb(var(--black));
}