/* Base */ /* ! tailwindcss v3.4.3 | MIT License | https://tailwindcss.com */ /* 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) */ *, ::before, ::after { box-sizing: border-box; /* 1 */ border-width: 0; /* 2 */ border-style: solid; /* 2 */ border-color: #e5e7eb; /* 2 */ } ::before, ::after { --tw-content: ''; } /* 1. Use a consistent sensible line-height in all browsers. 2. Prevent adjustments of font size after orientation changes in iOS. 3. Use a more readable tab size. 4. Use the user's configured `sans` font-family by default. 5. Use the user's configured `sans` font-feature-settings by default. 6. Use the user's configured `sans` font-variation-settings by default. 7. Disable tap highlights on iOS */ html, :host { line-height: 1.5; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -moz-tab-size: 4; /* 3 */ -o-tab-size: 4; tab-size: 4; /* 3 */ font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */ font-feature-settings: normal; /* 5 */ font-variation-settings: normal; /* 6 */ -webkit-tap-highlight-color: transparent; /* 7 */ } /* 1. Remove the margin in all browsers. 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element. */ body { margin: 0; /* 1 */ line-height: inherit; /* 2 */ } /* 1. Add the correct height in Firefox. 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) 3. Ensure horizontal rules are visible by default. */ hr { height: 0; /* 1 */ color: inherit; /* 2 */ border-top-width: 1px; /* 3 */ } /* Add the correct text decoration in Chrome, Edge, and Safari. */ abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } /* Remove the default font size and weight for headings. */ h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } /* Reset links to optimize for opt-in styling instead of opt-out. */ a { color: inherit; text-decoration: inherit; } /* Add the correct font weight in Edge and Safari. */ b, strong { font-weight: bolder; } /* 1. Use the user's configured `mono` font-family by default. 2. Use the user's configured `mono` font-feature-settings by default. 3. Use the user's configured `mono` font-variation-settings by default. 4. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */ font-feature-settings: normal; /* 2 */ font-variation-settings: normal; /* 3 */ font-size: 1em; /* 4 */ } /* Add the correct font size in all browsers. */ small { font-size: 80%; } /* Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297) 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016) 3. Remove gaps between table borders by default. */ table { text-indent: 0; /* 1 */ border-color: inherit; /* 2 */ border-collapse: collapse; /* 3 */ } /* 1. Change the font styles in all browsers. 2. Remove the margin in Firefox and Safari. 3. Remove default padding in all browsers. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-feature-settings: inherit; /* 1 */ font-variation-settings: inherit; /* 1 */ font-size: 100%; /* 1 */ font-weight: inherit; /* 1 */ line-height: inherit; /* 1 */ letter-spacing: inherit; /* 1 */ color: inherit; /* 1 */ margin: 0; /* 2 */ padding: 0; /* 3 */ } /* Remove the inheritance of text transform in Edge and Firefox. */ button, select { text-transform: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Remove default button styles. */ button, input:where([type='button']), input:where([type='reset']), input:where([type='submit']) { -webkit-appearance: button; /* 1 */ background-color: transparent; /* 2 */ background-image: none; /* 2 */ } /* Use the modern Firefox focus style for all focusable elements. */ :-moz-focusring { outline: auto; } /* Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) */ :-moz-ui-invalid { box-shadow: none; } /* Add the correct vertical alignment in Chrome and Firefox. */ progress { vertical-align: baseline; } /* Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /* 1. Correct the odd appearance in Chrome and Safari. 2. Correct the outline style in Safari. */ [type='search'] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /* Remove the inner padding in Chrome and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Add the correct display in Chrome and Safari. */ summary { display: list-item; } /* Removes the default spacing and border for appropriate elements. */ blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0; } fieldset { margin: 0; padding: 0; } legend { padding: 0; } ol, ul, menu { list-style: none; margin: 0; padding: 0; } /* Reset default styling for dialogs. */ dialog { padding: 0; } /* Prevent resizing textareas horizontally by default. */ textarea { resize: vertical; } /* 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) 2. Set the default placeholder color to the user's configured gray 400 color. */ input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } input::placeholder, textarea::placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } /* Set the default cursor for buttons. */ button, [role="button"] { cursor: pointer; } /* Make sure disabled buttons don't get the pointer cursor. */ :disabled { cursor: default; } /* 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210) This can trigger a poorly considered lint error in some tools but is included by design. */ img, svg, video, canvas, audio, iframe, embed, object { display: block; /* 1 */ vertical-align: middle; /* 2 */ } /* Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) */ img, video { max-width: 100%; height: auto; } /* Make elements with the HTML hidden attribute stay hidden by default */ [hidden] { display: none; } *, ::before, ::after { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ; } ::backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ; } /* Expana System: Masthead */ :root { --wp-admin-bar: 32px; --wp-admin-bar-mobile: 46px; } /** '||''''| || . ||'''| \\ // '||''|, '''|. `||''|, '''|. || >< || || .|''|| || || .|''|| .||....| // \\ ||..|' `|..||. .|| ||. `|..||. || .|| */ /** * This uses the background and foreground colors declared in the * `theme.json` file and is applied both to the frontend and in the block * editor. */ body { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); -webkit-font-smoothing: antialiased; margin-top: 0px !important; } iframe { max-width: 100%; } .col-span-3 { grid-column: span 3 / span 3; } img { max-width: 100%; } /* TEMPORARY FIX TO BE REMOVED */ .masthead-light.sticky { background: white; } #gt-nvframe { display: none !important; } /* Expana System: Typography */ body, .font-body { font-family: LabGrotesqueMintec-Light, sans-serif; } .fluentform-step body.col-span-12.mt-24 a,.fluentform-step .col-span-12.mt-24 .font-body a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } body, .font-body { font-size: 16px; line-height: 140%; --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .font-body-bold { font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.font-body-bold.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.font-body-bold.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .font-body-bold { font-size: 16px; line-height: 130%; } h1, h2, .h1, .h2, h3, .h3, h4, .h4, h5, .h5 { font-family: KHGiga-Light, sans-serif; } h1, .h1 { font-size: 48px; } @media (min-width: 1024px) { h1, .h1 { font-size: 68px; } } h1, .h1 { line-height:105%; /* font-weight: 300; */ } h2, .h2 { font-size: 39px; } @media (min-width: 1024px) { h2, .h2 { font-size: 48px; } } h2, .h2 { line-height: 120%; font-weight: 300; } h2.sans, .h2.sans { font-family: LabGrotesqueMintec-Light, sans-serif; } .fluentform-step h2.col-span-12.mt-24.sans a,.fluentform-step .col-span-12.mt-24 .h2.sans a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } h3, .h3 { font-size: 27px; } @media (min-width: 1024px) { h3, .h3 { font-size: 34px; } } h3, .h3 { line-height: 120%; font-weight: 300; } h4, .h4 { font-size: 22px; } @media (min-width: 1024px) { h4, .h4 { font-size: 24px; } } h4, .h4 { line-height: 120%; font-weight: 300; } h5, .h5 { font-size: 20px; } @media (min-width: 1024px) { h5, .h5 { font-size: 21px; } } h5, .h5 { font-family: LabGrotesqueMintec-Medium, sans-serif; } h5.roi-step-buttons.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top,.roi-step-buttons .h5.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } h5.roi-step-buttons.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label,.roi-step-buttons .h5.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } h5, .h5 { line-height: 120%; font-weight: 300; } h6, .h6 { font-size: 18px; line-height: 120%; font-family: LabGrotesqueMintec-Medium, sans-serif; } h6.roi-step-buttons.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top,.roi-step-buttons .h6.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } h6.roi-step-buttons.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label,.roi-step-buttons .h6.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .font-lead { font-size: 18px; line-height: 140%; } .font-lead-med { font-size: 18px; font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.font-lead-med.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.font-lead-med.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .font-lead-med { line-height: 140%; } .font-small { font-size: 14px; font-family: LabGrotesqueMintec-Light, sans-serif; } .fluentform-step .col-span-12.mt-24.font-small a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } .font-small { line-height: 120%; } .font-small-bold { font-size: 14px; font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.font-small-bold.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.font-small-bold.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .font-small-bold { line-height: 120%; } .font-button-label { font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.font-button-label.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.font-button-label.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .font-button-label { line-height: 120%; } .font-button-label-small { font-size: 15px; font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.font-button-label-small.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.font-button-label-small.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .font-button-label-small { line-height: 120%; } .font-quote { font-family: KHGiga-Light, sans-serif; font-size: 27px; } @media (min-width: 1024px) { .font-quote { font-size: 34px; } } .font-quote { line-height: 120%; line-height: 2rem; } @media (min-width: 1280px) { .font-quote { line-height: 2.5rem; } } .font-quote-mark { font-family: KHGiga-Light, sans-serif; font-size: 115px; } ::-moz-selection { background-color: rgb(15 125 75 / 0.5); } ::selection { background-color: rgb(15 125 75 / 0.5); } /* Bullet tick list */ .list-bullets { display: flex; flex-direction: column; gap: 1rem; margin-bottom:0!important; } .list-bullets li { margin-bottom:0!important; } .list-bullets li:last-of-type:not(:only-child) { margin-bottom: 40px!important; } .list-bullets { padding-left:0!important; } /* Remove padding for this special type of list */ .list-bullets li { display: flex; align-items: flex-start; gap: .5rem; } .list-bullets li:before { content: ''; display: block; width: 1.5rem; height: 1.5rem; background-image: url('../svg/icon-list-check-green.svg'); } /* Tel and mailto links */ a.link-has-icon[href^="tel:"], a.link-has-icon[href^="mailto:"] { display: flex; align-items: center; gap: .5rem; } a.link-has-icon[href^="tel:"]:before, a.link-has-icon[href^="mailto:"]:before { content: ''; display: block; width: 1.5rem; height: 1.5rem; } /* Tel and mailto links */ a.link-has-icon[href^="tel:"]:before { background-image: url('../svg/icon-list-telephone.svg'); } a.link-has-icon[href^="mailto:"]:before { background-image: url('../svg/icon-list-mail.svg'); } .align-self-end{ align-self: end; } /* Components */ .\!container { width: 100% !important; margin-right: auto !important; margin-left: auto !important; padding-right: 16px !important; padding-left: 16px !important; } .container { width: 100%; margin-right: auto; margin-left: auto; padding-right: 16px; padding-left: 16px; } @media (min-width: 640px) { .\!container { max-width: 640px !important; } .container { max-width: 640px; } } @media (min-width: 768px) { .\!container { max-width: 768px !important; padding-right: 20px !important; padding-left: 20px !important; } .container { max-width: 768px; padding-right: 20px; padding-left: 20px; } } @media (min-width: 1024px) { .\!container { max-width: 1024px !important; padding-right: 52px !important; padding-left: 52px !important; } .container { max-width: 1024px; padding-right: 52px; padding-left: 52px; } } @media (min-width: 1280px) { .\!container { max-width: 1280px !important; } .container { max-width: 1280px; } } .checkListItems{ background: #f5f7f9; min-width: 250px; min-height: auto; font-size: 15px; padding: 15px; text-transform: capitalize; } .checklist { overflow-y: auto; max-height: 350px; background: #0f7d4b17; } /* Expana System: Buttons */ .btn { text-decoration: none!important; } /* Expana System: Cards */ .card { border-radius: 8px; overflow: hidden; cursor: pointer; } /* Padding added too globally. Need to test against all card types */ /* @apply px-24; */ /* @apply py-28; */ /* Temp fix. Refactor correctly */ .card--news, .card--events, .card--insights, .card--resource, .card--featured-resource, .card--client-story, .card--topic, .card--insights, .card--webinar { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; border-width: 1px; --tw-border-opacity: 1; border-color: rgb(209 211 213 / var(--tw-border-opacity)); } .card img { border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; } .card * { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; transition-duration: 500ms; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .card--hover { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; transition-duration: 500ms; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .card--hover:hover { --tw-translate-y: -20px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); --tw-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.14); --tw-shadow-colored: 0px 8px 16px 0px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .card--news, .card--events, .card--insights, .card--resource, .card--webinar { grid-column: span 12 / span 12; } .fluentform-step .card--news.mt-24.font-labgLight a,.fluentform-step .card--events.mt-24.font-labgLight a,.fluentform-step .card--insights.mt-24.font-labgLight a,.fluentform-step .card--resource.mt-24.font-labgLight a,.fluentform-step .card--webinar.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .card--news, .card--events, .card--insights, .card--resource, .card--webinar { grid-column: span 6 / span 6; } } @media (min-width: 1024px) { .card--news, .card--events, .card--insights, .card--resource, .card--webinar { grid-column: span 4 / span 4; } } .card--news .content, .card--events .content, .card--insights .content, .card--resource .content, .card--webinar .content { padding: 24px; } .card--featured-resource { grid-column: span 12 / span 12; } .fluentform-step .card--featured-resource.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .card--featured-resource { grid-column: span 12 / span 12; } } @media (min-width: 1024px) { .card--featured-resource { grid-column: span 8 / span 8; } } .card--featured-resource .content { padding: 24px; } .card--events { background-color: transparent; border-width: 0px; } .card--events img { border-radius: 8px; border-style: none; } .card__border-top { border-top-width: 1px; } .card--client-story:hover h3 { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--client-story:hover h3 { color: #21ff49; } .card--client-story .content { display: flex; flex-direction: column; padding: 24px; } @media (min-width: 1024px) { .card--client-story { grid-column: span 4 / span 4; } } .card--client-story { border-style: none; padding: 24px; } .card--client-story .content { padding: 0px; } .card--topic { --tw-bg-opacity: 1; background-color: rgb(245 247 249 / var(--tw-bg-opacity)); grid-column: span 12 / span 12; } .fluentform-step .card--topic.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .card--topic { grid-column: span 6 / span 6; } } @media (min-width: 1024px) { .card--topic { grid-column: span 4 / span 4; } } .card--topic .content { display: flex; flex-direction: column; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; padding: 24px; } .card--insights { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .card--insights .content { border: none; } .card--insights .labels { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .bg-fn-ModBgMidGreyTheme .labels, .bg-fn-ModBgMidGreyTheme .date { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .bg-fn-ModBgMidGreyTheme.card:hover h3 { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.bg-fn-ModBgMidGreyTheme.card:hover h3 { color: #21ff49; } .card--resource { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--resource { color: rgb(163 166 172); } .card--resource .content { border: none; } .card--resource .labels { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--resource .labels { color: rgb(163 166 172); } .bg-fn-ModBgMidGreyTheme .labels, .bg-fn-ModBgMidGreyTheme .date { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .bg-fn-ModBgMidGreyTheme.card:hover h3 { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.bg-fn-ModBgMidGreyTheme.card:hover h3 { color: #21ff49; } .card--featured-resource { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--featured-resource { color: rgb(163 166 172); } .card--featured-resource .content { border: none; } .card--featured-resource .labels { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--featured-resource .labels { color: rgb(163 166 172); } .bg-fn-ModBgMidGreyTheme .labels, .bg-fn-ModBgMidGreyTheme .date { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .bg-fn-ModBgMidGreyTheme.card:hover h3 { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.bg-fn-ModBgMidGreyTheme.card:hover h3 { color: #21ff49; } .card--webinar { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--webinar { color: #21ff49; } .card--webinar .content { border: none; } .card--use-case { grid-column: span 12 / span 12; } .fluentform-step .card--use-case.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .card--use-case { grid-column: span 6 / span 6; } } @media (min-width: 1024px) { .card--use-case { grid-column: span 4 / span 4; } } @media (min-width: 1280px) { .card--use-case { grid-column: span 3 / span 3; } } .card--use-case { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); border-width: 1px; } .card--use-case .card-title { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--use-case .card-title { color: #21ff49; } .card--use-case:hover { --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); } .card--profile { grid-column: span 12 / span 12; } .fluentform-step .card--profile.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .card--profile { grid-column: span 6 / span 6; } } @media (min-width: 1024px) { .card--profile { grid-column: span 4 / span 4; } } @media (min-width: 1280px) { .card--profile { grid-column: span 3 / span 3; } } .card--profile--bio { position: absolute; inset: 0px; display: flex; flex-direction: column; --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); padding: 24px; --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); opacity: 0; } .card--profile--bio p { line-height: 140%; } .card--profile--bio:hover { opacity: 1; } .card--profile:hover h3 { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--profile:hover h3 { color: #21ff49; } .card--client-story { padding: 24px; --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .card--client-story:hover { --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); } .card--role, .card--industry { grid-column: span 12 / span 12; } .fluentform-step .card--role.mt-24.font-labgLight a,.fluentform-step .card--industry.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .card--role, .card--industry { grid-column: span 6 / span 6; } } @media (min-width: 1024px) { .card--role, .card--industry { grid-column: span 4 / span 4; } } .card--role, .card--industry { display: flex; padding: 24px; border-style: none; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .card--role:hover, .card--industry:hover { --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); } .card--role:hover h3, .card--industry:hover h3 { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--role:hover h3,.anchor-side-menu--column .anchor-side-menu__link .card--industry:hover h3 { color: #21ff49; } .card--role .content, .card--industry .content { display: flex; flex-direction: column; } .card--content { padding: 24px; } @media (min-width: 1024px) { .card--content { padding: 48px; } } .card--content .card-title { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .card--content:hover { --tw-bg-opacity: 1 !important; background-color: rgb(206 231 213 / var(--tw-bg-opacity)) !important; } .card--content.style-outline { border-width: 1px; --tw-border-opacity: 1; border-color: rgb(209 211 213 / var(--tw-border-opacity)); } .card--content.style-large-solid .content { align-items: center; } @media (min-width: 1024px) { .card--content.style-large-solid .title, .card--content.style-large-solid .summary { margin-left: 50px; margin-right: 50px; } } .card--content.style-large-solid .card-title, .card--content.style-large-solid .summary { text-align: center; } .card--commodity-category { overflow: visible; } .card--commodity-category:hover figure { --tw-translate-y: -5px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .card--commodity-category:hover h3 { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--commodity-category:hover h3 { color: #21ff49; } .card--tiered-sponsor-card { overflow: visible; } .card--tiered-sponsor-card:hover figure { --tw-translate-y: -5px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .card--tiered-sponsor-card:hover h3 { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .anchor-side-menu--column .anchor-side-menu__link.card--tiered-sponsor-card:hover h3 { color: #21ff49; } .content-grid.theme-light .card--content.style-solid, .content-grid.theme-light .card--content.style-large-solid { --tw-bg-opacity: 1; background-color: rgb(245 247 249 / var(--tw-bg-opacity)); } .content-grid.theme-lightGreen .card--content.style-solid, .content-grid.theme-grey .card--content.style-solid { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .content-grid.theme-lightGrey .card--content.style-outline { --tw-border-opacity: 1; border-color: rgb(163 166 172 / var(--tw-border-opacity)); } .news-insights-summary.theme-grey h3, .news-insights-summary.theme-grey .h6, .news-insights-summary.theme-grey span p { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } /* Expana System: Carousel */ :root { --swiper-pagination-bottom: 0; --swiper-pagination-bullet-inactive-opacity: 1; --swiper-pagination-bullet-height: 4px; --swiper-pagination-bullet-horizontal-gap: 0px; } @media screen and (min-width: 1024px) { :root { --swiper-navigation-sides-offset: 34px } } .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { margin-top: 14px; margin-bottom: 14px; background-color: transparent; padding-top: 14px; padding-bottom: 14px; } .swiper-pagination-bullet span { display: block; height: 4px; width: 100%; --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } .swiper-pagination-bullet-active span { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .style-dark .swiper-pagination-bullet span { background-color: rgb(206 231 213 / var(--tw-bg-opacity)); --tw-bg-opacity: 0.8; } .style-dark .swiper-pagination-bullet-active span { --tw-bg-opacity: 1; background-color: rgb(33 255 73 / var(--tw-bg-opacity)); } .style-grey .swiper-pagination-bullet span { background: #dddee0; } .style-grey .swiper-pagination-bullet-active span { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .style-green .swiper-pagination-bullet span { --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); } .style-green .swiper-pagination-bullet-active span { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .style-lightGreen .swiper-slide { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } /** Testimonial */ .swiper:not(.carousel--image) .swiper-navigation :where(.swiper-button-next, .swiper-button-prev) { position: relative; top: auto; left: auto; right: auto; bottom: auto; margin-top: 0px; height: 64px; width: 56px; background-position: center; background-repeat: no-repeat; } .swiper:not(.carousel--image) .swiper-navigation :where(.swiper-button-next, .swiper-button-prev)::after { --tw-content: ''; content: var(--tw-content); } .swiper:not(.carousel--content) .swiper-navigation :where(.swiper-button-next, .swiper-button-prev) { position: relative; top: auto; left: auto; right: auto; bottom: auto; margin-top: 0px; height: 64px; width: 56px; background-position: center; background-repeat: no-repeat; } .swiper:not(.carousel--content) .swiper-navigation :where(.swiper-button-next, .swiper-button-prev)::after { --tw-content: ''; content: var(--tw-content); } .swiper-button-next, .swiper-button-prev { display: none; } .ff-el-form-control.swiper-button-next,.ff-el-form-control .swiper-button-prev{ display: none; } /** Image Carousel */ .swiper.carousel--image .swiper-navigation :where(.swiper-button-next, .swiper-button-prev) { width: 60px; height: 60px; border-radius: 100%; --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); background-position: center; background-repeat: no-repeat; } .swiper.carousel--image .swiper-navigation :where(.swiper-button-next, .swiper-button-prev)::after { --tw-content: ''; content: var(--tw-content); } .swiper.carousel--image :where(.swiper-slide-next, .swiper-slide-prev) { --tw-brightness: brightness(.5); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 1000ms; } .swiper.carousel--content .swiper-navigation :where(.swiper-button-next, .swiper-button-prev) { width: 60px; height: 60px; border-radius: 100%; --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); background-position: center; background-repeat: no-repeat; } .swiper.carousel--content .swiper-navigation :where(.swiper-button-next, .swiper-button-prev)::after { --tw-content: ''; content: var(--tw-content); } .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { opacity: 0; } .swiper:hover .swiper-button-next.swiper-button-disabled, .swiper:hover .swiper-button-prev.swiper-button-disabled { opacity: 0.35; } #page .swiper.swiper-slide { display: flex !important; } .swiper, .testimonial { outline: red; } .swiper-button-next, .swiper-button-prev { width: 12px; } .swiper-button-next *, .swiper-button-prev * { width: 100%; } .swiper-button-prev { background-image: url("../svg/arrow-left.svg"); } .swiper-button-next { background-image: url("../svg/arrow-right.svg"); } .swiper-button-next::after, .swiper-button-prev::after { content: "" !important; } /* Expana System: Forms */ .hbspt-form { /* Add buffer spacing for :selected states */ padding-left:2px; padding-top:2px; } /* fieldset { &.form-columns-1, &.form-columns-2 { margin-bottom:24px; } } */ .hbspt-form .hs-richtext { margin-bottom:16px; padding: 24px; line-height: 120%; } .hbspt-form .hs-richtext a { text-decoration: underline; } .hbspt-form .field { margin-bottom:16px; } .hbspt-form .field .hs-error-msgs { display:none; } .hbspt-form .field .hs-form-booleancheckbox input { margin-right:8px; } .hbspt-form .field label:not(.hs-form-booleancheckbox-display) { --tw-text-opacity: 1; color: rgb(72 77 89 / var(--tw-text-opacity)); font-size:.8rem; line-height:100%; pointer-events: none; } .hbspt-form .field input[type=text], .hbspt-form .field input[type=email], .hbspt-form .field textarea, .hbspt-form .field select { --tw-text-opacity: 1; color: rgb(72 77 89 / var(--tw-text-opacity)); outline:0; border:0; font-size:1rem; line-height:140%; border-radius:6px; border:1px solid transparent; padding:26px 10px 6px; transition:all 0.3s ease-in-out; outline:2px solid transparent; width: 100% !important; } .hbspt-form .field input[type=text]:hover, .hbspt-form .field input[type=email]:hover, .hbspt-form .field textarea:hover, .hbspt-form .field select:hover { border:1px solid #767A82; } .hbspt-form .field input[type=text]:focus, .hbspt-form .field input[type=email]:focus, .hbspt-form .field textarea:focus, .hbspt-form .field select:focus { outline:2px solid #124BD5; } .hbspt-form .field input[type=text]:valid, .hbspt-form .field input[type=email]:valid, .hbspt-form .field textarea:valid, .hbspt-form .field select:valid { border:1px solid #0F7D4B; } .hbspt-form .field input[type=text].invalid, .hbspt-form .field input[type=text].error, .hbspt-form .field input[type=email].invalid, .hbspt-form .field input[type=email].error, .hbspt-form .field textarea.invalid, .hbspt-form .field textarea.error, .hbspt-form .field select.invalid, .hbspt-form .field select.error { border:1px solid #C40105; background-color:#FFF2F4; color:#C40105; } .hbspt-form .field input[type=text][disabled], .hbspt-form .field input[type=email][disabled], .hbspt-form .field textarea[disabled], .hbspt-form .field select[disabled] { border:1px solid #A3A6AC; color: #A3A6AC; pointer-events: none; } /* Hide placeholder labels on some elements */ .hbspt-form .field input[type=text]::-moz-placeholder, .hbspt-form .field input[type=email]::-moz-placeholder, .hbspt-form .field textarea::-moz-placeholder { color:transparent; } .hbspt-form .field input[type=text]::placeholder, .hbspt-form .field input[type=email]::placeholder, .hbspt-form .field textarea::placeholder { color:transparent; } .hbspt-form .field select option[disabled] { color:transparent!important; display:none; } .hbspt-form .field.hs-fieldtype-text { position:relative; } .hbspt-form .field.hs-fieldtype-text label { position:absolute; top:30%; left:12px; transform:translateY(-50%); transition:all 0.3s ease; } .hbspt-form .field.hs-fieldtype-select { position:relative; } .hbspt-form .field.hs-fieldtype-select label { position:absolute; top:30%; left:12px; transform:translateY(-50%); transition:all 0.3s ease; } .hbspt-form .field.hs-fieldtype-select select { color:transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; padding-right: 20px; background-size:24px 24px; background-repeat: no-repeat; background-position:calc(100% - 16px) 50%; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='Small Icons'%3E%3Cmask id='mask0_6337_3827' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect id='Bounding box' width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_6337_3827)'%3E%3Cpath id='arrow_back_ios_new' d='M12.0582 14.4937L19.4082 7.14375C19.6582 6.89375 19.9499 6.77292 20.2832 6.78125C20.6166 6.78958 20.9082 6.91875 21.1582 7.16875C21.4082 7.41875 21.5332 7.71042 21.5332 8.04375C21.5332 8.37708 21.4082 8.66875 21.1582 8.91875L13.4832 16.6187C13.2832 16.8187 13.0582 16.9688 12.8082 17.0687C12.5582 17.1687 12.3082 17.2188 12.0582 17.2188C11.8082 17.2188 11.5582 17.1687 11.3082 17.0687C11.0582 16.9688 10.8332 16.8187 10.6332 16.6187L2.93322 8.91875C2.68322 8.66875 2.56238 8.37292 2.57072 8.03125C2.57905 7.68958 2.70822 7.39375 2.95822 7.14375C3.20822 6.89375 3.49988 6.76875 3.83322 6.76875C4.16655 6.76875 4.45822 6.89375 4.70822 7.14375L12.0582 14.4937Z' fill='%23767A82'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); } .hbspt-form .field.hs-fieldtype-select select option { color:#484D59; } .hbspt-form .field.hs-fieldtype-select select:valid { color:#002115; } .hbspt-form .field.mt-active.hs-fieldtype-text label, .hbspt-form .field.mt-active.hs-fieldtype-select label { top:8px; transform:translateY(0); font-size:0.875rem; } .hbspt-form .field.hs-fieldtype-booleancheckbox { display:flex; flex-direction: row; gap:10px; /* .hs-form-booleancheckbox { input { display:none; &[type="checkbox"]:checked + span { &:before { border:1px solid #0F7D4B; background-color:#0F7D4B; background-image: url("data:image/svg+xml,%3Csvg width='12' height='10' viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='check'%3E%3Cpath id='check_2' d='M4.23194 9.0615L0.710938 5.5205L1.75294 4.4785L4.23194 6.9375L10.2529 0.9375L11.2949 1.9995L4.23194 9.0615Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A"); background-position:center; background-repeat: no-repeat; } } } span { display:flex; &:before { flex:1 0 18px; content:""; display:inline-block; width:18px; height:18px; border:1px solid #a3a6ac; border-radius:2px; margin-right:10px; transition:all 0.3s ease-in-out; } } } */ } .hbspt-form .field.hs-fieldtype-booleancheckbox .input { order:0; } .hbspt-form .field.hs-fieldtype-booleancheckbox legend { order:1; } .hbspt-form .field.hs-fieldtype-checkbox .hs-form-checkbox-display { pointer-events: all; display:flex; gap:8px; margin-bottom:16px; } .hbspt-form .field.hs-fieldtype-checkbox .hs-form-checkbox-display:first-of-type { margin-top:8px; } .hbspt-form .field.hs-fieldtype-checkbox .hs-form-checkbox-display span { font-size: 16px; line-height: 120%; } .hbspt-form .hs_error_rollup { --tw-bg-opacity: 1; background-color: rgb(196 1 5 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); border-radius: 6px; padding:10px; margin-bottom:24px; } .hbspt-form .hs_submit input[type='submit'] { /* Standard Button */ font-size: 15px; font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.hbspt-form .hs_submit input[type='submit'].step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.hbspt-form .hs_submit input[type='submit'].step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .hbspt-form .hs_submit input[type='submit'] { line-height: 120%; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; display: inline-flex; flex-direction: row; justify-content: center; align-items: center; padding: 19px 24px 17px; gap: 8px; color:#ffffff; background: #0F7D4B; border-radius: 100px; } .hbspt-form .hs_submit input[type='submit'].primary.large { margin-top:16px; } .hbspt-form .hs_submit input[type='submit']:hover { --tw-bg-opacity: 1; background-color: rgb(12 100 60 / var(--tw-bg-opacity)); } .theme-light .hbspt-form .field input[type=text], .theme-light .hbspt-form .field input[type=email], .theme-light .hbspt-form .field textarea, .theme-light .hbspt-form .field select { border-width: 1px; --tw-border-opacity: 1; border-color: rgb(209 211 213 / var(--tw-border-opacity)); } @media (min-width: 1280px) { .hero .hbspt-form, .entry-header .hbspt-form { margin-top:50px } } .entry-header .hbspt-form { --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); padding:20px; border-radius: 10px; } /* Expana System: Icon Button */ .icon-button { border-radius: 8px; border-width: 1px; border-color: rgb(15 125 75 / 0.2); transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; transition-duration: 500ms; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .icon-button:hover { background-color: rgb(206 231 213 / 0.3); --tw-shadow: 0px 8px 16px rgba(0, 0, 0, 0.14); --tw-shadow-colored: 0px 8px 16px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .icon-button.active { border-width: 2px; --tw-border-opacity: 1; border-color: rgb(18 75 213 / var(--tw-border-opacity)); --tw-shadow: 0px 8px 16px rgba(0, 0, 0, 0.14); --tw-shadow-colored: 0px 8px 16px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .theme-dark .icon-button { border-color: rgb(255 255 255 / 0.2); } /* Expana System: Media */ .embed-responsive { position: relative; padding-bottom: 56.25%; /* 16:9 aspect ratio */ height: 0; overflow: hidden; max-width: 100%; background: #000; } .embed-responsive iframe, .embed-responsive object, .embed-responsive embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* Expana System: Message */ .message { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.message.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.message.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .message { border-radius: 10px; padding: 20px; } /* Expana System: Pagination */ .nav-links { display: flex; justify-content: center; gap: .2rem; margin-bottom: 80px } .page-numbers { height: 32px; width: 32px; border-radius: 100%; display: flex; align-items: center; justify-content: center; } .page-numbers.current { --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.page-numbers.current.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.page-numbers.current.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } /* Expana System: Tags */ .session .tag-default{ background-color:#d1d3d5; color:#1a212f; } .session .tag-protein{ background-color:#c8daff; color:#082680; } .session .tag-feed{ background-color:#fae7ff; color:#54249b; } .session .tag-grains{ background-color:#cee7d5; color:#002115; } .session .tag-nuts{ background-color:#ffdaab; color:#742a02; } .session .tag-energy{ background-color:#d1d3d5; color:#1a212f; } .session .tag-fruits{ background-color:#f1a600; color:#461a02; } .session .tag-metal{ background-color:#eff0f2; color:#1a212f; } .session .tag-economics{ background-color:#88c599; color:#003324; } .session .tag-packaging{ background-color:#99b3ff; color:#00543b; } .session .tag-tropical{ background-color:#cda6ff; color:#381867; } .session-wysiwyg ol, .session-wysiwyg ul{ list-style: initial; margin: 10px auto; padding-left: 20px; } /* Expana System: Tables */ .table-wrapper { overflow-x: auto; scroll-behavior: smooth; } table { border-collapse: collapse; width: 100%; border: solid 1px #D1D3D5; margin: 15px 0; border-radius: 10px; overflow: hidden; } table td, table th { padding: 1.2rem; text-align: left; vertical-align: top; white-space: nowrap; } table th { white-space: nowrap; font-family: LabGrotesqueMintec-Medium, sans-serif; font-weight: 500; } table tbody tr:nth-child(odd) td { background-color: #F5F7F9; } @media (min-width: 1024px) { table td:last-child { white-space: normal; } } table th[scope="col"] { background-color: #E9F3EA; } table th[scope="row"] { text-align: right; } .theme-dark table { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .theme-dark tbody tr:nth-child(even) td { background-color: #E9F3EA; } /* Expana System: Tabs */ .tabs--toggle { display: flex; } .tabs--toggle .tab:first-of-type { border-top-left-radius: 100%; border-bottom-left-radius: 100%; border-width: 1px; --tw-border-opacity: 1; border-color: rgb(15 125 75 / var(--tw-border-opacity)); padding-top: 16px; padding-bottom: 16px; } .tabs--toggle .tab:last-of-type { border-top-right-radius: 100%; border-bottom-right-radius: 100%; border-width: 1px; --tw-border-opacity: 1; border-color: rgb(15 125 75 / var(--tw-border-opacity)); padding-top: 16px; padding-bottom: 16px; } .tab { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .tab--active:not(.sub-tab) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .tab--active:is(.sub-tab) { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); border-radius: 30px; border-width: 2px; --tw-border-opacity: 1 !important; border-color: rgb(15 125 75 / var(--tw-border-opacity)) !important; overflow: hidden; } .tab--active:is(.sub-tab.large) { border-radius: 44px; } .tab > div { display: flex; gap: 16px; } /* Theme variations */ .bg-fn-ModBgLightGreenTheme .tabs nav { --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); } .bg-fn-ModBgMidGreyTheme .tabs nav { --tw-bg-opacity: 1; background-color: rgb(221 222 224 / var(--tw-bg-opacity)); } .bg-fn-ModBgDarkTheme .tabs nav { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .bg-fn-ModBgDarkTheme .tab:not(.tab--active), .bg-fn-ModBgDarkTheme .sub-tab:not(.tab--active) { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .bg-fn-ModBgDarkTheme .tab.tab--active, .bg-fn-ModBgDarkTheme .sub-tab.tab--active { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } /* Expana System: Ticker */ @keyframes ticker1 { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } } /* Commodity wall */ .animate-ticker > div { animation-composition: add; } .animate-ticker > div:nth-child(1), .animate-ticker > div:nth-child(3) { animation: var(--_a) var(--duration), var(--_a) calc(var(--duration) / var(--speed)) reverse paused; } .animate-ticker > div:nth-child(2), .animate-ticker > div:nth-child(4) { animation: var(--_a) var(--duration) reverse, var(--_a) calc(var(--duration) / var(--speed)) paused; } .animate-ticker > div:hover { animation-play-state: running; } /* Price ticker */ .price-ticker { white-space: nowrap; transition: cubic-bezier(0.6, -0.28, 0.735, 0.045); } .price-ticker:hover { animation-play-state: paused !important; /* This will pause the animation on hover. It has !important to override inline styles */ } /* Expana System: Timeline */ /* NOTE: WE ARE ASSUMING THE ID DOESN'T CHANGE HERE */ .page-id-1684 .hero, .page-id-1684 .module:not(.timeline), .page-id-1684 footer { z-index: 10; position: relative; } .page-id-1684 .hero, .page-id-1684 .module:not(.timeline) { z-index: 10; position: relative; } /* Modules */ /* Anchor side menu - float variant */ .anchor-side-menu--float { transition: transform 0.3s ease; } .anchor-side-menu__tab { position: absolute; right: 100%; top: 40px; display: flex; flex-direction: column; align-items: center; background: white; border-radius: 8px 0 0 8px; box-shadow: -2px 0 8px rgba(0, 0, 0, 0.08); cursor: pointer; padding: 8px 6px; } .anchor-side-menu__tab:hover { background: #f9fafb; } .anchor-side-menu__tab-arrow { display: flex; align-items: center; justify-content: center; color: #6b7280; } .anchor-side-menu__tab-arrow svg { transition: transform 0.3s; } .anchor-side-menu--float.is-collapsed .anchor-side-menu__tab-arrow svg { transform: rotate(180deg); } .anchor-side-menu__tab-title { display: none; writing-mode: vertical-rl; text-orientation: mixed; white-space: nowrap; font-size: 14px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #0F7D4B; margin-top: 8px; } .anchor-side-menu--float.is-collapsed .anchor-side-menu__tab-title { display: block; } .anchor-side-menu--float .anchor-side-menu__nav { transition: opacity 0.3s; } .anchor-side-menu--float.is-collapsed .anchor-side-menu__nav { opacity: 0; pointer-events: none; } /* Anchor side menu - column variant */ .anchor-side-menu--column { width: 22%; position: sticky; top: 140px; align-self: flex-start; } /* Anchor side menu - overlay variant. Used on Article/Podcast pages so the article content stays page-centered (max-w-[680px] mx-auto) while the side menu floats into the right margin instead of pushing the content via the standard column-flex layout. */ @media (min-width: 1280px) { .entry-content-overlay-wrapper { position: relative; } .anchor-side-menu-overlay { position: absolute; top: 0; right: 0; bottom: 0; width: 22%; z-index: 10; } /* Make the inner menu fill its overlay wrapper (overrides the .anchor-side-menu--column { width: 22% } rule defined above). */ .anchor-side-menu-overlay > .anchor-side-menu--column { width: 100%; } } .anchor-side-menu--column .anchor-side-menu__link { border-left-width: 0 !important; } .anchor-side-menu--column .anchor-side-menu__link.is-active { color: #21ff49 !important; } .anchor-side-menu--column .anchor-side-menu__link.text-coreMidGreen { color: #21ff49 !important; } .anchor-side-menu--column .anchor-side-menu__link.text-black { color: rgb(163 166 172) !important; } .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step .hsfc-Step__Content { padding: 0 !important; } .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step .hsfc-Step__Content form { gap: 16px; } .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step__Content input[type='email'], .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step__Content input[type='text'] { background: #ffffff !important; border: 1px solid rgba(209, 211, 213, 1) !important; border-radius: 10px !important; color: rgba(72, 77, 89, 1) !important; padding: 10px !important; box-shadow: none !important; } .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step__Content input::-moz-placeholder { color: rgba(118, 122, 130, 1) !important; opacity: 1 !important; } .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step__Content input::placeholder { color: rgba(118, 122, 130, 1) !important; opacity: 1 !important; } .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step__Content button, .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step__Content input[type='submit'] { width: 100% !important; border: 0 !important; border-radius: 9999px !important; background: #002115 !important; color: #21ff49 !important; font-family: LabGrotesqueMintec-Medium, sans-serif !important; } .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step__Content button:hover, .anchor-side-menu__newsletter [data-hsfc-id='Renderer'] .hsfc-Step__Content input[type='submit']:hover { background: #0c643c !important; color: #21ff49 !important; } /* HubSpot form step layout */ .hsfc-Step .hsfc-Step__Content { padding: 0 !important; } #announce-bar a { text-decoration: underline; } .single-news .gallery .container, .single-insight .gallery .container { padding-left: 0 !important; padding-right: 0 !important; } .alignleft { float: left; margin-right: 1.5em; margin-bottom: 1em; clear: none; } .alignright { float: right; margin-left: 1.5em; margin-bottom: 1em; clear: none; } .aligncenter { display: block; margin-left: auto; margin-right: auto; clear: both; } .content-grid.card-cols-1 .card--content { grid-column: span 12 / span 12; } .fluentform-step .content-grid.card-cols-1 .card--content.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } .content-grid.card-cols-2 .card--content { grid-column: span 12 / span 12; } .fluentform-step .content-grid.card-cols-2 .card--content.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .content-grid.card-cols-2 .card--content { grid-column: span 6 / span 6; } } .content-grid.card-cols-3 .card--content { grid-column: span 12 / span 12; } .fluentform-step .content-grid.card-cols-3 .card--content.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .content-grid.card-cols-3 .card--content { grid-column: span 4 / span 4; } } .content-grid.card-cols-4 .card--content { grid-column: span 12 / span 12; } .fluentform-step .content-grid.card-cols-4 .card--content.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 768px) { .content-grid.card-cols-4 .card--content { grid-column: span 3 / span 3; } } .faq-list.type-block .inner.bg-fn-ModBgLightTheme { border-width: 1px; --tw-border-opacity: 1; border-color: rgb(209 211 213 / var(--tw-border-opacity)); } .accordion-content { overflow: hidden; transition: max-height 0.4s ease; } .toggle-icon { pointer-events: none; transition: transform 0.3s ease; } .rotate-180 { transform: rotate(180deg); } .description { overflow: auto; /* This fixes an issue with child elements with a margin creating a space */ } .introduction .description ul, .introduction ol { margin-top: 15px; } .news-insights-summary.theme-grey .card, .news-insights-summary.theme-lightGreen .card { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .news-insights-summary.theme-grey .h6, .news-insights-summary.theme-grey .labels, .news-insights-summary.theme-grey .date, .news-insights-summary.theme-grey .title, .news-insights-summary.theme-lightGreen .h6, .news-insights-summary.theme-lightGreen .labels, .news-insights-summary.theme-lightGreen .date, .news-insights-summary.theme-lightGreen .title { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .news-insights-summary.theme-dark h3, .news-insights-summary.theme-green h3, .news-insights-summary.theme-grey h3 { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } #price-chart-wrapper{ position: relative; width: 100%; height: 450px; margin: auto; background-color: rgb(0 33 21); } .price-chart-header{ color:#fff; } .chartjs-tooltip { position: absolute; background: rgba(33, 37, 41, 0.9); color: white; border-radius: 4px; padding: 5px 8px; font-size: 12px; pointer-events: none; white-space: nowrap; z-index: 999999; } .chartjs-tooltip .title { font-weight: bold; } .chartjs-tooltip .body-item { display: flex; gap: 6px; } :root { --ff-green: #0f7d4b; --ff-red: #D32F2F; --ff-gray: #999999; --ff-bg-light: #f0fdf4; --ff-gb-light-red :#fcf2f1 } .fluentform *:focus-visible, .fluentform *:focus { outline: none; } .fluentform select option{ color: #000; } .ff-el-form-control { color: #000 !important; } .ff-el-form-control:disabled::-moz-placeholder { color: #a3a3a3 !important; font-family: LabGrotesqueMintec-Light, sans-serif !important; } .ff-el-form-control:disabled::placeholder { color: #a3a3a3 !important; font-family: LabGrotesqueMintec-Light, sans-serif !important; } .fluentform .ff-el-form-control:disabled{ color: #a3a3a3 !important; background-color: #ebebeb !important; border-color: #ebebeb !important; font-family: LabGrotesqueMintec-Light, sans-serif !important; } .fluentform .commodity_data:disabled{ background-image: url("data:image/svg+xml;utf8,") !important; } .fluentform input[type=number]::-webkit-inner-spin-button, .fluentform input[type=number]::-webkit-outer-spin-button { -webkit-appearance: inner-spin-button !important; opacity: 1 !important; display: block !important; background: var(--ff-green); } /* Error section */ .ff-errors-in-stack > *:not(:first-child) { display: none; } .error-clear{ display: none; } .ff-errors-in-stack > *:first-child { color: var(--ff-red); background: var(--ff-gb-light-red); padding: 8px 20px !important; text-align: center; line-height: 1.8 !important; width: -moz-fit-content; width: fit-content; font-size: 15px !important; border-radius: 5px; } /* Buttons section */ .dark-filled{ --tw-bg-opacity: 1; background-color: rgb(33 255 73 / var(--tw-bg-opacity)) !important; color: rgb(0 33 21 / var(--tw-text-opacity)) !important; } .light-filled{ --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)) !important; } .green-filled{ --tw-bg-opacity: 1; --tw-text-opacity: 1; --tw-border-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important; border-color: rgb(255 255 255 / var(--tw-border-opacity)) !important; color: rgb(0 33 21 / var(--tw-text-opacity)) !important; } .dark-outlined{ --tw-border-opacity: 1; --tw-text-opacity: 1; border-color: rgb(33 255 73 / var(--tw-border-opacity)) !important; color: rgb(255 255 255 / var(--tw-text-opacity)) !important; } .dark-outlined:hover{ --tw-bg-opacity: 1; --tw-border-opacity: 1; --tw-text-opacity: 1; background-color: rgb(26 204 58 / var(--tw-bg-opacity)) !important; border-color: rgb(26 204 58 / var(--tw-border-opacity)) !important; color: rgb(0 33 21 / var(--tw-text-opacity)) !important; } .light-outlined{ --tw-bg-opacity: 1; --tw-border-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)) !important; border-color: rgb(15 125 75 / var(--tw-border-opacity)) !important; } .light-outlined:hover{ --tw-text-opacity: 1; --tw-bg-opacity: 1; --tw-border-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)) !important; background-color: rgb(12 100 60 / var(--tw-bg-opacity)) !important; border-color: rgb(12 100 60 / var(--tw-border-opacity)) !important; } .green-outlined{ --tw-text-opacity: 1; --tw-border-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)) !important; border-color: rgb(255 255 255 / var(--tw-border-opacity)) !important; } .ff-btn.ff-btn-prev.ff-btn-secondary.green-outlined::before{ --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)) !important; background: url('data:image/svg+xml;utf8,') no-repeat center !important; } .ff-btn.ff-btn-prev.ff-btn-secondary.green-outlined::before:hover{ --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)) !important; background: url('data:image/svg+xml;utf8,') no-repeat center !important; } .green-outlined:hover{ --tw-bg-opacity: 1; --tw-border-opacity: 1; --tw-text-opacity: 1; background-color: rgb(206 229 220 / var(--tw-bg-opacity)) !important; border-color: rgb(206 229 220 / var(--tw-border-opacity)) !important; color: rgb(0 33 21 / var(--tw-text-opacity)) !important; } .ff-btn.ff-btn-next{ visibility: visible; background: var(--ff-green); width: 10rem; font-size: 20px; line-height: 1.7; border-radius: 50px; padding: 10px 16px; } .ff_repeater_cell{ padding: 0 !important; } .ff_repeater_cont_row{ gap:10px; position: relative; } .ff_repeater_cell.repeat_btn{ position: absolute; left: 50.1%; bottom: -29.5px; transform: translate(-50%, -50%); display: inline-block; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: rgb(255, 255, 255); font-weight: 700; line-height: 1; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .ff-repeater-container .ff-el-repeat-buttons-list{ margin-top: 0 !important; } .ff-el-input--label{ display: none; } .ff_repeater_cont_row{ margin-bottom: 10px; } /* Hide all repeat_btn except the last one */ .ff_repeater_cell.repeat_btn:not(:last-of-type) { display: none; } .ff-btn.ff-btn-next{ float: left !important; } .ff_repeater_container_list .ff-t-column-1, .ff_repeater_container_list .ff-t-column-2, .ff_repeater_container_list .ff-t-column-3{ flex-basis: 33% !important; } .ff-repeater-container .ff-el-input--label{ display: none !important; } .row-items-container{ background-image: linear-gradient(to right, var(--ff-green) 2px, rgba(255, 255, 255, 0) 0%); background-position: bottom; background-size: 11px 2px; background-repeat: repeat-x; display: flex; flex-wrap: nowrap; position: relative; gap: 10px; width: 90%; float: left; margin-bottom: 15px; } .ff-el-form-control.default-selected { color: var(--ff-green) !important; } .repeat-plus{ fill: var(--ff-green); width: 34px; height: 34px; background: no-repeat center / 50% 50% url(' data:image/svg+xml;utf8,\ \ '); border-radius: 100px; border: transparent; } .remove-row-btn{ display: inline-block; } .repeat-plus svg{ width: 35px; height: 35px; } .repeat-minus{ position: static; border: 2px solid #ebebeb !important; padding: 5px; display: block; border-radius: 7px !important; height: 50px; } .repeat-minus svg{ fill: var(--ff-green); } .roi-calculator .step-nav.ff_step_nav_last{ display: flex; } .roi-calculator .step-nav.ff_step_nav_last button{ flex-basis: 28%; } .ff-default .ff-el-form-control{ font-family: inherit !important; } /* normal */ select.ff-el-form-control { color: #111; } select.ff-el-form-control.is-placeholder { color: var(--ff-green) !important; } .roi-step1-error .ff-el-form-control::-moz-placeholder { color: var(--ff-red) !important; } .roi-step1-error select.ff-el-form-control.is-placeholder, .roi-step1-error .ff-el-form-control::placeholder, .roi-step1-error .ff-el-form-control.commodity_data, .roi-step1-error .ff-el-form-control.commodity_data.is-placeholder { color: var(--ff-red) !important; } .roi-calculator .ff-step-t-container.ff-inner_submit_container.ff-column-container.ff_columns_total_2{ flex-wrap: nowrap; gap: 15px; } .roi-calculator .ff-step-t-container.ff-inner_submit_container.ff-column-container.ff_columns_total_2 >.ff-t-cell.ff-t-column-1, .roi-calculator .ff-step-t-container.ff-inner_submit_container.ff-column-container.ff_columns_total_2 >.ff-t-cell.ff-t-column-2{ flex-basis: 50%; } .roi-calculator .ff-step-t-container.ff-inner_submit_container.ff-column-container.ff_columns_total_2 >.ff-t-cell.ff-t-column-1 .ff-btn.ff-btn-prev.ff-btn-secondary, .reset-roi-form-btn{ background-color: transparent; border: 1px solid var(--ff-green); color: #000; border-radius: 50px; min-width: 100%; font-size: 18px; line-height: 1.5; padding: 15px 16px; border-width: 2px; } .roi-demo-btn{ border-radius: 50px; min-width: 100%; font-size: 18px; line-height: 1.5; padding: 15px 16px; border-width: 2px; } .ff-btn-prev, .reset-roi-form-btn{ position: relative; } .reset-roi-form-btn > img{ margin-right: 15px; } .ff-btn-prev::before { content: ""; position: absolute; right: 58%; top: 48%; transform: translateY(-50%); width: 20px; height: 20px; background: url('data:image/svg+xml;utf8,') no-repeat center; color: inherit; } .ff-default .ff-el-form-control{ border-radius: 7px !important; border-width: 2px !important; border-color: #00000014 !important; } .roi-calculator select{ -webkit-appearance: none; -moz-appearance: none; background: #fff; background-image: url("data:image/svg+xml;utf8,") !important; background-repeat: no-repeat; background-position-x: 100%; background-position-y: 5px; } /* Form result */ .ff-message-success{ border: none !important; box-shadow: none !important; margin: 0 !important; padding: 0 !important; } .donut-chart { width: 200px; text-align: center; align-items: center; } .result-container, .roi-graph-container { border: 2px solid var(--fluentform-border-color); border-radius: 8px; } .result-container p { font-size: 20px; color:var(--ff-green); } .ff-el-form-control.hidden{ display: none !important; } .ff-t-cell.ff-t-column-3 > :nth-child(2){ display: none; } .category_data, .commodity_data, .annual_spend{ height: 50px !important; } .roi-step-1 .ff-el-input--content{ position: relative; } .roi-single-step .roi-disclaimer{ margin: 0px 0px 15px 0 !important; } .roi-single-step .ff-btn-submit{ font-size: 20px !important; } /* show $ only when there IS a value */ .annual_spend .ff-el-input--content:has(.annual_spend:not(:-moz-placeholder-shown))::before { content: "$"; position: absolute; left: 15px; top: 50%; transform: translateY(-50%); pointer-events: none; color:#000; } .annual_spend .ff-el-input--content:has(.annual_spend:not(:placeholder-shown))::before { content: "$"; position: absolute; left: 15px; top: 50%; transform: translateY(-50%); pointer-events: none; color:#000; } .ff-el-form-control.annual_spend:not(:-moz-placeholder-shown) { padding-left: 25px; } .ff-el-form-control.annual_spend:not(:placeholder-shown) { padding-left: 25px; } .roi-calculator .fluentform input[name="email"], .roi-calculator .fluentform input[name="names[first_name]"], .roi-calculator .fluentform input[name="names[last_name]"], .roi-calculator .fluentform input.Company{ height: 65px; padding-top: 25px; } input[name="first_name"].ff-el-form-control { padding-top: 14px; } .roi-step-buttons.font-labgMed.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.font-labgMed.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } .roi-error{ color: var(--ff-red) !important; } .roi-calculator .ff-btn.ff-btn-submit.ff-btn-lg.ff_btn_style.wpf_has_custom_css{ padding: 10px 16px; } .roi-calculator input:-webkit-autofill { -webkit-box-shadow: 0 0 0 142px white inset; } .roi-calculator .fluentform-step { padding:0px; } .ff-errors-in-stack{ margin-bottom: 15px; margin-top: 0 !important; } .roi-disclaimer{ font-style: italic; font-size: 14px; } .fluentform-step .col-span-12.mt-24.font-labgLight a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } .roi-disclaimer.result-text{ margin-bottom: 15px; } .roi-calculator-result{ padding-left: 3px; } .roi-padding{ padding-left: 120px; } .form_style_metadata{ display: none; } .roi-padding{ padding-left: 120px; } .form_style_metadata{ display: none; } .commodity_user_data{ display: none !important; } @media only screen and (max-width: 768px) { .row-items-container{ display: inline-block; } .ff_repeater_cont_row { border: none !important; flex-direction: row !important; padding-left: 0; background-color: transparent !important; } .fluentform .ff-step-t-container { display: flex; flex-direction: column; align-items: stretch !important; } .remove-row-btn{ width: -moz-max-content; width: max-content; } .roi-calculator .step-nav.ff_step_nav_last button { flex-basis: 60%; } .roi-single-step .ff-btn-submit{ width: 60%; } .reset-roi-form-btn::before{ right: 65%; } } .solution-grid.theme-light .card { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .testimonial-v2 { /* Global background white */ --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } /* CSS fader to temporatily replace the Slider css */ .testimonial-v2.css-fader .testimonial--slide { display:none; } .testimonial-v2.css-fader .testimonial--slide.active { display:flex; animation: fadeIn 1s ease-in-out 0s 1, fadeOut 1s ease-in-out 7s 1; } @keyframes fadeOut { from { opacity: 1.0; } to { opacity: 0.0; } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1.0; } } /* Light */ .testimonial-v2.style-light { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .testimonial-v2.style-light .testimonial--slide { --tw-bg-opacity: 1; background-color: rgb(0 33 21 / var(--tw-bg-opacity)); } .testimonial-v2.style-light .testimonial--mark, .testimonial-v2.style-light .testimonial--line, .testimonial-v2.style-light .testimonial--dot { --tw-bg-opacity: 1; background-color: rgb(33 255 73 / var(--tw-bg-opacity)); } .testimonial-v2.style-light .testimonial--text, .testimonial-v2.style-light .testimonial--comma, .testimonial-v2.style-light .testimonial--person-name, .testimonial-v2.style-light .testimonial--person-role, .testimonial-v2.style-light .testimonial--link { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } /* Light Green */ .testimonial-v2.style-green, .testimonial-v2.style-lightGreen { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .testimonial-v2.style-green .testimonial--slide, .testimonial-v2.style-lightGreen .testimonial--slide { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .testimonial-v2.style-green .testimonial--mark, .testimonial-v2.style-green .testimonial--line, .testimonial-v2.style-green .testimonial--dot, .testimonial-v2.style-lightGreen .testimonial--mark, .testimonial-v2.style-lightGreen .testimonial--line, .testimonial-v2.style-lightGreen .testimonial--dot { --tw-bg-opacity: 1; background-color: rgb(87 173 99 / var(--tw-bg-opacity)); } .testimonial-v2.style-green .testimonial--text, .testimonial-v2.style-green .testimonial--comma, .testimonial-v2.style-green .testimonial--person-name, .testimonial-v2.style-green .testimonial--person-role, .testimonial-v2.style-green .testimonial--link, .testimonial-v2.style-lightGreen .testimonial--text, .testimonial-v2.style-lightGreen .testimonial--comma, .testimonial-v2.style-lightGreen .testimonial--person-name, .testimonial-v2.style-lightGreen .testimonial--person-role, .testimonial-v2.style-lightGreen .testimonial--link { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } /* Light Green */ .testimonial-v2.style-grey { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .testimonial-v2.style-grey .testimonial--slide { --tw-bg-opacity: 1; background-color: rgb(245 247 249 / var(--tw-bg-opacity)); } .testimonial-v2.style-grey .testimonial--mark, .testimonial-v2.style-grey .testimonial--line, .testimonial-v2.style-grey .testimonial--dot { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .testimonial-v2.style-grey .testimonial--text, .testimonial-v2.style-grey .testimonial--comma, .testimonial-v2.style-grey .testimonial--person-name, .testimonial-v2.style-grey .testimonial--person-role, .testimonial-v2.style-grey .testimonial--link { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } /* Dark */ .testimonial-v2.style-dark { --tw-bg-opacity: 1; background-color: rgb(0 33 21 / var(--tw-bg-opacity)); } .testimonial-v2.style-dark .testimonial--slide { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .testimonial-v2.style-dark .testimonial--mark, .testimonial-v2.style-dark .testimonial--line, .testimonial-v2.style-dark .testimonial--dot { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .testimonial-v2.style-dark .testimonial--text, .testimonial-v2.style-dark .testimonial--comma, .testimonial-v2.style-dark .testimonial--person-name, .testimonial-v2.style-dark .testimonial--person-role, .testimonial-v2.style-dark .testimonial--link { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .embed-wrapper iframe { height: 100% !important; width: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 8px; overflow: hidden; } .topic-grid.theme-grey .card, .topic-grid.theme-lightGreen .card { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .topic-grid.theme-dark h3, .topic-grid.theme-green h3 { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .theme-mid:not(span), .theme-green:not(span) { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .theme-dark:not(span) { --tw-bg-opacity: 1; background-color: rgb(0 33 21 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .theme-grey:not(span) { --tw-bg-opacity: 1; background-color: rgb(245 247 249 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .theme-lightGreen:not(span) { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } /* Utilities */ .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; } .pointer-events-none { pointer-events: none; } .visible { visibility: visible; } .collapse { visibility: collapse; } .static { position: static; } .fixed { position: fixed; } .absolute { position: absolute; } .relative { position: relative; } .sticky { position: sticky; } .inset-0 { inset: 0px; } .\!left-0 { left: 0px !important; } .\!right-0 { right: 0px !important; } .bottom { bottom: 24px; } .bottom-0 { bottom: 0px; } .bottom-\[1px\] { bottom: 1px; } .end { inset-inline-end: 24px; } .left { left: 24px; } .left-0 { left: 0px; } .left-11 { left: 11px; } .left-6 { left: 6px; } .left-\[18px\] { left: 18px; } .left-full { left: 100%; } .right { right: 24px; } .right-0 { right: 0px; } .right-10 { right: 10px; } .right-12 { right: 12px; } .right-\[21px\] { right: 21px; } .right-\[calc\(100\%-80px\)\] { right: calc(100% - 80px); } .start { inset-inline-start: 24px; } .top { top: 24px; } .top-0 { top: 0px; } .top-1\/2 { top: 50%; } .top-10 { top: 10px; } .top-20 { top: 20px; } .top-56 { top: 56px; } .top-6 { top: 6px; } .top-\[106px\] { top: 106px; } .top-\[17px\] { top: 17px; } .top-\[25\.5vw\] { top: 25.5vw; } .top-\[3rem\] { top: 3rem; } .top-\[45vw\] { top: 45vw; } .top-\[52px\] { top: 52px; } .top-full { top: 100%; } .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-\[5\] { z-index: 5; } .z-max { z-index: 900; } .z-min { z-index: 0; } .order-1 { order: 1; } .order-2 { order: 2; } .col-span-1 { grid-column: span 1 / span 1; } .col-span-10 { grid-column: span 10 / span 10; } .col-span-12 { grid-column: span 12 / span 12; } .col-span-2 { grid-column: span 2 / span 2; } .col-span-3 { grid-column: span 3 / span 3; } .col-span-4 { grid-column: span 4 / span 4; } .col-span-5 { grid-column: span 5 / span 5; } .col-span-6 { grid-column: span 6 / span 6; } .col-span-8 { grid-column: span 8 / span 8; } .col-span-9 { grid-column: span 9 / span 9; } .col-start-1 { grid-column-start: 1; } .m { margin: 24px; } .m-0 { margin: 0px; } .m-auto { margin: auto; } .mx-0 { margin-left: 0px; margin-right: 0px; } .mx-\[6px\] { margin-left: 6px; margin-right: 6px; } .mx-auto { margin-left: auto; margin-right: auto; } .my { margin-top: 24px; margin-bottom: 24px; } .my-120 { margin-top: 120px; margin-bottom: 120px; } .-mr-14 { margin-right: -14px; } .-mr-\[2px\] { margin-right: -2px; } .mb { margin-bottom: 24px; } .mb-0 { margin-bottom: 0px; } .mb-10 { margin-bottom: 10px; } .mb-12 { margin-bottom: 12px; } .mb-16 { margin-bottom: 16px; } .mb-20 { margin-bottom: 20px; } .mb-24 { margin-bottom: 24px; } .mb-30 { margin-bottom: 30px; } .mb-32 { margin-bottom: 32px; } .mb-40 { margin-bottom: 40px; } .mb-64 { margin-bottom: 64px; } .mb-8 { margin-bottom: 8px; } .mb-80 { margin-bottom: 80px; } .mb-\[20px\] { margin-bottom: 20px; } .mb-\[40px\] { margin-bottom: 40px; } .mb-auto { margin-bottom: auto; } .me { margin-inline-end: 24px; } .ml-\[5px\] { margin-left: 5px; } .ml-auto { margin-left: auto; } .mr-0 { margin-right: 0px; } .mr-auto { margin-right: auto; } .ms { margin-inline-start: 24px; } .mt { margin-top: 24px; } .mt-0 { margin-top: 0px; } .mt-12 { margin-top: 12px; } .mt-16 { margin-top: 16px; } .mt-2 { margin-top: 2px; } .mt-20 { margin-top: 20px; } .mt-24 { margin-top: 24px; } .mt-28 { margin-top: 28px; } .mt-32 { margin-top: 32px; } .mt-40 { margin-top: 40px; } .mt-48 { margin-top: 48px; } .mt-56 { margin-top: 56px; } .mt-60 { margin-top: 60px; } .mt-64 { margin-top: 64px; } .mt-72 { margin-top: 72px; } .mt-8 { margin-top: 8px; } .mt-\[24px\] { margin-top: 24px; } .mt-\[40px\] { margin-top: 40px; } .mt-\[9px\] { margin-top: 9px; } .mt-auto { margin-top: auto; } .block { display: block; } .inline-block { display: inline-block; } .inline { display: inline; } .flex { display: flex; } .inline-flex { display: inline-flex; } .table { display: table; } .grid { display: grid; } .contents { display: contents; } .hidden { display: none; } .aspect-1\/1 { aspect-ratio: 1 / 1; } .aspect-16\/9 { aspect-ratio: 16 / 9; } .aspect-2\/3 { aspect-ratio: 2 / 3; } .aspect-3\/2 { aspect-ratio: 3 / 2; } .aspect-4\/3 { aspect-ratio: 4 / 3; } .aspect-5\/4 { aspect-ratio: 5 / 4; } .aspect-9\/16 { aspect-ratio: 9 / 16; } .aspect-\[128\/85\] { aspect-ratio: 128/85; } .aspect-\[3\/2\] { aspect-ratio: 3/2; } .aspect-auto { aspect-ratio: auto; } .size { width: 24px; height: 24px; } .size-14 { width: 14px; height: 14px; } .size-40 { width: 40px; height: 40px; } .size-48 { width: 48px; height: 48px; } .size-60 { width: 60px; height: 60px; } .size-\[14px\] { width: 14px; height: 14px; } .size-\[24px\] { width: 24px; height: 24px; } .size-\[40px\] { width: 40px; height: 40px; } .\!h-12 { height: 12px !important; } .\!h-24 { height: 24px !important; } .\!h-\[61px\] { height: 61px !important; } .h { height: 24px; } .h-0 { height: 0px; } .h-14 { height: 14px; } .h-16 { height: 16px; } .h-2 { height: 2px; } .h-28 { height: 28px; } .h-32 { height: 32px; } .h-36 { height: 36px; } .h-40 { height: 40px; } .h-48 { height: 48px; } .h-56 { height: 56px; } .h-63 { height: 63px; } .h-64 { height: 64px; } .h-\[100px\] { height: 100px; } .h-\[102px\] { height: 102px; } .h-\[14px\] { height: 14px; } .h-\[18px\] { height: 18px; } .h-\[20px\] { height: 20px; } .h-\[244px\] { height: 244px; } .h-\[296px\] { height: 296px; } .h-\[2px\] { height: 2px; } .h-\[300px\] { height: 300px; } .h-\[50px\] { height: 50px; } .h-\[515px\] { height: 515px; } .h-\[54px\] { height: 54px; } .h-\[64px\] { height: 64px; } .h-\[75px\] { height: 75px; } .h-\[78px\] { height: 78px; } .h-\[96px\] { height: 96px; } .h-\[calc\(100\%-32px\)\] { height: calc(100% - 32px); } .h-auto { height: auto; } .h-full { height: 100%; } .h-screen-minus-55 { height: calc(100vh - 55px); } .max-h-0 { max-height: 0px; } .max-h-\[90svh\] { max-height: 90svh; } .max-h-vh { max-height: 100vh; } .min-h-38 { min-height: 38px; } .min-h-\[calc\(100vh-90px\)\] { min-height: calc(100vh - 90px); } .w { width: 24px; } .w-0 { width: 0px; } .w-1\/2 { width: 50%; } .w-112 { width: 112px; } .w-16 { width: 16px; } .w-2 { width: 2px; } .w-20 { width: 20px; } .w-32 { width: 32px; } .w-48 { width: 48px; } .w-64 { width: 64px; } .w-\[133px\] { width: 133px; } .w-\[14px\] { width: 14px; } .w-\[190px\] { width: 190px; } .w-\[217px\] { width: 217px; } .w-\[220px\] { width: 220px; } .w-\[2px\] { width: 2px; } .w-\[58px\] { width: 58px; } .w-\[64px\] { width: 64px; } .w-\[75px\] { width: 75px; } .w-\[90\%\] { width: 90%; } .w-\[92\%\] { width: 92%; } .w-\[95\%\] { width: 95%; } .w-\[96px\] { width: 96px; } .w-\[calc\(100\%-50px\)\] { width: calc(100% - 50px); } .w-\[calc\(100vw\+40px\)\] { width: calc(100vw + 40px); } .w-auto { width: auto; } .w-full { width: 100%; } .w-max { width: -moz-max-content; width: max-content; } .w-screen { width: 100vw; } .w-svw { width: 100svw; } .min-w-0 { min-width: 0px; } .min-w-\[120px\] { min-width: 120px; } .min-w-\[121px\] { min-width: 121px; } .min-w-\[200px\] { min-width: 200px; } .min-w-fit { min-width: -moz-fit-content; min-width: fit-content; } .min-w-full { min-width: 100%; } .max-w-\[100\%\] { max-width: 100%; } .max-w-\[130px\] { max-width: 130px; } .max-w-\[300px\] { max-width: 300px; } .max-w-\[40px\] { max-width: 40px; } .max-w-\[450px\] { max-width: 450px; } .max-w-\[800px\] { max-width: 800px; } .max-w-full { max-width: 100%; } .max-w-none { max-width: none; } .flex-1 { flex: 1 1 0%; } .flex-none { flex: none; } .flex-shrink-0 { flex-shrink: 0; } .shrink { flex-shrink: 1; } .shrink-0 { flex-shrink: 0; } .flex-grow { flex-grow: 1; } .grow { flex-grow: 1; } .grow-0 { flex-grow: 0; } .basis-36 { flex-basis: 36px; } .basis-6 { flex-basis: 6px; } .table-auto { table-layout: auto; } .border-collapse { border-collapse: collapse; } .-translate-x-\[20\%\] { --tw-translate-x: -20%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .-translate-x-\[40\%\] { --tw-translate-x: -40%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .-translate-y-1\/2 { --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .translate-x-\[-4px\] { --tw-translate-x: -4px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .translate-x-\[20\%\] { --tw-translate-x: 20%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .translate-x-\[40\%\] { --tw-translate-x: 40%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .translate-y-\[2px\] { --tw-translate-y: 2px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .-rotate-90 { --tw-rotate: -90deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .rotate-0 { --tw-rotate: 0deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .rotate-180 { --tw-rotate: 180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .rotate-90 { --tw-rotate: 90deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .transform { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } @keyframes slide-fade-down { 0% { opacity: 0; transform: translateY(-10px); } 100% { opacity: 1; transform: translateY(0); } } .animate-slide-fade-down { animation: slide-fade-down 0.25s ease-out both; } .cursor-default { cursor: default; } .cursor-not-allowed { cursor: not-allowed; } .cursor-pointer { cursor: pointer; } .touch-pan-x { --tw-pan-x: pan-x; touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom); } .select-none { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .resize { resize: both; } .list-disc { list-style-type: disc; } .list-none { list-style-type: none; } .appearance-none { -webkit-appearance: none; -moz-appearance: none; appearance: none; } .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .flex-row { flex-direction: row; } .flex-row-reverse { flex-direction: row-reverse; } .flex-col { flex-direction: column; } .flex-col-reverse { flex-direction: column-reverse; } .flex-wrap { flex-wrap: wrap; } .items-start { align-items: flex-start; } .items-center { align-items: center; } .items-baseline { align-items: baseline; } .justify-start { justify-content: flex-start; } .justify-end { justify-content: flex-end; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .gap { gap: 24px; } .gap-10 { gap: 10px; } .gap-12 { gap: 12px; } .gap-15 { gap: 15px; } .gap-16 { gap: 16px; } .gap-2 { gap: 2px; } .gap-20 { gap: 20px; } .gap-24 { gap: 24px; } .gap-32 { gap: 32px; } .gap-4 { gap: 4px; } .gap-40 { gap: 40px; } .gap-48 { gap: 48px; } .gap-6 { gap: 6px; } .gap-8 { gap: 8px; } .gap-\[10px\] { gap: 10px; } .gap-\[12px\] { gap: 12px; } .gap-\[14px\] { gap: 14px; } .gap-\[20px\] { gap: 20px; } .gap-\[32px\] { gap: 32px; } .gap-\[40px\] { gap: 40px; } .gap-\[44px\] { gap: 44px; } .gap-\[48px\] { gap: 48px; } .gap-\[6px\] { gap: 6px; } .gap-\[8px\] { gap: 8px; } .gap-x { -moz-column-gap: 24px; column-gap: 24px; } .gap-x-12 { -moz-column-gap: 12px; column-gap: 12px; } .gap-x-16 { -moz-column-gap: 16px; column-gap: 16px; } .gap-x-2 { -moz-column-gap: 2px; column-gap: 2px; } .gap-x-24 { -moz-column-gap: 24px; column-gap: 24px; } .gap-x-32 { -moz-column-gap: 32px; column-gap: 32px; } .gap-x-36 { -moz-column-gap: 36px; column-gap: 36px; } .gap-x-8 { -moz-column-gap: 8px; column-gap: 8px; } .gap-x-\[16px\] { -moz-column-gap: 16px; column-gap: 16px; } .gap-x-\[2px\] { -moz-column-gap: 2px; column-gap: 2px; } .gap-x-\[32px\] { -moz-column-gap: 32px; column-gap: 32px; } .gap-y { row-gap: 24px; } .gap-y-16 { row-gap: 16px; } .gap-y-20 { row-gap: 20px; } .gap-y-24 { row-gap: 24px; } .gap-y-32 { row-gap: 32px; } .gap-y-40 { row-gap: 40px; } .gap-y-48 { row-gap: 48px; } .gap-y-8 { row-gap: 8px; } .gap-y-\[24px\] { row-gap: 24px; } .gap-y-\[32px\] { row-gap: 32px; } .gap-y-\[44px\] { row-gap: 44px; } .divide-y > :not([hidden]) ~ :not([hidden]) { --tw-divide-y-reverse: 0; border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); border-bottom-width: calc(1px * var(--tw-divide-y-reverse)); } .divide-gray-200 > :not([hidden]) ~ :not([hidden]) { --tw-divide-opacity: 1; border-color: rgb(229 231 235 / var(--tw-divide-opacity)); } .self-stretch { align-self: stretch; } .overflow-auto { overflow: auto; } .overflow-hidden { overflow: hidden; } .overflow-x-auto { overflow-x: auto; } .overflow-y-auto { overflow-y: auto; } .overflow-y-clip { overflow-y: clip; } .overflow-x-scroll { overflow-x: scroll; } .overflow-y-scroll { overflow-y: scroll; } .scroll-smooth { scroll-behavior: smooth; } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .text-ellipsis { text-overflow: ellipsis; } .whitespace-normal { white-space: normal; } .whitespace-nowrap { white-space: nowrap; } .break-words { overflow-wrap: break-word; } .rounded { border-radius: 8px; } .rounded-0 { border-radius: 0px; } .rounded-10 { border-radius: 10px; } .rounded-100 { border-radius: 100px; } .rounded-12 { border-radius: 12px; } .rounded-2 { border-radius: 2px; } .rounded-6 { border-radius: 6px; } .rounded-8 { border-radius: 8px; } .rounded-\[12px\] { border-radius: 12px; } .rounded-\[15px\] { border-radius: 15px; } .rounded-\[16px\] { border-radius: 16px; } .rounded-\[30px\] { border-radius: 30px; } .rounded-\[44px\] { border-radius: 44px; } .rounded-\[4px\] { border-radius: 4px; } .rounded-\[6px\] { border-radius: 6px; } .rounded-\[90px\] { border-radius: 90px; } .rounded-full { border-radius: 100%; } .rounded-l-\[12px\] { border-top-left-radius: 12px; border-bottom-left-radius: 12px; } .rounded-l-\[30px\] { border-top-left-radius: 30px; border-bottom-left-radius: 30px; } .rounded-r-\[30px\] { border-top-right-radius: 30px; border-bottom-right-radius: 30px; } .rounded-t-0 { border-top-left-radius: 0px; border-top-right-radius: 0px; } .border { border-width: 1px; } .border-2 { border-width: 2px; } .border-\[1px\] { border-width: 1px; } .border-b { border-bottom-width: 1px; } .border-l-0 { border-left-width: 0px; } .border-r-0 { border-right-width: 0px; } .border-t { border-top-width: 1px; } .border-t-\[1px\] { border-top-width: 1px; } .border-\[\#1a3b33\] { --tw-border-opacity: 1; border-color: rgb(26 59 51 / var(--tw-border-opacity)); } .border-\[\#BDD6BB\] { --tw-border-opacity: 1; border-color: rgb(189 214 187 / var(--tw-border-opacity)); } .border-\[\#CCDAD5\] { --tw-border-opacity: 1; border-color: rgb(204 218 213 / var(--tw-border-opacity)); } .border-coreDataGreen { --tw-border-opacity: 1; border-color: rgb(33 255 73 / var(--tw-border-opacity)); } .border-coreMidGreen { --tw-border-opacity: 1; border-color: rgb(15 125 75 / var(--tw-border-opacity)); } .border-coreMidGreenHover { --tw-border-opacity: 1; border-color: rgb(12 100 60 / var(--tw-border-opacity)); } .border-coreWarmGreen { --tw-border-opacity: 1; border-color: rgb(87 173 99 / var(--tw-border-opacity)); } .border-coreWhite { --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity)); } .border-digitalActiveBlue { --tw-border-opacity: 1; border-color: rgb(18 75 213 / var(--tw-border-opacity)); } .border-digitalDarkGrey15 { --tw-border-opacity: 1; border-color: rgb(221 222 224 / var(--tw-border-opacity)); } .border-digitalDarkGrey20 { --tw-border-opacity: 1; border-color: rgb(209 211 213 / var(--tw-border-opacity)); } .border-gray-200 { --tw-border-opacity: 1; border-color: rgb(229 231 235 / var(--tw-border-opacity)); } .border-secondaryGreen05 { --tw-border-opacity: 1; border-color: rgb(0 84 59 / var(--tw-border-opacity)); } .border-transparent { border-color: transparent; } .border-white { --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity)); } .bg-\[\#002115\] { --tw-bg-opacity: 1; background-color: rgb(0 33 21 / var(--tw-bg-opacity)); } .bg-\[\#03291A\] { --tw-bg-opacity: 1; background-color: rgb(3 41 26 / var(--tw-bg-opacity)); } .bg-\[\#0F7D4B\] { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .bg-\[\#E6F3E6\] { --tw-bg-opacity: 1; background-color: rgb(230 243 230 / var(--tw-bg-opacity)); } .bg-\[\#E9F3EA\] { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .bg-\[\#EFF7EF\] { --tw-bg-opacity: 1; background-color: rgb(239 247 239 / var(--tw-bg-opacity)); } .bg-\[\#F1F6FF\] { --tw-bg-opacity: 1; background-color: rgb(241 246 255 / var(--tw-bg-opacity)); } .bg-\[\#fff\] { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .bg-black { --tw-bg-opacity: 1; background-color: rgb(0 0 0 / var(--tw-bg-opacity)); } .bg-coreDarkGreen { --tw-bg-opacity: 1; background-color: rgb(0 33 21 / var(--tw-bg-opacity)); } .bg-coreDataGreen { --tw-bg-opacity: 1; background-color: rgb(33 255 73 / var(--tw-bg-opacity)); } .bg-coreLightGreen01 { --tw-bg-opacity: 1; background-color: rgb(206 231 213 / var(--tw-bg-opacity)); } .bg-coreLightGreen02 { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .bg-coreMidGreen { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .bg-coreWhite { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .bg-digitalDarkGrey15 { --tw-bg-opacity: 1; background-color: rgb(221 222 224 / var(--tw-bg-opacity)); } .bg-digitalLightGrey02 { --tw-bg-opacity: 1; background-color: rgb(245 247 249 / var(--tw-bg-opacity)); } .bg-fn-ModBgDarkTheme { --tw-bg-opacity: 1; background-color: rgb(0 33 21 / var(--tw-bg-opacity)); } .bg-fn-ModBgLightGreenTheme { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .bg-fn-ModBgLightTheme { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .bg-fn-ModBgMidGreenTheme { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .bg-fn-ModBgMidGreyTheme { --tw-bg-opacity: 1; background-color: rgb(245 247 249 / var(--tw-bg-opacity)); } .bg-gray-100 { --tw-bg-opacity: 1; background-color: rgb(243 244 246 / var(--tw-bg-opacity)); } .bg-gray-50 { --tw-bg-opacity: 1; background-color: rgb(249 250 251 / var(--tw-bg-opacity)); } .bg-slate-600 { --tw-bg-opacity: 1; background-color: rgb(71 85 105 / var(--tw-bg-opacity)); } .bg-transparent { background-color: transparent; } .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .bg-white\/50 { background-color: rgb(255 255 255 / 0.5); } .bg-opacity-50 { --tw-bg-opacity: 0.5; } .bg-cover { background-size: cover; } .bg-center { background-position: center; } .bg-no-repeat { background-repeat: no-repeat; } .object-contain { -o-object-fit: contain; object-fit: contain; } .object-cover { -o-object-fit: cover; object-fit: cover; } .object-center { -o-object-position: center; object-position: center; } .object-top { -o-object-position: top; object-position: top; } .\!p { padding: 24px !important; } .p { padding: 24px; } .p-0 { padding: 0px; } .p-10 { padding: 10px; } .p-12 { padding: 12px; } .p-16 { padding: 16px; } .p-20 { padding: 20px; } .p-24 { padding: 24px; } .p-32 { padding: 32px; } .p-6 { padding: 6px; } .p-8 { padding: 8px; } .\!px-0 { padding-left: 0px !important; padding-right: 0px !important; } .px { padding-left: 24px; padding-right: 24px; } .px-0 { padding-left: 0px; padding-right: 0px; } .px-12 { padding-left: 12px; padding-right: 12px; } .px-16 { padding-left: 16px; padding-right: 16px; } .px-20 { padding-left: 20px; padding-right: 20px; } .px-24 { padding-left: 24px; padding-right: 24px; } .px-6 { padding-left: 6px; padding-right: 6px; } .px-8 { padding-left: 8px; padding-right: 8px; } .px-\[10px\] { padding-left: 10px; padding-right: 10px; } .px-\[12px\] { padding-left: 12px; padding-right: 12px; } .px-\[6px\] { padding-left: 6px; padding-right: 6px; } .py { padding-top: 24px; padding-bottom: 24px; } .py-0 { padding-top: 0px; padding-bottom: 0px; } .py-12 { padding-top: 12px; padding-bottom: 12px; } .py-16 { padding-top: 16px; padding-bottom: 16px; } .py-2 { padding-top: 2px; padding-bottom: 2px; } .py-24 { padding-top: 24px; padding-bottom: 24px; } .py-32 { padding-top: 32px; padding-bottom: 32px; } .py-4 { padding-top: 4px; padding-bottom: 4px; } .py-8 { padding-top: 8px; padding-bottom: 8px; } .py-80 { padding-top: 80px; padding-bottom: 80px; } .py-\[2px\] { padding-top: 2px; padding-bottom: 2px; } .py-\[8px\] { padding-top: 8px; padding-bottom: 8px; } .pb-0 { padding-bottom: 0px; } .pb-10 { padding-bottom: 10px; } .pb-16 { padding-bottom: 16px; } .pb-20 { padding-bottom: 20px; } .pb-24 { padding-bottom: 24px; } .pb-32 { padding-bottom: 32px; } .pb-40 { padding-bottom: 40px; } .pb-48 { padding-bottom: 48px; } .pb-56 { padding-bottom: 56px; } .pb-64 { padding-bottom: 64px; } .pb-8 { padding-bottom: 8px; } .pb-80 { padding-bottom: 80px; } .pb-\[12px\] { padding-bottom: 12px; } .pb-\[20px\] { padding-bottom: 20px; } .pb-\[40px\] { padding-bottom: 40px; } .pl-0 { padding-left: 0px; } .pl-11 { padding-left: 11px; } .pl-20 { padding-left: 20px; } .pl-40 { padding-left: 40px; } .pl-48 { padding-left: 48px; } .pl-8 { padding-left: 8px; } .pl-\[10px\] { padding-left: 10px; } .pl-\[48px\] { padding-left: 48px; } .pr-0 { padding-right: 0px; } .pr-11 { padding-right: 11px; } .pr-16 { padding-right: 16px; } .pr-24 { padding-right: 24px; } .pr-48 { padding-right: 48px; } .pr-88 { padding-right: 88px; } .pt-0 { padding-top: 0px; } .pt-10 { padding-top: 10px; } .pt-16 { padding-top: 16px; } .pt-20 { padding-top: 20px; } .pt-24 { padding-top: 24px; } .pt-32 { padding-top: 32px; } .pt-36 { padding-top: 36px; } .pt-40 { padding-top: 40px; } .pt-48 { padding-top: 48px; } .pt-56 { padding-top: 56px; } .pt-64 { padding-top: 64px; } .pt-8 { padding-top: 8px; } .pt-88 { padding-top: 88px; } .pt-\[15px\] { padding-top: 15px; } .pt-\[4px\] { padding-top: 4px; } .pt-\[5px\] { padding-top: 5px; } .pt-\[64px\] { padding-top: 64px; } .pt-\[8px\] { padding-top: 8px; } .text-left { text-align: left; } .text-center { text-align: center; } .align-middle { vertical-align: middle; } .font-khgLight { font-family: KHGiga-Light, sans-serif; } .font-labgLight { font-family: LabGrotesqueMintec-Light, sans-serif; } .font-labgMed { font-family: LabGrotesqueMintec-Medium, sans-serif; } .font-serif { font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; } .text { font-size: 16px; } .text-2xl { font-size: 34px; } .text-3xl { font-size: 48px; } .text-\[10px\] { font-size: 10px; } .text-\[115px\] { font-size: 115px; } .text-\[11px\] { font-size: 11px; } .text-\[12px\] { font-size: 12px; } .text-\[14px\] { font-size: 14px; } .text-\[15px\] { font-size: 15px; } .text-\[16px\] { font-size: 16px; } .text-\[18px\] { font-size: 18px; } .text-\[22px\] { font-size: 22px; } .text-\[24px\] { font-size: 24px; } .text-\[27px\] { font-size: 27px; } .text-\[40px\] { font-size: 40px; } .text-\[44px\] { font-size: 44px; } .text-\[48px\] { font-size: 48px; } .text-base { font-size: 16px; } .text-lg { font-size: 21px; } .text-md { font-size: 18px; } .text-sm { font-size: 15px; } .text-xs { font-size: 14px; } .font-\[300\] { font-weight: 300; } .font-\[600\] { font-weight: 600; } .font-\[700\] { font-weight: 700; } .font-bold { font-weight: 700; } .font-light { font-weight: 300; } .font-medium { font-weight: 500; } .font-normal { font-weight: 400; } .font-semibold { font-weight: 600; } .uppercase { text-transform: uppercase; } .capitalize { text-transform: capitalize; } .not-italic { font-style: normal; } .leading-140 { line-height: 140%; } .leading-6 { line-height: 1.5rem; } .leading-8 { line-height: 2rem; } .leading-\[100\%\] { line-height: 100%; } .leading-\[120\%\] { line-height: 120%; } .leading-\[130\%\] { line-height: 130%; } .leading-\[140\%\] { line-height: 140%; } .leading-\[17px\] { line-height: 17px; } .leading-loose { line-height: 2; } .leading-none { line-height: 1; } .leading-snug { line-height: 1.375; } .leading-tight { line-height: 1.25; } .-tracking-\[0\.01px\] { letter-spacing: -0.01px; } .tracking-\[0\.8px\] { letter-spacing: 0.8px; } .tracking-wide { letter-spacing: 0.025em; } .text-\[\#002115\] { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .text-\[\#124BD5\] { --tw-text-opacity: 1; color: rgb(18 75 213 / var(--tw-text-opacity)); } .text-\[\#fff\] { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .text-black { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); } .text-blue-600 { --tw-text-opacity: 1; color: rgb(37 99 235 / var(--tw-text-opacity)); } .text-coreDarkGreen { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .text-coreDataGreen { --tw-text-opacity: 1; color: rgb(33 255 73 / var(--tw-text-opacity)); } .text-coreMidGreen { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .text-coreWhite { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .text-digitalActiveBlue { --tw-text-opacity: 1; color: rgb(18 75 213 / var(--tw-text-opacity)); } .text-digitalDarkGrey20 { --tw-text-opacity: 1; color: rgb(209 211 213 / var(--tw-text-opacity)); } .text-digitalDarkGrey40 { --tw-text-opacity: 1; color: rgb(163 166 172 / var(--tw-text-opacity)); } .text-digitalDarkGrey60 { --tw-text-opacity: 1; color: rgb(118 122 130 / var(--tw-text-opacity)); } .text-digitalDarkGrey80 { --tw-text-opacity: 1; color: rgb(72 77 89 / var(--tw-text-opacity)); } .text-foreground { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .text-gray-500 { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity)); } .text-gray-600 { --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity)); } .text-gray-700 { --tw-text-opacity: 1; color: rgb(55 65 81 / var(--tw-text-opacity)); } .text-gray-800 { --tw-text-opacity: 1; color: rgb(31 41 55 / var(--tw-text-opacity)); } .text-gray-900 { --tw-text-opacity: 1; color: rgb(17 24 39 / var(--tw-text-opacity)); } .text-green-800 { --tw-text-opacity: 1; color: rgb(22 101 52 / var(--tw-text-opacity)); } .text-secondaryGreen05 { --tw-text-opacity: 1; color: rgb(0 84 59 / var(--tw-text-opacity)); } .text-secondaryMidGreen { --tw-text-opacity: 1; color: rgb(15 125 72 / var(--tw-text-opacity)); } .text-semanticRed { --tw-text-opacity: 1; color: rgb(196 1 5 / var(--tw-text-opacity)); } .text-white { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .text-white\/55 { color: rgb(255 255 255 / 0.55); } .underline { text-decoration-line: underline; } .opacity-0 { opacity: 0; } .opacity-\[80\%\] { opacity: 80%; } .shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .shadow-\[0_0_17px_0_rgba\(0\2c 0\2c 0\2c 0\.1\)\] { --tw-shadow: 0 0 17px 0 rgba(0,0,0,0.1); --tw-shadow-colored: 0 0 17px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .shadow-dropdown { --tw-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10); --tw-shadow-colored: 0px 4px 4px 0px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .shadow-lg { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .shadow-sm { --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .outline { outline-style: solid; } .blur { --tw-blur: blur(8px); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .filter { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .backdrop-blur { --tw-backdrop-blur: blur(8px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } .backdrop-blur-sm { --tw-backdrop-blur: blur(4px); -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } .transition { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-opacity { transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .transition-transform { transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .delay-100 { transition-delay: 100ms; } .duration-200 { transition-duration: 200ms; } .duration-300 { transition-duration: 300ms; } .duration-500 { transition-duration: 500ms; } .ease-in-out { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } /* Expana System: Utilities */ .container { max-width: 1536px; } .prose p { margin: 1em 0; } .prose ul, .prose ol { padding-left: 2em; margin-bottom: 1em; } .prose ul li, .prose ol li { margin-bottom: 0.5em; } .prose ul { list-style-type: disc; } .prose ol { list-style-type: decimal; } .prose blockquote { margin: 1em 0; padding-left: 1em; border-left: 4px solid #ccc; color: #666; } .prose pre { background: #f4f4f4; padding: 1em; overflow: auto; } .prose code { background: #f4f4f4; padding: 0.2em 0.4em; border-radius: 4px; } .prose a:hover { text-decoration: underline; } .featured-speakers p { margin: 0; } /* Globals */ /* Expana System: Masthead */ .masthead { position: sticky; z-index: 900; top: 0; display: flex; align-items: center; background-color: #fff; transition-property: top; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 500ms; } @media (min-width: 1024px) { .masthead { position: static; height: 114px; top: 24px; z-index: 9999; } } .logged-in .masthead { top: var(--wp-admin-bar-mobile); } @media (min-width: 1024px) { .masthead.is-sticky { position: fixed; } } .masthead.is-sticky { --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .masthead.is-sticky > * { padding-left: 16px; padding-right: 16px; padding-top: 14px; padding-bottom: 14px; } .masthead.is-sticky { border-radius: 10px; } @media (min-width: 1024px) { .masthead.is-sticky { --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); left: 50%; top: 40px; height: auto; } } .masthead .icon-search-close { fill: #0F7D4B; } @media (min-width: 1024px) { .masthead-event { height: 213px; } } .masthead-inner { display: flex; justify-content: space-between; align-items: center; position: relative; flex-wrap: wrap; } @media (min-width: 1024px) { .masthead-inner { height: 100%; padding-bottom: 14px; flex-direction: column; justify-content: center; gap: 22px; } } /* Not sure what this code is... might be safe to remove */ .page_item_has_children { position: relative; } .page_item_has_children ul { display: none; position: absolute; top: 100%; } .page_item_has_children:hover ul { display: block; } /* Expana System: Navigation */ .menu-main-navigation-wrapper { display: flex; flex-direction: column; position: fixed; z-index: 900; top: 56px; background-color: #fff; max-width: 500px; width: 100%; right: -100%; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; --tw-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.14); --tw-shadow-colored: 0px 8px 16px 0px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); height: calc(100% - 56px); } .peer:checked ~ .menu-main-navigation-wrapper { right: 0px; } @media (min-width: 1024px) { .menu-main-navigation-wrapper { flex: 1 1 0%; flex-direction: row; align-items: center; justify-content: space-between; max-width: 100%; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); position: static; } } .logged-in .menu-main-navigation-wrapper { top: 102px; height: calc(100% - 102px); } @media (min-width: 1024px) { .logged-in .menu-main-navigation-wrapper { top: auto; } } @media (min-width: 768px) { .logged-in .menu-main-navigation-wrapper { top: 88px; } } .menu-main-navigation { display: flex; flex-direction: column; padding: 16px; gap: 16px; } @media (min-width: 1024px) { .menu-main-navigation { gap: 0px; flex-direction: row; padding: 0px; align-items: center; } } @media (min-width: 1280px) { .menu-main-navigation { gap: 8px; } } .masthead-event.is-sticky .primary-nav-wrapper.hide_if_event_menu_exists { display: none; } @media (min-width: 1024px) { .event-btn-demo{ position: absolute; right: 0; bottom: -28px } .event-btn-demo a{ height: 50px; } .event-navigation, .navigation-module { border-top-width: 1px; border-bottom-width: 1px; } } @media screen and (min-width: 3367px) { .event-navigation, .navigation-module { border-bottom-width: 0px; } } @media (min-width: 1024px) { .event-navigation, .navigation-module { --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity)); padding-top: 20px; padding-bottom: 20px; display: flex; } } .event-navigation, .navigation-module { position: relative; } @media (min-width: 1024px) { .is-sticky .event-navigation, .is-sticky .navigation-module { border-top-width: 0px; border-bottom-width: 0px; padding-top: 10px; padding-bottom: 10px; } } .event-navigation #desktop-event-navigation,.navigation-module #desktop-event-navigation{ display: none; } @media (min-width: 1024px) { .event-navigation #desktop-event-navigation,.navigation-module #desktop-event-navigation { display: flex; } } .event-navigation #desktop-event-navigation > .menu-item,.navigation-module #desktop-event-navigation > .menu-item{ position: relative; } .event-navigation #desktop-event-navigation .sub-menu,.navigation-module #desktop-event-navigation .sub-menu{ left: 0; --tw-translate-x: 0; top: 80px; animation: none; } .event-navigation #desktop-event-navigation .sub-menu .menu-list,.navigation-module #desktop-event-navigation .sub-menu .menu-list{ min-width: auto; white-space: nowrap; } .event-navigation .mobile-event-navigation-wrapper,.navigation-module .mobile-event-navigation-wrapper { height: 0px; } @media (min-width: 1024px) { .event-navigation .mobile-event-navigation-wrapper,.navigation-module .mobile-event-navigation-wrapper { height: auto; } } .event-navigation .mobile-event-navigation-wrapper,.navigation-module .mobile-event-navigation-wrapper { overflow: hidden; transition: height .5s ease; } @media (min-width: 1024px) { .event-navigation #mobile-event-navigation,.navigation-module #mobile-event-navigation { display: none; } } .event-navigation #mobile-event-navigation .menu-item-0,.navigation-module #mobile-event-navigation .menu-item-0 { padding: 17px; } .event-navigation #mobile-event-navigation .menu-item-0 > .menu-item-label,.navigation-module #mobile-event-navigation .menu-item-0 > .menu-item-label{ color: #000; } .event-navigation #mobile-event-navigation .icon-chevron-down, .event-navigation #mobile-event-navigation .menu-item-label-0 .icon-chevron-right, .navigation-module #mobile-event-navigation .icon-chevron-down, .navigation-module #mobile-event-navigation .menu-item-label-0 .icon-chevron-right{ fill: #002115 !important; } .event-navigation #mobile-event-navigation .menu-item-label,.navigation-module #mobile-event-navigation .menu-item-label { font-family: LabGrotesqueMintec-Light, sans-serif; } .fluentform-step .col-span-12.mt-24.event-navigation #mobile-event-navigation .menu-item-label a,.fluentform-step .col-span-12.mt-24.navigation-module #mobile-event-navigation .menu-item-label a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } .event-navigation #mobile-event-navigation li.menu-item-0:has(.sub-menu),.navigation-module #mobile-event-navigation li.menu-item-0:has(.sub-menu){ padding: 0; } .event-navigation #mobile-event-navigation li.menu-item-0:has(.sub-menu) label,.navigation-module #mobile-event-navigation li.menu-item-0:has(.sub-menu) label { padding: 17px; display: block; } .event-navigation #mobile-event-navigation #sub-menu-navigation,.navigation-module #mobile-event-navigation #sub-menu-navigation{ padding: 0; } .event-navigation #mobile-event-navigation .menu-level-2,.navigation-module #mobile-event-navigation .menu-level-2{ gap: 0; padding-left: 0; } .event-navigation #mobile-event-navigation .menu-level-2 li.menu-item > a,.navigation-module #mobile-event-navigation .menu-level-2 li.menu-item > a{ padding: 10px 17px 10px 30px; display: block; } .event-navigation #mobile-event-navigation .menu-level-2 li.menu-item > a:hover,.navigation-module #mobile-event-navigation .menu-level-2 li.menu-item > a:hover{ background-color: var(--current-hover-bg); } .event-navigation .menu-header,.navigation-module .menu-header{ cursor: pointer; line-height: 22px; padding: 17px; display: flex; } @media (min-width: 1024px) { .event-navigation .menu-header,.navigation-module .menu-header { display: none; } } .event-navigation .menu-header,.navigation-module .menu-header { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); justify-content: space-between; } @media (max-width: 767px) { .event-navigation{ margin-left: -16px; margin-right: -16px; width: 140%; } .register-button > a { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); color: #124BD5; border: 0; border-radius: 0; justify-content: flex-start; padding-left: 16px; } .register-button > a:hover { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); text-decoration-line: underline !important; } .navigation-module{ margin-left: -16px; margin-right: -16px; width: 100%; } } .secondary-nav { display: none; width: 100%; height: 37px; border-bottom: solid 1px #D1D3D5; } @media (min-width: 1024px) { .secondary-nav { font-size: 14px; display: flex; gap: 15px; align-items: center; padding-top: 4px; flex-basis: 36px; justify-content: flex-end; } } .secondary-nav a { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .is-sticky .secondary-nav { display: none; } .secondary-nav-mobile { padding: 0 24px; padding-bottom: 24px; } @media (min-width: 1024px) { .secondary-nav-mobile { display: none; } } .secondary-nav-mobile::before { position: absolute; width: calc(100% - 32px); left: 50%; --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); border-top-width: 1px; content: var(--tw-content); top: 0px; } .masthead-back-button { position: fixed; top: -100px; } .peer:checked ~ .masthead-back-button { top: 0; } .logged-in .peer:checked ~ .masthead-back-button { top: var(--wp-admin-bar-mobile); } .masthead-back-button { left: 0; padding: 0 15px; cursor: pointer; z-index: 900; height: 55px; width: 200px; display: flex; align-items: center; gap: 8px; color: #000; background-color: #fff; line-height: 1; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.masthead-back-button.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.masthead-back-button.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } @media (min-width: 1024px) { .masthead-back-button { display: none; } } /* Menu layout styles */ /* No icons */ .menu-style-detail .menu-style-inner { display: grid; gap: 16px; } /* If there are more than 5 elements */ @media (min-width: 1024px) { .menu-style-detail .menu-style-inner.has-many-children { display: block; } } /* If there are less than 5 element */ .menu-style-detail .menu-style-inner.has-few-children { display: flex; flex-direction: column; gap: 16px; } @media (min-width: 1024px) { .menu-style-detail .menu-style-inner.has-few-children { gap: 0px; } } /* With icons */ .menu-style-inner.has-few-children { display: flex; flex-direction: column; gap: 16px; } @media (min-width: 1024px) { .menu-style-inner.has-few-children { flex-direction: row; gap: 0px; } } /* With icons */ @media (min-width: 1024px) { .menu-style-icon .menu-style-inner { display: flex; } .menu-style-icon .menu-style-inner > * { flex: 1 1 0%; } .menu-style-icon .menu-style-inner { gap: 64px; } } /* Menu List Items's */ .menu-item { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } @media (min-width: 1024px) { .menu-item { display: block; } } /* Top Level */ .menu-item-0 { line-height: 1; } @media (min-width: 1024px) { .menu-item-0 { padding-top: 8px; padding-bottom: 8px; line-height: 1; padding-left: 8px; padding-right: 8px; border-radius: 10px; } } @media (min-width: 1280px) { .menu-item-0 { padding-left: 12px; padding-right: 12px; } } .menu-item-0:hover { background-color: #fff; } /* Second level */ @media (min-width: 1024px) { .menu-item-1.menu-style-detail { padding: 8px; } .menu-item-1.menu-style-detail:hover { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); border-radius: 6px; } .menu-item-1.menu-style-detail { margin-bottom: 16px; } } .menu-item-1.menu-style-detail .menu-item-label-inner { color: inherit; } /* Menu links/labels */ @media (min-width: 1024px) { .menu-item-label { height: auto; } } .menu-item-label { font-family: LabGrotesqueMintec-Medium, sans-serif; } .roi-step-buttons.menu-item-label.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top{ position: relative; } .roi-step-buttons.menu-item-label.step-2 .ff-el-group.ff-el-form-top.ff-el-form-top .ff-el-input--label{ top: 8px; left: 17px; color: var(--ff-green); margin: 0; font-size: 12px; position: absolute; } @media (min-width: 1024px) { .menu-item-label svg { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } } /* Top Level */ .menu-item-label-0 { white-space: nowrap; } .menu-item-label-0 .menu-item-label-inner { gap: 4px; min-width: -moz-max-content; min-width: max-content; } /* Second level */ @media (min-width: 1024px) { .menu-item-label-1 .menu-item-label-inner { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } } /* Third Level */ .menu-item-label-2 { font-family: LabGrotesqueMintec-Light, sans-serif; } .fluentform-step .col-span-12.mt-24.menu-item-label-2 a{ color:rgb(15 125 75 / var(--tw-text-opacity)) } @media (min-width: 1024px) { .menu-item-label-2 { display: block; } .menu-item-label-2 .menu-item-label-inner { justify-content: flex-start; gap: 8px; } .menu-item-label-2 .menu-item-label-inner:hover { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .menu-item-label-2 .menu-item-label-inner { padding-left: 4px; padding-right: 4px; padding-top: 4px; padding-bottom: 4px; border-radius: 6px; } } .menu-item-label-inner { display: flex; justify-content: space-between; align-items: center; cursor: pointer; } .menu-item-label-inner.has-icons { padding-top: 4px; } @media (min-width: 1024px) { .menu-item-label-inner.has-icons { padding-bottom: 24px; padding-left: 4px; padding-right: 4px; } } .menu-icon { width: 23px; height: 23px; background: no-repeat center center; background-size: contain; } .menu-label-text { display: block; font-size: 15px; line-height: 22px; } /* Megamenu layout */ .menu-level-2 { display: grid; gap: 16px; padding-left: 20px; } @media (min-width: 1024px) { .menu-level-2 { padding-left: 0px; } .menu-level-2.lg-icons-has-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); } .menu-level-2.lg-details-has-columns { -moz-columns: 2; columns: 2; padding: 8px; gap: 64px; } } .language-selector { z-index: 1000; } .language-dropdown a:hover { color: #117D4C; cursor: pointer; } .global-icon-white svg path { fill: #fff; } .global-icon-black svg path { fill: #002115; } .global-icon-active-green svg path { fill: #1EFF48; } .menu-main-navigation-wrapper .sub-menu{ overflow-y: auto; } .mega-menu-btn a{ color: black; } .menu-child-icon{ color:#002115; } .mega-menu-item span{ color: black; } .mega-menu-item span:hover, .mega-menu-item:hover{ background-color: #DBEDDB; } .mega-menu-btn{ border-top: 1px solid #050505; } .mega-menu-desktop-nav > .mega-menu-desktop-nav-item:nth-last-child(2) { border-bottom: none; } .mega-menu-btn .btn { justify-content: start; } .mega-menu-new .menu-item-label{ font-family: LabGrotesqueMintec-Light, sans-serif; } .mega-menu-new .menu-item-label-inner { justify-content: flex-start; gap: 8px; } .mega-menu-desktop-nav-item{ min-height: 42px; } .menu-item-label-inner { display: flex; align-items: center; justify-content: space-between; width: 100%; } .menu-item-label-inner > span:last-child { flex-shrink: 0; } .menu-label-text { flex: 1; } /* Exact current page (level 3 usually) */ .mega-menu-desktop-nav-item-level1-current .menu-item-label-inner > span { font-weight: bold; } .mega-menu-desktop-nav-item-current .menu-item-label-inner > span { font-weight: bold; } /* Call out menu on larger screens only */ .menu-call-out { background-color: #F5F7F9; padding: 16px; } @media (min-width: 1024px) { .menu-call-out { padding: 32px; min-width: 320px; } } /* We hide these callout menu types on mobile, but display type of list and detail */ .menu-call-out-text, .menu-call-out-video { display: none; } @media (min-width: 1024px) { .menu-call-out-text, .menu-call-out-video { display: block; } } .menu-title { font-family: LabGrotesqueMintec-Medium, sans-serif; color: #0F7D4B; font-size: 16px; padding-bottom: 24px; } .callout-content { line-height: 1.5; } .callout-content > * { font-family: LabGrotesqueMintec-Medium, sans-serif; margin-bottom: 20px; } .callout-content-list li { vertical-align: middle; display: flex; gap: 8px; align-items: center; margin-bottom: 4px; } .callout-content-list li:before { content: ''; background: url('../svg/checkmark-bullet.svg') no-repeat center; background-size: cover; width: 1.5rem; height: 1.5rem; display: block; } .callout-content-video { padding-top: 16px; } .callout-content-video > * { font-family: LabGrotesqueMintec-Light, sans-serif; margin-bottom: 20px; } /* Expana System: Masthead (Theme) */ .masthead .icon-chevron-down { fill: #0F7D4B; } .masthead-light:not(.is-sticky) { --current-hover-bg: rgb(206 231 213 / 30%); --current-hover-text: #002115; } /* Top level menu item hover and current states */ .masthead-light:not(.is-sticky) .menu-item-0:hover, .masthead-light:not(.is-sticky) .menu-item-0.menu-item-current { background-color: var(--current-hover-bg); } .masthead-light:not(.is-sticky) .menu-item-0:hover > .menu-item-label, .masthead-light:not(.is-sticky) .menu-item-0.menu-item-current > .menu-item-label { color: var(--current-hover-text); } .masthead-light:not(.is-sticky) .menu-item-0:hover .icon-chevron-down, .masthead-light:not(.is-sticky) .menu-item-0.menu-item-current .icon-chevron-down { fill: var(--current-hover-text); } /* Add a current state to the top level menu link, if we are on a sub menu page */ .masthead-light:not(.is-sticky) li.menu-item-0:has(.menu-item-current) { background-color: var(--current-hover-bg); } .masthead-light:not(.is-sticky) li.menu-item-0:has(.menu-item-current) label.menu-item-label.menu-item-label-0 { color: var(--current-hover-text); } .masthead-light:not(.is-sticky) .header__search-input, .masthead-grey:not(.is-sticky) .header__search-input { border-color: rgb(209 211 213 / 20%); } .masthead-light:not(.is-sticky) .header__search-input:focus, .masthead-grey:not(.is-sticky) .header__search-input:focus { border-color: #124BD5; } .masthead-grey:not(.is-sticky) { --background: #F5F7F9; --current-hover-bg: #fff; --current-hover-text: #002115; background-color: var(--background); } .masthead-grey:not(.is-sticky) .menu-main-navigation-wrapper { background-color: var(--background); } /* Top level menu item hover and current states */ .masthead-grey:not(.is-sticky) .menu-item-0:hover, .masthead-grey:not(.is-sticky) .menu-item-0.menu-item-current { background-color: var(--current-hover-bg); } .masthead-grey:not(.is-sticky) .menu-item-0:hover > .menu-item-label, .masthead-grey:not(.is-sticky) .menu-item-0.menu-item-current > .menu-item-label { color: var(--current-hover-text); } /* Add a current state to the top level menu link, if we are on a sub menu page */ .masthead-grey:not(.is-sticky) li.menu-item-0:has(.menu-item-current) { background-color: var(--current-hover-bg); } .masthead-grey:not(.is-sticky) li.menu-item-0:has(.menu-item-current) label.menu-item-label.menu-item-label-0 { color: var(--current-hover-text); } /* Back button */ .masthead-grey:not(.is-sticky) .masthead-back-button { background-color: var(--background); } .masthead-green:not(.is-sticky) { --background: #E9F3EA; --current-hover-bg: #fff; --current-hover-text: #002115; background-color: var(--background); } .masthead-green:not(.is-sticky) .menu-main-navigation-wrapper { background-color: var(--background); } .masthead-green:not(.is-sticky) .header__search-input { border-color: rgb(15 125 75 / 20%); } .masthead-green:not(.is-sticky) .header__search-input:focus { border-color: var(--text); } /* Top level menu item hover and current states */ .masthead-green:not(.is-sticky) .menu-item-0:hover, .masthead-green:not(.is-sticky) .menu-item-0.menu-item-current { background-color: var(--current-hover-bg); } .masthead-green:not(.is-sticky) .menu-item-0:hover > .menu-item-label, .masthead-green:not(.is-sticky) .menu-item-0.menu-item-current > .menu-item-label { color: var(--current-hover-text); } /* Add a current state to the top level menu link, if we are on a sub menu page */ .masthead-green:not(.is-sticky) li.menu-item-0:has(.menu-item-current) { background-color: var(--current-hover-bg); } .masthead-green:not(.is-sticky) li.menu-item-0:has(.menu-item-current) label.menu-item-label.menu-item-label-0 { color: var(--current-hover-text); } /* Back button */ .masthead-green:not(.is-sticky) .masthead-back-button { background-color: var(--background); } .masthead-dark { --background: #002115; --text: #fff; --current-hover-bg: rgb(206 231 213 / 30%); --current-hover-text: #21FF49; background-color: var(--background); } .masthead-dark .menu-main-navigation-wrapper, .masthead-dark .secondary-nav-mobile-wrapper { background-color: var(--background); } .masthead-dark .menu-item-0:hover .icon-chevron-down { fill: var(--current-hover-text); } .masthead-dark .secondary-nav-mobile { border-bottom-color: rgb(206 231 213 / 30%); } .masthead-dark .secondary-nav-mobile a { color: var(--text); } .masthead-dark .secondary-nav { border-bottom-color: rgb(233 243 234 / 20%); } .masthead-dark .secondary-nav a { color: var(--text); } .masthead-dark .secondary-nav a:hover { --tw-text-opacity: 1; color: rgb(33 255 73 / var(--tw-text-opacity)); } .masthead-dark .icon-chevron-down, .masthead-dark .menu-item-label-0 .icon-chevron-right, .masthead-dark .icon-arrow-right, .masthead-dark .icon-search, .masthead-dark .icon-search-close { fill: var(--text); } .masthead-dark .burger .line { background-color: var(--text); } .masthead-dark .header__search-input { border-color: rgb(255 255 255 / 80%); color: var(--text); } .masthead-dark .header__search-input:focus { border-color: var(--current-hover-text); } .masthead-dark .icon-search-close { fill: var(--text); } /* Top level menu item hover and current states */ .masthead-dark .menu-item-0 > .menu-item-label { color: var(--text); } .masthead-dark .menu-item-0:hover, .masthead-dark .menu-item-0.menu-item-current { background-color: var(--current-hover-bg); } .masthead-dark .menu-item-0:hover > .menu-item-label, .masthead-dark .menu-item-0.menu-item-current > .menu-item-label { color: var(--current-hover-text); } /* Add a current state to the top level menu link, if we are on a sub menu page */ .masthead-dark li.menu-item-0:has(.menu-item-current) { background-color: var(--current-hover-bg); } .masthead-dark li.menu-item-0:has(.menu-item-current) label.menu-item-label.menu-item-label-0 { color: var(--current-hover-text); } /* Back button */ .masthead-dark .masthead-back-button { background-color: var(--background); color: var(--text); } /* Expana System: Search */ .js-toggle-search.search-close { display: none; } .has-search-active .js-toggle-search.search-close { display: block; } .has-search-active .js-toggle-search .icon-search-shape, .has-search-active .backdrop-blur-sm, .has-search-active .burger, .has-search-active #site-logo, .has-search-active .secondary-nav, .has-search-active .menu-main-navigation-wrapper { display: none !important; } .has-search-active #language-selector-toggle-mobile { display: none; } .masthead-search { display: none; position: relative; height: 28px; width: 100%; transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } @media (min-width: 1024px) { .masthead-search { height: 32px; margin-top: 36px; margin-left: 20vw; margin-right: 20vw; } } .has-search-active .masthead-search { display: flex; } .header__search-input { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; padding-left: 28px; padding-bottom: 2px; border-bottom-width: 1px; background-color: transparent; outline: 2px solid transparent; outline-offset: 2px; flex: 1 1 0%; position: absolute; bottom: 0px; width: 100%; } @media (min-width: 1024px) { .header__search-input { padding-bottom: 6px; padding-left: 36px; font-size: 21px; } } /* Expana System: Footer */ #menu-footer-menu > li > .menu-item-title, .sub-menu .menu-item-has-children > .menu-item-title { font-weight: 700; font-size: 16px; margin-bottom: 16px; } #menu-footer-menu > li > a { display: flex; justify-content: space-between; align-items: center; } @media (hover: hover) { .footer-menu a:hover { color: #0E3CAA; text-decoration: underline; transition: 200ms linear all; } } #menu-footer-menu > li, .sub-menu .menu-item-has-children ul { grid-column: span 2 / span 2; display: flex; flex-direction: column; } #menu-footer-menu ul.sub-menu { display: flex; flex-direction: column; row-gap: 12px; } #menu-footer-menu > li { margin-bottom: 32px; } /* This needs to be explicitly added instead of with tailwind as it's added via js */ @media (max-width: 1280px) { .hide-sub-menu { display: none !important; } } #menu-footer-menu > li > .menu-item-title { font-weight: 500; } /* Expana System: Breadcrumb */ .breadcrumb__wrapper { font-size: 14px; } .breadcrumb__item { display: flex; align-items: center; gap: 0.5rem; } .breadcrumb__seperator { background: no-repeat center center url("../svg/chevron-right-gray.svg"); background-size: contain; width: 0.5rem; height: 0.8rem; } .breadcrumb__item:last-of-type .breadcrumb__seperator { display: none; } .breadcrumb__link { font-weight: 500; font-family: LabGrotesqueMintec-Medium, sans-serif; color: #484D59; text-overflow: ellipsis; max-width: 22ch; white-space: nowrap; overflow: hidden; } .breadcrumb__link:hover { text-decoration: underline; } /* ========================================================================== HUBSPOT FORM WIDTH FIX — APPLIED ONLY ON 4 CONTACT PAGES ========================================================================== */ body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id="cf70af3e-d7f6-4ff6-ab69-781b39d7ca53"]) *, body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id="bbd3b17d-1d6e-45aa-88a5-9f95007ddfca"]) *, body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id="497999e3-3906-48f2-9d21-5fbb477de6e0"]) *, body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id="82cd4227-f900-415e-9dce-19b0ca0a7aa0"]) * { box-sizing: border-box !important; } /* Wrapper width control */ body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) > div, body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) .hs-form-private { max-width: 650px !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } /* Fields, inputs, fieldsets */ body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) .hs-form-field, body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) .input, body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) fieldset { max-width: 650px !important; width: 100% !important; } /* Stacked layout override */ body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) .hs-form.stacked { max-width: 650px !important; width: 100% !important; margin: 0 !important; } /* WP/Tailwind flex fix */ body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .multi-column-combo .embed, body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .multi-column-combo .hbspt-form { display: block !important; width: 100% !important; max-width: 650px !important; } /* Checkbox fixes */ body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) .inputs-list.multi-container { display: block !important; } body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) .hs-form-checkbox { display: flex !important; align-items: center !important; margin-bottom: 6px !important; } body:is(.page-id-2942, .page-id-2944, .page-id-2946, .page-id-376) .hbspt-form:has(form[data-form-id]) .hs-form-checkbox span { white-space: normal !important; margin-left: 8px !important; } /* Animations: Core */ :root { --animate-duration: 1s; --animate-delay: 1s; --animate-repeat: 1; } .animated, *[data-scroll-class] { animation-duration: var(--animate-duration); animation-fill-mode: both; } .animated.infinite { animation-iteration-count: infinite; } .animated.repeat-1 { animation-iteration-count: var(--animate-repeat); } .animated.repeat-2 { animation-iteration-count: calc(var(--animate-repeat) * 2); } .animated.repeat-3 { animation-iteration-count: calc(var(--animate-repeat) * 3); } .animated.delay-1s { animation-delay: var(--animate-delay); } .animated.delay-2s { animation-delay: calc(var(--animate-delay) * 2); } .animated.delay-3s { animation-delay: calc(var(--animate-delay) * 3); } .animated.delay-4s { animation-delay: calc(var(--animate-delay) * 4); } .animated.delay-5s { animation-delay: calc(var(--animate-delay) * 5); } .animated.faster { animation-duration: calc(var(--animate-duration) / 2); } .animated.fast { animation-duration: calc(var(--animate-duration) * 0.8); } .animated.slow { animation-duration: calc(var(--animate-duration) * 2); } .animated.slower { animation-duration: calc(var(--animate-duration) * 3); } @media print, (prefers-reduced-motion: reduce) { .animated, *[data-scroll-class] { animation-duration: 1ms !important; transition-duration: 1ms !important; animation-iteration-count: 1 !important; } .animated[class*='Out'] { opacity: 0; } } /* Animations: Fading Entrances */ @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fadeIn { animation-name: fadeIn; } .fadeIn-pre { opacity: 0; } @keyframes fadeInDown { from { opacity: 0; transform: translate3d(0, -100%, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } } .fadeInDown { animation-name: fadeInDown; } .fadeInDown-pre { opacity: 0; transform: translate3d(0, -100%, 0); } @keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%, 0, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } } .fadeInLeft { animation-name: fadeInLeft; } .fadeInLeft-pre { opacity: 0; transform: translate3d(-100%, 0, 0); } @keyframes fadeInRight { from { opacity: 0; transform: translate3d(100%, 0, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } } .fadeInRight { animation-name: fadeInRight; } .fadeInRight-pre { opacity: 0; transform: translate3d(100%, 0, 0); } @keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } } .fadeInUp { animation-name: fadeInUp; } .fadeInUp-pre { opacity: 0; transform: translate3d(0, 100%, 0); } /* Animations: Custom */ @keyframes expanaFadeInUp { from { opacity: 0; transform: translate3d(0, 30px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } } .expanaFadeInUp { animation-name: expanaFadeInUp; } .expanaFadeInUp-pre { opacity: 0; transform: translate3d(0, 30px, 0); } @keyframes expanaLongFadeInUp { from { opacity: 0; transform: translate3d(0, 60px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } } .expanaLongFadeInUp { animation-name: expanaLongFadeInUp; } .expanaLongFadeInUp-pre { opacity: 0; transform: translate3d(0, 60px, 0); } @media (max-width: 768px) { /* Disables fade animations on mobile to improve google site speed score */ .expanaFadeInUp { animation: none !important; opacity: 1 !important; transform: none !important; } .expanaLongFadeInUp { animation: none !important; opacity: 1 !important; transform: none !important; } } /* Hubspot Cookie Declaration */ /* Expana System: HS Cookie Styles */ #hs-eu-cookie-confirmation { width:50%!important; } @media (max-width: 767px) { #hs-eu-cookie-confirmation { width:100%!important } } #hs-eu-cookie-confirmation #hs-eu-cookie-confirmation-inner { padding:20px!important; } #hs-eu-cookie-confirmation #hs-eu-policy-wording p, #hs-eu-cookie-confirmation #hs-eu-policy-wording a { line-height:1.3em; } #hs-eu-cookie-confirmation #hs-eu-opt-in-buttons button { height:2.5em; min-width:7em; font-weight:600; } /* Cookiebot */ /* Expana System: Cookiebot */ a#CybotCookiebotDialogPoweredbyCybot{ display: none !important; } #CookiebotWidget .CookiebotWidget-body .CookiebotWidget-main-logo { display: none !important; } .\*\:aspect-16\/9 > * { aspect-ratio: 16 / 9; } .\*\:size-14 > * { width: 14px; height: 14px; } .\*\:size-\[20px\] > * { width: 20px; height: 20px; } .\*\:h-28 > * { height: 28px; } .\*\:h-30 > * { height: 30px; } .\*\:h-full > * { height: 100%; } .\*\:w-24 > * { width: 24px; } .\*\:w-40 > * { width: 40px; } .\*\:w-full > * { width: 100%; } .\*\:max-w-24 > * { max-width: 24px; } .\*\:shrink > * { flex-shrink: 1; } .\*\:grow-0 > * { flex-grow: 0; } .\*\:object-cover > * { -o-object-fit: cover; object-fit: cover; } .\*\:py-4 > * { padding-top: 4px; padding-bottom: 4px; } .\*\:text-xs > * { font-size: 14px; } .\*\:leading > * { line-height: 120%; } .\*\:leading-6 > * { line-height: 1.5rem; } .\*\:leading-\[22px\] > * { line-height: 22px; } .before\:absolute::before { content: var(--tw-content); position: absolute; } .before\:inset-0::before { content: var(--tw-content); inset: 0px; } .before\:z-10::before { content: var(--tw-content); z-index: 10; } .before\:bg-black\/50::before { content: var(--tw-content); background-color: rgb(0 0 0 / 0.5); } .first\:rounded-l-10:first-child { border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .first\:border-t:first-child { border-top-width: 1px; } .first\:border-t-0:first-child { border-top-width: 0px; } .first\:pt-56:first-child { padding-top: 56px; } .last\:rounded-r-10:last-child { border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .last\:pb-0:last-child { padding-bottom: 0px; } .focus-within\:border-coreMidGreen:focus-within { --tw-border-opacity: 1; border-color: rgb(15 125 75 / var(--tw-border-opacity)); } .focus-within\:outline-none:focus-within { outline: 2px solid transparent; outline-offset: 2px; } .hover\:scale-110:hover { --tw-scale-x: 1.1; --tw-scale-y: 1.1; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .hover\:border-coreDataGreenHover:hover { --tw-border-opacity: 1; border-color: rgb(26 204 58 / var(--tw-border-opacity)); } .hover\:border-coreMidGreen:hover { --tw-border-opacity: 1; border-color: rgb(15 125 75 / var(--tw-border-opacity)); } .hover\:border-coreMidGreenHover:hover { --tw-border-opacity: 1; border-color: rgb(12 100 60 / var(--tw-border-opacity)); } .hover\:border-coreWhiteHover:hover { --tw-border-opacity: 1; border-color: rgb(206 229 220 / var(--tw-border-opacity)); } .hover\:bg-\[\#E8F0FF\]:hover { --tw-bg-opacity: 1; background-color: rgb(232 240 255 / var(--tw-bg-opacity)); } .hover\:bg-coreDataGreenHover:hover { --tw-bg-opacity: 1; background-color: rgb(26 204 58 / var(--tw-bg-opacity)); } .hover\:bg-coreLightGreen02:hover { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .hover\:bg-coreMidGreen:hover { --tw-bg-opacity: 1; background-color: rgb(15 125 75 / var(--tw-bg-opacity)); } .hover\:bg-coreMidGreenHover:hover { --tw-bg-opacity: 1; background-color: rgb(12 100 60 / var(--tw-bg-opacity)); } .hover\:bg-coreWhiteHover:hover { --tw-bg-opacity: 1; background-color: rgb(206 229 220 / var(--tw-bg-opacity)); } .hover\:bg-transparent:hover { background-color: transparent; } .hover\:bg-white:hover { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .hover\:text-blue-800:hover { --tw-text-opacity: 1; color: rgb(30 64 175 / var(--tw-text-opacity)); } .hover\:text-coreDarkGreen:hover { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .hover\:text-coreDataGreen:hover { --tw-text-opacity: 1; color: rgb(33 255 73 / var(--tw-text-opacity)); } .hover\:text-coreMidGreen:hover { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .hover\:text-coreWhite:hover { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .hover\:text-digitalActiveBlue:hover { --tw-text-opacity: 1; color: rgb(18 75 213 / var(--tw-text-opacity)); } .hover\:text-digitalActiveBlueHover:hover { --tw-text-opacity: 1; color: rgb(14 60 170 / var(--tw-text-opacity)); } .hover\:text-green-700:hover { --tw-text-opacity: 1; color: rgb(21 128 61 / var(--tw-text-opacity)); } .hover\:text-white:hover { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .hover\:underline:hover { text-decoration-line: underline; } .hover\:opacity-\[0\.8\]:hover { opacity: 0.8; } .hover\:shadow-lg:hover { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .focus\:rounded-\[30px\]:focus { border-radius: 30px; } .focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px; } .focus-visible\:rounded-\[30px\]:focus-visible { border-radius: 30px; } .focus-visible\:outline-digitalActiveBlue:focus-visible { outline-color: #124BD5; } .active\:rounded-\[30px\]:active { border-radius: 30px; } .group:last-child .group-last\:hidden { display: none; } .group:hover .group-hover\:scale-105 { --tw-scale-x: 1.05; --tw-scale-y: 1.05; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .group:hover .group-hover\:opacity-100 { opacity: 1; } .peer:checked ~ .peer-checked\:left-0 { left: 0px; } .peer:checked ~ .peer-checked\:block { display: block; } .peer:checked ~ .peer-checked\:max-h-\[1000px\] { max-height: 1000px; } .peer:checked ~ .peer-checked\:max-h-\[600px\] { max-height: 600px; } .peer:checked ~ .peer-checked\:rotate-180 { --tw-rotate: 180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer:focus-visible ~ .peer-focus-visible\:text-digitalActiveBlue { --tw-text-opacity: 1; color: rgb(18 75 213 / var(--tw-text-opacity)); } @media (min-width: 640px) { .sm\:absolute { position: absolute; } .sm\:order-last { order: 9999; } .sm\:col-span-12 { grid-column: span 12 / span 12; } .sm\:col-span-5 { grid-column: span 5 / span 5; } .sm\:col-span-6 { grid-column: span 6 / span 6; } .sm\:m-0 { margin: 0px; } .sm\:mb-0 { margin-bottom: 0px; } .sm\:ml-auto { margin-left: auto; } .sm\:mr-0 { margin-right: 0px; } .sm\:mt-0 { margin-top: 0px; } .sm\:block { display: block; } .sm\:flex { display: flex; } .sm\:grid { display: grid; } .sm\:hidden { display: none; } .sm\:h-\[150px\] { height: 150px; } .sm\:h-\[500px\] { height: 500px; } .sm\:w-\[40\%\] { width: 40%; } .sm\:w-\[50\%\] { width: 50%; } .sm\:w-\[600px\] { width: 600px; } .sm\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sm\:flex-row { flex-direction: row; } .sm\:items-center { align-items: center; } .sm\:justify-end { justify-content: flex-end; } .sm\:p-16 { padding: 16px; } .sm\:pt-0 { padding-top: 0px; } .sm\:pt-40 { padding-top: 40px; } .sm\:pt-56 { padding-top: 56px; } .sm\:font-labgLight { font-family: LabGrotesqueMintec-Light, sans-serif; } .sm\:text-\[16px\] { font-size: 16px; } .sm\:text-\[18px\] { font-size: 18px; } .sm\:text-\[32px\] { font-size: 32px; } .sm\:text-\[48px\] { font-size: 48px; } .sm\:font-bold { font-weight: 700; } .sm\:shadow-dropdown { --tw-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10); --tw-shadow-colored: 0px 4px 4px 0px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } } @media (min-width: 768px) { .md\:left-0 { left: 0px; } .md\:top-\[3rem\] { top: 3rem; } .md\:col-span-10 { grid-column: span 10 / span 10; } .md\:col-span-12 { grid-column: span 12 / span 12; } .md\:col-span-4 { grid-column: span 4 / span 4; } .md\:col-span-5 { grid-column: span 5 / span 5; } .md\:col-span-6 { grid-column: span 6 / span 6; } .md\:col-span-8 { grid-column: span 8 / span 8; } .md\:col-start-1 { grid-column-start: 1; } .md\:col-start-2 { grid-column-start: 2; } .md\:m-auto { margin: auto; } .md\:mt-0 { margin-top: 0px; } .md\:mt-12 { margin-top: 12px; } .md\:mt-36 { margin-top: 36px; } .md\:mt-40 { margin-top: 40px; } .md\:mt-56 { margin-top: 56px; } .md\:mt-64 { margin-top: 64px; } .md\:block { display: block; } .md\:flex { display: flex; } .md\:grid { display: grid; } .md\:hidden { display: none; } .md\:h-2 { height: 2px; } .md\:h-43 { height: 43px; } .md\:w-1\/2 { width: 50%; } .md\:w-3\/4 { width: 75%; } .md\:w-\[30\%\] { width: 30%; } .md\:w-\[363px\] { width: 363px; } .md\:w-\[750px\] { width: 750px; } .md\:w-\[760px\] { width: 760px; } .md\:w-\[calc\(100\%\+11px\)\] { width: calc(100% + 11px); } .md\:w-\[calc\(100\%-200px\)\] { width: calc(100% - 200px); } .md\:min-w-\[120px\] { min-width: 120px; } .md\:min-w-\[200px\] { min-width: 200px; } .md\:max-w-\[180px\] { max-width: 180px; } .md\:max-w-\[75\%\] { max-width: 75%; } .md\:flex-1 { flex: 1 1 0%; } .md\:basis-1\/3 { flex-basis: 33.333333%; } .md\:basis-2\/3 { flex-basis: 66.666667%; } .md\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .md\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } .md\:flex-row { flex-direction: row; } .md\:flex-col { flex-direction: column; } .md\:items-center { align-items: center; } .md\:justify-start { justify-content: flex-start; } .md\:justify-end { justify-content: flex-end; } .md\:justify-center { justify-content: center; } .md\:justify-between { justify-content: space-between; } .md\:gap-56 { gap: 56px; } .md\:gap-64 { gap: 64px; } .md\:gap-x { -moz-column-gap: 24px; column-gap: 24px; } .md\:gap-x-0 { -moz-column-gap: 0px; column-gap: 0px; } .md\:gap-x-20 { -moz-column-gap: 20px; column-gap: 20px; } .md\:gap-x-32 { -moz-column-gap: 32px; column-gap: 32px; } .md\:gap-x-40 { -moz-column-gap: 40px; column-gap: 40px; } .md\:gap-x-48 { -moz-column-gap: 48px; column-gap: 48px; } .md\:gap-y-24 { row-gap: 24px; } .md\:gap-y-64 { row-gap: 64px; } .md\:gap-y-\[56px\] { row-gap: 56px; } .md\:rounded-10 { border-radius: 10px; } .md\:rounded-24 { border-radius: 24px; } .md\:p-32 { padding: 32px; } .md\:px-20 { padding-left: 20px; padding-right: 20px; } .md\:px-32 { padding-left: 32px; padding-right: 32px; } .md\:py-0 { padding-top: 0px; padding-bottom: 0px; } .md\:py-12 { padding-top: 12px; padding-bottom: 12px; } .md\:py-24 { padding-top: 24px; padding-bottom: 24px; } .md\:pb-0 { padding-bottom: 0px; } .md\:pb-10 { padding-bottom: 10px; } .md\:pb-20 { padding-bottom: 20px; } .md\:pb-24 { padding-bottom: 24px; } .md\:pb-48 { padding-bottom: 48px; } .md\:pb-64 { padding-bottom: 64px; } .md\:pb-80 { padding-bottom: 80px; } .md\:pb-96 { padding-bottom: 96px; } .md\:pl-0 { padding-left: 0px; } .md\:pr-0 { padding-right: 0px; } .md\:pr-100 { padding-right: 100px; } .md\:pr-32 { padding-right: 32px; } .md\:pt-10 { padding-top: 10px; } .md\:pt-12 { padding-top: 12px; } .md\:pt-16 { padding-top: 16px; } .md\:pt-20 { padding-top: 20px; } .md\:pt-24 { padding-top: 24px; } .md\:pt-32 { padding-top: 32px; } .md\:pt-43 { padding-top: 43px; } .md\:pt-48 { padding-top: 48px; } .md\:pt-64 { padding-top: 64px; } .md\:pt-80 { padding-top: 80px; } .md\:pt-96 { padding-top: 96px; } .md\:text-center { text-align: center; } .md\:text-right { text-align: right; } .md\:text-2xl { font-size: 34px; } .md\:text-3xl { font-size: 48px; } .md\:text-\[34px\] { font-size: 34px; } .md\:text-\[36px\] { font-size: 36px; } .md\:text-\[38px\] { font-size: 38px; } .md\:text-base { font-size: 16px; } .md\:text-lg { font-size: 21px; } .md\:text-md { font-size: 18px; } .md\:text-xl { font-size: 24px; } .md\:leading-10 { line-height: 2.5rem; } .md\:leading-7 { line-height: 1.75rem; } .md\:leading-none { line-height: 1; } .md\:\*\:h-auto > * { height: auto; } .md\:\*\:flex-1 > * { flex: 1 1 0%; } .md\:\*\:rounded-12 > * { border-radius: 12px; } .last\:md\:hidden:last-child { display: none; } } @media (min-width: 1024px) { .lg\:absolute { position: absolute; } .lg\:relative { position: relative; } .lg\:-top-2 { top: -2px; } .lg\:left-1\/2 { left: 50%; } .lg\:left-auto { left: auto; } .lg\:right-\[8rem\] { right: 8rem; } .lg\:top-\[3\.5rem\] { top: 3.5rem; } .lg\:top-auto { top: auto; } .lg\:col-span-1 { grid-column: span 1 / span 1; } .lg\:col-span-10 { grid-column: span 10 / span 10; } .lg\:col-span-3 { grid-column: span 3 / span 3; } .lg\:col-span-4 { grid-column: span 4 / span 4; } .lg\:col-span-5 { grid-column: span 5 / span 5; } .lg\:col-span-6 { grid-column: span 6 / span 6; } .lg\:col-span-7 { grid-column: span 7 / span 7; } .lg\:col-span-8 { grid-column: span 8 / span 8; } .lg\:col-start-2 { grid-column-start: 2; } .lg\:col-start-3 { grid-column-start: 3; } .lg\:col-start-7 { grid-column-start: 7; } .lg\:col-start-8 { grid-column-start: 8; } .lg\:col-start-9 { grid-column-start: 9; } .lg\:col-end-12 { grid-column-end: 12; } .lg\:mx-\[150px\] { margin-left: 150px; margin-right: 150px; } .lg\:mb-0 { margin-bottom: 0px; } .lg\:mt-0 { margin-top: 0px; } .lg\:mt-56 { margin-top: 56px; } .lg\:mt-80 { margin-top: 80px; } .lg\:mt-auto { margin-top: auto; } .lg\:block { display: block; } .lg\:flex { display: flex; } .lg\:grid { display: grid; } .lg\:hidden { display: none; } .lg\:aspect-\[4\/3\] { aspect-ratio: 4/3; } .lg\:h-37 { height: 37px; } .lg\:h-\[637px\] { height: 637px; } .lg\:h-auto { height: auto; } .lg\:min-h-0 { min-height: 0px; } .lg\:w-3\/4 { width: 75%; } .lg\:w-\[205px\] { width: 205px; } .lg\:w-\[296px\] { width: 296px; } .lg\:w-\[406px\] { width: 406px; } .lg\:w-\[839px\] { width: 839px; } .lg\:w-\[90\%\] { width: 90%; } .lg\:w-auto { width: auto; } .lg\:min-w-0 { min-width: 0px; } .lg\:min-w-\[330px\] { min-width: 330px; } .lg\:min-w-\[690px\] { min-width: 690px; } .lg\:flex-1 { flex: 1 1 0%; } .lg\:translate-x-\[-8px\] { --tw-translate-x: -8px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .lg\:transform { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } @keyframes fade-in { 0% { opacity: 0; transform: translateY(-20px) translateX(-50%); } 100% { opacity: 1; transform: translateY(0) translateX(-50%); } } .lg\:animate-fade-in { animation: fade-in 0.3s linear; } .lg\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .lg\:flex-row { flex-direction: row; } .lg\:flex-nowrap { flex-wrap: nowrap; } .lg\:items-center { align-items: center; } .lg\:justify-start { justify-content: flex-start; } .lg\:justify-center { justify-content: center; } .lg\:justify-stretch { justify-content: stretch; } .lg\:gap-12 { gap: 12px; } .lg\:gap-16 { gap: 16px; } .lg\:gap-48 { gap: 48px; } .lg\:gap-\[40px\] { gap: 40px; } .lg\:gap-\[76px\] { gap: 76px; } .lg\:gap-x-20 { -moz-column-gap: 20px; column-gap: 20px; } .lg\:gap-x-40 { -moz-column-gap: 40px; column-gap: 40px; } .lg\:gap-x-64 { -moz-column-gap: 64px; column-gap: 64px; } .lg\:gap-y-0 { row-gap: 0px; } .lg\:gap-y-64 { row-gap: 64px; } .lg\:overflow-hidden { overflow: hidden; } .lg\:overflow-y-hidden { overflow-y: hidden; } .lg\:overflow-x-visible { overflow-x: visible; } .lg\:rounded-12 { border-radius: 12px; } .lg\:rounded-\[11\.5px\] { border-radius: 11.5px; } .lg\:bg-coreDarkGreen { --tw-bg-opacity: 1; background-color: rgb(0 33 21 / var(--tw-bg-opacity)); } .lg\:bg-coreLightGreen02 { --tw-bg-opacity: 1; background-color: rgb(233 243 234 / var(--tw-bg-opacity)); } .lg\:bg-digitalLightGrey02 { --tw-bg-opacity: 1; background-color: rgb(245 247 249 / var(--tw-bg-opacity)); } .lg\:bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .lg\:p-0 { padding: 0px; } .lg\:p-32 { padding: 32px; } .lg\:p-48 { padding: 48px; } .lg\:px { padding-left: 24px; padding-right: 24px; } .lg\:px-12 { padding-left: 12px; padding-right: 12px; } .lg\:px-15 { padding-left: 15px; padding-right: 15px; } .lg\:px-52 { padding-left: 52px; padding-right: 52px; } .lg\:px-8 { padding-left: 8px; padding-right: 8px; } .lg\:px-80 { padding-left: 80px; padding-right: 80px; } .lg\:px-\[27px\] { padding-left: 27px; padding-right: 27px; } .lg\:py-8 { padding-top: 8px; padding-bottom: 8px; } .lg\:py-\[35px\] { padding-top: 35px; padding-bottom: 35px; } .lg\:pb-0 { padding-bottom: 0px; } .lg\:pl-0 { padding-left: 0px; } .lg\:pl-15 { padding-left: 15px; } .lg\:pl-\[22px\] { padding-left: 22px; } .lg\:pr-\[111px\] { padding-right: 111px; } .lg\:pt-0 { padding-top: 0px; } .lg\:pt-24 { padding-top: 24px; } .lg\:pt-30 { padding-top: 30px; } .lg\:pt-40 { padding-top: 40px; } .lg\:pt-53 { padding-top: 53px; } .lg\:pt-56 { padding-top: 56px; } .lg\:pt-64 { padding-top: 64px; } .lg\:font-labgMed { font-family: LabGrotesqueMintec-Medium, sans-serif; } .lg\:text-\[48px\] { font-size: 48px; } .lg\:text-\[\#002115\] { --tw-text-opacity: 1; color: rgb(0 33 21 / var(--tw-text-opacity)); } .lg\:text-coreMidGreen { --tw-text-opacity: 1; color: rgb(15 125 75 / var(--tw-text-opacity)); } .lg\:shadow-cardHover { --tw-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.14); --tw-shadow-colored: 0px 8px 16px 0px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .lg\:shadow-none { --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .lg\:hover\:rounded-0:hover { border-radius: 0px; } .peer:checked ~ .lg\:peer-checked\:left-1\/2 { left: 50%; } .peer:checked ~ .lg\:peer-checked\:left-\[16\%\] { left: 16%; } .peer:checked ~ .lg\:peer-checked\:top-\[calc\(100\%\+13px\)\] { top: calc(100% + 13px); } .peer:checked ~ .lg\:peer-checked\:flex { display: flex; } .peer:checked ~ .lg\:peer-checked\:hidden { display: none; } .peer:checked ~ .lg\:peer-checked\:-translate-x-0 { --tw-translate-x: -0px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer:checked ~ .lg\:peer-checked\:-translate-x-1\/2 { --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer:checked ~ .lg\:peer-checked\:gap-16 { gap: 16px; } } @media (min-width: 1280px) { .xl\:fixed { position: fixed; } .xl\:left-1\/2 { left: 50%; } .xl\:order-1 { order: 1; } .xl\:order-2 { order: 2; } .xl\:col-span-10 { grid-column: span 10 / span 10; } .xl\:col-span-12 { grid-column: span 12 / span 12; } .xl\:col-span-2 { grid-column: span 2 / span 2; } .xl\:col-span-4 { grid-column: span 4 / span 4; } .xl\:col-span-5 { grid-column: span 5 / span 5; } .xl\:col-span-6 { grid-column: span 6 / span 6; } .xl\:col-span-7 { grid-column: span 7 / span 7; } .xl\:col-span-8 { grid-column: span 8 / span 8; } .xl\:col-start-10 { grid-column-start: 10; } .xl\:col-start-7 { grid-column-start: 7; } .xl\:col-start-8 { grid-column-start: 8; } .xl\:col-end-13 { grid-column-end: 13; } .xl\:mx-auto { margin-left: auto; margin-right: auto; } .xl\:mb { margin-bottom: 24px; } .xl\:mb-0 { margin-bottom: 0px; } .xl\:ml-0 { margin-left: 0px; } .xl\:ml-auto { margin-left: auto; } .xl\:mt-0 { margin-top: 0px; } .xl\:mt-128 { margin-top: 128px; } .xl\:block { display: block; } .xl\:flex { display: flex; } .xl\:grid { display: grid; } .xl\:hidden { display: none; } .xl\:h-15 { height: 15px; } .xl\:h-30 { height: 30px; } .xl\:h-60 { height: 60px; } .xl\:w-1\/2 { width: 50%; } .xl\:w-\[200px\] { width: 200px; } .xl\:w-\[60\%\] { width: 60%; } .xl\:w-\[72\%\] { width: 72%; } .xl\:w-\[80\%\] { width: 80%; } .xl\:w-\[calc\(100\%-320px\)\] { width: calc(100% - 320px); } .xl\:w-full { width: 100%; } .xl\:max-w-2\/3 { max-width: 66.666667%; } .xl\:max-w-\[680px\] { max-width: 680px; } .xl\:flex-1 { flex: 1 1 0%; } .xl\:cursor-default { cursor: default; } .xl\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .xl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .xl\:flex-row { flex-direction: row; } .xl\:items-start { align-items: flex-start; } .xl\:items-center { align-items: center; } .xl\:justify-start { justify-content: flex-start; } .xl\:justify-center { justify-content: center; } .xl\:justify-between { justify-content: space-between; } .xl\:gap-12 { gap: 12px; } .xl\:gap-48 { gap: 48px; } .xl\:gap-60 { gap: 60px; } .xl\:gap-x { -moz-column-gap: 24px; column-gap: 24px; } .xl\:gap-x-20 { -moz-column-gap: 20px; column-gap: 20px; } .xl\:gap-x-40 { -moz-column-gap: 40px; column-gap: 40px; } .xl\:gap-x-64 { -moz-column-gap: 64px; column-gap: 64px; } .xl\:gap-x-88 { -moz-column-gap: 88px; column-gap: 88px; } .xl\:gap-y-0 { row-gap: 0px; } .xl\:rounded-12 { border-radius: 12px; } .xl\:p-48 { padding: 48px; } .xl\:p-\[69px\] { padding: 69px; } .xl\:px-20 { padding-left: 20px; padding-right: 20px; } .xl\:px-48 { padding-left: 48px; padding-right: 48px; } .xl\:pb-10 { padding-bottom: 10px; } .xl\:pb-120 { padding-bottom: 120px; } .xl\:pb-24 { padding-bottom: 24px; } .xl\:pb-48 { padding-bottom: 48px; } .xl\:pb-56 { padding-bottom: 56px; } .xl\:pb-64 { padding-bottom: 64px; } .xl\:pb-80 { padding-bottom: 80px; } .xl\:pb-96 { padding-bottom: 96px; } .xl\:pl-0 { padding-left: 0px; } .xl\:pr { padding-right: 24px; } .xl\:pr-32 { padding-right: 32px; } .xl\:pr-56 { padding-right: 56px; } .xl\:pr-\[111px\] { padding-right: 111px; } .xl\:pt-0 { padding-top: 0px; } .xl\:pt-10 { padding-top: 10px; } .xl\:pt-120 { padding-top: 120px; } .xl\:pt-24 { padding-top: 24px; } .xl\:pt-30 { padding-top: 30px; } .xl\:pt-56 { padding-top: 56px; } .xl\:pt-64 { padding-top: 64px; } .xl\:pt-80 { padding-top: 80px; } .xl\:pt-84 { padding-top: 84px; } .xl\:pt-96 { padding-top: 96px; } .xl\:pt-\[56px\] { padding-top: 56px; } .xl\:text-2xl { font-size: 34px; } .xl\:text-3xl { font-size: 48px; } .xl\:text-4xl { font-size: 68px; } .xl\:text-\[34px\] { font-size: 34px; } .xl\:text-base { font-size: 16px; } .xl\:text-lg { font-size: 21px; } .xl\:text-xl { font-size: 24px; } .xl\:leading-10 { line-height: 2.5rem; } .xl\:leading-\[105\%\] { line-height: 105%; } .xl\:leading-\[110\%\] { line-height: 110%; } .xl\:leading-\[115\%\] { line-height: 115%; } .xl\:leading-\[120\%\] { line-height: 120%; } .xl\:leading-\[125\%\] { line-height: 125%; } .xl\:leading-\[130\%\] { line-height: 130%; } .xl\:leading-\[150\%\] { line-height: 150%; } } @media (min-width: 1536px) { .\32xl\:gap-x-88 { -moz-column-gap: 88px; column-gap: 88px; } } @media (max-width: 639px) { .show-small\:block { display: block; } } @media (min-width: 640px) and (max-width: 1023px) { .show-medium\:block { display: block; } } @media (min-width: 1024px) { .show-large\:block { display: block; } } .peer\/search:checked ~ .peer-checked\/search\:\[\&_span\:nth-child\(1\)\]\:translate-y-6 span:nth-child(1) { --tw-translate-y: 6px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer:checked ~ .peer-checked\:\[\&_span\:nth-child\(1\)\]\:translate-y-6 span:nth-child(1) { --tw-translate-y: 6px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer\/search:checked ~ .peer-checked\/search\:\[\&_span\:nth-child\(1\)\]\:rotate-45 span:nth-child(1) { --tw-rotate: 45deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer:checked ~ .peer-checked\:\[\&_span\:nth-child\(1\)\]\:rotate-45 span:nth-child(1) { --tw-rotate: 45deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer\/search:checked ~ .peer-checked\/search\:\[\&_span\:nth-child\(2\)\]\:opacity-0 span:nth-child(2) { opacity: 0; } .peer:checked ~ .peer-checked\:\[\&_span\:nth-child\(2\)\]\:opacity-0 span:nth-child(2) { opacity: 0; } .peer\/search:checked ~ .peer-checked\/search\:\[\&_span\:nth-child\(3\)\]\:-translate-y-8 span:nth-child(3) { --tw-translate-y: -8px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer:checked ~ .peer-checked\:\[\&_span\:nth-child\(3\)\]\:-translate-y-8 span:nth-child(3) { --tw-translate-y: -8px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer\/search:checked ~ .peer-checked\/search\:\[\&_span\:nth-child\(3\)\]\:-rotate-45 span:nth-child(3) { --tw-rotate: -45deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .peer:checked ~ .peer-checked\:\[\&_span\:nth-child\(3\)\]\:-rotate-45 span:nth-child(3) { --tw-rotate: -45deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } @media (min-width: 1024px) { .peer:checked ~ .lg\:peer-checked\:\[\&_svg\]\:-rotate-180 svg { --tw-rotate: -180deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } } .logged-in .\[\.logged-in_\&\]\:top-102 { top: 102px; } @media (min-width: 768px) { .logged-in .md\:\[\.logged-in_\&\]\:top-88 { top: 88px; } } .menu-call-out .\[\.menu-call-out_\&\]\:justify-start { justify-content: flex-start; } .menu-call-out .\[\.menu-call-out_\&\]\:text-black { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); } .primary-sub-menu-link .\[\.primary-sub-menu-link_\&\]\:inline-flex { display: inline-flex; } .primary-sub-menu-link .\[\.primary-sub-menu-link_\&\]\:justify-start { justify-content: flex-start; } .primary-sub-menu-link .\[\.primary-sub-menu-link_\&\]\:text-black { --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); }