@charset "UTF-8"; /******************************** * ASIC Design System * * Build: v1.5.2 * * Created: 08/09/2025, 14:56 * ********************************/ @import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@24,400,0..1,0&display=block&icon_names=3p,account_circle,add,arrow_back,arrow_downward,arrow_forward,arrow_upward,automation,business,call,chat,check,check_circle,chevron_left,chevron_right,close,close_small,contrast,conversion_path,copy_all,dark_mode,database,delete,description,download,edit,edit_note,edit_square,error,expand_more,feedback,filter_list,filter_list_off,fullscreen,fullscreen_exit,help,home,image,info,keyboard_arrow_down,keyboard_arrow_left,keyboard_arrow_right,keyboard_arrow_up,light_mode,list_alt,logout,mail,menu,more_horiz,news,open_in_new,palette,pause,pause_circle,play_arrow,play_circle,play_disabled,play_pause,print,receipt_long,remove,report,reviews,save,search,stacks,start,subdirectory_arrow_right,text_decrease,text_increase,thumb_down,thumb_up,upload,visibility,visibility_off,volume_down,volume_mute,volume_off,volume_up,warning,widgets") layer(base); @import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap") layer(base); @layer base { :root { --static-brand-blue: #0072ce; --static-brand-granite: #253746; --static-brand-navy: #1d252d; --static-brand-sky: #3cb4e5; --static-brand-aqua: #84dade; --static-gray-0: #fff; --static-gray-1: #f8f9fa; --static-gray-2: #f2f3f3; --static-gray-3: #eaebec; --static-gray-4: #c7cdd4; --static-gray-5: #b5bcc4; --static-gray-6: #909aa6; --static-gray-7: #6e7d8a; --static-gray-8: #404a54; --static-gray-9: #283038; --static-gray-10: #1d252d; --lightningcss-light: initial; --lightningcss-dark: ; --lightningcss-light: initial; --lightningcss-dark: ; color-scheme: light; --asic-color-system-neutral-muted: var(--static-gray-1); --asic-color-system-neutral: var(--static-brand-granite); --asic-color-system-neutral-on: var(--static-gray-0); --asic-color-system-info-muted: #f1f9ff; --asic-color-system-info: #0072ce; --asic-color-system-info-on: var(--static-gray-0); --asic-color-system-success-muted: #f4fcf1; --asic-color-system-success: #2c813b; --asic-color-system-success-on: var(--static-gray-0); --asic-color-system-warning-muted: #fffaf1; --asic-color-system-warning: #ffa91f; --asic-color-system-warning-on: var(--static-gray-9); --asic-color-system-error-muted: #fff0f0; --asic-color-system-error: #c63637; --asic-color-system-error-on: var(--static-gray-0); --asic-color-system-highlight-muted: #f4f2ff; --asic-color-system-highlight: #8250df; --asic-color-system-highlight-on: var(--static-gray-0); --asic-color-background: var(--static-gray-0); --asic-color-background-alt: var(--static-gray-1); --asic-color-background-emphasis: var(--static-brand-granite); --asic-color-background-accent: #f1f9ff; --asic-color-background-accent-alt: #cce8ff; --asic-color-background-accent-emphasis: var(--static-brand-blue); --asic-color-border-emphasis: var(--static-gray-6); --asic-color-border: var(--static-gray-4); --asic-color-border-muted: var(--static-gray-3); --asic-color-text-emphasis: var(--static-gray-10); --asic-color-text: var(--static-gray-9); --asic-color-text-muted: var(--static-gray-8); --asic-color-text-disabled: var(--static-gray-7); --asic-color-text-link: #0063b2; --asic-color-text-inverse: var(--asic-color-background); --asic-color-control-background: var(--asic-color-background); --asic-color-control-background-disabled: var(--asic-color-background-alt); --asic-color-control-border: var(--asic-color-border-emphasis); --asic-color-control-border-disabled: var(--asic-color-border); --asic-color-item-bg-idle: var(--asic-color-background); --asic-color-item-bg-hover: #2830390f; --asic-color-item-bg-selected: var(--asic-color-background-accent); --asic-color-item-fg-idle: var(--asic-color-text); --asic-color-item-fg-hover: var(--asic-color-text-emphasis); --asic-color-item-fg-selected: var(--asic-color-text-emphasis); } @media (prefers-color-scheme: dark) { .asic-dark-support { --lightningcss-light: ; --lightningcss-dark: initial; color-scheme: dark; --asic-color-system-neutral-muted: var(--static-gray-9); --asic-color-system-neutral: var(--static-gray-2); --asic-color-system-neutral-on: var(--static-gray-9); --asic-color-system-info-muted: #eaf3fb1a; --asic-color-system-info: #3e97ff; --asic-color-system-info-on: var(--static-gray-0); --asic-color-system-success-muted: #edf8e81a; --asic-color-system-success: #4fba16; --asic-color-system-success-on: var(--static-gray-0); --asic-color-system-warning-muted: #fdf5e81a; --asic-color-system-warning: #ffa91f; --asic-color-system-warning-on: var(--static-gray-9); --asic-color-system-error-muted: #ff6b6b1a; --asic-color-system-error: #ff5353; --asic-color-system-error-on: var(--static-gray-0); --asic-color-system-highlight-muted: #ece5fb1a; --asic-color-system-highlight: #9e64ff; --asic-color-system-highlight-on: var(--static-gray-0); --asic-color-background: var(--static-gray-10); --asic-color-background-alt: var(--static-gray-9); --asic-color-background-emphasis: var(--static-gray-0); --asic-color-background-accent: #eaf3fb1a; --asic-color-background-accent-alt: #47acff1a; --asic-color-background-accent-emphasis: #47acff; --asic-color-border-emphasis: var(--static-gray-6); --asic-color-border: var(--static-gray-7); --asic-color-border-muted: var(--static-gray-8); --asic-color-text-emphasis: var(--static-gray-0); --asic-color-text: var(--static-gray-2); --asic-color-text-muted: var(--static-gray-5); --asic-color-text-disabled: var(--static-gray-6); --asic-color-text-link: #47acff; --asic-color-text-inverse: var(--asic-color-background); --asic-color-control-background: var(--asic-color-background); --asic-color-control-background-disabled: var(--asic-color-background-alt); --asic-color-control-border: var(--asic-color-border-emphasis); --asic-color-control-border-disabled: var(--asic-color-border); --asic-color-item-bg-idle: var(--asic-color-background); --asic-color-item-bg-hover: #f2f3f30f; --asic-color-item-bg-selected: var(--asic-color-background-accent); --asic-color-item-fg-idle: var(--asic-color-text); --asic-color-item-fg-hover: var(--asic-color-text-emphasis); --asic-color-item-fg-selected: var(--asic-color-text-emphasis); } } .asic-dark { --lightningcss-light: ; --lightningcss-dark: initial; color-scheme: dark; --asic-color-system-neutral-muted: var(--static-gray-9); --asic-color-system-neutral: var(--static-gray-2); --asic-color-system-neutral-on: var(--static-gray-9); --asic-color-system-info-muted: #eaf3fb1a; --asic-color-system-info: #3e97ff; --asic-color-system-info-on: var(--static-gray-0); --asic-color-system-success-muted: #edf8e81a; --asic-color-system-success: #4fba16; --asic-color-system-success-on: var(--static-gray-0); --asic-color-system-warning-muted: #fdf5e81a; --asic-color-system-warning: #ffa91f; --asic-color-system-warning-on: var(--static-gray-9); --asic-color-system-error-muted: #ff6b6b1a; --asic-color-system-error: #ff5353; --asic-color-system-error-on: var(--static-gray-0); --asic-color-system-highlight-muted: #ece5fb1a; --asic-color-system-highlight: #9e64ff; --asic-color-system-highlight-on: var(--static-gray-0); --asic-color-background: var(--static-gray-10); --asic-color-background-alt: var(--static-gray-9); --asic-color-background-emphasis: var(--static-gray-0); --asic-color-background-accent: #eaf3fb1a; --asic-color-background-accent-alt: #47acff1a; --asic-color-background-accent-emphasis: #47acff; --asic-color-border-emphasis: var(--static-gray-6); --asic-color-border: var(--static-gray-7); --asic-color-border-muted: var(--static-gray-8); --asic-color-text-emphasis: var(--static-gray-0); --asic-color-text: var(--static-gray-2); --asic-color-text-muted: var(--static-gray-5); --asic-color-text-disabled: var(--static-gray-6); --asic-color-text-link: #47acff; --asic-color-text-inverse: var(--asic-color-background); --asic-color-control-background: var(--asic-color-background); --asic-color-control-background-disabled: var(--asic-color-background-alt); --asic-color-control-border: var(--asic-color-border-emphasis); --asic-color-control-border-disabled: var(--asic-color-border); --asic-color-item-bg-idle: var(--asic-color-background); --asic-color-item-bg-hover: #f2f3f30f; --asic-color-item-bg-selected: var(--asic-color-background-accent); --asic-color-item-fg-idle: var(--asic-color-text); --asic-color-item-fg-hover: var(--asic-color-text-emphasis); --asic-color-item-fg-selected: var(--asic-color-text-emphasis); } :root { --asic-border-width-thin: 1px; --asic-border-width-medium: 2px; --asic-border-width-thick: 3px; --asic-border-width-thickest: 6px; --asic-border-radius-xsmall: 2px; --asic-border-radius-small: 4px; --asic-border-radius-medium: 8px; --asic-border-radius-large: 12px; --asic-border-radius-full: 9999px; --asic-space-2: 2px; --asic-space-4: 4px; --asic-space-8: 8px; --asic-space-12: 12px; --asic-space-16: 16px; --asic-space-20: 20px; --asic-space-24: 24px; --asic-space-32: 32px; --asic-space-40: 40px; --asic-space-48: 48px; --asic-space-56: 56px; --asic-space-64: 64px; --asic-space-72: 72px; --asic-space-80: 80px; --asic-space-128: 128px; --asic-space-192: 192px; --asic-space-240: 240px; --asic-space-256: 256px; --asic-space-320: 320px; --asic-icon-size: var(--asic-space-24); --asic-icon-size-small: var(--asic-space-16); --asic-icon-size-medium: var(--asic-space-20); --asic-icon-size-large: var(--asic-space-32); --asic-icon-size-xlarge: var(--asic-space-48); --asic-icon-font-family: "Material Symbols Rounded"; --asic-icon-font: normal normal var(--asic-icon-size) / 1 var(--asic-icon-font-family); --asic-icon-font-small: normal normal var(--asic-icon-size-small) / 1 var(--asic-icon-font-family); --asic-icon-font-medium: normal normal var(--asic-icon-size-medium) / 1 var(--asic-icon-font-family); --asic-icon-font-large: normal normal var(--asic-icon-size-large) / 1 var(--asic-icon-font-family); --asic-icon-font-xlarge: normal normal var(--asic-icon-size-xlarge) / 1 var(--asic-icon-font-family); --asic-icon-fill: "FILL" 1; --asic-icon-line: "FILL" 0; --asic-motion-ease: cubic-bezier(.25, .1, .25, 1); --asic-motion-ease-in: cubic-bezier(.42, 0, 1, 1); --asic-motion-ease-out: cubic-bezier(.19, .91, .38, 1); --asic-motion-ease-in-out: cubic-bezier(.42, 0, .58, 1); --asic-motion-duration-short: .16s; --asic-motion-duration: .24s; --asic-motion-duration-long: .32s; --asic-opacity-disabled: .3; --asic-focusring-width: var(--asic-border-width-thick); --asic-focusring-offset: var(--asic-border-width-medium); --asic-focusring-color: #007fe5; --asic-focusring-outline: var(--asic-focusring-width) solid var(--asic-focusring-color); --asic-form-control-size: var(--asic-space-24); --asic-form-group-gap: var(--asic-space-24); --asic-form-text-gap: var(--asic-space-8); --px-to-rem: .0625rem; --asic-font-family-mono: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace; --asic-font-family-sans: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"; --asic-font-family-numeric: "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif; --asic-font-weight-bold: 700; --asic-font-weight-semibold: 600; --asic-font-weight-medium: 500; --asic-font-weight-regular: 400; --asic-font-lineheight-spacious: 1.6; --asic-font-lineheight-regular: 1.5; --asic-font-lineheight-dense: 1.3; --asic-text-display-size: calc(40 * var(--px-to-rem)); --asic-text-display-lineheight: var(--asic-font-lineheight-dense); --asic-text-display-weight: var(--asic-font-weight-bold); --asic-text-display-shorthand: var(--asic-text-display-weight) var(--asic-text-display-size) / var(--asic-text-display-lineheight) var(--asic-font-family-sans); --asic-text-title-size: calc(24 * var(--px-to-rem)); --asic-text-title-lineheight: var(--asic-font-lineheight-dense); --asic-text-title-weight: var(--asic-font-weight-medium); --asic-text-title-shorthand: var(--asic-text-title-weight) var(--asic-text-title-size) / var(--asic-text-title-lineheight) var(--asic-font-family-sans); --asic-text-title-large-size: calc(32 * var(--px-to-rem)); --asic-text-title-large-lineheight: var(--asic-font-lineheight-dense); --asic-text-title-large-weight: var(--asic-font-weight-semibold); --asic-text-title-large-shorthand: var(--asic-text-title-large-weight) var(--asic-text-title-large-size) / var(--asic-text-title-large-lineheight) var(--asic-font-family-sans); --asic-text-title-small-size: calc(20 * var(--px-to-rem)); --asic-text-title-small-lineheight: var(--asic-font-lineheight-dense); --asic-text-title-small-weight: var(--asic-font-weight-medium); --asic-text-title-small-shorthand: var(--asic-text-title-small-weight) var(--asic-text-title-small-size) / var(--asic-text-title-small-lineheight) var(--asic-font-family-sans); --asic-text-subtitle-size: calc(20 * var(--px-to-rem)); --asic-text-subtitle-lineheight: var(--asic-font-lineheight-regular); --asic-text-subtitle-weight: var(--asic-font-weight-regular); --asic-text-subtitle-shorthand: var(--asic-text-subtitle-weight) var(--asic-text-subtitle-size) / var(--asic-text-subtitle-lineheight) var(--asic-font-family-sans); --asic-text-surtitle-size: calc(16 * var(--px-to-rem)); --asic-text-surtitle-lineheight: var(--asic-font-lineheight-regular); --asic-text-surtitle-weight: var(--asic-font-weight-semibold); --asic-text-surtitle-shorthand: var(--asic-text-surtitle-weight) var(--asic-text-surtitle-size) / var(--asic-text-surtitle-lineheight) var(--asic-font-family-sans); --asic-text-body-size: calc(16 * var(--px-to-rem)); --asic-text-body-lineheight: var(--asic-font-lineheight-regular); --asic-text-body-weight: var(--asic-font-weight-regular); --asic-text-body-shorthand: var(--asic-text-body-weight) var(--asic-text-body-size) / var(--asic-text-body-lineheight) var(--asic-font-family-sans); --asic-text-body-small-size: calc(14 * var(--px-to-rem)); --asic-text-body-small-lineheight: var(--asic-font-lineheight-regular); --asic-text-body-small-weight: var(--asic-font-weight-regular); --asic-text-body-small-shorthand: var(--asic-text-body-small-weight) var(--asic-text-body-small-size) / var(--asic-text-body-small-lineheight) var(--asic-font-family-sans); --asic-text-body-xsmall-size: calc(12 * var(--px-to-rem)); --asic-text-body-xsmall-lineheight: var(--asic-font-lineheight-regular); --asic-text-body-xsmall-weight: var(--asic-font-weight-regular); --asic-text-body-xsmall-shorthand: var(--asic-text-body-xsmall-weight) var(--asic-text-body-xsmall-size) / var(--asic-text-body-xsmall-lineheight) var(--asic-font-family-sans); --asic-text-code-shorthand: var(--asic-text-body-small-size) / var(--asic-text-body-small-lineheight) var(--asic-font-family-mono); } body { background-color: var(--asic-color-background); color: var(--asic-color-text); font-family: var(--asic-font-family-sans); line-height: var(--asic-font-lineheight-regular); margin: 0; } @media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } } .asic-prose { color: var(--asic-color-text); line-height: var(--asic-font-lineheight-regular); } .asic-prose :where(p):not(:where(.asic-prose-escape *)), .asic-prose > :not(:where(.asic-prose-escape *)) { margin: 0; } .asic-prose > * + :not(:where(.asic-prose-escape *)) { margin-top: 1rem; } .asic-prose :where(ol, ul):not(:where(.asic-prose-escape *)) { padding-inline-start: 2rem; } .asic-prose :where(li):not(:where(.asic-prose-escape *)) { margin-top: 0.25rem; } .asic-prose :where(ol ol, ul ul, ol ul, ul ol):not(:where(.asic-prose-escape *)) { padding-inline-start: 1rem; } .asic-prose :where(dl):not(:where(.asic-prose-escape *)) > dt { font-weight: var(--asic-font-weight-semibold); margin-top: 0.75rem; } .asic-prose :where(dl):not(:where(.asic-prose-escape *)) > dd { border-inline-start: var(--asic-border-width-thin) solid var(--asic-color-border); margin: 0; padding-inline-start: 0.5em; } .asic-prose :where(blockquote):not(:where(.asic-prose-escape *)) { margin-inline: 0; padding-inline-start: 1em; position: relative; } .asic-prose :where(blockquote):not(:where(.asic-prose-escape *)):before { background-color: var(--asic-color-border-emphasis); border-radius: var(--asic-border-width-thick); content: ""; width: var(--asic-border-width-thick); position: absolute; inset: 0 auto 0 0; } .asic-prose :where(figcaption):not(:where(.asic-prose-escape *)) { color: var(--asic-color-text-muted); font-size: var(--asic-text-body-small-size); } .asic-prose :where(hr):not(:where(.asic-prose-escape *)) { background-color: var(--asic-color-border-muted); border-radius: var(--asic-border-width-medium); height: var(--asic-border-width-medium); border: 0; margin-block: 2rem; } .asic-prose :where(img):not(:where(.asic-prose-escape *)) { max-width: 100%; height: auto; } .asic-prose :where(strong):not(:where(.asic-prose-escape *)) { font-weight: var(--asic-font-weight-semibold); } .asic-prose :where(a):not(:where(.asic-prose-escape *)) { color: var(--asic-color-text-link); text-decoration: underline; -webkit-text-decoration-color: color-mix(in srgb, var(--asic-color-text-link) 33%, var(--asic-color-background)); text-decoration-color: color-mix(in srgb, var(--asic-color-text-link) 33%, var(--asic-color-background)); text-decoration-thickness: var(--asic-border-width-thin); text-underline-offset: var(--asic-border-width-medium); } @media (hover: hover) { .asic-prose :where(a):not(:where(.asic-prose-escape *)):hover { text-decoration: none; } } .asic-prose :where(a):not(:where(.asic-prose-escape *)):focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-prose :where(code):not(:where(.asic-prose-escape *)) { font: var(--asic-text-code-shorthand); } .asic-prose :where(pre):not(:where(.asic-prose-escape *)) { background-color: var(--asic-color-background-alt); border-radius: var(--asic-border-radius-medium); color: var(--asic-color-text-emphasis); min-width: 0; max-width: 100%; padding: var(--asic-space-12); white-space: pre; line-height: 1.6; overflow: auto; } .asic-prose :where(:not(pre) > code):not(:where(.asic-prose-escape *)) { background-color: var(--asic-color-background-accent); border-radius: var(--asic-border-radius-small); color: var(--asic-color-text-emphasis); padding-inline: var(--asic-space-4); display: inline-block; } .asic-prose :where(table):not(:where(.asic-prose-escape *)) { border-collapse: collapse; table-layout: auto; width: 100%; } .asic-prose :where(table):not(:where(.asic-prose-escape *)) :where(caption) { font: var(--asic-text-subtitle-shorthand); text-align: start; } .asic-prose :where(table):not(:where(.asic-prose-escape *)) :where(th, td) { border: var(--asic-border-width-thin) solid var(--asic-color-border-muted); font: var(--asic-text-body-small-shorthand); padding: var(--asic-space-8) var(--asic-space-12); text-align: start; } .asic-prose :where(table):not(:where(.asic-prose-escape *)) :where(thead th) { background-color: var(--asic-color-background-alt); font-weight: var(--asic-font-weight-semibold); } .asic-prose :where(h1, h2, h3, h4, h5, h6):not(:where(.asic-prose-escape *)) { color: var(--asic-color-text-emphasis); overflow-wrap: break-word; text-wrap: balance; margin-top: 1.5em; margin-bottom: 0.67em; } .asic-prose :where(h1, h2, h3, h4, h5, h6):not(:where(.asic-prose-escape *)):first-child { margin-top: 0; } .asic-prose :where(h1, h2, h3, h4, h5, h6):not(:where(.asic-prose-escape *)):last-child { margin-bottom: 0; } .asic-prose :where(h1):not(:where(.asic-prose-escape *)) { font: var(--asic-text-display-shorthand); } .asic-prose :where(h2):not(:where(.asic-prose-escape *)) { font: var(--asic-text-title-large-shorthand); } .asic-prose :where(h3):not(:where(.asic-prose-escape *)) { font: var(--asic-text-title-shorthand); } .asic-prose :where(h4):not(:where(.asic-prose-escape *)) { font: var(--asic-text-title-small-shorthand); } .asic-prose :where(h5):not(:where(.asic-prose-escape *)) { font: var(--asic-text-body-shorthand); font-weight: var(--asic-font-weight-semibold); } .asic-prose :where(h6):not(:where(.asic-prose-escape *)) { font: var(--asic-text-body-small-shorthand); font-weight: var(--asic-font-weight-semibold); } } @layer components { .asic-accordion { border-top: var(--asic-border-width-thin) solid var(--asic-color-border); --padding-x: var(--asic-space-24); --padding-y: var(--asic-space-24); } .asic-accordion__item { border-bottom: var(--asic-border-width-thin) solid var(--asic-color-border); } .asic-accordion__title { color: var(--asic-color-item-fg-idle); cursor: pointer; font: var(--asic-text-title-small-shorthand); padding-block: var(--padding-y); padding-inline: var(--padding-x); appearance: none; justify-content: space-between; align-items: center; list-style: none; display: flex; position: relative; } :is(.asic-accordion__title::marker, .asic-accordion__title::-webkit-details-marker) { display: none; } @media (hover: hover) { .asic-accordion__title:hover { background-color: var(--asic-color-item-bg-hover); color: var(--asic-color-item-fg-hover); } } .asic-accordion__title:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-accordion__title:after { content: "expand_more"/""; font: var(--asic-icon-font); white-space: nowrap; width: var(--asic-icon-size); height: var(--asic-icon-size); flex-shrink: 0; overflow: hidden; } @supports not (content: "x"/"y") { .asic-accordion__title:after { alt: ""; content: "expand_more"; } } @media (prefers-reduced-motion: no-preference) { .asic-accordion__title:after { transition: transform var(--asic-motion-duration) var(--asic-motion-ease); } } details[open] .asic-accordion__title:after { transform: rotate(180deg); } .asic-accordion__content { color: var(--asic-color-text); padding: var(--asic-space-8) var(--padding-x) var(--padding-y); } .asic-alert { background-color: var(--alert-background); border-radius: var(--asic-border-radius-medium); box-shadow: inset 0 0 0 var(--asic-border-width-thin) var(--alert-accent); contain: content; grid-template-areas: "icon title" "icon content"; grid-template-columns: var(--asic-space-40) minmax(0, 1fr); --alert-background: var(--asic-color-background-alt); --alert-accent: var(--asic-color-text-disabled); --alert-icon: "info"; --alert-icon-alt: ""; display: grid; } .asic-alert:after { background-color: var(--alert-accent); color: var(--asic-color-text-inverse); content: var(--alert-icon)/var(--alert-icon-alt); font: var(--asic-icon-font); grid-area: icon; place-items: center; display: grid; } @supports not (content: "x"/"y") { .asic-alert:after { alt: var(--alert-icon-alt); content: var(--alert-icon); } } .asic-alert:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-alert__content { font: var(--asic-text-body-shorthand); padding-block: var(--asic-space-12); padding-inline: var(--asic-space-16); grid-area: content; margin-block: 0; } .asic-alert__title + .asic-alert__content { padding-top: 0; } .asic-alert__title { color: var(--asic-color-text-emphasis); font: var(--asic-text-body-shorthand); font-weight: var(--asic-font-weight-semibold); padding-block: var(--asic-space-12); padding-inline: var(--asic-space-16); grid-area: title; margin-block: 0; } .asic-alert--success { --alert-background: var(--asic-color-system-success-muted); --alert-accent: var(--asic-color-system-success); --alert-icon: "check_circle"; --alert-icon-alt: "Success"; } .asic-alert--error { --alert-background: var(--asic-color-system-error-muted); --alert-accent: var(--asic-color-system-error); --alert-icon: "report"; --alert-icon-alt: "Error"; } .asic-banner { align-items: center; column-gap: var(--asic-content-gap-x); grid-template-areas: "header" "media" "content"; display: grid; } .asic-banner :where(audio, canvas, embed, iframe, img, object, picture, video) { max-width: 100%; height: auto; display: block; } @media (min-width: 992px) { .asic-banner { grid-template-areas: "header header" "content media"; } .asic-banner:where(.asic-banner--media-inverted) { grid-template-areas: "header header" "media content"; } } .asic-banner__header { margin-bottom: var(--asic-space-24); grid-area: header; } .asic-banner__content { gap: var(--asic-space-24); max-width: var(--asic-content-max); grid-area: content; justify-items: start; display: grid; } .asic-banner__media { grid-area: media; margin: 0; padding: 0; list-style: none; } @media not (min-width: 992px) { .asic-banner__media { margin-bottom: var(--asic-content-gap-y); } } .asic-hero-banner { background-color: var(--hero-banner-bg); padding-block: var(--asic-content-gutter); --hero-banner-bg: var(--asic-color-background-alt); } .asic-hero-banner--accent { --hero-banner-bg: var(--asic-color-background-accent); } .asic-hero-banner--accent-alt { --hero-banner-bg: var(--asic-color-background-accent-alt); } .asic-hero-banner--blue { --hero-banner-bg: var(--static-brand-blue); --asic-color-text: #fffc; --asic-color-background-accent-emphasis: var(--static-gray-0); --asic-color-text-inverse: var(--static-brand-blue); --asic-color-text-emphasis: var(--static-gray-0); --asic-color-text-muted: var(--static-gray-0); --asic-color-text-link: var(--static-gray-0); --asic-focusring-color: var(--static-gray-0); --asic-focusring-outline: var(--asic-focusring-width) solid var(--asic-focusring-color); background-image: url("data:image/svg+xml,%3Csvg fill='%230063b2' height='32' width='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='m12.1336 6.67989 3.884-3.87989 13.2176 13.2176-3.884 3.8839-13.2176-13.21769zm8.5508 17.87661 3.884-3.8838-8.5468-8.5468-3.88 3.8838 8.5468 8.5468zm-4.6668 4.6669 3.8836-3.8798-3.8836-3.8799-3.884 3.8799zm-5.454-13.2097 4.6668-4.6669-3.88-3.88383-8.5504 8.55073 8.5468 8.5468 3.8796-3.8799z'/%3E%3Cpath d='m1.2144 16.002 14.7876-14.78386 14.784 14.78386-14.784 14.7838-14.784-14.7838zm14.7876-16.002-16.002 16.002 15.998 15.998 16.002-16.002z'/%3E%3C/svg%3E"); background-position: calc(100% + 150px); background-repeat: no-repeat; background-size: auto 400px; } .asic-breadcrumbs:where([data-initialized=true]:not([data-expanded=true])) .asic-breadcrumbs__list { flex-wrap: nowrap; } .asic-breadcrumbs:where([data-initialized=true]:not([data-expanded=true])) .asic-breadcrumbs__item:last-child { min-width: 0; } .asic-breadcrumbs:where([data-initialized=true]:not([data-expanded=true])) .asic-breadcrumbs__item:last-child a { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .asic-breadcrumbs__list { flex-wrap: wrap; margin: 0; padding: 0; list-style: none; display: flex; } .asic-breadcrumbs__item { white-space: nowrap; align-items: center; display: flex; } .asic-breadcrumbs__item:not(:last-child):after { color: var(--asic-color-text-muted); content: "chevron_right"/""; font: var(--asic-icon-font-small); margin-inline: var(--asic-space-4); width: 1em; overflow: hidden; } @supports not (content: "x"/"y") { .asic-breadcrumbs__item:not(:last-child):after { alt: ""; content: "chevron_right"; } } .asic-breadcrumbs__item-link, .asic-breadcrumbs__toggle { border-radius: var(--asic-border-radius-xsmall); color: var(--asic-color-text-link); cursor: pointer; font: var(--asic-text-body-shorthand); text-decoration: none; display: inline-block; } @media (hover: hover) { :is(.asic-breadcrumbs__item-link, .asic-breadcrumbs__toggle):hover { text-decoration: underline; } } :is(.asic-breadcrumbs__item-link, .asic-breadcrumbs__toggle):focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } :is(.asic-breadcrumbs__item-link, .asic-breadcrumbs__toggle)[aria-current=page] { color: var(--asic-color-text-muted); text-decoration: none; } .asic-breadcrumbs__toggle { appearance: none; background: 0; border: 0; padding: 0; } .asic-button { --button-size: var(--asic-space-48); --button-x-padding: var(--asic-space-16); --button-font: var(---asic-text-body-shorthand); --button-icon-font: var(--asic-icon-font); appearance: none; block-size: var(--button-size); border-radius: var(--asic-border-radius-small); border: var(--asic-border-width-medium) solid transparent; box-sizing: border-box; font: var(--button-font); font-weight: var(--asic-font-weight-medium); align-items: center; gap: var(--asic-space-8); padding-block: 0; padding-inline: var(--button-x-padding); white-space: nowrap; background: 0; justify-content: center; text-decoration: none; display: inline-flex; } .asic-button:not(:disabled) { cursor: pointer; } .asic-button:disabled { opacity: var(--asic-opacity-disabled); } .asic-button:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-button:where([data-symbol-start]):before { font: var(--button-icon-font); content: attr(data-symbol-start)/""; -webkit-font-smoothing: antialiased; width: 1em; display: inline-block; overflow: hidden; } @supports not (content: "x"/"y") { .asic-button:where([data-symbol-start]):before { alt: ""; content: attr(data-symbol-start); } } .asic-button:where([data-symbol-end]):after { font: var(--button-icon-font); content: attr(data-symbol-end)/""; -webkit-font-smoothing: antialiased; width: 1em; display: inline-block; overflow: hidden; } @supports not (content: "x"/"y") { .asic-button:where([data-symbol-end]):after { alt: ""; content: attr(data-symbol-end); } } .asic-button--primary { background-color: var(--asic-color-background-accent-emphasis); color: var(--asic-color-text-inverse); } @media (hover: hover) { .asic-button--primary:not(:disabled):hover { background-color: var(--asic-color-text); } } .asic-button--primary.asic-button--critical { background-color: var(--asic-color-system-error); color: var(--asic-color-text-inverse); } .asic-button--secondary { color: var(--asic-color-text-link); border-color: currentColor; } @media (hover: hover) { .asic-button--secondary:not(:disabled):hover { color: var(--asic-color-text); } } .asic-button--secondary.asic-button--critical { color: var(--asic-color-system-error); border-color: var(--asic-color-system-error); } @media (hover: hover) { .asic-button--secondary.asic-button--critical:not(:disabled):hover { border-color: var(--asic-color-text); } } .asic-button--tertiary { color: var(--asic-color-text-link); text-decoration: underline; } @media (hover: hover) { .asic-button--tertiary:not(:disabled):hover { color: var(--asic-color-text); text-decoration: none; } } .asic-button--tertiary.asic-button--critical { color: var(--asic-color-system-error); } .asic-button--small { --button-size: var(--asic-space-40); --button-x-padding: var(--asic-space-12); --button-font: var(--asic-text-body-small-shorthand); --button-icon-font: var(--asic-icon-font-medium); } .asic-button-group { gap: var(--asic-space-16); flex-wrap: wrap; margin: 0; padding: 0; list-style: none; display: flex; } .asic-button-group:has(.asic-button--small), .asic-button-group:has(.asic-icon-button--small) { gap: var(--asic-space-12); } .asic-action-group { gap: var(--asic-space-16); } @media not (min-width: 768px) { .asic-action-group { flex-direction: column; display: flex; } .asic-action-group .asic-button--primary { order: 1; } .asic-action-group .asic-button--secondary { order: 2; } .asic-action-group .asic-button--tertiary { order: 3; } } @media (min-width: 768px) { .asic-action-group { grid-template-columns: max-content 1fr; grid-auto-flow: column; display: grid; } .asic-action-group:has(.asic-action-group:nth-child(3)) { grid-template-columns: max-content 1fr max-content; } .asic-action-group .asic-button--tertiary { grid-column: 1/2; } .asic-action-group .asic-button--secondary { grid-column: 2/3; justify-self: end; } .asic-action-group .asic-button--primary { grid-column: 3/4; } } .asic-callout { background-color: var(--callout-background); border-inline-start: var(--callout-border-width) solid var(--callout-accent); border-radius: var(--callout-border-width); padding-block: var(--asic-space-12); padding-inline: calc(var(--asic-space-24) - var(--callout-border-width)); --callout-border-width: var(--asic-border-width-thick); --callout-background: var(--asic-color-system-neutral-muted); --callout-accent: var(--asic-color-system-neutral); --callout-icon: "chat"; position: relative; } .asic-callout:where([class*=asic-callout--]) { padding-inline-start: calc(var(--asic-space-24) + var(--asic-icon-size) - var(--callout-border-width)); } .asic-callout:where([class*=asic-callout--]):after { color: var(--callout-accent); content: var(--callout-icon)/""; font: var(--asic-icon-font); font-variation-settings: var(--asic-icon-fill); position: absolute; inset-block-start: var(--asic-space-24); inset-inline-start: calc(var(--asic-space-12) - var(--callout-border-width)); } @supports not (content: "x"/"y") { .asic-callout:where([class*=asic-callout--]):after { alt: ""; content: var(--callout-icon); } } .asic-callout__content { padding-block: var(--asic-space-12); } .asic-callout__title + .asic-callout__content { padding-top: 0; } .asic-callout__title { color: var(--asic-color-text-emphasis); font: var(--asic-text-title-small-shorthand); padding-block: var(--asic-space-12); margin-block: 0; } .asic-callout--important { --callout-background: var(--asic-color-system-info-muted); --callout-accent: var(--asic-color-system-info); --callout-icon: "try"; } .asic-callout--caution { --callout-background: var(--asic-color-system-warning-muted); --callout-accent: var(--asic-color-system-warning); --callout-icon: "announcement"; } .asic-callout--audience { --callout-background: var(--asic-color-system-highlight-muted); --callout-accent: var(--asic-color-system-highlight); --callout-icon: "3p"; } .asic-card { background-color: var(--asic-color-background); border: var(--asic-border-width-thin) solid var(--asic-color-border); border-radius: var(--asic-border-radius-small); box-sizing: border-box; min-height: var(--asic-space-192); --gap: var(--asic-space-12); --gutter: var(--asic-space-24); --icon-disc: var(--asic-space-72); display: grid; position: relative; } .asic-card :where(audio, canvas, embed, iframe, img, object, picture, video) { max-width: 100%; height: auto; display: block; } .asic-card:not(:has(.asic-card__icon), :has(.asic-card__media)) { grid-template-areas: ". . ." ". header ." ". content ." ". . ." ". arrow ." ". . ."; grid-template-columns: var(--gutter) minmax(0, 1fr) var(--gutter); grid-template-rows: var(--gutter) auto minmax(0, 1fr) var(--gutter) var(--asic-icon-size) var(--gutter); } .asic-card:not(:has(.asic-card__icon), :has(.asic-card__media)):after { color: var(--asic-color-text); content: "arrow_forward"/""; font: var(--asic-icon-font); grid-area: arrow; } @supports not (content: "x"/"y") { .asic-card:not(:has(.asic-card__icon), :has(.asic-card__media)):after { alt: ""; content: "arrow_forward"; } } .asic-card:has(.asic-card__icon) { grid-template-areas: ". . ." ". icon ." ". . ." ". header ." ". content ." ". . ."; grid-template-columns: var(--gutter) minmax(0, 1fr) var(--gutter); grid-template-rows: var(--gutter) var(--icon-disc) var(--gap) auto minmax(0, 1fr) var(--gutter); text-align: center; justify-items: center; } .asic-card:has(.asic-card__media) { grid-template-areas: "media media media" ". . ." ". header ." ". content ." ". . ."; grid-template-columns: var(--gutter) minmax(0, 1fr) var(--gutter); grid-template-rows: auto var(--gutter) auto minmax(0, 1fr) var(--gutter); } .asic-card__media { grid-area: media; } .asic-card__header { grid-area: header; } .asic-card__title { color: var(--asic-color-text-emphasis); font: var(--asic-text-title-small-shorthand); margin: 0; } .asic-card__title-link { color: var(--asic-color-text-emphasis); outline: 0; text-decoration: none; } @media (hover: hover) { .asic-card__title-link:hover { text-decoration: underline; } } .asic-card__title-link:after { border-radius: var(--asic-border-radius-small); content: " "; position: absolute; inset: 0; } .asic-card__title-link:focus-visible:after { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-card__content { color: var(--asic-color-text); margin-top: var(--gap); grid-area: content; } .asic-card__icon { background-color: var(--asic-color-background-accent-alt); border-radius: var(--asic-border-radius-full); color: var(--asic-color-text-link); font: var(--asic-icon-font-xlarge); height: var(--icon-disc); width: var(--icon-disc); grid-area: icon; place-items: center; display: grid; } .asic-card__icon:after { content: attr(data-symbol)/""; -webkit-font-smoothing: antialiased; width: 1em; display: inline-block; overflow: hidden; } @supports not (content: "x"/"y") { .asic-card__icon:after { alt: ""; content: attr(data-symbol); } } .asic-card-grid { gap: var(--asic-space-24); grid-template-columns: repeat(var(--layout-mode), minmax(var(--asic-space-256), 1fr)); --layout-mode: auto-fill; margin: 0; padding: 0; list-style: none; display: grid; } .asic-card-grid--fit { --layout-mode: auto-fit; } .asic-checkbox { appearance: none; background-color: var(--asic-color-background); border: var(--asic-border-width-medium) solid var(--asic-color-control-border); border-radius: var(--asic-border-radius-small); color: var(--asic-color-text-inverse); height: var(--asic-form-control-size); width: var(--asic-form-control-size); place-content: center; margin: 0; padding: 0; display: grid; } @media (prefers-reduced-motion: no-preference) { .asic-checkbox { transition: var(--asic-motion-duration-short) border var(--asic-motion-ease-in-out); } .asic-checkbox:after { transition: var(--asic-motion-duration-short) transform var(--asic-motion-ease-in-out), var(--asic-motion-duration-short) opacity var(--asic-motion-ease-in-out); } } .asic-checkbox:after { content: "check"/""; font: var(--asic-icon-font); opacity: 0; transform: scale(0.25); } @supports not (content: "x"/"y") { .asic-checkbox:after { alt: ""; content: "check"; } } .asic-checkbox:checked { border-color: var(--asic-color-background-accent-emphasis); border-width: calc(var(--asic-form-control-size) / 2); } .asic-checkbox:checked:after { opacity: 1; transform: scale(1); } .asic-checkbox:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-checkbox[aria-invalid=true] { background-color: var(--asic-color-system-error-muted); border-color: var(--asic-color-system-error); } .asic-checkbox:is(:disabled, [aria-disabled=true]) { background-color: var(--asic-color-control-background-disabled); border-color: var(--asic-color-control-border-disabled); color: var(--asic-color-text-disabled); } @media not (min-width: 768px) { .asic-page .asic-collapsible--offset { margin-top: calc(var(--asic-content-gutter) * -1); } .asic-container .asic-collapsible--offset { margin-inline: calc(var(--asic-container-gutter) * -1); } } @media not (min-width: 768px) { [aria-expanded=false] + .asic-collapsible__region { display: none; } } .asic-collapsible__toggle { appearance: none; border: 0; border-bottom: var(--asic-border-width-thin) solid var(--asic-color-border); box-sizing: border-box; color: var(--asic-color-item-fg-idle); cursor: pointer; font: var(--asic-text-title-small-shorthand); height: var(--asic-space-56); padding: 0 var(--asic-content-gap-x); text-align: start; background: 0; justify-content: space-between; align-items: center; width: 100%; display: flex; } @media (hover: hover) { .asic-collapsible__toggle:hover { background-color: var(--asic-color-item-bg-hover); color: var(--asic-color-item-fg-hover); } } .asic-collapsible__toggle:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-collapsible__toggle:after { content: "expand_more"/""; font: var(--asic-icon-font); width: 1em; overflow: hidden; } @supports not (content: "x"/"y") { .asic-collapsible__toggle:after { alt: ""; content: "expand_more"; } } @media (prefers-reduced-motion: no-preference) { .asic-collapsible__toggle:after { transition: transform var(--asic-motion-duration) var(--asic-motion-ease); } } .asic-collapsible__toggle[aria-expanded=true]:after { transform: rotate(180deg); } @media (min-width: 768px) { .asic-collapsible__toggle { display: none; } } :where([class*=asic-][class*=__content]) { color: var(--asic-color-text); min-width: 0; margin: 0; } :where([class*=asic-][class*=__content]) > * { margin-block: 0; } :where([class*=asic-][class*=__content]) > * + * { margin-top: 1rem; } :where([class*=asic-][class*=__content]) :where(a) { color: var(--asic-color-text-link); } :where([class*=asic-][class*=__content]) :where(img) { max-width: 100%; height: auto; } :where([class*=asic-][class*=__content]) :where(strong) { font-weight: var(--asic-font-weight-semibold); } .asic-date-range-picker { gap: var(--asic-space-12); grid-template-columns: repeat(2, 1fr); max-width: 24rem; display: grid; } .asic-date-range-picker .asic-textbox { box-sizing: border-box; width: 100%; } .asic-date-range-picker--fill { max-width: 100%; } .asic-date-picker__container { opacity: 0; text-align: center; visibility: hidden; background-color: var(--asic-color-background); padding: var(--asic-space-12); font: var(--asic-font-body); border-radius: var(--asic-border-radius-medium); box-sizing: border-box; touch-action: manipulation; direction: ltr; border: 0; animation: none; display: none; position: absolute; box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1019607843); } .asic-date-picker__container:where([aria-expanded=true]) { visibility: visible; opacity: 1; z-index: 99999; display: block; } .asic-date-picker__container svg { display: none; } .asic-date-picker__header { gap: var(--asic-space-16); height: var(--asic-space-40); justify-content: space-between; align-items: center; display: flex; } .asic-date-picker__footer { gap: var(--asic-space-16); justify-content: space-between; align-items: center; display: flex; } .asic-date-picker__month { appearance: none; height: var(--asic-space-40); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' width='24px' fill='%23283038'%3E%3Cpath d='m12 14.975c-.133 0-.258-.02-.375-.063a.878.878 0 0 1 -.325-.212l-4.6-4.6a.948.948 0 0 1 -.275-.7c0-.283.092-.517.275-.7s.417-.275.7-.275.517.092.7.275l3.9 3.9 3.9-3.9a.948.948 0 0 1 .7-.275c.283 0 .517.092.7.275a.948.948 0 0 1 .275.7.948.948 0 0 1 -.275.7l-4.6 4.6c-.1.1-.208.17-.325.212a1.105 1.105 0 0 1 -.375.063z'/%3E%3C/svg%3E") no-repeat; background-position: right var(--asic-space-8) center; background-size: var(--icon-size-medium); font: var(--asic-text-body); color: var(--asic-color-text); border-radius: var(--asic-border-radius-medium); padding-inline: var(--asic-space-8); border: none; flex: 1; justify-content: flex-start; align-items: center; display: flex; } @media (hover: hover) { .asic-date-picker__month:hover { background-color: var(--asic-color-item-bg-hover); color: var(--asic-color-item-fg-hover); } } .asic-date-picker__month:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } @media (prefers-color-scheme: dark) { .asic-dark-support .asic-date-picker__month { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' width='24px' fill='%23f2f3f3'%3E%3Cpath d='m12 14.975c-.133 0-.258-.02-.375-.063a.878.878 0 0 1 -.325-.212l-4.6-4.6a.948.948 0 0 1 -.275-.7c0-.283.092-.517.275-.7s.417-.275.7-.275.517.092.7.275l3.9 3.9 3.9-3.9a.948.948 0 0 1 .7-.275c.283 0 .517.092.7.275a.948.948 0 0 1 .275.7.948.948 0 0 1 -.275.7l-4.6 4.6c-.1.1-.208.17-.325.212a1.105 1.105 0 0 1 -.375.063z'/%3E%3C/svg%3E"); } } .asic-dark .asic-date-picker__month { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' width='24px' fill='%23f2f3f3'%3E%3Cpath d='m12 14.975c-.133 0-.258-.02-.375-.063a.878.878 0 0 1 -.325-.212l-4.6-4.6a.948.948 0 0 1 -.275-.7c0-.283.092-.517.275-.7s.417-.275.7-.275.517.092.7.275l3.9 3.9 3.9-3.9a.948.948 0 0 1 .7-.275c.283 0 .517.092.7.275a.948.948 0 0 1 .275.7.948.948 0 0 1 -.275.7l-4.6 4.6c-.1.1-.208.17-.325.212a1.105 1.105 0 0 1 -.375.063z'/%3E%3C/svg%3E"); } .asic-date-picker__year { appearance: none; width: var(--asic-space-64); color: var(--asic-color-text); font: inherit; padding-inline: var(--asic-space-8); height: var(--asic-space-40); border-radius: var(--asic-border-radius-medium); font: var(--asic-font-body); background-color: rgba(0, 0, 0, 0); border: none; order: 0; } @media (hover: hover) { .asic-date-picker__year:hover { background-color: var(--asic-color-item-bg-hover); color: var(--asic-color-item-fg-hover); } } .asic-date-picker__year:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-date-picker__navigation { justify-content: center; align-items: center; display: flex; } .asic-date-picker__week { grid-template-columns: repeat(7, var(--asic-space-48)); grid-auto-rows: var(--asic-space-48); margin: 0; padding: 0; display: grid; } .asic-date-picker__week :where(li) { width: var(--asic-space-48); height: var(--asic-space-48); justify-content: center; align-items: center; margin: 0; padding: 0; display: flex; } .asic-date-picker__days { grid-template-columns: repeat(7, var(--asic-space-48)); grid-auto-rows: var(--asic-space-48); background-color: var(--asic-color-background); margin: 0; padding: 0; display: grid; } .asic-date-picker__days :where(li) { width: var(--asic-space-48); height: var(--asic-space-48); justify-content: center; align-items: center; margin: 0; padding: 0; list-style: none; display: flex; } .asic-date-picker__day { appearance: none; box-sizing: border-box; width: var(--asic-space-48); height: var(--asic-space-48); border: var(--asic-border-width-medium) solid transparent; color: var(--asic-color-text); cursor: pointer; border-radius: var(--asic-border-radius-small); background-color: rgba(0, 0, 0, 0); justify-content: center; align-items: center; display: flex; position: relative; } .asic-date-picker__day:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); z-index: 1; } @media (hover: hover) { .asic-date-picker__day:hover { background-color: var(--asic-color-item-bg-hover); color: var(--asic-color-item-fg-hover); } } .asic-date-picker__day--disabled { color: var(--asic-color-text-disabled); background-color: var(--asic-color-control-background-disabled); cursor: not-allowed; } @media (hover: hover) { .asic-date-picker__day--disabled:hover { background-color: var(--asic-color-control-background-disabled); color: var(--asic-color-text-disabled); } } .asic-date-picker__day--selected { background-color: var(--asic-color-background-emphasis); color: var(--asic-color-text-inverse); } @media (hover: hover) { .asic-date-picker__day--selected:hover { background-color: var(--asic-color-background-emphasis); color: var(--asic-color-text-inverse); } } .asic-date-picker__day--startRange { border-top-right-radius: 0; border-bottom-right-radius: 0; } .asic-date-picker__day--endRange { border-top-left-radius: 0; border-bottom-left-radius: 0; } .asic-date-picker__day--inRange { background-color: var(--asic-color-background-accent-alt); border-radius: 0; } .asic-date-picker__day--prevMonthDay, .asic-date-picker__day--nextMonthDay { color: var(--asic-color-text-disabled); } .asic-date-picker__day--today:after { content: "•"; bottom: var(--asic-space-12); line-height: 0; position: absolute; } .asic-dl { --asic-dl-divider: var(--asic-border-width-thin) solid var(--asic-color-border); box-sizing: border-box; margin-block: 0; } .asic-dl :where(dt) { color: var(--asic-color-text); font-weight: var(--asic-font-weight-medium); padding-block-start: var(--asic-space-8); } .asic-dl :where(dd) { color: var(--asic-color-text); margin-left: 0; padding-block-start: var(--asic-space-4); padding-block-end: var(--asic-space-8); } .asic-dl--dividers { border-block-start: var(--asic-dl-divider); } .asic-dl--dividers :where(dt) { padding-block-start: var(--asic-space-16); } .asic-dl--dividers :where(dd) { border-block-end: var(--asic-dl-divider); } @media (min-width: 768px) { .asic-dl--dividers :where(dd) { border-block-end: var(--asic-dl-divider); padding-block-end: var(--asic-space-16); } } .asic-dl--horizontal { justify-items: stretch; column-gap: var(--asic-space-16); display: grid; } @media (min-width: 768px) { .asic-dl--horizontal { grid-template-columns: 50% 1fr; } .asic-dl--horizontal :where(dt, dd) { padding-block: var(--asic-space-8); } } .asic-dl--horizontal.asic-dl--dividers { column-gap: 0; } .asic-dl--horizontal.asic-dl--dividers :where(dt) { padding-inline-end: var(--asic-space-16); } .asic-dl--horizontal.asic-dl--dividers :where(dd) { padding-block-end: var(--asic-space-16); } @media (min-width: 768px) { .asic-dl--horizontal.asic-dl--dividers :where(dd, dt) { padding-block: var(--asic-space-16); border-block-end: var(--asic-dl-divider); } } .asic-divider { background-color: var(--asic-color-border-muted); border-radius: var(--divider-thickness); height: var(--divider-thickness); --divider-thickness: var(--asic-border-width-thin); border: 0; width: 100%; } .asic-divider--medium { --divider-thickness: var(--asic-border-width-medium); } .asic-divider--thick { --divider-thickness: var(--asic-border-width-thick); } .asic-field { gap: var(--asic-form-text-gap); border: 0; margin: 0; padding: 0; display: grid; } .asic-field-group { gap: var(--asic-form-group-gap); margin: 0; padding: 0; display: grid; } .asic-field__label { color: var(--asic-color-text); cursor: default; font: var(--asic-text-body-shorthand); font-weight: var(--asic-font-weight-medium); margin: 0; padding: 0; } .asic-field:not(:has(:required, [aria-required=true])) .asic-field__label:after { color: var(--asic-color-text-disabled); content: "(optional)"; font-weight: var(--asic-font-weight-regular); margin-inline-start: var(--asic-space-4); } .asic-field__hint { color: var(--asic-color-text-muted); font: var(--asic-text-body-small-shorthand); margin: 0; padding: 0; display: block; } .asic-field__message { color: var(--asic-color-system-error); font: var(--asic-text-body-small-shorthand); align-items: center; gap: var(--asic-space-4); margin: 0; padding: 0; display: flex; } .asic-field__message:before { color: var(--asic-color-system-error); content: "error"/"Error: "; font: var(--asic-icon-font-small); font-variation-settings: var(--asic-icon-fill); width: 1em; overflow: hidden; } @supports not (content: "x"/"y") { .asic-field__message:before { alt: "Error: "; content: "error"; } } .asic-fieldset { border: 0; margin: 0; padding: 0; } .asic-fieldset .asic-field-group { margin-top: var(--asic-form-group-gap); } .asic-fieldset__legend { color: var(--asic-color-text); cursor: default; font: var(--asic-text-title-small-shorthand); margin: 0; padding: 0; } .asic-fieldset__hint { color: var(--asic-color-text-muted); font: var(--asic-text-body-shorthand); margin-top: var(--asic-form-text-gap); display: block; } .asic-file-upload { justify-content: center; align-items: center; gap: var(--asic-space-16); box-sizing: border-box; width: 100%; height: 100%; padding: var(--asic-space-32); color: var(--asic-color-text); border: var(--asic-border-width-thick) dashed var(--asic-color-border); border-radius: var(--asic-border-radius-medium); flex-direction: column; display: flex; position: relative; } .asic-file-upload input[type=file] { appearance: none; opacity: 0; cursor: pointer; width: 100%; height: 100%; position: absolute; } @media (hover: hover) { .asic-file-upload:hover { background-color: var(--asic-color-item-bg-hover); } } .asic-file-upload:focus-within { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-file-upload:where(.asic-file-upload:has(input[aria-invalid=true])) { background-color: var(--asic-color-system-error-muted); border-color: var(--asic-color-system-error); } .asic-file-upload:where(.asic-file-upload:has(input:is(:disabled, [aria-disabled=true]))) { background-color: var(--asic-color-control-background-disabled); border-color: var(--asic-color-control-border-disabled); color: var(--asic-color-text-disabled); } .asic-file-upload:where(.asic-file-upload:has(input:is(:disabled, [aria-disabled=true]))) input[type=file] { cursor: not-allowed; } .asic-file-upload:where(.asic-file-upload:has(input:is(:disabled, [aria-disabled=true]))) label { opacity: 0.3; } .asic-file-upload:before { pointer-events: none; content: attr(data-symbol, "upload")/""; font: var(--asic-icon-font-xlarge); -webkit-font-smoothing: antialiased; order: 1; display: inline-block; } @supports not (content: "x"/"y") { .asic-file-upload:before { alt: ""; content: attr(data-symbol, "upload"); } } .asic-file-upload:after { pointer-events: none; content: attr(data-idle-message, "Drag and drop files here or click to upload"); font-family: var(--asic-font-family-sans); font-size: var(--asic-text-body-size); line-height: var(--asic-lineheight-regular); font-weight: var(--asic-font-weight-medium); text-align: center; text-wrap-style: balance; -webkit-font-smoothing: antialiased; order: 2; display: inline-block; } .asic-file-upload :where(label) { pointer-events: none; order: 3; } .asic-file-upload--dragging { border-color: var(--asic-color-background-accent-emphasis); background-color: var(--asic-color-background-accent); } @media (hover: hover) { .asic-file-upload--dragging:hover { background-color: var(--asic-color-background-accent); } } .asic-file-upload--dragging:after { content: attr(data-dragging-message, "Drop files here"); color: var(--asic-color-text-emphasis); } .asic-file-upload--dragging:before, .asic-file-upload--dragging :where(label) { opacity: 0; } .asic-file-list { flex-direction: column; display: flex; } .asic-file-card { box-sizing: border-box; grid-auto-columns: auto; grid-template-columns: var(--asic-space-24) 1fr var(--asic-space-48); align-items: center; gap: var(--asic-space-16); min-height: var(--asic-space-48); border-bottom: var(--asic-border-width-thin) solid var(--asic-color-border-muted); display: grid; } .asic-file-card .asic-icon { color: var(--asic-color-text-link); } .asic-file-card__details { flex-direction: column; width: 100%; max-width: 100%; display: flex; overflow: hidden; } .asic-file-card__filename { font-size: var(--asic-text-body-small-size); line-height: var(--asic-font-lineheight-dense); font-weight: var(--asic-font-weight-semibold); color: var(--asic-color-text); text-overflow: ellipsis; white-space: nowrap; max-width: max-content; overflow: hidden; } .asic-file-card__meta { font-size: var(--asic-text-body-small-size); line-height: var(--asic-font-lineheight-dense); font-weight: var(--asic-font-weight-regular); color: var(--asic-color-text-muted); } .asic-file-card--error .asic-icon, .asic-file-card--error .asic-file-card__meta { color: var(--asic-color-system-error); } .asic-footer { background-color: var(--asic-color-background-alt); } .asic-footer__inner { padding-block: var(--asic-space-32); } .asic-footer__content { font: var(--asic-text-body-small-shorthand); } .asic-footer__logo { height: var(--asic-space-56); display: inline-block; } .asic-footer__logo:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-footer__link-list { gap: var(--asic-space-16); flex-direction: column; margin: 0; padding: 0; list-style: none; display: flex; } .asic-footer__link { color: var(--asic-color-text); font: var(--asic-text-body-shorthand); text-decoration: none; text-decoration-thickness: var(--asic-border-width-thin); text-underline-offset: var(--asic-border-width-medium); } @media (hover: hover) { .asic-footer__link:hover { color: var(--asic-color-text); text-decoration: underline; } } .asic-footer__link:focus-visible { color: var(--asic-color-text); outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); text-decoration: underline; } .asic-form-control { gap: var(--asic-space-8); grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "input label"; display: grid; } .asic-form-control-group .asic-form-control { margin-top: var(--asic-space-16); } .asic-form-control__input { grid-area: input; } .asic-form-control__label { color: var(--asic-color-text); cursor: default; font: var(--asic-text-body-shorthand); margin: 0; padding: 0; } input:disabled + .asic-form-control__label { color: var(--asic-color-text-disabled); } .asic-form-control-group { border: 0; margin: 0; padding: 0; } .asic-form-control-group__legend { color: var(--asic-color-text); cursor: default; font: var(--asic-text-body-shorthand); font-weight: var(--asic-font-weight-medium); margin: 0; padding: 0; } .asic-form-control-group:not(:has(:required, [aria-required=true])) .asic-form-control-group__legend:after { color: var(--asic-color-text-disabled); content: "(optional)"; font-weight: var(--asic-font-weight-regular); margin-inline-start: var(--asic-space-4); } .asic-form-control-group__hint { color: var(--asic-color-text-muted); font: var(--asic-text-body-small-shorthand); margin: var(--asic-form-text-gap) 0 0; padding: 0; display: block; } .asic-form-control-group__message { color: var(--asic-color-system-error); font: var(--asic-text-body-small-shorthand); align-items: center; gap: var(--asic-space-4); margin: var(--asic-form-text-gap) 0 0; padding: 0; display: flex; } .asic-form-control-group__message:before { color: var(--asic-color-system-error); content: "error"/"Error: "; font: var(--asic-icon-font-small); font-variation-settings: var(--asic-icon-fill); width: 1em; overflow: hidden; } @supports not (content: "x"/"y") { .asic-form-control-group__message:before { alt: "Error: "; content: "error"; } } .asic-header { background-color: var(--asic-color-background-alt); } .asic-header-alt { background-color: var(--asic-color-background); } .asic-header__inner { align-items: center; column-gap: var(--asic-content-gap-x); padding-block: var(--asic-content-gutter); row-gap: var(--asic-content-gap-y); display: grid; } @media (min-width: 768px) { .asic-header__inner { grid-template-columns: var(--asic-sidebar-width) minmax(0, 1fr); } } @media (min-width: 768px) { .asic-header__content { border-inline-start: var(--asic-border-width-medium) solid var(--asic-color-border); padding-inline-start: var(--asic-content-gap-x); } } .asic-header__logo { height: var(--asic-space-56); display: inline-block; } .asic-header__logo:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-header--compact .asic-header__logo { height: var(--asic-space-40); } .asic-header--compact .asic-header__inner { padding-block: var(--asic-space-16); } .asic-icon-button { --button-size: var(--asic-space-48); --button-icon-font: var(--asic-icon-font); appearance: none; block-size: var(--button-size); inline-size: var(--button-size); border-radius: var(--asic-border-radius-small); border: var(--asic-border-width-medium) solid transparent; box-sizing: border-box; padding-block: 0; padding-inline: 0; white-space: nowrap; background: 0; padding-inline-start: calc(var(--button-size) - 2 * var(--asic-border-width-medium)); text-decoration: none; position: relative; overflow: hidden; } .asic-icon-button:before { block-size: calc(var(--button-size) - 2 * var(--asic-border-width-medium)); inline-size: calc(var(--button-size) - 2 * var(--asic-border-width-medium)); content: attr(data-symbol)/""; font: var(--button-icon-font); box-sizing: border-box; -webkit-text-decoration: inherit; text-decoration: inherit; justify-content: center; align-items: center; display: inline-flex; position: absolute; top: 0; left: 0; } @supports not (content: "x"/"y") { .asic-icon-button:before { alt: ""; content: attr(data-symbol); } } .asic-icon-button:not(:disabled) { cursor: pointer; } .asic-icon-button:disabled { opacity: var(--asic-opacity-disabled); } .asic-icon-button:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-icon-button--primary { background-color: var(--asic-color-background-accent-emphasis); color: var(--asic-color-text-inverse); } @media (hover: hover) { .asic-icon-button--primary:not(:disabled):hover { background-color: var(--asic-color-text); } } .asic-icon-button--primary.asic-icon-button--critical { background-color: var(--asic-color-system-error); color: var(--asic-color-text-inverse); } .asic-icon-button--secondary { color: var(--asic-color-text-link); border-color: currentColor; } @media (hover: hover) { .asic-icon-button--secondary:not(:disabled):hover { color: var(--asic-color-text); } } .asic-icon-button--secondary.asic-icon-button--critical { color: var(--asic-color-system-error); border-color: var(--asic-color-system-error); } @media (hover: hover) { .asic-icon-button--secondary.asic-icon-button--critical:not(:disabled):hover { border-color: var(--asic-color-text); } } .asic-icon-button--tertiary { color: var(--asic-color-text-link); } @media (hover: hover) { .asic-icon-button--tertiary:not(:disabled):hover { color: var(--asic-color-text); } } .asic-icon-button--tertiary.asic-icon-button--critical { color: var(--asic-color-system-error); } .asic-icon-button--small { --button-size: var(--asic-space-40); --button-icon-font: var(--asic-icon-font-medium); } :where(.asic-icon, .asic-icon-small, .asic-icon-medium, .asic-icon-large, .asic-icon-xlarge) { font: var(--asic-icon-font); } :where(.asic-icon, .asic-icon-small, .asic-icon-medium, .asic-icon-large, .asic-icon-xlarge):after { content: attr(data-symbol)/""; -webkit-font-smoothing: antialiased; width: 1em; display: inline-block; overflow: hidden; } @supports not (content: "x"/"y") { :where(.asic-icon, .asic-icon-small, .asic-icon-medium, .asic-icon-large, .asic-icon-xlarge):after { alt: ""; content: attr(data-symbol); } } .asic-icon-small { font: var(--asic-icon-font-small); } .asic-icon-medium { font: var(--asic-icon-font-medium); } .asic-icon-large { font: var(--asic-icon-font-large); } .asic-icon-xlarge { font: var(--asic-icon-font-xlarge); } .asic-icon--line { font-variation-settings: var(--asic-icon-line); } .asic-icon--fill { font-variation-settings: var(--asic-icon-fill); } .asic-root { --asic-content-gap-x: clamp(var(--asic-space-12), 3vw, var(--asic-space-56)); --asic-content-gap-y: var(--asic-space-24); --asic-content-gutter: var(--asic-space-24); --asic-content-max: 42rem; --asic-container-gutter: var(--asic-content-gap-x); --asic-container-max: calc(var(--asic-content-max) + var(--asic-container-gutter) * 2); --asic-sidebar-width: clamp(var(--asic-space-256), 22.0%, var(--asic-space-320)); grid-template-rows: auto 1fr auto; min-height: 100vh; display: grid; } @media (min-width: 768px) { .asic-root { --asic-container-max: 1380px; --asic-content-gap-y: var(--asic-space-32); --asic-content-gutter: var(--asic-space-32); } } @media (min-width: 1200px) { .asic-root { --asic-content-gutter: var(--asic-space-48); } } .asic-container { width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-max)); margin-inline: auto; container-type: inline-size; } .asic-content-container { max-width: var(--asic-content-max); container-type: inline-size; } .asic-page { padding-block: var(--asic-content-gutter) calc(var(--asic-content-gutter) * 2); } .asic-page:has(.asic-page__sidebar) { row-gap: var(--asic-content-gap-y); display: grid; } @media (min-width: 768px) { .asic-page:has(.asic-page__sidebar) { column-gap: var(--asic-content-gap-x); grid-template-columns: var(--asic-sidebar-width) minmax(0, 1fr); } } .asic-page-header { padding-block: var(--asic-content-gap-y); } .asic-page__main { align-content: start; column-gap: var(--asic-content-gap-x); row-gap: var(--asic-content-gap-y); grid-template-areas: "header" "article"; display: grid; } .asic-page__main:has(.asic-page__aside) { grid-template-areas: "header" "aside" "article"; } @media (min-width: 1200px) { .asic-page__main:has(.asic-page__aside) { grid-template-columns: minmax(0, 1fr) var(--asic-space-256); grid-template-areas: "header header" "article aside"; } } .asic-page__header { grid-area: header; min-width: 0; } .asic-page__article { grid-area: article; min-width: 0; container-type: inline-size; } .asic-page__aside { grid-area: aside; min-width: 0; container-type: inline-size; } .asic-line-clamp, .asic-line-clamp-1, .asic-line-clamp-2, .asic-line-clamp-3, .asic-line-clamp-4, .asic-line-clamp-5, .asic-line-clamp-6, .asic-line-clamp-7, .asic-line-clamp-8 { --clamp-lines: 2; } :is(.asic-line-clamp, .asic-line-clamp-1, .asic-line-clamp-2, .asic-line-clamp-3, .asic-line-clamp-4, .asic-line-clamp-5, .asic-line-clamp-6, .asic-line-clamp-7, .asic-line-clamp-8):has(.asic-line-clamp__toggle:checked) { --clamp-lines: 10000; } .asic-line-clamp-1 { --clamp-lines: 1; } .asic-line-clamp-3 { --clamp-lines: 3; } .asic-line-clamp-4 { --clamp-lines: 4; } .asic-line-clamp-5 { --clamp-lines: 5; } .asic-line-clamp-6 { --clamp-lines: 6; } .asic-line-clamp-7 { --clamp-lines: 7; } .asic-line-clamp-8 { --clamp-lines: 8; } .asic-line-clamp__content { text-overflow: ellipsis; -webkit-line-clamp: var(--clamp-lines); line-clamp: var(--clamp-lines); -webkit-box-orient: vertical; display: -webkit-box; overflow: hidden; } .asic-line-clamp__toggle { appearance: none; font: var(--asic-text-body-small-shorthand); box-sizing: border-box; text-align: right; cursor: pointer; width: auto; color: var(--asic-color-text-link); border-radius: var(--asic-border-radius-xsmall); text-decoration: underline; -webkit-text-decoration-color: color-mix(in srgb, var(--asic-color-text-link) 33%, var(--asic-color-background)); text-decoration-color: color-mix(in srgb, var(--asic-color-text-link) 33%, var(--asic-color-background)); text-decoration-thickness: var(--asic-border-width-thin); text-underline-offset: var(--asic-border-width-medium); margin-left: 0; margin-right: 0; display: inline-block; position: relative; } .asic-line-clamp__toggle:before { content: attr(data-more, "Show more"); display: inline; } .asic-line-clamp__toggle:after { content: "expand_more"/""; font: var(--asic-icon-font); font-size: var(--asic-icon-font-size); vertical-align: middle; width: 1em; display: inline-block; overflow: hidden; } @supports not (content: "x"/"y") { .asic-line-clamp__toggle:after { alt: ""; content: "expand_more"; } } @media (hover: hover) { .asic-line-clamp__toggle:hover { text-decoration: none; } } .asic-line-clamp__toggle:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-line-clamp__toggle:checked:before { content: attr(data-less, "Show less"); } .asic-line-clamp__toggle:checked:after { transform: rotate(180deg); } .asic-link-list { --padding-x: var(--asic-space-12); --padding-y: var(--asic-space-12); --item-height: var(--asic-space-48); --divider: var(--asic-border-width-thin) solid var(--asic-color-border); --icon-space: calc(var(--asic-icon-size-small) + var(--padding-x)); margin: 0; padding: 0; list-style: none; } .asic-link-list--columns { column-gap: var(--asic-space-24); column-width: var(--asic-space-256); } .asic-link-list__item { border-block-end: var(--divider); box-sizing: border-box; min-height: var(--item-height); padding-block: var(--padding-y); grid-template-areas: "anchor icon"; grid-template-columns: minmax(0, 1fr) var(--icon-space); align-items: center; display: grid; position: relative; } .asic-link-list__item:has(.asic-link-list__summary) { grid-template-areas: "anchor icon" "summary icon"; } .asic-link-list__item:after { color: var(--asic-color-text); content: "arrow_forward"/""; font: var(--asic-icon-font-small); grid-area: icon; width: 1em; overflow: hidden; } @supports not (content: "x"/"y") { .asic-link-list__item:after { alt: ""; content: "arrow_forward"; } } .asic-link-list__item-link { color: var(--asic-color-text-link); font: var(--asic-text-body-shorthand); grid-area: anchor; padding-inline-end: var(--padding-x); text-decoration: none; } .asic-link-list:has(.asic-link-list__summary) .asic-link-list__item-link { font-weight: var(--asic-font-weight-medium); } .asic-link-list__item-link:after { content: " "; position: absolute; inset: 0; } @media (hover: hover) { .asic-link-list__item-link:hover { text-decoration: underline; } } .asic-link-list__item-link:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-link-list__summary { font: var(--asic-text-body-small-shorthand); grid-area: summary; padding-inline-end: var(--padding-x); } .asic-logo { --asic-logo-primary: var(--static-brand-granite); --asic-logo-secondary: var(--static-brand-blue); max-width: 100%; max-height: 100%; } @media (prefers-color-scheme: dark) { .asic-dark-support .asic-logo { --asic-logo-primary: var(--static-gray-0); --asic-logo-secondary: var(--static-gray-0); } } .asic-dark .asic-logo { --asic-logo-primary: var(--static-gray-0); --asic-logo-secondary: var(--static-gray-0); } .asic-logo__primary { fill: var(--asic-logo-primary); } .asic-logo__secondary { fill: var(--asic-logo-secondary); } .asic-mainnav { background-color: var(--asic-color-background); --line-adornment-width: var(--asic-border-width-thickest); --item-height: var(--asic-space-56); position: relative; } .asic-mainnav:after { background-image: linear-gradient(to right, var(--static-brand-aqua), var(--static-brand-sky), var(--static-brand-blue)); content: ""; height: var(--line-adornment-width); margin-top: calc(var(--line-adornment-width) * -1); display: block; } .asic-mainnav__group { justify-content: space-between; display: flex; } .asic-mainnav__list { margin: 0; padding: 0; list-style: none; display: flex; } @media not (min-width: 768px) { .asic-mainnav:has(.asic-mainnav__dialog-trigger) .asic-mainnav__primary { display: none; } } .asic-mainnav__item-link, .asic-mainnav__dialog-trigger { border-bottom: calc(var(--line-adornment-width) * 1) solid transparent; color: var(--asic-color-text); align-items: center; gap: var(--asic-space-8); font: var(--asic-text-body-shorthand); height: var(--item-height); padding: 0 var(--asic-space-16); white-space: nowrap; text-decoration: none; display: flex; position: relative; } :is(.asic-mainnav__item-link, .asic-mainnav__dialog-trigger) > * { contain: paint; } @media (hover: hover) { :is(.asic-mainnav__item-link, .asic-mainnav__dialog-trigger):hover { color: var(--asic-color-item-fg-hover); text-decoration: underline; } } :is(.asic-mainnav__item-link, .asic-mainnav__dialog-trigger):focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); z-index: 2; } :is(.asic-mainnav__item-link, .asic-mainnav__dialog-trigger)[aria-current=page], :is(.asic-mainnav__item-link, .asic-mainnav__dialog-trigger)[aria-current=true] { background-color: var(--asic-color-background-alt); border-color: var(--asic-color-border-emphasis); color: var(--asic-color-text-emphasis); font-weight: var(--asic-font-weight-medium); position: relative; } .asic-mainnav__dialog-trigger { appearance: none; background: 0; border: 0; } .asic-mainnav__dialog-trigger:before { contain: paint; content: "menu"/""; font: var(--asic-icon-font); -webkit-font-smoothing: antialiased; width: 1em; overflow: hidden; } @supports not (content: "x"/"y") { .asic-mainnav__dialog-trigger:before { alt: ""; content: "menu"; } } /* ASIC Change from 768px */ @media (min-width: 1350px) { .asic-mainnav__dialog-trigger { display: none; } } .asic-mainnav__dialog-close { appearance: none; color: var(--asic-color-text); cursor: pointer; font: var(--asic-text-body-shorthand); font-weight: var(--asic-font-weight-medium); align-items: center; gap: var(--asic-space-8); height: var(--asic-space-56); background: 0; border: 0; width: 100%; padding: 0; display: flex; position: relative; } .asic-mainnav__dialog-close:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); z-index: 2; } .asic-mainnav__dialog-close:before { content: "close"/""; font: var(--asic-icon-font); -webkit-font-smoothing: antialiased; width: 1em; overflow: hidden; } @supports not (content: "x"/"y") { .asic-mainnav__dialog-close:before { alt: ""; content: "close"; } } .asic-mainnav__dialog { animation: slide-out var(--asic-motion-duration-long) var(--asic-motion-ease-out) forwards; background-color: var(--asic-color-background); box-sizing: border-box; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; height: 100vh; max-height: 100vh; padding: var(--asic-space-16); width: var(--asic-space-320); border: 0; margin: 0; inset-inline-end: auto; overflow-y: auto; transform: translateX(-100%); } .asic-mainnav__dialog::backdrop { animation: fade-out var(--asic-motion-duration-long) var(--asic-motion-ease-out) forwards; background-color: rgba(0, 0, 0, 0); } .asic-mainnav__dialog[open] { animation: slide-in var(--asic-motion-duration-long) var(--asic-motion-ease-out) forwards; transform: translateX(0); } .asic-mainnav__dialog[open]::backdrop { animation: fade-in var(--asic-motion-duration-long) var(--asic-motion-ease-out) forwards; background-color: rgba(0, 0, 0, 0.2509803922); } @keyframes slide-in { from { transform: translateX(-100%); } to { transform: translateX(0); } } @keyframes slide-out { from { transform: translateX(0); } to { transform: translateX(-100%); } } @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes fade-out { from { opacity: 1; } to { opacity: 0; } } .asic-mainnav__dialog .asic-mainnav__list { flex-direction: column; display: flex; } .asic-mainnav__dialog .asic-mainnav__item { border-bottom: var(--asic-border-width-thin) solid var(--asic-color-border); } .asic-mainnav__dialog .asic-mainnav__item-link { color: var(--asic-color-text-link); padding: var(--asic-space-16) 0; } .asic-mainnav__dialog .asic-mainnav__item-link[aria-current=page], .asic-mainnav__dialog .asic-mainnav__item-link[aria-current=true] { color: var(--asic-color-text-emphasis); } .asic-modal { background: var(--asic-color-background); border-radius: var(--asic-border-radius-small); box-sizing: border-box; gap: var(--asic-space-24); -webkit-overflow-scrolling: touch; padding: var(--asic-space-24); width: calc(100vw - var(--asic-space-32)); border: none; flex-direction: column; max-width: 720px; margin-inline: auto; overflow-y: auto; box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1019607843); } .asic-modal::backdrop { background-color: var(--static-brand-granite); } .asic-modal[open] { display: flex; } .asic-modal[open]::backdrop { opacity: 0.5; } @media (prefers-reduced-motion: no-preference) { .asic-modal { animation: asic-modal--leave var(--asic-motion-duration-long) var(--asic-motion-ease-out); } .asic-modal[open] { animation: asic-modal--enter var(--asic-motion-duration-long) var(--asic-motion-ease-out); } .asic-modal[open]::backdrop { animation: asic-modal--backdrop-fade-in var(--asic-motion-duration-long) var(--asic-motion-ease-out) forwards; } } .asic-modal__close { --button-size: var(--asic-space-48); appearance: none; block-size: var(--button-size); inline-size: var(--button-size); cursor: pointer; border-radius: var(--asic-border-radius-small); box-sizing: border-box; top: var(--asic-space-4); right: var(--asic-space-4); padding-block: 0; padding-inline: 0; white-space: nowrap; background: 0; border: none; padding-inline-start: var(--button-size); text-decoration: none; position: absolute; overflow: hidden; } .asic-modal__close:before { content: "close"/""; font: var(--asic-icon-font); -webkit-text-decoration: inherit; text-decoration: inherit; block-size: var(--button-size); inline-size: var(--button-size); justify-content: center; align-items: center; display: inline-flex; position: absolute; top: 0; left: 0; } @supports not (content: "x"/"y") { .asic-modal__close:before { alt: ""; content: "close"; } } .asic-modal__close:focus-visible { outline: var(--asic-focusring-outline); outline-offset: calc(var(--asic-space-4) * -1); } .asic-modal__content { color: var(--asic-color-text); } .asic-modal__title { font: var(--asic-text-title-small-shorthand); font-weight: var(--asic-font-weight-semibold); color: var(--asic-color-text); margin: 0; margin-right: var(--asic-space-32); } @keyframes asic-modal--enter { 0% { opacity: 0; display: none; transform: translateY(20px); } 100% { opacity: 1; display: flex; transform: translateY(0%); } } @keyframes asic-modal--leave { 0% { opacity: 1; display: flex; transform: translateY(0%); } 100% { opacity: 0; display: none; transform: translateY(20px); } } @keyframes asic-modal--backdrop-fade-in { 0% { opacity: 0; } 100% { opacity: 0.5; } } .asic-pagenav { top: var(--asic-content-gap-y); --padding-y: var(--asic-space-4); padding-inline-start: var(--asic-space-24); position: sticky; } .asic-pagenav:after { background-color: var(--asic-color-background-accent-emphasis); content: ""; inset-block: 0 var(--padding-y); width: var(--asic-border-width-thick); display: block; position: absolute; inset-inline-start: 0; } .asic-pagenav__title { color: var(--asic-color-text-emphasis); font: var(--asic-text-body-small-shorthand); font-weight: var(--asic-font-weight-medium); margin-block-end: var(--asic-space-16); } .asic-pagenav__list { margin: 0; padding: 0; list-style: none; } .asic-pagenav__item-link { border-radius: var(--asic-border-radius-xsmall); color: var(--asic-color-text-link); font: var(--asic-text-body-small-shorthand); padding-block: var(--padding-y); text-decoration: none; display: block; } @media (hover: hover) { .asic-pagenav__item-link:hover { text-decoration: underline; } } .asic-pagenav__item-link:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-pagenav__item-link--nested { padding-inline-start: var(--asic-space-16); } .asic-pagination { column-gap: var(--asic-space-24); row-gap: var(--asic-space-16); flex-direction: column; justify-content: center; align-items: center; display: flex; container-type: inline-size; } @media (min-width: 768px) { .asic-pagination { flex-flow: wrap; } .asic-pagination:has(.asic-pagination__control, .asic-pagination__range) { justify-content: space-between; } } .asic-pagination__page-list { gap: var(--asic-space-4); flex: 1; margin: 0; padding: 0; list-style: none; display: flex; } .asic-pagination__page-list :where(li) { display: inline-flex; } .asic-pagination__page-list :where(.asic-pagination__ellipsis) { padding-inline: var(--asic-space-16); padding-block: var(--asic-space-8); color: var(--asic-color-text); align-items: center; display: inline-flex; } .asic-pagination__page-list :where(.asic-pagination__ellipsis):after { content: "…"; } .asic-pagination__page-list :where(a) { box-sizing: border-box; padding-inline: var(--asic-space-16); padding-block: var(--asic-space-8); color: var(--asic-color-text-link); border-radius: var(--asic-border-radius-xsmall); text-decoration: underline; text-decoration-thickness: var(--asic-border-width-thin); text-underline-offset: var(--asic-border-width-medium); align-items: center; display: inline-flex; } @media (hover: hover) { .asic-pagination__page-list :where(a):hover { text-decoration: none; } } .asic-pagination__page-list :where(a):where([aria-current]) { color: var(--asic-color-text); text-decoration: none; } .asic-pagination__page-list :where(a):focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } @container (width < 400px) { .asic-pagination__page-list :where(li):not(:has([aria-current], .asic-pagination__ellipsis, .asic-pagination__previous, .asic-pagination__next, .asic-pagination__first, .asic-pagination__last)) { display: none; } .asic-pagination__page-list :where(li) .asic-pagination__ellipsis { padding-inline: var(--asic-space-4); } } .asic-pagination__previous, .asic-pagination__next { white-space: collapse; } :is(.asic-pagination__previous, .asic-pagination__next):before, :is(.asic-pagination__previous, .asic-pagination__next):after { font: var(--asic-icon-font); vertical-align: middle; box-sizing: border-box; text-decoration: none; display: inline-block; overflow: hidden; } @container (width < 500px) { :is(.asic-pagination__previous, .asic-pagination__next) { width: var(--asic-space-48); white-space: nowrap; padding-inline-start: var(--asic-space-48); padding-inline-end: 0; display: block; position: relative; overflow: hidden; } :is(.asic-pagination__previous, .asic-pagination__next):after, :is(.asic-pagination__previous, .asic-pagination__next):before { justify-content: center; align-items: center; block-size: 100%; inline-size: 100%; display: inline-flex; position: absolute; top: 0; left: 0; } } .asic-pagination__previous:before { content: "chevron_left"/""; } @supports not (content: "x"/"y") { .asic-pagination__previous:before { alt: ""; content: "chevron_left"; } } @container (width >= 500px) { .asic-pagination__previous { padding-inline-start: 0; padding-inline-end: var(--asic-space-24); } } .asic-pagination__next:after { content: "chevron_right"/""; } @supports not (content: "x"/"y") { .asic-pagination__next:after { alt: ""; content: "chevron_right"; } } @container (width >= 500px) { .asic-pagination__next { padding-inline-start: var(--asic-space-24); padding-inline-end: 0; } } .asic-pagination__range { color: var(--asic-color-text); font: var(--asic-text-body-shorthand); } .asic-pagination__control { align-items: center; gap: var(--asic-space-8); display: inline-flex; } .asic-pagination__control :where(label) { font: var(--asic-text-body-shorthand); font-weight: var(--asic-font-weight-semibold); } .asic-progress-circle { box-sizing: border-box; height: var(--size); width: var(--size); border: var(--stroke) solid var(--asic-color-border); --size: var(--asic-space-32); --stroke: var(--asic-border-width-thick); border-radius: 50%; position: relative; } .asic-progress-circle:before { border: var(--stroke) solid transparent; border-top-color: var(--asic-color-text-emphasis); content: ""; inset: calc(var(--stroke) * -1); border-radius: 50%; animation: 1s linear infinite spin; position: absolute; } .asic-progress-circle--small { --size: var(--asic-space-16); --stroke: var(--asic-border-width-medium); } .asic-progress-circle--medium { --size: var(--asic-space-24); --stroke: var(--asic-border-width-medium); } .asic-progress-circle--large { --size: var(--asic-space-48); } @keyframes spin { from { transform: rotate(0); } to { transform: rotate(360deg); } } .asic-radio { appearance: none; background-color: var(--asic-color-background); border: var(--asic-border-width-medium) solid var(--asic-color-control-border); color: currentColor; height: var(--asic-form-control-size); width: var(--asic-form-control-size); border-radius: 50%; place-content: center; margin: 0; padding: 0; display: grid; } @media (prefers-reduced-motion: no-preference) { .asic-radio { transition: var(--asic-motion-duration-short) border var(--asic-motion-ease-in-out), var(--asic-motion-duration-short) background-color var(--asic-motion-ease-in-out); } } .asic-radio:checked { background-color: var(--asic-color-text-inverse); border-color: var(--asic-color-background-accent-emphasis); border-width: calc(var(--asic-form-control-size) / 4); } .asic-radio:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-radio[aria-invalid=true] { background-color: var(--asic-color-system-error-muted); border-color: var(--asic-color-system-error); } .asic-radio:is(:disabled, [aria-disabled=true]) { background-color: var(--asic-color-control-background-disabled); border-color: var(--asic-color-control-border-disabled); } .asic-search-input { position: relative; } .asic-search-input:before { content: "search"/"Search"; font: var(--asic-icon-font); left: var(--asic-space-16); pointer-events: none; display: block; position: absolute; top: 50%; transform: translateY(-50%); } @supports not (content: "x"/"y") { .asic-search-input:before { alt: "Search"; content: "search"; } } .asic-search-input .asic-textbox { padding-inline-start: calc(var(--asic-icon-size) + 2 * var(--asic-space-12)); } .asic-search-input:has(:disabled, [aria-disabled=true]) { color: var(--asic-color-text-disabled); } .asic-select { appearance: none; background-color: var(--asic-color-background); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' width='24px' fill='%23283038'%3E%3Cpath d='m12 14.975c-.133 0-.258-.02-.375-.063a.878.878 0 0 1 -.325-.212l-4.6-4.6a.948.948 0 0 1 -.275-.7c0-.283.092-.517.275-.7s.417-.275.7-.275.517.092.7.275l3.9 3.9 3.9-3.9a.948.948 0 0 1 .7-.275c.283 0 .517.092.7.275a.948.948 0 0 1 .275.7.948.948 0 0 1 -.275.7l-4.6 4.6c-.1.1-.208.17-.325.212a1.105 1.105 0 0 1 -.375.063z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right var(--asic-space-8) center; background-size: var(--icon-size); border-radius: var(--asic-border-radius-small); border: var(--asic-border-width-medium) solid var(--asic-color-control-border); box-sizing: border-box; color: var(--asic-color-text); font: var(--asic-text-body-shorthand); height: var(--asic-space-48); padding-inline: var(--padding-x) calc(var(--padding-x) + var(--icon-size)); --icon-size: var(--asic-space-24); --padding-x: var(--asic-space-12); position: relative; } .asic-select::placeholder { color: var(--asic-color-text-disabled); } .asic-select:where(:enabled, :not([aria-disabled=true])):focus { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-select[aria-invalid=true] { background-color: var(--asic-color-system-error-muted); border-color: var(--asic-color-system-error); } .asic-select:is(:disabled, [aria-disabled=true]) { background-color: var(--asic-color-control-background-disabled); border-color: var(--asic-color-control-border-disabled); color: var(--asic-color-text-disabled); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' width='24px' fill='%23c7cdd4'%3E%3Cpath d='m12 14.975c-.133 0-.258-.02-.375-.063a.878.878 0 0 1 -.325-.212l-4.6-4.6a.948.948 0 0 1 -.275-.7c0-.283.092-.517.275-.7s.417-.275.7-.275.517.092.7.275l3.9 3.9 3.9-3.9a.948.948 0 0 1 .7-.275c.283 0 .517.092.7.275a.948.948 0 0 1 .275.7.948.948 0 0 1 -.275.7l-4.6 4.6c-.1.1-.208.17-.325.212a1.105 1.105 0 0 1 -.375.063z'/%3E%3C/svg%3E"); } @media (prefers-color-scheme: dark) { .asic-dark-support .asic-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' width='24px' fill='%23f2f3f3'%3E%3Cpath d='m12 14.975c-.133 0-.258-.02-.375-.063a.878.878 0 0 1 -.325-.212l-4.6-4.6a.948.948 0 0 1 -.275-.7c0-.283.092-.517.275-.7s.417-.275.7-.275.517.092.7.275l3.9 3.9 3.9-3.9a.948.948 0 0 1 .7-.275c.283 0 .517.092.7.275a.948.948 0 0 1 .275.7.948.948 0 0 1 -.275.7l-4.6 4.6c-.1.1-.208.17-.325.212a1.105 1.105 0 0 1 -.375.063z'/%3E%3C/svg%3E"); } } .asic-dark .asic-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' width='24px' fill='%23f2f3f3'%3E%3Cpath d='m12 14.975c-.133 0-.258-.02-.375-.063a.878.878 0 0 1 -.325-.212l-4.6-4.6a.948.948 0 0 1 -.275-.7c0-.283.092-.517.275-.7s.417-.275.7-.275.517.092.7.275l3.9 3.9 3.9-3.9a.948.948 0 0 1 .7-.275c.283 0 .517.092.7.275a.948.948 0 0 1 .275.7.948.948 0 0 1 -.275.7l-4.6 4.6c-.1.1-.208.17-.325.212a1.105 1.105 0 0 1 -.375.063z'/%3E%3C/svg%3E"); } .asic-select--small { max-width: 8rem; } .asic-select--medium, .asic-select:not([class*=asic-select--]) { max-width: 16rem; } .asic-select--large { max-width: 24rem; } .asic-select--fill { width: 100%; } .asic-sequence { counter-reset: var(--counter); gap: var(--asic-space-24); --counter: asic-sequence-counter; --content-gutter: var(--asic-space-12); --indicator-size: var(--asic-space-40); --content-inset: calc(var(--indicator-size) + var(--content-gutter)); --line-color: var(--asic-color-border); --line-width: var(--asic-border-width-medium); padding-inline-start: var(--content-inset); display: grid; position: relative; } .asic-sequence:before { background-color: var(--line-color); content: ""; width: var(--line-width); display: block; position: absolute; inset-block: 0; inset-inline-start: calc(var(--indicator-size) / 2 - var(--line-width) / 2); } .asic-sequence__section { min-width: 0; } .asic-sequence__title { align-items: center; display: flex; } .asic-sequence__title:before { background-color: var(--asic-color-background); border: var(--line-width) solid var(--line-color); box-sizing: border-box; content: counter(var(--counter)); counter-increment: var(--counter); font: var(--asic-text-title-small-shorthand); height: var(--indicator-size); text-align: center; width: var(--indicator-size); border-radius: 50%; justify-content: center; align-items: center; display: flex; position: absolute; inset-inline-start: 0; } .asic-sidenav { --item-height: var(--asic-space-48); --padding-x: var(--asic-space-20); flex-direction: column; display: flex; } .asic-sidenav__title { font: var(--asic-text-body-shorthand); font-weight: var(--asic-font-weight-medium); margin: 0 0 var(--asic-space-20); } @media not (min-width: 768px) { .asic-collapsible__region .asic-sidenav__title { display: none; } } .asic-sidenav__title-link { color: var(--asic-color-item-fg-idle); align-items: center; gap: var(--asic-space-4); flex-wrap: wrap; flex-shrink: 0; text-decoration: none; display: flex; } @media (hover: hover) { .asic-sidenav__title-link:hover { color: var(--asic-color-item-fg-hover); text-decoration: underline; } } .asic-sidenav__title-link:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-sidenav__title-link:before { contain: paint; content: "arrow_back"/"Back to "; font: var(--asic-icon-font-small); width: 1em; overflow: hidden; } @supports not (content: "x"/"y") { .asic-sidenav__title-link:before { alt: "Back to "; content: "arrow_back"; } } .asic-sidenav__list { --offset: calc(var(--asic-focusring-width) + var(--asic-focusring-offset)); margin: 0 calc(var(--offset) * -1); padding: 0 var(--offset); list-style: none; } .asic-sidenav__section-title { background-color: var(--asic-color-background); font: var(--asic-text-body-small-shorthand); font-weight: var(--asic-font-weight-semibold); min-height: var(--item-height); align-items: center; display: flex; } @media not (min-width: 768px) { .asic-sidenav__section-title { padding-inline: var(--padding-x); } } .asic-sidenav__section { margin: 0 0 var(--asic-space-20); padding: 0; list-style: none; } .asic-sidenav__item-link { border-inline-start: var(--asic-border-width-thin) solid var(--asic-color-border); box-sizing: border-box; color: var(--asic-color-item-fg-idle); align-items: center; gap: var(--asic-space-8); font: var(--asic-text-body-shorthand); min-height: var(--item-height); padding: var(--asic-space-8) var(--asic-space-20); text-decoration: none; display: flex; } @media (hover: hover) { .asic-sidenav__item-link:hover { background-color: var(--asic-color-item-bg-hover); color: var(--asic-color-item-fg-hover); text-decoration: underline; } } .asic-sidenav__item-link:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-sidenav__item-link[aria-current=page] { background-color: var(--asic-color-item-bg-selected); border-width: var(--asic-border-width-thick); border-color: var(--asic-color-background-accent-emphasis); color: var(--asic-color-item-fg-selected); font-weight: var(--asic-font-weight-medium); } .asic-skip-link { clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; width: 1px; height: 1px; position: absolute; overflow: hidden; } .asic-skip-link:focus-visible { background: var(--asic-color-background); border-radius: var(--asic-border-radius-small); clip: auto; clip-path: none; color: var(--asic-color-text-link); height: auto; outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); padding: var(--asic-space-12) var(--asic-space-16); z-index: 1; width: auto; text-decoration: underline; position: fixed; inset-block-start: var(--asic-space-8); inset-inline-start: var(--asic-space-8); } .asic-status-badge { appearance: none; box-sizing: border-box; max-width: 100%; padding-block: var(--asic-space-2); padding-inline: var(--asic-space-8); border-radius: var(--asic-border-radius-medium); border-width: var(--asic-border-width-thin); font: var(--asic-text-body-xsmall-shorthand); font-weight: var(--asic-font-weight-medium); --status-badge-tone: var(--asic-color-system-neutral); --status-badge-tone-on: var(--asic-color-system-neutral-on); color: var(--status-badge-tone-on); background-color: var(--status-badge-tone); border-style: solid; border-color: rgba(0, 0, 0, 0); display: inline-block; position: relative; } .asic-status-badge:before { font: var(--asic-icon-font-small); font-variation-settings: var(--asic-icon-fill); -webkit-font-smoothing: antialiased; top: calc(-1 * var(--asic-border-width-thin)); left: var(--asic-space-4); width: var(--asic-space-24); height: var(--asic-space-24); justify-content: center; align-items: center; display: flex; position: absolute; overflow: hidden; } .asic-status-badge--warning { --status-badge-tone: var(--asic-color-system-warning); --status-badge-tone-on: var(--asic-color-system-warning-on); padding-inline-start: var(--asic-space-32); } .asic-status-badge--warning:before { content: "warning"/"Warning status"; } @supports not (content: "x"/"y") { .asic-status-badge--warning:before { alt: "Warning status"; content: "warning"; } } .asic-status-badge--error { --status-badge-tone: var(--asic-color-system-error); --status-badge-tone-on: var(--asic-color-system-error-on); padding-inline-start: var(--asic-space-32); } .asic-status-badge--error:before { content: "error"/"Error status"; } @supports not (content: "x"/"y") { .asic-status-badge--error:before { alt: "Error status"; content: "error"; } } .asic-status-badge--info { --status-badge-tone: var(--asic-color-system-info); --status-badge-tone-on: var(--asic-color-system-info-on); padding-inline-start: var(--asic-space-32); } .asic-status-badge--info:before { content: "info"/"Info status"; } @supports not (content: "x"/"y") { .asic-status-badge--info:before { alt: "Info status"; content: "info"; } } .asic-status-badge--success { --status-badge-tone: var(--asic-color-system-success); --status-badge-tone-on: var(--asic-color-system-success-on); padding-inline-start: var(--asic-space-32); } .asic-status-badge--success:before { content: "check_circle"/"Success status"; } @supports not (content: "x"/"y") { .asic-status-badge--success:before { alt: "Success status"; content: "check_circle"; } } .asic-status-badge--neutral { --status-badge-tone: var(--asic-color-system-neutral); --status-badge-tone-on: var(--asic-color-system-neutral-on); } .asic-status-badge--primary { color: var(--status-badge-tone-on); background-color: var(--status-badge-tone); border-color: rgba(0, 0, 0, 0); } .asic-status-badge--secondary { color: var(--asic-color-text); border-color: var(--status-badge-tone); background-color: rgba(0, 0, 0, 0); } .asic-status-badge--secondary:before { color: var(--status-badge-tone); } .asic-status-badge--tertiary { color: var(--asic-color-text); background-color: rgba(0, 0, 0, 0); border-color: rgba(0, 0, 0, 0); } .asic-status-badge--tertiary:before { color: var(--status-badge-tone); } .asic-status-badge--truncate { text-overflow: ellipsis; white-space: nowrap; max-width: 100%; display: block; overflow: hidden; } .asic-status-badge-container { gap: var(--asic-space-8); flex-wrap: wrap; justify-content: flex-start; align-items: center; display: flex; } .asic-stepper { --divider: var(--asic-border-width-thin) solid var(--asic-color-border); --padding-x: var(--asic-space-8); --padding-y: var(--asic-space-12); --gutter: var(--asic-space-12); --indicator-size: var(--asic-space-24); --content-inset: calc(var(--indicator-size) + var(--gutter)); --line-color: var(--asic-color-border); --line-width: var(--asic-border-width-medium); --current-indicator-stroke-width: var(--asic-border-width-medium); --current-indicator-stroke-offset: var(--asic-border-width-thick); --current-indicator-stroke-combined: calc(var(--current-indicator-stroke-width) + var(--current-indicator-stroke-offset)); } .asic-stepper__header { border-bottom: var(--divider); gap: var(--asic-space-4); padding-bottom: var(--padding-y); display: grid; } @media not (min-width: 768px) { .asic-collapsible__region .asic-stepper__header { display: none; } } .asic-stepper__header-title { font: var(--asic-text-title-small-shorthand); margin: 0; } .asic-stepper__header-subtitle { color: var(--asic-color-text-muted); font: var(--asic-text-body-shorthand); margin: 0; } .asic-stepper__list { padding: 0 0 0 var(--current-indicator-stroke-combined); margin: 0; list-style: none; } .asic-stepper__item:not(:has([aria-current=true])) > .asic-stepper__list { display: none; } .asic-stepper__item { --status-text: "Not started"; --status-text-alt: ", not started"; --indicator-font: var(--asic-icon-font-small); --indicator-icon: ""; --indicator-bg-color: var(--asic-color-background); --indicator-fg-color: var(--asic-color-text); --indicator-border-color: var(--asic-color-border); --indicator-border-style: dashed; padding-inline-start: var(--content-inset); position: relative; } .asic-stepper__item:before, .asic-stepper__item:after { background-color: var(--line-color); content: ""; width: var(--line-width); display: block; position: absolute; inset-inline-start: calc(var(--indicator-size) / 2 - var(--line-width) / 2); } .asic-stepper__item:before { inset-block: 0 50%; } .asic-stepper__item:after { inset-block: 50% 0; } .asic-stepper__item:first-child:before, .asic-stepper__item:last-child:after { display: none; } .asic-stepper__item .asic-stepper__item { --indicator-font: var(--asic-icon-font); --indicator-icon: "subdirectory_arrow_right"; --indicator-bg-color: transparent; --indicator-border-color: transparent; --indicator-border-style: none; --padding-y: var(--asic-space-8); --status-text: ""; } .asic-stepper__item .asic-stepper__item:has([aria-current=true]) { --indicator-fg-color: var(--asic-color-text-link); --indicator-icon: "start"; } .asic-stepper__item .asic-stepper__item:before, .asic-stepper__item .asic-stepper__item:after { display: none; } .asic-stepper__item--done { --status-text: "Completed"; --status-text-alt: ", completed"; --indicator-icon: "check"; --indicator-bg-color: var(--asic-color-system-success); --indicator-fg-color: var(--asic-color-text-inverse); --indicator-border-color: var(--asic-color-system-success); --indicator-border-style: solid; } .asic-stepper__item--started { --status-text: "In progress"; --status-text-alt: ", in progress"; --indicator-icon: "more_horiz"; --indicator-border-color: var(--asic-color-border-emphasis); --indicator-border-style: solid; } .asic-stepper__item--started:has([aria-current=true]) { --indicator-fg-color: var(--asic-color-text-link); --indicator-border-color: var(--asic-color-text-link); } .asic-stepper__item-link { border-top: var(--divider); box-sizing: border-box; color: var(--asic-color-item-fg-idle); font: var(--asic-text-body-small-shorthand); line-height: var(--asic-font-lineheight-dense); padding: var(--padding-y) var(--padding-x); align-items: center; text-decoration: none; display: grid; } .asic-stepper__item .asic-stepper__item .asic-stepper__item-link, .asic-stepper__item:first-child .asic-stepper__item-link { border-top: none; } @media (hover: hover) { .asic-stepper__item-link:hover { background-color: var(--asic-color-item-bg-hover); color: var(--asic-color-item-fg-hover); } } .asic-stepper__item-link:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-stepper__item-link[aria-current=true] { color: var(--asic-color-item-fg-selected); font-weight: var(--asic-font-weight-medium); } .asic-stepper__item-link[aria-current=true]:before { box-shadow: 0 0 0 var(--current-indicator-stroke-width) var(--asic-color-background), 0 0 0 var(--current-indicator-stroke-combined) var(--indicator-border-color); } .asic-stepper__item-link:before { background-color: var(--indicator-bg-color); border: var(--line-width) var(--indicator-border-style) var(--indicator-border-color); box-sizing: border-box; color: var(--indicator-fg-color); content: var(--indicator-icon)/""; font: var(--indicator-font); height: var(--indicator-size); width: var(--indicator-size); -webkit-font-smoothing: antialiased; pointer-events: none; z-index: 1; border-radius: 50%; justify-content: center; align-items: center; display: flex; position: absolute; inset-inline-start: 0; overflow: hidden; } @supports not (content: "x"/"y") { .asic-stepper__item-link:before { alt: ""; content: var(--indicator-icon); } } .asic-stepper__item-link:after { color: var(--asic-color-text-muted); content: var(--status-text)/var(--status-text-alt); font: var(--asic-text-body-small-shorthand); display: block; } @supports not (content: "x"/"y") { .asic-stepper__item-link:after { alt: var(--status-text-alt); content: var(--status-text); } } .asic-switch { --border: var(--asic-color-border-emphasis); --background: var(--asic-color-background); --border-checked: var(--asic-color-background-accent-emphasis); --background-checked: var(--asic-color-background-accent-emphasis); --handle-position: calc(var(--asic-border-width-medium) * -1); --handle-position-checked: calc(100.0% - var(--asic-space-24) + var(--asic-border-width-medium)); --check-mark: var(--asic-color-text-inverse); appearance: none; font-size: inherit; width: var(--asic-space-48); height: var(--asic-space-24); box-sizing: border-box; vertical-align: text-bottom; background: var(--background); border: var(--asic-border-width-medium) solid var(--border); border-radius: var(--asic-border-radius-full); margin: auto; position: relative; } .asic-switch:before { content: ""; top: 50%; left: var(--handle-position); box-sizing: border-box; width: var(--asic-space-24); height: var(--asic-space-24); background: var(--asic-color-background); border: var(--asic-border-width-medium) solid var(--border); border-radius: var(--asic-border-radius-full); position: absolute; transform: translate(0, -50%); } .asic-switch:after { content: "check"/""; font: var(--asic-icon-font); color: var(--check-mark); box-sizing: border-box; text-align: center; width: var(--asic-space-24); opacity: 0; position: absolute; top: 50%; left: 0; transform: translate(0, -50%) scale(0.25); } @supports not (content: "x"/"y") { .asic-switch:after { alt: ""; content: "check"; } } .asic-switch:checked { background-color: var(--background-checked); border-color: var(--border-checked); } .asic-switch:checked:before { left: var(--handle-position-checked); border-color: var(--border-checked); } .asic-switch:checked:after { opacity: 1; transform: translate(0, -50%) scale(0.75); } .asic-switch:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-switch[aria-invalid=true] { --border: var(--asic-color-system-error); --background: var(--asic-color-system-error-muted); --border-checked: var(--asic-color-system-error); --background-checked: var(--asic-color-system-error); } .asic-switch:is(:disabled, [aria-disabled=true]) { --border: var(--asic-color-control-border-disabled); --background: var(--asic-color-control-background-disabled); --border-checked: var(--asic-color-control-border-disabled); --background-checked: var(--asic-color-control-background-disabled); --check-mark: var(--asic-color-text-disabled); } @media (prefers-reduced-motion: no-preference) { .asic-switch { transition: background-color var(--asic-motion-duration); } .asic-switch:before { transition: left var(--asic-motion-duration) var(--asic-motion-ease); } .asic-switch:after { transition: transform var(--asic-motion-duration) var(--asic-motion-ease), opacity var(--asic-motion-duration) var(--asic-motion-ease); } } .asic-table { border-collapse: collapse; table-layout: auto; width: 100%; } .asic-table :where(caption) { font: var(--asic-text-subtitle-shorthand); text-align: start; margin-block: 0.75rem; } .asic-table :where(caption):first-child { margin-block-start: 0; } .asic-table :where(caption):last-child { margin-block-end: 0; } .asic-table :where(th, td) { border-color: var(--asic-color-border-muted); border-style: solid; border-width: var(--asic-border-width-thin); font: var(--asic-text-body-small-shorthand); padding: var(--asic-space-8) var(--asic-space-12); text-align: start; } .asic-table :where(thead th) { background-color: var(--asic-color-background-alt); font-weight: var(--asic-font-weight-semibold); } .asic-table :where(tfoot th, tfoot td) { font-weight: var(--asic-font-weight-semibold); } .asic-table :where(tfoot tr:first-of-type th, tfoot tr:first-of-type td) { border-top-width: var(--asic-border-width-medium); border-top-color: var(--asic-color-border-emphasis); } .asic-table__container { -webkit-overflow-scrolling: touch; width: 100%; overflow-x: auto; } .asic-table--contrast-header :where(thead th) { border-color: var(--asic-color-background-emphasis); background-color: var(--asic-color-background-emphasis); color: var(--asic-color-text-inverse); } .asic-table--borderless :where(th, td) { border-style: none; } .asic-table--borderless :where(tfoot td, tfoot th) { border-top-style: solid; } .asic-table--top-aligned :where(th, td) { vertical-align: top; } .asic-table--hover-highlight :where(tbody tr:hover td, tbody tr:hover th) { background-color: var(--asic-color-background-accent-alt); } .asic-table--striped :where(tbody tr:nth-child(2n)) { background-color: var(--asic-color-background-alt); } .asic-table--no-wrap :where(th, td) { white-space: nowrap; } .asic-table__cell--numeric { text-align: right; } .asic-table__cell--numeric:where(tbody td) { font-family: var(--asic-font-family-numeric); font-variant-numeric: tabular-nums; } .asic-table__cell--numeric:where(tfoot td) { font-family: var(--asic-font-family-numeric); font-weight: var(--asic-font-weight-semibold); } .asic-table__cell--no-wrap { white-space: nowrap; } .asic-table__cell--truncate { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .asic-table__cell--truncate:where(td) { min-width: 10rem; max-width: 0; } .asic-tabs { --padding-x: var(--asic-space-16); --padding-y: var(--asic-space-16); --tab-height: var(--asic-space-40); --line-adornment-width: var(--asic-border-width-thickest); } .asic-tabs__list { border-bottom: var(--line-adornment-width) solid var(--asic-color-border-muted); height: var(--tab-height); margin: 0; padding: 0; list-style: none; display: flex; } .asic-tabs__tab { appearance: none; background-color: var(--asic-color-background); color: var(--asic-color-text-link); cursor: default; font: var(--asic-text-body-shorthand); align-items: center; gap: var(--asic-space-8); padding: 0 var(--padding-x); border: 0; display: flex; } @media (hover: hover) { .asic-tabs__tab:hover { text-decoration: underline; } } .asic-tabs__tab:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); position: relative; } .asic-tabs__tab[aria-selected=true] { box-shadow: 0 var(--line-adornment-width) 0 var(--asic-color-background-accent-emphasis); color: var(--asic-color-text-emphasis); text-decoration: none; } .asic-tabs__panel { padding-block: var(--padding-y); padding-inline: var(--padding-x); } .asic-tabs__panel:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-tag { appearance: none; box-sizing: border-box; max-width: 100%; padding-block: var(--asic-space-2); padding-inline: var(--asic-space-8); border-radius: var(--asic-border-radius-medium); font: var(--asic-text-body-xsmall-shorthand); font-weight: var(--asic-font-weight-medium); border-width: var(--asic-border-width-thin); color: var(--asic-color-text-inverse); background-color: var(--asic-color-background-emphasis); border-style: solid; border-color: rgba(0, 0, 0, 0); display: inline-block; position: relative; } .asic-tag:where([data-symbol]) { padding-inline-start: var(--asic-space-32); } .asic-tag:where([data-symbol]):before { font: var(--asic-icon-font-small); font-variation-settings: var(--asic-icon-fill); content: attr(data-symbol)/""; -webkit-font-smoothing: antialiased; top: calc(-1 * var(--asic-border-width-thin)); left: var(--asic-space-4); width: var(--asic-space-24); height: var(--asic-space-24); justify-content: center; align-items: center; display: flex; position: absolute; overflow: hidden; } @supports not (content: "x"/"y") { .asic-tag:where([data-symbol]):before { alt: ""; content: attr(data-symbol); } } .asic-tag:is(a) { text-decoration: underline; text-decoration-thickness: var(--asic-border-width-thin); text-underline-offset: var(--asic-border-width-medium); } @media (hover: hover) { .asic-tag:is(a):hover { text-decoration: none; } } .asic-tag:is(a):focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-tag:has(.asic-tag__dismiss) { padding-inline-end: calc(var(--asic-space-24) + var(--asic-space-2)); } .asic-tag .asic-tag--selected { border: var(--asic-border-width-medium) solid var(--asic-color-background-emphasis); } .asic-tag__dismiss { z-index: 1; --dismiss-size: 28px; appearance: none; box-sizing: border-box; border: var(--asic-border-width-medium) solid transparent; border-radius: var(--asic-border-radius-full); color: inherit; font: var(--asic-icon-font-small); font-variation-settings: var(--asic-icon-fill); cursor: pointer; width: var(--dismiss-size); height: var(--dismiss-size); padding-block: 0; padding-inline: 0; white-space: wrap; word-wrap: break-word; background: 0; padding-inline-start: var(--asic-space-24); text-decoration: none; display: block; position: absolute; top: -3px; right: -3px; overflow: hidden; } @media (hover: hover) { .asic-tag__dismiss:hover { color: var(--asic-color-text); background-color: var(--asic-color-background-alt); border-color: var(--asic-color-text); } } .asic-tag__dismiss:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-tag__dismiss:after { box-sizing: border-box; font: var(--asic-icon-font-small); content: "close"/""; -webkit-font-smoothing: antialiased; justify-content: center; align-items: center; width: 100%; height: 100%; display: flex; position: absolute; top: 0; left: 0; } @supports not (content: "x"/"y") { .asic-tag__dismiss:after { alt: ""; content: "close"; } } .asic-tag--primary { color: var(--asic-color-text-inverse); background-color: var(--asic-color-background-emphasis); border-color: rgba(0, 0, 0, 0); } .asic-tag--secondary { color: var(--asic-color-text); background-color: var(--asic-color-background-alt); border-color: currentColor; } .asic-tag--tertiary { color: var(--asic-color-text); background-color: rgba(0, 0, 0, 0); border-color: rgba(0, 0, 0, 0); } .asic-tag--truncate { text-overflow: ellipsis; white-space: nowrap; max-width: 100%; display: block; overflow: hidden; } .asic-tag-container { gap: var(--asic-space-8); flex-wrap: wrap; justify-content: flex-start; align-items: center; display: flex; } :where(.asic-text-display, .asic-text-title, .asic-text-title-large, .asic-text-title-small, .asic-text-subtitle, .asic-text-surtitle, .asic-text-body, .asic-text-body-small, .asic-text-body-xsmall, .asic-text-code) { margin: 0; padding: 0; list-style: none; } .asic-text-display { color: var(--asic-color-text-emphasis); font: var(--asic-text-display-shorthand); } .asic-text-title { color: var(--asic-color-text-emphasis); font: var(--asic-text-title-shorthand); } .asic-text-title-large { color: var(--asic-color-text-emphasis); font: var(--asic-text-title-large-shorthand); } .asic-text-title-small { color: var(--asic-color-text-emphasis); font: var(--asic-text-title-small-shorthand); } .asic-text-subtitle { color: var(--asic-color-text-muted); font: var(--asic-text-subtitle-shorthand); } .asic-text-surtitle { color: var(--asic-color-text-muted); font: var(--asic-text-surtitle-shorthand); } .asic-text-body { font: var(--asic-text-body-shorthand); } .asic-text-body-small { font: var(--asic-text-body-small-shorthand); } .asic-text-body-xsmall { font: var(--asic-text-body-xsmall-shorthand); } .asic-text-code { color: var(--asic-color-text-emphasis); font: var(--asic-text-code-shorthand); } .asic-textbox { --asic-textbox-padding-start: var(--asic-textbox-adornment-size-start, var(--asic-space-12)); --asic-textbox-padding-end: var(--asic-textbox-adornment-size-end, var(--asic-space-12)); appearance: none; background-color: var(--asic-color-background); border-radius: var(--asic-border-radius-small); border: var(--asic-border-width-medium) solid var(--asic-color-control-border); box-sizing: border-box; color: var(--asic-color-text); font: var(--asic-text-body-shorthand); padding-block: var(--asic-space-12); max-width: 24rem; padding-inline-start: var(--asic-textbox-padding-start); padding-inline-end: var(--asic-textbox-padding-end); } .asic-textbox::placeholder { color: var(--asic-color-text-disabled); } .asic-textbox:where(:enabled, :not(:disabled), :not([aria-disabled=true])):focus { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } .asic-textbox[aria-invalid=true] { background-color: var(--asic-color-system-error-muted); border-color: var(--asic-color-system-error); } .asic-textbox:is(:disabled, [aria-disabled=true]) { background-color: var(--asic-color-control-background-disabled); border-color: var(--asic-color-control-border-disabled); color: var(--asic-color-text-disabled); } .asic-textbox:is(input) { height: var(--asic-space-48); } .asic-textbox:is(textarea) { field-sizing: content; height: auto; max-height: calc(10lh + var(--offset-y)); min-height: calc(3lh + var(--offset-y)); padding-block: var(--padding-y); resize: vertical; --padding-y: calc(var(--asic-space-12) + ((1lh - 1cap) / -2)); --offset-y: calc(var(--asic-border-width-medium) * 2 + var(--padding-y) * 2); } .asic-textbox__adornment { max-width: 24rem; display: inline-block; position: relative; } .asic-textbox__adornment .asic-textbox { width: 100%; } .asic-textbox__adornment:has(.asic-textbox--small) { max-width: 8rem; } .asic-textbox__adornment:has(.asic-textbox--medium) { max-width: 16rem; } .asic-textbox__adornment:has(.asic-textbox--large) { max-width: 24rem; } .asic-textbox__adornment:has(.asic-textbox--fill) { width: 100%; max-width: 100%; } .asic-textbox__adornment:before, .asic-textbox__adornment:after { color: var(--asic-color-text-disabled); white-space: nowrap; height: var(--asic-icon-size); position: absolute; top: 50%; overflow: hidden; transform: translateY(-50%); } .asic-textbox__adornment:where([data-symbol-start]) { --asic-textbox-adornment-size-start: calc(var(--asic-icon-size) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-symbol-start]):before { font: var(--asic-icon-font); left: var(--asic-space-12); content: attr(data-symbol-start)/""; width: var(--asic-icon-size); } @supports not (content: "x"/"y") { .asic-textbox__adornment:where([data-symbol-start]):before { alt: ""; content: attr(data-symbol-start); } } .asic-textbox__adornment:where([data-symbol-end]) { --asic-textbox-adornment-size-end: calc(var(--asic-icon-size) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-symbol-end]):after { font: var(--asic-icon-font); right: var(--asic-space-12); content: attr(data-symbol-end)/""; width: var(--asic-icon-size); } @supports not (content: "x"/"y") { .asic-textbox__adornment:where([data-symbol-end]):after { alt: ""; content: attr(data-symbol-end); } } .asic-textbox__adornment:where([data-prefix]) { --asic-textbox-adornment-size-start: calc(2em + var(--asic-space-16)); } .asic-textbox__adornment:where([data-prefix]):before { font: var(--asic-text-body-shorthand); left: var(--asic-space-12); content: attr(data-prefix)/""; } @supports not (content: "x"/"y") { .asic-textbox__adornment:where([data-prefix]):before { alt: ""; content: attr(data-prefix); } } .asic-textbox__adornment:where([data-suffix]) { --asic-textbox-adornment-size-end: calc(2em + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix]):after { font: var(--asic-text-body-shorthand); right: var(--asic-space-12); content: attr(data-suffix)/""; } @supports not (content: "x"/"y") { .asic-textbox__adornment:where([data-suffix]):after { alt: ""; content: attr(data-suffix); } } .asic-textbox__adornment:where([data-prefix-size="1"]) { --asic-textbox-adornment-size-start: calc(1 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-prefix-size="2"]) { --asic-textbox-adornment-size-start: calc(2 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-prefix-size="3"]) { --asic-textbox-adornment-size-start: calc(3 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-prefix-size="4"]) { --asic-textbox-adornment-size-start: calc(4 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-prefix-size="5"]) { --asic-textbox-adornment-size-start: calc(5 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-prefix-size="6"]) { --asic-textbox-adornment-size-start: calc(6 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-prefix-size="7"]) { --asic-textbox-adornment-size-start: calc(7 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-prefix-size="8"]) { --asic-textbox-adornment-size-start: calc(8 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix-size="1"]) { --asic-textbox-adornment-size-end: calc(1 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix-size="2"]) { --asic-textbox-adornment-size-end: calc(2 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix-size="3"]) { --asic-textbox-adornment-size-end: calc(3 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix-size="4"]) { --asic-textbox-adornment-size-end: calc(4 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix-size="5"]) { --asic-textbox-adornment-size-end: calc(5 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix-size="6"]) { --asic-textbox-adornment-size-end: calc(6 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix-size="7"]) { --asic-textbox-adornment-size-end: calc(7 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:where([data-suffix-size="8"]) { --asic-textbox-adornment-size-end: calc(8 * var(--asic-space-8) + var(--asic-space-16)); } .asic-textbox__adornment:has(:disabled, [aria-disabled=true]):before, .asic-textbox__adornment:has(:disabled, [aria-disabled=true]):after { color: var(--asic-color-text-disabled); } .asic-textbox__adornment:has([aria-invalid=true]):before, .asic-textbox__adornment:has([aria-invalid=true]):after { color: var(--asic-color-system-error); } .asic-textbox--numeric { text-align: end; } .asic-textbox--small { max-width: 8rem; } .asic-textbox--medium { max-width: 16rem; } .asic-textbox--large { max-width: 24rem; } .asic-textbox--fill { width: 100%; max-width: 100%; } .asic-textlink { border-radius: var(--asic-border-radius-xsmall); color: var(--asic-color-text-link); cursor: pointer; font: var(--asic-text-body-shorthand); text-decoration: underline; -webkit-text-decoration-color: color-mix(in srgb, var(--asic-color-text-link) 33%, var(--asic-color-background)); text-decoration-color: color-mix(in srgb, var(--asic-color-text-link) 33%, var(--asic-color-background)); text-decoration-thickness: var(--asic-border-width-thin); text-underline-offset: var(--asic-border-width-medium); background: 0; border: 0; padding: 0; } @media (hover: hover) { .asic-textlink:hover { text-decoration: none; } } .asic-textlink:focus-visible { outline: var(--asic-focusring-outline); outline-offset: var(--asic-focusring-offset); } :where(.asic-textlink--backward, .asic-textlink--forward, .asic-textlink--upward, .asic-textlink--downward, .asic-textlink--external) { white-space: collapse; } :where(.asic-textlink--backward, .asic-textlink--forward, .asic-textlink--upward, .asic-textlink--downward, .asic-textlink--external):after, :where(.asic-textlink--backward, .asic-textlink--forward, .asic-textlink--upward, .asic-textlink--downward, .asic-textlink--external):before { font: var(--asic-icon-font-small); vertical-align: middle; width: 1em; margin-bottom: 3px; display: inline-block; overflow: hidden; } :where(.asic-textlink--backward, .asic-textlink--forward, .asic-textlink--upward, .asic-textlink--downward, .asic-textlink--external):before { margin-right: var(--asic-space-4); } :where(.asic-textlink--backward, .asic-textlink--forward, .asic-textlink--upward, .asic-textlink--downward, .asic-textlink--external):after { margin-left: var(--asic-space-4); } .asic-textlink--backward:before { content: "arrow_back"/""; } @supports not (content: "x"/"y") { .asic-textlink--backward:before { alt: ""; content: "arrow_back"; } } .asic-textlink--forward:after { content: "arrow_forward"/""; } @supports not (content: "x"/"y") { .asic-textlink--forward:after { alt: ""; content: "arrow_forward"; } } .asic-textlink--upward:after { content: "arrow_upward"/""; } @supports not (content: "x"/"y") { .asic-textlink--upward:after { alt: ""; content: "arrow_upward"; } } .asic-textlink--downward:after { content: "arrow_downward"/""; } @supports not (content: "x"/"y") { .asic-textlink--downward:after { alt: ""; content: "arrow_downward"; } } .asic-textlink--external:after { content: "open_in_new"/", opens in a new tab"; } @supports not (content: "x"/"y") { .asic-textlink--external:after { alt: ", opens in a new tab"; content: "open_in_new"; } } .asic-textlink-group { gap: var(--asic-space-12); flex-wrap: wrap; margin: 0; padding: 0; list-style: none; display: flex; } } @layer utilities { .au-visually-hidden { clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; width: 1px; height: 1px; position: absolute; overflow: hidden; } [hidden] { display: none; } :where([class*=au-border]) { border-style: solid; border-width: 0; border-color: var(--asic-color-border); } .au-border { border-width: var(--asic-border-width-thin); } .au-border-x { border-inline-width: var(--asic-border-width-thin); } .au-border-y { border-block-width: var(--asic-border-width-thin); } .au-border-b { border-block-end-width: var(--asic-border-width-thin); } .au-border-t { border-block-start-width: var(--asic-border-width-thin); } .au-border-l { border-inline-start-width: var(--asic-border-width-thin); } .au-border-r { border-inline-end-width: var(--asic-border-width-thin); } .au-border-medium { border-width: var(--asic-border-width-medium); } .au-border-x-medium { border-inline-width: var(--asic-border-width-medium); } .au-border-y-medium { border-block-width: var(--asic-border-width-medium); } .au-border-b-medium { border-block-end-width: var(--asic-border-width-medium); } .au-border-t-medium { border-block-start-width: var(--asic-border-width-medium); } .au-border-l-medium { border-inline-start-width: var(--asic-border-width-medium); } .au-border-r-medium { border-inline-end-width: var(--asic-border-width-medium); } .au-border-thick { border-width: var(--asic-border-width-thick); } .au-border-x-thick { border-inline-width: var(--asic-border-width-thick); } .au-border-y-thick { border-block-width: var(--asic-border-width-thick); } .au-border-b-thick { border-block-end-width: var(--asic-border-width-thick); } .au-border-t-thick { border-block-start-width: var(--asic-border-width-thick); } .au-border-l-thick { border-inline-start-width: var(--asic-border-width-thick); } .au-border-r-thick { border-inline-end-width: var(--asic-border-width-thick); } .au-border-thickest { border-width: var(--asic-border-width-thickest); } .au-border-x-thickest { border-inline-width: var(--asic-border-width-thickest); } .au-border-y-thickest { border-block-width: var(--asic-border-width-thickest); } .au-border-b-thickest { border-block-end-width: var(--asic-border-width-thickest); } .au-border-t-thickest { border-block-start-width: var(--asic-border-width-thickest); } .au-border-l-thickest { border-inline-start-width: var(--asic-border-width-thickest); } .au-border-r-thickest { border-inline-end-width: var(--asic-border-width-thickest); } .au-border-emphasis { border-color: var(--asic-color-border-emphasis); } .au-border-muted { border-color: var(--asic-color-border-muted); } .au-border-info { border-color: var(--asic-color-system-info); } .au-border-success { border-color: var(--asic-color-system-success); } .au-border-warning { border-color: var(--asic-color-system-warning); } .au-border-error { border-color: var(--asic-color-system-error); } .au-border-highlight { border-color: var(--asic-color-system-highlight); } .au-rounded { border-radius: var(--asic-border-radius-small); } .au-rounded-xsmall { border-radius: var(--asic-border-radius-xsmall); } .au-rounded-small { border-radius: var(--asic-border-radius-small); } .au-rounded-medium { border-radius: var(--asic-border-radius-medium); } .au-rounded-large { border-radius: var(--asic-border-radius-large); } .au-rounded-full { border-radius: var(--asic-border-radius-full); } .au-border-solid { border-style: solid; } .au-border-dashed { border-style: dashed; } .au-border-dotted { border-style: dotted; } .au-bg { background: var(--asic-color-background); } .au-bg-alt { background: var(--asic-color-background-alt); } .au-bg-emphasis { background: var(--asic-color-background-emphasis); } .au-bg-accent { background: var(--asic-color-background-accent); } .au-bg-accent-alt { background: var(--asic-color-background-accent-alt); } .au-bg-accent-emphasis { background: var(--asic-color-background-accent-emphasis); } .au-fg { color: var(--asic-color-text); } .au-fg-emphasis { color: var(--asic-color-text-emphasis); } .au-fg-muted { color: var(--asic-color-text-muted); } .au-fg-disabled { color: var(--asic-color-text-disabled); } .au-fg-link { color: var(--asic-color-text-link); } .au-fg-inverse { color: var(--asic-color-text-inverse); } .au-bg-system-neutral { background: var(--asic-color-system-neutral); } .au-bg-system-success { background: var(--asic-color-system-success); } .au-bg-system-warning { background: var(--asic-color-system-warning); } .au-bg-system-error { background: var(--asic-color-system-error); } .au-bg-system-info { background: var(--asic-color-system-info); } .au-bg-system-highlight { background: var(--asic-color-system-highlight); } .au-fg-system-neutral-on { color: var(--asic-color-system-neutral-on); } .au-fg-system-success-on { color: var(--asic-color-system-success-on); } .au-fg-system-warning-on { color: var(--asic-color-system-warning-on); } .au-fg-system-error-on { color: var(--asic-color-system-error-on); } .au-fg-system-info-on { color: var(--asic-color-system-info-on); } .au-fg-system-highlight-on { color: var(--asic-color-system-highlight-on); } .au-hidden { display: none; } .au-block { display: block; } .au-inline-block { display: inline-block; } .au-inline { display: inline; } .au-flex { display: flex; } .au-inline-flex { display: inline-flex; } .au-grid { display: grid; } .au-inline-grid { display: inline-grid; } .au-contents { display: contents; } @media not (min-width: 768px) { .xs-only\:au-hidden { display: none; } .xs-only\:au-block { display: block; } .xs-only\:au-inline-block { display: inline-block; } .xs-only\:au-inline { display: inline; } .xs-only\:au-flex { display: flex; } .xs-only\:au-inline-flex { display: inline-flex; } .xs-only\:au-grid { display: grid; } .xs-only\:au-inline-grid { display: inline-grid; } .xs-only\:au-contents { display: contents; } } @media (min-width: 768px) { .sm\:au-hidden { display: none; } .sm\:au-block { display: block; } .sm\:au-inline-block { display: inline-block; } .sm\:au-inline { display: inline; } .sm\:au-flex { display: flex; } .sm\:au-inline-flex { display: inline-flex; } .sm\:au-grid { display: grid; } .sm\:au-inline-grid { display: inline-grid; } .sm\:au-contents { display: contents; } } @media (min-width: 992px) { .md\:au-hidden { display: none; } .md\:au-block { display: block; } .md\:au-inline-block { display: inline-block; } .md\:au-inline { display: inline; } .md\:au-flex { display: flex; } .md\:au-inline-flex { display: inline-flex; } .md\:au-grid { display: grid; } .md\:au-inline-grid { display: inline-grid; } .md\:au-contents { display: contents; } } @media (min-width: 1200px) { .lg\:au-hidden { display: none; } .lg\:au-block { display: block; } .lg\:au-inline-block { display: inline-block; } .lg\:au-inline { display: inline; } .lg\:au-flex { display: flex; } .lg\:au-inline-flex { display: inline-flex; } .lg\:au-grid { display: grid; } .lg\:au-inline-grid { display: inline-grid; } .lg\:au-contents { display: contents; } } .au-gap-4 { gap: var(--asic-space-4); } .au-gap-8 { gap: var(--asic-space-8); } .au-gap-12 { gap: var(--asic-space-12); } .au-gap-16 { gap: var(--asic-space-16); } .au-gap-20 { gap: var(--asic-space-20); } .au-gap-24 { gap: var(--asic-space-24); } .au-gap-32 { gap: var(--asic-space-32); } .au-gap-40 { gap: var(--asic-space-40); } .au-gap-48 { gap: var(--asic-space-48); } .au-gap-x-4 { column-gap: var(--asic-space-4); } .au-gap-x-8 { column-gap: var(--asic-space-8); } .au-gap-x-12 { column-gap: var(--asic-space-12); } .au-gap-x-16 { column-gap: var(--asic-space-16); } .au-gap-x-20 { column-gap: var(--asic-space-20); } .au-gap-x-24 { column-gap: var(--asic-space-24); } .au-gap-x-32 { column-gap: var(--asic-space-32); } .au-gap-x-40 { column-gap: var(--asic-space-40); } .au-gap-x-48 { column-gap: var(--asic-space-48); } .au-gap-y-4 { row-gap: var(--asic-space-4); } .au-gap-y-8 { row-gap: var(--asic-space-8); } .au-gap-y-12 { row-gap: var(--asic-space-12); } .au-gap-y-16 { row-gap: var(--asic-space-16); } .au-gap-y-20 { row-gap: var(--asic-space-20); } .au-gap-y-24 { row-gap: var(--asic-space-24); } .au-gap-y-32 { row-gap: var(--asic-space-32); } .au-gap-y-40 { row-gap: var(--asic-space-40); } .au-gap-y-48 { row-gap: var(--asic-space-48); } @media (min-width: 768px) { .sm\:au-gap-4 { gap: var(--asic-space-4); } .sm\:au-gap-8 { gap: var(--asic-space-8); } .sm\:au-gap-12 { gap: var(--asic-space-12); } .sm\:au-gap-16 { gap: var(--asic-space-16); } .sm\:au-gap-20 { gap: var(--asic-space-20); } .sm\:au-gap-24 { gap: var(--asic-space-24); } .sm\:au-gap-32 { gap: var(--asic-space-32); } .sm\:au-gap-40 { gap: var(--asic-space-40); } .sm\:au-gap-48 { gap: var(--asic-space-48); } .sm\:au-gap-x-4 { column-gap: var(--asic-space-4); } .sm\:au-gap-x-8 { column-gap: var(--asic-space-8); } .sm\:au-gap-x-12 { column-gap: var(--asic-space-12); } .sm\:au-gap-x-16 { column-gap: var(--asic-space-16); } .sm\:au-gap-x-20 { column-gap: var(--asic-space-20); } .sm\:au-gap-x-24 { column-gap: var(--asic-space-24); } .sm\:au-gap-x-32 { column-gap: var(--asic-space-32); } .sm\:au-gap-x-40 { column-gap: var(--asic-space-40); } .sm\:au-gap-x-48 { column-gap: var(--asic-space-48); } .sm\:au-gap-y-4 { row-gap: var(--asic-space-4); } .sm\:au-gap-y-8 { row-gap: var(--asic-space-8); } .sm\:au-gap-y-12 { row-gap: var(--asic-space-12); } .sm\:au-gap-y-16 { row-gap: var(--asic-space-16); } .sm\:au-gap-y-20 { row-gap: var(--asic-space-20); } .sm\:au-gap-y-24 { row-gap: var(--asic-space-24); } .sm\:au-gap-y-32 { row-gap: var(--asic-space-32); } .sm\:au-gap-y-40 { row-gap: var(--asic-space-40); } .sm\:au-gap-y-48 { row-gap: var(--asic-space-48); } } @media (min-width: 992px) { .md\:au-gap-4 { gap: var(--asic-space-4); } .md\:au-gap-8 { gap: var(--asic-space-8); } .md\:au-gap-12 { gap: var(--asic-space-12); } .md\:au-gap-16 { gap: var(--asic-space-16); } .md\:au-gap-20 { gap: var(--asic-space-20); } .md\:au-gap-24 { gap: var(--asic-space-24); } .md\:au-gap-32 { gap: var(--asic-space-32); } .md\:au-gap-40 { gap: var(--asic-space-40); } .md\:au-gap-48 { gap: var(--asic-space-48); } .md\:au-gap-x-4 { column-gap: var(--asic-space-4); } .md\:au-gap-x-8 { column-gap: var(--asic-space-8); } .md\:au-gap-x-12 { column-gap: var(--asic-space-12); } .md\:au-gap-x-16 { column-gap: var(--asic-space-16); } .md\:au-gap-x-20 { column-gap: var(--asic-space-20); } .md\:au-gap-x-24 { column-gap: var(--asic-space-24); } .md\:au-gap-x-32 { column-gap: var(--asic-space-32); } .md\:au-gap-x-40 { column-gap: var(--asic-space-40); } .md\:au-gap-x-48 { column-gap: var(--asic-space-48); } .md\:au-gap-y-4 { row-gap: var(--asic-space-4); } .md\:au-gap-y-8 { row-gap: var(--asic-space-8); } .md\:au-gap-y-12 { row-gap: var(--asic-space-12); } .md\:au-gap-y-16 { row-gap: var(--asic-space-16); } .md\:au-gap-y-20 { row-gap: var(--asic-space-20); } .md\:au-gap-y-24 { row-gap: var(--asic-space-24); } .md\:au-gap-y-32 { row-gap: var(--asic-space-32); } .md\:au-gap-y-40 { row-gap: var(--asic-space-40); } .md\:au-gap-y-48 { row-gap: var(--asic-space-48); } } @media (min-width: 1200px) { .lg\:au-gap-4 { gap: var(--asic-space-4); } .lg\:au-gap-8 { gap: var(--asic-space-8); } .lg\:au-gap-12 { gap: var(--asic-space-12); } .lg\:au-gap-16 { gap: var(--asic-space-16); } .lg\:au-gap-20 { gap: var(--asic-space-20); } .lg\:au-gap-24 { gap: var(--asic-space-24); } .lg\:au-gap-32 { gap: var(--asic-space-32); } .lg\:au-gap-40 { gap: var(--asic-space-40); } .lg\:au-gap-48 { gap: var(--asic-space-48); } .lg\:au-gap-x-4 { column-gap: var(--asic-space-4); } .lg\:au-gap-x-8 { column-gap: var(--asic-space-8); } .lg\:au-gap-x-12 { column-gap: var(--asic-space-12); } .lg\:au-gap-x-16 { column-gap: var(--asic-space-16); } .lg\:au-gap-x-20 { column-gap: var(--asic-space-20); } .lg\:au-gap-x-24 { column-gap: var(--asic-space-24); } .lg\:au-gap-x-32 { column-gap: var(--asic-space-32); } .lg\:au-gap-x-40 { column-gap: var(--asic-space-40); } .lg\:au-gap-x-48 { column-gap: var(--asic-space-48); } .lg\:au-gap-y-4 { row-gap: var(--asic-space-4); } .lg\:au-gap-y-8 { row-gap: var(--asic-space-8); } .lg\:au-gap-y-12 { row-gap: var(--asic-space-12); } .lg\:au-gap-y-16 { row-gap: var(--asic-space-16); } .lg\:au-gap-y-20 { row-gap: var(--asic-space-20); } .lg\:au-gap-y-24 { row-gap: var(--asic-space-24); } .lg\:au-gap-y-32 { row-gap: var(--asic-space-32); } .lg\:au-gap-y-40 { row-gap: var(--asic-space-40); } .lg\:au-gap-y-48 { row-gap: var(--asic-space-48); } } .au-items-center { align-items: center; } .au-items-start { align-items: start; } .au-items-end { align-items: end; } .au-items-baseline { align-items: baseline; } .au-items-stretch { align-items: stretch; } .au-justify-center { justify-content: center; } .au-justify-start { justify-content: start; } .au-justify-end { justify-content: end; } .au-justify-between { justify-content: space-between; } .au-justify-around { justify-content: space-around; } .au-justify-evenly { justify-content: space-evenly; } .au-self-center { align-self: center; } .au-self-start { align-self: start; } .au-self-end { align-self: end; } .au-self-baseline { align-self: baseline; } .au-self-stretch { align-self: stretch; } @media not (min-width: 768px) { .xs-only\:au-items-center { align-items: center; } .xs-only\:au-items-start { align-items: start; } .xs-only\:au-items-end { align-items: end; } .xs-only\:au-items-baseline { align-items: baseline; } .xs-only\:au-items-stretch { align-items: stretch; } .xs-only\:au-justify-center { justify-content: center; } .xs-only\:au-justify-start { justify-content: start; } .xs-only\:au-justify-end { justify-content: end; } .xs-only\:au-justify-between { justify-content: space-between; } .xs-only\:au-justify-around { justify-content: space-around; } .xs-only\:au-justify-evenly { justify-content: space-evenly; } .xs-only\:au-self-center { align-self: center; } .xs-only\:au-self-start { align-self: start; } .xs-only\:au-self-end { align-self: end; } .xs-only\:au-self-baseline { align-self: baseline; } .xs-only\:au-self-stretch { align-self: stretch; } } @media (min-width: 768px) { .sm\:au-items-center { align-items: center; } .sm\:au-items-start { align-items: start; } .sm\:au-items-end { align-items: end; } .sm\:au-items-baseline { align-items: baseline; } .sm\:au-items-stretch { align-items: stretch; } .sm\:au-justify-center { justify-content: center; } .sm\:au-justify-start { justify-content: start; } .sm\:au-justify-end { justify-content: end; } .sm\:au-justify-between { justify-content: space-between; } .sm\:au-justify-around { justify-content: space-around; } .sm\:au-justify-evenly { justify-content: space-evenly; } .sm\:au-self-center { align-self: center; } .sm\:au-self-start { align-self: start; } .sm\:au-self-end { align-self: end; } .sm\:au-self-baseline { align-self: baseline; } .sm\:au-self-stretch { align-self: stretch; } } @media (min-width: 992px) { .md\:au-items-center { align-items: center; } .md\:au-items-start { align-items: start; } .md\:au-items-end { align-items: end; } .md\:au-items-baseline { align-items: baseline; } .md\:au-items-stretch { align-items: stretch; } .md\:au-justify-center { justify-content: center; } .md\:au-justify-start { justify-content: start; } .md\:au-justify-end { justify-content: end; } .md\:au-justify-between { justify-content: space-between; } .md\:au-justify-around { justify-content: space-around; } .md\:au-justify-evenly { justify-content: space-evenly; } .md\:au-self-center { align-self: center; } .md\:au-self-start { align-self: start; } .md\:au-self-end { align-self: end; } .md\:au-self-baseline { align-self: baseline; } .md\:au-self-stretch { align-self: stretch; } } @media (min-width: 1200px) { .lg\:au-items-center { align-items: center; } .lg\:au-items-start { align-items: start; } .lg\:au-items-end { align-items: end; } .lg\:au-items-baseline { align-items: baseline; } .lg\:au-items-stretch { align-items: stretch; } .lg\:au-justify-center { justify-content: center; } .lg\:au-justify-start { justify-content: start; } .lg\:au-justify-end { justify-content: end; } .lg\:au-justify-between { justify-content: space-between; } .lg\:au-justify-around { justify-content: space-around; } .lg\:au-justify-evenly { justify-content: space-evenly; } .lg\:au-self-center { align-self: center; } .lg\:au-self-start { align-self: start; } .lg\:au-self-end { align-self: end; } .lg\:au-self-baseline { align-self: baseline; } .lg\:au-self-stretch { align-self: stretch; } } .au-flex-col { flex-direction: column; } .au-flex-row { flex-direction: row; } .au-flex-wrap { flex-wrap: wrap; } .au-flex-nowrap { flex-wrap: nowrap; } .au-flex-1 { flex: 1; } @media not (min-width: 768px) { .xs-only\:au-flex-col { flex-direction: column; } .xs-only\:au-flex-row { flex-direction: row; } .xs-only\:au-flex-wrap { flex-wrap: wrap; } .xs-only\:au-flex-nowrap { flex-wrap: nowrap; } .xs-only\:au-flex-1 { flex: 1; } } @media (min-width: 768px) { .sm\:au-flex-col { flex-direction: column; } .sm\:au-flex-row { flex-direction: row; } .sm\:au-flex-wrap { flex-wrap: wrap; } .sm\:au-flex-nowrap { flex-wrap: nowrap; } .sm\:au-flex-1 { flex: 1; } } @media (min-width: 992px) { .md\:au-flex-col { flex-direction: column; } .md\:au-flex-row { flex-direction: row; } .md\:au-flex-wrap { flex-wrap: wrap; } .md\:au-flex-nowrap { flex-wrap: nowrap; } .md\:au-flex-1 { flex: 1; } } @media (min-width: 1200px) { .lg\:au-flex-col { flex-direction: column; } .lg\:au-flex-row { flex-direction: row; } .lg\:au-flex-wrap { flex-wrap: wrap; } .lg\:au-flex-nowrap { flex-wrap: nowrap; } .lg\:au-flex-1 { flex: 1; } } .au-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .au-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .au-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .au-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .au-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .au-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .au-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .au-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .au-grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .au-grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .au-grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .au-grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } @media (min-width: 768px) { .sm\:au-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .sm\:au-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sm\:au-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sm\:au-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .sm\:au-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .sm\:au-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .sm\:au-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .sm\:au-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .sm\:au-grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .sm\:au-grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .sm\:au-grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .sm\:au-grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } } @media (min-width: 992px) { .md\:au-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .md\:au-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .md\:au-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .md\:au-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .md\:au-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .md\:au-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .md\:au-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .md\:au-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .md\:au-grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .md\:au-grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .md\:au-grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .md\:au-grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } } @media (min-width: 1200px) { .lg\:au-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .lg\:au-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lg\:au-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .lg\:au-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .lg\:au-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .lg\:au-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .lg\:au-grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .lg\:au-grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .lg\:au-grid-cols-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .lg\:au-grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .lg\:au-grid-cols-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .lg\:au-grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } } .au-col-span-1 { grid-column: span 1/span 1; } .au-col-span-2 { grid-column: span 2/span 2; } .au-col-span-3 { grid-column: span 3/span 3; } .au-col-span-4 { grid-column: span 4/span 4; } .au-col-span-5 { grid-column: span 5/span 5; } .au-col-span-6 { grid-column: span 6/span 6; } .au-col-span-7 { grid-column: span 7/span 7; } .au-col-span-8 { grid-column: span 8/span 8; } .au-col-span-9 { grid-column: span 9/span 9; } .au-col-span-10 { grid-column: span 10/span 10; } .au-col-span-11 { grid-column: span 11/span 11; } .au-col-span-12 { grid-column: span 12/span 12; } .au-col-span-full { grid-column: 1/-1; } @media (min-width: 768px) { .sm\:au-col-span-1 { grid-column: span 1/span 1; } .sm\:au-col-span-2 { grid-column: span 2/span 2; } .sm\:au-col-span-3 { grid-column: span 3/span 3; } .sm\:au-col-span-4 { grid-column: span 4/span 4; } .sm\:au-col-span-5 { grid-column: span 5/span 5; } .sm\:au-col-span-6 { grid-column: span 6/span 6; } .sm\:au-col-span-7 { grid-column: span 7/span 7; } .sm\:au-col-span-8 { grid-column: span 8/span 8; } .sm\:au-col-span-9 { grid-column: span 9/span 9; } .sm\:au-col-span-10 { grid-column: span 10/span 10; } .sm\:au-col-span-11 { grid-column: span 11/span 11; } .sm\:au-col-span-12 { grid-column: span 12/span 12; } .sm\:au-col-span-full { grid-column: 1/-1; } } @media (min-width: 992px) { .md\:au-col-span-1 { grid-column: span 1/span 1; } .md\:au-col-span-2 { grid-column: span 2/span 2; } .md\:au-col-span-3 { grid-column: span 3/span 3; } .md\:au-col-span-4 { grid-column: span 4/span 4; } .md\:au-col-span-5 { grid-column: span 5/span 5; } .md\:au-col-span-6 { grid-column: span 6/span 6; } .md\:au-col-span-7 { grid-column: span 7/span 7; } .md\:au-col-span-8 { grid-column: span 8/span 8; } .md\:au-col-span-9 { grid-column: span 9/span 9; } .md\:au-col-span-10 { grid-column: span 10/span 10; } .md\:au-col-span-11 { grid-column: span 11/span 11; } .md\:au-col-span-12 { grid-column: span 12/span 12; } .md\:au-col-span-full { grid-column: 1/-1; } } @media (min-width: 1200px) { .lg\:au-col-span-1 { grid-column: span 1/span 1; } .lg\:au-col-span-2 { grid-column: span 2/span 2; } .lg\:au-col-span-3 { grid-column: span 3/span 3; } .lg\:au-col-span-4 { grid-column: span 4/span 4; } .lg\:au-col-span-5 { grid-column: span 5/span 5; } .lg\:au-col-span-6 { grid-column: span 6/span 6; } .lg\:au-col-span-7 { grid-column: span 7/span 7; } .lg\:au-col-span-8 { grid-column: span 8/span 8; } .lg\:au-col-span-9 { grid-column: span 9/span 9; } .lg\:au-col-span-10 { grid-column: span 10/span 10; } .lg\:au-col-span-11 { grid-column: span 11/span 11; } .lg\:au-col-span-12 { grid-column: span 12/span 12; } .lg\:au-col-span-full { grid-column: 1/-1; } } .au-m-0 { margin: 0; } .au-mb-0 { margin-bottom: 0; } .au-ml-0 { margin-left: 0; } .au-mr-0 { margin-right: 0; } .au-mt-0 { margin-top: 0; } .au-mx-0 { margin-left: 0; margin-right: 0; } .au-my-0 { margin-top: 0; margin-bottom: 0; } .au-p-0 { padding: 0; } .au-pb-0 { padding-bottom: 0; } .au-pl-0 { padding-left: 0; } .au-pr-0 { padding-right: 0; } .au-pt-0 { padding-top: 0; } .au-px-0 { padding-left: 0; padding-right: 0; } .au-py-0 { padding-top: 0; padding-bottom: 0; } .au-m-2 { margin: var(--asic-space-2); } .au-mb-2 { margin-bottom: var(--asic-space-2); } .au-ml-2 { margin-left: var(--asic-space-2); } .au-mr-2 { margin-right: var(--asic-space-2); } .au-mt-2 { margin-top: var(--asic-space-2); } .au-mx-2 { margin-left: var(--asic-space-2); margin-right: var(--asic-space-2); } .au-my-2 { margin-top: var(--asic-space-2); margin-bottom: var(--asic-space-2); } .au-p-2 { padding: var(--asic-space-2); } .au-pb-2 { padding-bottom: var(--asic-space-2); } .au-pl-2 { padding-left: var(--asic-space-2); } .au-pr-2 { padding-right: var(--asic-space-2); } .au-pt-2 { padding-top: var(--asic-space-2); } .au-px-2 { padding-left: var(--asic-space-2); padding-right: var(--asic-space-2); } .au-py-2 { padding-top: var(--asic-space-2); padding-bottom: var(--asic-space-2); } .au-m-4 { margin: var(--asic-space-4); } .au-mb-4 { margin-bottom: var(--asic-space-4); } .au-ml-4 { margin-left: var(--asic-space-4); } .au-mr-4 { margin-right: var(--asic-space-4); } .au-mt-4 { margin-top: var(--asic-space-4); } .au-mx-4 { margin-left: var(--asic-space-4); margin-right: var(--asic-space-4); } .au-my-4 { margin-top: var(--asic-space-4); margin-bottom: var(--asic-space-4); } .au-p-4 { padding: var(--asic-space-4); } .au-pb-4 { padding-bottom: var(--asic-space-4); } .au-pl-4 { padding-left: var(--asic-space-4); } .au-pr-4 { padding-right: var(--asic-space-4); } .au-pt-4 { padding-top: var(--asic-space-4); } .au-px-4 { padding-left: var(--asic-space-4); padding-right: var(--asic-space-4); } .au-py-4 { padding-top: var(--asic-space-4); padding-bottom: var(--asic-space-4); } .au-m-8 { margin: var(--asic-space-8); } .au-mb-8 { margin-bottom: var(--asic-space-8); } .au-ml-8 { margin-left: var(--asic-space-8); } .au-mr-8 { margin-right: var(--asic-space-8); } .au-mt-8 { margin-top: var(--asic-space-8); } .au-mx-8 { margin-left: var(--asic-space-8); margin-right: var(--asic-space-8); } .au-my-8 { margin-top: var(--asic-space-8); margin-bottom: var(--asic-space-8); } .au-p-8 { padding: var(--asic-space-8); } .au-pb-8 { padding-bottom: var(--asic-space-8); } .au-pl-8 { padding-left: var(--asic-space-8); } .au-pr-8 { padding-right: var(--asic-space-8); } .au-pt-8 { padding-top: var(--asic-space-8); } .au-px-8 { padding-left: var(--asic-space-8); padding-right: var(--asic-space-8); } .au-py-8 { padding-top: var(--asic-space-8); padding-bottom: var(--asic-space-8); } .au-m-12 { margin: var(--asic-space-12); } .au-mb-12 { margin-bottom: var(--asic-space-12); } .au-ml-12 { margin-left: var(--asic-space-12); } .au-mr-12 { margin-right: var(--asic-space-12); } .au-mt-12 { margin-top: var(--asic-space-12); } .au-mx-12 { margin-left: var(--asic-space-12); margin-right: var(--asic-space-12); } .au-my-12 { margin-top: var(--asic-space-12); margin-bottom: var(--asic-space-12); } .au-p-12 { padding: var(--asic-space-12); } .au-pb-12 { padding-bottom: var(--asic-space-12); } .au-pl-12 { padding-left: var(--asic-space-12); } .au-pr-12 { padding-right: var(--asic-space-12); } .au-pt-12 { padding-top: var(--asic-space-12); } .au-px-12 { padding-left: var(--asic-space-12); padding-right: var(--asic-space-12); } .au-py-12 { padding-top: var(--asic-space-12); padding-bottom: var(--asic-space-12); } .au-m-16 { margin: var(--asic-space-16); } .au-mb-16 { margin-bottom: var(--asic-space-16); } .au-ml-16 { margin-left: var(--asic-space-16); } .au-mr-16 { margin-right: var(--asic-space-16); } .au-mt-16 { margin-top: var(--asic-space-16); } .au-mx-16 { margin-left: var(--asic-space-16); margin-right: var(--asic-space-16); } .au-my-16 { margin-top: var(--asic-space-16); margin-bottom: var(--asic-space-16); } .au-p-16 { padding: var(--asic-space-16); } .au-pb-16 { padding-bottom: var(--asic-space-16); } .au-pl-16 { padding-left: var(--asic-space-16); } .au-pr-16 { padding-right: var(--asic-space-16); } .au-pt-16 { padding-top: var(--asic-space-16); } .au-px-16 { padding-left: var(--asic-space-16); padding-right: var(--asic-space-16); } .au-py-16 { padding-top: var(--asic-space-16); padding-bottom: var(--asic-space-16); } .au-m-20 { margin: var(--asic-space-20); } .au-mb-20 { margin-bottom: var(--asic-space-20); } .au-ml-20 { margin-left: var(--asic-space-20); } .au-mr-20 { margin-right: var(--asic-space-20); } .au-mt-20 { margin-top: var(--asic-space-20); } .au-mx-20 { margin-left: var(--asic-space-20); margin-right: var(--asic-space-20); } .au-my-20 { margin-top: var(--asic-space-20); margin-bottom: var(--asic-space-20); } .au-p-20 { padding: var(--asic-space-20); } .au-pb-20 { padding-bottom: var(--asic-space-20); } .au-pl-20 { padding-left: var(--asic-space-20); } .au-pr-20 { padding-right: var(--asic-space-20); } .au-pt-20 { padding-top: var(--asic-space-20); } .au-px-20 { padding-left: var(--asic-space-20); padding-right: var(--asic-space-20); } .au-py-20 { padding-top: var(--asic-space-20); padding-bottom: var(--asic-space-20); } .au-m-24 { margin: var(--asic-space-24); } .au-mb-24 { margin-bottom: var(--asic-space-24); } .au-ml-24 { margin-left: var(--asic-space-24); } .au-mr-24 { margin-right: var(--asic-space-24); } .au-mt-24 { margin-top: var(--asic-space-24); } .au-mx-24 { margin-left: var(--asic-space-24); margin-right: var(--asic-space-24); } .au-my-24 { margin-top: var(--asic-space-24); margin-bottom: var(--asic-space-24); } .au-p-24 { padding: var(--asic-space-24); } .au-pb-24 { padding-bottom: var(--asic-space-24); } .au-pl-24 { padding-left: var(--asic-space-24); } .au-pr-24 { padding-right: var(--asic-space-24); } .au-pt-24 { padding-top: var(--asic-space-24); } .au-px-24 { padding-left: var(--asic-space-24); padding-right: var(--asic-space-24); } .au-py-24 { padding-top: var(--asic-space-24); padding-bottom: var(--asic-space-24); } .au-m-32 { margin: var(--asic-space-32); } .au-mb-32 { margin-bottom: var(--asic-space-32); } .au-ml-32 { margin-left: var(--asic-space-32); } .au-mr-32 { margin-right: var(--asic-space-32); } .au-mt-32 { margin-top: var(--asic-space-32); } .au-mx-32 { margin-left: var(--asic-space-32); margin-right: var(--asic-space-32); } .au-my-32 { margin-top: var(--asic-space-32); margin-bottom: var(--asic-space-32); } .au-p-32 { padding: var(--asic-space-32); } .au-pb-32 { padding-bottom: var(--asic-space-32); } .au-pl-32 { padding-left: var(--asic-space-32); } .au-pr-32 { padding-right: var(--asic-space-32); } .au-pt-32 { padding-top: var(--asic-space-32); } .au-px-32 { padding-left: var(--asic-space-32); padding-right: var(--asic-space-32); } .au-py-32 { padding-top: var(--asic-space-32); padding-bottom: var(--asic-space-32); } @media (min-width: 768px) { .sm\:au-m-0 { margin: 0; } .sm\:au-mb-0 { margin-bottom: 0; } .sm\:au-ml-0 { margin-left: 0; } .sm\:au-mr-0 { margin-right: 0; } .sm\:au-mt-0 { margin-top: 0; } .sm\:au-mx-0 { margin-left: 0; margin-right: 0; } .sm\:au-my-0 { margin-top: 0; margin-bottom: 0; } .sm\:au-p-0 { padding: 0; } .sm\:au-pb-0 { padding-bottom: 0; } .sm\:au-pl-0 { padding-left: 0; } .sm\:au-pr-0 { padding-right: 0; } .sm\:au-pt-0 { padding-top: 0; } .sm\:au-px-0 { padding-left: 0; padding-right: 0; } .sm\:au-py-0 { padding-top: 0; padding-bottom: 0; } .sm\:au-m-2 { margin: var(--asic-space-2); } .sm\:au-mb-2 { margin-bottom: var(--asic-space-2); } .sm\:au-ml-2 { margin-left: var(--asic-space-2); } .sm\:au-mr-2 { margin-right: var(--asic-space-2); } .sm\:au-mt-2 { margin-top: var(--asic-space-2); } .sm\:au-mx-2 { margin-left: var(--asic-space-2); margin-right: var(--asic-space-2); } .sm\:au-my-2 { margin-top: var(--asic-space-2); margin-bottom: var(--asic-space-2); } .sm\:au-p-2 { padding: var(--asic-space-2); } .sm\:au-pb-2 { padding-bottom: var(--asic-space-2); } .sm\:au-pl-2 { padding-left: var(--asic-space-2); } .sm\:au-pr-2 { padding-right: var(--asic-space-2); } .sm\:au-pt-2 { padding-top: var(--asic-space-2); } .sm\:au-px-2 { padding-left: var(--asic-space-2); padding-right: var(--asic-space-2); } .sm\:au-py-2 { padding-top: var(--asic-space-2); padding-bottom: var(--asic-space-2); } .sm\:au-m-4 { margin: var(--asic-space-4); } .sm\:au-mb-4 { margin-bottom: var(--asic-space-4); } .sm\:au-ml-4 { margin-left: var(--asic-space-4); } .sm\:au-mr-4 { margin-right: var(--asic-space-4); } .sm\:au-mt-4 { margin-top: var(--asic-space-4); } .sm\:au-mx-4 { margin-left: var(--asic-space-4); margin-right: var(--asic-space-4); } .sm\:au-my-4 { margin-top: var(--asic-space-4); margin-bottom: var(--asic-space-4); } .sm\:au-p-4 { padding: var(--asic-space-4); } .sm\:au-pb-4 { padding-bottom: var(--asic-space-4); } .sm\:au-pl-4 { padding-left: var(--asic-space-4); } .sm\:au-pr-4 { padding-right: var(--asic-space-4); } .sm\:au-pt-4 { padding-top: var(--asic-space-4); } .sm\:au-px-4 { padding-left: var(--asic-space-4); padding-right: var(--asic-space-4); } .sm\:au-py-4 { padding-top: var(--asic-space-4); padding-bottom: var(--asic-space-4); } .sm\:au-m-8 { margin: var(--asic-space-8); } .sm\:au-mb-8 { margin-bottom: var(--asic-space-8); } .sm\:au-ml-8 { margin-left: var(--asic-space-8); } .sm\:au-mr-8 { margin-right: var(--asic-space-8); } .sm\:au-mt-8 { margin-top: var(--asic-space-8); } .sm\:au-mx-8 { margin-left: var(--asic-space-8); margin-right: var(--asic-space-8); } .sm\:au-my-8 { margin-top: var(--asic-space-8); margin-bottom: var(--asic-space-8); } .sm\:au-p-8 { padding: var(--asic-space-8); } .sm\:au-pb-8 { padding-bottom: var(--asic-space-8); } .sm\:au-pl-8 { padding-left: var(--asic-space-8); } .sm\:au-pr-8 { padding-right: var(--asic-space-8); } .sm\:au-pt-8 { padding-top: var(--asic-space-8); } .sm\:au-px-8 { padding-left: var(--asic-space-8); padding-right: var(--asic-space-8); } .sm\:au-py-8 { padding-top: var(--asic-space-8); padding-bottom: var(--asic-space-8); } .sm\:au-m-12 { margin: var(--asic-space-12); } .sm\:au-mb-12 { margin-bottom: var(--asic-space-12); } .sm\:au-ml-12 { margin-left: var(--asic-space-12); } .sm\:au-mr-12 { margin-right: var(--asic-space-12); } .sm\:au-mt-12 { margin-top: var(--asic-space-12); } .sm\:au-mx-12 { margin-left: var(--asic-space-12); margin-right: var(--asic-space-12); } .sm\:au-my-12 { margin-top: var(--asic-space-12); margin-bottom: var(--asic-space-12); } .sm\:au-p-12 { padding: var(--asic-space-12); } .sm\:au-pb-12 { padding-bottom: var(--asic-space-12); } .sm\:au-pl-12 { padding-left: var(--asic-space-12); } .sm\:au-pr-12 { padding-right: var(--asic-space-12); } .sm\:au-pt-12 { padding-top: var(--asic-space-12); } .sm\:au-px-12 { padding-left: var(--asic-space-12); padding-right: var(--asic-space-12); } .sm\:au-py-12 { padding-top: var(--asic-space-12); padding-bottom: var(--asic-space-12); } .sm\:au-m-16 { margin: var(--asic-space-16); } .sm\:au-mb-16 { margin-bottom: var(--asic-space-16); } .sm\:au-ml-16 { margin-left: var(--asic-space-16); } .sm\:au-mr-16 { margin-right: var(--asic-space-16); } .sm\:au-mt-16 { margin-top: var(--asic-space-16); } .sm\:au-mx-16 { margin-left: var(--asic-space-16); margin-right: var(--asic-space-16); } .sm\:au-my-16 { margin-top: var(--asic-space-16); margin-bottom: var(--asic-space-16); } .sm\:au-p-16 { padding: var(--asic-space-16); } .sm\:au-pb-16 { padding-bottom: var(--asic-space-16); } .sm\:au-pl-16 { padding-left: var(--asic-space-16); } .sm\:au-pr-16 { padding-right: var(--asic-space-16); } .sm\:au-pt-16 { padding-top: var(--asic-space-16); } .sm\:au-px-16 { padding-left: var(--asic-space-16); padding-right: var(--asic-space-16); } .sm\:au-py-16 { padding-top: var(--asic-space-16); padding-bottom: var(--asic-space-16); } .sm\:au-m-20 { margin: var(--asic-space-20); } .sm\:au-mb-20 { margin-bottom: var(--asic-space-20); } .sm\:au-ml-20 { margin-left: var(--asic-space-20); } .sm\:au-mr-20 { margin-right: var(--asic-space-20); } .sm\:au-mt-20 { margin-top: var(--asic-space-20); } .sm\:au-mx-20 { margin-left: var(--asic-space-20); margin-right: var(--asic-space-20); } .sm\:au-my-20 { margin-top: var(--asic-space-20); margin-bottom: var(--asic-space-20); } .sm\:au-p-20 { padding: var(--asic-space-20); } .sm\:au-pb-20 { padding-bottom: var(--asic-space-20); } .sm\:au-pl-20 { padding-left: var(--asic-space-20); } .sm\:au-pr-20 { padding-right: var(--asic-space-20); } .sm\:au-pt-20 { padding-top: var(--asic-space-20); } .sm\:au-px-20 { padding-left: var(--asic-space-20); padding-right: var(--asic-space-20); } .sm\:au-py-20 { padding-top: var(--asic-space-20); padding-bottom: var(--asic-space-20); } .sm\:au-p-24 { padding: var(--asic-space-24); } .sm\:au-pt-24 { padding-top: var(--asic-space-24); } .sm\:au-pb-24 { padding-bottom: var(--asic-space-24); } .sm\:au-pl-24 { padding-left: var(--asic-space-24); } .sm\:au-pr-24 { padding-right: var(--asic-space-24); } .sm\:au-px-24 { padding-left: var(--asic-space-24); padding-right: var(--asic-space-24); } .sm\:au-py-24 { padding-top: var(--asic-space-24); padding-bottom: var(--asic-space-24); } .sm\:au-m-24 { margin: var(--asic-space-24); } .sm\:au-mt-24 { margin-top: var(--asic-space-24); } .sm\:au-mb-24 { margin-bottom: var(--asic-space-24); } .sm\:au-ml-24 { margin-left: var(--asic-space-24); } .sm\:au-mr-24 { margin-right: var(--asic-space-24); } .sm\:au-mx-24 { margin-left: var(--asic-space-24); margin-right: var(--asic-space-24); } .sm\:au-my-24 { margin-top: var(--asic-space-24); margin-bottom: var(--asic-space-24); } .sm\:au-m-32 { margin: var(--asic-space-32); } .sm\:au-mb-32 { margin-bottom: var(--asic-space-32); } .sm\:au-ml-32 { margin-left: var(--asic-space-32); } .sm\:au-mr-32 { margin-right: var(--asic-space-32); } .sm\:au-mt-32 { margin-top: var(--asic-space-32); } .sm\:au-mx-32 { margin-left: var(--asic-space-32); margin-right: var(--asic-space-32); } .sm\:au-my-32 { margin-top: var(--asic-space-32); margin-bottom: var(--asic-space-32); } .sm\:au-p-32 { padding: var(--asic-space-32); } .sm\:au-pb-32 { padding-bottom: var(--asic-space-32); } .sm\:au-pl-32 { padding-left: var(--asic-space-32); } .sm\:au-pr-32 { padding-right: var(--asic-space-32); } .sm\:au-pt-32 { padding-top: var(--asic-space-32); } .sm\:au-px-32 { padding-left: var(--asic-space-32); padding-right: var(--asic-space-32); } .sm\:au-py-32 { padding-top: var(--asic-space-32); padding-bottom: var(--asic-space-32); } } @media (min-width: 992px) { .md\:au-m-0 { margin: 0; } .md\:au-mb-0 { margin-bottom: 0; } .md\:au-ml-0 { margin-left: 0; } .md\:au-mr-0 { margin-right: 0; } .md\:au-mt-0 { margin-top: 0; } .md\:au-mx-0 { margin-left: 0; margin-right: 0; } .md\:au-my-0 { margin-top: 0; margin-bottom: 0; } .md\:au-p-0 { padding: 0; } .md\:au-pb-0 { padding-bottom: 0; } .md\:au-pl-0 { padding-left: 0; } .md\:au-pr-0 { padding-right: 0; } .md\:au-pt-0 { padding-top: 0; } .md\:au-px-0 { padding-left: 0; padding-right: 0; } .md\:au-py-0 { padding-top: 0; padding-bottom: 0; } .md\:au-m-2 { margin: var(--asic-space-2); } .md\:au-mb-2 { margin-bottom: var(--asic-space-2); } .md\:au-ml-2 { margin-left: var(--asic-space-2); } .md\:au-mr-2 { margin-right: var(--asic-space-2); } .md\:au-mt-2 { margin-top: var(--asic-space-2); } .md\:au-mx-2 { margin-left: var(--asic-space-2); margin-right: var(--asic-space-2); } .md\:au-my-2 { margin-top: var(--asic-space-2); margin-bottom: var(--asic-space-2); } .md\:au-p-2 { padding: var(--asic-space-2); } .md\:au-pb-2 { padding-bottom: var(--asic-space-2); } .md\:au-pl-2 { padding-left: var(--asic-space-2); } .md\:au-pr-2 { padding-right: var(--asic-space-2); } .md\:au-pt-2 { padding-top: var(--asic-space-2); } .md\:au-px-2 { padding-left: var(--asic-space-2); padding-right: var(--asic-space-2); } .md\:au-py-2 { padding-top: var(--asic-space-2); padding-bottom: var(--asic-space-2); } .md\:au-m-4 { margin: var(--asic-space-4); } .md\:au-mb-4 { margin-bottom: var(--asic-space-4); } .md\:au-ml-4 { margin-left: var(--asic-space-4); } .md\:au-mr-4 { margin-right: var(--asic-space-4); } .md\:au-mt-4 { margin-top: var(--asic-space-4); } .md\:au-mx-4 { margin-left: var(--asic-space-4); margin-right: var(--asic-space-4); } .md\:au-my-4 { margin-top: var(--asic-space-4); margin-bottom: var(--asic-space-4); } .md\:au-p-4 { padding: var(--asic-space-4); } .md\:au-pb-4 { padding-bottom: var(--asic-space-4); } .md\:au-pl-4 { padding-left: var(--asic-space-4); } .md\:au-pr-4 { padding-right: var(--asic-space-4); } .md\:au-pt-4 { padding-top: var(--asic-space-4); } .md\:au-px-4 { padding-left: var(--asic-space-4); padding-right: var(--asic-space-4); } .md\:au-py-4 { padding-top: var(--asic-space-4); padding-bottom: var(--asic-space-4); } .md\:au-m-8 { margin: var(--asic-space-8); } .md\:au-mb-8 { margin-bottom: var(--asic-space-8); } .md\:au-ml-8 { margin-left: var(--asic-space-8); } .md\:au-mr-8 { margin-right: var(--asic-space-8); } .md\:au-mt-8 { margin-top: var(--asic-space-8); } .md\:au-mx-8 { margin-left: var(--asic-space-8); margin-right: var(--asic-space-8); } .md\:au-my-8 { margin-top: var(--asic-space-8); margin-bottom: var(--asic-space-8); } .md\:au-p-8 { padding: var(--asic-space-8); } .md\:au-pb-8 { padding-bottom: var(--asic-space-8); } .md\:au-pl-8 { padding-left: var(--asic-space-8); } .md\:au-pr-8 { padding-right: var(--asic-space-8); } .md\:au-pt-8 { padding-top: var(--asic-space-8); } .md\:au-px-8 { padding-left: var(--asic-space-8); padding-right: var(--asic-space-8); } .md\:au-py-8 { padding-top: var(--asic-space-8); padding-bottom: var(--asic-space-8); } .md\:au-m-12 { margin: var(--asic-space-12); } .md\:au-mb-12 { margin-bottom: var(--asic-space-12); } .md\:au-ml-12 { margin-left: var(--asic-space-12); } .md\:au-mr-12 { margin-right: var(--asic-space-12); } .md\:au-mt-12 { margin-top: var(--asic-space-12); } .md\:au-mx-12 { margin-left: var(--asic-space-12); margin-right: var(--asic-space-12); } .md\:au-my-12 { margin-top: var(--asic-space-12); margin-bottom: var(--asic-space-12); } .md\:au-p-12 { padding: var(--asic-space-12); } .md\:au-pb-12 { padding-bottom: var(--asic-space-12); } .md\:au-pl-12 { padding-left: var(--asic-space-12); } .md\:au-pr-12 { padding-right: var(--asic-space-12); } .md\:au-pt-12 { padding-top: var(--asic-space-12); } .md\:au-px-12 { padding-left: var(--asic-space-12); padding-right: var(--asic-space-12); } .md\:au-py-12 { padding-top: var(--asic-space-12); padding-bottom: var(--asic-space-12); } .md\:au-m-16 { margin: var(--asic-space-16); } .md\:au-mb-16 { margin-bottom: var(--asic-space-16); } .md\:au-ml-16 { margin-left: var(--asic-space-16); } .md\:au-mr-16 { margin-right: var(--asic-space-16); } .md\:au-mt-16 { margin-top: var(--asic-space-16); } .md\:au-mx-16 { margin-left: var(--asic-space-16); margin-right: var(--asic-space-16); } .md\:au-my-16 { margin-top: var(--asic-space-16); margin-bottom: var(--asic-space-16); } .md\:au-p-16 { padding: var(--asic-space-16); } .md\:au-pb-16 { padding-bottom: var(--asic-space-16); } .md\:au-pl-16 { padding-left: var(--asic-space-16); } .md\:au-pr-16 { padding-right: var(--asic-space-16); } .md\:au-pt-16 { padding-top: var(--asic-space-16); } .md\:au-px-16 { padding-left: var(--asic-space-16); padding-right: var(--asic-space-16); } .md\:au-py-16 { padding-top: var(--asic-space-16); padding-bottom: var(--asic-space-16); } .md\:au-m-20 { margin: var(--asic-space-20); } .md\:au-mb-20 { margin-bottom: var(--asic-space-20); } .md\:au-ml-20 { margin-left: var(--asic-space-20); } .md\:au-mr-20 { margin-right: var(--asic-space-20); } .md\:au-mt-20 { margin-top: var(--asic-space-20); } .md\:au-mx-20 { margin-left: var(--asic-space-20); margin-right: var(--asic-space-20); } .md\:au-my-20 { margin-top: var(--asic-space-20); margin-bottom: var(--asic-space-20); } .md\:au-p-20 { padding: var(--asic-space-20); } .md\:au-pb-20 { padding-bottom: var(--asic-space-20); } .md\:au-pl-20 { padding-left: var(--asic-space-20); } .md\:au-pr-20 { padding-right: var(--asic-space-20); } .md\:au-pt-20 { padding-top: var(--asic-space-20); } .md\:au-px-20 { padding-left: var(--asic-space-20); padding-right: var(--asic-space-20); } .md\:au-py-20 { padding-top: var(--asic-space-20); padding-bottom: var(--asic-space-20); } .md\:au-p-24 { padding: var(--asic-space-24); } .md\:au-pt-24 { padding-top: var(--asic-space-24); } .md\:au-pb-24 { padding-bottom: var(--asic-space-24); } .md\:au-pl-24 { padding-left: var(--asic-space-24); } .md\:au-pr-24 { padding-right: var(--asic-space-24); } .md\:au-px-24 { padding-left: var(--asic-space-24); padding-right: var(--asic-space-24); } .md\:au-py-24 { padding-top: var(--asic-space-24); padding-bottom: var(--asic-space-24); } .md\:au-m-24 { margin: var(--asic-space-24); } .md\:au-mt-24 { margin-top: var(--asic-space-24); } .md\:au-mb-24 { margin-bottom: var(--asic-space-24); } .md\:au-ml-24 { margin-left: var(--asic-space-24); } .md\:au-mr-24 { margin-right: var(--asic-space-24); } .md\:au-mx-24 { margin-left: var(--asic-space-24); margin-right: var(--asic-space-24); } .md\:au-my-24 { margin-top: var(--asic-space-24); margin-bottom: var(--asic-space-24); } .md\:au-m-32 { margin: var(--asic-space-32); } .md\:au-mb-32 { margin-bottom: var(--asic-space-32); } .md\:au-ml-32 { margin-left: var(--asic-space-32); } .md\:au-mr-32 { margin-right: var(--asic-space-32); } .md\:au-mt-32 { margin-top: var(--asic-space-32); } .md\:au-mx-32 { margin-left: var(--asic-space-32); margin-right: var(--asic-space-32); } .md\:au-my-32 { margin-top: var(--asic-space-32); margin-bottom: var(--asic-space-32); } .md\:au-p-32 { padding: var(--asic-space-32); } .md\:au-pb-32 { padding-bottom: var(--asic-space-32); } .md\:au-pl-32 { padding-left: var(--asic-space-32); } .md\:au-pr-32 { padding-right: var(--asic-space-32); } .md\:au-pt-32 { padding-top: var(--asic-space-32); } .md\:au-px-32 { padding-left: var(--asic-space-32); padding-right: var(--asic-space-32); } .md\:au-py-32 { padding-top: var(--asic-space-32); padding-bottom: var(--asic-space-32); } } @media (min-width: 1200px) { .lg\:au-m-0 { margin: 0; } .lg\:au-mb-0 { margin-bottom: 0; } .lg\:au-ml-0 { margin-left: 0; } .lg\:au-mr-0 { margin-right: 0; } .lg\:au-mt-0 { margin-top: 0; } .lg\:au-mx-0 { margin-left: 0; margin-right: 0; } .lg\:au-my-0 { margin-top: 0; margin-bottom: 0; } .lg\:au-p-0 { padding: 0; } .lg\:au-pb-0 { padding-bottom: 0; } .lg\:au-pl-0 { padding-left: 0; } .lg\:au-pr-0 { padding-right: 0; } .lg\:au-pt-0 { padding-top: 0; } .lg\:au-px-0 { padding-left: 0; padding-right: 0; } .lg\:au-py-0 { padding-top: 0; padding-bottom: 0; } .lg\:au-m-2 { margin: var(--asic-space-2); } .lg\:au-mb-2 { margin-bottom: var(--asic-space-2); } .lg\:au-ml-2 { margin-left: var(--asic-space-2); } .lg\:au-mr-2 { margin-right: var(--asic-space-2); } .lg\:au-mt-2 { margin-top: var(--asic-space-2); } .lg\:au-mx-2 { margin-left: var(--asic-space-2); margin-right: var(--asic-space-2); } .lg\:au-my-2 { margin-top: var(--asic-space-2); margin-bottom: var(--asic-space-2); } .lg\:au-p-2 { padding: var(--asic-space-2); } .lg\:au-pb-2 { padding-bottom: var(--asic-space-2); } .lg\:au-pl-2 { padding-left: var(--asic-space-2); } .lg\:au-pr-2 { padding-right: var(--asic-space-2); } .lg\:au-pt-2 { padding-top: var(--asic-space-2); } .lg\:au-px-2 { padding-left: var(--asic-space-2); padding-right: var(--asic-space-2); } .lg\:au-py-2 { padding-top: var(--asic-space-2); padding-bottom: var(--asic-space-2); } .lg\:au-m-4 { margin: var(--asic-space-4); } .lg\:au-mb-4 { margin-bottom: var(--asic-space-4); } .lg\:au-ml-4 { margin-left: var(--asic-space-4); } .lg\:au-mr-4 { margin-right: var(--asic-space-4); } .lg\:au-mt-4 { margin-top: var(--asic-space-4); } .lg\:au-mx-4 { margin-left: var(--asic-space-4); margin-right: var(--asic-space-4); } .lg\:au-my-4 { margin-top: var(--asic-space-4); margin-bottom: var(--asic-space-4); } .lg\:au-p-4 { padding: var(--asic-space-4); } .lg\:au-pb-4 { padding-bottom: var(--asic-space-4); } .lg\:au-pl-4 { padding-left: var(--asic-space-4); } .lg\:au-pr-4 { padding-right: var(--asic-space-4); } .lg\:au-pt-4 { padding-top: var(--asic-space-4); } .lg\:au-px-4 { padding-left: var(--asic-space-4); padding-right: var(--asic-space-4); } .lg\:au-py-4 { padding-top: var(--asic-space-4); padding-bottom: var(--asic-space-4); } .lg\:au-m-8 { margin: var(--asic-space-8); } .lg\:au-mb-8 { margin-bottom: var(--asic-space-8); } .lg\:au-ml-8 { margin-left: var(--asic-space-8); } .lg\:au-mr-8 { margin-right: var(--asic-space-8); } .lg\:au-mt-8 { margin-top: var(--asic-space-8); } .lg\:au-mx-8 { margin-left: var(--asic-space-8); margin-right: var(--asic-space-8); } .lg\:au-my-8 { margin-top: var(--asic-space-8); margin-bottom: var(--asic-space-8); } .lg\:au-p-8 { padding: var(--asic-space-8); } .lg\:au-pb-8 { padding-bottom: var(--asic-space-8); } .lg\:au-pl-8 { padding-left: var(--asic-space-8); } .lg\:au-pr-8 { padding-right: var(--asic-space-8); } .lg\:au-pt-8 { padding-top: var(--asic-space-8); } .lg\:au-px-8 { padding-left: var(--asic-space-8); padding-right: var(--asic-space-8); } .lg\:au-py-8 { padding-top: var(--asic-space-8); padding-bottom: var(--asic-space-8); } .lg\:au-m-12 { margin: var(--asic-space-12); } .lg\:au-mb-12 { margin-bottom: var(--asic-space-12); } .lg\:au-ml-12 { margin-left: var(--asic-space-12); } .lg\:au-mr-12 { margin-right: var(--asic-space-12); } .lg\:au-mt-12 { margin-top: var(--asic-space-12); } .lg\:au-mx-12 { margin-left: var(--asic-space-12); margin-right: var(--asic-space-12); } .lg\:au-my-12 { margin-top: var(--asic-space-12); margin-bottom: var(--asic-space-12); } .lg\:au-p-12 { padding: var(--asic-space-12); } .lg\:au-pb-12 { padding-bottom: var(--asic-space-12); } .lg\:au-pl-12 { padding-left: var(--asic-space-12); } .lg\:au-pr-12 { padding-right: var(--asic-space-12); } .lg\:au-pt-12 { padding-top: var(--asic-space-12); } .lg\:au-px-12 { padding-left: var(--asic-space-12); padding-right: var(--asic-space-12); } .lg\:au-py-12 { padding-top: var(--asic-space-12); padding-bottom: var(--asic-space-12); } .lg\:au-m-16 { margin: var(--asic-space-16); } .lg\:au-mb-16 { margin-bottom: var(--asic-space-16); } .lg\:au-ml-16 { margin-left: var(--asic-space-16); } .lg\:au-mr-16 { margin-right: var(--asic-space-16); } .lg\:au-mt-16 { margin-top: var(--asic-space-16); } .lg\:au-mx-16 { margin-left: var(--asic-space-16); margin-right: var(--asic-space-16); } .lg\:au-my-16 { margin-top: var(--asic-space-16); margin-bottom: var(--asic-space-16); } .lg\:au-p-16 { padding: var(--asic-space-16); } .lg\:au-pb-16 { padding-bottom: var(--asic-space-16); } .lg\:au-pl-16 { padding-left: var(--asic-space-16); } .lg\:au-pr-16 { padding-right: var(--asic-space-16); } .lg\:au-pt-16 { padding-top: var(--asic-space-16); } .lg\:au-px-16 { padding-left: var(--asic-space-16); padding-right: var(--asic-space-16); } .lg\:au-py-16 { padding-top: var(--asic-space-16); padding-bottom: var(--asic-space-16); } .lg\:au-m-20 { margin: var(--asic-space-20); } .lg\:au-mb-20 { margin-bottom: var(--asic-space-20); } .lg\:au-ml-20 { margin-left: var(--asic-space-20); } .lg\:au-mr-20 { margin-right: var(--asic-space-20); } .lg\:au-mt-20 { margin-top: var(--asic-space-20); } .lg\:au-mx-20 { margin-left: var(--asic-space-20); margin-right: var(--asic-space-20); } .lg\:au-my-20 { margin-top: var(--asic-space-20); margin-bottom: var(--asic-space-20); } .lg\:au-p-20 { padding: var(--asic-space-20); } .lg\:au-pb-20 { padding-bottom: var(--asic-space-20); } .lg\:au-pl-20 { padding-left: var(--asic-space-20); } .lg\:au-pr-20 { padding-right: var(--asic-space-20); } .lg\:au-pt-20 { padding-top: var(--asic-space-20); } .lg\:au-px-20 { padding-left: var(--asic-space-20); padding-right: var(--asic-space-20); } .lg\:au-py-20 { padding-top: var(--asic-space-20); padding-bottom: var(--asic-space-20); } .lg\:au-p-24 { padding: var(--asic-space-24); } .lg\:au-pt-24 { padding-top: var(--asic-space-24); } .lg\:au-pb-24 { padding-bottom: var(--asic-space-24); } .lg\:au-pl-24 { padding-left: var(--asic-space-24); } .lg\:au-pr-24 { padding-right: var(--asic-space-24); } .lg\:au-px-24 { padding-left: var(--asic-space-24); padding-right: var(--asic-space-24); } .lg\:au-py-24 { padding-top: var(--asic-space-24); padding-bottom: var(--asic-space-24); } .lg\:au-m-24 { margin: var(--asic-space-24); } .lg\:au-mt-24 { margin-top: var(--asic-space-24); } .lg\:au-mb-24 { margin-bottom: var(--asic-space-24); } .lg\:au-ml-24 { margin-left: var(--asic-space-24); } .lg\:au-mr-24 { margin-right: var(--asic-space-24); } .lg\:au-mx-24 { margin-left: var(--asic-space-24); margin-right: var(--asic-space-24); } .lg\:au-my-24 { margin-top: var(--asic-space-24); margin-bottom: var(--asic-space-24); } .lg\:au-m-32 { margin: var(--asic-space-32); } .lg\:au-mb-32 { margin-bottom: var(--asic-space-32); } .lg\:au-ml-32 { margin-left: var(--asic-space-32); } .lg\:au-mr-32 { margin-right: var(--asic-space-32); } .lg\:au-mt-32 { margin-top: var(--asic-space-32); } .lg\:au-mx-32 { margin-left: var(--asic-space-32); margin-right: var(--asic-space-32); } .lg\:au-my-32 { margin-top: var(--asic-space-32); margin-bottom: var(--asic-space-32); } .lg\:au-p-32 { padding: var(--asic-space-32); } .lg\:au-pb-32 { padding-bottom: var(--asic-space-32); } .lg\:au-pl-32 { padding-left: var(--asic-space-32); } .lg\:au-pr-32 { padding-right: var(--asic-space-32); } .lg\:au-pt-32 { padding-top: var(--asic-space-32); } .lg\:au-px-32 { padding-left: var(--asic-space-32); padding-right: var(--asic-space-32); } .lg\:au-py-32 { padding-top: var(--asic-space-32); padding-bottom: var(--asic-space-32); } } .au-whitespace-normal { white-space: normal; } .au-whitespace-nowrap { white-space: nowrap; } .au-whitespace-pre { white-space: pre; } .au-whitespace-pre-line { white-space: pre-line; } .au-whitespace-pre-wrap { white-space: pre-wrap; } .au-whitespace-break-spaces { white-space: break-spaces; } .au-font-bold { font-weight: var(--asic-font-weight-bold); } .au-font-semibold { font-weight: var(--asic-font-weight-semibold); } .au-font-medium { font-weight: var(--asic-font-weight-medium); } .au-font-regular { font-weight: var(--asic-font-weight-regular); } .au-text-left { text-align: left; } .au-text-center { text-align: center; } .au-text-right { text-align: right; } .au-text-justify { text-align: justify; } .au-text-start { text-align: start; } .au-text-end { text-align: end; } } .asic-accordion__title:after { font-variation-settings: "FILL" 1; } .asic-alert:after { font-variation-settings: "FILL" 1; } .asic-callout:where([class*=asic-callout--]):after { font-variation-settings: "FILL" 1; } .asic-card:not(:is(:has(.asic-card__icon), :has(.asic-card__media))):after { font-variation-settings: "FILL" 1; } .asic-collapsible__toggle:after { font-variation-settings: "FILL" 1; } :where(.asic-icon, .asic-icon-small, .asic-icon-large, .asic-icon-xlarge) { font-variation-settings: "FILL" 1; } .asic-mainnav__dialog-trigger:before { font-variation-settings: "FILL" 1; } .asic-mainnav__dialog-close:before { font-variation-settings: "FILL" 1; } .asic-stepper__item .asic-stepper__item { font-variation-settings: "FILL" 1; } .asic-home-search-section { position: relative; min-height: 550px; background-position: center center; background-size: cover; padding-block: var(--asic-space-72); background-image: linear-gradient(to bottom, rgba(29, 37, 45, 0.88), rgba(29, 37, 45, 0.88)), url("../img/hero_home_default_sml.jpg"); } .asic-home-search-section .asic-container { max-width: 1150px; position: relative; z-index: 1; } .asic-search-heading { color: var(--static-gray-0); font: var(--asic-text-title-shorthand); margin-bottom: var(--asic-space-8); padding-left: var(--asic-space-8); } .search-container .asic-field-block { display: block; } @media (width > 768px) { .asic-search-heading { padding-left: var(--asic-space-32); } } .asic-search-box { display: flex; margin-top: 0.5rem; position: relative; /* .asic-icon { position: absolute; left: var(--asic-space-8); display: flex; align-items: center; height: var(--asic-space-48); } */ /* display: grid; gap: var(--asic-form-text-gap); grid-template-columns: auto 120px; */ /* .asic-textbox--fill { padding: 0 var(--asic-space-16); font-size: 1rem; width: calc(100% - var(--asic-space-16)); &:focus-visible { outline: none; } } */ /*.asic-textbox--search { &:before { font: var(--asic-icon-font); content: "account_circle"; -webkit-font-smoothing: antialiased; width: 1em; display: inline-block; overflow: hidden; } }*/ } .asic-search-box .asic-textbox--search::placeholder { color: var(--asic-color-text); } .asic-search-box button { border-color: var(--static-gray-6); color: var(--static-gray-3); margin-left: 0.3rem; } .asic-search-box button:hover { background-color: var(--static-brand-sky); } .asic-search-box button span:last-child { clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; width: 1px; height: 1px; position: absolute; overflow: hidden; } @media (width > 768px) { .asic-search-box { padding: var(--asic-space-32); } .asic-search-box button span:last-child { clip: unset; clip-path: unset; white-space: unset; width: unset; height: unset; position: unset; overflow: unset; } .asic-search-box .asic-icon { left: var(--asic-space-48); } .asic-search-box .asic-textbox--search { padding-left: var(--asic-space-12); } } .popular-container { margin-top: var(--asic-space-64); min-height: 330px; } .popular-container .asic-button { width: 100%; } .asic-content-tabs-featured ul { list-style-type: none; padding: 0; margin: 0; color: var(--static-gray-0); } .asic-content-tabs-featured li { break-inside: avoid-column; min-height: calc(var(--item-height) * 2); } .asic-content-tabs-featured a { display: block; color: var(--static-gray-0); text-decoration: none; padding: var(--asic-space-8) 0; } .asic-content-tabs-featured a:hover { text-decoration: underline; } /* .asic-link-list--columns { column-width: 288px; // override to stop items going onto 3 lines } */ @media screen and (width > 1200px) { .asic-content-tabs-featured li { min-height: var(--item-height); } } #asic-search-popup { position: absolute; z-index: 1; width: calc(100% - 32px); /* border-style: inset; border-color: rgb(118, 118, 118); border-width: 1px; border-top: none; */ margin: 0; padding: var(--asic-space-16) var(--asic-space-16) var(--asic-space-48) var(--asic-space-16); background-color: white; box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1607843137); border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } @media (width > 768px) { #asic-search-popup { width: calc(100% - 96px); margin: 0 var(--asic-space-32); margin-top: calc(var(--asic-space-32) * -1); border-radius: 4px; } } .asic-search-popup-heading { margin: var(--asic-space-32) 0 var(--asic-space-8) 0; } .asic-search-popup-heading:first-of-type { margin-top: var(--asic-space-16); } .hp-jump-nav { display: none; } @media screen and (width > 1024px) { .hp-jump-nav { margin-top: calc(var(--asic-content-gap-y) * -1); display: block; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137); } .hp-jump-nav ul, .hp-jump-nav li { list-style-type: none; padding: 0; margin: 0; } .hp-jump-nav ul { max-width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-max)); margin: 0 auto; text-align: right; } .hp-jump-nav li { display: inline-block; padding: var(--asic-space-32); } .hp-jump-nav li:last-child { padding-right: 0; } .hp-jump-nav a { text-decoration: none; color: var(--asic-color-text); display: inline-block; } .hp-jump-nav a:hover { text-decoration: underline; } } .hp-what-we-do { max-width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-max)); margin: 0 auto; margin-top: calc(var(--asic-content-gap-y) * -1); /* &:after { content: ''; box-shadow: 0px 3px 6px #00000029; } */ } @media screen and (width > 1024px) { .hp-what-we-do { display: grid; grid-template-rows: 1fr; grid-template-columns: 28% auto; } } .hp-what-we-do a { text-decoration: none; } .hp-what-we-do ul, .hp-what-we-do li { list-style-type: none; padding: 0; margin: 0; } .hp-what-we-do > div { position: relative; padding: 2rem 0 3.5rem; } @media screen and (width > 1024px) { .hp-what-we-do > div { padding: 0; background-color: var(--static-gray-3); } } .hp-what-we-do > div h2 { font-size: 3rem; font-size: clamp(1.375rem, 7vw, 3rem); } @media (width > 1024px) { .hp-what-we-do > div h2 { margin-top: 12rem; } } @media (width > 1024px) and (width <= 1350px) { .hp-what-we-do > div h2 { font-size: 2.4rem; margin-top: calc(var(--asic-space-32) * 6); } } .hp-what-we-do > div p { font-size: 1rem; } .hp-what-we-do > div p:last-child { margin-top: 4rem; } @media (width > 1024px) { .hp-what-we-do > div p { font-size: 1.125rem; margin-right: 5rem; margin-bottom: 5rem; } .hp-what-we-do > div p a { font-size: 1rem; } } @media (width > 1024px) and (width <= 1350px) { .hp-what-we-do > div p { margin-right: calc(var(--asic-space-32) * 2.5); margin-bottom: calc(var(--asic-space-32) * 2.5); } } @media screen and (width > 1024px) { .hp-what-we-do > div::before { content: ""; background-color: var(--static-gray-3); position: absolute; top: 0; bottom: 0; left: -9999px; width: 9999px; } } .hp-what-we-do .hp-tiles { display: none; } @media screen and (width > 1024px) { .hp-what-we-do .hp-tiles { margin: calc(var(--asic-space-32) * 2.8125) 0 calc(var(--asic-space-32) * 2.8125) var(--asic-space-32); display: grid; grid-template-rows: 1fr 1fr; grid-template-columns: 1fr 1fr 1fr; grid-column-gap: var(--asic-space-32); grid-row-gap: var(--asic-space-32); } .hp-what-we-do .hp-tiles li { border: solid 1px #E4E4E7; border-radius: 5px; text-align: center; padding: var(--asic-space-32) calc(var(--asic-space-32) * 0.66); line-height: 1.35; position: relative; transition: box-shadow 0.3s; } .hp-what-we-do .hp-tiles li:has(a:hover, a:focus) { box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.1607843137); } .hp-what-we-do .hp-tiles a { color: var(--static-brand-navy); } .hp-what-we-do .hp-tiles a::after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .hp-what-we-do .hp-tiles .icon { margin: 0 auto; width: 56px; height: 56px; background-size: contain; background-repeat: no-repeat; background-image: url(https://download.asic.gov.au/asic-nextgen/img/icon-globe.png); } .hp-what-we-do .hp-tiles .icon-role { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icon-building.svg); } .hp-what-we-do .hp-tiles .icon-operate { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icon-checks.svg); } .hp-what-we-do .hp-tiles .icon-people { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icon-people.svg); } .hp-what-we-do .hp-tiles .icon-activities { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icon-globe.svg); } .hp-what-we-do .hp-tiles .icon-org { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icon-structure.svg); } .hp-what-we-do .hp-tiles .icon-consumers { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icon-moneysmart.png); } .hp-what-we-do .hp-tiles p { text-wrap: pretty; } } .hp-featured { max-width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-max)); margin: 0 auto; } .hp-featured h2 { font-size: clamp(1.375rem, 7vw, 2.5rem); } .hp-featured .scrollable-featured-list { flex-wrap: nowrap; justify-content: left; } .hp-featured .scrollable-featured-list li { cursor: pointer; display: block; background: transparent; padding: 0; width: 100%; height: 500px; flex: 1 0 100%; } @media screen and (width > 800px) { .hp-featured .scrollable-featured-list li { height: 600px; } } .hp-featured .scrollable-featured-list li p { margin: 0; } .hp-featured .scrollable-featured-list li h3 { font-size: 2.5rem; font-size: clamp(1.5rem, 6vw, 2.5rem); margin-top: 1.2rem; margin-bottom: 2rem; line-height: 1.2; text-wrap: pretty; font-weight: 600; color: white; } @media screen and (width < 1300px) { .hp-featured .scrollable-featured-list li h3.hp-title-med { font-size: 2.35rem; font-size: clamp(1.5rem, 6vw, 2.35rem); } .hp-featured .scrollable-featured-list li h3.hp-title-long { font-size: 2.1rem; font-size: clamp(1.5rem, 6vw, 2.1rem); } } @media screen and (width < 1000px) { .hp-featured .scrollable-featured-list li h3.hp-title-med { font-size: 2.25rem; font-size: clamp(1.5rem, 6vw, 2.25rem); } .hp-featured .scrollable-featured-list li h3.hp-title-long { font-size: 2rem; font-size: clamp(1.5rem, 6vw, 2rem); } } .hp-featured .scrollable-featured-list li .hp-label { text-transform: uppercase; color: white; font-size: 0.875rem; } .hp-featured .scrollable-featured-list li .hp-date { font-size: 0.875rem; } .hp-featured .scrollable-featured-list li .hp-description { color: white; margin-bottom: 4rem; font-size: 0.875rem; width: calc(100% - 2rem); } @media screen and (width > 800px) { .hp-featured .scrollable-featured-list li .hp-description { font-size: 1rem; width: 100%; } } .hp-featured .scrollable-featured-list li img { object-fit: cover; width: 100%; height: 500px; aspect-ratio: 16/9; } @media screen and (width > 800px) { .hp-featured .scrollable-featured-list li img { height: 600px; } } .hp-featured .scrollable-featured-list li > div { position: absolute; top: 0; left: 0; width: 100%; padding: 0 1rem; height: 500px; display: flex; flex-wrap: wrap; align-content: center; background-color: var(--static-brand-navy); background: linear-gradient(180deg, rgba(22, 36, 41, 0.85) 70%, transparent 100%); border-radius: 2px; } @media screen and (width > 800px) { .hp-featured .scrollable-featured-list li > div { width: 33%; min-width: calc(100px + 7rem); max-width: 670px; height: 600px; padding: 0 2rem 0 5rem; } } .hp-featured .slider-buttons.slider-buttons-big { width: 100%; top: 300px; margin: 0; } .hp-featured .slider-buttons.slider-buttons-big button { background-color: white !important; border-radius: 2rem; cursor: pointer; } .hp-featured .slider-buttons.slider-buttons-big button:first-child { left: -1rem; position: absolute; } @media screen and (width <= 800px) { .hp-featured .slider-buttons.slider-buttons-big button:first-child { left: -0.5rem; } } .hp-featured .slider-buttons.slider-buttons-big button:last-child { right: -1rem; position: absolute; } @media screen and (width <= 800px) { .hp-featured .slider-buttons.slider-buttons-big button:last-child { right: -0.5rem; } } @media screen and (width <= 800px) { .hp-featured .slider-buttons.slider-buttons-big svg { width: 1rem; height: 1rem; } } @media screen and (width <= 800px) { .hp-featured .slider-buttons.slider-buttons-big { display: none; } } .hp-news { max-width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-max)); margin: 0 auto; margin-top: var(--asic-content-gap-y); } .hp-news h2 { font-size: 2.5rem; } .hp-news h3 { font-size: 1.1rem; margin: 0; line-height: 1.2; text-wrap: pretty; } .hp-news ul, .hp-news li { list-style-type: none; padding: 0; margin: 0; } .hp-news p { margin: 2rem 0; text-align: right; } .hp-news ul { display: grid; grid-template-columns: 1fr; } @media screen and (width > 1024px) { .hp-news ul { grid-template-columns: 0.75fr 0.75fr 1fr; grid-template-rows: repeat(4, 1fr); grid-column-gap: 1.5em; } } .hp-news ul a { text-decoration: none; color: var(--blue-dark); } .hp-news ul p { margin: 0; text-align: left; } .hp-news li.hp-news-item { position: relative; display: grid; border-bottom: solid 1px #F1F1F3; margin-left: 0; grid-template-columns: 1fr; grid-template-areas: "heroimg" "type" "date" "heading" "desc"; } .hp-news li.hp-news-item h3 { grid-area: heading; font-size: 1.3rem; margin-top: 1.2rem; margin-bottom: 1.2rem; } .hp-news li.hp-news-item a::after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .hp-news li.hp-news-item a:hover, .hp-news li.hp-news-item a:focus { text-decoration: underline; } .hp-news li.hp-news-item .hp-label { grid-area: type; margin-top: 1rem; } @media screen and (width > 1024px) { .hp-news li.hp-news-item .hp-label { margin-top: 2rem; } } .hp-news li.hp-news-item .hp-date { grid-area: date; } .hp-news li.hp-news-item .hp-description { grid-area: desc; margin-bottom: 2rem; display: none; } .hp-news li.hp-news-item img { display: none; } .hp-news li.hp-news-item p, .hp-news li.hp-news-item h3 { margin-left: 0; margin-right: 0; } @media screen and (width > 1024px) { .hp-news li.hp-news-item p, .hp-news li.hp-news-item h3 { margin-left: 2rem; margin-right: 2rem; } } @media screen and (width > 1024px) { .hp-news li.hp-news-item { grid-row: 1/5; border-bottom: none; box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1607843137); transition: box-shadow 0.3s; text-decoration: none; } .hp-news li.hp-news-item .hp-description { display: block; } .hp-news li.hp-news-item img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; grid-area: heroimg; } .hp-news li.hp-news-item:has(a:hover, a:focus) { box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.1607843137); } } .hp-news li.hp-news-item:nth-child(n+3) { grid-row: auto; border-bottom: solid 1px #F1F1F3; box-shadow: none; } .hp-news li.hp-news-item:nth-child(n+3):has(a:hover, a:focus) { box-shadow: none; } .hp-news li.hp-news-item:nth-child(n+3) .hp-description { display: none; } .hp-news li.hp-news-item:nth-child(n+3) h3 { font-size: 1.1rem; margin: 0.5rem 0; } @media screen and (width > 1024px) { .hp-news li.hp-news-item:nth-child(n+3) img { display: none; } } @media screen and (width > 1024px) { .hp-news li.hp-news-item:nth-child(n+3) p, .hp-news li.hp-news-item:nth-child(n+3) h3 { margin-left: 0; margin-right: 0; } } .hp-news li.hp-news-item:nth-child(n+3) .hp-date { margin-bottom: 1rem; } @media screen and (width > 1024px) { .hp-news li.hp-news-item:nth-child(n+3) { margin-left: 1.3rem; } } @media screen and (width > 1024px) { .hp-news li.hp-news-item:nth-child(n+3) .hp-label { margin-top: 1rem; } } .hp-news li.hp-news-item-blank { height: 138px; } @media screen and (width > 1024px) { .hp-news li.hp-news-item-blank:nth-child(-n+2) { height: 556px; aspect-ratio: 5/6; } } .hp-news li { grid-auto-rows: min-content; } @media screen and (width > 1024px) { .hp-news li:nth-child(3) .hp-label { margin-top: 0; } } .hp-news .hp-label { text-transform: uppercase; color: var(--blue-mid); } .hp-news .hp-date { color: #60666C; } .hp-news a.link { color: #505050; position: relative; } .hp-news a.link::before { content: ""; position: absolute; left: -1.1rem; top: calc(50% - 0.4375rem); width: 0; height: 0; border-style: solid; border-width: 0.4375rem 0 0.4375rem 0.5625rem; border-color: transparent transparent transparent var(--blue-mid); } .grid-square-links { background-color: #fafafa; padding: 4rem 0; margin: 0; overflow-x: auto; } .grid-square-links ul, .grid-square-links li { list-style-type: none; padding: 0; margin: 0; } .grid-square-links h2, .grid-square-links .grid { max-width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-max)); margin: 0 auto; } .grid-square-links h2 { font-size: 2.5rem; font-size: clamp(1.375rem, 7vw, 2.5rem); margin-bottom: 1em; } .grid-square-links .scrollable-grid-container { overflow-x: auto; position: relative; margin-left: 0; } .grid-square-links .slider-buttons { display: none; } @media screen and (width > 768px) { .grid-square-links .slider-select-buttons { display: none; } } .grid-square-links .grid { display: grid; grid-template-rows: repeat(1, 1fr); grid-auto-columns: calc(100vw - 1.95rem); grid-auto-flow: column; grid-column-gap: 1rem; grid-row-gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scroll-snap-stop: always; scroll-padding: 1rem; scrollbar-width: none; } @media screen and (width > 768px) { .grid-square-links .grid { display: grid; grid-template-rows: 1fr; grid-template-columns: repeat(4, 1fr); grid-column-gap: 1rem; grid-row-gap: 1rem; } } @media screen and (width > 768px) and (width <= 1199px) { .grid-square-links .grid { grid-template-rows: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr); } } .grid-square-links .grid li { scroll-snap-align: start; background-color: var(--static-brand-navy); color: #fdfdfd; padding: 10vh 15%; position: relative; transition: box-shadow 0.3s; } @media screen and (width > 768px) and (width <= 1199px) { .grid-square-links .grid li { padding: 5vh 7.5%; } } .grid-square-links .grid li .title { margin: 0 0; font-size: 2.5rem; line-height: 1.2; min-height: 7rem; padding: 0.5em 0 0; } @media screen and (width > 768px) { .grid-square-links .grid li .title { font-size: clamp(1.875rem, 0rem + 2.5vw, 2.5rem); } } @media screen and (width > 768px) and (width <= 1199px) { .grid-square-links .grid li .title { min-height: 3.5rem; } } .grid-square-links .grid li .title::before { content: ""; width: 60px; height: 3px; display: block; background-color: #D1CCBD; margin-bottom: 0.8rem; } .grid-square-links .grid li a { color: #fdfdfd; text-decoration: none; } .grid-square-links .grid li a::after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .grid-square-links .grid li:has(a:hover, a:focus) { box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.5019607843); } .grid-square-links .grid li.highlight { background-color: var(--blue-mid); } .grid-square-links .grid li:nth-child(2) .title::before { background-color: #3CB4E5; } .grid-square-links .grid li:nth-child(3) .title::before { background-color: #84DADE; } .grid-square-links .grid li:nth-child(4) .title::before { background-color: var(--static-gray-2); } .hp-feature-block { max-width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-max)); margin: 0 auto 1rem; background-color: rgba(228, 228, 231, 0.5019607843); } .hp-feature-block:last-child { margin-bottom: 0; } @media screen and (width > 1024px) { .hp-feature-block { margin: 1rem auto; } .hp-feature-block:last-child { margin-top: -1rem; margin-bottom: 3rem; } } @media screen and (width > 1024px) { .hp-feature-block { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; } } .hp-feature-block .feature-image { display: none; } @media screen and (width > 1024px) { .hp-feature-block .feature-image { display: block; } .hp-feature-block .feature-image img { object-fit: cover; width: 100%; height: 100%; } } .hp-feature-block .feature-content { padding: 4rem 1rem; } .hp-feature-block .feature-content h2 { margin-top: 0; font-size: 2.5rem; font-size: clamp(1.375rem, 7vw, 2.5rem); line-height: 1.3; } @media (width > 1024px) and (width <= 1470px) { .hp-feature-block .feature-content h2 { font-size: 2.4rem; } } .hp-feature-block .feature-content .subheading { margin-bottom: 3rem; } .hp-feature-block .feature-content ul { margin: 0; padding: 0; list-style-type: none; } .hp-feature-block .feature-content ul a { display: block; padding: 0.25rem 0; color: var(--asic-color-text); } .hp-feature-block .feature-content ul li:last-child { font-weight: bold; margin-top: 1.5rem; } @media (width > 1024px) and (width <= 1470px) { .hp-feature-block .feature-content { padding: 4rem 2rem; } } @media screen and (width > 1471px) { .hp-feature-block .feature-content { padding: 6rem 7.5rem; } } .hp-feature-block .feature-content-blue { background-color: var(--asic-color-background-accent-emphasis); color: var(--asic-color-text-inverse); } .hp-feature-block .feature-content-blue .asic-button--secondary { color: var(--asic-color-text-inverse); border-color: var(--static-gray-3); } .hp-feature-block .feature-content-blue .asic-button--secondary:hover { color: var(--asic-color-text); background-color: var(--static-gray-2); } .hp-feature-block .feature-content-dark-blue { background-color: var(--static-brand-navy); color: var(--asic-color-text-inverse); } .hp-feature-block .feature-content-dark-blue .asic-button--secondary { color: var(--asic-color-text-inverse); border-color: var(--static-gray-3); } .hp-feature-block .feature-content-dark-blue .asic-button--secondary:hover { color: var(--asic-color-text); background-color: var(--static-gray-2); } @media (width <= 1024px) { .hp-what-we-do > div p:last-child { margin-top: 0; } .hp-what-we-do > div { padding: 1rem 0 1rem 0; } .hp-feature-block .feature-content { margin-bottom: 1rem; } .grid-square-links { padding-top: 1.5rem; } } .asic-global-search-input:not([hidden]) { display: flex; align-items: center; } .asic-global-search-input input { padding-right: 38px; width: 30vw; } .asic-global-search-input button { background-color: transparent; border: none; position: absolute; right: 60px; } .asic-global-search-input input::placeholder { color: var(--asic-color-text); } .asic-searchpage-filter-button { color: black; margin-left: 2rem; } .asic-searchpage-filter-summary { display: flex; justify-content: flex-start; margin-top: 0; margin-bottom: 1.5rem; width: 100%; align-items: center; column-gap: 1rem; } .asic-searchpage-result-tag { background-color: var(--static-gray-2); font: var(--asic-text-body-small-shorthand); padding: 0.2rem 0.5rem 0.2rem 0.5rem; border: 1px solid var(--asic-color-border-muted); border-radius: 0.2rem; } .asic-searchpage-tags { display: flex; justify-content: space-between; } .asic-searchpage-checkboxes details[open] .asic-accordion-title-searchpage { margin-bottom: var(--asic-space-16); } .asic-accordion-title-searchpage { font: var(--asic-text-body-small-shorthand); border: 1px solid var(--asic-color-border-muted); background-color: var(--static-gray-2); padding: 0.75rem 0.5rem; font-weight: var(--asic-font-weight-semibold); margin: 0; } .asic-searchpage-results hr { width: 100%; border: 0; border-top: 1.5px solid var(--asic-color-border-muted); margin-bottom: 0.8rem; } .asic-searchpage-pagination ul li { display: inline-block; border: 1.5px solid var(--asic-color-border-emphasis); border-radius: 5px; margin: 0.1rem; width: 2.2rem; height: 1.7rem; cursor: pointer; } .asic-searchpage-pagination ul li:hover { background-color: var(--static-gray-3); } .asic-searchpage-search-dropdown-container { position: relative; grid-column-start: 2; } .asic-searchpage-search-dropdown { width: 100%; box-sizing: border-box; background-color: var(--static-gray-0); position: absolute; z-index: 2; padding: var(--asic-space-16); box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1607843137); border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; top: calc(var(--asic-space-12) * -1); } .asic-searchpage-search-dropdown-heading { display: flex; justify-content: space-between; } .asic-searchpage-results p { overflow-wrap: break-word; } .asic-searchpage-results .search-highlight { background-color: #B5E8EB; border-radius: 2px; } /* mobile css for search page */ @media (max-width: 1024px) { .asic-searchpage-tab-list { width: 100%; overflow-x: auto; white-space: nowrap; padding-bottom: 0.3rem; } } @media (max-width: 768px) { .asic-searchpage-tabs { margin: 0 !important; } .asic-searchpage-main { max-width: 100% !important; } .asic-searchpage-filter-summary { margin-right: 2rem; margin-left: 0; } #asic-search-result { padding: 0; } .asic-searchpage-search-divider { margin-left: 0; } .asic-accordion-title-searchpage { margin: 0; width: 95%; } } /* CSS for global search function */ .asic-global-search-modal { z-index: 999; position: absolute; top: 0; width: 100vw; /* height: 25; */ background-color: var(--static-gray-1); display: none; justify-content: center; align-items: center; border-bottom: 2px solid var(--asic-color-border); padding: 1rem 0rem 3rem 0rem; } .asic-global-search-modal .asic-textbox--search { width: 70vw; } .asic-searchpage-main .asic-global-search-history { margin: 0 !important; } .asic-global-search-history p { margin: 0 !important; padding-left: 1rem !important; padding-bottom: 0.5rem !important; padding-top: 0.5rem !important; } .asic-global-search-history p:hover { background-color: var(--static-gray-1); } @media (max-width: 768px) { .asic-global-search-modal { z-index: 999; } .asic-global-search-box { margin-left: 2rem; } .asic-global-search-modal .asic-global-search-recent { margin-top: 1rem; } .asic-global-search-history { max-width: 90vw; } .asic-global-search-topics { display: block !important; } .asic-global-topics-buttons { margin-top: 1rem !important; } } .asic-global-search-recent { margin-left: 3rem; } .asic-global-search-box input { background-color: white; color: black; } .asic-global-search-box input::placeholder { color: black !important; } .asic-global-search-close { display: flex; text-align: center; margin: auto; cursor: pointer; } .asic-global-search-history { margin-left: 3rem; margin-top: 0.5rem; margin-bottom: 2rem; } .asic-search-history-element { margin-right: 1rem; } .asic-global-search-clear { color: var(--asic-color-text-link); cursor: pointer; } .asic-global-search-topics { margin-left: 3rem; display: flex; max-width: 100vw; } .asic-global-search-topics button:hover { background-color: var(--static-gray-3); } .asic-global-search-topics button { color: black; } .asic-global-search-topics span { margin-right: 2rem; } .asic-searchpage-result-list .filter-tags { grid-area: tags; display: flex; flex-wrap: wrap; column-gap: 0.5rem; row-gap: 0.5rem; } #asic-search-result { list-style-type: none; padding: 0; } .asic-searchpage-results { position: relative; border-bottom: 1px solid var(--asic-color-border); padding: 1.5rem 0 1rem 0; } .asic-searchpage-results:first-child { border-top: 1px solid var(--asic-color-border); } #asic-search-result .asic-searchpage-results a { text-decoration: none; z-index: auto; } #asic-search-result .asic-searchpage-results a::after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } #asic-search-result .asic-searchpage-results h3 a { color: var(--asic-color-text); } #asic-search-result .asic-searchpage-results h3 a:hover { text-decoration: underline; } .asic-searchpage-filter-tags { display: inline-flex; column-gap: 0.5rem; row-gap: 0.5rem; flex-wrap: wrap; margin-top: 0.5rem; } /* .asic-searchpage-options { grid-column: 1 / span 2; } */ #asic-searchpage-current-filters .nh-list-tag { margin-bottom: 0; z-index: auto; } #asic-searchpage-current-filters .nh-list-tag[aria-pressed=true] { padding-right: 2rem; } #asic-searchpage-current-filters .nh-list-tag-clear:not(.link-style) { text-align: center; } @media (width >= 1350px) { body.search-results .asic-searchpage-hide-filter .asic-page { max-width: var(--asic-container-narrow-max) !important; } body.search-results .asic-header__inner { --asic-sidebar-width-searchpage: clamp(var(--asic-space-256), 23%, var(--asic-space-360)); grid-template-columns: var(--asic-sidebar-width-searchpage) minmax(0, 1fr); } } body.search-results .asic-page__sidebar { transition: opacity 0.3s linear; opacity: 1; } body.search-results .asic-searchpage-hide-filter .asic-page__sidebar { display: none; } @media (width > 768px) { body.search-results .asic-searchpage-hide-filter { --asic-sidebar-width: 0; } body.search-results .asic-searchpage-hide-filter .asic-page { column-gap: 0 !important; } body.search-results .asic-searchpage-hide-filter .asic-page__sidebar { display: block; visibility: hidden; opacity: 0; } } #asic-searchpage-newslatest .asic-card__media { width: 100%; height: auto; aspect-ratio: 2/1; object-fit: cover; overflow-clip-margin: unset; } .doc-badge { display: inline-flex; align-items: center; column-gap: 0.5rem; } .asic-search-pick-card { display: grid; position: relative; grid-template-columns: 1fr; grid-template-rows: auto auto; column-gap: 1.5rem; row-gap: 1rem; border-radius: 8px; padding: 1.5rem 1rem; background-color: var(--static-gray-1); margin-bottom: 2rem; } .asic-search-pick-card a[href^="#"]:after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .asic-search-pick-card img { max-width: 100%; max-height: 250px; aspect-ratio: 1/1; object-fit: cover; object-position: top; border-radius: 8px; filter: saturate(0); } .asic-search-pick-card p:last-child { margin-bottom: 0; } @media (width > 900px) { .asic-search-pick-card { row-gap: 0; } .asic-search-pick-card:has(img) { grid-template-columns: 30% auto; } .asic-search-pick-card:has(.asic-search-profiles-speeches) { grid-template-columns: auto 30%; } .asic-search-pick-card:has(img):has(.asic-search-profiles-speeches) { grid-template-columns: 25% auto 25%; } } .asic-search-pick-card:has(img):has(.asic-search-profiles-speeches) { padding: 1.5rem 1rem 1rem 1rem; } @media (width < 900px) { .asic-search-pick-card:has(img):has(.asic-search-profiles-speeches) { grid-template-columns: 1fr; } } .asic-search-profiles-speeches { padding-top: 1rem; border-top: 1px solid var(--asic-color-border); } .asic-search-profiles-speeches ul, .asic-search-profiles-speeches li { list-style-type: none; padding: 0; margin: 0; } .asic-search-profiles-speeches li { position: relative; padding-bottom: 1rem; border-bottom: 1px solid var(--asic-color-border); } .asic-search-profiles-speeches li .asic-search-profiles-speeches-heading { grid-area: heading; } .asic-search-profiles-speeches li:last-child { border-bottom: none; } .asic-search-profiles-speeches .asic-button { padding-left: 0; } .asic-search-profiles-speeches a:not(.asic-button) { text-decoration: none; color: var(--static-brand-granite); overflow-wrap: anywhere; } .asic-search-profiles-speeches a:not(.asic-button):hover, .asic-search-profiles-speeches a:not(.asic-button):focus { text-decoration: underline; } .asic-search-profiles-speeches a:not(.asic-button):after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } @media (width > 768px) { .asic-search-profiles-speeches { padding-top: 0; border-top: none; } } .asic-search-profiles-speeches-label { font: var(--asic-text-body-xsmall-shorthand); display: block; font-weight: 500; } .asic-search-pick-images { border-radius: 8px; padding: 1.5rem 1rem; background-color: var(--static-gray-1); display: grid; grid-template-rows: 1fr; grid-template-columns: repeat(2, 1fr); grid-column-gap: 1rem; grid-row-gap: 1rem; margin-bottom: 2rem; } .asic-search-pick-images > li { position: relative; grid-row: auto; display: grid; grid-template-columns: 1fr; align-content: start; } .asic-search-pick-images h3 { margin-top: 0.725rem; margin-bottom: 0; line-height: 1.1; } .asic-search-pick-images p { margin: 0; } .asic-search-pick-images img { border-radius: 8px; width: 100%; height: auto; aspect-ratio: 3/2; object-fit: cover; object-position: top; overflow-clip-margin: unset; } .asic-search-pick-images a:after { content: ""; position: absolute; inset: 0; } .asic-search-pick-see-more { justify-self: center; align-self: center; grid-column: span 2; } @media (width >= 600px) { .asic-search-pick-images { grid-template-columns: repeat(3, 1fr); } .asic-search-pick-images img { aspect-ratio: auto; } } @media (width >= 800px) { .asic-search-pick-images { grid-template-columns: repeat(5, 1fr); } .asic-search-pick-see-more { grid-column: span 1; } } @media (width >= 1024px) { .asic-search-pick-images { grid-template-columns: repeat(6, 1fr); } } #asic-searchpage-registersresults .asic-button, .asic-button--align-left .asic-button { justify-content: space-between; } #asic-searchpage-registersresults .asic-button .asic-search-register-title, .asic-button--align-left .asic-button .asic-search-register-title { width: 100%; text-align: left; } .asic-global-search-docs-container .asic-button { background-color: #e4e3e8; border: none; color: var(--asic-color-text); } .asic-global-search-docs-container .asic-button:hover { text-decoration: underline; } .asic-global-search-docs-container .asic-button--wrap { white-space: normal; block-size: unset; min-block-size: var(--asic-space-64); line-height: var(--asic-font-lineheight-dense); } .asic-label-blue { text-transform: uppercase; font: var(--asic-text-body-xsmall-shorthand); color: var(--static-brand-blue); } .asic-cover-link { position: relative; z-index: 1; } .asic-cover-link::after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .asic-search-page-search-container { display: grid; grid-template-columns: auto 1fr auto; column-gap: 1rem; row-gap: 1rem; } .asic-searchpage-container:has(#asic-searchpage-registersresults) { background-color: var(--static-gray-1); border-bottom: 1px solid var(--asic-color-border); padding: 0 1rem 1.5rem 1rem; } .asic-searchpage-container:has(#asic-searchpage-regresults) { background-color: var(--static-gray-1); padding: 0 1rem 1.5rem 1rem; } .asic-searchpage-container:has(#asic-searchpage-regresults) .asic-accordion { background-color: white; } .asic-searchpage-container:has(#asic-searchpage-newslatest) { background-color: var(--static-gray-1); padding: 1.5rem 1rem; border-bottom: 1px solid var(--asic-color-border); } .asic-searchpage-container:has(#asic-searchpage-newslatest) h3:first-of-type { margin-top: 0; } .asic-searchpage-container:has(#asic-searchpage-newslatest) .asic-card-grid { gap: var(--asic-space-12); } #asic-searchpage-newslatest { margin-bottom: 2rem; } #asic-searchpage-regresults .asic-accordion { border-top: none; } #asic-searchpage-regresults .nh-list-tag { font-size: 0.875em; background-color: var(--static-gray-4); } .asic-quick-pick-banner { width: 100%; } #asic-search-picks + #asic-best-bets { margin-top: 2rem; } #asic-best-bets { position: relative; } #asic-best-bets .asic-callout__title a { text-decoration: none; } #asic-best-bets .asic-callout__title a:hover { text-decoration: underline; } #asic-best-bets .asic-callout__title a:after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .scrollable-container { position: relative; } .scrollable { overflow-x: auto; } .scrollable ul { list-style-type: none; display: flex; flex-wrap: wrap; column-gap: 2rem; } .scrollable ul, .scrollable li { margin: 0; padding: 0; } .scrollable .scrollable-list-content { display: block; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137); border: 1px solid #efefef; border-radius: 5px; background: white; text-decoration: none; color: #222222; text-align: center; padding: 1rem; margin: 0; min-width: 193px; vertical-align: middle; } .scrollable .scrollable-list-content.scrollable-list-content-multi { display: flex; } .scrollable .scrollable-list-content[aria-current=true] { background-color: #0047f5; border-color: #0047f5; color: white; } .scrollable .scrollable-list { flex-wrap: initial; overflow-x: auto; padding: 1rem 0.5rem; margin-left: -0.5rem; scroll-snap-type: x mandatory; scroll-behavior: smooth; scroll-padding: 0.5rem; scrollbar-width: none; } .scrollable .scrollable-list::-webkit-scrollbar { display: none; } .scrollable .scrollable-list li { scroll-snap-align: start; min-width: auto; position: relative; } .scrollable.scrollable-arrow-icon .scrollable-list .scrollable-list-content:after { content: "⟶"; display: block; position: absolute; right: 1rem; bottom: 0; font-size: 1.75rem; } .scrollable.scrollable-no-padding .scrollable-list .scrollable-list-content { padding: 0; } .scrollable.scrollable-no-shadow .scrollable-list .scrollable-list-content { box-shadow: none; } .scrollable.scrollable-wrap .scrollable-list { flex-wrap: wrap; } .slider-buttons { margin: 0.2rem 0.3rem 1rem; display: block; position: absolute; top: -1.5rem; right: 0; } .slider-buttons button { color: #0772ce !important; border: solid 1px transparent !important; background-color: transparent !important; padding: 0.3rem 0.35rem !important; margin: 0; box-sizing: border-box; min-width: initial !important; } .slider-buttons button svg { width: 25px; height: 25px; display: block; } .slider-buttons button:hover svg, .slider-buttons button:focus svg { filter: invert(41%) sepia(86%) saturate(5429%) hue-rotate(194deg) brightness(90%) contrast(94%); } .slider-buttons button:disabled, .slider-buttons button:disabled:hover { cursor: default; } .slider-buttons button:disabled svg, .slider-buttons button:disabled:hover svg { filter: invert(0.9); } .slider-buttons.slider-buttons-big { top: -2.5rem; } .slider-buttons.slider-buttons-big svg { width: 2rem; height: 2rem; } .slider-buttons button:first-child svg { transform: scaleX(-1); } .slider-select-buttons { text-align: center; } .slider-select-buttons button { cursor: pointer; background-color: var(--static-gray-4); border: none; width: 2.1875rem; height: 0.75rem; padding: 0; margin-right: 0.5rem; } .slider-select-buttons button.selected { background-color: var(--static-brand-blue); } #filter-sort { justify-content: end; align-content: center; } .filter-list h2:not(:first-of-type) { margin-top: 4rem; } #nh-search-tags-container { display: flex; column-gap: 0.5rem; flex-wrap: wrap; row-gap: 0.5rem; } #filter-summary { display: grid; grid-template-columns: 1fr auto; align-items: start; margin-bottom: 2rem; } #filter-summary #filter-results-msg { margin-top: 0; } @media screen and (width <= 768px) { #filter-summary { grid-template-columns: auto; } } #filter-summary .nh-inline-tag-group { display: inline-flex; column-gap: 0.5rem; row-gap: 0.5rem; flex-wrap: wrap; margin-top: 0.5rem; } .search-container { width: 100%; margin-bottom: 2px; } .search-container .asic-field { grid-template-columns: auto 75px; } .search-container .asic-field label { grid-column: span 2; } .search-container .search-main-heading { margin: 0; font: var(--asic-text-body-shorthand); } .search-container #filter-search-input::placeholder { color: var(--static-gray-8); } .search-container[hidden] { display: none; } .search-container .nh-advanced-search { display: none; } .search-container.nh-advanced-search-visible .nh-advanced-search { border: var(--asic-border-width-thin) solid var(--asic-color-border-muted); display: block; padding: 0 1rem 2.5rem 1rem; background-color: white; } .search-container.nh-advanced-search-visible .nh-advanced-search .nh-advanced-search-buttons { margin-top: 1rem; } .search-container #btn-search span:last-child { clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; width: 1px; height: 1px; position: absolute; overflow: hidden; } @media (width > 768px) { .search-container #btn-search span:last-child { clip: unset; clip-path: unset; white-space: unset; width: unset; height: unset; position: unset; overflow: unset; } .search-container .asic-field { grid-template-columns: auto 120px; } } .filter-buttons { vertical-align: top; margin-bottom: 2rem; } .filter-buttons .filter-btn:first-child { margin-left: 0; } .filter-buttons .asic-button[aria-current=true], .filter-buttons .asic-button:active { background: var(--static-gray-3); border-color: var(--asic-color-border-emphasis); color: var(--asic-color-text); } .filter-list .search-container { margin-top: 2rem; } .filter-list .filter-search-location { display: none; } .filter-list ul, .filter-list li { list-style-type: none; padding: 0; margin: 0; } .filter-list .filter-search { margin-bottom: 2rem; } .filter-list .filter-results li { position: relative; display: grid; grid-template-columns: 1fr auto; grid-column-gap: 0.5rem; grid-row-gap: 1rem; grid-template-areas: "title title" "tags updated"; background-color: var(--static-gray-1); padding: 2rem; margin-bottom: 0.75rem; border: 1px solid var(--asic-color-border-muted); border-left: 0px; box-shadow: 8px 0px 0px 0px var(--static-brand-navy) inset; transition: box-shadow 200ms; /* span:last-child { display: block; grid-area: updated; @media (max-width: 500px) { margin-top: 1rem; } } */ } .filter-list .filter-results li:hover { background-color: var(--static-gray-2); box-shadow: 16px 0px 0px 0px var(--static-brand-navy) inset; } .filter-list .filter-results li.news, .filter-list .filter-results li.news-item { box-shadow: 8px 0px 0px 0px #83DADE inset; } .filter-list .filter-results li.news:hover, .filter-list .filter-results li.news-item:hover { box-shadow: 16px 0px 0px 0px #83DADE inset; } .filter-list .filter-results li.info, .filter-list .filter-results li.information-sheet { box-shadow: 8px 0px 0px 0px var(--static-brand-sky) inset; } .filter-list .filter-results li.info:hover, .filter-list .filter-results li.information-sheet:hover { box-shadow: 16px 0px 0px 0px var(--static-brand-sky) inset; } .filter-list .filter-results li.article { box-shadow: 8px 0px 0px 0px #3CB4E5 inset; } .filter-list .filter-results li.article:hover { box-shadow: 16px 0px 0px 0px #3CB4E5 inset; } .filter-list .filter-results li.rep, .filter-list .filter-results li.report { box-shadow: 8px 0px 0px 0px var(--static-brand-blue) inset; } .filter-list .filter-results li.rep:hover, .filter-list .filter-results li.report:hover { box-shadow: 16px 0px 0px 0px var(--static-brand-blue) inset; } .filter-list .filter-results li.speech { box-shadow: 8px 0px 0px 0px #C7CDD4 inset; } .filter-list .filter-results li.speech:hover { box-shadow: 16px 0px 0px 0px #C7CDD4 inset; } .filter-list .filter-results li.media-release { box-shadow: 8px 0px 0px 0px #0072CE inset; } .filter-list .filter-results li.media-release:hover { box-shadow: 16px 0px 0px 0px #0072CE inset; } .filter-list .filter-results li.instrument { box-shadow: 8px 0px 0px 0px #627D98 inset; } .filter-list .filter-results li.instrument:hover { box-shadow: 16px 0px 0px 0px #627D98 inset; } .filter-list .filter-results li.cp, .filter-list .filter-results li.consultation-paper { box-shadow: 8px 0px 0px 0px var(--static-brand-gold) inset; } .filter-list .filter-results li.cp:hover, .filter-list .filter-results li.consultation-paper:hover { box-shadow: 16px 0px 0px 0px var(--static-brand-gold) inset; } .filter-list .filter-results li.form { box-shadow: 8px 0px 0px 0px var(--static-brand-aqua) inset; } .filter-list .filter-results li.form:hover { box-shadow: 16px 0px 0px 0px var(--static-brand-aqua) inset; } .filter-list .filter-results li .filter-tags { grid-area: tags; display: flex; flex-wrap: wrap; column-gap: 0.5rem; row-gap: 0.5rem; } @media screen and (width <= 768px) { .filter-list .filter-results li { padding: 1rem 2rem 3rem 2rem; } } .filter-list .filter-results li a { grid-area: title; color: var(--asic-color-text); text-decoration: none; display: block; } .filter-list .filter-results li a::after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .nh-list-tag { cursor: pointer; display: inline-block; color: var(--asic-color-text); text-decoration: none; background-color: var(--static-gray-1); border-radius: 20px; border: solid 1px #c7cdd4; font-size: 0.75em; font-family: inherit; padding: 0.5em 1.2em; z-index: 2; position: relative; line-height: 1.5; } .nh-list-tag:hover { border-color: var(--asic-color-text-link); } .nh-list-tag[aria-pressed=true], .nh-list-tag.nh-list-tag-selected { background-color: #E0F1FF; } .nh-list-tag:has(.tag-cross) { padding-right: 2.5rem; } .nh-list-tag .tag-cross { display: inline-block; margin-left: 0.4rem; border-radius: 50%; border: solid 2px #E4E4E7; background: #fff; width: 1rem; height: 1rem; position: absolute; font-size: 1rem; line-height: 1; } /* for the instrument dropdown section */ .asic-split-button { display: flex; } .asic-split-button button:first-child { border-right-color: transparent; border-top-right-radius: 0; border-bottom-right-radius: 0; } .asic-split-button button:first-child:hover { border-right-color: var(--asic-color-text-link); } .asic-split-button button:last-child { border-top-left-radius: 0; border-bottom-left-radius: 0; } /* Instrument drop down accordion style */ .asic-accordion-instrument-button { /* width: 16rem; display: flex !important; justify-content: space-between; */ } .asic-accordion-instrument-content { width: 13.9rem; border: 0.1rem solid var(--asic-color-border); padding: 0 1rem 1rem 1rem; /* box-shadow: 0.1rem 0.2rem 0.1rem 0.2rem var(--static-gray-2); */ border-radius: 0.3rem; z-index: 9999; position: absolute; background-color: white; } .asic-accordion-instrument-apply { float: right; margin-top: 10px; width: 4rem; height: 2rem; font: var(--asic-text-body-small-shorthand); } .asic-instrument-buttons { display: flex; justify-content: space-between; margin-top: 1rem; position: relative; } .asic-instrument-buttons input[type=checkbox] { margin-top: 1rem; } .asic-instrument-buttons label { position: absolute; left: 0; top: -0.25rem; } /* Changed: New CSS added in */ .filter-list .filter-results .document-type-tag { display: inline-block !important; font-size: 14px; font-weight: 600; margin-bottom: 0.6rem; margin-right: 1rem; padding: 0.1rem 0.5rem 0.1rem 0.5rem; } .filter-list .filter-results .consultation-closed { display: inline-block; font-size: 14px; font-weight: 600; margin-bottom: 0.6rem; padding: 0.1rem 1rem 0.1rem 1rem; text-transform: uppercase; background: var(--static-gray-4); } .filter-list .filter-results .consultation-open { display: inline-block; font-size: 14px; font-weight: 600; margin-bottom: 0.6rem; padding: 0.1rem 1rem 0.1rem 1rem; text-transform: uppercase; background: var(--static-brand-blue); color: #fff; } .filter-list .filter-results .regulatory-tag { background: #E4EBF1; color: #253746; } .filter-list .filter-results .information-tag { background: #D2EEF9; color: #0E4E68; } .filter-list .filter-results .report-tag { background: #E0F1FF; color: #005AA3; } .filter-list .filter-results .form-tag { background: #CFF0F2; color: #0F3638; } .filter-list .filter-results .consultation-tag { background: #ECEAE4; color: #302C21; } .filter-list .filter-results .instrument-tag { background: #CAD4DD; color: #1D252D; } .filter-list .filter-results .media-tag { background: #E0F1FF; color: #005AA3; } .filter-list .filter-results .news-tag { background: #E7F8F9; color: #0F3638; } .filter-list .filter-results .article-tag { background: #D2EEF9; color: #0E4E68; } .filter-list .filter-results .speech-tag { background: #E8EAED; color: #23282E; } .filter-list .filter-date-span { font-size: 87%; position: absolute; right: 0; margin-right: 2rem; } @media screen and (width <= 768px) { .filter-list .filter-results .filter-date-span { bottom: 0; left: 2rem; padding-bottom: 1rem; } } .filter-buttons .asic-button { border-color: var(--asic-color-border); color: black; border-width: 1.5px; padding-inline: var(--asic-space-16); } .filter-buttons .asic-button:hover { border-color: var(--asic-color-text-link); } .filter-buttons .asic-accordion-instrument-apply { color: white; } .filter-buttons .asic-instrument-filter-icon:hover { border-color: var(--asic-color-text-link); } .filter-load-more-container { text-align: center; margin-top: 1.5rem; } .form .asic-page__article h2 { color: var(--static-brand-blue); } .form .asic-page__article h2 { margin-bottom: calc(var(--asic-space-12) * -1); } .form .asic-page__article h2:has(+ .accordion) { margin-bottom: revert; } .form .asic-page__article h2:has(+ .accordion-expand) { margin-bottom: calc(var(--asic-space-12) * -1); } .asic-mainnav__buttons { display: flex; align-items: center; } .dialog-container, .dialog-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; } .dialog-container { z-index: 9999; /* Same as nav */ display: flex; padding: 1em; margin: 0 auto !important; font-size: 14px; } .dialog-container button { cursor: pointer; } .dialog-container[aria-hidden=true] { display: none !important; } .dialog-overlay { background-color: rgba(43, 46, 56, 0.9); } .dialog-content { margin: auto; z-index: 2; position: relative; background-color: white; } .dialog-content { max-height: 90vh; overscroll-behavior: contain; } @keyframes fade-in { from { opacity: 0; } } @keyframes slide-up { from { transform: translateY(10%); } } .dialog-animation .dialog-overlay { animation: fade-in 200ms both; } .dialog-animation .dialog-content { animation: fade-in 400ms 200ms both, slide-up 400ms 200ms both; } @keyframes slide-left { from { transform: translateX(15%); } } @keyframes slide-right { from { transform: translateX(-15%); } } .dialog-animation-menu .dialog-overlay { animation: fade-in 200ms both; } .dialog-animation-menu .dialog-content { animation: fade-in 400ms 200ms both, slide-right 400ms 200ms both; } @media (prefers-reduced-motion: reduce) { .dialog-animation .dialog-overlay, .dialog-animation .dialog-content { animation: none; } } .dialog-container .dialog-close { position: absolute; top: 0.9em; right: 1em; padding: 0.25em; background-color: transparent; color: white; font-size: 1.5em; width: 1.5em; height: 1.5em; text-align: center; cursor: pointer; transition: 0.15s; border-radius: 50%; border: solid 1px rgba(255, 255, 255, 0.5); z-index: 1; } .dialog-close:hover, .dialog-close:focus { background-color: rgba(255, 255, 255, 0.2); } .portals-dialog-header { background-color: var(--static-brand-blue); color: white; font-size: 1.4em; font-weight: bold; padding: 1em; } .portals-dialog-header .dialog-icon { padding-left: 3em; } .portals-dialog-header .dialog-icon:before { content: ""; position: absolute; width: 40px; height: 40px; top: 0.75em; left: 1em; background-size: contain; background-repeat: no-repeat; background-position-y: center; } .portals-dialog-header .dialog-icon.icon-asic-portals:before { background-image: url("data:image/svg+xml,%3Csvg fill='%23ffffff' viewBox='0 0 56 56' xmlns='http://www.w3.org/2000/svg' stroke='%23ffffff'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath d='M 27.9999 51.9063 C 41.0546 51.9063 51.9063 41.0781 51.9063 28 C 51.9063 14.9453 41.0312 4.0937 27.9765 4.0937 C 14.8983 4.0937 4.0937 14.9453 4.0937 28 C 4.0937 41.0781 14.9218 51.9063 27.9999 51.9063 Z M 27.9999 14.5 C 32.4765 14.5 36.0390 18.4375 36.0390 23.1719 C 36.0390 28.2109 32.4999 32.0547 27.9999 32.0078 C 23.4765 31.9609 19.9609 28.2109 19.9609 23.1719 C 19.9140 18.4375 23.4999 14.5 27.9999 14.5 Z M 42.2499 41.8750 L 42.3202 42.1797 C 38.7109 46.0234 33.3671 48.2266 27.9999 48.2266 C 22.6093 48.2266 17.2655 46.0234 13.6562 42.1797 L 13.7265 41.8750 C 15.7655 39.0625 20.7812 35.9922 27.9999 35.9922 C 35.1952 35.9922 40.2343 39.0625 42.2499 41.8750 Z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E"); } .asic-portal-mobile-smallbanner { margin: 1rem 0 0 1.4rem; font-weight: var(--asic-font-weight-bold); font-size: 1.125rem; } #portals .asic-field__label { font-weight: var(--asic-font-weight-semibold); } #portals.dialog-container { padding: 0; } @media (width > 1024px) { #portals.dialog-container { padding: 1em; } } #portals .dialog-content { width: 100%; height: 100%; max-height: 100%; overflow: auto; } @media (width > 900px) { #portals .dialog-content { max-width: 1600px; max-height: 98%; height: 90%; } } #portals .portal-tab-content { margin-block: 3rem; max-width: 50ch; } #portals .portal-tab-content .asic-button:first-of-type { margin-top: 3rem; } #portals .portal-tab-content .portal-button-collection { margin-top: 3rem; display: flex; } #portals .portal-tab-content .portal-button-collection .asic-button:first-of-type { margin-top: 0; } #portals .portal-tab-content .portal-button-collection > div .asic-text-body-xsmall { display: block; margin-bottom: 0.5rem; } #portals .portal-tab-content .portal-button-collection > div:not(:first-child) { border-left: var(--asic-border-width-thin) solid var(--asic-color-border); margin-left: 1rem; padding-left: 1rem; } #portals .portal-tab-content .portal-button-collection .asic-button--tertiary { padding-inline-start: 0; } #portals .asic-accordion { --padding-y: var(--asic-space-16); } @media (width < 900px) { #portals .asic-accordion { --padding-y: var(--asic-space-16); } } #portals details.asic-accordion__item[open] summary { font-weight: 600; } #portals .asic-accordion__item .asic-tabs__panel { background-color: var(--static-gray-2); } @media (min-width: 900px) { #portals details.asic-accordion__item { text-align: left; margin-bottom: 0rem; border: none; background-color: var(--static-gray-3); } #portals details.asic-accordion__item[open] { display: flex; grid-template-columns: 1fr auto; align-items: start; } #portals details.asic-accordion__item[open] .asic-tabs__panel { position: absolute; margin-top: 12rem; background-color: white; padding: 0; margin-left: 3.5rem; margin-right: 3.5rem; font-size: 16px; width: stretch; } #portals details.asic-accordion__item[open] .asic-tabs__panel .portal-tab-content > p { margin-top: 3rem; } #portals summary { width: 43vw; border-bottom: 2px solid var(--asic-color-border); display: flex; justify-content: flex-end; text-align: right; } #portals summary:hover { text-decoration: underline; } #portals details.asic-accordion__item[open] summary { background-color: var(--static-gray-0); text-align: right; } #portals details.asic-accordion__item[open] .asic-portal-hidden { display: block !important; text-align: left; width: 9.5rem; } #portals details.asic-accordion__item[open] summary span::after { content: ""; display: inline-block; vertical-align: middle; border-top: 0.6em solid transparent; border-bottom: 0.6em solid transparent; border-left: 0.6em solid var(--static-brand-blue); left: -0.6rem; margin-right: 0; margin-left: 3rem; } #portals .asic-accordion__title::after { content: ""; font: var(--asic-icon-font); width: 0; overflow: hidden; } #portals .asic-accordion__item .asic-tabs__panel { top: 0; } #portals .asic-accordion { background-color: var(--static-gray-0); display: flex; } #portals .asic-details-column { padding-top: 6rem; padding-bottom: 6rem; background-color: var(--static-gray-3); } #portals .asic-accordion .asic-smallbanner-title { margin-top: 5rem; display: none; } } #portals details.asic-accordion__item.asic-accordion__item-dark { background-color: var(--static-brand-granite); } #portals details.asic-accordion__item.asic-accordion__item-dark .asic-accordion__title { color: white; } #portals details.asic-accordion__item.asic-accordion__item-dark[open] summary { background-color: var(--static-brand-granite); } #portals details.asic-accordion__item.asic-accordion__item-dark[open] summary span::after { border-left-color: white; } @media (min-width: 2000px) { #portals summary { width: 30vw; } } @media (min-width: 3000px) { #portals summary { width: 20vw; } } #portals summary { font-weight: 400; } @media (min-width: 900px) { #portals .dialog-content { height: auto; } #portals summary { height: 4vh; } } #portals .asic-portal-hidden { display: none; margin-right: auto; } #portals .select-portal { text-overflow: ellipsis; width: 99%; } /* UNCOMMENT WHEN NEW PORTALS CODE IS LIVE @media (min-width: 962px) { #portals details.asic-accordion__item { text-align: left; margin-bottom: 0rem; border: none; } #portals details.asic-accordion__item[open] { display: flex; grid-template-columns: 1fr auto; align-items: start; } #portals details.asic-accordion__item[open] .asic-tabs__panel { position: absolute; margin-top: 12rem; background-color: white; padding: 0; max-width: 400px; margin-left: 4.5rem; font-size: 16px; } #portals details.asic-accordion__item[open] .asic-tabs__panel .portal-tab-content> p { margin-top: 3rem; margin-bottom: 4rem; } #portals summary { width: 43vw; background-color: var(--static-gray-3); border-bottom: 2px solid var(--asic-color-border); padding: 0 0 0 2rem; height: 9.2vh; display: flex; justify-content: flex-end; } #portals summary:hover { text-decoration: underline; } #portals details:last-child summary { border-bottom: 3rem solid var(--static-gray-3) !important; } #portals details:first-child summary { border-top: 3rem solid var(--static-gray-3) !important; } #portals details.asic-accordion__item[open] summary { background-color: var(--static-gray-0); font-weight: 600; text-align: right; } #portals details.asic-accordion__item[open] .asic-portal-hidden { display: block !important; text-align: left; } #portals details.asic-accordion__item[open] summary span::after { content: ""; display: inline-block; vertical-align: middle; border-top: 0.6em solid transparent; border-bottom: 0.6em solid transparent; border-left: 0.6em solid var(--static-brand-blue); left: -0.6rem; margin-right: 2rem; margin-left: 1rem; } #portals .asic-accordion__title:after { content: ""; font: var(--asic-icon-font); width: 1em; overflow: hidden; } #portals .asic-accordion__item .asic-tabs__panel { top: 0; } #portals .asic-accordion { background-color: var(--static-gray-0); display: flex; } #portals .asic-accordion .asic-smallbanner-title { margin-top: 5rem; display: none; } } #portals .asic-portal-hidden { display: none; margin-right: auto; } */ .lodgement-dialog-header { background-color: var(--static-brand-blue); color: white; font-size: 1.4rem; font-weight: bold; padding: 1.25rem 1rem; } .lodgement-dialog-header.lodgement-dialog-header-dark { background-color: var(--static-brand-granite); } .lodgement-dialog-header.lodgement-dialog-header-light { background-color: var(--blue-light); color: var(--static-brand-granite); } .lodgement-dialog-header.lodgement-dialog-header-gold { background-color: var(--gold); color: var(--static-brand-granite); } .lodgement-dialog-header .dialog-icon { padding-left: 4rem; } .lodgement-dialog-header .dialog-icon:before { content: ""; position: absolute; width: 40px; height: 40px; top: 1.1rem; left: 1rem; background-size: contain; background-repeat: no-repeat; background-position-y: center; } .lodgement-dialog-header .dialog-icon.icon-asic-connect:before { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icons/icon-asic-connect.svg); } .lodgement-dialog-header .dialog-icon.icon-regulatory-portal:before { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icons/icon-regulatory-portal.svg); } .lodgement-dialog-header .dialog-icon.icon-contact-us:before { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icons/icon-contact-us.svg); } .lodgement-dialog-header .dialog-icon.icon-online-services:before { background-image: url(https://download.asic.gov.au/asic-nextgen/img/icons/icon-online-services.svg); } .lodgement-dialog-content { display: grid; grid-template-rows: 1fr; grid-template-columns: 1fr; background-color: white; } @media (width > 1024px) { .lodgement-dialog-content { grid-template-columns: repeat(3, 1fr); grid-column-gap: 0.5rem; } } .lodgement-dialog-content > div { display: flex; flex-direction: column; justify-content: space-between; min-height: 310px; background-color: #efeff1; position: relative; } .lodgement-dialog-content > div:nth-last-child(-n+3) { min-height: 370px; } .lodgement-dialog-content .asic-connect-heading { font-size: 1.4rem; font-weight: bold; padding: 0 2rem; height: 35%; display: flex; align-items: center; } .lodgement-dialog-content .asic-connect-content { padding: 0 2rem; font-size: 0.9rem; height: 40%; } .lodgement-dialog-content .lodgement-content { padding: 0 2rem; font-size: 0.9rem; height: 40%; } .lodgement-dialog-content .asic-connect-buttons { padding: 0 2rem; height: 25%; } .lodgement-dialog-content .asic-connect-buttons > a:first-of-type { margin-right: 2rem; } .lodgement-dialog-content .lodgement-buttons { padding: 0 2rem; height: 25%; } .lodgement-dialog-content .lodgement-buttons > a:first-of-type { margin-right: 2rem; } .lodgement-dialog-content .asic-connect-divider { display: none; } @media (width > 1024px) { .lodgement-dialog-content .asic-connect-divider { display: block; min-height: auto; height: 0.5rem; background-color: black; grid-column: 1/span 3; } } .lodgement-dialog-content ul { height: 74%; margin: 0; } #lodgement { max-width: 1360px; } #lodgement .lodgement-dialog-content-desktop { display: block; } #lodgement .lodgement-dialog-content-mobile { display: none; } @media (width <= 1024px) { #lodgement { padding: 0; } #lodgement .lodgement-dialog-content-mobile { display: block; } #lodgement .lodgement-dialog-content-mobile ul { padding: 1rem 2rem; } #lodgement .lodgement-dialog-content-desktop { display: none; } #lodgement .lodgement-dialog-content > div { min-height: auto; } #lodgement .lodgement-dialog-content ul { padding: 1rem 2rem; } #lodgement .lodgement-content { padding: 1rem; height: auto; } #lodgement .lodgement-buttons { padding: 1rem 1rem 2rem 1rem; height: auto; } #lodgement .dialog-content { width: 100%; height: 100vh; max-height: none; overflow: auto; } } #nr-search { width: 100%; padding: 0; display: block; } #nr-search .dialog-content { width: 100%; max-height: none; height: 100vh; background-color: #FAFAFA; overflow: auto; } @media (width > 1024px) { #nr-search .dialog-content { height: auto; } } #nr-search .nr-dialog-content { padding: 2rem var(--content-padding-lr); margin: 0 auto; max-width: calc(var(--content-max-width) + var(--content-padding-lr) * 2); background-color: #FAFAFA; } #nr-search .nr-dialog-header { background-color: var(--static-brand-blue); color: white; font-size: 1.5rem; font-weight: bold; padding: 1.25rem 1rem; } #nr-search .nr-dialog-header > div { padding: 0 var(--content-padding-lr); margin: 0 auto; max-width: calc(var(--content-max-width) + var(--content-padding-lr) * 2); } #nr-search #nr-search-input { width: 100%; background-color: white; padding: 0.65rem 1rem 0.5rem; font-size: 1rem; border: 1px solid #e4e4e7; line-height: 1; font-family: inherit; box-sizing: border-box; } #nr-search .twocol { display: flex; margin: 2rem 0; } #nr-search .twocol h3 { font-weight: bold; width: 7rem; margin: 0; font-size: 1.125rem; } #nr-search .twocol > div { width: calc(100% - 7rem); } @media screen and (width <= 450px) { #nr-search .twocol { display: block; } #nr-search .twocol h3 { margin: 0 0 1rem; } #nr-search .twocol > div { width: 100%; } } #nr-search .nr-advanced-search-buttons button { background: transparent; border: solid 1px #707070; display: inline-block; padding: 0.5rem 1.5rem; margin: 0 0.2rem 1rem 0.2rem; font-size: 1rem; font-family: inherit; border-radius: 24px; text-decoration: none; } #nr-search .nr-advanced-search-buttons button#nr-btn-go { color: #fff; background: var(--static-brand-blue); } #menuDialog .dialog-close { top: 1.4rem; } #menuDialog :has(.nav-dialog-title) .dialog-close { top: 0.7rem; } #menuDialog .dialog-content { background-color: white; position: fixed; top: 0; left: 0; bottom: 0; max-height: none !important; width: 100%; max-width: 320px; } #menuDialog .dialog-content .dialog-search-container { display: flex; width: calc(100% - 2rem); border: 1px solid #e4e4e7; border-radius: 5px; margin: 0 1rem; background-color: white; } #menuDialog .dialog-content .dialog-search-container .asic-search { width: calc(100% - 2rem); background-color: transparent; border: none; padding: 0.65rem 1rem 0.5rem; font-size: 1rem; line-height: 1; font-family: inherit; } #menuDialog .dialog-content .dialog-search-container .asic-search:focus-visible { outline: none; } #menuDialog .dialog-content .dialog-search-container #btn-dialog-search { background-color: transparent; border: none; } #menuDialog .dialog-content .dialog-search-container #btn-dialog-search svg { width: 1rem; height: auto; } #menuDialog .dialog-content ul { list-style-type: none; } #menuDialog .dialog-content ul, #menuDialog .dialog-content li { margin: 0; padding: 0; position: relative; } #menuDialog .dialog-content li :after { content: ""; position: absolute; width: 0.5rem; height: 0.5rem; border-right: solid 2px var(--static-brand-granite); border-top: solid 2px var(--static-brand-granite); transform: rotate(45deg); top: calc(50% - 0.1rem); right: 1.5rem; } #menuDialog .dialog-content li.current a { font-weight: bold; } #menuDialog .dialog-content a { color: var(--static-brand-granite); text-decoration: none; font-size: 1.125rem; padding: 1rem 2rem 0.5rem 1rem; display: block; border-bottom: 1px solid #e4e4e7; margin-left: 1rem; } #menuDialog h1, #menuDialog .nav-dialog-title { background-color: var(--static-brand-granite); color: #FAFAFA; padding: 1rem 2rem; width: 100%; font-weight: 100; margin-top: 0; box-shadow: 0px 1px 8px rgba(0, 0, 0, 0.2); box-sizing: border-box; } /************** GALLERY DIALOG ***************/ .gallery .dialog-overlay { background-color: rgba(33, 33, 36, 0.95); } .gallery .dialog-content { max-height: calc(95svh + 2px); max-width: calc(100vw - 12rem); box-shadow: 0 4px 24px 1px rgba(0, 0, 0, 0.5); } @media screen and (width <= 768px) { .gallery .dialog-content { max-width: calc(100vw - 6rem); } } .gallery .dialog-close, .gallery .dialog-download, .gallery .gallery-previous, .gallery .gallery-next { position: fixed; } .gallery .dialog-close { background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2223%22 height=%2223%22 viewBox=%220 0 23 23%22%3E %3Cpath fill-opacity=%22.51%22 d=%22M19.65 0a.436.436 0 0 0-.282.125l-8.031 8L3.493.282C3.336.125 3.103.109 2.962.25L.274 2.938c-.14.141-.125.375.032.531l7.843 7.844-8.021 8.021c-.157.157-.172.422-.031.563l2.687 2.656c.141.141.375.126.532-.031l8.02-8.021 8.21 8.208c.156.157.39.173.531.032l2.688-2.688c.14-.14.125-.374-.032-.531l-8.209-8.209 8.032-8.031c.156-.157.172-.39.03-.531L19.9.094a.311.311 0 0 0-.25-.093z%22/%3E %3Cpath fill=%22%23fff%22 d=%22M19.65.657a.32.32 0 0 0-.22.093l-8.093 8.094L3.43.938a.316.316 0 0 0-.438 0L1.306 2.625a.316.316 0 0 0 0 .438l7.906 7.906-8.094 8.094a.316.316 0 0 0 0 .437l1.719 1.688a.278.278 0 0 0 .406 0l8.094-8.094 8.281 8.281c.118.118.32.118.438 0l1.687-1.718a.278.278 0 0 0 0-.407l-8.281-8.28 8.094-8.095a.316.316 0 0 0 0-.437L19.868.75a.32.32 0 0 0-.219-.093z%22/%3E %3C/svg%3E") no-repeat center center transparent; border: none; top: 2rem; } .gallery .dialog-download { background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M3 15C3 17.8284 3 19.2426 3.87868 20.1213C4.75736 21 6.17157 21 9 21H15C17.8284 21 19.2426 21 20.1213 20.1213C21 19.2426 21 17.8284 21 15' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M12 3V16M12 16L16 11.625M12 16L8 11.625' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E%3C/svg%3E") no-repeat center center transparent; border: none; top: 5rem; } .gallery .gallery-previous, .gallery .gallery-next { position: fixed; top: 0; height: 100%; background-color: transparent; border: none; } .gallery .gallery-previous span, .gallery .gallery-next span { display: block; width: 80px; height: 120px; background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2226%22 height=%2240%22 viewBox=%220 0 26 40%22%3E %3Cpath fill-opacity=%22.51%22 d=%22M6 .007a.403.403 0 0 0-.281.125L.656 5.226a.395.395 0 0 0 0 .563l14.188 14.218L.656 34.227a.395.395 0 0 0 0 .562l5.063 5.093a.434.434 0 0 0 .593 0l14.47-14.5 5.093-5.093a.403.403 0 0 0 .125-.282.433.433 0 0 0-.031-.156.392.392 0 0 0-.094-.125l-5.094-5.094L6.313.132A.478.478 0 0 0 6 .007z%22/%3E %3Cpath fill=%22%23fff%22 d=%22M6 .695c-.077 0-.129.004-.188.062L1.97 4.601a.278.278 0 0 0 0 .406L16.28 19.29 1.344 34.226a.395.395 0 0 0 0 .563l3.687 3.656a.395.395 0 0 0 .563 0L20.719 23.32l3.75-3.75c.022-.022.046-.037.062-.063.017-.017.02-.042.031-.062.004-.009-.003-.022 0-.031.039-.08.036-.139 0-.219-.008-.02.013-.045 0-.062-.005-.014-.024-.019-.03-.032l-.063-.093-3.688-3.657L6.22.758C6.159.698 6.077.695 6 .695z%22/%3E %3C/svg%3E") no-repeat center center transparent; } @media screen and (width <= 768px) { .gallery .gallery-previous span, .gallery .gallery-next span { width: 40px; height: 60px; } } .gallery .gallery-previous { left: 0; } @media screen and (width <= 768px) { .gallery .gallery-previous { left: -0.25rem; } } .gallery .gallery-previous span { transform: scaleX(-1); } .gallery .gallery-next { right: 0; } @media screen and (width <= 768px) { .gallery .gallery-next { right: -0.25rem; } } .gallery .gallery-desc { padding: 1rem 1.5rem; max-width: 90ch; } .gallery .gallery-image { background-color: black; } .gallery .gallery-image.nh-gallery-border { border: 1px solid #69696b; box-sizing: border-box; } .gallery .gallery-image img, .gallery .gallery-image iframe { display: block; margin: 0 auto; max-height: calc(95svh - 6rem); max-width: 100%; } .gallery .gallery-image img[hidden], .gallery .gallery-image iframe[hidden] { display: none; } .gallery .gallery-download a { position: absolute; right: 1.25rem; padding: 0.25em; color: white; font-size: 1.15em; width: 1.5em; height: 1.5em; text-align: center; cursor: pointer; transition: 0.15s; border-radius: 50%; z-index: 1; background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M3 15C3 17.8284 3 19.2426 3.87868 20.1213C4.75736 21 6.17157 21 9 21H15C17.8284 21 19.2426 21 20.1213 20.1213C21 19.2426 21 17.8284 21 15' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M12 3V16M12 16L16 11.625M12 16L8 11.625' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E%3C/svg%3E") no-repeat center center transparent; border: none; top: 5rem; } /* Search popup */ #searchDialog { top: var(--asic-content-gutter); max-width: 1200px; } #searchDialog .dialog-content { margin: 0 auto; height: fit-content; border-radius: 1rem; overflow: hidden; } #searchDialog .search-dialog-header { background-color: transparent; border-bottom: 1px solid var(--asic-color-border); } #searchDialog .search-dialog-header .asic-global-search-input input { border: none; width: 100%; padding-right: 0; margin-right: 5rem; } #searchDialog .search-dialog-header-basic { border-bottom: none; } #searchDialog .dialog-close { background-color: var(--static-gray-4); color: var(--asic-color-text); top: 0.6rem; right: 1.5rem; } #searchDialog .dialog-close:hover, #searchDialog .dialog-close:focus { border-color: #007fe5; } #searchDialog .asic-card-grid { grid-auto-flow: column; } /* Split screen dialog eg for speaker bios */ .dialog-split { height: 90vh; font-size: initial; width: 100%; max-width: var(--asic-container-max); background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 50%, var(--static-gray-3) 50%, var(--static-gray-3) 100%); overflow: auto; } .dialog-split .dialog-close { color: var(--static-brand-granite); border-color: var(--static-brand-granite); } .dialog-split #split-image { margin-bottom: 1rem; } .dialog-split #split-image img { max-width: 280px; height: auto; filter: saturate(0); } .dialog-split #split-image-mob { display: none; } .dialog-split #split-image-mob img { max-width: 270px; height: auto; filter: saturate(0); } @media screen and (max-width: 650px) { .dialog-split #split-image { display: none; } .dialog-split #split-image-mob { display: block; padding: 1rem 1rem 0 1rem; margin-bottom: 0; } } .dialog-split .split-content { display: flex; } .dialog-split .split-content .split-col { width: 50%; padding: 3rem 3rem 0 3rem; box-sizing: border-box; } .dialog-split .split-content .split-col:first-child p { max-width: 51ch; } .dialog-split .split-content .split-col:last-child { background-color: var(--static-gray-3); } .dialog-split .split-content .split-col:last-child h2, .dialog-split .split-content .split-col:last-child p { max-width: 37rem; } .dialog-split .split-content .nav-col { padding: 1rem 3rem; } .dialog-split .split-content .nav-col:last-child { text-align: right; } @media (width > 767px) { .dialog-split .split-content .split-about:has(.nav-content) { overflow: auto; height: 81vh; } } .dialog-split .split-content h1 { margin: 0; font-size: 2rem; } .dialog-split .split-content h2 { color: var(--static-brand-blue); font-size: 1.8rem; font-weight: 600; line-height: 1; margin-bottom: 0; text-transform: uppercase; } .dialog-split .split-content h2::after { display: none; } .dialog-split .split-content img#split-img { max-width: 300px; width: 80%; height: auto; margin-bottom: 1.5rem; } .dialog-split .split-content #dialog-title { line-height: 1; } @media screen and (max-width: 650px) { .dialog-split .split-content #dialog-title { max-width: calc(100% - 1.25em); } } @media screen and (max-width: 650px) { .dialog-split .split-content .split-col { padding: 1rem; } .dialog-split .split-content .split-col:not(.split-about) { position: sticky; top: 0; background-color: white; } .dialog-split .split-content h2 { margin-top: 0.5rem; display: none; } .dialog-split .dialog-close { position: sticky; left: calc(100% - 2em); top: 0.75rem; background-color: white; } } @media screen and (max-width: 650px) { .dialog-split { /* Single column */ background: white; } .dialog-split .split-content { flex-direction: column; margin-top: -2.25rem; } .dialog-split .split-content.nav-content { flex-direction: row; } .dialog-split .split-content .split-col { width: 100%; } .dialog-split .split-content .split-col.nav-col { width: 50%; background-color: var(--static-gray-3); padding: 0; } .dialog-split .split-content .split-about { min-height: initial; padding-bottom: 4.2rem; } .dialog-split .dialog-close { color: var(--static-brand-granite); border-color: var(--static-brand-granite); } .dialog-split button.split-previous { color: white; width: 100%; text-align: left; } .dialog-split button.split-next { color: white; width: 100%; text-align: right; } } .dialog-split button.split-next, .dialog-split button.split-previous { background-color: transparent; border: solid 1px transparent; font-size: 2rem; color: var(--static-brand-granite); cursor: pointer; } .page-home .asic-feedback-banner { display: none; } .asic-footer-custom { color: var(--static-gray-3); overflow-y: hidden; position: relative; z-index: 4; /* FEEDBACK BANNER */ } @media screen and (width > 1024px) { .asic-footer-custom { padding: 5rem 0 0; } .asic-footer-custom:has(.asic-feedback-banner) { padding-top: 0; } .asic-footer-custom:has(.asic-feedback-banner) > .asic-container { padding-top: 5rem; } .asic-footer-custom:has(.asic-feedback-banner) > .asic-container ~ .asic-container { padding-top: 0; } } .asic-footer-custom .asic-footer-custom-heading { font-weight: var(--asic-font-weight-semibold); font-size: var(--asic-text-body-shorthand); } .asic-footer-custom .asic-footer-custom-list { font-size: var(--asic-text-body-small-size); list-style-type: none; padding: 0; margin: 0; } .asic-footer-custom .asic-footer-copyright { font-size: var(--asic-text-body-small-size); color: var(--static-gray-6); } .asic-footer-custom a { text-decoration: none; color: var(--static-gray-3); } .asic-footer-custom a:hover { text-decoration: underline; } .asic-footer-custom .asic-container { position: relative; z-index: 2; } .asic-footer-custom .footer-links > div { padding-block: var(--asic-space-16); border-bottom: 1px solid #464646; } @media screen and (width > 1024px) { .asic-footer-custom .footer-links { display: grid; grid-template-rows: 1fr; grid-template-columns: 1fr 1fr 1.15fr 0.85fr 1fr; } .asic-footer-custom .footer-links .asic-footer-custom-heading { margin-top: 0; } .asic-footer-custom .footer-links > div { padding: 0 1.5rem 0 1.5rem; border-right: solid 1px rgba(255, 255, 255, 0.2); border-bottom: none; } .asic-footer-custom .footer-links > div:first-child { padding-left: 0; } .asic-footer-custom .footer-links > div:last-child { border-right: none; padding-right: 0; } } .asic-footer-custom .footer-links li { margin-block: var(--asic-space-8); } .asic-footer-custom .general-links .asic-footer-custom-list { display: flex; flex-wrap: wrap; column-gap: 1rem; row-gap: 0.5rem; } .asic-footer-custom .general-links li { display: inline-block; line-height: 1; position: relative; } .asic-footer-custom .general-links li:not(:last-child):after { content: ""; background-color: rgba(255, 255, 255, 0.5); position: absolute; right: -0.5rem; width: 0.01rem; height: 0.9rem; } @media screen and (width > 1024px) { .asic-footer-custom .general-links .asic-footer-custom-list { column-gap: 2rem; } .asic-footer-custom .general-links li { margin-block: var(--asic-space-8); } .asic-footer-custom .general-links li:not(:last-child):after { right: -1rem; } } .asic-footer-custom .asic-feedback-banner { padding-bottom: 2.5rem; padding-top: 2rem; background-color: #f1f9ff; border-top: 1px solid var(--static-gray-3); } .asic-footer-custom .asic-feedback-banner .asic-container { display: flex; align-items: center; flex-wrap: wrap; } .asic-footer-custom .asic-feedback-banner .asic-feedback-header { font-weight: var(--asic-font-weight-bold); display: inline; color: var(--static-gray-9); margin-right: 1rem; } .asic-footer-custom .asic-feedback-banner .asic-yes-button { margin-right: 0.25rem; } .asic-footer-custom .asic-feedback-banner .asic-button { border: 1.5px solid var(--asic-color-border); background-color: white; color: black; } .asic-footer-custom .asic-feedback-banner .asic-button:hover { border-color: var(--static-brand-blue); } .asic-footer-custom .asic-feedback-banner .active { background-color: var(--static-brand-blue); color: white; } .asic-footer-custom .asic-feedback-banner .active .asic-icon { color: white !important; } .asic-footer-custom .asic-feedback-banner .asic-button .asic-icon { color: var(--static-brand-blue); } .asic-footer-custom .asic-feedback-dropdown[data-hidden=true] { display: none; } .asic-footer-custom .asic-feedback-dropdown[data-hidden=false] { display: block; } .asic-footer-custom .asic-feedback-banner .asic-feedback-dropdown { flex-basis: 100%; } .asic-footer-custom .asic-feedback-banner .asic-feedback-dropdown a:hover { text-decoration: none; } .asic-footer-custom .asic-feedback-banner .asic-feedback-dropdown p { font-weight: var(--asic-font-weight-semibold); font-size: small; color: var(--static-gray-9); margin-top: 0; } .asic-footer-custom .asic-feedback-banner .asic-feedback-dropdown button { background-color: white; border: 1px solid var(--asic-color-border); border-radius: 0.3rem; height: 2.3rem; width: 8rem; font-weight: bold; color: var(--static-gray-9); } .asic-footer-custom .asic-feedback-banner .asic-feedback-dropdown button:hover { background-color: var(--static-gray-3); } .asic-footer-custom .asic-feedback-banner .asic-feedback-short-survey { flex-basis: 100%; color: var(--static-gray-9); font-weight: 500; } .asic-footer-custom .asic-feedback-banner .asic-feedback-short-survey .asic-textlink { color: #0072ce; font-weight: 500; } .follow-links { padding-block: var(--asic-space-16); } .follow-links ul { margin: 0; padding: 0; list-style-type: none; } .follow-links li { margin-block: var(--asic-space-16); } .follow-links li a { padding-left: 2rem; } .follow-links li a.icon-twitter { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ffffff' d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/%3E%3C/svg%3E") no-repeat left center/contain; } .follow-links li a.icon-x { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' shape-rendering='geometricPrecision' text-rendering='geometricPrecision' image-rendering='optimizeQuality' fill-rule='evenodd' clip-rule='evenodd' viewBox='0 0 512 512'%3E%3Cpath fill='%23fff' d='M256 0c141.384 0 256 114.616 256 256 0 141.384-114.616 256-256 256C114.616 512 0 397.384 0 256 0 114.616 114.616 0 256 0zm62.64 157.549h33.401l-72.974 83.407 85.85 113.495h-67.222l-52.645-68.837-60.244 68.837h-33.422l78.051-89.212-82.352-107.69h68.924l47.59 62.916 55.043-62.916zm-11.724 176.908h18.509L205.95 176.494h-19.861l120.827 157.963z'/%3E%3C/svg%3E") no-repeat left center/contain; } .follow-links li a.icon-linkedin { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23ffffff' d='M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z'/%3E%3C/svg%3E") no-repeat left center/contain; } .follow-links li a.icon-facebook { background: transparent url("data:image/svg+xml,%3Csvg fill='%23ffffff' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M32 16c0-8.839-7.167-16-16-16-8.839 0-16 7.161-16 16 0 7.984 5.849 14.604 13.5 15.803v-11.177h-4.063v-4.625h4.063v-3.527c0-4.009 2.385-6.223 6.041-6.223 1.751 0 3.584 0.312 3.584 0.312v3.937h-2.021c-1.984 0-2.604 1.235-2.604 2.5v3h4.437l-0.713 4.625h-3.724v11.177c7.645-1.199 13.5-7.819 13.5-15.803z'%3E%3C/path%3E %3C/g%3E%3C/svg%3E") no-repeat left center/contain; } @media screen and (width > 768px) { .follow-links { margin-bottom: 0; margin-left: 0; display: flex; align-items: center; } .follow-links li { margin-block: var(--asic-space-8); display: inline-block; padding: 0 1rem; text-align: center; } .follow-links li:not(:last-child) { border-right: solid 1px rgba(255, 255, 255, 0.5); } } .acknowledgement { margin-block: var(--asic-space-32); position: relative; } .acknowledgement div:first-child { text-align: center; } .acknowledgement div:first-child p { color: var(--static-gray-6); font-size: var(--asic-text-body-small-size); } .acknowledgement img { width: 8rem; } .acknowledgement div:last-child { padding: 0 2rem; } .acknowledgement div:last-child p { max-width: 90ch; } @media screen and (width > 768px) { .acknowledgement { display: flex; align-items: center; } .acknowledgement div:first-child { border-right: 1px solid rgba(255, 255, 255, 0.1); padding: 0 2rem; } } .asic-footer-shaded-container { background-color: rgba(0, 0, 0, 0.2); margin-bottom: var(--asic-space-32); } @media screen and (width > 1024px) { .asic-footer-shaded-container { margin-block: var(--asic-space-32); } } .asic-feedback-questions .asic-checkbox, .asic-feedback-questions .asic-radio { color: var(--asic-color-text); background-color: var(--static-gray-0); } .asic-feedback-questions .asic-checkbox:checked, .asic-feedback-questions .asic-radio:checked { border-color: var(--static-brand-blue); } /* New version of feedback form */ .asic-footer-custom .asic-feedback-banner { background-color: #f1f9ff; } .asic-form-control-group__legend, .asic-form-control-group__hint, .asic-form-control__label { color: var(--static-gray-9); } .asic-feedback-questions .asic-form-control-group__legend { font-weight: var(--asic-font-weight-bold); font-size: 1.17em; } .asic-feedback-questions .asic-checkbox:not(:checked) { background-color: var(--static-gray-2); border-color: var(--static-gray-6); } .asic-feedback-banner .asic-feedback-questions .asic-button--primary { background-color: var(--static-brand-blue); color: var(--static-gray-3); } .asic-feedback-banner .asic-feedback-questions .asic-button--tertiary { background-color: transparent; border-color: transparent; color: var(--static-brand-blue); text-decoration: none; } .asic-feedback-banner .asic-feedback-questions .asic-button--tertiary:hover { background-color: transparent; border-color: transparent; } .asic-feedback-questions .asic-action-group { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; margin-top: var(--asic-space-40); } .asic-feedback-questions .asic-feedback-back { order: 1; } .asic-feedback-questions .asic-feedback-next { order: 2; } .asic-feedback-questions .asic-feedback-submit { order: 3; } .asic-feedback-banner .asic-feedback-questions .asic-button--tertiary { border: 0; padding-left: 0; } .asic-feedback-q1, .asic-feedback-q2, .asic-feedback-q3, .asic-feedback-q4 { display: none; } .asic-feedback-intro .asic-feedback-short-survey { padding-top: 1rem; } .asic-feedback-intro .asic-feedback-short-survey a { color: var(--static-gray-9); text-decoration: underline; } .asic-footer-custom .asic-feedback-banner .asic-feedback-header, .asic-footer-custom .asic-feedback-banner .asic-button { vertical-align: middle; } .asic-form-control-group:not(:has(:required, [aria-required=true])) .asic-form-control-group__legend:after { display: none; } .asic-mainnav-top { --item-height: var(--asic-space-80); background-color: transparent; } .asic-mainnav-top:after { content: none; } .asic-mainnav-top .asic-mainnav__item-link { padding: 0 var(--asic-space-24); } .asic-mainnav-top .asic-mainnav__item-link[aria-current=true], .asic-mainnav-top .asic-mainnav__item-link[aria-current=page] { background-color: transparent; border-color: var(--static-brand-blue); } .asic-mainnav-divider { background-color: transparent; } .asic-mainnav-divider:after { content: none; } @media (width > 1350px) { .asic-mainnav-divider .asic-mainnav__group { justify-content: flex-end; } } .asic-mainnav-divider .asic-mainnav__list { column-gap: var(--asic-space-16); margin-left: calc(var(--asic-space-16) * -1); } .asic-mainnav-divider .asic-mainnav__list:after { content: ""; flex-grow: 1; order: 0; } .asic-mainnav-divider .asic-mainnav__item-link { border: none; } .asic-mainnav-divider .asic-mainnav__item-link:after { content: ""; background-color: var(--static-brand-blue); display: block; width: 4rem; height: 3px; position: absolute; top: 0; left: var(--asic-space-16); transform: scaleX(0); transform-origin: left top; opacity: 0; transition: all 0.4s; } .asic-mainnav-divider .asic-mainnav__item-link:hover { text-decoration: none; } .asic-mainnav-divider .asic-mainnav__item-link:hover:after { transform: scaleX(1); opacity: 1; } .asic-mainnav-divider .asic-mainnav__item-link[aria-current=true]:after, .asic-mainnav-divider .asic-mainnav__item-link[aria-current=page]:after { content: ""; transform: scaleX(1); opacity: 1; } .asic-mainnav-divider .asic-mainnav__item_divider { --divider-height: var(--asic-space-16); position: relative; } .asic-mainnav-divider .asic-mainnav__item_divider:after { content: ""; position: absolute; width: 0.05rem; height: var(--divider-height); display: block; background-color: #000000; top: calc(50% - var(--divider-height) / 2); right: calc(var(--asic-space-16) / 2 * -1); } .asic-mainnav-divider .asic-mainnav__item_right { order: 1; } body.print .asic-page__main { grid-template-areas: "header" "share" "article" "bottom"; } body.print .asic-page__main:has(.asic-page__aside) { grid-template-areas: "share" "header" "aside" "article" "bottom"; } body.print .bottom-navigation { grid-area: bottom; } @media (min-width: 1200px) { body.print .bottom-navigation { grid-area: unset; } body.print .asic-page__main { grid-template-areas: "header share" "article article"; } body.print .asic-page__main:has(.asic-page__aside) { grid-template-areas: "header share" "article aside"; } body.print .asic-page__main:has(.asic-page__aside) .asic-share { justify-content: flex-start; } } .asic-share { display: none; grid-area: share; } @media (min-width: 1200px) { .asic-share { display: flex; align-items: flex-end; justify-content: flex-end; } .asic-share .asic-button--tertiary { padding-inline: 0; } } /* @property --border-top-color { syntax: ''; initial-value: #0072ce; inherits: false; } */ .asic-button--top-stripe { background-color: var(--asic-color-background-alt); border-top-left-radius: 0; border-top-right-radius: 0; color: var(--asic-color-text); padding-block: var(--asic-space-40); background: linear-gradient(to bottom, var(--static-brand-blue) 0, var(--static-brand-blue) 0.5rem, white 0.5rem, white 100%); border: none; position: relative; } .asic-button--top-stripe:hover, .asic-button--top-stripe:focus { background: linear-gradient(to bottom, var(--static-brand-sky) 0, var(--static-brand-sky) 0.5rem, white 0.5rem, white 100%); } .asic-button--top-stripe:where([data-symbol-end]):after { position: absolute; right: var(--asic-space-16); } .asic-button--top-stripe[aria-expanded=true] { border-bottom-left-radius: 0; border-bottom-right-radius: 0; justify-content: start; } .asic-button--top-stripe[aria-expanded=true]:where([data-symbol-end]):after { content: "keyboard_arrow_down"/""; } .asic-expand-button { position: relative; } .asic-expand-button-container { z-index: 1; box-shadow: 2px 3px 4px rgba(0, 0, 0, 0.1607843137); position: absolute; width: 100%; border-radius: var(--asic-border-radius-small); border-top-left-radius: 0; border-top-right-radius: 0; color: var(--asic-color-text); background: white; } .asic-expand-button-container ul { margin-block-start: 0; } .asic-button--top-stripe[aria-expanded=false] + .asic-expand-button-container { display: none; } @media (width <= 768px) { .asic-button--icon-only { width: 4em; } .asic-button--icon-only :not(.asic-icon) { display: none; } } @media (width <= 768px) { .asic-button--small { block-size: var(--asic-space-40); font: var(--asic-text-body-small-shorthand); padding-inline: var(--asic-space-16); } } @media (width <= 768px) { .asic-button--allow-wrap { white-space: normal; block-size: unset; min-block-size: var(--asic-space-56); line-height: var(--asic-font-lineheight-dense); } } .asic-table-striped tbody tr:nth-child(even) { background-color: var(--static-gray-1); } .asic-table a { font: var(--asic-text-body-small-shorthand); } body:has(dialog.asic-dialog-full-screen[open]) { overflow: hidden; } .asic-dialog-full-screen { width: calc(100% - 2em - 6px); height: calc(100% - 2em - 6px); } .asic-dialog-full-screen-header { position: fixed; height: 3.5rem; background-color: white; width: calc(100% - 2em - 6px); top: 3px; z-index: 1; } .asic-dialog-full-screen-header button[data-symbol-start=fullscreen_exit] { position: absolute; right: 1rem; top: 0.5rem; } @media (width <= 768px) { .asic-dialog-full-screen-header button[data-symbol-start=fullscreen_exit] { width: calc(100% - 2rem); margin-top: 0.5rem; margin-left: 1rem; position: unset; right: unset; top: unset; } .asic-dialog-full-screen-header { width: calc(100% - 6px); left: 3px; } } .asic-dialog-full-screen-header + * { margin-top: 2.5rem; overflow: auto; } .asic-action-group:has(button[data-symbol-start=fullscreen]) { margin: 0.25rem; } .asic-banner:has(.asic-breadcrumbs-banner) { grid-template-areas: "header" "content"; row-gap: 0.5rem; } .asic-banner__content { max-width: var(--asic-content-container-max); } .asic-banner__content .asic-text-subtitle { color: var(--static-gray-3); } .asic-banner__content .asic-text-display:has(.asic-card__icon) { display: flex; align-items: center; } .asic-banner__content .asic-text-display .asic-card__icon { background-color: transparent; display: inline-grid; margin-right: var(--asic-space-8); filter: sepia(100%) invert(100%) brightness(1.5); color: var(--asic-color-text-inverse); font: var(--asic-icon-font-large); width: 2rem; height: 2rem; } .asic-banner__content .asic-text-display { font: var(--asic-text-title-large-shorthand); font-weight: var(--asic-font-weight-bold); } @media (width > 768px) { .asic-banner__content .asic-text-display { font: var(--asic-text-display-shorthand); } .asic-banner__content .asic-text-display:has(.asic-card__icon) { align-items: flex-start; } .asic-banner__content .asic-text-display .asic-card__icon { font: var(--asic-icon-font-xlarge); width: unset; height: unset; } } .banner-gradient .asic-hero-banner { background: linear-gradient(90deg, #071018 0%, #053358 30%, #035aa1 80%); padding-block: var(--asic-space-64); } .asic-hero-banner-extra-padding { padding-block: var(--asic-space-80); position: relative; } .asic-hero-banner-image { background-size: cover; background-color: var(--asic-color-background-alt); background-blend-mode: multiply; background-position: top 50% center; min-height: 170px; } .regulatory-resources .asic-hero-banner-image { background-color: #0772CE; background-image: url(https://download.asic.gov.au/asic-nextgen/img/Hero-banner-regulatory.jpg); } .for-consumers .asic-hero-banner-image { background-color: #0772CE; background-image: url(https://download.asic.gov.au/asic-nga/img/banners/consumers.jpg); } .about-asic .asic-hero-banner-image { background-color: #0772CE; background-image: url(https://download.asic.gov.au/asic-nga/img/banners/about-us.jpg); } .for-finance-professionals .asic-hero-banner-image { background-color: #0772CE; background-image: url(https://download.asic.gov.au/asic-nextgen/img/Hero-banner-professional-01.jpg); } .for-business .asic-hero-banner-image { background-color: #0772CE; background-image: url(https://download.asic.gov.au/asic-nextgen/img/Hero-banner-business.jpg); } .for-business-and-companies .asic-hero-banner-image { background-color: #0772CE; background-image: url(https://download.asic.gov.au/asic-nextgen/img/Hero-banner-business.jpg); } .regulatory-guide .asic-hero-banner { background-color: var(--static-brand-navy); } .regulatory-guide .asic-hero-banner .asic-text-display { color: var(--asic-color-text-inverse); } .information-sheet .asic-hero-banner { background-color: var(--static-brand-sky-lighter); } .report .asic-hero-banner { background-color: var(--static-brand-blue); } .report .asic-hero-banner .asic-text-display { color: var(--asic-color-text-inverse); } .consultation-paper .asic-hero-banner { background-color: var(--static-brand-gold-lighter); } .form .asic-hero-banner { background-color: var(--static-gray-1); } .banner-search .asic-banner__content { width: 100%; max-width: var(--asic-container-narrow-max); margin-inline: auto; } .banner-search .asic-banner__header { width: 100%; margin-inline: auto; margin-top: calc(var(--asic-space-80) * -1); } @media (width > 992px) { .banner-search .asic-banner { grid-template-areas: "header" "content"; } } .asic-hero-banner-dark { background-color: var(--static-brand-navy); } .asic-hero-banner-dark .asic-textlink { color: var(--static-gray-1); text-decoration: none; } .asic-hero-banner-dark .asic-textlink:hover { text-decoration: underline; } .asic-hero-banner-dark .asic-text-display { color: var(--static-gray-1); } .asic-hero-banner-dark .asic-field__label { color: var(--static-gray-1); } .asic-hero-banner-dark .asic-button--secondary { color: var(--static-gray-1); } .asic-hero-banner-dark .asic-button--secondary:hover { background-color: var(--static-brand-blue); } .asic-hero-banner { position: relative; } .asic-banner__content .asic-banner-tag { display: inline-block; position: absolute; top: 0; color: var(--asic-color-text-inverse); background-color: var(--static-brand-sky); font-size: var(--asic-text-body-small-size); padding-block: var(--asic-space-4); padding-inline: var(--asic-space-12); border-bottom-left-radius: var(--asic-border-radius-small); border-bottom-right-radius: var(--asic-border-radius-small); } .asic-banner__content .asic-banner-tag:first-letter { text-transform: capitalize; } @media (width > 768px) { .asic-banner__content .asic-banner-tag { font-size: var(--asic-text-body-size); padding-block: var(--asic-space-8); padding-inline: var(--asic-space-16); } } .asic-sidenav__title { margin: 0 0 var(--asic-space-16); } .asic-sidenav-lhs { font: var(--asic-text-body-small-shorthand); } @media (width > 768px) { .asic-sidenav-lhs > .asic-sidenav__list { border: solid 1px var(--asic-color-border-muted); } } .asic-sidenav-lhs .asic-sidenav__list { padding: 0; margin: unset; } .asic-sidenav-lhs .asic-sidenav__item:hover { background-color: var(--asic-color-item-bg-hover); color: var(--asic-color-item-fg-hover); } .asic-sidenav-lhs .asic-sidenav__item-expandable { grid-template-areas: "link icon"; grid-template-columns: minmax(0, 1fr) 28px; align-items: center; display: grid; } .asic-sidenav-lhs .asic-sidenav__item-expandable:after { color: var(--asic-color-text); content: "chevron_right"/""; font: var(--asic-icon-font-small); grid-area: icon; width: 1em; overflow: hidden; } .asic-sidenav-lhs .asic-sidenav__item-expandable > ul { display: none; } .asic-sidenav-lhs .asic-sidenav__item-highlight { padding-top: 2rem; box-shadow: -2px 0 0 white, 2px 0 0 white; background-color: var(--asic-color-system-info); background: linear-gradient(to bottom, white 0, white 2rem, var(--asic-color-system-info) 2rem, var(--asic-color-system-info) 100%); color: var(--static-gray-0); } .asic-sidenav-lhs .asic-sidenav__item-highlight .asic-sidenav__item-link { color: var(--static-gray-0); padding-top: var(--asic-space-24); padding-bottom: var(--asic-space-24); font-size: 1rem; } .asic-sidenav-lhs .asic-sidenav__item-highlight:after { color: unset; } .asic-sidenav-lhs .asic-sidenav__item-highlight:hover { color: white; } .asic-sidenav-lhs .asic-sidenav__listitem__expanded { border-inline-start: solid 2px var(--asic-color-background-accent-emphasis); background-color: var(--asic-color-background-accent); font-weight: normal; } .asic-sidenav-lhs .asic-sidenav__listitem__expanded:hover { background-color: var(--asic-color-background-accent); } .asic-sidenav-lhs .asic-sidenav__listitem__expanded > .asic-sidenav__item-link:hover { background-color: var(--asic-color-background-accent-alt); } .asic-sidenav-lhs .asic-sidenav__listitem__expanded ul .asic-sidenav__item-link { padding-inline-start: var(--asic-space-32); } .asic-sidenav-lhs .asic-sidenav__item-link[aria-current=page] { border-inline-start: solid 4px var(--asic-color-background-accent-emphasis); background-color: var(--asic-color-background-accent-alt); font-weight: bold; padding-inline-start: calc(var(--asic-space-20) - 4px); } .asic-sidenav-lhs .asic-sidenav__item-link[aria-current=page]:hover { background-color: var(--asic-color-background-accent-alt); } .asic-sidenav-lhs .asic-sidenav__listitem__expanded .asic-sidenav__item-link[aria-current=page] { /*border-inline-start: solid 4px var(--asic-color-background-accent-emphasis); background-color: var(--asic-color-background-accent); font-weight: bold; padding-inline-start: calc(var(--asic-space-32) - 4px); */ } .asic-sidenav-lhs .asic-sidenav__listitem__expanded > .asic-sidenav__item-link[aria-current=page] { background-color: var(--asic-color-background-accent-alt); font-weight: bold; padding-inline-start: calc(var(--asic-space-20) - 4px); } .asic-sidenav-lhs .asic-sidenav__item { position: relative; border-bottom: solid 1px var(--asic-color-border-muted); } .asic-sidenav-lhs .asic-sidenav__item-link { grid-area: link; font: var(--asic-text-body-small-shorthand); border-inline-start: 0; } .asic-sidenav-lhs .asic-sidenav__item-link:after { content: " "; position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .asic-sidenav-lhs .asic-sidenav__item-link:hover { background-color: unset; color: unset; } .asic-sidenav-lhs .asic-sidenav__button { margin-top: 2rem; height: 3.5rem; width: 100%; font-size: 1rem; } .asic-sidenav-lhs .asic-sidenav__listitem__expanded > .asic-sidenav__item-link { /*font-weight: bold; */ border-inline-start: solid 4px var(--asic-color-background-accent-emphasis) !important; border-bottom: 1px solid var(--asic-color-border-muted); padding-inline-start: calc(var(--asic-space-20) - 4px); } .asic-sidenav__listitem__expanded .asic-sidenav__item-link[aria-current=page] { background-color: var(--asic-color-background-accent-alt); font-weight: bold; border: 0px; } .asic-sidenav__group:not(:first-child) { position: relative; margin-top: 2rem; } .asic-sidenav__group:not(:first-child):before { content: ""; position: absolute; background-color: var(--asic-color-background); width: calc(100% + 2rem); height: 1.8rem; left: -1rem; top: -1.8rem; } .asic-sidenav__group:not(:first-child) > ul { border-top: solid 1px var(--asic-color-border-muted); } .asic-sidenav__group:not(:first-child) > ul.asic-sidenav__section { margin-bottom: 0; } @media (width <= 768px) { /*Resources and news button for mobile view*/ .asic-sidenav-lhs .asic-sidenav__button { width: 16rem; margin-left: 1rem; margin-top: 0.5rem; } .asic-sidenav { background-color: var(--asic-color-background-alt); border: 1px solid var(--asic-color-border-muted); } .asic-sidenav__button-link { margin-bottom: 15px; } .asic-sidenav__list { --offset: 0; } } body.hide-siblings .asic-sidenav-lhs > .asic-sidenav__list > .asic-sidenav__item:not(.asic-sidenav__listitem__expanded) { display: none; } .asic-card-grid-wide { grid-template-columns: repeat(var(--layout-mode), minmax(var(--asic-space-320), 1fr)); } .asic-card-actions { grid-template-areas: ". . ." ". header ." ". content ." ". . ." ". actions ." ". . ."; grid-template-columns: var(--gutter) minmax(0, 1fr) var(--gutter); grid-template-rows: var(--gutter) auto minmax(0, 1fr) var(--gutter) auto var(--gutter); background-color: var(--asic-color-background); border: var(--asic-border-width-thin) solid var(--asic-color-border); border-radius: var(--asic-border-radius-small); box-sizing: border-box; min-height: var(--asic-space-192); --gap: var(--asic-space-12); --gutter: var(--asic-space-24); --icon-disc: var(--asic-space-72); display: grid; justify-items: center; text-align: center; position: relative; } .asic-card-actions-fixed { grid-template-rows: var(--gutter) auto minmax(0, 1fr) var(--gutter) 100px var(--gutter); } @media (width <= 768px) { .asic-card-actions { grid-template-rows: var(--gutter) auto minmax(0, 1fr) var(--gutter) auto var(--gutter); } } .asic-card__links { grid-area: actions; display: grid; justify-items: center; row-gap: var(--gap); } .asic-card-highlight { background-color: var(--static-brand-navy); color: var(--static-gray-0); } .asic-card-highlight .asic-card__title-link, .asic-card-highlight .asic-card__content { background-color: var(--static-brand-navy); color: var(--static-gray-0); } .asic-card-highlight:after { color: var(--static-gray-0); } .asic-card-dynamic-height { min-height: auto; } .asic-page__article a.asic-tabs__tab { text-decoration: none; cursor: pointer; } .asic-page__article a.asic-tabs__tab:hover { text-decoration: underline; } .asic-page__article a.asic-tabs__tab[aria-selected=true] { color: var(--asic-color-text-emphasis); cursor: default; } .asic-page__article a.asic-tabs__tab[aria-selected=true]:hover { text-decoration: none; } .asic-tabs-semi-transparent { --tab-height: var(--asic-space-72); --line-adornment-width: 0; } .asic-tabs-semi-transparent .asic-tabs__tab { background-color: transparent; font: var(--asic-text-body-shorthand); color: var(--static-gray-0); padding: 0 var(--asic-space-32); } @media screen and (width > 768px) { .asic-tabs-semi-transparent .asic-tabs__tab { font: var(--asic-text-title-small-shorthand); } } .asic-tabs-semi-transparent .asic-tabs__tab[aria-selected=true] { background: linear-gradient(0deg, rgba(29, 37, 45, 0.9) 0%, rgba(29, 37, 45, 0.9) 100%); } .asic-tabs-semi-transparent .asic-tabs__tab[aria-selected=true] .asic-icon { transform: rotate(90deg); } .asic-tabs-semi-transparent .asic-tabs__panels { padding: var(--asic-space-32); background: linear-gradient(0deg, rgba(29, 37, 45, 0.9) 0%, rgba(29, 37, 45, 0.9) 100%); } .asic-tabs-semi-transparent .asic-tabs__panel { padding-block: 0; padding-inline: 0; } .asic-tabs-vertical { display: grid; grid-template-columns: 1fr 1fr; --padding-y: 0; --padding-x: var(--asic-space-48); --line-adornment-width: 0; width: 100%; align-items: center; } .asic-tabs-vertical .asic-tabs__list { background-color: var(--static-gray-3); flex-direction: column; justify-content: center; height: auto; } .asic-tabs-vertical .asic-tabs__tab { background-color: var(--static-gray-3); display: grid; grid-template-columns: 0.25fr 0.75fr; color: var(--asic-color-text); gap: 0; padding: 0; font-size: var(--asic-text-subtitle-size); } .asic-tabs-vertical .asic-tabs__tab :first-child { visibility: hidden; position: relative; } .asic-tabs-vertical .asic-tabs__tab :last-child { text-align: right; position: relative; padding-block: 1.5rem; padding-inline: 1rem; } .asic-tabs-vertical .asic-tabs__tab :last-child:before { content: ""; left: 5%; bottom: -2px; right: 0; height: var(--asic-border-width-medium); position: absolute; background-color: var(--asic-color-border); z-index: 1; } .asic-tabs-vertical .asic-tabs__tab[aria-selected=true] { box-shadow: none; font-weight: var(--asic-font-weight-semibold); } .asic-tabs-vertical .asic-tabs__tab[aria-selected=true] :first-child { visibility: visible; } .asic-tabs-vertical .asic-tabs__tab[aria-selected=true] :first-child:after { position: absolute; content: ""; border-top: 0.6em solid transparent; border-left: 0.6em solid var(--static-brand-blue); border-bottom: 0.6em solid transparent; right: -0.6em; z-index: 1; } .asic-tabs-vertical .asic-tabs__tab[aria-selected=true] :last-child { background-color: var(--static-gray-1); } .asic-tabs-vertical .asic-tabs__tab[aria-selected=true] :last-child:before { background-color: var(--static-gray-1); left: 0; } .asic-tabs-vertical .asic-tabs__panels { background-color: var(--static-gray-1); height: 100%; } .asic-breadcrumbs-banner { color: var(--asic-color-text); } .asic-breadcrumbs-banner .asic-breadcrumbs__item-link { color: var(--asic-color-text); } .asic-breadcrumbs-banner .asic-breadcrumbs__item { white-space: nowrap; max-width: 92vw; padding: 4px 0 4px 4px; overflow: hidden; box-sizing: border-box; } .asic-breadcrumbs-banner .asic-breadcrumbs__item:not(:last-child):after { margin-inline-start: 6px; } .asic-breadcrumbs__toggle { color: var(--asic-color-text); } @media (width <= 768px) { .asic-breadcrumbs-banner .asic-breadcrumbs__item { padding: 2px 0 2px 2px; } .asic-breadcrumbs-banner .asic-breadcrumbs__item:not(:last-child):after { margin-inline-start: 4px; } .asic-breadcrumbs-banner .asic-breadcrumbs__item-link:focus-visible { outline-width: 1px; outline-offset: 1px; } .asic-breadcrumbs__item-link, .asic-breadcrumbs__toggle { font-size: 0.875rem; } .asic-breadcrumbs__list { font-size: 0.875rem; } .asic-breadcrumbs-banner { margin-top: unset; } /* .asic-breadcrumbs-banner .asic-breadcrumbs__list li{ display: none; } .asic-breadcrumbs-banner .asic-breadcrumbs__list li:nth-last-child(-n+2){ display: flex; } */ .asic-hero-banner:has(.asic-text-display-stripe) .asic-breadcrumbs-banner { display: none; } } /* only show last n breadcrumbs */ body.expand-breadcrumbs .asic-breadcrumbs__list li, body.expand-breadcrumbs-1 .asic-breadcrumbs__list li, body.expand-breadcrumbs-2 .asic-breadcrumbs__list li, body.expand-breadcrumbs-3 .asic-breadcrumbs__list li, body.expand-breadcrumbs-4 .asic-breadcrumbs__list li { display: none; } body.expand-breadcrumbs .asic-breadcrumbs__list li:nth-last-child(-n+3) { display: list-item; } body.expand-breadcrumbs-1 .asic-breadcrumbs__list li:nth-last-child(-n+1) { display: list-item; } body.expand-breadcrumbs-2 .asic-breadcrumbs__list li:nth-last-child(-n+2) { display: list-item; } body.expand-breadcrumbs-3 .asic-breadcrumbs__list li:nth-last-child(-n+3) { display: list-item; } body.expand-breadcrumbs-4 .asic-breadcrumbs__list li:nth-last-child(-n+4) { display: list-item; } .asic-header { border-bottom: var(--asic-border-width-thick) solid var(--static-brand-blue); } @media (width <= 1350px) { .asic-header__inner { text-align: center; grid-template-columns: auto 125px auto; justify-content: space-between; } .asic-mainnav__primary { display: none; } .asic-header__logo { width: 125px; height: auto; } .asic-mainnav__dialog-trigger { padding: 0; } } @media (width <= 768px) { .asic-header__inner { grid-template-columns: auto 100px auto; } .asic-header__logo { width: 100px; height: auto; } .asic-button-portals-text { display: none; } #link-portals { text-transform: capitalize; } .asic-icon { text-transform: none; } /* for mobile header */ .asic-header-sticky { position: sticky; top: 0; z-index: 999; } .asic-header-mobile { width: 100%; transition: transform 0.3s ease-in-out; } .header-hidden { transform: translateY(-100%); } } .asic-main-logo { max-width: 264px; } .asic-text-display-stripe { position: relative; } .asic-text-display-stripe:before { content: ""; position: absolute; width: 6px; top: 0; bottom: 0; left: -1.5rem; background-color: var(--static-brand-sky); } .asic-page__main:has(.asic-page__article) .asic-text-title-large { margin-top: var(--asic-content-gap-y); color: var(--static-brand-blue); font: var(--asic-text-title-small-shorthand); font-size: 1.75rem; } @media (width > 768px) { .asic-page__main:has(.asic-page__article) .asic-text-title-large { font: var(--asic-text-title-large-shorthand); } } .asic-text-title-large:has(.asic-card__icon) { display: flex; align-items: flex-end; } .asic-text-title-large .asic-card__icon { background-color: transparent; display: inline-grid; margin-right: var(--asic-space-8); } .asic-textlink-group-vertical { gap: var(--asic-space-4); flex-wrap: nowrap; margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; } .asic-textlink--search:after { content: "search"/""; } .asic-link-list--lines .asic-link-list__item { break-inside: avoid-column; } .asic-link-list--lines .asic-link-list__item:hover:after { color: var(--asic-color-text-link); } .asic-link-list--lines .asic-link-list__item-link { color: var(--asic-color-text); } .asic-link-list--lines .asic-link-list__item-link:hover { color: var(--asic-color-text-link); } .asic-link-list--lines.asic-link-list--columns { --padding-y: var(--asic-space-20); --item-height: 90px; } .asic-link-list__item-light:after { color: var(--static-gray-0); } .asic-callout__content a { margin-top: auto; } .asic-field:not(:has(:required, [aria-required=true])) .asic-field__label:after { content: ""; } .asic-accordion__title-small { font: var(--asic-text-body-shorthand); padding-block: var(--asic-space-16); padding-inline: var(--asic-space-16); } :where(.asic-icon-xxlarge) { font: var(--asic-icon-font); } :where(.asic-icon-xxlarge):after { content: attr(data-symbol)/""; -webkit-font-smoothing: antialiased; width: 1em; display: inline-block; overflow: hidden; } @supports not (content: "x"/"y") { :where(.asic-icon-xxlarge):after { alt: ""; content: attr(data-symbol); } } .asic-icon-xxlarge { font: normal normal var(--asic-space-72)/1 var(--asic-icon-font-family); } .asic-icon-img { background-color: transparent; display: inline-grid; width: var(--asic-space-48); } .au-border-dark { border-color: var(--static-brand-navy); } .au-bg-shaded { background: var(--static-gray-3); } .asic-container-report { width: min(100%, var(--asic-container-narrow-max)); } .asic-container-narrow { width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-narrow-max)); } @media (width > 1200px) { .asic-container-narrow:has(.asic-page__aside) { width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-narrow-max) + var(--asic-space-256)); margin-inline-end: 0; margin-inline-start: calc(50% - var(--asic-container-narrow-max) / 2); } } @media (width > 1200px) { .asic-page:not(:has(.asic-page__sidebar)) .asic-page__main:has(.asic-page__aside) { grid-template-columns: 80ch var(--asic-space-256); } } @media (width > 1800px) { .asic-page:not(:has(.asic-page__sidebar)) .asic-page__main:has(.asic-page__aside) { grid-template-columns: var(--asic-container-narrow-max) var(--asic-space-256); } } .asic-container { container-type: normal; /* stop absolute positioned elements from displaying incorrectly on older browsers - revisit if needing to do container queries */ } #tt1 { anchor-name: --my-anchor; } #popovertarget1 { position-anchor: --my-anchor; position: fixed; } .popover-with-position { margin: 0; position-area: top; } [popover=auto] { margin-bottom: 0.5rem; box-sizing: border-box; padding: 8px; border-radius: 6px; background: var(--asic-color-background-alt); color: var(--static-gray-8); box-shadow: 1px 1px 3px white; border-color: var(--asic-color-border); width: fit-content; max-width: 54rem; font-size: 0.875rem; } .popover-with-anchor[popover=auto] { justify-self: anchor-center; bottom: anchor(top); width: 15rem; } @media (width <= 768px) { [popover=auto] { position: fixed; bottom: 0; left: 0; width: 100%; padding-left: 1rem; padding-right: 1rem; margin-bottom: 0; } .popover-with-anchor[popover=auto] { inset: unset; position: fixed; bottom: 0; left: 0; width: 100%; padding-left: 1rem; padding-right: 1rem; position-area: unset; margin-bottom: 0; } } .tooltipbutton { display: inline-block; background-color: var(--asic-color-background-accent-alt); cursor: help; border: none; font-family: inherit; font-size: 1rem; padding: 0 0.25rem; } .statistics .asic-breadcrumbs { display: none; } .statistics-hub .asic-breadcrumbs { display: none; } /* FIX MOBILE PHONE VIEW */ main img { height: auto; } .asic-page__article .callout { font-weight: bold; position: relative; padding-bottom: 2.75rem; font-size: 1.2rem; line-height: 1.35; margin-top: 0; } .asic-page__article .callout:after { content: ""; width: 50px; height: 3px; display: block; position: absolute; bottom: 0; background-color: var(--static-brand-sky); } /* QUOTE */ .blue-quote { border-left: 8px solid #253746; color: #0072ce; font-size: 1.2em; font-weight: bold; line-height: 1.2; padding-left: 1em; margin: 1.5em 0; } .blue-quote p { padding: 0.5em 0; } /* CSS FLUID DIV BOX SINGLE */ /* box columns */ .multipleColumns { display: block; } .multipleColumns > div { padding: 0; box-sizing: border-box; margin-bottom: 1rem; } .multipleColumns.threeCols > div { width: 100%; } .multipleColumns.twoCols > div { width: 100%; } .multipleColumns.sixtyForty > div:first-of-type { width: 59%; } .multipleColumns.sixtyForty > div:nth-of-type(2) { width: 39%; } .multipleColumns > div > h3:first-of-type { margin-top: 0; } .multipleColumns > div.light-blue { background-color: #C2E3FA; padding: 1rem; margin: 10px 0 10px 0; } /* FLUID BOXES MULTIPLE */ .multipleColumns > div.granite { background-color: #253746; padding: 1rem; margin: 10px 0 10px 0; color: white; } .multipleColumns > div.navy { background-color: #1D252D; padding: 1rem; margin: 10px 0 10px 0; color: white; } .multipleColumns > div.dark-blue { background-color: #0a4b78; padding: 1rem; margin: 10px 0 10px 0; color: white; } .multipleColumns > div.mid-blue { background-color: #0072ce; padding: 1rem; margin: 10px 0 10px 0; color: white; } .multipleColumns > div.light-blue { background-color: #c2e3fa; padding: 1rem; margin: 10px 0 10px 0; } .multipleColumns > div.sky { background-color: #3cb4ee; padding: 1rem; margin: 10px 0 10px 0; } .multipleColumns > div.aqua { background-color: #84dade; padding: 1rem; margin: 10px 0 10px 0; } .multipleColumns > div.fawn { background-color: #d1ccbd; padding: 1rem; } .multipleColumns > div.mid-grey { background-color: #B4B4B4; padding: 1rem; margin: 10px 0 10px 0; } .multipleColumns > div.light-grey { background-color: #F0F0F0; padding: 1rem; } .multipleColumns > div.red { background-color: #CC0000; padding: 1rem; margin: 10px 0 10px 0; } /* COLOURED DIV BOX COLOURS */ .granite { background-color: #253746; padding: 1rem; margin: 10px 0 10px 0; color: white; } .navy { background-color: #1D252D; padding: 1rem; margin: 10px 0 10px 0; color: white; } .dark-blue { background-color: #0a4b78; padding: 1rem; margin: 10px 0 10px 0; color: white; } .mid-blue { background-color: #0072ce; padding: 1rem; margin: 10px 0 10px 0; color: white; } .light-blue { background-color: #c2e3fa; padding: 1rem; margin: 10px 0 10px 0; } .sky { background-color: #3cb4ee; padding: 1rem; margin: 10px 0 10px 0; } .aqua { background-color: #84dade; padding: 1rem; margin: 10px 0 10px 0; } .fawn { background-color: #d1ccbd; padding: 1rem; } .mid-grey { background-color: #B4B4B4; padding: 1rem; margin: 10px 0 10px 0; } .light-grey { background-color: #F0F0F0; padding: 1rem; } .red { background-color: #CC0000; padding: 1rem; margin: 10px 0 10px 0; } /* single boxes with coloured borders */ .granite-border { border: medium solid #253746; padding: 1rem; margin: 10px 0 10px 0; } .navy-border { border: medium solid #1D252D; padding: 1rem; margin: 10px 0 10px 0; } .dark-blue-border { border: medium solid #0a4b78; padding: 1rem; margin: 10px 0 10px 0; } .mid-blue-border { border: medium solid #0072ce; padding: 1rem; margin: 10px 0 10px 0; } .light-blue-border { background-color: #c2e3fa; padding: 1rem; margin: 10px 0 10px 0; } .sky-border { border: medium solid #3cb4ee; padding: 1rem; margin: 10px 0 10px 0; } .aqua-border { border: medium solid #84dade; padding: 1rem; margin: 10px 0 10px 0; } .fawn-border { border: medium solid #d1ccbd; padding: 1rem; } .mid-grey-border { border: medium solid #B4B4B4; padding: 1rem; margin: 10px 0 10px 0; } .light-grey-border { border: medium solid #F0F0F0; padding: 1rem; } .red-border { border: medium solid #CC0000; padding: 1rem; margin: 10px 0 10px 0; } /* columns */ .multipleColumns { display: flex; justify-content: space-between; } .multipleColumns.threeCols > div { width: 32%; } .multipleColumns.twoCols > div { width: 49%; } /* accordion */ .image-only { margin: 0; padding: 0; } .image-only img { display: block; } .accordion { position: relative; } .accordion h3 + p { margin-top: auto; } .accordion article button[aria-controls] { position: relative; background: transparent; border: none; font-family: inherit; font-size: inherit; text-align: inherit; display: block; width: 100%; } .accordion article button[aria-controls]:hover, .accordion article button[aria-controls]:focus, .accordion article button[aria-expanded=true] { color: #0072d5; } .accordion article button[aria-expanded=true] { font-weight: bold; } .accordion:not(.accordion-simple) article button[aria-controls] { padding: 1rem 4rem 1rem 1.5rem; } .accordion:not(.accordion-simple) article button[aria-controls]:hover::before, .accordion:not(.accordion-simple) article button[aria-controls]:hover::after, .accordion:not(.accordion-simple) article button[aria-controls]:focus::before, .accordion:not(.accordion-simple) article button[aria-controls]:focus::after { background-color: #0072d5; } .accordion:not(.accordion-simple) article button[aria-controls]::before { content: ""; position: absolute; right: 1.8rem; top: 1.2rem; width: 0.2rem; height: 0.8rem; background-color: black; } .accordion:not(.accordion-simple) article button[aria-controls]::after { content: ""; position: absolute; right: 1.5rem; top: 1.5rem; width: 0.8rem; height: 0.2rem; background-color: black; } .accordion article button[aria-expanded=true]::before { display: none; } .accordion article button[aria-expanded=true]::after { background-color: #0072d5; } .accordion article { border: solid 1px #dbdbdb; border-radius: 5px; margin: 0.5rem 0; } .accordion article:hover, .accordion article:focus { border-color: #0072d5; } .accordion article.bg-grey { background-color: #fbfbfb; } .accordion article div:not(.asic-callout, .asic-action-group) { padding: 0 1.5rem; } .accordion article div.tooltiptext { padding: 1rem 0.5rem 0.5rem 0.5rem; } .accordion article div > *:first-child { margin-top: 0; } .accordion article > h1, .accordion article > h2, .accordion article > h3, .accordion article > h4, .accordion article > h5, .accordion article > h6 { margin: 0; font-size: 1em; } .accordion.accordion-expand { margin-top: 2.5rem; } .accordion .expandCollapseButtons { position: absolute; right: 0; top: -1.8rem; } .accordion .expandCollapseButtons button { font-size: 80%; border: solid 1px transparent; border-radius: 3px; background: transparent; color: #0072ce; } .accordion .expandCollapseButtons button:hover, .accordion .expandCollapseButtons button:focus { border: solid 1px #0072ce; } .accordion.accordion-simple article { border: solid 1px transparent; margin-top: 0; } .accordion.accordion-simple article > div { border-left: solid 2px #0072d5; margin-left: 0.5rem; padding-left: 0.9rem; padding-top: 0.5rem; } .accordion.accordion-simple button:not(.asic-button) { padding: 0 0.5rem 0.5rem 1.5rem !important; } .accordion.accordion-simple button:not(.asic-button)::before { content: "" !important; position: absolute !important; right: initial !important; background-color: initial !important; top: 0.35rem !important; left: 0.35rem; width: 0 !important; height: 0 !important; border-style: solid; border-width: 6.5px 0 6.5px 8px; border-color: transparent transparent transparent #000000; transition: transform 0.2s; } .accordion.accordion-simple button::after { display: none; } .accordion.accordion-simple button[aria-expanded=true]::before { display: initial; transform: rotate(90deg); border-color: transparent transparent transparent #0072d5; } .accordion.accordion-simple button:hover::before, .accordion.accordion-simple button:hover::after, .accordion.accordion-simple button:focus::before, .accordion.accordion-simple button:focus::after { border-color: transparent transparent transparent #0072d5; background-color: transparent; } /* show more/less button */ .asic-line-clamp { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 8; /* truncate text to 8 lines */ } .more-selected .asic-line-clamp { -webkit-line-clamp: unset; display: block; overflow: initial; } /* tables */ table.simple th, table.simple td { vertical-align: top; } .asic-info { background-color: var(--asic-color-system-info-muted); padding: 1rem 2rem; position: relative; margin-bottom: 6rem; } .asic-info:after { content: ""; width: 50px; height: 3px; display: block; position: absolute; bottom: -3rem; left: 0; background-color: var(--static-brand-sky); } .asic-info .asic-info-heading { display: flex; } .asic-info .asic-icon { margin-right: 0.5rem; font-variation-settings: "FILL" 0; } .asic-info ul { padding-inline-start: 1.5rem; } .info-link { padding: 0.625rem 0.313rem 0.625rem 0.625rem; background-color: #f8f9fa; border-left: 0.5rem solid #3cb4e5; } .rg-link { padding: 0.625rem 0.313rem 0.625rem 0.625rem; background-color: #f8f9fa; border-left: 0.5rem solid #253746; } .form-link { padding: 0.625rem 0.313rem 0.625rem 0.625rem; background-color: #f8f9fa; border-left: 0.5rem solid #84dade; } .cp-link { padding: 0.625rem 0.313rem 0.625rem 0.625rem; background-color: #f8f9fa; border-left: 0.5rem solid #eceae4; } .rep-link { padding: 0.625rem 0.313rem 0.625rem 0.625rem; background-color: #f8f9fa; border-left: 0.5rem solid #0072ce; } .instrument-link { padding: 0.625rem 0.313rem 0.625rem 0.625rem; background-color: #f8f9fa; border-left: 0.5rem solid #627d98; } .asic-page__article .intro { font-weight: 500; position: relative; padding-bottom: 2.75rem; font-size: 1.1rem; line-height: 1.35; margin-top: 0; } .asic-page__article .intro:after { content: ""; width: 50px; height: 3px; display: block; position: absolute; bottom: 0; background-color: var(--static-brand-sky); } .asic-service-alert-banner { display: flex; justify-content: space-between; align-items: center; min-height: 5rem; background-color: var(--asic-color-system-warning-muted); border: 1px solid var(--asic-color-border); font: var(--asic-text-body-shorthand); } .asic-service-alert-banner .asic-icon { color: var(--asic-color-system-warning); margin: auto; margin-right: 0.5rem; font-variation-settings: "FILL" 0; } .asic-service-alert-banner button { text-decoration: none; color: var(--asic-color-text); margin: auto; margin-right: 5%; padding-inline: 0; } .asic-service-alert-banner button:hover { text-decoration: underline; } .asic-service-alert-banner button .asic-icon { color: var(--asic-color-text); font-variation-settings: "FILL" 1; margin-right: 0; } @media (max-width: 768px) { .asic-service-alert-banner, .asic-service-alert-banner .asic-textlink { font: var(--asic-text-body-small-shorthand); } .asic-service-alert-banner .asic-icon { margin-left: 1rem; } .asic-service-alert-banner button { margin-right: 1rem; } .asic-service-alert-banner button span:first-child { display: none; } } .freezeScroll { overflow: hidden; } .asic-survey-box { position: fixed; right: 0; bottom: 0; z-index: 5; transform: translateY(100%); transition: transform 0.4s ease-in-out; } .asic-survey-box.is-active { transform: translateY(0%); } .asic-survey-box .asic-button-group { gap: 0; } .asic-survey-box .asic-button--primary { border-top-right-radius: 0; border-bottom-right-radius: 0; gap: var(--asic-space-4); } .asic-survey-box .asic-button--secondary { background-color: white; border-top-left-radius: 0; border-bottom-left-radius: 0; } .asic-survey-box .asic-survey-box-desktop-only { display: none; } @media screen and (width > 410px) { .asic-survey-box .asic-survey-box-desktop-only { display: inline; } } @media screen and (width < 1060px) { body:has(.asic-sticky-content) .asic-survey-box.is-active { transform: translateY(-200%); } } #askContainer { z-index: 10; font-size: 14px; position: fixed; right: 3.5em; top: 0; transform: rotate(270deg); transform-origin: top right; margin: 0; padding: 0; max-width: none; } @media screen and (width > 768px) { #askContainer { top: 17%; } } #askContainer.open { height: 258px; width: 300px; right: 0.5em !important; top: 17%; z-index: 10; background-color: #F6F5F2; transform: none; padding: 1em 1.5em; box-sizing: border-box; border-radius: 5px; display: flex; box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1607843137); } @media screen and (width <= 768px) { #askContainer.open { padding: 1em; padding-top: 0.5em; border-radius: 0; } } #askContainer.open #askContent { display: flex; flex-direction: column; flex: 1; padding: 0; text-align: center; justify-content: center; } #askContainer.open #askContent h3 { line-height: 1.2; margin-top: 0; margin-bottom: 0.5em; margin-right: 1em; } #askContainer.open #askContent .loading-dots { color: #1D252D; font-size: 1em; } #askContainer.open #askContent #askInnerContent { display: flex; flex-direction: column; flex: 1; } #askContainer.open #askContent #msg-loading { font-size: 1em; color: black; background-color: white; padding: 1em; height: 443px; box-sizing: border-box; margin: 0; } #askContainer.open #askContent .survey-msg { font-size: 0.9em; color: #333; line-height: 1.4; margin-top: 0; } #askContainer.open #askContent .survey-msg-right { text-align: right; } #askContainer.open #btnClose { display: block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'%3E%3Cpath fill='%23fff' d='M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z'/%3E%3C/svg%3E "); position: absolute; right: 0.5em; top: 0.57em; text-indent: -9999px; min-width: auto; border: none; padding: 0; width: 1.5em; border-radius: 24px; background-color: var(--static-brand-navy); background-repeat: no-repeat; background-size: 1.15em 1.15em; background-position-x: 0.15em; background-position-y: center; line-height: 1.5; cursor: pointer; } #askContainer.open #btnAsk { display: none; } #askContainer #btnFeedbackSubmit { background: var(--blue-mid); color: #fff; cursor: pointer; border: none; margin: 1.5em 0; padding: 0.75em 0em; font-size: 1em; font-family: inherit; border-radius: 5px; width: 10em; } #askContainer #btnAsk { background-color: var(--static-brand-navy); color: #fff; border: solid 1px #ffffff; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom: none; padding: 0.75em 1.5em; font: inherit; font-size: 1.125em; } #askContainer #btnClose { display: none; } @media screen and (width <= 768px) { #askContainer { top: 40%; right: 2.5em; } #askContainer #btnAsk { padding: 0 0.9em; font-size: 0.8em; block-size: var(--asic-space-32); } #askContainer.open { width: 100% !important; right: 0 !important; top: 0 !important; position: fixed !important; } } #askContainer #msg-thanks#msg-thanks { color: black; font-size: 1.3em; font-weight: 500; line-height: 1.3; text-align: center; background: white; border-radius: 5px; padding: 1.5em 1em; } #askContainer #msg-thanks#msg-thanks svg { display: block; margin: 1em auto; } #askContent { display: none; } body.freezeScroll:not(.survey-open) #askContainer { display: none; } @media print { .asic-header-sticky, .asic-dark, .asic-page__sidebar, .asic-page__aside, .asic-footer, .asic-header, footer, #btnAsk, #breadcrumbsTop, .asic-text-subtitle, .asic-feedback-banner { display: none !important; } .asic-container-report .asic-text-subtitle { all: unset !important; display: block !important; } a, h1, h2, h3, h4, h5, h6, .callout { color: #000 !important; text-decoration-color: #000 !important; } .callout::after { background-color: #000 !important; } .asic-hero-banner { background-color: white !important; padding-bottom: 0 !important; padding-top: 2rem; } .asic-page { padding: 0; grid-template-columns: auto; margin-inline: 0; } .asic-container { margin-inline: 0; } /* Prevent table rows from breaking across pages */ table { page-break-inside: auto; } tr { page-break-inside: avoid; page-break-after: auto; } a.asic-button { all: unset; text-decoration: underline; } .tooltipbutton { all: unset !important; } /* a[href*='//']::after { font: unset; content: " <" attr(href) ">"; font-size: 8pt; font-weight: normal; text-decoration: none !important; border: none; border-bottom: solid 3px white; color: #666; display: inline; text-transform: none; padding: 0; margin: 0; margin-bottom: -1px; overflow-wrap: break-word; word-wrap: break-word; -ms-word-break: break-all; word-break: break-all; word-break: break-word; -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; } */ } :root { --blue-dark: #253746; --blue-light: #3CB4E5; --blue-lighter: #cce3f5; --blue-mid: #0772CE; --blue-darkest: #1D252D; --gold: #dcd9d0; --grey: #CCCCCC; --grey-light: #F1F1F3; --orange-light: #e49e06; --green-light: #66bb00; --alert: #e75356; --content-max-width: 1640px; --content-max-hub-width: 1320px; --content-narrower-max-width: 1100px; --content-padding-lr: 2rem; --doc-height: 100%; } @media (min-width: 1025px) and (max-width: 1350px) { :root { --content-padding-lr:calc(((100vw - 1025px) / 325 * 16) + 1rem); } } @media (max-width: 1024px) { :root { --content-padding-lr: 1rem; } } @media (max-width: 500px) { :root { --content-padding-lr: .5rem; } } /* * { box-sizing: border-box; } html, body { margin: 0; padding: 0; } html { scroll-behavior: smooth; font-family: 'Poppins', "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: var( --blue-dark); } img { max-width: 100%; } */ .link-back { padding-left: 2rem; position: relative; } .link-back:before { content: ""; border-left: solid 2px #1F252C; border-top: solid 2px #1F252C; transform: rotate(-45deg); display: block; width: 0.6rem; height: 0.6rem; position: absolute; top: calc(50% - 0.4rem); left: 1rem; } a.link-button { border: solid 1px rgba(251, 251, 251, 0.6); background-color: var(--blue-dark); color: white; text-decoration: none; border-radius: 5px; padding: 1rem 4rem 1rem 3rem; position: relative; } a.link-button::after { content: ""; position: absolute; width: 0.5rem; height: 0.5rem; border-right: solid 1px #fff; border-top: solid 1px #fff; transform: rotate(45deg); top: calc(50% - 0.3rem); right: 2rem; } .visuallyhidden { border: 0; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .alertBox { width: 100%; margin: 0; display: flex; align-items: center; flex-wrap: wrap; background-color: #b4ebec; padding: 0; } .alertBox > div { width: calc(var(--content-max-width) + var(--content-padding-lr) * 2); margin: 0 auto; padding: 0 2.5rem 0 var(--content-padding-lr); } .alertBox p { max-width: 100ch; line-height: 1.25; } .alertBox a { color: var(--blue-dark); } .alertBox .closeButton { background: transparent url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'%3E%3Cpath fill='%23253746' d='M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z'/%3E%3C/svg%3E") no-repeat top center; border: 0 none; color: transparent; cursor: pointer; height: 1.25rem; text-indent: -10000rem; width: 1.25rem; visibility: visible !important; position: absolute; right: 1rem; } .main-container { max-width: calc(var(--content-max-width) + var(--content-padding-lr) * 2); padding: 0 var(--content-padding-lr); margin: calc(var(--content-padding-lr) * 3) auto; } .main-container .page-content { max-width: none; } .newsroom-home .banner { display: none; } .newsroom button { cursor: pointer; } .newsroom .nr-section-group { display: flex; column-gap: 1rem; } .newsroom .nr-section-group section { flex-basis: 33%; } @media screen and (max-width: 1024px) { .newsroom .nr-section-group { flex-wrap: wrap; } .newsroom .nr-section-group section { flex-basis: calc(50% - 1rem); margin-bottom: 3rem; } } @media screen and (max-width: 768px) { .newsroom .nr-section-group { display: block; } .newsroom .nr-section-group section { width: 100%; margin-bottom: 3rem; } } .newsroom #nr-toggle-view-container { text-align: right; margin-bottom: 1rem; } .newsroom #nr-toggle-view-container button { color: #253746; cursor: pointer; border: none; display: inline-block; margin: 0; padding: 0.5rem 2.25rem 0.5rem 2.75rem; font-size: 1rem; font-family: inherit; background-color: #F1F1F3; background-size: 1.5rem; background-position-x: 0.5rem; background-position-y: center; background-repeat: no-repeat; } .newsroom #nr-toggle-view-container button.selected { background-color: var(--blue-mid); color: #fff; } .newsroom #nr-toggle-view-container #nr-btn-gridview { background-image: url("data:image/svg+xml,%3Csvg fill='%23253746' viewBox='0 0 32 32' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M30 32h-10c-1.105 0-2-0.895-2-2v-10c0-1.105 0.895-2 2-2h10c1.105 0 2 0.895 2 2v10c0 1.105-0.895 2-2 2zM30 20h-10v10h10v-10zM30 14h-10c-1.105 0-2-0.896-2-2v-10c0-1.105 0.895-2 2-2h10c1.105 0 2 0.895 2 2v10c0 1.104-0.895 2-2 2zM30 2h-10v10h10v-10zM12 32h-10c-1.105 0-2-0.895-2-2v-10c0-1.105 0.895-2 2-2h10c1.104 0 2 0.895 2 2v10c0 1.105-0.896 2-2 2zM12 20h-10v10h10v-10zM12 14h-10c-1.105 0-2-0.896-2-2v-10c0-1.105 0.895-2 2-2h10c1.104 0 2 0.895 2 2v10c0 1.104-0.896 2-2 2zM12 2h-10v10h10v-10z'%3E%3C/path%3E %3C/g%3E%3C/svg%3E"); } .newsroom #nr-toggle-view-container #nr-btn-gridview.selected { background-image: url("data:image/svg+xml,%3Csvg fill='%23ffffff' viewBox='0 0 32 32' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M30 32h-10c-1.105 0-2-0.895-2-2v-10c0-1.105 0.895-2 2-2h10c1.105 0 2 0.895 2 2v10c0 1.105-0.895 2-2 2zM30 20h-10v10h10v-10zM30 14h-10c-1.105 0-2-0.896-2-2v-10c0-1.105 0.895-2 2-2h10c1.105 0 2 0.895 2 2v10c0 1.104-0.895 2-2 2zM30 2h-10v10h10v-10zM12 32h-10c-1.105 0-2-0.895-2-2v-10c0-1.105 0.895-2 2-2h10c1.104 0 2 0.895 2 2v10c0 1.105-0.896 2-2 2zM12 20h-10v10h10v-10zM12 14h-10c-1.105 0-2-0.896-2-2v-10c0-1.105 0.895-2 2-2h10c1.104 0 2 0.895 2 2v10c0 1.104-0.896 2-2 2zM12 2h-10v10h10v-10z'%3E%3C/path%3E %3C/g%3E%3C/svg%3E"); } .newsroom #nr-toggle-view-container #nr-btn-listview { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' version='1.1' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23253746'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cg id='_x37_24-_equal__x2C__equal_sign___x2C__sign__x2C_'%3E %3Cg%3E %3Cline style='fill:none;stroke:%23253746;stroke-width:13.4167;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2.6131;' x1='26.7' x2='486.25' y1='30.24' y2='30.24'%3E%3C/line%3E %3Cline style='fill:none;stroke:%23253746;stroke-width:13.4167;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2.6131;' x1='26.7' x2='486.25' y1='181.044' y2='181.044'%3E%3C/line%3E %3Cline style='fill:none;stroke:%23253746;stroke-width:13.4167;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2.6131;' x1='26.7' x2='486.25' y1='331.848' y2='331.848'%3E%3C/line%3E %3Cline style='fill:none;stroke:%23253746;stroke-width:13.4167;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2.6131;' x1='26.7' x2='486.25' y1='482.714' y2='482.714'%3E%3C/line%3E %3C/g%3E %3C/g%3E %3Cg id='Layer_1'%3E%3C/g%3E %3C/g%3E%3C/svg%3E"); } .newsroom #nr-toggle-view-container #nr-btn-listview.selected { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' version='1.1' xml:space='preserve' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23253746'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cg id='_x37_24-_equal__x2C__equal_sign___x2C__sign__x2C_'%3E %3Cg%3E %3Cline style='fill:none;stroke:%23ffffff;stroke-width:13.4167;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2.6131;' x1='26.7' x2='486.25' y1='30.24' y2='30.24'%3E%3C/line%3E %3Cline style='fill:none;stroke:%23ffffff;stroke-width:13.4167;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2.6131;' x1='26.7' x2='486.25' y1='181.044' y2='181.044'%3E%3C/line%3E %3Cline style='fill:none;stroke:%23ffffff;stroke-width:13.4167;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2.6131;' x1='26.7' x2='486.25' y1='331.848' y2='331.848'%3E%3C/line%3E %3Cline style='fill:none;stroke:%23ffffff;stroke-width:13.4167;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:2.6131;' x1='26.7' x2='486.25' y1='482.714' y2='482.714'%3E%3C/line%3E %3C/g%3E %3C/g%3E %3Cg id='Layer_1'%3E%3C/g%3E %3C/g%3E%3C/svg%3E"); } .newsroom .nr-list { margin-bottom: 2rem; } .newsroom .nr-list > ul { list-style-type: none; padding: 0; margin: 0; display: grid; grid-template-rows: 1fr; grid-template-columns: repeat(4, 1fr); grid-column-gap: 1rem; grid-row-gap: 2rem; } @media screen and (max-width: 1024px) { .newsroom .nr-list > ul { grid-template-columns: repeat(3, 1fr); } } @media screen and (max-width: 768px) { .newsroom .nr-list > ul { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 600px) { .newsroom .nr-list > ul { grid-template-columns: repeat(1, 1fr); grid-row-gap: 1rem; } } .newsroom .nr-list > ul p { margin: 0; text-align: left; } .newsroom .nr-list > ul a { text-decoration: none; color: var(--blue-dark); overflow-wrap: anywhere; } .newsroom .nr-list > ul a:hover, .newsroom .nr-list > ul a:focus { text-decoration: underline; } .newsroom .nr-list > ul a:after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .newsroom .nr-list > ul li { list-style-type: none; padding: 0; margin: 0; position: relative; grid-row: auto; display: grid; grid-template-columns: 1fr; grid-template-areas: "heroimg" "type" "date" "heading" "desc"; grid-auto-rows: min-content; } .newsroom .nr-list > ul li p, .newsroom .nr-list > ul li h3 { margin-left: 1rem; margin-right: 1rem; } .newsroom .nr-list > ul li.border { box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1607843137); transition: box-shadow 0.3s; } .newsroom .nr-list > ul li img { width: 100%; height: auto; grid-area: heroimg; aspect-ratio: 2/1; border: 1px solid #E4E4E7; border-radius: 5px; object-fit: cover; } .newsroom .nr-list > ul li h3 { grid-area: heading; font-size: 1rem; margin-top: 1.2rem; margin-bottom: 1.2rem; line-height: 1.2; text-wrap: pretty; font-weight: 600; } .newsroom .nr-list > ul li .nh-list-info { display: flex; align-items: center; column-gap: 1rem; } .newsroom .nr-list > ul li .nh-list-info div:last-child { display: none; } @media screen and (max-width: 768px) { .newsroom .nr-list > ul li .nh-list-info { flex-wrap: wrap; } } .newsroom .nr-list > ul li .nr-label { grid-area: type; margin-top: 2rem; text-transform: uppercase; color: var(--blue-mid); font-size: 0.875rem; } .newsroom .nr-list > ul li .nr-label .nr-type-view-document { color: var(--blue-dark); } .newsroom .nr-list > ul li .nr-label .nr-label-view { display: inline; } .newsroom .nr-list > ul li .nr-label .nr-type-view { display: none; } .newsroom .nr-list > ul li .nr-date { grid-area: date; font-size: 0.875rem; } .newsroom .nr-list > ul li .nr-description { grid-area: desc; margin-bottom: 2rem; -webkit-line-clamp: 4; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; display: none; } .newsroom .nr-list > ul li .nr-description-all { grid-area: desc; margin-bottom: 2rem; display: block; } .newsroom .nr-list > ul li.nr-list-subscribe { background-color: #E6F1FA; grid-column: span 4; border: 1px solid rgba(41, 55, 69, 0.4); display: flex; } @media screen and (max-width: 1024px) { .newsroom .nr-list > ul li.nr-list-subscribe { display: block; grid-column: span 3; } } @media screen and (max-width: 768px) { .newsroom .nr-list > ul li.nr-list-subscribe { grid-column: span 2; } } @media screen and (max-width: 600px) { .newsroom .nr-list > ul li.nr-list-subscribe { grid-column: span 1; } } .newsroom .nr-list > ul li.nr-list-subscribe p, .newsroom .nr-list > ul li.nr-list-subscribe h3 { margin-left: 0; margin-right: 0; } .newsroom .nr-list > ul li.nr-list-subscribe > div, .newsroom .nr-list > ul li.nr-list-subscribe > form { flex-basis: 50%; } .newsroom .nr-list > ul li.nr-list-subscribe .nr-subscribe-thanks { flex-basis: 100%; font-weight: bold; } .newsroom .nr-list > ul li.nr-list-subscribe .nr-subscribe-thanks p { text-align: center; } .newsroom .nr-list > ul li.nr-list-subscribe h3 { font-weight: bold; font-size: 2rem; margin-top: 0; } .newsroom .nr-list > ul li.nr-list-subscribe .topics-list { list-style-type: none; padding: 0; margin: 0 0 0 1rem; columns: 2; } @media screen and (max-width: 1024px) { .newsroom .nr-list > ul li.nr-list-subscribe .topics-list { columns: 1; } } .newsroom .nr-list > ul li.nr-list-subscribe .topics-list li { display: list-item; background-color: transparent; } .newsroom .nr-list > ul li.nr-list-subscribe .topics-list li label { margin-right: 0.25rem; } .newsroom .nr-list > ul li.nr-list-subscribe .social { margin: 2rem 0 0; } .newsroom .nr-list > ul li.nr-list-subscribe .social a { text-indent: -10000rem; display: inline-block; width: 2rem; margin-right: 0.25rem; } .newsroom .nr-list > ul li.nr-list-subscribe .social .icon-twitter { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%230772CD' d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/%3E%3C/svg%3E") no-repeat left center/contain; } .newsroom .nr-list > ul li.nr-list-subscribe .social .icon-linkedin { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%230772CD' d='M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z'/%3E%3C/svg%3E") no-repeat left center/contain; } .newsroom .nr-list > ul li.nr-list-subscribe .social .icon-facebook { background: transparent url("data:image/svg+xml,%3Csvg fill='%230772CD' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M32 16c0-8.839-7.167-16-16-16-8.839 0-16 7.161-16 16 0 7.984 5.849 14.604 13.5 15.803v-11.177h-4.063v-4.625h4.063v-3.527c0-4.009 2.385-6.223 6.041-6.223 1.751 0 3.584 0.312 3.584 0.312v3.937h-2.021c-1.984 0-2.604 1.235-2.604 2.5v3h4.437l-0.713 4.625h-3.724v11.177c7.645-1.199 13.5-7.819 13.5-15.803z'%3E%3C/path%3E %3C/g%3E%3C/svg%3E") no-repeat left center/contain; } .newsroom .nr-list > ul li.nr-list-subscribe .emailHeading { margin: 2rem 0 0.25rem 0; } .newsroom .nr-list > ul li.nr-list-subscribe .selectionHeading { margin: 0.75rem 0 1rem 0; } .newsroom .nr-list > ul li.nr-list-subscribe label { margin-left: 0.15rem; margin-right: 0.75rem; white-space: nowrap; } .newsroom .nr-list > ul li.nr-list-subscribe label[for=txtEmail] { font-weight: bold; display: block; margin-top: 1rem; } .newsroom .nr-list > ul li.nr-list-subscribe input[type=email] { display: block; width: calc(100% - 1rem); border: 1px solid #CCCCCC; padding: 1rem; font-size: 1rem; } .newsroom .nr-list > ul li.nr-list-subscribe button { background: var(--blue-mid); color: #fff; cursor: pointer; border: none; display: inline-block; margin: 2rem 1rem 0 0; padding: 0.75rem 4rem; font-size: 1rem; font-family: inherit; border-radius: 5px; } @media screen and (max-width: 450px) { .newsroom .nr-list > ul li.nr-list-subscribe button { margin-bottom: 1rem; } } .newsroom .nr-list > ul li.nr-list-subscribe a { text-decoration: underline; color: var(--blue-dark); } .newsroom .nr-list > ul li.nr-list-subscribe a:after { content: none; } .newsroom .nr-list.nr-list-asset button { padding: 0; background-color: transparent; cursor: pointer; border: none; } .newsroom .nr-list.nr-list-view > ul { grid-template-columns: 1fr; grid-row-gap: 1rem; } .newsroom .nr-list.nr-list-view > ul > li:not(.nr-list-subscribe) { background-color: #fbfbfb; border: solid 1px #e5e5e5; border-radius: 3px; } .newsroom .nr-list.nr-list-view > ul > li.nr-list-subscribe { grid-column: 1; } .newsroom .nr-list.nr-list-view > ul img { display: none; } .newsroom .nr-list.nr-list-view > ul .nr-description { display: -webkit-box; } .newsroom .nr-list.nr-list-view .nh-list-info div:last-child { display: block !important; margin-top: 2rem; } .newsroom .nr-list.nr-list-view .nr-label-view { display: none !important; } .newsroom .nr-list.nr-list-view .nr-type-view { display: inline !important; } .newsroom .nr-list:not(.nr-list-3):not(.nr-list-hero) li:nth-child(n+22) { display: none; } .newsroom .nr-list-asset ul { grid-row-gap: 1rem; } .newsroom .nr-list-asset ul li h3 { margin-bottom: 0; } .newsroom .nr-list-asset ul li img { aspect-ratio: 5/4; object-fit: cover; object-position: top; overflow-clip-margin: unset; } .newsroom .nr-list-one-row > h2 { font-size: 2rem; font-size: clamp(1.125rem, 3.5vw, 2rem); font-weight: 600; } .newsroom .nr-list-one-row ul li { box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1607843137); transition: box-shadow 0.3s; } .newsroom .nr-list-one-row ul li img { aspect-ratio: 4/3; object-fit: cover; } @media screen and (max-width: 600px) { .newsroom .nr-list-one-row ul li img { aspect-ratio: unset; } } .newsroom .nr-list-one-row ul li .nr-description { display: -webkit-box; } .newsroom .nr-list-one-row ul li:has(a:hover, a:focus) { box-shadow: 0px 6px 20px rgba(0, 0, 0, 0.1607843137); } .newsroom .nr-list-one-row ul li:nth-child(n+5) { display: none; } .newsroom .nr-list-hero ul { grid-row-gap: 1rem; } .newsroom .nr-list-hero ul li:first-child { grid-column: span 2; grid-row: span 4; } @media screen and (max-width: 1024px) { .newsroom .nr-list-hero ul li:first-child { grid-column: span 3; grid-row: span 1; } } @media screen and (max-width: 768px) { .newsroom .nr-list-hero ul li:first-child { grid-column: span 2; grid-row: span 1; } } @media screen and (max-width: 600px) { .newsroom .nr-list-hero ul li:first-child { grid-column: span 1; grid-row: span 1; } } .newsroom .nr-list-hero ul li:first-child h3 { font-size: 1.5rem; } .newsroom .nr-list-hero ul li:first-child .nr-description { display: -webkit-box; } @media screen and (min-width: 1025px) { .newsroom .nr-list-hero ul li:nth-child(n+4):nth-child(-n+9) img { display: none; } } @media screen and (max-width: 1024px) { .newsroom .nr-list-hero ul li:nth-child(n+5):nth-child(-n+9) img { display: none; } } @media screen and (max-width: 768px) { .newsroom .nr-list-hero ul li:nth-child(n+4):nth-child(-n+9) img { display: none; } } .newsroom .nr-list-hero ul li.nr-list-subscribe { margin: 2rem 0 4rem; } .newsroom .nr-list-hero ul li:nth-child(n+4):nth-child(-n+9) { border-top: 1px solid var(--grey-light); } .newsroom .nr-list-hero ul li:nth-child(n+11) { margin-bottom: 1rem; } .newsroom .nr-list-hero ul li:nth-child(n+23) { display: none; } .newsroom .nr-list-3 ul { grid-template-columns: repeat(3, minmax(0, 1fr)); } .newsroom .nr-list-3 ul li.nr-list-subscribe { grid-column: span 3; } @media screen and (max-width: 1024px) { .newsroom .nr-list-3 ul { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media screen and (max-width: 768px) { .newsroom .nr-list-3 ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } .newsroom .nr-list-3 ul li.nr-list-subscribe { grid-column: span 2; } } @media screen and (max-width: 600px) { .newsroom .nr-list-3 ul { grid-template-columns: repeat(1, minmax(0, 1fr)); } .newsroom .nr-list-3 ul li.nr-list-subscribe { grid-column: span 1; } } .newsroom .nr-list-3 ul li:nth-child(n+23) { display: none; } .newsroom .nr-list-one-column h2 { font-size: 1.625rem; font-size: clamp(1.125rem, 3vw, 1.625rem); font-weight: 600; } .newsroom .nr-list-one-column .nr-showmore { margin-left: 1rem; font-weight: 600; } .newsroom .nr-list-one-column .nr-showmore a { color: var(--blue-mid); text-decoration: none; } .newsroom .nr-list-one-column ul { grid-template-columns: repeat(1, 1fr); grid-column-gap: 0; grid-row-gap: 0; } .newsroom .nr-list-one-column ul li { border-bottom: 1px solid var(--grey-light); } .newsroom .nr-list-one-column ul li:nth-child(n+2) img { display: none; } .newsroom .nr-list-one-column ul li:last-child { border-bottom: none; } .newsroom .btn-transparent { background: transparent; color: var(--blue-dark); cursor: pointer; border: 1px solid #0772CD; display: block; padding: 0.75rem 2rem; margin: 0 auto 4rem; font-size: 1rem; font-family: inherit; border-radius: 5px; } .newsroom .btn-transparent[hidden] { display: none; } .newsroom .nr-list-loading { height: 600px; position: relative; } .newsroom .nr-list-loading h2 { display: none; } .newsroom .nr-list-loading ul { display: none; } .newsroom .nr-list-loading:before { content: ""; box-sizing: border-box; position: absolute; top: 5%; left: 50%; width: 30px; height: 30px; margin-top: -15px; margin-left: -15px; border-radius: 50%; border: 1px solid #ccc; border-top-color: var(--blue-mid); animation: spinner 1s linear infinite; } .nr-list-subscribe { background-color: #E6F1FA; border: 1px solid rgba(41, 55, 69, 0.4); padding: 2rem var(--content-padding-lr) !important; } .nr-list-subscribe p, .nr-list-subscribe h3 { margin-left: 0; margin-right: 0; } .nr-list-subscribe h3 { font-weight: bold; font-size: 2rem; margin-top: 0; } .nr-list-subscribe .topics-list { list-style-type: none; padding: 0; margin: 0 0 0 1rem; columns: 2; max-width: 768px; } @media screen and (max-width: 1024px) { .nr-list-subscribe .topics-list { columns: 1; } } .nr-list-subscribe .topics-list li { display: list-item; background-color: transparent; margin: 0; padding: 0; } .nr-list-subscribe .topics-list li label { margin-right: 0.25rem; } .nr-list-subscribe .emailHeading { margin: 1rem 0 0.25rem 0; } .nr-list-subscribe .selectionHeading { margin: 0.75rem 0 1rem 0; } @media screen and (max-width: 449px) { .nr-list-subscribe .selectionHeading label[for=chkInterests_weekly], .nr-list-subscribe .selectionHeading label[for=chkInterests_daily] { display: block; } } .nr-list-subscribe label { margin-left: 0.15rem; margin-right: 0.75rem; white-space: nowrap; } .nr-list-subscribe label[for=txtEmail] { font-weight: bold; display: block; margin-top: 1rem; } .nr-list-subscribe input[type=email] { display: block; width: calc(100% - 1rem); border: 1px solid #CCCCCC; padding: 1rem; } .nr-list-subscribe button { background: var(--blue-mid); color: #fff; cursor: pointer; border: none; display: inline-block; margin: 2rem 1rem 0 0; padding: 0.75rem 4rem; font-size: 1rem; font-family: inherit; border-radius: 5px; } @media screen and (max-width: 450px) { .nr-list-subscribe button#nr-btnSubscribe { display: block; margin-bottom: 1rem; } } .nr-list-subscribe a { text-decoration: underline; color: var(--blue-dark); } .nr-list-subscribe a:after { content: none; } .nr-list-subscribe .txtEmailReadonly { margin-bottom: 0; } .nr-list-subscribe .nr-msg-alert { color: var(--alert); } @keyframes spinner { to { transform: rotate(360deg); } } .newsroom-home { background-color: #F8F8F8; } .newsroom-home header { box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1607843137); } .newsroom-home .main-container { margin-top: 2rem; } .newsroom-home .nr-list ul li { background-color: white; } .newsroom-home .nr-list.nr-list-loading { height: 0; } .newsroom-home .nr-list.nr-list-loading:before { display: none; } .nh-date-picker-container { display: flex; } .nh-date-picker-container .datepicker-arrow { margin-left: 0.8rem; margin-right: 0.5rem; margin-top: 0.1rem; } .nh-date-picker-container .datepicker-arrow svg { width: 14px; height: 14px; } .datepicker-widget { position: relative; margin-bottom: 3rem; } .datepicker-widget input[type=text] { vertical-align: middle; } .datepicker-widget .datepicker-toggle { vertical-align: middle; margin-top: 0.1rem; } .datepicker-widget input[type=text] { background-color: transparent; border: none; border-bottom: solid 1px #999; width: 8rem; padding: 0.1rem 0.5rem; font-size: 0.9rem; font-family: inherit; margin-right: 1px; margin-bottom: 0.25rem; } @media screen and (max-width: 359px) { .datepicker-widget input[type=text] { width: 7rem; } } .datepicker-widget .nh-datepicker-status { font-size: 0.875rem; max-width: 9.7rem; } @media screen and (max-width: 359px) { .datepicker-widget .nh-datepicker-status { max-width: 8.7rem; } } .datepicker-toggle { display: inline-block; position: absolute; right: 0; width: 24px; height: 24px; } .datepicker-toggle button { position: absolute; left: 0; top: 0; height: auto; background-color: transparent; border: solid 1px transparent; } .datepicker-toggle input[type=date] { position: absolute; left: 0; top: 0; width: 24px; height: 24px; opacity: 0; cursor: pointer; box-sizing: border-box; } .datepicker-toggle input[type=date]::-webkit-calendar-picker-indicator { position: absolute; left: 0; top: 0; width: 24px; height: 24px; margin: 0; padding: 0; cursor: pointer; } .nh-list-tag { display: inline-block; color: black; background-color: #f0f0f0; border-radius: 20px; border: solid 1px transparent; font-size: 0.75rem; font-family: inherit; padding: 0.5em 1.2em; margin-right: 0.5em; margin-left: 0.5em; margin-bottom: 0.5em; z-index: 2; position: relative; line-height: 1.5; /* span { display: inline-block; margin-left: 0.4rem; border-radius: 50%; border: solid 2px #E4E4E7; background: #fff; width: 1rem; height: 1rem; position: absolute; font-size: 1rem; line-height: .85; } */ } @media (hover: hover) { .nh-list-tag:hover { background-color: var(--blue-light); } } .nh-list-tag[aria-pressed=true] { background-color: var(--blue-lighter); } .nh-list-tag-clear:not(.link-style) { display: inline-block; margin-left: 0.4rem; border-radius: 50%; border: solid 2px #E4E4E7; background: #fff; width: 1rem; height: 1rem; position: absolute; font-size: 1rem; line-height: 1; } #nr-lbl-search-results { display: flex; align-items: center; flex-wrap: wrap; } #nr-lbl-search-results .nh-list-tag { border: 1px solid #E4E4E7; background-color: rgba(228, 228, 231, 0.4); padding-right: 2rem; margin-bottom: 0.25rem; margin-top: 0.25rem; } .link-style { background-color: transparent; border: solid 1px transparent; font-family: inherit; text-decoration: underline; font-size: 0.9rem; text-align: left; } #nr-search-summary { display: flex; flex-wrap: wrap; margin: 2rem 0; justify-content: space-between; row-gap: 0.5rem; } #nr-search-summary .nr-search-box-options { display: flex; } #nr-search-summary #nr-search-box-view { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.957' height='14.617' viewBox='0 0 24.957 14.617'%3E %3Cpath fill='currentColor' id='Icon_material-list' data-name='Icon material-list' d='M4.5,19.27H8.146V16.347H4.5Zm0,5.847H8.146V22.194H4.5Zm0-11.694H8.146V10.5H4.5Zm7.292,5.847H29.457V16.347H11.792Zm0,5.847H29.457V22.194H11.792Zm0-14.617v2.923H29.457V10.5Z' transform='translate(-4.5 -10.5)'/%3E %3C/svg%3E "); color: #253746; cursor: pointer; border: 1px solid #E4E4E7; display: inline-block; margin: 0; font-size: 1rem; font-family: inherit; background-color: #fff; background-size: 1.75rem; background-position-x: center; background-position-y: center; background-repeat: no-repeat; padding: 0 1.5rem; margin-right: 1rem; max-height: 3rem; } #nr-search-summary #nr-search-box-view.gridoff { background-size: 2.75rem; background-image: url("data:image/svg+xml,%3Csvg fill='currentColor' viewBox='0 0 32 32' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Ctitle%3Egrid%3C/title%3E %3Cpath d='M8 12h4v-4h-4v4zM14 12h4v-4h-4v4zM20 8v4h4v-4h-4zM8 18h4v-4h-4v4zM14 18h4v-4h-4v4zM20 18h4v-4h-4v4zM8 24h4v-4h-4v4zM14 24h4v-4h-4v4zM20 24h4v-4h-4v4z'%3E%3C/path%3E %3C/g%3E%3C/svg%3E"); } #nr-search-summary #nr-btn-filters { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M4 7H20' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M7 12L17 12' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3Cpath d='M11 17H13' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3C/path%3E %3C/g%3E%3C/svg%3E"); color: #253746; cursor: pointer; border: 1px solid #E4E4E7; display: inline-block; margin: 0; padding: 0.5rem 1rem 0.5rem 2.75rem; font-size: 1rem; font-family: inherit; background-color: #fff; background-size: 1.5rem; background-position-x: 0.5rem; background-position-y: center; background-repeat: no-repeat; max-height: 3rem; } #nr-lbl-search-results { margin: 0 0.5rem 0 0; } #nr-search-box { display: flex; } #nr-search-box input { width: 100%; font-size: 1rem; font-family: inherit; padding: 1rem; border: 1px solid #E4E4E7; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: rgba(228, 228, 231, 0.4); } #nr-search-box button { background: var(--blue-mid); color: #fff; cursor: pointer; border: none; display: block; margin: 0; padding: 0.75rem 2rem; font-size: 1rem; font-family: inherit; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } .nr-banner { margin-bottom: 6rem; } .nr-banner .scrollable-banner-list { flex-wrap: nowrap; justify-content: left; } @media screen and (max-width: 800px) { .nr-banner .scrollable-banner-list { padding-bottom: 0 !important; } } .nr-banner .scrollable-banner-list li { cursor: pointer; display: block; background: transparent; padding: 0; width: 100%; flex: 1 0 100%; margin-bottom: 50px !important; } @media screen and (max-width: 800px) { .nr-banner .scrollable-banner-list li { margin-bottom: 0px !important; margin-block-end: 0; } } .nr-banner .scrollable-banner-list li a { text-decoration: none; color: var(--blue-dark); } .nr-banner .scrollable-banner-list li a:after { position: absolute; top: 0; left: 0; right: 0; bottom: 0; content: " "; } .nr-banner .scrollable-banner-list li h3 { font-size: 1.625rem; font-size: clamp(1.375rem, 4vw, 1.625rem); margin-top: 1.2rem; margin-bottom: 1.2rem; line-height: 1.2; text-wrap: pretty; font-weight: 600; } .nr-banner .scrollable-banner-list li .nr-label { text-transform: uppercase; color: var(--blue-mid); font-size: 0.875rem; } .nr-banner .scrollable-banner-list li .nr-date { font-size: 0.875rem; } .nr-banner .scrollable-banner-list li .nr-description { display: none; } .nr-banner .scrollable-banner-list li img { object-fit: cover; object-position: top; width: 100%; height: 500px; } @media screen and (max-width: 800px) { .nr-banner .scrollable-banner-list li img { height: auto; aspect-ratio: 16/9; } } .nr-banner .scrollable-banner-list li > div { box-sizing: border-box; background-color: white; text-align: center; padding: 1rem 3rem; border-radius: 2px; position: absolute; bottom: -50px; width: 800px; left: calc(50% - 400px); } @media screen and (max-width: 800px) { .nr-banner .scrollable-banner-list li > div { width: 100%; left: 0; bottom: 1rem; position: relative; } } .nr-banner .slider-buttons.slider-buttons-big { width: 100%; top: 250px; margin: 0; } .nr-banner .slider-buttons.slider-buttons-big button { background-color: white !important; border-radius: 2rem; cursor: pointer; } .nr-banner .slider-buttons.slider-buttons-big button:first-child { left: -1rem; position: absolute; } @media screen and (max-width: 800px) { .nr-banner .slider-buttons.slider-buttons-big button:first-child { left: -0.5rem; } } .nr-banner .slider-buttons.slider-buttons-big button:last-child { right: -1rem; position: absolute; } @media screen and (max-width: 800px) { .nr-banner .slider-buttons.slider-buttons-big button:last-child { right: -0.5rem; } } @media screen and (max-width: 800px) { .nr-banner .slider-buttons.slider-buttons-big svg { width: 1rem; height: 1rem; } } @media screen and (max-width: 800px) { .nr-banner .slider-buttons.slider-buttons-big { display: none; } } /* Tooltip container */ .tooltip { font-size: 0.75rem !important; padding: 0 !important; margin: 0 !important; border-radius: 1rem !important; width: 1.2rem; position: relative; } .tooltip:before { content: "i"; font-family: sans-serif; } .tooltip:focus { outline: none; background-color: var(--blue-light) !important; } .tooltip .tooltiptext { visibility: hidden; width: 160px; bottom: 100%; left: 50%; margin-left: -80px; /* Use half of the width (300/2 = 150), to center the tooltip */ margin-bottom: 0.4rem; color: #333; background-color: #F8F8F8; text-align: left; padding: 0.5rem; border-radius: 0.25rem; box-sizing: border-box; white-space: normal; box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1607843137); font-weight: 600; position: absolute; z-index: 1; } @media screen and (max-width: 389px) { .tooltip .tooltiptext { left: 0; position: fixed; bottom: -4rem; margin: 0; border-radius: 0; width: 100%; transition: bottom 0.8s; font-size: 0.75rem; padding: 0.5rem; } } .tooltip:hover .tooltiptext, .tooltip:focus .tooltiptext { visibility: visible; } @media screen and (max-width: 389px) { .tooltip:hover .tooltiptext, .tooltip:focus .tooltiptext { bottom: 0; } } .stacked-grid { gap: 24px; grid-template-columns: repeat(auto-fit, minmax(256px, 1fr)); display: grid; } .stacked-grid:has(> :last-child:nth-child(-n+2)) { /* don't fill up screen width if 2 cards or less */ grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); } .inside { background-color: #d8f0fa; padding: 10px 10px 30px 10px; text-align: center; font-weight: bold; font-size: 1em; display: block; min-height: 170px; } .newsroom .banner { position: relative; padding: calc(var(--content-padding-lr) * 3) var(--content-padding-lr) calc(var(--content-padding-lr) * 3); background: var(--blue-dark); color: white; } .newsroom .banner-content { max-width: var(--content-max-width); margin: 0 auto; } .newsroom .banner-title { margin: 0 auto; font-size: 3rem; font-size: clamp(1.375rem, 7vw, 3rem); font-weight: 700; position: relative; line-height: 1.3; } .newsroom-home .banner { display: none; } .header-newsroom { background-color: #FBFBFB; } .header-newsroom nav { max-width: calc(var(--content-max-width) + var(--content-padding-lr) * 2); margin: 0 auto; padding: 0 var(--content-padding-lr); } .header-newsroom nav ul, .header-newsroom nav li { list-style-type: none; padding: 0; margin: 0; } .header-newsroom nav ul { display: flex; } .header-newsroom nav li { align-self: center; line-height: 1; } .header-newsroom nav li a { text-decoration: none; color: var(--blue-dark); display: inline-block; margin: 0 1.7rem; font-size: 1.125rem; position: relative; } @media (min-width: 1024px) and (max-width: 1350px) { .header-newsroom nav li a { margin: 0 1rem; font-size: 0.9rem; } } .header-newsroom nav li a::after { content: ""; background-color: var(--blue-mid); display: block; width: 4rem; height: 3px; position: absolute; top: -1rem; left: 0; transform: scaleX(0); transform-origin: left top; opacity: 0; transition: all 0.4s; } .header-newsroom nav li a:hover::after { transform: scaleX(1); opacity: 1; } .header-newsroom nav li.current { font-weight: bold; } .header-newsroom nav li.current a::after { transform: scaleX(1); opacity: 1; } .header-newsroom nav li.blue-link { background-color: var(--blue-mid); margin: 0 1.5rem; border-radius: 5px; } @media (min-width: 1024px) and (max-width: 1350px) { .header-newsroom nav li.blue-link { margin: 0 0.75rem; } } .header-newsroom nav li.blue-link a { color: white; padding: 1.25rem 0; } .header-newsroom nav li.blue-link a:hover::after { transform: none; opacity: 0; } .header-newsroom nav li:not(:nth-last-child(-n+2)) { border-right: solid 1px #707070; } .header-newsroom nav li:first-child { flex-grow: 1; border-right: none; } .header-newsroom nav li:first-child a { margin: 0; } .header-newsroom nav li:first-child a:hover::after { transform: none; opacity: 0; } .header-newsroom nav li:first-child .landscape { display: inline; } .header-newsroom nav li:first-child .stacked { display: none; } .header-newsroom nav li:first-child img { max-width: 312px; height: auto; aspect-ratio: attr(width)/attr(height); margin: 2.5rem 0; } @media (min-width: 1024px) and (max-width: 1350px) { .header-newsroom nav li:first-child img { max-width: 260px; margin: 1rem 0; } } .header-newsroom nav button[aria-label=Search] { cursor: pointer; border: solid 1px transparent; background: transparent; padding: 0.6rem 1rem; color: var(--blue-dark); margin-left: 2.5rem; } @media (min-width: 1024px) and (max-width: 1400px) { .header-newsroom nav button[aria-label=Search] { margin-left: 0; } } .header-newsroom nav button[aria-label=Search] svg { width: 1.6rem; height: auto; } .header-newsroom nav #menuBtn { all: unset; color: black; vertical-align: middle; column-gap: 0.5rem; padding: 0.5rem; display: none; cursor: pointer; } .header-newsroom nav #menuBtn:focus { outline: auto; } .header-newsroom nav li a { margin: 0 1.2rem; font-size: 1rem; } @media (min-width: 1024px) and (max-width: 1350px) { .header-newsroom nav li a { margin: 0 1rem; font-size: 0.9rem; } } .header-newsroom nav li:first-child { display: flex; align-items: center; } .header-newsroom nav li:first-child a:first-child img { max-width: 9rem; height: auto; aspect-ratio: attr(width)/attr(height); margin: 2.5rem 0; } @media (min-width: 1024px) and (max-width: 1350px) { .header-newsroom nav li:first-child a:first-child img { max-width: 7.5rem; margin: 1rem 0; } } @media screen and (max-width: 1023px) { .header-newsroom nav li:first-child a:first-child img { max-width: 6.13rem; } } .header-newsroom nav li:first-child a:last-child { padding-left: 1.375rem; } .header-newsroom nav li:first-child a:last-child img { max-width: 9.125rem; height: auto; aspect-ratio: attr(width)/attr(height); margin: 2.5rem 0; } @media (min-width: 1024px) and (max-width: 1350px) { .header-newsroom nav li:first-child a:last-child img { max-width: 7.6rem; margin: 1rem 0; } } @media screen and (max-width: 1023px) { .header-newsroom nav li:first-child a:last-child img { max-width: 6.2rem; } } @media screen and (max-width: 1023px) { .header-newsroom nav li:first-child a:last-child { padding-left: 1rem; } } @media screen and (max-width: 1023px) { .header-newsroom nav li:first-child { justify-content: center; } } @media screen and (max-width: 1023px) { .header-newsroom nav { display: grid; grid-template-columns: 60px auto; } .header-newsroom nav #menuBtn { display: inline-flex; height: fit-content; width: fit-content; justify-self: self-start; align-self: center; } .header-newsroom nav ul li:first-child { text-align: center; } .header-newsroom nav ul li:first-child .landscape { display: none; } .header-newsroom nav ul li:first-child .stacked { display: inline; } .header-newsroom nav ul li:first-child img { width: auto; height: 3rem; aspect-ratio: attr(width)/attr(height); margin: 2.5rem 0; } .header-newsroom nav ul li.blue-link { background-color: var(--blue-mid); margin: 0; width: 6rem; text-align: center; } .header-newsroom nav ul li.blue-link a { padding: 0.5rem; font-size: 0.875rem; margin: 0; } .header-newsroom nav ul li:not(:first-child):not(:nth-last-child(2)) { display: none; } .header-newsroom nav ul li:first-child .landscape { display: inline; } .header-newsroom nav ul li:first-child img { height: 1.75rem; } .header-newsroom nav ul li:not(:first-child):not(:last-child) { display: none; } .header-newsroom nav ul li:last-child { display: list-item; } .header-newsroom nav ul button[aria-label=Search] { margin-left: 0; } } .footerNextgen { background-color: var(--blue-darkest); color: #EBEBEB; padding: 0 0 4rem; overflow-y: hidden; position: relative; container-type: inline-size; } @media screen and (min-width: 1024px) { .footerNextgen { padding: 5rem 0 4rem; } } .footerNextgen ul, .footerNextgen li { list-style-type: none; padding: 0; margin: 0; } .footerNextgen a { text-decoration: none; color: #EBEBEB; font-size: 1rem; } .footerNextgen section { position: relative; z-index: 2; } .footerNextgen .footer-links { max-width: 1200px; margin: 0 auto; padding: 0 var(--content-padding-lr); } .footerNextgen .footer-links > div { padding: 1rem 0; } @media screen and (min-width: 769px) { .footerNextgen .footer-links > div { border-bottom: 1px solid #464646; } } @media screen and (min-width: 1024px) { .footerNextgen .footer-links { display: grid; grid-template-rows: 1fr; grid-template-columns: 1fr 1fr 1.15fr 0.85fr 1fr; } .footerNextgen .footer-links > div:first-child { padding-left: 0; } .footerNextgen .footer-links > div:last-child { border-right: none; } } .footerNextgen .footer-links h2 { font-size: 1rem; } .footerNextgen .footer-links li { margin: 0.5rem 0; } .footerNextgen .general-links { max-width: 1200px; margin: 0 auto; padding: 0 var(--content-padding-lr); text-align: left; } .footerNextgen .general-links li { display: inline-block; padding: 0 0.4rem; text-align: left; line-height: 1; } .footerNextgen .general-links li a { font-size: 0.875rem; color: #CCCCCC; } .footerNextgen .general-links p { color: rgba(204, 204, 204, 0.6); font-size: 0.875rem; } .footerNextgen .general-links li:first-child { padding-left: 0; } .footerNextgen .general-links li:not(:last-child) { border-right: solid 1px rgba(255, 255, 255, 0.5); } @media screen and (min-width: 769px) { .footerNextgen .general-links { text-align: center; padding-top: 2rem; } } @media screen and (min-width: 1024px) { .footerNextgen .general-links { padding: 2rem var(--content-padding-lr); } .footerNextgen .general-links li { padding: 0 1rem; } } .footerNextgen a.icon-x { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' shape-rendering='geometricPrecision' text-rendering='geometricPrecision' image-rendering='optimizeQuality' fill-rule='evenodd' clip-rule='evenodd' viewBox='0 0 512 512'%3E%3Cpath fill='%23fff' d='M256 0c141.384 0 256 114.616 256 256 0 141.384-114.616 256-256 256C114.616 512 0 397.384 0 256 0 114.616 114.616 0 256 0zm62.64 157.549h33.401l-72.974 83.407 85.85 113.495h-67.222l-52.645-68.837-60.244 68.837h-33.422l78.051-89.212-82.352-107.69h68.924l47.59 62.916 55.043-62.916zm-11.724 176.908h18.509L205.95 176.494h-19.861l120.827 157.963z'/%3E%3C/svg%3E") no-repeat left center/contain; } .footerNextgen a.icon-linkedin { padding-left: 2rem; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23ffffff' d='M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z'/%3E%3C/svg%3E") no-repeat left center/contain; } .footerNextgen a.icon-facebook { padding-left: 2rem; background: transparent url("data:image/svg+xml,%3Csvg fill='%23ffffff' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M32 16c0-8.839-7.167-16-16-16-8.839 0-16 7.161-16 16 0 7.984 5.849 14.604 13.5 15.803v-11.177h-4.063v-4.625h4.063v-3.527c0-4.009 2.385-6.223 6.041-6.223 1.751 0 3.584 0.312 3.584 0.312v3.937h-2.021c-1.984 0-2.604 1.235-2.604 2.5v3h4.437l-0.713 4.625h-3.724v11.177c7.645-1.199 13.5-7.819 13.5-15.803z'%3E%3C/path%3E %3C/g%3E%3C/svg%3E") no-repeat left center/contain; } .footerNextgen { padding: 1rem 0; background-color: var(--blue-dark); } .footerNextgen .footer-links { display: block; } .footerNextgen .media-links h2 { font-size: 1.375rem; font-weight: 500; } .footerNextgen .media-links li a { font-size: 1.125rem; text-decoration: underline; } @media screen and (min-width: 769px) { .footerNextgen .media-links { display: flex; justify-content: center; align-items: center; } .footerNextgen .media-links li { display: inline-block; padding: 0 1rem; text-align: center; } .footerNextgen .media-links li:not(:last-child) { border-right: solid 1px rgba(255, 255, 255, 0.5); } } .footerNextgen .follow-links { margin-bottom: 2rem; } .footerNextgen .follow-links h2 { font-weight: 500; } .footerNextgen .follow-links li { margin: 1rem 0; } .footerNextgen .follow-links li a { padding-left: 2rem; } .footerNextgen .follow-links li a.icon-twitter { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ffffff' d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/%3E%3C/svg%3E") no-repeat left center/contain; } .footerNextgen .follow-links li a.icon-x { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' shape-rendering='geometricPrecision' text-rendering='geometricPrecision' image-rendering='optimizeQuality' fill-rule='evenodd' clip-rule='evenodd' viewBox='0 0 512 512'%3E%3Cpath fill='%23fff' d='M256 0c141.384 0 256 114.616 256 256 0 141.384-114.616 256-256 256C114.616 512 0 397.384 0 256 0 114.616 114.616 0 256 0zm62.64 157.549h33.401l-72.974 83.407 85.85 113.495h-67.222l-52.645-68.837-60.244 68.837h-33.422l78.051-89.212-82.352-107.69h68.924l47.59 62.916 55.043-62.916zm-11.724 176.908h18.509L205.95 176.494h-19.861l120.827 157.963z'/%3E%3C/svg%3E") no-repeat left center/contain; } .footerNextgen .follow-links li a.icon-linkedin { background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23ffffff' d='M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z'/%3E%3C/svg%3E") no-repeat left center/contain; } .footerNextgen .follow-links li a.icon-facebook { background: transparent url("data:image/svg+xml,%3Csvg fill='%23ffffff' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E %3Cpath d='M32 16c0-8.839-7.167-16-16-16-8.839 0-16 7.161-16 16 0 7.984 5.849 14.604 13.5 15.803v-11.177h-4.063v-4.625h4.063v-3.527c0-4.009 2.385-6.223 6.041-6.223 1.751 0 3.584 0.312 3.584 0.312v3.937h-2.021c-1.984 0-2.604 1.235-2.604 2.5v3h4.437l-0.713 4.625h-3.724v11.177c7.645-1.199 13.5-7.819 13.5-15.803z'%3E%3C/path%3E %3C/g%3E%3C/svg%3E") no-repeat left center/contain; } @media screen and (min-width: 769px) { .footerNextgen .follow-links { margin-bottom: 0; margin-left: 0; display: flex; align-items: center; justify-content: center; } .footerNextgen .follow-links li { margin: 0.5rem 0; display: inline-block; padding: 0 1rem; text-align: center; } .footerNextgen .follow-links li:not(:last-child) { border-right: solid 1px rgba(255, 255, 255, 0.5); } } .nr-preferred-container { margin-bottom: -2rem; } @media screen and (width > 1040px) { .nr-preferred-container { margin-bottom: -1.5rem; } } @media screen and (width > 1200px) { body.onthispage .nr-preferred-container { margin-bottom: -1.5rem; } } .nh-article-actions { padding: 0 0 0.5em 0; overflow: initial; text-align: right; position: relative; z-index: 1; } .nh-article-actions button { background-color: transparent; border: solid 1px transparent; font-family: inherit; } .nh-article-actions > button { padding: 0.5rem; color: #253746; } .nh-article-actions > button svg { width: 25px; height: 25px; vertical-align: middle; margin-right: 0.5rem; } .nh-article-actions > button span { vertical-align: middle; color: black; } #nh-article-share { margin-left: 1.2rem; } @media all and (-ms-high-contrast: none) { #nh-article-print { padding-left: 5.5em; } } #nh-share-options { text-align: left; width: fit-content; position: absolute; right: 0; background: #fbfbfb; border: solid 1px #ccc; border-radius: 3px; padding: 0.5em 0; margin-top: 0.5em; box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.2); } #nh-share-options ul { list-style: none; margin-right: initial; padding: 0; margin: 0; } #nh-share-options li { margin: 0; padding: 0; } #nh-share-options a { display: block; text-decoration: none; padding: 0.5em 1.2em; vertical-align: middle; font-size: 80%; color: #253746; } #nh-share-options a:hover { background-color: rgba(37, 55, 70, 0.11); } #nh-share-options a .share-icon { width: 1.5em; height: 1.5em; display: inline-block; vertical-align: middle; margin-right: 0.8em; color: #253746; } #nh-share-options a .share-icon svg { max-height: 18px; width: 20px; display: inline-block; } @media screen and (max-width: 768px) { .newsroom-article:not(.article) .asic-container:has(.asic-hero-banner) { width: 100%; } } .newsroom-article .asic-page__article .callout { border-left: 8px solid #263746; color: #222; font-size: 1.5em !important; font-weight: 700; line-height: 1.2; padding-left: 1em; padding-bottom: 0; margin: 1.5em 0; } .newsroom-article .asic-page__article .callout:after { content: unset; } .newsroom-article .asic-banner { align-items: start; } .newsroom-article .asic-banner__content { gap: var(--asic-space-16); } .newsroom-article .asic-banner__content .asic-text-display { font-size: 2.5rem; font-size: clamp(1.375rem, 7vw, 2.5rem); letter-spacing: -1px; line-height: 1.25; overflow-wrap: anywhere; } .newsroom-article .asic-banner__content .nh-time { font-size: 1rem; font-size: clamp(0.875rem, 2vw, 1rem); } .newsroom-article .asic-banner__media { max-width: 220px; } .newsroom-article .asic-banner__media img { border: solid 1px #ccc; border-radius: 5px; } .newsroom-article.media-release .asic-hero-banner { background-color: #daf4f5; } .newsroom-article.news-item .asic-hero-banner { background-color: #daf4f5; } .newsroom-article.speech .asic-hero-banner { background-color: #EFEFEF; } .newsroom-article.speech .nh-key-points { border-color: #EFEFEF; } .newsroom-article.article .asic-hero-banner { background-color: transparent; } .newsroom-article.article .asic-banner { margin: 0; grid-template-areas: "header" "content" "media"; } .newsroom-article.article .asic-banner__media { padding-top: 3rem; max-width: 100%; } .newsroom-article.article .asic-banner__media img { border: none; aspect-ratio: 5/2; object-fit: cover; } .newsroom-article .asic-page { padding-top: 0; } .newsroom-article .nh-mr-type { color: var(--static-brand-blue); text-transform: uppercase; font-size: 1rem; font-size: clamp(0.875rem, 2vw, 1rem); font-weight: 500; margin-right: 1rem; } .newsroom-article .nh-mr-id { font-size: 1rem; font-size: clamp(0.875rem, 2vw, 1rem); font-weight: 500; } .newsroom-article .nh-article-description { margin: 0; font-size: 1.325rem; font-size: clamp(1rem, 2vw, 1.325rem); } .newsroom-article .nh-mr-date { font-weight: 700; } .newsroom-article .nh-key-points { background-color: rgba(209, 204, 189, 0.1019607843); padding: 1.5rem; padding: clamp(0.5rem, 3vw, 1.5rem); border: solid 3rem #daf4f5; border-top: none; border-bottom: solid 2rem #daf4f5; } .newsroom-article .nh-key-points h2 { text-transform: uppercase; font-size: 1em; color: #0772CE; margin-top: 0; } .newsroom-article .nh-key-points ul { margin: 0; padding: 0; } .newsroom-article .nh-key-points li { padding: 0; margin: 1rem 1rem 1rem 1.5rem; } .newsroom-article .nh-disclaimer-container { background-color: #f8f7f5; padding: 1rem; font-size: 0.9rem; margin-top: 4rem; } .newsroom-article .nh-article-tags-heading { display: inline-block; margin: 0; margin-right: 1rem; vertical-align: middle; font-size: 1rem; } :root { --asic-container-narrow-max-newsroom: 890px; } @media (width > 1200px) { .newsroom-article .asic-container-narrow:has(.asic-page__aside) { width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-narrow-max-newsroom) + var(--asic-space-256)); margin-inline-end: 0; margin-inline-start: calc(50% - var(--asic-container-narrow-max-newsroom) / 2); } } @media (width > 1200px) { .newsroom-article .asic-page:not(:has(.asic-page__sidebar)) .asic-page__main:has(.asic-page__aside) { grid-template-columns: 70ch var(--asic-space-256); } } @media (width > 1800px) { .newsroom-article .asic-page:not(:has(.asic-page__sidebar)) .asic-page__main:has(.asic-page__aside) { grid-template-columns: var(--asic-container-narrow-max-newsroom) var(--asic-space-256); } } @media (width > 768px) { .newsroom-article .asic-page:not(:has(.asic-page__sidebar)) { max-width: var(--asic-container-narrow-max-newsroom); } .newsroom-article .asic-page:not(:has(.asic-page__sidebar)) .asic-page__article { max-width: none; } } .newsroom-article .asic-container-narrow { width: min(100% - var(--asic-container-gutter) * 2, var(--asic-container-narrow-max-newsroom)); } @layer base { :root { --asic-space-360: 360px; --asic-container-narrow-max: 1100px; --asic-content-container-max: 80ch; --static-brand-navy: #253746; --static-brand-sky-lighter: #B2E2F5; --static-brand-gold: #D1CCBD; --static-brand-gold-lighter: #DEDEDA; } } @layer components { .asic-root { --asic-sidebar-width: clamp(var(--asic-space-256), 23%, var(--asic-space-360)); --asic-content-gap-x: clamp(var(--asic-space-12), 4vw, var(--asic-space-48)); } @media (width > 768px) { .asic-root { --asic-container-max: 1640px; } } } @media (width > 768px) { body:not(.hub-nav) .asic-page { max-width: var(--asic-container-narrow-max); } body:not(.hub-nav) .asic-page:has(.asic-page__sidebar) { max-width: none; column-gap: clamp(var(--asic-space-12), 5vw, var(--asic-space-48)); } } .asic-page__article a:not(.asic-button, .asic-card__title-link, .nh-list-tag, .asic-tag, .asic-status-badge) { color: var(--asic-color-text-link); } .asic-page__article .take-action { text-wrap: wrap; } .asic-page__article .take-action a { color: var(--asic-color-text-inverse); text-decoration: none; } .asic-external-link-icon { padding: 0 4px; position: relative; top: 3px; } body:not(.expand-screen, .form) .asic-page__article { max-width: var(--asic-content-container-max); } #breadcrumbsTop { padding-top: var(--asic-space-24); padding-bottom: var(--asic-space-24); } body.form .asic-container-report { border-bottom: 10px solid var(--static-brand-navy); } body.form .asic-hero-banner { background-color: var(--asic-color-background-alt); } body.form .asic-text-subtitle { color: var(--asic-color-text-muted); background-color: var(--static-brand-aqua); } body.form .asic-page { padding-block: 0 calc(var(--asic-content-gutter) * 2); } body.form .asic-page__main { row-gap: 0; } body.form .asic-table :where(th, td, a) { font: unset; } body.info-sheet .asic-page__sidebar { display: none; } @media (width > 768px) { body.info-sheet .asic-page:has(.asic-page__sidebar) { grid-template-columns: unset; } } body.sticky-nav .asic-container-top-nav { position: sticky; top: 0; background-color: white; z-index: 5; } body.sticky-nav .asic-pagenav { top: 8rem; } .asic-container-report .asic-text-subtitle { display: inline-block; position: absolute; top: 0; color: var(--asic-color-text-muted); background-color: rgba(255, 255, 255, 0.9); font-size: 1rem; padding: 0.75rem 1rem 0.75rem 3.5rem; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' class='icon' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath fill='%23253746' d='M832 384H576V128H192v768h640V384zm-26.496-64L640 154.496V320h165.504zM160 64h480l256 256v608a32 32 0 01-32 32H160a32 32 0 01-32-32V96a32 32 0 0132-32zm160 448h384v64H320v-64zm0-192h160v64H320v-64zm0 384h384v64H320v-64z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: 2rem; background-position-y: center; background-position-x: 0.75rem; border-bottom-left-radius: 0.4rem; border-bottom-right-radius: 0.4rem; } .asic-container-report .asic-text-subtitle:first-letter { text-transform: capitalize; } button#btn-header-search { cursor: pointer; border: solid 1px transparent; background: transparent; color: var(--asic-color-text); align-items: center; gap: var(--asic-space-8); font: var(--asic-text-body-shorthand); height: var(--item-height); padding: 0 var(--asic-space-16); white-space: nowrap; text-decoration: none; display: flex; position: relative; } .grid-container .asic-text-title { margin-block-end: var(--asic-space-16); } .asic-container-top-nav { box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137); } @media (width <= 1155px) { .asic-container-top-nav { overflow-x: auto; } } .asic-columns-3 { columns: 3 auto; } .asic-sticky-content { position: sticky; background-color: var(--static-gray-1); border-top: 1px solid var(--static-gray-3); inset-block-end: 0; text-align: center; width: 100%; } .asic-end-block { position: relative; background-color: var(--static-gray-1); border-top: 1px solid var(--static-gray-3); inset-block-end: 0; width: 100%; } .asic-end-block .asic-container { max-width: var(--asic-container-narrow-max); } [data-fee]:empty { display: inline-block; width: 1.5rem; border: 1px dashed color-mix(in srgb, currentcolor 33%, var(--asic-color-background)); } iframe[src*="youtube.com"] { max-width: 100%; } @media (width <= 768px) { /* for 'on this page' accordion */ .asic-accordion-onthispage .asic-accordion__title { padding: 15px; } .asic-accordion-onthispage .asic-pagenav__item-link { padding: 0 0 10px 15px; margin-left: 0px; margin-top: 0.5rem; } .asic-accordion-onthispage .asic-pagenav { margin-left: 15px; padding-left: 5px; margin-bottom: 15px; } } /* #newMenu { display: none; } .asic-mainnav__primary { position: relative; } #asic-demo-mainnav { ul { } li { position: unset; display: inline-block; padding: 5px 10px; //position: relative; } li:hover > ul { display: block; } ul ul { position: absolute; left: 0; width: 800px; display: none; margin: 0; padding: 5px 10px; z-index: 10; background-color: var(--static-gray-2); li:hover { background-color: var(--static-gray-4); } } ul ul li { display: block; width: 350px; } ul ul ul { position: absolute; top: 0; left: 400px; width: 400px; } } */ /*# sourceMappingURL=asic.css.map */