@font-face {
    font-family: Avantt;
    src: url(/assets/AvanttVF-BkYrCrtH.woff2) format("woff2") tech("variations"),url(/assets/AvanttVF-BkYrCrtH.woff2) format("woff2-variations");
    font-display: swap;
    font-weight: 100 900
}

:root {
    --secondary-text-color: #7a708c;
    --teal: #C8F8A9;
    --blue: #1e73be;
    --starling-white: #ffffff;
    --starling-red: #ea5c5c;
    --starling-dark-purple: #2c1c49;
    --starling-grey: #958da4;
    --starling-black: #000000;
    --starling-indigo-blue: #1e1937;
    --light-grey: #ebebeb;
    --extra-light-grey: #f8f8f8;
    --input-border-colour: #e7e7e7;
    --input-hover-colour: #f6f6f6;
    --input-disabled-colour: var(--input-hover-colour);
    --input-disabled-hover-colour: #ededed;
    --input-active-border-colour: #4a90e2;
    --max-screen-width: 62.5rem;
    --font-size-xxl: 34px;
    --font-size-xl: 1.5rem;
    --font-size-lg: 1.25rem;
    --font-size-md: 1rem;
    --font-size-sm: .875rem;
    --font-size-xs: .75rem;
    --font-family-body: "Avantt", sans-serif;
    --font-weight-regular: 350;
    --font-weight-semibold: 550;
    --font-weight-bold-600: 600;
    --blue-200: #cad4ff;
    --blue-600: #4563e0;
    --dark-grey-100: #aaaaaa;
    --dark-grey-600: #636363;
    --dark-grey-1000: #2b2b2b;
    --light-grey-100: #f9f9f9;
    --light-grey-300: #eeeeee;
    --light-grey-500: #e2e2e2;
    --red-100: #fce3e3;
    --red-200: #f5c2c2;
    --red-400: #e27373;
    --red-500: #d85555;
    --red-600: #ce3d3d;
    --red-700: #b22929;
    --teal-100: #e3fcf9;
    --teal-200: #b9fff7;
    --teal-300: #83fff1;
    --teal-400: #C8F8A9;
    --teal-500: #35e4d0;
    --teal-1100: #06413a;
    --starling-purple: #152725;
    --colour-content-weak: var(--dark-grey-100);
    --colour-content-medium: var(--dark-grey-600);
    --colour-content-strong: var(--dark-grey-1000);
    --colour-content-interactive: var(--blue-600);
    --colour-content-interactive-disabled: var(--blue-200);
    --colour-content-danger: var(--red-600);
    --colour-content-onBrandStrong: var(--teal-1100);
    --colour-content-onBrandStrong-disabled: var(--teal-500);
    --colour-content-onDangerWeak: var(--red-700);
    --colour-content-onDangerMedium: var(--red-500);
    --colour-content-onDangerStrong: #ffffff;
    --colour-content-onDangerStrong-disabled: var(--red-400);
    --colour-border-weak: var(--light-grey-100);
    --colour-border-medium: var(--light-grey-300);
    --colour-border-strong: var(--light-grey-500);
    --colour-bg-fill-weak: var(--light-grey-500);
    --colour-bg-fill-medium: var(--light-grey-300);
    --colour-bg-fill-strong: var(--light-grey-100);
    --colour-bg-fill-brand-weak: var(--teal-100);
    --colour-bg-fill-brand-medium: var(--teal-300);
    --colour-bg-fill-brand-strong: var(--teal-400);
    --colour-bg-fill-brand-strong-disabled: var(--teal-200);
    --colour-bg-fill-danger-weak: var(--red-100);
    --colour-bg-fill-danger-medium: var(--red-200);
    --colour-bg-fill-danger-strong: var(--red-600);
    --colour-bg-fill-danger-strong-disabled: var(--red-200);
    --button-primary-colour: var(--colour-content-onBrandStrong);
    --button-primary-bg: var(--colour-bg-fill-brand-strong);
    --button-primary-bg-hover: #00c8bb;
    --button-primary-bg-active: #00b9aa;
    --button-primary-bg-disabled: var(--colour-bg-fill-brand-strong-disabled);
    --button-primary-colour-disabled: var( --colour-content-onBrandStrong-disabled );
    --button-negative-colour: var(--colour-content-onDangerStrong);
    --button-negative-bg: var(--colour-bg-fill-danger-strong);
    --button-negative-bg-hover: #bb161c;
    --button-negative-bg-active: #8b0e12;
    --button-negative-bg-disabled: var(--colour-bg-fill-danger-strong-disabled);
    --button-negative-colour-disabled: var( --colour-content-onDangerStrong-disabled );
    --button-neutral-colour: var(--colour-content-interactive);
    --button-neutral-bg: var(--colour-bg-fill-medium);
    --button-neutral-bg-hover: #e7e7e7;
    --button-neutral-bg-active: #d0d0d0;
    --text-button-colour: var(--colour-content-interactive);
    --text-button-colour-hover: #7fb4e9;
    --text-button-colour-active: #abcef0;
    --text-button-bg: transparent
}

* {
    box-sizing: border-box
}

body {
    background-color: #fff;
    color: var(--colour-content-strong);
    font-family: var(--font-family-body);
    font-size: 100%;
    font-variant-ligatures: none;
    line-height: 1.8;
    margin: 0
}

h1 {
    margin-top: 0
}

.text-style-extra-large-title {
    font-size: var(--font-size-xxl);
    font-weight: var(--font-weight-bold-600);
    line-height: 1.2
}

.text-style-large-title {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-bold-600);
    line-height: 1.2
}

.text-style-title {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-bold-600);
    line-height: 1.6
}

.text-style-body {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
    line-height: 1.625
}

.text-style-sub-body {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-regular);
    line-height: 1.357
}

.text-style-caption {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    line-height: 1.357
}

.text-style-sub-caption {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-regular);
    line-height: 1.333
}

.text-style-text {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-regular);
    line-height: 1.625
}

.text-style-input {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-regular);
    line-height: 1.3125
}

.text-style-callout {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    line-height: 1.6
}