{ "asset": { "logo": { "path": "{assets.baseUrl}brands/asb/logos", "dark": { "src": "{assets.baseUrl}brands/asb/logos/dark/logo.svg", "xs": { "src": "{assets.baseUrl}brands/asb/logos/dark/logo.svg" } }, "light": { "src": "{assets.baseUrl}brands/asb/logos/light/logo.svg", "xs": { "src": "{assets.baseUrl}brands/asb/logos/light/logo.svg" } } }, "font": { "path": "{assets.baseUrl}fonts" }, "favicon": { "path": "{assets.baseUrl}brands/asb/favicon", "16x16": "{assets.baseUrl}brands/asb/favicon/favicon-16x16.png", "32x32": "{assets.baseUrl}brands/asb/favicon/favicon-32x32.png", "android": { "chrome": { "192x192": "{assets.baseUrl}brands/asb/favicon/android-chrome-192x192.png", "512x512": "{assets.baseUrl}brands/asb/favicon/android-chrome-512x512.png" } }, "appleTouch": "{assets.baseUrl}brands/asb/favicon/apple-touch-icon.png", "ico": "{assets.baseUrl}brands/asb/favicon/favicon.ico", "manifest": "{assets.baseUrl}brands/asb/favicon/site.webmanifest" }, "icon": { "core": { "regular": { "url": "{assets.baseUrl}icons/core/regular/icons.css" }, "light": { "url": "{assets.baseUrl}icons/core/light/icons.css" }, "solid": { "url": "{assets.baseUrl}icons/core/solid/icons.css" } }, "platform": { "url": "{assets.baseUrl}icons/product/icons.css" }, "brand": { "core": { "url": "" }, "platform": { "url": "" }, "url": "" } } }, "brand": { "name": "asb" }, "color": { "background": { "white": "#FFFFFF", "black": "#121212", "primary": "#FFC20E", "primaryLight": "#fffcf3", "secondary": "#706F6F", "secondaryLight": "#f8f8f8", "accent": "#0064AD", "accentLight": "#f2f7fb", "supplementary-1": "#E0E0E0", "supplementary-1Light": "#FDFDFD", "supplementary-2": "#E0E0E0", "supplementary-2Light": "#FDFDFD", "supplementary-3": "#E0E0E0", "supplementary-3Light": "#FDFDFD", "error": "#DA0000", "errorLight": "#FDF2F2", "warning": "#C6501B", "warningLight": "#DD9676", "success": "#47810E", "successLight": "#F6F9F3", "information": "#2D799F", "informationLight": "#81AFC5" }, "border": { "default": "#909194", "light": "#F0F2F7", "focus": "#FFC20E", "primary": "#FFC20E", "primaryLight": "#ffda6e", "secondary": "#706F6F", "secondaryLight": "#a9a9a9", "accent": "#0064AD", "accentLight": "#66a2ce", "supplementary-1": "#E0E0E0", "supplementary-1Light": "#EBEBEB", "supplementary-2": "#E0E0E0", "supplementary-2Light": "#EBEBEB", "supplementary-3": "#E0E0E0", "supplementary-3Light": "#EBEBEB", "error": "#DA0000", "errorLight": "#E96666", "warning": "#C6501B", "warningLight": "#DD9676", "success": "#47810E", "successLight": "#91B36E", "information": "#2D799F", "informationLight": "#81AFC5" }, "foundation": { "primary": { "lighter": "#fffcf3", "light": "#ffda6e", "default": "#FFC20E", "dark": "#997408", "darker": "#332703", "contrast": "#121212", "beside": "#FFFFFF", "neutral": "rgba(255, 255, 255, 0.15)", "block": "#ffda6e", "neutralSolid": "#3E3E3E" }, "secondary": { "lighter": "#f8f8f8", "light": "#a9a9a9", "default": "#706F6F", "dark": "#434343", "darker": "#161616", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#434343", "neutralSolid": "#EFEFEF" }, "accent": { "lighter": "#f2f7fb", "light": "#66a2ce", "default": "#0064AD", "dark": "#003c68", "darker": "#001423", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#003c68", "neutralSolid": "#EFEFEF" }, "supplementary-1": { "lighter": "#FDFDFD", "light": "#EBEBEB", "default": "#E0E0E0", "dark": "#898989", "darker": "#2D2D2D", "contrast": "#121212", "beside": "#FFFFFF", "neutral": "rgba(255, 255, 255, 0.15)", "block": "#EBEBEB", "neutralSolid": "#3E3E3E" }, "supplementary-2": { "lighter": "#FDFDFD", "light": "#EBEBEB", "default": "#E0E0E0", "dark": "#898989", "darker": "#2D2D2D", "contrast": "#121212", "beside": "#FFFFFF", "neutral": "rgba(255, 255, 255, 0.15)", "block": "#EBEBEB", "neutralSolid": "#3E3E3E" }, "supplementary-3": { "lighter": "#FDFDFD", "light": "#EBEBEB", "default": "#E0E0E0", "dark": "#898989", "darker": "#2D2D2D", "contrast": "#121212", "beside": "#FFFFFF", "neutral": "rgba(255, 255, 255, 0.15)", "block": "#EBEBEB", "neutralSolid": "#3E3E3E" }, "link": { "lighter": "#f2f7fb", "light": "#66a2ce", "default": "#0064AD", "dark": "#003c68", "darker": "#001423" }, "neutral": { "white": "#FFFFFF", "grey": "#F0F2F7", "black": "#121212", "lighter": "#FCFCFD", "light": "#F6F7FA", "default": "#F0F2F7", "dark": "#909194", "darker": "#303031", "transparent": "rgba(255, 255, 255, 0)" }, "error": { "lighter": "#FDF2F2", "light": "#E96666", "default": "#DA0000", "dark": "#830000", "darker": "#2C0000", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#AE0000", "neutralSolid": "#EFEFEF" }, "success": { "lighter": "#F6F9F3", "light": "#91B36E", "default": "#47810E", "dark": "#2B4D08", "darker": "#0E1A03", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#39670B", "neutralSolid": "#EFEFEF" }, "warning": { "lighter": "#FCF6F4", "light": "#DD9676", "default": "#C6501B", "dark": "#773010", "darker": "#281005", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#9E4016", "neutralSolid": "#EFEFEF" }, "information": { "lighter": "#F4F8FA", "light": "#81AFC5", "default": "#2D799F", "dark": "#1B495F", "darker": "#091820", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#24617F", "neutralSolid": "#EFEFEF" }, "greyscale": { "default": "#303031", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#606163", "neutralSolid": "#EFEFEF" }, "interactive": { "lighter": "#f2f7fb", "light": "#66a2ce", "default": "#0064AD", "dark": "#003c68", "darker": "#001423", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#003c68", "neutralSolid": "#EFEFEF" }, "button": { "default": { "lighter": "#F5F5F6", "light": "#888B8F", "default": "#383E44", "dark": "#222529", "darker": "#000" }, "primary": { "lighter": "#f2f7fb", "light": "#66a2ce", "default": "#0064AD", "dark": "#003c68", "darker": "#001423", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#003c68" }, "secondary": { "lighter": "#f8f8f8", "light": "#a9a9a9", "default": "#303031", "dark": "#434343", "darker": "#161616", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#121212" }, "accent": { "lighter": "#fffcf3", "light": "#ffda6e", "default": "#FFC20E", "dark": "#997408", "darker": "#332703", "contrast": "#121212", "beside": "#FFFFFF", "neutral": "rgba(255, 255, 255, 0.15)", "block": "#ffda6e" }, "supplementary-1": { "lighter": "#FDFDFD", "light": "#EBEBEB", "default": "#E0E0E0", "dark": "#898989", "darker": "#2D2D2D", "contrast": "#121212", "beside": "#FFFFFF", "neutral": "rgba(255, 255, 255, 0.15)", "block": "#EBEBEB" }, "supplementary-2": { "lighter": "#FDFDFD", "light": "#EBEBEB", "default": "#E0E0E0", "dark": "#898989", "darker": "#2D2D2D", "contrast": "#121212", "beside": "#FFFFFF", "neutral": "rgba(255, 255, 255, 0.15)", "block": "#EBEBEB" }, "supplementary-3": { "lighter": "#FDFDFD", "light": "#EBEBEB", "default": "#E0E0E0", "dark": "#898989", "darker": "#2D2D2D", "contrast": "#121212", "beside": "#FFFFFF", "neutral": "rgba(255, 255, 255, 0.15)", "block": "#EBEBEB" }, "cta-1": { "lighter": "#f2f7fb", "light": "#66a2ce", "default": "#0064AD", "dark": "#003c68", "darker": "#001423", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#003c68" }, "cta-2": { "lighter": "#f2f7fb", "light": "#66a2ce", "default": "#0064AD", "dark": "#003c68", "darker": "#001423", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#003c68" }, "cta-3": { "lighter": "#f8f8f8", "light": "#a9a9a9", "default": "#303031", "dark": "#434343", "darker": "#161616", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#121212" }, "interactive": { "lighter": "#f2f7fb", "light": "#66a2ce", "default": "#0064AD", "dark": "#003c68", "darker": "#001423", "contrast": "#FFFFFF", "beside": "#121212", "neutral": "rgba(0, 0, 0, 0.075)", "block": "#003c68", "neutralSolid": "#3E3E3E" } }, "icon": { "light": "#F6F7FA", "default": "#121212" }, "placeholder": "#6b6b6b" }, "global": { "brand": { "primary": { "50": "#fffcf3", "100": "#fff3cf", "200": "#ffe79f", "300": "#ffda6e", "400": "#ffce3e", "500": "#FFC20E", "600": "#cc9b0b", "700": "#997408", "800": "#664e06", "900": "#332703", "950": "#0d0a01" }, "secondary": { "50": "#f8f8f8", "100": "#e2e2e2", "200": "#c6c5c5", "300": "#a9a9a9", "400": "#8d8c8c", "500": "#706F6F", "600": "#5a5959", "700": "#434343", "800": "#2d2c2c", "900": "#161616", "950": "#060606" }, "accent": { "50": "#f2f7fb", "100": "#cce0ef", "200": "#99c1de", "300": "#66a2ce", "400": "#3383bd", "500": "#0064AD", "600": "#00508a", "700": "#003c68", "800": "#002845", "900": "#001423", "950": "#000509" }, "supplementary-1": { "50": "#FDFDFD", "100": "#F9F9F9", "200": "#F3F3F3", "300": "#EBEBEB", "400": "#E5E5E5", "500": "#E0E0E0", "600": "#BEBEBE", "700": "#898989", "800": "#5A5A5A", "900": "#2D2D2D", "950": "#0B0B0B" }, "supplementary-2": { "50": "#FDFDFD", "100": "#F9F9F9", "200": "#F3F3F3", "300": "#EBEBEB", "400": "#E5E5E5", "500": "#E0E0E0", "600": "#BEBEBE", "700": "#898989", "800": "#5A5A5A", "900": "#2D2D2D", "950": "#0B0B0B" }, "supplementary-3": { "50": "#FDFDFD", "100": "#F9F9F9", "200": "#F3F3F3", "300": "#EBEBEB", "400": "#E5E5E5", "500": "#E0E0E0", "600": "#BEBEBE", "700": "#898989", "800": "#5A5A5A", "900": "#2D2D2D", "950": "#0B0B0B" }, "link": { "50": "#f2f7fb", "100": "#cce0ef", "200": "#99c1de", "300": "#66a2ce", "400": "#3383bd", "500": "#0064AD", "600": "#00508a", "700": "#003c68", "800": "#002845", "900": "#001423", "950": "#000509" } }, "system": { "black": "#121212", "white": "#FFFFFF", "transparent": "rgba(255, 255, 255, 0)", "neutral": { "light": "rgba(255, 255, 255, 0.15)", "dark": "rgba(0, 0, 0, 0.075)", "solid": { "light": "#EFEFEF", "dark": "#3E3E3E" } }, "backdrop": { "dark": "rgba(43, 46, 56, 0.9)", "light": "rgba(255, 255, 255, 0.9)" }, "grey": { "50": "#FEFEFF", "100": "#FCFCFD", "200": "#F9FAFC", "300": "#F6F7FA", "400": "#F3F5F9", "500": "#F0F2F7", "525": "#E4E6EB", "550": "#D8DADE", "575": "#CCCED2", "600": "#C0C2C6", "700": "#909194", "800": "#606163", "900": "#303031", "950": "#0C0C0C" }, "red": { "50": "#FDF2F2", "100": "#F8CCCC", "200": "#F09999", "300": "#E96666", "400": "#E13333", "500": "#DA0000", "600": "#AE0000", "700": "#830000", "800": "#570000", "900": "#2C0000", "950": "#0B0000" }, "green": { "50": "#F6F9F3", "100": "#DAE6CF", "200": "#B5CD9F", "300": "#91B36E", "400": "#6C9A3E", "500": "#47810E", "600": "#39670B", "700": "#2B4D08", "800": "#1C3406", "900": "#0E1A03", "950": "#040601" }, "orange": { "50": "#FCF6F4", "100": "#F4DCD1", "200": "#E8B9A4", "300": "#DD9676", "400": "#D17349", "500": "#C6501B", "600": "#9E4016", "700": "#773010", "800": "#4F200B", "900": "#281005", "950": "#0A0401" }, "blue": { "50": "#F4F8FA", "100": "#D5E4EC", "200": "#ABC9D9", "300": "#81AFC5", "400": "#5794B2", "500": "#2D799F", "600": "#24617F", "700": "#1B495F", "800": "#123040", "900": "#091820", "950": "#020608" } } }, "interactive": { "default": { "backgroundColor": "#FFFFFF", "borderColor": "#121212", "color": "#121212", "icon": "#0064AD" }, "hover": { "backgroundColor": "#EFEFEF", "borderColor": "#0064AD", "color": "#121212", "icon": "#0064AD" }, "checked": { "backgroundColor": "#0064AD", "borderColor": "#0064AD", "color": "#FFFFFF", "icon": "#FFFFFF" }, "checkedFocus": { "backgroundColor": "#0064AD", "borderColor": "#0064AD", "color": "#FFFFFF", "icon": "#FFFFFF" }, "focus": { "backgroundColor": "#FFFFFF", "borderColor": "#0064AD", "color": "#121212", "icon": "#0064AD" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#909194", "color": "#909194", "icon": "#909194" }, "error": { "backgroundColor": "#FFFFFF", "borderColor": "#DA0000", "color": "#121212", "icon": "#121212" }, "success": { "backgroundColor": "#FFFFFF", "borderColor": "#47810E", "color": "#121212", "icon": "#121212" } }, "text": { "heading": "#121212", "headline": "#121212", "body": "#121212", "subheading": "#121212", "default": "#121212", "white": "#FFFFFF", "black": "#121212", "light": "#303031", "disabled": "#909194", "primary": "#FFC20E", "primaryLight": "#ffda6e", "secondary": "#706F6F", "secondaryLight": "#a9a9a9", "accent": "#0064AD", "accentLight": "#66a2ce", "supplementary-1": "#E0E0E0", "supplementary-1Light": "#EBEBEB", "supplementary-2": "#E0E0E0", "supplementary-2Light": "#EBEBEB", "supplementary-3": "#E0E0E0", "supplementary-3Light": "#EBEBEB", "error": "#DA0000", "warning": "#C6501B", "success": "#47810E", "information": "#2D799F", "placeholder": "#6b6b6b" } }, "grid": { "breakpoint": { "sm": "576px", "md": "768px", "lg": "992px", "xl": "1200px" }, "maxWidth": { "xs": "100%", "sm": "960px", "md": "960px", "lg": "960px", "xl": "1140px" } }, "typography": { "primary": { "url": "'https://fonts.googleapis.com/css2?family=Overpass:wght@300;400;700;900&display=swap'", "fontFamily": "Overpass, sans-serif" }, "secondary": { "url": "'https://fonts.googleapis.com/css2?family=Overpass:wght@300;400;700;900&display=swap'", "fontFamily": "Overpass, sans-serif" }, "tertiary": { "url": "'https://fonts.googleapis.com/css2?family=Overpass:wght@300;400;700;900&display=swap'", "fontFamily": "Overpass, sans-serif" }, "heading": { "fontFamily": "Overpass, sans-serif", "fontWeight": "600", "color": "#121212", "lineHeight": "1.25", "url": "'https://fonts.googleapis.com/css2?family=Overpass:wght@300;400;700;900&display=swap'", "h1": { "color": "#121212", "fontSize": { "xs": "1.625rem", "sm": "1.75rem", "md": "1.875rem", "lg": "2rem" }, "lineHeight": { "xs": "1.3", "sm": "1.3", "md": "1.3", "lg": "1.3" } }, "h2": { "color": "#121212", "fontSize": { "xs": "1.375rem", "sm": "1.5rem", "md": "1.625rem", "lg": "1.75rem" }, "lineHeight": { "xs": "1.35", "sm": "1.35", "md": "1.3", "lg": "1.3" } }, "h3": { "color": "#121212", "fontSize": { "xs": "1.25rem", "sm": "1.25rem", "md": "1.375rem", "lg": "1.5rem" }, "lineHeight": { "xs": "1.4", "sm": "1.4", "md": "1.35", "lg": "1.35" } }, "h4": { "color": "#121212", "fontSize": { "xs": "1.125rem", "sm": "1.125rem", "md": "1.125rem", "lg": "1.25rem" }, "lineHeight": { "xs": "1.45", "sm": "1.45", "md": "1.45", "lg": "1.4" } }, "h5": { "color": "#121212", "fontSize": { "xs": "1rem", "sm": "1rem", "md": "1rem", "lg": "1rem" }, "lineHeight": { "xs": "1.5", "sm": "1.5", "md": "1.5", "lg": "1.5" } }, "h6": { "color": "#121212", "fontSize": { "xs": ".875rem", "sm": ".875rem", "md": ".875rem", "lg": ".875rem" }, "lineHeight": { "xs": "1.5", "sm": "1.5", "md": "1.5", "lg": "1.5" } } }, "headline": { "fontFamily": "Overpass, sans-serif", "fontWeight": "600", "url": "'https://fonts.googleapis.com/css2?family=Overpass:wght@300;400;700;900&display=swap'", "color": "#121212", "fontSize": { "xs": "1.875rem", "sm": "2.125rem", "md": "2.375rem", "lg": "2.625rem" }, "lineHeight": { "xs": "1.3", "sm": "1.3", "md": "1.3", "lg": "1.3" }, "compact": { "fontSize": { "xs": "1.75rem", "sm": "1.875rem", "md": "2rem", "lg": "2.25rem" }, "lineHeight": { "xs": "1.3", "sm": "1.3", "md": "1.3", "lg": "1.3" } } }, "body": { "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "color": "#121212", "url": "'https://fonts.googleapis.com/css2?family=Overpass:wght@300;400;700;900&display=swap'", "lineHeight": "1.5" }, "subheading": { "fontFamily": "Overpass, sans-serif", "fontWeight": "400", "url": "'https://fonts.googleapis.com/css2?family=Overpass:wght@300;400;700;900&display=swap'", "color": "#121212", "fontSize": { "xs": "1.125rem", "sm": "1.125rem", "md": "1.25rem", "lg": "1.25rem" }, "lineHeight": { "xs": "1.45", "sm": "1.45", "md": "1.4", "lg": "1.4" } } }, "borderRadius": { "0": "0", "100": "2px", "200": "4px", "300": "8px", "400": "12px", "500": "16px", "550": "24px", "600": "32px", "650": "40px", "700": "48px", "750": "56px", "800": "64px", "850": "72px", "900": "80px", "950": "88px", "1000": "96px" }, "borderWidth": { "0": "0", "100": "1px", "200": "2px", "400": "4px", "800": "8px" }, "boxShadow": { "100": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px", "200": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px", "300": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px", "400": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px" }, "fontSize": { "100": "0.75rem", "200": "0.875rem", "300": "1rem", "400": "1.125rem", "500": "1.25rem", "600": "1.5rem", "700": "1.75rem", "800": "2.375rem", "900": "3.25rem", "1000": "4rem" }, "fontWeight": { "100": "100", "200": "200", "300": "300", "400": "400", "500": "500", "600": "600", "700": "700", "800": "800", "900": "900" }, "lineHeight": { "100": "1.25", "200": "1.5", "300": "1.65", "auto": "auto", "none": "1" }, "spacing": { "0": "0", "100": "4px", "200": "8px", "300": "12px", "400": "16px", "500": "20px", "600": "24px", "700": "32px", "800": "40px", "900": "48px", "1000": "56px", "1100": "64px", "1200": "80px", "1300": "96px", "1400": "112px", "1500": "128px" }, "accordion": { "fontFamily": "Overpass, sans-serif", "border": "1px solid #0064AD", "borderRadius": "0", "padding": "0.75rem 0 0.75rem 0.75rem", "spacing": "0", "button": { "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "700", "color": "#121212", "backgroundColor": "transparent", "icon": { "color": "#0064AD", "fontSize": "1.25rem", "marginRight": "12px" }, "hover": { "color": "#121212", "backgroundColor": "rgba(0, 0, 0, 0.075)", "icon": { "color": "#0064AD" } }, "focus": { "color": "#121212", "backgroundColor": "transparent", "icon": { "color": "#0064AD" }, "boxShadow": "inset 0 0 0 2px #fff,inset 0 0 0 4px #FFC20E,inset 0 0 #FFC20E" } }, "selected": { "color": "#121212" }, "content": { "backgroundColor": "transparent", "color": "#121212", "marginbottom": "0", "padding": "0.75rem" }, "inverse": { "border": "1px solid #f2f7fb", "button": { "backgroundColor": "transparent", "color": "#FFFFFF", "icon": { "color": "#F6F7FA" }, "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "color": "#FFFFFF", "icon": { "color": "#F6F7FA" } }, "focus": { "backgroundColor": "transparent", "color": "#FFFFFF", "icon": { "color": "#F6F7FA" } }, "selected": { "color": "#FFFFFF" } }, "content": { "backgroundColor": "transparent", "color": "#FFFFFF" } } }, "alert": { "fontSize": "1rem", "lineheight": "1.5", "borderWidth": "1px", "borderRadius": "0", "color": "#121212", "padding": "16px", "heading": { "fontFamily": "Overpass, sans-serif", "fontWeight": "600", "fontSize": "1rem", "color": "#121212" }, "icon": { "color": "#121212" }, "information": { "backgroundColor": "#F4F8FA", "borderColor": "#F4F8FA", "icon": { "color": "#2D799F" } }, "success": { "backgroundColor": "#F6F9F3", "borderColor": "#F6F9F3", "icon": { "color": "#47810E" } }, "warning": { "backgroundColor": "#FCF6F4", "borderColor": "#FCF6F4", "icon": { "color": "#C6501B" } }, "error": { "backgroundColor": "#FDF2F2", "borderColor": "#FDF2F2", "icon": { "color": "#DA0000" } }, "focus": { "outline": "2px solid #121212" } }, "autocomplete": { "color": "#121212", "border": "1px solid #121212", "backgroundColor": "#FFFFFF", "fontSize": "1rem", "fontFamily": "Overpass, sans-serif", "icon": { "color": "#121212" }, "button": { "color": "#121212", "clear": { "backgroundColor": "#FFFFFF" }, "hover": { "backgroundColor": "#EFEFEF", "color": "#121212" }, "focus": { "backgroundColor": "#EFEFEF", "color": "#121212" }, "error": { "borderColor": "#DA0000", "outline": "#DA0000" } }, "success": { "borderColor": "#47810E", "outline": "#47810E" } }, "badge": { "backgroundColor": "#303031", "borderColor": "#303031", "borderRadius": "0.25rem", "borderWidth": "1px", "color": "#FFFFFF", "fontFamily": "Overpass, sans-serif", "fontSize": "0.875rem", "fontWeight": "400", "padding": "0.15rem 0.5rem", "light": { "color": "#121212", "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7" }, "lighter": { "color": "#121212", "backgroundColor": "#F6F7FA", "borderColor": "#F6F7FA" }, "outline": { "color": "#303031", "backgroundColor": "transparent", "borderColor": "#303031" }, "text": { "color": "#303031", "backgroundColor": "transparent", "borderColor": "transparent" }, "inverse": { "color": "#FFC20E", "backgroundColor": "#121212", "borderColor": "#121212" }, "outlineInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "#FFFFFF" }, "textInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "transparent" }, "primary": { "color": "#121212", "backgroundColor": "#FFC20E", "borderColor": "#FFC20E" }, "primaryLight": { "color": "#121212", "backgroundColor": "#ffda6e", "borderColor": "#ffda6e" }, "primaryLighter": { "color": "#121212", "backgroundColor": "#fffcf3", "borderColor": "#fffcf3" }, "primaryOutline": { "color": "#FFC20E", "backgroundColor": "transparent", "borderColor": "#FFC20E" }, "primaryText": { "color": "#FFC20E", "backgroundColor": "transparent", "borderColor": "transparent" }, "primaryInverse": { "color": "#FFC20E", "backgroundColor": "#121212", "borderColor": "#121212" }, "primaryOutlineInverse": { "color": "#121212", "backgroundColor": "transparent", "borderColor": "#121212" }, "primaryTextInverse": { "color": "#121212", "backgroundColor": "transparent", "borderColor": "transparent" }, "secondary": { "color": "#FFFFFF", "backgroundColor": "#706F6F", "borderColor": "#706F6F" }, "secondaryLight": { "color": "#121212", "backgroundColor": "#a9a9a9", "borderColor": "#a9a9a9" }, "secondaryLighter": { "color": "#121212", "backgroundColor": "#f8f8f8", "borderColor": "#f8f8f8" }, "secondaryOutline": { "color": "#706F6F", "backgroundColor": "transparent", "borderColor": "#706F6F" }, "secondaryText": { "color": "#706F6F", "backgroundColor": "transparent", "borderColor": "transparent" }, "secondaryInverse": { "color": "#706F6F", "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "secondaryOutlineInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "#FFFFFF" }, "secondaryTextInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "transparent" }, "accent": { "color": "#FFFFFF", "backgroundColor": "#0064AD", "borderColor": "#0064AD" }, "accentLight": { "color": "#121212", "backgroundColor": "#66a2ce", "borderColor": "#66a2ce" }, "accentLighter": { "color": "#121212", "backgroundColor": "#f2f7fb", "borderColor": "#f2f7fb" }, "accentOutline": { "color": "#0064AD", "backgroundColor": "transparent", "borderColor": "#0064AD" }, "accentText": { "color": "#0064AD", "backgroundColor": "transparent", "borderColor": "transparent" }, "accentInverse": { "color": "#0064AD", "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "accentOutlineInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "#FFFFFF" }, "accentTextInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "transparent" }, "information": { "color": "#FFFFFF", "backgroundColor": "#2D799F", "borderColor": "#2D799F" }, "informationLight": { "color": "#121212", "backgroundColor": "#81AFC5", "borderColor": "#81AFC5" }, "informationLighter": { "color": "#121212", "backgroundColor": "#F4F8FA", "borderColor": "#F4F8FA" }, "informationOutline": { "color": "#2D799F", "backgroundColor": "transparent", "borderColor": "#2D799F" }, "informationText": { "color": "#2D799F", "backgroundColor": "transparent", "borderColor": "transparent" }, "informationInverse": { "color": "#2D799F", "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "informationOutlineInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "#FFFFFF" }, "informationTextInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "transparent" }, "success": { "color": "#FFFFFF", "backgroundColor": "#47810E", "borderColor": "#47810E" }, "successLight": { "color": "#121212", "backgroundColor": "#91B36E", "borderColor": "#91B36E" }, "successLighter": { "color": "#121212", "backgroundColor": "#F6F9F3", "borderColor": "#F6F9F3" }, "successOutline": { "color": "#47810E", "backgroundColor": "transparent", "borderColor": "#47810E" }, "successText": { "color": "#47810E", "backgroundColor": "transparent", "borderColor": "transparent" }, "successInverse": { "color": "#47810E", "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "successOutlineInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "#FFFFFF" }, "successTextInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "transparent" }, "warning": { "color": "#FFFFFF", "backgroundColor": "#C6501B", "borderColor": "#C6501B" }, "warningLight": { "color": "#121212", "backgroundColor": "#DD9676", "borderColor": "#DD9676" }, "warningLighter": { "color": "#121212", "backgroundColor": "#FCF6F4", "borderColor": "#FCF6F4" }, "warningOutline": { "color": "#C6501B", "backgroundColor": "transparent", "borderColor": "#C6501B" }, "warningText": { "color": "#C6501B", "backgroundColor": "transparent", "borderColor": "transparent" }, "warningInverse": { "color": "#C6501B", "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "warningOutlineInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "#FFFFFF" }, "warningTextInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "transparent" }, "error": { "color": "#FFFFFF", "backgroundColor": "#DA0000", "borderColor": "#DA0000" }, "errorLight": { "color": "#121212", "backgroundColor": "#E96666", "borderColor": "#E96666" }, "errorLighter": { "color": "#121212", "backgroundColor": "#FDF2F2", "borderColor": "#FDF2F2" }, "errorOutline": { "color": "#DA0000", "backgroundColor": "transparent", "borderColor": "#DA0000" }, "errorText": { "color": "#DA0000", "backgroundColor": "transparent", "borderColor": "transparent" }, "errorInverse": { "color": "#DA0000", "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "errorOutlineInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "#FFFFFF" }, "errorTextInverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "borderColor": "transparent" }, "supplementary-1": { "color": "#121212", "backgroundColor": "#E0E0E0", "borderColor": "#E0E0E0" }, "supplementary-1Light": { "color": "#121212", "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB" }, "supplementary-1Lighter": { "color": "#121212", "backgroundColor": "#FDFDFD", "borderColor": "#FDFDFD" }, "supplementary-1Outline": { "color": "#E0E0E0", "backgroundColor": "transparent", "borderColor": "#E0E0E0" }, "supplementary-1Text": { "color": "#E0E0E0", "backgroundColor": "transparent", "borderColor": "transparent" }, "supplementary-1Inverse": { "color": "#E0E0E0", "backgroundColor": "#121212", "borderColor": "#121212" }, "supplementary-1OutlineInverse": { "color": "#121212", "backgroundColor": "transparent", "borderColor": "#121212" }, "supplementary-1TextInverse": { "color": "#121212", "backgroundColor": "transparent", "borderColor": "transparent" }, "supplementary-2": { "color": "#121212", "backgroundColor": "#E0E0E0", "borderColor": "#E0E0E0" }, "supplementary-2Light": { "color": "#121212", "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB" }, "supplementary-2Lighter": { "color": "#121212", "backgroundColor": "#FDFDFD", "borderColor": "#FDFDFD" }, "supplementary-2Outline": { "color": "#E0E0E0", "backgroundColor": "transparent", "borderColor": "#E0E0E0" }, "supplementary-2Text": { "color": "#E0E0E0", "backgroundColor": "transparent", "borderColor": "transparent" }, "supplementary-2Inverse": { "color": "#E0E0E0", "backgroundColor": "#121212", "borderColor": "#121212" }, "supplementary-2OutlineInverse": { "color": "#121212", "backgroundColor": "transparent", "borderColor": "#121212" }, "supplementary-2TextInverse": { "color": "#121212", "backgroundColor": "transparent", "borderColor": "transparent" }, "supplementary-3": { "color": "#121212", "backgroundColor": "#E0E0E0", "borderColor": "#E0E0E0" }, "supplementary-3Light": { "color": "#121212", "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB" }, "supplementary-3Lighter": { "color": "#121212", "backgroundColor": "#FDFDFD", "borderColor": "#FDFDFD" }, "supplementary-3Outline": { "color": "#E0E0E0", "backgroundColor": "transparent", "borderColor": "#E0E0E0" }, "supplementary-3Text": { "color": "#E0E0E0", "backgroundColor": "transparent", "borderColor": "transparent" }, "supplementary-3Inverse": { "color": "#E0E0E0", "backgroundColor": "#121212", "borderColor": "#121212" }, "supplementary-3OutlineInverse": { "color": "#121212", "backgroundColor": "transparent", "borderColor": "#121212" }, "supplementary-3TextInverse": { "color": "#121212", "backgroundColor": "transparent", "borderColor": "transparent" } }, "banner": { "backgroundColor": "#121212", "color": "#121212", "primary": { "backgroundColor": "#FFC20E", "color": "#121212" }, "secondary": { "backgroundColor": "#706F6F", "color": "#FFFFFF" }, "accent": { "backgroundColor": "#0064AD", "color": "#FFFFFF" } }, "buttonGroup": { "marginRight": "0.5rem", "marginBottom": "1rem" }, "button": { "accent": { "backgroundColor": "#FFC20E", "borderColor": "#FFC20E", "color": "#121212", "hover": { "backgroundColor": "#ffda6e", "borderColor": "#ffda6e", "color": "#121212" }, "active": { "backgroundColor": "#ffda6e", "borderColor": "#ffda6e", "color": "#121212" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #FFC20E" } }, "accentOutline": { "backgroundColor": "transparent", "borderColor": "#FFC20E", "color": "#FFC20E", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "#FFC20E", "color": "#FFC20E" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "#FFC20E", "color": "#FFC20E" } }, "accentText": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#FFC20E", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "rgba(255, 255, 255, 0.15)", "color": "#FFC20E" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "rgba(255, 255, 255, 0.15)", "color": "#FFC20E" } }, "accentInverse": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFC20E", "hover": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212" }, "active": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212" }, "focus": { "outline": "2px solid #121212" } }, "accentOutlineInverse": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFC20E" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFC20E" } }, "accentTextInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#121212", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFC20E" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFC20E" } }, "cta-1": { "backgroundColor": "#0064AD", "borderColor": "#0064AD", "color": "#FFFFFF", "hover": { "backgroundColor": "#003c68", "borderColor": "#003c68", "color": "#FFFFFF" }, "active": { "backgroundColor": "#003c68", "borderColor": "#003c68", "color": "#FFFFFF" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #0064AD" } }, "cta-2": { "backgroundColor": "transparent", "borderColor": "#0064AD", "color": "#0064AD", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#0064AD", "color": "#0064AD" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#0064AD", "color": "#0064AD" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #0064AD" } }, "cta-3": { "backgroundColor": "#303031", "borderColor": "#303031", "color": "#FFFFFF", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFFFFF" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFFFFF" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #303031" } }, "default": { "backgroundColor": "#383E44", "borderColor": "#383E44", "color": "#F5F5F6", "hover": { "backgroundColor": "#222529", "borderColor": "#222529", "color": "#F5F5F6" }, "active": { "backgroundColor": "#F5F5F6", "borderColor": "#383E44", "color": "#383E44" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #383E44" } }, "defaultOutline": { "backgroundColor": "transparent", "borderColor": "#383E44", "color": "#383E44", "hover": { "backgroundColor": "#F5F5F6", "borderColor": "#383E44", "color": "#383E44" }, "active": { "backgroundColor": "#383E44", "borderColor": "#383E44", "color": "#F5F5F6" } }, "defaultText": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#383E44", "hover": { "backgroundColor": "#F5F5F6", "borderColor": "#F5F5F6", "color": "#383E44" }, "active": { "backgroundColor": "#383E44", "borderColor": "#383E44", "color": "#F5F5F6" } }, "defaultInverse": { "backgroundColor": "#F5F5F6", "borderColor": "#F5F5F6", "color": "#383E44", "hover": { "backgroundColor": "#383E44", "borderColor": "#383E44", "color": "#F5F5F6" }, "active": { "backgroundColor": "#F5F5F6", "borderColor": "#F5F5F6", "color": "#383E44" }, "focus": { "outline": "2px solid #F5F5F6" } }, "defaultOutlineInverse": { "backgroundColor": "transparent", "borderColor": "#F5F5F6", "color": "#F5F5F6", "hover": { "backgroundColor": "#F5F5F6", "borderColor": "#F5F5F6", "color": "#383E44" }, "active": { "backgroundColor": "#888B8F", "borderColor": "#888B8F", "color": "#F5F5F6" } }, "defaultTextInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#F5F5F6", "hover": { "backgroundColor": "#F5F5F6", "borderColor": "#F5F5F6", "color": "#383E44" }, "active": { "backgroundColor": "#888B8F", "borderColor": "#888B8F", "color": "#F5F5F6" } }, "destructive": { "backgroundColor": "#DA0000", "borderColor": "#DA0000", "color": "#FFFFFF", "hover": { "backgroundColor": "#AE0000", "borderColor": "#AE0000", "color": "#FFFFFF" }, "active": { "backgroundColor": "#AE0000", "borderColor": "#AE0000", "color": "#FFFFFF" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #DA0000" } }, "destructiveOutline": { "backgroundColor": "transparent", "borderColor": "#DA0000", "color": "#DA0000", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#DA0000", "color": "#DA0000" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#DA0000", "color": "#DA0000" } }, "destructiveText": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#DA0000", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "rgba(0, 0, 0, 0.075)", "color": "#DA0000" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "rgba(0, 0, 0, 0.075)", "color": "#DA0000" } }, "destructiveInverse": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#DA0000", "hover": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF" }, "active": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF" }, "focus": { "outline": "2px solid #FFFFFF" } }, "destructiveOutlineInverse": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF", "hover": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#DA0000" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#DA0000" } }, "destructiveTextInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#FFFFFF", "hover": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#DA0000" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#DA0000" } }, "height": "48px", "fontFamily": "Overpass, sans-serif", "borderRadius": "2px", "borderWidth": "1px", "fontWeight": "700", "fontSize": "1rem", "textTransform": "none", "paddingRight": "1.5rem", "paddingLeft": "1.5rem", "transition": "background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease", "interactive": { "backgroundColor": "#0064AD", "borderColor": "#0064AD", "color": "#FFFFFF", "hover": { "backgroundColor": "#003c68", "borderColor": "#003c68", "color": "#FFFFFF" }, "active": { "backgroundColor": "#003c68", "borderColor": "#003c68", "color": "#FFFFFF" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #0064AD" } }, "interactiveOutline": { "backgroundColor": "transparent", "borderColor": "#0064AD", "color": "#0064AD", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#0064AD", "color": "#0064AD" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#0064AD", "color": "#0064AD" } }, "interactiveText": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#0064AD", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "rgba(0, 0, 0, 0.075)", "color": "#0064AD" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "rgba(0, 0, 0, 0.075)", "color": "#0064AD" } }, "interactiveInverse": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD", "hover": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF" }, "active": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF" }, "focus": { "outline": "2px solid #FFFFFF" } }, "interactiveOutlineInverse": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF", "hover": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD" } }, "interactiveTextInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#FFFFFF", "hover": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD" } }, "link": { "color": "#0064AD", "backgroundColor": "transparent", "borderRadius": "0", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "color": "#0064AD" }, "focus": { "backgroundColor": "transparent", "color": "#0064AD" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "color": "#0064AD" }, "disabled": { "backgroundColor": "#f2f7fb", "color": "#66a2ce" } }, "linkInverse": { "backgroundColor": "transparent", "color": "#FFFFFF", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "color": "#FFFFFF" }, "focus": { "backgroundColor": "transparent", "color": "#FFFFFF" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "color": "#FFFFFF" }, "disabled": { "backgroundColor": "#f2f7fb", "color": "#66a2ce" } }, "primary": { "backgroundColor": "#0064AD", "borderColor": "#0064AD", "color": "#FFFFFF", "hover": { "backgroundColor": "#003c68", "borderColor": "#003c68", "color": "#FFFFFF" }, "active": { "backgroundColor": "#003c68", "borderColor": "#003c68", "color": "#FFFFFF" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #0064AD" } }, "primaryOutline": { "backgroundColor": "transparent", "borderColor": "#0064AD", "color": "#0064AD", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#0064AD", "color": "#0064AD" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#0064AD", "color": "#0064AD" } }, "primaryText": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#0064AD", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "rgba(0, 0, 0, 0.075)", "color": "#0064AD" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "rgba(0, 0, 0, 0.075)", "color": "#0064AD" } }, "primaryInverse": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD", "hover": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF" }, "active": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF" }, "focus": { "outline": "2px solid #FFFFFF" } }, "primaryOutlineInverse": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF", "hover": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD" } }, "primaryTextInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#FFFFFF", "hover": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#0064AD" } }, "secondary": { "backgroundColor": "#303031", "borderColor": "#303031", "color": "#FFFFFF", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFFFFF" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#FFFFFF" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #303031" } }, "secondaryOutline": { "backgroundColor": "transparent", "borderColor": "#303031", "color": "#303031", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#303031", "color": "#303031" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "#303031", "color": "#303031" } }, "secondaryText": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#303031", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "rgba(0, 0, 0, 0.075)", "color": "#303031" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "borderColor": "rgba(0, 0, 0, 0.075)", "color": "#303031" } }, "secondaryInverse": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#303031", "hover": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF" }, "active": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF" }, "focus": { "outline": "2px solid #FFFFFF" } }, "secondaryOutlineInverse": { "backgroundColor": "transparent", "borderColor": "#FFFFFF", "color": "#FFFFFF", "hover": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#303031" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#303031" } }, "secondaryTextInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#FFFFFF", "hover": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#303031" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF", "color": "#303031" } }, "size": { "xs": { "fontSize": "1rem", "padding": "0 0.5rem", "height": "2rem" }, "sm": { "fontSize": "1rem", "padding": "0 0.75rem", "height": "2.25rem" }, "md": { "fontSize": "1rem", "padding": "0 1rem", "height": "2.5rem" }, "lg": { "fontSize": "1rem", "padding": "0 1.25rem", "height": "2.75rem" } }, "supplementary-1": { "backgroundColor": "#E0E0E0", "borderColor": "#E0E0E0", "color": "#121212", "hover": { "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB", "color": "#121212" }, "active": { "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB", "color": "#121212" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #E0E0E0" }, "outline": { "backgroundColor": "transparent", "borderColor": "#E0E0E0", "color": "#E0E0E0", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "#E0E0E0", "color": "#E0E0E0" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "#E0E0E0", "color": "#E0E0E0" } }, "text": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#E0E0E0", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "rgba(255, 255, 255, 0.15)", "color": "#E0E0E0" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "rgba(255, 255, 255, 0.15)", "color": "#E0E0E0" } }, "inverse": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0", "hover": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212" }, "active": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212" }, "focus": { "outline": "2px solid #E0E0E0" } }, "outlineInverse": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" } }, "textInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#121212", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" } } }, "supplementary-2": { "backgroundColor": "#E0E0E0", "borderColor": "#E0E0E0", "color": "#121212", "hover": { "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB", "color": "#121212" }, "active": { "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB", "color": "#121212" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #E0E0E0" }, "outline": { "backgroundColor": "transparent", "borderColor": "#E0E0E0", "color": "#E0E0E0", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "#E0E0E0", "color": "#E0E0E0" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "#E0E0E0", "color": "#E0E0E0" } }, "text": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#E0E0E0", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "rgba(255, 255, 255, 0.15)", "color": "#E0E0E0" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "rgba(255, 255, 255, 0.15)", "color": "#E0E0E0" } }, "inverse": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0", "hover": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212" }, "active": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212" }, "focus": { "outline": "2px solid #E0E0E0" } }, "outlineInverse": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" } }, "textInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#121212", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" } } }, "supplementary-3": { "backgroundColor": "#E0E0E0", "borderColor": "#E0E0E0", "color": "#121212", "hover": { "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB", "color": "#121212" }, "active": { "backgroundColor": "#EBEBEB", "borderColor": "#EBEBEB", "color": "#121212" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#F0F2F7", "color": "#909194" }, "focus": { "outline": "2px solid #E0E0E0" }, "outline": { "backgroundColor": "transparent", "borderColor": "#E0E0E0", "color": "#E0E0E0", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "#E0E0E0", "color": "#E0E0E0" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "#E0E0E0", "color": "#E0E0E0" } }, "text": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#E0E0E0", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "rgba(255, 255, 255, 0.15)", "color": "#E0E0E0" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "borderColor": "rgba(255, 255, 255, 0.15)", "color": "#E0E0E0" } }, "inverse": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0", "hover": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212" }, "active": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212" }, "focus": { "outline": "2px solid #E0E0E0" } }, "outlineInverse": { "backgroundColor": "transparent", "borderColor": "#121212", "color": "#121212", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" } }, "textInverse": { "backgroundColor": "transparent", "borderColor": "transparent", "color": "#121212", "hover": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" }, "active": { "backgroundColor": "#121212", "borderColor": "#121212", "color": "#E0E0E0" } } } }, "checkbox": { "input": { "size": "24px", "borderWidth": "2px", "borderRadius": "2px", "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#121212" }, "inner": { "borderColor": "#FFFFFF" } }, "label": { "color": "#121212", "padding": "0.625rem 0.5rem 0.625rem 2.25rem", "backgroundColor": "transparent", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400" }, "hover": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#0064AD" }, "inner": { "borderColor": "#FFFFFF" } }, "label": { "color": "#121212", "backgroundColor": "rgba(0, 0, 0, 0.075)" } }, "focus": { "input": { "outline": "2px solid #121212" } }, "error": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#DA0000" }, "inner": { "borderColor": "#FFFFFF" } } }, "disabled": { "input": { "outer": { "backgroundColor": "#F0F2F7", "borderColor": "#909194" }, "inner": { "borderColor": "#909194" } }, "label": { "color": "#909194" } }, "checked": { "input": { "outer": { "backgroundColor": "#0064AD", "borderColor": "#0064AD" }, "inner": { "borderColor": "#FFFFFF" } }, "label": { "color": "#121212", "fontWeight": "700" } }, "outline": { "input": { "size": "24px", "borderWidth": "2px", "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#121212" }, "inner": { "borderColor": "#FFFFFF" } }, "label": { "borderWidth": "1px", "borderColor": "#121212", "padding": "1rem 1rem 1rem 3.2rem", "backgroundColor": "#FFFFFF", "color": "#121212", "borderRadius": "2px" }, "hover": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#0064AD" }, "inner": { "borderColor": "#FFFFFF" } }, "label": { "color": "#121212", "borderColor": "#0064AD", "backgroundColor": "#EFEFEF" } }, "focus": { "label": { "outline": "2px solid #121212" } }, "error": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#DA0000" }, "inner": { "borderColor": "#FFFFFF" } }, "label": { "borderColor": "#DA0000" } }, "disabled": { "input": { "outer": { "backgroundColor": "#F0F2F7", "borderColor": "#909194" }, "inner": { "borderColor": "#909194" } }, "label": { "color": "#909194", "borderColor": "#909194", "backgroundColor": "#F0F2F7" } }, "checked": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "inner": { "borderColor": "#0064AD" } }, "label": { "color": "#FFFFFF", "backgroundColor": "#0064AD", "borderColor": "#0064AD" } } } }, "consentBanner": { "backgroundColor": "#FFFFFF", "borderRadius": "24px", "boxShadow": "rgba(0, 0, 0, 0.3) 0px 3px 12px", "closeButton": { "icon": { "color": "#121212" }, "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "icon": { "color": "#121212" } } }, "margin": { "xs": { "default": "8px", "bottom": "16px" }, "sm": { "default": "8px", "bottom": "16px" }, "md": { "default": "16px", "bottom": "16px" }, "lg": { "default": "16px", "bottom": "16px" } }, "maxWidth": { "xs": "100%", "sm": "100%", "md": "100%", "lg": "1140px" }, "padding": "24px 32px 24px 24px" }, "container": { "maxWidth": { "xs": "100%", "sm": "960px", "md": "960px", "lg": "960px", "xl": "1140px" }, "padding": { "xs": "0 1rem", "sm": "0 1rem", "md": "0 1rem", "lg": "0 1rem", "xl": "0 1rem" } }, "datepicker": { "height": "48px", "focus": { "borderColor": "#005FCC" }, "color": "#121212", "border": "1px solid #121212", "borderRadius": "2px", "backgroundColor": "#FFFFFF", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "padding": "11px 11px 9px", "hover": { "backgroundColor": "#EFEFEF", "borderColor": "#0064AD", "color": "#121212" }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#909194", "color": "#909194" }, "error": { "borderColor": "#DA0000" }, "success": { "borderColor": "#47810E" }, "calendar": { "backgroundColor": "#FFFFFF", "boxShadow": "0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12)", "icon": { "color": "#0064AD" }, "month": { "color": "#121212" }, "week": { "color": "#121212" }, "day": { "color": "#121212", "hover": { "backgroundColor": "#EFEFEF" }, "selected": { "backgroundColor": "#0064AD", "borderColor": "#0064AD", "color": "#FFFFFF" }, "current": { "borderColor": "#606163" } }, "navButton": { "color": "#0064AD" }, "year": { "color": "#121212", "hover": { "backgroundColor": "#EFEFEF" }, "selected": { "backgroundColor": "#0064AD", "borderColor": "#0064AD", "color": "#FFFFFF" }, "current": { "borderColor": "#606163" } } }, "placeholder": { "color": "#6b6b6b" } }, "divider": { "borderColor": "#909194", "borderWidth": "1px", "color": "#121212", "inverse": { "borderColor": "#FFFFFF", "color": "#FFFFFF" } }, "drawer": { "backdrop": { "backgroundColor": "rgba(43, 46, 56, 0.9)" }, "backgroundColor": "#FFFFFF", "borderRadius": "0", "padding": { "xs": "40px 40px 16px 16px", "sm": "40px 40px 24px 24px", "md": "40px 40px 32px 32px", "lg": "40px 40px 32px 32px" }, "leftMargin": "16px", "closeButton": { "icon": { "color": "#121212" }, "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "icon": { "color": "#121212" } } }, "header": { "paddingBottom": "12px" }, "content": { "paddingBottom": "12px" } }, "footer": { "backgroundColor": "#F6F7FA", "borderRadius": { "xs": "0", "sm": "0", "md": "0", "lg": "0" }, "color": "#121212", "fontFamily": "Overpass, sans-serif", "fontSize": "0.875rem", "padding": { "xs": "1.5rem 0", "sm": "1.5rem 0", "md": "1.5rem 0", "lg": "1.5rem 0" }, "link": { "color": "#121212", "fontWeight": "400", "hover": { "color": "#121212" } } }, "header": { "backgroundColor": "#FFC20E", "boxShadow": "none", "height": { "xs": "57px", "sm": "80px", "md": "80px", "lg": "113px" }, "padding": { "xs": "0 0", "sm": "0 0", "md": "0 0", "lg": "0 0" }, "heading": { "color": "#121212", "fontSize": { "xs": "1.25rem", "sm": "1.5rem", "md": "1.75rem", "lg": "1.75rem" }, "padding": { "xs": "0 0", "sm": "0 2rem", "md": "0 2rem", "lg": "0 2rem" } }, "dark": { "backgroundColor": "#121212", "heading": { "color": "#FFFFFF" } }, "light": { "backgroundColor": "#fffcf3", "heading": { "color": "#121212" } } }, "icon": { "color": "#121212", "fontWeight": "400", "fontFamily": "regular", "light": { "color": "#F6F7FA" } }, "inputGroup": { "backgroundColor": "#F0F2F7" }, "inputStepper": { "borderRadius": "2px", "height": "48px", "button": { "backgroundColor": "#FFFFFF", "border": "1px solid #121212", "color": "#121212", "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#909194", "color": "#909194" }, "error": { "backgroundColor": "#FFFFFF", "borderColor": "#DA0000", "color": "#121212" }, "hover": { "backgroundColor": "#EFEFEF", "borderColor": "#0064AD", "color": "#121212" } } }, "input": { "height": "48px", "color": "#121212", "padding": "0 12px", "borderColor": "#121212", "border": "1px solid #121212", "borderRadius": "2px", "backgroundColor": "#FFFFFF", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "transition": "background-color 0.3s ease, border-color 0.3s ease", "placeholder": { "color": "#6b6b6b" }, "hover": { "backgroundColor": "#EFEFEF", "borderColor": "#0064AD", "color": "#121212" }, "disabled": { "borderColor": "#909194", "backgroundColor": "#F0F2F7", "color": "#909194" }, "focus": { "borderColor": "#0064AD", "backgroundColor": "#FFFFFF", "color": "#121212", "outline": "2px solid #0064AD" }, "error": { "borderColor": "#DA0000", "outline": "#DA0000", "backgroundColor": "#FFFFFF", "color": "#121212" }, "success": { "borderColor": "#47810E", "outline": "#47810E", "backgroundColor": "#FFFFFF", "color": "#121212" } }, "label": { "color": "#121212", "fontSize": "1rem", "fontWeight": "700", "fontFamily": "Overpass, sans-serif", "lineHeight": "1.5" }, "legend": { "color": "#121212", "fontSize": "1rem", "fontWeight": "700", "fontFamily": "Overpass, sans-serif", "lineHeight": "1.5" }, "link": { "color": "#0064AD", "backgroundColor": "transparent", "borderRadius": "0", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "color": "#0064AD" }, "focus": { "backgroundColor": "transparent", "color": "#0064AD", "outline": "2px solid #001423" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "color": "#0064AD" }, "disabled": { "backgroundColor": "#f2f7fb", "color": "#66a2ce" }, "inverse": { "color": "#FFFFFF", "backgroundColor": "transparent", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "color": "#FFFFFF" }, "focus": { "backgroundColor": "transparent", "color": "#FFFFFF", "outline": "2px solid #f2f7fb" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "color": "#FFFFFF" }, "disabled": { "backgroundColor": "#f2f7fb", "color": "#66a2ce" } } }, "loader": { "color": "#FFC20E" }, "logo": { "background": "url({assets.baseUrl}brands/asb/logos/dark/logo.svg)", "width": "120px", "height": "41px", "xs": { "background": "url({assets.baseUrl}brands/asb/logos/dark/logo.svg)", "width": "80px", "height": "18px" }, "light": { "background": "url({assets.baseUrl}brands/asb/logos/light/logo.svg)", "xs": { "background": "url({assets.baseUrl}brands/asb/logos/light/logo.svg)" } }, "dark": { "background": "url({assets.baseUrl}brands/asb/logos/dark/logo.svg)", "xs": { "background": "url({assets.baseUrl}brands/asb/logos/dark/logo.svg)" } } }, "main": { "backgroundColor": "#FFFFFF" }, "message": { "fontFamily": "Overpass, sans-serif", "fontSize": "0.875rem", "information": { "color": "#2D799F" }, "success": { "color": "#47810E" }, "warning": { "color": "#C6501B" }, "error": { "color": "#DA0000" } }, "modal": { "backdrop": { "backgroundColor": "rgba(43, 46, 56, 0.9)" }, "backgroundColor": "#FFFFFF", "padding": "32px", "borderRadius": "0", "button": { "icon": { "color": "#121212" }, "hover": { "icon": { "color": "#121212" }, "backgroundColor": "rgba(0, 0, 0, 0.075)" } } }, "notificationCounter": { "backgroundColor": "#DA0000", "borderColor": "#DA0000", "borderWidth": "1px", "borderRadius": "18px", "color": "#FFFFFF", "font": { "url": "'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;600;700;900&display=swap'", "fontFamily": "Roboto, sans-serif" }, "fontSize": "0.75rem", "fontWeight": "400", "lineHeight": "1", "min-width": "18px", "padding": "2px" }, "password": { "button": { "color": "#121212", "hover": { "backgroundColor": "#EFEFEF", "color": "#121212" }, "focus": { "backgroundColor": "#FFFFFF", "color": "#121212" } } }, "price": { "default": { "fontWeight": "400", "fontSize": { "xs": "44px", "sm": "44px", "md": "64px", "lg": "64px" }, "cents": { "fontWeight": "400", "fontSize": { "xs": "65%", "sm": "65%", "md": "65%", "lg": "65%" } }, "currency": { "fontSize": "65%", "fontWeight": "400", "top": { "xs": "-0.5rem", "sm": "-0.5rem", "md": "-0.7rem", "lg": "-0.7rem" } } }, "small": { "fontWeight": "400", "fontSize": { "xs": "30px", "sm": "30px", "md": "44px", "lg": "44px" }, "cents": { "fontSize": { "xs": "65%", "sm": "65%", "md": "65%", "lg": "65%" } }, "currency": { "fontWeight": "400", "fontSize": "65%", "top": { "xs": "-0.3rem", "sm": "-0.3rem", "md": "-0.5rem", "lg": "-0.5rem" } } } }, "progressIndicator": { "borderWidth": "2px", "fontFamily": "Overpass, sans-serif", "fontWeight": "400", "boxShadow": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px", "complete": { "backgroundColor": "#47810E", "borderColor": "#47810E", "color": "#FFFFFF" }, "active": { "backgroundColor": "#FFFFFF", "borderColor": "#47810E", "color": "#121212", "fontWeight": "600" }, "incomplete": { "backgroundColor": "#FFFFFF", "borderColor": "#909194", "color": "#121212" }, "mobileLabel": { "margin": "0 0 8px 8px" }, "progressLine": { "borderRadius": "0", "dashed": "2px", "gap": "2px", "height": "1px", "left": "24px", "solid": "4px", "style": "2px", "width": "100%", "complete": { "backgroundColor": "#47810E" }, "incomplete": { "backgroundColor": "#C0C2C6" } }, "stepIndicator": { "font": { "url": "'https://fonts.googleapis.com/css2?family=Overpass:wght@300;400;700;900&display=swap'", "fontFamily": "Overpass, sans-serif" }, "fontSize": "1rem", "height": "48px", "size": "1.9rem", "textIndent": "0" }, "button": { "color": "#121212", "backgroundColor": "transparent", "borderRadius": "4px", "padding": "0px 6px", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "color": "#121212" }, "focus": { "color": "#121212", "outline": "#0064AD" } }, "vertical": { "stepLabel": { "paddingRight": "16px" }, "fontSize": { "xs": "1.125rem", "sm": "1.125rem", "md": "1.125rem", "lg": "1.25rem" }, "fontWeight": "600", "fontFamily": "Overpass, sans-serif", "heading": { "color": "#121212" } } }, "progressLoader": { "backdrop": { "backgroundColor": "rgba(255, 255, 255, 0.9)" }, "color": "#121212", "label": { "order": "1", "fontFamily": "Overpass, sans-serif", "fontSize": { "xs": "1rem", "sm": "1rem", "md": "1rem", "lg": "1rem" }, "fontWeight": "600", "margin": "0 0 0.25rem 0" }, "progressBar": { "borderColor": "#909194", "borderRadius": "4px", "backgroundColor": "#FFFFFF", "order": "2" }, "progressValue": { "borderRadius": "4px", "backgroundColor": "#FFC20E", "height": "8px" }, "inline": { "label": { "margin": "0 0 0.5rem 0" }, "progressBar": { "borderColor": "#909194" }, "progressValue": { "backgroundColor": "#47810E", "height": "8px" } } }, "radioBlock": { "backgroundColor": "#FFFFFF", "border": "1px solid #121212", "borderRadius": "2px", "color": "#121212", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "height": "48px", "hover": { "color": "#121212", "borderColor": "#0064AD", "backgroundColor": "#EFEFEF" }, "focus": { "outline": "2px solid #121212" }, "error": { "borderColor": "#DA0000" }, "disabled": { "backgroundColor": "#F0F2F7", "color": "#909194", "borderColor": "#909194" }, "checked": { "color": "#FFFFFF", "backgroundColor": "#0064AD", "borderWidth": "1px", "fontWeight": "700", "borderColor": "#0064AD" } }, "radio": { "input": { "size": "24px", "borderWidth": "2px", "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#121212" }, "inner": { "backgroundColor": "#FFFFFF" } }, "label": { "color": "#121212", "padding": "0.625rem 0.5rem 0.625rem 2.25rem", "backgroundColor": "transparent", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400" }, "hover": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#0064AD" }, "inner": { "backgroundColor": "#FFFFFF" } }, "label": { "color": "#121212", "backgroundColor": "rgba(0, 0, 0, 0.075)" } }, "focus": { "input": { "outline": "2px solid #121212" } }, "error": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#DA0000" }, "inner": { "backgroundColor": "#FFFFFF" } } }, "disabled": { "input": { "outer": { "backgroundColor": "#F0F2F7", "borderColor": "#909194" }, "inner": { "backgroundColor": "#909194" } }, "label": { "color": "#909194" } }, "checked": { "input": { "outer": { "backgroundColor": "#0064AD", "borderColor": "#0064AD" }, "inner": { "backgroundColor": "#FFFFFF" } }, "label": { "color": "#121212", "fontWeight": "700" } }, "outline": { "input": { "size": "24px", "borderWidth": "2px", "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#121212" }, "inner": { "backgroundColor": "#FFFFFF" } }, "label": { "borderWidth": "1px", "borderColor": "#121212", "padding": "1rem 1rem 1rem 3.2rem", "backgroundColor": "#FFFFFF", "color": "#121212", "borderRadius": "2px" }, "hover": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#0064AD" }, "inner": { "backgroundColor": "#FFFFFF" } }, "label": { "color": "#121212", "backgroundColor": "#EFEFEF", "borderColor": "#0064AD" } }, "focus": { "label": { "outline": "2px solid #121212" } }, "error": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#DA0000" }, "inner": { "backgroundColor": "#FFFFFF" } }, "label": { "borderColor": "#DA0000" } }, "disabled": { "input": { "outer": { "backgroundColor": "#F0F2F7", "borderColor": "#909194" }, "inner": { "backgroundColor": "#909194" } }, "label": { "backgroundColor": "#F0F2F7", "color": "#909194", "borderColor": "#909194" } }, "checked": { "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "inner": { "backgroundColor": "#0064AD" } }, "label": { "color": "#FFFFFF", "backgroundColor": "#0064AD", "borderColor": "#0064AD" } } } }, "segmentedControl": { "backgroundColor": "#FFFFFF", "minHeight": "48px", "minWidth": "7.5rem", "padding": "0 .75rem", "border": "1px solid #121212", "borderColor": "#121212", "borderRadius": "2px", "borderWidth": "1px solid", "color": "#121212", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "block": { "borderRadius": "2px" }, "hover": { "color": "#121212", "borderColor": "#0064AD", "backgroundColor": "#EFEFEF" }, "focus": { "border": "2px solid #0064AD" }, "error": { "borderColor": "#DA0000" }, "disabled": { "backgroundColor": "#F0F2F7", "color": "#909194", "borderColor": "#909194", "checked": { "color": "#FFFFFF" } }, "checked": { "color": "#FFFFFF", "backgroundColor": "#0064AD", "fontWeight": "700", "borderColor": "#0064AD" }, "radio": { "backgroundColor": "#FFFFFF", "border": "1px solid #121212", "borderColor": "#121212", "borderWidth": "1px solid", "color": "#121212", "padding": "0.75rem", "input": { "size": "24px", "borderWidth": "2px", "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#121212" }, "inner": { "backgroundColor": "#FFFFFF" } }, "hover": { "color": "#121212", "borderColor": "#0064AD", "backgroundColor": "#EFEFEF", "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#0064AD" } } }, "disabled": { "backgroundColor": "#F0F2F7", "borderColor": "#909194", "color": "#909194", "input": { "outer": { "backgroundColor": "#F0F2F7", "borderColor": "#909194" }, "inner": { "backgroundColor": "#909194" } }, "checked": { "color": "#FFFFFF", "input": { "outer": { "borderColor": "#F0F2F7" } } } }, "checked": { "color": "#FFFFFF", "backgroundColor": "#0064AD", "borderColor": "#0064AD", "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#FFFFFF" }, "inner": { "backgroundColor": "#0064AD", "borderColor": "#909194" } } }, "error": { "checked": { "input": { "inner": { "backgroundColor": "#0064AD", "borderColor": "#0064AD" }, "outer": { "backgroundColor": "#DA0000" } } }, "input": { "outer": { "backgroundColor": "#FFFFFF", "borderColor": "#DA0000" } } }, "block": { "label": { "padding": "0.75rem 3rem 0.75rem" } } } }, "select": { "height": "48px", "color": "#121212", "padding": "0 12px", "border": "1px solid #121212", "icon": { "color": "#121212" }, "borderRadius": "2px", "backgroundColor": "#FFFFFF", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "transition": "background-color 0.3s ease, border-color 0.3s ease", "hover": { "backgroundColor": "#EFEFEF", "borderColor": "#0064AD", "color": "#121212" }, "disabled": { "borderColor": "#909194", "backgroundColor": "#F0F2F7", "color": "#909194" }, "focus": { "borderColor": "#0064AD", "backgroundColor": "#FFFFFF", "color": "#121212", "outline": "2px solid #0064AD" }, "error": { "borderColor": "#DA0000", "backgroundColor": "#FFFFFF", "color": "#121212" }, "success": { "borderColor": "#47810E", "backgroundColor": "#FFFFFF", "color": "#121212" } }, "spinner": { "stroke": "#0064AD", "inverse": { "stroke": "#121212" }, "fixed": { "background": "transparent" } }, "tab": { "borderColor": "#0064AD", "borderRadius": "0 0 0 0", "borderWidth": "1px", "button": { "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "color": "#121212", "textAlign": "left" }, "content": { "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "backgroundColor": "#FFFFFF", "padding": "16px", "borderStyle": "none", "xs": { "borderWidth": "1px", "padding": "0 1rem 1rem" } }, "inactive": { "backgroundColor": "transparent", "borderWidth": "0 0 1px", "color": "#121212", "icon": { "color": "#0064AD" } }, "selected": { "backgroundColor": "#FFFFFF", "borderWidth": "1px 1px 0", "boxShadow": "none", "color": "#0064AD", "fontWeight": "700", "icon": { "color": "#0064AD" } }, "hover": { "color": "#121212", "backgroundColor": "rgba(0, 0, 0, 0.075)", "icon": { "color": "#0064AD" } }, "focus": { "color": "#121212", "backgroundColor": "#FFFFFF", "boxShadow": "inset 0 0 0 2px #fff,inset 0 0 0 4px #FFC20E,inset 0 0 #FFC20E", "icon": { "color": "#0064AD" } }, "icon": { "color": "#0064AD" }, "inverse": { "borderColor": "#fffcf3", "button": { "color": "#FFFFFF" }, "color": "#FFFFFF", "content": { "backgroundColor": "transparent", "color": "#FFFFFF" }, "inactive": { "backgroundColor": "transparent", "color": "#FFFFFF", "icon": { "color": "#F6F7FA" } }, "selected": { "backgroundColor": "transparent", "color": "#FFFFFF", "boxShadow": "none", "icon": { "color": "#F6F7FA" } }, "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "color": "#FFFFFF", "icon": { "color": "#F6F7FA" } }, "icon": { "color": "#F6F7FA" }, "focus": { "icon": { "color": "#F6F7FA" } }, "scroll": { "button": { "backgroundColor": "transparent", "color": "#F6F7FA", "hover": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "color": "#F6F7FA" }, "active": { "backgroundColor": "rgba(255, 255, 255, 0.15)", "color": "#F6F7FA" } } } }, "scroll": { "button": { "backgroundColor": "transparent", "borderWidth": "1px", "borderRadius": "0 0 0 0", "color": "#121212", "hover": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "color": "#121212" }, "active": { "backgroundColor": "rgba(0, 0, 0, 0.075)", "color": "#121212" } } } }, "textarea": { "color": "#121212", "padding": "12px", "border": "1px solid #121212", "borderRadius": "2px", "backgroundColor": "#FFFFFF", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "transition": "background-color 0.3s ease, border-color 0.3s ease", "placeholder": { "color": "#6b6b6b" }, "hover": { "backgroundColor": "#EFEFEF", "borderColor": "#0064AD", "color": "#121212" }, "disabled": { "borderColor": "#909194", "backgroundColor": "#F0F2F7", "color": "#909194" }, "focus": { "borderColor": "#0064AD", "backgroundColor": "#FFFFFF", "color": "#121212", "outline": "2px solid #0064AD" }, "error": { "borderColor": "#DA0000", "outline": "#DA0000", "backgroundColor": "#FFFFFF", "color": "#121212" }, "success": { "borderColor": "#47810E", "outline": "#47810E", "backgroundColor": "#FFFFFF", "color": "#121212" } }, "toggle": { "label": { "color": "#121212", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "700", "marginLeft": "1.5rem", "marginRight": ".5rem", "hover": { "color": "#121212" }, "checked": { "color": "#121212" }, "error": { "color": "#121212" }, "disabled": { "color": "#909194", "checked": { "color": "#909194" } } }, "thumb": { "backgroundColor": "#121212", "size": "24px", "hover": { "backgroundColor": "#121212" }, "checked": { "backgroundColor": "#FFFFFF", "boxShadow": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px", "transform": "translateX(22px)" }, "error": { "backgroundColor": "#121212" }, "disabled": { "backgroundColor": "#909194", "checked": { "backgroundColor": "#F0F2F7" } } }, "track": { "width": "56px", "backgroundColor": "#FFFFFF", "border": "1px solid #121212", "borderRadius": "64px", "hover": { "backgroundColor": "#EFEFEF", "border": "1px solid #0064AD" }, "focus": { "outline": "2px solid #121212" }, "checked": { "backgroundColor": "#0064AD", "border": "1px solid #0064AD" }, "error": { "backgroundColor": "#FFFFFF", "border": "1px solid #DA0000" }, "disabled": { "backgroundColor": "#F0F2F7", "border": "1px solid #909194", "checked": { "backgroundColor": "#909194", "border": "1px solid #909194" } } } }, "tooltip": { "arrow": { "color": "#303031" }, "backgroundColor": "#303031", "borderColor": "#303031", "borderWidth": "1px", "borderRadius": "4px", "boxShadow": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px", "color": "#FFFFFF", "fontFamily": "Overpass, sans-serif", "fontSize": "1rem", "fontWeight": "400", "lineHeight": "1.5", "padding": "16px 16px" } }