img:is([sizes=auto i],[sizes^="auto," i]){contain-intrinsic-size:3000px 1500px}    @layer bricks {.brxe-button{width:auto}} /*! This file is auto-generated */ .x-block-button__link{color:#fff;background-color:#32373c;border-radius:9999px;box-shadow:none;text-decoration:none;padding:calc(.667em + 2px) calc(1.333em + 2px);font-size:1.125em}.x-block-file__button{background:#32373c;color:#fff;text-decoration:none}   .overflow-detection *:not(#wpadminbar, #wpadminbar *), .overflow-detection *:not(#wpadminbar, #wpadminbar *)::before, .overflow-detection *:not(#wpadminbar, #wpadminbar *)::after { outline: 2px solid crimson !important; background: color-mix(in oklab, crimson, transparent 97%) !important; } :root, .color-scheme--main { --primary-hex: #021B3A; --primary-hsl: 213 93% 12%; --primary-rgb: 2 27 58; --primary-r: 2; --primary-g: 27; --primary-b: 58; --primary-h: 213; --primary-s: 93%; --primary-l: 12%; --primary-hover-h: 213; --primary-hover-s: 93%; --primary-hover-l: 14%; --primary-ultra-light-h: 213; --primary-ultra-light-s: 93%; --primary-ultra-light-l: 95%; --primary-light-h: 213; --primary-light-s: 93%; --primary-light-l: 85%; --primary-semi-light-h: 213; --primary-semi-light-s: 93%; --primary-semi-light-l: 65%; --primary-semi-dark-h: 213; --primary-semi-dark-s: 93%; --primary-semi-dark-l: 35%; --primary-dark-h: 213; --primary-dark-s: 93%; --primary-dark-l: 25%; --primary-ultra-dark-h: 213; --primary-ultra-dark-s: 93%; --primary-ultra-dark-l: 10%; --secondary-hex: #023D7F; --secondary-hsl: 212 97% 25%; --secondary-rgb: 2 61 127; --secondary-r: 2; --secondary-g: 61; --secondary-b: 127; --secondary-h: 212; --secondary-s: 97%; --secondary-l: 25%; --secondary-hover-h: 212; --secondary-hover-s: 97%; --secondary-hover-l: 29%; --secondary-ultra-light-h: 212; --secondary-ultra-light-s: 97%; --secondary-ultra-light-l: 95%; --secondary-light-h: 212; --secondary-light-s: 97%; --secondary-light-l: 85%; --secondary-semi-light-h: 212; --secondary-semi-light-s: 97%; --secondary-semi-light-l: 65%; --secondary-semi-dark-h: 212; --secondary-semi-dark-s: 97%; --secondary-semi-dark-l: 35%; --secondary-dark-h: 212; --secondary-dark-s: 97%; --secondary-dark-l: 25%; --secondary-ultra-dark-h: 212; --secondary-ultra-dark-s: 97%; --secondary-ultra-dark-l: 10%; --tertiary-hex: #0FBCF5; --tertiary-hsl: 195 92% 51%; --tertiary-rgb: 15 188 245; --tertiary-r: 15; --tertiary-g: 188; --tertiary-b: 245; --tertiary-h: 195; --tertiary-s: 92%; --tertiary-l: 51%; --tertiary-hover-h: 195; --tertiary-hover-s: 92%; --tertiary-hover-l: 59%; --tertiary-ultra-light-h: 193; --tertiary-ultra-light-s: 61%; --tertiary-ultra-light-l: 95%; --tertiary-light-h: 195; --tertiary-light-s: 92%; --tertiary-light-l: 85%; --tertiary-semi-light-h: 195; --tertiary-semi-light-s: 92%; --tertiary-semi-light-l: 65%; --tertiary-semi-dark-h: 195; --tertiary-semi-dark-s: 92%; --tertiary-semi-dark-l: 35%; --tertiary-dark-h: 195; --tertiary-dark-s: 92%; --tertiary-dark-l: 25%; --tertiary-ultra-dark-h: 195; --tertiary-ultra-dark-s: 92%; --tertiary-ultra-dark-l: 10%; --accent-hex: #076ac7; --accent-hsl: 209 93% 40%; --accent-rgb: 7 106 199; --accent-r: 7; --accent-g: 106; --accent-b: 199; --accent-h: 209; --accent-s: 93%; --accent-l: 40%; --accent-hover-h: 209; --accent-hover-s: 93%; --accent-hover-l: 46%; --accent-ultra-light-h: 209; --accent-ultra-light-s: 93%; --accent-ultra-light-l: 95%; --accent-light-h: 209; --accent-light-s: 93%; --accent-light-l: 85%; --accent-semi-light-h: 209; --accent-semi-light-s: 93%; --accent-semi-light-l: 65%; --accent-semi-dark-h: 209; --accent-semi-dark-s: 93%; --accent-semi-dark-l: 35%; --accent-dark-h: 209; --accent-dark-s: 93%; --accent-dark-l: 25%; --accent-ultra-dark-h: 209; --accent-ultra-dark-s: 93%; --accent-ultra-dark-l: 10%; --neutral-hex: #000000; --neutral-hsl: 0 0% 0%; --neutral-rgb: 0 0 0; --neutral-r: 0; --neutral-g: 0; --neutral-b: 0; --neutral-h: 0; --neutral-s: 0%; --neutral-l: 0%; --neutral-hover-h: 0; --neutral-hover-s: 0%; --neutral-hover-l: 0%; --neutral-ultra-light-h: 0; --neutral-ultra-light-s: 0%; --neutral-ultra-light-l: 97%; --neutral-light-h: 0; --neutral-light-s: 0%; --neutral-light-l: 85%; --neutral-semi-light-h: 0; --neutral-semi-light-s: 0%; --neutral-semi-light-l: 65%; --neutral-semi-dark-h: 0; --neutral-semi-dark-s: 0%; --neutral-semi-dark-l: 35%; --neutral-dark-h: 0; --neutral-dark-s: 0%; --neutral-dark-l: 25%; --neutral-ultra-dark-h: 0; --neutral-ultra-dark-s: 0%; --neutral-ultra-dark-l: 13%; --primary: #021B3A; --primary-hover: #022045; --primary-ultra-light: #e6f1fe; --primary-light: #b5d5fc; --primary-semi-light: #539df9; --primary-semi-dark: #0651ac; --primary-dark: #043a7b; --primary-ultra-dark: #021731; --secondary: #023D7F; --secondary-hover: #024592; --secondary-ultra-light: #e6f1ff; --secondary-light: #b4d6fe; --secondary-semi-light: #4fa0fc; --secondary-semi-dark: #0353b0; --secondary-dark: #023c7e; --secondary-ultra-dark: #011832; --tertiary: #0FBCF5; --tertiary-hover: #36c7f7; --tertiary-ultra-light: #eaf7fa; --tertiary-light: #b6eafc; --tertiary-semi-light: #54cff8; --tertiary-semi-dark: #0782ab; --tertiary-dark: #055d7a; --tertiary-ultra-dark: #022531; --accent: #076ac7; --accent-hover: #0879e2; --accent-ultra-light: #e6f3fe; --accent-light: #b5dafc; --accent-semi-light: #53a9f9; --accent-semi-dark: #065cac; --accent-dark: #04427b; --accent-ultra-dark: #021a31; --neutral: #000000; --neutral-hover: black; --neutral-ultra-light: #f7f7f7; --neutral-light: #d9d9d9; --neutral-semi-light: #a6a6a6; --neutral-semi-dark: #595959; --neutral-dark: #404040; --neutral-ultra-dark: #212121; --white: #fff; --black: #000; --primary-trans-10: rgba(2, 27, 58, 0.1); --primary-trans-20: rgba(2, 27, 58, 0.2); --primary-trans-30: rgba(2, 27, 58, 0.3); --primary-trans-40: rgba(2, 27, 58, 0.4); --primary-trans-50: rgba(2, 27, 58, 0.5); --primary-trans-60: rgba(2, 27, 58, 0.6); --primary-trans-70: rgba(2, 27, 58, 0.7); --primary-trans-80: rgba(2, 27, 58, 0.8); --primary-trans-90: rgba(2, 27, 58, 0.9); --primary-light-trans-10: rgba(181, 213, 252, 0.1); --primary-light-trans-20: rgba(181, 213, 252, 0.2); --primary-light-trans-30: rgba(181, 213, 252, 0.3); --primary-light-trans-40: rgba(181, 213, 252, 0.4); --primary-light-trans-50: rgba(181, 213, 252, 0.5); --primary-light-trans-60: rgba(181, 213, 252, 0.6); --primary-light-trans-70: rgba(181, 213, 252, 0.7); --primary-light-trans-80: rgba(181, 213, 252, 0.8); --primary-light-trans-90: rgba(181, 213, 252, 0.9); --primary-dark-trans-10: rgba(4, 58, 123, 0.1); --primary-dark-trans-20: rgba(4, 58, 123, 0.2); --primary-dark-trans-30: rgba(4, 58, 123, 0.3); --primary-dark-trans-40: rgba(4, 58, 123, 0.4); --primary-dark-trans-50: rgba(4, 58, 123, 0.5); --primary-dark-trans-60: rgba(4, 58, 123, 0.6); --primary-dark-trans-70: rgba(4, 58, 123, 0.7); --primary-dark-trans-80: rgba(4, 58, 123, 0.8); --primary-dark-trans-90: rgba(4, 58, 123, 0.9); --primary-ultra-dark-trans-10: rgba(2, 23, 49, 0.1); --primary-ultra-dark-trans-20: rgba(2, 23, 49, 0.2); --primary-ultra-dark-trans-30: rgba(2, 23, 49, 0.3); --primary-ultra-dark-trans-40: rgba(2, 23, 49, 0.4); --primary-ultra-dark-trans-50: rgba(2, 23, 49, 0.5); --primary-ultra-dark-trans-60: rgba(2, 23, 49, 0.6); --primary-ultra-dark-trans-70: rgba(2, 23, 49, 0.7); --primary-ultra-dark-trans-80: rgba(2, 23, 49, 0.8); --primary-ultra-dark-trans-90: rgba(2, 23, 49, 0.9); --secondary-trans-10: rgba(2, 61, 127, 0.1); --secondary-trans-20: rgba(2, 61, 127, 0.2); --secondary-trans-30: rgba(2, 61, 127, 0.3); --secondary-trans-40: rgba(2, 61, 127, 0.4); --secondary-trans-50: rgba(2, 61, 127, 0.5); --secondary-trans-60: rgba(2, 61, 127, 0.6); --secondary-trans-70: rgba(2, 61, 127, 0.7); --secondary-trans-80: rgba(2, 61, 127, 0.8); --secondary-trans-90: rgba(2, 61, 127, 0.9); --secondary-light-trans-10: rgba(180, 214, 254, 0.1); --secondary-light-trans-20: rgba(180, 214, 254, 0.2); --secondary-light-trans-30: rgba(180, 214, 254, 0.3); --secondary-light-trans-40: rgba(180, 214, 254, 0.4); --secondary-light-trans-50: rgba(180, 214, 254, 0.5); --secondary-light-trans-60: rgba(180, 214, 254, 0.6); --secondary-light-trans-70: rgba(180, 214, 254, 0.7); --secondary-light-trans-80: rgba(180, 214, 254, 0.8); --secondary-light-trans-90: rgba(180, 214, 254, 0.9); --secondary-dark-trans-10: rgba(2, 60, 126, 0.1); --secondary-dark-trans-20: rgba(2, 60, 126, 0.2); --secondary-dark-trans-30: rgba(2, 60, 126, 0.3); --secondary-dark-trans-40: rgba(2, 60, 126, 0.4); --secondary-dark-trans-50: rgba(2, 60, 126, 0.5); --secondary-dark-trans-60: rgba(2, 60, 126, 0.6); --secondary-dark-trans-70: rgba(2, 60, 126, 0.7); --secondary-dark-trans-80: rgba(2, 60, 126, 0.8); --secondary-dark-trans-90: rgba(2, 60, 126, 0.9); --secondary-ultra-dark-trans-10: rgba(1, 24, 50, 0.1); --secondary-ultra-dark-trans-20: rgba(1, 24, 50, 0.2); --secondary-ultra-dark-trans-30: rgba(1, 24, 50, 0.3); --secondary-ultra-dark-trans-40: rgba(1, 24, 50, 0.4); --secondary-ultra-dark-trans-50: rgba(1, 24, 50, 0.5); --secondary-ultra-dark-trans-60: rgba(1, 24, 50, 0.6); --secondary-ultra-dark-trans-70: rgba(1, 24, 50, 0.7); --secondary-ultra-dark-trans-80: rgba(1, 24, 50, 0.8); --secondary-ultra-dark-trans-90: rgba(1, 24, 50, 0.9); --tertiary-trans-10: rgba(15, 188, 245, 0.1); --tertiary-trans-20: rgba(15, 188, 245, 0.2); --tertiary-trans-30: rgba(15, 188, 245, 0.3); --tertiary-trans-40: rgba(15, 188, 245, 0.4); --tertiary-trans-50: rgba(15, 188, 245, 0.5); --tertiary-trans-60: rgba(15, 188, 245, 0.6); --tertiary-trans-70: rgba(15, 188, 245, 0.7); --tertiary-trans-80: rgba(15, 188, 245, 0.8); --tertiary-trans-90: rgba(15, 188, 245, 0.9); --tertiary-light-trans-10: rgba(182, 234, 252, 0.1); --tertiary-light-trans-20: rgba(182, 234, 252, 0.2); --tertiary-light-trans-30: rgba(182, 234, 252, 0.3); --tertiary-light-trans-40: rgba(182, 234, 252, 0.4); --tertiary-light-trans-50: rgba(182, 234, 252, 0.5); --tertiary-light-trans-60: rgba(182, 234, 252, 0.6); --tertiary-light-trans-70: rgba(182, 234, 252, 0.7); --tertiary-light-trans-80: rgba(182, 234, 252, 0.8); --tertiary-light-trans-90: rgba(182, 234, 252, 0.9); --tertiary-dark-trans-10: rgba(5, 93, 122, 0.1); --tertiary-dark-trans-20: rgba(5, 93, 122, 0.2); --tertiary-dark-trans-30: rgba(5, 93, 122, 0.3); --tertiary-dark-trans-40: rgba(5, 93, 122, 0.4); --tertiary-dark-trans-50: rgba(5, 93, 122, 0.5); --tertiary-dark-trans-60: rgba(5, 93, 122, 0.6); --tertiary-dark-trans-70: rgba(5, 93, 122, 0.7); --tertiary-dark-trans-80: rgba(5, 93, 122, 0.8); --tertiary-dark-trans-90: rgba(5, 93, 122, 0.9); --tertiary-ultra-dark-trans-10: rgba(2, 37, 49, 0.1); --tertiary-ultra-dark-trans-20: rgba(2, 37, 49, 0.2); --tertiary-ultra-dark-trans-30: rgba(2, 37, 49, 0.3); --tertiary-ultra-dark-trans-40: rgba(2, 37, 49, 0.4); --tertiary-ultra-dark-trans-50: rgba(2, 37, 49, 0.5); --tertiary-ultra-dark-trans-60: rgba(2, 37, 49, 0.6); --tertiary-ultra-dark-trans-70: rgba(2, 37, 49, 0.7); --tertiary-ultra-dark-trans-80: rgba(2, 37, 49, 0.8); --tertiary-ultra-dark-trans-90: rgba(2, 37, 49, 0.9); --accent-trans-10: rgba(7, 106, 199, 0.1); --accent-trans-20: rgba(7, 106, 199, 0.2); --accent-trans-30: rgba(7, 106, 199, 0.3); --accent-trans-40: rgba(7, 106, 199, 0.4); --accent-trans-50: rgba(7, 106, 199, 0.5); --accent-trans-60: rgba(7, 106, 199, 0.6); --accent-trans-70: rgba(7, 106, 199, 0.7); --accent-trans-80: rgba(7, 106, 199, 0.8); --accent-trans-90: rgba(7, 106, 199, 0.9); --accent-light-trans-10: rgba(181, 218, 252, 0.1); --accent-light-trans-20: rgba(181, 218, 252, 0.2); --accent-light-trans-30: rgba(181, 218, 252, 0.3); --accent-light-trans-40: rgba(181, 218, 252, 0.4); --accent-light-trans-50: rgba(181, 218, 252, 0.5); --accent-light-trans-60: rgba(181, 218, 252, 0.6); --accent-light-trans-70: rgba(181, 218, 252, 0.7); --accent-light-trans-80: rgba(181, 218, 252, 0.8); --accent-light-trans-90: rgba(181, 218, 252, 0.9); --accent-dark-trans-10: rgba(4, 66, 123, 0.1); --accent-dark-trans-20: rgba(4, 66, 123, 0.2); --accent-dark-trans-30: rgba(4, 66, 123, 0.3); --accent-dark-trans-40: rgba(4, 66, 123, 0.4); --accent-dark-trans-50: rgba(4, 66, 123, 0.5); --accent-dark-trans-60: rgba(4, 66, 123, 0.6); --accent-dark-trans-70: rgba(4, 66, 123, 0.7); --accent-dark-trans-80: rgba(4, 66, 123, 0.8); --accent-dark-trans-90: rgba(4, 66, 123, 0.9); --accent-ultra-dark-trans-10: rgba(2, 26, 49, 0.1); --accent-ultra-dark-trans-20: rgba(2, 26, 49, 0.2); --accent-ultra-dark-trans-30: rgba(2, 26, 49, 0.3); --accent-ultra-dark-trans-40: rgba(2, 26, 49, 0.4); --accent-ultra-dark-trans-50: rgba(2, 26, 49, 0.5); --accent-ultra-dark-trans-60: rgba(2, 26, 49, 0.6); --accent-ultra-dark-trans-70: rgba(2, 26, 49, 0.7); --accent-ultra-dark-trans-80: rgba(2, 26, 49, 0.8); --accent-ultra-dark-trans-90: rgba(2, 26, 49, 0.9); --neutral-trans-10: rgba(0, 0, 0, 0.1); --neutral-trans-20: rgba(0, 0, 0, 0.2); --neutral-trans-30: rgba(0, 0, 0, 0.3); --neutral-trans-40: rgba(0, 0, 0, 0.4); --neutral-trans-50: rgba(0, 0, 0, 0.5); --neutral-trans-60: rgba(0, 0, 0, 0.6); --neutral-trans-70: rgba(0, 0, 0, 0.7); --neutral-trans-80: rgba(0, 0, 0, 0.8); --neutral-trans-90: rgba(0, 0, 0, 0.9); --neutral-light-trans-10: rgba(217, 217, 217, 0.1); --neutral-light-trans-20: rgba(217, 217, 217, 0.2); --neutral-light-trans-30: rgba(217, 217, 217, 0.3); --neutral-light-trans-40: rgba(217, 217, 217, 0.4); --neutral-light-trans-50: rgba(217, 217, 217, 0.5); --neutral-light-trans-60: rgba(217, 217, 217, 0.6); --neutral-light-trans-70: rgba(217, 217, 217, 0.7); --neutral-light-trans-80: rgba(217, 217, 217, 0.8); --neutral-light-trans-90: rgba(217, 217, 217, 0.9); --neutral-dark-trans-10: rgba(64, 64, 64, 0.1); --neutral-dark-trans-20: rgba(64, 64, 64, 0.2); --neutral-dark-trans-30: rgba(64, 64, 64, 0.3); --neutral-dark-trans-40: rgba(64, 64, 64, 0.4); --neutral-dark-trans-50: rgba(64, 64, 64, 0.5); --neutral-dark-trans-60: rgba(64, 64, 64, 0.6); --neutral-dark-trans-70: rgba(64, 64, 64, 0.7); --neutral-dark-trans-80: rgba(64, 64, 64, 0.8); --neutral-dark-trans-90: rgba(64, 64, 64, 0.9); --neutral-ultra-dark-trans-10: rgba(33, 33, 33, 0.1); --neutral-ultra-dark-trans-20: rgba(33, 33, 33, 0.2); --neutral-ultra-dark-trans-30: rgba(33, 33, 33, 0.3); --neutral-ultra-dark-trans-40: rgba(33, 33, 33, 0.4); --neutral-ultra-dark-trans-50: rgba(33, 33, 33, 0.5); --neutral-ultra-dark-trans-60: rgba(33, 33, 33, 0.6); --neutral-ultra-dark-trans-70: rgba(33, 33, 33, 0.7); --neutral-ultra-dark-trans-80: rgba(33, 33, 33, 0.8); --neutral-ultra-dark-trans-90: rgba(33, 33, 33, 0.9); --white-trans-10: rgba(255, 255, 255, 0.1); --white-trans-20: rgba(255, 255, 255, 0.2); --white-trans-30: rgba(255, 255, 255, 0.3); --white-trans-40: rgba(255, 255, 255, 0.4); --white-trans-50: rgba(255, 255, 255, 0.5); --white-trans-60: rgba(255, 255, 255, 0.6); --white-trans-70: rgba(255, 255, 255, 0.7); --white-trans-80: rgba(255, 255, 255, 0.8); --white-trans-90: rgba(255, 255, 255, 0.9); --black-trans-10: rgba(0, 0, 0, 0.1); --black-trans-20: rgba(0, 0, 0, 0.2); --black-trans-30: rgba(0, 0, 0, 0.3); --black-trans-40: rgba(0, 0, 0, 0.4); --black-trans-50: rgba(0, 0, 0, 0.5); --black-trans-60: rgba(0, 0, 0, 0.6); --black-trans-70: rgba(0, 0, 0, 0.7); --black-trans-80: rgba(0, 0, 0, 0.8); --black-trans-90: rgba(0, 0, 0, 0.9); --shade-white: #fff; --shade-black: #000; --bg-ultra-light: var(--neutral-ultra-light); --bg-light: var(--neutral-light); --bg-dark: var(--neutral-dark); --bg-ultra-dark: var(--neutral-ultra-dark); --text-light: var(--white); --text-light-muted: var(--white-trans-80); --text-dark: var(--black); --text-dark-muted: var(--black-trans-80); --body-bg-color: var(--white); --body-color: var(--neutral-dark); --heading-color: var(--primary); } :root { --on: initial; --off: ; --section-padding-x: 2rem; --section-padding-block: var(--section-space-m); --section-gutter: 2rem; --gutter: 2rem; --text-xs: 1.26rem; --text-s: 1.42rem; --text-m: 1.8rem; --text-l: 2.025rem; --text-xl: 2.28rem; --text-xxl: 2.565rem; --root-font-size: 62.5%; --h6: 1.26rem; --h5: 1.42rem; --h4: 1.8rem; --h3: 2.025rem; --h2: 2.28rem; --h1: 2.565rem; --space-xs: 1.896rem; --space-s: 2.133rem; --space-m: 2.4rem; --space-l: 2.7rem; --space-xl: 3.038rem; --space-xxl: 3.42rem; --section-space-xs: 3.84rem; --section-space-s: 4.8rem; --section-space-m: 6rem; --section-space-l: 7.5rem; --section-space-xl: 9.375rem; --section-space-xxl: 11.719rem; --content-width: 136.6rem; --content-width-safe: min(var(--content-width), calc(100% - var(--gutter) * 2)); --width-xs: calc(var(--content-width) * 0.1); --width-s: calc(var(--content-width) * 0.2); --width-m: calc(var(--content-width) * 0.4); --width-l: calc(var(--content-width) * 0.6); --width-xl: calc(var(--content-width) * 0.8); --width-xxl: calc(var(--content-width) * 0.9); --width-vp-max: calc(var(--content-width) * 1); --width-content: calc(var(--content-width) * 1); --width-full: calc(var(--content-width) * 100%); --width-10: calc(var(--content-width) * 0.1); --width-20: calc(var(--content-width) * 0.2); --width-30: calc(var(--content-width) * 0.3); --width-40: calc(var(--content-width) * 0.4); --width-50: calc(var(--content-width) * 0.5); --width-60: calc(var(--content-width) * 0.6); --width-70: calc(var(--content-width) * 0.7); --width-80: calc(var(--content-width) * 0.8); --width-90: calc(var(--content-width) * 0.9); --focus-color: var(--primary); --focus-width: 2px; --focus-offset: 2px; --box-shadow-m: 0 0 40px var(--black-trans-10); --box-shadow-l: 0 0 60px var(--black-trans-20); --box-shadow-xl: 0 0 80px var(--black-trans-30); --box-shadow-1: 0 0 40px var(--black-trans-10); --box-shadow-2: 0 0 60px var(--black-trans-20); --box-shadow-3: 0 0 80px var(--black-trans-30); --admin-bar-height: var(--x-admin--admin-bar--height, 0px); --text-xxl-max-width: 100%; --text-xl-max-width: 100%; --text-l-max-width: 100%; --text-m-font-weight: 400; --text-m-line-height: calc(10px + 2ex); --text-m-max-width: 100%; --text-s-max-width: 100%; --text-xs-max-width: 100%; --base-text-lh: calc(10px + 2ex); --heading-font-family: Afacad; --heading-color: var(--primary); --heading-line-height: calc(10px + 2ex); --heading-font-weight: 700; --heading-letter-spacing: -0.02em; --heading-text-wrap: pretty; --base-heading-lh: calc(10px + 2ex); --h1-max-width: 100%; --h2-max-width: 100%; --h3-max-width: 100%; --h4-line-height: calc(10px + 2ex); --h4-max-width: 100%; --h5-max-width: 100%; --h6-max-width: 100%; --text-font-family: League Spartan; --text-color: var(--neutral-dark); --text-line-height: calc(10px + 2ex); --text-font-weight: 400; --text-text-wrap: pretty; } :root { --grid-1: repeat(1, minmax(0, 1fr)); --grid-2: repeat(2, minmax(0, 1fr)); --grid-3: repeat(3, minmax(0, 1fr)); --grid-4: repeat(4, minmax(0, 1fr)); --grid-5: repeat(5, minmax(0, 1fr)); --grid-6: repeat(6, minmax(0, 1fr)); --grid-7: repeat(7, minmax(0, 1fr)); --grid-8: repeat(8, minmax(0, 1fr)); --grid-9: repeat(9, minmax(0, 1fr)); --grid-10: repeat(10, minmax(0, 1fr)); --grid-11: repeat(11, minmax(0, 1fr)); --grid-12: repeat(12, minmax(0, 1fr)); --grid-1-2: minmax(0, 1fr) minmax(0, 2fr); --grid-1-3: minmax(0, 1fr) minmax(0, 3fr); --grid-2-1: minmax(0, 2fr) minmax(0, 1fr); --grid-2-3: minmax(0, 2fr) minmax(0, 3fr); --grid-3-1: minmax(0, 3fr) minmax(0, 1fr); --grid-3-2: minmax(0, 3fr) minmax(0, 2fr); } :root { --grid-auto-2: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((2 - 1) * var(--grid-gap))) / 2) * 0.7, (100% - (2 - 1) * var(--grid-gap)) / 2)), 1fr)); --grid-auto-3: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((3 - 1) * var(--grid-gap))) / 3) * 0.7, (100% - (3 - 1) * var(--grid-gap)) / 3)), 1fr)); --grid-auto-4: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((4 - 1) * var(--grid-gap))) / 4) * 0.7, (100% - (4 - 1) * var(--grid-gap)) / 4)), 1fr)); --grid-auto-5: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((5 - 1) * var(--grid-gap))) / 5) * 0.7, (100% - (5 - 1) * var(--grid-gap)) / 5)), 1fr)); --grid-auto-6: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((6 - 1) * var(--grid-gap))) / 6) * 0.7, (100% - (6 - 1) * var(--grid-gap)) / 6)), 1fr)); --grid-auto-7: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((7 - 1) * var(--grid-gap))) / 7) * 0.7, (100% - (7 - 1) * var(--grid-gap)) / 7)), 1fr)); --grid-auto-8: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((8 - 1) * var(--grid-gap))) / 8) * 0.7, (100% - (8 - 1) * var(--grid-gap)) / 8)), 1fr)); --grid-auto-9: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((9 - 1) * var(--grid-gap))) / 9) * 0.7, (100% - (9 - 1) * var(--grid-gap)) / 9)), 1fr)); --grid-auto-10: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((10 - 1) * var(--grid-gap))) / 10) * 0.7, (100% - (10 - 1) * var(--grid-gap)) / 10)), 1fr)); --grid-auto-11: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((11 - 1) * var(--grid-gap))) / 11) * 0.7, (100% - (11 - 1) * var(--grid-gap)) / 11)), 1fr)); --grid-auto-12: repeat(auto-fit, minmax(min(100%, max(calc((var(--content-width) - ((12 - 1) * var(--grid-gap))) / 12) * 0.7, (100% - (12 - 1) * var(--grid-gap)) / 12)), 1fr)); --auto-grid-aggressiveness: 0.7; } :root { --header-height: 0rem; --header-height-xl: 0rem; --header-height-l: 0rem; --header-height-m: 0rem; --header-height-s: 0rem; } @media (max-width: 1366px) { :root { --header-height: var(--header-height-xl); } } @media (max-width: 992px) { :root { --header-height: var(--header-height-l); } } @media (max-width: 768px) { :root { --header-height: var(--header-height-m); } } @media (max-width: 480px) { :root { --header-height: var(--header-height-s); } } :root { --paragraph-spacing: 1em; --heading-spacing: 3rem; --list-spacing: var(--paragraph-spacing); --list-indent-spacing: 2em; --list-item-spacing: 0.5em; --nested-list-indent-spacing: 1em; --flow-spacing: var(--paragraph-spacing); --figure-spacing: var(--paragraph-spacing); --figcaption-spacing: 0.5em; --blockquote-spacing: var(--paragraph-spacing); } :root { --option-primary-btn-outline: on; --option-secondary-btn-outline: on; --btn-padding-block: 0.75em; --btn-padding-inline: 1.5em; --btn-min-width: 14rem; --btn-line-height: 1; --btn-font-weight: 700; --btn-font-style: normal; --btn-text-decoration: none; --btn-text-decoration-hover: none; --btn-letter-spacing: 0; --btn-text-transform: uppercase; --btn-border-width: 2px; --btn-outline-border-width: 2px; --btn-border-style: solid; --btn-border-radius: var(--radius); --btn-justify-content: center; --btn-text-align: center; } :root { --btn-font-size: clamp(1.8rem, calc(0.5964214712vw + 1.5852882704rem), 2.4rem); --btn-text-size: clamp(1.8rem, calc(0.5964214712vw + 1.5852882704rem), 2.4rem); }  :root { --btn-border-size: 2px; --btn-radius: var(--radius); --outline-btn-border-size: 2px; --btn-pad-x: 1.5em; --btn-pad-y: 0.75em; --btn-text-style: normal; --btn-weight: 700; --btn-width: 14; } :root { --link-color: var(--tertiary); --link-color-hover: var(--primary-hover); --link-transition: var(--transition); --link-decoration: inherit; --link-decoration-hover: inherit; --link-underline-offset: auto; --link-weight: inherit; } :root { --col-width-s: 13rem; --col-width-m: 25rem; --col-width-l: 38rem; --col-rule-width-s: 0.5px; --col-rule-width-m: 1px; --col-rule-width-l: 3px; } :root { --sticky-s: 2.5%; --sticky-m: 5%; --sticky-l: 10%; } :root { --content-gap: var(--space-m); --fr-content-gap: var(--space-m); --container-gap: var(--space-xl); --fr-container-gap: var(--space-xl); --grid-gap: var(--space-m); --fr-grid-gap: var(--space-m); --bg-ultra-light-text: var(--text-dark); --bg-light-text: var(--text-dark); --bg-dark-text: var(--text-light); --bg-ultra-dark-text: var(--text-light); --bg-ultra-light-heading: var(--text-dark); --bg-light-heading: var(--text-dark); --bg-dark-heading: var(--text-light); --bg-ultra-dark-heading: var(--text-light); --bg-ultra-light-link: var(--primary); --bg-ultra-light-link-hover: var(--primary-hover); --bg-light-link: var(--primary); --bg-light-link-hover: var(--primary-hover); --bg-dark-link: var(--primary); --bg-dark-link-hover: var(--primary-hover); --bg-ultra-dark-link: var(--primary); --bg-ultra-dark-link-hover: var(--primary-hover); --bg-ultra-light-button: primary; --bg-light-button: primary; --bg-dark-button: primary; --bg-ultra-dark-button: primary; } :root { --radius: 0px; --radius-50: 50%; --radius-circle: 50vw; --radius-none: 0; --radius-xs: 0px; --radius-s: 0px; --radius-m: 0px; --radius-l: 0px; --radius-xl: 0px; --radius-xxl: 0px; --border-size: 1px; --border-width: 1px; --border-style: solid; --border-color-dark: var(--black-trans-20); --border-color-light: var(--white-trans-20); --border: var(--border-size) var(--border-style) var(--border-color-dark); --border-light: var(--border-size) var(--border-style) var(--border-color-light); --border-dark: var(--border-size) var(--border-style) var(--border-color-dark); } :root { --divider-size: 1px; --divider-style: solid; --divider-inline-size: 100%; --divider-gap: var(--content-gap); --divider-color-dark: var(--black-trans-20); --divider-color-light: var(--white-trans-20); --divider: var(--divider-size) var(--divider-style) var(--divider-color-dark); --divider-light: var(--divider-size) var(--divider-style) var(--divider-color-light); --divider-dark: var(--divider-size) var(--divider-style) var(--divider-color-dark); } :root { --transition-duration: 0.3s; --transition-timing: ease-in-out; --transition-delay: 0s; --transition: background var(--transition-duration) var(--transition-timing) var(--transition-delay), color var(--transition-duration) var(--transition-timing) var(--transition-delay), border var(--transition-duration) var(--transition-timing) var(--transition-delay); } body.boxed-layout { inline-size: 100%; max-inline-size: var(--body-max-width, 1920px); box-shadow: var(--body-box-shadow, 0 0 80px 0 var(--neutral-trans-20)); border-color: var(--body-border-color, transparent); border-style: var(--body-border-style, none); border-width: var(--body-border-width, 0); border-radius: var(--body-border-radius, 0); margin-block-start: var(--body-margin-top, 0) !important; margin-inline: auto !important; } body.boxed-layout header.sticky > *, body.boxed-layout #brx-header.sticky.sticky > * { width: var(--boxed-width); margin-inline: auto; } [id] { scroll-margin-top: var(--offset, 0); } html { font-size: var(--root-font-size) !important; } :root { interpolate-size: allow-keywords; } *, *::before, *::after { box-sizing: border-box; } body { min-block-size: 100vh; } input, button, textarea, select { font: inherit; } :where(dd) { margin-inline-start: 0; } img { object-fit: var(--object-fit, cover); object-position: var(--object-position, 50% 50%); } .focus-parent:focus-within:not(:has(:focus-visible)) { outline: none; outline-offset: 0; } .focus-parent:focus-within { outline: var(--focus-width) solid var(--focus-color); outline-offset: var(--focus-offset); } .focus-parent :focus { outline: none !important; box-shadow: none !important; } .focus-parent--shadow:focus-within:not(:has(:focus-visible)) { box-shadow: none; } .focus-parent--shadow:focus-within { box-shadow: 0 0 0 var(--focus-width) var(--focus-color); } .focus-parent--shadow :focus { outline: none !important; box-shadow: none !important; } .focus-parent--outline:focus-within:not(:has(:focus-visible)) { outline: none; outline-offset: 0; } .focus-parent--outline:focus-within { outline: var(--focus-width) solid var(--focus-color); outline-offset: var(--focus-offset); } .focus-parent--outline :focus { outline: none !important; box-shadow: none !important; } .hidden-accessible { position: absolute !important; inline-size: 1px !important; block-size: 1px !important; padding: 0; margin: -1px; overflow: hidden; clip-path: rect(0, 0, 0, 0); white-space: nowrap;  border: 0; } @media (prefers-reduced-motion: reduce) { html:focus-within { scroll-behavior: auto; } *, *::before, *::after { -webkit-animation-duration: 0.01ms !important; animation-duration: 0.01ms !important; -webkit-animation-iteration-count: 1 !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } body:not(:has([data-sticky-header="0"]), .content-offset--off) .acss-offset-content:not(.panel-content) > *:first-child > *:first-child:not(.bricks-shape-divider) { margin-block-start: var(--header-height); } :where(section:not(section section)) { padding-block: var(--section-padding-block); padding-inline: var(--gutter); } body:where(:not(.block-editor-writing-flow, .editor-styles-wrapper)) :where(p, h1, h2, h3, h4, h5, h6, ul, ol, li) { margin-block: 0; } .smart-spacing-normalize :where(p, h1, h2, h3, h4, h5, h6, ul, ol, li) { margin-block: 0; } .smart-spacing-preview > * + *, .smart-spacing.smart-spacing > * + * { margin-block-start: var(--flow-spacing, initial); margin-block-end: 0; } .smart-spacing-preview > * + :where(h1, h2, h3, h4, h5, h6), .smart-spacing.smart-spacing > * + :where(h1, h2, h3, h4, h5, h6) { margin-block-start: var(--heading-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } .smart-spacing-preview > :where(* + h2), .smart-spacing.smart-spacing > :where(* + h2) { margin-block-start: var(--h2-spacing, var(--heading-spacing)); margin-block-end: 0; } .smart-spacing-preview > :where(* + h3), .smart-spacing.smart-spacing > :where(* + h3) { margin-block-start: var(--h3-spacing, var(--heading-spacing)); margin-block-end: 0; } .smart-spacing-preview > :where(* + h4), .smart-spacing.smart-spacing > :where(* + h4) { margin-block-start: var(--h4-spacing, var(--heading-spacing)); margin-block-end: 0; } .smart-spacing-preview > :where(* + h5), .smart-spacing.smart-spacing > :where(* + h5) { margin-block-start: var(--h5-spacing, var(--heading-spacing)); margin-block-end: 0; } .smart-spacing-preview > :where(* + h6), .smart-spacing.smart-spacing > :where(* + h6) { margin-block-start: var(--h6-spacing, var(--heading-spacing)); margin-block-end: 0; } .smart-spacing-preview > * + p, .smart-spacing.smart-spacing > * + p { margin-block-start: var(--paragraph-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } .smart-spacing-preview > :is(* + ul, * + ol), .smart-spacing.smart-spacing > :is(* + ul, * + ol) { margin-block: var(--list-spacing, var(--flow-spacing, initial)); } .smart-spacing-preview > :is(ul, ol), .smart-spacing.smart-spacing > :is(ul, ol) { padding-inline-start: var(--list-indent-spacing, var(--flow-spacing, initial)); } .smart-spacing-preview > ul * + li, .smart-spacing-preview > ol * + li, .smart-spacing.smart-spacing > ul * + li, .smart-spacing.smart-spacing > ol * + li { margin-block-start: var(--list-item-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } .smart-spacing-preview > ul ul, .smart-spacing-preview > ol ol, .smart-spacing-preview > ul ol, .smart-spacing-preview > ol ul, .smart-spacing.smart-spacing > ul ul, .smart-spacing.smart-spacing > ol ol, .smart-spacing.smart-spacing > ul ol, .smart-spacing.smart-spacing > ol ul { margin-block: var(--nested-list-spacing, var(--list-item-spacing, initial)); padding-inline-start: var(--nested-list-indent-spacing, initial); } .smart-spacing-preview > :is(ul, ol) :is(ul, ol) li, .smart-spacing.smart-spacing > :is(ul, ol) :is(ul, ol) li { margin-block-start: var(--nested-list-item-spacing, var(--list-item-spacing, initial)); } .smart-spacing-preview > * + figure, .smart-spacing-preview > * + picture, .smart-spacing.smart-spacing > * + figure, .smart-spacing.smart-spacing > * + picture { margin-block: var(--figure-spacing, var(--flow-spacing, initial)); } .smart-spacing-preview figcaption, .smart-spacing.smart-spacing figcaption { margin-block: var(--figcaption-spacing, var(--flow-spacing, initial)); } .smart-spacing-preview > * + blockquote:where(:not(figure > blockquote)), .smart-spacing.smart-spacing > * + blockquote:where(:not(figure > blockquote)) { margin-block: var(--blockquote-spacing, var(--flow-spacing, initial)); } .smart-spacing-preview > blockquote * + *, .smart-spacing.smart-spacing > blockquote * + * { margin-block-start: var(--paragraph-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } .smart-spacing-preview > :is(figure, blockquote, ul, ol) + *, .smart-spacing.smart-spacing > :is(figure, blockquote, ul, ol) + * { --paragraph-spacing: 0; --flow-spacing: 0; } .smart-spacing--off.smart-spacing--off :where(p, h1, h2, h3, h4, h5, h6, ul, ol, li) { margin-block: 0; } :where(.woocommerce-checkout) p { margin: 0 0 1.2em; } .brxe-text > * + *, .brxe-post-content:where(:not([data-source="bricks"])) > * + * { margin-block-start: var(--flow-spacing, initial); margin-block-end: 0; } .brxe-text > * + :where(h1, h2, h3, h4, h5, h6), .brxe-post-content:where(:not([data-source="bricks"])) > * + :where(h1, h2, h3, h4, h5, h6) { margin-block-start: var(--heading-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } .brxe-text > :where(* + h2), .brxe-post-content:where(:not([data-source="bricks"])) > :where(* + h2) { margin-block-start: var(--h2-spacing, var(--heading-spacing)); margin-block-end: 0; } .brxe-text > :where(* + h3), .brxe-post-content:where(:not([data-source="bricks"])) > :where(* + h3) { margin-block-start: var(--h3-spacing, var(--heading-spacing)); margin-block-end: 0; } .brxe-text > :where(* + h4), .brxe-post-content:where(:not([data-source="bricks"])) > :where(* + h4) { margin-block-start: var(--h4-spacing, var(--heading-spacing)); margin-block-end: 0; } .brxe-text > :where(* + h5), .brxe-post-content:where(:not([data-source="bricks"])) > :where(* + h5) { margin-block-start: var(--h5-spacing, var(--heading-spacing)); margin-block-end: 0; } .brxe-text > :where(* + h6), .brxe-post-content:where(:not([data-source="bricks"])) > :where(* + h6) { margin-block-start: var(--h6-spacing, var(--heading-spacing)); margin-block-end: 0; } .brxe-text > * + p, .brxe-post-content:where(:not([data-source="bricks"])) > * + p { margin-block-start: var(--paragraph-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } .brxe-text > :is(* + ul, * + ol), .brxe-post-content:where(:not([data-source="bricks"])) > :is(* + ul, * + ol) { margin-block: var(--list-spacing, var(--flow-spacing, initial)); } .brxe-text > :is(ul, ol), .brxe-post-content:where(:not([data-source="bricks"])) > :is(ul, ol) { padding-inline-start: var(--list-indent-spacing, var(--flow-spacing, initial)); } .brxe-text > ul * + li, .brxe-text > ol * + li, .brxe-post-content:where(:not([data-source="bricks"])) > ul * + li, .brxe-post-content:where(:not([data-source="bricks"])) > ol * + li { margin-block-start: var(--list-item-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } .brxe-text > ul ul, .brxe-text > ol ol, .brxe-text > ul ol, .brxe-text > ol ul, .brxe-post-content:where(:not([data-source="bricks"])) > ul ul, .brxe-post-content:where(:not([data-source="bricks"])) > ol ol, .brxe-post-content:where(:not([data-source="bricks"])) > ul ol, .brxe-post-content:where(:not([data-source="bricks"])) > ol ul { margin-block: var(--nested-list-spacing, var(--list-item-spacing, initial)); padding-inline-start: var(--nested-list-indent-spacing, initial); } .brxe-text > :is(ul, ol) :is(ul, ol) li, .brxe-post-content:where(:not([data-source="bricks"])) > :is(ul, ol) :is(ul, ol) li { margin-block-start: var(--nested-list-item-spacing, var(--list-item-spacing, initial)); } .brxe-text > * + figure, .brxe-text > * + picture, .brxe-post-content:where(:not([data-source="bricks"])) > * + figure, .brxe-post-content:where(:not([data-source="bricks"])) > * + picture { margin-block: var(--figure-spacing, var(--flow-spacing, initial)); } .brxe-text figcaption, .brxe-post-content:where(:not([data-source="bricks"])) figcaption { margin-block: var(--figcaption-spacing, var(--flow-spacing, initial)); } .brxe-text > * + blockquote:where(:not(figure > blockquote)), .brxe-post-content:where(:not([data-source="bricks"])) > * + blockquote:where(:not(figure > blockquote)) { margin-block: var(--blockquote-spacing, var(--flow-spacing, initial)); } .brxe-text > blockquote * + *, .brxe-post-content:where(:not([data-source="bricks"])) > blockquote * + * { margin-block-start: var(--paragraph-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } .brxe-text > :is(figure, blockquote, ul, ol) + *, .brxe-post-content:where(:not([data-source="bricks"])) > :is(figure, blockquote, ul, ol) + * { --paragraph-spacing: 0; --flow-spacing: 0; } body :where(p:last-of-type) + :is(h1, h2, h3, h4, h5, h6) { margin-top: 0; margin-block-start: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > * + * { margin-block-start: var(--flow-spacing, initial); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > * + :where(h1, h2, h3, h4, h5, h6) { margin-block-start: var(--heading-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :where(* + h2) { margin-block-start: var(--h2-spacing, var(--heading-spacing)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :where(* + h3) { margin-block-start: var(--h3-spacing, var(--heading-spacing)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :where(* + h4) { margin-block-start: var(--h4-spacing, var(--heading-spacing)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :where(* + h5) { margin-block-start: var(--h5-spacing, var(--heading-spacing)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :where(* + h6) { margin-block-start: var(--h6-spacing, var(--heading-spacing)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > * + p { margin-block-start: var(--paragraph-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :is(* + ul, * + ol) { margin-block: var(--list-spacing, var(--flow-spacing, initial)); } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :is(ul, ol) { padding-inline-start: var(--list-indent-spacing, var(--flow-spacing, initial)); } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > ul * + li, :not(.woocommerce-checkout) [class*="woocommerce"] * + p > ol * + li { margin-block-start: var(--list-item-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > ul ul, :not(.woocommerce-checkout) [class*="woocommerce"] * + p > ol ol, :not(.woocommerce-checkout) [class*="woocommerce"] * + p > ul ol, :not(.woocommerce-checkout) [class*="woocommerce"] * + p > ol ul { margin-block: var(--nested-list-spacing, var(--list-item-spacing, initial)); padding-inline-start: var(--nested-list-indent-spacing, initial); } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :is(ul, ol) :is(ul, ol) li { margin-block-start: var(--nested-list-item-spacing, var(--list-item-spacing, initial)); } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > * + figure, :not(.woocommerce-checkout) [class*="woocommerce"] * + p > * + picture { margin-block: var(--figure-spacing, var(--flow-spacing, initial)); } :not(.woocommerce-checkout) [class*="woocommerce"] * + p figcaption { margin-block: var(--figcaption-spacing, var(--flow-spacing, initial)); } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > * + blockquote:where(:not(figure > blockquote)) { margin-block: var(--blockquote-spacing, var(--flow-spacing, initial)); } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > blockquote * + * { margin-block-start: var(--paragraph-spacing, var(--flow-spacing, initial)); margin-block-end: 0; } :not(.woocommerce-checkout) [class*="woocommerce"] * + p > :is(figure, blockquote, ul, ol) + * { --paragraph-spacing: 0; --flow-spacing: 0; } .bg--primary { background-color: var(--primary); } .bg--primary-hover { background-color: var(--primary-hover); } .bg--primary-ultra-light { background-color: var(--primary-ultra-light); } .bg--primary-light { background-color: var(--primary-light); } .bg--primary-semi-light { background-color: var(--primary-semi-light); } .bg--primary-semi-dark { background-color: var(--primary-semi-dark); } .bg--primary-dark { background-color: var(--primary-dark); } .bg--primary-ultra-dark { background-color: var(--primary-ultra-dark); } .bg--primary-trans-10 { background-color: var(--primary-trans-10); } .bg--primary-trans-20 { background-color: var(--primary-trans-20); } .bg--primary-trans-30 { background-color: var(--primary-trans-30); } .bg--primary-trans-40 { background-color: var(--primary-trans-40); } .bg--primary-trans-50 { background-color: var(--primary-trans-50); } .bg--primary-trans-60 { background-color: var(--primary-trans-60); } .bg--primary-trans-70 { background-color: var(--primary-trans-70); } .bg--primary-trans-80 { background-color: var(--primary-trans-80); } .bg--primary-trans-90 { background-color: var(--primary-trans-90); } .bg--primary-light-trans-10 { background-color: var(--primary-light-trans-10); } .bg--primary-light-trans-20 { background-color: var(--primary-light-trans-20); } .bg--primary-light-trans-30 { background-color: var(--primary-light-trans-30); } .bg--primary-light-trans-40 { background-color: var(--primary-light-trans-40); } .bg--primary-light-trans-50 { background-color: var(--primary-light-trans-50); } .bg--primary-light-trans-60 { background-color: var(--primary-light-trans-60); } .bg--primary-light-trans-70 { background-color: var(--primary-light-trans-70); } .bg--primary-light-trans-80 { background-color: var(--primary-light-trans-80); } .bg--primary-light-trans-90 { background-color: var(--primary-light-trans-90); } .bg--primary-dark-trans-10 { background-color: var(--primary-dark-trans-10); } .bg--primary-dark-trans-20 { background-color: var(--primary-dark-trans-20); } .bg--primary-dark-trans-30 { background-color: var(--primary-dark-trans-30); } .bg--primary-dark-trans-40 { background-color: var(--primary-dark-trans-40); } .bg--primary-dark-trans-50 { background-color: var(--primary-dark-trans-50); } .bg--primary-dark-trans-60 { background-color: var(--primary-dark-trans-60); } .bg--primary-dark-trans-70 { background-color: var(--primary-dark-trans-70); } .bg--primary-dark-trans-80 { background-color: var(--primary-dark-trans-80); } .bg--primary-dark-trans-90 { background-color: var(--primary-dark-trans-90); } .bg--primary-ultra-dark-trans-10 { background-color: var(--primary-ultra-dark-trans-10); } .bg--primary-ultra-dark-trans-20 { background-color: var(--primary-ultra-dark-trans-20); } .bg--primary-ultra-dark-trans-30 { background-color: var(--primary-ultra-dark-trans-30); } .bg--primary-ultra-dark-trans-40 { background-color: var(--primary-ultra-dark-trans-40); } .bg--primary-ultra-dark-trans-50 { background-color: var(--primary-ultra-dark-trans-50); } .bg--primary-ultra-dark-trans-60 { background-color: var(--primary-ultra-dark-trans-60); } .bg--primary-ultra-dark-trans-70 { background-color: var(--primary-ultra-dark-trans-70); } .bg--primary-ultra-dark-trans-80 { background-color: var(--primary-ultra-dark-trans-80); } .bg--primary-ultra-dark-trans-90 { background-color: var(--primary-ultra-dark-trans-90); } .bg--secondary { background-color: var(--secondary); } .bg--secondary-hover { background-color: var(--secondary-hover); } .bg--secondary-ultra-light { background-color: var(--secondary-ultra-light); } .bg--secondary-light { background-color: var(--secondary-light); } .bg--secondary-semi-light { background-color: var(--secondary-semi-light); } .bg--secondary-semi-dark { background-color: var(--secondary-semi-dark); } .bg--secondary-dark { background-color: var(--secondary-dark); } .bg--secondary-ultra-dark { background-color: var(--secondary-ultra-dark); } .bg--secondary-trans-10 { background-color: var(--secondary-trans-10); } .bg--secondary-trans-20 { background-color: var(--secondary-trans-20); } .bg--secondary-trans-30 { background-color: var(--secondary-trans-30); } .bg--secondary-trans-40 { background-color: var(--secondary-trans-40); } .bg--secondary-trans-50 { background-color: var(--secondary-trans-50); } .bg--secondary-trans-60 { background-color: var(--secondary-trans-60); } .bg--secondary-trans-70 { background-color: var(--secondary-trans-70); } .bg--secondary-trans-80 { background-color: var(--secondary-trans-80); } .bg--secondary-trans-90 { background-color: var(--secondary-trans-90); } .bg--secondary-light-trans-10 { background-color: var(--secondary-light-trans-10); } .bg--secondary-light-trans-20 { background-color: var(--secondary-light-trans-20); } .bg--secondary-light-trans-30 { background-color: var(--secondary-light-trans-30); } .bg--secondary-light-trans-40 { background-color: var(--secondary-light-trans-40); } .bg--secondary-light-trans-50 { background-color: var(--secondary-light-trans-50); } .bg--secondary-light-trans-60 { background-color: var(--secondary-light-trans-60); } .bg--secondary-light-trans-70 { background-color: var(--secondary-light-trans-70); } .bg--secondary-light-trans-80 { background-color: var(--secondary-light-trans-80); } .bg--secondary-light-trans-90 { background-color: var(--secondary-light-trans-90); } .bg--secondary-dark-trans-10 { background-color: var(--secondary-dark-trans-10); } .bg--secondary-dark-trans-20 { background-color: var(--secondary-dark-trans-20); } .bg--secondary-dark-trans-30 { background-color: var(--secondary-dark-trans-30); } .bg--secondary-dark-trans-40 { background-color: var(--secondary-dark-trans-40); } .bg--secondary-dark-trans-50 { background-color: var(--secondary-dark-trans-50); } .bg--secondary-dark-trans-60 { background-color: var(--secondary-dark-trans-60); } .bg--secondary-dark-trans-70 { background-color: var(--secondary-dark-trans-70); } .bg--secondary-dark-trans-80 { background-color: var(--secondary-dark-trans-80); } .bg--secondary-dark-trans-90 { background-color: var(--secondary-dark-trans-90); } .bg--secondary-ultra-dark-trans-10 { background-color: var(--secondary-ultra-dark-trans-10); } .bg--secondary-ultra-dark-trans-20 { background-color: var(--secondary-ultra-dark-trans-20); } .bg--secondary-ultra-dark-trans-30 { background-color: var(--secondary-ultra-dark-trans-30); } .bg--secondary-ultra-dark-trans-40 { background-color: var(--secondary-ultra-dark-trans-40); } .bg--secondary-ultra-dark-trans-50 { background-color: var(--secondary-ultra-dark-trans-50); } .bg--secondary-ultra-dark-trans-60 { background-color: var(--secondary-ultra-dark-trans-60); } .bg--secondary-ultra-dark-trans-70 { background-color: var(--secondary-ultra-dark-trans-70); } .bg--secondary-ultra-dark-trans-80 { background-color: var(--secondary-ultra-dark-trans-80); } .bg--secondary-ultra-dark-trans-90 { background-color: var(--secondary-ultra-dark-trans-90); } .bg--tertiary { background-color: var(--tertiary); } .bg--tertiary-hover { background-color: var(--tertiary-hover); } .bg--tertiary-ultra-light { background-color: var(--tertiary-ultra-light); } .bg--tertiary-light { background-color: var(--tertiary-light); } .bg--tertiary-semi-light { background-color: var(--tertiary-semi-light); } .bg--tertiary-semi-dark { background-color: var(--tertiary-semi-dark); } .bg--tertiary-dark { background-color: var(--tertiary-dark); } .bg--tertiary-ultra-dark { background-color: var(--tertiary-ultra-dark); } .bg--tertiary-trans-10 { background-color: var(--tertiary-trans-10); } .bg--tertiary-trans-20 { background-color: var(--tertiary-trans-20); } .bg--tertiary-trans-30 { background-color: var(--tertiary-trans-30); } .bg--tertiary-trans-40 { background-color: var(--tertiary-trans-40); } .bg--tertiary-trans-50 { background-color: var(--tertiary-trans-50); } .bg--tertiary-trans-60 { background-color: var(--tertiary-trans-60); } .bg--tertiary-trans-70 { background-color: var(--tertiary-trans-70); } .bg--tertiary-trans-80 { background-color: var(--tertiary-trans-80); } .bg--tertiary-trans-90 { background-color: var(--tertiary-trans-90); } .bg--tertiary-light-trans-10 { background-color: var(--tertiary-light-trans-10); } .bg--tertiary-light-trans-20 { background-color: var(--tertiary-light-trans-20); } .bg--tertiary-light-trans-30 { background-color: var(--tertiary-light-trans-30); } .bg--tertiary-light-trans-40 { background-color: var(--tertiary-light-trans-40); } .bg--tertiary-light-trans-50 { background-color: var(--tertiary-light-trans-50); } .bg--tertiary-light-trans-60 { background-color: var(--tertiary-light-trans-60); } .bg--tertiary-light-trans-70 { background-color: var(--tertiary-light-trans-70); } .bg--tertiary-light-trans-80 { background-color: var(--tertiary-light-trans-80); } .bg--tertiary-light-trans-90 { background-color: var(--tertiary-light-trans-90); } .bg--tertiary-dark-trans-10 { background-color: var(--tertiary-dark-trans-10); } .bg--tertiary-dark-trans-20 { background-color: var(--tertiary-dark-trans-20); } .bg--tertiary-dark-trans-30 { background-color: var(--tertiary-dark-trans-30); } .bg--tertiary-dark-trans-40 { background-color: var(--tertiary-dark-trans-40); } .bg--tertiary-dark-trans-50 { background-color: var(--tertiary-dark-trans-50); } .bg--tertiary-dark-trans-60 { background-color: var(--tertiary-dark-trans-60); } .bg--tertiary-dark-trans-70 { background-color: var(--tertiary-dark-trans-70); } .bg--tertiary-dark-trans-80 { background-color: var(--tertiary-dark-trans-80); } .bg--tertiary-dark-trans-90 { background-color: var(--tertiary-dark-trans-90); } .bg--tertiary-ultra-dark-trans-10 { background-color: var(--tertiary-ultra-dark-trans-10); } .bg--tertiary-ultra-dark-trans-20 { background-color: var(--tertiary-ultra-dark-trans-20); } .bg--tertiary-ultra-dark-trans-30 { background-color: var(--tertiary-ultra-dark-trans-30); } .bg--tertiary-ultra-dark-trans-40 { background-color: var(--tertiary-ultra-dark-trans-40); } .bg--tertiary-ultra-dark-trans-50 { background-color: var(--tertiary-ultra-dark-trans-50); } .bg--tertiary-ultra-dark-trans-60 { background-color: var(--tertiary-ultra-dark-trans-60); } .bg--tertiary-ultra-dark-trans-70 { background-color: var(--tertiary-ultra-dark-trans-70); } .bg--tertiary-ultra-dark-trans-80 { background-color: var(--tertiary-ultra-dark-trans-80); } .bg--tertiary-ultra-dark-trans-90 { background-color: var(--tertiary-ultra-dark-trans-90); } .bg--accent { background-color: var(--accent); } .bg--accent-hover { background-color: var(--accent-hover); } .bg--accent-ultra-light { background-color: var(--accent-ultra-light); } .bg--accent-light { background-color: var(--accent-light); } .bg--accent-semi-light { background-color: var(--accent-semi-light); } .bg--accent-semi-dark { background-color: var(--accent-semi-dark); } .bg--accent-dark { background-color: var(--accent-dark); } .bg--accent-ultra-dark { background-color: var(--accent-ultra-dark); } .bg--accent-trans-10 { background-color: var(--accent-trans-10); } .bg--accent-trans-20 { background-color: var(--accent-trans-20); } .bg--accent-trans-30 { background-color: var(--accent-trans-30); } .bg--accent-trans-40 { background-color: var(--accent-trans-40); } .bg--accent-trans-50 { background-color: var(--accent-trans-50); } .bg--accent-trans-60 { background-color: var(--accent-trans-60); } .bg--accent-trans-70 { background-color: var(--accent-trans-70); } .bg--accent-trans-80 { background-color: var(--accent-trans-80); } .bg--accent-trans-90 { background-color: var(--accent-trans-90); } .bg--accent-light-trans-10 { background-color: var(--accent-light-trans-10); } .bg--accent-light-trans-20 { background-color: var(--accent-light-trans-20); } .bg--accent-light-trans-30 { background-color: var(--accent-light-trans-30); } .bg--accent-light-trans-40 { background-color: var(--accent-light-trans-40); } .bg--accent-light-trans-50 { background-color: var(--accent-light-trans-50); } .bg--accent-light-trans-60 { background-color: var(--accent-light-trans-60); } .bg--accent-light-trans-70 { background-color: var(--accent-light-trans-70); } .bg--accent-light-trans-80 { background-color: var(--accent-light-trans-80); } .bg--accent-light-trans-90 { background-color: var(--accent-light-trans-90); } .bg--accent-dark-trans-10 { background-color: var(--accent-dark-trans-10); } .bg--accent-dark-trans-20 { background-color: var(--accent-dark-trans-20); } .bg--accent-dark-trans-30 { background-color: var(--accent-dark-trans-30); } .bg--accent-dark-trans-40 { background-color: var(--accent-dark-trans-40); } .bg--accent-dark-trans-50 { background-color: var(--accent-dark-trans-50); } .bg--accent-dark-trans-60 { background-color: var(--accent-dark-trans-60); } .bg--accent-dark-trans-70 { background-color: var(--accent-dark-trans-70); } .bg--accent-dark-trans-80 { background-color: var(--accent-dark-trans-80); } .bg--accent-dark-trans-90 { background-color: var(--accent-dark-trans-90); } .bg--accent-ultra-dark-trans-10 { background-color: var(--accent-ultra-dark-trans-10); } .bg--accent-ultra-dark-trans-20 { background-color: var(--accent-ultra-dark-trans-20); } .bg--accent-ultra-dark-trans-30 { background-color: var(--accent-ultra-dark-trans-30); } .bg--accent-ultra-dark-trans-40 { background-color: var(--accent-ultra-dark-trans-40); } .bg--accent-ultra-dark-trans-50 { background-color: var(--accent-ultra-dark-trans-50); } .bg--accent-ultra-dark-trans-60 { background-color: var(--accent-ultra-dark-trans-60); } .bg--accent-ultra-dark-trans-70 { background-color: var(--accent-ultra-dark-trans-70); } .bg--accent-ultra-dark-trans-80 { background-color: var(--accent-ultra-dark-trans-80); } .bg--accent-ultra-dark-trans-90 { background-color: var(--accent-ultra-dark-trans-90); } .bg--neutral { background-color: var(--neutral); } .bg--neutral-hover { background-color: var(--neutral-hover); } .bg--neutral-ultra-light { background-color: var(--neutral-ultra-light); } .bg--neutral-light { background-color: var(--neutral-light); } .bg--neutral-semi-light { background-color: var(--neutral-semi-light); } .bg--neutral-semi-dark { background-color: var(--neutral-semi-dark); } .bg--neutral-dark { background-color: var(--neutral-dark); } .bg--neutral-ultra-dark { background-color: var(--neutral-ultra-dark); } .bg--neutral-trans-10 { background-color: var(--neutral-trans-10); } .bg--neutral-trans-20 { background-color: var(--neutral-trans-20); } .bg--neutral-trans-30 { background-color: var(--neutral-trans-30); } .bg--neutral-trans-40 { background-color: var(--neutral-trans-40); } .bg--neutral-trans-50 { background-color: var(--neutral-trans-50); } .bg--neutral-trans-60 { background-color: var(--neutral-trans-60); } .bg--neutral-trans-70 { background-color: var(--neutral-trans-70); } .bg--neutral-trans-80 { background-color: var(--neutral-trans-80); } .bg--neutral-trans-90 { background-color: var(--neutral-trans-90); } .bg--neutral-light-trans-10 { background-color: var(--neutral-light-trans-10); } .bg--neutral-light-trans-20 { background-color: var(--neutral-light-trans-20); } .bg--neutral-light-trans-30 { background-color: var(--neutral-light-trans-30); } .bg--neutral-light-trans-40 { background-color: var(--neutral-light-trans-40); } .bg--neutral-light-trans-50 { background-color: var(--neutral-light-trans-50); } .bg--neutral-light-trans-60 { background-color: var(--neutral-light-trans-60); } .bg--neutral-light-trans-70 { background-color: var(--neutral-light-trans-70); } .bg--neutral-light-trans-80 { background-color: var(--neutral-light-trans-80); } .bg--neutral-light-trans-90 { background-color: var(--neutral-light-trans-90); } .bg--neutral-dark-trans-10 { background-color: var(--neutral-dark-trans-10); } .bg--neutral-dark-trans-20 { background-color: var(--neutral-dark-trans-20); } .bg--neutral-dark-trans-30 { background-color: var(--neutral-dark-trans-30); } .bg--neutral-dark-trans-40 { background-color: var(--neutral-dark-trans-40); } .bg--neutral-dark-trans-50 { background-color: var(--neutral-dark-trans-50); } .bg--neutral-dark-trans-60 { background-color: var(--neutral-dark-trans-60); } .bg--neutral-dark-trans-70 { background-color: var(--neutral-dark-trans-70); } .bg--neutral-dark-trans-80 { background-color: var(--neutral-dark-trans-80); } .bg--neutral-dark-trans-90 { background-color: var(--neutral-dark-trans-90); } .bg--neutral-ultra-dark-trans-10 { background-color: var(--neutral-ultra-dark-trans-10); } .bg--neutral-ultra-dark-trans-20 { background-color: var(--neutral-ultra-dark-trans-20); } .bg--neutral-ultra-dark-trans-30 { background-color: var(--neutral-ultra-dark-trans-30); } .bg--neutral-ultra-dark-trans-40 { background-color: var(--neutral-ultra-dark-trans-40); } .bg--neutral-ultra-dark-trans-50 { background-color: var(--neutral-ultra-dark-trans-50); } .bg--neutral-ultra-dark-trans-60 { background-color: var(--neutral-ultra-dark-trans-60); } .bg--neutral-ultra-dark-trans-70 { background-color: var(--neutral-ultra-dark-trans-70); } .bg--neutral-ultra-dark-trans-80 { background-color: var(--neutral-ultra-dark-trans-80); } .bg--neutral-ultra-dark-trans-90 { background-color: var(--neutral-ultra-dark-trans-90); } .bg--white { background-color: var(--white); } .bg--black { background-color: var(--black); } .bg--white-trans-10 { background-color: var(--white-trans-10); } .bg--white-trans-20 { background-color: var(--white-trans-20); } .bg--white-trans-30 { background-color: var(--white-trans-30); } .bg--white-trans-40 { background-color: var(--white-trans-40); } .bg--white-trans-50 { background-color: var(--white-trans-50); } .bg--white-trans-60 { background-color: var(--white-trans-60); } .bg--white-trans-70 { background-color: var(--white-trans-70); } .bg--white-trans-80 { background-color: var(--white-trans-80); } .bg--white-trans-90 { background-color: var(--white-trans-90); } .bg--black-trans-10 { background-color: var(--black-trans-10); } .bg--black-trans-20 { background-color: var(--black-trans-20); } .bg--black-trans-30 { background-color: var(--black-trans-30); } .bg--black-trans-40 { background-color: var(--black-trans-40); } .bg--black-trans-50 { background-color: var(--black-trans-50); } .bg--black-trans-60 { background-color: var(--black-trans-60); } .bg--black-trans-70 { background-color: var(--black-trans-70); } .bg--black-trans-80 { background-color: var(--black-trans-80); } .bg--black-trans-90 { background-color: var(--black-trans-90); } :has(> .is-bg) { position: relative; isolation: isolate; } :is(*, img, figure, picture).is-bg { position: var(--bg-position, absolute); inset: var(--bg-inset, 0); inline-size: var(--bg-width, 100%); block-size: var(--bg-height, 100%); border-radius: var(--bg-radius, 0); object-fit: var(--bg-object-fit, cover); object-position: var(--bg-object-position, center); z-index: var(--bg-z-index, -2); border-radius: var(--bg-radius, 0); } :is(*, img, figure, picture).is-bg > img { object-fit: var(--bg-object-fit, cover); object-position: var(--bg-object-position, center); } .content-grid > :is(*, img, figure, picture).is-bg { grid-column: full; } .bg--ultra-light { background-color: var(--bg-ultra-light); } .bg--light { background-color: var(--bg-light); } .bg--dark { background-color: var(--bg-dark); } .bg--ultra-dark { background-color: var(--bg-ultra-dark); } .text--light.text--light, .text--light.text--light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--text-light); } .text--light-muted.text--light-muted, .text--light-muted.text--light-muted :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--text-light-muted); } .text--dark.text--dark, .text--dark.text--dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--text-dark); } .text--dark-muted.text--dark-muted, .text--dark-muted.text--dark-muted :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--text-dark-muted); } .content-grid { --full: minmax(var(--gutter), 1fr); padding-inline: 0; column-gap: 0 !important; display: grid !important; grid-template-columns: [full-start] var(--full) [feature-max-start] minmax(0, var(--feature-max-width, 100px)) [feature-start] minmax(0, var(--feature-width, 50px)) [content-start] min(var(--content-width), 100% - var(--gutter) * 2) [content-end] minmax(0, var(--feature-width, 50px)) [feature-end] minmax(0, var(--feature-max-width, 100px)) [feature-max-end] var(--full) [full-end]; } .content-grid > :not(.content--feature, .content--feature-max, .content--full, .content--full-safe) { width: 100%; } .content-grid > :where(:not(.content--feature, .content--feature-max, .content--full, .content--full-safe)) { grid-column: content; } .content--feature { grid-column: feature; } .content--feature-max { grid-column: feature-max; } .content--full { grid-column: full; } .content--full-safe { grid-column: full; padding-inline: var(--gutter); } .content-grid:where(.content--full-safe) { padding-inline: var(--gutter); } :is(.content--feature, .content--feature-max, .content--full, .content--full-safe):not(.content-grid--off :is(.content--feature, .content--feature-max, .content--full, .content--full-safe)) { width: 100% !important; max-width: 100%; } .content-grid:is([class*="padding--"], [class*="section--"], [class*="header--"]) { padding-inline: 0; } :root, .color-scheme--main { --bg-ultra-light-text: var(--text-dark); --bg-light-text: var(--text-dark); --bg-dark-text: var(--text-light); --bg-ultra-dark-text: var(--text-light); --bg-ultra-light-heading: var(--text-dark); --bg-light-heading: var(--text-dark); --bg-dark-heading: var(--text-light); --bg-ultra-dark-heading: var(--text-light); --bg-ultra-light-link: var(--primary); --bg-ultra-light-link-hover: var(--primary-hover); --bg-light-link: var(--primary); --bg-light-link-hover: var(--primary-hover); --bg-dark-link: var(--primary); --bg-dark-link-hover: var(--primary-hover); --bg-ultra-dark-link: var(--primary); --bg-ultra-dark-link-hover: var(--primary-hover); } .color-scheme--alt { --bg-ultra-light-text: var(--text-dark); --bg-light-text: var(--text-dark); --bg-dark-text: var(--text-light); --bg-ultra-dark-text: var(--text-light); --bg-ultra-light-heading: var(--text-dark); --bg-light-heading: var(--text-dark); --bg-dark-heading: var(--text-light); --bg-ultra-dark-heading: var(--text-light); --bg-ultra-dark-text: var(--text-light); --bg-ultra-light-link: var(--primary); --bg-ultra-light-link-hover: var(--primary-hover); --bg-light-link: var(--primary); --bg-light-link-hover: var(--primary-hover); --bg-dark-link: var(--primary); --bg-dark-link-hover: var(--primary-hover); --bg-ultra-dark-link: var(--primary); --bg-ultra-dark-link-hover: var(--primary-hover); } :where(.bg--ultra-light), :where(.bg--ultra-light) :is(h1, h2, h3, h4, h5, h6) { color: var(--bg-ultra-light-text); } :where(.bg--light), :where(.bg--light) :is(h1, h2, h3, h4, h5, h6) { color: var(--bg-light-text); } :where(.bg--dark), :where(.bg--dark) :is(h1, h2, h3, h4, h5, h6) { color: var(--bg-dark-text); } :where(.bg--ultra-dark), :where(.bg--ultra-dark) :is(h1, h2, h3, h4, h5, h6) { color: var(--bg-ultra-dark-text); } .bg--ultra-light :where(h1, h2, h3, h4, h5, h6) { --heading-color: var(--bg-ultra-light-heading); --h1-color: var(--bg-ultra-light-heading); --h2-color: var(--bg-ultra-light-heading); --h3-color: var(--bg-ultra-light-heading); --h4-color: var(--bg-ultra-light-heading); --h5-color: var(--bg-ultra-light-heading); --h6-color: var(--bg-ultra-light-heading); color: var(--bg-ultra-light-heading); } .bg--light :where(h1, h2, h3, h4, h5, h6) { --heading-color: var(--bg-light-heading); --h1-color: var(--bg-light-heading); --h2-color: var(--bg-light-heading); --h3-color: var(--bg-light-heading); --h4-color: var(--bg-light-heading); --h5-color: var(--bg-light-heading); --h6-color: var(--bg-light-heading); color: var(--bg-light-heading); } .bg--dark :where(h1, h2, h3, h4, h5, h6) { --heading-color: var(--bg-dark-heading); --h1-color: var(--bg-dark-heading); --h2-color: var(--bg-dark-heading); --h3-color: var(--bg-dark-heading); --h4-color: var(--bg-dark-heading); --h5-color: var(--bg-dark-heading); --h6-color: var(--bg-dark-heading); color: var(--bg-dark-heading); } .bg--ultra-dark :where(h1, h2, h3, h4, h5, h6) { --heading-color: var(--bg-ultra-dark-heading); --h1-color: var(--bg-ultra-dark-heading); --h2-color: var(--bg-ultra-dark-heading); --h3-color: var(--bg-ultra-dark-heading); --h4-color: var(--bg-ultra-dark-heading); --h5-color: var(--bg-ultra-dark-heading); --h6-color: var(--bg-ultra-dark-heading); color: var(--bg-ultra-dark-heading); } .bg--ultra-light :is(a):where(:not([class*= btn--], :is(h1, h2, h3, h4, h5, h6) a)) { color: var(--bg-ultra-light-link); } .bg--ultra-light :is(a):where(:not([class*= btn--], :is(h1, h2, h3, h4, h5, h6) a)):hover { color: var(--bg-ultra-light-link-hover); } .bg--light :is(a):where(:not([class*= btn--], :is(h1, h2, h3, h4, h5, h6) a)) { color: var(--bg-light-link); } .bg--light :is(a):where(:not([class*= btn--], :is(h1, h2, h3, h4, h5, h6) a)):hover { color: var(--bg-light-link-hover); } .bg--dark :is(a):where(:not([class*= btn--], :is(h1, h2, h3, h4, h5, h6) a)) { color: var(--bg-dark-link); } .bg--dark :is(a):where(:not([class*= btn--], :is(h1, h2, h3, h4, h5, h6) a)):hover { color: var(--bg-dark-link-hover); } .bg--ultra-dark :is(a):where(:not([class*= btn--], :is(h1, h2, h3, h4, h5, h6) a)) { color: var(--bg-ultra-dark-link); } .bg--ultra-dark :is(a):where(:not([class*= btn--], :is(h1, h2, h3, h4, h5, h6) a)):hover { color: var(--bg-ultra-dark-link-hover); } .bg--ultra-light [class*="btn--"] { --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .bg--ultra-light [class*="btn--"].btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-hover); --btn-text-color: var(--primary-ultra-light); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .bg--light [class*="btn--"] { --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .bg--light [class*="btn--"].btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-hover); --btn-text-color: var(--primary-ultra-light); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .bg--dark [class*="btn--"] { --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .bg--dark [class*="btn--"].btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-hover); --btn-text-color: var(--primary-ultra-light); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .bg--ultra-dark [class*="btn--"] { --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .bg--ultra-dark [class*="btn--"].btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-hover); --btn-text-color: var(--primary-ultra-light); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .margin-top--xs { margin-block-start: var(--space-xs); } .margin-top--s { margin-block-start: var(--space-s); } .margin-top--m { margin-block-start: var(--space-m); } .margin-top--l { margin-block-start: var(--space-l); } .margin-top--xl { margin-block-start: var(--space-xl); } .margin-top--xxl { margin-block-start: var(--space-xxl); } .margin-right--xs { margin-inline-end: var(--space-xs); } .margin-right--s { margin-inline-end: var(--space-s); } .margin-right--m { margin-inline-end: var(--space-m); } .margin-right--l { margin-inline-end: var(--space-l); } .margin-right--xl { margin-inline-end: var(--space-xl); } .margin-right--xxl { margin-inline-end: var(--space-xxl); } .margin-bottom--xs { margin-block-end: var(--space-xs); } .margin-bottom--s { margin-block-end: var(--space-s); } .margin-bottom--m { margin-block-end: var(--space-m); } .margin-bottom--l { margin-block-end: var(--space-l); } .margin-bottom--xl { margin-block-end: var(--space-xl); } .margin-bottom--xxl { margin-block-end: var(--space-xxl); } .margin-left--xs { margin-inline-start: var(--space-xs); } .margin-left--s { margin-inline-start: var(--space-s); } .margin-left--m { margin-inline-start: var(--space-m); } .margin-left--l { margin-inline-start: var(--space-l); } .margin-left--xl { margin-inline-start: var(--space-xl); } .margin-left--xxl { margin-inline-start: var(--space-xxl); } .margin-block--xs { margin-block: var(--space-xs); } .margin-block--s { margin-block: var(--space-s); } .margin-block--m { margin-block: var(--space-m); } .margin-block--l { margin-block: var(--space-l); } .margin-block--xl { margin-block: var(--space-xl); } .margin-block--xxl { margin-block: var(--space-xxl); } .margin-inline--xs { margin-inline: var(--space-xs); } .margin-inline--s { margin-inline: var(--space-s); } .margin-inline--m { margin-inline: var(--space-m); } .margin-inline--l { margin-inline: var(--space-l); } .margin-inline--xl { margin-inline: var(--space-xl); } .margin-inline--xxl { margin-inline: var(--space-xxl); } .margin--none { padding: 0; } @media (max-width: 1366px) { .margin-top--xs-xl { margin-block-start: var(--space-xs); } .margin-top--s-xl { margin-block-start: var(--space-s); } .margin-top--m-xl { margin-block-start: var(--space-m); } .margin-top--l-xl { margin-block-start: var(--space-l); } .margin-top--xl-xl { margin-block-start: var(--space-xl); } .margin-top--xxl-xl { margin-block-start: var(--space-xxl); } .margin-right--xs-xl { margin-inline-end: var(--space-xs); } .margin-right--s-xl { margin-inline-end: var(--space-s); } .margin-right--m-xl { margin-inline-end: var(--space-m); } .margin-right--l-xl { margin-inline-end: var(--space-l); } .margin-right--xl-xl { margin-inline-end: var(--space-xl); } .margin-right--xxl-xl { margin-inline-end: var(--space-xxl); } .margin-bottom--xs-xl { margin-block-end: var(--space-xs); } .margin-bottom--s-xl { margin-block-end: var(--space-s); } .margin-bottom--m-xl { margin-block-end: var(--space-m); } .margin-bottom--l-xl { margin-block-end: var(--space-l); } .margin-bottom--xl-xl { margin-block-end: var(--space-xl); } .margin-bottom--xxl-xl { margin-block-end: var(--space-xxl); } .margin-left--xs-xl { margin-inline-start: var(--space-xs); } .margin-left--s-xl { margin-inline-start: var(--space-s); } .margin-left--m-xl { margin-inline-start: var(--space-m); } .margin-left--l-xl { margin-inline-start: var(--space-l); } .margin-left--xl-xl { margin-inline-start: var(--space-xl); } .margin-left--xxl-xl { margin-inline-start: var(--space-xxl); } .margin-block--xs-xl { margin-block: var(--space-xs); } .margin-block--s-xl { margin-block: var(--space-s); } .margin-block--m-xl { margin-block: var(--space-m); } .margin-block--l-xl { margin-block: var(--space-l); } .margin-block--xl-xl { margin-block: var(--space-xl); } .margin-block--xxl-xl { margin-block: var(--space-xxl); } .margin-inline--xs-xl { margin-inline: var(--space-xs); } .margin-inline--s-xl { margin-inline: var(--space-s); } .margin-inline--m-xl { margin-inline: var(--space-m); } .margin-inline--l-xl { margin-inline: var(--space-l); } .margin-inline--xl-xl { margin-inline: var(--space-xl); } .margin-inline--xxl-xl { margin-inline: var(--space-xxl); } .margin--xl-none { padding: 0; } } @media (max-width: 992px) { .margin-top--xs-l { margin-block-start: var(--space-xs); } .margin-top--s-l { margin-block-start: var(--space-s); } .margin-top--m-l { margin-block-start: var(--space-m); } .margin-top--l-l { margin-block-start: var(--space-l); } .margin-top--xl-l { margin-block-start: var(--space-xl); } .margin-top--xxl-l { margin-block-start: var(--space-xxl); } .margin-right--xs-l { margin-inline-end: var(--space-xs); } .margin-right--s-l { margin-inline-end: var(--space-s); } .margin-right--m-l { margin-inline-end: var(--space-m); } .margin-right--l-l { margin-inline-end: var(--space-l); } .margin-right--xl-l { margin-inline-end: var(--space-xl); } .margin-right--xxl-l { margin-inline-end: var(--space-xxl); } .margin-bottom--xs-l { margin-block-end: var(--space-xs); } .margin-bottom--s-l { margin-block-end: var(--space-s); } .margin-bottom--m-l { margin-block-end: var(--space-m); } .margin-bottom--l-l { margin-block-end: var(--space-l); } .margin-bottom--xl-l { margin-block-end: var(--space-xl); } .margin-bottom--xxl-l { margin-block-end: var(--space-xxl); } .margin-left--xs-l { margin-inline-start: var(--space-xs); } .margin-left--s-l { margin-inline-start: var(--space-s); } .margin-left--m-l { margin-inline-start: var(--space-m); } .margin-left--l-l { margin-inline-start: var(--space-l); } .margin-left--xl-l { margin-inline-start: var(--space-xl); } .margin-left--xxl-l { margin-inline-start: var(--space-xxl); } .margin-block--xs-l { margin-block: var(--space-xs); } .margin-block--s-l { margin-block: var(--space-s); } .margin-block--m-l { margin-block: var(--space-m); } .margin-block--l-l { margin-block: var(--space-l); } .margin-block--xl-l { margin-block: var(--space-xl); } .margin-block--xxl-l { margin-block: var(--space-xxl); } .margin-inline--xs-l { margin-inline: var(--space-xs); } .margin-inline--s-l { margin-inline: var(--space-s); } .margin-inline--m-l { margin-inline: var(--space-m); } .margin-inline--l-l { margin-inline: var(--space-l); } .margin-inline--xl-l { margin-inline: var(--space-xl); } .margin-inline--xxl-l { margin-inline: var(--space-xxl); } .margin--l-none { padding: 0; } } @media (max-width: 768px) { .margin-top--xs-m { margin-block-start: var(--space-xs); } .margin-top--s-m { margin-block-start: var(--space-s); } .margin-top--m-m { margin-block-start: var(--space-m); } .margin-top--l-m { margin-block-start: var(--space-l); } .margin-top--xl-m { margin-block-start: var(--space-xl); } .margin-top--xxl-m { margin-block-start: var(--space-xxl); } .margin-right--xs-m { margin-inline-end: var(--space-xs); } .margin-right--s-m { margin-inline-end: var(--space-s); } .margin-right--m-m { margin-inline-end: var(--space-m); } .margin-right--l-m { margin-inline-end: var(--space-l); } .margin-right--xl-m { margin-inline-end: var(--space-xl); } .margin-right--xxl-m { margin-inline-end: var(--space-xxl); } .margin-bottom--xs-m { margin-block-end: var(--space-xs); } .margin-bottom--s-m { margin-block-end: var(--space-s); } .margin-bottom--m-m { margin-block-end: var(--space-m); } .margin-bottom--l-m { margin-block-end: var(--space-l); } .margin-bottom--xl-m { margin-block-end: var(--space-xl); } .margin-bottom--xxl-m { margin-block-end: var(--space-xxl); } .margin-left--xs-m { margin-inline-start: var(--space-xs); } .margin-left--s-m { margin-inline-start: var(--space-s); } .margin-left--m-m { margin-inline-start: var(--space-m); } .margin-left--l-m { margin-inline-start: var(--space-l); } .margin-left--xl-m { margin-inline-start: var(--space-xl); } .margin-left--xxl-m { margin-inline-start: var(--space-xxl); } .margin-block--xs-m { margin-block: var(--space-xs); } .margin-block--s-m { margin-block: var(--space-s); } .margin-block--m-m { margin-block: var(--space-m); } .margin-block--l-m { margin-block: var(--space-l); } .margin-block--xl-m { margin-block: var(--space-xl); } .margin-block--xxl-m { margin-block: var(--space-xxl); } .margin-inline--xs-m { margin-inline: var(--space-xs); } .margin-inline--s-m { margin-inline: var(--space-s); } .margin-inline--m-m { margin-inline: var(--space-m); } .margin-inline--l-m { margin-inline: var(--space-l); } .margin-inline--xl-m { margin-inline: var(--space-xl); } .margin-inline--xxl-m { margin-inline: var(--space-xxl); } .margin--m-none { padding: 0; } } @media (max-width: 480px) { .margin-top--xs-s { margin-block-start: var(--space-xs); } .margin-top--s-s { margin-block-start: var(--space-s); } .margin-top--m-s { margin-block-start: var(--space-m); } .margin-top--l-s { margin-block-start: var(--space-l); } .margin-top--xl-s { margin-block-start: var(--space-xl); } .margin-top--xxl-s { margin-block-start: var(--space-xxl); } .margin-right--xs-s { margin-inline-end: var(--space-xs); } .margin-right--s-s { margin-inline-end: var(--space-s); } .margin-right--m-s { margin-inline-end: var(--space-m); } .margin-right--l-s { margin-inline-end: var(--space-l); } .margin-right--xl-s { margin-inline-end: var(--space-xl); } .margin-right--xxl-s { margin-inline-end: var(--space-xxl); } .margin-bottom--xs-s { margin-block-end: var(--space-xs); } .margin-bottom--s-s { margin-block-end: var(--space-s); } .margin-bottom--m-s { margin-block-end: var(--space-m); } .margin-bottom--l-s { margin-block-end: var(--space-l); } .margin-bottom--xl-s { margin-block-end: var(--space-xl); } .margin-bottom--xxl-s { margin-block-end: var(--space-xxl); } .margin-left--xs-s { margin-inline-start: var(--space-xs); } .margin-left--s-s { margin-inline-start: var(--space-s); } .margin-left--m-s { margin-inline-start: var(--space-m); } .margin-left--l-s { margin-inline-start: var(--space-l); } .margin-left--xl-s { margin-inline-start: var(--space-xl); } .margin-left--xxl-s { margin-inline-start: var(--space-xxl); } .margin-block--xs-s { margin-block: var(--space-xs); } .margin-block--s-s { margin-block: var(--space-s); } .margin-block--m-s { margin-block: var(--space-m); } .margin-block--l-s { margin-block: var(--space-l); } .margin-block--xl-s { margin-block: var(--space-xl); } .margin-block--xxl-s { margin-block: var(--space-xxl); } .margin-inline--xs-s { margin-inline: var(--space-xs); } .margin-inline--s-s { margin-inline: var(--space-s); } .margin-inline--m-s { margin-inline: var(--space-m); } .margin-inline--l-s { margin-inline: var(--space-l); } .margin-inline--xl-s { margin-inline: var(--space-xl); } .margin-inline--xxl-s { margin-inline: var(--space-xxl); } .margin--s-none { padding: 0; } } .padding--xs { padding: var(--space-xs); } .padding--s { padding: var(--space-s); } .padding--m { padding: var(--space-m); } .padding--l { padding: var(--space-l); } .padding--xl { padding: var(--space-xl); } .padding--xxl { padding: var(--space-xxl); } .padding--none { padding: 0; } @media (max-width: 1366px) { .padding--xl-xs { padding: var(--space-xs); } .padding--xl-s { padding: var(--space-s); } .padding--xl-m { padding: var(--space-m); } .padding--xl-l { padding: var(--space-l); } .padding--xl-xl { padding: var(--space-xl); } .padding--xl-xxl { padding: var(--space-xxl); } .padding--xl-none { padding: 0; } } @media (max-width: 992px) { .padding--l-xs { padding: var(--space-xs); } .padding--l-s { padding: var(--space-s); } .padding--l-m { padding: var(--space-m); } .padding--l-l { padding: var(--space-l); } .padding--l-xl { padding: var(--space-xl); } .padding--l-xxl { padding: var(--space-xxl); } .padding--l-none { padding: 0; } } @media (max-width: 768px) { .padding--m-xs { padding: var(--space-xs); } .padding--m-s { padding: var(--space-s); } .padding--m-m { padding: var(--space-m); } .padding--m-l { padding: var(--space-l); } .padding--m-xl { padding: var(--space-xl); } .padding--m-xxl { padding: var(--space-xxl); } .padding--m-none { padding: 0; } } @media (max-width: 480px) { .padding--s-xs { padding: var(--space-xs); } .padding--s-s { padding: var(--space-s); } .padding--s-m { padding: var(--space-m); } .padding--s-l { padding: var(--space-l); } .padding--s-xl { padding: var(--space-xl); } .padding--s-xxl { padding: var(--space-xxl); } .padding--s-none { padding: 0; } } .header--xs { padding-block: var(--space-xs); padding-inline: var(--gutter); } .header--s { padding-block: var(--space-s); padding-inline: var(--gutter); } .header--m { padding-block: var(--space-m); padding-inline: var(--gutter); } .header--l { padding-block: var(--space-l); padding-inline: var(--gutter); } .header--xl { padding-block: var(--space-xl); padding-inline: var(--gutter); } .header--xxl { padding-block: var(--space-xxl); padding-inline: var(--gutter); } .section--xs { padding-block: var(--section-space-xs); padding-inline: var(--gutter); } .section--s { padding-block: var(--section-space-s); padding-inline: var(--gutter); } .section--m { padding-block: var(--section-space-m); padding-inline: var(--gutter); } .section--l { padding-block: var(--section-space-l); padding-inline: var(--gutter); } .section--xl { padding-block: var(--section-space-xl); padding-inline: var(--gutter); } .section--xxl { padding-block: var(--section-space-xxl); padding-inline: var(--gutter); } .section--none { padding-block: 0; padding-inline: var(--gutter); } @media (max-width: 1366px) { .section--xl-xs { padding-block: var(--section-space-xs); padding-inline: var(--gutter); } .section--xl-s { padding-block: var(--section-space-s); padding-inline: var(--gutter); } .section--xl-m { padding-block: var(--section-space-m); padding-inline: var(--gutter); } .section--xl-l { padding-block: var(--section-space-l); padding-inline: var(--gutter); } .section--xl-xl { padding-block: var(--section-space-xl); padding-inline: var(--gutter); } .section--xl-xxl { padding-block: var(--section-space-xxl); padding-inline: var(--gutter); } .section--xl-none { padding-inline: 0 var(--gutter); } } @media (max-width: 992px) { .section--l-xs { padding-block: var(--section-space-xs); padding-inline: var(--gutter); } .section--l-s { padding-block: var(--section-space-s); padding-inline: var(--gutter); } .section--l-m { padding-block: var(--section-space-m); padding-inline: var(--gutter); } .section--l-l { padding-block: var(--section-space-l); padding-inline: var(--gutter); } .section--l-xl { padding-block: var(--section-space-xl); padding-inline: var(--gutter); } .section--l-xxl { padding-block: var(--section-space-xxl); padding-inline: var(--gutter); } .section--l-none { padding-inline: 0 var(--gutter); } } @media (max-width: 768px) { .section--m-xs { padding-block: var(--section-space-xs); padding-inline: var(--gutter); } .section--m-s { padding-block: var(--section-space-s); padding-inline: var(--gutter); } .section--m-m { padding-block: var(--section-space-m); padding-inline: var(--gutter); } .section--m-l { padding-block: var(--section-space-l); padding-inline: var(--gutter); } .section--m-xl { padding-block: var(--section-space-xl); padding-inline: var(--gutter); } .section--m-xxl { padding-block: var(--section-space-xxl); padding-inline: var(--gutter); } .section--m-none { padding-inline: 0 var(--gutter); } } @media (max-width: 480px) { .section--s-xs { padding-block: var(--section-space-xs); padding-inline: var(--gutter); } .section--s-s { padding-block: var(--section-space-s); padding-inline: var(--gutter); } .section--s-m { padding-block: var(--section-space-m); padding-inline: var(--gutter); } .section--s-l { padding-block: var(--section-space-l); padding-inline: var(--gutter); } .section--s-xl { padding-block: var(--section-space-xl); padding-inline: var(--gutter); } .section--s-xxl { padding-block: var(--section-space-xxl); padding-inline: var(--gutter); } .section--s-none { padding-inline: 0 var(--gutter); } } .section__inner, .section__container, .acss__container { width: 100%; max-inline-size: var(--content-width); margin-inline: auto; } [class*="overlay--"] { position: relative; z-index: 0; } [class*="overlay--"]::before { content: ""; background: var(--overlay-background); position: absolute; inset: 0; z-index: -1; } .overlay--primary-trans-10 { --overlay-background: var(--primary-trans-10); } .overlay--primary-trans-20 { --overlay-background: var(--primary-trans-20); } .overlay--primary-trans-30 { --overlay-background: var(--primary-trans-30); } .overlay--primary-trans-40 { --overlay-background: var(--primary-trans-40); } .overlay--primary-trans-50 { --overlay-background: var(--primary-trans-50); } .overlay--primary-trans-60 { --overlay-background: var(--primary-trans-60); } .overlay--primary-trans-70 { --overlay-background: var(--primary-trans-70); } .overlay--primary-trans-80 { --overlay-background: var(--primary-trans-80); } .overlay--primary-trans-90 { --overlay-background: var(--primary-trans-90); } .overlay--primary-light-trans-10 { --overlay-background: var(--primary-light-trans-10); } .overlay--primary-light-trans-20 { --overlay-background: var(--primary-light-trans-20); } .overlay--primary-light-trans-30 { --overlay-background: var(--primary-light-trans-30); } .overlay--primary-light-trans-40 { --overlay-background: var(--primary-light-trans-40); } .overlay--primary-light-trans-50 { --overlay-background: var(--primary-light-trans-50); } .overlay--primary-light-trans-60 { --overlay-background: var(--primary-light-trans-60); } .overlay--primary-light-trans-70 { --overlay-background: var(--primary-light-trans-70); } .overlay--primary-light-trans-80 { --overlay-background: var(--primary-light-trans-80); } .overlay--primary-light-trans-90 { --overlay-background: var(--primary-light-trans-90); } .overlay--primary-dark-trans-10 { --overlay-background: var(--primary-dark-trans-10); } .overlay--primary-dark-trans-20 { --overlay-background: var(--primary-dark-trans-20); } .overlay--primary-dark-trans-30 { --overlay-background: var(--primary-dark-trans-30); } .overlay--primary-dark-trans-40 { --overlay-background: var(--primary-dark-trans-40); } .overlay--primary-dark-trans-50 { --overlay-background: var(--primary-dark-trans-50); } .overlay--primary-dark-trans-60 { --overlay-background: var(--primary-dark-trans-60); } .overlay--primary-dark-trans-70 { --overlay-background: var(--primary-dark-trans-70); } .overlay--primary-dark-trans-80 { --overlay-background: var(--primary-dark-trans-80); } .overlay--primary-dark-trans-90 { --overlay-background: var(--primary-dark-trans-90); } .overlay--primary-ultra-dark-trans-10 { --overlay-background: var(--primary-ultra-dark-trans-10); } .overlay--primary-ultra-dark-trans-20 { --overlay-background: var(--primary-ultra-dark-trans-20); } .overlay--primary-ultra-dark-trans-30 { --overlay-background: var(--primary-ultra-dark-trans-30); } .overlay--primary-ultra-dark-trans-40 { --overlay-background: var(--primary-ultra-dark-trans-40); } .overlay--primary-ultra-dark-trans-50 { --overlay-background: var(--primary-ultra-dark-trans-50); } .overlay--primary-ultra-dark-trans-60 { --overlay-background: var(--primary-ultra-dark-trans-60); } .overlay--primary-ultra-dark-trans-70 { --overlay-background: var(--primary-ultra-dark-trans-70); } .overlay--primary-ultra-dark-trans-80 { --overlay-background: var(--primary-ultra-dark-trans-80); } .overlay--primary-ultra-dark-trans-90 { --overlay-background: var(--primary-ultra-dark-trans-90); } .overlay--secondary-trans-10 { --overlay-background: var(--secondary-trans-10); } .overlay--secondary-trans-20 { --overlay-background: var(--secondary-trans-20); } .overlay--secondary-trans-30 { --overlay-background: var(--secondary-trans-30); } .overlay--secondary-trans-40 { --overlay-background: var(--secondary-trans-40); } .overlay--secondary-trans-50 { --overlay-background: var(--secondary-trans-50); } .overlay--secondary-trans-60 { --overlay-background: var(--secondary-trans-60); } .overlay--secondary-trans-70 { --overlay-background: var(--secondary-trans-70); } .overlay--secondary-trans-80 { --overlay-background: var(--secondary-trans-80); } .overlay--secondary-trans-90 { --overlay-background: var(--secondary-trans-90); } .overlay--secondary-light-trans-10 { --overlay-background: var(--secondary-light-trans-10); } .overlay--secondary-light-trans-20 { --overlay-background: var(--secondary-light-trans-20); } .overlay--secondary-light-trans-30 { --overlay-background: var(--secondary-light-trans-30); } .overlay--secondary-light-trans-40 { --overlay-background: var(--secondary-light-trans-40); } .overlay--secondary-light-trans-50 { --overlay-background: var(--secondary-light-trans-50); } .overlay--secondary-light-trans-60 { --overlay-background: var(--secondary-light-trans-60); } .overlay--secondary-light-trans-70 { --overlay-background: var(--secondary-light-trans-70); } .overlay--secondary-light-trans-80 { --overlay-background: var(--secondary-light-trans-80); } .overlay--secondary-light-trans-90 { --overlay-background: var(--secondary-light-trans-90); } .overlay--secondary-dark-trans-10 { --overlay-background: var(--secondary-dark-trans-10); } .overlay--secondary-dark-trans-20 { --overlay-background: var(--secondary-dark-trans-20); } .overlay--secondary-dark-trans-30 { --overlay-background: var(--secondary-dark-trans-30); } .overlay--secondary-dark-trans-40 { --overlay-background: var(--secondary-dark-trans-40); } .overlay--secondary-dark-trans-50 { --overlay-background: var(--secondary-dark-trans-50); } .overlay--secondary-dark-trans-60 { --overlay-background: var(--secondary-dark-trans-60); } .overlay--secondary-dark-trans-70 { --overlay-background: var(--secondary-dark-trans-70); } .overlay--secondary-dark-trans-80 { --overlay-background: var(--secondary-dark-trans-80); } .overlay--secondary-dark-trans-90 { --overlay-background: var(--secondary-dark-trans-90); } .overlay--secondary-ultra-dark-trans-10 { --overlay-background: var(--secondary-ultra-dark-trans-10); } .overlay--secondary-ultra-dark-trans-20 { --overlay-background: var(--secondary-ultra-dark-trans-20); } .overlay--secondary-ultra-dark-trans-30 { --overlay-background: var(--secondary-ultra-dark-trans-30); } .overlay--secondary-ultra-dark-trans-40 { --overlay-background: var(--secondary-ultra-dark-trans-40); } .overlay--secondary-ultra-dark-trans-50 { --overlay-background: var(--secondary-ultra-dark-trans-50); } .overlay--secondary-ultra-dark-trans-60 { --overlay-background: var(--secondary-ultra-dark-trans-60); } .overlay--secondary-ultra-dark-trans-70 { --overlay-background: var(--secondary-ultra-dark-trans-70); } .overlay--secondary-ultra-dark-trans-80 { --overlay-background: var(--secondary-ultra-dark-trans-80); } .overlay--secondary-ultra-dark-trans-90 { --overlay-background: var(--secondary-ultra-dark-trans-90); } .overlay--tertiary-trans-10 { --overlay-background: var(--tertiary-trans-10); } .overlay--tertiary-trans-20 { --overlay-background: var(--tertiary-trans-20); } .overlay--tertiary-trans-30 { --overlay-background: var(--tertiary-trans-30); } .overlay--tertiary-trans-40 { --overlay-background: var(--tertiary-trans-40); } .overlay--tertiary-trans-50 { --overlay-background: var(--tertiary-trans-50); } .overlay--tertiary-trans-60 { --overlay-background: var(--tertiary-trans-60); } .overlay--tertiary-trans-70 { --overlay-background: var(--tertiary-trans-70); } .overlay--tertiary-trans-80 { --overlay-background: var(--tertiary-trans-80); } .overlay--tertiary-trans-90 { --overlay-background: var(--tertiary-trans-90); } .overlay--tertiary-light-trans-10 { --overlay-background: var(--tertiary-light-trans-10); } .overlay--tertiary-light-trans-20 { --overlay-background: var(--tertiary-light-trans-20); } .overlay--tertiary-light-trans-30 { --overlay-background: var(--tertiary-light-trans-30); } .overlay--tertiary-light-trans-40 { --overlay-background: var(--tertiary-light-trans-40); } .overlay--tertiary-light-trans-50 { --overlay-background: var(--tertiary-light-trans-50); } .overlay--tertiary-light-trans-60 { --overlay-background: var(--tertiary-light-trans-60); } .overlay--tertiary-light-trans-70 { --overlay-background: var(--tertiary-light-trans-70); } .overlay--tertiary-light-trans-80 { --overlay-background: var(--tertiary-light-trans-80); } .overlay--tertiary-light-trans-90 { --overlay-background: var(--tertiary-light-trans-90); } .overlay--tertiary-dark-trans-10 { --overlay-background: var(--tertiary-dark-trans-10); } .overlay--tertiary-dark-trans-20 { --overlay-background: var(--tertiary-dark-trans-20); } .overlay--tertiary-dark-trans-30 { --overlay-background: var(--tertiary-dark-trans-30); } .overlay--tertiary-dark-trans-40 { --overlay-background: var(--tertiary-dark-trans-40); } .overlay--tertiary-dark-trans-50 { --overlay-background: var(--tertiary-dark-trans-50); } .overlay--tertiary-dark-trans-60 { --overlay-background: var(--tertiary-dark-trans-60); } .overlay--tertiary-dark-trans-70 { --overlay-background: var(--tertiary-dark-trans-70); } .overlay--tertiary-dark-trans-80 { --overlay-background: var(--tertiary-dark-trans-80); } .overlay--tertiary-dark-trans-90 { --overlay-background: var(--tertiary-dark-trans-90); } .overlay--tertiary-ultra-dark-trans-10 { --overlay-background: var(--tertiary-ultra-dark-trans-10); } .overlay--tertiary-ultra-dark-trans-20 { --overlay-background: var(--tertiary-ultra-dark-trans-20); } .overlay--tertiary-ultra-dark-trans-30 { --overlay-background: var(--tertiary-ultra-dark-trans-30); } .overlay--tertiary-ultra-dark-trans-40 { --overlay-background: var(--tertiary-ultra-dark-trans-40); } .overlay--tertiary-ultra-dark-trans-50 { --overlay-background: var(--tertiary-ultra-dark-trans-50); } .overlay--tertiary-ultra-dark-trans-60 { --overlay-background: var(--tertiary-ultra-dark-trans-60); } .overlay--tertiary-ultra-dark-trans-70 { --overlay-background: var(--tertiary-ultra-dark-trans-70); } .overlay--tertiary-ultra-dark-trans-80 { --overlay-background: var(--tertiary-ultra-dark-trans-80); } .overlay--tertiary-ultra-dark-trans-90 { --overlay-background: var(--tertiary-ultra-dark-trans-90); } .overlay--accent-trans-10 { --overlay-background: var(--accent-trans-10); } .overlay--accent-trans-20 { --overlay-background: var(--accent-trans-20); } .overlay--accent-trans-30 { --overlay-background: var(--accent-trans-30); } .overlay--accent-trans-40 { --overlay-background: var(--accent-trans-40); } .overlay--accent-trans-50 { --overlay-background: var(--accent-trans-50); } .overlay--accent-trans-60 { --overlay-background: var(--accent-trans-60); } .overlay--accent-trans-70 { --overlay-background: var(--accent-trans-70); } .overlay--accent-trans-80 { --overlay-background: var(--accent-trans-80); } .overlay--accent-trans-90 { --overlay-background: var(--accent-trans-90); } .overlay--accent-light-trans-10 { --overlay-background: var(--accent-light-trans-10); } .overlay--accent-light-trans-20 { --overlay-background: var(--accent-light-trans-20); } .overlay--accent-light-trans-30 { --overlay-background: var(--accent-light-trans-30); } .overlay--accent-light-trans-40 { --overlay-background: var(--accent-light-trans-40); } .overlay--accent-light-trans-50 { --overlay-background: var(--accent-light-trans-50); } .overlay--accent-light-trans-60 { --overlay-background: var(--accent-light-trans-60); } .overlay--accent-light-trans-70 { --overlay-background: var(--accent-light-trans-70); } .overlay--accent-light-trans-80 { --overlay-background: var(--accent-light-trans-80); } .overlay--accent-light-trans-90 { --overlay-background: var(--accent-light-trans-90); } .overlay--accent-dark-trans-10 { --overlay-background: var(--accent-dark-trans-10); } .overlay--accent-dark-trans-20 { --overlay-background: var(--accent-dark-trans-20); } .overlay--accent-dark-trans-30 { --overlay-background: var(--accent-dark-trans-30); } .overlay--accent-dark-trans-40 { --overlay-background: var(--accent-dark-trans-40); } .overlay--accent-dark-trans-50 { --overlay-background: var(--accent-dark-trans-50); } .overlay--accent-dark-trans-60 { --overlay-background: var(--accent-dark-trans-60); } .overlay--accent-dark-trans-70 { --overlay-background: var(--accent-dark-trans-70); } .overlay--accent-dark-trans-80 { --overlay-background: var(--accent-dark-trans-80); } .overlay--accent-dark-trans-90 { --overlay-background: var(--accent-dark-trans-90); } .overlay--accent-ultra-dark-trans-10 { --overlay-background: var(--accent-ultra-dark-trans-10); } .overlay--accent-ultra-dark-trans-20 { --overlay-background: var(--accent-ultra-dark-trans-20); } .overlay--accent-ultra-dark-trans-30 { --overlay-background: var(--accent-ultra-dark-trans-30); } .overlay--accent-ultra-dark-trans-40 { --overlay-background: var(--accent-ultra-dark-trans-40); } .overlay--accent-ultra-dark-trans-50 { --overlay-background: var(--accent-ultra-dark-trans-50); } .overlay--accent-ultra-dark-trans-60 { --overlay-background: var(--accent-ultra-dark-trans-60); } .overlay--accent-ultra-dark-trans-70 { --overlay-background: var(--accent-ultra-dark-trans-70); } .overlay--accent-ultra-dark-trans-80 { --overlay-background: var(--accent-ultra-dark-trans-80); } .overlay--accent-ultra-dark-trans-90 { --overlay-background: var(--accent-ultra-dark-trans-90); } .overlay--neutral-trans-10 { --overlay-background: var(--neutral-trans-10); } .overlay--neutral-trans-20 { --overlay-background: var(--neutral-trans-20); } .overlay--neutral-trans-30 { --overlay-background: var(--neutral-trans-30); } .overlay--neutral-trans-40 { --overlay-background: var(--neutral-trans-40); } .overlay--neutral-trans-50 { --overlay-background: var(--neutral-trans-50); } .overlay--neutral-trans-60 { --overlay-background: var(--neutral-trans-60); } .overlay--neutral-trans-70 { --overlay-background: var(--neutral-trans-70); } .overlay--neutral-trans-80 { --overlay-background: var(--neutral-trans-80); } .overlay--neutral-trans-90 { --overlay-background: var(--neutral-trans-90); } .overlay--neutral-light-trans-10 { --overlay-background: var(--neutral-light-trans-10); } .overlay--neutral-light-trans-20 { --overlay-background: var(--neutral-light-trans-20); } .overlay--neutral-light-trans-30 { --overlay-background: var(--neutral-light-trans-30); } .overlay--neutral-light-trans-40 { --overlay-background: var(--neutral-light-trans-40); } .overlay--neutral-light-trans-50 { --overlay-background: var(--neutral-light-trans-50); } .overlay--neutral-light-trans-60 { --overlay-background: var(--neutral-light-trans-60); } .overlay--neutral-light-trans-70 { --overlay-background: var(--neutral-light-trans-70); } .overlay--neutral-light-trans-80 { --overlay-background: var(--neutral-light-trans-80); } .overlay--neutral-light-trans-90 { --overlay-background: var(--neutral-light-trans-90); } .overlay--neutral-dark-trans-10 { --overlay-background: var(--neutral-dark-trans-10); } .overlay--neutral-dark-trans-20 { --overlay-background: var(--neutral-dark-trans-20); } .overlay--neutral-dark-trans-30 { --overlay-background: var(--neutral-dark-trans-30); } .overlay--neutral-dark-trans-40 { --overlay-background: var(--neutral-dark-trans-40); } .overlay--neutral-dark-trans-50 { --overlay-background: var(--neutral-dark-trans-50); } .overlay--neutral-dark-trans-60 { --overlay-background: var(--neutral-dark-trans-60); } .overlay--neutral-dark-trans-70 { --overlay-background: var(--neutral-dark-trans-70); } .overlay--neutral-dark-trans-80 { --overlay-background: var(--neutral-dark-trans-80); } .overlay--neutral-dark-trans-90 { --overlay-background: var(--neutral-dark-trans-90); } .overlay--neutral-ultra-dark-trans-10 { --overlay-background: var(--neutral-ultra-dark-trans-10); } .overlay--neutral-ultra-dark-trans-20 { --overlay-background: var(--neutral-ultra-dark-trans-20); } .overlay--neutral-ultra-dark-trans-30 { --overlay-background: var(--neutral-ultra-dark-trans-30); } .overlay--neutral-ultra-dark-trans-40 { --overlay-background: var(--neutral-ultra-dark-trans-40); } .overlay--neutral-ultra-dark-trans-50 { --overlay-background: var(--neutral-ultra-dark-trans-50); } .overlay--neutral-ultra-dark-trans-60 { --overlay-background: var(--neutral-ultra-dark-trans-60); } .overlay--neutral-ultra-dark-trans-70 { --overlay-background: var(--neutral-ultra-dark-trans-70); } .overlay--neutral-ultra-dark-trans-80 { --overlay-background: var(--neutral-ultra-dark-trans-80); } .overlay--neutral-ultra-dark-trans-90 { --overlay-background: var(--neutral-ultra-dark-trans-90); } .overlay--white-trans-10 { --overlay-background: var(--white-trans-10); } .overlay--white-trans-20 { --overlay-background: var(--white-trans-20); } .overlay--white-trans-30 { --overlay-background: var(--white-trans-30); } .overlay--white-trans-40 { --overlay-background: var(--white-trans-40); } .overlay--white-trans-50 { --overlay-background: var(--white-trans-50); } .overlay--white-trans-60 { --overlay-background: var(--white-trans-60); } .overlay--white-trans-70 { --overlay-background: var(--white-trans-70); } .overlay--white-trans-80 { --overlay-background: var(--white-trans-80); } .overlay--white-trans-90 { --overlay-background: var(--white-trans-90); } .overlay--black-trans-10 { --overlay-background: var(--black-trans-10); } .overlay--black-trans-20 { --overlay-background: var(--black-trans-20); } .overlay--black-trans-30 { --overlay-background: var(--black-trans-30); } .overlay--black-trans-40 { --overlay-background: var(--black-trans-40); } .overlay--black-trans-50 { --overlay-background: var(--black-trans-50); } .overlay--black-trans-60 { --overlay-background: var(--black-trans-60); } .overlay--black-trans-70 { --overlay-background: var(--black-trans-70); } .overlay--black-trans-80 { --overlay-background: var(--black-trans-80); } .overlay--black-trans-90 { --overlay-background: var(--black-trans-90); } figure[class*="overlay--"]::before { z-index: 0; } .text--primary.text--primary, .text--primary.text--primary :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--primary); } .text--primary-hover.text--primary-hover, .text--primary-hover.text--primary-hover :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--primary-hover); } .text--primary-ultra-light.text--primary-ultra-light, .text--primary-ultra-light.text--primary-ultra-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--primary-ultra-light); } .text--primary-light.text--primary-light, .text--primary-light.text--primary-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--primary-light); } .text--primary-semi-light.text--primary-semi-light, .text--primary-semi-light.text--primary-semi-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--primary-semi-light); } .text--primary-semi-dark.text--primary-semi-dark, .text--primary-semi-dark.text--primary-semi-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--primary-semi-dark); } .text--primary-dark.text--primary-dark, .text--primary-dark.text--primary-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--primary-dark); } .text--primary-ultra-dark.text--primary-ultra-dark, .text--primary-ultra-dark.text--primary-ultra-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--primary-ultra-dark); } .text--secondary.text--secondary, .text--secondary.text--secondary :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--secondary); } .text--secondary-hover.text--secondary-hover, .text--secondary-hover.text--secondary-hover :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--secondary-hover); } .text--secondary-ultra-light.text--secondary-ultra-light, .text--secondary-ultra-light.text--secondary-ultra-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--secondary-ultra-light); } .text--secondary-light.text--secondary-light, .text--secondary-light.text--secondary-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--secondary-light); } .text--secondary-semi-light.text--secondary-semi-light, .text--secondary-semi-light.text--secondary-semi-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--secondary-semi-light); } .text--secondary-semi-dark.text--secondary-semi-dark, .text--secondary-semi-dark.text--secondary-semi-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--secondary-semi-dark); } .text--secondary-dark.text--secondary-dark, .text--secondary-dark.text--secondary-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--secondary-dark); } .text--secondary-ultra-dark.text--secondary-ultra-dark, .text--secondary-ultra-dark.text--secondary-ultra-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--secondary-ultra-dark); } .text--tertiary.text--tertiary, .text--tertiary.text--tertiary :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--tertiary); } .text--tertiary-hover.text--tertiary-hover, .text--tertiary-hover.text--tertiary-hover :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--tertiary-hover); } .text--tertiary-ultra-light.text--tertiary-ultra-light, .text--tertiary-ultra-light.text--tertiary-ultra-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--tertiary-ultra-light); } .text--tertiary-light.text--tertiary-light, .text--tertiary-light.text--tertiary-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--tertiary-light); } .text--tertiary-semi-light.text--tertiary-semi-light, .text--tertiary-semi-light.text--tertiary-semi-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--tertiary-semi-light); } .text--tertiary-semi-dark.text--tertiary-semi-dark, .text--tertiary-semi-dark.text--tertiary-semi-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--tertiary-semi-dark); } .text--tertiary-dark.text--tertiary-dark, .text--tertiary-dark.text--tertiary-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--tertiary-dark); } .text--tertiary-ultra-dark.text--tertiary-ultra-dark, .text--tertiary-ultra-dark.text--tertiary-ultra-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--tertiary-ultra-dark); } .text--accent.text--accent, .text--accent.text--accent :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--accent); } .text--accent-hover.text--accent-hover, .text--accent-hover.text--accent-hover :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--accent-hover); } .text--accent-ultra-light.text--accent-ultra-light, .text--accent-ultra-light.text--accent-ultra-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--accent-ultra-light); } .text--accent-light.text--accent-light, .text--accent-light.text--accent-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--accent-light); } .text--accent-semi-light.text--accent-semi-light, .text--accent-semi-light.text--accent-semi-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--accent-semi-light); } .text--accent-semi-dark.text--accent-semi-dark, .text--accent-semi-dark.text--accent-semi-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--accent-semi-dark); } .text--accent-dark.text--accent-dark, .text--accent-dark.text--accent-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--accent-dark); } .text--accent-ultra-dark.text--accent-ultra-dark, .text--accent-ultra-dark.text--accent-ultra-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--accent-ultra-dark); } .text--neutral.text--neutral, .text--neutral.text--neutral :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--neutral); } .text--neutral-hover.text--neutral-hover, .text--neutral-hover.text--neutral-hover :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--neutral-hover); } .text--neutral-ultra-light.text--neutral-ultra-light, .text--neutral-ultra-light.text--neutral-ultra-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--neutral-ultra-light); } .text--neutral-light.text--neutral-light, .text--neutral-light.text--neutral-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--neutral-light); } .text--neutral-semi-light.text--neutral-semi-light, .text--neutral-semi-light.text--neutral-semi-light :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--neutral-semi-light); } .text--neutral-semi-dark.text--neutral-semi-dark, .text--neutral-semi-dark.text--neutral-semi-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--neutral-semi-dark); } .text--neutral-dark.text--neutral-dark, .text--neutral-dark.text--neutral-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--neutral-dark); } .text--neutral-ultra-dark.text--neutral-ultra-dark, .text--neutral-ultra-dark.text--neutral-ultra-dark :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--neutral-ultra-dark); } .text--white.text--white, .text--white.text--white :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--white); } .text--black.text--black, .text--black.text--black :where(:is(h1, h2, h3, h4, h5, h6)) { color: var(--black); } :is(.text--xxl, .text--xl, .text--l, .text--m, .text--s, .text--xs), :is(.text--xxl, .text--xl, .text--l, .text--m, .text--s, .text--xs) > :is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { font-family: var(--text-font-family); line-height: var(--text-line-height); font-weight: var(--text-font-weight); text-wrap: var(--text-text-wrap); } .text--xxl, .text--xxl > :is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { font-size: var(--text-xxl); } .text--xxl:is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { max-width: var(--text-xxl-max-width); } .text--xl, .text--xl > :is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { font-size: var(--text-xl); } .text--xl:is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { max-width: var(--text-xl-max-width); } .text--l, .text--l > :is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { font-size: var(--text-l); } .text--l:is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { max-width: var(--text-l-max-width); } .text--m, .text--m > :is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { font-size: var(--text-m); font-weight: var(--text-m-font-weight); line-height: var(--text-m-line-height); } .text--m:is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { max-width: var(--text-m-max-width); } .text--s, .text--s > :is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { font-size: var(--text-s); } .text--s:is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { max-width: var(--text-s-max-width); } .text--xs, .text--xs > :is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { font-size: var(--text-xs); } .text--xs:is(p, li, blockquote, h1, h2, h3, h4, h5, h6, span, strong, cite) { max-width: var(--text-xs-max-width); } .h1.h1, .h--1.h--1 { font-size: var(--h1); max-width: var(--h1-max-width); } .h2.h2, .h--2.h--2 { font-size: var(--h2); max-width: var(--h2-max-width); } .h3.h3, .h--3.h--3 { font-size: var(--h3); max-width: var(--h3-max-width); } .h4.h4, .h--4.h--4 { font-size: var(--h4); line-height: var(--h4-line-height); max-width: var(--h4-max-width); } .h5.h5, .h--5.h--5 { font-size: var(--h5); max-width: var(--h5-max-width); } .h6.h6, .h--6.h--6 { font-size: var(--h6); max-width: var(--h6-max-width); } .text--100 { font-weight: 100; } .text--200 { font-weight: 200; } .text--300 { font-weight: 300; } .text--400 { font-weight: 400; } .text--500 { font-weight: 500; } .text--600 { font-weight: 600; } .text--700 { font-weight: 700; } .text--800 { font-weight: 800; } .text--900 { font-weight: 900; } .text--bold { font-weight: bold; } .text--italic { font-style: italic; } .text--oblique { font-style: oblique; } .text--decoration-none { -webkit-text-decoration: none; text-decoration: none; } .text--underline { -webkit-text-decoration: underline; text-decoration: underline; } .text--underline-wavy { -webkit-text-decoration: underline wavy; text-decoration: underline wavy; } .text--underline-dotted { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } .text--underline-double { -webkit-text-decoration: underline double; text-decoration: underline double; } .text--underline-dashed { -webkit-text-decoration: underline dashed; text-decoration: underline dashed; } .text--overline { -webkit-text-decoration: overline; text-decoration: overline; } .text--line-through { -webkit-text-decoration: line-through; text-decoration: line-through; } .text--transform-none { text-transform: none; } .text--uppercase { text-transform: uppercase; } .text--lowercase { text-transform: lowercase; } .text--capitalize { text-transform: capitalize; } .text--left { text-align: left; } .text--center { text-align: center; } .text--right { text-align: right; } .text--justify { text-align: justify; } blockquote { text-wrap: pretty; } .balance, .text--balance { text-wrap: balance; } .balance p, .balance li, .balance blockquote, .balance h1, .balance h2, .balance h3, .balance h4, .balance h5, .balance h6, .text--balance p, .text--balance li, .text--balance blockquote, .text--balance h1, .text--balance h2, .text--balance h3, .text--balance h4, .text--balance h5, .text--balance h6 { text-wrap: balance; } .text--pretty { text-wrap: pretty; } .text--pretty p, .text--pretty li, .text--pretty blockquote, .text--pretty h1, .text--pretty h2, .text--pretty h3, .text--pretty h4, .text--pretty h5, .text--pretty h6 { text-wrap: pretty; } .unbalance { text-wrap: wrap; } .unbalance p, .unbalance li, .unbalance blockquote, .unbalance h1, .unbalance h2, .unbalance h3, .unbalance h4, .unbalance h5, .unbalance h6 { text-wrap: wrap; } [class*="line-clamp--"] { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--line-count); } .line-clamp--1 { --line-count: 1; } .line-clamp--2 { --line-count: 2; } .line-clamp--3 { --line-count: 3; } .line-clamp--4 { --line-count: 4; } .line-clamp--5 { --line-count: 5; } .opacity--0 { opacity: 0; } .opacity--5 { opacity: 0.05; } .opacity--10 { opacity: 0.1; } .opacity--15 { opacity: 0.15; } .opacity--20 { opacity: 0.2; } .opacity--25 { opacity: 0.25; } .opacity--30 { opacity: 0.3; } .opacity--35 { opacity: 0.35; } .opacity--40 { opacity: 0.4; } .opacity--45 { opacity: 0.45; } .opacity--50 { opacity: 0.5; } .opacity--55 { opacity: 0.55; } .opacity--60 { opacity: 0.6; } .opacity--65 { opacity: 0.65; } .opacity--70 { opacity: 0.7; } .opacity--75 { opacity: 0.75; } .opacity--80 { opacity: 0.8; } .opacity--85 { opacity: 0.85; } .opacity--90 { opacity: 0.9; } .opacity--95 { opacity: 0.95; } .opacity--100 { opacity: 1; } .box-shadow--m { box-shadow: var(--box-shadow-1); } .box-shadow--l { box-shadow: var(--box-shadow-2); } .box-shadow--xl { box-shadow: var(--box-shadow-3); } @media (min-width: 1367px) { .breakout--s { inline-size: 60vw !important; max-inline-size: 60vw !important; margin: 0 calc(-30vw + 50%) !important; } .breakout--m { inline-size: 70vw !important; max-inline-size: 70vw !important; margin: 0 calc(-35vw + 50%) !important; } .breakout--l { inline-size: 80vw !important; max-inline-size: 80vw !important; margin: 0 calc(-40vw + 50%) !important; } .breakout--xl { inline-size: 90vw !important; max-inline-size: 90vw !important; margin: 0 calc(-45vw + 50%) !important; } } .breakout--full { inline-size: 100vw !important; max-inline-size: 100vw !important; margin-inline: calc(-50vw + 50%) !important; align-self: flex-start; } @media (max-width: 1366px) { [class*="breakout--"]:not(.breakout--full) { inline-size: 100% !important; max-inline-size: 100% !important; margin: 0 !important; } } .relative { position: relative; } .sticky.sticky { position: -webkit-sticky; position: sticky; inset-block-start: var(--sticky-offset, var(--offset, 0)); } .sticky-top--s.sticky-top--s { inset-block-start: var(--sticky-top-s, 2.5%); } .sticky-top--m.sticky-top--m { inset-block-start: var(--sticky-top-m, 5%); } .sticky-top--l.sticky-top--l { inset-block-start: var(--sticky-top-l, 10%); } [class*="center--"]:where(:not([class*="self"]))[class*="center--"]:where(:not([class*="self"])) { display: flex; flex-direction: column; align-items: var(--align-items, initial); align-content: var(--align-content, initial); justify-items: var(--justify-items, initial); justify-content: var(--justify-content, initial); text-align: var(--text-align, inherit); } .center--all.center--all { --align-items: center; --align-content: center; --justify-items: center; --justify-content: center; --text-align: center; } .center--y.center--y { --align-items: flex-start; --justify-items: center; --justify-content: center; } .center--x.center--x { --align-items: center; --justify-items: flex-start; --justify-content: flex-start; } .center--left.center--left { --align-items: flex-start; --align-content: flex-start; --justify-items: center; --justify-content: center; --text-align: left; } .center--right.center--right { --align-items: flex-end; --align-content: flex-end; --justify-items: center; --justify-content: center; --text-align: right; } .center--top.center--top { --align-items: center; --align-content: center; --justify-items: flex-start; --justify-content: flex-start; } .center--bottom.center--bottom { --align-items: center; --justify-items: flex-end; --justify-content: flex-end; } @media (max-width: 1366px) { .center--all-xl.center--all-xl { --align-items: center; --align-content: center; --justify-items: center; --justify-content: center; --text-align: center; } .center--y-xl.center--y-xl { --align-items: flex-start; --justify-items: center; --justify-content: center; } .center--x-xl.center--x-xl { --align-items: center; --justify-items: flex-start; --justify-content: flex-start; } .center--left-xl.center--left-xl { --align-items: flex-start; --align-content: flex-start; --justify-items: center; --justify-content: center; --text-align: left; } .center--right-xl.center--right-xl { --align-items: flex-end; --align-content: flex-end; --justify-items: center; --justify-content: center; --text-align: right; } .center--top-xl.center--top-xl { --align-items: center; --align-content: center; --justify-items: flex-start; --justify-content: flex-start; } .center--bottom-xl.center--bottom-xl { --align-items: center; --justify-items: flex-end; --justify-content: flex-end; } } @media (max-width: 992px) { .center--all-l.center--all-l { --align-items: center; --align-content: center; --justify-items: center; --justify-content: center; --text-align: center; } .center--y-l.center--y-l { --align-items: flex-start; --justify-items: center; --justify-content: center; } .center--x-l.center--x-l { --align-items: center; --justify-items: flex-start; --justify-content: flex-start; } .center--left-l.center--left-l { --align-items: flex-start; --align-content: flex-start; --justify-items: center; --justify-content: center; --text-align: left; } .center--right-l.center--right-l { --align-items: flex-end; --align-content: flex-end; --justify-items: center; --justify-content: center; --text-align: right; } .center--top-l.center--top-l { --align-items: center; --align-content: center; --justify-items: flex-start; --justify-content: flex-start; } .center--bottom-l.center--bottom-l { --align-items: center; --justify-items: flex-end; --justify-content: flex-end; } } @media (max-width: 768px) { .center--all-m.center--all-m { --align-items: center; --align-content: center; --justify-items: center; --justify-content: center; --text-align: center; } .center--y-m.center--y-m { --align-items: flex-start; --justify-items: center; --justify-content: center; } .center--x-m.center--x-m { --align-items: center; --justify-items: flex-start; --justify-content: flex-start; } .center--left-m.center--left-m { --align-items: flex-start; --align-content: flex-start; --justify-items: center; --justify-content: center; --text-align: left; } .center--right-m.center--right-m { --align-items: flex-end; --align-content: flex-end; --justify-items: center; --justify-content: center; --text-align: right; } .center--top-m.center--top-m { --align-items: center; --align-content: center; --justify-items: flex-start; --justify-content: flex-start; } .center--bottom-m.center--bottom-m { --align-items: center; --justify-items: flex-end; --justify-content: flex-end; } } @media (max-width: 480px) { .center--all-s.center--all-s { --align-items: center; --align-content: center; --justify-items: center; --justify-content: center; --text-align: center; } .center--y-s.center--y-s { --align-items: flex-start; --justify-items: center; --justify-content: center; } .center--x-s.center--x-s { --align-items: center; --justify-items: flex-start; --justify-content: flex-start; } .center--left-s.center--left-s { --align-items: flex-start; --align-content: flex-start; --justify-items: center; --justify-content: center; --text-align: left; } .center--right-s.center--right-s { --align-items: flex-end; --align-content: flex-end; --justify-items: center; --justify-content: center; --text-align: right; } .center--top-s.center--top-s { --align-items: center; --align-content: center; --justify-items: flex-start; --justify-content: flex-start; } .center--bottom-s.center--bottom-s { --align-items: center; --justify-items: flex-end; --justify-content: flex-end; } } .center--self.center--self { margin-left: auto; margin-right: auto; } .flip--x, .flip--x > div { transform: scaleX(-1); } .flip--y, .flip--y > div { transform: scaleY(-1); } .flip--xy, .flip--xy > div { transform: scale(-1, -1); } .flip--both, .flip--both > div { transform: scale(-1, -1); } img.object-fit--cover, .object-fit--cover img { --object-fit: cover; object-fit: cover; } img.object-fit--contain, .object-fit--contain img { --object-fit: contain; object-fit: contain; } [class*="object-fit--"], [class*="object-fit--"] img { -o-object-position: var(--object-position, 50% 50%); object-position: var(--object-position, 50% 50%); } .object-fit--top-left { --object-position: 10% 10%; } .object-fit--top-center { --object-position: 50% 10%; } .object-fit--top-right { --object-position: 90% 10%; } .object-fit--center-left { --object-position: 10% 50%; } .object-fit--center-right { --object-position: 90% 50%; } .object-fit--bottom-left { --object-position: 10% 90%; } .object-fit--bottom-center { --object-position: 50% 90%; } .object-fit--bottom-right { --object-position: 90% 90%; } .height--20 { min-block-size: 20vh; } .height--30 { min-block-size: 30vh; } .height--40 { min-block-size: 40vh; } .height--50 { min-block-size: 50vh; } .height--60 { min-block-size: 60vh; } .height--70 { min-block-size: 70vh; } .height--80 { min-block-size: 80vh; } .height--90 { min-block-size: 90vh; } .height--100 { min-block-size: 100vh; } .height--full { min-block-size: 100vh; } @media (max-width: 1366px) { .height--xl-20 { min-block-size: 20vh; } .height--xl-30 { min-block-size: 30vh; } .height--xl-40 { min-block-size: 40vh; } .height--xl-50 { min-block-size: 50vh; } .height--xl-60 { min-block-size: 60vh; } .height--xl-70 { min-block-size: 70vh; } .height--xl-80 { min-block-size: 80vh; } .height--xl-90 { min-block-size: 90vh; } .height--xl-100 { min-block-size: 100vh; } .height--xl-full { min-block-size: 100vh; } } @media (max-width: 992px) { .height--l-20 { min-block-size: 20vh; } .height--l-30 { min-block-size: 30vh; } .height--l-40 { min-block-size: 40vh; } .height--l-50 { min-block-size: 50vh; } .height--l-60 { min-block-size: 60vh; } .height--l-70 { min-block-size: 70vh; } .height--l-80 { min-block-size: 80vh; } .height--l-90 { min-block-size: 90vh; } .height--l-100 { min-block-size: 100vh; } .height--l-full { min-block-size: 100vh; } } @media (max-width: 768px) { .height--m-20 { min-block-size: 20vh; } .height--m-30 { min-block-size: 30vh; } .height--m-40 { min-block-size: 40vh; } .height--m-50 { min-block-size: 50vh; } .height--m-60 { min-block-size: 60vh; } .height--m-70 { min-block-size: 70vh; } .height--m-80 { min-block-size: 80vh; } .height--m-90 { min-block-size: 90vh; } .height--m-100 { min-block-size: 100vh; } .height--m-full { min-block-size: 100vh; } } @media (max-width: 480px) { .height--s-20 { min-block-size: 20vh; } .height--s-30 { min-block-size: 30vh; } .height--s-40 { min-block-size: 40vh; } .height--s-50 { min-block-size: 50vh; } .height--s-60 { min-block-size: 60vh; } .height--s-70 { min-block-size: 70vh; } .height--s-80 { min-block-size: 80vh; } .height--s-90 { min-block-size: 90vh; } .height--s-100 { min-block-size: 100vh; } .height--s-full { min-block-size: 100vh; } } .max-height--20 { max-block-size: 20vh; } .max-height--30 { max-block-size: 30vh; } .max-height--40 { max-block-size: 40vh; } .max-height--50 { max-block-size: 50vh; } .max-height--60 { max-block-size: 60vh; } .max-height--70 { max-block-size: 70vh; } .max-height--80 { max-block-size: 80vh; } .max-height--90 { max-block-size: 90vh; } .max-height--100 { max-block-size: 100vh; } .max-height--full { max-block-size: 100vh; } @media (max-width: 1366px) { .max-height--xl-20 { max-block-size: 20vh; } .max-height--xl-30 { max-block-size: 30vh; } .max-height--xl-40 { max-block-size: 40vh; } .max-height--xl-50 { max-block-size: 50vh; } .max-height--xl-60 { max-block-size: 60vh; } .max-height--xl-70 { max-block-size: 70vh; } .max-height--xl-80 { max-block-size: 80vh; } .max-height--xl-90 { max-block-size: 90vh; } .max-height--xl-100 { max-block-size: 100vh; } .max-height--xl-full { max-block-size: 100vh; } } @media (max-width: 992px) { .max-height--l-20 { max-block-size: 20vh; } .max-height--l-30 { max-block-size: 30vh; } .max-height--l-40 { max-block-size: 40vh; } .max-height--l-50 { max-block-size: 50vh; } .max-height--l-60 { max-block-size: 60vh; } .max-height--l-70 { max-block-size: 70vh; } .max-height--l-80 { max-block-size: 80vh; } .max-height--l-90 { max-block-size: 90vh; } .max-height--l-100 { max-block-size: 100vh; } .max-height--l-full { max-block-size: 100vh; } } @media (max-width: 768px) { .max-height--m-20 { max-block-size: 20vh; } .max-height--m-30 { max-block-size: 30vh; } .max-height--m-40 { max-block-size: 40vh; } .max-height--m-50 { max-block-size: 50vh; } .max-height--m-60 { max-block-size: 60vh; } .max-height--m-70 { max-block-size: 70vh; } .max-height--m-80 { max-block-size: 80vh; } .max-height--m-90 { max-block-size: 90vh; } .max-height--m-100 { max-block-size: 100vh; } .max-height--m-full { max-block-size: 100vh; } } @media (max-width: 480px) { .max-height--s-20 { max-block-size: 20vh; } .max-height--s-30 { max-block-size: 30vh; } .max-height--s-40 { max-block-size: 40vh; } .max-height--s-50 { max-block-size: 50vh; } .max-height--s-60 { max-block-size: 60vh; } .max-height--s-70 { max-block-size: 70vh; } .max-height--s-80 { max-block-size: 80vh; } .max-height--s-90 { max-block-size: 90vh; } .max-height--s-100 { max-block-size: 100vh; } .max-height--s-full { max-block-size: 100vh; } } :is([class*="col-count--"], [class*="col-width--"]) { display: block !important; } .col-count--1 { -moz-column-count: 1; column-count: 1; } .col-count--2 { -moz-column-count: 2; column-count: 2; } .col-count--3 { -moz-column-count: 3; column-count: 3; } .col-count--4 { -moz-column-count: 4; column-count: 4; } .col-count--5 { -moz-column-count: 5; column-count: 5; } @media (max-width: 1366px) { .col-count--xl-1 { -moz-column-count: 1; column-count: 1; } .col-count--xl-2 { -moz-column-count: 2; column-count: 2; } .col-count--xl-3 { -moz-column-count: 3; column-count: 3; } .col-count--xl-4 { -moz-column-count: 4; column-count: 4; } .col-count--xl-5 { -moz-column-count: 5; column-count: 5; } } @media (max-width: 992px) { .col-count--l-1 { -moz-column-count: 1; column-count: 1; } .col-count--l-2 { -moz-column-count: 2; column-count: 2; } .col-count--l-3 { -moz-column-count: 3; column-count: 3; } .col-count--l-4 { -moz-column-count: 4; column-count: 4; } .col-count--l-5 { -moz-column-count: 5; column-count: 5; } } @media (max-width: 768px) { .col-count--m-1 { -moz-column-count: 1; column-count: 1; } .col-count--m-2 { -moz-column-count: 2; column-count: 2; } .col-count--m-3 { -moz-column-count: 3; column-count: 3; } .col-count--m-4 { -moz-column-count: 4; column-count: 4; } .col-count--m-5 { -moz-column-count: 5; column-count: 5; } } @media (max-width: 480px) { .col-count--s-1 { -moz-column-count: 1; column-count: 1; } .col-count--s-2 { -moz-column-count: 2; column-count: 2; } .col-count--s-3 { -moz-column-count: 3; column-count: 3; } .col-count--s-4 { -moz-column-count: 4; column-count: 4; } .col-count--s-5 { -moz-column-count: 5; column-count: 5; } } .col-width--s { width: 100%; -moz-column-width: var(--col-width-s, 13rem); column-width: var(--col-width-s, 13rem); } .col-width--m { width: 100%; -moz-column-width: var(--col-width-m, 25rem); column-width: var(--col-width-m, 25rem); } .col-width--l { width: 100%; -moz-column-width: var(--col-width-l, 38rem); column-width: var(--col-width-l, 38rem); } .col-rule--dotted { -moz-column-rule: dotted; column-rule: dotted; -moz-column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); } .col-rule--dashed { -moz-column-rule: dashed; column-rule: dashed; -moz-column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); } .col-rule--solid { -moz-column-rule: solid; column-rule: solid; -moz-column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); } .col-rule--double { -moz-column-rule: double; column-rule: double; -moz-column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); } .col-rule--groove { -moz-column-rule: groove; column-rule: groove; -moz-column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); } .col-rule--ridge { -moz-column-rule: ridge; column-rule: ridge; -moz-column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); } .col-rule--inset { -moz-column-rule: inset; column-rule: inset; -moz-column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); } .col-rule--outset { -moz-column-rule: outset; column-rule: outset; -moz-column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); column-rule-width: var(--col-rule-width, var(--col-rule-width-m)); } .col-rule--primary { -moz-column-rule-color: var(--primary); column-rule-color: var(--primary); } .col-rule--primary-hover { -moz-column-rule-color: var(--primary-hover); column-rule-color: var(--primary-hover); } .col-rule--primary-ultra-light { -moz-column-rule-color: var(--primary-ultra-light); column-rule-color: var(--primary-ultra-light); } .col-rule--primary-light { -moz-column-rule-color: var(--primary-light); column-rule-color: var(--primary-light); } .col-rule--primary-semi-light { -moz-column-rule-color: var(--primary-semi-light); column-rule-color: var(--primary-semi-light); } .col-rule--primary-semi-dark { -moz-column-rule-color: var(--primary-semi-dark); column-rule-color: var(--primary-semi-dark); } .col-rule--primary-dark { -moz-column-rule-color: var(--primary-dark); column-rule-color: var(--primary-dark); } .col-rule--primary-ultra-dark { -moz-column-rule-color: var(--primary-ultra-dark); column-rule-color: var(--primary-ultra-dark); } .col-rule--secondary { -moz-column-rule-color: var(--secondary); column-rule-color: var(--secondary); } .col-rule--secondary-hover { -moz-column-rule-color: var(--secondary-hover); column-rule-color: var(--secondary-hover); } .col-rule--secondary-ultra-light { -moz-column-rule-color: var(--secondary-ultra-light); column-rule-color: var(--secondary-ultra-light); } .col-rule--secondary-light { -moz-column-rule-color: var(--secondary-light); column-rule-color: var(--secondary-light); } .col-rule--secondary-semi-light { -moz-column-rule-color: var(--secondary-semi-light); column-rule-color: var(--secondary-semi-light); } .col-rule--secondary-semi-dark { -moz-column-rule-color: var(--secondary-semi-dark); column-rule-color: var(--secondary-semi-dark); } .col-rule--secondary-dark { -moz-column-rule-color: var(--secondary-dark); column-rule-color: var(--secondary-dark); } .col-rule--secondary-ultra-dark { -moz-column-rule-color: var(--secondary-ultra-dark); column-rule-color: var(--secondary-ultra-dark); } .col-rule--tertiary { -moz-column-rule-color: var(--tertiary); column-rule-color: var(--tertiary); } .col-rule--tertiary-hover { -moz-column-rule-color: var(--tertiary-hover); column-rule-color: var(--tertiary-hover); } .col-rule--tertiary-ultra-light { -moz-column-rule-color: var(--tertiary-ultra-light); column-rule-color: var(--tertiary-ultra-light); } .col-rule--tertiary-light { -moz-column-rule-color: var(--tertiary-light); column-rule-color: var(--tertiary-light); } .col-rule--tertiary-semi-light { -moz-column-rule-color: var(--tertiary-semi-light); column-rule-color: var(--tertiary-semi-light); } .col-rule--tertiary-semi-dark { -moz-column-rule-color: var(--tertiary-semi-dark); column-rule-color: var(--tertiary-semi-dark); } .col-rule--tertiary-dark { -moz-column-rule-color: var(--tertiary-dark); column-rule-color: var(--tertiary-dark); } .col-rule--tertiary-ultra-dark { -moz-column-rule-color: var(--tertiary-ultra-dark); column-rule-color: var(--tertiary-ultra-dark); } .col-rule--accent { -moz-column-rule-color: var(--accent); column-rule-color: var(--accent); } .col-rule--accent-hover { -moz-column-rule-color: var(--accent-hover); column-rule-color: var(--accent-hover); } .col-rule--accent-ultra-light { -moz-column-rule-color: var(--accent-ultra-light); column-rule-color: var(--accent-ultra-light); } .col-rule--accent-light { -moz-column-rule-color: var(--accent-light); column-rule-color: var(--accent-light); } .col-rule--accent-semi-light { -moz-column-rule-color: var(--accent-semi-light); column-rule-color: var(--accent-semi-light); } .col-rule--accent-semi-dark { -moz-column-rule-color: var(--accent-semi-dark); column-rule-color: var(--accent-semi-dark); } .col-rule--accent-dark { -moz-column-rule-color: var(--accent-dark); column-rule-color: var(--accent-dark); } .col-rule--accent-ultra-dark { -moz-column-rule-color: var(--accent-ultra-dark); column-rule-color: var(--accent-ultra-dark); } .col-rule--neutral { -moz-column-rule-color: var(--neutral); column-rule-color: var(--neutral); } .col-rule--neutral-hover { -moz-column-rule-color: var(--neutral-hover); column-rule-color: var(--neutral-hover); } .col-rule--neutral-ultra-light { -moz-column-rule-color: var(--neutral-ultra-light); column-rule-color: var(--neutral-ultra-light); } .col-rule--neutral-light { -moz-column-rule-color: var(--neutral-light); column-rule-color: var(--neutral-light); } .col-rule--neutral-semi-light { -moz-column-rule-color: var(--neutral-semi-light); column-rule-color: var(--neutral-semi-light); } .col-rule--neutral-semi-dark { -moz-column-rule-color: var(--neutral-semi-dark); column-rule-color: var(--neutral-semi-dark); } .col-rule--neutral-dark { -moz-column-rule-color: var(--neutral-dark); column-rule-color: var(--neutral-dark); } .col-rule--neutral-ultra-dark { -moz-column-rule-color: var(--neutral-ultra-dark); column-rule-color: var(--neutral-ultra-dark); } .col-rule--white { -moz-column-rule-color: var(--white); column-rule-color: var(--white); } .col-rule--black { -moz-column-rule-color: var(--black); column-rule-color: var(--black); } .col-rule--s { -moz-column-rule-width: var(--col-rule-width-s, 0.5px); column-rule-width: var(--col-rule-width-s, 0.5px); } .col-rule--m { -moz-column-rule-width: var(--col-rule-width-m, 1px); column-rule-width: var(--col-rule-width-m, 1px); } .col-rule--l { -moz-column-rule-width: var(--col-rule-width-l, 3px); column-rule-width: var(--col-rule-width-l, 3px); } .col-span--all { -moz-column-span: all; column-span: all; } [class*="col-"] > * { break-inside: avoid; } .masonry--1 { display: block !important; column-count: 1; row-gap: var(--row-gap); column-gap: var(--col-gap); } .masonry--2 { display: block !important; column-count: 2; row-gap: var(--row-gap); column-gap: var(--col-gap); } .masonry--3 { display: block !important; column-count: 3; row-gap: var(--row-gap); column-gap: var(--col-gap); } .masonry--4 { display: block !important; column-count: 4; row-gap: var(--row-gap); column-gap: var(--col-gap); } .masonry--5 { display: block !important; column-count: 5; row-gap: var(--row-gap); column-gap: var(--col-gap); } @media (max-width: 1366px) { .masonry--xl-1 { column-count: 1; } .masonry--xl-2 { column-count: 2; } .masonry--xl-3 { column-count: 3; } .masonry--xl-4 { column-count: 4; } .masonry--xl-5 { column-count: 5; } } @media (max-width: 992px) { .masonry--l-1 { column-count: 1; } .masonry--l-2 { column-count: 2; } .masonry--l-3 { column-count: 3; } .masonry--l-4 { column-count: 4; } .masonry--l-5 { column-count: 5; } } @media (max-width: 768px) { .masonry--m-1 { column-count: 1; } .masonry--m-2 { column-count: 2; } .masonry--m-3 { column-count: 3; } .masonry--m-4 { column-count: 4; } .masonry--m-5 { column-count: 5; } } @media (max-width: 480px) { .masonry--s-1 { column-count: 1; } .masonry--s-2 { column-count: 2; } .masonry--s-3 { column-count: 3; } .masonry--s-4 { column-count: 4; } .masonry--s-5 { column-count: 5; } } :where([class*="masonry--"] > *) { break-inside: avoid; width: 100%; } :where([class*="masonry--"]) { --col-gap: var(--grid-gap); } :where([class*="masonry--"] > *) { margin-block-end: var(--grid-gap); } [class*="masonry"]:is([class*="gap--"], [class*="row-gap--"], [class*="content-gap"], [class*="container-gap"], [class*="grid-gap"], [class*="fr-content-gap"], [class*="fr-container-gap"], [class*="fr-grid-gap"]) > * { margin-block-end: var(--row-gap); } .variable-grid { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(var(--min, calc(var(--content-width) / 2 - var(--space-xxl))), 100%), 1fr)); grid-template-rows: var(--grid-1); gap: var(--gap, var(--grid-gap)); } .grid--1 { display: grid !important; grid-template-columns: repeat(1, minmax(0, 1fr)); inline-size: 100%; } .grid--1 > * { grid-column: 1 !important; } .grid--2 { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); inline-size: 100%; } .grid--3 { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); inline-size: 100%; } .grid--4 { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); inline-size: 100%; } .grid--5 { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)); inline-size: 100%; } .grid--6 { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); inline-size: 100%; } .grid--7 { display: grid !important; grid-template-columns: repeat(7, minmax(0, 1fr)); inline-size: 100%; } .grid--8 { display: grid !important; grid-template-columns: repeat(8, minmax(0, 1fr)); inline-size: 100%; } .grid--9 { display: grid !important; grid-template-columns: repeat(9, minmax(0, 1fr)); inline-size: 100%; } .grid--10 { display: grid !important; grid-template-columns: repeat(10, minmax(0, 1fr)); inline-size: 100%; } .grid--11 { display: grid !important; grid-template-columns: repeat(11, minmax(0, 1fr)); inline-size: 100%; } .grid--12 { display: grid !important; grid-template-columns: repeat(12, minmax(0, 1fr)); inline-size: 100%; } .grid--1-2 { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); inline-size: 100%; } .grid--1-3 { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); inline-size: 100%; } .grid--2-1 { display: grid !important; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); inline-size: 100%; } .grid--2-3 { display: grid !important; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); inline-size: 100%; } .grid--3-1 { display: grid !important; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); inline-size: 100%; } .grid--3-2 { display: grid !important; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); inline-size: 100%; } .grid-rows--1 { grid-template-rows: repeat(1, minmax(0, 1fr)); } .grid-rows--2 { grid-template-rows: repeat(2, minmax(0, 1fr)); } .grid-rows--3 { grid-template-rows: repeat(3, minmax(0, 1fr)); } .grid-rows--4 { grid-template-rows: repeat(4, minmax(0, 1fr)); } .grid-rows--5 { grid-template-rows: repeat(5, minmax(0, 1fr)); } .grid-rows--6 { grid-template-rows: repeat(6, minmax(0, 1fr)); } .grid-rows--7 { grid-template-rows: repeat(7, minmax(0, 1fr)); } .grid-rows--8 { grid-template-rows: repeat(8, minmax(0, 1fr)); } .grid-rows--9 { grid-template-rows: repeat(9, minmax(0, 1fr)); } .grid-rows--10 { grid-template-rows: repeat(10, minmax(0, 1fr)); } .grid-rows--11 { grid-template-rows: repeat(11, minmax(0, 1fr)); } .grid-rows--12 { grid-template-rows: repeat(12, minmax(0, 1fr)); } @media (max-width: 1366px) { .grid--xl-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid--xl-1 > * { grid-column: 1 !important; } .grid--xl-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid--xl-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid--xl-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .grid--xl-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .grid--xl-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .grid--xl-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .grid--xl-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .grid--xl-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .grid--xl-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .grid--xl-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .grid--xl-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .grid-rows--xl-1 { grid-template-rows: repeat(1, minmax(0, 1fr)); } .grid-rows--xl-2 { grid-template-rows: repeat(2, minmax(0, 1fr)); } .grid-rows--xl-3 { grid-template-rows: repeat(3, minmax(0, 1fr)); } .grid-rows--xl-4 { grid-template-rows: repeat(4, minmax(0, 1fr)); } .grid-rows--xl-5 { grid-template-rows: repeat(5, minmax(0, 1fr)); } .grid-rows--xl-6 { grid-template-rows: repeat(6, minmax(0, 1fr)); } .grid-rows--xl-7 { grid-template-rows: repeat(7, minmax(0, 1fr)); } .grid-rows--xl-8 { grid-template-rows: repeat(8, minmax(0, 1fr)); } .grid-rows--xl-9 { grid-template-rows: repeat(9, minmax(0, 1fr)); } .grid-rows--xl-10 { grid-template-rows: repeat(10, minmax(0, 1fr)); } .grid-rows--xl-11 { grid-template-rows: repeat(11, minmax(0, 1fr)); } .grid-rows--xl-12 { grid-template-rows: repeat(12, minmax(0, 1fr)); } } @media (max-width: 992px) { .grid--l-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid--l-1 > * { grid-column: 1 !important; } .grid--l-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid--l-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid--l-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .grid--l-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .grid--l-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .grid--l-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .grid--l-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .grid--l-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .grid--l-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .grid--l-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .grid--l-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .grid-rows--l-1 { grid-template-rows: repeat(1, minmax(0, 1fr)); } .grid-rows--l-2 { grid-template-rows: repeat(2, minmax(0, 1fr)); } .grid-rows--l-3 { grid-template-rows: repeat(3, minmax(0, 1fr)); } .grid-rows--l-4 { grid-template-rows: repeat(4, minmax(0, 1fr)); } .grid-rows--l-5 { grid-template-rows: repeat(5, minmax(0, 1fr)); } .grid-rows--l-6 { grid-template-rows: repeat(6, minmax(0, 1fr)); } .grid-rows--l-7 { grid-template-rows: repeat(7, minmax(0, 1fr)); } .grid-rows--l-8 { grid-template-rows: repeat(8, minmax(0, 1fr)); } .grid-rows--l-9 { grid-template-rows: repeat(9, minmax(0, 1fr)); } .grid-rows--l-10 { grid-template-rows: repeat(10, minmax(0, 1fr)); } .grid-rows--l-11 { grid-template-rows: repeat(11, minmax(0, 1fr)); } .grid-rows--l-12 { grid-template-rows: repeat(12, minmax(0, 1fr)); } } @media (max-width: 768px) { .grid--m-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid--m-1 > * { grid-column: 1 !important; } .grid--m-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid--m-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid--m-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .grid--m-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .grid--m-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .grid--m-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .grid--m-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .grid--m-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .grid--m-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .grid--m-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .grid--m-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .grid-rows--m-1 { grid-template-rows: repeat(1, minmax(0, 1fr)); } .grid-rows--m-2 { grid-template-rows: repeat(2, minmax(0, 1fr)); } .grid-rows--m-3 { grid-template-rows: repeat(3, minmax(0, 1fr)); } .grid-rows--m-4 { grid-template-rows: repeat(4, minmax(0, 1fr)); } .grid-rows--m-5 { grid-template-rows: repeat(5, minmax(0, 1fr)); } .grid-rows--m-6 { grid-template-rows: repeat(6, minmax(0, 1fr)); } .grid-rows--m-7 { grid-template-rows: repeat(7, minmax(0, 1fr)); } .grid-rows--m-8 { grid-template-rows: repeat(8, minmax(0, 1fr)); } .grid-rows--m-9 { grid-template-rows: repeat(9, minmax(0, 1fr)); } .grid-rows--m-10 { grid-template-rows: repeat(10, minmax(0, 1fr)); } .grid-rows--m-11 { grid-template-rows: repeat(11, minmax(0, 1fr)); } .grid-rows--m-12 { grid-template-rows: repeat(12, minmax(0, 1fr)); } } @media (max-width: 480px) { .grid--s-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid--s-1 > * { grid-column: 1 !important; } .grid--s-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid--s-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid--s-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .grid--s-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .grid--s-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .grid--s-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .grid--s-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .grid--s-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); } .grid--s-10 { grid-template-columns: repeat(10, minmax(0, 1fr)); } .grid--s-11 { grid-template-columns: repeat(11, minmax(0, 1fr)); } .grid--s-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .grid-rows--s-1 { grid-template-rows: repeat(1, minmax(0, 1fr)); } .grid-rows--s-2 { grid-template-rows: repeat(2, minmax(0, 1fr)); } .grid-rows--s-3 { grid-template-rows: repeat(3, minmax(0, 1fr)); } .grid-rows--s-4 { grid-template-rows: repeat(4, minmax(0, 1fr)); } .grid-rows--s-5 { grid-template-rows: repeat(5, minmax(0, 1fr)); } .grid-rows--s-6 { grid-template-rows: repeat(6, minmax(0, 1fr)); } .grid-rows--s-7 { grid-template-rows: repeat(7, minmax(0, 1fr)); } .grid-rows--s-8 { grid-template-rows: repeat(8, minmax(0, 1fr)); } .grid-rows--s-9 { grid-template-rows: repeat(9, minmax(0, 1fr)); } .grid-rows--s-10 { grid-template-rows: repeat(10, minmax(0, 1fr)); } .grid-rows--s-11 { grid-template-rows: repeat(11, minmax(0, 1fr)); } .grid-rows--s-12 { grid-template-rows: repeat(12, minmax(0, 1fr)); } } @media (min-width: 1367px) { .grid--alternate-xl > .grid--2:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-xl > .grid--1-2:nth-of-type(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } .grid--alternate-xl > .grid--1-2:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-xl > .grid--1-3:nth-of-type(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); } .grid--alternate-xl > .grid--1-3:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-xl > .grid--2-1:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } .grid--alternate-xl > .grid--2-1:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-xl > .grid--2-3:nth-of-type(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); } .grid--alternate-xl > .grid--2-3:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-xl > .grid--3-1:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); } .grid--alternate-xl > .grid--3-1:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-xl > .grid--3-2:nth-of-type(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } .grid--alternate-xl > .grid--3-2:nth-of-type(even) > *:last-child { order: -1; } } @media (min-width: 993px) { .grid--alternate-l > .grid--2:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-l > .grid--1-2:nth-of-type(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } .grid--alternate-l > .grid--1-2:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-l > .grid--1-3:nth-of-type(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); } .grid--alternate-l > .grid--1-3:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-l > .grid--2-1:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } .grid--alternate-l > .grid--2-1:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-l > .grid--2-3:nth-of-type(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); } .grid--alternate-l > .grid--2-3:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-l > .grid--3-1:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); } .grid--alternate-l > .grid--3-1:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-l > .grid--3-2:nth-of-type(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } .grid--alternate-l > .grid--3-2:nth-of-type(even) > *:last-child { order: -1; } } @media (min-width: 769px) { .grid--alternate-m > .grid--2:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-m > .grid--1-2:nth-of-type(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } .grid--alternate-m > .grid--1-2:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-m > .grid--1-3:nth-of-type(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); } .grid--alternate-m > .grid--1-3:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-m > .grid--2-1:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } .grid--alternate-m > .grid--2-1:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-m > .grid--2-3:nth-of-type(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); } .grid--alternate-m > .grid--2-3:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-m > .grid--3-1:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); } .grid--alternate-m > .grid--3-1:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-m > .grid--3-2:nth-of-type(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } .grid--alternate-m > .grid--3-2:nth-of-type(even) > *:last-child { order: -1; } } @media (min-width: 481px) { .grid--alternate-s > .grid--2:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-s > .grid--1-2:nth-of-type(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } .grid--alternate-s > .grid--1-2:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-s > .grid--1-3:nth-of-type(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); } .grid--alternate-s > .grid--1-3:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-s > .grid--2-1:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } .grid--alternate-s > .grid--2-1:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-s > .grid--2-3:nth-of-type(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); } .grid--alternate-s > .grid--2-3:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-s > .grid--3-1:nth-of-type(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); } .grid--alternate-s > .grid--3-1:nth-of-type(even) > *:last-child { order: -1; } .grid--alternate-s > .grid--3-2:nth-of-type(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } .grid--alternate-s > .grid--3-2:nth-of-type(even) > *:last-child { order: -1; } } .row-span--1 { grid-row-end: span 1; } .col-span--1 { grid-column-end: span 1; } .row-start--1 { grid-row-start: 1; } .row-end--1 { grid-row-end: 1; } .col-start--1 { grid-column-start: 1; } .col-end--1 { grid-column-end: 1; } .row-span--2 { grid-row-end: span 2; } .col-span--2 { grid-column-end: span 2; } .row-start--2 { grid-row-start: 2; } .row-end--2 { grid-row-end: 2; } .col-start--2 { grid-column-start: 2; } .col-end--2 { grid-column-end: 2; } .row-span--3 { grid-row-end: span 3; } .col-span--3 { grid-column-end: span 3; } .row-start--3 { grid-row-start: 3; } .row-end--3 { grid-row-end: 3; } .col-start--3 { grid-column-start: 3; } .col-end--3 { grid-column-end: 3; } .row-span--4 { grid-row-end: span 4; } .col-span--4 { grid-column-end: span 4; } .row-start--4 { grid-row-start: 4; } .row-end--4 { grid-row-end: 4; } .col-start--4 { grid-column-start: 4; } .col-end--4 { grid-column-end: 4; } .row-span--5 { grid-row-end: span 5; } .col-span--5 { grid-column-end: span 5; } .row-start--5 { grid-row-start: 5; } .row-end--5 { grid-row-end: 5; } .col-start--5 { grid-column-start: 5; } .col-end--5 { grid-column-end: 5; } .row-span--6 { grid-row-end: span 6; } .col-span--6 { grid-column-end: span 6; } .row-start--6 { grid-row-start: 6; } .row-end--6 { grid-row-end: 6; } .col-start--6 { grid-column-start: 6; } .col-end--6 { grid-column-end: 6; } .row-span--7 { grid-row-end: span 7; } .col-span--7 { grid-column-end: span 7; } .row-start--7 { grid-row-start: 7; } .row-end--7 { grid-row-end: 7; } .col-start--7 { grid-column-start: 7; } .col-end--7 { grid-column-end: 7; } .row-span--8 { grid-row-end: span 8; } .col-span--8 { grid-column-end: span 8; } .row-start--8 { grid-row-start: 8; } .row-end--8 { grid-row-end: 8; } .col-start--8 { grid-column-start: 8; } .col-end--8 { grid-column-end: 8; } .row-span--9 { grid-row-end: span 9; } .col-span--9 { grid-column-end: span 9; } .row-start--9 { grid-row-start: 9; } .row-end--9 { grid-row-end: 9; } .col-start--9 { grid-column-start: 9; } .col-end--9 { grid-column-end: 9; } .row-span--10 { grid-row-end: span 10; } .col-span--10 { grid-column-end: span 10; } .row-start--10 { grid-row-start: 10; } .row-end--10 { grid-row-end: 10; } .col-start--10 { grid-column-start: 10; } .col-end--10 { grid-column-end: 10; } .row-span--11 { grid-row-end: span 11; } .col-span--11 { grid-column-end: span 11; } .row-start--11 { grid-row-start: 11; } .row-end--11 { grid-row-end: 11; } .col-start--11 { grid-column-start: 11; } .col-end--11 { grid-column-end: 11; } .row-span--12 { grid-row-end: span 12; } .col-span--12 { grid-column-end: span 12; } .row-start--12 { grid-row-start: 12; } .row-end--12 { grid-row-end: 12; } .col-start--12 { grid-column-start: 12; } .col-end--12 { grid-column-end: 12; } @media (max-width: 1366px) { .row-span--xl-1 { grid-row: span 1; } .col-span--xl-1 { grid-column: span 1; } .row-start--xl-1 { grid-row-start: 1; } .row-end--xl-1 { grid-row-end: 1; } .col-start--xl-1 { grid-column-start: 1; } .col-end--xl-1 { grid-column-end: 1; } .row-span--xl-2 { grid-row: span 2; } .col-span--xl-2 { grid-column: span 2; } .row-start--xl-2 { grid-row-start: 2; } .row-end--xl-2 { grid-row-end: 2; } .col-start--xl-2 { grid-column-start: 2; } .col-end--xl-2 { grid-column-end: 2; } .row-span--xl-3 { grid-row: span 3; } .col-span--xl-3 { grid-column: span 3; } .row-start--xl-3 { grid-row-start: 3; } .row-end--xl-3 { grid-row-end: 3; } .col-start--xl-3 { grid-column-start: 3; } .col-end--xl-3 { grid-column-end: 3; } .row-span--xl-4 { grid-row: span 4; } .col-span--xl-4 { grid-column: span 4; } .row-start--xl-4 { grid-row-start: 4; } .row-end--xl-4 { grid-row-end: 4; } .col-start--xl-4 { grid-column-start: 4; } .col-end--xl-4 { grid-column-end: 4; } .row-span--xl-5 { grid-row: span 5; } .col-span--xl-5 { grid-column: span 5; } .row-start--xl-5 { grid-row-start: 5; } .row-end--xl-5 { grid-row-end: 5; } .col-start--xl-5 { grid-column-start: 5; } .col-end--xl-5 { grid-column-end: 5; } .row-span--xl-6 { grid-row: span 6; } .col-span--xl-6 { grid-column: span 6; } .row-start--xl-6 { grid-row-start: 6; } .row-end--xl-6 { grid-row-end: 6; } .col-start--xl-6 { grid-column-start: 6; } .col-end--xl-6 { grid-column-end: 6; } .row-span--xl-7 { grid-row: span 7; } .col-span--xl-7 { grid-column: span 7; } .row-start--xl-7 { grid-row-start: 7; } .row-end--xl-7 { grid-row-end: 7; } .col-start--xl-7 { grid-column-start: 7; } .col-end--xl-7 { grid-column-end: 7; } .row-span--xl-8 { grid-row: span 8; } .col-span--xl-8 { grid-column: span 8; } .row-start--xl-8 { grid-row-start: 8; } .row-end--xl-8 { grid-row-end: 8; } .col-start--xl-8 { grid-column-start: 8; } .col-end--xl-8 { grid-column-end: 8; } .row-span--xl-9 { grid-row: span 9; } .col-span--xl-9 { grid-column: span 9; } .row-start--xl-9 { grid-row-start: 9; } .row-end--xl-9 { grid-row-end: 9; } .col-start--xl-9 { grid-column-start: 9; } .col-end--xl-9 { grid-column-end: 9; } .row-span--xl-10 { grid-row: span 10; } .col-span--xl-10 { grid-column: span 10; } .row-start--xl-10 { grid-row-start: 10; } .row-end--xl-10 { grid-row-end: 10; } .col-start--xl-10 { grid-column-start: 10; } .col-end--xl-10 { grid-column-end: 10; } .row-span--xl-11 { grid-row: span 11; } .col-span--xl-11 { grid-column: span 11; } .row-start--xl-11 { grid-row-start: 11; } .row-end--xl-11 { grid-row-end: 11; } .col-start--xl-11 { grid-column-start: 11; } .col-end--xl-11 { grid-column-end: 11; } .row-span--xl-12 { grid-row: span 12; } .col-span--xl-12 { grid-column: span 12; } .row-start--xl-12 { grid-row-start: 12; } .row-end--xl-12 { grid-row-end: 12; } .col-start--xl-12 { grid-column-start: 12; } .col-end--xl-12 { grid-column-end: 12; } } @media (max-width: 992px) { .row-span--l-1 { grid-row: span 1; } .col-span--l-1 { grid-column: span 1; } .row-start--l-1 { grid-row-start: 1; } .row-end--l-1 { grid-row-end: 1; } .col-start--l-1 { grid-column-start: 1; } .col-end--l-1 { grid-column-end: 1; } .row-span--l-2 { grid-row: span 2; } .col-span--l-2 { grid-column: span 2; } .row-start--l-2 { grid-row-start: 2; } .row-end--l-2 { grid-row-end: 2; } .col-start--l-2 { grid-column-start: 2; } .col-end--l-2 { grid-column-end: 2; } .row-span--l-3 { grid-row: span 3; } .col-span--l-3 { grid-column: span 3; } .row-start--l-3 { grid-row-start: 3; } .row-end--l-3 { grid-row-end: 3; } .col-start--l-3 { grid-column-start: 3; } .col-end--l-3 { grid-column-end: 3; } .row-span--l-4 { grid-row: span 4; } .col-span--l-4 { grid-column: span 4; } .row-start--l-4 { grid-row-start: 4; } .row-end--l-4 { grid-row-end: 4; } .col-start--l-4 { grid-column-start: 4; } .col-end--l-4 { grid-column-end: 4; } .row-span--l-5 { grid-row: span 5; } .col-span--l-5 { grid-column: span 5; } .row-start--l-5 { grid-row-start: 5; } .row-end--l-5 { grid-row-end: 5; } .col-start--l-5 { grid-column-start: 5; } .col-end--l-5 { grid-column-end: 5; } .row-span--l-6 { grid-row: span 6; } .col-span--l-6 { grid-column: span 6; } .row-start--l-6 { grid-row-start: 6; } .row-end--l-6 { grid-row-end: 6; } .col-start--l-6 { grid-column-start: 6; } .col-end--l-6 { grid-column-end: 6; } .row-span--l-7 { grid-row: span 7; } .col-span--l-7 { grid-column: span 7; } .row-start--l-7 { grid-row-start: 7; } .row-end--l-7 { grid-row-end: 7; } .col-start--l-7 { grid-column-start: 7; } .col-end--l-7 { grid-column-end: 7; } .row-span--l-8 { grid-row: span 8; } .col-span--l-8 { grid-column: span 8; } .row-start--l-8 { grid-row-start: 8; } .row-end--l-8 { grid-row-end: 8; } .col-start--l-8 { grid-column-start: 8; } .col-end--l-8 { grid-column-end: 8; } .row-span--l-9 { grid-row: span 9; } .col-span--l-9 { grid-column: span 9; } .row-start--l-9 { grid-row-start: 9; } .row-end--l-9 { grid-row-end: 9; } .col-start--l-9 { grid-column-start: 9; } .col-end--l-9 { grid-column-end: 9; } .row-span--l-10 { grid-row: span 10; } .col-span--l-10 { grid-column: span 10; } .row-start--l-10 { grid-row-start: 10; } .row-end--l-10 { grid-row-end: 10; } .col-start--l-10 { grid-column-start: 10; } .col-end--l-10 { grid-column-end: 10; } .row-span--l-11 { grid-row: span 11; } .col-span--l-11 { grid-column: span 11; } .row-start--l-11 { grid-row-start: 11; } .row-end--l-11 { grid-row-end: 11; } .col-start--l-11 { grid-column-start: 11; } .col-end--l-11 { grid-column-end: 11; } .row-span--l-12 { grid-row: span 12; } .col-span--l-12 { grid-column: span 12; } .row-start--l-12 { grid-row-start: 12; } .row-end--l-12 { grid-row-end: 12; } .col-start--l-12 { grid-column-start: 12; } .col-end--l-12 { grid-column-end: 12; } } @media (max-width: 768px) { .row-span--m-1 { grid-row: span 1; } .col-span--m-1 { grid-column: span 1; } .row-start--m-1 { grid-row-start: 1; } .row-end--m-1 { grid-row-end: 1; } .col-start--m-1 { grid-column-start: 1; } .col-end--m-1 { grid-column-end: 1; } .row-span--m-2 { grid-row: span 2; } .col-span--m-2 { grid-column: span 2; } .row-start--m-2 { grid-row-start: 2; } .row-end--m-2 { grid-row-end: 2; } .col-start--m-2 { grid-column-start: 2; } .col-end--m-2 { grid-column-end: 2; } .row-span--m-3 { grid-row: span 3; } .col-span--m-3 { grid-column: span 3; } .row-start--m-3 { grid-row-start: 3; } .row-end--m-3 { grid-row-end: 3; } .col-start--m-3 { grid-column-start: 3; } .col-end--m-3 { grid-column-end: 3; } .row-span--m-4 { grid-row: span 4; } .col-span--m-4 { grid-column: span 4; } .row-start--m-4 { grid-row-start: 4; } .row-end--m-4 { grid-row-end: 4; } .col-start--m-4 { grid-column-start: 4; } .col-end--m-4 { grid-column-end: 4; } .row-span--m-5 { grid-row: span 5; } .col-span--m-5 { grid-column: span 5; } .row-start--m-5 { grid-row-start: 5; } .row-end--m-5 { grid-row-end: 5; } .col-start--m-5 { grid-column-start: 5; } .col-end--m-5 { grid-column-end: 5; } .row-span--m-6 { grid-row: span 6; } .col-span--m-6 { grid-column: span 6; } .row-start--m-6 { grid-row-start: 6; } .row-end--m-6 { grid-row-end: 6; } .col-start--m-6 { grid-column-start: 6; } .col-end--m-6 { grid-column-end: 6; } .row-span--m-7 { grid-row: span 7; } .col-span--m-7 { grid-column: span 7; } .row-start--m-7 { grid-row-start: 7; } .row-end--m-7 { grid-row-end: 7; } .col-start--m-7 { grid-column-start: 7; } .col-end--m-7 { grid-column-end: 7; } .row-span--m-8 { grid-row: span 8; } .col-span--m-8 { grid-column: span 8; } .row-start--m-8 { grid-row-start: 8; } .row-end--m-8 { grid-row-end: 8; } .col-start--m-8 { grid-column-start: 8; } .col-end--m-8 { grid-column-end: 8; } .row-span--m-9 { grid-row: span 9; } .col-span--m-9 { grid-column: span 9; } .row-start--m-9 { grid-row-start: 9; } .row-end--m-9 { grid-row-end: 9; } .col-start--m-9 { grid-column-start: 9; } .col-end--m-9 { grid-column-end: 9; } .row-span--m-10 { grid-row: span 10; } .col-span--m-10 { grid-column: span 10; } .row-start--m-10 { grid-row-start: 10; } .row-end--m-10 { grid-row-end: 10; } .col-start--m-10 { grid-column-start: 10; } .col-end--m-10 { grid-column-end: 10; } .row-span--m-11 { grid-row: span 11; } .col-span--m-11 { grid-column: span 11; } .row-start--m-11 { grid-row-start: 11; } .row-end--m-11 { grid-row-end: 11; } .col-start--m-11 { grid-column-start: 11; } .col-end--m-11 { grid-column-end: 11; } .row-span--m-12 { grid-row: span 12; } .col-span--m-12 { grid-column: span 12; } .row-start--m-12 { grid-row-start: 12; } .row-end--m-12 { grid-row-end: 12; } .col-start--m-12 { grid-column-start: 12; } .col-end--m-12 { grid-column-end: 12; } } @media (max-width: 480px) { .row-span--s-1 { grid-row: span 1; } .col-span--s-1 { grid-column: span 1; } .row-start--s-1 { grid-row-start: 1; } .row-end--s-1 { grid-row-end: 1; } .col-start--s-1 { grid-column-start: 1; } .col-end--s-1 { grid-column-end: 1; } .row-span--s-2 { grid-row: span 2; } .col-span--s-2 { grid-column: span 2; } .row-start--s-2 { grid-row-start: 2; } .row-end--s-2 { grid-row-end: 2; } .col-start--s-2 { grid-column-start: 2; } .col-end--s-2 { grid-column-end: 2; } .row-span--s-3 { grid-row: span 3; } .col-span--s-3 { grid-column: span 3; } .row-start--s-3 { grid-row-start: 3; } .row-end--s-3 { grid-row-end: 3; } .col-start--s-3 { grid-column-start: 3; } .col-end--s-3 { grid-column-end: 3; } .row-span--s-4 { grid-row: span 4; } .col-span--s-4 { grid-column: span 4; } .row-start--s-4 { grid-row-start: 4; } .row-end--s-4 { grid-row-end: 4; } .col-start--s-4 { grid-column-start: 4; } .col-end--s-4 { grid-column-end: 4; } .row-span--s-5 { grid-row: span 5; } .col-span--s-5 { grid-column: span 5; } .row-start--s-5 { grid-row-start: 5; } .row-end--s-5 { grid-row-end: 5; } .col-start--s-5 { grid-column-start: 5; } .col-end--s-5 { grid-column-end: 5; } .row-span--s-6 { grid-row: span 6; } .col-span--s-6 { grid-column: span 6; } .row-start--s-6 { grid-row-start: 6; } .row-end--s-6 { grid-row-end: 6; } .col-start--s-6 { grid-column-start: 6; } .col-end--s-6 { grid-column-end: 6; } .row-span--s-7 { grid-row: span 7; } .col-span--s-7 { grid-column: span 7; } .row-start--s-7 { grid-row-start: 7; } .row-end--s-7 { grid-row-end: 7; } .col-start--s-7 { grid-column-start: 7; } .col-end--s-7 { grid-column-end: 7; } .row-span--s-8 { grid-row: span 8; } .col-span--s-8 { grid-column: span 8; } .row-start--s-8 { grid-row-start: 8; } .row-end--s-8 { grid-row-end: 8; } .col-start--s-8 { grid-column-start: 8; } .col-end--s-8 { grid-column-end: 8; } .row-span--s-9 { grid-row: span 9; } .col-span--s-9 { grid-column: span 9; } .row-start--s-9 { grid-row-start: 9; } .row-end--s-9 { grid-row-end: 9; } .col-start--s-9 { grid-column-start: 9; } .col-end--s-9 { grid-column-end: 9; } .row-span--s-10 { grid-row: span 10; } .col-span--s-10 { grid-column: span 10; } .row-start--s-10 { grid-row-start: 10; } .row-end--s-10 { grid-row-end: 10; } .col-start--s-10 { grid-column-start: 10; } .col-end--s-10 { grid-column-end: 10; } .row-span--s-11 { grid-row: span 11; } .col-span--s-11 { grid-column: span 11; } .row-start--s-11 { grid-row-start: 11; } .row-end--s-11 { grid-row-end: 11; } .col-start--s-11 { grid-column-start: 11; } .col-end--s-11 { grid-column-end: 11; } .row-span--s-12 { grid-row: span 12; } .col-span--s-12 { grid-column: span 12; } .row-start--s-12 { grid-row-start: 12; } .row-end--s-12 { grid-row-end: 12; } .col-start--s-12 { grid-column-start: 12; } .col-end--s-12 { grid-column-end: 12; } } .col-span--all { grid-column: 1 / -1; } @media (max-width: 1366px) { .col-span--xl-all { grid-column: 1 / -1; } } @media (max-width: 992px) { .col-span--l-all { grid-column: 1 / -1; } } @media (max-width: 768px) { .col-span--m-all { grid-column: 1 / -1; } } @media (max-width: 480px) { .col-span--s-all { grid-column: 1 / -1; } } .order--first { order: -1; } .order--last { order: 999; } .col-end--last { grid-column-end: -1; } @media (max-width: 1366px) { .order--first-xl { order: -1; } .order--last-xl { order: 999; } .col-end--xl-last { grid-column-end: -1; } } @media (max-width: 992px) { .order--first-l { order: -1; } .order--last-l { order: 999; } .col-end--l-last { grid-column-end: -1; } } @media (max-width: 768px) { .order--first-m { order: -1; } .order--last-m { order: 999; } .col-end--m-last { grid-column-end: -1; } } @media (max-width: 480px) { .order--first-s { order: -1; } .order--last-s { order: 999; } .col-end--s-last { grid-column-end: -1; } } .grid--auto-rows.grid--auto-rows { grid-auto-rows: minmax(-webkit-min-content, 1fr); grid-auto-rows: minmax(min-content, 1fr); } [class*="grid--auto"]:where(:not([class*="rows"])) { display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --grid-template-columns-any: var(--grid-template-columns-fit); --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); --grid-template-columns-fit: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-fill: repeat(auto-fill, minmax(var(--min-formula), 1fr)); --grid-template-columns-even-fit: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); --grid-template-columns-even-fill: repeat(auto-fill, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } [class*="grid--auto"]:where(:not([class*="rows"])) > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } :is(.grid--auto-2, .grid--auto-3, .grid--auto-4, .grid--auto-5, .grid--auto-6, .grid--auto-7, .grid--auto-8, .grid--auto-9, .grid--auto-10, .grid--auto-11, .grid--auto-12):where(.grid--auto-rows) { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); } :is(.grid--auto-2, .grid--auto-3, .grid--auto-4, .grid--auto-5, .grid--auto-6, .grid--auto-7, .grid--auto-8, .grid--auto-9, .grid--auto-10, .grid--auto-11, .grid--auto-12):where(.grid--auto-rows) > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-2 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 2; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-3 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 3; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-4 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 4; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-5 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 5; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-6 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 6; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-7 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 7; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-8 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 8; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-9 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 9; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-10 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 10; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-11 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 11; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-12 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 12; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); } .grid--auto-1-2 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } .grid--auto-1-2 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-1-3 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); } .grid--auto-1-3 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-2-1 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } .grid--auto-2-1 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-2-3 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } .grid--auto-2-3 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-3-1 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); } .grid--auto-3-1 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-3-2 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); } .grid--auto-3-2 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } @media (max-width: 992px) { .grid--auto-1-2 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); --column-count: 1; } .grid--auto-1-2 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-1-3 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); --column-count: 1; } .grid--auto-1-3 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-2-1 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); --column-count: 1; } .grid--auto-2-1 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-2-3 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); --column-count: 1; } .grid--auto-2-3 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-3-1 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); --column-count: 1; } .grid--auto-3-1 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } .grid--auto-3-2 { --min: calc((var(--content-width) - ((var(--column-count) - 1) * var(--grid-gap))) / var(--column-count)) * 0.7; --column-count: 1; --grid-template-columns: repeat(auto-fit, minmax(var(--min-formula), 1fr)); --grid-template-columns-even: repeat(auto-fit, minmax(var(--min-formula), 1fr) minmax(var(--min-formula), 1fr)); display: grid !important; grid-template-columns: var(--grid-template-columns); gap: var(--grid-gap); inline-size: 100%; --min-formula: min(100%, max(var(--min), (100% - (var(--column-count) - 1) * var(--grid-gap)) / var(--column-count))); --column-count: 1; } .grid--auto-3-2 > * { min-width: 0; max-width: 100%; overflow-wrap: break-word; } } .grid--auto-fill { --grid-template-columns: var(--grid-template-columns-fill); } .grid--auto-fit { --grid-template-columns: var(--grid-template-columns-fit); } @media (min-width: 481px) { .grid--stack-even { --grid-template-columns: var(--grid-template-columns-even); } .grid--stack-even.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-even-fill); } .grid--stack-even.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-even-fit); } } .grid--stack-any { --grid-template-columns: var(--grid-template-columns-any); } .grid--stack-any.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-fill); } .grid--stack-any.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-fit); } @media (max-width: 1366px) { .grid--stack-any-xl { --grid-template-columns: var(--grid-template-columns-any); } .grid--stack-any-xl.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-any-fill); } .grid--stack-any-xl.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-any-fit); } } @media (min-width: 1367px) { .grid--stack-even-xl { --grid-template-columns: var(--grid-template-columns-even); } .grid--stack-even-xl.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-even-fill); } .grid--stack-even-xl.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-even-fit); } } @media (max-width: 992px) { .grid--stack-any-l { --grid-template-columns: var(--grid-template-columns-any); } .grid--stack-any-l.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-any-fill); } .grid--stack-any-l.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-any-fit); } } @media (min-width: 993px) { .grid--stack-even-l { --grid-template-columns: var(--grid-template-columns-even); } .grid--stack-even-l.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-even-fill); } .grid--stack-even-l.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-even-fit); } } @media (max-width: 768px) { .grid--stack-any-m { --grid-template-columns: var(--grid-template-columns-any); } .grid--stack-any-m.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-any-fill); } .grid--stack-any-m.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-any-fit); } } @media (min-width: 769px) { .grid--stack-even-m { --grid-template-columns: var(--grid-template-columns-even); } .grid--stack-even-m.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-even-fill); } .grid--stack-even-m.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-even-fit); } } @media (max-width: 480px) { .grid--stack-any-s { --grid-template-columns: var(--grid-template-columns-any); } .grid--stack-any-s.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-any-fill); } .grid--stack-any-s.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-any-fit); } } @media (min-width: 481px) { .grid--stack-even-s { --grid-template-columns: var(--grid-template-columns-even); } .grid--stack-even-s.grid--auto-fill { --grid-template-columns: var(--grid-template-columns-even-fill); } .grid--stack-even-s.grid--auto-fit { --grid-template-columns: var(--grid-template-columns-even-fit); } } .flex--col.flex--col { display: flex; flex-direction: column; } .flex--row.flex--row { display: flex; flex-direction: row; } .flex--col-reverse.flex--col-reverse { display: flex; flex-direction: column-reverse; } .flex--row-reverse.flex--row-reverse { display: flex; flex-direction: row-reverse; } @media (max-width: 1366px) { .flex--col-xl.flex--col-xl { display: flex; flex-direction: column; } .flex--row-xl.flex--row-xl { display: flex; flex-direction: row; } .flex--col-reverse-xl.flex--col-reverse-xl { display: flex; flex-direction: column-reverse; } .flex--row-reverse-xl.flex--row-reverse-xl { display: flex; flex-direction: row-reverse; } } @media (max-width: 992px) { .flex--col-l.flex--col-l { display: flex; flex-direction: column; } .flex--row-l.flex--row-l { display: flex; flex-direction: row; } .flex--col-reverse-l.flex--col-reverse-l { display: flex; flex-direction: column-reverse; } .flex--row-reverse-l.flex--row-reverse-l { display: flex; flex-direction: row-reverse; } } @media (max-width: 768px) { .flex--col-m.flex--col-m { display: flex; flex-direction: column; } .flex--row-m.flex--row-m { display: flex; flex-direction: row; } .flex--col-reverse-m.flex--col-reverse-m { display: flex; flex-direction: column-reverse; } .flex--row-reverse-m.flex--row-reverse-m { display: flex; flex-direction: row-reverse; } } @media (max-width: 480px) { .flex--col-s.flex--col-s { display: flex; flex-direction: column; } .flex--row-s.flex--row-s { display: flex; flex-direction: row; } .flex--col-reverse-s.flex--col-reverse-s { display: flex; flex-direction: column-reverse; } .flex--row-reverse-s.flex--row-reverse-s { display: flex; flex-direction: row-reverse; } } .justify-content--start.justify-content--start { justify-content: flex-start; } .justify-content--end.justify-content--end { justify-content: flex-end; } .justify-content--center.justify-content--center { justify-content: center; } .justify-content--between.justify-content--between { justify-content: space-between; } .justify-content--around.justify-content--around { justify-content: space-around; } .justify-content--stretch.justify-content--stretch { justify-content: stretch; } .align-content--start.align-content--start { align-content: flex-start; } .align-content--end.align-content--end { align-content: flex-end; } .align-content--center.align-content--center { align-content: center; } .align-content--baseline.align-content--baseline { align-content: baseline; } .align-content--stretch.align-content--stretch { align-content: stretch; } .justify-items--start.justify-items--start { justify-items: flex-start; } .justify-items--center.justify-items--center { justify-items: center; } .justify-items--end.justify-items--end { justify-items: flex-end; } .justify-items--stretch.justify-items--stretch { justify-items: stretch; } .align-items--start.align-items--start { align-items: flex-start; } .align-items--end.align-items--end { align-items: flex-end; } .align-items--center.align-items--center { align-items: center; } .align-items--baseline.align-items--baseline { align-items: baseline; } .align-items--stretch.align-items--stretch { align-items: stretch; } .self--start.self--start { align-self: flex-start; } .self--end.self--end { align-self: flex-end; } .self--stretch.self--stretch { align-self: stretch; } .self--center.self--center { align-self: center; } @media (max-width: 1366px) { .justify-content--start-xl.justify-content--start-xl { justify-content: flex-start; } .justify-content--end-xl.justify-content--end-xl { justify-content: flex-end; } .justify-content--center-xl.justify-content--center-xl { justify-content: center; } .justify-content--between-xl.justify-content--between-xl { justify-content: space-between; } .justify-content--around-xl.justify-content--around-xl { justify-content: space-around; } .justify-content--stretch-xl.justify-content--stretch-xl { justify-content: stretch; } .align-content--start-xl.align-content--start-xl { align-content: flex-start; } .align-content--end-xl.align-content--end-xl { align-content: flex-end; } .align-content--center-xl.align-content--center-xl { align-content: center; } .align-content--baseline-xl.align-content--baseline-xl { align-content: baseline; } .align-content--stretch-xl.align-content--stretch-xl { align-content: stretch; } .justify-items--start-xl.justify-items--start-xl { justify-items: flex-start; } .justify-items--center-xl.justify-items--center-xl { justify-items: center; } .justify-items--end-xl.justify-items--end-xl { justify-items: flex-end; } .justify-items--stretch-xl.justify-items--stretch-xl { justify-items: stretch; } .align-items--start-xl.align-items--start-xl { align-items: flex-start; } .align-items--end-xl.align-items--end-xl { align-items: flex-end; } .align-items--center-xl.align-items--center-xl { align-items: center; } .align-items--baseline-xl.align-items--baseline-xl { align-items: baseline; } .align-items--stretch-xl.align-items--stretch-xl { align-items: stretch; } .self--start-xl.self--start-xl { align-self: flex-start; } .self--end-xl.self--end-xl { align-self: flex-end; } .self--stretch-xl.self--stretch-xl { align-self: stretch; } .self--center-xl.self--center-xl { align-self: center; } } @media (max-width: 992px) { .justify-content--start-l.justify-content--start-l { justify-content: flex-start; } .justify-content--end-l.justify-content--end-l { justify-content: flex-end; } .justify-content--center-l.justify-content--center-l { justify-content: center; } .justify-content--between-l.justify-content--between-l { justify-content: space-between; } .justify-content--around-l.justify-content--around-l { justify-content: space-around; } .justify-content--stretch-l.justify-content--stretch-l { justify-content: stretch; } .align-content--start-l.align-content--start-l { align-content: flex-start; } .align-content--end-l.align-content--end-l { align-content: flex-end; } .align-content--center-l.align-content--center-l { align-content: center; } .align-content--baseline-l.align-content--baseline-l { align-content: baseline; } .align-content--stretch-l.align-content--stretch-l { align-content: stretch; } .justify-items--start-l.justify-items--start-l { justify-items: flex-start; } .justify-items--center-l.justify-items--center-l { justify-items: center; } .justify-items--end-l.justify-items--end-l { justify-items: flex-end; } .justify-items--stretch-l.justify-items--stretch-l { justify-items: stretch; } .align-items--start-l.align-items--start-l { align-items: flex-start; } .align-items--end-l.align-items--end-l { align-items: flex-end; } .align-items--center-l.align-items--center-l { align-items: center; } .align-items--baseline-l.align-items--baseline-l { align-items: baseline; } .align-items--stretch-l.align-items--stretch-l { align-items: stretch; } .self--start-l.self--start-l { align-self: flex-start; } .self--end-l.self--end-l { align-self: flex-end; } .self--stretch-l.self--stretch-l { align-self: stretch; } .self--center-l.self--center-l { align-self: center; } } @media (max-width: 768px) { .justify-content--start-m.justify-content--start-m { justify-content: flex-start; } .justify-content--end-m.justify-content--end-m { justify-content: flex-end; } .justify-content--center-m.justify-content--center-m { justify-content: center; } .justify-content--between-m.justify-content--between-m { justify-content: space-between; } .justify-content--around-m.justify-content--around-m { justify-content: space-around; } .justify-content--stretch-m.justify-content--stretch-m { justify-content: stretch; } .align-content--start-m.align-content--start-m { align-content: flex-start; } .align-content--end-m.align-content--end-m { align-content: flex-end; } .align-content--center-m.align-content--center-m { align-content: center; } .align-content--baseline-m.align-content--baseline-m { align-content: baseline; } .align-content--stretch-m.align-content--stretch-m { align-content: stretch; } .justify-items--start-m.justify-items--start-m { justify-items: flex-start; } .justify-items--center-m.justify-items--center-m { justify-items: center; } .justify-items--end-m.justify-items--end-m { justify-items: flex-end; } .justify-items--stretch-m.justify-items--stretch-m { justify-items: stretch; } .align-items--start-m.align-items--start-m { align-items: flex-start; } .align-items--end-m.align-items--end-m { align-items: flex-end; } .align-items--center-m.align-items--center-m { align-items: center; } .align-items--baseline-m.align-items--baseline-m { align-items: baseline; } .align-items--stretch-m.align-items--stretch-m { align-items: stretch; } .self--start-m.self--start-m { align-self: flex-start; } .self--end-m.self--end-m { align-self: flex-end; } .self--stretch-m.self--stretch-m { align-self: stretch; } .self--center-m.self--center-m { align-self: center; } } @media (max-width: 480px) { .justify-content--start-s.justify-content--start-s { justify-content: flex-start; } .justify-content--end-s.justify-content--end-s { justify-content: flex-end; } .justify-content--center-s.justify-content--center-s { justify-content: center; } .justify-content--between-s.justify-content--between-s { justify-content: space-between; } .justify-content--around-s.justify-content--around-s { justify-content: space-around; } .justify-content--stretch-s.justify-content--stretch-s { justify-content: stretch; } .align-content--start-s.align-content--start-s { align-content: flex-start; } .align-content--end-s.align-content--end-s { align-content: flex-end; } .align-content--center-s.align-content--center-s { align-content: center; } .align-content--baseline-s.align-content--baseline-s { align-content: baseline; } .align-content--stretch-s.align-content--stretch-s { align-content: stretch; } .justify-items--start-s.justify-items--start-s { justify-items: flex-start; } .justify-items--center-s.justify-items--center-s { justify-items: center; } .justify-items--end-s.justify-items--end-s { justify-items: flex-end; } .justify-items--stretch-s.justify-items--stretch-s { justify-items: stretch; } .align-items--start-s.align-items--start-s { align-items: flex-start; } .align-items--end-s.align-items--end-s { align-items: flex-end; } .align-items--center-s.align-items--center-s { align-items: center; } .align-items--baseline-s.align-items--baseline-s { align-items: baseline; } .align-items--stretch-s.align-items--stretch-s { align-items: stretch; } .self--start-s.self--start-s { align-self: flex-start; } .self--end-s.self--end-s { align-self: flex-end; } .self--stretch-s.self--stretch-s { align-self: stretch; } .self--center-s.self--center-s { align-self: center; } } .stretch.stretch { align-content: stretch; align-items: stretch; justify-content: stretch; justify-items: stretch; } .flex--wrap.flex--wrap { flex-wrap: wrap; } .flex--grow > * { flex-grow: 1; } .width--xs:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.1); max-inline-size: 100%; } .width--s:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.2); max-inline-size: 100%; } .width--m:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.4); max-inline-size: 100%; } .width--l:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.6); max-inline-size: 100%; } .width--xl:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.8); max-inline-size: 100%; } .width--xxl:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.9); max-inline-size: 100%; } .width--vp-max:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 1); max-inline-size: 100%; } .width--content:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 1); max-inline-size: 100%; } .width--10:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.1); max-inline-size: 100%; } .width--20:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.2); max-inline-size: 100%; } .width--30:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.3); max-inline-size: 100%; } .width--40:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.4); max-inline-size: 100%; } .width--50:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.5); max-inline-size: 100%; } .width--60:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.6); max-inline-size: 100%; } .width--70:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.7); max-inline-size: 100%; } .width--80:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.8); max-inline-size: 100%; } .width--90:not([class*="breakout--"]) { inline-size: calc(var(--content-width) * 0.9); max-inline-size: 100%; } .width--full:not([class*="breakout--"]) { inline-size: 100%; max-inline-size: 100%; } figure[class*="width--"] img { inline-size: 100%; } .width--auto.width--auto { inline-size: auto !important; max-inline-size: 100%; } .content-width.content-width { inline-size: 100%; max-inline-size: var(--content-width); margin-inline: auto; } .content-width--safe.content-width--safe { inline-size: 100%; max-inline-size: var(--content-width-safe); margin-inline: auto; } [class*="aspect--"] { aspect-ratio: var(--aspect-ratio); } img[class*="aspect--"] { -o-object-fit: var(--object-fit, cover); object-fit: var(--object-fit, cover); } figure[class*="aspect--"] img { inline-size: 100%; block-size: 100%; } [class*="aspect--"] iframe { width: 100%; height: 100%; aspect-ratio: var(--aspect-ratio); } .aspect--1-1 { --aspect-ratio: 1 / 1; } .aspect--1-2 { --aspect-ratio: 1 / 2; } .aspect--2-1 { --aspect-ratio: 2 / 1; } .aspect--2-3 { --aspect-ratio: 2 / 3; } .aspect--3-2 { --aspect-ratio: 3 / 2; } .aspect--3-4 { --aspect-ratio: 3 / 4; } .aspect--4-3 { --aspect-ratio: 4 / 3; } .aspect--16-9 { --aspect-ratio: 16 / 9; } .aspect--9-16 { --aspect-ratio: 9 / 16; } @media (max-width: 1366px) { .aspect--xl-1-1 { --aspect-ratio: 1 / 1; } .aspect--xl-1-2 { --aspect-ratio: 1 / 2; } .aspect--xl-2-1 { --aspect-ratio: 2 / 1; } .aspect--xl-2-3 { --aspect-ratio: 2 / 3; } .aspect--xl-3-2 { --aspect-ratio: 3 / 2; } .aspect--xl-3-4 { --aspect-ratio: 3 / 4; } .aspect--xl-4-3 { --aspect-ratio: 4 / 3; } .aspect--xl-16-9 { --aspect-ratio: 16 / 9; } .aspect--xl-9-16 { --aspect-ratio: 9 / 16; } } @media (max-width: 992px) { .aspect--l-1-1 { --aspect-ratio: 1 / 1; } .aspect--l-1-2 { --aspect-ratio: 1 / 2; } .aspect--l-2-1 { --aspect-ratio: 2 / 1; } .aspect--l-2-3 { --aspect-ratio: 2 / 3; } .aspect--l-3-2 { --aspect-ratio: 3 / 2; } .aspect--l-3-4 { --aspect-ratio: 3 / 4; } .aspect--l-4-3 { --aspect-ratio: 4 / 3; } .aspect--l-16-9 { --aspect-ratio: 16 / 9; } .aspect--l-9-16 { --aspect-ratio: 9 / 16; } } @media (max-width: 768px) { .aspect--m-1-1 { --aspect-ratio: 1 / 1; } .aspect--m-1-2 { --aspect-ratio: 1 / 2; } .aspect--m-2-1 { --aspect-ratio: 2 / 1; } .aspect--m-2-3 { --aspect-ratio: 2 / 3; } .aspect--m-3-2 { --aspect-ratio: 3 / 2; } .aspect--m-3-4 { --aspect-ratio: 3 / 4; } .aspect--m-4-3 { --aspect-ratio: 4 / 3; } .aspect--m-16-9 { --aspect-ratio: 16 / 9; } .aspect--m-9-16 { --aspect-ratio: 9 / 16; } } @media (max-width: 480px) { .aspect--s-1-1 { --aspect-ratio: 1 / 1; } .aspect--s-1-2 { --aspect-ratio: 1 / 2; } .aspect--s-2-1 { --aspect-ratio: 2 / 1; } .aspect--s-2-3 { --aspect-ratio: 2 / 3; } .aspect--s-3-2 { --aspect-ratio: 3 / 2; } .aspect--s-3-4 { --aspect-ratio: 3 / 4; } .aspect--s-4-3 { --aspect-ratio: 4 / 3; } .aspect--s-16-9 { --aspect-ratio: 16 / 9; } .aspect--s-9-16 { --aspect-ratio: 9 / 16; } } @supports not (aspect-ratio: 1.7777777778) { [class*="aspect--"]::before { float: left; padding-top: var(--aspect-fallback-value); content: ""; } [class*="aspect--"]::after { display: block; content: ""; clear: both; } .aspect--1-1 { --aspect-fallback-value: 100%; } .aspect--1-2 { --aspect-fallback-value: 50%; } .aspect--2-1 { --aspect-fallback-value: 200%; } .aspect--2-3 { --aspect-fallback-value: 150%; } .aspect--3-2 { --aspect-fallback-value: 66%; } .aspect--3-4 { --aspect-fallback-value: 133%; } .aspect--4-3 { --aspect-fallback-value: 75%; } .aspect--16-9 { --aspect-fallback-value: 56.25%; } .aspect--9-16 { --aspect-fallback-value: 177%; } @media (max-width: 1366px) { .aspect--xl-1-1 { --aspect-fallback-value: 100%; } .aspect--xl-1-2 { --aspect-fallback-value: 50%; } .aspect--xl-2-1 { --aspect-fallback-value: 200%; } .aspect--xl-2-3 { --aspect-fallback-value: 150%; } .aspect--xl-3-2 { --aspect-fallback-value: 66%; } .aspect--xl-3-4 { --aspect-fallback-value: 133%; } .aspect--xl-4-3 { --aspect-fallback-value: 75%; } .aspect--xl-16-9 { --aspect-fallback-value: 56.25%; } .aspect--xl-9-16 { --aspect-fallback-value: 177%; } } @media (max-width: 992px) { .aspect--l-1-1 { --aspect-fallback-value: 100%; } .aspect--l-1-2 { --aspect-fallback-value: 50%; } .aspect--l-2-1 { --aspect-fallback-value: 200%; } .aspect--l-2-3 { --aspect-fallback-value: 150%; } .aspect--l-3-2 { --aspect-fallback-value: 66%; } .aspect--l-3-4 { --aspect-fallback-value: 133%; } .aspect--l-4-3 { --aspect-fallback-value: 75%; } .aspect--l-16-9 { --aspect-fallback-value: 56.25%; } .aspect--l-9-16 { --aspect-fallback-value: 177%; } } @media (max-width: 768px) { .aspect--m-1-1 { --aspect-fallback-value: 100%; } .aspect--m-1-2 { --aspect-fallback-value: 50%; } .aspect--m-2-1 { --aspect-fallback-value: 200%; } .aspect--m-2-3 { --aspect-fallback-value: 150%; } .aspect--m-3-2 { --aspect-fallback-value: 66%; } .aspect--m-3-4 { --aspect-fallback-value: 133%; } .aspect--m-4-3 { --aspect-fallback-value: 75%; } .aspect--m-16-9 { --aspect-fallback-value: 56.25%; } .aspect--m-9-16 { --aspect-fallback-value: 177%; } } @media (max-width: 480px) { .aspect--s-1-1 { --aspect-fallback-value: 100%; } .aspect--s-1-2 { --aspect-fallback-value: 50%; } .aspect--s-2-1 { --aspect-fallback-value: 200%; } .aspect--s-2-3 { --aspect-fallback-value: 150%; } .aspect--s-3-2 { --aspect-fallback-value: 66%; } .aspect--s-3-4 { --aspect-fallback-value: 133%; } .aspect--s-4-3 { --aspect-fallback-value: 75%; } .aspect--s-16-9 { --aspect-fallback-value: 56.25%; } .aspect--s-9-16 { --aspect-fallback-value: 177%; } } } .z--bottom { z-index: -1; } .z--0 { z-index: 0; } .z--10 { z-index: 10; } .z--20 { z-index: 20; } .z--30 { z-index: 30; } .z--40 { z-index: 40; } .z--50 { z-index: 50; } .z--60 { z-index: 60; } .z--70 { z-index: 70; } .z--80 { z-index: 80; } .z--90 { z-index: 90; } .z--top { z-index: 9999; } @media (max-width: 1366px) { .z--xl-bottom { z-index: -1; } .z--xl-0 { z-index: 0; } .z--xl-10 { z-index: 10; } .z--xl-20 { z-index: 20; } .z--xl-30 { z-index: 30; } .z--xl-40 { z-index: 40; } .z--xl-50 { z-index: 50; } .z--xl-60 { z-index: 60; } .z--xl-70 { z-index: 70; } .z--xl-80 { z-index: 80; } .z--xl-90 { z-index: 90; } .z--xl-top { z-index: 9999; } } @media (max-width: 992px) { .z--l-bottom { z-index: -1; } .z--l-0 { z-index: 0; } .z--l-10 { z-index: 10; } .z--l-20 { z-index: 20; } .z--l-30 { z-index: 30; } .z--l-40 { z-index: 40; } .z--l-50 { z-index: 50; } .z--l-60 { z-index: 60; } .z--l-70 { z-index: 70; } .z--l-80 { z-index: 80; } .z--l-90 { z-index: 90; } .z--l-top { z-index: 9999; } } @media (max-width: 768px) { .z--m-bottom { z-index: -1; } .z--m-0 { z-index: 0; } .z--m-10 { z-index: 10; } .z--m-20 { z-index: 20; } .z--m-30 { z-index: 30; } .z--m-40 { z-index: 40; } .z--m-50 { z-index: 50; } .z--m-60 { z-index: 60; } .z--m-70 { z-index: 70; } .z--m-80 { z-index: 80; } .z--m-90 { z-index: 90; } .z--m-top { z-index: 9999; } } @media (max-width: 480px) { .z--s-bottom { z-index: -1; } .z--s-0 { z-index: 0; } .z--s-10 { z-index: 10; } .z--s-20 { z-index: 20; } .z--s-30 { z-index: 30; } .z--s-40 { z-index: 40; } .z--s-50 { z-index: 50; } .z--s-60 { z-index: 60; } .z--s-70 { z-index: 70; } .z--s-80 { z-index: 80; } .z--s-90 { z-index: 90; } .z--s-top { z-index: 9999; } } .isolation--isolate { isolation: isolate; } .marker--primary li::marker { color: var(--primary); } .marker--primary-hover li::marker { color: var(--primary-hover); } .marker--primary-ultra-light li::marker { color: var(--primary-ultra-light); } .marker--primary-light li::marker { color: var(--primary-light); } .marker--primary-semi-light li::marker { color: var(--primary-semi-light); } .marker--primary-semi-dark li::marker { color: var(--primary-semi-dark); } .marker--primary-dark li::marker { color: var(--primary-dark); } .marker--primary-ultra-dark li::marker { color: var(--primary-ultra-dark); } .marker--secondary li::marker { color: var(--secondary); } .marker--secondary-hover li::marker { color: var(--secondary-hover); } .marker--secondary-ultra-light li::marker { color: var(--secondary-ultra-light); } .marker--secondary-light li::marker { color: var(--secondary-light); } .marker--secondary-semi-light li::marker { color: var(--secondary-semi-light); } .marker--secondary-semi-dark li::marker { color: var(--secondary-semi-dark); } .marker--secondary-dark li::marker { color: var(--secondary-dark); } .marker--secondary-ultra-dark li::marker { color: var(--secondary-ultra-dark); } .marker--tertiary li::marker { color: var(--tertiary); } .marker--tertiary-hover li::marker { color: var(--tertiary-hover); } .marker--tertiary-ultra-light li::marker { color: var(--tertiary-ultra-light); } .marker--tertiary-light li::marker { color: var(--tertiary-light); } .marker--tertiary-semi-light li::marker { color: var(--tertiary-semi-light); } .marker--tertiary-semi-dark li::marker { color: var(--tertiary-semi-dark); } .marker--tertiary-dark li::marker { color: var(--tertiary-dark); } .marker--tertiary-ultra-dark li::marker { color: var(--tertiary-ultra-dark); } .marker--accent li::marker { color: var(--accent); } .marker--accent-hover li::marker { color: var(--accent-hover); } .marker--accent-ultra-light li::marker { color: var(--accent-ultra-light); } .marker--accent-light li::marker { color: var(--accent-light); } .marker--accent-semi-light li::marker { color: var(--accent-semi-light); } .marker--accent-semi-dark li::marker { color: var(--accent-semi-dark); } .marker--accent-dark li::marker { color: var(--accent-dark); } .marker--accent-ultra-dark li::marker { color: var(--accent-ultra-dark); } .marker--neutral li::marker { color: var(--neutral); } .marker--neutral-hover li::marker { color: var(--neutral-hover); } .marker--neutral-ultra-light li::marker { color: var(--neutral-ultra-light); } .marker--neutral-light li::marker { color: var(--neutral-light); } .marker--neutral-semi-light li::marker { color: var(--neutral-semi-light); } .marker--neutral-semi-dark li::marker { color: var(--neutral-semi-dark); } .marker--neutral-dark li::marker { color: var(--neutral-dark); } .marker--neutral-ultra-dark li::marker { color: var(--neutral-ultra-dark); } .marker--white li::marker { color: var(--white); } .marker--black li::marker { color: var(--black); }  ul.list--none, ol.list--none, .list--none > ul, .list--none > ol { list-style: none; padding-inline-start: 0; list-style-type: none; -webkit-margin-before: 0em; margin-block-start: 0em; margin-block-end: 0; } :has(> .ribbon) { position: relative; overflow: hidden; } .ribbon { --ribbon-width: 30rem; --ribbon-offset: -2rem; --ribbon-padding: .5em 1em; --ribbon-background-color: var(--action); --ribbon-text-color: var(--white); --ribbon-text-size: var(--text-s); --ribbon-shadow: 0 5px 10px var(--neutral-trans-10); --ribbon-transform: translateY(-100%) rotate(90deg) translateX(70.71067811865476%) rotate(-45deg); --ribbon-transform-origin: bottom right; position: absolute; display: block; padding: var(--ribbon-padding); background-color: var(--ribbon-background-color); box-shadow: var(--ribbon-shadow); text-align: center; font-size: var(--ribbon-text-size); color: var(--ribbon-text-color); inline-size: var(--ribbon-width); } .ribbon--top-right, .ribbon[data-ribbon-position="top-right"] { inset-block-start: var(--ribbon-offset); inset-inline-end: var(--ribbon-offset); transform: var(--ribbon-transform); transform-origin: var(--ribbon-transform-origin); } .ribbon--top-left, .ribbon[data-ribbon-position="top-left"] { --ribbon-transform: translateY(-100%) rotate(90deg) translateX(70.71067811865476%) rotate(-135deg); --ribbon-transform-origin: bottom left; inset-block-start: var(--ribbon-offset); inset-inline-start: var(--ribbon-offset); transform: var(--ribbon-transform); transform-origin: var(--ribbon-transform-origin); } span.ribbon { inline-size: var(--ribbon-width) !important; } .visibility--hidden.visibility--hidden { visibility: var(--visibility, hidden); } .visibility--visible.visibility--visible { visibility: var(--visibility, visible); } @media (max-width: 1366px) { .visibility--hidden-xl.visibility--hidden-xl { visibility: var(--visibility, hidden); } .visibility--visible-xl.visibility--visible-xl { visibility: var(--visibility, visible); } } @media (max-width: 992px) { .visibility--hidden-l.visibility--hidden-l { visibility: var(--visibility, hidden); } .visibility--visible-l.visibility--visible-l { visibility: var(--visibility, visible); } } @media (max-width: 768px) { .visibility--hidden-m.visibility--hidden-m { visibility: var(--visibility, hidden); } .visibility--visible-m.visibility--visible-m { visibility: var(--visibility, visible); } } @media (max-width: 480px) { .visibility--hidden-s.visibility--hidden-s { visibility: var(--visibility, hidden); } .visibility--visible-s.visibility--visible-s { visibility: var(--visibility, visible); } } .display--inline.display--inline { display: inline; } .display--block.display--block { display: block; } .display--contents.display--contents { display: contents; } .display--inline-block.display--inline-block { display: inline-block; } .display--inline-flex.display--inline-flex { display: inline-flex; } .display--list-item.display--list-item { display: list-item; } .display--none.display--none { display: none; } @media (max-width: 1366px) { .display--xl-block.display--xl-block { display: block; } .display--xl-none.display--xl-none { display: none; } } @media (max-width: 992px) { .display--l-block.display--l-block { display: block; } .display--l-none.display--l-none { display: none; } } @media (max-width: 768px) { .display--m-block.display--m-block { display: block; } .display--m-none.display--m-none { display: none; } } @media (max-width: 480px) { .display--s-block.display--s-block { display: block; } .display--s-none.display--s-none { display: none; } } @supports (font-size: calc(1vw + 2vw)) { :root { --text-xs: calc(1.4rem + (0.4 * ((100vw - 36rem) / 100.6))); --text-s: calc(1.6rem + (0.4 * ((100vw - 36rem) / 100.6))); --text-m: calc(1.8rem + (0.6 * ((100vw - 36rem) / 100.6))); --text-l: calc(1.92rem + (0.4794 * ((100vw - 36rem) / 100.6))); --text-xl: calc(2.304rem + (0.8944002 * ((100vw - 36rem) / 100.6))); --text-xxl: calc(2.7648rem + (1.4986674666 * ((100vw - 36rem) / 100.6))); --h6: calc(1.2rem + (-0.074437289 * ((100vw - 36rem) / 100.6))); --h5: calc(1.3rem + (0.2003750938 * ((100vw - 36rem) / 100.6))); --h4: calc(2.2rem + (0.8 * ((100vw - 36rem) / 100.6))); --h3: calc(2.5rem + (1 * ((100vw - 36rem) / 100.6))); --h2: calc(3.5rem + (3.5 * ((100vw - 36rem) / 100.6))); --h1: calc(4rem + (3.5 * ((100vw - 36rem) / 100.6))); } @media (min-width: 1367px) { :root { --text-xs: 1.8rem; --text-s: 2rem; --text-m: 2.4rem; --text-l: 2.3994rem; --text-xl: 3.1984002rem; --text-xxl: 4.2634674666rem; --h6: 1.125562711rem; --h5: 1.5003750938rem; --h4: 3rem; --h3: 3.5rem; --h2: 7rem; --h1: 7.5rem; } } } @supports (font-size: clamp(1vw, 2vw, 3vw)) { :root { --text-xs: clamp(1.4rem, calc(0.3976143141vw + 1.2568588469rem), 1.8rem); --text-s: clamp(1.6rem, calc(0.3976143141vw + 1.4568588469rem), 2rem); --text-m: clamp(1.8rem, calc(0.5964214712vw + 1.5852882704rem), 2.4rem); --text-l: clamp(1.92rem, calc(0.4765407555vw + 1.748445328rem), 2.3994rem); --text-xl: clamp(2.304rem, calc(0.8890658052vw + 1.9839363101rem), 3.1984002rem); --text-xxl: clamp(2.7648rem, calc(1.489729092vw + 2.2284975269rem), 4.2634674666rem); --h6: clamp(1.2rem, calc(-0.073993329vw + 1.2266375984rem), 1.125562711rem); --h5: clamp(1.3rem, calc(0.1991800137vw + 1.2282951951rem), 1.5003750938rem); --h4: clamp(2.2rem, calc(0.7952286282vw + 1.9137176938rem), 3rem); --h3: clamp(2.5rem, calc(0.9940357853vw + 2.1421471173rem), 3.5rem); --h2: clamp(3.5rem, calc(3.4791252485vw + 2.2475149105rem), 7rem); --h1: clamp(4rem, calc(3.4791252485vw + 2.7475149105rem), 7.5rem); } } @supports (padding: calc(1vw + 2vw)) { :root { --space-xs: calc(1.3506752532rem + (-0.0173419199 * ((100vw - 36rem) / 100.6))); --space-s: calc(1.8004501125rem + (0.1995498875 * ((100vw - 36rem) / 100.6))); --space-m: calc(2.4rem + (0.6 * ((100vw - 36rem) / 100.6))); --space-l: calc(3.1992rem + (1.3008 * ((100vw - 36rem) / 100.6))); --space-xl: calc(4.2645336rem + (2.4854664 * ((100vw - 36rem) / 100.6))); --space-xxl: calc(5.6846232888rem + (4.4403767112 * ((100vw - 36rem) / 100.6))); --section-space-xs: calc(2.7013505064rem + (1.2986494936 * ((100vw - 36rem) / 100.6))); --section-space-s: calc(3.6009002251rem + (2.3990997749 * ((100vw - 36rem) / 100.6))); --section-space-m: calc(4.8rem + (4.2 * ((100vw - 36rem) / 100.6))); --section-space-l: calc(6.3984rem + (7.1016 * ((100vw - 36rem) / 100.6))); --section-space-xl: calc(8.5290672rem + (11.7209328 * ((100vw - 36rem) / 100.6))); --section-space-xxl: calc(11.3692465776rem + (19.0057534224 * ((100vw - 36rem) / 100.6))); --section-padding-x: calc(2rem + (4 * ((100vw - 36rem) / 100.6))); --gutter: calc(2rem + (4 * ((100vw - 36rem) / 100.6))); } @media (min-width: 1367px) { :root { --space-xs: 1.3333333333rem; --space-s: 2rem; --space-m: 3rem; --space-l: 4.5rem; --space-xl: 6.75rem; --space-xxl: 10.125rem; --section-space-xs: 4rem; --section-space-s: 6rem; --section-space-m: 9rem; --section-space-l: 13.5rem; --section-space-xl: 20.25rem; --section-space-xxl: 30.375rem; --section-padding-x: 6rem; --gutter: 6rem; } } } @supports (padding: clamp(1vw, 2vw, 3vw)) { :root { --space-xs: clamp(1.3506752532rem, calc(-0.0172384889vw + 1.3568811092rem), 1.3333333333rem); --space-s: clamp(1.8004501125rem, calc(0.1983597291vw + 1.7290406101rem), 2rem); --space-m: clamp(2.4rem, calc(0.5964214712vw + 2.1852882704rem), 3rem); --space-l: clamp(3.1992rem, calc(1.2930417495vw + 2.7337049702rem), 4.5rem); --space-xl: clamp(4.2645336rem, calc(2.4706425447vw + 3.3751022839rem), 6.75rem); --space-xxl: clamp(5.6846232888rem, calc(4.4138933511vw + 4.0956216824rem), 10.125rem); --section-space-xs: clamp(2.7013505064rem, calc(1.2909040692vw + 2.2366250415rem), 4rem); --section-space-s: clamp(3.6009002251rem, calc(2.3847910288vw + 2.7423754547rem), 6rem); --section-space-m: clamp(4.8rem, calc(4.1749502982vw + 3.2970178926rem), 9rem); --section-space-l: clamp(6.3984rem, calc(7.0592445328vw + 3.8570719682rem), 13.5rem); --section-space-xl: clamp(8.5290672rem, calc(11.6510266402vw + 4.3346976095rem), 20.25rem); --section-space-xxl: clamp(11.3692465776rem, calc(18.8923990282vw + 4.5679829274rem), 30.375rem); --section-padding-x: clamp(2rem, calc(3.9761431412vw + 0.5685884692rem), 6rem); --gutter: clamp(2rem, calc(3.9761431412vw + 0.5685884692rem), 6rem); } } .contain { container-type: inline-size; } .contain > * { container-type: inline-size; } .gap--xs.gap--xs { gap: var(--space-xs); --row-gap: var(--space-xs); --col-gap: var(--space-xs); --grid-gap: var(--space-xs); } .gap--s.gap--s { gap: var(--space-s); --row-gap: var(--space-s); --col-gap: var(--space-s); --grid-gap: var(--space-s); } .gap--m.gap--m { gap: var(--space-m); --row-gap: var(--space-m); --col-gap: var(--space-m); --grid-gap: var(--space-m); } .gap--l.gap--l { gap: var(--space-l); --row-gap: var(--space-l); --col-gap: var(--space-l); --grid-gap: var(--space-l); } .gap--xl.gap--xl { gap: var(--space-xl); --row-gap: var(--space-xl); --col-gap: var(--space-xl); --grid-gap: var(--space-xl); } .gap--xxl.gap--xxl { gap: var(--space-xxl); --row-gap: var(--space-xxl); --col-gap: var(--space-xxl); --grid-gap: var(--space-xxl); } @media (max-width: 1366px) { .gap--xl-xs.gap--xl-xs { gap: var(--space-xs); --row-gap: var(--space-xs); --col-gap: var(--space-xs); --grid-gap: var(--space-xs); } .gap--xl-s.gap--xl-s { gap: var(--space-s); --row-gap: var(--space-s); --col-gap: var(--space-s); --grid-gap: var(--space-s); } .gap--xl-m.gap--xl-m { gap: var(--space-m); --row-gap: var(--space-m); --col-gap: var(--space-m); --grid-gap: var(--space-m); } .gap--xl-l.gap--xl-l { gap: var(--space-l); --row-gap: var(--space-l); --col-gap: var(--space-l); --grid-gap: var(--space-l); } .gap--xl-xl.gap--xl-xl { gap: var(--space-xl); --row-gap: var(--space-xl); --col-gap: var(--space-xl); --grid-gap: var(--space-xl); } .gap--xl-xxl.gap--xl-xxl { gap: var(--space-xxl); --row-gap: var(--space-xxl); --col-gap: var(--space-xxl); --grid-gap: var(--space-xxl); } } @media (max-width: 992px) { .gap--l-xs.gap--l-xs { gap: var(--space-xs); --row-gap: var(--space-xs); --col-gap: var(--space-xs); --grid-gap: var(--space-xs); } .gap--l-s.gap--l-s { gap: var(--space-s); --row-gap: var(--space-s); --col-gap: var(--space-s); --grid-gap: var(--space-s); } .gap--l-m.gap--l-m { gap: var(--space-m); --row-gap: var(--space-m); --col-gap: var(--space-m); --grid-gap: var(--space-m); } .gap--l-l.gap--l-l { gap: var(--space-l); --row-gap: var(--space-l); --col-gap: var(--space-l); --grid-gap: var(--space-l); } .gap--l-xl.gap--l-xl { gap: var(--space-xl); --row-gap: var(--space-xl); --col-gap: var(--space-xl); --grid-gap: var(--space-xl); } .gap--l-xxl.gap--l-xxl { gap: var(--space-xxl); --row-gap: var(--space-xxl); --col-gap: var(--space-xxl); --grid-gap: var(--space-xxl); } } @media (max-width: 768px) { .gap--m-xs.gap--m-xs { gap: var(--space-xs); --row-gap: var(--space-xs); --col-gap: var(--space-xs); --grid-gap: var(--space-xs); } .gap--m-s.gap--m-s { gap: var(--space-s); --row-gap: var(--space-s); --col-gap: var(--space-s); --grid-gap: var(--space-s); } .gap--m-m.gap--m-m { gap: var(--space-m); --row-gap: var(--space-m); --col-gap: var(--space-m); --grid-gap: var(--space-m); } .gap--m-l.gap--m-l { gap: var(--space-l); --row-gap: var(--space-l); --col-gap: var(--space-l); --grid-gap: var(--space-l); } .gap--m-xl.gap--m-xl { gap: var(--space-xl); --row-gap: var(--space-xl); --col-gap: var(--space-xl); --grid-gap: var(--space-xl); } .gap--m-xxl.gap--m-xxl { gap: var(--space-xxl); --row-gap: var(--space-xxl); --col-gap: var(--space-xxl); --grid-gap: var(--space-xxl); } } @media (max-width: 480px) { .gap--s-xs.gap--s-xs { gap: var(--space-xs); --row-gap: var(--space-xs); --col-gap: var(--space-xs); --grid-gap: var(--space-xs); } .gap--s-s.gap--s-s { gap: var(--space-s); --row-gap: var(--space-s); --col-gap: var(--space-s); --grid-gap: var(--space-s); } .gap--s-m.gap--s-m { gap: var(--space-m); --row-gap: var(--space-m); --col-gap: var(--space-m); --grid-gap: var(--space-m); } .gap--s-l.gap--s-l { gap: var(--space-l); --row-gap: var(--space-l); --col-gap: var(--space-l); --grid-gap: var(--space-l); } .gap--s-xl.gap--s-xl { gap: var(--space-xl); --row-gap: var(--space-xl); --col-gap: var(--space-xl); --grid-gap: var(--space-xl); } .gap--s-xxl.gap--s-xxl { gap: var(--space-xxl); --row-gap: var(--space-xxl); --col-gap: var(--space-xxl); --grid-gap: var(--space-xxl); } } .col-gap--xs.col-gap--xs { column-gap: var(--space-xs); --col-gap: var(--space-xs); } .col-gap--s.col-gap--s { column-gap: var(--space-s); --col-gap: var(--space-s); } .col-gap--m.col-gap--m { column-gap: var(--space-m); --col-gap: var(--space-m); } .col-gap--l.col-gap--l { column-gap: var(--space-l); --col-gap: var(--space-l); } .col-gap--xl.col-gap--xl { column-gap: var(--space-xl); --col-gap: var(--space-xl); } .col-gap--xxl.col-gap--xxl { column-gap: var(--space-xxl); --col-gap: var(--space-xxl); } @media (max-width: 1366px) { .col-gap--xl-xs.col-gap--xl-xs { column-gap: var(--space-xs); --col-gap: var(--space-xs); } .col-gap--xl-s.col-gap--xl-s { column-gap: var(--space-s); --col-gap: var(--space-s); } .col-gap--xl-m.col-gap--xl-m { column-gap: var(--space-m); --col-gap: var(--space-m); } .col-gap--xl-l.col-gap--xl-l { column-gap: var(--space-l); --col-gap: var(--space-l); } .col-gap--xl-xl.col-gap--xl-xl { column-gap: var(--space-xl); --col-gap: var(--space-xl); } .col-gap--xl-xxl.col-gap--xl-xxl { column-gap: var(--space-xxl); --col-gap: var(--space-xxl); } } @media (max-width: 992px) { .col-gap--l-xs.col-gap--l-xs { column-gap: var(--space-xs); --col-gap: var(--space-xs); } .col-gap--l-s.col-gap--l-s { column-gap: var(--space-s); --col-gap: var(--space-s); } .col-gap--l-m.col-gap--l-m { column-gap: var(--space-m); --col-gap: var(--space-m); } .col-gap--l-l.col-gap--l-l { column-gap: var(--space-l); --col-gap: var(--space-l); } .col-gap--l-xl.col-gap--l-xl { column-gap: var(--space-xl); --col-gap: var(--space-xl); } .col-gap--l-xxl.col-gap--l-xxl { column-gap: var(--space-xxl); --col-gap: var(--space-xxl); } } @media (max-width: 768px) { .col-gap--m-xs.col-gap--m-xs { column-gap: var(--space-xs); --col-gap: var(--space-xs); } .col-gap--m-s.col-gap--m-s { column-gap: var(--space-s); --col-gap: var(--space-s); } .col-gap--m-m.col-gap--m-m { column-gap: var(--space-m); --col-gap: var(--space-m); } .col-gap--m-l.col-gap--m-l { column-gap: var(--space-l); --col-gap: var(--space-l); } .col-gap--m-xl.col-gap--m-xl { column-gap: var(--space-xl); --col-gap: var(--space-xl); } .col-gap--m-xxl.col-gap--m-xxl { column-gap: var(--space-xxl); --col-gap: var(--space-xxl); } } @media (max-width: 480px) { .col-gap--s-xs.col-gap--s-xs { column-gap: var(--space-xs); --col-gap: var(--space-xs); } .col-gap--s-s.col-gap--s-s { column-gap: var(--space-s); --col-gap: var(--space-s); } .col-gap--s-m.col-gap--s-m { column-gap: var(--space-m); --col-gap: var(--space-m); } .col-gap--s-l.col-gap--s-l { column-gap: var(--space-l); --col-gap: var(--space-l); } .col-gap--s-xl.col-gap--s-xl { column-gap: var(--space-xl); --col-gap: var(--space-xl); } .col-gap--s-xxl.col-gap--s-xxl { column-gap: var(--space-xxl); --col-gap: var(--space-xxl); } } .row-gap--xs.row-gap--xs { row-gap: var(--space-xs); --row-gap: var(--space-xs); } .row-gap--s.row-gap--s { row-gap: var(--space-s); --row-gap: var(--space-s); } .row-gap--m.row-gap--m { row-gap: var(--space-m); --row-gap: var(--space-m); } .row-gap--l.row-gap--l { row-gap: var(--space-l); --row-gap: var(--space-l); } .row-gap--xl.row-gap--xl { row-gap: var(--space-xl); --row-gap: var(--space-xl); } .row-gap--xxl.row-gap--xxl { row-gap: var(--space-xxl); --row-gap: var(--space-xxl); } @media (max-width: 1366px) { .row-gap--xl-xs.row-gap--xl-xs { row-gap: var(--space-xs); --row-gap: var(--space-xs); } .row-gap--xl-s.row-gap--xl-s { row-gap: var(--space-s); --row-gap: var(--space-s); } .row-gap--xl-m.row-gap--xl-m { row-gap: var(--space-m); --row-gap: var(--space-m); } .row-gap--xl-l.row-gap--xl-l { row-gap: var(--space-l); --row-gap: var(--space-l); } .row-gap--xl-xl.row-gap--xl-xl { row-gap: var(--space-xl); --row-gap: var(--space-xl); } .row-gap--xl-xxl.row-gap--xl-xxl { row-gap: var(--space-xxl); --row-gap: var(--space-xxl); } } @media (max-width: 992px) { .row-gap--l-xs.row-gap--l-xs { row-gap: var(--space-xs); --row-gap: var(--space-xs); } .row-gap--l-s.row-gap--l-s { row-gap: var(--space-s); --row-gap: var(--space-s); } .row-gap--l-m.row-gap--l-m { row-gap: var(--space-m); --row-gap: var(--space-m); } .row-gap--l-l.row-gap--l-l { row-gap: var(--space-l); --row-gap: var(--space-l); } .row-gap--l-xl.row-gap--l-xl { row-gap: var(--space-xl); --row-gap: var(--space-xl); } .row-gap--l-xxl.row-gap--l-xxl { row-gap: var(--space-xxl); --row-gap: var(--space-xxl); } } @media (max-width: 768px) { .row-gap--m-xs.row-gap--m-xs { row-gap: var(--space-xs); --row-gap: var(--space-xs); } .row-gap--m-s.row-gap--m-s { row-gap: var(--space-s); --row-gap: var(--space-s); } .row-gap--m-m.row-gap--m-m { row-gap: var(--space-m); --row-gap: var(--space-m); } .row-gap--m-l.row-gap--m-l { row-gap: var(--space-l); --row-gap: var(--space-l); } .row-gap--m-xl.row-gap--m-xl { row-gap: var(--space-xl); --row-gap: var(--space-xl); } .row-gap--m-xxl.row-gap--m-xxl { row-gap: var(--space-xxl); --row-gap: var(--space-xxl); } } @media (max-width: 480px) { .row-gap--s-xs.row-gap--s-xs { row-gap: var(--space-xs); --row-gap: var(--space-xs); } .row-gap--s-s.row-gap--s-s { row-gap: var(--space-s); --row-gap: var(--space-s); } .row-gap--s-m.row-gap--s-m { row-gap: var(--space-m); --row-gap: var(--space-m); } .row-gap--s-l.row-gap--s-l { row-gap: var(--space-l); --row-gap: var(--space-l); } .row-gap--s-xl.row-gap--s-xl { row-gap: var(--space-xl); --row-gap: var(--space-xl); } .row-gap--s-xxl.row-gap--s-xxl { row-gap: var(--space-xxl); --row-gap: var(--space-xxl); } } .fr-container-gap, .container-gap { --row-gap: var(--container-gap); --col-gap: var(--container-gap); gap: var(--container-gap); } .fr-content-gap, .content-gap { --row-gap: var(--content-gap); --col-gap: var(--content-gap); gap: var(--content-gap); } .fr-grid-gap, .grid-gap { --row-gap: var(--grid-gap); --col-gap: var(--grid-gap); gap: var(--grid-gap); } .gap--none { --row-gap: 0; --col-gap: 0; gap: 0; } section:where(:not(.bricks-shape-divider)) { display: flex; flex-direction: column; align-items: center; gap: var(--container-gap); } section > div:where(:not(.bricks-shape-divider)) { display: flex; flex-direction: column; align-items: flex-start; gap: var(--content-gap); } :where(:where(.brxe-block)) { gap: var(--content-gap); } :where(:where(.brxe-div)) { gap: var(--content-gap); } section > div:where([class*="grid--"]), :where([class*="grid--"]) { gap: var(--grid-gap); } :root { --f-label-size: clamp(1.4rem, calc(0.1988071571vw + 1.3284294235rem), 1.6rem); --f-label-font-weight: 400; --f-label-line-height: 1; --f-label-padding-x: 0; --f-label-padding-y: 0; --f-label-margin-bottom: 0.5em; --f-label-text-transform: none; --f-label-inside-position-left: 1.5em; --f-label-inside-position-top: 0; --f-label-inside-scale: 1; --f-legend-text-weight: 600; --f-legend-size: clamp(1.4rem, calc(0.1988071571vw + 1.3284294235rem), 1.6rem); --f-legend-margin-bottom: 1em; --f-legend-border: none; --f-legend-line-height: 1.2; --f-help-text-weight: 400; --f-help-size: clamp(1.2rem, calc(0.1988071571vw + 1.1284294235rem), 1.4rem); --f-help-line-height: 1.4; --f-help-margin-block: 0.5em 0; --f-field-margin-bottom: 1.5em; --f-fieldset-margin-bottom: 1.5em; --f-grid-gutter: 2rem; --f-input-border-style: solid; --f-input-border-top-size: 0.1rem; --f-input-border-right-size: 0.1rem; --f-input-border-bottom-size: 0.1rem; --f-input-border-left-size: 0.1rem; --f-input-border-radius: var(--btn-radius); --f-input-size: clamp(1.4rem, calc(0.3976143141vw + 1.2568588469rem), 1.8rem); --f-input-font-weight: 400; --f-input-line-height: 1; --f-input-height: 5rem; --f-input-padding-x: 1em; --f-input-padding-y: 0.5em; --f-btn-border-style: solid; --f-btn-border-width: var(--btn-border-width); --f-btn-border-radius: var(--btn-radius); --f-btn-text-size: clamp(1.4rem, calc(0.3976143141vw + 1.2568588469rem), 1.8rem); --f-btn-font-weight: 400; --f-btn-line-height: 1; --f-btn-padding-y: 0.75em; --f-btn-padding-x: 1.5em; --f-btn-margin-top: 0; --f-btn-text-decoration: none; --f-btn-text-transform: none; --f-option-label-font-weight: 400; --f-option-label-size: clamp(1.4rem, calc(0.1988071571vw + 1.3284294235rem), 1.6rem); --f-option-label-spacing: 0.5em; --f-option-label-line-height: 1.4; --f-progress-height: 3rem; --f-progress-bar-radius: var(--btn-radius); --f-tab-border-size: 0; --f-tab-border-style: solid; --f-tab-border-radius: 0; --f-tab-text-size: clamp(1.6rem, calc(0.1988071571vw + 1.5284294235rem), 1.8rem); --f-tab-text-weight: 400; --f-tab-text-line-height: 1; --f-tab-text-align: center; --f-tab-text-transform: none; --f-tab-text-decoration: none; --f-tab-padding-y: 0.75em; --f-tab-padding-x: 1.5em; --f-tab-margin-x: 0; --f-tab-width: auto; --f-tab-active-border-bottom-size: 3px; --f-tab-active-text-weight: 600; --f-tab-active-border-size: 0; --f-tab-active-border-style: solid; --f-tab-group-padding-y: 0; --f-tab-group-padding-x: 0; --f-tab-group-border-bottom-size: 2px; --f-tab-group-border-bottom-style: solid; --f-tab-group-margin-bottom: 3rem; } .form--light form[data-wsf-style-id], .form--dark form[data-wsf-style-id] { --wsf-form-transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); --wsf-field-radio-size: calc(var(--f-option-label-size) * var(--f-option-label-line-height)); } .form--light form[data-wsf-style-id] { --wsf-field-color-background-hover: var(--white); --wsf-field-border-color-hover: var(--neutral-light); --wsf-field-color-hover: var(--neutral-dark); --wsf-field-color-placeholder-hover: var(--neutral-dark); --wsf-field-color-background-focus: var(--white); --wsf-field-checkbox-checked-color-background: var(--primary); --wsf-field-checkbox-checked-switch-color-background:var(--primary); --wsf-field-radio-checked-color: var(--primary); --wsf-field-radio-checked-switch-color-background: var(--primary); --wsf-field-radio-color-background: transparent; --wsf-field-border: 1px solid var(--neutral); --wsf-field-color-placeholder: hsl(0 0% 25% / 1); --wsf-field-button-primary-color-background-hover: var(--primary-hover); --wsf-field-button-primary-border-color-hover: var(--primary-hover); --wsf-field-button-primary-color: var(--primary-ultra-light); --wsf-field-button-primary-color-hover: var(--primary-ultra-light); --wsf-field-button-secondary-color-background: var(--neutral-light); --wsf-field-button-secondary-color-background-hover: var(--neutral-ultra-light); --wsf-field-button-secondary-border-color: var(--neutral-light); --wsf-field-button-secondary-border-color-hover: var(--neutral-ultra-light); --wsf-field-button-secondary-color: var(--neutral-ultra-dark); --wsf-field-button-secondary-color-hover: var(--neutral-ultra-dark); } .form--dark form[data-wsf-style-id] { --wsf-field-color-background-hover: var(--neutral-dark); --wsf-field-border-color-hover: var(--neutral-semi-dark); --wsf-field-color-hover: var(--neutral-ultra-light); --wsf-field-color-placeholder-hover: var(--neutral-ultra-light); --wsf-field-color-background-focus: var(--neutral-dark); --wsf-field-checkbox-checked-color-background: var(--primary); --wsf-field-checkbox-checked-switch-color-background:var(--primary); --wsf-field-radio-checked-color: var(--primary); --wsf-field-radio-checked-switch-color-background: var(--primary); --wsf-field-radio-color-background: transparent; --wsf-field-border: 1px solid var(--neutral); --wsf-field-color-placeholder: hsl(0 0% 97% / 0.5); --wsf-field-button-primary-color-background-hover: var(--primary-hover); --wsf-field-button-primary-border-color-hover: var(--primary-hover); --wsf-field-button-primary-color: var(--primary-ultra-light); --wsf-field-button-primary-color-hover: var(--primary-ultra-light); --wsf-field-button-secondary-color-background: var(--neutral-light); --wsf-field-button-secondary-color-background-hover: var(--neutral-ultra-light); --wsf-field-button-secondary-border-color: var(--neutral-light); --wsf-field-button-secondary-border-color-hover: var(--neutral-ultra-light); --wsf-field-button-secondary-color: var(--neutral-ultra-dark); --wsf-field-button-secondary-color-hover: var(--neutral-ultra-dark); } .form--dark .wsf-form input[type="date"].wsf-field, .form--dark .wsf-form input[type="datetime-local"].wsf-field, .form--dark .wsf-form input[type="file"].wsf-field, .form--dark .wsf-form input[type="month"].wsf-field, .form--dark .wsf-form input[type="password"].wsf-field, .form--dark .wsf-form input[type="search"].wsf-field, .form--dark .wsf-form input[type="time"].wsf-field, .form--dark .wsf-form input[type="week"].wsf-field, .form--dark .wsf-form input[type="email"].wsf-field, .form--dark .wsf-form input[type="number"].wsf-field, .form--dark .wsf-form input[type="tel"].wsf-field, .form--dark .wsf-form input[type="text"].wsf-field, .form--dark .wsf-form input[type="url"].wsf-field, .form--dark .wsf-form select.wsf-field:not([multiple]):not([size]), .form--dark .wsf-form select.wsf-field ~ .select2-container .select2-selection { height: var(--f-input-height, 5rem); } .form--dark .wsf-form input[type="date"].wsf-field, .form--dark .wsf-form input[type="datetime-local"].wsf-field, .form--dark .wsf-form input[type="file"].wsf-field, .form--dark .wsf-form input[type="month"].wsf-field, .form--dark .wsf-form input[type="password"].wsf-field, .form--dark .wsf-form input[type="search"].wsf-field, .form--dark .wsf-form input[type="time"].wsf-field, .form--dark .wsf-form input[type="week"].wsf-field, .form--dark .wsf-form input[type="email"].wsf-field, .form--dark .wsf-form input[type="number"].wsf-field, .form--dark .wsf-form input[type="tel"].wsf-field, .form--dark .wsf-form input[type="text"].wsf-field, .form--dark .wsf-form input[type="url"].wsf-field, .form--dark .wsf-form select.wsf-field, .form--dark .wsf-form select.wsf-field:not([multiple]):not([size]), .form--dark .wsf-form select.wsf-field ~ .select2-container .select2-selection, .form--dark .wsf-form textarea.wsf-field { background-color: var(--f-dark-input-background, var(--neutral-dark)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-dark-input-border-color, var(--neutral-medium)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--dark .wsf-form input[type="date"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="date"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="datetime-local"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="datetime-local"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="file"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="file"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="month"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="month"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="password"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="password"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="search"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="search"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="time"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="time"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="week"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="week"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="email"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="email"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="number"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="number"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="tel"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="tel"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="text"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="text"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form input[type="url"].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="url"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form select.wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form select.wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form select.wsf-field:not([multiple]):not([size]):hover:not([data-wsf-legal]), .form--dark .wsf-form select.wsf-field:not([multiple]):not([size]):hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form select.wsf-field ~ .select2-container .select2-selection:hover:not([data-wsf-legal]), .form--dark .wsf-form select.wsf-field ~ .select2-container .select2-selection:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .wsf-form textarea.wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form textarea.wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-dark-input-color-background-hover, var(--neutral-dark)); border-color: var(--f-dark-input-border-color-hover, var(--neutral-semi-dark)); color: var(--f-dark-input-text-color-hover, var(--neutral-ultra-light)); } .form--dark .wsf-form .wsf-grid { margin-inline: calc(-1 * calc(var(--f-grid-gutter, 2rem) / 2)); } .form--dark .wsf-form [data-type="texteditor"] { color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); } .form--dark .wsf-form [data-type="texteditor"] * + :is(h1, h2, h3, h4, h5, h6) { margin-block-start: var(--heading-spacing); } .form--dark .wsf-form [data-type="texteditor"] * + p { margin-block-start: var(--paragraph-spacing); } .form--dark .wsf-form [data-type="texteditor"] * + ul, .form--dark .wsf-form [data-type="texteditor"] * + ol { margin-block-start: var(--list-spacing); } .form--dark .wsf-form [data-type="texteditor"] * + li { margin-block-start: var(--list-item-spacing); } .form--dark .wsf-form [data-type="html"] { color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); } .form--dark .wsf-form select.wsf-field:not([multiple]):not([size]) { padding-inline-end: calc(20px + var(--f-input-padding-x, 1em)); } .form--dark .wsf-form select.wsf-field:not([multiple]):not([size]):not(:has(+ span)) { background-image: linear-gradient(45deg, transparent 50%, var(--f-dark-select-arrow-color, var(--neutral-ultra-light)) 0), linear-gradient(135deg, var(--f-dark-select-arrow-color, var(--neutral-ultra-light)) 50%, transparent 0); background-position: calc(100% - 20px) calc(50% + 2px), calc(100% - 16px) calc(50% + 2px); background-repeat: no-repeat; background-size: 4px 4px, 4px 4px; } .form--dark .wsf-form select.wsf-field:invalid { color: hsl(var(--f-dark-input-placeholder-hsl, 0 0% 97%) / var(--f-dark-input-placeholder-opacity, 0.5)) !important; } .form--dark .wsf-form select.wsf-field:not([multiple]):not([size]):not([data-wsf-select2]) + span.wsf-select-arrow { border-color: var(--f-dark-select-arrow-color, var(--neutral-ultra-light)) transparent transparent transparent; right: calc(20px + var(--f-input-padding-x, 1em)); } .form--dark .wsf-form select.wsf-field ~ .select2-container .select2-selection--single .select2-selection__rendered, .form--dark .wsf-form select.wsf-field ~ .select2-container .select2-selection--single .select2-selection__placeholder, .form--dark .wsf-form select.wsf-field ~ .select2-container .select2-selection .select2-search--inline .select2-search__field, .form--dark .wsf-form select.wsf-field ~ .select2-container .select2-selection input.select2-search__field::placeholder { color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); } .form--dark .wsf-form .wsf-select2-dropdown .select2-results .select2-results__option { border-top: 1px solid var(--f-dark-input-border-color, var(--neutral-medium)); font-size: var(--f-input-size, --text-m); } .form--dark .wsf-form .wsf-select2-dropdown .select2-results .select2-results__option--highlighted[aria-selected] { background-color: var(--f-dark-input-background, var(--neutral-dark)); color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); } .form--dark .wsf-form.wsf-validated select.wsf-field:not([multiple]):not([size]):invalid, .form--dark .wsf-form.wsf-validated input[type="date"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="datetime-local"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="file"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="month"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="password"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="search"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="time"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="week"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="email"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="number"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="tel"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="text"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated input[type="url"].wsf-field:invalid, .form--dark .wsf-form.wsf-validated select.wsf-field:invalid, .form--dark .wsf-form.wsf-validated textarea.wsf-field:invalid { border-color: hsl(var(--danger-h, 354), var(--danger-s, 70%), var(--danger-l, 54%)); color: hsl(var(--danger-h, 354), var(--danger-s, 70%), var(--danger-l, 54%)); } .form--dark .wsf-form .wsf-invalid-feedback { color: hsl(var(--danger-h, 354), var(--danger-s, 70%), var(--danger-l, 54%)); } .form--dark .wsf-form .iti--allow-dropdown input, .form--dark .wsf-form .iti--allow-dropdown input[type="tel"], .form--dark .wsf-form .iti--allow-dropdown input[type="text"], .form--dark .wsf-form .iti--separate-dial-code input, .form--dark .wsf-form .iti--separate-dial-code input[type="tel"], .form--dark .wsf-form .iti--separate-dial-code input[type="text"] { padding-inline-start: calc(4.8rem + 6px); } .form--dark .wsf-form input.wsf-field::placeholder, .form--dark .wsf-form textarea.wsf-field::placeholder { color: var(--f-dark-input-placeholder-color, var(--neutral-ultra-light)); opacity: var(--f-dark-input-placeholder-opacity, 0.5); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--dark .wsf-form input.wsf-field:hover::placeholder, .form--dark .wsf-form textarea.wsf-field:hover::placeholder { color: var(--f-dark-input-placeholder-color-hover, var(--neutral-ultra-light)); } .form--dark .wsf-form label.wsf-label, .form--dark .wsf-form label { background-color: var(--f-dark-label-background-color, transparent); color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); margin-block-end: var(--f-label-margin-bottom, 0.5em); text-transform: var(--f-label-text-transform, none); padding: var(--f-label-padding-y, 0) var(--f-label-padding-x, 0); } .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder] + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder] + .wsf-input-group-append + label { background-color: var(--f-dark-label-background-color, transparent); color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); margin-block-end: var(--f-label-margin-bottom, 0.5em); text-transform: var(--f-label-text-transform, none); padding: var(--f-label-padding-y, 0) var(--f-label-padding-x, 0); top: calc(var(--f-input-height, 5rem) / 2); transform: translateY(-50%); transition: all 0.3s ease; background-color: var(--f-dark-label-inside-background-color, transparent); left: calc(calc(var(--f-grid-gutter, 2rem) / 2) + var(--f-input-padding-x, 1em)); } .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:hover:placeholder-shown:not(:focus) + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:hover:not(:focus):placeholder-shown + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:hover:placeholder-shown:not(:focus) + .wsf-input-group-append + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:hover:not(:focus):placeholder-shown + .wsf-input-group-append + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:hover:placeholder-shown:not(:focus) + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:hover:not(:focus):placeholder-shown + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:hover:placeholder-shown:not(:focus) + .wsf-input-group-append + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:hover:not(:focus):placeholder-shown + .wsf-input-group-append + label { color: var(--f-dark-input-placeholder-color-hover, var(--neutral-ultra-light)); } .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder] + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder] + .wsf-input-group-append + label { background-color: var(--f-dark-label-background-color, transparent); color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); margin-block-end: var(--f-label-margin-bottom, 0.5em); text-transform: var(--f-label-text-transform, none); padding: var(--f-label-padding-y, 0) var(--f-label-padding-x, 0); top: calc(var(--f-input-height, 5rem) / 2); transform: translateY(-50%); transition: all 0.3s ease; background-color: var(--f-dark-label-inside-background-color, transparent); left: calc(calc(var(--f-grid-gutter, 2rem) / 2) + 1em); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder] + label:hover, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder] + .wsf-input-group-append + label:hover { color: var(--f-dark-input-placeholder-color-hover, var(--neutral-ultra-light)); } .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:focus + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:not(:placeholder-shown) + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:focus + .wsf-input-group-append + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:not(:placeholder-shown) + .wsf-input-group-append + label { top: var(--f-label-inside-position-top, 0); left: var(--f-label-inside-position-left, 1.5em); scale: var(--f-label-inside-scale, 1); background-color: var(--f-dark-label-inside-background-color-focus, transparent); } .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:focus + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:focus + .wsf-input-group-append + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:not(:placeholder-shown) + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:not(:placeholder-shown) + .wsf-input-group-append + label { top: var(--f-label-inside-position-top, 0); left: var(--f-label-inside-position-left, 1.5em); scale: var(--f-label-inside-scale, 1); background-color: var(--f-dark-label-inside-background-color-focus, transparent); } .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:placeholder-shown + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:placeholder-shown + .wsf-input-group-append + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:placeholder-shown + label { opacity: var(--f-dark-input-placeholder-opacity, 0.5); } .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:focus:placeholder-shown + label, .form--dark .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:focus:placeholder-shown + .wsf-input-group-append + label, .form--dark .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:focus:placeholder-shown + label { background-color: var(--f-dark-label-inside-background-color-focus, transparent); opacity: 1; } .form--dark .wsf-form .wsf-label-position-inside .iti--allow-dropdown input + label, .form--dark .wsf-form .wsf-label-position-inside .iti--allow-dropdown input[type="tel"] + label, .form--dark .wsf-form .wsf-label-position-inside .iti--allow-dropdown input[type="text"] + label, .form--dark .wsf-form .wsf-label-position-inside .iti--separate-dial-code input + label, .form--dark .wsf-form .wsf-label-position-inside .iti--separate-dial-code input[type="tel"] + label, .form--dark .wsf-form .wsf-label-position-inside .iti--separate-dial-code input[type="text"] + label { left: calc(4.8rem + var(--f-input-padding-x, 1em)); } .form--dark .wsf-form .wsf-label-position-inside .iti input.wsf-field[placeholder]:focus + label { background-color: var(--f-dark-label-inside-background-color, transparent); opacity: 1; transform: translate(0px, -50%) scale(0.9); top: 0; left: calc(4.8rem + var(--f-input-padding-x, 1em)); } .form--dark .wsf-form .wsf-label-position-inside select.wsf-field + label { background-color: var(--f-dark-label-inside-background-color, transparent); } .form--dark .wsf-form button.wsf-button, .form--dark .wsf-form button.wsf-button.wsf-button-primary { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form button.wsf-button:hover, .form--dark .wsf-form button.wsf-button.wsf-button-primary:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form button.wsf-button:focus, .form--dark .wsf-form button.wsf-button.wsf-button-primary:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form button.wsf-button.wsf-button-secondary { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form button.wsf-button.wsf-button-secondary:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form button.wsf-button.wsf-button-secondary:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form button.wsf-button[data-action="wsf-tab_next"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form button.wsf-button[data-action="wsf-tab_next"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form button.wsf-button[data-action="wsf-tab_next"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form button.wsf-button[data-action="wsf-tab_previous"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form button.wsf-button[data-action="wsf-tab_previous"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form button.wsf-button[data-action="wsf-tab_previous"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form button.wsf-button[data-action="wsf-save"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form button.wsf-button[data-action="wsf-save"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form button.wsf-button[data-action="wsf-save"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form button.wsf-button[data-action="wsf-reset"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--neutral); --btn-background-hover: var(--neutral-dark); --btn-text-color: var(--neutral-ultra-light); --btn-text-color-hover: var(--neutral-ultra-light); --btn-border-color: var(--neutral); --btn-border-color-hover: var(--neutral-dark); --focus-color: var(--primary); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form button.wsf-button[data-action="wsf-reset"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form button.wsf-button[data-action="wsf-reset"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form button.wsf-button[data-action="wsf-clear"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--neutral); --btn-background-hover: var(--neutral-dark); --btn-text-color: var(--neutral-ultra-light); --btn-text-color-hover: var(--neutral-ultra-light); --btn-border-color: var(--neutral); --btn-border-color-hover: var(--neutral-dark); --focus-color: var(--primary); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form button.wsf-button[data-action="wsf-clear"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form button.wsf-button[data-action="wsf-clear"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form ul.wsf-group-tabs { background-color: var(--f-dark-tab-group-background-color, transparent); padding: var(--f-tab-group-padding-y, 0) var(--f-tab-group-padding-x, 0); margin-block-end: var(--f-tab-group-margin-bottom, 3rem); } .form--dark .wsf-form ul.wsf-group-tabs:not(.wsf-steps) { border-block-end: var(--f-tab-group-border-bottom-size, 2px) var(--f-tab-group-border-bottom-style, solid) var(--f-dark-tab-group-border-bottom-color, var(--neutral-ultra-light)) !important; } .form--dark .wsf-form ul.wsf-group-tabs > li { width: var(--f-tab-width, auto); } .form--dark .wsf-form ul.wsf-group-tabs > li:not(:last-child) { margin-inline-end: var(--f-tab-margin-x, 0); } .form--dark .wsf-form ul.wsf-group-tabs > li > a { border: var(--f-tab-border-size, 0) var(--f-tab-border-style, solid) var(--f-dark-tab-border-color, var(--primary)) !important; border-radius: var(--f-tab-border-radius, 0); background-color: var(--f-dark-tab-background-color, transparent); color: var(--f-dark-tab-text-color, var(--neutral-dark)); font-size: var(--f-tab-text-size, --text-m); font-weight: var(--f-tab-text-weight, 400); line-height: var(--f-tab-text-line-height, 1); padding: var(--f-tab-padding-y, 0.75em) var(--f-tab-padding-x, 1.5em); text-align: var(--f-tab-text-align, center); text-decoration: var(--f-tab-text-decoration, none); text-transform: var(--f-tab-text-transform, none); } .form--dark .wsf-form ul.wsf-group-tabs > li > a.wsf-tab-disabled { color: var(--f-dark-tab-inactive-text-color, var(--neutral-light-trans-80)); } .form--dark .wsf-form ul.wsf-group-tabs > li.wsf-tab-active > a { border: var(--f-tab-active-border-size, 0) var(--f-tab-active-border-style, solid) var(--f-dark-tab-active-border-color, var(--primary)) !important; border-block-end: var(--f-tab-active-border-bottom-size, 3px) var(--f-tab-active-border-style, solid) var(--f-dark-tab-active-border-color, var(--primary)) !important; background-color: var(--f-dark-tab-active-background-color, transparent) !important; color: var(--f-dark-tab-active-text-color, var(--neutral-light)) !important; font-weight: var(--f-tab-active-text-weight, 600); } .form--dark .wsf-form ul.wsf-group-tabs > li.wsf-tab-active > a::before { color: var(--f-dark-tab-active-text-color, var(--neutral-light)) !important; } .form--dark .wsf-form ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active > a { border-block-end: none !important; } .form--dark .wsf-form ul.wsf-group-tabs.wsf-steps > li > a::before { background-color: var(--f-dark-tab-active-border-color, var(--primary)); border: 1px solid var(--f-dark-tab-active-border-color, var(--primary)); } .form--dark .wsf-form ul.wsf-group-tabs.wsf-steps > li > a::after { background-color: var(--f-dark-tab-active-border-color, var(--primary)); } .form--dark .wsf-form ul.wsf-group-tabs.wsf-steps > li > a:not(.wsf-tab-disabled):focus:before { border-color: var(--f-dark-tab-active-border-color, var(--primary)); } .form--dark .wsf-form .wsf-section > legend, .form--dark .wsf-form .wsf-fieldset > legend { border: var(--f-legend-border, none); font-size: var(--f-legend-size, --text-m); font-weight: var(--f-legend-text-weight, 600); line-height: var(--f-legend-line-height, 1.2); margin-block-end: var(--f-legend-margin-bottom, 1em); color: var(--f-dark-legend-text-color, var(--neutral-ultra-light)); padding: 0; } .form--dark .wsf-form .wsf-help { font-size: var(--f-help-size, --text-m); font-weight: var(--f-help-text-weight, 400); line-height: var(--f-help-line-height, 1.4); color: var(--f-dark-help-text-color, var(--neutral-light)); margin-block: var(--f-help-margin-block, 0.5em 0); } .form--dark .wsf-form .wsf-help-pre { margin-block: var(--f-help-margin-block, 0.5em 0); } .form--dark .wsf-form .wsf-field-wrapper:not(.wsf-alert) { margin-block-end: var(--f-field-margin-bottom, 1.5em); } .form--dark .wsf-form fieldset:not(:last-child) { margin-block-end: var(--f-fieldset-margin-bottom, 1.5em); } .form--dark .wsf-form .wsf-tile { padding-inline: calc(var(--f-grid-gutter, 2rem) / 2); } .form--dark .wsf-form input[type="radio"].wsf-field + label.wsf-label { background-color: var(--f-dark-option-background-color, transparent); display: inline-block; color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); font-family: inherit; font-size: var(--f-option-label-size, --text-m); font-weight: var(--f-option-label-font-weight, 400); line-height: var(--f-option-label-line-height, 1.4); margin: 0 0 10px; -webkit-padding-start: 1.75em; padding-inline-start: 1.75em; background-color: unset; margin: 0; } .form--dark .wsf-form input[type="radio"].wsf-field:checked + label.wsf-label:before { background-color: var(--f-dark-option-action-color, var(--primary)); border-color: var(--f-dark-option-border-color, var(--neutral)); } .form--dark .wsf-form input[type="radio"].wsf-field + label.wsf-label:before { background-color: var(--f-dark-option-background-color, transparent); border-color: var(--f-dark-option-border-color, var(--neutral)); } .form--dark .wsf-form input[type="radio"].wsf-image + label.wsf-label { padding-inline-start: 0; } .form--dark .wsf-form [data-type="radio"] > div:not(.wsf-grid) > div + div, .form--dark .wsf-form [data-type="price_radio"] > div:not(.wsf-grid) > div + div, .form--dark .wsf-form [data-type="radio"] fieldset > div:not(.wsf-grid) > div + div, .form--dark .wsf-form [data-type="price_radio"] fieldset > div:not(.wsf-grid) > div + div { margin-block-start: var(--f-option-label-spacing, 0.5em); } .form--dark .wsf-form [data-type="radio"] > div.wsf-grid, .form--dark .wsf-form [data-type="price_radio"] > div.wsf-grid, .form--dark .wsf-form [data-type="radio"] fieldset > div.wsf-grid, .form--dark .wsf-form [data-type="price_radio"] fieldset > div.wsf-grid { row-gap: var(--f-option-label-spacing); } .form--dark .wsf-form input[type="checkbox"].wsf-field + label.wsf-label::before, .form--dark .wsf-form input[type="checkbox"].wsf-field + label.wsf-label::after { width: 1.4em; height: 1.4em; transform: none; } .form--dark .wsf-form input[type="checkbox"].wsf-field:checked + label.wsf-label::before { background-color: var(--f-dark-option-action-color, var(--primary)); border-color: var(--f-dark-option-border-color, var(--neutral)); } .form--dark .wsf-form input[type="checkbox"].wsf-field + label.wsf-label::before { background-color: var(--f-dark-option-background-color, transparent); border-color: var(--f-dark-option-border-color, var(--neutral)); } .form--dark .wsf-form input[type="checkbox"].wsf-field + label.wsf-label { background-color: var(--f-dark-option-background-color, transparent); display: inline-block; color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); font-family: inherit; font-size: var(--f-option-label-size, --text-m); font-weight: var(--f-option-label-font-weight, 400); line-height: var(--f-option-label-line-height, 1.4); margin: 0 0 10px; -webkit-padding-start: 1.75em; padding-inline-start: 1.75em; background-color: unset; margin: 0; } .form--dark .wsf-form [data-type="checkbox"] > div:not(.wsf-grid) > div + div, .form--dark .wsf-form [data-type="price_checkbox"] > div:not(.wsf-grid) > div + div, .form--dark .wsf-form [data-type="checkbox"] fieldset > div:not(.wsf-grid) > div + div, .form--dark .wsf-form [data-type="price_checkbox"] fieldset > div:not(.wsf-grid) > div + div { margin-block-start: var(--f-option-label-spacing, 0.5em); } .form--dark .wsf-form [data-type="checkbox"] > div.wsf-grid, .form--dark .wsf-form [data-type="price_checkbox"] > div.wsf-grid, .form--dark .wsf-form [data-type="checkbox"] fieldset > div.wsf-grid, .form--dark .wsf-form [data-type="price_checkbox"] fieldset > div.wsf-grid { row-gap: var(--f-option-label-spacing); } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-switch + label.wsf-label, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-switch + label.wsf-label { -webkit-padding-start: 2.85em; padding-inline-start: 2.85em; } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-switch + label.wsf-label:before, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-switch + label.wsf-label:before { width: 2.5em; height: 1.4em; border-radius: 1.2em; } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-switch + label.wsf-label:after, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-switch + label.wsf-label:after { height: calc(1.4em - 4px); width: calc(1.4em - 4px); } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-switch:checked + label.wsf-label:after, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-switch:checked + label.wsf-label:after { left: calc(2.5em - calc(1.4em - 2px)); } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-image + label.wsf-label, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-image + label.wsf-label { -webkit-padding-start: 0; padding-inline-start: 0; } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-button + label.wsf-label, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-button + label.wsf-label { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-button + label.wsf-label:hover, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-button + label.wsf-label:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-button + label.wsf-label:focus, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-button + label.wsf-label:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-button:checked + label.wsf-label, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-button:checked + label.wsf-label { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary-ultra-light); --btn-background-hover: var(--primary-light); --btn-text-color: var(--primary); --btn-text-color-hover: var(--primary-ultra-dark); --btn-border-color: var(--primary-ultra-light); --btn-border-color-hover: var(--primary-light); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-button:checked + label.wsf-label:hover, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-button:checked + label.wsf-label:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .wsf-form input[type="checkbox"].wsf-field.wsf-button:checked + label.wsf-label:focus, .form--dark .wsf-form input[type="radio"].wsf-field.wsf-button:checked + label.wsf-label:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .wsf-form progress[value]::-webkit-progress-bar { background-color: var(--f-dark-progress-background-color, var(--base-ultra-light)); height: var(--f-progress-height, 3rem); display: block; } .form--dark .wsf-form progress.wsf-progress { height: var(--f-progress-height, 3rem); border-radius: var(--f-progress-bar-radius, var(--btn-radius)); overflow: hidden; } .form--dark .wsf-form progress[value]::-webkit-progress-value { background-color: var(--f-dark-progress-bar-fill-color, var(--primary)); border-radius: var(--f-progress-bar-radius, var(--btn-radius)); } .form--dark .wsf-form .minicolors-theme-ws-form .minicolors-swatch { height: calc(100% - 1px); } .form--dark .wsf-form input[type="range"] { -webkit-appearance: none;  appearance: none; width: 100%;  background: transparent;  --wsf-color-lower-track: var(--f-dark-range-left-track-color, var(--neutral-medium)); --wsf-color-upper-track: var(--f-dark-range-right-track-color, var(--neutral-medium)); background-color: var(--f-dark-range-background-color, var(--neutral-semi-dark)); } .form--dark .wsf-form input[type="range"]::-moz-range-track { -webkit-appearance: none;  appearance: none; width: 100%;  background: transparent;  --wsf-color-lower-track: var(--f-dark-range-left-track-color, var(--neutral-medium)); --wsf-color-upper-track: var(--f-dark-range-right-track-color, var(--neutral-medium)); background-color: var(--f-dark-range-background-color, var(--neutral-semi-dark)); } .form--dark .wsf-form input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; background-color: var(--f-dark-range-thumb-color, var(--primary)); } .form--dark .wsf-form input[type="range"]::-moz-range-thumb { -webkit-appearance: none; appearance: none; background-color: var(--f-dark-range-thumb-color, var(--primary)); } .form--dark .wsf-form input[type="range"]:focus { outline: none;  } .form--dark .wsf-form input[type="range"]::-ms-track { width: 100%; cursor: pointer;  background: transparent; border-color: transparent; color: transparent; } .form--dark .wsf-form .wsf-required-wrapper .wsf-text-danger { color: var(--f-dark-required-color, var(--action)); } .form--dark .wsf-form input[type="text"].wsf-field ~ .dropzone { background-color: var(--f-dark-input-background, var(--neutral-dark)); border-color: var(--f-dark-input-border-color, var(--neutral-medium)); } .form--dark .wsf-form input[type="text"].wsf-field ~ .dropzone .dz-message { color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); } .form--dark .wsf-form input[type="file"].wsf-field { padding-inline-start: 1rem; } .form--dark .wsf-form input[type="file"].wsf-field::file-selector-button { background: var(--f-dark-upload-btn-background-color, var(--neutral-light)) !important; color: var(--f-dark-upload-btn-text-color, var(--neutral-ultra-dark)); height: var(--f-input-height, 5rem); position: relative; top: -1px; transition: all var(--btn-transition-duration) ease; } .form--dark .wsf-form input[type="file"].wsf-field::file-selector-button:hover { background: var(--f-dark-upload-btn-background-color-hover, var(--neutral-ultra-light)) !important; color: var(--f-dark-upload-btn-text-color-hover, var(--neutral-ultra-dark)); } .form--dark .wsf-form [data-wsf-legal].wsf-field { background-color: var(--f-dark-input-background, var(--neutral-dark)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-dark-input-border-color, var(--neutral-medium)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--dark .wsf-form [data-wsf-legal].wsf-field:hover:not([data-wsf-legal]), .form--dark .wsf-form [data-wsf-legal].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-dark-input-color-background-hover, var(--neutral-dark)); border-color: var(--f-dark-input-border-color-hover, var(--neutral-semi-dark)); color: var(--f-dark-input-text-color-hover, var(--neutral-ultra-light)); } .form--dark .wsf-form .wsf-alert { background-color: var(--f-dark-input-background, var(--neutral-dark)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-dark-input-border-color, var(--neutral-medium)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); background-color: var(--base-ultra-light); border-left-width: 0.4rem; margin-block-end: 0; display: inline-block; } .form--dark .wsf-form .wsf-alert:hover:not([data-wsf-legal]), .form--dark .wsf-form .wsf-alert:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-dark-input-color-background-hover, var(--neutral-dark)); border-color: var(--f-dark-input-border-color-hover, var(--neutral-semi-dark)); color: var(--f-dark-input-text-color-hover, var(--neutral-ultra-light)); } .form--dark .wsf-form .wsf-alert.wsf-alert-danger { background-color: hsl(var(--danger-light-h, 354), var(--danger-light-s, 70%), var(--danger-light-l, 85%)); border-color: #DC3545; color: hsl(var(--danger-dark-h, 354), var(--danger-dark-s, 70%), var(--danger-dark-l, 15%)); } .form--dark .wsf-form .wsf-alert.wsf-alert-warning { background-color: hsl(var(--warning-light-h, 45), var(--warning-light-s, 100%), var(--warning-light-l, 85%)); border-color: #FFC10A; color: hsl(var(--warning-dark-h, 45), var(--warning-dark-s, 100%), var(--warning-dark-l, 15%)); } .form--dark .wsf-form .wsf-alert.wsf-alert-information { background-color: hsl(var(--info-light-h, 188), var(--info-light-s, 77%), var(--info-light-l, 85%)); border-color: var(--info-hex, #18A2B8); color: hsl(var(--info-dark-h, 188), var(--info-dark-s, 77%), var(--info-dark-l, 15%)); } .form--dark .wsf-form .wsf-alert.wsf-alert-success { background-color: hsl(var(--success-light-h, 133), var(--success-light-s, 61%), var(--success-light-l, 85%)); border-color: var(--success-hex, #29A745); color: hsl(var(--success-dark-h, 133), var(--success-dark-s, 61%), var(--success-dark-l, 15%)); } .form--dark .wsf-form .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, .form--dark .wsf-form .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current, .form--dark .wsf-form .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current, .form--dark .wsf-form .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover, .form--dark .wsf-form .xdsoft_datetimepicker .xdsoft_calendar td:hover, .form--dark .wsf-form .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover { background: var(--primary) !important; } .form--dark .wsf-form input[type="text"].wsf-field ~ canvas { background-color: var(--f-dark-input-background, var(--neutral-dark)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-dark-input-border-color, var(--neutral-medium)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); padding: 0; height: auto; background: none; } .form--dark .wsf-form input[type="text"].wsf-field ~ canvas:hover:not([data-wsf-legal]), .form--dark .wsf-form input[type="text"].wsf-field ~ canvas:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-dark-input-color-background-hover, var(--neutral-dark)); border-color: var(--f-dark-input-border-color-hover, var(--neutral-semi-dark)); color: var(--f-dark-input-text-color-hover, var(--neutral-ultra-light)); } .form--dark .wsf-form input[type="date"].wsf-field:focus, .form--dark .wsf-form input[type="datetime-local"].wsf-field:focus, .form--dark .wsf-form input[type="file"].wsf-field:focus, .form--dark .wsf-form input[type="month"].wsf-field:focus, .form--dark .wsf-form input[type="password"].wsf-field:focus, .form--dark .wsf-form input[type="search"].wsf-field:focus, .form--dark .wsf-form input[type="time"].wsf-field:focus, .form--dark .wsf-form input[type="week"].wsf-field:focus, .form--dark .wsf-form input[type="email"].wsf-field:focus, .form--dark .wsf-form input[type="number"].wsf-field:focus, .form--dark .wsf-form input[type="tel"].wsf-field:focus, .form--dark .wsf-form input[type="text"].wsf-field:focus, .form--dark .wsf-form input[type="url"].wsf-field:focus, .form--dark .wsf-form select.wsf-field:focus, .form--dark .wsf-form select.wsf-field ~ .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--single, .form--dark .wsf-form select.wsf-field ~ .select2-container--default.select2-container--focus:not(.select2-container--disabled) .select2-selection--multiple, .form--dark .wsf-form textarea.wsf-field:focus, .form--dark .wsf-form button.wsf-button:focus, .form--dark .wsf-form button.wsf-button.wsf-button-primary:focus { border-color: var(--f-dark-focus-color, var(--primary)); box-shadow: 0 0 0 4px hsl(var(--f-dark-focus-hsl, 213 93% 12%) / var(--f-dark-focus-color-opacity, 0.25)); outline: 0; } .form--dark input[type="date"], .form--dark input[type="datetime-local"], .form--dark input[type="month"], .form--dark input[type="password"], .form--dark input[type="search"], .form--dark input[type="time"], .form--dark input[type="week"], .form--dark input[type="email"], .form--dark input[type="number"], .form--dark input[type="tel"], .form--dark input[type="text"], .form--dark input[type="url"], .form--dark select:not([multiple]):not([size]), .form--dark .bricks-search-form input[type="date"], .form--dark .bricks-search-form input[type="datetime-local"], .form--dark .bricks-search-form input[type="month"], .form--dark .bricks-search-form input[type="password"], .form--dark .bricks-search-form input[type="search"], .form--dark .bricks-search-form input[type="time"], .form--dark .bricks-search-form input[type="week"], .form--dark .bricks-search-form input[type="email"], .form--dark .bricks-search-form input[type="number"], .form--dark .bricks-search-form input[type="tel"], .form--dark .bricks-search-form input[type="text"], .form--dark .bricks-search-form input[type="url"], .form--dark .bricks-search-form select:not([multiple]):not([size]), .form--dark .brxe-post-comments input[type="date"], .form--dark .brxe-post-comments input[type="datetime-local"], .form--dark .brxe-post-comments input[type="month"], .form--dark .brxe-post-comments input[type="password"], .form--dark .brxe-post-comments input[type="search"], .form--dark .brxe-post-comments input[type="time"], .form--dark .brxe-post-comments input[type="week"], .form--dark .brxe-post-comments input[type="email"], .form--dark .brxe-post-comments input[type="number"], .form--dark .brxe-post-comments input[type="tel"], .form--dark .brxe-post-comments input[type="text"], .form--dark .brxe-post-comments input[type="url"], .form--dark .brxe-post-comments select:not([multiple]):not([size]) { height: var(--f-input-height, 5rem); } .form--dark .input, .form--dark input:not([type="submit"]), .form--dark select, .form--dark textarea, .form--dark .bricks-search-form .input, .form--dark .bricks-search-form input:not([type="submit"]), .form--dark .bricks-search-form select, .form--dark .bricks-search-form textarea, .form--dark .brxe-post-comments .input, .form--dark .brxe-post-comments input:not([type="submit"]), .form--dark .brxe-post-comments select, .form--dark .brxe-post-comments textarea { background-color: var(--f-dark-input-background, var(--neutral-dark)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-dark-input-border-color, var(--neutral-medium)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-dark-input-text-color, var(--neutral-ultra-light)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--dark .input:hover:not([data-wsf-legal]), .form--dark .input:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark input:not([type="submit"]):hover:not([data-wsf-legal]), .form--dark input:not([type="submit"]):hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark select:hover:not([data-wsf-legal]), .form--dark select:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark textarea:hover:not([data-wsf-legal]), .form--dark textarea:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .bricks-search-form .input:hover:not([data-wsf-legal]), .form--dark .bricks-search-form .input:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .bricks-search-form input:not([type="submit"]):hover:not([data-wsf-legal]), .form--dark .bricks-search-form input:not([type="submit"]):hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .bricks-search-form select:hover:not([data-wsf-legal]), .form--dark .bricks-search-form select:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .bricks-search-form textarea:hover:not([data-wsf-legal]), .form--dark .bricks-search-form textarea:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .brxe-post-comments .input:hover:not([data-wsf-legal]), .form--dark .brxe-post-comments .input:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .brxe-post-comments input:not([type="submit"]):hover:not([data-wsf-legal]), .form--dark .brxe-post-comments input:not([type="submit"]):hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .brxe-post-comments select:hover:not([data-wsf-legal]), .form--dark .brxe-post-comments select:hover:enabled:not(:focus):not([data-wsf-legal]), .form--dark .brxe-post-comments textarea:hover:not([data-wsf-legal]), .form--dark .brxe-post-comments textarea:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-dark-input-color-background-hover, var(--neutral-dark)); border-color: var(--f-dark-input-border-color-hover, var(--neutral-semi-dark)); color: var(--f-dark-input-text-color-hover, var(--neutral-ultra-light)); } .form--dark .input::placeholder, .form--dark input:not([type="submit"])::placeholder, .form--dark select::placeholder, .form--dark textarea::placeholder, .form--dark .bricks-search-form .input::placeholder, .form--dark .bricks-search-form input:not([type="submit"])::placeholder, .form--dark .bricks-search-form select::placeholder, .form--dark .bricks-search-form textarea::placeholder, .form--dark .brxe-post-comments .input::placeholder, .form--dark .brxe-post-comments input:not([type="submit"])::placeholder, .form--dark .brxe-post-comments select::placeholder, .form--dark .brxe-post-comments textarea::placeholder { color: var(--f-dark-input-placeholder-color, var(--neutral-ultra-light)); opacity: var(--f-dark-input-placeholder-opacity, 0.5); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--dark .input:hover::placeholder, .form--dark input:not([type="submit"]):hover::placeholder, .form--dark select:hover::placeholder, .form--dark textarea:hover::placeholder, .form--dark .bricks-search-form .input:hover::placeholder, .form--dark .bricks-search-form input:not([type="submit"]):hover::placeholder, .form--dark .bricks-search-form select:hover::placeholder, .form--dark .bricks-search-form textarea:hover::placeholder, .form--dark .brxe-post-comments .input:hover::placeholder, .form--dark .brxe-post-comments input:not([type="submit"]):hover::placeholder, .form--dark .brxe-post-comments select:hover::placeholder, .form--dark .brxe-post-comments textarea:hover::placeholder { color: var(--f-dark-input-placeholder-color-hover, var(--neutral-ultra-light)); } .form--dark .bricks-button, .form--dark .bricks-search-form .bricks-button, .form--dark .brxe-post-comments .bricks-button { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .bricks-button:hover, .form--dark .bricks-search-form .bricks-button:hover, .form--dark .brxe-post-comments .bricks-button:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .bricks-button:focus, .form--dark .bricks-search-form .bricks-button:focus, .form--dark .brxe-post-comments .bricks-button:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .bricks-button.bricks-background-secondary, .form--dark .bricks-search-form .bricks-button.bricks-background-secondary, .form--dark .brxe-post-comments .bricks-button.bricks-background-secondary { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .bricks-button.bricks-background-secondary:hover, .form--dark .bricks-search-form .bricks-button.bricks-background-secondary:hover, .form--dark .brxe-post-comments .bricks-button.bricks-background-secondary:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .bricks-button.bricks-background-secondary:focus, .form--dark .bricks-search-form .bricks-button.bricks-background-secondary:focus, .form--dark .brxe-post-comments .bricks-button.bricks-background-secondary:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .form-group, .form--dark .bricks-search-form .form-group, .form--dark .brxe-post-comments .form-group { padding: 0; } .form--dark .form-group:not(.submit-button-wrapper), .form--dark .bricks-search-form .form-group:not(.submit-button-wrapper), .form--dark .brxe-post-comments .form-group:not(.submit-button-wrapper) { margin-block-end: var(--f-field-margin-bottom, 1.5em); } .form--dark .message, .form--dark .bricks-search-form .message, .form--dark .brxe-post-comments .message { margin-block-start: var(--f-field-margin-bottom, 1.5em); } .form--dark label:not(.ff-el-form-check-label), .form--dark div.label, .form--dark .bricks-search-form label:not(.ff-el-form-check-label), .form--dark .bricks-search-form div.label, .form--dark .brxe-post-comments label:not(.ff-el-form-check-label), .form--dark .brxe-post-comments div.label { background-color: var(--f-dark-label-background-color, transparent); color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); margin-block-end: var(--f-label-margin-bottom, 0.5em); text-transform: var(--f-label-text-transform, none); padding: var(--f-label-padding-y, 0) var(--f-label-padding-x, 0); } .form--dark .required:after, .form--dark .bricks-search-form .required:after, .form--dark .brxe-post-comments .required:after { color: var(--f-dark-required-color, var(--action)); } .form--dark input[type="file"], .form--dark .bricks-search-form input[type="file"], .form--dark .brxe-post-comments input[type="file"] { padding: 0; } .form--dark .choose-files, .form--dark .bricks-search-form .choose-files, .form--dark .brxe-post-comments .choose-files { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--dark .choose-files:hover, .form--dark .bricks-search-form .choose-files:hover, .form--dark .brxe-post-comments .choose-files:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--dark .choose-files:focus, .form--dark .bricks-search-form .choose-files:focus, .form--dark .brxe-post-comments .choose-files:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--dark .file-result.show, .form--dark .bricks-search-form .file-result.show, .form--dark .brxe-post-comments .file-result.show { font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); transition: all var(--btn-transition-duration) ease; } .form--dark .file-result.show .remove:hover, .form--dark .bricks-search-form .file-result.show .remove:hover, .form--dark .brxe-post-comments .file-result.show .remove:hover { background-color: var(--f-dark-btn-background-hover, var(--primary-hover)); color: var(--f-dark-btn-text-color-hover, var(--primary-ultra-light)); border-color: var(--f-dark-btn-border-color-hover, var(--primary-hover)); } .form--dark input[type="radio"], .form--dark .bricks-search-form input[type="radio"], .form--dark .brxe-post-comments input[type="radio"] { accent-color: var(--f-dark-option-action-color, var(--primary)); } .form--dark input[type="radio"] + label, .form--dark .bricks-search-form input[type="radio"] + label, .form--dark .brxe-post-comments input[type="radio"] + label { background-color: var(--f-dark-option-background-color, transparent); display: inline-block; color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); font-family: inherit; font-size: var(--f-option-label-size, --text-m); font-weight: var(--f-option-label-font-weight, 400); line-height: var(--f-option-label-line-height, 1.4); margin: 0 0 10px; -webkit-padding-start: 1.75em; padding-inline-start: 1.75em; -webkit-padding-start: inherit; padding-inline-start: inherit; margin: 0; } .form--dark .options-wrapper li, .form--dark .bricks-search-form .options-wrapper li, .form--dark .brxe-post-comments .options-wrapper li { position: relative; } .form--dark input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input), .form--dark .bricks-search-form input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input), .form--dark .brxe-post-comments input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input) { width: 0px; height: 0px; padding: 0; margin: 0; opacity: 0; position: absolute; } .form--dark input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus, .form--dark .bricks-search-form input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus, .form--dark .brxe-post-comments input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus { outline: none; } .form--dark input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus + label:before, .form--dark .bricks-search-form input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus + label:before, .form--dark .brxe-post-comments input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus + label:before { border-color: var(--f-dark-focus-color, var(--primary)); box-shadow: 0 0 0 4px hsl(var(--f-dark-focus-hsl, 213 93% 12%) / var(--f-dark-focus-color-opacity, 0.25)); outline: 0; } .form--dark input[type="checkbox"] + label, .form--dark .bricks-search-form input[type="checkbox"] + label, .form--dark .brxe-post-comments input[type="checkbox"] + label { background-color: var(--f-dark-option-background-color, transparent); display: inline-block; color: var(--f-dark-label-text-color, var(--neutral-ultra-light)); font-family: inherit; font-size: var(--f-option-label-size, --text-m); font-weight: var(--f-option-label-font-weight, 400); line-height: var(--f-option-label-line-height, 1.4); margin: 0 0 10px; -webkit-padding-start: 1.75em; padding-inline-start: 1.75em; background-color: unset; display: block; position: relative; margin: 0; cursor: pointer; } .form--dark input[type="checkbox"]:hover + label:before, .form--dark .bricks-search-form input[type="checkbox"]:hover + label:before, .form--dark .brxe-post-comments input[type="checkbox"]:hover + label:before { background: var(--f-dark-option-action-color, var(--primary)); box-shadow: inset 0px 0px 0px 2px transparent; } .form--dark input[type="checkbox"] + label:before, .form--dark .bricks-search-form input[type="checkbox"] + label:before, .form--dark .brxe-post-comments input[type="checkbox"] + label:before { content: ""; display: block; width: 1.4em; height: 1.4em; border: 1px solid var(--f-dark-option-border-color, var(--neutral)); border-radius: 0.2em; position: absolute; inset-block-start: 0; inset-inline-start: 0; -webkit-transition: all 0.2s, background 0.2s ease-in-out; transition: all 0.2s, background 0.2s ease-in-out; background-color: var(--f-dark-option-background-color, transparent); } .form--dark input[type="checkbox"]:checked + label:before, .form--dark .bricks-search-form input[type="checkbox"]:checked + label:before, .form--dark .brxe-post-comments input[type="checkbox"]:checked + label:before { background: var(--primary); box-shadow: 0 0 0 1px var(--f-dark-option-border-color, var(--neutral)); } .form--dark input[type="checkbox"]:checked + label:before, .form--dark .bricks-search-form input[type="checkbox"]:checked + label:before, .form--dark .brxe-post-comments input[type="checkbox"]:checked + label:before { background: var(--f-dark-option-action-color, var(--primary)); box-shadow: 0 0 0 1px var(--f-dark-option-border-color, var(--neutral)); } .form--dark input[type="checkbox"]:checked + label:after, .form--dark .bricks-search-form input[type="checkbox"]:checked + label:after, .form--dark .brxe-post-comments input[type="checkbox"]:checked + label:after { content: ""; cursor: pointer; display: inline-block; height: 1.5em; width: 1.5em; position: absolute; inset-block-start: 0; inset-inline-start: 0; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23ffffff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e") 50% no-repeat; background-size: 50%; } .form--dark select, .form--dark .bricks-search-form select, .form--dark .brxe-post-comments select { background-image: none; } .form--dark select:not(:has(+ span)), .form--dark .bricks-search-form select:not(:has(+ span)), .form--dark .brxe-post-comments select:not(:has(+ span)) { background-image: linear-gradient(45deg, transparent 50%, var(--f-dark-select-arrow-color, var(--neutral-ultra-light)) 0), linear-gradient(135deg, var(--f-dark-select-arrow-color, var(--neutral-ultra-light)) 50%, transparent 0); background-position: calc(100% - 20px) calc(50% + 2px), calc(100% - 16px) calc(50% + 2px); background-repeat: no-repeat; background-size: 4px 4px, 4px 4px; } .form--dark .options-wrapper li + li, .form--dark .bricks-search-form .options-wrapper li + li, .form--dark .brxe-post-comments .options-wrapper li + li { margin-block-start: var(--f-option-label-spacing, 0.5em); } main:has(.form--dark) ~ .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, main:has(.form--dark) ~ .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current, main:has(.form--dark) ~ .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current, main:has(.form--dark) ~ .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover, main:has(.form--dark) ~ .xdsoft_datetimepicker .xdsoft_calendar td:hover, main:has(.form--dark) ~ .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover { background: var(--primary) !important; } .form--light .wsf-form input[type="date"].wsf-field, .form--light .wsf-form input[type="datetime-local"].wsf-field, .form--light .wsf-form input[type="file"].wsf-field, .form--light .wsf-form input[type="month"].wsf-field, .form--light .wsf-form input[type="password"].wsf-field, .form--light .wsf-form input[type="search"].wsf-field, .form--light .wsf-form input[type="time"].wsf-field, .form--light .wsf-form input[type="week"].wsf-field, .form--light .wsf-form input[type="email"].wsf-field, .form--light .wsf-form input[type="number"].wsf-field, .form--light .wsf-form input[type="tel"].wsf-field, .form--light .wsf-form input[type="text"].wsf-field, .form--light .wsf-form input[type="url"].wsf-field, .form--light .wsf-form select.wsf-field:not([multiple]):not([size]), .form--light .wsf-form select.wsf-field ~ .select2-container .select2-selection { height: var(--f-input-height, 5rem); } .form--light .wsf-form input[type="date"].wsf-field, .form--light .wsf-form input[type="datetime-local"].wsf-field, .form--light .wsf-form input[type="file"].wsf-field, .form--light .wsf-form input[type="month"].wsf-field, .form--light .wsf-form input[type="password"].wsf-field, .form--light .wsf-form input[type="search"].wsf-field, .form--light .wsf-form input[type="time"].wsf-field, .form--light .wsf-form input[type="week"].wsf-field, .form--light .wsf-form input[type="email"].wsf-field, .form--light .wsf-form input[type="number"].wsf-field, .form--light .wsf-form input[type="tel"].wsf-field, .form--light .wsf-form input[type="text"].wsf-field, .form--light .wsf-form input[type="url"].wsf-field, .form--light .wsf-form select.wsf-field, .form--light .wsf-form select.wsf-field:not([multiple]):not([size]), .form--light .wsf-form select.wsf-field ~ .select2-container .select2-selection, .form--light .wsf-form textarea.wsf-field { background-color: var(--f-light-input-background, var(--white)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-light-input-border-color, var(--neutral-light)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-light-input-text-color, var(--neutral-dark)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--light .wsf-form input[type="date"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="date"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="datetime-local"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="datetime-local"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="file"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="file"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="month"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="month"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="password"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="password"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="search"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="search"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="time"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="time"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="week"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="week"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="email"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="email"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="number"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="number"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="tel"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="tel"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="text"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="text"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form input[type="url"].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="url"].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form select.wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form select.wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form select.wsf-field:not([multiple]):not([size]):hover:not([data-wsf-legal]), .form--light .wsf-form select.wsf-field:not([multiple]):not([size]):hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form select.wsf-field ~ .select2-container .select2-selection:hover:not([data-wsf-legal]), .form--light .wsf-form select.wsf-field ~ .select2-container .select2-selection:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .wsf-form textarea.wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form textarea.wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-light-input-color-background-hover, var(--white)); border-color: var(--f-light-input-border-color-hover, var(--neutral-light)); color: var(--f-light-input-text-color-hover, var(--neutral-dark)); } .form--light .wsf-form .wsf-grid { margin-inline: calc(-1 * calc(var(--f-grid-gutter, 2rem) / 2)); } .form--light .wsf-form [data-type="texteditor"] { color: var(--f-light-input-text-color, var(--neutral-dark)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); } .form--light .wsf-form [data-type="texteditor"] * + :is(h1, h2, h3, h4, h5, h6) { margin-block-start: var(--heading-spacing); } .form--light .wsf-form [data-type="texteditor"] * + p { margin-block-start: var(--paragraph-spacing); } .form--light .wsf-form [data-type="texteditor"] * + ul, .form--light .wsf-form [data-type="texteditor"] * + ol { margin-block-start: var(--list-spacing); } .form--light .wsf-form [data-type="texteditor"] * + li { margin-block-start: var(--list-item-spacing); } .form--light .wsf-form [data-type="html"] { color: var(--f-light-label-text-color, var(--neutral-dark)); } .form--light .wsf-form select.wsf-field:not([multiple]):not([size]) { padding-inline-end: calc(20px + var(--f-input-padding-x, 1em)); } .form--light .wsf-form select.wsf-field:not([multiple]):not([size]):not(:has(+ span)) { background-image: linear-gradient(45deg, transparent 50%, var(--f-light-select-arrow-color, var(--neutral)) 0), linear-gradient(135deg, var(--f-light-select-arrow-color, var(--neutral)) 50%, transparent 0); background-position: calc(100% - 20px) calc(50% + 2px), calc(100% - 16px) calc(50% + 2px); background-repeat: no-repeat; background-size: 4px 4px, 4px 4px; } .form--light .wsf-form select.wsf-field:invalid { color: hsl(var(--f-light-input-placeholder-hsl, 0 0% 25%) / var(--f-light-input-placeholder-opacity, 1)) !important; } .form--light .wsf-form select.wsf-field:not([multiple]):not([size]):not([data-wsf-select2]) + span.wsf-select-arrow { border-color: var(--f-light-select-arrow-color, var(--neutral)) transparent transparent transparent; right: calc(20px + var(--f-input-padding-x, 1em)); } .form--light .wsf-form select.wsf-field ~ .select2-container .select2-selection--single .select2-selection__rendered, .form--light .wsf-form select.wsf-field ~ .select2-container .select2-selection--single .select2-selection__placeholder, .form--light .wsf-form select.wsf-field ~ .select2-container .select2-selection .select2-search--inline .select2-search__field, .form--light .wsf-form select.wsf-field ~ .select2-container .select2-selection input.select2-search__field::placeholder { color: var(--f-light-input-text-color, var(--neutral-dark)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); } .form--light .wsf-form .wsf-select2-dropdown .select2-results .select2-results__option { border-top: 1px solid var(--f-light-input-border-color, var(--neutral-light)); font-size: var(--f-input-size, --text-m); } .form--light .wsf-form .wsf-select2-dropdown .select2-results .select2-results__option--highlighted[aria-selected] { background-color: var(--f-light-input-background, var(--white)); color: var(--f-light-input-text-color, var(--neutral-dark)); } .form--light .wsf-form.wsf-validated select.wsf-field:not([multiple]):not([size]):invalid, .form--light .wsf-form.wsf-validated input[type="date"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="datetime-local"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="file"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="month"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="password"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="search"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="time"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="week"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="email"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="number"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="tel"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="text"].wsf-field:invalid, .form--light .wsf-form.wsf-validated input[type="url"].wsf-field:invalid, .form--light .wsf-form.wsf-validated select.wsf-field:invalid, .form--light .wsf-form.wsf-validated textarea.wsf-field:invalid { border-color: hsl(var(--danger-h, 354), var(--danger-s, 70%), var(--danger-l, 54%)); color: hsl(var(--danger-h, 354), var(--danger-s, 70%), var(--danger-l, 54%)); } .form--light .wsf-form .wsf-invalid-feedback { color: hsl(var(--danger-h, 354), var(--danger-s, 70%), var(--danger-l, 54%)); } .form--light .wsf-form .iti--allow-dropdown input, .form--light .wsf-form .iti--allow-dropdown input[type="tel"], .form--light .wsf-form .iti--allow-dropdown input[type="text"], .form--light .wsf-form .iti--separate-dial-code input, .form--light .wsf-form .iti--separate-dial-code input[type="tel"], .form--light .wsf-form .iti--separate-dial-code input[type="text"] { padding-inline-start: calc(4.8rem + 6px); } .form--light .wsf-form input.wsf-field::placeholder, .form--light .wsf-form textarea.wsf-field::placeholder { color: var(--f-light-input-placeholder-color, var(--neutral-dark)); opacity: var(--f-light-input-placeholder-opacity, 1); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--light .wsf-form input.wsf-field:hover::placeholder, .form--light .wsf-form textarea.wsf-field:hover::placeholder { color: var(--f-light-input-placeholder-color-hover, var(--neutral-dark)); } .form--light .wsf-form label.wsf-label, .form--light .wsf-form label { background-color: var(--f-light-label-background-color, ); color: var(--f-light-label-text-color, var(--neutral-dark)); font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); margin-block-end: var(--f-label-margin-bottom, 0.5em); text-transform: var(--f-label-text-transform, none); padding: var(--f-label-padding-y, 0) var(--f-label-padding-x, 0); } .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder] + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder] + .wsf-input-group-append + label { background-color: var(--f-light-label-background-color, ); color: var(--f-light-label-text-color, var(--neutral-dark)); font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); margin-block-end: var(--f-label-margin-bottom, 0.5em); text-transform: var(--f-label-text-transform, none); padding: var(--f-label-padding-y, 0) var(--f-label-padding-x, 0); top: calc(var(--f-input-height, 5rem) / 2); transform: translateY(-50%); transition: all 0.3s ease; left: calc(calc(var(--f-grid-gutter, 2rem) / 2) + var(--f-input-padding-x, 1em)); } .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:hover:placeholder-shown:not(:focus) + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:hover:not(:focus):placeholder-shown + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:hover:placeholder-shown:not(:focus) + .wsf-input-group-append + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:hover:not(:focus):placeholder-shown + .wsf-input-group-append + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:hover:placeholder-shown:not(:focus) + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:hover:not(:focus):placeholder-shown + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:hover:placeholder-shown:not(:focus) + .wsf-input-group-append + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:hover:not(:focus):placeholder-shown + .wsf-input-group-append + label { color: var(--f-light-input-placeholder-color-hover, var(--neutral-dark)); } .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder] + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder] + .wsf-input-group-append + label { background-color: var(--f-light-label-background-color, ); color: var(--f-light-label-text-color, var(--neutral-dark)); font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); margin-block-end: var(--f-label-margin-bottom, 0.5em); text-transform: var(--f-label-text-transform, none); padding: var(--f-label-padding-y, 0) var(--f-label-padding-x, 0); left: calc(calc(var(--f-grid-gutter, 2rem) / 2) + 1em); top: calc(10px + var(--f-input-padding-y, 0.5em)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder] + label:hover, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder] + .wsf-input-group-append + label:hover { color: var(--f-light-input-placeholder-color-hover, var(--neutral-dark)); } .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:focus + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:not(:placeholder-shown) + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:focus + .wsf-input-group-append + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:not(:placeholder-shown) + .wsf-input-group-append + label { background-color: var(--f-light-label-inside-background-color, transparent); top: 0; left: calc(calc(var(--f-grid-gutter, 2rem) / 2) + var(--f-input-padding-x, 1em)); } .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:focus + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:focus + .wsf-input-group-append + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:not(:placeholder-shown) + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:not(:placeholder-shown) + .wsf-input-group-append + label { background-color: var(--f-light-label-inside-background-color, transparent); top: 10px; left: calc(calc(var(--f-grid-gutter, 2rem) / 2) + var(--f-input-padding-x, 1em)); } .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:placeholder-shown + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:placeholder-shown + .wsf-input-group-append + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:placeholder-shown + label { opacity: var(--f-light-input-placeholder-opacity, 1); } .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:focus:placeholder-shown + label, .form--light .wsf-form .wsf-label-position-inside input.wsf-field[placeholder]:focus:placeholder-shown + .wsf-input-group-append + label, .form--light .wsf-form .wsf-label-position-inside textarea.wsf-field[placeholder]:focus:placeholder-shown + label { background-color: var(--f-light-label-inside-background-color, transparent); opacity: 1; } .form--light .wsf-form .wsf-label-position-inside .iti--allow-dropdown input + label, .form--light .wsf-form .wsf-label-position-inside .iti--allow-dropdown input[type="tel"] + label, .form--light .wsf-form .wsf-label-position-inside .iti--allow-dropdown input[type="text"] + label, .form--light .wsf-form .wsf-label-position-inside .iti--separate-dial-code input + label, .form--light .wsf-form .wsf-label-position-inside .iti--separate-dial-code input[type="tel"] + label, .form--light .wsf-form .wsf-label-position-inside .iti--separate-dial-code input[type="text"] + label { left: calc(4.8rem + var(--f-input-padding-x, 1em)); } .form--light .wsf-form .wsf-label-position-inside .iti input.wsf-field[placeholder]:focus + label { background-color: var(--f-light-label-inside-background-color, transparent); opacity: 1; transform: translate(0px, -50%) scale(0.9); top: 0; left: calc(4.8rem + var(--f-input-padding-x, 1em)); } .form--light .wsf-form .wsf-label-position-inside select.wsf-field + label { background-color: var(--f-light-label-inside-background-color, transparent); } .form--light .wsf-form button.wsf-button, .form--light .wsf-form button.wsf-button.wsf-button-primary { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form button.wsf-button:hover, .form--light .wsf-form button.wsf-button.wsf-button-primary:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form button.wsf-button:focus, .form--light .wsf-form button.wsf-button.wsf-button-primary:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form button.wsf-button.wsf-button-secondary { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form button.wsf-button.wsf-button-secondary:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form button.wsf-button.wsf-button-secondary:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form button.wsf-button[data-action="wsf-tab_next"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form button.wsf-button[data-action="wsf-tab_next"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form button.wsf-button[data-action="wsf-tab_next"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form button.wsf-button[data-action="wsf-tab_previous"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form button.wsf-button[data-action="wsf-tab_previous"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form button.wsf-button[data-action="wsf-tab_previous"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form button.wsf-button[data-action="wsf-save"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form button.wsf-button[data-action="wsf-save"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form button.wsf-button[data-action="wsf-save"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form button.wsf-button[data-action="wsf-reset"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--neutral); --btn-background-hover: var(--neutral-dark); --btn-text-color: var(--neutral-ultra-light); --btn-text-color-hover: var(--neutral-ultra-light); --btn-border-color: var(--neutral); --btn-border-color-hover: var(--neutral-dark); --focus-color: var(--primary); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form button.wsf-button[data-action="wsf-reset"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form button.wsf-button[data-action="wsf-reset"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form button.wsf-button[data-action="wsf-clear"] { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--neutral); --btn-background-hover: var(--neutral-dark); --btn-text-color: var(--neutral-ultra-light); --btn-text-color-hover: var(--neutral-ultra-light); --btn-border-color: var(--neutral); --btn-border-color-hover: var(--neutral-dark); --focus-color: var(--primary); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form button.wsf-button[data-action="wsf-clear"]:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form button.wsf-button[data-action="wsf-clear"]:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form ul.wsf-group-tabs { background-color: var(--f-light-tab-group-background-color, transparent); padding: var(--f-tab-group-padding-y, 0) var(--f-tab-group-padding-x, 0); margin-block-end: var(--f-tab-group-margin-bottom, 3rem); } .form--light .wsf-form ul.wsf-group-tabs:not(.wsf-steps) { border-block-end: var(--f-tab-group-border-bottom-size, 2px) var(--f-tab-group-border-bottom-style, solid) var(--f-light-tab-group-border-bottom-color, var(--neutral-ultra-light)) !important; } .form--light .wsf-form ul.wsf-group-tabs > li { width: var(--f-tab-width, auto); } .form--light .wsf-form ul.wsf-group-tabs > li:not(:last-child) { margin-inline-end: var(--f-tab-margin-x, 0); } .form--light .wsf-form ul.wsf-group-tabs > li > a { border: var(--f-tab-border-size, 0) var(--f-tab-border-style, solid) var(--f-light-tab-border-color, var(--primary)) !important; border-radius: var(--f-tab-border-radius, 0); background-color: var(--f-light-tab-background-color, transparent); color: var(--f-light-tab-text-color, var(--neutral-dark)); font-size: var(--f-tab-text-size, --text-m); font-weight: var(--f-tab-text-weight, 400); line-height: var(--f-tab-text-line-height, 1); padding: var(--f-tab-padding-y, 0.75em) var(--f-tab-padding-x, 1.5em); text-align: var(--f-tab-text-align, center); text-decoration: var(--f-tab-text-decoration, none); text-transform: var(--f-tab-text-transform, none); } .form--light .wsf-form ul.wsf-group-tabs > li > a.wsf-tab-disabled { color: var(--f-light-tab-inactive-text-color, var(--neutral-dark-trans-80)); } .form--light .wsf-form ul.wsf-group-tabs > li.wsf-tab-active > a { border: var(--f-tab-active-border-size, 0) var(--f-tab-active-border-style, solid) var(--f-light-tab-active-border-color, var(--primary)) !important; border-block-end: var(--f-tab-active-border-bottom-size, 3px) var(--f-tab-active-border-style, solid) var(--f-light-tab-active-border-color, var(--primary)) !important; background-color: var(--f-light-tab-active-background-color, transparent) !important; color: var(--f-light-tab-active-text-color, var(--neutral-dark)) !important; font-weight: var(--f-tab-active-text-weight, 600); } .form--light .wsf-form ul.wsf-group-tabs > li.wsf-tab-active > a::before { color: var(--f-light-tab-active-text-color, var(--neutral-dark)) !important; } .form--light .wsf-form ul.wsf-group-tabs.wsf-steps > li.wsf-tab-active > a { border-block-end: none !important; } .form--light .wsf-form ul.wsf-group-tabs.wsf-steps > li > a::before { background-color: var(--f-light-tab-active-border-color, var(--primary)); border: 1px solid var(--f-light-tab-active-border-color, var(--primary)); } .form--light .wsf-form ul.wsf-group-tabs.wsf-steps > li > a::after { background-color: var(--f-light-tab-active-border-color, var(--primary)); } .form--light .wsf-form ul.wsf-group-tabs.wsf-steps > li > a:not(.wsf-tab-disabled):focus:before { border-color: var(--f-light-tab-active-border-color, var(--primary)); } .form--light .wsf-form .wsf-section > legend, .form--light .wsf-form .wsf-fieldset > legend { border: var(--f-legend-border, none); font-size: var(--f-legend-size, --text-m); font-weight: var(--f-legend-text-weight, 600); line-height: var(--f-legend-line-height, 1.2); margin-block-end: var(--f-legend-margin-bottom, 1em); color: var(--f-light-legend-text-color, var(--neutral-dark)); padding: 0; } .form--light .wsf-form .wsf-help { font-size: var(--f-help-size, --text-m); font-weight: var(--f-help-text-weight, 400); line-height: var(--f-help-line-height, 1.4); color: var(--f-light-help-text-color, var(--neutral-medium)); margin-block: var(--f-help-margin-block, 0.5em 0); } .form--light .wsf-form .wsf-help-pre { margin-block: var(--f-help-margin-block, 0.5em 0); } .form--light .wsf-form .wsf-field-wrapper:not(.wsf-alert) { margin-block-end: var(--f-field-margin-bottom, 1.5em); } .form--light .wsf-form fieldset:not(:last-child) { margin-block-end: var(--f-fieldset-margin-bottom, 1.5em); } .form--light .wsf-form .wsf-tile { padding-inline: calc(var(--f-grid-gutter, 2rem) / 2); } .form--light .wsf-form input[type="radio"].wsf-field + label.wsf-label { background-color: var(--f-light-option-background-color, transparent); display: inline-block; color: var(--f-light-label-text-color, var(--neutral-dark)); font-family: inherit; font-size: var(--f-option-label-size, --text-m); font-weight: var(--f-option-label-font-weight, 400); line-height: var(--f-option-label-line-height, 1.4); margin: 0 0 10px; -webkit-padding-start: 1.75em; padding-inline-start: 1.75em; background-color: unset; margin: 0; } .form--light .wsf-form input[type="radio"].wsf-field:checked + label.wsf-label:before { background-color: var(--f-light-option-action-color, var(--primary)); border-color: var(--f-light-option-border-color, var(--neutral)); } .form--light .wsf-form input[type="radio"].wsf-field + label.wsf-label:before { background-color: var(--f-light-option-background-color, transparent); border-color: var(--f-light-option-border-color, var(--neutral)); } .form--light .wsf-form input[type="radio"].wsf-image + label.wsf-label { padding-inline-start: 0; } .form--light .wsf-form [data-type="radio"] > div:not(.wsf-grid) > div + div, .form--light .wsf-form [data-type="price_radio"] > div:not(.wsf-grid) > div + div, .form--light .wsf-form [data-type="radio"] fieldset > div:not(.wsf-grid) > div + div, .form--light .wsf-form [data-type="price_radio"] fieldset > div:not(.wsf-grid) > div + div { margin-block-start: var(--f-option-label-spacing); } .form--light .wsf-form [data-type="radio"] > div.wsf-grid, .form--light .wsf-form [data-type="price_radio"] > div.wsf-grid, .form--light .wsf-form [data-type="radio"] fieldset > div.wsf-grid, .form--light .wsf-form [data-type="price_radio"] fieldset > div.wsf-grid { row-gap: var(--f-option-label-spacing); } .form--light .wsf-form input[type="checkbox"].wsf-field + label.wsf-label::before, .form--light .wsf-form input[type="checkbox"].wsf-field + label.wsf-label::after { width: 1.4em; height: 1.4em; transform: none; } .form--light .wsf-form input[type="checkbox"].wsf-field:checked + label.wsf-label::before { background-color: var(--f-light-option-action-color, var(--primary)); border-color: var(--f-light-option-border-color, var(--neutral)); } .form--light .wsf-form input[type="checkbox"].wsf-field + label.wsf-label::before { background-color: var(--f-light-option-background-color, transparent); border-color: var(--f-light-option-border-color, var(--neutral)); } .form--light .wsf-form input[type="checkbox"].wsf-field + label.wsf-label { background-color: var(--f-light-option-background-color, transparent); display: inline-block; color: var(--f-light-label-text-color, var(--neutral-dark)); font-family: inherit; font-size: var(--f-option-label-size, --text-m); font-weight: var(--f-option-label-font-weight, 400); line-height: var(--f-option-label-line-height, 1.4); margin: 0 0 10px; -webkit-padding-start: 1.75em; padding-inline-start: 1.75em; background-color: unset; margin: 0; } .form--light .wsf-form [data-type="checkbox"] > div:not(.wsf-grid) > div + div, .form--light .wsf-form [data-type="price_checkbox"] > div:not(.wsf-grid) > div + div, .form--light .wsf-form [data-type="checkbox"] fieldset > div:not(.wsf-grid) > div + div, .form--light .wsf-form [data-type="price_checkbox"] fieldset > div:not(.wsf-grid) > div + div { margin-block-start: var(--f-option-label-spacing, 0.5em); } .form--light .wsf-form [data-type="checkbox"] > div.wsf-grid, .form--light .wsf-form [data-type="price_checkbox"] > div.wsf-grid, .form--light .wsf-form [data-type="checkbox"] fieldset > div.wsf-grid, .form--light .wsf-form [data-type="price_checkbox"] fieldset > div.wsf-grid { row-gap: var(--f-option-label-spacing); } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-switch + label.wsf-label, .form--light .wsf-form input[type="radio"].wsf-field.wsf-switch + label.wsf-label { -webkit-padding-start: 2.85em; padding-inline-start: 2.85em; } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-switch + label.wsf-label:before, .form--light .wsf-form input[type="radio"].wsf-field.wsf-switch + label.wsf-label:before { width: 2.5em; height: 1.4em; border-radius: 1.2em; } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-switch + label.wsf-label:after, .form--light .wsf-form input[type="radio"].wsf-field.wsf-switch + label.wsf-label:after { height: calc(1.4em - 4px); width: calc(1.4em - 4px); } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-switch:checked + label.wsf-label:after, .form--light .wsf-form input[type="radio"].wsf-field.wsf-switch:checked + label.wsf-label:after { left: calc(2.5em - calc(1.4em - 2px)); } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-image + label.wsf-label, .form--light .wsf-form input[type="radio"].wsf-field.wsf-image + label.wsf-label { -webkit-padding-start: 0; padding-inline-start: 0; } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-button + label.wsf-label, .form--light .wsf-form input[type="radio"].wsf-field.wsf-button + label.wsf-label { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-button + label.wsf-label:hover, .form--light .wsf-form input[type="radio"].wsf-field.wsf-button + label.wsf-label:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-button + label.wsf-label:focus, .form--light .wsf-form input[type="radio"].wsf-field.wsf-button + label.wsf-label:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-button:checked + label.wsf-label, .form--light .wsf-form input[type="radio"].wsf-field.wsf-button:checked + label.wsf-label { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary-ultra-light); --btn-background-hover: var(--primary-light); --btn-text-color: var(--primary); --btn-text-color-hover: var(--primary-ultra-dark); --btn-border-color: var(--primary-ultra-light); --btn-border-color-hover: var(--primary-light); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-button:checked + label.wsf-label:hover, .form--light .wsf-form input[type="radio"].wsf-field.wsf-button:checked + label.wsf-label:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .wsf-form input[type="checkbox"].wsf-field.wsf-button:checked + label.wsf-label:focus, .form--light .wsf-form input[type="radio"].wsf-field.wsf-button:checked + label.wsf-label:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .wsf-form progress[value]::-webkit-progress-bar { background-color: var(--f-light-progress-background-color, var(--base-ultra-light)); height: var(--f-progress-height, 3rem); display: block; } .form--light .wsf-form progress.wsf-progress { height: var(--f-progress-height, 3rem); border-radius: var(--f-progress-bar-radius, var(--btn-radius)); overflow: hidden; } .form--light .wsf-form progress[value]::-webkit-progress-value { background-color: var(--f-light-progress-bar-fill-color, var(--primary)); border-radius: var(--f-progress-bar-radius, var(--btn-radius)); } .form--light .wsf-form .minicolors-theme-ws-form .minicolors-swatch { height: calc(100% - 1px); } .form--light .wsf-form input[type="range"] { -webkit-appearance: none;  appearance: none; width: 100%;  background: transparent;  --wsf-color-lower-track: var(--f-light-range-left-track-color, var(--neutral-ultra-light)); --wsf-color-upper-track: var(--f-light-range-right-track-color, var(--neutral-ultra-light)); background-color: var(--f-light-range-background-color, var(--neutral-ultra-light)); } .form--light .wsf-form input[type="range"]::-moz-range-track { -webkit-appearance: none;  appearance: none; width: 100%;  background: transparent;  --wsf-color-lower-track: var(--f-light-range-left-track-color, var(--neutral-ultra-light)); --wsf-color-upper-track: var(--f-light-range-right-track-color, var(--neutral-ultra-light)); background-color: var(--f-light-range-background-color, var(--neutral-ultra-light)); } .form--light .wsf-form input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; background-color: var(--f-light-range-thumb-color, var(--primary)); } .form--light .wsf-form input[type="range"]::-moz-range-thumb { -webkit-appearance: none; appearance: none; background-color: var(--f-light-range-thumb-color, var(--primary)); } .form--light .wsf-form input[type="range"]:focus { outline: none;  } .form--light .wsf-form input[type="range"]::-ms-track { width: 100%; cursor: pointer;  background: transparent; border-color: transparent; color: transparent; } .form--light .wsf-form .wsf-required-wrapper .wsf-text-danger { color: var(--f-light-required-color, var(--action)); } .form--light .wsf-form input[type="text"].wsf-field ~ .dropzone { background-color: var(--f-light-input-background, var(--white)); border-color: var(--f-light-input-border-color, var(--neutral-light)); } .form--light .wsf-form input[type="text"].wsf-field ~ .dropzone .dz-message { color: var(--f-light-input-text-color, var(--neutral-dark)); } .form--light .wsf-form input[type="file"].wsf-field { padding-inline-start: 1rem; } .form--light .wsf-form input[type="file"].wsf-field::file-selector-button { background: var(--f-light-upload-btn-background-color, var(--neutral-light)) !important; color: var(--f-light-upload-btn-text-color, var(--neutral-ultra-dark)); height: var(--f-input-height, 5rem); position: relative; top: -1px; transition: all var(--btn-transition-duration) ease; } .form--light .wsf-form input[type="file"].wsf-field::file-selector-button:hover { background: var(--f-light-upload-btn-background-color-hover, var(--neutral-ultra-light)) !important; color: var(--f-light-upload-btn-text-color-hover, var(--neutral-ultra-dark)); } .form--light .wsf-form [data-wsf-legal].wsf-field { background-color: var(--f-light-input-background, var(--white)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-light-input-border-color, var(--neutral-light)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-light-input-text-color, var(--neutral-dark)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--light .wsf-form [data-wsf-legal].wsf-field:hover:not([data-wsf-legal]), .form--light .wsf-form [data-wsf-legal].wsf-field:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-light-input-color-background-hover, var(--white)); border-color: var(--f-light-input-border-color-hover, var(--neutral-light)); color: var(--f-light-input-text-color-hover, var(--neutral-dark)); } .form--light .wsf-form .wsf-alert { background-color: var(--f-light-input-background, var(--white)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-light-input-border-color, var(--neutral-light)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-light-input-text-color, var(--neutral-dark)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); background-color: var(--base-ultra-light); border-left-width: 0.4rem; margin-block-end: 0; display: inline-block; } .form--light .wsf-form .wsf-alert:hover:not([data-wsf-legal]), .form--light .wsf-form .wsf-alert:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-light-input-color-background-hover, var(--white)); border-color: var(--f-light-input-border-color-hover, var(--neutral-light)); color: var(--f-light-input-text-color-hover, var(--neutral-dark)); } .form--light .wsf-form .wsf-alert.wsf-alert-danger { background-color: hsl(var(--danger-light-h, 354), var(--danger-light-s, 70%), var(--danger-light-l, 85%)); border-color: #DC3545; color: hsl(var(--danger-dark-h, 354), var(--danger-dark-s, 70%), var(--danger-dark-l, 15%)); } .form--light .wsf-form .wsf-alert.wsf-alert-warning { background-color: hsl(var(--warning-light-h, 45), var(--warning-light-s, 100%), var(--warning-light-l, 85%)); border-color: #FFC10A; color: hsl(var(--warning-dark-h, 45), var(--warning-dark-s, 100%), var(--warning-dark-l, 15%)); } .form--light .wsf-form .wsf-alert.wsf-alert-information { background-color: hsl(var(--info-light-h, 188), var(--info-light-s, 77%), var(--info-light-l, 85%)); border-color: var(--info-hex, #18A2B8); color: hsl(var(--info-dark-h, 188), var(--info-dark-s, 77%), var(--info-dark-l, 15%)); } .form--light .wsf-form .wsf-alert.wsf-alert-success { background-color: hsl(var(--success-light-h, 133), var(--success-light-s, 61%), var(--success-light-l, 85%)); border-color: var(--success-hex, #29A745); color: hsl(var(--success-dark-h, 133), var(--success-dark-s, 61%), var(--success-dark-l, 15%)); } .form--light .wsf-form .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, .form--light .wsf-form .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current, .form--light .wsf-form .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current, .form--light .wsf-form .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover, .form--light .wsf-form .xdsoft_datetimepicker .xdsoft_calendar td:hover, .form--light .wsf-form .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover { background: var(--primary) !important; } .form--light .wsf-form input[type="text"].wsf-field ~ canvas { background-color: var(--f-light-input-background, var(--white)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-light-input-border-color, var(--neutral-light)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-light-input-text-color, var(--neutral-dark)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); padding: 0; height: auto; background: none; } .form--light .wsf-form input[type="text"].wsf-field ~ canvas:hover:not([data-wsf-legal]), .form--light .wsf-form input[type="text"].wsf-field ~ canvas:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-light-input-color-background-hover, var(--white)); border-color: var(--f-light-input-border-color-hover, var(--neutral-light)); color: var(--f-light-input-text-color-hover, var(--neutral-dark)); } .form--light .wsf-form input[type="date"].wsf-field:focus, .form--light .wsf-form input[type="datetime-local"].wsf-field:focus, .form--light .wsf-form input[type="file"].wsf-field:focus, .form--light .wsf-form input[type="month"].wsf-field:focus, .form--light .wsf-form input[type="password"].wsf-field:focus, .form--light .wsf-form input[type="search"].wsf-field:focus, .form--light .wsf-form input[type="time"].wsf-field:focus, .form--light .wsf-form input[type="week"].wsf-field:focus, .form--light .wsf-form input[type="email"].wsf-field:focus, .form--light .wsf-form input[type="number"].wsf-field:focus, .form--light .wsf-form input[type="tel"].wsf-field:focus, .form--light .wsf-form input[type="text"].wsf-field:focus, .form--light .wsf-form input[type="url"].wsf-field:focus, .form--light .wsf-form select.wsf-field:focus, .form--light .wsf-form textarea.wsf-field:focus, .form--light .wsf-form button.wsf-button:focus, .form--light .wsf-form button.wsf-button.wsf-button-primary:focus { border-color: var(--f-light-focus-color, var(--primary)); box-shadow: 0 0 0 4px hsl(var(--f-light-focus-hsl, 213 93% 12%) / var(--f-light-focus-color-opacity, 0.25)); outline: 0; } .form--light input[type="date"], .form--light input[type="datetime-local"], .form--light input[type="month"], .form--light input[type="password"], .form--light input[type="search"], .form--light input[type="time"], .form--light input[type="week"], .form--light input[type="email"], .form--light input[type="number"], .form--light input[type="tel"], .form--light input[type="text"], .form--light input[type="url"], .form--light select:not([multiple]):not([size]), .form--light .bricks-search-form input[type="date"], .form--light .bricks-search-form input[type="datetime-local"], .form--light .bricks-search-form input[type="month"], .form--light .bricks-search-form input[type="password"], .form--light .bricks-search-form input[type="search"], .form--light .bricks-search-form input[type="time"], .form--light .bricks-search-form input[type="week"], .form--light .bricks-search-form input[type="email"], .form--light .bricks-search-form input[type="number"], .form--light .bricks-search-form input[type="tel"], .form--light .bricks-search-form input[type="text"], .form--light .bricks-search-form input[type="url"], .form--light .bricks-search-form select:not([multiple]):not([size]), .form--light .brxe-post-comments input[type="date"], .form--light .brxe-post-comments input[type="datetime-local"], .form--light .brxe-post-comments input[type="month"], .form--light .brxe-post-comments input[type="password"], .form--light .brxe-post-comments input[type="search"], .form--light .brxe-post-comments input[type="time"], .form--light .brxe-post-comments input[type="week"], .form--light .brxe-post-comments input[type="email"], .form--light .brxe-post-comments input[type="number"], .form--light .brxe-post-comments input[type="tel"], .form--light .brxe-post-comments input[type="text"], .form--light .brxe-post-comments input[type="url"], .form--light .brxe-post-comments select:not([multiple]):not([size]) { height: var(--f-input-height, 5rem); } .form--light .input, .form--light input:not([type="submit"]), .form--light select, .form--light textarea, .form--light .bricks-search-form .input, .form--light .bricks-search-form input:not([type="submit"]), .form--light .bricks-search-form select, .form--light .bricks-search-form textarea, .form--light .brxe-post-comments .input, .form--light .brxe-post-comments input:not([type="submit"]), .form--light .brxe-post-comments select, .form--light .brxe-post-comments textarea { background-color: var(--f-light-input-background, var(--white)); border-top-width: var(--f-input-border-top-size, 0.1rem); border-right-width: var(--f-input-border-right-size, 0.1rem); border-bottom-width: var(--f-input-border-bottom-size, 0.1rem); border-left-width: var(--f-input-border-left-size, 0.1rem); border-style: var(--f-input-border-style, solid); border-color: var(--f-light-input-border-color, var(--neutral-light)); border-radius: var(--f-input-border-radius, var(--btn-radius)); color: var(--f-light-input-text-color, var(--neutral-dark)); font-size: var(--f-input-size, --text-m); font-weight: var(--f-input-font-weight, 400); line-height: var(--f-input-line-height, 1); padding: var(--f-input-padding-y, 0.5em) var(--f-input-padding-x, 1em); -webkit-border-radius: var(--f-input-border-radius, var(--btn-radius)); -moz-border-radius: var(--f-input-border-radius, var(--btn-radius)); -ms-border-radius: var(--f-input-border-radius, var(--btn-radius)); -o-border-radius: var(--f-input-border-radius, var(--btn-radius)); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--light .input:hover:not([data-wsf-legal]), .form--light .input:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light input:not([type="submit"]):hover:not([data-wsf-legal]), .form--light input:not([type="submit"]):hover:enabled:not(:focus):not([data-wsf-legal]), .form--light select:hover:not([data-wsf-legal]), .form--light select:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light textarea:hover:not([data-wsf-legal]), .form--light textarea:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .bricks-search-form .input:hover:not([data-wsf-legal]), .form--light .bricks-search-form .input:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .bricks-search-form input:not([type="submit"]):hover:not([data-wsf-legal]), .form--light .bricks-search-form input:not([type="submit"]):hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .bricks-search-form select:hover:not([data-wsf-legal]), .form--light .bricks-search-form select:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .bricks-search-form textarea:hover:not([data-wsf-legal]), .form--light .bricks-search-form textarea:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .brxe-post-comments .input:hover:not([data-wsf-legal]), .form--light .brxe-post-comments .input:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .brxe-post-comments input:not([type="submit"]):hover:not([data-wsf-legal]), .form--light .brxe-post-comments input:not([type="submit"]):hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .brxe-post-comments select:hover:not([data-wsf-legal]), .form--light .brxe-post-comments select:hover:enabled:not(:focus):not([data-wsf-legal]), .form--light .brxe-post-comments textarea:hover:not([data-wsf-legal]), .form--light .brxe-post-comments textarea:hover:enabled:not(:focus):not([data-wsf-legal]) { background-color: var(--f-light-input-color-background-hover, var(--white)); border-color: var(--f-light-input-border-color-hover, var(--neutral-light)); color: var(--f-light-input-text-color-hover, var(--neutral-dark)); } .form--light .input::placeholder, .form--light input:not([type="submit"])::placeholder, .form--light select::placeholder, .form--light textarea::placeholder, .form--light .bricks-search-form .input::placeholder, .form--light .bricks-search-form input:not([type="submit"])::placeholder, .form--light .bricks-search-form select::placeholder, .form--light .bricks-search-form textarea::placeholder, .form--light .brxe-post-comments .input::placeholder, .form--light .brxe-post-comments input:not([type="submit"])::placeholder, .form--light .brxe-post-comments select::placeholder, .form--light .brxe-post-comments textarea::placeholder { color: var(--f-light-input-placeholder-color, var(--neutral-dark)); opacity: var(--f-light-input-placeholder-opacity, 1); transition: var(--transition-duration) var(--transition-timing) var(--transition-delay); } .form--light .input:hover::placeholder, .form--light input:not([type="submit"]):hover::placeholder, .form--light select:hover::placeholder, .form--light textarea:hover::placeholder, .form--light .bricks-search-form .input:hover::placeholder, .form--light .bricks-search-form input:not([type="submit"]):hover::placeholder, .form--light .bricks-search-form select:hover::placeholder, .form--light .bricks-search-form textarea:hover::placeholder, .form--light .brxe-post-comments .input:hover::placeholder, .form--light .brxe-post-comments input:not([type="submit"]):hover::placeholder, .form--light .brxe-post-comments select:hover::placeholder, .form--light .brxe-post-comments textarea:hover::placeholder { color: var(--f-light-input-placeholder-color-hover, var(--neutral-dark)); } .form--light .bricks-button, .form--light .bricks-search-form .bricks-button, .form--light .brxe-post-comments .bricks-button { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .bricks-button:hover, .form--light .bricks-search-form .bricks-button:hover, .form--light .brxe-post-comments .bricks-button:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .bricks-button:focus, .form--light .bricks-search-form .bricks-button:focus, .form--light .brxe-post-comments .bricks-button:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .bricks-button.bricks-background-secondary, .form--light .bricks-search-form .bricks-button.bricks-background-secondary, .form--light .brxe-post-comments .bricks-button.bricks-background-secondary { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .bricks-button.bricks-background-secondary:hover, .form--light .bricks-search-form .bricks-button.bricks-background-secondary:hover, .form--light .brxe-post-comments .bricks-button.bricks-background-secondary:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .bricks-button.bricks-background-secondary:focus, .form--light .bricks-search-form .bricks-button.bricks-background-secondary:focus, .form--light .brxe-post-comments .bricks-button.bricks-background-secondary:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .form-group, .form--light .bricks-search-form .form-group, .form--light .brxe-post-comments .form-group { padding: 0; } .form--light .form-group:not(.submit-button-wrapper), .form--light .bricks-search-form .form-group:not(.submit-button-wrapper), .form--light .brxe-post-comments .form-group:not(.submit-button-wrapper) { margin-block-end: var(--f-field-margin-bottom, 1.5em); } .form--light .message, .form--light .bricks-search-form .message, .form--light .brxe-post-comments .message { margin-block-start: var(--f-field-margin-bottom, 1.5em); } .form--light label:not(.ff-el-form-check-label), .form--light div.label, .form--light .bricks-search-form label:not(.ff-el-form-check-label), .form--light .bricks-search-form div.label, .form--light .brxe-post-comments label:not(.ff-el-form-check-label), .form--light .brxe-post-comments div.label { background-color: var(--f-light-label-background-color, ); color: var(--f-light-label-text-color, var(--neutral-dark)); font-size: var(--f-label-size, --text-m); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); margin-block-end: var(--f-label-margin-bottom, 0.5em); text-transform: var(--f-label-text-transform, none); padding: var(--f-label-padding-y, 0) var(--f-label-padding-x, 0); } .form--light .required:after, .form--light .bricks-search-form .required:after, .form--light .brxe-post-comments .required:after { color: var(--f-light-required-color, var(--action)); } .form--light input[type="file"], .form--light .bricks-search-form input[type="file"], .form--light .brxe-post-comments input[type="file"] { padding: 0; } .form--light .choose-files, .form--light .bricks-search-form .choose-files, .form--light .brxe-post-comments .choose-files { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .form--light .choose-files:hover, .form--light .bricks-search-form .choose-files:hover, .form--light .brxe-post-comments .choose-files:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .form--light .choose-files:focus, .form--light .bricks-search-form .choose-files:focus, .form--light .brxe-post-comments .choose-files:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .form--light .file-result.show, .form--light .bricks-search-form .file-result.show, .form--light .brxe-post-comments .file-result.show { font-size: var(--text-s-pure, 1.42rem); font-size: calc(var(--f-label-size-min, 1.4) * 1rem + (var(--f-label-size-max, 1.6) - var(--f-label-size-min, 1.4) * ((100vw - 36rem) / 100.6))); font-size: clamp(var(--f-label-size-min, 1.4) * 1rem, calc(var(--f-label-size-max, 1.6) - var(--f-label-size-min, 1.4) / 100.6 * 100vw + var(--f-label-size-min, 1.4) - var(--f-label-size-max, 1.6) - var(--f-label-size-min, 1.4) / 100.6 * 36 * 1rem), var(--f-label-size-max, 1.6) * 1rem); font-weight: var(--f-label-font-weight, 400); line-height: var(--f-label-line-height, 1); transition: all var(--btn-transition-duration) ease; } .form--light .file-result.show .remove:hover, .form--light .bricks-search-form .file-result.show .remove:hover, .form--light .brxe-post-comments .file-result.show .remove:hover { background-color: var(--f-light-btn-background-hover, var(--primary-hover)); color: var(--f-light-btn-text-color-hover, var(--primary-ultra-light)); border-color: var(--f-light-btn-border-color-hover, var(--primary-hover)); } .form--light input[type="radio"], .form--light .bricks-search-form input[type="radio"], .form--light .brxe-post-comments input[type="radio"] { accent-color: var(--f-light-option-action-color, var(--primary)); } .form--light input[type="radio"] + label, .form--light .bricks-search-form input[type="radio"] + label, .form--light .brxe-post-comments input[type="radio"] + label { background-color: var(--f-light-option-background-color, transparent); display: inline-block; color: var(--f-light-label-text-color, var(--neutral-dark)); font-family: inherit; font-size: var(--f-option-label-size, --text-m); font-weight: var(--f-option-label-font-weight, 400); line-height: var(--f-option-label-line-height, 1.4); margin: 0 0 10px; -webkit-padding-start: 1.75em; padding-inline-start: 1.75em; -webkit-padding-start: inherit; padding-inline-start: inherit; margin: 0; } .form--light .options-wrapper li, .form--light .bricks-search-form .options-wrapper li, .form--light .brxe-post-comments .options-wrapper li { position: relative; } .form--light input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input), .form--light .bricks-search-form input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input), .form--light .brxe-post-comments input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input) { width: 0px; height: 0px; padding: 0; margin: 0; opacity: 0; position: absolute; } .form--light input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus, .form--light .bricks-search-form input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus, .form--light .brxe-post-comments input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus { outline: none; } .form--light input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus + label:before, .form--light .bricks-search-form input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus + label:before, .form--light .brxe-post-comments input[type="checkbox"]:not(.ff-el-form-check-checkbox):not(.ff-el-form-check-input):focus + label:before { border-color: var(--f-light-focus-color, var(--primary)); box-shadow: 0 0 0 4px hsl(var(--f-light-focus-hsl, 213 93% 12%) / var(--f-light-focus-color-opacity, 0.25)); outline: 0; } .form--light input[type="checkbox"] + label, .form--light .bricks-search-form input[type="checkbox"] + label, .form--light .brxe-post-comments input[type="checkbox"] + label { background-color: var(--f-light-option-background-color, transparent); display: inline-block; color: var(--f-light-label-text-color, var(--neutral-dark)); font-family: inherit; font-size: var(--f-option-label-size, --text-m); font-weight: var(--f-option-label-font-weight, 400); line-height: var(--f-option-label-line-height, 1.4); margin: 0 0 10px; -webkit-padding-start: 1.75em; padding-inline-start: 1.75em; background-color: unset; display: block; position: relative; margin: 0; cursor: pointer; } .form--light input[type="checkbox"]:hover + label:before, .form--light .bricks-search-form input[type="checkbox"]:hover + label:before, .form--light .brxe-post-comments input[type="checkbox"]:hover + label:before { background: var(--f-light-option-action-color, var(--primary)); box-shadow: inset 0px 0px 0px 2px transparent; } .form--light input[type="checkbox"] + label:before, .form--light .bricks-search-form input[type="checkbox"] + label:before, .form--light .brxe-post-comments input[type="checkbox"] + label:before { content: ""; display: block; width: 1.4em; height: 1.4em; border: 1px solid var(--f-light-option-border-color, var(--neutral)); border-radius: 0.2em; position: absolute; inset-block-start: 0; inset-inline-start: 0; -webkit-transition: all 0.2s, background 0.2s ease-in-out; transition: all 0.2s, background 0.2s ease-in-out; background-color: var(--f-light-option-background-color, transparent); } .form--light input[type="checkbox"]:checked + label:before, .form--light .bricks-search-form input[type="checkbox"]:checked + label:before, .form--light .brxe-post-comments input[type="checkbox"]:checked + label:before { background: var(--primary); box-shadow: 0 0 0 1px var(--f-light-option-border-color, var(--neutral)); } .form--light input[type="checkbox"]:checked + label:before, .form--light .bricks-search-form input[type="checkbox"]:checked + label:before, .form--light .brxe-post-comments input[type="checkbox"]:checked + label:before { background: var(--f-light-option-action-color, var(--primary)); box-shadow: 0 0 0 1px var(--f-light-option-border-color, var(--neutral)); } .form--light input[type="checkbox"]:checked + label:after, .form--light .bricks-search-form input[type="checkbox"]:checked + label:after, .form--light .brxe-post-comments input[type="checkbox"]:checked + label:after { content: ""; cursor: pointer; display: inline-block; height: 1.5em; width: 1.5em; position: absolute; inset-block-start: 0; inset-inline-start: 0; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23ffffff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e") 50% no-repeat; background-size: 50%; } .form--light select, .form--light .bricks-search-form select, .form--light .brxe-post-comments select { background-image: none; } .form--light select:not(:has(+ span)), .form--light .bricks-search-form select:not(:has(+ span)), .form--light .brxe-post-comments select:not(:has(+ span)) { background-image: linear-gradient(45deg, transparent 50%, var(--f-light-select-arrow-color, var(--neutral)) 0), linear-gradient(135deg, var(--f-light-select-arrow-color, var(--neutral)) 50%, transparent 0); background-position: calc(100% - 20px) calc(50% + 2px), calc(100% - 16px) calc(50% + 2px); background-repeat: no-repeat; background-size: 4px 4px, 4px 4px; } .form--light .options-wrapper li + li, .form--light .bricks-search-form .options-wrapper li + li, .form--light .brxe-post-comments .options-wrapper li + li { margin-block-start: var(--f-option-label-spacing, 0.5em); } main:has(.form--light) ~ .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, main:has(.form--light) ~ .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current, main:has(.form--light) ~ .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current, main:has(.form--light) ~ .xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover, main:has(.form--light) ~ .xdsoft_datetimepicker .xdsoft_calendar td:hover, main:has(.form--light) ~ .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover { background: var(--primary) !important; } #shadow-host-companion { padding: 0; } .border:where(:not(:is(figure, picture))), .border:where(figure, picture) > img { border: var(--border); border-radius: var(--radius); } .border-light:where(:not(:is(figure, picture))), .border-light:where(figure, picture) > img { border: var(--border-light); border-radius: var(--radius); } .border-dark:where(:not(:is(figure, picture))), .border-dark:where(figure, picture) > img { border: var(--border-dark); border-radius: var(--radius); } .border-top:where(:not(:is(figure, picture))), .border-top:where(figure, picture) > img { border-block-start: var(--border); } .border-top--light:where(:not(:is(figure, picture))), .border-top--light:where(figure, picture) > img { border-block-start: var(--border-light); } .border-top--dark:where(:not(:is(figure, picture))), .border-top--dark:where(figure, picture) > img { border-block-start: var(--border-dark); } .border-bottom:where(:not(:is(figure, picture))), .border-bottom:where(figure, picture) > img { border-block-end: var(--border); } .border-bottom--light:where(:not(:is(figure, picture))), .border-bottom--light:where(figure, picture) > img { border-block-end: var(--border-light); } .border-bottom--dark:where(:not(:is(figure, picture))), .border-bottom--dark:where(figure, picture) > img { border-block-end: var(--border-dark); } .border-left:where(:not(:is(figure, picture))), .border-left:where(figure, picture) > img { border-inline-start: var(--border); } .border-left--light:where(:not(:is(figure, picture))), .border-left--light:where(figure, picture) > img { border-inline-start: var(--border-light); } .border-left--dark:where(:not(:is(figure, picture))), .border-left--dark:where(figure, picture) > img { border-inline-start: var(--border-dark); } .border-right:where(:not(:is(figure, picture))), .border-right:where(figure, picture) > img { border-inline-end: var(--border); } .border-right--light:where(:not(:is(figure, picture))), .border-right--light:where(figure, picture) > img { border-inline-end: var(--border-light); } .border-right--dark:where(:not(:is(figure, picture))), .border-right--dark:where(figure, picture) > img { border-inline-end: var(--border-dark); } .border-block:where(:not(:is(figure, picture))), .border-block:where(figure, picture) > img { border-block: var(--border); } .border-block--light:where(:not(:is(figure, picture))), .border-block--light:where(figure, picture) > img { border-block: var(--border-light); } .border-block--dark:where(:not(:is(figure, picture))), .border-block--dark:where(figure, picture) > img { border-block: var(--border-dark); } .border-inline:where(:not(:is(figure, picture))), .border-inline:where(figure, picture) > img { border-inline: var(--border); } .border-inline--light:where(:not(:is(figure, picture))), .border-inline--light:where(figure, picture) > img { border-inline: var(--border-light); } .border-inline--dark:where(:not(:is(figure, picture))), .border-inline--dark:where(figure, picture) > img { border-inline: var(--border-dark); } .radius { border-radius: var(--radius); } .radius--50.radius--50, .rounded--50.rounded--50 { border-radius: var(--radius-50); } .radius--circle.radius--circle, .rounded--circle.rounded--circle { border-radius: var(--radius-circle); } .radius--none.radius--none, .rounded--none.rounded--none { border-radius: var(--radius-none); } .radius--xs.radius--xs, .rounded--xs.rounded--xs { border-radius: var(--radius-xs); } .radius--s.radius--s, .rounded--s.rounded--s { border-radius: var(--radius-s); } .radius--m.radius--m, .rounded--m.rounded--m { border-radius: var(--radius-m); } .radius--l.radius--l, .rounded--l.rounded--l { border-radius: var(--radius-l); } .radius--xl.radius--xl, .rounded--xl.rounded--xl { border-radius: var(--radius-xl); } .radius--xxl.radius--xxl, .rounded--xxl.rounded--xxl { border-radius: var(--radius-xxl); } :where(img):not(header img), :where(figure:not(figure:has(img))) { border-radius: var(--radius); } .acss-auto-radius :where(img):not(header img), .acss-auto-radius :where(figure:not(figure:has(img))) { border-radius: var(--radius); } .divider-bottom.divider-bottom { position: relative; overflow: visible; margin-block-end: calc(var(--divider-gap) * 2); } .divider-bottom.divider-bottom::after { inset-block-end: calc(var(--divider-gap) * -1 - var(--divider-size)); } .divider-bottom.divider-bottom::after { content: ""; display: block; position: absolute; inset-inline-start: 0; inline-size: var(--divider-inline-size); border-block-end: var(--divider); } .divider-top.divider-top { position: relative; overflow: visible; margin-block-start: calc(var(--divider-gap) * 2); } .divider-top.divider-top::after { inset-block-start: calc(var(--divider-gap) * -1 - var(--divider-size)); } .divider-top.divider-top::after { content: ""; display: block; position: absolute; inset-inline-start: 0; inline-size: var(--divider-inline-size); border-block-end: var(--divider); } .divider--all.divider--all { row-gap: 0; } .divider--all.divider--all > *:not(:last-child) { position: relative; overflow: visible; margin-block-end: calc(var(--divider-gap) * 2); } .divider--all.divider--all > *:not(:last-child)::after { inset-block-end: calc(var(--divider-gap) * -1 - var(--divider-size)); } .divider--all.divider--all > *:not(:last-child)::after { content: ""; display: block; position: absolute; inset-inline-start: 0; inline-size: var(--divider-inline-size); border-block-end: var(--divider); } a[class*="link--"], [class*="link--"] a, button[class*="link--"], [class*="link--"] button { color: var(--link-color); text-decoration-color: var(--link-color); } a[class*="link--"]:hover, [class*="link--"] a:hover, button[class*="link--"]:hover, [class*="link--"] button:hover { color: var(--link-color-hover); text-decoration-color: var(--link-color-hover); } button[class*="link--"], [class*="link--"] button { background: transparent; } .link--primary { --link-color: var(--primary); --link-color-hover: var(--primary-hover); } .link-hover--primary.link-hover--primary { --link-color-hover: var(--primary); } .link--primary-hover { --link-color: var(--primary-hover); --link-color-hover: var(--primary-hover-hover); } .link-hover--primary-hover.link-hover--primary-hover { --link-color-hover: var(--primary-hover); } .link--primary-ultra-light { --link-color: var(--primary-ultra-light); --link-color-hover: var(--primary-ultra-light-hover); } .link-hover--primary-ultra-light.link-hover--primary-ultra-light { --link-color-hover: var(--primary-ultra-light); } .link--primary-light { --link-color: var(--primary-light); --link-color-hover: var(--primary-light-hover); } .link-hover--primary-light.link-hover--primary-light { --link-color-hover: var(--primary-light); } .link--primary-semi-light { --link-color: var(--primary-semi-light); --link-color-hover: var(--primary-semi-light-hover); } .link-hover--primary-semi-light.link-hover--primary-semi-light { --link-color-hover: var(--primary-semi-light); } .link--primary-semi-dark { --link-color: var(--primary-semi-dark); --link-color-hover: var(--primary-semi-dark-hover); } .link-hover--primary-semi-dark.link-hover--primary-semi-dark { --link-color-hover: var(--primary-semi-dark); } .link--primary-dark { --link-color: var(--primary-dark); --link-color-hover: var(--primary-dark-hover); } .link-hover--primary-dark.link-hover--primary-dark { --link-color-hover: var(--primary-dark); } .link--primary-ultra-dark { --link-color: var(--primary-ultra-dark); --link-color-hover: var(--primary-ultra-dark-hover); } .link-hover--primary-ultra-dark.link-hover--primary-ultra-dark { --link-color-hover: var(--primary-ultra-dark); } .link--secondary { --link-color: var(--secondary); --link-color-hover: var(--secondary-hover); } .link-hover--secondary.link-hover--secondary { --link-color-hover: var(--secondary); } .link--secondary-hover { --link-color: var(--secondary-hover); --link-color-hover: var(--secondary-hover-hover); } .link-hover--secondary-hover.link-hover--secondary-hover { --link-color-hover: var(--secondary-hover); } .link--secondary-ultra-light { --link-color: var(--secondary-ultra-light); --link-color-hover: var(--secondary-ultra-light-hover); } .link-hover--secondary-ultra-light.link-hover--secondary-ultra-light { --link-color-hover: var(--secondary-ultra-light); } .link--secondary-light { --link-color: var(--secondary-light); --link-color-hover: var(--secondary-light-hover); } .link-hover--secondary-light.link-hover--secondary-light { --link-color-hover: var(--secondary-light); } .link--secondary-semi-light { --link-color: var(--secondary-semi-light); --link-color-hover: var(--secondary-semi-light-hover); } .link-hover--secondary-semi-light.link-hover--secondary-semi-light { --link-color-hover: var(--secondary-semi-light); } .link--secondary-semi-dark { --link-color: var(--secondary-semi-dark); --link-color-hover: var(--secondary-semi-dark-hover); } .link-hover--secondary-semi-dark.link-hover--secondary-semi-dark { --link-color-hover: var(--secondary-semi-dark); } .link--secondary-dark { --link-color: var(--secondary-dark); --link-color-hover: var(--secondary-dark-hover); } .link-hover--secondary-dark.link-hover--secondary-dark { --link-color-hover: var(--secondary-dark); } .link--secondary-ultra-dark { --link-color: var(--secondary-ultra-dark); --link-color-hover: var(--secondary-ultra-dark-hover); } .link-hover--secondary-ultra-dark.link-hover--secondary-ultra-dark { --link-color-hover: var(--secondary-ultra-dark); } .link--tertiary { --link-color: var(--tertiary); --link-color-hover: var(--tertiary-hover); } .link-hover--tertiary.link-hover--tertiary { --link-color-hover: var(--tertiary); } .link--tertiary-hover { --link-color: var(--tertiary-hover); --link-color-hover: var(--tertiary-hover-hover); } .link-hover--tertiary-hover.link-hover--tertiary-hover { --link-color-hover: var(--tertiary-hover); } .link--tertiary-ultra-light { --link-color: var(--tertiary-ultra-light); --link-color-hover: var(--tertiary-ultra-light-hover); } .link-hover--tertiary-ultra-light.link-hover--tertiary-ultra-light { --link-color-hover: var(--tertiary-ultra-light); } .link--tertiary-light { --link-color: var(--tertiary-light); --link-color-hover: var(--tertiary-light-hover); } .link-hover--tertiary-light.link-hover--tertiary-light { --link-color-hover: var(--tertiary-light); } .link--tertiary-semi-light { --link-color: var(--tertiary-semi-light); --link-color-hover: var(--tertiary-semi-light-hover); } .link-hover--tertiary-semi-light.link-hover--tertiary-semi-light { --link-color-hover: var(--tertiary-semi-light); } .link--tertiary-semi-dark { --link-color: var(--tertiary-semi-dark); --link-color-hover: var(--tertiary-semi-dark-hover); } .link-hover--tertiary-semi-dark.link-hover--tertiary-semi-dark { --link-color-hover: var(--tertiary-semi-dark); } .link--tertiary-dark { --link-color: var(--tertiary-dark); --link-color-hover: var(--tertiary-dark-hover); } .link-hover--tertiary-dark.link-hover--tertiary-dark { --link-color-hover: var(--tertiary-dark); } .link--tertiary-ultra-dark { --link-color: var(--tertiary-ultra-dark); --link-color-hover: var(--tertiary-ultra-dark-hover); } .link-hover--tertiary-ultra-dark.link-hover--tertiary-ultra-dark { --link-color-hover: var(--tertiary-ultra-dark); } .link--accent { --link-color: var(--accent); --link-color-hover: var(--accent-hover); } .link-hover--accent.link-hover--accent { --link-color-hover: var(--accent); } .link--accent-hover { --link-color: var(--accent-hover); --link-color-hover: var(--accent-hover-hover); } .link-hover--accent-hover.link-hover--accent-hover { --link-color-hover: var(--accent-hover); } .link--accent-ultra-light { --link-color: var(--accent-ultra-light); --link-color-hover: var(--accent-ultra-light-hover); } .link-hover--accent-ultra-light.link-hover--accent-ultra-light { --link-color-hover: var(--accent-ultra-light); } .link--accent-light { --link-color: var(--accent-light); --link-color-hover: var(--accent-light-hover); } .link-hover--accent-light.link-hover--accent-light { --link-color-hover: var(--accent-light); } .link--accent-semi-light { --link-color: var(--accent-semi-light); --link-color-hover: var(--accent-semi-light-hover); } .link-hover--accent-semi-light.link-hover--accent-semi-light { --link-color-hover: var(--accent-semi-light); } .link--accent-semi-dark { --link-color: var(--accent-semi-dark); --link-color-hover: var(--accent-semi-dark-hover); } .link-hover--accent-semi-dark.link-hover--accent-semi-dark { --link-color-hover: var(--accent-semi-dark); } .link--accent-dark { --link-color: var(--accent-dark); --link-color-hover: var(--accent-dark-hover); } .link-hover--accent-dark.link-hover--accent-dark { --link-color-hover: var(--accent-dark); } .link--accent-ultra-dark { --link-color: var(--accent-ultra-dark); --link-color-hover: var(--accent-ultra-dark-hover); } .link-hover--accent-ultra-dark.link-hover--accent-ultra-dark { --link-color-hover: var(--accent-ultra-dark); } .link--neutral { --link-color: var(--neutral); --link-color-hover: var(--neutral-hover); } .link-hover--neutral.link-hover--neutral { --link-color-hover: var(--neutral); } .link--neutral-hover { --link-color: var(--neutral-hover); --link-color-hover: var(--neutral-hover-hover); } .link-hover--neutral-hover.link-hover--neutral-hover { --link-color-hover: var(--neutral-hover); } .link--neutral-ultra-light { --link-color: var(--neutral-ultra-light); --link-color-hover: var(--neutral-ultra-light-hover); } .link-hover--neutral-ultra-light.link-hover--neutral-ultra-light { --link-color-hover: var(--neutral-ultra-light); } .link--neutral-light { --link-color: var(--neutral-light); --link-color-hover: var(--neutral-light-hover); } .link-hover--neutral-light.link-hover--neutral-light { --link-color-hover: var(--neutral-light); } .link--neutral-semi-light { --link-color: var(--neutral-semi-light); --link-color-hover: var(--neutral-semi-light-hover); } .link-hover--neutral-semi-light.link-hover--neutral-semi-light { --link-color-hover: var(--neutral-semi-light); } .link--neutral-semi-dark { --link-color: var(--neutral-semi-dark); --link-color-hover: var(--neutral-semi-dark-hover); } .link-hover--neutral-semi-dark.link-hover--neutral-semi-dark { --link-color-hover: var(--neutral-semi-dark); } .link--neutral-dark { --link-color: var(--neutral-dark); --link-color-hover: var(--neutral-dark-hover); } .link-hover--neutral-dark.link-hover--neutral-dark { --link-color-hover: var(--neutral-dark); } .link--neutral-ultra-dark { --link-color: var(--neutral-ultra-dark); --link-color-hover: var(--neutral-ultra-dark-hover); } .link-hover--neutral-ultra-dark.link-hover--neutral-ultra-dark { --link-color-hover: var(--neutral-ultra-dark); } .link--white { --link-color: var(--white); --link-color-hover: var(--white-hover); } .link-hover--white.link-hover--white { --link-color-hover: var(--white); } .link--black { --link-color: var(--black); --link-color-hover: var(--black-hover); } .link-hover--black.link-hover--black { --link-color-hover: var(--black); } .transition { transition: var(--transition); } .fade--block { --fade-amount: 25%; -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black var(--fade-amount), black calc(100% - var(--fade-amount)), transparent 100%); mask-image: linear-gradient(to bottom, transparent 0%, black var(--fade-amount), black calc(100% - var(--fade-amount)), transparent 100%); } .fade--inline { --fade-amount: 25%; -webkit-mask-image: linear-gradient(to right, transparent 0%, black var(--fade-amount), black calc(100% - var(--fade-amount)), transparent 100%); mask-image: linear-gradient(to right, transparent 0%, black var(--fade-amount), black calc(100% - var(--fade-amount)), transparent 100%); } .fade--top { --fade-amount: 25%; -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black var(--fade-amount)); mask-image: linear-gradient(to bottom, transparent 0%, black var(--fade-amount)); } .fade--right { --fade-amount: 25%; -webkit-mask-image: linear-gradient(to left, transparent 0%, black var(--fade-amount)); mask-image: linear-gradient(to left, transparent 0%, black var(--fade-amount)); } .fade--bottom { --fade-amount: 25%; -webkit-mask-image: linear-gradient(to top, transparent 0%, black var(--fade-amount)); mask-image: linear-gradient(to top, transparent 0%, black var(--fade-amount)); } .fade--left { --fade-amount: 25%; -webkit-mask-image: linear-gradient(to right, transparent 0%, black var(--fade-amount)); mask-image: linear-gradient(to right, transparent 0%, black var(--fade-amount)); }  :root { --x-page-block-width: 100%; --x-post-block-width: 767px; } .x-block-button[class*="btn--"] { padding: 0 !important; background-color: transparent !important; min-inline-size: 0 !important; border: 0 !important; } .btn--primary { --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .btn--primary-dark { --btn-background: var(--primary-dark); --btn-background-hover: var(--primary-ultra-dark); --btn-text-color: var(--primary-ultra-light); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-color: var(--primary-dark); --btn-border-color-hover: var(--primary-ultra-dark); --focus-color: var(--primary-semi-dark); } .btn--primary-light { --btn-background: var(--primary-ultra-light); --btn-background-hover: var(--primary-light); --btn-text-color: var(--primary); --btn-text-color-hover: var(--primary-ultra-dark); --btn-border-color: var(--primary-ultra-light); --btn-border-color-hover: var(--primary-light); --focus-color: var(--primary-light); } .btn--primary.btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-hover); --btn-text-color: var(--primary-ultra-light); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .btn--primary-dark.btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-dark); --btn-text-color: var(--primary-dark); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--primary-dark); --btn-border-color-hover: var(--primary-dark); --focus-color: var(--primary-light); } .btn--primary-light.btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-light); --btn-text-color: var(--primary-light); --btn-text-color-hover: var(--primary-dark); --btn-border-width: 2px; --btn-border-color: var(--primary-light); --btn-border-color-hover: var(--primary-light); --focus-color: var(--primary-light); } .btn--secondary { --btn-background: var(--secondary); --btn-background-hover: var(--secondary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--secondary); --btn-border-color-hover: var(--secondary-hover); --focus-color: var(--secondary-light); } .btn--secondary-dark { --btn-background: var(--secondary-dark); --btn-background-hover: var(--secondary-ultra-dark); --btn-text-color: var(--secondary-ultra-light); --btn-text-color-hover: var(--secondary-ultra-light); --btn-border-color: var(--secondary-dark); --btn-border-color-hover: var(--secondary-ultra-dark); --focus-color: var(--secondary-semi-dark); } .btn--secondary-light { --btn-background: var(--secondary-ultra-light); --btn-background-hover: var(--secondary-light); --btn-text-color: var(--secondary); --btn-text-color-hover: var(--secondary-ultra-dark); --btn-border-color: var(--secondary-ultra-light); --btn-border-color-hover: var(--secondary-light); --focus-color: var(--secondary-light); } .btn--secondary.btn--outline { --btn-background: transparent; --btn-background-hover: var(--secondary-hover); --btn-text-color: var(--secondary); --btn-text-color-hover: var(--secondary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--secondary); --btn-border-color-hover: var(--secondary-hover); --focus-color: var(--secondary-light); } .btn--secondary-dark.btn--outline { --btn-background: transparent; --btn-background-hover: var(--secondary-dark); --btn-text-color: var(--secondary-dark); --btn-text-color-hover: var(--secondary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--secondary-dark); --btn-border-color-hover: var(--secondary-dark); --focus-color: var(--secondary-light); } .btn--secondary-light.btn--outline { --btn-background: transparent; --btn-background-hover: var(--secondary-light); --btn-text-color: var(--secondary-light); --btn-text-color-hover: var(--secondary-dark); --btn-border-width: 2px; --btn-border-color: var(--secondary-light); --btn-border-color-hover: var(--secondary-light); --focus-color: var(--secondary-light); } .btn--accent { --btn-background: var(--accent); --btn-background-hover: var(--accent-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--accent); --btn-border-color-hover: var(--accent-hover); --focus-color: var(--accent-light); } .btn--neutral { --btn-background: var(--neutral); --btn-background-hover: var(--neutral-dark); --btn-text-color: var(--neutral-ultra-light); --btn-text-color-hover: var(--neutral-ultra-light); --btn-border-color: var(--neutral); --btn-border-color-hover: var(--neutral-dark); --focus-color: var(--primary); } .btn--black { --btn-background: var(--black); --btn-background-hover: var(--neutral-dark); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--black); --btn-border-color-hover: var(--neutral-dark); --focus-color: var(--primary); } .btn--black.btn--outline { --btn-background: transparent; --btn-background-hover: var(--black); --btn-text-color: var(--black); --btn-text-color-hover: var(--white); --btn-border-width: 2px; --btn-border-color: var(--black); --btn-border-color-hover: var(--black); --focus-color: var(--primary); } .btn--white { --btn-background: var(--white); --btn-background-hover: var(--neutral-light); --btn-text-color: var(--black); --btn-text-color-hover: var(--black); --btn-border-color: var(--white); --btn-border-color-hover: var(--neutral-light); --focus-color: var(--primary); } .btn--white.btn--outline { --btn-background: transparent; --btn-background-hover: var(--white); --btn-text-color: var(--white); --btn-text-color-hover: var(--black); --btn-border-width: 2px; --btn-border-color: var(--white); --btn-border-color-hover: var(--white); --focus-color: var(--primary); } [class*="btn--"]:not(.btn--none, .x-block-button), .x-block-button[class*="btn--"] > .x-block-button__link, .x-block-button[class*="btn--"] > a { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); } @media (hover: hover) and (pointer: fine) { [class*="btn--"]:not(.btn--none, .x-block-button):hover, .x-block-button[class*="btn--"] > .x-block-button__link:hover, .x-block-button[class*="btn--"] > a:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } [class*="btn--"]:not(.btn--none, .x-block-button):focus, .x-block-button[class*="btn--"] > .x-block-button__link:focus, .x-block-button[class*="btn--"] > a:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .btn--xs:not(.x-block-button), .x-block-button.btn--xs > a, .x-block-button.btn--xs > .x-block-button__link { font-size: var(--text-xs); } .btn--s:not(.x-block-button), .x-block-button.btn--s > a, .x-block-button.btn--s > .x-block-button__link { font-size: var(--text-s); } .btn--m:not(.x-block-button), .x-block-button.btn--m > a, .x-block-button.btn--m > .x-block-button__link { font-size: var(--text-m); } .btn--l:not(.x-block-button), .x-block-button.btn--l > a, .x-block-button.btn--l > .x-block-button__link { font-size: var(--text-l); } .btn--xl:not(.x-block-button), .x-block-button.btn--xl > a, .x-block-button.btn--xl > .x-block-button__link { font-size: var(--text-xl); } .btn--xxl:not(.x-block-button), .x-block-button.btn--xxl > a, .x-block-button.btn--xxl > .x-block-button__link { font-size: var(--text-xxl); } a[class*="btn--"] { display: inline-flex; } .btn--clear.btn--clear, .btn--none.btn--none { background: none; border: none; } .editor-styles-wrapper { width: 100% !important; } :root{--x--preset--aspect-ratio--square: 1;--x--preset--aspect-ratio--4-3: 4/3;--x--preset--aspect-ratio--3-4: 3/4;--x--preset--aspect-ratio--3-2: 3/2;--x--preset--aspect-ratio--2-3: 2/3;--x--preset--aspect-ratio--16-9: 16/9;--x--preset--aspect-ratio--9-16: 9/16;--x--preset--color--black: #000000;--x--preset--color--cyan-bluish-gray: #abb8c3;--x--preset--color--white: #ffffff;--x--preset--color--pale-pink: #f78da7;--x--preset--color--vivid-red: #cf2e2e;--x--preset--color--luminous-vivid-orange: #ff6900;--x--preset--color--luminous-vivid-amber: #fcb900;--x--preset--color--light-green-cyan: #7bdcb5;--x--preset--color--vivid-green-cyan: #00d084;--x--preset--color--pale-cyan-blue: #8ed1fc;--x--preset--color--vivid-cyan-blue: #0693e3;--x--preset--color--vivid-purple: #9b51e0;--x--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgb(6,147,227) 0%,rgb(155,81,224) 100%);--x--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--x--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgb(252,185,0) 0%,rgb(255,105,0) 100%);--x--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgb(255,105,0) 0%,rgb(207,46,46) 100%);--x--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--x--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--x--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--x--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--x--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--x--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--x--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--x--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--x--preset--font-size--small: 13px;--x--preset--font-size--medium: 20px;--x--preset--font-size--large: 36px;--x--preset--font-size--x-large: 42px;--x--preset--spacing--20: 0.44rem;--x--preset--spacing--30: 0.67rem;--x--preset--spacing--40: 1rem;--x--preset--spacing--50: 1.5rem;--x--preset--spacing--60: 2.25rem;--x--preset--spacing--70: 3.38rem;--x--preset--spacing--80: 5.06rem;--x--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--x--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--x--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--x--preset--shadow--outlined: 6px 6px 0px -3px rgb(255, 255, 255), 6px 6px rgb(0, 0, 0);--x--preset--shadow--crisp: 6px 6px 0px rgb(0, 0, 0);}:where(.is-layout-flex){gap: 0.5em;}:where(.is-layout-grid){gap: 0.5em;}body .is-layout-flex{display: flex;}.is-layout-flex{flex-wrap: wrap;align-items: center;}.is-layout-flex > :is(*, div){margin: 0;}body .is-layout-grid{display: grid;}.is-layout-grid > :is(*, div){margin: 0;}:where(.x-block-columns.is-layout-flex){gap: 2em;}:where(.x-block-columns.is-layout-grid){gap: 2em;}:where(.x-block-post-template.is-layout-flex){gap: 1.25em;}:where(.x-block-post-template.is-layout-grid){gap: 1.25em;}.has-black-color{color: var(--x--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--x--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--x--preset--color--white) !important;}.has-pale-pink-color{color: var(--x--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--x--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--x--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--x--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--x--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--x--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--x--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--x--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--x--preset--color--vivid-purple) !important;}.has-black-background-color{background-color: var(--x--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--x--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--x--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--x--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--x--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--x--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--x--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--x--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--x--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--x--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--x--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--x--preset--color--vivid-purple) !important;}.has-black-border-color{border-color: var(--x--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--x--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--x--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--x--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--x--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--x--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--x--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--x--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--x--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--x--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--x--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--x--preset--color--vivid-purple) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--x--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--x--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--x--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--x--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--x--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--x--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--x--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--x--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--x--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--x--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--x--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--x--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--x--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--x--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--x--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--x--preset--font-size--x-large) !important;}  .x-grid-builder:not(.wpgb-template),.wpgb-facet{opacity:0.01}.wpgb-facet fieldset{margin:0;padding:0;border:none;outline:none;box-shadow:none}.wpgb-facet fieldset:last-child{margin-bottom:40px;}.wpgb-facet fieldset legend.wpgb-sr-only{height:1px;width:1px}  @layer bricks.reset, bricks.gutenberg, bricks.icons;@layer bricks{:root{--bricks-vh:1vh;--bricks-transition:all 0.2s;--bricks-color-primary:#ffd64f;--bricks-color-secondary:#fc5778;--bricks-text-dark:#212121;--bricks-text-medium:#616161;--bricks-text-light:#9e9e9e;--bricks-text-info:#00b0f4;--bricks-text-success:#11b76b;--bricks-text-warning:#ffa100;--bricks-text-danger:#fa4362;--bricks-bg-info:#e5f3ff;--bricks-bg-success:#e6f6ed;--bricks-bg-warning:#fff2d7;--bricks-bg-danger:#ffe6ec;--bricks-bg-dark:#263238;--bricks-bg-light:#f5f6f7;--bricks-border-color:#dddedf;--bricks-border-radius:4px;--bricks-tooltip-bg:#23282d;--bricks-tooltip-text:#eaecef}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes scrolling{0%{opacity:1}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;line-height:1.15}body{margin:0}article,aside,figcaption,figure,footer,header,main,nav,section{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}code,kbd,samp{font-family:monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.brxe-section{align-items:center;display:flex;flex-direction:column;margin-left:auto;margin-right:auto;width:100%}@media (max-width:767px){.brxe-section{flex-wrap:wrap}}.brxe-section.has-bg-video{position:relative;z-index:1}.brxe-section.has-shape{position:relative}.brxe-section.bricks-lazy-hidden{background-image:none!important}.brxe-container{align-items:flex-start;display:flex;flex-direction:column;margin-left:auto;margin-right:auto;width:1100px}@media (max-width:767px){.brxe-container{flex-wrap:wrap}}.brxe-container.has-bg-video{position:relative;z-index:1}.brxe-container.has-shape{position:relative}.brxe-container.bricks-lazy-hidden{background-image:none!important}.brxe-block{align-items:flex-start;display:flex;flex-direction:column;width:100%}@media (max-width:767px){.brxe-block{flex-wrap:wrap}}.brxe-block.has-bg-video{position:relative;z-index:1}.brxe-block.has-shape{position:relative}.brxe-block.bricks-lazy-hidden{background-image:none!important}.brxe-div.has-bg-video{position:relative;z-index:1}.brxe-div.has-shape{position:relative}.brxe-div.bricks-lazy-hidden{background-image:none!important}[class*=brxe-]{max-width:100%}:where([class*=brxe-].has-shape>*){position:relative}svg:not([width]){min-width:1em}svg:not([height]){min-height:1em}svg.fill *{fill:inherit}svg.stroke *{stroke:inherit}span[class*=brxe-]:not(.brxe-section):not(.brxe-container):not(.brxe-block):not(.brxe-div){width:auto}.bricks-element-placeholder{align-items:stretch;background-color:var(--bricks-bg-info);color:var(--bricks-text-info);display:flex;font-family:monospace;font-size:16px;font-weight:700;height:auto!important;line-height:1.4;max-width:100%!important;opacity:1!important;text-align:left;width:auto!important}.bricks-element-placeholder.no-php-class{padding:15px}.bricks-element-placeholder.no-php-class,.bricks-element-placeholder[data-type=error]{background-color:var(--bricks-bg-danger);color:var(--bricks-text-danger)}.bricks-element-placeholder[data-type=error] i{background-color:var(--bricks-text-danger)}.bricks-element-placeholder i{align-items:center;background-color:var(--bricks-text-info);color:#fff;display:flex!important;flex-direction:column;font-size:30px!important;justify-content:center;min-height:60px;min-width:80px;padding:0 15px}.bricks-element-placeholder a{text-decoration:underline}.bricks-element-placeholder .placeholder-inner{display:flex;flex-direction:column;justify-content:center;padding:15px 20px}.bricks-element-placeholder .placeholder-title{align-items:center;display:flex;font-size:17px;margin:0}.bricks-element-placeholder .placeholder-description{font-size:14px;margin-top:.5em}#brx-footer{background-position:50%;background-size:cover;flex-shrink:0;margin-top:auto;position:relative;width:100%}body.admin-bar .brx-popup:not(.brx-infobox-popup):not(.brx-infobox-popup-builder){height:calc(var(--bricks-vh, 1vh)*100 - var(--x-admin--admin-bar--height, 0));top:var(--x-admin--admin-bar--height,0)}.brx-popup:not(.brx-infobox-popup):not(.brx-infobox-popup-builder){align-items:center;display:flex;flex-direction:column;height:100vh;height:calc(var(--bricks-vh, 1vh)*100);justify-content:center;left:0;position:fixed!important;top:0;width:100%;z-index:10000}.brx-popup:not(.brx-infobox-popup):not(.brx-infobox-popup-builder) .brx-popup-backdrop{background-color:rgba(0,0,0,.5);bottom:0;left:0;opacity:1;position:absolute;right:0;top:0;transition:all 1s ease-in-out;visibility:visible}.brx-popup:not(.brx-infobox-popup):not(.brx-infobox-popup-builder).builder{z-index:999}.brx-popup:not(.brx-infobox-popup):not(.brx-infobox-popup-builder).hide{opacity:0;pointer-events:none;visibility:hidden}.brx-popup:not(.brx-infobox-popup):not(.brx-infobox-popup-builder).hide .brx-popup-backdrop{opacity:0;visibility:hidden}.brx-infobox-popup-builder{--brx-info-box-width:300px;display:flex;flex-direction:column;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)!important;width:var(--brx-info-box-width)}.brx-popup-content{background-color:#fff;margin:0;max-width:100%;overflow-y:auto;padding:30px;z-index:1}.brx-popup-content.brx-woo-quick-view{width:auto}html{font-size:62.5%}*,:after,:before,html{box-sizing:border-box}:after,:before{outline:none}*{border-color:var(--bricks-border-color)}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fff;background-position:50%;color:#363636;font-family:-apple-system,"system-ui",Segoe UI,roboto,helvetica,arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:15px;line-height:1.7;transition:var(--bricks-transition);transition:padding-top 0s}body.no-scroll{overflow:hidden}body.brx-boxed{margin:0 auto;min-height:100vh}.brx-body{display:flex;flex-direction:column;margin:0 auto;width:100%}:where(a){border-color:currentcolor;color:currentcolor;cursor:pointer;text-decoration:none}h1,h2,h3,h4,h5,h6{margin:0;text-rendering:optimizelegibility}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:currentcolor}h1{font-size:2.4em}h1,h2{line-height:1.4}h2{font-size:2.1em}h3{font-size:1.8em}h3,h4{line-height:1.4}h4{font-size:1.6em}h5{font-size:1.3em}h5,h6{line-height:1.4}h6{font-size:1.1em}:where(p){margin-block:0 1.2em}:where(p:last-of-type){margin-block-end:0}:where(p:last-of-type)+h1,:where(p:last-of-type)+h2,:where(p:last-of-type)+h3,:where(p:last-of-type)+h4,:where(p:last-of-type)+h5,:where(p:last-of-type)+h6{margin-block:1.2em 0}figcaption{color:var(--bricks-text-light);font-size:.9em;margin:1em 0;text-align:center}img{height:auto;max-width:100%;outline:none;vertical-align:middle}.bricks-lazy-hidden.wait,.bricks-lazy-load-isotope.wait{background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzgiIGhlaWdodD0iMzgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjZmZmIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxIDEpIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGNpcmNsZSBzdHJva2Utb3BhY2l0eT0iLjUiIGN4PSIxOCIgY3k9IjE4IiByPSIxOCIvPjxwYXRoIGQ9Ik0zNiAxOGMwLTkuOTQtOC4wNi0xOC0xOC0xOCI+PGFuaW1hdGVUcmFuc2Zvcm0gYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIGZyb209IjAgMTggMTgiIHRvPSIzNjAgMTggMTgiIGR1cj0iMXMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIi8+PC9wYXRoPjwvZz48L3N2Zz4=")!important;background-position:50% 50%;background-repeat:no-repeat;background-size:32px;filter:brightness(.5);transition:all 0s}audio,iframe{max-width:100%}button{border:none;cursor:pointer;outline:none;padding:0}blockquote{border-left-style:solid;border-left-width:4px;font-family:georgia,Times New Roman,times,serif;font-size:1.3em;margin:15px 0;padding:0 0 0 30px;position:relative}blockquote cite{display:block;font-size:.8em;font-style:normal;margin-top:.5em;opacity:.5;text-transform:uppercase}hr{border:none;border-top:1px solid var(--bricks-border-color);margin:1em 0}pre{background-color:var(--bricks-bg-light);color:#fc1f49;font-family:monospace;font-size:13px;margin:0;padding:10px 15px;white-space:pre-wrap}table{width:100%}table[class*=brxe-]{display:table}label{color:var(--bricks-text-light);display:block;font-weight:400;margin-bottom:5px}button,input,optgroup,select,textarea{font-family:inherit;text-align:inherit}.input,input:not([type=submit]),select,textarea{border-style:solid;border-width:1px;box-shadow:none;color:currentcolor;font-size:inherit;line-height:40px;outline:none;padding:0 12px;transition:var(--bricks-transition);width:100%}input[type=range]{border:none;height:auto;line-height:1;padding:0}input[type=button],input[type=checkbox],input[type=radio]{width:auto}input[type=checkbox],input[type=radio],input[type=submit],select{cursor:pointer}select{appearance:none;-webkit-appearance:none;background-color:transparent;background-image:linear-gradient(45deg,transparent 50%,gray 0),linear-gradient(135deg,gray 50%,transparent 0);background-position:calc(100% - 20px) calc(50% + 2px),calc(100% - 16px) calc(50% + 2px);background-repeat:no-repeat;background-size:4px 4px,4px 4px;border-radius:0}textarea{height:auto;line-height:inherit!important;min-height:90px;padding:10px 12px}::placeholder{color:var(--bricks-border-color)}.skip-link{clip:rect(1px,1px,1px,1px);background:#000;border-bottom-right-radius:8px;color:#fff;font-weight:700;height:1px;left:0;overflow:hidden;padding:5px 10px;position:absolute;top:0;transition:transform .1s;white-space:nowrap;width:1px;z-index:9999}.skip-link:focus{clip:auto;height:auto;overflow:visible;width:auto}body.bricks-is-frontend :focus-visible{outline:auto}@supports not selector(:focus-visible){body.bricks-is-frontend :focus{outline:auto}}.bricks-archive-title-wrapper{margin:60px auto;text-align:center}.bricks-archive-title-wrapper .title{margin:0}.brx-has-megamenu.open .brx-megamenu{opacity:1;visibility:visible}.brx-megamenu{left:0;opacity:0;position:absolute;transition-duration:.2s;transition-property:opacity,transform,visibility;transition-timing-function:ease;visibility:hidden;width:100%;z-index:998}.brx-megamenu:not(.brx-submenu-positioned){display:none!important}.brx-has-multilevel .open>ul,.brx-has-multilevel.open>ul{opacity:1;transform:translate(0);visibility:visible}.brx-has-multilevel .open.active,.brx-has-multilevel .open.active>ul>li,.brx-has-multilevel.open.active,.brx-has-multilevel.open.active>ul>li{display:flex}.brx-has-multilevel .menu-item a{width:100%}.brx-has-multilevel .open:not(.active)>.brx-submenu-toggle{display:none}.brx-has-multilevel>ul ul{transform:translate(20px);transition:transform .1s cubic-bezier(0,0,.2,1);will-change:transform}.brx-has-multilevel ul:not(.brx-multilevel-overflow-right){left:0!important}.brx-has-multilevel ul .active>.brx-submenu-toggle,.brx-has-multilevel ul li:not(.open){display:none}.brx-submenu-toggle{align-items:center;cursor:pointer;display:flex}.brx-submenu-toggle.icon-right button{margin-left:10px}.brx-submenu-toggle.icon-left{flex-direction:row-reverse}.brx-submenu-toggle.icon-left button{margin-right:10px}.brx-submenu-toggle button,.brx-submenu-toggle button>*{align-items:center;background-color:transparent;color:currentcolor;display:flex;transition:transform .1s cubic-bezier(0,0,.2,1);will-change:transform}.brx-multilevel-overflow-right,.brx-multilevel-overflow-right ul,.brx-submenu-overflow-right{left:auto!important;right:0!important}.brx-sub-submenu-overflow-right,.brx-sub-submenu-overflow-right ul,.brx-submenu-overflow-right ul{left:auto!important;right:100%!important}#brx-content{flex:1;position:relative;width:100%}#brx-content .post-password-form{margin:0 auto}#brx-content .post-password-form p:last-child{align-items:flex-end;column-gap:10px;display:flex}#brx-content .post-password-form p:last-child label{flex:1;margin:0}#brx-content .post-password-form input[type=submit]{border-width:1px;display:inline-flex;padding:.5em 1em}#brx-content>.woocommerce{margin-left:auto;margin-right:auto}.bricks-layout-wrapper{--columns:3;--gutter:0px;display:flex;flex-flow:row wrap;list-style-type:none;margin:0;padding:0}.bricks-layout-wrapper:not(.bricks-masonry){width:100%}.bricks-layout-wrapper .meta{color:var(--bricks-text-light)}.bricks-layout-item{line-height:1.6;position:relative}.bricks-layout-item:last-child img{padding-bottom:0!important}.bricks-layout-item .content-wrapper,.bricks-layout-item .overlay-wrapper{align-items:baseline;bottom:0;display:flex;flex-direction:column;flex-wrap:wrap;height:100%;left:0;position:relative;right:0;top:0;z-index:1}.bricks-layout-item .content-wrapper.top,.bricks-layout-item .overlay-wrapper.top{justify-content:flex-start}.bricks-layout-item .content-wrapper.middle,.bricks-layout-item .overlay-wrapper.middle{justify-content:center;margin-bottom:auto;margin-top:auto}.bricks-layout-item .content-wrapper.bottom,.bricks-layout-item .overlay-wrapper.bottom{justify-content:flex-end}.bricks-layout-item .content-wrapper.left,.bricks-layout-item .overlay-wrapper.left{align-items:flex-start;text-align:left}.bricks-layout-item .content-wrapper.center,.bricks-layout-item .overlay-wrapper.center{align-items:center;text-align:center}.bricks-layout-item .content-wrapper.right,.bricks-layout-item .overlay-wrapper.right{align-items:flex-end;text-align:right}.bricks-layout-item .content-wrapper.center.middle,.bricks-layout-item .overlay-wrapper.center.middle{margin-bottom:auto;margin-top:auto}.bricks-layout-item .overlay-wrapper{position:absolute!important;z-index:2}.bricks-layout-item .overlay-wrapper.show-on-hover{opacity:0;position:relative;transition:var(--bricks-transition)}.bricks-layout-item .overlay-wrapper.show-on-hover:hover{opacity:1}.bricks-layout-item .overlay-wrapper.show-on-hover .overlay-inner{transition:var(--bricks-transition);will-change:transform}.bricks-layout-item .overlay-wrapper.show-on-hover.fade-in-up .overlay-inner{transform:translateY(10px)}.bricks-layout-item .overlay-wrapper.show-on-hover.fade-in-up:hover .overlay-inner{transform:translateY(0)}.bricks-layout-item .overlay-wrapper.show-on-hover.fade-in-right .overlay-inner{transform:translateX(-10px)}.bricks-layout-item .overlay-wrapper.show-on-hover.fade-in-right:hover .overlay-inner{transform:translateY(0)}.bricks-layout-item .overlay-wrapper.show-on-hover.fade-in-down .overlay-inner{transform:translateY(-10px)}.bricks-layout-item .overlay-wrapper.show-on-hover.fade-in-down:hover .overlay-inner{transform:translateY(0)}.bricks-layout-item .overlay-wrapper.show-on-hover.fade-in-left .overlay-inner{transform:translateX(10px)}.bricks-layout-item .overlay-wrapper.show-on-hover.fade-in-left:hover .overlay-inner{transform:translateY(0)}.bricks-layout-item .overlay-wrapper.show-on-hover.zoom-in .overlay-inner{transform:scale(.8)}.bricks-layout-item .overlay-wrapper.show-on-hover.zoom-in:hover .overlay-inner{transform:scale(1)}.bricks-layout-item .overlay-wrapper.show-on-hover.zoom-out .overlay-inner{transform:scale(1.2)}.bricks-layout-item .overlay-wrapper.show-on-hover.zoom-out:hover .overlay-inner{transform:scale(1)}.bricks-layout-item .dynamic{margin:0;padding:0}.bricks-layout-item .meta{width:100%}.bricks-layout-item .meta span:first-child{padding:0}.bricks-layout-item .meta span+span{padding:0 5px}.bricks-layout-item .meta span+span:before{content:" ·";left:-5px;position:relative}.bricks-layout-item .excerpt{margin-top:.5em}.bricks-layout-item .taxonomy{margin:0 -5px}.bricks-layout-item .taxonomy a{display:inline-block;line-height:2;margin:0 5px}.bricks-layout-item .bricks-layout-inner{background-position:50%;background-repeat:no-repeat;background-size:cover;bottom:0;display:flex;flex-direction:column;left:0;overflow:hidden;position:relative;right:0;top:0}li.bricks-gutter-sizer{pointer-events:none;position:absolute;top:-99999px;visibility:hidden;width:var(--gutter)!important}.bricks-layout-wrapper .image-wrapper{position:relative}.bricks-layout-wrapper .image-wrapper .overlay-wrapper{height:inherit}.bricks-layout-wrapper .image{aspect-ratio:1/1;object-fit:cover;position:relative}.bricks-layout-wrapper a{color:currentcolor}.bricks-layout-wrapper[data-layout=list]>li.bricks-layout-item{margin-bottom:var(--gutter);width:100%}.bricks-layout-wrapper[data-layout=list]>li.bricks-layout-item:last-child{margin-bottom:0}.bricks-layout-wrapper[data-layout=list] .bricks-layout-inner{flex-direction:row}.bricks-layout-wrapper[data-layout=list] .bricks-layout-inner>*{flex-basis:50%}.bricks-layout-wrapper[data-layout=list].image-position-top .bricks-layout-inner{flex-direction:row-reverse}.bricks-layout-wrapper[data-layout=list].image-position-top .bricks-layout-inner>*{flex-basis:50%}.bricks-layout-wrapper[data-layout=list].image-position-right .bricks-layout-inner{flex-direction:row-reverse!important}.bricks-layout-wrapper[data-layout=list].image-position-right .bricks-layout-inner>*{flex-basis:50%}.bricks-layout-wrapper[data-layout=list].image-position-left .bricks-layout-inner{flex-direction:row}.bricks-layout-wrapper[data-layout=list].image-position-left .bricks-layout-inner>*{flex-basis:50%}.bricks-layout-wrapper[data-layout=list].image-position-bottom .bricks-layout-inner{flex-direction:column-reverse}.bricks-layout-wrapper[data-layout=list].alternate li:nth-child(2n) .bricks-layout-inner{flex-direction:row-reverse!important}.bricks-layout-wrapper[data-layout=list].alternate.image-position-right li:nth-child(odd) .bricks-layout-inner{flex-direction:row-reverse}.bricks-layout-wrapper[data-layout=list].alternate.image-position-right li:nth-child(2n) .bricks-layout-inner{flex-direction:row}.bricks-layout-wrapper[data-layout=grid]:not(.isotope){display:grid;gap:var(--gutter);grid-template-columns:repeat(var(--columns),minmax(0,1fr))}.bricks-layout-wrapper[data-layout=grid].isotope>li:not(.bricks-gutter-sizer){margin-bottom:var(--gutter);width:calc(100%/var(--columns) - var(--gutter)*(var(--columns) - 1)/var(--columns))}.bricks-layout-wrapper[data-layout=grid]>li.bricks-layout-item,.bricks-layout-wrapper[data-layout=grid]>li.bricks-layout-item>a{display:grid}.bricks-masonry{--columns:3;--gutter:10px;display:flex;flex-flow:row wrap;position:relative}.bricks-masonry>:not(.bricks-gutter-sizer){margin-bottom:var(--gutter);width:calc(100%/var(--columns) - var(--gutter)*(var(--columns) - 1)/var(--columns))}.bricks-is-frontend .bricks-layout-wrapper.isotope{transition:opacity .3s ease-in-out}.bricks-is-frontend .bricks-layout-wrapper.isotope.isotope-before-init{opacity:0}.bricks-layout-wrapper[data-layout=masonry]>li:not(.bricks-gutter-sizer){margin-bottom:var(--gutter);width:calc(100%/var(--columns) - var(--gutter)*(var(--columns) - 1)/var(--columns))}.bricks-layout-wrapper[data-layout=masonry] .image{aspect-ratio:unset!important;display:inline-block;position:relative!important}.bricks-layout-wrapper[data-layout=masonry] .bricks-layout-inner{height:auto!important}.bricks-layout-wrapper[data-layout=metro]:not(.isotope){display:grid;gap:var(--gutter);grid-template-columns:repeat(4,minmax(0,1fr))}.bricks-layout-wrapper[data-layout=metro]:not(.isotope)>li:nth-child(3n+1){grid-column:span 2;grid-row:span 2}.bricks-layout-wrapper[data-layout=metro].isotope{--columns:4}.bricks-layout-wrapper[data-layout=metro].isotope>li.bricks-layout-item{margin-bottom:var(--gutter)}.bricks-layout-wrapper[data-layout=metro].isotope>li:nth-child(3n+1):not(.bricks-isotope-sizer){width:50%;width:calc(50% - var(--gutter)/2)}@media (max-width:478px){.bricks-layout-wrapper[data-layout=metro].isotope>li:nth-child(3n+1):not(.bricks-isotope-sizer){width:100%}}.bricks-layout-wrapper[data-layout=metro].isotope>li:nth-child(3n+1):not(.bricks-isotope-sizer) img{height:100%}.bricks-layout-wrapper[data-layout=metro].isotope>li:nth-child(3n+1):not(.bricks-isotope-sizer) .title{font-size:calc(1em + 1.5vmin)}.bricks-layout-wrapper[data-layout=metro].isotope>li{width:25%;width:calc(100%/var(--columns) - var(--gutter)*(var(--columns) - 1)/var(--columns))}@media (max-width:767px){.bricks-layout-wrapper[data-layout=metro].isotope>li{width:calc(50% - var(--gutter)/2)}}@media (max-width:478px){.bricks-layout-wrapper[data-layout=metro].isotope>li{width:100%}}.bricks-layout-wrapper[data-layout=metro] img{height:100%}.bricks-layout-wrapper[data-layout=metro] .image-wrapper{aspect-ratio:1/1}.bricks-layout-wrapper[data-layout=metro] .content-wrapper{position:absolute}#brx-header{background-position:50%;background-size:cover;position:relative;width:100%}#brx-header.transparent{background:transparent;border:none;box-shadow:none;color:#fff}#brx-header.brx-sticky{left:0;position:fixed;right:0;top:0;transition:background-color .2s,transform .4s;width:100%;z-index:998}#brx-header.brx-sticky.on-scroll{position:sticky}#brx-header.brx-sticky .bricks-nav-menu>li>a,#brx-header.brx-sticky>.brxe-block,#brx-header.brx-sticky>.brxe-container,#brx-header.brx-sticky>.brxe-div,#brx-header.brx-sticky>.brxe-section{transition:inherit}#brx-header.brx-sticky.slide-up:not(:has(.cart-detail.off-canvas.active,.brxe-offcanvas.brx-open)){-ms-overflow-style:none;overflow-x:hidden;scrollbar-width:none;transform:translateY(-101%)}#brx-header.brx-sticky.slide-up::-webkit-scrollbar{display:none}#brx-header.brx-sticky.sliding{overflow:hidden}#brx-header.brx-sticky:has(.cart-detail.off-canvas.active,.brxe-offcanvas.brx-open){transition:none}.brx-header-right #brx-header{bottom:0;display:flex;position:fixed;right:0;top:0;width:200px;z-index:998}.brx-header-right #brx-header>.brxe-container,.brx-header-right #brx-header>.brxe-div,.brx-header-right #brx-header>.brxe-section{height:100%}.brx-header-right #brx-content,.brx-header-right #brx-footer{margin-right:200px;width:auto}.brx-header-left #brx-header{bottom:0;display:flex;left:0;position:fixed;top:0;width:200px;z-index:998}.brx-header-left #brx-header>.brxe-container,.brx-header-left #brx-header>.brxe-div,.brx-header-left #brx-header>.brxe-section{height:100%}.brx-header-left #brx-content,.brx-header-left #brx-footer{margin-left:200px;width:auto}.bricks-search-form{align-items:stretch;display:flex!important;justify-content:space-between;position:relative;width:100%}.bricks-search-form label{align-self:center;margin-inline-end:10px}.bricks-search-form input[type=search]{background-color:inherit;color:currentcolor;display:inline-block;max-width:100%;padding:0 20px;width:auto}.bricks-search-form button{align-items:center;display:flex;justify-content:center;position:relative}.bricks-search-form input{line-height:40px;width:100%}.bricks-shape-divider{bottom:0;display:flex;height:100%;left:0;overflow:hidden;pointer-events:none;position:absolute!important;right:0;top:0;width:100%}.bricks-shape-divider .bricks-shape-divider-inner{align-items:inherit;height:100%;justify-content:inherit;position:absolute;width:100%}.bricks-shape-divider .bricks-shape-divider-inner svg{height:100%;min-height:unset;min-width:unset;position:relative;width:100%}.bricks-shape-divider .bricks-shape-divider-inner svg g,.bricks-shape-divider .bricks-shape-divider-inner svg path{fill:inherit}.bricks-shape-divider.front{z-index:2}.bricks-shape-divider.flip-horizontal svg{transform:rotateX(180deg)}.bricks-shape-divider.flip-vertical svg{transform:rotateY(180deg)}.bricks-shape-divider.flip-horizontal.flip-vertical svg{transform:rotateX(180deg) rotateY(180deg)}.bricks-shape-divider.overflow{overflow:visible}.bricks-button{align-items:center;border-width:0;display:inline-flex;gap:10px;justify-content:center;letter-spacing:.5px;padding:.5em 1em;text-align:center}.bricks-button.bricks-background-muted{color:var(--bricks-text-medium)}.bricks-button.bricks-background-danger,.bricks-button.bricks-background-dark,.bricks-button.bricks-background-info,.bricks-button.bricks-background-secondary,.bricks-button.bricks-background-success,.bricks-button.bricks-background-warning{color:#fff}.bricks-button.sm{font-size:.9em;padding:.4em 1em}.bricks-button.lg{font-size:1.1em;padding:.6em 1em}.bricks-button.xl{font-size:1.2em;padding:.8em 1em}.bricks-button.block{width:100%}.bricks-button.circle{border-radius:100px!important}.bricks-button.outline{background-color:transparent;border:2px solid}.bricks-button i{position:relative}body.bricks-is-frontend.admin-bar #brx-header.brx-sticky,body.bricks-is-frontend.admin-bar.brx-header-left #brx-header,body.bricks-is-frontend.admin-bar.brx-header-right #brx-header{top:var(--x-admin--admin-bar--height)}.bricks-lightbox a{cursor:zoom-in}.bricks-background-video-wrapper{background-size:cover;height:100%;left:0;overflow:hidden;pointer-events:none;position:absolute!important;top:0;width:100%;z-index:-1}.bricks-background-video-wrapper iframe,.bricks-background-video-wrapper video{border:none;height:inherit;left:50%;max-width:none;position:absolute;top:50%;transform:translate(-50%,-50%);width:inherit}.bricks-background-video-wrapper iframe[poster],.bricks-background-video-wrapper video[poster]{object-fit:cover}.bricks-background-video-wrapper .bricks-video-poster-image{height:inherit;left:50%;object-fit:cover;position:absolute;top:50%;transform:translate(-50%,-50%);width:inherit;z-index:1}.post-meta{align-items:center;display:inline-flex;gap:20px}.post-meta.column{align-items:unset;flex-direction:column}.post-meta .separator{display:inline-block;text-align:center}.screen-reader-text,.screen-reader-text span,.ui-helper-hidden-accessible{clip:rect(1px,1px,1px,1px);height:1px;overflow:hidden;position:absolute!important;white-space:nowrap;width:1px}.screen-reader-text span:focus,.screen-reader-text:focus,.ui-helper-hidden-accessible:focus{clip:auto!important;background-color:#f1f1f1;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);color:#21759b;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}.bricks-pagination ul{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;list-style-type:none;margin:0;padding:0}.bricks-pagination ul .page-numbers{display:grid;height:100%;place-items:center}.brx-load-more-hidden,.brx-query-trail:not(.bricks-isotope-sizer){display:none!important}.bricks-isotope-sizer{pointer-events:none;position:absolute;top:-99999px;visibility:hidden}[data-brx-ls-wrapper]{transition:opacity .3s ease-in-out}[data-brx-ls-wrapper]:not(.brx-ls-active){display:none!important}.brx-filter-disabled label:not(.brx-option-disabled),.page-filtered label:not(.brx-option-disabled){opacity:.5}.brx-filter-disabled,.page-filtered{pointer-events:none}.brx-option-disabled,.brx-option-disabled:disabled{opacity:.5;pointer-events:none}.brx-no-active-filter,.brx-option-disabled.brx-option-empty{display:none}.bricks-no-posts-wrapper{text-align:center}.bricks-no-posts-wrapper .title{margin-bottom:30px}.bricks-no-posts-wrapper p{margin-bottom:1em}.bricks-no-posts-wrapper a{font-weight:700}.search-no-results .bricks-no-posts-wrapper{text-align:initial}.aligncenter{display:block;margin:.5em auto}.alignright{float:right;margin:.5em 0 .5em 1em}.alignleft{float:left;margin:.5em 1em .5em 0}a img.alignright{float:right;margin:.5em 0 .5em 1em}a img.alignleft{float:left;margin:.5em 1em .5em 0}a img.aligncenter{display:block;margin-left:auto;margin-right:auto}.x-caption{background:#fff;border:1px solid #f0f0f0;max-width:96%;padding:5px 3px 10px;text-align:center}.x-caption.alignleft,.x-caption.alignnone{margin:.5em 1em .5em 0}.x-caption.alignright{margin:.5em 0 .5em 1em}.x-caption img{border:0;height:auto;margin:0;max-width:98.5%;padding:0;width:auto}.x-caption p.x-caption-text{font-size:11px;line-height:17px;margin:0;padding:0 4px 5px}.x-block-image,.x-block-video,figure[class^=x-block-]{margin:1em 0}.x-block-calendar,.x-block-image:not(.x-block-gallery .x-block-image),figure[class^=x-block-]:not(.x-block-gallery figure):not([class^=align]){width:100%}#x-calendar caption{margin-bottom:1em;text-align:inherit}#x-calendar tbody{text-align:center}#x-calendar tbody td{width:30px}#x-calendar tbody a{font-weight:700}#x-calendar tfoot{opacity:.5}#x-calendar tfoot #prev{text-align:left}#x-calendar tfoot #next{text-align:right}.gallery{display:flex;flex-flow:row wrap;margin:0 -10px}.gallery.gallery-columns-1 .gallery-item{flex:1 1 100%;max-width:100%}.gallery.gallery-columns-2 .gallery-item{flex:1 1 50%;max-width:50%}.gallery.gallery-columns-3 .gallery-item{flex:1 1 33.333%;max-width:33.333%}.gallery.gallery-columns-4 .gallery-item{flex:1 1 25%;max-width:25%}.gallery.gallery-columns-5 .gallery-item{flex:1 1 20%;max-width:20%}.gallery.gallery-columns-6 .gallery-item{flex:1 1 16.666%;max-width:16.666%}.gallery.gallery-columns-7 .gallery-item{flex:1 1 14.285%;max-width:14.285%}.gallery.gallery-columns-8 .gallery-item{flex:1 1 12.5%;max-width:12.5%}.gallery.gallery-columns-9 .gallery-item{flex:1 1 11.111%;max-width:11.111%}.gallery.gallery-columns-10 .gallery-item{flex:1 1 10%;max-width:10%}.gallery .gallery-item{flex:1;margin:0;padding:0 10px 20px}.gallery .gallery-item img{width:100%}.has-text-align-left{text-align:left}.has-text-align-center{text-align:center}.has-text-align-right{text-align:right}.x-block-image figure{width:auto}.alignfull,.x-block-categories-list.alignfull{left:50%;margin-left:-50vw;margin-right:-50vw;max-width:calc(100vw - .5em);position:relative;right:50%;width:100vw}.alignwide{margin-left:-10%;max-width:120%;position:relative;width:120%}@media (max-width:1320px){.alignwide{margin-left:auto;width:100%}}.aligncenter img{margin-left:auto;margin-right:auto}.aligncenter a,.aligncenter img{display:block}.bricks-color-primary{color:var(--bricks-color-primary)}.bricks-color-secondary{color:var(--bricks-color-secondary)}.bricks-color-light{color:#fff}.bricks-color-dark{color:var(--bricks-text-dark)}.bricks-color-muted{color:var(--bricks-text-light)}.bricks-color-info{color:var(--bricks-text-info)}.bricks-color-success{color:var(--bricks-text-success)}.bricks-color-warning{color:var(--bricks-text-warning)}.bricks-color-danger{color:var(--bricks-text-danger)}.bricks-background-primary{background-color:var(--bricks-color-primary)}.bricks-background-secondary{background-color:var(--bricks-color-secondary)}.bricks-background-light{background-color:#fff}.bricks-background-dark{background-color:var(--bricks-bg-dark)}.bricks-background-muted{background-color:var(--bricks-text-light)}.bricks-background-info{background-color:var(--bricks-text-info)}.bricks-background-success{background-color:var(--bricks-text-success)}.bricks-background-warning{background-color:var(--bricks-text-warning)}.bricks-background-danger{background-color:var(--bricks-text-danger)}} @font-face{font-family:"Afacad";font-weight:600;font-display:swap;src:url("/assets/uploads/2025/03/Afacad-SemiBold.woff2") format("woff2");}@font-face{font-family:"Afacad";font-weight:700;font-display:swap;src:url("/assets/uploads/2025/03/Afacad-Bold.woff2") format("woff2");} @font-face{font-family:"League Spartan";font-weight:400;font-display:swap;src:url("/assets/uploads/2025/03/LeagueSpartan-Regular.woff2") format("woff2");}@font-face{font-family:"League Spartan";font-weight:500;font-display:swap;src:url("/assets/uploads/2025/03/LeagueSpartan-Medium.woff2") format("woff2");}@font-face{font-family:"League Spartan";font-weight:600;font-display:swap;src:url("/assets/uploads/2025/03/LeagueSpartan-SemiBold.woff2") format("woff2");}@font-face{font-family:"League Spartan";font-weight:700;font-display:swap;src:url("/assets/uploads/2025/03/LeagueSpartan-Bold.woff2") format("woff2");}   :root {--bricks-color-acss_import_transparent: transparent;} .brxe-container {width: var(--content-width)} .woocommerce main.site-main {width: var(--content-width)} #brx-content.wordpress {width: var(--content-width)} html {font-size: var(--root-font-size)} .brxe-section {max-width: 1920px} @layer bricks {.brxe-offcanvas{visibility:hidden}.brxe-offcanvas.brx-open{visibility:visible}.brxe-offcanvas.brx-open .brx-offcanvas-inner{transform:translate(0)!important}.brxe-offcanvas.brx-open .brx-offcanvas-backdrop{opacity:1;pointer-events:auto;z-index:998}.brxe-offcanvas.brx-closing{visibility:visible}.brxe-offcanvas.brx-closing .brx-offcanvas-backdrop{z-index:998}.brxe-offcanvas[data-direction=top] .brx-offcanvas-inner{bottom:auto;height:300px;left:0;right:0;top:0;transform:translateY(-100%);width:100vw}.brxe-offcanvas[data-direction=right] .brx-offcanvas-inner{bottom:0;height:100vh;height:calc(var(--bricks-vh, 1vh)*100);left:auto;right:0;top:0;transform:translate(100%);width:300px}.brxe-offcanvas[data-direction=bottom] .brx-offcanvas-inner{bottom:0;height:300px;left:0;right:0;top:auto;transform:translateY(100%);width:100vw}.brxe-offcanvas[data-direction=left] .brx-offcanvas-inner{bottom:0;height:100vh;height:calc(var(--bricks-vh, 1vh)*100);left:0;right:auto;top:0;transform:translate(-100%);width:300px}.brx-offcanvas-inner{background-color:#fff;display:flex;overflow-x:hidden;position:fixed;transition:transform .2s cubic-bezier(.25,0,.25,1);z-index:999}.brx-offcanvas-backdrop{background:rgba(0,0,0,.5);bottom:0;left:0;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transition:opacity .2s cubic-bezier(.25,0,.25,1);z-index:-1}}@layer bricks {.brxe-button{width:auto}}@layer bricks {@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes scrolling{0%{opacity:1}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}:where(.brxe-search) button{align-items:center;background-color:transparent;cursor:pointer;display:flex;gap:.5em;height:40px;justify-content:center;width:60px}:where(.brxe-search) button svg:not([height]){height:inherit}.bricks-search-overlay{background-color:#fff;background-position:50%;background-size:cover;bottom:0;color:var(--bricks-text-medium);height:100%;left:0;opacity:0;position:fixed;right:0;text-align:center;top:0;transform:scale(1.1);transition:all .4s;visibility:hidden;width:100%;z-index:-1}.bricks-search-overlay:after{bottom:0;content:"";left:0;position:absolute;right:0;top:0}.bricks-search-overlay.show{opacity:1;transform:scale(1);visibility:visible;z-index:999}.bricks-search-overlay .bricks-search-inner{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;position:relative;z-index:1}.bricks-search-overlay .close{background-color:transparent!important;cursor:pointer;font-size:60px;line-height:1;position:fixed;right:30px;text-align:center;top:15px;z-index:1}.bricks-search-overlay .title{margin:0 0 1em}.bricks-search-overlay .bricks-search-form{max-width:600px}.bricks-search-overlay .bricks-search-form input[type=search]{background-color:transparent;border-radius:0;font-size:1.4em;line-height:60px;text-align:center;width:100%}}@layer bricks {.brxe-text-link{gap:5px}.brxe-text-link,.brxe-text-link span{align-items:center;display:inline-flex}.brxe-text-link span{justify-content:center}}@layer bricks {.brxe-dropdown{cursor:pointer;display:flex;flex-direction:column;position:relative}.brxe-dropdown.brx-draggable:empty{min-height:0}.brxe-dropdown.brx-draggable:empty:not(.editing){outline:none}.brxe-dropdown[data-static] .open>.brx-dropdown-content,.brxe-dropdown[data-static].open>.brx-dropdown-content{display:block}.brxe-dropdown[data-static] .brx-dropdown-content{display:none;position:static}.brxe-dropdown:not([data-toggle=click]):hover .brx-dropdown-content:after{bottom:100%;content:"";height:var(--brx-dropdown-height-before,0);position:absolute;width:100%;z-index:1}.brxe-dropdown.caret .brx-dropdown-content:before{border:0 solid transparent;border-bottom-color:#fff;content:"";height:0;left:0;position:absolute;top:0;transform:translateY(-100%);transition-duration:.2s;transition-property:opacity,transform,visibility;transition-timing-function:ease;width:0}.brxe-dropdown.open>.brx-dropdown-content{opacity:1;visibility:visible}.brxe-dropdown:not(.open) .brx-dropdown-content{pointer-events:none}.brxe-dropdown .brx-submenu-toggle{gap:10px}.brxe-dropdown .brxe-dropdown:not([data-toggle=click]):hover:before{display:none}.brxe-dropdown .brxe-dropdown .brx-dropdown-content{left:100%;top:0}.brx-dropdown-content{background-color:#fff;cursor:auto;display:flex;flex-direction:column;list-style-type:none;margin:0;min-width:200px;opacity:0;padding:0;position:absolute;top:100%;transition-duration:.2s;transition-property:opacity,transform,visibility;transition-timing-function:ease;visibility:hidden;z-index:1001}.brx-dropdown-content:not(.brx-submenu-positioned){display:none!important}.brx-dropdown-content>li.brxe-text-link{display:list-item}.brx-dropdown-content>li .brxe-text-link{display:flex}.brx-multilevel-back{align-items:center;cursor:pointer;display:flex;gap:3px;width:100%}.brx-render-child-nodes{display:none!important}}@layer bricks {.brxe-nav-nested{align-items:center;display:inline-flex}.brxe-nav-nested[data-toggle=always] .brx-nav-nested-items{display:none}.brxe-nav-nested[data-toggle=always] .brx-toggle-div,.brxe-nav-nested[data-toggle=always] .brxe-toggle{display:inline-flex}.brxe-nav-nested .brx-toggle-div,.brxe-nav-nested .brxe-toggle{display:none}.brxe-nav-nested .menu-item:has(>.brx-toggle-div:not(.is-active):not(.brx-child-node)){display:none}.brxe-nav-nested li.menu-item:has(>.brxe-text-link>.icon>svg,>.brxe-text-link>.icon>i){display:flex}.brxe-nav-nested li.brxe-text-link.menu-item{display:list-item}.brxe-nav-nested.brx-open .brxe-dropdown:not([data-toggle=click]) .brx-dropdown-content:after{content:none}.brxe-nav-nested.brx-open .brx-nav-nested-items{align-items:stretch;background-color:#fff;bottom:0;display:flex;flex-direction:column;flex-wrap:nowrap;gap:0;justify-content:safe center;left:0;overflow-y:auto;position:fixed;right:0;top:var(--x-admin--admin-bar--height,0);transition-duration:.2s;transition-property:opacity,transform,visibility;transition-timing-function:ease;z-index:1001}.brxe-nav-nested.brx-open.brx-mobile-center .brx-nav-nested-items{justify-content:safe center!important}.brxe-nav-nested.brx-open.multilevel .brx-nav-nested-items{overflow:hidden}.brxe-nav-nested.brx-open li.menu-item a{justify-content:inherit;width:100%}.brxe-nav-nested.brx-open :where(li.menu-item.brx-toggle-div){display:block}.brxe-nav-nested.brx-open .brx-submenu-toggle{justify-content:space-between}.brxe-nav-nested.brx-open .brxe-dropdown:hover:before{content:none}.brxe-nav-nested.brx-open .brxe-dropdown.open>.brx-dropdown-content{display:flex;min-width:auto;opacity:1;overflow-y:auto;position:static;visibility:visible}.brxe-nav-nested.brx-open .brxe-dropdown .brx-dropdown-content{display:none}.brxe-nav-nested.brx-open .brx-has-megamenu .brx-dropdown-content{min-width:0!important}.brxe-nav-nested.brx-closing .brx-nav-nested-items{opacity:0!important;visibility:hidden!important}.brx-nav-nested-items{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;gap:30px;list-style-type:none;margin:0;padding:0}.brx-nav-nested-items>li>a.bricks-link-wrapper{display:flex}.brx-nav-nested-items>li:has(>.brxe-svg){line-height:1}}@layer bricks {@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes scrolling{0%{opacity:1}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}a.brxe-image{display:inline-block}figure.brxe-image{margin:0}:where(.brxe-image).tag{display:inline-block;height:fit-content;position:relative;width:auto}:where(.brxe-image).caption{overflow:hidden;position:relative}:where(.brxe-image).overlay{position:relative}:where(.brxe-image).overlay:before{bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}:where(.brxe-image):before{border-radius:inherit}:where(.brxe-image) a{border-radius:inherit;position:static;transition:inherit}:where(.brxe-image) picture{border-radius:inherit;transition:inherit}:where(.brxe-image) img{border-radius:inherit;height:100%;position:static!important;transition:inherit;width:100%}:where(.brxe-image) img.bricks-lazy-hidden+figcaption{display:none}:where(.brxe-image) .icon{color:#fff;font-size:60px;pointer-events:none;position:absolute;right:50%;text-align:center;top:50%;transform:translate(50%,-50%);z-index:5}:where(.brxe-image) .bricks-image-caption{background:linear-gradient(0deg,rgba(0,0,0,.5),rgba(0,0,0,.25) 70%,transparent);bottom:0;color:#fff;font-size:inherit;margin:0;padding:10px 15px;pointer-events:none;position:absolute!important;text-align:center;width:100%;z-index:1}}@layer bricks {.brxe-icon{font-size:60px}svg.brxe-icon{font-size:inherit}}@layer bricks {:where(.brxe-svg){height:auto;width:auto}:where(.brxe-svg) svg{height:auto;max-width:100%;overflow:visible;width:auto}}#brxe-qxqsjn {flex-direction: row; align-items: center; justify-content: flex-end}@layer bricks {@media (max-width: 767px) {#brxe-dunwwo .brx-toggle-div { display: inline-flex; }#brxe-dunwwo .brxe-toggle { display: inline-flex; }[data-script-id="dunwwo"] .brx-nav-nested-items {opacity: 0;visibility: hidden;gap: 0;position: fixed;z-index: 1001;top: 0;right: 0;bottom: 0;left: 0;display: flex;align-items: center;justify-content: center;flex-direction: column;background-color: #fff;overflow-y: scroll;flex-wrap: nowrap;}#brxe-dunwwo.brx-open .brx-nav-nested-items {opacity: 1;visibility: visible;}}}#brxe-cltewy svg {height: var(--icon-size); width: var(--icon-size); fill: var(--icon-color)}#brxe-zcckiy[data-direction] .brx-offcanvas-inner {width: 95%} @layer bricks {@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes scrolling{0%{opacity:1}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}a.brxe-image{display:inline-block}figure.brxe-image{margin:0}:where(.brxe-image).tag{display:inline-block;height:fit-content;position:relative;width:auto}:where(.brxe-image).caption{overflow:hidden;position:relative}:where(.brxe-image).overlay{position:relative}:where(.brxe-image).overlay:before{bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}:where(.brxe-image):before{border-radius:inherit}:where(.brxe-image) a{border-radius:inherit;position:static;transition:inherit}:where(.brxe-image) picture{border-radius:inherit;transition:inherit}:where(.brxe-image) img{border-radius:inherit;height:100%;position:static!important;transition:inherit;width:100%}:where(.brxe-image) img.bricks-lazy-hidden+figcaption{display:none}:where(.brxe-image) .icon{color:#fff;font-size:60px;pointer-events:none;position:absolute;right:50%;text-align:center;top:50%;transform:translate(50%,-50%);z-index:5}:where(.brxe-image) .bricks-image-caption{background:linear-gradient(0deg,rgba(0,0,0,.5),rgba(0,0,0,.25) 70%,transparent);bottom:0;color:#fff;font-size:inherit;margin:0;padding:10px 15px;pointer-events:none;position:absolute!important;text-align:center;width:100%;z-index:1}}@layer bricks {.brxe-button{width:auto}}@layer bricks {:where(.brxe-divider){align-items:center;display:flex;font-size:30px;gap:30px}:where(.brxe-divider).horizontal{width:100%}:where(.brxe-divider).horizontal .line{border-top:1px solid}:where(.brxe-divider).vertical{flex-direction:column}:where(.brxe-divider).vertical .line{border-right:1px solid;width:auto}:where(.brxe-divider) .line{position:relative;width:100%}:where(.brxe-divider) .icon{flex-shrink:0;position:relative}:where(.brxe-divider) a{display:inline-flex}}@layer bricks {:where(.brxe-heading).has-separator{align-items:center;display:inline-flex;gap:20px}:where(.brxe-heading)>[contenteditable]{display:inline-block;text-decoration:inherit}:where(.brxe-heading) .separator{border-top:1px solid;flex-grow:1;flex-shrink:0;height:1px}}#brxe-387033 {position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: -1} @layer bricks {.brxe-button{width:auto}}@layer bricks {.brxe-text-link{gap:5px}.brxe-text-link,.brxe-text-link span{align-items:center;display:inline-flex}.brxe-text-link span{justify-content:center}}@layer bricks {:where(.brxe-divider){align-items:center;display:flex;font-size:30px;gap:30px}:where(.brxe-divider).horizontal{width:100%}:where(.brxe-divider).horizontal .line{border-top:1px solid}:where(.brxe-divider).vertical{flex-direction:column}:where(.brxe-divider).vertical .line{border-right:1px solid;width:auto}:where(.brxe-divider) .line{position:relative;width:100%}:where(.brxe-divider) .icon{flex-shrink:0;position:relative}:where(.brxe-divider) a{display:inline-flex}}@layer bricks {.brxe-template{width:100%}}@layer bricks {@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes scrolling{0%{opacity:1}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}a.brxe-image{display:inline-block}figure.brxe-image{margin:0}:where(.brxe-image).tag{display:inline-block;height:fit-content;position:relative;width:auto}:where(.brxe-image).caption{overflow:hidden;position:relative}:where(.brxe-image).overlay{position:relative}:where(.brxe-image).overlay:before{bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}:where(.brxe-image):before{border-radius:inherit}:where(.brxe-image) a{border-radius:inherit;position:static;transition:inherit}:where(.brxe-image) picture{border-radius:inherit;transition:inherit}:where(.brxe-image) img{border-radius:inherit;height:100%;position:static!important;transition:inherit;width:100%}:where(.brxe-image) img.bricks-lazy-hidden+figcaption{display:none}:where(.brxe-image) .icon{color:#fff;font-size:60px;pointer-events:none;position:absolute;right:50%;text-align:center;top:50%;transform:translate(50%,-50%);z-index:5}:where(.brxe-image) .bricks-image-caption{background:linear-gradient(0deg,rgba(0,0,0,.5),rgba(0,0,0,.25) 70%,transparent);bottom:0;color:#fff;font-size:inherit;margin:0;padding:10px 15px;pointer-events:none;position:absolute!important;text-align:center;width:100%;z-index:1}}@layer bricks {.brxe-breadcrumbs{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;gap:10px}.brxe-breadcrumbs .separator{display:flex}}@layer bricks {:where(.brxe-heading).has-separator{align-items:center;display:inline-flex;gap:20px}:where(.brxe-heading)>[contenteditable]{display:inline-block;text-decoration:inherit}:where(.brxe-heading) .separator{border-top:1px solid;flex-grow:1;flex-shrink:0;height:1px}}#brxe-gqdaxq svg {height: .8rem; width: 1rem}#brxe-fvzugl .x-modal_close svg {height: 1.5rem; width: 1.5rem} @layer bricks {:where(.brxe-divider){align-items:center;display:flex;font-size:30px;gap:30px}:where(.brxe-divider).horizontal{width:100%}:where(.brxe-divider).horizontal .line{border-top:1px solid}:where(.brxe-divider).vertical{flex-direction:column}:where(.brxe-divider).vertical .line{border-right:1px solid;width:auto}:where(.brxe-divider) .line{position:relative;width:100%}:where(.brxe-divider) .icon{flex-shrink:0;position:relative}:where(.brxe-divider) a{display:inline-flex}}@layer bricks {.brxe-button{width:auto}}@layer bricks {.brxe-icon{font-size:60px}svg.brxe-icon{font-size:inherit}}@layer bricks {.brxe-logo{color:currentcolor;font-size:20px;font-weight:600;line-height:1}.brxe-logo img{display:block;height:auto;width:auto}.brxe-logo a{color:currentcolor;display:inline-block}}@layer bricks {.brxe-nav-nested{align-items:center;display:inline-flex}.brxe-nav-nested[data-toggle=always] .brx-nav-nested-items{display:none}.brxe-nav-nested[data-toggle=always] .brx-toggle-div,.brxe-nav-nested[data-toggle=always] .brxe-toggle{display:inline-flex}.brxe-nav-nested .brx-toggle-div,.brxe-nav-nested .brxe-toggle{display:none}.brxe-nav-nested .menu-item:has(>.brx-toggle-div:not(.is-active):not(.brx-child-node)){display:none}.brxe-nav-nested li.menu-item:has(>.brxe-text-link>.icon>svg,>.brxe-text-link>.icon>i){display:flex}.brxe-nav-nested li.brxe-text-link.menu-item{display:list-item}.brxe-nav-nested.brx-open .brxe-dropdown:not([data-toggle=click]) .brx-dropdown-content:after{content:none}.brxe-nav-nested.brx-open .brx-nav-nested-items{align-items:stretch;background-color:#fff;bottom:0;display:flex;flex-direction:column;flex-wrap:nowrap;gap:0;justify-content:safe center;left:0;overflow-y:auto;position:fixed;right:0;top:var(--x-admin--admin-bar--height,0);transition-duration:.2s;transition-property:opacity,transform,visibility;transition-timing-function:ease;z-index:1001}.brxe-nav-nested.brx-open.brx-mobile-center .brx-nav-nested-items{justify-content:safe center!important}.brxe-nav-nested.brx-open.multilevel .brx-nav-nested-items{overflow:hidden}.brxe-nav-nested.brx-open li.menu-item a{justify-content:inherit;width:100%}.brxe-nav-nested.brx-open :where(li.menu-item.brx-toggle-div){display:block}.brxe-nav-nested.brx-open .brx-submenu-toggle{justify-content:space-between}.brxe-nav-nested.brx-open .brxe-dropdown:hover:before{content:none}.brxe-nav-nested.brx-open .brxe-dropdown.open>.brx-dropdown-content{display:flex;min-width:auto;opacity:1;overflow-y:auto;position:static;visibility:visible}.brxe-nav-nested.brx-open .brxe-dropdown .brx-dropdown-content{display:none}.brxe-nav-nested.brx-open .brx-has-megamenu .brx-dropdown-content{min-width:0!important}.brxe-nav-nested.brx-closing .brx-nav-nested-items{opacity:0!important;visibility:hidden!important}.brx-nav-nested-items{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;gap:30px;list-style-type:none;margin:0;padding:0}.brx-nav-nested-items>li>a.bricks-link-wrapper{display:flex}.brx-nav-nested-items>li:has(>.brxe-svg){line-height:1}}@layer bricks {:where(.brxe-svg){height:auto;width:auto}:where(.brxe-svg) svg{height:auto;max-width:100%;overflow:visible;width:auto}}@layer bricks {.brxe-text-link{gap:5px}.brxe-text-link,.brxe-text-link span{align-items:center;display:inline-flex}.brxe-text-link span{justify-content:center}} :root { --x-modal-transition: 200ms; --x-modal-translatey: 10%; --x-modal-translatex: 0; --x-modal-scale: 1; --x-modal-close-translatey: -5%; --x-modal-close-translatex: 0; --x-modal-close-scale: 1; } .x-modal { display: none; } [data-x-modal] { position: absolute; } .x-modal.x-modal_open { display: block; } .x-modal_backdrop { background-color: rgba(0,0,0,.2); position: fixed!important; top: 0; left: 0; top: 0; left: 0; right: 0; bottom: 0; z-index: 1004; display: block; will-change: opacity; padding: 20px; text-align: center; }  component.x-modal { display: block; transform: none!important; } component.x-modal .x-modal_backdrop { z-index: 998; } .x-modal_backdrop::before { content: ""; display: inline-block; font-size: 0; height: 100%; vertical-align: middle; width: 0; } .x-modal_backdrop .x-modal_container { display: inline-block!important;; } .x-modal_container { max-height: 100vh; max-height: calc(100dvh - 40px); overflow-y: auto; box-sizing: border-box; position: relative; text-align: left; max-width: 100%; width: 600px; vertical-align: middle; pointer-events: auto; } @supports (padding-top: env(safe-area-inset-top)) { .x-modal_container { --safe-area-inset-bottom: env(safe-area-inset-bottom); max-height: calc(100% + var(--safe-area-inset-bottom))!important; } } .x-modal_content { background-color: #fff; padding: 30px; width: 100%; max-width: 100%; display: flex; flex-direction: column; } .x-modal_close { background: transparent; border: 0; box-shadow: none; position: absolute; top: 0; right: 0; cursor: pointer; display: flex; align-items: center; line-height: 1; font-size: 14px; color: #666; padding: 10px; margin: 10px; transition: all .3s ease; } :where(body.rtl) .x-modal_close { right: auto; left: 0; } .x-modal_close-text { margin-right: 10px; } .x-modal_close-icon { pointer-events: none; } @keyframes mmfadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes mmfadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes mmslideIn { from { transform: translate( var(--x-modal-translatex), var(--x-modal-translatey) ) scale( var(--x-modal-scale) ); -webkit-transform: translate( var(--x-modal-translatex), var(--x-modal-translatey) ) scale( var(--x-modal-scale) ); } to { transform: translate(0,0) scale(1); -webkit-transform: translate(0,0) scale(1); } } @keyframes mmslideOut { from { transform: translate(0,0) scale(1); -webkit-transform: translate(0,0) scale(1); } to { transform: translate( var(--x-modal-close-translatex), var(--x-modal-close-translatey) ) scale( var(--x-modal-close-scale) ); -webkit-transform: translate( var(--x-modal-close-translatex), var(--x-modal-close-translatey) ) scale( var(--x-modal-close-scale) ); } } .x-modal[aria-hidden="false"] .x-modal_backdrop { animation: mmfadeIn var(--x-modal-transition) cubic-bezier(0.0, 0.0, 0.2, 1); } .x-modal[aria-hidden="true"] .x-modal_backdrop { animation: mmfadeOut var(--x-modal-transition) cubic-bezier(0.0, 0.0, 0.2, 1); } .x-modal[aria-hidden="false"] .x-modal_container { animation: mmslideIn var(--x-modal-transition) cubic-bezier(0, 0, .2, 1); } .x-modal[aria-hidden="true"] .x-modal_container { animation: mmslideOut var(--x-modal-transition) cubic-bezier(0, 0, .2, 1); } @media (prefers-reduced-motion: reduce) { .x-modal[data-x-modal*=notransition] .x-modal_backdrop, .x-modal[data-x-modal*=notransition] .x-modal_container { --x-modal-transition: 0; } .x-modal[data-x-modal*=fade][aria-hidden="false"] .x-modal_container { animation: mmfadeIn var(--x-modal-transition) cubic-bezier(0, 0, .2, 1); } .x-modal[data-x-modal*=fade][aria-hidden="true"] .x-modal_container { animation: mmfadeOut var(--x-modal-transition) cubic-bezier(0, 0, .2, 1); } }  .brx-body.iframe .x-modal[data-id] { display: block; transform: none!important; } .brx-body.iframe .x-modal.brx-draggable.is-empty { min-height: 0; min-width: 0; } .brx-body.iframe .x-modal_container { transition: transform var(--x-modal-transition) ease, opacity var(--x-modal-transition) ease; -webkit-transition: -webkit-transform var(--x-modal-transition) ease, opacity var(--x-modal-transition) ease; } .brx-body.iframe .x-modal_preview-start .x-modal_container { opacity: 0.4; transform: translate( var(--x-modal-translatex), var(--x-modal-translatey) ) scale( var(--x-modal-scale) ); -webkit-transform: translate( var(--x-modal-translatex), var(--x-modal-translatey) ) scale( var(--x-modal-scale) ); } .brx-body.iframe .x-modal_preview-end .x-modal_container, .brx-body.iframe .x-modal_preview.x-modal_preview-end .x-modal_container { opacity: 0.4; transform: translate( var(--x-modal-close-translatex), var(--x-modal-close-translatey) ) scale( var(--x-modal-close-scale) ); -webkit-transform: translate( var(--x-modal-close-translatex), var(--x-modal-close-translatey) ) scale( var(--x-modal-close-scale) ); } .brx-body.iframe .x-modal { transform: none!important; } .brx-body.iframe .x-modal .x-modal_close-text { min-width: 0!important; }  body.bricks-is-frontend.bricks-is-frontend :focus { outline: none; box-shadow: none; } body.bricks-is-frontend.bricks-is-frontend :focus-visible { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } @supports not selector(:focus-visible) { body.bricks-is-frontend.bricks-is-frontend :focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--primary { --focus-color: var(--primary); } body.bricks-is-frontend.bricks-is-frontend .focus--primary *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--primary:focus-within { --focus-color: var(--primary); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--primary-hover { --focus-color: var(--primary-hover); } body.bricks-is-frontend.bricks-is-frontend .focus--primary-hover *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--primary-hover:focus-within { --focus-color: var(--primary-hover); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--primary-ultra-light { --focus-color: var(--primary-ultra-light); } body.bricks-is-frontend.bricks-is-frontend .focus--primary-ultra-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--primary-ultra-light:focus-within { --focus-color: var(--primary-ultra-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--primary-light { --focus-color: var(--primary-light); } body.bricks-is-frontend.bricks-is-frontend .focus--primary-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--primary-light:focus-within { --focus-color: var(--primary-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--primary-semi-light { --focus-color: var(--primary-semi-light); } body.bricks-is-frontend.bricks-is-frontend .focus--primary-semi-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--primary-semi-light:focus-within { --focus-color: var(--primary-semi-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--primary-semi-dark { --focus-color: var(--primary-semi-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--primary-semi-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--primary-semi-dark:focus-within { --focus-color: var(--primary-semi-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--primary-dark { --focus-color: var(--primary-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--primary-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--primary-dark:focus-within { --focus-color: var(--primary-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--primary-ultra-dark { --focus-color: var(--primary-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--primary-ultra-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--primary-ultra-dark:focus-within { --focus-color: var(--primary-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--secondary { --focus-color: var(--secondary); } body.bricks-is-frontend.bricks-is-frontend .focus--secondary *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--secondary:focus-within { --focus-color: var(--secondary); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--secondary-hover { --focus-color: var(--secondary-hover); } body.bricks-is-frontend.bricks-is-frontend .focus--secondary-hover *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--secondary-hover:focus-within { --focus-color: var(--secondary-hover); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--secondary-ultra-light { --focus-color: var(--secondary-ultra-light); } body.bricks-is-frontend.bricks-is-frontend .focus--secondary-ultra-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--secondary-ultra-light:focus-within { --focus-color: var(--secondary-ultra-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--secondary-light { --focus-color: var(--secondary-light); } body.bricks-is-frontend.bricks-is-frontend .focus--secondary-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--secondary-light:focus-within { --focus-color: var(--secondary-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--secondary-semi-light { --focus-color: var(--secondary-semi-light); } body.bricks-is-frontend.bricks-is-frontend .focus--secondary-semi-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--secondary-semi-light:focus-within { --focus-color: var(--secondary-semi-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--secondary-semi-dark { --focus-color: var(--secondary-semi-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--secondary-semi-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--secondary-semi-dark:focus-within { --focus-color: var(--secondary-semi-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--secondary-dark { --focus-color: var(--secondary-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--secondary-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--secondary-dark:focus-within { --focus-color: var(--secondary-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--secondary-ultra-dark { --focus-color: var(--secondary-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--secondary-ultra-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--secondary-ultra-dark:focus-within { --focus-color: var(--secondary-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--tertiary { --focus-color: var(--tertiary); } body.bricks-is-frontend.bricks-is-frontend .focus--tertiary *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--tertiary:focus-within { --focus-color: var(--tertiary); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--tertiary-hover { --focus-color: var(--tertiary-hover); } body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-hover *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-hover:focus-within { --focus-color: var(--tertiary-hover); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--tertiary-ultra-light { --focus-color: var(--tertiary-ultra-light); } body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-ultra-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-ultra-light:focus-within { --focus-color: var(--tertiary-ultra-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--tertiary-light { --focus-color: var(--tertiary-light); } body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-light:focus-within { --focus-color: var(--tertiary-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--tertiary-semi-light { --focus-color: var(--tertiary-semi-light); } body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-semi-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-semi-light:focus-within { --focus-color: var(--tertiary-semi-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--tertiary-semi-dark { --focus-color: var(--tertiary-semi-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-semi-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-semi-dark:focus-within { --focus-color: var(--tertiary-semi-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--tertiary-dark { --focus-color: var(--tertiary-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-dark:focus-within { --focus-color: var(--tertiary-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--tertiary-ultra-dark { --focus-color: var(--tertiary-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-ultra-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--tertiary-ultra-dark:focus-within { --focus-color: var(--tertiary-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--accent { --focus-color: var(--accent); } body.bricks-is-frontend.bricks-is-frontend .focus--accent *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--accent:focus-within { --focus-color: var(--accent); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--accent-hover { --focus-color: var(--accent-hover); } body.bricks-is-frontend.bricks-is-frontend .focus--accent-hover *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--accent-hover:focus-within { --focus-color: var(--accent-hover); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--accent-ultra-light { --focus-color: var(--accent-ultra-light); } body.bricks-is-frontend.bricks-is-frontend .focus--accent-ultra-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--accent-ultra-light:focus-within { --focus-color: var(--accent-ultra-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--accent-light { --focus-color: var(--accent-light); } body.bricks-is-frontend.bricks-is-frontend .focus--accent-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--accent-light:focus-within { --focus-color: var(--accent-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--accent-semi-light { --focus-color: var(--accent-semi-light); } body.bricks-is-frontend.bricks-is-frontend .focus--accent-semi-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--accent-semi-light:focus-within { --focus-color: var(--accent-semi-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--accent-semi-dark { --focus-color: var(--accent-semi-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--accent-semi-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--accent-semi-dark:focus-within { --focus-color: var(--accent-semi-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--accent-dark { --focus-color: var(--accent-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--accent-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--accent-dark:focus-within { --focus-color: var(--accent-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--accent-ultra-dark { --focus-color: var(--accent-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--accent-ultra-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--accent-ultra-dark:focus-within { --focus-color: var(--accent-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--neutral { --focus-color: var(--neutral); } body.bricks-is-frontend.bricks-is-frontend .focus--neutral *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--neutral:focus-within { --focus-color: var(--neutral); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--neutral-hover { --focus-color: var(--neutral-hover); } body.bricks-is-frontend.bricks-is-frontend .focus--neutral-hover *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--neutral-hover:focus-within { --focus-color: var(--neutral-hover); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--neutral-ultra-light { --focus-color: var(--neutral-ultra-light); } body.bricks-is-frontend.bricks-is-frontend .focus--neutral-ultra-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--neutral-ultra-light:focus-within { --focus-color: var(--neutral-ultra-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--neutral-light { --focus-color: var(--neutral-light); } body.bricks-is-frontend.bricks-is-frontend .focus--neutral-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--neutral-light:focus-within { --focus-color: var(--neutral-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--neutral-semi-light { --focus-color: var(--neutral-semi-light); } body.bricks-is-frontend.bricks-is-frontend .focus--neutral-semi-light *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--neutral-semi-light:focus-within { --focus-color: var(--neutral-semi-light); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--neutral-semi-dark { --focus-color: var(--neutral-semi-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--neutral-semi-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--neutral-semi-dark:focus-within { --focus-color: var(--neutral-semi-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--neutral-dark { --focus-color: var(--neutral-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--neutral-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--neutral-dark:focus-within { --focus-color: var(--neutral-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--neutral-ultra-dark { --focus-color: var(--neutral-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend .focus--neutral-ultra-dark *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--neutral-ultra-dark:focus-within { --focus-color: var(--neutral-ultra-dark); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--white { --focus-color: var(--white); } body.bricks-is-frontend.bricks-is-frontend .focus--white *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--white:focus-within { --focus-color: var(--white); } body.bricks-is-frontend.bricks-is-frontend *:focus.focus--black { --focus-color: var(--black); } body.bricks-is-frontend.bricks-is-frontend .focus--black *:focus, body.bricks-is-frontend.bricks-is-frontend .focus--black:focus-within { --focus-color: var(--black); } .skip-link, .link--skip { position: absolute; inset-block-start: 1rem; inset-inline-start: 1rem; transform: translateY(-250%); --btn-min-width: fit-content; background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } @media (hover: hover) and (pointer: fine) { .skip-link:hover, .link--skip:hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } .skip-link:focus, .link--skip:focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .skip-link:focus, .link--skip:focus { transform: translateY(0); } .bricks-area .hidden-accessible { position: relative !important; inline-size: 2ch !important; block-size: 2ch !important; margin: 0; line-height: 1; visibility: hidden; } .bricks-area .hidden-accessible::before { content: "A"; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; position: absolute; background: #111; color: #f5f5f5; font-size: max(60%, 13px); padding: 0.5em; inset-block-start: 0; inset-inline-start: 0; inline-size: 20px; block-size: 20px; visibility: visible; border-radius: 50%; } .clickable-parent:not(a) { position: static; } .clickable-parent:not(a) a { position: static; } .clickable-parent:not(a) > a::after { content: ""; position: absolute; inset: 0; cursor: pointer !important; display: flex; z-index: 1; } button.clickable-parent, a.clickable-parent { position: static !important; } button.clickable-parent::after, a.clickable-parent::after { content: ""; position: absolute; inset: 0; cursor: pointer !important; display: flex; z-index: 1; } .bricks-area a.clickable-parent::after, .bricks-area .clickable-parent > a::after { content: ""; position: relative; } body { color: var(--body-color, var(--neutral-dark)); background-color: var(--body-bg-color, var(--white)); } html:has(body.boxed-layout) { background-color: var(--device-bg-color, var(--white)); } body { font-size: var(--default-font-size, var(--text-m)); font-family: var(--text-font-family); color: var(--text-color); line-height: var(--text-line-height); font-weight: var(--text-font-weight); text-wrap: var(--text-text-wrap); } p, li { line-height: var(--text-line-height, calc(10px + 2ex)); } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .h--1, .h--2, .h--3, .h--4, .h--5, .h--6 { font-family: var(--heading-font-family); color: var(--heading-color); line-height: var(--heading-line-height); font-weight: var(--heading-font-weight); letter-spacing: var(--heading-letter-spacing); text-wrap: var(--heading-text-wrap); } h1 { font-size: var(--h1); max-width: var(--h1-max-width); } h2 { font-size: var(--h2); max-width: var(--h2-max-width); } h3 { font-size: var(--h3); max-width: var(--h3-max-width); } h4 { font-size: var(--h4); line-height: var(--h4-line-height); max-width: var(--h4-max-width); } h5 { font-size: var(--h5); max-width: var(--h5-max-width); } h6 { font-size: var(--h6); max-width: var(--h6-max-width); } body a:where(:not([class*= btn--])) { color: var(--link-color, var(--tertiary)); font-weight: var(--link-weight, inherit); -webkit-text-decoration: var(--link-decoration, inherit); text-decoration: var(--link-decoration, inherit); text-underline-offset: var(--link-underline-offset, auto); transition: var(--link-transition, var(--transition)); } @media (hover: hover) and (pointer: fine) { body a:where(:not([class*= btn--])):hover { color: var(--link-color-hover, var(--primary-hover)); } } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; text-decoration: inherit; color: currentcolor; text-underline-offset: var(--link-underline-offset, auto); } @media (hover: hover) and (pointer: fine) { h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { color: currentcolor; } } body:where(.bricks-is-frontend), body:where(:not(.bricks-is-frontend)) { color: var(--body-color, var(--neutral-dark)); } .btn--primary { --btn-background: var(--primary); --btn-background-hover: var(--primary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .btn--primary-dark { --btn-background: var(--primary-dark); --btn-background-hover: var(--primary-ultra-dark); --btn-text-color: var(--primary-ultra-light); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-color: var(--primary-dark); --btn-border-color-hover: var(--primary-ultra-dark); --focus-color: var(--primary-semi-dark); } .btn--primary-light { --btn-background: var(--primary-ultra-light); --btn-background-hover: var(--primary-light); --btn-text-color: var(--primary); --btn-text-color-hover: var(--primary-ultra-dark); --btn-border-color: var(--primary-ultra-light); --btn-border-color-hover: var(--primary-light); --focus-color: var(--primary-light); } .btn--primary.btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-hover); --btn-text-color: var(--primary-ultra-light); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--primary); --btn-border-color-hover: var(--primary-hover); --focus-color: var(--primary-light); } .btn--primary-dark.btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-dark); --btn-text-color: var(--primary-dark); --btn-text-color-hover: var(--primary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--primary-dark); --btn-border-color-hover: var(--primary-dark); --focus-color: var(--primary-light); } .btn--primary-light.btn--outline { --btn-background: transparent; --btn-background-hover: var(--primary-light); --btn-text-color: var(--primary-light); --btn-text-color-hover: var(--primary-dark); --btn-border-width: 2px; --btn-border-color: var(--primary-light); --btn-border-color-hover: var(--primary-light); --focus-color: var(--primary-light); } .btn--secondary { --btn-background: var(--secondary); --btn-background-hover: var(--secondary-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--secondary); --btn-border-color-hover: var(--secondary-hover); --focus-color: var(--secondary-light); } .btn--secondary-dark { --btn-background: var(--secondary-dark); --btn-background-hover: var(--secondary-ultra-dark); --btn-text-color: var(--secondary-ultra-light); --btn-text-color-hover: var(--secondary-ultra-light); --btn-border-color: var(--secondary-dark); --btn-border-color-hover: var(--secondary-ultra-dark); --focus-color: var(--secondary-semi-dark); } .btn--secondary-light { --btn-background: var(--secondary-ultra-light); --btn-background-hover: var(--secondary-light); --btn-text-color: var(--secondary); --btn-text-color-hover: var(--secondary-ultra-dark); --btn-border-color: var(--secondary-ultra-light); --btn-border-color-hover: var(--secondary-light); --focus-color: var(--secondary-light); } .btn--secondary.btn--outline { --btn-background: transparent; --btn-background-hover: var(--secondary-hover); --btn-text-color: var(--secondary); --btn-text-color-hover: var(--secondary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--secondary); --btn-border-color-hover: var(--secondary-hover); --focus-color: var(--secondary-light); } .btn--secondary-dark.btn--outline { --btn-background: transparent; --btn-background-hover: var(--secondary-dark); --btn-text-color: var(--secondary-dark); --btn-text-color-hover: var(--secondary-ultra-light); --btn-border-width: 2px; --btn-border-color: var(--secondary-dark); --btn-border-color-hover: var(--secondary-dark); --focus-color: var(--secondary-light); } .btn--secondary-light.btn--outline { --btn-background: transparent; --btn-background-hover: var(--secondary-light); --btn-text-color: var(--secondary-light); --btn-text-color-hover: var(--secondary-dark); --btn-border-width: 2px; --btn-border-color: var(--secondary-light); --btn-border-color-hover: var(--secondary-light); --focus-color: var(--secondary-light); } .btn--accent { --btn-background: var(--accent); --btn-background-hover: var(--accent-hover); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--accent); --btn-border-color-hover: var(--accent-hover); --focus-color: var(--accent-light); } .btn--neutral { --btn-background: var(--neutral); --btn-background-hover: var(--neutral-dark); --btn-text-color: var(--neutral-ultra-light); --btn-text-color-hover: var(--neutral-ultra-light); --btn-border-color: var(--neutral); --btn-border-color-hover: var(--neutral-dark); --focus-color: var(--primary); } .btn--black { --btn-background: var(--black); --btn-background-hover: var(--neutral-dark); --btn-text-color: var(--white); --btn-text-color-hover: var(--white); --btn-border-color: var(--black); --btn-border-color-hover: var(--neutral-dark); --focus-color: var(--primary); } .btn--black.btn--outline { --btn-background: transparent; --btn-background-hover: var(--black); --btn-text-color: var(--black); --btn-text-color-hover: var(--white); --btn-border-width: 2px; --btn-border-color: var(--black); --btn-border-color-hover: var(--black); --focus-color: var(--primary); } .btn--white { --btn-background: var(--white); --btn-background-hover: var(--neutral-light); --btn-text-color: var(--black); --btn-text-color-hover: var(--black); --btn-border-color: var(--white); --btn-border-color-hover: var(--neutral-light); --focus-color: var(--primary); } .btn--white.btn--outline { --btn-background: transparent; --btn-background-hover: var(--white); --btn-text-color: var(--white); --btn-text-color-hover: var(--black); --btn-border-width: 2px; --btn-border-color: var(--white); --btn-border-color-hover: var(--white); --focus-color: var(--primary); } [class*="btn--"]:where(:not(.btn--none, .x-block-button)) { background: var(--btn-background); color: var(--btn-text-color); padding-block: var(--btn-padding-block); padding-inline: var(--btn-padding-inline); min-inline-size: var(--btn-min-width); line-height: var(--btn-line-height); font-size: var(--btn-font-size, var(--text-m)); font-weight: var(--btn-font-weight); font-style: var(--btn-font-style); text-transform: var(--btn-text-transform); letter-spacing: var(--btn-letter-spacing); text-decoration: var(--btn-text-decoration); border-width: var(--btn-border-width); border-style: var(--btn-border-style); border-radius: var(--btn-radius); border-color: var(--btn-border-color); transition: var(--btn-transition, var(--transition)); justify-content: var(--btn-justify-content, center); text-align: var(--btn-text-align, center); } @media (hover: hover) and (pointer: fine) { [class*="btn--"]:where(:not(.btn--none, .x-block-button)):hover { background: var(--btn-background-hover); color: var(--btn-text-color-hover); border-color: var(--btn-border-color-hover); text-decoration: var(--btn-text-decoration-hover); } } [class*="btn--"]:where(:not(.btn--none, .x-block-button)):focus { outline-style: solid; outline-color: var(--focus-color); outline-width: var(--focus-width); outline-offset: var(--focus-offset); } .btn--xs { font-size: var(--text-xs); } .btn--s { font-size: var(--text-s); } .btn--m { font-size: var(--text-m); } .btn--l { font-size: var(--text-l); } .btn--xl { font-size: var(--text-xl); } .btn--xxl { font-size: var(--text-xxl); } .btn--clear.btn--clear, .btn--none.btn--none { background: none; border: none; } .flex-grid--1:not(.brxe-container), .brxe-container.flex-grid--1 { --gap: var(--grid-gap); display: flex; flex-direction: column; gap: var(--gap); } .flex-grid--1:not(.brxe-container) > *, .brxe-container.flex-grid--1 > * { width: 100%; max-width: 100%; flex-basis: auto; } .flex-grid--2:not(.brxe-container), .brxe-container.flex-grid--2 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--2:not(.brxe-container).gap--xs, .brxe-container.flex-grid--2.gap--xs { --gap: var(--space-xs); } .flex-grid--2:not(.brxe-container).gap--s, .brxe-container.flex-grid--2.gap--s { --gap: var(--space-s); } .flex-grid--2:not(.brxe-container).gap--m, .brxe-container.flex-grid--2.gap--m { --gap: var(--space-m); } .flex-grid--2:not(.brxe-container).gap--l, .brxe-container.flex-grid--2.gap--l { --gap: var(--space-l); } .flex-grid--2:not(.brxe-container).gap--xl, .brxe-container.flex-grid--2.gap--xl { --gap: var(--space-xl); } .flex-grid--2:not(.brxe-container).gap--xxl, .brxe-container.flex-grid--2.gap--xxl { --gap: var(--space-xxl); } .flex-grid--2:not(.brxe-container) > *, .brxe-container.flex-grid--2 > * { flex-basis: calc((100% - (var(--gap) * 1)) / 2); } .flex-grid--3:not(.brxe-container), .brxe-container.flex-grid--3 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--3:not(.brxe-container).gap--xs, .brxe-container.flex-grid--3.gap--xs { --gap: var(--space-xs); } .flex-grid--3:not(.brxe-container).gap--s, .brxe-container.flex-grid--3.gap--s { --gap: var(--space-s); } .flex-grid--3:not(.brxe-container).gap--m, .brxe-container.flex-grid--3.gap--m { --gap: var(--space-m); } .flex-grid--3:not(.brxe-container).gap--l, .brxe-container.flex-grid--3.gap--l { --gap: var(--space-l); } .flex-grid--3:not(.brxe-container).gap--xl, .brxe-container.flex-grid--3.gap--xl { --gap: var(--space-xl); } .flex-grid--3:not(.brxe-container).gap--xxl, .brxe-container.flex-grid--3.gap--xxl { --gap: var(--space-xxl); } .flex-grid--3:not(.brxe-container) > *, .brxe-container.flex-grid--3 > * { flex-basis: calc((100% - (var(--gap) * 2)) / 3); } .flex-grid--4:not(.brxe-container), .brxe-container.flex-grid--4 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--4:not(.brxe-container).gap--xs, .brxe-container.flex-grid--4.gap--xs { --gap: var(--space-xs); } .flex-grid--4:not(.brxe-container).gap--s, .brxe-container.flex-grid--4.gap--s { --gap: var(--space-s); } .flex-grid--4:not(.brxe-container).gap--m, .brxe-container.flex-grid--4.gap--m { --gap: var(--space-m); } .flex-grid--4:not(.brxe-container).gap--l, .brxe-container.flex-grid--4.gap--l { --gap: var(--space-l); } .flex-grid--4:not(.brxe-container).gap--xl, .brxe-container.flex-grid--4.gap--xl { --gap: var(--space-xl); } .flex-grid--4:not(.brxe-container).gap--xxl, .brxe-container.flex-grid--4.gap--xxl { --gap: var(--space-xxl); } .flex-grid--4:not(.brxe-container) > *, .brxe-container.flex-grid--4 > * { flex-basis: calc((100% - (var(--gap) * 3)) / 4); } .flex-grid--5:not(.brxe-container), .brxe-container.flex-grid--5 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--5:not(.brxe-container).gap--xs, .brxe-container.flex-grid--5.gap--xs { --gap: var(--space-xs); } .flex-grid--5:not(.brxe-container).gap--s, .brxe-container.flex-grid--5.gap--s { --gap: var(--space-s); } .flex-grid--5:not(.brxe-container).gap--m, .brxe-container.flex-grid--5.gap--m { --gap: var(--space-m); } .flex-grid--5:not(.brxe-container).gap--l, .brxe-container.flex-grid--5.gap--l { --gap: var(--space-l); } .flex-grid--5:not(.brxe-container).gap--xl, .brxe-container.flex-grid--5.gap--xl { --gap: var(--space-xl); } .flex-grid--5:not(.brxe-container).gap--xxl, .brxe-container.flex-grid--5.gap--xxl { --gap: var(--space-xxl); } .flex-grid--5:not(.brxe-container) > *, .brxe-container.flex-grid--5 > * { flex-basis: calc((100% - (var(--gap) * 4)) / 5); } .flex-grid--6:not(.brxe-container), .brxe-container.flex-grid--6 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--6:not(.brxe-container).gap--xs, .brxe-container.flex-grid--6.gap--xs { --gap: var(--space-xs); } .flex-grid--6:not(.brxe-container).gap--s, .brxe-container.flex-grid--6.gap--s { --gap: var(--space-s); } .flex-grid--6:not(.brxe-container).gap--m, .brxe-container.flex-grid--6.gap--m { --gap: var(--space-m); } .flex-grid--6:not(.brxe-container).gap--l, .brxe-container.flex-grid--6.gap--l { --gap: var(--space-l); } .flex-grid--6:not(.brxe-container).gap--xl, .brxe-container.flex-grid--6.gap--xl { --gap: var(--space-xl); } .flex-grid--6:not(.brxe-container).gap--xxl, .brxe-container.flex-grid--6.gap--xxl { --gap: var(--space-xxl); } .flex-grid--6:not(.brxe-container) > *, .brxe-container.flex-grid--6 > * { flex-basis: calc((100% - (var(--gap) * 5)) / 6); } @media (max-width: 1366px) { .flex-grid--xl-1:not(.brxe-container), .brxe-container.flex-grid--xl-1 { --gap: var(--grid-gap); display: flex; flex-direction: column; gap: var(--gap); } .flex-grid--xl-1:not(.brxe-container) > *, .brxe-container.flex-grid--xl-1 > * { width: 100%; max-width: 100%; flex-basis: auto; } .flex-grid--xl-2:not(.brxe-container), .brxe-container.flex-grid--xl-2 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--xl-2:not(.brxe-container).gap--xl-xs, .brxe-container.flex-grid--xl-2.gap--xl-xs { --gap: var(--space-xs); } .flex-grid--xl-2:not(.brxe-container).gap--xl-s, .brxe-container.flex-grid--xl-2.gap--xl-s { --gap: var(--space-s); } .flex-grid--xl-2:not(.brxe-container).gap--xl-m, .brxe-container.flex-grid--xl-2.gap--xl-m { --gap: var(--space-m); } .flex-grid--xl-2:not(.brxe-container).gap--xl-l, .brxe-container.flex-grid--xl-2.gap--xl-l { --gap: var(--space-l); } .flex-grid--xl-2:not(.brxe-container).gap--xl-xl, .brxe-container.flex-grid--xl-2.gap--xl-xl { --gap: var(--space-xl); } .flex-grid--xl-2:not(.brxe-container).gap--xl-xxl, .brxe-container.flex-grid--xl-2.gap--xl-xxl { --gap: var(--space-xxl); } .flex-grid--xl-2:not(.brxe-container) > *, .brxe-container.flex-grid--xl-2 > * { flex-basis: calc((100% - (var(--gap) * 1)) / 2); } .flex-grid--xl-3:not(.brxe-container), .brxe-container.flex-grid--xl-3 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--xl-3:not(.brxe-container).gap--xl-xs, .brxe-container.flex-grid--xl-3.gap--xl-xs { --gap: var(--space-xs); } .flex-grid--xl-3:not(.brxe-container).gap--xl-s, .brxe-container.flex-grid--xl-3.gap--xl-s { --gap: var(--space-s); } .flex-grid--xl-3:not(.brxe-container).gap--xl-m, .brxe-container.flex-grid--xl-3.gap--xl-m { --gap: var(--space-m); } .flex-grid--xl-3:not(.brxe-container).gap--xl-l, .brxe-container.flex-grid--xl-3.gap--xl-l { --gap: var(--space-l); } .flex-grid--xl-3:not(.brxe-container).gap--xl-xl, .brxe-container.flex-grid--xl-3.gap--xl-xl { --gap: var(--space-xl); } .flex-grid--xl-3:not(.brxe-container).gap--xl-xxl, .brxe-container.flex-grid--xl-3.gap--xl-xxl { --gap: var(--space-xxl); } .flex-grid--xl-3:not(.brxe-container) > *, .brxe-container.flex-grid--xl-3 > * { flex-basis: calc((100% - (var(--gap) * 2)) / 3); } .flex-grid--xl-4:not(.brxe-container), .brxe-container.flex-grid--xl-4 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--xl-4:not(.brxe-container).gap--xl-xs, .brxe-container.flex-grid--xl-4.gap--xl-xs { --gap: var(--space-xs); } .flex-grid--xl-4:not(.brxe-container).gap--xl-s, .brxe-container.flex-grid--xl-4.gap--xl-s { --gap: var(--space-s); } .flex-grid--xl-4:not(.brxe-container).gap--xl-m, .brxe-container.flex-grid--xl-4.gap--xl-m { --gap: var(--space-m); } .flex-grid--xl-4:not(.brxe-container).gap--xl-l, .brxe-container.flex-grid--xl-4.gap--xl-l { --gap: var(--space-l); } .flex-grid--xl-4:not(.brxe-container).gap--xl-xl, .brxe-container.flex-grid--xl-4.gap--xl-xl { --gap: var(--space-xl); } .flex-grid--xl-4:not(.brxe-container).gap--xl-xxl, .brxe-container.flex-grid--xl-4.gap--xl-xxl { --gap: var(--space-xxl); } .flex-grid--xl-4:not(.brxe-container) > *, .brxe-container.flex-grid--xl-4 > * { flex-basis: calc((100% - (var(--gap) * 3)) / 4); } .flex-grid--xl-5:not(.brxe-container), .brxe-container.flex-grid--xl-5 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--xl-5:not(.brxe-container).gap--xl-xs, .brxe-container.flex-grid--xl-5.gap--xl-xs { --gap: var(--space-xs); } .flex-grid--xl-5:not(.brxe-container).gap--xl-s, .brxe-container.flex-grid--xl-5.gap--xl-s { --gap: var(--space-s); } .flex-grid--xl-5:not(.brxe-container).gap--xl-m, .brxe-container.flex-grid--xl-5.gap--xl-m { --gap: var(--space-m); } .flex-grid--xl-5:not(.brxe-container).gap--xl-l, .brxe-container.flex-grid--xl-5.gap--xl-l { --gap: var(--space-l); } .flex-grid--xl-5:not(.brxe-container).gap--xl-xl, .brxe-container.flex-grid--xl-5.gap--xl-xl { --gap: var(--space-xl); } .flex-grid--xl-5:not(.brxe-container).gap--xl-xxl, .brxe-container.flex-grid--xl-5.gap--xl-xxl { --gap: var(--space-xxl); } .flex-grid--xl-5:not(.brxe-container) > *, .brxe-container.flex-grid--xl-5 > * { flex-basis: calc((100% - (var(--gap) * 4)) / 5); } .flex-grid--xl-6:not(.brxe-container), .brxe-container.flex-grid--xl-6 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--xl-6:not(.brxe-container).gap--xl-xs, .brxe-container.flex-grid--xl-6.gap--xl-xs { --gap: var(--space-xs); } .flex-grid--xl-6:not(.brxe-container).gap--xl-s, .brxe-container.flex-grid--xl-6.gap--xl-s { --gap: var(--space-s); } .flex-grid--xl-6:not(.brxe-container).gap--xl-m, .brxe-container.flex-grid--xl-6.gap--xl-m { --gap: var(--space-m); } .flex-grid--xl-6:not(.brxe-container).gap--xl-l, .brxe-container.flex-grid--xl-6.gap--xl-l { --gap: var(--space-l); } .flex-grid--xl-6:not(.brxe-container).gap--xl-xl, .brxe-container.flex-grid--xl-6.gap--xl-xl { --gap: var(--space-xl); } .flex-grid--xl-6:not(.brxe-container).gap--xl-xxl, .brxe-container.flex-grid--xl-6.gap--xl-xxl { --gap: var(--space-xxl); } .flex-grid--xl-6:not(.brxe-container) > *, .brxe-container.flex-grid--xl-6 > * { flex-basis: calc((100% - (var(--gap) * 5)) / 6); } } @media (max-width: 992px) { .flex-grid--l-1:not(.brxe-container), .brxe-container.flex-grid--l-1 { --gap: var(--grid-gap); display: flex; flex-direction: column; gap: var(--gap); } .flex-grid--l-1:not(.brxe-container) > *, .brxe-container.flex-grid--l-1 > * { width: 100%; max-width: 100%; flex-basis: auto; } .flex-grid--l-2:not(.brxe-container), .brxe-container.flex-grid--l-2 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--l-2:not(.brxe-container).gap--l-xs, .brxe-container.flex-grid--l-2.gap--l-xs { --gap: var(--space-xs); } .flex-grid--l-2:not(.brxe-container).gap--l-s, .brxe-container.flex-grid--l-2.gap--l-s { --gap: var(--space-s); } .flex-grid--l-2:not(.brxe-container).gap--l-m, .brxe-container.flex-grid--l-2.gap--l-m { --gap: var(--space-m); } .flex-grid--l-2:not(.brxe-container).gap--l-l, .brxe-container.flex-grid--l-2.gap--l-l { --gap: var(--space-l); } .flex-grid--l-2:not(.brxe-container).gap--l-xl, .brxe-container.flex-grid--l-2.gap--l-xl { --gap: var(--space-xl); } .flex-grid--l-2:not(.brxe-container).gap--l-xxl, .brxe-container.flex-grid--l-2.gap--l-xxl { --gap: var(--space-xxl); } .flex-grid--l-2:not(.brxe-container) > *, .brxe-container.flex-grid--l-2 > * { flex-basis: calc((100% - (var(--gap) * 1)) / 2); } .flex-grid--l-3:not(.brxe-container), .brxe-container.flex-grid--l-3 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--l-3:not(.brxe-container).gap--l-xs, .brxe-container.flex-grid--l-3.gap--l-xs { --gap: var(--space-xs); } .flex-grid--l-3:not(.brxe-container).gap--l-s, .brxe-container.flex-grid--l-3.gap--l-s { --gap: var(--space-s); } .flex-grid--l-3:not(.brxe-container).gap--l-m, .brxe-container.flex-grid--l-3.gap--l-m { --gap: var(--space-m); } .flex-grid--l-3:not(.brxe-container).gap--l-l, .brxe-container.flex-grid--l-3.gap--l-l { --gap: var(--space-l); } .flex-grid--l-3:not(.brxe-container).gap--l-xl, .brxe-container.flex-grid--l-3.gap--l-xl { --gap: var(--space-xl); } .flex-grid--l-3:not(.brxe-container).gap--l-xxl, .brxe-container.flex-grid--l-3.gap--l-xxl { --gap: var(--space-xxl); } .flex-grid--l-3:not(.brxe-container) > *, .brxe-container.flex-grid--l-3 > * { flex-basis: calc((100% - (var(--gap) * 2)) / 3); } .flex-grid--l-4:not(.brxe-container), .brxe-container.flex-grid--l-4 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--l-4:not(.brxe-container).gap--l-xs, .brxe-container.flex-grid--l-4.gap--l-xs { --gap: var(--space-xs); } .flex-grid--l-4:not(.brxe-container).gap--l-s, .brxe-container.flex-grid--l-4.gap--l-s { --gap: var(--space-s); } .flex-grid--l-4:not(.brxe-container).gap--l-m, .brxe-container.flex-grid--l-4.gap--l-m { --gap: var(--space-m); } .flex-grid--l-4:not(.brxe-container).gap--l-l, .brxe-container.flex-grid--l-4.gap--l-l { --gap: var(--space-l); } .flex-grid--l-4:not(.brxe-container).gap--l-xl, .brxe-container.flex-grid--l-4.gap--l-xl { --gap: var(--space-xl); } .flex-grid--l-4:not(.brxe-container).gap--l-xxl, .brxe-container.flex-grid--l-4.gap--l-xxl { --gap: var(--space-xxl); } .flex-grid--l-4:not(.brxe-container) > *, .brxe-container.flex-grid--l-4 > * { flex-basis: calc((100% - (var(--gap) * 3)) / 4); } .flex-grid--l-5:not(.brxe-container), .brxe-container.flex-grid--l-5 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--l-5:not(.brxe-container).gap--l-xs, .brxe-container.flex-grid--l-5.gap--l-xs { --gap: var(--space-xs); } .flex-grid--l-5:not(.brxe-container).gap--l-s, .brxe-container.flex-grid--l-5.gap--l-s { --gap: var(--space-s); } .flex-grid--l-5:not(.brxe-container).gap--l-m, .brxe-container.flex-grid--l-5.gap--l-m { --gap: var(--space-m); } .flex-grid--l-5:not(.brxe-container).gap--l-l, .brxe-container.flex-grid--l-5.gap--l-l { --gap: var(--space-l); } .flex-grid--l-5:not(.brxe-container).gap--l-xl, .brxe-container.flex-grid--l-5.gap--l-xl { --gap: var(--space-xl); } .flex-grid--l-5:not(.brxe-container).gap--l-xxl, .brxe-container.flex-grid--l-5.gap--l-xxl { --gap: var(--space-xxl); } .flex-grid--l-5:not(.brxe-container) > *, .brxe-container.flex-grid--l-5 > * { flex-basis: calc((100% - (var(--gap) * 4)) / 5); } .flex-grid--l-6:not(.brxe-container), .brxe-container.flex-grid--l-6 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--l-6:not(.brxe-container).gap--l-xs, .brxe-container.flex-grid--l-6.gap--l-xs { --gap: var(--space-xs); } .flex-grid--l-6:not(.brxe-container).gap--l-s, .brxe-container.flex-grid--l-6.gap--l-s { --gap: var(--space-s); } .flex-grid--l-6:not(.brxe-container).gap--l-m, .brxe-container.flex-grid--l-6.gap--l-m { --gap: var(--space-m); } .flex-grid--l-6:not(.brxe-container).gap--l-l, .brxe-container.flex-grid--l-6.gap--l-l { --gap: var(--space-l); } .flex-grid--l-6:not(.brxe-container).gap--l-xl, .brxe-container.flex-grid--l-6.gap--l-xl { --gap: var(--space-xl); } .flex-grid--l-6:not(.brxe-container).gap--l-xxl, .brxe-container.flex-grid--l-6.gap--l-xxl { --gap: var(--space-xxl); } .flex-grid--l-6:not(.brxe-container) > *, .brxe-container.flex-grid--l-6 > * { flex-basis: calc((100% - (var(--gap) * 5)) / 6); } } @media (max-width: 768px) { .flex-grid--m-1:not(.brxe-container), .brxe-container.flex-grid--m-1 { --gap: var(--grid-gap); display: flex; flex-direction: column; gap: var(--gap); } .flex-grid--m-1:not(.brxe-container) > *, .brxe-container.flex-grid--m-1 > * { width: 100%; max-width: 100%; flex-basis: auto; } .flex-grid--m-2:not(.brxe-container), .brxe-container.flex-grid--m-2 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--m-2:not(.brxe-container).gap--m-xs, .brxe-container.flex-grid--m-2.gap--m-xs { --gap: var(--space-xs); } .flex-grid--m-2:not(.brxe-container).gap--m-s, .brxe-container.flex-grid--m-2.gap--m-s { --gap: var(--space-s); } .flex-grid--m-2:not(.brxe-container).gap--m-m, .brxe-container.flex-grid--m-2.gap--m-m { --gap: var(--space-m); } .flex-grid--m-2:not(.brxe-container).gap--m-l, .brxe-container.flex-grid--m-2.gap--m-l { --gap: var(--space-l); } .flex-grid--m-2:not(.brxe-container).gap--m-xl, .brxe-container.flex-grid--m-2.gap--m-xl { --gap: var(--space-xl); } .flex-grid--m-2:not(.brxe-container).gap--m-xxl, .brxe-container.flex-grid--m-2.gap--m-xxl { --gap: var(--space-xxl); } .flex-grid--m-2:not(.brxe-container) > *, .brxe-container.flex-grid--m-2 > * { flex-basis: calc((100% - (var(--gap) * 1)) / 2); } .flex-grid--m-3:not(.brxe-container), .brxe-container.flex-grid--m-3 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--m-3:not(.brxe-container).gap--m-xs, .brxe-container.flex-grid--m-3.gap--m-xs { --gap: var(--space-xs); } .flex-grid--m-3:not(.brxe-container).gap--m-s, .brxe-container.flex-grid--m-3.gap--m-s { --gap: var(--space-s); } .flex-grid--m-3:not(.brxe-container).gap--m-m, .brxe-container.flex-grid--m-3.gap--m-m { --gap: var(--space-m); } .flex-grid--m-3:not(.brxe-container).gap--m-l, .brxe-container.flex-grid--m-3.gap--m-l { --gap: var(--space-l); } .flex-grid--m-3:not(.brxe-container).gap--m-xl, .brxe-container.flex-grid--m-3.gap--m-xl { --gap: var(--space-xl); } .flex-grid--m-3:not(.brxe-container).gap--m-xxl, .brxe-container.flex-grid--m-3.gap--m-xxl { --gap: var(--space-xxl); } .flex-grid--m-3:not(.brxe-container) > *, .brxe-container.flex-grid--m-3 > * { flex-basis: calc((100% - (var(--gap) * 2)) / 3); } .flex-grid--m-4:not(.brxe-container), .brxe-container.flex-grid--m-4 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--m-4:not(.brxe-container).gap--m-xs, .brxe-container.flex-grid--m-4.gap--m-xs { --gap: var(--space-xs); } .flex-grid--m-4:not(.brxe-container).gap--m-s, .brxe-container.flex-grid--m-4.gap--m-s { --gap: var(--space-s); } .flex-grid--m-4:not(.brxe-container).gap--m-m, .brxe-container.flex-grid--m-4.gap--m-m { --gap: var(--space-m); } .flex-grid--m-4:not(.brxe-container).gap--m-l, .brxe-container.flex-grid--m-4.gap--m-l { --gap: var(--space-l); } .flex-grid--m-4:not(.brxe-container).gap--m-xl, .brxe-container.flex-grid--m-4.gap--m-xl { --gap: var(--space-xl); } .flex-grid--m-4:not(.brxe-container).gap--m-xxl, .brxe-container.flex-grid--m-4.gap--m-xxl { --gap: var(--space-xxl); } .flex-grid--m-4:not(.brxe-container) > *, .brxe-container.flex-grid--m-4 > * { flex-basis: calc((100% - (var(--gap) * 3)) / 4); } .flex-grid--m-5:not(.brxe-container), .brxe-container.flex-grid--m-5 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--m-5:not(.brxe-container).gap--m-xs, .brxe-container.flex-grid--m-5.gap--m-xs { --gap: var(--space-xs); } .flex-grid--m-5:not(.brxe-container).gap--m-s, .brxe-container.flex-grid--m-5.gap--m-s { --gap: var(--space-s); } .flex-grid--m-5:not(.brxe-container).gap--m-m, .brxe-container.flex-grid--m-5.gap--m-m { --gap: var(--space-m); } .flex-grid--m-5:not(.brxe-container).gap--m-l, .brxe-container.flex-grid--m-5.gap--m-l { --gap: var(--space-l); } .flex-grid--m-5:not(.brxe-container).gap--m-xl, .brxe-container.flex-grid--m-5.gap--m-xl { --gap: var(--space-xl); } .flex-grid--m-5:not(.brxe-container).gap--m-xxl, .brxe-container.flex-grid--m-5.gap--m-xxl { --gap: var(--space-xxl); } .flex-grid--m-5:not(.brxe-container) > *, .brxe-container.flex-grid--m-5 > * { flex-basis: calc((100% - (var(--gap) * 4)) / 5); } .flex-grid--m-6:not(.brxe-container), .brxe-container.flex-grid--m-6 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--m-6:not(.brxe-container).gap--m-xs, .brxe-container.flex-grid--m-6.gap--m-xs { --gap: var(--space-xs); } .flex-grid--m-6:not(.brxe-container).gap--m-s, .brxe-container.flex-grid--m-6.gap--m-s { --gap: var(--space-s); } .flex-grid--m-6:not(.brxe-container).gap--m-m, .brxe-container.flex-grid--m-6.gap--m-m { --gap: var(--space-m); } .flex-grid--m-6:not(.brxe-container).gap--m-l, .brxe-container.flex-grid--m-6.gap--m-l { --gap: var(--space-l); } .flex-grid--m-6:not(.brxe-container).gap--m-xl, .brxe-container.flex-grid--m-6.gap--m-xl { --gap: var(--space-xl); } .flex-grid--m-6:not(.brxe-container).gap--m-xxl, .brxe-container.flex-grid--m-6.gap--m-xxl { --gap: var(--space-xxl); } .flex-grid--m-6:not(.brxe-container) > *, .brxe-container.flex-grid--m-6 > * { flex-basis: calc((100% - (var(--gap) * 5)) / 6); } } @media (max-width: 480px) { .flex-grid--s-1:not(.brxe-container), .brxe-container.flex-grid--s-1 { --gap: var(--grid-gap); display: flex; flex-direction: column; gap: var(--gap); } .flex-grid--s-1:not(.brxe-container) > *, .brxe-container.flex-grid--s-1 > * { width: 100%; max-width: 100%; flex-basis: auto; } .flex-grid--s-2:not(.brxe-container), .brxe-container.flex-grid--s-2 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--s-2:not(.brxe-container).gap--s-xs, .brxe-container.flex-grid--s-2.gap--s-xs { --gap: var(--space-xs); } .flex-grid--s-2:not(.brxe-container).gap--s-s, .brxe-container.flex-grid--s-2.gap--s-s { --gap: var(--space-s); } .flex-grid--s-2:not(.brxe-container).gap--s-m, .brxe-container.flex-grid--s-2.gap--s-m { --gap: var(--space-m); } .flex-grid--s-2:not(.brxe-container).gap--s-l, .brxe-container.flex-grid--s-2.gap--s-l { --gap: var(--space-l); } .flex-grid--s-2:not(.brxe-container).gap--s-xl, .brxe-container.flex-grid--s-2.gap--s-xl { --gap: var(--space-xl); } .flex-grid--s-2:not(.brxe-container).gap--s-xxl, .brxe-container.flex-grid--s-2.gap--s-xxl { --gap: var(--space-xxl); } .flex-grid--s-2:not(.brxe-container) > *, .brxe-container.flex-grid--s-2 > * { flex-basis: calc((100% - (var(--gap) * 1)) / 2); } .flex-grid--s-3:not(.brxe-container), .brxe-container.flex-grid--s-3 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--s-3:not(.brxe-container).gap--s-xs, .brxe-container.flex-grid--s-3.gap--s-xs { --gap: var(--space-xs); } .flex-grid--s-3:not(.brxe-container).gap--s-s, .brxe-container.flex-grid--s-3.gap--s-s { --gap: var(--space-s); } .flex-grid--s-3:not(.brxe-container).gap--s-m, .brxe-container.flex-grid--s-3.gap--s-m { --gap: var(--space-m); } .flex-grid--s-3:not(.brxe-container).gap--s-l, .brxe-container.flex-grid--s-3.gap--s-l { --gap: var(--space-l); } .flex-grid--s-3:not(.brxe-container).gap--s-xl, .brxe-container.flex-grid--s-3.gap--s-xl { --gap: var(--space-xl); } .flex-grid--s-3:not(.brxe-container).gap--s-xxl, .brxe-container.flex-grid--s-3.gap--s-xxl { --gap: var(--space-xxl); } .flex-grid--s-3:not(.brxe-container) > *, .brxe-container.flex-grid--s-3 > * { flex-basis: calc((100% - (var(--gap) * 2)) / 3); } .flex-grid--s-4:not(.brxe-container), .brxe-container.flex-grid--s-4 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--s-4:not(.brxe-container).gap--s-xs, .brxe-container.flex-grid--s-4.gap--s-xs { --gap: var(--space-xs); } .flex-grid--s-4:not(.brxe-container).gap--s-s, .brxe-container.flex-grid--s-4.gap--s-s { --gap: var(--space-s); } .flex-grid--s-4:not(.brxe-container).gap--s-m, .brxe-container.flex-grid--s-4.gap--s-m { --gap: var(--space-m); } .flex-grid--s-4:not(.brxe-container).gap--s-l, .brxe-container.flex-grid--s-4.gap--s-l { --gap: var(--space-l); } .flex-grid--s-4:not(.brxe-container).gap--s-xl, .brxe-container.flex-grid--s-4.gap--s-xl { --gap: var(--space-xl); } .flex-grid--s-4:not(.brxe-container).gap--s-xxl, .brxe-container.flex-grid--s-4.gap--s-xxl { --gap: var(--space-xxl); } .flex-grid--s-4:not(.brxe-container) > *, .brxe-container.flex-grid--s-4 > * { flex-basis: calc((100% - (var(--gap) * 3)) / 4); } .flex-grid--s-5:not(.brxe-container), .brxe-container.flex-grid--s-5 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--s-5:not(.brxe-container).gap--s-xs, .brxe-container.flex-grid--s-5.gap--s-xs { --gap: var(--space-xs); } .flex-grid--s-5:not(.brxe-container).gap--s-s, .brxe-container.flex-grid--s-5.gap--s-s { --gap: var(--space-s); } .flex-grid--s-5:not(.brxe-container).gap--s-m, .brxe-container.flex-grid--s-5.gap--s-m { --gap: var(--space-m); } .flex-grid--s-5:not(.brxe-container).gap--s-l, .brxe-container.flex-grid--s-5.gap--s-l { --gap: var(--space-l); } .flex-grid--s-5:not(.brxe-container).gap--s-xl, .brxe-container.flex-grid--s-5.gap--s-xl { --gap: var(--space-xl); } .flex-grid--s-5:not(.brxe-container).gap--s-xxl, .brxe-container.flex-grid--s-5.gap--s-xxl { --gap: var(--space-xxl); } .flex-grid--s-5:not(.brxe-container) > *, .brxe-container.flex-grid--s-5 > * { flex-basis: calc((100% - (var(--gap) * 4)) / 5); } .flex-grid--s-6:not(.brxe-container), .brxe-container.flex-grid--s-6 { --gap: var(--grid-gap); display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); justify-content: center; } .flex-grid--s-6:not(.brxe-container).gap--s-xs, .brxe-container.flex-grid--s-6.gap--s-xs { --gap: var(--space-xs); } .flex-grid--s-6:not(.brxe-container).gap--s-s, .brxe-container.flex-grid--s-6.gap--s-s { --gap: var(--space-s); } .flex-grid--s-6:not(.brxe-container).gap--s-m, .brxe-container.flex-grid--s-6.gap--s-m { --gap: var(--space-m); } .flex-grid--s-6:not(.brxe-container).gap--s-l, .brxe-container.flex-grid--s-6.gap--s-l { --gap: var(--space-l); } .flex-grid--s-6:not(.brxe-container).gap--s-xl, .brxe-container.flex-grid--s-6.gap--s-xl { --gap: var(--space-xl); } .flex-grid--s-6:not(.brxe-container).gap--s-xxl, .brxe-container.flex-grid--s-6.gap--s-xxl { --gap: var(--space-xxl); } .flex-grid--s-6:not(.brxe-container) > *, .brxe-container.flex-grid--s-6 > * { flex-basis: calc((100% - (var(--gap) * 5)) / 6); } } #bricks-blank-canvas .description { max-width: 100%; }