@font-face {
    font-family: Onest;
    src: url("./media/Onest-Regular.woff2") format("woff2"),url("./media/Onest-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Onest;
    src: url("./media/Onest-SemiBold.woff2") format("woff2"),url("./media/Onest-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Onest;
    src: url("./media/Onest-ExtraLight.woff2") format("woff2"),url("./media/Onest-ExtraLight.woff") format("woff");
    font-weight: 200;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Onest;
    src: url("./media/Onest-ExtraBold.woff2") format("woff2"),url("./media/Onest-ExtraBold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Onest;
    src: url("./media/Onest-Thin.woff2") format("woff2"),url("./media/Onest-Thin.woff") format("woff");
    font-weight: 100;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Onest;
    src: url("./media/Onest-Light.woff2") format("woff2"),url("./media/Onest-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Onest;
    src: url("./media/Onest-Medium.woff2") format("woff2"),url("./media/Onest-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Onest;
    src: url("./media/Onest-Bold.woff2") format("woff2"),url("./media/Onest-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Onest;
    src: url("./media/Onest-Black.woff2") format("woff2"),url("./media/Onest-Black.woff") format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap
}

.typo-all-subtitle-1 {
    font-family: Onest,arial,sans-serif;
    font-size: 18px; /* before 20 */
    font-weight: 500;
    letter-spacing: 0;
    line-height: 26px
}

.typo-all-subtitle-2 {
    font-family: Onest,arial,sans-serif;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 20px
}

.typo-all-body-large {
    font-family: Onest,arial,sans-serif;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 23px
}

.typo-all-body-medium {
    font-family: Onest,arial,sans-serif;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 20px
}

.typo-all-body-small {
    font-family: Onest,arial,sans-serif;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
    /*line-height: 18px*/
}

.typo-all-caption {
    font-family: Onest,arial,sans-serif;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 15px
}

.typo-all-overline {
    font-family: Onest,arial,sans-serif;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 14px
}

.typo-large-h1 {
    font-family: Onest,arial,sans-serif;
    font-size: 96px;
    font-weight: 500;
    line-height: 122px
}

.typo-large-h2 {
    font-family: Onest,arial,sans-serif;
    font-size: 60px;
    font-weight: 500;
    line-height: 77px
}

.typo-large-h3 {
    font-family: Onest,arial,sans-serif;
    font-size: 48px;
    font-weight: 500;
    line-height: 61px
}

.typo-large-h4 {
    font-family: Onest,arial,sans-serif;
    font-size: 34px;
    font-weight: 500;
    line-height: 43px
}

.typo-large-h5 {
    font-family: Onest,arial,sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 31px
}

.typo-large-h6 {
    font-family: Onest,arial,sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 26px
}

.typo-medium-h1 {
    font-family: Onest,arial,sans-serif;
    font-size: 96px;
    font-weight: 500;
    line-height: 122px
}

.typo-medium-h2 {
    font-family: Onest,arial,sans-serif;
    font-size: 60px;
    font-weight: 500;
    line-height: 77px
}

.typo-medium-h3 {
    font-family: Onest,arial,sans-serif;
    font-size: 48px;
    font-weight: 500;
    line-height: 61px
}

.typo-medium-h4 {
    font-family: Onest,arial,sans-serif;
    font-size: 34px;
    font-weight: 500;
    line-height: 43px
}

.typo-medium-h5 {
    font-family: Onest,arial,sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 31px
}

.typo-medium-h6 {
    font-family: Onest,arial,sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 26px
}

.typo-small-h1 {
    font-family: Onest,arial,sans-serif;
    font-size: 96px;
    font-weight: 500;
    line-height: 122px
}

.typo-small-h2 {
    font-family: Onest,arial,sans-serif;
    font-size: 60px;
    font-weight: 500;
    line-height: 77px
}

.typo-small-h3 {
    font-family: Onest,arial,sans-serif;
    font-size: 48px;
    font-weight: 500;
    line-height: 61px
}

.typo-small-h4 {
    font-family: Onest,arial,sans-serif;
    font-size: 34px;
    font-weight: 500;
    line-height: 43px
}

.typo-small-h5 {
    font-family: Onest,arial,sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 31px
}

.typo-small-h6 {
    font-family: Onest,arial,sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 26px
}

:root {
    /* ====== LEGACY ======================== */
    --color-distributeur: #044472;
    --color-distributeurSimulation: #0073bd;
    /* ====================================== */
    --color-bfm-gray-1200: #1F1F23;
    --color-bfm-gray-1100: #62636A;
    --color-bfm-gray-1000: #81838A;
    --color-bfm-gray-900: #8C8D95;
    --color-bfm-gray-800: #BABBC3;
    --color-bfm-gray-700: #CDCED4;
    --color-bfm-gray-600: #D9DADE;
    --color-bfm-gray-500: #E0E1E5;
    --color-bfm-gray-400: #E7E8EB;
    --color-bfm-gray-300: #F0F0F2;
    --color-bfm-gray-200: #F9F9FB;
    --color-bfm-gray-100: #FCFCFD;
    --color-bfm-red-1200: #68111B;
    --color-bfm-red-1100: #D21A38;
    --color-bfm-red-1000: #F14151;
    --color-bfm-red-900: #FF4F5C;
    --color-bfm-red-800: #EF8D8C;
    --color-bfm-red-700: #F8A8A6;
    --color-bfm-red-600: #FFBCBA;
    --color-bfm-red-500: #FFCCCA;
    --color-bfm-red-400: #FFDBD9;
    --color-bfm-red-300: #FFEBEA;
    --color-bfm-red-200: #FFF7F7;
    --color-bfm-red-100: #FFFCFC;
    --color-bfm-yellow-1200: #453A23;
    --color-bfm-yellow-1100: #997000;
    --color-bfm-yellow-1000: #FCC648;
    --color-bfm-yellow-900: #FFCF41;
    --color-bfm-yellow-800: #D5AB4F;
    --color-bfm-yellow-700: #E7C275;
    --color-bfm-yellow-600: #FAD280;
    --color-bfm-yellow-500: #FFDF85;
    --color-bfm-yellow-400: #FFEAA4;
    --color-bfm-yellow-300: #FFF3C4;
    --color-bfm-yellow-200: #FFFAEB;
    --color-bfm-yellow-100: #FEFDFB;
    --color-bfm-green-1200: #1C3E46;
    --color-bfm-green-1100: #0F798E;
    --color-bfm-green-1000: #006F84;
    --color-bfm-green-900: #177D92;
    --color-bfm-green-800: #69B4C7;
    --color-bfm-green-700: #94CAD8;
    --color-bfm-green-600: #AEDAE5;
    --color-bfm-green-500: #C3E6EF;
    --color-bfm-green-400: #D4EFF6;
    --color-bfm-green-300: #E4F5FA;
    --color-bfm-green-200: #F3FAFC;
    --color-bfm-green-100: #FAFDFE;
    --color-bfm-blue-1200: #0F2E69;
    --color-bfm-blue-1100: #155DE7;
    --color-bfm-blue-1000: #145DE7;
    --color-bfm-blue-900: #1A69FF;
    --color-bfm-blue-800: #77A7FF;
    --color-bfm-blue-700: #9BC1FF;
    --color-bfm-blue-600: #B4D3FF;
    --color-bfm-blue-500: #C9E0FF;
    --color-bfm-blue-400: #DBEBFF;
    --color-bfm-blue-300: #EAF2FF;
    --color-bfm-blue-200: #F5F9FF;
    --color-bfm-blue-100: #FCFDFF;
    --color-bfm-marin-1200: #253D54;
    --color-bfm-marin-1100: #3A6F9F;
    --color-bfm-marin-1000: #386D9D;
    --color-bfm-marin-900: #457AAB;
    --color-bfm-marin-800: #7CACDB;
    --color-bfm-marin-700: #A0C4E7;
    --color-bfm-marin-600: #B8D5F2;
    --color-bfm-marin-500: #CAE2FA;
    --color-bfm-marin-400: #DAECFE;
    --color-bfm-marin-300: #E7F4FF;
    --color-bfm-marin-200: #F4F9FE;
    --color-bfm-marin-100: #FAFDFF;
    --color-bfm-cyan-1200: #126F8C;
    --color-bfm-cyan-1100: #0D8AAD;
    --color-bfm-cyan-1000: #0CADCE;
    --color-bfm-cyan-900: #18C0E0;
    --color-bfm-cyan-800: #6BE1F5;
    --color-bfm-cyan-700: #A8EFF9;
    --color-bfm-cyan-600: #D0F8FD;
    --color-bfm-cyan-500: #EDFDFE;
    --color-bfm-cyan-400: #F5FDFE;
    --color-bfm-cyan-300: #F5FDFE;
    --color-bfm-cyan-200: #FAFFFF;
    --color-bfm-cyan-100: #F9FFFF;
    --color-bfm-purple-1200: #2D2661;
    --color-bfm-purple-1100: #5F51C0;
    --color-bfm-purple-1000: #675ACA;
    --color-bfm-purple-900: #7364E3;
    --color-bfm-purple-800: #9F9CF1;
    --color-bfm-purple-700: #B9B8FA;
    --color-bfm-purple-600: #CCCCFF;
    --color-bfm-purple-500: #DADBFF;
    --color-bfm-purple-400: #E6E6FF;
    --color-bfm-purple-300: #F1F1FF;
    --color-bfm-purple-200: #F8F9FF;
    --color-bfm-purple-100: #FCFCFE;
    --color-bfm-white: #FFFFFF;
    --color-bfm-container-neutral: var(--color-bfm-white);
    --color-bfm-container-emphasis: var(--color-bfm-gray-200);
    --color-bfm-container-catchy: var(--color-bfm-gray-1200);
    --color-bfm-container-overlay: var(--color-bfm-gray-1200);
    --color-bfm-container-on-overlay: var(--color-bfm-white);
    --color-bfm-container-accent: var(--color-bfm-blue-900);
    --color-bfm-container-epargne: var(--color-bfm-yellow-900);
    --color-bfm-container-credit: var(--color-bfm-purple-900);
    --color-bfm-container-assurance: var(--color-bfm-green-900);
    --color-bfm-container-brand: var(--color-bfm-blue-1200);
    --color-bfm-content-neutral: var(--color-bfm-blue-1200);
    --color-bfm-content-emphasis: var(--color-bfm-gray-1000);
    --color-bfm-content-accent: var(--color-bfm-blue-900);
    --color-bfm-content-on-catchy: var(--color-bfm-white);
    --color-bfm-content-on-accent: var(--color-bfm-white);
    --color-bfm-content-on-epargne: var(--color-bfm-gray-1200);
    --color-bfm-content-on-credit: var(--color-bfm-purple-900);
    --color-bfm-content-on-assurance: var(--color-bfm-green-900);
    --color-bfm-content-on-brand: var(--color-bfm-white);
    --color-bfm-hovered-accent: var(--color-bfm-blue-1000);
    --color-bfm-pressed-accent: var(--color-bfm-blue-1000);
    --color-bfm-hovered-neutral: var(--color-bfm-gray-200);
    --color-bfm-pressed-neutral: var(--color-bfm-gray-300);
    --color-bfm-border-neutral: var(--color-bfm-gray-600);
    --color-bfm-border-emphasis: var(--color-bfm-gray-400);
    --color-bfm-border-accent: var(--color-bfm-blue-900);
    --color-bfm-drawable: var(--color-bfm-red-900);
    --bfm-sizing-0: 0px;
    --bfm-sizing-25: 1px;
    --bfm-sizing-50: 2px;
    --bfm-sizing-75: 4px;
    --bfm-sizing-150: 8px;
    --bfm-sizing-200: 12px;
    --bfm-sizing-250: 16px;
    --bfm-sizing-300: 20px;
    --bfm-sizing-350: 24px;
    --bfm-sizing-400: 32px;
    --bfm-sizing-450: 40px;
    --bfm-sizing-500: 48px;
    --bfm-sizing-550: 64px;
    --bfm-sizing-600: 80px;
    --bfm-sizing-650: 96px;
    --bfm-sizing-700: 128px;
    --bfm-sizing-4xs: var(--bfm-sizing-0);
    --bfm-sizing-3xs: var(--bfm-sizing-25);
    --bfm-sizing-2xs: var(--bfm-sizing-50);
    --bfm-sizing-xs: var(--bfm-sizing-75);
    --bfm-sizing-s: var(--bfm-sizing-150);
    --bfm-sizing-m: var(--bfm-sizing-200);
    --bfm-sizing-l: var(--bfm-sizing-250);
    --bfm-sizing-xl: var(--bfm-sizing-300);
    --bfm-sizing-2xl: var(--bfm-sizing-350);
    --bfm-sizing-3xl: var(--bfm-sizing-400);
    --bfm-sizing-4xl: var(--bfm-sizing-450);
    --bfm-sizing-5xl: var(--bfm-sizing-500);
    --bfm-sizing-6xl: var(--bfm-sizing-550);
    --bfm-sizing-7xl: var(--bfm-sizing-600);
    --bfm-sizing-8xl: var(--bfm-sizing-650);
    --bfm-sizing-9xl: var(--bfm-sizing-700);
    --bfm-spacing-0: 0px;
    --bfm-spacing-50: 2px;
    --bfm-spacing-75: 4px;
    --bfm-spacing-150: 8px;
    --bfm-spacing-200: 12px;
    --bfm-spacing-250: 16px;
    --bfm-spacing-300: 20px;
    --bfm-spacing-350: 24px;
    --bfm-spacing-400: 32px;
    --bfm-spacing-450: 40px;
    --bfm-spacing-500: 48px;
    --bfm-spacing-550: 64px;
    --bfm-spacing-600: 80px;
    --bfm-spacing-650: 96px;
    --bfm-spacing-700: 128px;
    --bfm-spacing-750: 160px;
    --bfm-spacing-4xs: var(--bfm-spacing-0);
    --bfm-spacing-3xs: var(--bfm-spacing-50);
    --bfm-spacing-2xs: var(--bfm-spacing-75);
    --bfm-spacing-xs: var(--bfm-spacing-150);
    --bfm-spacing-s: var(--bfm-spacing-200);
    --bfm-spacing-m: var(--bfm-spacing-250);
    --bfm-spacing-l: var(--bfm-spacing-300);
    --bfm-spacing-xl: var(--bfm-spacing-350);
    --bfm-spacing-2xl: var(--bfm-spacing-400);
    --bfm-spacing-3xl: var(--bfm-spacing-450);
    --bfm-spacing-4xl: var(--bfm-spacing-500);
    --bfm-spacing-5xl: var(--bfm-spacing-550);
    --bfm-spacing-6xl: var(--bfm-spacing-600);
    --bfm-spacing-7xl: var(--bfm-spacing-650);
    --bfm-spacing-8xl: var(--bfm-spacing-700);
    --bfm-spacing-9xl: var(--bfm-spacing-750);
    --bfm-border-radius-0: 0;
    --bfm-border-radius-100: 2px;
    --bfm-border-radius-200: 8px;
    --bfm-border-radius-500: 16px;
    --bfm-border-radius-1000: 999px;
    --bfm-border-radius-none: var(--bfm-border-radius-0);
    --bfm-border-radius-s: var(--bfm-border-radius-100);
    --bfm-border-radius-m: var(--bfm-border-radius-200);
    --bfm-border-radius-l: var(--bfm-border-radius-500);
    --bfm-border-radius-full: var(--bfm-border-radius-1000);
    --bfm-border-width-0: 0;
    --bfm-border-width-100: 1px;
    --bfm-border-width-200: 2px;
    --bfm-border-width-300: 3px;
    --bfm-border-width-400: 4px;
    --bfm-border-width-none: var(--bfm-border-width-0);
    --bfm-border-width-s: var(--bfm-border-width-100);
    --bfm-border-width-m: var(--bfm-border-width-200);
    --bfm-border-width-l: var(--bfm-border-width-300)
}