diff --git a/.gitignore b/.gitignore index 60c58b5c..a7260a6d 100644 --- a/.gitignore +++ b/.gitignore @@ -68,7 +68,18 @@ storybook_compiled # copied assets when preparing builds apps/**/.storybook/static/dist packages/**/src/assets/fonts +apps/**/public/explorer-1/ +apps/**/public/edu/explorer-1/ +packages/**/public/explorer-1/ +packages/**/public/edu/explorer-1/ +!public/explorer-1/**/.gitkeep +!packages/common/src/public/explorer-1 +apps/vue-storybook/public/fonts +apps/vue-storybook/public/css # dist dist -!packages/**/dist \ No newline at end of file +!packages/**/dist + + +!.gitkeep \ No newline at end of file diff --git a/apps/html-storybook/.storybook/preview.ts b/apps/html-storybook/.storybook/preview.ts index df894f66..ffba48ac 100644 --- a/apps/html-storybook/.storybook/preview.ts +++ b/apps/html-storybook/.storybook/preview.ts @@ -4,7 +4,7 @@ import '@explorer-1/html/src/assets/scss/styles.scss' import './../public/dist/css/font-face.css' import '@explorer-1/html/src/main.js' import '@explorer-1/common-storybook/src/config/canvas.css' -import { withGlobals } from '@explorer-1/common-storybook/src/config/withGlobals' +import { withGlobals } from './withGlobals' // viewports that match our tailwind config const customViewports = { diff --git a/packages/common-storybook/src/config/withGlobals.ts b/apps/html-storybook/.storybook/withGlobals.ts similarity index 100% rename from packages/common-storybook/src/config/withGlobals.ts rename to apps/html-storybook/.storybook/withGlobals.ts diff --git a/apps/html-storybook/package.json b/apps/html-storybook/package.json index 23bdd83c..2b912e35 100644 --- a/apps/html-storybook/package.json +++ b/apps/html-storybook/package.json @@ -14,9 +14,9 @@ "prettier": "@explorer-1/prettier-config", "scripts": { "dev": "pnpm run storybook", - "prepare": "npm run prepare:clean && npm run prepare:public", + "prepare": "npm run prepare:clean && npm run prepare:assets", "prepare:clean": "rimraf ./public/dist", - "prepare:public": "cp -R ./node_modules/@explorer-1/html/dist/assets/ ./public/dist", + "prepare:assets": "cp -R ./node_modules/@explorer-1/html/dist/assets/ ./public/dist", "storybook": "pnpm run prepare && storybook dev -c .storybook -p 7007 --ci", "lint": "eslint .storybook", "lint:fix": "eslint .storybook --fix", diff --git a/apps/vue-storybook/.storybook/main.ts b/apps/vue-storybook/.storybook/main.ts index 6f471d89..a2d17dec 100644 --- a/apps/vue-storybook/.storybook/main.ts +++ b/apps/vue-storybook/.storybook/main.ts @@ -1,6 +1,12 @@ /** @type { import('@storybook/vue3-vite').StorybookConfig } */ +import remarkGfm from 'remark-gfm' const config = { - stories: ['./../stories/**/*.stories.@(js|jsx|ts|tsx)'], + stories: [ + './../stories/**/*.stories.@(js|jsx|ts|tsx)', + './../stories/**/*.docs.mdx', + './../docs/**/*.stories.@(js|jsx|ts|tsx)', + './../docs/**/*.docs.mdx' + ], addons: [ { name: '@storybook/addon-essentials', @@ -10,11 +16,25 @@ const config = { outlines: false } }, + { + name: '@storybook/addon-docs', + options: { + mdxPluginOptions: { + mdxCompileOptions: { + remarkPlugins: [remarkGfm] + } + } + } + }, '@storybook/addon-a11y', '@whitespace/storybook-addon-html', 'storybook-addon-vue-slots' ], - + staticDirs: [ + './../public', + './../node_modules/@explorer-1/common-storybook/src/public', + './../node_modules/@explorer-1/common/src' + ], framework: { name: '@storybook/vue3-vite', options: {} diff --git a/apps/vue-storybook/.storybook/manager-head.html b/apps/vue-storybook/.storybook/manager-head.html new file mode 100644 index 00000000..db1aee5f --- /dev/null +++ b/apps/vue-storybook/.storybook/manager-head.html @@ -0,0 +1,40 @@ + diff --git a/apps/vue-storybook/.storybook/manager.ts b/apps/vue-storybook/.storybook/manager.ts new file mode 100644 index 00000000..78934cb9 --- /dev/null +++ b/apps/vue-storybook/.storybook/manager.ts @@ -0,0 +1,11 @@ +// customizing Storybook's manager UI +// see config options: https://storybook.js.org/docs/vue/configure/features-and-behavior + +import { addons } from '@storybook/manager-api' +import customTheme from '@explorer-1/common-storybook/src/config/customTheme' + +// to collapse all sections and use custom theme +addons.setConfig({ + theme: customTheme, + sidebar: { showRoots: false } +}) diff --git a/apps/vue-storybook/.storybook/preview-head.html b/apps/vue-storybook/.storybook/preview-head.html new file mode 100644 index 00000000..c6c62421 --- /dev/null +++ b/apps/vue-storybook/.storybook/preview-head.html @@ -0,0 +1,146 @@ + diff --git a/apps/vue-storybook/.storybook/preview.ts b/apps/vue-storybook/.storybook/preview.ts index 152b5059..e64268cc 100644 --- a/apps/vue-storybook/.storybook/preview.ts +++ b/apps/vue-storybook/.storybook/preview.ts @@ -1,5 +1,6 @@ /** @type { import('@storybook/vue3').Preview } */ import type { App } from 'vue' +import { MINIMAL_VIEWPORTS } from '@storybook/addon-viewport' import useMockComponents from './_mock-components.js' import { StoryContext } from '@storybook/types' import { VueRenderer, setup, type Preview } from '@storybook/vue3' @@ -10,7 +11,9 @@ import { createPinia } from 'pinia' import filters from '@explorer-1/vue/src/utils/filters' import '@explorer-1/common-storybook/src/config/canvas.css' import '@explorer-1/vue/src/assets/scss/styles.scss' -import { withGlobals, globalTypes } from '@explorer-1/common-storybook/src/config/withGlobals' +import { withGlobals, globalTypes } from './withGlobals' +import customTheme from '@explorer-1/common-storybook/src/config/customTheme' +import '@explorer-1/common-storybook/src/config/canvas.css' const pinia = createPinia() @@ -24,6 +27,52 @@ setup((app: App, context?: StoryContext) => { useMockComponents(app) }) +// viewports that match our tailwind config +const customViewports = { + screenSm: { + name: 'screen-sm', + styles: { + width: '640px', + height: '100%' + } + }, + screenMd: { + name: 'screen-md', + styles: { + width: '768px', + height: '100%' + } + }, + screenLg: { + name: 'screen-lg', + styles: { + width: '1024px', + height: '100%' + } + }, + screenXl: { + name: 'screen-xl', + styles: { + width: '1280px', + height: '100%' + } + }, + screen2xl: { + name: 'screen-2xl', + styles: { + width: '1440px', + height: '100%' + } + }, + screen3xl: { + name: 'screen-3xl', + styles: { + width: '1800px', + height: '100%' + } + } +} + const preview: Preview = { globalTypes, @@ -34,6 +83,76 @@ const preview: Preview = { color: /(background|color)$/i, date: /Date$/ } + }, + viewport: { + viewports: { + ...MINIMAL_VIEWPORTS, + ...customViewports + } + }, + // options for the html tab add-on + html: { + removeEmptyComments: true + }, + // set the theme for docs (same as UI) + docs: { + theme: customTheme + }, + options: { + storySort: { + method: 'alphabetical', + order: [ + 'Introduction', + 'Roadmap', + 'Getting Started', + ['Developer'], + 'Guides', + 'Foundation', + [ + 'Colors', + 'Typography', + 'Icons', + 'Logos', + 'Themes', + 'Grid and Layout', + 'Responsive Design' + ], + 'Global Layout', + [ + 'Overview', + 'Headers', + [ + 'Overview', + 'External', + 'For Internal Sites', + [ + '*', + 'Elements', + ['Overview', 'AppBar', 'Navigation', 'Panel', 'Highlight', 'Section'] + ] + ], + 'Footers', + ['Overview', 'External', 'Internal'] + ], + 'Components', + [ + 'Overview', + 'Base', + ['Overview'], + 'Blocks', + ['Overview', 'Heroes', ['Overview', 'Small', 'Medium', 'Large']], + 'Heroes', + 'Forms', + ['Overview', 'TextInput', 'TextArea'], + 'Search', + ['Overview'], + 'Mixins', + ['Overview', 'MixinAnimationCaret', 'MixinVideoBg', 'MixinCarousel'], + 'Utilities', + ['Overview', '*'] + ] + ] + } } }, diff --git a/apps/vue-storybook/.storybook/withGlobals.ts b/apps/vue-storybook/.storybook/withGlobals.ts new file mode 100644 index 00000000..31bba40c --- /dev/null +++ b/apps/vue-storybook/.storybook/withGlobals.ts @@ -0,0 +1,177 @@ +import { useEffect, useGlobals } from '@storybook/preview-api' +import { useThemeStore } from '@explorer-1/vue/src/store/theme' +import { type Explorer1Theme } from '@explorer-1/vue/src/interfaces' + +const getConfig = (config) => { + // default values + let defaultMethod: string = 'css' + let options: string[] | undefined = undefined + let method: string | undefined = undefined + + if (typeof config === 'object') { + // get options + if ('options' in config) { + options = config.options + } + // handle method + if ('method' in config) { + // case insensitive comparisons + if (config.method.toUpperCase() === 'css'.toUpperCase()) { + method = 'css' + } else if (config.method) { + method = 'data-attr' + } else { + // use "css" method if not specified + method = defaultMethod + } + } else { + method = defaultMethod + } + } + + // otherwise undefined + else { + options = undefined + method = undefined + } + + return { options, method } +} + +export const withGlobals = (StoryFn, context) => { + const useTheme = useThemeStore() + const { themesConfig, variantsConfig } = context.globals + const { options, method } = getConfig(themesConfig) + const { options: variantOptions, method: variantMethod } = getConfig(variantsConfig) + const [{ theme, variant }, updateGlobals] = useGlobals() + const isInDocs = context.viewMode === 'docs' + + // disable usage of updateGlobals in docs + if (!isInDocs) { + // check for value in local storage + useEffect(() => { + const savedTheme: Explorer1Theme = window.localStorage.getItem('data-theme') as Explorer1Theme + const savedVariant: Explorer1Theme = window.localStorage.getItem( + 'data-variant' + ) as Explorer1Theme + + // handle theme + if (savedTheme) { + // update theme attribute and save it to local storage + updateGlobals({ theme: savedTheme }) + useTheme.setTheme(savedTheme) + } else { + // set it to the first theme + if (options && options.length > 0) { + updateGlobals({ theme: options[0] }) + useTheme.setTheme(options[0] as Explorer1Theme) + } + } + + // handle variant + if (savedVariant) { + // update theme attribute and save it to local storage + updateGlobals({ variant: savedVariant }) + } else { + // set it to the first theme + if (variantOptions && variantOptions.length > 0) { + updateGlobals({ variant: variantOptions[0] }) + } + } + }, []) + } + + // handle theme method + if (method === 'css') { + const savedTheme = window.localStorage.getItem('data-theme') + useEffect(() => { + if (theme) { + document.documentElement.classList.remove(savedTheme) + document.documentElement.classList.add(theme) + useTheme.setTheme(theme) + window.localStorage.setItem('data-theme', theme) + } + }, [theme]) + } else if (method === 'data-attr') { + useEffect(() => { + if (theme) { + useTheme.setTheme(theme) + document.documentElement.setAttribute('data-theme', theme) + window.localStorage.setItem('data-theme', theme) + } + }, [theme]) + } + + // handle variant method + if (variantMethod === 'css') { + useEffect(() => { + if (variant) { + const savedVariant = window.localStorage.getItem('data-variant') + document.body.classList.remove(savedVariant) + document.body.classList.add(variant) + window.localStorage.setItem('data-variant', variant) + } + }, [variant]) + } else if (variantMethod === 'data-attr') { + useEffect(() => { + if (variant) { + document.body.setAttribute('data-variant', variant) + window.localStorage.setItem('data-variant', variant) + } + }, [variant]) + } + + return StoryFn() +} + +export const globalTypes = { + themesConfig: { + defaultValue: { + themes: ['Default', 'EDU', 'Internal'], + method: 'css' + } + }, + variantsConfig: { + defaultValue: { + variants: ['ThemeVariantLight', 'ThemeVariantDark'], + method: 'css' + } + }, + theme: { + description: 'Global Theme', + defaultValue: 'defaultTheme', + toolbar: { + title: 'Theme', + // https://storybook.js.org/docs/faq#what-icons-are-available-for-my-toolbar-or-my-addon + icon: 'eye', + items: [ + { + value: 'defaultTheme', + icon: 'home', + title: 'Default Theme' + }, + { value: 'ThemeEdu', icon: 'globe', title: 'EDU Theme' }, + { value: 'ThemeInternal', icon: 'key', title: 'Internal Theme' } + ], + dynamicTitle: true + } + }, + variant: { + description: 'Theme Variant', + defaultValue: 'ThemeVariantLight', + toolbar: { + title: 'Variant', + // https://storybook.js.org/docs/faq#what-icons-are-available-for-my-toolbar-or-my-addon + icon: 'eye', + items: [ + { + value: 'ThemeVariantLight', + icon: 'circlehollow', + title: 'Light Variant' + }, + { value: 'ThemeVariantDark', icon: 'circle', title: 'Dark Variant' } + ], + dynamicTitle: true + } + } +} diff --git a/apps/vue-storybook/components.d.ts b/apps/vue-storybook/components.d.ts index b12783d5..072627ea 100644 --- a/apps/vue-storybook/components.d.ts +++ b/apps/vue-storybook/components.d.ts @@ -176,11 +176,11 @@ declare module 'vue' { PageContent: typeof import('./node_modules/@explorer-1/vue/src/templates/PageContent.vue')['default'] PageCuratedGallery: typeof import('./node_modules/@explorer-1/vue/src/templates/PageCuratedGallery/PageCuratedGallery.vue')['default'] PageError: typeof import('./node_modules/@explorer-1/vue/src/templates/PageError/PageError.vue')['default'] - PageEventDetail: typeof import('./node_modules/@explorer-1/vue/src/templates/PageEventDetail/PageEventDetail.vue')['default'] + PageEventDetail: typeof import('./node_modules/@explorer-1/vue/src/templates/PageEventDetail.vue')['default'] PageGoDirectory: typeof import('./node_modules/@explorer-1/vue/src/templates/PageGoDirectory/PageGoDirectory.vue')['default'] PageImageDetail: typeof import('./node_modules/@explorer-1/vue/src/templates/PageImageDetail/PageImageDetail.vue')['default'] PageInfographicDetail: typeof import('./node_modules/@explorer-1/vue/src/templates/PageInfographicDetail/PageInfographicDetail.vue')['default'] - PageListingIndex: typeof import('./node_modules/@explorer-1/vue/src/templates/PageListingIndex/PageListingIndex.vue')['default'] + PageListingIndex: typeof import('./node_modules/@explorer-1/vue/src/templates/PageListingIndex.vue')['default'] PageMaintenanceMode: typeof import('./node_modules/@explorer-1/vue/src/templates/PageMaintenanceMode/PageMaintenanceMode.vue')['default'] PageMissionDetail: typeof import('./node_modules/@explorer-1/vue/src/templates/PageMissionDetail/PageMissionDetail.vue')['default'] PageNewsDetail: typeof import('./node_modules/@explorer-1/vue/src/templates/PageNewsDetail/PageNewsDetail.vue')['default'] diff --git a/apps/vue-storybook/docs/foundation/DynamicTokens.vue b/apps/vue-storybook/docs/foundation/DynamicTokens.vue new file mode 100644 index 00000000..c33f665d --- /dev/null +++ b/apps/vue-storybook/docs/foundation/DynamicTokens.vue @@ -0,0 +1,105 @@ + + \ No newline at end of file diff --git a/apps/vue-storybook/docs/foundation/FontVariants.vue b/apps/vue-storybook/docs/foundation/FontVariants.vue new file mode 100644 index 00000000..4e3b34d3 --- /dev/null +++ b/apps/vue-storybook/docs/foundation/FontVariants.vue @@ -0,0 +1,88 @@ + diff --git a/apps/vue-storybook/docs/foundation/color.docs.mdx b/apps/vue-storybook/docs/foundation/color.docs.mdx new file mode 100644 index 00000000..7ca15c11 --- /dev/null +++ b/apps/vue-storybook/docs/foundation/color.docs.mdx @@ -0,0 +1,112 @@ +import { Meta, Story, Canvas } from '@storybook/blocks' + + + +# Colors + +- [Brand Colors](#brand-colors) +- [Functional Gray Tones](#functional-gray-tones) +- [Semantic Colors](#semantic-colors) +- [Tokens](#tokens) + + + +## Brand Colors + +Each of these foundation colors has specific usage scenarios. + +| Color | Name | Token | +| :---------------------------------------- | :------------- | :--------------- | +|
| JPL Red Light | `jpl-red-light` | +|
| JPL Red | `jpl-red` | +|
| JPL Red Dark | `jpl-red-dark` | +|
| JPL Red Darker | `jpl-red-darker` | +|
| JPL Aqua | `aqua` | +|
| Blue | `blue` | +|
| Dark Blue | `dark-blue` | +|
| Green | `green` | + +### Reserved for Internal Use + +These colors should not be used on public-facing JPL websites. + +| Color | Name | Token | +| :--------------------------------------------- | :------------------ | :-------------------- | +|
| JPL Sky Blue Light | `jpl-sky-blue-light` | +|
| JPL Sky Blue | `jpl-sky-blue` | +|
| JPL Sky Blue Dark | `jpl-sky-blue-dark` | +|
| JPL Sky Blue Darker | `jpl-sky-blue-darker` | + +### Reserved for EDU Use + +These colors should not be used on public-facing JPL websites. + +| Color | Name | Token | +| :------------------------------------------- | :---------------- | :------------------ | +|
| JPL Purple Light | `jpl-purple-light` | +|
| JPL Purple | `jpl-purple` | +|
| JPL Purple Dark | `jpl-purple-dark` | +|
| JPL Purple Darker | `jpl-purple-darker` | +|
| JPL Teal Light | `jpl-teal-light` | +|
| JPL Teal | `jpl-teal` | +|
| JPL Teal Dark | `jpl-teal-dark` | +|
| JPL Teal Darker | `jpl-teal-darker` | + + + +## Functional Gray Tones + +Grayscale colors are used throughout the site for text and layout. + +| Color | Name | Token | Value | +| :---------------------------------------- | :------------- | :--------------- | :-------- | +|
| White | `white` | `#FFFFFF` | +|
| Off White | `off-white` | `#FAFAFA` | +|
| Gray Light | `gray-light` | `#F5F5F5` | +|
| Gray Light Mid | `gray-light-mid` | `#D8D8D8` | +|
| Gray Mid | `gray-mid` | `#949494` | +|
| Gray Mid Dark | `gray-mid-dark` | `#6F6F6F` | +|
| Gray Dark | `gray-dark` | `#222222` | +|
| Black | `black` | `#000000` | + +Although several gradations are available via Tailwind CSS classes, make sure to only use the intended colors for text: + +-
+ .text-gray-dark +-
+ .text-gray-mid-dark +-
+ .text-gray-mid + + + +## Semantic Colors + +Recommended for use in forms, alerts, or any element meant to communicate a state. + +**Note:** Color should never be the _only_ means used to convey state information; +it must always be accompanied by text or iconography that makes it clear for colorblind users. + +| Color | Name | Token | Value | +| :--------------------------------------------- | :------------------ | :-------------------- | :-------- | +|
| Alert Gold | `alert-gold` | `#FFBA32` | +|
| Alert Gold Light | `alert-gold-light` | `#FFF9EB` | +|
| Disabled Gray | `disabled-gray` | `#D8D8D8` | +|
| Error Red | `error-red` | `#C1152E` | +|
| Error Red Light | `error-red-light` | `#FFE8EB` | +|
| Focus Blue | `focus-blue` | `#1871C9` | +|
| Focus Blue Light | `focus-blue-light` | `#E8F1FA` | +|
| Success Green | `success-green` | `#33A17B` | +|
| Success Green Light | `success-green-light` | `#E1F5EE` | + + + +## Tokens + +All colors are available via Tailwind CSS classes using tokens: + +``` +.bg-{token} +.text-{token} +.border-{token} +``` diff --git a/apps/vue-storybook/docs/foundation/grid.docs.mdx b/apps/vue-storybook/docs/foundation/grid.docs.mdx new file mode 100644 index 00000000..ec6ee8ae --- /dev/null +++ b/apps/vue-storybook/docs/foundation/grid.docs.mdx @@ -0,0 +1,189 @@ +import { Meta, Story, Canvas } from '@storybook/blocks' +import * as Stories from './grid.stories' + + + +# Grid and Layout + +We use a 12-column grid paired with our [Responsive Design](?path=/docs/guides-responsive-design--docs) strategy to create all of our page and component layouts. + +> The examples on this page assume you are viewing this page on a desktop. Examples may not appear correct on smaller screens. + +- [BaseGrid](#basegrid) + - [Example Usage](#example-usage) +- [Mixed Bleed](#mixed-bleed) + - [Example Usage](#example-usage-1) +- [Page layout recommendations](#page-layout-recommendations) +- [Full Page Example](#full-page-example) + + + +## BaseGrid + +There is a globally available `.BaseGrid` class that is the basis of our main grid, which contains `12` columns with a gutter of `gap-6`. + + + +Although `.BaseGrid` is always used with or wrapped by a `.container`, `.BaseGrid` itself does not include any margins or container behavior. This is to allow for maximum flexibility when using this class in your components: + +```css +.BaseGrid { + @apply grid grid-cols-12 gap-6; +} +``` + +Adjustments like margins and container can be applied as needed, such as: + +```html +
Centered 12 col grid bound by container
+``` + +If you just need a container and no grid, you can simply omit the `BaseGrid`: + +```html +
Content with no grid
+``` + + + +### Example Usage + +Some common component layouts: + + + + + +--- + + + +## Mixed Bleed + +Some components only bleed to one side of the screen. There is a `.MixedBleedGrid` class available for use that sets named grid lines. Note that these grid lines assume `.container` has zero padding. + +| Named Line | Description | +| :---------------- | :----------------------------------- | +| `bleed-start` | Left edge of the viewport | +| `container-start` | Left edge of the standard container | +| `indent-col-2` | Aligns with column 2 in `BaseGrid` | +| `indent-col-3` | Aligns with column 3 in `BaseGrid` | +| `container-end` | Right edge of the standard container | +| `bleed-end` | Right edge of the viewport | + +These named lines are used to construct the following `col-start-` and `col-end-` classes: + +```css +@responsive { + .col-start-bleed { + grid-column-start: bleed-start; + } + .col-end-container-start { + grid-column-end: container-start; + } + .col-start-container { + grid-column-start: container-start; + } + .col-start-indent-col-2 { + grid-column-start: indent-col-2; + } + .col-start-indent-col-3 { + grid-column-start: indent-col-3; + } + .col-end-container { + grid-column-end: container-end; + } + .col-start-container-end { + grid-column-start: container-end; + } + .col-end-bleed { + grid-column-end: bleed-end; + } +} +``` + +Note the usage of `.px-0` in addition to `.container` in the example below: + + + + + +### Example Usage + +Responsive styles within MixedBleed will need to be determined on a case-by-base basis. Usage of this class is best followed by observing existing usage and examples. + +#### Simple mixed bleed + +Starts at `indent-col-2` (col-2 of the `BaseGrid`) and bleeds fully to the right. + +```html +
+
Indented to col-2 and bleeds right
+
+``` + + + +#### Complex mixed bleed + +When elements of an indented MixedBleed area must align with the BaseGrid, we need to get a bit more creative. We will still use mixed bleed grid lines, but we will not use `BaseGrid` within since the container is already indented. We instead need to use a custom grid for this use-case. Luckily, with Tailwind CSS, this is fairly straightforward. The nested grid should contain the number of columns offset by the amount that is already indented, and no `gap` should be used. + +```html +
+
+
+
Text aligned with apparent col 4
+
Text aligned with apparent col 9
+
+
+
+
+``` + + + + + +## Page layout recommendations + +Explorer 1 components vary in width. This can make page layouts challenging if the entire content area is bound by a single `.container` div, a strategy that is commonly used on other websites. For Explorer 1, we recommend avoiding this strategy and instead giving each section or component on the page its own set of layout markup. + +[Blocks](?path=/docs/components-blocks-overview--docs) provided by Explorer 1 are compatible with this strategy. However, if a block notes that "layout assumptions have been made," this means that the entire layout for that block is already included in the markup, and you shouldn't include any additional layout. Doing so could break the display of that block. + +View the code below for an example of how to give each section its own set of layout markup. You can also see this strategy employed in the [Full Page Example](#full-page-example). + + + +
+ + + +## Full Page Example + +An example of the foundations of a full page layout. + + diff --git a/apps/vue-storybook/docs/foundation/grid.stories.ts b/apps/vue-storybook/docs/foundation/grid.stories.ts new file mode 100644 index 00000000..09370929 --- /dev/null +++ b/apps/vue-storybook/docs/foundation/grid.stories.ts @@ -0,0 +1,263 @@ +import LayoutHelper from '@explorer-1/vue/src/components/LayoutHelper/LayoutHelper.vue' +export default { + title: 'Foundation/Grid and Layout', + component: LayoutHelper, + tags: ['!autodocs'] +} + +export const BaseGrid = { + args: {}, + render: () => ({ + template: `
+
+
1
+
2
+
3
+
4
+
5
+
6
+
7
+
8
+
9
+
10
+
11
+
12
+
+
+
+ Container, but no grid +
+
+
` + }) +} + +export const ComponentA = { + args: {}, + render: () => ({ + template: `
+
+ Starts at col 4 and ends at the col 10 line. +
+
` + }) +} + +export const ComponentB = { + args: {}, + render: () => ({ + template: `
+
+ Primary content +
+
+ Secondary content +
+
` + }) +} + +export const MixedBleedGridLines = { + args: {}, + render: () => ({ + template: `
+
+
1
+
2
+
3
+
4
+
5
+
6
+
7
+
8
+
9
+
10
+
11
+
12
+
+
+
+ [bleed-start]
+ .col-start-bleed
+
+
+ [container-start]
+ .col-start-container
+
+
+ [indent-col-2]
+ .col-start-indent-col-2
+
+
+ [indent-col-3]
+ .col-start-indent-col-3
+
+
+ [container-end]
+ .col-end-container
+ .col-start-container-end
+
+
+ [bleed-end]
+ .col-end-bleed
+
+
+
` + }) +} + +export const MixedBleed = { + args: {}, + render: () => ({ + template: `
+
+ Gallery Container (inner layout not dependent on grid) +
+
` + }) +} + +export const MixedBleedComplex = { + args: {}, + render: () => ({ + template: `
+
+
+
+
+ Text aligned with apparent col 4 +
+
+ Text aligned with apparent col 9 +
+
+
+
+
+
` + }) +} + +export const PageLayout = { + args: {}, + render: () => ({ + template: ` +
+
+ Component with content bound .max-w-screen-3xl but with a background color that extends beyond 3xl +
+
+ +
+
+ Component filling columns 3-10 on large screens and above. +
+
+ +
+
+ Component filling columns 4-9 on large screens and above and columns 2-11 on smaller screens. +
+
+ +
+ Component with content bound by .container +
+ +
+ Component with content bound by .max-w-screen-3xl +
+ +
+
+ Another component filling columns 3-10 on large screens and above. +
+
` + }) +} + +export const FullPageExample = { + args: {}, + render: () => ({ + template: `
+
+ Top Hat +
+
+
+
+ Page title with full bleed background
+ Lorem ipsum dolor sit amet
+ Consectatur +
+
+
+
+
+
+ Countdown Timer +
+
+ Distance to Target +
+
+
+
+
+
+
+ About the mission +
+
+ Instrument list +
+
+
+
+
+ Full bleed background with BaseGrid inner container +
+
+
+
+
+ Mission Data +
+
+ Square Image +
+
+
+
+ Blockquote +
+
+
+
+ Gallery Container +
+
+
+
+ Link 1 +
+
+
+
+ Link 2 +
+
+
+
+
+ Gallery Container +
+
+
+
+
+ Footer +
+
` + }) +} diff --git a/apps/vue-storybook/docs/foundation/grid_layouthelpers.docs.mdx b/apps/vue-storybook/docs/foundation/grid_layouthelpers.docs.mdx new file mode 100644 index 00000000..4af8bb9e --- /dev/null +++ b/apps/vue-storybook/docs/foundation/grid_layouthelpers.docs.mdx @@ -0,0 +1,78 @@ +import { Meta, Story, Canvas } from '@storybook/blocks' +import * as Stories from './grid_layouthelpers.stories' + + + +# Column Layout helpers + +Sometimes you may want to use a few common column indentations in your layouts for blocks on your page. Explorer 1 provides a few helper classes to aid in quickly creating these indented blocks. These helper classes also include responsive fallbacks. + +## .indent-col-base + +`.indent-col-base` is the **base class that you must add to any element that will use additional helper classes covered in this documentation**. Its immediate parent must be `.BaseGrid` (or any 12-column grid). It sets the width to start at the first column and end after the last column, i.e. full width. + +```css +.indent-col-base { + @apply col-start-1 col-end-13; // full width of 12 grid container +} +``` + + + +## .indent-col-2 + +`.indent-col-2` adds to `.indent-col-base` by overriding the `col-start` and `col-end` for `lg` screens to indent content to the **second** column. + +```css +.indent-col-2 { + @screen lg { + @apply col-start-2 col-end-12; + } +} +``` + + + +## .indent-col-3 + +`.indent-col-3` adds to `.indent-col-base` by overriding the `col-start` and `col-end` for `lg` screens to indent content to the **third** column. + +```css +.indent-col-3 { + @screen lg { + @apply col-start-3 col-end-11; + } +} +``` + + + +## .indent-col-4 + +`.indent-col-4` adds to `.indent-col-base` by overriding the `col-start` and `col-end` for `lg` screens to indent content to the **fourth** column, and at `md` screens to the **third** column. + +```css +.indent-col-4 { + @screen md { + @apply col-start-3 col-end-11; + } + + @screen lg { + @apply col-start-4 col-end-10; + } +} +``` + + diff --git a/apps/vue-storybook/docs/foundation/grid_layouthelpers.stories.ts b/apps/vue-storybook/docs/foundation/grid_layouthelpers.stories.ts new file mode 100644 index 00000000..2edc9572 --- /dev/null +++ b/apps/vue-storybook/docs/foundation/grid_layouthelpers.stories.ts @@ -0,0 +1,53 @@ +import LayoutHelper, { indents } from '@explorer-1/vue/src/components/LayoutHelper/LayoutHelper.vue' + +// TODO: DOCS: update this to match the full grid/layout documentation + +export default { + title: 'Foundation/Grid and Layout/Column Layout Helpers', + component: LayoutHelper, + tags: ['!autodocs'], + argTypes: { + indent: { + control: { type: 'select' }, + options: Object.keys(indents) + } + }, + parameters: { + html: { + root: '#storyDecorator' + } + }, + decorators: [ + () => ({ + template: `
` + }) + ] +} + +const LayoutHelperTemplate = (args) => ({ + components: { LayoutHelper }, + setup() { + return { args } + }, + template: `
Indent starts at {{args}}
` +}) + +export const BaseWidth = LayoutHelperTemplate.bind({}) +BaseWidth.args = { + indent: 'col-1' +} + +export const ColTwoStart = LayoutHelperTemplate.bind({}) +ColTwoStart.args = { + indent: 'col-2' +} + +export const ColThreeStart = LayoutHelperTemplate.bind({}) +ColThreeStart.args = { + indent: 'col-3' +} + +export const ColFourStart = LayoutHelperTemplate.bind({}) +ColFourStart.args = { + indent: 'col-4' +} diff --git a/apps/vue-storybook/docs/foundation/themes.docs.mdx b/apps/vue-storybook/docs/foundation/themes.docs.mdx new file mode 100644 index 00000000..56a689d7 --- /dev/null +++ b/apps/vue-storybook/docs/foundation/themes.docs.mdx @@ -0,0 +1,71 @@ +import { Meta, Story, Canvas } from '@storybook/blocks' +import * as Stories from './themes.stories' + + + +# Themes + +Throughout this storybook, you can use the Theme and Variant selectors in the Storybook toolbar to preview components in different theme configurations. + +**Note:** some documentation pages use iframes to display components, which ignores the theme switcher. Thus, for the most accurate representation of the internal theme, we recommend viewing the story in isolation. + +## Dynamic color tokens + +There are dynamic color tokens in place that use a semantic name instead of a specific color name. These tokens are use strategically in components to support multiple themes. + +Changing the Theme and Variant to see how the dynamic tokens change. + + + +## Light & Dark Variants + +`.ThemeVariantLight` and `.ThemeVariantDark` in Explorer 1 are theme variants. Note that not all components support these variants. + +### Key Points + +- `defaultTheme` and `ThemeVariantLight` are the defaults +- It is recommended that page templates always include the default variant. + +### Contributing developers: Writing light/dark theme styles for components + +For components that have light and dark themes, add theme rules to the end of your scss. The following is an example of a component whose background should be `bg-white` by default and in `ThemeVariantLight` but `bg-black` in `ThemeVariantDark` + +```scss +.MyComponent { + // set the default background color + @apply bg-white; + // set the ThemeVariantDark background color + .ThemeVariantDark & { + @apply bg-black; + } +} +``` + +## Adaptive Text Colors + +Usage of `.text-action` vs `.text-action` in the context of `.ThemeVariantLight` and `.ThemeVariantDark` ensures that the contrast of the text color is sufficient against the background color. These adaptive text colors are supported by all themes. + +### Definition (excerpt) + +```css +.text-action { + @apply text-action; + .ThemeVariantDark & { + @apply text-action-light; + } +} +.text-action-hover { + @apply text-action-dark; + .ThemeVariantDark & { + @apply text-action; + } +} +``` + +### Usage + +Try changing the Theme and Variant while viewing the examples below. Notice how there are slight changes in color between the Dark and Light variants. + + + +See [BaseLink](?path=/docs/components-base-baselink--docs) for a real usage example. diff --git a/apps/vue-storybook/docs/foundation/themes.stories.ts b/apps/vue-storybook/docs/foundation/themes.stories.ts new file mode 100644 index 00000000..7c05506e --- /dev/null +++ b/apps/vue-storybook/docs/foundation/themes.stories.ts @@ -0,0 +1,63 @@ +import DynamicTokens from './DynamicTokens.vue' + +export default { + title: 'Foundation/Themes', + component: DynamicTokens, + tags: ['!autodocs'] +} + +export const DynamicTokenStory = { + name: 'Dynamic Tokens', + args: {} +} + +const InternalTemplate = `` + +export const Internal = { + args: {}, + render: (args) => ({ + setup() { + return { args } + }, + template: InternalTemplate + }) +} + +const AdaptiveTextTemplate = `

+ + Lorem ipsum dolor sit amet + +

` + +export const AdaptiveText = { + args: {}, + render: (args) => ({ + setup() { + return { args } + }, + template: AdaptiveTextTemplate + }) +} diff --git a/apps/vue-storybook/docs/foundation/typography.docs.mdx b/apps/vue-storybook/docs/foundation/typography.docs.mdx new file mode 100644 index 00000000..5a8970aa --- /dev/null +++ b/apps/vue-storybook/docs/foundation/typography.docs.mdx @@ -0,0 +1,50 @@ +import { Meta, Story, Canvas } from '@storybook/blocks' +import * as Stories from './typography.stories' + + + +# Typography + +## Fonts + +Below are all fonts used in the design system. + +### Metropolis + +Metropolis is used for all heading levels and body copy. + +### Archivo Narrow + +Archivo Narrow is used for subtitles and buttons and is always used in UPPERCASE. + + + +## Text Colors + +Here are colors intended for text, depending on the background. **Note:** Some of these colors will not pass contrast requirements if used on a different background. + + + +## Text Styles + +All of the text styles used across the project, each with its reusable component class. +Prefer reusing those classes over individual utility classes, as each text style has different properties between desktop and mobile viewports. + +Note: + +- All heading levels also have the corresponding text styles directly applied for convenience. +- This can still be overridden by adding another relevant class. + + + +### Heading Icons + +We can also add icons next to the headings. + + + +## Text Contrast + +In areas where text overlays an image, use this `.text-contrast` class in conjunction with a semi-transparent overlay (ex. `bg-black/*`) to improve readability. `.text-contrast` also works with tailwind breakpoints. + + diff --git a/apps/vue-storybook/docs/foundation/typography.stories.ts b/apps/vue-storybook/docs/foundation/typography.stories.ts new file mode 100644 index 00000000..4b81cc00 --- /dev/null +++ b/apps/vue-storybook/docs/foundation/typography.stories.ts @@ -0,0 +1,119 @@ +import FontVariants from './FontVariants.vue' +import IconLocation from '@explorer-1/vue/src/components/Icons/IconLocation.vue' +import BaseHeading from '@explorer-1/vue/src/components/BaseHeading/BaseHeading.vue' + +export default { + title: 'Foundation/Typography', + component: FontVariants, + subcomponents: { BaseHeading, IconLocation }, + tags: ['!autodocs'] +} + +export const Fonts = { + args: {} +} + +export const TextColors = { + args: {}, + render: () => ({ + template: `
+
+
+
+ .text-gray-dark +
+
+
+ .text-gray-mid-dark +
+
+
+ .text-jpl-red +
+
+
+
+
+ .text-white +
+
+
+ .text-gray-mid +
+
+
+ .text-jpl-red-light +
+
+
` + }) +} + +export const TextStyles = { + args: {}, + render: () => ({ + template: `
+

Header H1 Alt

+ .text-h1-alt +

Header H1

+ h1, .text-h1 +

Header H2

+ h2, .text-h2 +

Header H3

+ h3, .text-h3 +

Header H4

+ h4, .text-h4 +

Header H5

+ h5, .text-h5 +

Header H6

+ h6, .text-h6 +

Subtitle

+ .text-subtitle +

Body large

+ .text-body-lg +

Body medium

+ .text-body-md +

Body small

+ .text-body-sm +

Body extra small

+ .text-body-xs +

Highlighted text

+ mark +
` + }) +} + +export const HeadingIcons = { + argTypes: { + size: { + type: { name: 'string', required: true }, + control: { type: 'select' }, + options: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] + } + }, + args: { + size: 'h1' + }, + render: (args) => ({ + components: { BaseHeading, IconLocation }, + setup() { + return { args } + }, + template: `
+ Heading H1 +
` + }) +} + +export const TextContrast = { + args: {}, + render: () => ({ + template: `
+
+ + This text uses a text shadow that increases readability when used with a semi-transparent overlay. + +
+
` + }) +} diff --git a/apps/vue-storybook/package.json b/apps/vue-storybook/package.json index c0c005be..db8e6a9d 100644 --- a/apps/vue-storybook/package.json +++ b/apps/vue-storybook/package.json @@ -5,7 +5,11 @@ "prettier": "@explorer-1/prettier-config", "type": "module", "scripts": { - "dev": "pnpm run storybook", + "dev": "pnpm storybook", + "prepare": "pnpm prepare:public && pnpm prepare:public:edu && pnpm prepare:fontcss", + "prepare:public": "cp -R ./node_modules/@explorer-1/common/src/public/explorer-1/ ./public/explorer-1", + "prepare:public:edu": "cp -R ./node_modules/@explorer-1/common/src/public/explorer-1/ ./public/edu/explorer-1", + "prepare:fontcss": "cp ./node_modules/@explorer-1/common/src/scss/_fonts.scss ./public/css/font-face.css", "storybook": "storybook dev -c .storybook -p 6006 --ci", "build": "storybook build -c .storybook -o storybook_compiled", "percy": "percy storybook http://localhost:6006", @@ -28,6 +32,7 @@ "@explorer-1/prettier-config": "workspace:*", "@explorer-1/tsconfig": "workspace:*", "@explorer-1/vue": "workspace:*", + "@explorer-1/html": "workspace:*", "@rushstack/eslint-patch": "^1.2.0", "@storybook/addon-a11y": "^8.1.6", "@storybook/addon-essentials": "^8.1.6", diff --git a/apps/vue-storybook/public/css/.gitkeep b/apps/vue-storybook/public/css/.gitkeep new file mode 100644 index 00000000..e69de29b diff --git a/apps/vue-storybook/public/edu/.gitkeep b/apps/vue-storybook/public/edu/.gitkeep new file mode 100644 index 00000000..e69de29b diff --git a/apps/vue-storybook/stories/components/BaseButton.stories.ts b/apps/vue-storybook/stories/components/BaseButton.stories.ts index 53a0605a..a0230761 100644 --- a/apps/vue-storybook/stories/components/BaseButton.stories.ts +++ b/apps/vue-storybook/stories/components/BaseButton.stories.ts @@ -51,6 +51,12 @@ export const PrimaryButton = { variant: 'primary' } } +export const ReversePrimaryButton = { + args: { + ...BaseButtonData, + variant: 'reverse-primary' + } +} export const SecondaryButton = { args: { ...BaseButtonData, diff --git a/apps/vue-storybook/stories/components/BlockInlineImage.stories.js b/apps/vue-storybook/stories/components/BlockInlineImage.stories.js index a6779c62..ef8d3a6a 100644 --- a/apps/vue-storybook/stories/components/BlockInlineImage.stories.js +++ b/apps/vue-storybook/stories/components/BlockInlineImage.stories.js @@ -19,10 +19,10 @@ export const BlockInlineImageData = { alt: 'Inline image', src: { height: 500, - url: 'https://source.unsplash.com/NuE8Nu3otjo/700x500', + url: 'https://picsum.photos/700/500', width: 700 }, - original: 'https://source.unsplash.com/NuE8Nu3otjo/1400x1000' + original: 'https://picsum.photos/1400/1000' }, displayCaption: true } @@ -59,7 +59,7 @@ export const PortraitImage = { alt: 'Inline image', src: { height: 600, - url: 'https://source.unsplash.com/NuE8Nu3otjo/500x600', + url: 'https://picsum.photos//500/600', width: 500 } } diff --git a/apps/vue-storybook/stories/components/BlockLinkCard.stories.js b/apps/vue-storybook/stories/components/BlockLinkCard.stories.js index d52b4865..7822c1e2 100644 --- a/apps/vue-storybook/stories/components/BlockLinkCard.stories.js +++ b/apps/vue-storybook/stories/components/BlockLinkCard.stories.js @@ -37,7 +37,7 @@ export const BlockLinkCardData = { label: 'Solar System', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/512x288', + url: 'https://picsum.photos/512/288', width: 512, height: 288 }, @@ -45,21 +45,11 @@ export const BlockLinkCardData = { } }, headingLevel: 'h2', + startDate: undefined, + endDate: undefined, compact: false } -// templates -const BlockLinkCardTemplate = (args) => ({ - props: Object.keys(args), - components: { BlockLinkCard }, - template: `` -}) -const BlockLinkCardCustomPropsTemplate = (args) => ({ - props: Object.keys(args), - components: { BlockLinkCard }, - template: `` -}) - export const SingleItem = { args: { ...BlockLinkCardData @@ -90,7 +80,7 @@ export const Compact = { date: 'Sep. 23, 2010', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/512x288', + url: 'https://picsum.photos/512/288', width: 512, height: 288 }, @@ -100,3 +90,13 @@ export const Compact = { compact: true } } +export const EventItem = { + args: { + ...BlockLinkCardData, + data: { + ...BlockLinkCardData.data, + startDate: '2021-11-11T00:00:00-08:00', + endDate: '2021-11-11T23:59:59.999999-08:00' + } + } +} diff --git a/apps/vue-storybook/stories/components/BlockLinkCarousel.stories.js b/apps/vue-storybook/stories/components/BlockLinkCarousel.stories.js index dafeddfb..4b13e888 100644 --- a/apps/vue-storybook/stories/components/BlockLinkCarousel.stories.js +++ b/apps/vue-storybook/stories/components/BlockLinkCarousel.stories.js @@ -29,7 +29,7 @@ export const BlockLinkCardCarouselData = [ label: 'Mars', thumbnailImage: { src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/512x288', + url: 'https://picsum.photos/512/288', width: 512, height: 288 }, @@ -42,7 +42,7 @@ export const BlockLinkCardCarouselData = [ slug: 'placeholder-slug-2', thumbnailImage: { src: { - url: 'https://source.unsplash.com/NuE8Nu3otjo/512x288', + url: 'https://picsum.photos/512/288', width: 512, height: 288 }, @@ -56,7 +56,7 @@ export const BlockLinkCardCarouselData = [ label: 'Solar System', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/512x288', + url: 'https://picsum.photos/512/288', width: 512, height: 288 }, @@ -70,7 +70,7 @@ export const BlockLinkCardCarouselData = [ label: 'Technology', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/512x288', + url: 'https://picsum.photos/512/288', width: 512, height: 288 }, @@ -86,7 +86,7 @@ export const BlockLinkTileCarouselData = [ label: 'Mars', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/490x430', + url: 'https://picsum.photos/490/430', width: 490, height: 430 }, @@ -98,7 +98,7 @@ export const BlockLinkTileCarouselData = [ title: 'OCO-2', thumbnailImage: { src: { - url: 'https://source.unsplash.com/yZygONrUBe8/490x430', + url: 'https://picsum.photos/490/430', width: 490, height: 430 }, @@ -111,7 +111,7 @@ export const BlockLinkTileCarouselData = [ label: 'Solar System', thumbnailImage: { src: { - url: 'https://source.unsplash.com/EOQFwqmzfeY/490x430', + url: 'https://picsum.photos/490/430', width: 490, height: 430 }, @@ -124,7 +124,7 @@ export const BlockLinkTileCarouselData = [ label: 'Mars', thumbnailImage: { src: { - url: 'https://source.unsplash.com/t7EL2iG3jMc/490x430', + url: 'https://picsum.photos/490/430', width: 490, height: 430 }, @@ -140,7 +140,7 @@ export const EventsBlockLinkCarouselData = [ thumbnailImage: { src: { height: '288', - url: 'https://source.unsplash.com/OLlj17tUZnU/512x288', + url: 'https://picsum.photos/512/288', width: '512' } }, @@ -153,7 +153,7 @@ export const EventsBlockLinkCarouselData = [ thumbnailImage: { src: { height: '288', - url: 'https://source.unsplash.com/OLlj17tUZnU/512x288', + url: 'https://picsum.photos/512/288', width: '512' } }, diff --git a/apps/vue-storybook/stories/components/BlockLinkTile.stories.js b/apps/vue-storybook/stories/components/BlockLinkTile.stories.js index e647d6a9..cc37f45a 100644 --- a/apps/vue-storybook/stories/components/BlockLinkTile.stories.js +++ b/apps/vue-storybook/stories/components/BlockLinkTile.stories.js @@ -60,7 +60,7 @@ export const Compact = { label: 'Mission', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/512x288', + url: 'https://picsum.photos/512/288', width: 512, height: 288 }, diff --git a/apps/vue-storybook/stories/components/BlockListCards.stories.js b/apps/vue-storybook/stories/components/BlockListCards.stories.js index 0b68489a..d55ee057 100644 --- a/apps/vue-storybook/stories/components/BlockListCards.stories.js +++ b/apps/vue-storybook/stories/components/BlockListCards.stories.js @@ -15,7 +15,7 @@ export const BlockListCardsData = { heading: 'Heading text', image: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/320x320', + url: 'https://picsum.photos/320/320', width: '320', height: '320' } @@ -41,7 +41,7 @@ export const BlockListCardsData = { heading: 'Heading text', image: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/320x320', + url: 'https://picsum.photos/320/320', width: '320', height: '320' } diff --git a/apps/vue-storybook/stories/components/EventDetailHero.stories.js b/apps/vue-storybook/stories/components/EventDetailHero.stories.js index 807efcd3..237fb18f 100644 --- a/apps/vue-storybook/stories/components/EventDetailHero.stories.js +++ b/apps/vue-storybook/stories/components/EventDetailHero.stories.js @@ -31,9 +31,9 @@ export default { export const EventDetailHeroData = { heroImage: { srcSet: - 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://source.unsplash.com/OLlj17tUZnU/1920x1200 1440w', + 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://picsum.photos/1920/1200 1440w', src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/1920x1200', + url: 'https://picsum.photos/1920/1200', width: 1920, height: 1200 }, diff --git a/apps/vue-storybook/stories/components/HomepageMissionsCarousel.stories.js b/apps/vue-storybook/stories/components/HomepageMissionsCarousel.stories.js index c11fe7e0..ac874658 100644 --- a/apps/vue-storybook/stories/components/HomepageMissionsCarousel.stories.js +++ b/apps/vue-storybook/stories/components/HomepageMissionsCarousel.stories.js @@ -86,6 +86,21 @@ export const HomepageMissionsCarouselData = { } } }, + { + name: 'Moon', + pastMissions: 26, + currentMissions: 0, + image: { + src: { + url: imageMoon, + width: 787, + height: 800 + }, + webp: { + url: imageMoon + } + } + }, { name: 'Moon', pastMissions: 26, @@ -115,16 +130,24 @@ const HomepageMissionsCarouselTemplate = (args) => ({ const HomepageMissionsCarouselItemTemplate = (args) => ({ props: Object.keys(args), components: { HomepageMissionsCarouselItem }, - template: `
` + template: `
` }) // stories -export const Default = HomepageMissionsCarouselTemplate.bind({}) -Default.args = { - missionsCarousel: HomepageMissionsCarouselData.missionsCarousel +export const Default = { + args: { + data: HomepageMissionsCarouselData.missionsCarousel + } } - -export const Item = HomepageMissionsCarouselItemTemplate.bind({}) -Item.args = { - item: HomepageMissionsCarouselData.missionsCarousel[0].targets[0] +export const Item = { + args: { + data: HomepageMissionsCarouselData.missionsCarousel[0].targets[0] + }, + render: (args) => ({ + components: { HomepageMissionsCarouselItem }, + setup() { + return { args } + }, + template: `
` + }) } diff --git a/apps/vue-storybook/stories/components/Icons.stories.ts b/apps/vue-storybook/stories/components/Icons.stories.ts index dc844c43..63e820bb 100644 --- a/apps/vue-storybook/stories/components/Icons.stories.ts +++ b/apps/vue-storybook/stories/components/Icons.stories.ts @@ -49,7 +49,7 @@ import IconUser from '@explorer-1/vue/src/components/Icons/IconUser.vue' import IconVolume from '@explorer-1/vue/src/components/Icons/IconVolume.vue' export default { - title: 'Icons', + title: 'Foundation/Icons', component: IconArrows, subcomponents: { IconArrow, diff --git a/apps/vue-storybook/stories/components/LogoCaltech.stories.js b/apps/vue-storybook/stories/components/LogoCaltech.stories.js index b078909d..fad46f0a 100644 --- a/apps/vue-storybook/stories/components/LogoCaltech.stories.js +++ b/apps/vue-storybook/stories/components/LogoCaltech.stories.js @@ -1,7 +1,7 @@ import LogoCaltech from '@explorer-1/vue/src/components/LogoCaltech/LogoCaltech.vue' export default { - title: 'Brand Identity/Logos/LogoCaltech', + title: 'Foundation/Logos/LogoCaltech', component: LogoCaltech, argTypes: { size: { diff --git a/apps/vue-storybook/stories/components/LogoTribrand.stories.js b/apps/vue-storybook/stories/components/LogoTribrand.stories.js index c1523f57..7cf35e20 100644 --- a/apps/vue-storybook/stories/components/LogoTribrand.stories.js +++ b/apps/vue-storybook/stories/components/LogoTribrand.stories.js @@ -3,7 +3,7 @@ import LogoWhite from '@explorer-1/common/src/images/svg/logo-tribrand-white.svg import LogoTribrand from '@explorer-1/vue/src/components/LogoTribrand/LogoTribrand.vue' export default { - title: 'Brand Identity/Logos/LogoTribrand', + title: 'Foundation/Logos/LogoTribrand', component: LogoTribrand, excludeStories: /.*Data$/, parameters: { diff --git a/apps/vue-storybook/stories/components/MissionDetailHero.stories.js b/apps/vue-storybook/stories/components/MissionDetailHero.stories.js index 3dff185b..b5a1f6da 100644 --- a/apps/vue-storybook/stories/components/MissionDetailHero.stories.js +++ b/apps/vue-storybook/stories/components/MissionDetailHero.stories.js @@ -42,9 +42,9 @@ export const MissionDetailHeroData = { missionWebsiteUrl: 'https://gracefo.jpl.nasa.gov/', heroFallback: { srcSet: - 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://source.unsplash.com/OLlj17tUZnU/1920x1200 1440w', + 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://picsum.photos/1920/1200 1440w', src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/1920x1200', + url: 'https://picsum.photos/1920/1200', width: 1920, height: 1200 }, @@ -63,10 +63,9 @@ export const MissionDetailHeroData = { }, instrumentBackground: { image: { - srcSet: - 'https://source.unsplash.com/dLVV1FyJLdk/320x180 320w, https://source.unsplash.com/dLVV1FyJLdk/1440x810 1440w', + srcSet: 'https://picsum.photos/320/180 320w, https://picsum.photos/1440/810 1440w', src: { - url: 'https://source.unsplash.com/dLVV1FyJLdk/1440x810', + url: 'https://picsum.photos/1440/810', width: 1440, height: 810 } @@ -100,10 +99,9 @@ export const CubeRrt = { 'The main objective of the CubeRRT mission is to demonstrate the RFI mitigation technology on a flight-ready hardware in space, increasing the technology readiness level from 6 to 7.', missionWebsiteUrl: 'https://www.jpl.nasa.gov/cubesat/missions/cuberrt.php', heroImage: { - srcSet: - 'https://source.unsplash.com/OLlj17tUZnU/320x200 320w, https://source.unsplash.com/OLlj17tUZnU/1920x1200 1440w', + srcSet: 'https://picsum.photos/320/200 320w, https://picsum.photos/1920/1200 1440w', src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/1920x1200', + url: 'https://picsum.photos/1920/1200', width: 1920, height: 1200 }, @@ -143,9 +141,9 @@ export const Ecostress = { missionWebsiteUrl: 'http://ecostress.jpl.nasa.gov/', heroImage: { srcSet: - 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://source.unsplash.com/OLlj17tUZnU/1920x1200 1440w', + 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://picsum.photos/1920/1200 1440w', src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/1920x1200', + url: 'https://picsum.photos/1920/1200', width: 1920, height: 1200 }, @@ -185,9 +183,9 @@ export const Jason3 = { missionWebsiteUrl: 'http://sealevel.jpl.nasa.gov/missions/jason3/', heroImage: { srcSet: - 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://source.unsplash.com/OLlj17tUZnU/1920x1200 1440w', + 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://picsum.photos/1920/1200 1440w', src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/1920x1200', + url: 'https://picsum.photos/1920/1200', width: 1920, height: 1200 }, @@ -227,9 +225,9 @@ export const Oco2 = { missionWebsiteUrl: 'http://oco.jpl.nasa.gov/', heroImage: { srcSet: - 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://source.unsplash.com/OLlj17tUZnU/1920x1200 1440w', + 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://picsum.photos/1920/1200 1440w', src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/1920x1200', + url: 'https://picsum.photos/1920/1200', width: 1920, height: 1200 }, @@ -267,9 +265,9 @@ export const NoBackground = { missionWebsiteUrl: 'https://gracefo.jpl.nasa.gov/', heroImage: { srcSet: - 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://source.unsplash.com/OLlj17tUZnU/1920x1200 1440w', + 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://picsum.photos/1920/1200 1440w', src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/1920x1200', + url: 'https://picsum.photos/1920/1200', width: 1920, height: 1200 }, @@ -299,9 +297,9 @@ export const StaticHero = { missionWebsiteUrl: 'http://ecostress.jpl.nasa.gov/', heroFallback: { srcSet: - 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://source.unsplash.com/OLlj17tUZnU/1920x1200 1440w', + 'https://source.unsplash.com/OLlj17tUZnU//320x200 320w, https://picsum.photos/1920/1200 1440w', src: { - url: 'https://source.unsplash.com/OLlj17tUZnU/1920x1200', + url: 'https://picsum.photos/1920/1200', width: 1920, height: 1200 }, diff --git a/apps/vue-storybook/stories/components/MissionDetailInlineImage.stories.js b/apps/vue-storybook/stories/components/MissionDetailInlineImage.stories.js index 5f90b211..14cdce48 100644 --- a/apps/vue-storybook/stories/components/MissionDetailInlineImage.stories.js +++ b/apps/vue-storybook/stories/components/MissionDetailInlineImage.stories.js @@ -19,15 +19,15 @@ const MissionDetailInlineImageData = { ...BaseImageCaptionData, src: { height: 700, - url: 'https://source.unsplash.com/NuE8Nu3otjo/700x700', + url: 'https://picsum.photos/700/700', width: 700 }, screenXs: { - url: 'https://source.unsplash.com/NuE8Nu3otjo/320x320', + url: 'https://picsum.photos/320/320', width: 320 }, screenLg: { - url: 'https://source.unsplash.com/NuE8Nu3otjo/1024x1024', + url: 'https://picsum.photos/1024/1024', width: 1024 }, alt: '' diff --git a/apps/vue-storybook/stories/components/MissionDetailStreamfield.stories.js b/apps/vue-storybook/stories/components/MissionDetailStreamfield.stories.js index 1a62a430..1423deeb 100644 --- a/apps/vue-storybook/stories/components/MissionDetailStreamfield.stories.js +++ b/apps/vue-storybook/stories/components/MissionDetailStreamfield.stories.js @@ -21,15 +21,15 @@ export const MissionDetailStreamfieldData = { ...BaseImageCaptionData, src: { height: 700, - url: 'https://source.unsplash.com/NuE8Nu3otjo/700x700', + url: 'https://picsum.photos/700/700', width: 700 }, screenXs: { - url: 'https://source.unsplash.com/NuE8Nu3otjo/320x320', + url: 'https://picsum.photos/320/320', width: 320 }, screenLg: { - url: 'https://source.unsplash.com/NuE8Nu3otjo/1024x1024', + url: 'https://picsum.photos/1024/1024', width: 1024 }, alt: '' diff --git a/apps/vue-storybook/stories/components/MixinCarousel.docs.mdx b/apps/vue-storybook/stories/components/MixinCarousel.docs.mdx new file mode 100644 index 00000000..c9d147a6 --- /dev/null +++ b/apps/vue-storybook/stories/components/MixinCarousel.docs.mdx @@ -0,0 +1,33 @@ +import { Meta, Story, Canvas } from '@storybook/addon-docs' +import * as Stories from './MixinCarousel.stories' + + + +# MixinCarousel + +This is a `swiper.js` wrapper for the carousels that consist of multiple cards in view that also bleed to full width. + + + +### Variants + +There are currently two variants that can be applied via the `variant` prop. These are used to to apply a class to the main wrapper that dictates subtle changes to the layout. For the most part, these have to do with the vertical placement of the navigation arrows. + +| Variant | Description | +| :------ | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| `cards` | This is the default variant and accommodates cards that have text below the image. This places the navigation arrows in the vertical center of an image with a 16:9 aspect ratio. | +| `tiles` | This places the navigation arrows in the vertical center of the entire slide | + +## Basic Usage + +The default slot should be your slides, and each slide must have the `.swiper-slide` class. + +### Option with a link in the top right + +And with a link using the `link` and `linkTitle` props: + + + +## Used in the following components + +See [all usage in the repository](https://github.com/nasa-jpl/www-frontend/search?q=MixinCarousel&type=code). diff --git a/apps/vue-storybook/stories/components/MixinCarousel.stories.js b/apps/vue-storybook/stories/components/MixinCarousel.stories.js new file mode 100644 index 00000000..03ddf426 --- /dev/null +++ b/apps/vue-storybook/stories/components/MixinCarousel.stories.js @@ -0,0 +1,55 @@ +import MixinCarousel, { + variants +} from '@explorer-1/vue/src/components/MixinCarousel/MixinCarousel.vue' + +export default { + title: 'Mixins/MixinCarousel', + component: MixinCarousel, + tags: ['!autodocs'], + argTypes: { + variant: { + control: { type: 'select' }, + options: Object.keys(variants) + } + } +} + +export const Default = { + name: 'BaseCarousel', + args: { + heading: 'Heading', + variant: 'tiles' + }, + render: (args) => ({ + components: { MixinCarousel }, + setup() { + return { args } + }, + template: ` +
+ test slide +
+
` + }) +} + +export const BaseCarouselWLink = { + name: 'BaseCarousel w/ Link', + args: { + heading: 'Heading', + variant: 'tiles', + link: '/placeholder', + linkTitle: 'See more' + }, + render: (args) => ({ + components: { MixinCarousel }, + setup() { + return { args } + }, + template: ` +
+ test slide +
+
` + }) +} diff --git a/apps/vue-storybook/stories/components/MixinCarousel.stories.mdx b/apps/vue-storybook/stories/components/MixinCarousel.stories.mdx deleted file mode 100644 index 9e62c01b..00000000 --- a/apps/vue-storybook/stories/components/MixinCarousel.stories.mdx +++ /dev/null @@ -1,92 +0,0 @@ -import { Meta, Story, Canvas, ArgsTable } from '@storybook/addon-docs' -import MixinCarousel, { - variants -} from '@explorer-1/vue/src/components/MixinCarousel/MixinCarousel.vue' - - - -export const MixinCarouselTemplate = (args) => ({ - props: Object.keys(args), - components: { MixinCarousel }, - template: ` -
- test slide -
-
` -}) - -export const MixinCarouselLinkTemplate = (args) => ({ - props: Object.keys(args), - components: { MixinCarousel }, - template: ` -
- test slide -
-
` -}) - -# MixinCarousel - -This is a `swiper.js` wrapper for the carousels that consist of multiple cards in view that also bleed to full width. - - - - {MixinCarouselTemplate.bind({})} - - - -## Props - - - -### Variants - -There are currently two variants that can be applied via the `variant` prop. These are used to to apply a class to the main wrapper that dictates subtle changes to the layout. For the most part, these have to do with the vertical placement of the navigation arrows. - -| Variant | Description | -| :------ | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| `cards` | This is the default variant and accommodates cards that have text below the image. This places the navigation arrows in the vertical center of an image with a 16:9 aspect ratio. | -| `tiles` | This places the navigation arrows in the vertical center of the entire slide | - -## Basic Usage - -The default slot should be your slides, and each slide must have the `.swiper-slide` class. - -### Option with a link in the top right - -And with a link using the `link` and `linkTitle` props: - - - - {MixinCarouselLinkTemplate.bind({})} - - - -## Used in the following components - -See [all usage in the repository](https://github.com/nasa-jpl/www-frontend/search?q=MixinCarousel&type=code). diff --git a/apps/vue-storybook/stories/components/NavDesktop.stories.js b/apps/vue-storybook/stories/components/NavDesktop.stories.js index 420ccf53..14c7b1b2 100644 --- a/apps/vue-storybook/stories/components/NavDesktop.stories.js +++ b/apps/vue-storybook/stories/components/NavDesktop.stories.js @@ -202,7 +202,7 @@ export const NavInverted = { ` diff --git a/apps/vue-storybook/stories/components/NavHighlight.stories.js b/apps/vue-storybook/stories/components/NavHighlight.stories.js index 16c77ac0..e49479a8 100644 --- a/apps/vue-storybook/stories/components/NavHighlight.stories.js +++ b/apps/vue-storybook/stories/components/NavHighlight.stories.js @@ -26,7 +26,7 @@ export const MenuHighlightColumnData = { url: '/missions/gravity-recovery-and-climate-experiment-follow-on-grace-fo/', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/400x225', + url: 'https://picsum.photos/400/225', width: 400, height: 225 } diff --git a/apps/vue-storybook/stories/components/PodcastSeriesCarousel.stories.js b/apps/vue-storybook/stories/components/PodcastSeriesCarousel.stories.js index 5ae33844..8b724e51 100644 --- a/apps/vue-storybook/stories/components/PodcastSeriesCarousel.stories.js +++ b/apps/vue-storybook/stories/components/PodcastSeriesCarousel.stories.js @@ -35,7 +35,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-10-01', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -48,7 +48,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-10-02', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -61,7 +61,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-10-03', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -74,7 +74,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-10-04', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -87,7 +87,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-10-05', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -100,7 +100,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-10-06', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -113,7 +113,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-10-07', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -134,7 +134,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-11-01', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -147,7 +147,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-11-02', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -160,7 +160,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-11-03', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -173,7 +173,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-11-04', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -186,7 +186,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-11-05', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -199,7 +199,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-11-06', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -212,7 +212,7 @@ export const PodcastSeriesCarouselData = { publicationDate: '2021-11-07', thumbnailImage: { src: { - url: 'https://source.unsplash.com/WIlvkeCScuE/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, diff --git a/apps/vue-storybook/stories/components/RoboticsDetailStats.stories.js b/apps/vue-storybook/stories/components/RoboticsDetailStats.stories.js index cd2fc327..db7ca977 100644 --- a/apps/vue-storybook/stories/components/RoboticsDetailStats.stories.js +++ b/apps/vue-storybook/stories/components/RoboticsDetailStats.stories.js @@ -34,7 +34,7 @@ export const RoboticsDetailStatsData = { url: 'https://images.unsplash.com/photo-1535468899888-92047ec84051?fm=webp&crop=entropy&w=320&h=320&fit=crop' }, src: { - url: 'https://source.unsplash.com/mm4yj7L6Hk0/320x320' + url: 'https://picsum.photos/320/320' } }, robotDestinations: [ diff --git a/apps/vue-storybook/stories/components/SearchResultCard.stories.js b/apps/vue-storybook/stories/components/SearchResultCard.stories.js index e97b0693..0019152d 100644 --- a/apps/vue-storybook/stories/components/SearchResultCard.stories.js +++ b/apps/vue-storybook/stories/components/SearchResultCard.stories.js @@ -41,3 +41,17 @@ export const StandardResult = { args: SearchResultCardData } export const FeaturedResult = { args: { ...SearchResultCardData, featured: true } } + +export const EventResult = { + args: { + ...SearchResultCardData, + isEvents: true, + type: 'Event', + startTime: '00:00:00-08:00', + endTime: '23:59:59.999999-08:00', + startDate: '2021-11-11', + endDate: '2021-11-11', + location: 'On lab', + compact: false + } +} diff --git a/apps/vue-storybook/stories/components/ThumbnailCarousel.stories.js b/apps/vue-storybook/stories/components/ThumbnailCarousel.stories.js index 436ec860..0aefc7dd 100644 --- a/apps/vue-storybook/stories/components/ThumbnailCarousel.stories.js +++ b/apps/vue-storybook/stories/components/ThumbnailCarousel.stories.js @@ -21,7 +21,7 @@ export const ThumbnailCarouselData = { title: 'Episode 1', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -33,7 +33,7 @@ export const ThumbnailCarouselData = { title: 'Episode 2', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -45,7 +45,7 @@ export const ThumbnailCarouselData = { title: 'Episode 3', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -57,7 +57,7 @@ export const ThumbnailCarouselData = { title: 'Episode 4', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -69,7 +69,7 @@ export const ThumbnailCarouselData = { title: 'Episode 5', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -81,7 +81,7 @@ export const ThumbnailCarouselData = { title: 'Episode 6', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, @@ -93,7 +93,7 @@ export const ThumbnailCarouselData = { title: 'Episode 7', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Oze6U2m1oYU/430x430', + url: 'https://picsum.photos/430/430', width: 430, height: 430 }, diff --git a/apps/vue-storybook/stories/components/TopicDetailMissionCarousel.stories.js b/apps/vue-storybook/stories/components/TopicDetailMissionCarousel.stories.js index eb5cf601..abee4d78 100644 --- a/apps/vue-storybook/stories/components/TopicDetailMissionCarousel.stories.js +++ b/apps/vue-storybook/stories/components/TopicDetailMissionCarousel.stories.js @@ -13,7 +13,7 @@ export const TopicDetailMissionCarouselData = [ status: 'current', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/560x620', + url: 'https://picsum.photos/560/620', width: 560, height: 620 } @@ -28,7 +28,7 @@ export const TopicDetailMissionCarouselData = [ status: 'current', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/560x620', + url: 'https://picsum.photos/560/620', width: 560, height: 620 } @@ -43,7 +43,7 @@ export const TopicDetailMissionCarouselData = [ status: 'current', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/560x620', + url: 'https://picsum.photos/560/620', width: 560, height: 620 } @@ -58,7 +58,7 @@ export const TopicDetailMissionCarouselData = [ status: 'past', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/560x620', + url: 'https://picsum.photos/560/620', width: 560, height: 620 } @@ -73,7 +73,7 @@ export const TopicDetailMissionCarouselData = [ status: 'current', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/560x620', + url: 'https://picsum.photos/560/620', width: 560, height: 620 } diff --git a/apps/vue-storybook/stories/components/TopicDetailMissionCarouselItem.stories.js b/apps/vue-storybook/stories/components/TopicDetailMissionCarouselItem.stories.js index 1022d742..7021a895 100644 --- a/apps/vue-storybook/stories/components/TopicDetailMissionCarouselItem.stories.js +++ b/apps/vue-storybook/stories/components/TopicDetailMissionCarouselItem.stories.js @@ -26,7 +26,7 @@ export const TopicDetailMissionCarouselItemData = { status: 'current', thumbnailImage: { src: { - url: 'https://source.unsplash.com/Q1p7bh3SHj8/560x620', + url: 'https://picsum.photos/560/620', width: 560, height: 620 } diff --git a/apps/vue-storybook/stories/templates/PageContent.stories.js b/apps/vue-storybook/stories/templates/PageContent.stories.js index 8246fc47..b9a5038f 100644 --- a/apps/vue-storybook/stories/templates/PageContent.stories.js +++ b/apps/vue-storybook/stories/templates/PageContent.stories.js @@ -1,7 +1,6 @@ import { BlockHeadingData } from './../components/BlockHeading.stories' import { BlockKeyPointsData } from './../components/BlockKeyPoints.stories' import { BlockImageComparisonData } from './../components/BlockImageComparison.stories' -import { BlockTwitterEmbedData } from './../components/BlockTwitterEmbed.stories' import { BlockIframeEmbedData } from './../components/BlockIframeEmbed.stories' import { HeroMediaData } from './../components/HeroMedia.stories' import { BlockRelatedLinksData } from './../components/BlockRelatedLinks.stories.js' @@ -51,7 +50,6 @@ export const ContentPageData = { value: '

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vitae justo quis justo malesuada molestie. Cras sed tincidunt dui.

Integer imperdiet blandit neque vitae euismod. Nulla aliquet lacus nibh, vel tincidunt urna efficitur non. In et eros vitae ex posuere maximus quis eget urna. Suspendisse fringilla posuere velit sit amet posuere. Morbi malesuada bibendum vehicula. Donec faucibus ut erat ut mattis. Suspendisse ornare, quam at placerat cursus, dolor mi lacinia nunc, eget maximus augue nulla in dolor.

\n' }, - BlockTwitterEmbedData, BlockIframeEmbedData ], relatedLinks: [BlockRelatedLinksData.data], @@ -71,7 +69,7 @@ export const ContentPageData = { label: 'Mission', thumbnailImage: { src: { - url: 'https://source.unsplash.com/NuE8Nu3otjo/512x288', + url: 'https://picsum.photos/512/288', width: 512, height: 288 } @@ -85,13 +83,6 @@ export const ContentPageData = { clearanceNumber: 'CL#12345' } -// template -// const PageContentTemplate = (args) => ({ -// props: Object.keys(args), -// components: { PageContent }, -// template: `` -// }) - // stories export const Template = { name: 'PageContent', diff --git a/apps/vue-storybook/stories/templates/PageEventDetail.stories.js b/apps/vue-storybook/stories/templates/PageEventDetail.stories.js new file mode 100644 index 00000000..2ef46cd7 --- /dev/null +++ b/apps/vue-storybook/stories/templates/PageEventDetail.stories.js @@ -0,0 +1,104 @@ +import { BlockKeyPointsData } from './../components/BlockKeyPoints.stories' +import { EventDetailHeroData } from './../components/EventDetailHero.stories' +import { EventsBlockLinkCarouselData } from './../components/BlockLinkCarousel.stories' +import PageEventDetail from '@explorer-1/vue/src/templates/PageEventDetail.vue' + +export default { + title: 'Templates/PageEventDetail', + component: PageEventDetail, + decorators: [ + () => ({ + template: `
` + }) + ], + parameters: { + html: { + root: '#storyDecorator' + }, + viewMode: 'canvas' + }, + excludeStories: /.*Data$/ +} + +// stories +export const EventDetail = { + args: { + data: { + id: '285', + title: 'Becoming a nasa engineer', + slug: 'becoming-a-nasa-engineer', + url: '/events/becoming-a-nasa-engineer', + startDate: '2022-01-23', + startDatetime: '2022-01-23T17:00:00-08:00', + startTime: '17:00:00', + endDate: '2022-01-25', + endDatetime: '2022-01-25T23:00:00-08:00', + endTime: '23:00:00', + isAllDay: false, + timezone: 'PST', + label: 'Events', + location: 'Webcast', + registerLink: [], + heroImage: { + ...EventDetailHeroData.heroImage + }, + thumbnailImage: { + alt: '', + original: 'https://source.unsplash.com/OLlj17tUZnU/512x288' + }, + body: [ + BlockKeyPointsData, + { + blockType: 'RichTextBlock', + value: + '

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vitae justo quis justo malesuada molestie. Cras sed tincidunt dui.

Integer imperdiet blandit neque vitae euismod. Nulla aliquet lacus nibh, vel tincidunt urna efficitur non. In et eros vitae ex posuere maximus quis eget urna. Suspendisse fringilla posuere velit sit amet posuere. Morbi malesuada bibendum vehicula. Donec faucibus ut erat ut mattis. Suspendisse ornare, quam at placerat cursus, dolor mi lacinia nunc, eget maximus augue nulla in dolor.

\n' + } + ], + moreEvents: [...EventsBlockLinkCarouselData], + speakers: [ + { + host: 'host', + id: '1', + internalLink: null, + name: 'Varoujan Gorjian', + title: 'Splitzer Research Scientest, JPL' + }, + { + host: 'co-host', + id: '2', + image: { + alt: '', + src: { + height: '450', + url: 'https://picsum.photos/560/560', + width: '450' + } + }, + internalLink: null, + name: 'Robert Hurt', + title: 'Splitzer visualisation' + } + ], + relatedLinks: [ + { + blockType: 'RelatedLinksBlock', + heading: 'Webcast', + links: [ + { + document: null, + externalLink: 'http://www.google.com', + page: null, + text: 'Watch the event live on YouTube' + }, + { + document: null, + externalLink: 'http://www.google.com', + page: null, + text: 'Watch the event live on Ustream' + } + ] + } + ] + } + } +} diff --git a/apps/vue-storybook/stories/templates/PageListingIndex.stories.js b/apps/vue-storybook/stories/templates/PageListingIndex.stories.js new file mode 100644 index 00000000..b33d5637 --- /dev/null +++ b/apps/vue-storybook/stories/templates/PageListingIndex.stories.js @@ -0,0 +1,160 @@ +import videoMp4 from '@explorer-1/common-storybook/src/videos/NASA-Mars-Helicopter-IngenuityAnimations-7sec.mp4' +import videoWebm from '@explorer-1/common-storybook/src/videos/NASA-Mars-Helicopter-IngenuityAnimations-7sec.webm' +import PageListingIndex from '@explorer-1/vue/src/templates/PageListingIndex.vue' + +export default { + title: 'Templates/PageListingIndex', + component: PageListingIndex, + decorators: [ + () => ({ + template: `
The rest of the page goes here (searchHelpers mixin)
` + }) + ], + parameters: { + html: { + root: '#storyDecorator' + }, + viewMode: 'canvas' + }, + excludeStories: /.*Data$/ +} + +// data +export const PageListingIndexData = { + listingPage: { + featured: { + url: '/news/new-maps-open-roads-to-research/', + title: 'Creating Robots to go Where Humans Can’t', + image: { + src: { + url: 'https://picsum.photos/id/973/1800/1200', + width: 1800, + height: 1200 + }, + srcSet: + 'https://picsum.photos/id/865/768/548 768w, https://picsum.photos/id/865/1024/684 1024w, https://picsum.photos/id/865/1440/770 1440w, https://picsum.photos/id/865/1800/963 1800w', + screenMd: { + url: 'https://picsum.photos/id/921/800/640' + }, + screenSm: { + url: 'https://picsum.photos/id/247/640/900' + } + } + } + } +} + +// templates + +export const Default = { + args: { + customLabel: 'Featured', + pageData: PageListingIndexData.listingPage + } +} + +export const NewsImageHero = { + args: { + customLabel: 'Featured', + pageData: { + featured: { + url: '/news/new-maps-open-roads-to-research/', + title: 'Creating Robots to go Where Humans Can’t', + heroBlocks: [ + { + blockType: 'ImageChooserBlock', + image: { + src: { + url: 'https://picsum.photos/id/973/1800/1200', + width: 1800, + height: 1200 + }, + srcSet: + 'https://picsum.photos/id/865/768/548 768w, https://picsum.photos/id/865/1024/684 1024w, https://picsum.photos/id/865/1440/770 1440w, https://picsum.photos/id/865/1800/963 1800w', + screenMd: { + url: 'https://picsum.photos/id/921/800/640' + }, + screenSm: { + url: 'https://picsum.photos/id/247/640/900' + } + } + } + ] + } + } + } +} + +export const NewsVideoHero = { + args: { + customLabel: 'Featured', + pageData: { + featured: { + url: '/news/new-maps-open-roads-to-research/', + title: 'Creating Robots to go Where Humans Can’t', + heroBlocks: [ + { + blockType: 'VideoBlock', + video: { + file: videoMp4, + fileWebm: videoWebm + } + } + ] + } + } + } +} + +export const NewsCarouselHero = { + args: { + customLabel: 'Featured', + pageData: { + featured: { + url: '/news/new-maps-open-roads-to-research/', + title: 'Creating Robots to go Where Humans Can’t', + heroBlocks: [ + { + blockType: 'CarouselBlock', + blocks: [ + { + image: { + src: { + url: 'https://picsum.photos/id/973/1800/1200', + width: 1800, + height: 1200 + }, + srcSet: + 'https://picsum.photos/id/865/768/548 768w, https://picsum.photos/id/865/1024/684 1024w, https://picsum.photos/id/865/1440/770 1440w, https://picsum.photos/id/865/1800/963 1800w', + screenMd: { + url: 'https://picsum.photos/id/921/800/640' + }, + screenSm: { + url: 'https://picsum.photos/id/247/640/900' + } + } + }, + { + image: { + src: { + url: 'https://picsum.photos/id/973/1800/1200', + width: 1800, + height: 1200 + }, + srcSet: + 'https://picsum.photos/id/865/768/548 768w, https://picsum.photos/id/865/1024/684 1024w, https://picsum.photos/id/865/1440/770 1440w, https://picsum.photos/id/865/1800/963 1800w', + screenMd: { + url: 'https://picsum.photos/id/921/800/640' + }, + screenSm: { + url: 'https://picsum.photos/id/247/640/900' + } + } + } + ] + } + ] + } + } + } +} diff --git a/apps/vue-storybook/tailwind.config.ts b/apps/vue-storybook/tailwind.config.ts index 3678332f..8ca280f8 100644 --- a/apps/vue-storybook/tailwind.config.ts +++ b/apps/vue-storybook/tailwind.config.ts @@ -10,5 +10,10 @@ import explorer1Config from '@explorer-1/common/tailwind.config' export default { ...explorer1Config, - content: ['stories/**/*', './node_modules/@explorer-1/vue/src/components/**/*.vue'] + content: [ + 'stories/**/*', + 'docs/**/*', + './node_modules/@explorer-1/vue/src/components/**/*.vue', + './node_modules/@explorer-1/vue/src/templates/**/*.vue' + ] } diff --git a/packages/common/package.json b/packages/common/package.json index 553b94e9..0b7b461e 100644 --- a/packages/common/package.json +++ b/packages/common/package.json @@ -11,5 +11,8 @@ "stylelint": "^16.5.0", "stylelint-config-standard-scss": "^13.1.0", "tailwindcss": "^3.4.3" + }, + "dependencies": { + "tailwindcss-themer": "^4.0.0" } } diff --git a/packages/common/src/images/jpg/bg-stars.jpg b/packages/common/src/images/jpg/bg-stars.jpg deleted file mode 100644 index ab125cba..00000000 Binary files a/packages/common/src/images/jpg/bg-stars.jpg and /dev/null differ diff --git a/packages/common/src/public/explorer-1/bg-stars-edu.png b/packages/common/src/public/explorer-1/bg-stars-edu.png new file mode 100644 index 00000000..cae5ab65 Binary files /dev/null and b/packages/common/src/public/explorer-1/bg-stars-edu.png differ diff --git a/packages/common/src/images/jpg/bg-stars-muted.jpg b/packages/common/src/public/explorer-1/bg-stars.jpg similarity index 100% rename from packages/common/src/images/jpg/bg-stars-muted.jpg rename to packages/common/src/public/explorer-1/bg-stars.jpg diff --git a/packages/common/src/scss/_typography.scss b/packages/common/src/scss/_typography.scss index e47a6eac..e2c2464f 100644 --- a/packages/common/src/scss/_typography.scss +++ b/packages/common/src/scss/_typography.scss @@ -25,7 +25,7 @@ /* stylelint-disable at-rule-empty-line-before, declaration-empty-line-before */ .text-h1-alt { - @apply font-bold tracking-tighter; + @apply font-bold tracking-tighter edu:font-extrabold; font-size: pxToRem(45); line-height: 1; @@ -46,7 +46,7 @@ h1, .text-h1 { - @apply font-medium tracking-tighter; + @apply font-medium edu:font-extrabold tracking-tighter; font-size: pxToRem(42); line-height: 1.15; @@ -67,7 +67,7 @@ h2, .text-h2 { - @apply font-medium tracking-tight; + @apply font-medium edu:font-extrabold tracking-tight; font-size: pxToRem(36); line-height: 1.25; @@ -88,7 +88,7 @@ h3, .text-h3 { - @apply font-medium tracking-tight; + @apply font-medium edu:font-extrabold tracking-tight; font-size: pxToRem(27); line-height: 1.25; @@ -110,7 +110,7 @@ h4, .text-h4 { // tracking-normal set explicitly to override tighter tracking when an h1, h2, or h3 is used with .text-h4 - @apply font-medium tracking-normal; + @apply font-medium edu:font-extrabold tracking-normal; font-size: pxToRem(22); line-height: 1.25; @@ -132,7 +132,7 @@ h5, .text-h5 { // tracking-normal set explicitly to override tighter tracking when an h1, h2, or h3 is used with .text-h5 - @apply font-medium tracking-normal; + @apply font-medium edu:font-extrabold tracking-normal; font-size: pxToRem(20); line-height: 1.25; @@ -153,7 +153,7 @@ h6, .text-h6 { // tracking-normal set explicitly to override tighter tracking when an h1, h2, or h3 is used with .text-h6 - @apply font-bold tracking-normal; + @apply font-bold edu:font-bold tracking-normal; font-size: pxToRem(18); line-height: 1.6667; diff --git a/packages/common/src/scss/components/_BaseButton.scss b/packages/common/src/scss/components/_BaseButton.scss index 525275cc..dc6be944 100644 --- a/packages/common/src/scss/components/_BaseButton.scss +++ b/packages/common/src/scss/components/_BaseButton.scss @@ -25,6 +25,17 @@ } } + &.-reverse-primary { + @apply px-12 text-primary bg-white to-primary-dark-w50; + + @include hover { + @apply text-white; + } + & > .label { + @apply border-2 border-transparent; + } + } + &.-secondary { @apply px-12 bg-transparent text-action border-2 border-action to-action-dark-w50; @@ -37,7 +48,7 @@ @apply px-12 bg-transparent text-white border border-white/40 to-white-w50; @include hover { - @apply text-dark-blue border-white bg-white; + @apply text-dark-blue edu:text-primary-dark border-white bg-white; } } diff --git a/packages/common/src/scss/components/_BlockQuote.scss b/packages/common/src/scss/components/_BlockQuote.scss index 427da6cb..71e27a5a 100644 --- a/packages/common/src/scss/components/_BlockQuote.scss +++ b/packages/common/src/scss/components/_BlockQuote.scss @@ -17,7 +17,7 @@ > hr { max-width: 100px; - @apply border-t mx-auto border-emphasis-light; + @apply border-t mx-auto border-primary-light; @screen lg { max-width: 120px; @@ -26,7 +26,7 @@ > .quote { line-height: 1.4; // custom - @apply font-primary italic text-xl font-medium py-4 text-emphasis; + @apply font-primary italic text-xl font-medium py-4 text-primary edu:font-extrabold; @screen lg { font-size: 1.875rem; // custom // 30px @@ -51,11 +51,11 @@ .ThemeVariantLight { .BlockQuote { > hr { - @apply border-emphasis; + @apply border-primary; } > .quote { - @apply text-emphasis; + @apply text-primary; } > div > div > .attribution-text { diff --git a/packages/common/src/scss/styles.scss b/packages/common/src/scss/styles.scss index e117ed9c..a1d14597 100644 --- a/packages/common/src/scss/styles.scss +++ b/packages/common/src/scss/styles.scss @@ -5,6 +5,12 @@ @tailwind components; @tailwind utilities; +@layer base { + .bg-stars { + @apply bg-star-pattern bg-cover bg-top; + } +} + // vendors / node_modules @import 'vendors'; @@ -20,3 +26,4 @@ // components @import 'components'; + diff --git a/packages/common/tailwind.colors.ts b/packages/common/tailwind.colors.ts index e493463e..9cf4d344 100644 --- a/packages/common/tailwind.colors.ts +++ b/packages/common/tailwind.colors.ts @@ -1,10 +1,34 @@ // Dedicated file for managing tailwind theme colors +export const jplRed = { + lighter: '#E73B54', + light: '#E73B54', + base: '#E31937', + dark: '#C1152E', + darker: '#5C0411' +} + +export const jplTeal = { + lighter: '#99D1DF', + light: '#4BA7BE', + base: '#10829E', + dark: '#006077', + darker: '#004050' +} + +export const jplViolet = { + lighter: '#C4AAF6', + light: '#905FEC', + base: '#6019E3', + dark: '#3C00AB', + darker: '#280073' +} + export const foundationColors = { - 'jpl-red': '#E31937', - 'jpl-red-light': '#E73B54', - 'jpl-red-dark': '#C1152E', - 'jpl-red-darker': '#5C0411', + 'jpl-red-light': jplRed.light, + 'jpl-red': jplRed.base, + 'jpl-red-dark': jplRed.dark, + 'jpl-red-darker': jplRed.darker, 'jpl-aqua': '#489FDF', blue: '#8BCBFA', 'dark-blue': '#004562', @@ -12,22 +36,21 @@ export const foundationColors = { } export const internalColors = { - 'jpl-sky-blue': '#0080A4', // TODO: update with different color - 'jpl-sky-blue-light': '#00a0cc', // TODO: update with different color - 'jpl-sky-blue-dark': '#006480', // TODO: update with different color - 'jpl-sky-blue-darker': '#003c4d' // TODO: update with different color + 'jpl-sky-blue-light': jplTeal.light, + 'jpl-sky-blue': jplTeal.base, + 'jpl-sky-blue-dark': jplTeal.dark, + 'jpl-sky-blue-darker': jplTeal.darker } export const eduColors = { - 'edu-purple': '#9438E0', - 'edu-purple-light': '#A85EE6', - 'edu-purple-dark': '#741EBB', - 'edu-purple-darker': '#33283D', - 'edu-teal': '#007E99', - 'edu-teal-light': '#00a7cc', // TODO: update with different color - 'edu-teal-dark': '#005366', // TODO: update with different color - 'edu-teal-darker': '#002a33', // TODO: update with different color - 'edu-peach': '#FF5555' + 'jpl-purple-light': jplViolet.light, + 'jpl-purple': jplViolet.base, + 'jpl-purple-dark': jplViolet.dark, + 'jpl-purple-darker': jplViolet.darker, + 'jpl-teal-light': jplTeal.light, + 'jpl-teal': jplTeal.base, + 'jpl-teal-dark': jplTeal.dark, + 'jpl-teal-darker': jplTeal.darker } export const semanticColors = { @@ -63,77 +86,98 @@ export const socialColors = { // custom css vars export const themeVariantColors = { + primary: 'var(--color-primary)', + 'primary-light': 'var(--color-primary-light)', + 'primary-dark': 'var(--color-primary-dark)', + 'primary-darker': 'var(--color-primary-darker)', + 'primary-hover': 'var(--color-primary-dark)', + secondary: 'var(--color-secondary)', + 'secondary-light': 'var(--color-secondary-light)', + 'secondary-dark': 'var(--color-secondary-dark)', + 'secondary-darker': 'var(--color-secondary-darker)', + 'secondary-hover': 'var(--color-secondary-dark)', action: 'var(--color-action)', 'action-light': 'var(--color-action-light)', 'action-dark': 'var(--color-action-dark)', 'action-darker': 'var(--color-action-darker)', - 'action-hover': 'var(--color-action-dark)', - emphasis: 'var(--color-emphasis)', - 'emphasis-light': 'var(--color-emphasis-light)', - 'emphasis-dark': 'var(--color-emphasis-dark)', - 'emphasis-darker': 'var(--color-emphasis-darker)', - 'emphasis-hover': 'var(--color-emphasis-dark)' + 'action-hover': 'var(--color-action-dark)' } // www default export const ThemeWww = { default: { - '--color-action': foundationColors['jpl-red'], - '--color-action-light': foundationColors['jpl-red-light'], - '--color-action-dark': foundationColors['jpl-red-dark'], - '--color-action-darker': foundationColors['jpl-red-darker'], - '--color-emphasis': 'var(--color-action)', - '--color-emphasis-light': 'var(--color-action-light)', - '--color-emphasis-dark': 'var(--color-action-dark)', - '--color-emphasis-darker': 'var(--color-action-darker)' + '--color-primary': foundationColors['jpl-red'], + '--color-primary-light': foundationColors['jpl-red-light'], + '--color-primary-dark': foundationColors['jpl-red-dark'], + '--color-primary-darker': foundationColors['jpl-red-darker'], + '--color-secondary': 'var(--color-primary)', + '--color-secondary-light': 'var(--color-primary-light)', + '--color-secondary-dark': 'var(--color-primary-dark)', + '--color-secondary-darker': 'var(--color-primary-darker)', + '--color-action': 'var(--color-primary)', + '--color-action-light': 'var(--color-primary-light)', + '--color-action-dark': 'var(--color-primary-dark)', + '--color-action-darker': 'var(--color-primary-darker)' }, dark: { - '--color-action': foundationColors['jpl-red-light'], - '--color-action-light': foundationColors['jpl-red-light'], - '--color-action-dark': foundationColors['jpl-red'], - '--color-action-darker': foundationColors['jpl-red-dark'] + '--color-primary': foundationColors['jpl-red-light'], + '--color-primary-light': foundationColors['jpl-red-light'], + '--color-primary-dark': foundationColors['jpl-red'], + '--color-primary-darker': foundationColors['jpl-red-dark'] } } export const ThemeEdu = { default: { - '--color-action': eduColors['edu-teal'], - '--color-action-light': eduColors['edu-teal-light'], - '--color-action-dark': eduColors['edu-teal-dark'], - '--color-action-darker': eduColors['edu-teal-darker'], - '--color-emphasis': eduColors['edu-purple'], - '--color-emphasis-light': eduColors['edu-purple-light'], - '--color-emphasis-dark': eduColors['edu-purple-dark'], - '--color-emphasis-darker': eduColors['edu-purple-darker'] + '--color-primary': eduColors['jpl-purple'], + '--color-primary-light': eduColors['jpl-purple-light'], + '--color-primary-dark': eduColors['jpl-purple-dark'], + '--color-primary-darker': eduColors['jpl-purple-darker'], + '--color-secondary': foundationColors['jpl-red'], + '--color-secondary-light': foundationColors['jpl-red-light'], + '--color-secondary-dark': foundationColors['jpl-red-dark'], + '--color-secondary-darker': foundationColors['jpl-red-darker'], + '--color-action': eduColors['jpl-teal'], + '--color-action-light': eduColors['jpl-teal-light'], + '--color-action-dark': eduColors['jpl-teal-dark'], + '--color-action-darker': eduColors['jpl-teal-darker'] }, dark: { - '--color-action': eduColors['edu-teal-light'], - '--color-action-light': eduColors['edu-teal-light'], - '--color-action-dark': eduColors['edu-teal'], - '--color-action-darker': eduColors['edu-teal-dark'], - '--color-emphasis': eduColors['edu-purple-light'], - '--color-emphasis-light': eduColors['edu-purple-light'], - '--color-emphasis-dark': eduColors['edu-purple'], - '--color-emphasis-darker': eduColors['edu-purple-dark'] + '--color-primary': eduColors['jpl-purple-light'], + '--color-primary-light': eduColors['jpl-purple-light'], + '--color-primary-dark': eduColors['jpl-purple'], + '--color-primary-darker': eduColors['jpl-purple-dark'], + '--color-secondary': foundationColors['jpl-red-light'], + '--color-secondary-light': foundationColors['jpl-red-light'], + '--color-secondary-dark': foundationColors['jpl-red'], + '--color-secondary-darker': foundationColors['jpl-red-dark'], + '--color-action': eduColors['jpl-teal-light'], + '--color-action-light': eduColors['jpl-teal-light'], + '--color-action-dark': eduColors['jpl-teal'], + '--color-action-darker': eduColors['jpl-teal-dark'] } } export const ThemeInternal = { default: { - '--color-action': internalColors['jpl-sky-blue'], - '--color-action-light': internalColors['jpl-sky-blue-light'], - '--color-action-dark': internalColors['jpl-sky-blue-dark'], - '--color-action-darker': internalColors['jpl-sky-blue-darker'], - '--color-emphasis': 'var(--color-action)', - '--color-emphasis-light': 'var(--color-action-light)', - '--color-emphasis-dark': 'var(--color-action-dark)', - '--color-emphasis-darker': 'var(--color-action-darker)' + '--color-primary': internalColors['jpl-sky-blue'], + '--color-primary-light': internalColors['jpl-sky-blue-light'], + '--color-primary-dark': internalColors['jpl-sky-blue-dark'], + '--color-primary-darker': internalColors['jpl-sky-blue-darker'], + '--color-secondary': 'var(--color-primary)', + '--color-secondary-light': 'var(--color-primary-light)', + '--color-secondary-dark': 'var(--color-primary-dark)', + '--color-secondary-darker': 'var(--color-primary-darker)', + '--color-action': 'var(--color-primary)', + '--color-action-light': 'var(--color-primary-light)', + '--color-action-dark': 'var(--color-primary-dark)', + '--color-action-darker': 'var(--color-primary-darker)' }, dark: { - '--color-action': internalColors['jpl-sky-blue-light'], - '--color-action-light': internalColors['jpl-sky-blue-light'], - '--color-action-dark': internalColors['jpl-sky-blue'], - '--color-action-darker': internalColors['jpl-sky-blue-dark'] + '--color-primary': internalColors['jpl-sky-blue-light'], + '--color-primary-light': internalColors['jpl-sky-blue-light'], + '--color-primary-dark': internalColors['jpl-sky-blue'], + '--color-primary-darker': internalColors['jpl-sky-blue-dark'] } } diff --git a/packages/common/tailwind.config.ts b/packages/common/tailwind.config.ts index ea4c706c..882c2c9a 100644 --- a/packages/common/tailwind.config.ts +++ b/packages/common/tailwind.config.ts @@ -3,12 +3,14 @@ import type { CustomThemeConfig } from 'tailwindcss/types/config' import plugin from 'tailwindcss/plugin' import themeColors, { foundationColors, + internalColors, grayScaleColors, socialColors, ThemeWww, ThemeEdu, ThemeInternal } from './tailwind.colors' + /* ** TailwindCSS Configuration File ** @@ -135,8 +137,8 @@ const defaultTheme: Partial = { 'jpl-red-dark-w50': foundationColors['jpl-red-dark'] + ' 50%', 'jpl-red-darker-w50': foundationColors['jpl-red-darker'] + ' 50%', 'jpl-red-light-w50': foundationColors['jpl-red-light'] + ' 50%', - 'jpl-sky-blue-w50': foundationColors['jpl-sky-blue'] + ' 50%', - 'jpl-sky-blue-dark-w50': foundationColors['jpl-sky-blue-dark'] + ' 50%', + 'jpl-sky-blue-w50': internalColors['jpl-sky-blue'] + ' 50%', + 'jpl-sky-blue-dark-w50': internalColors['jpl-sky-blue-dark'] + ' 50%', 'white-w50': grayScaleColors.white + ' 50%', 'gray-dark-w50': grayScaleColors['gray-dark'] + ' 50%', 'facebook-w50': socialColors.facebook + ' 50%', @@ -149,6 +151,14 @@ const defaultTheme: Partial = { 'transparent-black-50': 'rgba(0 0 0 / 50%)', 'transparent-black-25': 'rgba(0 0 0 / 25%)', 'transparent-black-25-w50': 'rgba(0 0 0 / 25%) 50%', + 'primary-w50': 'var(--color-primary)' + ' 50%', + 'primary-dark-w50': 'var(--color-primary-dark)' + ' 50%', + 'primary-darker-w50': 'var(--color-primary-darker)' + ' 50%', + 'primary-light-w50': 'var(--color-primary-light)' + ' 50%', + 'secondary-w50': 'var(--color-secondary)' + ' 50%', + 'secondary-dark-w50': 'var(--color-secondary-dark)' + ' 50%', + 'secondary-darker-w50': 'var(--color-secondary-darker)' + ' 50%', + 'secondary-light-w50': 'var(--color-secondary-light)' + ' 50%', 'action-w50': 'var(--color-action)' + ' 50%', 'action-dark-w50': 'var(--color-action-dark)' + ' 50%', 'action-darker-w50': 'var(--color-action-darker)' + ' 50%', @@ -285,6 +295,36 @@ export default { ThemeInternal.default, '.ThemeInternal .ThemeVariantDark, .ThemeInternal.ThemeVariantDark': ThemeInternal.dark }) + }), + require('tailwindcss-themer')({ + defaultTheme: { + extend: { + backgroundImage: { + 'star-pattern': 'url(/explorer-1/bg-stars.jpg)' + } + } + }, + themes: [ + { + name: 'edu', + selectors: ['.ThemeEdu'], + extend: { + backgroundImage: { + // TODO: would prefer to not hardcode the /edu/ path here + 'star-pattern': 'url(/edu/explorer-1/bg-stars-edu.png)' + } + } + }, + { + name: 'internal', + selectors: ['.ThemeInternal'], + extend: { + backgroundImage: { + 'star-pattern': 'url(/explorer-1/bg-stars.jpg)' + } + } + } + ] }) ], future: { diff --git a/packages/html/dist/assets/css/explorer-1.min.css b/packages/html/dist/assets/css/explorer-1.min.css index 6c89ef33..c3bf60d4 100644 --- a/packages/html/dist/assets/css/explorer-1.min.css +++ b/packages/html/dist/assets/css/explorer-1.min.css @@ -1,8946 +1,2 @@ -@charset "UTF-8"; -.carousel { - position: relative; - box-sizing: border-box; -} -.carousel *, -.carousel *:before, -.carousel *:after { - box-sizing: inherit; -} -.carousel.is-draggable { - cursor: move; - cursor: grab; -} -.carousel.is-dragging { - cursor: move; - cursor: grabbing; -} -.carousel__viewport { - position: relative; - overflow: hidden; - max-width: 100%; - max-height: 100%; -} -.carousel__track { - display: flex; -} -.carousel__slide { - flex: 0 0 auto; - width: var(--carousel-slide-width, 60%); - max-width: 100%; - padding: 1rem; - position: relative; - overflow-x: hidden; - overflow-y: auto; - overscroll-behavior: contain; -} -.has-dots { - margin-bottom: calc(0.5rem + 22px); -} -.carousel__dots { - margin: 0 auto; - padding: 0; - position: absolute; - top: calc(100% + 0.5rem); - left: 0; - right: 0; - display: flex; - justify-content: center; - list-style: none; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; -} -.carousel__dots .carousel__dot { - margin: 0; - padding: 0; - display: block; - position: relative; - width: 22px; - height: 22px; - cursor: pointer; -} -.carousel__dots .carousel__dot:after { - content: ''; - width: 8px; - height: 8px; - border-radius: 50%; - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - background-color: currentColor; - opacity: 0.25; - transition: opacity 0.15s ease-in-out; -} -.carousel__dots .carousel__dot.is-selected:after { - opacity: 1; -} -.carousel__button { - width: var(--carousel-button-width, 48px); - height: var(--carousel-button-height, 48px); - padding: 0; - border: 0; - display: flex; - justify-content: center; - align-items: center; - pointer-events: all; - cursor: pointer; - color: var(--carousel-button-color, currentColor); - background: var(--carousel-button-bg, transparent); - border-radius: var(--carousel-button-border-radius, 50%); - box-shadow: var(--carousel-button-shadow, none); - transition: opacity 0.15s ease; -} -.carousel__button.is-prev, -.carousel__button.is-next { - position: absolute; - top: 50%; - transform: translateY(-50%); -} -.carousel__button.is-prev { - left: 10px; -} -.carousel__button.is-next { - right: 10px; -} -.carousel__button[disabled] { - cursor: default; - opacity: 0.3; -} -.carousel__button svg { - width: var(--carousel-button-svg-width, 50%); - height: var(--carousel-button-svg-height, 50%); - fill: none; - stroke: currentColor; - stroke-width: var(--carousel-button-svg-stroke-width, 1.5); - stroke-linejoin: bevel; - stroke-linecap: round; - filter: var(--carousel-button-svg-filter, none); - pointer-events: none; -} -html.with-fancybox { - scroll-behavior: auto; -} -body.compensate-for-scrollbar { - overflow: hidden !important; - touch-action: none; -} -.fancybox__container { - position: fixed; - top: 0; - left: 0; - bottom: 0; - right: 0; - direction: ltr; - margin: 0; - padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) - env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px); - box-sizing: border-box; - display: flex; - flex-direction: column; - color: var(--fancybox-color, #fff); - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); - overflow: hidden; - z-index: 1050; - outline: none; - transform-origin: top left; - --carousel-button-width: 48px; - --carousel-button-height: 48px; - --carousel-button-svg-width: 24px; - --carousel-button-svg-height: 24px; - --carousel-button-svg-stroke-width: 2.5; - --carousel-button-svg-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.4)); -} -.fancybox__container *, -.fancybox__container *:before, -.fancybox__container *:after { - box-sizing: inherit; -} -.fancybox__container :focus { - outline: none; -} -body:not(.is-using-mouse) .fancybox__container :focus { - box-shadow: - 0 0 0 1px #fff, - 0 0 0 2px var(--fancybox-accent-color, rgba(1, 210, 232, 0.94)); -} -@media all and (min-width: 1024px) { - .fancybox__container { - --carousel-button-width: 48px; - --carousel-button-height: 48px; - --carousel-button-svg-width: 27px; - --carousel-button-svg-height: 27px; - } -} -.fancybox__backdrop { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: -1; - background: var(--fancybox-bg, rgba(24, 24, 27, 0.92)); -} -.fancybox__carousel { - position: relative; - flex: 1 1 auto; - min-height: 0; - height: 100%; - z-index: 10; -} -.fancybox__carousel.has-dots { - margin-bottom: calc(0.5rem + 22px); -} -.fancybox__viewport { - position: relative; - width: 100%; - height: 100%; - overflow: visible; - cursor: default; -} -.fancybox__track { - display: flex; - height: 100%; -} -.fancybox__slide { - flex: 0 0 auto; - width: 100%; - max-width: 100%; - margin: 0; - padding: 48px 8px 8px; - position: relative; - overscroll-behavior: contain; - display: flex; - flex-direction: column; - outline: 0; - overflow: auto; - --carousel-button-width: 36px; - --carousel-button-height: 36px; - --carousel-button-svg-width: 22px; - --carousel-button-svg-height: 22px; -} -.fancybox__slide:before, -.fancybox__slide:after { - content: ''; - flex: 0 0 0; - margin: auto; -} -@media all and (min-width: 1024px) { - .fancybox__slide { - padding: 64px 100px; - } -} -.fancybox__content { - margin: 0 env(safe-area-inset-right, 0px) 0 env(safe-area-inset-left, 0px); - padding: 36px; - color: var(--fancybox-content-color, #374151); - background: var(--fancybox-content-bg, #fff); - position: relative; - align-self: center; - display: flex; - flex-direction: column; - z-index: 20; -} -.fancybox__content :focus:not(.carousel__button.is-close) { - outline: thin dotted; - box-shadow: none; -} -.fancybox__caption { - align-self: center; - max-width: 100%; - margin: 0; - padding: 1rem 0 0; - line-height: 1.375; - color: var(--fancybox-color, currentColor); - visibility: visible; - cursor: auto; - flex-shrink: 0; - overflow-wrap: anywhere; -} -.is-loading .fancybox__caption { - visibility: hidden; -} -.fancybox__container > .carousel__dots { - top: 100%; - color: var(--fancybox-color, #fff); -} -.fancybox__nav .carousel__button { - z-index: 40; -} -.fancybox__nav .carousel__button.is-next { - right: 8px; -} -@media all and (min-width: 1024px) { - .fancybox__nav .carousel__button.is-next { - right: 40px; - } -} -.fancybox__nav .carousel__button.is-prev { - left: 8px; -} -@media all and (min-width: 1024px) { - .fancybox__nav .carousel__button.is-prev { - left: 40px; - } -} -.carousel__button.is-close { - position: absolute; - top: 8px; - right: 8px; - top: calc(env(safe-area-inset-top, 0px) + 8px); - right: calc(env(safe-area-inset-right, 0px) + 8px); - z-index: 40; -} -@media all and (min-width: 1024px) { - .carousel__button.is-close { - right: 40px; - } -} -.fancybox__content > .carousel__button.is-close { - position: absolute; - top: -40px; - right: 0; - color: var(--fancybox-color, #fff); -} -.fancybox__no-click, -.fancybox__no-click button { - pointer-events: none; -} -.fancybox__spinner { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - width: 50px; - height: 50px; - color: var(--fancybox-color, currentColor); -} -.fancybox__slide .fancybox__spinner { - cursor: pointer; - z-index: 1053; -} -.fancybox__spinner svg { - animation: fancybox-rotate 2s linear infinite; - transform-origin: center center; - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - margin: auto; - width: 100%; - height: 100%; -} -.fancybox__spinner svg circle { - fill: none; - stroke-width: 2.75; - stroke-miterlimit: 10; - stroke-dasharray: 1, 200; - stroke-dashoffset: 0; - animation: fancybox-dash 1.5s ease-in-out infinite; - stroke-linecap: round; - stroke: currentColor; -} -@keyframes fancybox-rotate { - to { - transform: rotate(360deg); - } -} -@keyframes fancybox-dash { - 0% { - stroke-dasharray: 1, 200; - stroke-dashoffset: 0; - } - 50% { - stroke-dasharray: 89, 200; - stroke-dashoffset: -35px; - } - to { - stroke-dasharray: 89, 200; - stroke-dashoffset: -124px; - } -} -.fancybox__backdrop, -.fancybox__caption, -.fancybox__nav, -.carousel__dots, -.carousel__button.is-close { - opacity: var(--fancybox-opacity, 1); -} -.fancybox__container.is-animated[aria-hidden='false'] .fancybox__backdrop, -.fancybox__container.is-animated[aria-hidden='false'] .fancybox__caption, -.fancybox__container.is-animated[aria-hidden='false'] .fancybox__nav, -.fancybox__container.is-animated[aria-hidden='false'] .carousel__dots, -.fancybox__container.is-animated[aria-hidden='false'] .carousel__button.is-close { - animation: 0.15s ease backwards fancybox-fadeIn; -} -.fancybox__container.is-animated.is-closing .fancybox__backdrop, -.fancybox__container.is-animated.is-closing .fancybox__caption, -.fancybox__container.is-animated.is-closing .fancybox__nav, -.fancybox__container.is-animated.is-closing .carousel__dots, -.fancybox__container.is-animated.is-closing .carousel__button.is-close { - animation: 0.15s ease both fancybox-fadeOut; -} -.fancybox-fadeIn { - animation: 0.15s ease both fancybox-fadeIn; -} -.fancybox-fadeOut { - animation: 0.1s ease both fancybox-fadeOut; -} -.fancybox-zoomInUp { - animation: 0.2s ease both fancybox-zoomInUp; -} -.fancybox-zoomOutDown { - animation: 0.15s ease both fancybox-zoomOutDown; -} -.fancybox-throwOutUp { - animation: 0.15s ease both fancybox-throwOutUp; -} -.fancybox-throwOutDown { - animation: 0.15s ease both fancybox-throwOutDown; -} -@keyframes fancybox-fadeIn { - 0% { - opacity: 0; - } - to { - opacity: 1; - } -} -@keyframes fancybox-fadeOut { - to { - opacity: 0; - } -} -@keyframes fancybox-zoomInUp { - 0% { - transform: scale(0.97) translate3d(0, 16px, 0); - opacity: 0; - } - to { - transform: scale(1) translateZ(0); - opacity: 1; - } -} -@keyframes fancybox-zoomOutDown { - to { - transform: scale(0.97) translate3d(0, 16px, 0); - opacity: 0; - } -} -@keyframes fancybox-throwOutUp { - to { - transform: translate3d(0, -30%, 0); - opacity: 0; - } -} -@keyframes fancybox-throwOutDown { - to { - transform: translate3d(0, 30%, 0); - opacity: 0; - } -} -.fancybox__carousel .carousel__slide { - scrollbar-width: thin; - scrollbar-color: #ccc rgba(255, 255, 255, 0.1); -} -.fancybox__carousel .carousel__slide::-webkit-scrollbar { - width: 8px; - height: 8px; -} -.fancybox__carousel .carousel__slide::-webkit-scrollbar-track { - background-color: #ffffff1a; -} -.fancybox__carousel .carousel__slide::-webkit-scrollbar-thumb { - background-color: #ccc; - border-radius: 2px; - box-shadow: inset 0 0 4px #0003; -} -.fancybox__carousel.is-draggable .fancybox__slide, -.fancybox__carousel.is-draggable .fancybox__slide .fancybox__content { - cursor: move; - cursor: grab; -} -.fancybox__carousel.is-dragging .fancybox__slide, -.fancybox__carousel.is-dragging .fancybox__slide .fancybox__content { - cursor: move; - cursor: grabbing; -} -.fancybox__carousel .fancybox__slide .fancybox__content { - cursor: auto; -} -.fancybox__carousel .fancybox__slide.can-zoom_in .fancybox__content { - cursor: zoom-in; -} -.fancybox__carousel .fancybox__slide.can-zoom_out .fancybox__content { - cursor: zoom-out; -} -.fancybox__carousel .fancybox__slide.is-draggable .fancybox__content { - cursor: move; - cursor: grab; -} -.fancybox__carousel .fancybox__slide.is-dragging .fancybox__content { - cursor: move; - cursor: grabbing; -} -.fancybox__image { - transform-origin: 0 0; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; - transition: none; -} -.has-image .fancybox__content { - padding: 0; - background: #0000; - min-height: 1px; -} -.is-closing .has-image .fancybox__content { - overflow: visible; -} -.has-image[data-image-fit='contain'] { - overflow: visible; - touch-action: none; -} -.has-image[data-image-fit='contain'] .fancybox__content { - flex-direction: row; - flex-wrap: wrap; -} -.has-image[data-image-fit='contain'] .fancybox__image { - max-width: 100%; - max-height: 100%; - object-fit: contain; -} -.has-image[data-image-fit='contain-w'] { - overflow-x: hidden; - overflow-y: auto; -} -.has-image[data-image-fit='contain-w'] .fancybox__content { - min-height: auto; -} -.has-image[data-image-fit='contain-w'] .fancybox__image { - max-width: 100%; - height: auto; -} -.has-image[data-image-fit='cover'] { - overflow: visible; - touch-action: none; -} -.has-image[data-image-fit='cover'] .fancybox__content { - width: 100%; - height: 100%; -} -.has-image[data-image-fit='cover'] .fancybox__image { - width: 100%; - height: 100%; - object-fit: cover; -} -.fancybox__carousel .fancybox__slide.has-iframe .fancybox__content, -.fancybox__carousel .fancybox__slide.has-map .fancybox__content, -.fancybox__carousel .fancybox__slide.has-pdf .fancybox__content, -.fancybox__carousel .fancybox__slide.has-video .fancybox__content, -.fancybox__carousel .fancybox__slide.has-html5video .fancybox__content { - max-width: 100%; - flex-shrink: 1; - min-height: 1px; - overflow: visible; -} -.fancybox__carousel .fancybox__slide.has-iframe .fancybox__content, -.fancybox__carousel .fancybox__slide.has-map .fancybox__content, -.fancybox__carousel .fancybox__slide.has-pdf .fancybox__content { - width: 100%; - height: 80%; -} -.fancybox__carousel .fancybox__slide.has-video .fancybox__content, -.fancybox__carousel .fancybox__slide.has-html5video .fancybox__content { - width: 960px; - height: 540px; - max-width: 100%; - max-height: 100%; -} -.fancybox__carousel .fancybox__slide.has-map .fancybox__content, -.fancybox__carousel .fancybox__slide.has-pdf .fancybox__content, -.fancybox__carousel .fancybox__slide.has-video .fancybox__content, -.fancybox__carousel .fancybox__slide.has-html5video .fancybox__content { - padding: 0; - background: #18181be6; - color: #fff; -} -.fancybox__carousel .fancybox__slide.has-map .fancybox__content { - background: #e5e3df; -} -.fancybox__html5video, -.fancybox__iframe { - border: 0; - display: block; - height: 100%; - width: 100%; - background: #0000; -} -.fancybox-placeholder { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - clip: rect(0, 0, 0, 0); - white-space: nowrap; - border-width: 0; -} -.fancybox__thumbs { - flex: 0 0 auto; - position: relative; - padding: 0 3px; - opacity: var(--fancybox-opacity, 1); -} -.fancybox__container.is-animated[aria-hidden='false'] .fancybox__thumbs { - animation: 0.15s ease-in backwards fancybox-fadeIn; -} -.fancybox__container.is-animated.is-closing .fancybox__thumbs { - opacity: 0; -} -.fancybox__thumbs .carousel__slide { - flex: 0 0 auto; - width: var(--fancybox-thumbs-width, 96px); - margin: 0; - padding: 8px 3px; - box-sizing: content-box; - display: flex; - align-items: center; - justify-content: center; - overflow: visible; - cursor: pointer; -} -.fancybox__thumbs .carousel__slide .fancybox__thumb:after { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - border-width: 5px; - border-style: solid; - border-color: var(--fancybox-accent-color, rgba(34, 213, 233, 0.96)); - opacity: 0; - transition: opacity 0.15s ease; - border-radius: var(--fancybox-thumbs-border-radius, 4px); -} -.fancybox__thumbs .carousel__slide.is-nav-selected .fancybox__thumb:after { - opacity: 0.92; -} -.fancybox__thumbs .carousel__slide > * { - pointer-events: none; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; -} -.fancybox__thumb { - position: relative; - width: 100%; - padding-top: calc(100% / (var(--fancybox-thumbs-ratio, 1.5))); - background-size: cover; - background-position: center center; - background-color: #ffffff1a; - background-repeat: no-repeat; - border-radius: var(--fancybox-thumbs-border-radius, 4px); -} -.fancybox__toolbar { - position: absolute; - top: 0; - right: 0; - left: 0; - z-index: 20; - background: linear-gradient( - to top, - #0000, - #00000002 8.1%, - #00000005 15.5%, - #0000000c 22.5%, - #00000014 29%, - #0000001d 35.3%, - #00000028, - #00000032 47.1%, - #0000003e 52.9%, - #00000049, - #00000053 64.7%, - #0000005d 71%, - #00000064 77.5%, - #0000006b 84.5%, - #0000006f 91.9%, - #00000070 - ); - padding: 0; - touch-action: none; - display: flex; - justify-content: space-between; - --carousel-button-svg-width: 20px; - --carousel-button-svg-height: 20px; - opacity: var(--fancybox-opacity, 1); - text-shadow: var(--fancybox-toolbar-text-shadow, 1px 1px 1px rgba(0, 0, 0, 0.4)); -} -@media all and (min-width: 1024px) { - .fancybox__toolbar { - padding: 8px; - } -} -.fancybox__container.is-animated[aria-hidden='false'] .fancybox__toolbar { - animation: 0.15s ease-in backwards fancybox-fadeIn; -} -.fancybox__container.is-animated.is-closing .fancybox__toolbar { - opacity: 0; -} -.fancybox__toolbar__items { - display: flex; -} -.fancybox__toolbar__items--left { - margin-right: auto; -} -.fancybox__toolbar__items--center { - position: absolute; - left: 50%; - transform: translate(-50%); -} -.fancybox__toolbar__items--right { - margin-left: auto; -} -@media (max-width: 640px) { - .fancybox__toolbar__items--center:not(:last-child) { - display: none; - } -} -.fancybox__counter { - min-width: 72px; - padding: 0 10px; - line-height: var(--carousel-button-height, 48px); - text-align: center; - font-size: 17px; - font-variant-numeric: tabular-nums; - -webkit-font-smoothing: subpixel-antialiased; -} -.fancybox__progress { - background: var(--fancybox-accent-color, rgba(34, 213, 233, 0.96)); - height: 3px; - left: 0; - position: absolute; - right: 0; - top: 0; - transform: scaleX(0); - transform-origin: 0; - transition-property: transform; - transition-timing-function: linear; - z-index: 30; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; -} -.fancybox__container:fullscreen::backdrop { - opacity: 0; -} -.fancybox__button--fullscreen g:nth-child(2) { - display: none; -} -.fancybox__container:fullscreen .fancybox__button--fullscreen g:nth-child(1) { - display: none; -} -.fancybox__container:fullscreen .fancybox__button--fullscreen g:nth-child(2) { - display: block; -} -.fancybox__button--slideshow g:nth-child(2) { - display: none; -} -.fancybox__container.has-slideshow .fancybox__button--slideshow g:nth-child(1) { - display: none; -} -.fancybox__container.has-slideshow .fancybox__button--slideshow g:nth-child(2) { - display: block; -} -@font-face { - font-family: swiper-icons; - src: url(data:application/font-woff;charset=utf-8;base64,\ d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA); - font-weight: 400; - font-style: normal; -} -:root { - --swiper-theme-color: #007aff; -} -:host { - position: relative; - display: block; - margin-left: auto; - margin-right: auto; - z-index: 1; -} -.swiper { - margin-left: auto; - margin-right: auto; - position: relative; - overflow: hidden; - list-style: none; - padding: 0; - z-index: 1; - display: block; -} -.swiper-vertical > .swiper-wrapper { - flex-direction: column; -} -.swiper-wrapper { - position: relative; - width: 100%; - height: 100%; - z-index: 1; - display: flex; - transition-property: transform; - transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial); - box-sizing: content-box; -} -.swiper-android .swiper-slide, -.swiper-ios .swiper-slide, -.swiper-wrapper { - transform: translateZ(0); -} -.swiper-horizontal { - touch-action: pan-y; -} -.swiper-vertical { - touch-action: pan-x; -} -.swiper-slide { - flex-shrink: 0; - width: 100%; - height: 100%; - position: relative; - transition-property: transform; - display: block; -} -.swiper-slide-invisible-blank { - visibility: hidden; -} -.swiper-autoheight, -.swiper-autoheight .swiper-slide { - height: auto; -} -.swiper-autoheight .swiper-wrapper { - align-items: flex-start; - transition-property: transform, height; -} -.swiper-backface-hidden .swiper-slide { - transform: translateZ(0); - backface-visibility: hidden; -} -.swiper-3d.swiper-css-mode .swiper-wrapper { - perspective: 1200px; -} -.swiper-3d .swiper-wrapper { - transform-style: preserve-3d; -} -.swiper-3d { - perspective: 1200px; -} -.swiper-3d .swiper-slide, -.swiper-3d .swiper-cube-shadow { - transform-style: preserve-3d; -} -.swiper-css-mode > .swiper-wrapper { - overflow: auto; - scrollbar-width: none; - -ms-overflow-style: none; -} -.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar { - display: none; -} -.swiper-css-mode > .swiper-wrapper > .swiper-slide { - scroll-snap-align: start start; -} -.swiper-css-mode.swiper-horizontal > .swiper-wrapper { - scroll-snap-type: x mandatory; -} -.swiper-css-mode.swiper-vertical > .swiper-wrapper { - scroll-snap-type: y mandatory; -} -.swiper-css-mode.swiper-free-mode > .swiper-wrapper { - scroll-snap-type: none; -} -.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide { - scroll-snap-align: none; -} -.swiper-css-mode.swiper-centered > .swiper-wrapper:before { - content: ''; - flex-shrink: 0; - order: 9999; -} -.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide { - scroll-snap-align: center center; - scroll-snap-stop: always; -} -.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child { - margin-inline-start: var(--swiper-centered-offset-before); -} -.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper:before { - height: 100%; - min-height: 1px; - width: var(--swiper-centered-offset-after); -} -.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child { - margin-block-start: var(--swiper-centered-offset-before); -} -.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper:before { - width: 100%; - min-width: 1px; - height: var(--swiper-centered-offset-after); -} -.swiper-3d .swiper-slide-shadow, -.swiper-3d .swiper-slide-shadow-left, -.swiper-3d .swiper-slide-shadow-right, -.swiper-3d .swiper-slide-shadow-top, -.swiper-3d .swiper-slide-shadow-bottom { - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; - pointer-events: none; - z-index: 10; -} -.swiper-3d .swiper-slide-shadow { - background: #00000026; -} -.swiper-3d .swiper-slide-shadow-left { - background-image: linear-gradient(to left, #00000080, #0000); -} -.swiper-3d .swiper-slide-shadow-right { - background-image: linear-gradient(to right, #00000080, #0000); -} -.swiper-3d .swiper-slide-shadow-top { - background-image: linear-gradient(to top, #00000080, #0000); -} -.swiper-3d .swiper-slide-shadow-bottom { - background-image: linear-gradient(to bottom, #00000080, #0000); -} -.swiper-lazy-preloader { - width: 42px; - height: 42px; - position: absolute; - left: 50%; - top: 50%; - margin-left: -21px; - margin-top: -21px; - z-index: 10; - transform-origin: 50%; - box-sizing: border-box; - border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); - border-radius: 50%; - border-top-color: transparent; -} -.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader, -.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader { - animation: swiper-preloader-spin 1s infinite linear; -} -.swiper-lazy-preloader-white { - --swiper-preloader-color: #fff; -} -.swiper-lazy-preloader-black { - --swiper-preloader-color: #000; -} -@keyframes swiper-preloader-spin { - 0% { - transform: rotate(0); - } - to { - transform: rotate(360deg); - } -} -.swiper-virtual .swiper-slide { - -webkit-backface-visibility: hidden; - transform: translateZ(0); -} -.swiper-virtual.swiper-css-mode .swiper-wrapper:after { - content: ''; - position: absolute; - left: 0; - top: 0; - pointer-events: none; -} -.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper:after { - height: 1px; - width: var(--swiper-virtual-size); -} -.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper:after { - width: 1px; - height: var(--swiper-virtual-size); -} -:root { - --swiper-navigation-size: 44px; -} -.swiper-button-prev, -.swiper-button-next { - position: absolute; - top: var(--swiper-navigation-top-offset, 50%); - width: calc(var(--swiper-navigation-size) / 44 * 27); - height: var(--swiper-navigation-size); - margin-top: calc(0px - (var(--swiper-navigation-size) / 2)); - z-index: 10; - cursor: pointer; - display: flex; - align-items: center; - justify-content: center; - color: var(--swiper-navigation-color, var(--swiper-theme-color)); -} -.swiper-button-prev.swiper-button-disabled, -.swiper-button-next.swiper-button-disabled { - opacity: 0.35; - cursor: auto; - pointer-events: none; -} -.swiper-button-prev.swiper-button-hidden, -.swiper-button-next.swiper-button-hidden { - opacity: 0; - cursor: auto; - pointer-events: none; -} -.swiper-navigation-disabled .swiper-button-prev, -.swiper-navigation-disabled .swiper-button-next { - display: none !important; -} -.swiper-button-prev svg, -.swiper-button-next svg { - width: 100%; - height: 100%; - object-fit: contain; - transform-origin: center; -} -.swiper-rtl .swiper-button-prev svg, -.swiper-rtl .swiper-button-next svg { - transform: rotate(180deg); -} -.swiper-button-prev, -.swiper-rtl .swiper-button-next { - left: var(--swiper-navigation-sides-offset, 10px); - right: auto; -} -.swiper-button-lock { - display: none; -} -.swiper-button-prev:after, -.swiper-button-next:after { - font-family: swiper-icons; - font-size: var(--swiper-navigation-size); - text-transform: none !important; - letter-spacing: 0; - font-variant: initial; - line-height: 1; -} -.swiper-button-prev:after, -.swiper-rtl .swiper-button-next:after { - content: 'prev'; -} -.swiper-button-next, -.swiper-rtl .swiper-button-prev { - right: var(--swiper-navigation-sides-offset, 10px); - left: auto; -} -.swiper-button-next:after, -.swiper-rtl .swiper-button-prev:after { - content: 'next'; -} -.swiper-pagination { - position: absolute; - text-align: center; - transition: 0.3s opacity; - transform: translateZ(0); - z-index: 10; -} -.swiper-pagination.swiper-pagination-hidden { - opacity: 0; -} -.swiper-pagination-disabled > .swiper-pagination, -.swiper-pagination.swiper-pagination-disabled { - display: none !important; -} -.swiper-pagination-fraction, -.swiper-pagination-custom, -.swiper-horizontal > .swiper-pagination-bullets, -.swiper-pagination-bullets.swiper-pagination-horizontal { - bottom: var(--swiper-pagination-bottom, 8px); - top: var(--swiper-pagination-top, auto); - left: 0; - width: 100%; -} -.swiper-pagination-bullets-dynamic { - overflow: hidden; - font-size: 0; -} -.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { - transform: scale(0.33); - position: relative; -} -.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, -.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { - transform: scale(1); -} -.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { - transform: scale(0.66); -} -.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { - transform: scale(0.33); -} -.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { - transform: scale(0.66); -} -.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { - transform: scale(0.33); -} -.swiper-pagination-bullet { - width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px)); - height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px)); - display: inline-block; - border-radius: var(--swiper-pagination-bullet-border-radius, 50%); - background: var(--swiper-pagination-bullet-inactive-color, #000); - opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2); -} -button.swiper-pagination-bullet { - border: none; - margin: 0; - padding: 0; - box-shadow: none; - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; -} -.swiper-pagination-clickable .swiper-pagination-bullet { - cursor: pointer; -} -.swiper-pagination-bullet:only-child { - display: none !important; -} -.swiper-pagination-bullet-active { - opacity: var(--swiper-pagination-bullet-opacity, 1); - background: var(--swiper-pagination-color, var(--swiper-theme-color)); -} -.swiper-vertical > .swiper-pagination-bullets, -.swiper-pagination-vertical.swiper-pagination-bullets { - right: var(--swiper-pagination-right, 8px); - left: var(--swiper-pagination-left, auto); - top: 50%; - transform: translate3d(0, -50%, 0); -} -.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet, -.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet { - margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0; - display: block; -} -.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, -.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { - top: 50%; - transform: translateY(-50%); - width: 8px; -} -.swiper-vertical - > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic - .swiper-pagination-bullet, -.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic - .swiper-pagination-bullet { - display: inline-block; - transition: - 0.2s transform, - 0.2s top; -} -.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, -.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { - margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px); -} -.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, -.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { - left: 50%; - transform: translate(-50%); - white-space: nowrap; -} -.swiper-horizontal - > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic - .swiper-pagination-bullet, -.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic - .swiper-pagination-bullet { - transition: - 0.2s transform, - 0.2s left; -} -.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { - transition: - 0.2s transform, - 0.2s right; -} -.swiper-pagination-fraction { - color: var(--swiper-pagination-fraction, inherit); -} -.swiper-pagination-progressbar { - background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25)); - position: absolute; -} -.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { - background: var(--swiper-pagination-color, var(--swiper-theme-color)); - position: absolute; - left: 0; - top: 0; - width: 100%; - height: 100%; - transform: scale(0); - transform-origin: left top; -} -.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { - transform-origin: right top; -} -.swiper-horizontal > .swiper-pagination-progressbar, -.swiper-pagination-progressbar.swiper-pagination-horizontal, -.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, -.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite { - width: 100%; - height: var(--swiper-pagination-progressbar-size, 4px); - left: 0; - top: 0; -} -.swiper-vertical > .swiper-pagination-progressbar, -.swiper-pagination-progressbar.swiper-pagination-vertical, -.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, -.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite { - width: var(--swiper-pagination-progressbar-size, 4px); - height: 100%; - left: 0; - top: 0; -} -.swiper-pagination-lock { - display: none; -} -.swiper-scrollbar { - border-radius: var(--swiper-scrollbar-border-radius, 10px); - position: relative; - touch-action: none; - background: var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1)); -} -.swiper-scrollbar-disabled > .swiper-scrollbar, -.swiper-scrollbar.swiper-scrollbar-disabled { - display: none !important; -} -.swiper-horizontal > .swiper-scrollbar, -.swiper-scrollbar.swiper-scrollbar-horizontal { - position: absolute; - left: var(--swiper-scrollbar-sides-offset, 1%); - bottom: var(--swiper-scrollbar-bottom, 4px); - top: var(--swiper-scrollbar-top, auto); - z-index: 50; - height: var(--swiper-scrollbar-size, 4px); - width: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%)); -} -.swiper-vertical > .swiper-scrollbar, -.swiper-scrollbar.swiper-scrollbar-vertical { - position: absolute; - left: var(--swiper-scrollbar-left, auto); - right: var(--swiper-scrollbar-right, 4px); - top: var(--swiper-scrollbar-sides-offset, 1%); - z-index: 50; - width: var(--swiper-scrollbar-size, 4px); - height: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%)); -} -.swiper-scrollbar-drag { - height: 100%; - width: 100%; - position: relative; - background: var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5)); - border-radius: var(--swiper-scrollbar-border-radius, 10px); - left: 0; - top: 0; -} -.swiper-scrollbar-cursor-drag { - cursor: move; -} -.swiper-scrollbar-lock { - display: none; -} -.swiper-zoom-container { - width: 100%; - height: 100%; - display: flex; - justify-content: center; - align-items: center; - text-align: center; -} -.swiper-zoom-container > img, -.swiper-zoom-container > svg, -.swiper-zoom-container > canvas { - max-width: 100%; - max-height: 100%; - object-fit: contain; -} -.swiper-slide-zoomed { - cursor: move; - touch-action: none; -} -.swiper .swiper-notification { - position: absolute; - left: 0; - top: 0; - pointer-events: none; - opacity: 0; - z-index: -1000; -} -.swiper-free-mode > .swiper-wrapper { - transition-timing-function: ease-out; - margin: 0 auto; -} -.swiper-grid > .swiper-wrapper { - flex-wrap: wrap; -} -.swiper-grid-column > .swiper-wrapper { - flex-wrap: wrap; - flex-direction: column; -} -.swiper-fade.swiper-free-mode .swiper-slide { - transition-timing-function: ease-out; -} -.swiper-fade .swiper-slide { - pointer-events: none; - transition-property: opacity; -} -.swiper-fade .swiper-slide .swiper-slide { - pointer-events: none; -} -.swiper-fade .swiper-slide-active, -.swiper-fade .swiper-slide-active .swiper-slide-active { - pointer-events: auto; -} -.swiper-cube { - overflow: visible; -} -.swiper-cube .swiper-slide { - pointer-events: none; - backface-visibility: hidden; - z-index: 1; - visibility: hidden; - transform-origin: 0 0; - width: 100%; - height: 100%; -} -.swiper-cube .swiper-slide .swiper-slide { - pointer-events: none; -} -.swiper-cube.swiper-rtl .swiper-slide { - transform-origin: 100% 0; -} -.swiper-cube .swiper-slide-active, -.swiper-cube .swiper-slide-active .swiper-slide-active { - pointer-events: auto; -} -.swiper-cube .swiper-slide-active, -.swiper-cube .swiper-slide-next, -.swiper-cube .swiper-slide-prev { - pointer-events: auto; - visibility: visible; -} -.swiper-cube .swiper-cube-shadow { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0.6; - z-index: 0; -} -.swiper-cube .swiper-cube-shadow:before { - content: ''; - background: #000; - position: absolute; - left: 0; - top: 0; - bottom: 0; - right: 0; - filter: blur(50px); -} -.swiper-cube .swiper-slide-next + .swiper-slide { - pointer-events: auto; - visibility: visible; -} -.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top, -.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom, -.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left, -.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right { - z-index: 0; - backface-visibility: hidden; -} -.swiper-flip { - overflow: visible; -} -.swiper-flip .swiper-slide { - pointer-events: none; - backface-visibility: hidden; - z-index: 1; -} -.swiper-flip .swiper-slide .swiper-slide { - pointer-events: none; -} -.swiper-flip .swiper-slide-active, -.swiper-flip .swiper-slide-active .swiper-slide-active { - pointer-events: auto; -} -.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top, -.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom, -.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left, -.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right { - z-index: 0; - backface-visibility: hidden; -} -.swiper-creative .swiper-slide { - backface-visibility: hidden; - overflow: hidden; - transition-property: transform, opacity, height; -} -.swiper-cards { - overflow: visible; -} -.swiper-cards .swiper-slide { - transform-origin: center bottom; - backface-visibility: hidden; - overflow: hidden; -} /*! tailwindcss v3.4.3 | MIT License | https://tailwindcss.com - */ -*, -:before, -:after { - box-sizing: border-box; - border-width: 0; - border-style: solid; - border-color: currentColor; -} -:before, -:after { - --tw-content: ''; -} -html, -:host { - line-height: 1.5; - -webkit-text-size-adjust: 100%; - -moz-tab-size: 4; - tab-size: 4; - font-family: - ui-sans-serif, - system-ui, - sans-serif, - 'Apple Color Emoji', - 'Segoe UI Emoji', - Segoe UI Symbol, - 'Noto Color Emoji'; - font-feature-settings: normal; - font-variation-settings: normal; - -webkit-tap-highlight-color: transparent; -} -body { - margin: 0; - line-height: inherit; -} -hr { - height: 0; - color: inherit; - border-top-width: 1px; -} -abbr:where([title]) { - -webkit-text-decoration: underline dotted; - text-decoration: underline dotted; -} -h1, -h2, -h3, -h4, -h5, -h6 { - font-size: inherit; - font-weight: inherit; -} -a { - color: inherit; - text-decoration: inherit; -} -b, -strong { - font-weight: bolder; -} -code, -kbd, -samp, -pre { - font-family: - ui-monospace, - SFMono-Regular, - Menlo, - Monaco, - Consolas, - Liberation Mono, - Courier New, - monospace; - font-feature-settings: normal; - font-variation-settings: normal; - font-size: 1em; -} -small { - font-size: 80%; -} -sub, -sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; -} -sub { - bottom: -0.25em; -} -sup { - top: -0.5em; -} -table { - text-indent: 0; - border-color: inherit; - border-collapse: collapse; -} -button, -input, -optgroup, -select, -textarea { - font-family: inherit; - font-feature-settings: inherit; - font-variation-settings: inherit; - font-size: 100%; - font-weight: inherit; - line-height: inherit; - letter-spacing: inherit; - color: inherit; - margin: 0; - padding: 0; -} -button, -select { - text-transform: none; -} -button, -input:where([type='button']), -input:where([type='reset']), -input:where([type='submit']) { - -webkit-appearance: button; - background-color: transparent; - background-image: none; -} -:-moz-focusring { - outline: auto; -} -:-moz-ui-invalid { - box-shadow: none; -} -progress { - vertical-align: baseline; -} -::-webkit-inner-spin-button, -::-webkit-outer-spin-button { - height: auto; -} -[type='search'] { - -webkit-appearance: textfield; - outline-offset: -2px; -} -::-webkit-search-decoration { - -webkit-appearance: none; -} -::-webkit-file-upload-button { - -webkit-appearance: button; - font: inherit; -} -summary { - display: list-item; -} -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; -} -dialog { - padding: 0; -} -textarea { - resize: vertical; -} -input::-moz-placeholder, -textarea::-moz-placeholder { - opacity: 1; - color: #9ca3af; -} -input::placeholder, -textarea::placeholder { - opacity: 1; - color: #9ca3af; -} -button, -[role='button'] { - cursor: pointer; -} -:disabled { - cursor: default; -} -img, -svg, -video, -canvas, -audio, -iframe, -embed, -object { - display: block; - vertical-align: middle; -} -img, -video { - max-width: 100%; - height: auto; -} -[hidden] { - display: none; -} -[type='text'], -input:where(:not([type])), -[type='email'], -[type='url'], -[type='password'], -[type='number'], -[type='date'], -[type='datetime-local'], -[type='month'], -[type='search'], -[type='tel'], -[type='time'], -[type='week'], -[multiple], -textarea, -select { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - background-color: #fff; - border-color: #6b7280; - border-width: 1px; - border-radius: 0; - padding: 0.5rem 0.75rem; - font-size: 1rem; - line-height: 1.5rem; - --tw-shadow: 0 0 #0000; -} -[type='text']:focus, -input:where(:not([type])):focus, -[type='email']:focus, -[type='url']:focus, -[type='password']:focus, -[type='number']:focus, -[type='date']:focus, -[type='datetime-local']:focus, -[type='month']:focus, -[type='search']:focus, -[type='tel']:focus, -[type='time']:focus, -[type='week']:focus, -[multiple]:focus, -textarea:focus, -select:focus { - outline: 2px solid transparent; - outline-offset: 2px; - --tw-ring-inset: var(--tw-empty,); - --tw-ring-offset-width: 0px; - --tw-ring-offset-color: #fff; - --tw-ring-color: #2563eb; - --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) - var(--tw-ring-offset-color); - --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) - var(--tw-ring-color); - box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - border-color: #2563eb; -} -input::-moz-placeholder, -textarea::-moz-placeholder { - color: #6b7280; - opacity: 1; -} -input::placeholder, -textarea::placeholder { - color: #6b7280; - opacity: 1; -} -::-webkit-datetime-edit-fields-wrapper { - padding: 0; -} -::-webkit-date-and-time-value { - min-height: 1.5em; - text-align: inherit; -} -::-webkit-datetime-edit { - display: inline-flex; -} -::-webkit-datetime-edit, -::-webkit-datetime-edit-year-field, -::-webkit-datetime-edit-month-field, -::-webkit-datetime-edit-day-field, -::-webkit-datetime-edit-hour-field, -::-webkit-datetime-edit-minute-field, -::-webkit-datetime-edit-second-field, -::-webkit-datetime-edit-millisecond-field, -::-webkit-datetime-edit-meridiem-field { - padding-top: 0; - padding-bottom: 0; -} -select { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e"); - background-position: right 0.5rem center; - background-repeat: no-repeat; - background-size: 1.5em 1.5em; - padding-right: 2.5rem; - -webkit-print-color-adjust: exact; - print-color-adjust: exact; -} -[multiple], -[size]:where(select:not([size='1'])) { - background-image: initial; - background-position: initial; - background-repeat: unset; - background-size: initial; - padding-right: 0.75rem; - -webkit-print-color-adjust: unset; - print-color-adjust: unset; -} -[type='checkbox'], -[type='radio'] { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - padding: 0; - -webkit-print-color-adjust: exact; - print-color-adjust: exact; - display: inline-block; - vertical-align: middle; - background-origin: border-box; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; - flex-shrink: 0; - height: 1rem; - width: 1rem; - color: #2563eb; - background-color: #fff; - border-color: #6b7280; - border-width: 1px; - --tw-shadow: 0 0 #0000; -} -[type='checkbox'] { - border-radius: 0; -} -[type='radio'] { - border-radius: 100%; -} -[type='checkbox']:focus, -[type='radio']:focus { - outline: 2px solid transparent; - outline-offset: 2px; - --tw-ring-inset: var(--tw-empty,); - --tw-ring-offset-width: 2px; - --tw-ring-offset-color: #fff; - --tw-ring-color: #2563eb; - --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) - var(--tw-ring-offset-color); - --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) - var(--tw-ring-color); - box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); -} -[type='checkbox']:checked, -[type='radio']:checked { - border-color: transparent; - background-color: currentColor; - background-size: 100% 100%; - background-position: center; - background-repeat: no-repeat; -} -[type='checkbox']:checked { - background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e"); -} -@media (forced-colors: active) { - [type='checkbox']:checked { - -webkit-appearance: auto; - -moz-appearance: auto; - appearance: auto; - } -} -[type='radio']:checked { - background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e"); -} -@media (forced-colors: active) { - [type='radio']:checked { - -webkit-appearance: auto; - -moz-appearance: auto; - appearance: auto; - } -} -[type='checkbox']:checked:hover, -[type='checkbox']:checked:focus, -[type='radio']:checked:hover, -[type='radio']:checked:focus { - border-color: transparent; - background-color: currentColor; -} -[type='checkbox']:indeterminate { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e"); - border-color: transparent; - background-color: currentColor; - background-size: 100% 100%; - background-position: center; - background-repeat: no-repeat; -} -@media (forced-colors: active) { - [type='checkbox']:indeterminate { - -webkit-appearance: auto; - -moz-appearance: auto; - appearance: auto; - } -} -[type='checkbox']:indeterminate:hover, -[type='checkbox']:indeterminate:focus { - border-color: transparent; - background-color: currentColor; -} -[type='file'] { - background: unset; - border-color: inherit; - border-width: 0; - border-radius: 0; - padding: 0; - font-size: unset; - line-height: inherit; -} -[type='file']:focus { - outline: 1px solid ButtonText; - outline: 1px auto -webkit-focus-ring-color; -} -:root, -.ThemeVariantLight { - --color-action: #e31937; - --color-action-light: #e73b54; - --color-action-dark: #c1152e; - --color-action-darker: #5c0411; - --color-emphasis: var(--color-action); - --color-emphasis-light: var(--color-action-light); - --color-emphasis-dark: var(--color-action-dark); - --color-emphasis-darker: var(--color-action-darker); -} -.ThemeVariantDark { - --color-action: #e73b54; - --color-action-light: #e73b54; - --color-action-dark: #e31937; - --color-action-darker: #c1152e; -} -.ThemeEdu, -.ThemeEdu.ThemeVariantLight, -.ThemeEdu .ThemeVariantLight { - --color-action: #007e99; - --color-action-light: #00a7cc; - --color-action-dark: #005366; - --color-action-darker: #002a33; - --color-emphasis: #9438e0; - --color-emphasis-light: #a85ee6; - --color-emphasis-dark: #741ebb; - --color-emphasis-darker: #33283d; -} -.ThemeEdu .ThemeVariantDark, -.ThemeEdu.ThemeVariantDark { - --color-action: #00a7cc; - --color-action-light: #00a7cc; - --color-action-dark: #007e99; - --color-action-darker: #005366; - --color-emphasis: #a85ee6; - --color-emphasis-light: #a85ee6; - --color-emphasis-dark: #9438e0; - --color-emphasis-darker: #741ebb; -} -.ThemeInternal, -.ThemeInternal.ThemeVariantLight, -.ThemeInternal .ThemeVariantLight { - --color-action: #0080a4; - --color-action-light: #00a0cc; - --color-action-dark: #006480; - --color-action-darker: #003c4d; - --color-emphasis: var(--color-action); - --color-emphasis-light: var(--color-action-light); - --color-emphasis-dark: var(--color-action-dark); - --color-emphasis-darker: var(--color-action-darker); -} -.ThemeInternal .ThemeVariantDark, -.ThemeInternal.ThemeVariantDark { - --color-action: #00a0cc; - --color-action-light: #00a0cc; - --color-action-dark: #0080a4; - --color-action-darker: #006480; -} -[type='text'], -[type='email'], -[type='url'], -[type='password'], -[type='number'], -[type='date'], -[type='datetime-local'], -[type='month'], -[type='search'], -[type='tel'], -[type='time'], -[type='week'], -[multiple], -textarea, -select, -.form-input, -.form-textarea, -.form-select, -.form-multiselect { - --tw-border-opacity: 1; - border-color: rgb(216 216 216 / var(--tw-border-opacity)); -} -[type='text']:focus, -[type='email']:focus, -[type='url']:focus, -[type='password']:focus, -[type='number']:focus, -[type='date']:focus, -[type='datetime-local']:focus, -[type='month']:focus, -[type='search']:focus, -[type='tel']:focus, -[type='time']:focus, -[type='week']:focus, -[multiple]:focus, -textarea:focus, -select:focus, -.form-input:focus, -.form-textarea:focus, -.form-select:focus, -.form-multiselect:focus { - --tw-ring-color: #1871c9; - --tw-border-opacity: 1; - border-color: rgb(24 113 201 / var(--tw-border-opacity)); -} -input::-moz-placeholder, -textarea::-moz-placeholder, -.form-input::-moz-placeholder, -.form-textarea::-moz-placeholder { - --tw-text-opacity: 1; - color: rgb(148 148 148 / var(--tw-text-opacity)); -} -input::placeholder, -textarea::placeholder, -.form-input::placeholder, -.form-textarea::placeholder { - --tw-text-opacity: 1; - color: rgb(148 148 148 / var(--tw-text-opacity)); -} -select, -.form-select { - background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23949494' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e"); -} -[type='checkbox'], -[type='radio'], -.form-checkbox, -.form-radio { - --tw-border-opacity: 1; - border-color: rgb(148 148 148 / var(--tw-border-opacity)); - --tw-text-opacity: 1; - color: rgb(24 113 201 / var(--tw-text-opacity)); -} -[type='checkbox']:focus, -[type='radio']:focus, -.form-checkbox:focus, -.form-radio:focus { - --tw-ring-color: #1871c9; -} -.BaseGrid { - display: grid; - grid-template-columns: repeat(12, minmax(0, 1fr)); - gap: 1.5rem; -} -@media (min-width: 640px) { - .MixedBleedGrid { - grid-template-columns: [bleed-start] auto [container-start] 53.33px [indent-col-2] 53.33px [indent-col-3] 533.33px [container-end] auto [bleed-end]; - display: grid; - gap: 0px; - } -} -@media (min-width: 768px) { - .MixedBleedGrid { - grid-template-columns: [bleed-start] auto [container-start] 64px [indent-col-2] 64px [indent-col-3] 640px [container-end] auto [bleed-end]; - display: grid; - } -} -@media (min-width: 1024px) { - .MixedBleedGrid { - grid-template-columns: [bleed-start] auto [container-start] 85.33px [indent-col-2] 85.33px [indent-col-3] 853.33px [container-end] auto [bleed-end]; - display: grid; - } -} -@media (min-width: 1280px) { - .MixedBleedGrid { - grid-template-columns: [bleed-start] auto [container-start] 108px [indent-col-2] 108px [indent-col-3] 1088px [container-end] auto [bleed-end]; - display: grid; - } -} -@media (min-width: 1440px) { - .MixedBleedGrid { - grid-template-columns: [bleed-start] auto [container-start] 110px [indent-col-2] 110px [indent-col-3] 1100px [container-end] auto [bleed-end]; - display: grid; - } -} -.MixedBleedGrid .col-start-bleed { - grid-column-start: bleed-start; -} -.MixedBleedGrid .col-end-container-start { - grid-column-end: container-start; -} -.MixedBleedGrid .col-start-container { - grid-column-start: container-start; -} -.MixedBleedGrid .col-start-indent-col-2 { - grid-column-start: indent-col-2; -} -.MixedBleedGrid .col-start-indent-col-3 { - grid-column-start: indent-col-3; -} -.MixedBleedGrid .col-end-container { - grid-column-end: container-end; -} -.MixedBleedGrid .col-start-container-end { - grid-column-start: container-end; -} -.MixedBleedGrid .col-end-bleed { - grid-column-end: bleed-end; -} -.nav-offset { - padding-top: 4.5rem; -} -@media (min-width: 1024px) { - .nav-offset { - padding-top: 0; - } - .-nav-offset { - margin-top: -7.25rem; - } -} -html { - font-family: - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -webkit-text-size-adjust: 100%; - -moz-text-size-adjust: 100%; - text-size-adjust: 100%; - text-rendering: optimizelegibility; -} -.text-h1-alt { - font-weight: 700; - letter-spacing: -1px; - font-size: 2.8125rem; - line-height: 1; -} -@media (min-width: 640px) { - .text-h1-alt { - font-size: 3.40625rem; - } -} -@media (min-width: 768px) { - .text-h1-alt { - letter-spacing: -2px; - font-size: 4.09375rem; - } -} -@media (min-width: 1024px) { - .text-h1-alt { - font-size: 4.5rem; - } -} -@media (min-width: 1280px) { - .text-h1-alt { - font-size: 6.25rem; - } -} -h1, -.text-h1 { - font-weight: 500; - letter-spacing: -1px; - font-size: 2.625rem; - line-height: 1.15; -} -@media (min-width: 640px) { - h1, - .text-h1 { - font-size: 2.875rem; - } -} -@media (min-width: 768px) { - h1, - .text-h1 { - font-size: 3.125rem; - letter-spacing: -1.5px; - } -} -@media (min-width: 1024px) { - h1, - .text-h1 { - font-size: 3.375rem; - } -} -@media (min-width: 1280px) { - h1, - .text-h1 { - font-size: 3.625rem; - } -} -h2, -.text-h2 { - font-weight: 500; - letter-spacing: -0.5px; - font-size: 2.25rem; - line-height: 1.25; -} -@media (min-width: 640px) { - h2, - .text-h2 { - font-size: 2.375rem; - } -} -@media (min-width: 768px) { - h2, - .text-h2 { - letter-spacing: -1px; - font-size: 2.5rem; - } -} -@media (min-width: 1024px) { - h2, - .text-h2 { - font-size: 2.625rem; - } -} -@media (min-width: 1280px) { - h2, - .text-h2 { - font-size: 2.75rem; - } -} -h3, -.text-h3 { - font-weight: 500; - letter-spacing: -0.5px; - font-size: 1.6875rem; - line-height: 1.25; -} -@media (min-width: 640px) { - h3, - .text-h3 { - font-size: 1.765625rem; - } -} -@media (min-width: 768px) { - h3, - .text-h3 { - letter-spacing: -1px; - font-size: 1.875rem; - } -} -@media (min-width: 1024px) { - h3, - .text-h3 { - font-size: 1.953125rem; - } -} -@media (min-width: 1280px) { - h3, - .text-h3 { - font-size: 2.0625rem; - } -} -h4, -.text-h4 { - font-weight: 500; - letter-spacing: 0; - font-size: 1.375rem; - line-height: 1.25; -} -@media (min-width: 640px) { - h4, - .text-h4 { - font-size: 1.453125rem; - } -} -@media (min-width: 768px) { - h4, - .text-h4 { - letter-spacing: -0.5px; - font-size: 1.546875rem; - } -} -@media (min-width: 1024px) { - h4, - .text-h4 { - font-size: 1.609375rem; - } -} -@media (min-width: 1280px) { - h4, - .text-h4 { - font-size: 1.6875rem; - } -} -h5, -.text-h5 { - font-weight: 500; - letter-spacing: 0; - font-size: 1.25rem; - line-height: 1.25; -} -@media (min-width: 640px) { - h5, - .text-h5 { - font-size: 1.3125rem; - } -} -@media (min-width: 768px) { - h5, - .text-h5 { - font-size: 1.390625rem; - } -} -@media (min-width: 1024px) { - h5, - .text-h5 { - font-size: 1.453125rem; - } -} -@media (min-width: 1280px) { - h5, - .text-h5 { - font-size: 1.515625rem; - } -} -h6, -.text-h6 { - font-weight: 700; - letter-spacing: 0; - font-size: 1.125rem; - line-height: 1.6667; -} -@media (min-width: 640px) { - h6, - .text-h6 { - font-size: 1.1875rem; - } -} -@media (min-width: 768px) { - h6, - .text-h6 { - font-size: 1.25rem; - } -} -@media (min-width: 1024px) { - h6, - .text-h6 { - font-size: 1.3125rem; - } -} -@media (min-width: 1280px) { - h6, - .text-h6 { - font-size: 1.375rem; - } -} -h1 b, -h1 strong, -.text-h1 b, -.text-h1 strong, -h2 b, -h2 strong, -.text-h2 b, -.text-h2 strong, -h3 b, -h3 strong, -.text-h3 b, -.text-h3 strong, -h4 b, -h4 strong, -.text-h4 b, -.text-h4 strong, -h5 b, -h5 strong, -.text-h5 b, -.text-h5 strong { - font-weight: inherit; -} -.text-subtitle { - font-family: - Archivo Narrow, - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; - font-size: 1rem; - text-transform: uppercase; - line-height: 1.25; - letter-spacing: 1px; -} -.text-subtitle-sm { - font-family: - Archivo Narrow, - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; - font-size: 0.875rem; - text-transform: uppercase; - line-height: 1.25; - letter-spacing: 1px; -} -.text-body-lg { - font-size: 1.125rem; - line-height: 1.6667; -} -@media (min-width: 640px) { - .text-body-lg { - font-size: 1.1875rem; - } -} -@media (min-width: 768px) { - .text-body-lg { - font-size: 1.25rem; - } -} -@media (min-width: 1024px) { - .text-body-lg { - font-size: 1.3125rem; - } -} -@media (min-width: 1280px) { - .text-body-lg { - font-size: 1.375rem; - } -} -.text-body-md { - font-size: 1rem; - line-height: 1.6667; -} -@media (min-width: 1024px) { - .text-body-md { - font-size: 1.125rem; - } -} -.text-body-sm { - font-size: 0.875rem; - line-height: 1.6667; -} -@media (min-width: 1024px) { - .text-body-sm { - font-size: 1rem; - } -} -.text-body-xs { - font-size: 0.875rem; - line-height: 1.6667; -} -.text-stats-xl { - font-weight: 800; - line-height: 1; - font-size: 2.125rem; -} -@media (min-width: 1024px) { - .text-stats-xl { - font-size: 2.4rem; - } -} -@media (min-width: 1280px) { - .text-stats-xl { - font-size: 2.75rem; - } -} -.text-stats-lg { - font-weight: 800; - line-height: 1; - font-size: 2.125rem; -} -@media (min-width: 1024px) { - .text-stats-lg { - font-size: 2.125rem; - } -} -@media (min-width: 1280px) { - .text-stats-lg { - font-size: 2.25rem; - } -} -mark { - border-radius: 0.25rem; - border-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(255 186 50 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(255 249 235 / var(--tw-bg-opacity)); - padding: 0.125rem; -} -.object-contain { - font-family: 'object-fit: contain'; -} -.object-cover { - font-family: 'object-fit: cover'; -} -.object-fill { - font-family: 'object-fit: fill'; -} -.object-scale-down { - font-family: 'object-fit: scale-down'; -} -.LogoJPL { - width: 4.5rem; - height: auto; -} -.indent-col-base { - grid-column-start: 1; - grid-column-end: 13; -} -@media (min-width: 1024px) { - .indent-col-2 { - grid-column-start: 2; - grid-column-end: 12; - } - .indent-col-3 { - grid-column-start: 3; - grid-column-end: 11; - } -} -@media (min-width: 768px) { - .indent-col-4 { - grid-column-start: 3; - grid-column-end: 11; - } -} -@media (min-width: 1024px) { - .indent-col-4 { - grid-column-start: 4; - grid-column-end: 10; - } -} -*, -: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: ; -} -.container { - width: 100%; - padding-right: 1rem; - padding-left: 1rem; -} -@media (min-width: 640px) { - .container { - max-width: 640px; - } -} -@media (min-width: 768px) { - .container { - max-width: 768px; - } -} -@media (min-width: 1024px) { - .container { - max-width: 1024px; - } -} -@media (min-width: 1280px) { - .container { - max-width: 1280px; - } -} -@media (min-width: 1320px) { - .container { - max-width: 1320px; - } -} -.BaseButton { - padding-top: 0.7em; - padding-bottom: 0.7em; - background-size: 100% 215%; - background-position: 0 -1px; - cursor: pointer; - background-image: linear-gradient(to bottom, var(--tw-gradient-stops)); - --tw-gradient-from: transparent 50% var(--tw-gradient-from-position); - --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); - font-family: - Archivo Narrow, - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; - font-weight: 600; - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 1px; - transition-property: all; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.2s; - transition-timing-function: linear; -} -.BaseButton:focus { - outline: 2px solid transparent; - outline-offset: 2px; - --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) - var(--tw-ring-offset-color); - --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) - var(--tw-ring-color); - box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); -} -.BaseButton > .label { - display: flex; - align-items: center; - justify-content: center; -} -@media (hover: hover) { - .BaseButton:hover { - background-position: bottom; - } -} -.BaseButton.-primary { - background-color: var(--color-action); - --tw-gradient-to: var(--color-action-dark) 50% var(--tw-gradient-to-position); - padding-left: 3rem; - padding-right: 3rem; - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -.BaseButton.-primary > .label { - border-width: 2px; - border-color: transparent; -} -.BaseButton.-secondary { - border-width: 2px; - border-color: var(--color-action); - background-color: transparent; - --tw-gradient-to: var(--color-action-dark) 50% var(--tw-gradient-to-position); - padding-left: 3rem; - padding-right: 3rem; - color: var(--color-action); -} -@media (hover: hover) { - .BaseButton.-secondary:hover { - border-color: var(--color-action-dark); - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); - } -} -.BaseButton.-dark { - border-width: 1px; - border-color: #fff6; - background-color: transparent; - --tw-gradient-to: #ffffff 50% var(--tw-gradient-to-position); - padding-left: 3rem; - padding-right: 3rem; - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -@media (hover: hover) { - .BaseButton.-dark:hover { - --tw-border-opacity: 1; - border-color: rgb(255 255 255 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(255 255 255 / var(--tw-bg-opacity)); - --tw-text-opacity: 1; - color: rgb(0 69 98 / var(--tw-text-opacity)); - } -} -.BaseButton.-social { - border-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(148 148 148 / var(--tw-border-opacity)); - background-color: transparent; - --tw-gradient-to: #222222 50% var(--tw-gradient-to-position); - padding-left: 3rem; - padding-right: 3rem; - --tw-text-opacity: 1; - color: rgb(148 148 148 / var(--tw-text-opacity)); -} -@media (hover: hover) { - .BaseButton.-social:hover { - --tw-bg-opacity: 1; - background-color: rgb(34 34 34 / var(--tw-bg-opacity)); - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); - } -} -.BaseButton.-social.-facebook { - --tw-gradient-to: #3b5998 50% var(--tw-gradient-to-position); -} -@media (hover: hover) { - .BaseButton.-social.-facebook:hover { - --tw-border-opacity: 1; - border-color: rgb(59 89 152 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(59 89 152 / var(--tw-bg-opacity)); - } -} -.BaseButton.-social.-twitter { - --tw-gradient-to: #000000 50% var(--tw-gradient-to-position); -} -@media (hover: hover) { - .BaseButton.-social.-twitter:hover { - --tw-border-opacity: 1; - border-color: rgb(0 0 0 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(0 0 0 / var(--tw-bg-opacity)); - } -} -.BaseButton.-social.-instagram { - --tw-gradient-to: #dd2a7b 50% var(--tw-gradient-to-position); -} -@media (hover: hover) { - .BaseButton.-social.-instagram:hover { - --tw-border-opacity: 1; - border-color: rgb(221 42 123 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(221 42 123 / var(--tw-bg-opacity)); - } -} -.BaseButton.-social.-youtube { - --tw-gradient-to: #ff0000 50% var(--tw-gradient-to-position); -} -@media (hover: hover) { - .BaseButton.-social.-youtube:hover { - --tw-border-opacity: 1; - border-color: rgb(255 0 0 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(255 0 0 / var(--tw-bg-opacity)); - } -} -.BaseButton.-social.-reddit { - --tw-gradient-to: #ff4500 50% var(--tw-gradient-to-position); -} -@media (hover: hover) { - .BaseButton.-social.-reddit:hover { - --tw-border-opacity: 1; - border-color: rgb(255 69 0 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(255 69 0 / var(--tw-bg-opacity)); - } -} -.BaseButton.-compact { - padding-left: 1.25rem; - padding-right: 1.25rem; -} -.BaseButton.-icon-only { - padding: 0; -} -.BaseButton.-icon-only > .label { - display: flex; - height: 100%; - width: 100%; - align-items: center; - justify-content: center; -} -.BaseButton:disabled { - cursor: default !important; - --tw-border-opacity: 1 !important; - border-color: rgb(148 148 148 / var(--tw-border-opacity)) !important; - --tw-bg-opacity: 1 !important; - background-color: rgb(148 148 148 / var(--tw-bg-opacity)) !important; - background-image: none !important; -} -.BaseButton:disabled > .label { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -.BaseIframe { - width: 100%; - border-style: none; -} -img.BaseImage { - max-width: 100%; -} -img.BaseImage.lazyload:not([src]), -img.BaseImage:not([src]) { - border-style: none; - opacity: 0; -} -img.BaseImage.lazyloaded { - opacity: 0; - animation-name: fadein; - animation-duration: 0.5s; - animation-iteration-count: 1; - animation-fill-mode: forwards; - animation-direction: normal; - animation-timing-function: ease-out; -} -@keyframes fadein { - 0% { - opacity: 0; - } - to { - opacity: 1; - } -} -.BaseImageCaption { - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-opacity)); -} -.BaseImageCaption > div > .the-caption-text > p { - display: inline !important; -} -.BaseImageCaption > div > .the-caption-text a { - cursor: pointer; - color: var(--color-action); - text-decoration-line: underline; -} -@media (hover: hover) { - .BaseImageCaption > div > .the-caption-text a:hover { - color: var(--color-action-dark); - } -} -.ThemeVariantLight .BaseImageCaption { - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-opacity)); -} -.ThemeVariantDark .BaseImageCaption { - --tw-text-opacity: 1; - color: rgb(148 148 148 / var(--tw-text-opacity)); -} -.BaseImagePlaceholder { - position: relative; - margin: 0; - display: block; - width: auto; - align-items: center; - justify-content: center; - overflow: hidden; - --tw-bg-opacity: 1; - background-color: rgb(216 216 216 / var(--tw-bg-opacity)); - background-repeat: no-repeat; - height: inherit; - background-position: center center; - background-size: 50px; - background-image: url(data:image/png;base64,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); -} -@media (min-width: 640px) { - .BaseImagePlaceholder { - background-size: 100px; - } -} -.BaseImagePlaceholder .BaseLightboxOpenButton { - opacity: 1; - transition-property: opacity; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.3s; -} -@media (hover: hover) { - @media (min-width: 640px) { - .BaseImagePlaceholder .BaseLightboxOpenButton { - opacity: 0; - transition-property: opacity; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.5s; - } - .BaseImagePlaceholder:hover .BaseLightboxOpenButton { - opacity: 1; - transition-property: opacity; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.3s; - } - } -} -.BaseImagePlaceholder.light-theme { - --tw-bg-opacity: 1; - background-color: rgb(245 245 245 / var(--tw-bg-opacity)); -} -.BaseImagePlaceholder.dark-theme { - --tw-bg-opacity: 1; - background-color: rgb(0 0 0 / var(--tw-bg-opacity)); - background-image: url(data:image/png;base64,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); -} -.BaseImagePlaceholder.transparent-theme { - background-color: transparent; - background-image: none; -} -.BaseImagePlaceholder.no-logo { - background-image: none; -} -.BasePlaceholder .wrapper { - width: 0; - animation: fullView 0.5s forwards cubic-bezier(0.25, 0.46, 0.45, 0.94); -} -@keyframes fullView { - to { - width: 100%; - } -} -.BasePlaceholder .animate-loading { - animation: shimmer 2s infinite linear; - background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%); - background-size: 1000px 100%; -} -@keyframes shimmer { - 0% { - background-position: -1000px 0; - } - to { - background-position: 1000px 0; - } -} -.BackToTop > button { - display: none; -} -@media print { - .BackToTop > button { - display: none; - } -} -.BackToTop[data-alwaysvisible] > button { - display: block; -} -.BackToTop .IconDropdown { - --tw-rotate: 180deg; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - font-size: 0.875rem; -} -@media (min-width: 640px) { - .BackToTop .IconDropdown { - margin-right: 0.5rem; - } -} -.BackToTop .label-text { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - clip: rect(0, 0, 0, 0); - white-space: nowrap; - border-width: 0; -} -@media (min-width: 640px) { - .BackToTop .label-text { - position: static; - width: auto; - height: auto; - padding: 0; - margin: 0; - overflow: visible; - clip: auto; - white-space: normal; - } -} -.BlockCircleImageCard { - --image-size: 90px; - display: flex; - align-items: center; - gap: calc(var(--image-size) / 2); -} -@media (min-width: 1024px) { - .BlockCircleImageCard { - --image-size: 130px; - } -} -.BlockCircleImageCard .BaseImagePlaceholder { - width: var(--image-size); - height: var(--image-size); - margin: 0 calc(-1 * var(--image-size) / 2); -} -.BlockCircleImageCard.imageOnRight { - flex-direction: row-reverse; -} -.BlockImageCarousel .BaseLightboxOpenButton { - opacity: 0; - transition-property: opacity; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.1s; -} -.BlockImageCarousel:hover .BaseLightboxOpenButton { - opacity: 1; - transition-property: opacity; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 75ms; -} -.BlockImageCarousel .swiper .swiper-prev { - margin-right: 1px; -} -.BlockImageCarousel .swiper .swiper-prev.swiper-button-disabled, -.BlockImageCarousel .swiper .swiper-next.swiper-button-disabled { - cursor: default; - background-image: none; - opacity: 0.75; -} -.BlockImageCarousel .swiper-nav { - padding-top: 56.25%; -} -.BlockImageCarousel .swiper-dots { - padding-top: 56.25%; - pointer-events: none; -} -.BlockImageCarousel .swiper-dots .swiper-dot { - pointer-events: auto; - display: inline-block; - cursor: pointer; - padding: 0.75rem 0.25rem; -} -.BlockImageCarousel .swiper-dots .swiper-dot:focus { - outline: 2px solid transparent; - outline-offset: 2px; - --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) - var(--tw-ring-offset-color); - --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) - var(--tw-ring-color); - box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); -} -.BlockImageCarousel .swiper-dots .swiper-dot > span { - display: inline-block; - height: 0.75rem; - width: 0.75rem; - border-radius: 9999px; - --tw-bg-opacity: 1; - background-color: rgb(216 216 216 / var(--tw-bg-opacity)); -} -.BlockImageCarousel .swiper-dots .swiper-dot.swiper-dot-active > span { - --tw-bg-opacity: 1; - background-color: rgb(227 25 55 / var(--tw-bg-opacity)); -} -.BlockImageCarousel .swiper-slide .slide-caption { - visibility: hidden; -} -.BlockImageCarousel .swiper-slide.swiper-slide-active .slide-caption { - visibility: visible; -} -.BlockImageGallery .BaseLightboxOpenButton { - display: none; -} -@media (min-width: 1024px) { - .BlockImageGallery .BaseImageCaption { - padding-left: 2rem; - } -} -@media (min-width: 1800px) { - .BlockImageGallery .BaseImageCaption { - padding-left: 0; - } -} -.ThemeVariantDark .BlockInlineImage > div { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -.BlockKeyPoints ul li:before { - --tw-bg-opacity: 1; - background-color: rgb(227 25 55 / var(--tw-bg-opacity)); - display: inline-block; - position: relative; - margin-right: 1rem; - flex-shrink: 0; - margin-top: 0.75rem; - content: ''; - width: 30px; - height: 2px; - vertical-align: middle; -} -.BlockKeyPoints ul li .BlockText p, -.BlockKeyPoints ul li .BlockTable .rich_text p, -.BlockTable .BlockKeyPoints ul li .rich_text p, -.BlockKeyPoints ul li .BlockTable .link p, -.BlockTable .BlockKeyPoints ul li .link p, -.BlockKeyPoints ul li .BlockTable .\!link p, -.BlockTable .BlockKeyPoints ul li .\!link p { - margin-bottom: 0.5rem; -} -@media (min-width: 1024px) { - .BlockKeyPoints ul li .BlockText p, - .BlockKeyPoints ul li .BlockTable .rich_text p, - .BlockTable .BlockKeyPoints ul li .rich_text p, - .BlockKeyPoints ul li .BlockTable .link p, - .BlockTable .BlockKeyPoints ul li .link p, - .BlockKeyPoints ul li .BlockTable .\!link p, - .BlockTable .BlockKeyPoints ul li .\!link p { - margin-bottom: 0.5rem; - } -} -.BlockKeyPoints ul li .BlockText p:last-child, -.BlockKeyPoints ul li .BlockTable .rich_text p:last-child, -.BlockTable .BlockKeyPoints ul li .rich_text p:last-child, -.BlockKeyPoints ul li .BlockTable .link p:last-child, -.BlockTable .BlockKeyPoints ul li .link p:last-child { - margin-bottom: 0; -} -.BlockKeyPoints ul li .BlockTable .\!link p:last-child, -.BlockTable .BlockKeyPoints ul li .\!link p:last-child { - margin-bottom: 0; -} -.BlockQuote { - text-align: center; -} -.BlockQuote > div > div > .attribution-image { - width: 60px; - min-width: 60px; - height: auto; - margin-top: 0.5rem; - margin-bottom: 0.5rem; - display: block; - border-radius: 9999px; -} -@media (min-width: 1024px) { - .BlockQuote > div > div > .attribution-image { - width: 80px; - min-width: 80px; - height: auto; - margin-top: 1.25rem; - margin-bottom: 1.25rem; - margin-right: 0.75rem; - } -} -.BlockQuote > hr { - max-width: 100px; - margin-left: auto; - margin-right: auto; - border-top-width: 1px; - border-color: var(--color-emphasis-light); -} -@media (min-width: 1024px) { - .BlockQuote > hr { - max-width: 120px; - } -} -.BlockQuote > .quote { - line-height: 1.4; - padding-top: 1rem; - padding-bottom: 1rem; - font-family: - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; - font-size: 1.25rem; - font-weight: 500; - font-style: italic; - color: var(--color-emphasis); -} -@media (min-width: 1024px) { - .BlockQuote > .quote { - font-size: 1.875rem; - font-weight: 400; - } -} -.BlockQuote > div > div > .attribution-text { - margin-top: 0.25rem; - display: flex; - align-items: flex-start; - justify-content: center; - padding-left: 1rem; - padding-right: 1rem; - padding-bottom: 1rem; - text-align: left; - font-family: - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; - font-size: 0.875rem; - line-height: 1.5; - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-opacity)); -} -.BlockQuote > div > div > .attribution-text:before { - content: '—'; - margin-right: 0.5rem; -} -@media (min-width: 1024px) { - .BlockQuote > div > div > .attribution-text { - align-items: center; - text-align: center; - font-size: 1rem; - } -} -.ThemeVariantLight .BlockQuote > hr { - border-color: var(--color-emphasis); -} -.ThemeVariantLight .BlockQuote > .quote { - color: var(--color-emphasis); -} -.ThemeVariantLight .BlockQuote > div > div > .attribution-text { - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-opacity)); -} -.ThemeVariantDark .BlockQuote > .quote { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -.ThemeVariantDark .BlockQuote > div > div > .attribution-text { - --tw-text-opacity: 1; - color: rgb(148 148 148 / var(--tw-text-opacity)); -} -.BlockTable table { - width: 100%; - border-collapse: collapse; - border-top-width: 1px; - border-bottom-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(216 216 216 / var(--tw-border-opacity)); -} -.SearchResultCard .BlockTable thead mark { - border-radius: 0.25rem; - border-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(111 111 111 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(34 34 34 / var(--tw-bg-opacity)); - padding: 0.125rem; - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -.BlockTable thead { - --tw-bg-opacity: 1; - background-color: rgb(0 69 98 / var(--tw-bg-opacity)); -} -.BlockTable th { - font-family: - Archivo Narrow, - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; - font-size: 1rem; - text-transform: uppercase; - line-height: 1.25; - letter-spacing: 1px; -} -.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th { - --tw-text-opacity: 1; - color: rgb(0 100 128 / var(--tw-text-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: 0.15s; -} -.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th > span { - border-width: 0px; -} -@media (hover: hover) { - .NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th:hover { - --tw-text-opacity: 1; - color: rgb(0 128 164 / var(--tw-text-opacity)); - } -} -.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th svg.IconExternal { - margin-left: 0.25rem; - display: inline-block; - vertical-align: baseline; - font-size: 0.75rem; -} -.NavInternal .NavInternalPanel .NavInternalSection > .BlockTable th { - font-size: 1.125rem; -} -@media (min-width: 1024px) { - .NavInternal .NavInternalPanel .NavInternalSection > .BlockTable th { - font-size: 1rem; - } -} -.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th.active { - --tw-text-opacity: 1; - color: rgb(0 0 0 / var(--tw-text-opacity)); -} -.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th.active > span { - border-bottom-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(227 25 55 / var(--tw-border-opacity)); -} -.BlockTable th { - border-bottom-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(216 216 216 / var(--tw-border-opacity)); - padding: 0.75rem; - text-align: left; - font-weight: 400; - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -@media (min-width: 1024px) { - .BlockTable th { - padding: 1.25rem; - } -} -.BlockTable tbody { - --tw-text-opacity: 1; - color: rgb(34 34 34 / var(--tw-text-opacity)); -} -.BlockTable tbody tr { - display: table-row; - border-top-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(216 216 216 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(255 255 255 / var(--tw-bg-opacity)); -} -.BlockTable td { - padding: 0.75rem; -} -@media (min-width: 1024px) { - .BlockTable td { - padding: 1.25rem; - } -} -.BlockTable td.rich_text p { - margin-bottom: 1rem; -} -.BlockTable td.rich_text ol { - margin-bottom: 1rem; - padding-left: 1.5rem; -} -.BlockTable td.rich_text ul { - margin-bottom: 1rem; - list-style-type: disc; - padding-left: 1.5rem; -} -.BlockTable td.rich_text ul li { - padding: 0; -} -.BlockTable td.rich_text ul li:before { - display: none; -} -.BlockTable td.rich_text ul li, -.BlockTable td.rich_text ol li { - margin-top: 0.25rem; - margin-bottom: 0.25rem; -} -.BlockTable td.rich_text hr { - margin-top: 1rem; - margin-bottom: 1rem; -} -.BlockTeaser .cover-bg { - width: 100%; - --tw-bg-opacity: 1; - background-color: rgb(34 34 34 / var(--tw-bg-opacity)); -} -@media (min-width: 1024px) { - .BlockTeaser .cover-bg { - font-family: 'object-fit: cover'; - position: absolute; - right: 0; - height: 100%; - width: 50%; - object-fit: cover; - } - .BlockTeaser .cover-bg.-full { - right: auto; - width: auto; - min-width: 100%; - left: 50%; - top: 50%; - transform: translate(-50%, -50%); - } -} -.BlockText a, -.BlockTable .rich_text a, -.BlockTable .link a, -.BlockTable .\!link a { - cursor: pointer; - overflow-wrap: break-word; - color: var(--color-action); - text-decoration-line: underline; -} -@media (hover: hover) { - .BlockText a:hover, - .BlockTable .rich_text a:hover, - .BlockTable .link a:hover, - .BlockTable .\!link a:hover { - color: var(--color-action-dark); - } -} -.BlockText p, -.BlockTable .rich_text p, -.BlockTable .link p, -.BlockTable .\!link p { - margin-bottom: 1.25rem; -} -@media (min-width: 1024px) { - .BlockText p, - .BlockTable .rich_text p, - .BlockTable .link p, - .BlockTable .\!link p { - margin-bottom: 2rem; - } -} -.BlockText p:last-child, -.BlockTable .rich_text p:last-child, -.BlockTable .link p:last-child { - margin-bottom: 0; -} -.BlockTable .\!link p:last-child { - margin-bottom: 0; -} -.BlockText h1, -.BlockTable .rich_text h1, -.BlockTable .link h1, -.BlockText h2, -.BlockTable .rich_text h2, -.BlockTable .link h2, -.BlockText h3, -.BlockTable .rich_text h3, -.BlockTable .link h3, -.BlockText h4, -.BlockTable .rich_text h4, -.BlockTable .link h4, -.BlockText h5, -.BlockTable .rich_text h5, -.BlockTable .link h5, -.BlockText h6, -.BlockTable .rich_text h6, -.BlockTable .link h6 { - margin-top: 2.5rem; - margin-bottom: 1.25rem; -} -@media (min-width: 1024px) { - .BlockText h1, - .BlockTable .rich_text h1, - .BlockTable .link h1, - .BlockText h2, - .BlockTable .rich_text h2, - .BlockTable .link h2, - .BlockText h3, - .BlockTable .rich_text h3, - .BlockTable .link h3, - .BlockText h4, - .BlockTable .rich_text h4, - .BlockTable .link h4, - .BlockText h5, - .BlockTable .rich_text h5, - .BlockTable .link h5, - .BlockText h6, - .BlockTable .rich_text h6, - .BlockTable .link h6 { - margin-top: 4.5rem; - } -} -.BlockTable .\!link h1, -.BlockTable .\!link h2, -.BlockTable .\!link h3, -.BlockTable .\!link h4, -.BlockTable .\!link h5, -.BlockTable .\!link h6 { - margin-top: 2.5rem; - margin-bottom: 1.25rem; -} -@media (min-width: 1024px) { - .BlockTable .\!link h1, - .BlockTable .\!link h2, - .BlockTable .\!link h3, - .BlockTable .\!link h4, - .BlockTable .\!link h5, - .BlockTable .\!link h6 { - margin-top: 4.5rem; - } -} -.BlockText h1:last-child, -.BlockTable .rich_text h1:last-child, -.BlockTable .link h1:last-child, -.BlockText h2:last-child, -.BlockTable .rich_text h2:last-child, -.BlockTable .link h2:last-child, -.BlockText h3:last-child, -.BlockTable .rich_text h3:last-child, -.BlockTable .link h3:last-child, -.BlockText h4:last-child, -.BlockTable .rich_text h4:last-child, -.BlockTable .link h4:last-child, -.BlockText h5:last-child, -.BlockTable .rich_text h5:last-child, -.BlockTable .link h5:last-child, -.BlockText h6:last-child, -.BlockTable .rich_text h6:last-child, -.BlockTable .link h6:last-child { - margin-bottom: 0; -} -.BlockTable .\!link h1:last-child, -.BlockTable .\!link h2:last-child, -.BlockTable .\!link h3:last-child, -.BlockTable .\!link h4:last-child, -.BlockTable .\!link h5:last-child, -.BlockTable .\!link h6:last-child { - margin-bottom: 0; -} -.BlockText hr, -.BlockTable .rich_text hr, -.BlockTable .link hr, -.BlockTable .\!link hr { - margin-top: 1.25rem; - margin-bottom: 1.25rem; - border-top-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(216 216 216 / var(--tw-border-opacity)); -} -@media (min-width: 1024px) { - .BlockText hr, - .BlockTable .rich_text hr, - .BlockTable .link hr, - .BlockTable .\!link hr { - margin-top: 2rem; - margin-bottom: 2rem; - } -} -.BlockText hr + h1, -.BlockTable .rich_text hr + h1, -.BlockTable .link hr + h1, -.BlockText hr + h2, -.BlockTable .rich_text hr + h2, -.BlockTable .link hr + h2, -.BlockText hr + h3, -.BlockTable .rich_text hr + h3, -.BlockTable .link hr + h3, -.BlockText hr + h4, -.BlockTable .rich_text hr + h4, -.BlockTable .link hr + h4, -.BlockText hr + h5, -.BlockTable .rich_text hr + h5, -.BlockTable .link hr + h5, -.BlockText hr + h6, -.BlockTable .rich_text hr + h6, -.BlockTable .link hr + h6 { - margin-top: 1.25rem; -} -@media (min-width: 1024px) { - .BlockText hr + h1, - .BlockTable .rich_text hr + h1, - .BlockTable .link hr + h1, - .BlockText hr + h2, - .BlockTable .rich_text hr + h2, - .BlockTable .link hr + h2, - .BlockText hr + h3, - .BlockTable .rich_text hr + h3, - .BlockTable .link hr + h3, - .BlockText hr + h4, - .BlockTable .rich_text hr + h4, - .BlockTable .link hr + h4, - .BlockText hr + h5, - .BlockTable .rich_text hr + h5, - .BlockTable .link hr + h5, - .BlockText hr + h6, - .BlockTable .rich_text hr + h6, - .BlockTable .link hr + h6 { - margin-top: 2rem; - } -} -.BlockTable .\!link hr + h1, -.BlockTable .\!link hr + h2, -.BlockTable .\!link hr + h3, -.BlockTable .\!link hr + h4, -.BlockTable .\!link hr + h5, -.BlockTable .\!link hr + h6 { - margin-top: 1.25rem; -} -@media (min-width: 1024px) { - .BlockTable .\!link hr + h1, - .BlockTable .\!link hr + h2, - .BlockTable .\!link hr + h3, - .BlockTable .\!link hr + h4, - .BlockTable .\!link hr + h5, - .BlockTable .\!link hr + h6 { - margin-top: 2rem; - } -} -.BlockText hr:last-child, -.BlockTable .rich_text hr:last-child, -.BlockTable .link hr:last-child { - margin-bottom: 0; -} -.BlockTable .\!link hr:last-child { - margin-bottom: 0; -} -.BlockText ol, -.BlockTable .rich_text ol, -.BlockTable .link ol, -.BlockText ul, -.BlockTable .rich_text ul, -.BlockTable .link ul, -.BlockTable .\!link ol, -.BlockTable .\!link ul { - margin-bottom: 1.25rem; -} -@media (min-width: 1024px) { - .BlockText ol, - .BlockTable .rich_text ol, - .BlockTable .link ol, - .BlockText ul, - .BlockTable .rich_text ul, - .BlockTable .link ul, - .BlockTable .\!link ol, - .BlockTable .\!link ul { - margin-bottom: 2rem; - } -} -.BlockText ol:last-child, -.BlockTable .rich_text ol:last-child, -.BlockTable .link ol:last-child, -.BlockText ul:last-child, -.BlockTable .rich_text ul:last-child, -.BlockTable .link ul:last-child { - margin-bottom: 0; -} -.BlockTable .\!link ol:last-child, -.BlockTable .\!link ul:last-child { - margin-bottom: 0; -} -.BlockText ol li, -.BlockTable .rich_text ol li, -.BlockTable .link ol li, -.BlockText ul li, -.BlockTable .rich_text ul li, -.BlockTable .link ul li, -.BlockTable .\!link ol li, -.BlockTable .\!link ul li { - margin-top: 0.75rem; - margin-bottom: 0.75rem; -} -.BlockText ol li:last-child, -.BlockTable .rich_text ol li:last-child, -.BlockTable .link ol li:last-child, -.BlockText ul li:last-child, -.BlockTable .rich_text ul li:last-child, -.BlockTable .link ul li:last-child { - margin-bottom: 0; -} -.BlockTable .\!link ol li:last-child, -.BlockTable .\!link ul li:last-child { - margin-bottom: 0; -} -.BlockText ol, -.BlockTable .rich_text ol, -.BlockTable .link ol, -.BlockTable .\!link ol { - list-style-type: decimal; - padding-left: 3rem; -} -.BlockText ul li, -.BlockTable .rich_text ul li, -.BlockTable .link ul li, -.BlockTable .\!link ul li { - position: relative; - padding-left: 3rem; -} -.BlockText ul li:before, -.BlockTable .rich_text ul li:before, -.BlockTable .link ul li:before { - content: ''; - width: 30px; - height: 2px; -} -.BlockTable .\!link ul li:before { - content: '' !important; - width: 30px !important; - height: 2px !important; -} -.BlockText ul li:before, -.BlockTable .rich_text ul li:before, -.BlockTable .link ul li:before { - position: absolute; - top: 0; - left: 0; - margin-top: 0.75rem; - display: block; - --tw-bg-opacity: 1; - background-color: rgb(227 25 55 / var(--tw-bg-opacity)); -} -.BlockTable .\!link ul li:before { - position: absolute; - top: 0; - left: 0; - margin-top: 0.75rem; - display: block; - --tw-bg-opacity: 1; - background-color: rgb(227 25 55 / var(--tw-bg-opacity)); -} -@media (min-width: 640px) { - .BlockText ul li:before, - .BlockTable .rich_text ul li:before, - .BlockTable .link ul li:before { - margin-top: 1rem; - } - .BlockTable .\!link ul li:before { - margin-top: 1rem; - } -} -.ThemeVariantDark .BlockText ul li:before, -.ThemeVariantDark .BlockTable .rich_text ul li:before, -.BlockTable .ThemeVariantDark .rich_text ul li:before, -.ThemeVariantDark .BlockTable .link ul li:before, -.BlockTable .ThemeVariantDark .link ul li:before { - --tw-bg-opacity: 1; - background-color: rgb(231 59 84 / var(--tw-bg-opacity)); -} -.ThemeVariantDark .BlockTable .\!link ul li:before, -.BlockTable .ThemeVariantDark .\!link ul li:before { - --tw-bg-opacity: 1; - background-color: rgb(231 59 84 / var(--tw-bg-opacity)); -} -.BlockVideoEmbed iframe { - min-width: 100%; - left: 0; - right: 0; -} -.FooterInternal svg.IconExternal { - margin-left: 0.5rem; - font-size: 0.75rem; -} -@media (min-width: 1024px) { - .HeroLarge .content-wrapper, - .HeroFocalPoint .content-wrapper { - min-height: 548px; - } -} -@media (min-width: 1280px) { - .HeroLarge .content-wrapper, - .HeroFocalPoint .content-wrapper { - min-height: 684px; - } -} -@media (min-width: 1440px) { - .HeroLarge .content-wrapper, - .HeroFocalPoint .content-wrapper { - min-height: 770px; - } -} -@media (min-width: 1800px) { - .HeroLarge .content-wrapper, - .HeroFocalPoint .content-wrapper { - min-height: 963px; - } -} -@media (min-width: 640px) { - .HeroMedia > div > .vh-crop { - max-height: 65vh; - min-height: 255px; - } -} -@media (min-width: 768px) { - .HeroMedia > div > .vh-crop { - min-height: 300px; - } -} -@media (min-width: 1024px) { - .HeroMedia > div > .vh-crop { - min-height: 375px; - } -} -@media (min-width: 1280px) { - .HeroMedia > div > .vh-crop { - min-height: 430px; - } -} -.HeroMedia > div > .vh-crop > .hero { - height: 30vh; - min-height: 200px; - display: flex; - width: 100%; - align-items: center; - overflow: hidden; -} -@media (min-width: 640px) { - .HeroMedia > div > .vh-crop > .hero { - height: auto; - min-height: none; - } -} -@media (min-width: 1024px) { - .HeroMedia > div > .vh-crop > .hero { - max-height: 625px; - } -} -.HeroMedia #HeroMediaCaptionToggle .IconClose { - display: none; -} -.HeroMedia #HeroMediaCaptionToggle .IconInfo { - font-size: 1.25rem; -} -.HeroMedia #HeroMediaCaptionToggle.expanded .IconClose { - display: block; -} -.HeroMedia #HeroMediaCaptionToggle.expanded .IconInfo { - display: none; -} -.HeroMedium, -.HeroMedium.swiper-slide, -.HeroFeature, -.HeroFeature.swiper-slide { - min-height: 400px; -} -@media (min-width: 1024px) { - .HeroMedium, - .HeroMedium.swiper-slide, - .HeroFeature, - .HeroFeature.swiper-slide { - height: 600px; - min-height: 600px; - } -} -.HeroSmall, -.HeroSmall.swiper-slide { - min-height: 200px; -} -@media (min-width: 1024px) { - .HeroSmall, - .HeroSmall.swiper-slide { - height: 360px; - min-height: 360px; - } -} -.Icon360 { - width: 2.75em; - height: 2.75em; -} -.IconArrow { - width: 1em; - height: 1em; -} -.IconArrows { - width: 2em; - height: 2em; -} -.IconAudio { - width: 2.75em; - height: 2.75em; -} -.IconCalendar, -.IconCaret, -.IconCheckbox, -.IconCheckboxSelected, -.IconClose, -.IconCloseLightbox, -.IconDownload, -.IconDropdown { - width: 1em; - height: 1em; -} -.IconExpand { - width: 2.75em; - height: 2.75em; -} -.IconExternal, -.IconFilter, -.IconGrid, -.IconInfo, -.IconList, -.IconLocation, -.IconMenu, -.IconMinus { - width: 1em; - height: 1em; -} -.IconMute, -.IconNext, -.IconPause, -.IconPlay { - width: 2.75em; - height: 2.75em; -} -.IconPlus { - width: 1em; - height: 1em; -} -.IconPrev { - width: 2.75em; - height: 2.75em; -} -.IconSearch, -.IconSocialEmail, -.IconSocialFacebook, -.IconSocialInstagram, -.IconSocialTwitter, -.IconSocialYoutube, -.IconSocialReddit { - width: 1em; - height: 1em; -} -.IconStop { - width: 2.75em; - height: 2.75em; -} -.IconTime { - width: 1em; - height: 1em; -} -.IconUser { - width: 1.4em; - height: 1.4em; -} -.IconVolume { - width: 2.75em; - height: 2.75em; -} -.MixinAnimationCaret, -.AnimationCaret { - display: flex; - align-items: center; -} -.MixinAnimationCaret > .arrow-wrapper, -.AnimationCaret > .arrow-wrapper { - position: relative; - display: block; - height: 1.5rem; - width: 1.5rem; -} -.MixinAnimationCaret > .arrow-wrapper > .arrow, -.MixinAnimationCaret > .arrow-wrapper > .arrow-fixed, -.AnimationCaret > .arrow-wrapper > .arrow, -.AnimationCaret > .arrow-wrapper > .arrow-fixed { - position: absolute; - top: 50%; - left: 0; - display: block; - --tw-translate-y: -50%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - font-size: 0.875rem; -} -@media (hover: hover) { - .MixinAnimationCaret:hover > .arrow-wrapper > .arrow, - .AnimationCaret:hover > .arrow-wrapper > .arrow { - animation: arrow-anim 0.25s ease-in normal; - } - .MixinAnimationCaret:hover > .arrow-wrapper > .arrow-fixed, - .AnimationCaret:hover > .arrow-wrapper > .arrow-fixed { - animation: arrow-fixed-anim 0.25s ease-in normal; - } -} -.MixinAnimationCaret.caret-inline, -.AnimationCaret.caret-inline { - display: inline-block; -} -.MixinAnimationCaret.caret-inline > .arrow-wrapper, -.AnimationCaret.caret-inline > .arrow-wrapper { - display: inline-block; - width: 1px; -} -.MixinAnimationCaret.caret-inline > .arrow-wrapper > .arrow, -.MixinAnimationCaret.caret-inline > .arrow-wrapper > .arrow-fixed, -.AnimationCaret.caret-inline > .arrow-wrapper > .arrow, -.AnimationCaret.caret-inline > .arrow-wrapper > .arrow-fixed { - margin-top: 0.45em; -} -@keyframes arrow-anim { - 0% { - opacity: 1; - transform: translateY(-50%); - } - 50% { - transform: translate(1rem, -50%); - opacity: 0; - } - to { - transform: translate(1rem, -50%); - opacity: 0; - } -} -@keyframes arrow-fixed-anim { - 0% { - opacity: 0; - transform: translate(-0.5rem, -50%); - } - to { - opacity: 1; - transform: translateY(-50%); - } -} -.MixinCarousel .swiper, -.BaseCarouselCards .swiper { - overflow: visible !important; -} -.MixinCarousel .swiper .swiper-prev, -.MixinCarousel .swiper .swiper-next, -.BaseCarouselCards .swiper .swiper-prev, -.BaseCarouselCards .swiper .swiper-next { - margin-top: -0.25rem; - height: auto; - width: auto; -} -.MixinCarousel .swiper .swiper-prev.swiper-button-disabled, -.MixinCarousel .swiper .swiper-next.swiper-button-disabled, -.BaseCarouselCards .swiper .swiper-prev.swiper-button-disabled, -.BaseCarouselCards .swiper .swiper-next.swiper-button-disabled { - visibility: hidden; -} -.MixinCarousel .swiper .swiper-prev.BaseButton, -.MixinCarousel .swiper .swiper-next.BaseButton, -.BaseCarouselCards .swiper .swiper-prev.BaseButton, -.BaseCarouselCards .swiper .swiper-next.BaseButton { - transition-property: none !important; -} -.MixinCarousel .swiper .swiper-prev.BaseButton > .label, -.MixinCarousel .swiper .swiper-next.BaseButton > .label, -.BaseCarouselCards .swiper .swiper-prev.BaseButton > .label, -.BaseCarouselCards .swiper .swiper-next.BaseButton > .label { - display: flex; - overflow: hidden; -} -.MixinCarousel .swiper .swiper-prev.BaseButton > .label > .arrow-wrapper, -.MixinCarousel .swiper .swiper-next.BaseButton > .label > .arrow-wrapper, -.BaseCarouselCards .swiper .swiper-prev.BaseButton > .label > .arrow-wrapper, -.BaseCarouselCards .swiper .swiper-next.BaseButton > .label > .arrow-wrapper { - position: relative; - display: block; - height: 100%; - width: 100%; - overflow: hidden; -} -.MixinCarousel .swiper .swiper-prev.BaseButton > .label > .arrow-wrapper > .arrow, -.MixinCarousel .swiper .swiper-next.BaseButton > .label > .arrow-wrapper > .arrow, -.BaseCarouselCards .swiper .swiper-prev.BaseButton > .label > .arrow-wrapper > .arrow, -.BaseCarouselCards .swiper .swiper-next.BaseButton > .label > .arrow-wrapper > .arrow { - display: block; -} -.MixinCarousel .swiper .swiper-prev.BaseButton > .label > .arrow-wrapper > .arrow-fixed, -.MixinCarousel .swiper .swiper-next.BaseButton > .label > .arrow-wrapper > .arrow-fixed, -.BaseCarouselCards .swiper .swiper-prev.BaseButton > .label > .arrow-wrapper > .arrow-fixed, -.BaseCarouselCards .swiper .swiper-next.BaseButton > .label > .arrow-wrapper > .arrow-fixed { - position: absolute; - top: 0; - left: 0; - display: block; -} -@media (hover: hover) { - .MixinCarousel .swiper .swiper-prev.BaseButton > .label:hover > .arrow-wrapper > .arrow, - .MixinCarousel .swiper .swiper-prev.BaseButton > .label:hover > .arrow-wrapper > .arrow-fixed, - .MixinCarousel .swiper .swiper-next.BaseButton > .label:hover > .arrow-wrapper > .arrow, - .MixinCarousel .swiper .swiper-next.BaseButton > .label:hover > .arrow-wrapper > .arrow-fixed, - .BaseCarouselCards .swiper .swiper-prev.BaseButton > .label:hover > .arrow-wrapper > .arrow, - .BaseCarouselCards .swiper .swiper-prev.BaseButton > .label:hover > .arrow-wrapper > .arrow-fixed, - .BaseCarouselCards .swiper .swiper-next.BaseButton > .label:hover > .arrow-wrapper > .arrow, - .BaseCarouselCards - .swiper - .swiper-next.BaseButton - > .label:hover - > .arrow-wrapper - > .arrow-fixed { - animation-delay: 50ms !important; - } -} -@media (min-width: 1024px) { - @media (hover: hover) { - .MixinCarousel .swiper .swiper-next.BaseButton > .label:hover > .arrow-wrapper > .arrow, - .BaseCarouselCards .swiper .swiper-next.BaseButton > .label:hover > .arrow-wrapper > .arrow { - animation: arrow-carousel-next-anim 0.1s linear normal; - } - .MixinCarousel .swiper .swiper-next.BaseButton > .label:hover > .arrow-wrapper > .arrow-fixed, - .BaseCarouselCards - .swiper - .swiper-next.BaseButton - > .label:hover - > .arrow-wrapper - > .arrow-fixed { - animation: arrow-carousel-next-fixed-anim 0.1s linear normal; - } - .MixinCarousel .swiper .swiper-prev.BaseButton > .label:hover > .arrow-wrapper > .arrow, - .BaseCarouselCards .swiper .swiper-prev.BaseButton > .label:hover > .arrow-wrapper > .arrow { - animation: arrow-carousel-prev-anim 0.1s linear normal; - } - .MixinCarousel .swiper .swiper-prev.BaseButton > .label:hover > .arrow-wrapper > .arrow-fixed, - .BaseCarouselCards - .swiper - .swiper-prev.BaseButton - > .label:hover - > .arrow-wrapper - > .arrow-fixed { - animation: arrow-carousel-prev-fixed-anim 0.1s linear normal; - } - } -} -.MixinCarousel .swiper-wrapper, -.BaseCarouselCards .swiper-wrapper { - overflow: visible !important; -} -.MixinCarousel .swiper-wrapper .swiper-slide, -.BaseCarouselCards .swiper-wrapper .swiper-slide { - height: auto; - opacity: 0.5; - transition-property: opacity; - transition-duration: 0.5s; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); -} -.MixinCarousel .swiper-wrapper .swiper-slide.swiper-slide-visible, -.MixinCarousel .swiper-wrapper .swiper-slide:focus, -.MixinCarousel .swiper-wrapper .swiper-slide:focus-within, -.BaseCarouselCards .swiper-wrapper .swiper-slide.swiper-slide-visible, -.BaseCarouselCards .swiper-wrapper .swiper-slide:focus, -.BaseCarouselCards .swiper-wrapper .swiper-slide:focus-within { - opacity: 1; -} -.MixinCarousel.-cards .swiper .swiper-navigation, -.BaseCarouselCards.-cards .swiper .swiper-navigation { - padding-top: 28.125%; -} -.MixinCarousel.-cards .swiper .swiper-navigation .swiper-prev, -.MixinCarousel.-cards .swiper .swiper-navigation .swiper-next, -.BaseCarouselCards.-cards .swiper .swiper-navigation .swiper-prev, -.BaseCarouselCards.-cards .swiper .swiper-navigation .swiper-next { - --tw-translate-y: -50%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.MixinCarousel.-tiles, -.BaseCarouselCards.-tiles { - padding-bottom: 1.25rem; -} -.MixinCarousel.-tiles .swiper .swiper-navigation, -.BaseCarouselCards.-tiles .swiper .swiper-navigation { - top: 50%; -} -.MixinCarousel.-tiles .swiper .swiper-navigation .swiper-prev, -.MixinCarousel.-tiles .swiper .swiper-navigation .swiper-next, -.BaseCarouselCards.-tiles .swiper .swiper-navigation .swiper-prev, -.BaseCarouselCards.-tiles .swiper .swiper-navigation .swiper-next { - --tw-translate-y: -50%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.MixinCarousel .swiper-lazy, -.BaseCarouselCards .swiper-lazy { - opacity: 0; -} -.MixinCarousel .swiper-lazy.swiper-lazy-loaded, -.BaseCarouselCards .swiper-lazy.swiper-lazy-loaded { - opacity: 1; -} -.NavInternal { - position: relative; - left: 0; - right: 0; - z-index: 20; - height: 100%; - overflow-y: auto; -} -@media (min-width: 1024px) { - .NavInternal { - position: unset; - overflow-y: unset; - left: unset; - right: unset; - height: unset; - z-index: unset; - } -} -.NavInternal .panel-wrapper { - visibility: hidden; - max-height: 0; - opacity: 0; - transition: - visibility 0s linear 0.3s, - opacity 0.3s, - max-height 0s linear 300s; - height: 0px; - overflow: hidden; -} -@media (min-width: 1024px) { - .NavInternal .panel-wrapper { - height: unset; - } -} -.NavInternal .panel-wrapper.spacer:before { - content: ''; - position: relative; - z-index: 0; - display: block; - height: 100%; - width: 100%; - --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); -} -.NavInternal li.expanded .panel-wrapper { - visibility: visible; - max-height: 100%; - opacity: 1; - transition: - visibility 0s, - opacity 0.3s, - max-height 0s; - height: auto; - overflow: visible; -} -@media (min-width: 1024px) { - .NavInternal li.expanded .panel-wrapper { - height: unset; - } -} -.NavInternal .top-level { - scrollbar-width: thin; - scrollbar-color: rgba(0, 0, 0, 0.4) transparent; -} -.NavInternal .top-level::-webkit-scrollbar { - width: 1px; -} -.NavInternal .top-level::-webkit-scrollbar-track { - background: transparent; -} -.NavInternal .top-level::-webkit-scrollbar-thumb { - background-color: #0006; - border-radius: 6px; - border: 6px solid white; - border-left: none; - border-right: none; -} -@media (min-width: 1024px) { - .NavInternal .top-level > li { - border-top-width: 3px; - border-color: transparent; - } -} -.NavInternal .top-level > li > button, -.NavInternal .top-level > li > a { - cursor: pointer; - border-left-width: 3px; - border-color: transparent; - padding: 0.75rem 1rem; - text-align: left; - font-size: 1.25rem; - font-weight: 500; - line-height: 1.25; - --tw-text-opacity: 1; - color: rgb(34 34 34 / var(--tw-text-opacity)); -} -@media (min-width: 1024px) { - .NavInternal .top-level > li > button, - .NavInternal .top-level > li > a { - position: relative; - z-index: 10; - margin-left: 1rem; - margin-right: 1rem; - height: 100%; - white-space: nowrap; - border-left-width: 0px; - border-bottom-width: 3px; - padding: 1.5rem 0.25rem; - font-size: 1rem; - } -} -.NavInternal .top-level > li > button:focus, -.NavInternal .top-level > li > a:focus { - border-color: #2223; - outline: 2px solid transparent; - outline-offset: 2px; -} -@media (hover: hover) { - .NavInternal .top-level > li > button:hover, - .NavInternal .top-level > li > a:hover { - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-opacity)); - } -} -.NavInternal .top-level > li > button > span, -.NavInternal .top-level > li > a > span { - display: inline-flex; - flex-direction: column; -} -.NavInternal .top-level > li > button > span:after, -.NavInternal .top-level > li > a > span:after { - content: attr(data-text); - content: attr(data-text) / ''; - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; - pointer-events: none; - visibility: hidden; - height: 0px; - overflow: hidden; - font-weight: 700; -} -@media speech { - .NavInternal .top-level > li > button > span:after, - .NavInternal .top-level > li > a > span:after { - display: none; - } -} -.NavInternal .top-level > li > button .IconDropdown { - font-size: 0.6rem; - pointer-events: none; - margin-left: 0.5rem; - flex-shrink: 0; -} -@media (min-width: 1024px) { - .NavInternal .top-level > li:first-child > button, - .NavInternal .top-level > li:first-child > a { - margin-left: 0; - padding-left: 0; - } - .NavInternal .top-level > li:last-child > button, - .NavInternal .top-level > li:last-child > a { - margin-right: 0; - padding-right: 0; - } -} -.NavInternal .top-level > li.active > button, -.NavInternal .top-level > li.active > a, -.NavInternal .top-level > li.ancestor > button, -.NavInternal .top-level > li.ancestor > a { - --tw-border-opacity: 1; - border-color: rgb(227 25 55 / var(--tw-border-opacity)); - font-weight: 700; -} -.NavInternal .top-level > li.expanded > button { - --tw-border-opacity: 1; - border-color: rgb(0 0 0 / var(--tw-border-opacity)); - font-weight: 700; -} -.NavInternal .NavInternalPanel { - --tw-bg-opacity: 1; - background-color: rgb(250 250 250 / var(--tw-bg-opacity)); -} -@media (min-width: 1024px) { - .NavInternal .NavInternalPanel { - max-height: 60vh; - overflow-y: auto; - } -} -.NavInternal .NavInternalPanel .NavInternalSection { - page-break-inside: avoid; - -moz-column-break-inside: avoid; - break-inside: avoid; -} -@supports (-moz-appearance: none) { - .NavInternal .NavInternalPanel .NavInternalSection { - display: inline-grid; - } -} -@media not all and (min-resolution: 0.001dpcm) { - @supports (-webkit-appearance: none) and (stroke-color: transparent) { - .NavInternal .NavInternalPanel .NavInternalSection { - display: inline-grid; - } - } -} -.NavInternal .NavInternalPanel.allow-breaks .NavInternalSection { - page-break-inside: auto; - -moz-column-break-inside: auto; - break-inside: auto; - display: block; -} -.NavInternal .NavInternalPanel p.NavInternalSection:last-of-type { - margin-bottom: 1.5rem; -} -.NavInternal .NavInternalPanel .NavInternalSection.has-children { - margin-bottom: 1.5rem; -} -.NavInternal .NavInternalPanel .NavInternalSection:last-child { - margin-bottom: 0; -} -@media (min-width: 1024px) { - .NavInternal .NavInternalPanel .NavInternalSection:last-child { - margin-bottom: 1.5rem; - } -} -.NavInternal .NavInternalPanel .repeated-item a { - font-size: 1.125rem; - font-weight: 500; - line-height: 1.25; - --tw-text-opacity: 1; - color: rgb(0 100 128 / var(--tw-text-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: 0.15s; -} -.NavInternal .NavInternalPanel .repeated-item a span { - border-bottom-width: 1px; - border-color: transparent; -} -@media (hover: hover) { - .NavInternal .NavInternalPanel .repeated-item a:hover { - --tw-text-opacity: 1; - color: rgb(0 128 164 / var(--tw-text-opacity)); - } -} -.NavInternal .NavInternalPanel .repeated-item a.active { - --tw-text-opacity: 1; - color: rgb(0 0 0 / var(--tw-text-opacity)); -} -.NavInternal .NavInternalPanel .repeated-item a.active > span { - --tw-border-opacity: 1; - border-color: rgb(227 25 55 / var(--tw-border-opacity)); -} -.NavInternal .NavInternalPanel .NavInternalSection a { - font-size: 1.125rem; - font-weight: 500; - line-height: 1.25; - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-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: 0.15s; - page-break-inside: avoid; - -moz-column-break-inside: avoid; - break-inside: avoid; - display: block; -} -@media (min-width: 1024px) { - .NavInternal .NavInternalPanel .NavInternalSection a { - font-size: 1rem; - font-weight: 400; - } -} -.NavInternal .NavInternalPanel .NavInternalSection a > span { - border-bottom-width: 1px; - border-color: transparent; -} -.NavInternal .NavInternalPanel .NavInternalSection a svg { - display: inline-block; -} -.NavInternal .NavInternalPanel .NavInternalSection a svg.IconExternal { - font-size: 0.875em; -} -.NavInternal .NavInternalPanel .NavInternalSection a svg.IconDownload { - position: relative; - top: -0.125rem; -} -@media (hover: hover) { - .NavInternal .NavInternalPanel .NavInternalSection a:hover { - --tw-text-opacity: 1; - color: rgb(34 34 34 / var(--tw-text-opacity)); - } - .NavInternal .NavInternalPanel .NavInternalSection a:hover > span { - --tw-border-opacity: 1; - border-color: rgb(34 34 34 / var(--tw-border-opacity)); - } -} -.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle { - --tw-text-opacity: 1; - color: rgb(0 100 128 / var(--tw-text-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: 0.15s; -} -.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle > span { - border-width: 0px; -} -@media (hover: hover) { - .NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle:hover { - --tw-text-opacity: 1; - color: rgb(0 128 164 / var(--tw-text-opacity)); - } -} -.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle svg.IconExternal { - margin-left: 0.25rem; - display: inline-block; - vertical-align: baseline; - font-size: 0.75rem; -} -.NavInternal .NavInternalPanel .NavInternalSection a svg.IconArrow { - display: none; -} -.NavInternal .NavInternalPanel .NavInternalSection a svg.IconDownload { - margin-left: 0.25rem; - font-size: 0.875rem; -} -.NavInternal .NavInternalPanel .NavInternalSection a svg.IconExternal { - margin-left: 0.25rem; - font-size: 0.75rem; -} -.NavInternal .NavInternalPanel .NavInternalSection > .text-subtitle { - font-size: 1.125rem; -} -@media (min-width: 1024px) { - .NavInternal .NavInternalPanel .NavInternalSection > .text-subtitle { - font-size: 1rem; - } -} -.NavInternal .NavInternalPanel .NavInternalSection a.active, -.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle.active { - --tw-text-opacity: 1; - color: rgb(0 0 0 / var(--tw-text-opacity)); -} -.NavInternal .NavInternalPanel .NavInternalSection a.active > span, -.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle.active > span { - border-bottom-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(227 25 55 / var(--tw-border-opacity)); -} -#NavMobileToggle .IconClose, -#NavMobileToggle.expanded .IconMenu { - display: none; -} -#NavMobileToggle.expanded .IconClose { - display: block; -} -#NavBgOverlay { - visibility: visible; - opacity: 0.8; - transition: - visibility 0s linear 0s, - opacity 0.3s; -} -#NavBgOverlay.invisible-overlay { - visibility: hidden; - opacity: 0; - transition: - visibility 0s linear 0.3s, - opacity 0.3s; -} -.SearchResultCard .bg-dark-blue mark { - border-radius: 0.25rem; - border-width: 1px; - --tw-border-opacity: 1; - border-color: rgb(111 111 111 / var(--tw-border-opacity)); - --tw-bg-opacity: 1; - background-color: rgb(34 34 34 / var(--tw-bg-opacity)); - padding: 0.125rem; - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -.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; -} -.pointer-events-auto { - pointer-events: auto; -} -.visible { - visibility: visible; -} -.invisible { - visibility: hidden; -} -.static { - position: static; -} -.fixed { - position: fixed; -} -.absolute { - position: absolute; -} -.relative { - position: relative; -} -.sticky { - position: sticky; -} -.inset-0 { - top: 0; - right: 0; - bottom: 0; - left: 0; -} -.inset-x-0 { - left: 0; - right: 0; -} -.inset-y-0 { - top: 0; - bottom: 0; -} -.-bottom-4 { - bottom: -1rem; -} -.-right-px { - right: -1px; -} -.-top-0 { - top: -0px; -} -.-top-0\.5 { - top: -0.125rem; -} -.-top-1 { - top: -0.25rem; -} -.-top-px { - top: -1px; -} -.bottom-0 { - bottom: 0; -} -.bottom-10 { - bottom: 2.5rem; -} -.left-0 { - left: 0; -} -.left-1\/2 { - left: 50%; -} -.left-auto { - left: auto; -} -.right-0 { - right: 0; -} -.right-10 { - right: 2.5rem; -} -.right-5 { - right: 1.25rem; -} -.right-px { - right: 1px; -} -.top-0 { - top: 0; -} -.top-1\/2 { - top: 50%; -} -.top-5 { - top: 1.25rem; -} -.top-auto { - top: auto; -} -.top-px { - top: 1px; -} -.isolate { - isolation: isolate; -} -.z-0 { - z-index: 0; -} -.z-10 { - z-index: 10; -} -.z-20 { - z-index: 20; -} -.z-30 { - z-index: 30; -} -.z-40 { - z-index: 40; -} -.z-50 { - z-index: 50; -} -.z-60 { - z-index: 60; -} -.order-1 { - order: 1; -} -.order-2 { - order: 2; -} -.order-3 { - order: 3; -} -.col-span-1 { - grid-column: span 1 / span 1; -} -.col-span-10 { - grid-column: span 10 / span 10; -} -.col-span-11 { - grid-column: span 11 / span 11; -} -.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-7 { - grid-column: span 7 / span 7; -} -.col-span-8 { - grid-column: span 8 / span 8; -} -.col-span-9 { - grid-column: span 9 / span 9; -} -.col-span-full { - grid-column: 1 / -1; -} -.col-start-1 { - grid-column-start: 1; -} -.col-start-10 { - grid-column-start: 10; -} -.col-start-2 { - grid-column-start: 2; -} -.col-start-3 { - grid-column-start: 3; -} -.col-start-4 { - grid-column-start: 4; -} -.col-start-6 { - grid-column-start: 6; -} -.col-start-7 { - grid-column-start: 7; -} -.col-start-8 { - grid-column-start: 8; -} -.col-start-9 { - grid-column-start: 9; -} -.col-end-10 { - grid-column-end: 10; -} -.col-end-11 { - grid-column-end: 11; -} -.col-end-12 { - grid-column-end: 12; -} -.col-end-13 { - grid-column-end: 13; -} -.col-end-6 { - grid-column-end: 6; -} -.col-end-7 { - grid-column-end: 7; -} -.col-end-8 { - grid-column-end: 8; -} -.col-end-9 { - grid-column-end: 9; -} -.row-span-1 { - grid-row: span 1 / span 1; -} -.row-span-2 { - grid-row: span 2 / span 2; -} -.row-start-2 { - grid-row-start: 2; -} -.m-0 { - margin: 0; -} -.m-3 { - margin: 0.75rem; -} -.m-auto { - margin: auto; -} -.-mx-1 { - margin-left: -0.25rem; - margin-right: -0.25rem; -} -.-mx-4 { - margin-left: -1rem; - margin-right: -1rem; -} -.-my-2 { - margin-top: -0.5rem; - margin-bottom: -0.5rem; -} -.mx-1 { - margin-left: 0.25rem; - margin-right: 0.25rem; -} -.mx-4 { - margin-left: 1rem; - margin-right: 1rem; -} -.mx-6 { - margin-left: 1.5rem; - margin-right: 1.5rem; -} -.mx-auto { - margin-left: auto; - margin-right: auto; -} -.my-10 { - margin-top: 2.5rem; - margin-bottom: 2.5rem; -} -.my-12 { - margin-top: 3rem; - margin-bottom: 3rem; -} -.my-16 { - margin-top: 4rem; - margin-bottom: 4rem; -} -.my-18 { - margin-top: 4.5rem; - margin-bottom: 4.5rem; -} -.my-2 { - margin-top: 0.5rem; - margin-bottom: 0.5rem; -} -.my-3 { - margin-top: 0.75rem; - margin-bottom: 0.75rem; -} -.my-4 { - margin-top: 1rem; - margin-bottom: 1rem; -} -.my-5 { - margin-top: 1.25rem; - margin-bottom: 1.25rem; -} -.my-6 { - margin-top: 1.5rem; - margin-bottom: 1.5rem; -} -.my-8 { - margin-top: 2rem; - margin-bottom: 2rem; -} -.my-auto { - margin-top: auto; - margin-bottom: auto; -} -.-mb-1 { - margin-bottom: -0.25rem; -} -.-mb-2 { - margin-bottom: -0.5rem; -} -.-mb-3 { - margin-bottom: -0.75rem; -} -.-mb-5 { - margin-bottom: -1.25rem; -} -.-ml-1 { - margin-left: -0.25rem; -} -.-ml-16 { - margin-left: -4rem; -} -.-ml-2 { - margin-left: -0.5rem; -} -.-ml-20 { - margin-left: -5rem; -} -.-ml-3 { - margin-left: -0.75rem; -} -.-ml-4 { - margin-left: -1rem; -} -.-ml-5 { - margin-left: -1.25rem; -} -.-ml-8 { - margin-left: -2rem; -} -.-ml-px { - margin-left: -1px; -} -.-mr-16 { - margin-right: -4rem; -} -.-mr-2 { - margin-right: -0.5rem; -} -.-mr-20 { - margin-right: -5rem; -} -.-mr-26 { - margin-right: -6.5rem; -} -.-mr-3 { - margin-right: -0.75rem; -} -.-mr-4 { - margin-right: -1rem; -} -.-mt-1 { - margin-top: -0.25rem; -} -.-mt-1\.5 { - margin-top: -0.375rem; -} -.-mt-10 { - margin-top: -2.5rem; -} -.-mt-12 { - margin-top: -3rem; -} -.-mt-14 { - margin-top: -3.5rem; -} -.-mt-18 { - margin-top: -4.5rem; -} -.-mt-2 { - margin-top: -0.5rem; -} -.-mt-20 { - margin-top: -5rem; -} -.-mt-24 { - margin-top: -6rem; -} -.-mt-3 { - margin-top: -0.75rem; -} -.-mt-5 { - margin-top: -1.25rem; -} -.-mt-6 { - margin-top: -1.5rem; -} -.-mt-px { - margin-top: -1px; -} -.mb-0 { - margin-bottom: 0; -} -.mb-0\.5 { - margin-bottom: 0.125rem; -} -.mb-1 { - margin-bottom: 0.25rem; -} -.mb-10 { - margin-bottom: 2.5rem; -} -.mb-12 { - margin-bottom: 3rem; -} -.mb-14 { - margin-bottom: 3.5rem; -} -.mb-16 { - margin-bottom: 4rem; -} -.mb-2 { - margin-bottom: 0.5rem; -} -.mb-2\.5 { - margin-bottom: 0.625rem; -} -.mb-20 { - margin-bottom: 5rem; -} -.mb-22 { - margin-bottom: 5.5rem; -} -.mb-3 { - margin-bottom: 0.75rem; -} -.mb-30 { - margin-bottom: 7.5rem; -} -.mb-4 { - margin-bottom: 1rem; -} -.mb-5 { - margin-bottom: 1.25rem; -} -.mb-6 { - margin-bottom: 1.5rem; -} -.mb-8 { - margin-bottom: 2rem; -} -.mb-px { - margin-bottom: 1px; -} -.ml-0 { - margin-left: 0; -} -.ml-1 { - margin-left: 0.25rem; -} -.ml-14 { - margin-left: 3.5rem; -} -.ml-2 { - margin-left: 0.5rem; -} -.ml-2\.5 { - margin-left: 0.625rem; -} -.ml-3 { - margin-left: 0.75rem; -} -.ml-4 { - margin-left: 1rem; -} -.ml-5 { - margin-left: 1.25rem; -} -.ml-6 { - margin-left: 1.5rem; -} -.ml-7 { - margin-left: 1.75rem; -} -.ml-auto { - margin-left: auto; -} -.mr-0 { - margin-right: 0; -} -.mr-1 { - margin-right: 0.25rem; -} -.mr-10 { - margin-right: 2.5rem; -} -.mr-16 { - margin-right: 4rem; -} -.mr-2 { - margin-right: 0.5rem; -} -.mr-3 { - margin-right: 0.75rem; -} -.mr-4 { - margin-right: 1rem; -} -.mr-5 { - margin-right: 1.25rem; -} -.mr-6 { - margin-right: 1.5rem; -} -.mr-8 { - margin-right: 2rem; -} -.mr-auto { - margin-right: auto; -} -.mt-0 { - margin-top: 0; -} -.mt-0\.5 { - margin-top: 0.125rem; -} -.mt-1 { - margin-top: 0.25rem; -} -.mt-10 { - margin-top: 2.5rem; -} -.mt-12 { - margin-top: 3rem; -} -.mt-16 { - margin-top: 4rem; -} -.mt-18 { - margin-top: 4.5rem; -} -.mt-2 { - margin-top: 0.5rem; -} -.mt-20 { - margin-top: 5rem; -} -.mt-24 { - margin-top: 6rem; -} -.mt-26 { - margin-top: 6.5rem; -} -.mt-28 { - margin-top: 7rem; -} -.mt-3 { - margin-top: 0.75rem; -} -.mt-36 { - margin-top: 9rem; -} -.mt-4 { - margin-top: 1rem; -} -.mt-5 { - margin-top: 1.25rem; -} -.mt-6 { - margin-top: 1.5rem; -} -.mt-8 { - margin-top: 2rem; -} -.mt-px { - margin-top: 1px; -} -.block { - display: block; -} -.inline-block { - display: inline-block; -} -.\!inline { - display: inline !important; -} -.inline { - display: inline; -} -.flex { - display: flex; -} -.inline-flex { - display: inline-flex; -} -.table { - display: table; -} -.\!grid { - display: grid !important; -} -.grid { - display: grid; -} -.inline-grid { - display: inline-grid; -} -.contents { - display: contents; -} -.hidden { - display: none; -} -.h-0 { - height: 0px; -} -.h-1 { - height: 0.25rem; -} -.h-12 { - height: 3rem; -} -.h-14 { - height: 3.5rem; -} -.h-16 { - height: 4rem; -} -.h-18 { - height: 4.5rem; -} -.h-2 { - height: 0.5rem; -} -.h-20 { - height: 5rem; -} -.h-22 { - height: 5.5rem; -} -.h-24 { - height: 6rem; -} -.h-25 { - height: 6.25rem; -} -.h-28 { - height: 7rem; -} -.h-2px { - height: 2px; -} -.h-3 { - height: 0.75rem; -} -.h-38 { - height: 9.5rem; -} -.h-4 { - height: 1rem; -} -.h-40 { - height: 10rem; -} -.h-5 { - height: 1.25rem; -} -.h-6 { - height: 1.5rem; -} -.h-7 { - height: 1.75rem; -} -.h-8 { - height: 2rem; -} -.h-80 { - height: 20rem; -} -.h-auto { - height: auto; -} -.h-full { - height: 100%; -} -.h-screen { - height: 100vh; -} -.max-h-48 { - max-height: 12rem; -} -.max-h-full { - max-height: 100%; -} -.max-h-screen { - max-height: 100vh; -} -.max-h-xl { - max-height: 36rem; -} -.min-h-1\/2 { - min-height: 50%; -} -.min-h-100 { - min-height: 25rem; -} -.min-h-28 { - min-height: 7rem; -} -.min-h-32 { - min-height: 8rem; -} -.min-h-66 { - min-height: 16rem; -} -.min-h-full { - min-height: 100%; -} -.w-0 { - width: 0px; -} -.w-1 { - width: 0.25rem; -} -.w-1\/2 { - width: 50%; -} -.w-1\/3 { - width: 33.333333%; -} -.w-1\/4 { - width: 25%; -} -.w-1\/5 { - width: 20%; -} -.w-1\/6 { - width: 16.666667%; -} -.w-12 { - width: 3rem; -} -.w-14 { - width: 3.5rem; -} -.w-16 { - width: 4rem; -} -.w-18 { - width: 4.5rem; -} -.w-2 { - width: 0.5rem; -} -.w-2\/3 { - width: 66.666667%; -} -.w-2\/5 { - width: 40%; -} -.w-20 { - width: 5rem; -} -.w-22 { - width: 5.5rem; -} -.w-25 { - width: 6.25rem; -} -.w-26 { - width: 6.5rem; -} -.w-3 { - width: 0.75rem; -} -.w-3\/5 { - width: 60%; -} -.w-30 { - width: 7.5rem; -} -.w-38 { - width: 9.5rem; -} -.w-4\/5 { - width: 80%; -} -.w-40 { - width: 10rem; -} -.w-5 { - width: 1.25rem; -} -.w-5\/6 { - width: 83.333333%; -} -.w-56 { - width: 14rem; -} -.w-6 { - width: 1.5rem; -} -.w-64 { - width: 16rem; -} -.w-7 { - width: 1.75rem; -} -.w-72 { - width: 17.5rem; -} -.w-8 { - width: 2rem; -} -.w-96 { - width: 24rem; -} -.w-auto { - width: auto; -} -.w-full { - width: 100%; -} -.w-xl { - width: 36rem; -} -.min-w-12 { - min-width: 3rem; -} -.min-w-full { - min-width: 100%; -} -.max-w-2xl { - max-width: 42rem; -} -.max-w-4xl { - max-width: 56rem; -} -.max-w-full { - max-width: 100%; -} -.max-w-lg { - max-width: 32rem; -} -.max-w-none { - max-width: none; -} -.max-w-screen-2xl { - max-width: 1440px; -} -.max-w-screen-3xl { - max-width: 1800px; -} -.max-w-screen-4xl { - max-width: 1900px; -} -.max-w-screen-xl { - max-width: 1280px; -} -.max-w-sm { - max-width: 24rem; -} -.max-w-xl { - max-width: 36rem; -} -.flex-1 { - flex: 1 1 0%; -} -.flex-none { - flex: none; -} -.flex-shrink-0, -.shrink-0 { - flex-shrink: 0; -} -.flex-grow { - flex-grow: 1; -} -.table-auto { - table-layout: auto; -} -.border-collapse { - border-collapse: collapse; -} -.-translate-x-1\/2 { - --tw-translate-x: -50%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.-translate-x-1\/3 { - --tw-translate-x: -33.333333%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.-translate-x-1\/4 { - --tw-translate-x: -25%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.-translate-x-3\/7 { - --tw-translate-x: -42.8571429%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(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)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.-translate-y-2 { - --tw-translate-y: -0.5rem; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.-translate-y-full { - --tw-translate-y: -100%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.translate-x-0 { - --tw-translate-x: 0px; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.translate-x-0\.5 { - --tw-translate-x: 0.125rem; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.translate-x-1\/2 { - --tw-translate-x: 50%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.translate-x-1\/3 { - --tw-translate-x: 33.333333%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.translate-x-1\/4 { - --tw-translate-x: 25%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.translate-y-0 { - --tw-translate-y: 0px; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.translate-y-12 { - --tw-translate-y: 3rem; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.translate-y-32 { - --tw-translate-y: 8rem; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(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)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.rotate-45 { - --tw-rotate: 45deg; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(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)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.scale-100 { - --tw-scale-x: 1; - --tw-scale-y: 1; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.scale-103 { - --tw-scale-x: 1.03; - --tw-scale-y: 1.03; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.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)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.scale-125 { - --tw-scale-x: 1.25; - --tw-scale-y: 1.25; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(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)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.transform-gpu { - transform: translate3d(var(--tw-translate-x), var(--tw-translate-y), 0) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); -} -.animate-fadeIn { - animation: fadeIn 0.5s ease-in forwards; -} -@keyframes fadeIn { - 0% { - opacity: 0; - } - to { - opacity: 1; - } -} -.animate-fadeInSlow { - animation: fadeIn 1s ease-in forwards; -} -@keyframes pulse { - 50% { - opacity: 0.5; - } -} -.animate-pulse { - animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; -} -@keyframes rotate { - to { - transform: rotate(360deg); - } -} -.animate-rotate { - animation: rotate 1s linear infinite; -} -.cursor-default { - cursor: default; -} -.cursor-pointer { - cursor: pointer; -} -.select-none { - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; -} -.resize { - resize: both; -} -.list-none { - list-style-type: none; -} -.grid-cols-10 { - grid-template-columns: repeat(10, minmax(0, 1fr)); -} -.grid-cols-11 { - grid-template-columns: repeat(11, 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)); -} -.grid-cols-5 { - grid-template-columns: repeat(5, minmax(0, 1fr)); -} -.grid-cols-8 { - grid-template-columns: repeat(8, minmax(0, 1fr)); -} -.grid-cols-9 { - grid-template-columns: repeat(9, minmax(0, 1fr)); -} -.grid-rows-2 { - grid-template-rows: repeat(2, minmax(0, 1fr)); -} -.flex-row { - flex-direction: row; -} -.flex-col { - flex-direction: column; -} -.flex-col-reverse { - flex-direction: column-reverse; -} -.flex-wrap { - flex-wrap: wrap; -} -.flex-nowrap { - flex-wrap: nowrap; -} -.content-center { - align-content: center; -} -.items-start { - align-items: flex-start; -} -.items-end { - align-items: flex-end; -} -.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; -} -.justify-items-center { - justify-items: center; -} -.gap-10 { - gap: 2.5rem; -} -.gap-14 { - gap: 3.5rem; -} -.gap-2 { - gap: 0.5rem; -} -.gap-4 { - gap: 1rem; -} -.gap-5 { - gap: 1.25rem; -} -.gap-6 { - gap: 1.5rem; -} -.gap-7 { - gap: 1.75rem; -} -.gap-8 { - gap: 2rem; -} -.gap-y-0 { - row-gap: 0px; -} -.gap-y-10 { - row-gap: 2.5rem; -} -.gap-y-8 { - row-gap: 2rem; -} -.space-x-2 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(0.5rem * var(--tw-space-x-reverse)); - margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))); -} -.space-y-4 > :not([hidden]) ~ :not([hidden]) { - --tw-space-y-reverse: 0; - margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); - margin-bottom: calc(1rem * var(--tw-space-y-reverse)); -} -.divide-x > :not([hidden]) ~ :not([hidden]) { - --tw-divide-x-reverse: 0; - border-right-width: calc(1px * var(--tw-divide-x-reverse)); - border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); -} -.divide-x-2 > :not([hidden]) ~ :not([hidden]) { - --tw-divide-x-reverse: 0; - border-right-width: calc(2px * var(--tw-divide-x-reverse)); - border-left-width: calc(2px * calc(1 - var(--tw-divide-x-reverse))); -} -.divide-gray-light-mid > :not([hidden]) ~ :not([hidden]) { - --tw-divide-opacity: 1; - border-color: rgb(216 216 216 / var(--tw-divide-opacity)); -} -.divide-gray-mid > :not([hidden]) ~ :not([hidden]) { - --tw-divide-opacity: 1; - border-color: rgb(148 148 148 / var(--tw-divide-opacity)); -} -.divide-gray-mid-dark > :not([hidden]) ~ :not([hidden]) { - --tw-divide-opacity: 1; - border-color: rgb(111 111 111 / var(--tw-divide-opacity)); -} -.divide-white > :not([hidden]) ~ :not([hidden]) { - --tw-divide-opacity: 1; - border-color: rgb(255 255 255 / var(--tw-divide-opacity)); -} -.divide-opacity-40 > :not([hidden]) ~ :not([hidden]) { - --tw-divide-opacity: 0.4; -} -.overflow-auto { - overflow: auto; -} -.overflow-hidden { - overflow: hidden; -} -.overflow-visible { - overflow: visible; -} -.overflow-x-auto { - overflow-x: auto; -} -.overflow-y-auto { - overflow-y: auto; -} -.overflow-x-hidden { - overflow-x: hidden; -} -.overflow-x-visible { - overflow-x: visible; -} -.overflow-y-scroll { - overflow-y: scroll; -} -.truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} -.whitespace-nowrap { - white-space: nowrap; -} -.break-normal { - overflow-wrap: normal; - word-break: normal; -} -.break-words { - overflow-wrap: break-word; -} -.break-all { - word-break: break-all; -} -.rounded-full { - border-radius: 9999px; -} -.rounded-lg { - border-radius: 0.5rem; -} -.rounded-none { - border-radius: 0; -} -.rounded-xl { - border-radius: 0.75rem; -} -.border { - border-width: 1px; -} -.border-0 { - border-width: 0px; -} -.border-2 { - border-width: 2px; -} -.border-4 { - border-width: 4px; -} -.border-b { - border-bottom-width: 1px; -} -.border-b-2 { - border-bottom-width: 2px; -} -.border-b-3 { - border-bottom-width: 3px; -} -.border-l { - border-left-width: 1px; -} -.border-l-0 { - border-left-width: 0px; -} -.border-l-2 { - border-left-width: 2px; -} -.border-l-4 { - border-left-width: 4px; -} -.border-r { - border-right-width: 1px; -} -.border-t { - border-top-width: 1px; -} -.border-t-2 { - border-top-width: 2px; -} -.border-t-3 { - border-top-width: 3px; -} -.border-dashed { - border-style: dashed; -} -.border-none { - border-style: none; -} -.border-black { - --tw-border-opacity: 1; - border-color: rgb(0 0 0 / var(--tw-border-opacity)); -} -.border-black\/50 { - border-color: #00000080; -} -.border-blue { - --tw-border-opacity: 1; - border-color: rgb(139 203 250 / var(--tw-border-opacity)); -} -.border-gray-dark { - --tw-border-opacity: 1; - border-color: rgb(34 34 34 / var(--tw-border-opacity)); -} -.border-gray-light-mid { - --tw-border-opacity: 1; - border-color: rgb(216 216 216 / var(--tw-border-opacity)); -} -.border-gray-mid { - --tw-border-opacity: 1; - border-color: rgb(148 148 148 / var(--tw-border-opacity)); -} -.border-gray-mid-dark { - --tw-border-opacity: 1; - border-color: rgb(111 111 111 / var(--tw-border-opacity)); -} -.border-jpl-red { - --tw-border-opacity: 1; - border-color: rgb(227 25 55 / var(--tw-border-opacity)); -} -.border-jpl-red-light { - --tw-border-opacity: 1; - border-color: rgb(231 59 84 / var(--tw-border-opacity)); -} -.border-success-green { - --tw-border-opacity: 1; - border-color: rgb(51 161 123 / 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)); -} -.border-opacity-0 { - --tw-border-opacity: 0; -} -.border-opacity-100 { - --tw-border-opacity: 1; -} -.border-opacity-30 { - --tw-border-opacity: 0.3; -} -.border-opacity-40 { - --tw-border-opacity: 0.4; -} -.border-opacity-50 { - --tw-border-opacity: 0.5; -} -.bg-alert-gold { - --tw-bg-opacity: 1; - background-color: rgb(255 186 50 / var(--tw-bg-opacity)); -} -.bg-alert-gold-light { - --tw-bg-opacity: 1; - background-color: rgb(255 249 235 / var(--tw-bg-opacity)); -} -.bg-black { - --tw-bg-opacity: 1; - background-color: rgb(0 0 0 / var(--tw-bg-opacity)); -} -.bg-black\/15 { - background-color: #00000026; -} -.bg-black\/30 { - background-color: #0000004d; -} -.bg-blue { - --tw-bg-opacity: 1; - background-color: rgb(139 203 250 / var(--tw-bg-opacity)); -} -.bg-dark-blue { - --tw-bg-opacity: 1; - background-color: rgb(0 69 98 / var(--tw-bg-opacity)); -} -.bg-disabled-gray { - --tw-bg-opacity: 1; - background-color: rgb(216 216 216 / var(--tw-bg-opacity)); -} -.bg-error-red { - --tw-bg-opacity: 1; - background-color: rgb(193 21 46 / var(--tw-bg-opacity)); -} -.bg-error-red-light { - --tw-bg-opacity: 1; - background-color: rgb(255 232 235 / var(--tw-bg-opacity)); -} -.bg-focus-blue { - --tw-bg-opacity: 1; - background-color: rgb(24 113 201 / var(--tw-bg-opacity)); -} -.bg-focus-blue-light { - --tw-bg-opacity: 1; - background-color: rgb(232 241 250 / var(--tw-bg-opacity)); -} -.bg-gray-dark { - --tw-bg-opacity: 1; - background-color: rgb(34 34 34 / var(--tw-bg-opacity)); -} -.bg-gray-light { - --tw-bg-opacity: 1; - background-color: rgb(245 245 245 / var(--tw-bg-opacity)); -} -.bg-gray-light-mid { - --tw-bg-opacity: 1; - background-color: rgb(216 216 216 / var(--tw-bg-opacity)); -} -.bg-gray-light\/90 { - background-color: #f5f5f5e6; -} -.bg-gray-mid { - --tw-bg-opacity: 1; - background-color: rgb(148 148 148 / var(--tw-bg-opacity)); -} -.bg-gray-mid-dark { - --tw-bg-opacity: 1; - background-color: rgb(111 111 111 / var(--tw-bg-opacity)); -} -.bg-green { - --tw-bg-opacity: 1; - background-color: rgb(20 201 122 / var(--tw-bg-opacity)); -} -.bg-jpl-aqua { - --tw-bg-opacity: 1; - background-color: rgb(72 159 223 / var(--tw-bg-opacity)); -} -.bg-jpl-red { - --tw-bg-opacity: 1; - background-color: rgb(227 25 55 / var(--tw-bg-opacity)); -} -.bg-jpl-red-dark { - --tw-bg-opacity: 1; - background-color: rgb(193 21 46 / var(--tw-bg-opacity)); -} -.bg-jpl-red-darker { - --tw-bg-opacity: 1; - background-color: rgb(92 4 17 / var(--tw-bg-opacity)); -} -.bg-jpl-red-light { - --tw-bg-opacity: 1; - background-color: rgb(231 59 84 / var(--tw-bg-opacity)); -} -.bg-jpl-sky-blue { - --tw-bg-opacity: 1; - background-color: rgb(0 128 164 / var(--tw-bg-opacity)); -} -.bg-jpl-sky-blue-dark { - --tw-bg-opacity: 1; - background-color: rgb(0 100 128 / var(--tw-bg-opacity)); -} -.bg-off-white { - --tw-bg-opacity: 1; - background-color: rgb(250 250 250 / var(--tw-bg-opacity)); -} -.bg-success-green { - --tw-bg-opacity: 1; - background-color: rgb(51 161 123 / var(--tw-bg-opacity)); -} -.bg-success-green-light { - --tw-bg-opacity: 1; - background-color: rgb(225 245 238 / 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\/10 { - background-color: #ffffff1a; -} -.bg-white\/90 { - background-color: #ffffffe6; -} -.bg-opacity-0 { - --tw-bg-opacity: 0; -} -.bg-opacity-15 { - --tw-bg-opacity: 0.15; -} -.bg-opacity-25 { - --tw-bg-opacity: 0.25; -} -.bg-opacity-50 { - --tw-bg-opacity: 0.5; -} -.bg-opacity-75 { - --tw-bg-opacity: 0.75; -} -.bg-opacity-90 { - --tw-bg-opacity: 0.9; -} -.bg-opacity-98 { - --tw-bg-opacity: 0.98; -} -.bg-gradient-to-b { - background-image: linear-gradient(to bottom, var(--tw-gradient-stops)); -} -.bg-gradient-to-bl { - background-image: linear-gradient(to bottom left, var(--tw-gradient-stops)); -} -.bg-gradient-to-l { - background-image: linear-gradient(to left, var(--tw-gradient-stops)); -} -.bg-gradient-to-r { - background-image: linear-gradient(to right, var(--tw-gradient-stops)); -} -.bg-gradient-to-t { - background-image: linear-gradient(to top, var(--tw-gradient-stops)); -} -.bg-none { - background-image: none; -} -.from-jpl-red { - --tw-gradient-from: #e31937 var(--tw-gradient-from-position); - --tw-gradient-to: rgb(227 25 55 / 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); -} -.from-transparent { - --tw-gradient-from: transparent var(--tw-gradient-from-position); - --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); -} -.from-transparent-black-75 { - --tw-gradient-from: rgba(0 0 0 / 75%) var(--tw-gradient-from-position); - --tw-gradient-to: rgba(0, 0, 0, 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); -} -.from-transparent-w25 { - --tw-gradient-from: transparent 25% var(--tw-gradient-from-position); - --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); -} -.from-transparent-w50 { - --tw-gradient-from: transparent 50% var(--tw-gradient-from-position); - --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); -} -.to-black { - --tw-gradient-to: #000000 var(--tw-gradient-to-position); -} -.to-jpl-red-darker { - --tw-gradient-to: #5c0411 var(--tw-gradient-to-position); -} -.to-transparent { - --tw-gradient-to: transparent var(--tw-gradient-to-position); -} -.to-transparent-black-50 { - --tw-gradient-to: rgba(0 0 0 / 50%) var(--tw-gradient-to-position); -} -.to-transparent-black-75 { - --tw-gradient-to: rgba(0 0 0 / 75%) var(--tw-gradient-to-position); -} -.to-transparent-black-90 { - --tw-gradient-to: rgba(0 0 0 / 90%) var(--tw-gradient-to-position); -} -.bg-cover { - background-size: cover; -} -.bg-center { - background-position: center; -} -.bg-no-repeat { - background-repeat: no-repeat; -} -.object-contain { - object-fit: contain; -} -.object-cover { - object-fit: cover; -} -.object-fill { - object-fit: fill; -} -.object-none { - object-fit: none; -} -.object-scale-down { - object-fit: scale-down; -} -.object-bottom { - object-position: bottom; -} -.object-center { - object-position: center; -} -.p-0 { - padding: 0; -} -.p-10 { - padding: 2.5rem; -} -.p-2 { - padding: 0.5rem; -} -.p-3 { - padding: 0.75rem; -} -.p-4 { - padding: 1rem; -} -.p-5 { - padding: 1.25rem; -} -.p-6 { - padding: 1.5rem; -} -.p-8 { - padding: 2rem; -} -.px-0 { - padding-left: 0; - padding-right: 0; -} -.px-1 { - padding-left: 0.25rem; - padding-right: 0.25rem; -} -.px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; -} -.px-2 { - padding-left: 0.5rem; - padding-right: 0.5rem; -} -.px-3 { - padding-left: 0.75rem; - padding-right: 0.75rem; -} -.px-3\.5 { - padding-left: 0.875rem; - padding-right: 0.875rem; -} -.px-4 { - padding-left: 1rem; - padding-right: 1rem; -} -.px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; -} -.px-6 { - padding-left: 1.5rem; - padding-right: 1.5rem; -} -.px-8 { - padding-left: 2rem; - padding-right: 2rem; -} -.px-px { - padding-left: 1px; - padding-right: 1px; -} -.py-0 { - padding-top: 0; - padding-bottom: 0; -} -.py-1 { - padding-top: 0.25rem; - padding-bottom: 0.25rem; -} -.py-1\.5 { - padding-top: 0.375rem; - padding-bottom: 0.375rem; -} -.py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; -} -.py-12 { - padding-top: 3rem; - padding-bottom: 3rem; -} -.py-2 { - padding-top: 0.5rem; - padding-bottom: 0.5rem; -} -.py-20 { - padding-top: 5rem; - padding-bottom: 5rem; -} -.py-28 { - padding-top: 7rem; - padding-bottom: 7rem; -} -.py-2px { - padding-top: 2px; - padding-bottom: 2px; -} -.py-3 { - padding-top: 0.75rem; - padding-bottom: 0.75rem; -} -.py-4 { - padding-top: 1rem; - padding-bottom: 1rem; -} -.py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; -} -.py-6 { - padding-top: 1.5rem; - padding-bottom: 1.5rem; -} -.py-8 { - padding-top: 2rem; - padding-bottom: 2rem; -} -.py-px { - padding-top: 1px; - padding-bottom: 1px; -} -.pb-0 { - padding-bottom: 0; -} -.pb-1 { - padding-bottom: 0.25rem; -} -.pb-10 { - padding-bottom: 2.5rem; -} -.pb-12 { - padding-bottom: 3rem; -} -.pb-14 { - padding-bottom: 3.5rem; -} -.pb-2 { - padding-bottom: 0.5rem; -} -.pb-22 { - padding-bottom: 5.5rem; -} -.pb-24 { - padding-bottom: 6rem; -} -.pb-3 { - padding-bottom: 0.75rem; -} -.pb-4 { - padding-bottom: 1rem; -} -.pb-5 { - padding-bottom: 1.25rem; -} -.pb-6 { - padding-bottom: 1.5rem; -} -.pb-8 { - padding-bottom: 2rem; -} -.pb-80 { - padding-bottom: 20rem; -} -.pl-0 { - padding-left: 0; -} -.pl-1 { - padding-left: 0.25rem; -} -.pl-10 { - padding-left: 2.5rem; -} -.pl-12 { - padding-left: 3rem; -} -.pl-14 { - padding-left: 3.5rem; -} -.pl-18 { - padding-left: 4.5rem; -} -.pl-2 { - padding-left: 0.5rem; -} -.pl-3 { - padding-left: 0.75rem; -} -.pl-4 { - padding-left: 1rem; -} -.pl-5 { - padding-left: 1.25rem; -} -.pl-6 { - padding-left: 1.5rem; -} -.pl-8 { - padding-left: 2rem; -} -.pr-0 { - padding-right: 0; -} -.pr-0\.5 { - padding-right: 0.125rem; -} -.pr-1 { - padding-right: 0.25rem; -} -.pr-14 { - padding-right: 3.5rem; -} -.pr-2 { - padding-right: 0.5rem; -} -.pr-3 { - padding-right: 0.75rem; -} -.pr-4 { - padding-right: 1rem; -} -.pr-5 { - padding-right: 1.25rem; -} -.pr-6 { - padding-right: 1.5rem; -} -.pr-8 { - padding-right: 2rem; -} -.pt-1 { - padding-top: 0.25rem; -} -.pt-10 { - padding-top: 2.5rem; -} -.pt-12 { - padding-top: 3rem; -} -.pt-14 { - padding-top: 3.5rem; -} -.pt-2 { - padding-top: 0.5rem; -} -.pt-2\.5 { - padding-top: 0.625rem; -} -.pt-22 { - padding-top: 5.5rem; -} -.pt-3 { - padding-top: 0.75rem; -} -.pt-4 { - padding-top: 1rem; -} -.pt-40 { - padding-top: 10rem; -} -.pt-5 { - padding-top: 1.25rem; -} -.pt-6 { - padding-top: 1.5rem; -} -.pt-8 { - padding-top: 2rem; -} -.text-left { - text-align: left; -} -.text-center { - text-align: center; -} -.text-right { - text-align: right; -} -.align-top { - vertical-align: top; -} -.align-middle { - vertical-align: middle; -} -.font-primary { - font-family: - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; -} -.font-secondary { - font-family: - Archivo Narrow, - Metropolis, - -apple-system, - BlinkMacSystemFont, - San Francisco, - Segoe UI, - Roboto, - Helvetica Neue, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; -} -.text-2xl { - font-size: 1.375rem; -} -.text-3xl { - font-size: 1.5rem; -} -.text-4xl { - font-size: 1.625rem; -} -.text-5xl { - font-size: 1.75rem; -} -.text-6xl { - font-size: 2rem; -} -.text-7xl { - font-size: 2.5rem; -} -.text-8xl { - font-size: 2.75rem; -} -.text-base { - font-size: 1rem; -} -.text-lg { - font-size: 1.125rem; -} -.text-sm { - font-size: 0.875rem; -} -.text-xl { - font-size: 1.25rem; -} -.text-xs { - font-size: 0.75rem; -} -.font-bold { - font-weight: 700; -} -.font-extrabold { - font-weight: 800; -} -.font-light { - font-weight: 300; -} -.font-medium { - font-weight: 500; -} -.font-normal { - font-weight: 400; -} -.font-semibold { - font-weight: 600; -} -.uppercase { - text-transform: uppercase; -} -.lowercase { - text-transform: lowercase; -} -.capitalize { - text-transform: capitalize; -} -.normal-case { - text-transform: none; -} -.not-italic { - font-style: normal; -} -.leading-none { - line-height: 1; -} -.leading-normal { - line-height: 1.5; -} -.leading-relaxed { - line-height: 1.75; -} -.leading-tight { - line-height: 1.25; -} -.leading-tighter { - line-height: 1.125; -} -.tracking-normal { - letter-spacing: 0; -} -.tracking-tight { - letter-spacing: -0.5px; -} -.tracking-tighter { - letter-spacing: -1px; -} -.tracking-wider { - letter-spacing: 1px; -} -.text-action { - color: var(--color-action); -} -.text-action-hover { - color: var(--color-action-dark); -} -.text-black { - --tw-text-opacity: 1; - color: rgb(0 0 0 / var(--tw-text-opacity)); -} -.text-blue { - --tw-text-opacity: 1; - color: rgb(139 203 250 / var(--tw-text-opacity)); -} -.text-facebook { - --tw-text-opacity: 1; - color: rgb(59 89 152 / var(--tw-text-opacity)); -} -.text-gray-dark { - --tw-text-opacity: 1; - color: rgb(34 34 34 / var(--tw-text-opacity)); -} -.text-gray-light { - --tw-text-opacity: 1; - color: rgb(245 245 245 / var(--tw-text-opacity)); -} -.text-gray-light-mid { - --tw-text-opacity: 1; - color: rgb(216 216 216 / var(--tw-text-opacity)); -} -.text-gray-mid { - --tw-text-opacity: 1; - color: rgb(148 148 148 / var(--tw-text-opacity)); -} -.text-gray-mid-dark { - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-opacity)); -} -.text-instagram { - --tw-text-opacity: 1; - color: rgb(221 42 123 / var(--tw-text-opacity)); -} -.text-jpl-aqua { - --tw-text-opacity: 1; - color: rgb(72 159 223 / var(--tw-text-opacity)); -} -.text-jpl-red { - --tw-text-opacity: 1; - color: rgb(227 25 55 / var(--tw-text-opacity)); -} -.text-jpl-red-dark { - --tw-text-opacity: 1; - color: rgb(193 21 46 / var(--tw-text-opacity)); -} -.text-jpl-red-light { - --tw-text-opacity: 1; - color: rgb(231 59 84 / var(--tw-text-opacity)); -} -.text-jpl-sky-blue { - --tw-text-opacity: 1; - color: rgb(0 128 164 / var(--tw-text-opacity)); -} -.text-jpl-sky-blue-dark { - --tw-text-opacity: 1; - color: rgb(0 100 128 / var(--tw-text-opacity)); -} -.text-reddit { - --tw-text-opacity: 1; - color: rgb(255 69 0 / var(--tw-text-opacity)); -} -.text-transparent { - color: transparent; -} -.text-twitter { - --tw-text-opacity: 1; - color: rgb(0 0 0 / var(--tw-text-opacity)); -} -.text-white { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); -} -.text-youtube { - --tw-text-opacity: 1; - color: rgb(255 0 0 / var(--tw-text-opacity)); -} -.text-opacity-75 { - --tw-text-opacity: 0.75; -} -.text-opacity-90 { - --tw-text-opacity: 0.9; -} -.underline { - text-decoration-line: underline; -} -.no-underline { - text-decoration-line: none; -} -.opacity-0 { - opacity: 0; -} -.opacity-100 { - opacity: 1; -} -.opacity-25 { - opacity: 0.25; -} -.opacity-50 { - opacity: 0.5; -} -.opacity-70 { - opacity: 0.7; -} -.opacity-75 { - opacity: 0.75; -} -.opacity-80 { - opacity: 0.8; -} -.opacity-90 { - opacity: 0.9; -} -.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-jpl { - --tw-shadow: -4px 5px 60px 0 rgba(0, 0, 0, 0.1); - --tw-shadow-colored: -4px 5px 60px 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-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-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); -} -.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); -} -.drop-shadow-lg { - --tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) - drop-shadow(0 4px 3px rgb(0 0 0 / 0.1)); - 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); -} -.invert { - --tw-invert: invert(100%); - 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); -} -.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: 0.15s; -} -.transition-all { - transition-property: all; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.15s; -} -.transition-border-opacity { - transition-property: border-opacity; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.15s; -} -.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: 0.15s; -} -.transition-none { - transition-property: none; -} -.transition-opacity { - transition-property: opacity; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.15s; -} -.transition-shadow { - transition-property: box-shadow; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.15s; -} -.transition-transform { - transition-property: transform; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 0.15s; -} -.delay-200 { - transition-delay: 0.2s; -} -.delay-500 { - transition-delay: 0.5s; -} -.duration-100 { - transition-duration: 0.1s; -} -.duration-1000 { - transition-duration: 1s; -} -.duration-150 { - transition-duration: 0.15s; -} -.duration-200 { - transition-duration: 0.2s; -} -.duration-2000 { - transition-duration: 2s; -} -.duration-300 { - transition-duration: 0.3s; -} -.duration-3500 { - transition-duration: 3.5s; -} -.duration-500 { - transition-duration: 0.5s; -} -.ease-in { - transition-timing-function: cubic-bezier(0.4, 0, 1, 1); -} -.ease-in-out { - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); -} -.ease-linear { - transition-timing-function: linear; -} -.ease-out { - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); -} -.fancybox__slide { - padding: 36px; -} -@media (min-width: 1024px) { - .fancybox__slide { - padding: 64px; - } -} -.fancybox__content { - padding: 18px; -} -@media (min-width: 1024px) { - .fancybox__content { - padding: 36px; - } -} -.aspect-ratio-none > div:first-of-type:before { - content: ''; - display: flex; - width: auto; - padding-bottom: unset; -} -.aspect-ratio-none > div:first-of-type iframe, -.aspect-ratio-none > div:first-of-type img { - position: relative; - margin-left: auto; - margin-right: auto; - height: 100%; - max-width: 100%; -} -.aspect-ratio-twentyone-nine > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 42.8571428571%; -} -.aspect-ratio-twentyone-nine > div:first-of-type iframe, -.aspect-ratio-twentyone-nine > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-sixteen-nine > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 56.25%; -} -.aspect-ratio-sixteen-nine > div:first-of-type iframe, -.aspect-ratio-sixteen-nine > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-sixteen-seven > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 43.75%; -} -.aspect-ratio-sixteen-seven > div:first-of-type iframe, -.aspect-ratio-sixteen-seven > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-twelve-nine > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 75%; -} -.aspect-ratio-twelve-nine > div:first-of-type iframe, -.aspect-ratio-twelve-nine > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-nine-sixteen > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 177.7777777778%; -} -.aspect-ratio-nine-sixteen > div:first-of-type iframe, -.aspect-ratio-nine-sixteen > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-seven-eight > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 114.2857142857%; -} -.aspect-ratio-seven-eight > div:first-of-type iframe, -.aspect-ratio-seven-eight > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-eight-seven > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 87.5%; -} -.aspect-ratio-eight-seven > div:first-of-type iframe, -.aspect-ratio-eight-seven > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-four-three > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 75%; -} -.aspect-ratio-four-three > div:first-of-type iframe, -.aspect-ratio-four-three > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-four-five > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 125%; -} -.aspect-ratio-four-five > div:first-of-type iframe, -.aspect-ratio-four-five > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-two-one > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 50%; -} -.aspect-ratio-two-one > div:first-of-type iframe, -.aspect-ratio-two-one > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-three-two > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 66.6666666667%; -} -.aspect-ratio-three-two > div:first-of-type iframe, -.aspect-ratio-three-two > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-two-three > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 150%; -} -.aspect-ratio-two-three > div:first-of-type iframe, -.aspect-ratio-two-three > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.aspect-ratio-one-one > div:first-of-type:before, -.aspect-ratio-square > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 100%; -} -.aspect-ratio-one-one > div:first-of-type iframe, -.aspect-ratio-one-one > div:first-of-type img, -.aspect-ratio-square > div:first-of-type iframe, -.aspect-ratio-square > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; -} -.text-contrast { - text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); -} -.text-contrast-none { - text-shadow: none; -} -.NavInternal .NavInternalPanel .auto-cols-2, -.NavInternal .NavInternalPanel .auto-cols-3 { - -moz-column-gap: 3.5rem; - column-gap: 3.5rem; -} -.NavInternal .NavInternalPanel .auto-cols-2 { - -moz-column-count: 2; - column-count: 2; -} -.NavInternal .NavInternalPanel .auto-cols-3 { - -moz-column-count: 3; - column-count: 3; -} -.NavInternal .NavInternalPanel .no-auto-cols { - -moz-column-count: auto; - column-count: auto; -} -@font-face { - font-family: Metropolis; - font-weight: 800; - font-style: normal; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-ExtraBold.woff2) format('woff2'); -} -@font-face { - font-family: Metropolis; - font-weight: 700; - font-style: normal; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-Bold.woff2) format('woff2'); -} -@font-face { - font-family: Metropolis; - font-weight: 700; - font-style: italic; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-BoldItalic.woff2) format('woff2'); -} -@font-face { - font-family: Metropolis; - font-weight: 600; - font-style: normal; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-SemiBold.woff2) format('woff2'); -} -@font-face { - font-family: Metropolis; - font-weight: 600; - font-style: italic; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-SemiBoldItalic.woff2) format('woff2'); -} -@font-face { - font-family: Metropolis; - font-weight: 500; - font-style: normal; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-Medium.woff2) format('woff2'); -} -@font-face { - font-family: Metropolis; - font-weight: 500; - font-style: italic; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-MediumItalic.woff2) format('woff2'); -} -@font-face { - font-family: Metropolis; - font-weight: 400; - font-style: normal; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-Regular.woff2) format('woff2'); -} -@font-face { - font-family: Metropolis; - font-weight: 400; - font-style: italic; - font-display: swap; - src: url(/assets/fonts/metropolis/Metropolis-RegularItalic.woff2) format('woff2'); -} -@font-face { - font-family: Archivo Narrow; - font-weight: 700; - font-style: normal; - font-display: swap; - src: url(/assets/fonts/archivo-narrow/ArchivoNarrow-Bold.woff2) format('woff2'); -} -@font-face { - font-family: Archivo Narrow; - font-weight: 700; - font-style: italic; - font-display: swap; - src: url(/assets/fonts/archivo-narrow/ArchivoNarrow-BoldItalic.woff2) format('woff2'); -} -@font-face { - font-family: Archivo Narrow; - font-weight: 600; - font-style: normal; - font-display: swap; - src: url(/assets/fonts/archivo-narrow/ArchivoNarrow-SemiBold.woff2) format('woff2'); -} -@font-face { - font-family: Archivo Narrow; - font-weight: 600; - font-style: italic; - font-display: swap; - src: url(/assets/fonts/archivo-narrow/ArchivoNarrow-SemiBoldItalic.woff2) format('woff2'); -} -@keyframes arrow-carousel-next-anim { - 0% { - transform: translate(0); - } - to { - transform: translate(3rem); - } -} -@keyframes arrow-carousel-next-fixed-anim { - 0% { - transform: translate(-3rem); - } - to { - transform: translate(0); - } -} -@keyframes arrow-carousel-prev-anim { - 0% { - transform: translate(0); - } - to { - transform: translate(-3rem); - } -} -@keyframes arrow-carousel-prev-fixed-anim { - 0% { - transform: translate(3rem); - } - to { - transform: translate(0); - } -} -@media (min-width: 640px) { - .sm\:BaseGrid { - display: grid; - grid-template-columns: repeat(12, minmax(0, 1fr)); - gap: 1.5rem; - } - .sm\:object-cover { - font-family: 'object-fit: cover'; - } -} -@media (min-width: 768px) { - .md\:BaseGrid { - display: grid; - grid-template-columns: repeat(12, minmax(0, 1fr)); - gap: 1.5rem; - } -} -@media (min-width: 1024px) { - .lg\:BaseGrid { - display: grid; - grid-template-columns: repeat(12, minmax(0, 1fr)); - gap: 1.5rem; - } -} -@media (min-width: 1280px) { - .xl\:BaseGrid { - display: grid; - grid-template-columns: repeat(12, minmax(0, 1fr)); - gap: 1.5rem; - } -} -@media (min-width: 1440px) { - .MixedBleedGrid .\32xl\:col-start-indent-col-3 { - grid-column-start: indent-col-3; - } -} -@media (min-width: 1024px) { - .lg\:container { - width: 100%; - padding-right: 1rem; - padding-left: 1rem; - } - @media (min-width: 640px) { - .lg\:container { - max-width: 640px; - } - } - @media (min-width: 768px) { - .lg\:container { - max-width: 768px; - } - } - .lg\:container { - max-width: 1024px; - } - @media (min-width: 1280px) { - .lg\:container { - max-width: 1280px; - } - } - @media (min-width: 1320px) { - .lg\:container { - max-width: 1320px; - } - } -} -.last\:mr-0:last-child { - margin-right: 0; -} -.focus-within\:opacity-100:focus-within { - opacity: 1; -} -@media (hover: hover) and (pointer: fine) { - .hover\:border-gray-dark:hover { - --tw-border-opacity: 1; - border-color: rgb(34 34 34 / var(--tw-border-opacity)); - } - .hover\:text-jpl-red-dark:hover { - --tw-text-opacity: 1; - color: rgb(193 21 46 / var(--tw-text-opacity)); - } - .hover\:text-jpl-red-light:hover { - --tw-text-opacity: 1; - color: rgb(231 59 84 / var(--tw-text-opacity)); - } -} -.focus\:not-sr-only:focus { - position: static; - width: auto; - height: auto; - padding: 0; - margin: 0; - overflow: visible; - clip: auto; - white-space: normal; -} -.focus\:border-focus-blue:focus { - --tw-border-opacity: 1; - border-color: rgb(24 113 201 / var(--tw-border-opacity)); -} -.focus\:border-gray-dark\/20:focus { - border-color: #2223; -} -.focus\:underline:focus { - text-decoration-line: underline; -} -.focus\:shadow-jpl:focus { - --tw-shadow: -4px 5px 60px 0 rgba(0, 0, 0, 0.1); - --tw-shadow-colored: -4px 5px 60px 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); -} -.focus\:outline-none:focus { - outline: 2px solid transparent; - outline-offset: 2px; -} -.focus\:ring-2:focus { - --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) - var(--tw-ring-offset-color); - --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) - var(--tw-ring-color); - box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); -} -.focus\:ring-jpl-red:focus { - --tw-ring-opacity: 1; - --tw-ring-color: rgb(227 25 55 / var(--tw-ring-opacity)); -} -.focus\:ring-transparent:focus { - --tw-ring-color: transparent; -} -.focus\:ring-opacity-50:focus { - --tw-ring-opacity: 0.5; -} -@media (hover: hover) and (pointer: fine) { - .group:hover .group-hover\:opacity-100 { - opacity: 1; - } - .group:hover .group-hover\:opacity-75 { - opacity: 0.75; - } -} -@media (prefers-reduced-motion: no-preference) { - @keyframes ping { - 75%, - to { - transform: scale(2); - opacity: 0; - } - } - .motion-safe\:animate-ping { - animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; - } -} -@media (min-width: 640px) { - .sm\:absolute { - position: absolute; - } - .sm\:col-span-3 { - grid-column: span 3 / span 3; - } - .sm\:col-span-5 { - grid-column: span 5 / span 5; - } - .sm\:col-span-6 { - grid-column: span 6 / span 6; - } - .sm\:col-span-7 { - grid-column: span 7 / span 7; - } - .sm\:col-end-11 { - grid-column-end: 11; - } - .sm\:mx-20 { - margin-left: 5rem; - margin-right: 5rem; - } - .sm\:mx-auto { - margin-left: auto; - margin-right: auto; - } - .sm\:-ml-10 { - margin-left: -2.5rem; - } - .sm\:-mt-0 { - margin-top: -0px; - } - .sm\:-mt-0\.5 { - margin-top: -0.125rem; - } - .sm\:-mt-2 { - margin-top: -0.5rem; - } - .sm\:mb-0 { - margin-bottom: 0; - } - .sm\:mb-3 { - margin-bottom: 0.75rem; - } - .sm\:mb-8 { - margin-bottom: 2rem; - } - .sm\:mr-0 { - margin-right: 0; - } - .sm\:mt-0 { - margin-top: 0; - } - .sm\:mt-0\.5 { - margin-top: 0.125rem; - } - .sm\:mt-16 { - margin-top: 4rem; - } - .sm\:block { - display: block; - } - .sm\:flex { - display: flex; - } - .sm\:grid { - display: grid; - } - .sm\:hidden { - display: none; - } - .sm\:h-10 { - height: 2.5rem; - } - .sm\:h-26 { - height: 6.5rem; - } - .sm\:h-40 { - height: 10rem; - } - .sm\:w-24 { - width: 6rem; - } - .sm\:w-26 { - width: 6.5rem; - } - .sm\:w-3\/4 { - width: 75%; - } - .sm\:w-80 { - width: 20rem; - } - .sm\:w-auto { - width: auto; - } - .sm\:w-xl { - width: 36rem; - } - .sm\:max-w-xl { - max-width: 36rem; - } - .sm\:whitespace-nowrap { - white-space: nowrap; - } - .sm\:object-cover { - object-fit: cover; - } - .sm\:p-10 { - padding: 2.5rem; - } - .sm\:px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; - } - .sm\:px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; - } - .sm\:py-0 { - padding-top: 0; - padding-bottom: 0; - } - .sm\:py-8 { - padding-top: 2rem; - padding-bottom: 2rem; - } - .sm\:pr-5 { - padding-right: 1.25rem; - } - .sm\:pt-24 { - padding-top: 6rem; - } - .sm\:text-left { - text-align: left; - } - .sm\:text-2xl { - font-size: 1.375rem; - } - .sm\:text-4xl { - font-size: 1.625rem; - } - .sm\:text-6xl { - font-size: 2rem; - } - .sm\:leading-normal { - line-height: 1.5; - } -} -@media (min-width: 768px) { - .md\:visible { - visibility: visible; - } - .md\:top-0 { - top: 0; - } - .md\:order-first { - order: -9999; - } - .md\:order-last { - order: 9999; - } - .md\:col-span-3 { - grid-column: span 3 / span 3; - } - .md\:col-span-6 { - grid-column: span 6 / span 6; - } - .md\:col-start-2 { - grid-column-start: 2; - } - .md\:col-start-3 { - grid-column-start: 3; - } - .md\:col-start-6 { - grid-column-start: 6; - } - .md\:col-end-11 { - grid-column-end: 11; - } - .md\:col-end-13 { - grid-column-end: 13; - } - .md\:-mx-4 { - margin-left: -1rem; - margin-right: -1rem; - } - .md\:mx-0 { - margin-left: 0; - margin-right: 0; - } - .md\:mx-16 { - margin-left: 4rem; - margin-right: 4rem; - } - .md\:mx-4 { - margin-left: 1rem; - margin-right: 1rem; - } - .md\:my-12 { - margin-top: 3rem; - margin-bottom: 3rem; - } - .md\:mb-0 { - margin-bottom: 0; - } - .md\:mb-10 { - margin-bottom: 2.5rem; - } - .md\:mb-12 { - margin-bottom: 3rem; - } - .md\:mb-2 { - margin-bottom: 0.5rem; - } - .md\:mb-3 { - margin-bottom: 0.75rem; - } - .md\:mb-40 { - margin-bottom: 10rem; - } - .md\:mb-7 { - margin-bottom: 1.75rem; - } - .md\:mb-8 { - margin-bottom: 2rem; - } - .md\:ml-8 { - margin-left: 2rem; - } - .md\:mr-0 { - margin-right: 0; - } - .md\:mr-16 { - margin-right: 4rem; - } - .md\:mr-6 { - margin-right: 1.5rem; - } - .md\:mt-0 { - margin-top: 0; - } - .md\:mt-1 { - margin-top: 0.25rem; - } - .md\:mt-10 { - margin-top: 2.5rem; - } - .md\:mt-5 { - margin-top: 1.25rem; - } - .md\:block { - display: block; - } - .md\:inline { - display: inline; - } - .md\:flex { - display: flex; - } - .md\:grid { - display: grid; - } - .md\:hidden { - display: none; - } - .md\:w-2\/3 { - width: 66.666667%; - } - .md\:w-56 { - width: 14rem; - } - .md\:max-w-3xl { - max-width: 48rem; - } - .md\:max-w-none { - max-width: none; - } - .md\:flex-none { - flex: none; - } - .md\:flex-grow-0 { - flex-grow: 0; - } - .md\:-translate-y-full { - --tw-translate-y: -100%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .md\:translate-x-0 { - --tw-translate-x: 0px; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .md\:transform { - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .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\:flex-row { - flex-direction: row; - } - .md\:flex-wrap { - flex-wrap: wrap; - } - .md\:justify-start { - justify-content: flex-start; - } - .md\:justify-end { - justify-content: flex-end; - } - .md\:object-right { - object-position: right; - } - .md\:px-0 { - padding-left: 0; - padding-right: 0; - } - .md\:px-4 { - padding-left: 1rem; - padding-right: 1rem; - } - .md\:px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; - } - .md\:py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; - } - .md\:py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; - } - .md\:pl-3 { - padding-left: 0.75rem; - } - .md\:pr-3 { - padding-right: 0.75rem; - } - .md\:pt-8 { - padding-top: 2rem; - } - .md\:text-2xl { - font-size: 1.375rem; - } - .md\:text-3xl { - font-size: 1.5rem; - } - .md\:text-8xl { - font-size: 2.75rem; - } - .md\:text-base { - font-size: 1rem; - } - .md\:aspect-ratio-four-three > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 75%; - } - .md\:aspect-ratio-four-three > div:first-of-type iframe, - .md\:aspect-ratio-four-three > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; - } -} -@media (min-width: 1024px) { - .lg\:absolute { - position: absolute; - } - .lg\:relative { - position: relative; - } - .lg\:inset-0 { - top: 0; - right: 0; - bottom: 0; - left: 0; - } - .lg\:inset-y-0 { - top: 0; - bottom: 0; - } - .lg\:left-0 { - left: 0; - } - .lg\:left-auto { - left: auto; - } - .lg\:right-1\/2 { - right: 50%; - } - .lg\:top-0 { - top: 0; - } - .lg\:top-1\/2 { - top: 50%; - } - .lg\:z-20 { - z-index: 20; - } - .lg\:order-1 { - order: 1; - } - .lg\:order-2 { - order: 2; - } - .lg\:order-3 { - order: 3; - } - .lg\:col-span-2 { - grid-column: span 2 / span 2; - } - .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-9 { - grid-column: span 9 / span 9; - } - .lg\:col-start-1 { - grid-column-start: 1; - } - .lg\:col-start-2 { - grid-column-start: 2; - } - .lg\:col-start-3 { - grid-column-start: 3; - } - .lg\:col-start-4 { - grid-column-start: 4; - } - .lg\:col-start-5 { - grid-column-start: 5; - } - .lg\:col-start-6 { - grid-column-start: 6; - } - .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-10 { - grid-column-end: 10; - } - .lg\:col-end-11 { - grid-column-end: 11; - } - .lg\:col-end-12 { - grid-column-end: 12; - } - .lg\:col-end-13 { - grid-column-end: 13; - } - .lg\:col-end-5 { - grid-column-end: 5; - } - .lg\:col-end-6 { - grid-column-end: 6; - } - .lg\:col-end-8 { - grid-column-end: 8; - } - .lg\:col-end-9 { - grid-column-end: 9; - } - .lg\:row-span-2 { - grid-row: span 2 / span 2; - } - .lg\:mx-0 { - margin-left: 0; - margin-right: 0; - } - .lg\:mx-1 { - margin-left: 0.25rem; - margin-right: 0.25rem; - } - .lg\:mx-1\.5 { - margin-left: 0.375rem; - margin-right: 0.375rem; - } - .lg\:my-16 { - margin-top: 4rem; - margin-bottom: 4rem; - } - .lg\:my-18 { - margin-top: 4.5rem; - margin-bottom: 4.5rem; - } - .lg\:my-20 { - margin-top: 5rem; - margin-bottom: 5rem; - } - .lg\:my-24 { - margin-top: 6rem; - margin-bottom: 6rem; - } - .lg\:my-28 { - margin-top: 7rem; - margin-bottom: 7rem; - } - .lg\:my-8 { - margin-top: 2rem; - margin-bottom: 2rem; - } - .lg\:-mb-3 { - margin-bottom: -0.75rem; - } - .lg\:-mb-8 { - margin-bottom: -2rem; - } - .lg\:-ml-24 { - margin-left: -6rem; - } - .lg\:-ml-3 { - margin-left: -0.75rem; - } - .lg\:-ml-4 { - margin-left: -1rem; - } - .lg\:-mr-8 { - margin-right: -2rem; - } - .lg\:-mt-0 { - margin-top: -0px; - } - .lg\:-mt-0\.5 { - margin-top: -0.125rem; - } - .lg\:-mt-2 { - margin-top: -0.5rem; - } - .lg\:-mt-2\.5 { - margin-top: -0.625rem; - } - .lg\:-mt-20 { - margin-top: -5rem; - } - .lg\:-mt-26 { - margin-top: -6.5rem; - } - .lg\:-mt-28 { - margin-top: -7rem; - } - .lg\:-mt-6 { - margin-top: -1.5rem; - } - .lg\:-mt-px { - margin-top: -1px; - } - .lg\:mb-0 { - margin-bottom: 0; - } - .lg\:mb-10 { - margin-bottom: 2.5rem; - } - .lg\:mb-12 { - margin-bottom: 3rem; - } - .lg\:mb-14 { - margin-bottom: 3.5rem; - } - .lg\:mb-16 { - margin-bottom: 4rem; - } - .lg\:mb-18 { - margin-bottom: 4.5rem; - } - .lg\:mb-2 { - margin-bottom: 0.5rem; - } - .lg\:mb-20 { - margin-bottom: 5rem; - } - .lg\:mb-22 { - margin-bottom: 5.5rem; - } - .lg\:mb-24 { - margin-bottom: 6rem; - } - .lg\:mb-25 { - margin-bottom: 6.25rem; - } - .lg\:mb-3 { - margin-bottom: 0.75rem; - } - .lg\:mb-36 { - margin-bottom: 9rem; - } - .lg\:mb-4 { - margin-bottom: 1rem; - } - .lg\:mb-5 { - margin-bottom: 1.25rem; - } - .lg\:mb-6 { - margin-bottom: 1.5rem; - } - .lg\:mb-8 { - margin-bottom: 2rem; - } - .lg\:mb-80 { - margin-bottom: 20rem; - } - .lg\:ml-0 { - margin-left: 0; - } - .lg\:ml-30 { - margin-left: 7.5rem; - } - .lg\:ml-6 { - margin-left: 1.5rem; - } - .lg\:mr-0 { - margin-right: 0; - } - .lg\:mr-20 { - margin-right: 5rem; - } - .lg\:mr-3 { - margin-right: 0.75rem; - } - .lg\:mr-8 { - margin-right: 2rem; - } - .lg\:mt-0 { - margin-top: 0; - } - .lg\:mt-1 { - margin-top: 0.25rem; - } - .lg\:mt-1\.5 { - margin-top: 0.375rem; - } - .lg\:mt-10 { - margin-top: 2.5rem; - } - .lg\:mt-12 { - margin-top: 3rem; - } - .lg\:mt-18 { - margin-top: 4.5rem; - } - .lg\:mt-2 { - margin-top: 0.5rem; - } - .lg\:mt-20 { - margin-top: 5rem; - } - .lg\:mt-24 { - margin-top: 6rem; - } - .lg\:mt-28 { - margin-top: 7rem; - } - .lg\:mt-3 { - margin-top: 0.75rem; - } - .lg\:mt-6 { - margin-top: 1.5rem; - } - .lg\:mt-8 { - margin-top: 2rem; - } - .lg\:block { - display: block; - } - .lg\:inline-block { - display: inline-block; - } - .lg\:flex { - display: flex; - } - .lg\:grid { - display: grid; - } - .lg\:hidden { - display: none; - } - .lg\:h-full { - height: 100%; - } - .lg\:max-h-3xl { - max-height: 48rem; - } - .lg\:min-h-100 { - min-height: 25rem; - } - .lg\:min-h-28 { - min-height: 7rem; - } - .lg\:w-1\/2 { - width: 50%; - } - .lg\:w-14 { - width: 3.5rem; - } - .lg\:w-14\.5 { - width: 3.625rem; - } - .lg\:w-2\/3 { - width: 66.666667%; - } - .lg\:w-25 { - width: 6.25rem; - } - .lg\:w-3\/4 { - width: 75%; - } - .lg\:w-35 { - width: 8.75rem; - } - .lg\:w-3xl { - width: 48rem; - } - .lg\:w-48 { - width: 12rem; - } - .lg\:w-5\/6 { - width: 83.333333%; - } - .lg\:w-64 { - width: 16rem; - } - .lg\:w-auto { - width: auto; - } - .lg\:w-full { - width: 100%; - } - .lg\:max-w-3xl { - max-width: 48rem; - } - .lg\:max-w-none { - max-width: none; - } - .lg\:flex-shrink-0 { - flex-shrink: 0; - } - .lg\:-translate-y-1\/2 { - --tw-translate-y: -50%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .lg\:-translate-y-3\/7 { - --tw-translate-y: -42.8571429%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .lg\:translate-x-1\/2 { - --tw-translate-x: 50%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .lg\:grid-cols-10 { - grid-template-columns: repeat(10, minmax(0, 1fr)); - } - .lg\:grid-cols-3 { - grid-template-columns: repeat(3, minmax(0, 1fr)); - } - .lg\:flex-row { - flex-direction: row; - } - .lg\:flex-col { - flex-direction: column; - } - .lg\:flex-wrap { - flex-wrap: wrap; - } - .lg\:items-end { - align-items: flex-end; - } - .lg\:items-center { - align-items: center; - } - .lg\:justify-start { - justify-content: flex-start; - } - .lg\:justify-end { - justify-content: flex-end; - } - .lg\:gap-x-6 { - -moz-column-gap: 1.5rem; - column-gap: 1.5rem; - } - .lg\:gap-y-0 { - row-gap: 0px; - } - .lg\:overflow-hidden { - overflow: hidden; - } - .lg\:overflow-visible { - overflow: visible; - } - .lg\:overflow-x-auto { - overflow-x: auto; - } - .lg\:whitespace-normal { - white-space: normal; - } - .lg\:border-0 { - border-width: 0px; - } - .lg\:border-b { - border-bottom-width: 1px; - } - .lg\:border-t { - border-top-width: 1px; - } - .lg\:border-none { - border-style: none; - } - .lg\:border-gray-light-mid { - --tw-border-opacity: 1; - border-color: rgb(216 216 216 / var(--tw-border-opacity)); - } - .lg\:border-gray-mid { - --tw-border-opacity: 1; - border-color: rgb(148 148 148 / var(--tw-border-opacity)); - } - .lg\:bg-gray-light\/100 { - background-color: #f5f5f5; - } - .lg\:bg-opacity-100 { - --tw-bg-opacity: 1; - } - .lg\:bg-gradient-to-bl { - background-image: linear-gradient(to bottom left, var(--tw-gradient-stops)); - } - .lg\:bg-gradient-to-l { - background-image: linear-gradient(to left, var(--tw-gradient-stops)); - } - .lg\:bg-gradient-to-r { - background-image: linear-gradient(to right, var(--tw-gradient-stops)); - } - .lg\:from-transparent { - --tw-gradient-from: transparent var(--tw-gradient-from-position); - --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); - } - .lg\:from-transparent-w50 { - --tw-gradient-from: transparent 50% var(--tw-gradient-from-position); - --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); - } - .lg\:to-transparent-black-50 { - --tw-gradient-to: rgba(0 0 0 / 50%) var(--tw-gradient-to-position); - } - .lg\:to-transparent-black-75 { - --tw-gradient-to: rgba(0 0 0 / 75%) var(--tw-gradient-to-position); - } - .lg\:to-transparent-black-90 { - --tw-gradient-to: rgba(0 0 0 / 90%) var(--tw-gradient-to-position); - } - .lg\:p-0 { - padding: 0; - } - .lg\:p-1 { - padding: 0.25rem; - } - .lg\:p-20 { - padding: 5rem; - } - .lg\:p-5 { - padding: 1.25rem; - } - .lg\:px-0 { - padding-left: 0; - padding-right: 0; - } - .lg\:px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; - } - .lg\:px-12 { - padding-left: 3rem; - padding-right: 3rem; - } - .lg\:px-3 { - padding-left: 0.75rem; - padding-right: 0.75rem; - } - .lg\:px-4 { - padding-left: 1rem; - padding-right: 1rem; - } - .lg\:px-8 { - padding-left: 2rem; - padding-right: 2rem; - } - .lg\:py-0 { - padding-top: 0; - padding-bottom: 0; - } - .lg\:py-10 { - padding-top: 2.5rem; - padding-bottom: 2.5rem; - } - .lg\:py-12 { - padding-top: 3rem; - padding-bottom: 3rem; - } - .lg\:py-16 { - padding-top: 4rem; - padding-bottom: 4rem; - } - .lg\:py-18 { - padding-top: 4.5rem; - padding-bottom: 4.5rem; - } - .lg\:py-2 { - padding-top: 0.5rem; - padding-bottom: 0.5rem; - } - .lg\:py-24 { - padding-top: 6rem; - padding-bottom: 6rem; - } - .lg\:py-36 { - padding-top: 9rem; - padding-bottom: 9rem; - } - .lg\:py-4 { - padding-top: 1rem; - padding-bottom: 1rem; - } - .lg\:py-48 { - padding-top: 12rem; - padding-bottom: 12rem; - } - .lg\:py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; - } - .lg\:py-6 { - padding-top: 1.5rem; - padding-bottom: 1.5rem; - } - .lg\:py-8 { - padding-top: 2rem; - padding-bottom: 2rem; - } - .lg\:pb-0 { - padding-bottom: 0; - } - .lg\:pb-10 { - padding-bottom: 2.5rem; - } - .lg\:pb-14 { - padding-bottom: 3.5rem; - } - .lg\:pb-18 { - padding-bottom: 4.5rem; - } - .lg\:pb-2 { - padding-bottom: 0.5rem; - } - .lg\:pb-24 { - padding-bottom: 6rem; - } - .lg\:pb-4 { - padding-bottom: 1rem; - } - .lg\:pb-6 { - padding-bottom: 1.5rem; - } - .lg\:pl-0 { - padding-left: 0; - } - .lg\:pl-6 { - padding-left: 1.5rem; - } - .lg\:pr-1 { - padding-right: 0.25rem; - } - .lg\:pr-12 { - padding-right: 3rem; - } - .lg\:pr-14 { - padding-right: 3.5rem; - } - .lg\:pr-3 { - padding-right: 0.75rem; - } - .lg\:pr-4 { - padding-right: 1rem; - } - .lg\:pr-5 { - padding-right: 1.25rem; - } - .lg\:pt-0 { - padding-top: 0; - } - .lg\:pt-10 { - padding-top: 2.5rem; - } - .lg\:pt-12 { - padding-top: 3rem; - } - .lg\:pt-2 { - padding-top: 0.5rem; - } - .lg\:pt-20 { - padding-top: 5rem; - } - .lg\:pt-22 { - padding-top: 5.5rem; - } - .lg\:pt-3 { - padding-top: 0.75rem; - } - .lg\:pt-3\.5 { - padding-top: 0.875rem; - } - .lg\:pt-4 { - padding-top: 1rem; - } - .lg\:pt-6 { - padding-top: 1.5rem; - } - .lg\:pt-8 { - padding-top: 2rem; - } - .lg\:text-left { - text-align: left; - } - .lg\:text-center { - text-align: center; - } - .lg\:text-2xl { - font-size: 1.375rem; - } - .lg\:text-3xl { - font-size: 1.5rem; - } - .lg\:text-4xl { - font-size: 1.625rem; - } - .lg\:text-6xl { - font-size: 2rem; - } - .lg\:text-7xl { - font-size: 2.5rem; - } - .lg\:text-9xl { - font-size: 3.5rem; - } - .lg\:text-base { - font-size: 1rem; - } - .lg\:text-xl { - font-size: 1.25rem; - } - .lg\:font-normal { - font-weight: 400; - } - .lg\:leading-tight { - line-height: 1.25; - } - .lg\:leading-tighter { - line-height: 1.125; - } - .lg\:tracking-tight { - letter-spacing: -0.5px; - } - .lg\:tracking-tightest { - letter-spacing: -2px; - } - .lg\:text-white { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); - } - .lg\:opacity-0 { - opacity: 0; - } - .lg\: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); - } - .lg\: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); - } - .lg\:aspect-ratio-two-one > div:first-of-type:before { - content: ''; - display: block; - width: 100%; - padding-bottom: 50%; - } - .lg\:aspect-ratio-two-one > div:first-of-type iframe, - .lg\:aspect-ratio-two-one > div:first-of-type img { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - height: 100%; - width: 100%; - } - .lg\:text-contrast { - text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); - } - .NavInternal .NavInternalPanel .lg\:auto-cols-2, - .NavInternal .NavInternalPanel .lg\:auto-cols-3 { - -moz-column-gap: 3.5rem; - column-gap: 3.5rem; - } - .NavInternal .NavInternalPanel .lg\:auto-cols-2 { - -moz-column-count: 2; - column-count: 2; - } - .NavInternal .NavInternalPanel .lg\:auto-cols-3 { - -moz-column-count: 3; - column-count: 3; - } - @media (hover: hover) and (pointer: fine) { - .group:hover .lg\:group-hover\:mb-1 { - margin-bottom: 0.25rem; - } - .group:hover .lg\:group-hover\:mb-3 { - margin-bottom: 0.75rem; - } - .group:hover .lg\:group-hover\:ml-0 { - margin-left: 0; - } - .group:hover .lg\: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)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .group:hover .lg\:group-hover\:opacity-100 { - opacity: 1; - } - } -} -@media (min-width: 1280px) { - .xl\:col-span-2 { - grid-column: span 2 / span 2; - } - .xl\:col-span-3 { - grid-column: span 3 / span 3; - } - .xl\:col-span-4 { - grid-column: span 4 / span 4; - } - .xl\:col-span-7 { - grid-column: span 7 / span 7; - } - .xl\:col-start-6 { - grid-column-start: 6; - } - .xl\:col-start-9 { - grid-column-start: 9; - } - .xl\:col-end-11 { - grid-column-end: 11; - } - .xl\:col-end-6 { - grid-column-end: 6; - } - .xl\:col-end-7 { - grid-column-end: 7; - } - .xl\:col-end-8 { - grid-column-end: 8; - } - .xl\:col-end-9 { - grid-column-end: 9; - } - .xl\:mx-24 { - margin-left: 6rem; - margin-right: 6rem; - } - .xl\:mx-4 { - margin-left: 1rem; - margin-right: 1rem; - } - .xl\:-ml-20 { - margin-left: -5rem; - } - .xl\:-ml-22 { - margin-left: -5.5rem; - } - .xl\:-mr-22 { - margin-right: -5.5rem; - } - .xl\:mb-3 { - margin-bottom: 0.75rem; - } - .xl\:block { - display: block; - } - .xl\:w-1\/2 { - width: 50%; - } - .xl\:w-2\/3 { - width: 66.666667%; - } - .xl\:w-3\/5 { - width: 60%; - } - .xl\:w-5\/12 { - width: 41.666667%; - } - .xl\:-translate-x-1\/2 { - --tw-translate-x: -50%; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .xl\:grid-cols-9 { - grid-template-columns: repeat(9, minmax(0, 1fr)); - } - .xl\:from-transparent-w25 { - --tw-gradient-from: transparent 25% var(--tw-gradient-from-position); - --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position); - --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); - } - .xl\:px-0 { - padding-left: 0; - padding-right: 0; - } - .xl\:px-10 { - padding-left: 2.5rem; - padding-right: 2.5rem; - } - .xl\:px-8 { - padding-left: 2rem; - padding-right: 2rem; - } - .xl\:py-6 { - padding-top: 1.5rem; - padding-bottom: 1.5rem; - } - .xl\:pl-14 { - padding-left: 3.5rem; - } - .xl\:pr-18 { - padding-right: 4.5rem; - } - .xl\:pr-26 { - padding-right: 6.5rem; - } - .xl\:pr-4 { - padding-right: 1rem; - } - .xl\:pr-6 { - padding-right: 1.5rem; - } - .xl\:text-10xl { - font-size: 4.5rem; - } - .xl\:text-2xl { - font-size: 1.375rem; - } - .xl\:text-6xl { - font-size: 2rem; - } - .xl\:text-base { - font-size: 1rem; - } - .xl\:text-xl { - font-size: 1.25rem; - } - .xl\:leading-normal { - line-height: 1.5; - } -} -@media (min-width: 1440px) { - .\32xl\:col-span-3 { - grid-column: span 3 / span 3; - } - .\32xl\:-mr-3 { - margin-right: -0.75rem; - } - .\32xl\:w-2\/5 { - width: 40%; - } - .\32xl\:grid-cols-11 { - grid-template-columns: repeat(11, minmax(0, 1fr)); - } - .\32xl\:px-0 { - padding-left: 0; - padding-right: 0; - } - .\32xl\:pl-0 { - padding-left: 0; - } - .\32xl\:pr-0 { - padding-right: 0; - } -} -@media (min-width: 1800px) { - .\33xl\:col-end-12 { - grid-column-end: 12; - } - .\33xl\:col-end-13 { - grid-column-end: 13; - } - .\33xl\:ml-0 { - margin-left: 0; - } - .\33xl\:mr-16 { - margin-right: 4rem; - } - .\33xl\:grid-cols-4 { - grid-template-columns: repeat(4, minmax(0, 1fr)); - } - .\33xl\:px-0 { - padding-left: 0; - padding-right: 0; - } -} -@media (hover: hover) { - .can-hover\:-ml-3 { - margin-left: -0.75rem; - } - .can-hover\:block { - display: block; - } - .can-hover\:opacity-0 { - opacity: 0; - } - .can-hover\:opacity-100 { - opacity: 1; - } - @media (hover: hover) and (pointer: fine) { - .can-hover\:hover\:font-medium:hover { - font-weight: 500; - } - .can-hover\:hover\:text-action-hover:hover { - color: var(--color-action-dark); - } - .can-hover\:hover\:text-gray-dark:hover { - --tw-text-opacity: 1; - color: rgb(34 34 34 / var(--tw-text-opacity)); - } - .can-hover\:hover\:text-gray-mid-dark:hover { - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-opacity)); - } - .can-hover\:hover\:text-jpl-sky-blue-dark:hover { - --tw-text-opacity: 1; - color: rgb(0 100 128 / var(--tw-text-opacity)); - } - .can-hover\:hover\:text-white:hover { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); - } - .can-hover\:hover\:text-opacity-100:hover { - --tw-text-opacity: 1; - } - .can-hover\:hover\:underline:hover { - text-decoration-line: underline; - } - .can-hover\:hover\:opacity-95:hover { - opacity: 0.95; - } - .can-hover\: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); - } - .group:hover .can-hover\:group-hover\:-mt-3 { - margin-top: -0.75rem; - } - .group:hover .can-hover\:group-hover\:ml-0 { - margin-left: 0; - } - .group:hover .can-hover\:group-hover\:ml-2 { - margin-left: 0.5rem; - } - .group:hover .can-hover\:group-hover\:ml-3 { - margin-left: 0.75rem; - } - .group:hover .can-hover\:group-hover\:ml-5 { - margin-left: 1.25rem; - } - .group:hover .can-hover\:group-hover\:-translate-y-2 { - --tw-translate-y: -0.5rem; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .group:hover .can-hover\:group-hover\:-translate-y-3 { - --tw-translate-y: -0.75rem; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .group:hover .can-hover\:group-hover\:scale-100 { - --tw-scale-x: 1; - --tw-scale-y: 1; - transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .group:hover .can-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)) - skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) - scaleY(var(--tw-scale-y)); - } - .group:hover .can-hover\:group-hover\:border-b-2 { - border-bottom-width: 2px; - } - .group:hover .can-hover\:group-hover\:border-gray-mid-dark { - --tw-border-opacity: 1; - border-color: rgb(111 111 111 / var(--tw-border-opacity)); - } - .group:hover .can-hover\:group-hover\:border-jpl-red { - --tw-border-opacity: 1; - border-color: rgb(227 25 55 / var(--tw-border-opacity)); - } - .group:hover .can-hover\:group-hover\:border-jpl-red-light { - --tw-border-opacity: 1; - border-color: rgb(231 59 84 / var(--tw-border-opacity)); - } - .group:hover .can-hover\:group-hover\:bg-jpl-red-light { - --tw-bg-opacity: 1; - background-color: rgb(231 59 84 / var(--tw-bg-opacity)); - } - .group:hover .can-hover\:group-hover\:text-gray-mid-dark { - --tw-text-opacity: 1; - color: rgb(111 111 111 / var(--tw-text-opacity)); - } - .group:hover .can-hover\:group-hover\:underline { - text-decoration-line: underline; - } - .group:hover .can-hover\:group-hover\:opacity-100 { - opacity: 1; - } - .group:hover .can-hover\:group-hover\:delay-200 { - transition-delay: 0.2s; - } - } -} +@charset "UTF-8";.carousel{position:relative;box-sizing:border-box}.carousel *,.carousel *:before,.carousel *:after{box-sizing:inherit}.carousel.is-draggable{cursor:move;cursor:grab}.carousel.is-dragging{cursor:move;cursor:grabbing}.carousel__viewport{position:relative;overflow:hidden;max-width:100%;max-height:100%}.carousel__track{display:flex}.carousel__slide{flex:0 0 auto;width:var(--carousel-slide-width, 60%);max-width:100%;padding:1rem;position:relative;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}.has-dots{margin-bottom:calc(.5rem + 22px)}.carousel__dots{margin:0 auto;padding:0;position:absolute;top:calc(100% + .5rem);left:0;right:0;display:flex;justify-content:center;list-style:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.carousel__dots .carousel__dot{margin:0;padding:0;display:block;position:relative;width:22px;height:22px;cursor:pointer}.carousel__dots .carousel__dot:after{content:"";width:8px;height:8px;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:currentColor;opacity:.25;transition:opacity .15s ease-in-out}.carousel__dots .carousel__dot.is-selected:after{opacity:1}.carousel__button{width:var(--carousel-button-width, 48px);height:var(--carousel-button-height, 48px);padding:0;border:0;display:flex;justify-content:center;align-items:center;pointer-events:all;cursor:pointer;color:var(--carousel-button-color, currentColor);background:var(--carousel-button-bg, transparent);border-radius:var(--carousel-button-border-radius, 50%);box-shadow:var(--carousel-button-shadow, none);transition:opacity .15s ease}.carousel__button.is-prev,.carousel__button.is-next{position:absolute;top:50%;transform:translateY(-50%)}.carousel__button.is-prev{left:10px}.carousel__button.is-next{right:10px}.carousel__button[disabled]{cursor:default;opacity:.3}.carousel__button svg{width:var(--carousel-button-svg-width, 50%);height:var(--carousel-button-svg-height, 50%);fill:none;stroke:currentColor;stroke-width:var(--carousel-button-svg-stroke-width, 1.5);stroke-linejoin:bevel;stroke-linecap:round;filter:var(--carousel-button-svg-filter, none);pointer-events:none}html.with-fancybox{scroll-behavior:auto}body.compensate-for-scrollbar{overflow:hidden!important;touch-action:none}.fancybox__container{position:fixed;top:0;left:0;bottom:0;right:0;direction:ltr;margin:0;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);box-sizing:border-box;display:flex;flex-direction:column;color:var(--fancybox-color, #fff);-webkit-tap-highlight-color:rgba(0,0,0,0);overflow:hidden;z-index:1050;outline:none;transform-origin:top left;--carousel-button-width: 48px;--carousel-button-height: 48px;--carousel-button-svg-width: 24px;--carousel-button-svg-height: 24px;--carousel-button-svg-stroke-width: 2.5;--carousel-button-svg-filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, .4))}.fancybox__container *,.fancybox__container *:before,.fancybox__container *:after{box-sizing:inherit}.fancybox__container :focus{outline:none}body:not(.is-using-mouse) .fancybox__container :focus{box-shadow:0 0 0 1px #fff,0 0 0 2px var(--fancybox-accent-color, rgba(1, 210, 232, .94))}@media all and (min-width: 1024px){.fancybox__container{--carousel-button-width:48px;--carousel-button-height:48px;--carousel-button-svg-width:27px;--carousel-button-svg-height:27px}}.fancybox__backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:var(--fancybox-bg, rgba(24, 24, 27, .92))}.fancybox__carousel{position:relative;flex:1 1 auto;min-height:0;height:100%;z-index:10}.fancybox__carousel.has-dots{margin-bottom:calc(.5rem + 22px)}.fancybox__viewport{position:relative;width:100%;height:100%;overflow:visible;cursor:default}.fancybox__track{display:flex;height:100%}.fancybox__slide{flex:0 0 auto;width:100%;max-width:100%;margin:0;padding:48px 8px 8px;position:relative;overscroll-behavior:contain;display:flex;flex-direction:column;outline:0;overflow:auto;--carousel-button-width: 36px;--carousel-button-height: 36px;--carousel-button-svg-width: 22px;--carousel-button-svg-height: 22px}.fancybox__slide:before,.fancybox__slide:after{content:"";flex:0 0 0;margin:auto}@media all and (min-width: 1024px){.fancybox__slide{padding:64px 100px}}.fancybox__content{margin:0 env(safe-area-inset-right,0px) 0 env(safe-area-inset-left,0px);padding:36px;color:var(--fancybox-content-color, #374151);background:var(--fancybox-content-bg, #fff);position:relative;align-self:center;display:flex;flex-direction:column;z-index:20}.fancybox__content :focus:not(.carousel__button.is-close){outline:thin dotted;box-shadow:none}.fancybox__caption{align-self:center;max-width:100%;margin:0;padding:1rem 0 0;line-height:1.375;color:var(--fancybox-color, currentColor);visibility:visible;cursor:auto;flex-shrink:0;overflow-wrap:anywhere}.is-loading .fancybox__caption{visibility:hidden}.fancybox__container>.carousel__dots{top:100%;color:var(--fancybox-color, #fff)}.fancybox__nav .carousel__button{z-index:40}.fancybox__nav .carousel__button.is-next{right:8px}@media all and (min-width: 1024px){.fancybox__nav .carousel__button.is-next{right:40px}}.fancybox__nav .carousel__button.is-prev{left:8px}@media all and (min-width: 1024px){.fancybox__nav .carousel__button.is-prev{left:40px}}.carousel__button.is-close{position:absolute;top:8px;right:8px;top:calc(env(safe-area-inset-top,0px) + 8px);right:calc(env(safe-area-inset-right,0px) + 8px);z-index:40}@media all and (min-width: 1024px){.carousel__button.is-close{right:40px}}.fancybox__content>.carousel__button.is-close{position:absolute;top:-40px;right:0;color:var(--fancybox-color, #fff)}.fancybox__no-click,.fancybox__no-click button{pointer-events:none}.fancybox__spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;color:var(--fancybox-color, currentColor)}.fancybox__slide .fancybox__spinner{cursor:pointer;z-index:1053}.fancybox__spinner svg{animation:fancybox-rotate 2s linear infinite;transform-origin:center center;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:100%;height:100%}.fancybox__spinner svg circle{fill:none;stroke-width:2.75;stroke-miterlimit:10;stroke-dasharray:1,200;stroke-dashoffset:0;animation:fancybox-dash 1.5s ease-in-out infinite;stroke-linecap:round;stroke:currentColor}@keyframes fancybox-rotate{to{transform:rotate(360deg)}}@keyframes fancybox-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.fancybox__backdrop,.fancybox__caption,.fancybox__nav,.carousel__dots,.carousel__button.is-close{opacity:var(--fancybox-opacity, 1)}.fancybox__container.is-animated[aria-hidden=false] .fancybox__backdrop,.fancybox__container.is-animated[aria-hidden=false] .fancybox__caption,.fancybox__container.is-animated[aria-hidden=false] .fancybox__nav,.fancybox__container.is-animated[aria-hidden=false] .carousel__dots,.fancybox__container.is-animated[aria-hidden=false] .carousel__button.is-close{animation:.15s ease backwards fancybox-fadeIn}.fancybox__container.is-animated.is-closing .fancybox__backdrop,.fancybox__container.is-animated.is-closing .fancybox__caption,.fancybox__container.is-animated.is-closing .fancybox__nav,.fancybox__container.is-animated.is-closing .carousel__dots,.fancybox__container.is-animated.is-closing .carousel__button.is-close{animation:.15s ease both fancybox-fadeOut}.fancybox-fadeIn{animation:.15s ease both fancybox-fadeIn}.fancybox-fadeOut{animation:.1s ease both fancybox-fadeOut}.fancybox-zoomInUp{animation:.2s ease both fancybox-zoomInUp}.fancybox-zoomOutDown{animation:.15s ease both fancybox-zoomOutDown}.fancybox-throwOutUp{animation:.15s ease both fancybox-throwOutUp}.fancybox-throwOutDown{animation:.15s ease both fancybox-throwOutDown}@keyframes fancybox-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fancybox-fadeOut{to{opacity:0}}@keyframes fancybox-zoomInUp{0%{transform:scale(.97) translate3d(0,16px,0);opacity:0}to{transform:scale(1) translateZ(0);opacity:1}}@keyframes fancybox-zoomOutDown{to{transform:scale(.97) translate3d(0,16px,0);opacity:0}}@keyframes fancybox-throwOutUp{to{transform:translate3d(0,-30%,0);opacity:0}}@keyframes fancybox-throwOutDown{to{transform:translate3d(0,30%,0);opacity:0}}.fancybox__carousel .carousel__slide{scrollbar-width:thin;scrollbar-color:#ccc rgba(255,255,255,.1)}.fancybox__carousel .carousel__slide::-webkit-scrollbar{width:8px;height:8px}.fancybox__carousel .carousel__slide::-webkit-scrollbar-track{background-color:#ffffff1a}.fancybox__carousel .carousel__slide::-webkit-scrollbar-thumb{background-color:#ccc;border-radius:2px;box-shadow:inset 0 0 4px #0003}.fancybox__carousel.is-draggable .fancybox__slide,.fancybox__carousel.is-draggable .fancybox__slide .fancybox__content{cursor:move;cursor:grab}.fancybox__carousel.is-dragging .fancybox__slide,.fancybox__carousel.is-dragging .fancybox__slide .fancybox__content{cursor:move;cursor:grabbing}.fancybox__carousel .fancybox__slide .fancybox__content{cursor:auto}.fancybox__carousel .fancybox__slide.can-zoom_in .fancybox__content{cursor:zoom-in}.fancybox__carousel .fancybox__slide.can-zoom_out .fancybox__content{cursor:zoom-out}.fancybox__carousel .fancybox__slide.is-draggable .fancybox__content{cursor:move;cursor:grab}.fancybox__carousel .fancybox__slide.is-dragging .fancybox__content{cursor:move;cursor:grabbing}.fancybox__image{transform-origin:0 0;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:none}.has-image .fancybox__content{padding:0;background:#0000;min-height:1px}.is-closing .has-image .fancybox__content{overflow:visible}.has-image[data-image-fit=contain]{overflow:visible;touch-action:none}.has-image[data-image-fit=contain] .fancybox__content{flex-direction:row;flex-wrap:wrap}.has-image[data-image-fit=contain] .fancybox__image{max-width:100%;max-height:100%;object-fit:contain}.has-image[data-image-fit=contain-w]{overflow-x:hidden;overflow-y:auto}.has-image[data-image-fit=contain-w] .fancybox__content{min-height:auto}.has-image[data-image-fit=contain-w] .fancybox__image{max-width:100%;height:auto}.has-image[data-image-fit=cover]{overflow:visible;touch-action:none}.has-image[data-image-fit=cover] .fancybox__content{width:100%;height:100%}.has-image[data-image-fit=cover] .fancybox__image{width:100%;height:100%;object-fit:cover}.fancybox__carousel .fancybox__slide.has-iframe .fancybox__content,.fancybox__carousel .fancybox__slide.has-map .fancybox__content,.fancybox__carousel .fancybox__slide.has-pdf .fancybox__content,.fancybox__carousel .fancybox__slide.has-video .fancybox__content,.fancybox__carousel .fancybox__slide.has-html5video .fancybox__content{max-width:100%;flex-shrink:1;min-height:1px;overflow:visible}.fancybox__carousel .fancybox__slide.has-iframe .fancybox__content,.fancybox__carousel .fancybox__slide.has-map .fancybox__content,.fancybox__carousel .fancybox__slide.has-pdf .fancybox__content{width:100%;height:80%}.fancybox__carousel .fancybox__slide.has-video .fancybox__content,.fancybox__carousel .fancybox__slide.has-html5video .fancybox__content{width:960px;height:540px;max-width:100%;max-height:100%}.fancybox__carousel .fancybox__slide.has-map .fancybox__content,.fancybox__carousel .fancybox__slide.has-pdf .fancybox__content,.fancybox__carousel .fancybox__slide.has-video .fancybox__content,.fancybox__carousel .fancybox__slide.has-html5video .fancybox__content{padding:0;background:#18181be6;color:#fff}.fancybox__carousel .fancybox__slide.has-map .fancybox__content{background:#e5e3df}.fancybox__html5video,.fancybox__iframe{border:0;display:block;height:100%;width:100%;background:#0000}.fancybox-placeholder{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.fancybox__thumbs{flex:0 0 auto;position:relative;padding:0 3px;opacity:var(--fancybox-opacity, 1)}.fancybox__container.is-animated[aria-hidden=false] .fancybox__thumbs{animation:.15s ease-in backwards fancybox-fadeIn}.fancybox__container.is-animated.is-closing .fancybox__thumbs{opacity:0}.fancybox__thumbs .carousel__slide{flex:0 0 auto;width:var(--fancybox-thumbs-width, 96px);margin:0;padding:8px 3px;box-sizing:content-box;display:flex;align-items:center;justify-content:center;overflow:visible;cursor:pointer}.fancybox__thumbs .carousel__slide .fancybox__thumb:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-width:5px;border-style:solid;border-color:var(--fancybox-accent-color, rgba(34, 213, 233, .96));opacity:0;transition:opacity .15s ease;border-radius:var(--fancybox-thumbs-border-radius, 4px)}.fancybox__thumbs .carousel__slide.is-nav-selected .fancybox__thumb:after{opacity:.92}.fancybox__thumbs .carousel__slide>*{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.fancybox__thumb{position:relative;width:100%;padding-top:calc(100%/(var(--fancybox-thumbs-ratio, 1.5)));background-size:cover;background-position:center center;background-color:#ffffff1a;background-repeat:no-repeat;border-radius:var(--fancybox-thumbs-border-radius, 4px)}.fancybox__toolbar{position:absolute;top:0;right:0;left:0;z-index:20;background:linear-gradient(to top,#0000,#00000002 8.1%,#00000005 15.5%,#0000000c 22.5%,#00000014 29%,#0000001d 35.3%,#00000028,#00000032 47.1%,#0000003e 52.9%,#00000049,#00000053 64.7%,#0000005d 71%,#00000064 77.5%,#0000006b 84.5%,#0000006f 91.9%,#00000070);padding:0;touch-action:none;display:flex;justify-content:space-between;--carousel-button-svg-width: 20px;--carousel-button-svg-height: 20px;opacity:var(--fancybox-opacity, 1);text-shadow:var(--fancybox-toolbar-text-shadow, 1px 1px 1px rgba(0, 0, 0, .4))}@media all and (min-width: 1024px){.fancybox__toolbar{padding:8px}}.fancybox__container.is-animated[aria-hidden=false] .fancybox__toolbar{animation:.15s ease-in backwards fancybox-fadeIn}.fancybox__container.is-animated.is-closing .fancybox__toolbar{opacity:0}.fancybox__toolbar__items{display:flex}.fancybox__toolbar__items--left{margin-right:auto}.fancybox__toolbar__items--center{position:absolute;left:50%;transform:translate(-50%)}.fancybox__toolbar__items--right{margin-left:auto}@media (max-width: 640px){.fancybox__toolbar__items--center:not(:last-child){display:none}}.fancybox__counter{min-width:72px;padding:0 10px;line-height:var(--carousel-button-height, 48px);text-align:center;font-size:17px;font-variant-numeric:tabular-nums;-webkit-font-smoothing:subpixel-antialiased}.fancybox__progress{background:var(--fancybox-accent-color, rgba(34, 213, 233, .96));height:3px;left:0;position:absolute;right:0;top:0;transform:scaleX(0);transform-origin:0;transition-property:transform;transition-timing-function:linear;z-index:30;-webkit-user-select:none;-moz-user-select:none;user-select:none}.fancybox__container:fullscreen::backdrop{opacity:0}.fancybox__button--fullscreen g:nth-child(2){display:none}.fancybox__container:fullscreen .fancybox__button--fullscreen g:nth-child(1){display:none}.fancybox__container:fullscreen .fancybox__button--fullscreen g:nth-child(2){display:block}.fancybox__button--slideshow g:nth-child(2){display:none}.fancybox__container.has-slideshow .fancybox__button--slideshow g:nth-child(1){display:none}.fancybox__container.has-slideshow .fancybox__button--slideshow g:nth-child(2){display:block}@font-face{font-family:swiper-icons;src:url(data:application/font-woff;charset=utf-8;base64,\ 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);font-weight:400;font-style:normal}:root{--swiper-theme-color: #007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translateZ(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper:before{content:"";flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper:before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper:before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,#00000080,#0000)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color: #fff}.swiper-lazy-preloader-black{--swiper-preloader-color: #000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper:after{content:"";position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper:after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper:after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size: 44px}.swiper-button-prev,.swiper-button-next{position:absolute;top:var(--swiper-navigation-top-offset, 50%);width:calc(var(--swiper-navigation-size) / 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size) / 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color))}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev.swiper-button-hidden,.swiper-button-next.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-prev,.swiper-navigation-disabled .swiper-button-next{display:none!important}.swiper-button-prev svg,.swiper-button-next svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-prev svg,.swiper-rtl .swiper-button-next svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset, 10px);right:auto}.swiper-button-lock{display:none}.swiper-button-prev:after,.swiper-button-next:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:"prev"}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:"next"}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translateZ(0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;transform:translate3d(0,-50%,0)}.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translate(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, .25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius, 10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, .1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset, 1%);bottom:var(--swiper-scrollbar-bottom, 4px);top:var(--swiper-scrollbar-top, auto);z-index:50;height:var(--swiper-scrollbar-size, 4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%))}.swiper-vertical>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-vertical{position:absolute;left:var(--swiper-scrollbar-left, auto);right:var(--swiper-scrollbar-right, 4px);top:var(--swiper-scrollbar-sides-offset, 1%);z-index:50;width:var(--swiper-scrollbar-size, 4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, .5));border-radius:var(--swiper-scrollbar-border-radius, 10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>img,.swiper-zoom-container>svg,.swiper-zoom-container>canvas{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active,.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:"";background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right{z-index:0;backface-visibility:hidden}.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right{z-index:0;backface-visibility:hidden}.swiper-creative .swiper-slide{backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;backface-visibility:hidden;overflow:hidden}@tailwind base;.container{width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1320px){.container{max-width:1320px}}.BaseButton{padding-top:.7em;padding-bottom:.7em;background-size:100% 215%;background-position:0 -1px;cursor:pointer;background-image:linear-gradient(to bottom,var(--tw-gradient-stops));--tw-gradient-from:transparent 50% var(--tw-gradient-from-position);--tw-gradient-to:rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to);font-family:Archivo Narrow,Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-weight:600;text-transform:uppercase;line-height:1.5;letter-spacing:1px;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;transition-timing-function:linear}.BaseButton:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.BaseButton>.label{display:flex;align-items:center;justify-content:center}@media (hover: hover){.BaseButton:hover{background-position:bottom}}.BaseButton.-primary{background-color:var(--color-action);--tw-gradient-to:var(--color-action-dark) 50% var(--tw-gradient-to-position);padding-left:3rem;padding-right:3rem;--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.BaseButton.-primary>.label{border-width:2px;border-color:transparent}.BaseButton.-reverse-primary{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity));--tw-gradient-to:var(--color-primary-dark) 50% var(--tw-gradient-to-position);padding-left:3rem;padding-right:3rem;color:var(--color-primary)}@media (hover: hover){.BaseButton.-reverse-primary:hover{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}}.BaseButton.-reverse-primary>.label{border-width:2px;border-color:transparent}.BaseButton.-secondary{border-width:2px;border-color:var(--color-action);background-color:transparent;--tw-gradient-to:var(--color-action-dark) 50% var(--tw-gradient-to-position);padding-left:3rem;padding-right:3rem;color:var(--color-action)}@media (hover: hover){.BaseButton.-secondary:hover{border-color:var(--color-action-dark);--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}}.BaseButton.-dark{border-width:1px;border-color:#fff6;background-color:transparent;--tw-gradient-to:#FFFFFF 50% var(--tw-gradient-to-position);padding-left:3rem;padding-right:3rem;--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}@media (hover: hover){.BaseButton.-dark:hover{--tw-border-opacity:1;border-color:rgb(255 255 255 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity));--tw-text-opacity:1;color:rgb(0 69 98 / var(--tw-text-opacity))}.ThemeEdu .BaseButton.-dark:hover,.BaseButton.-dark:hover.ThemeEdu{color:var(--color-primary-dark)}}.BaseButton.-social{border-width:1px;--tw-border-opacity:1;border-color:rgb(148 148 148 / var(--tw-border-opacity));background-color:transparent;--tw-gradient-to:#222222 50% var(--tw-gradient-to-position);padding-left:3rem;padding-right:3rem;--tw-text-opacity:1;color:rgb(148 148 148 / var(--tw-text-opacity))}@media (hover: hover){.BaseButton.-social:hover{--tw-bg-opacity:1;background-color:rgb(34 34 34 / var(--tw-bg-opacity));--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}}.BaseButton.-social.-facebook{--tw-gradient-to:#3b5998 50% var(--tw-gradient-to-position)}@media (hover: hover){.BaseButton.-social.-facebook:hover{--tw-border-opacity:1;border-color:rgb(59 89 152 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(59 89 152 / var(--tw-bg-opacity))}}.BaseButton.-social.-twitter{--tw-gradient-to:#000000 50% var(--tw-gradient-to-position)}@media (hover: hover){.BaseButton.-social.-twitter:hover{--tw-border-opacity:1;border-color:rgb(0 0 0 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity))}}.BaseButton.-social.-instagram{--tw-gradient-to:#dd2a7b 50% var(--tw-gradient-to-position)}@media (hover: hover){.BaseButton.-social.-instagram:hover{--tw-border-opacity:1;border-color:rgb(221 42 123 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(221 42 123 / var(--tw-bg-opacity))}}.BaseButton.-social.-youtube{--tw-gradient-to:#ff0000 50% var(--tw-gradient-to-position)}@media (hover: hover){.BaseButton.-social.-youtube:hover{--tw-border-opacity:1;border-color:rgb(255 0 0 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(255 0 0 / var(--tw-bg-opacity))}}.BaseButton.-social.-reddit{--tw-gradient-to:#ff4500 50% var(--tw-gradient-to-position)}@media (hover: hover){.BaseButton.-social.-reddit:hover{--tw-border-opacity:1;border-color:rgb(255 69 0 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(255 69 0 / var(--tw-bg-opacity))}}.BaseButton.-compact{padding-left:1.25rem;padding-right:1.25rem}.BaseButton.-icon-only{padding:0}.BaseButton.-icon-only>.label{display:flex;height:100%;width:100%;align-items:center;justify-content:center}.BaseButton:disabled{cursor:default!important;--tw-border-opacity:1 !important;border-color:rgb(148 148 148 / var(--tw-border-opacity))!important;--tw-bg-opacity:1 !important;background-color:rgb(148 148 148 / var(--tw-bg-opacity))!important;background-image:none!important}.BaseButton:disabled>.label{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.BaseIframe{width:100%;border-style:none}img.BaseImage{max-width:100%}img.BaseImage.lazyload:not([src]),img.BaseImage:not([src]){border-style:none;opacity:0}img.BaseImage.lazyloaded{opacity:0;animation-name:fadein;animation-duration:.5s;animation-iteration-count:1;animation-fill-mode:forwards;animation-direction:normal;animation-timing-function:ease-out}@keyframes fadein{0%{opacity:0}to{opacity:1}}.BaseImageCaption{--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity))}.BaseImageCaption>div>.the-caption-text>p{display:inline!important}.BaseImageCaption>div>.the-caption-text a{cursor:pointer;color:var(--color-action);text-decoration-line:underline}@media (hover: hover){.BaseImageCaption>div>.the-caption-text a:hover{color:var(--color-action-dark)}}.ThemeVariantLight .BaseImageCaption{--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity))}.ThemeVariantDark .BaseImageCaption{--tw-text-opacity:1;color:rgb(148 148 148 / var(--tw-text-opacity))}.BaseImagePlaceholder{position:relative;margin:0;display:block;width:auto;align-items:center;justify-content:center;overflow:hidden;--tw-bg-opacity:1;background-color:rgb(216 216 216 / var(--tw-bg-opacity));background-repeat:no-repeat;height:inherit;background-position:center center;background-size:50px;background-image:url(data:image/png;base64,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)}@media (min-width: 640px){.BaseImagePlaceholder{background-size:100px}}.BaseImagePlaceholder .BaseLightboxOpenButton{opacity:1;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}@media (hover: hover){@media (min-width: 640px){.BaseImagePlaceholder .BaseLightboxOpenButton{opacity:0;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.5s}.BaseImagePlaceholder:hover .BaseLightboxOpenButton{opacity:1;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}}}.BaseImagePlaceholder.light-theme{--tw-bg-opacity:1;background-color:rgb(245 245 245 / var(--tw-bg-opacity))}.BaseImagePlaceholder.dark-theme{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity));background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAd8AAACOCAYAAABwpQK+AAAMk0lEQVR4nO3dd+xeVR3H8XeHUGipUJYgSMRilBGp2jACiCh1IAYEoqCAEol7QaqWpSIFlKggjggSEQVEXCBOZqwRwxQBRVBThowWKLKhy1w9GKDl96w7zr3f9yv5pf2nP879nIfn89z73HvOuFmzZqFGvBo4BXgIWNKiKdgUOAH4xoD/7nDgIGB+ReOqylJgEjAVWNaysedufHrt3wfcDfwTuAm4BrilZcfyXeAA4MEMxtJL8VqeAxyf9zC7bWL0ABq0PjCjpWOfPsS/2SIV96YVjEfdcztwCXAB8CvgkcyPcHL6c2rD4+jXqu0YZneNjx5AgxaHPXKpt42BA4FzgfuBs4EdMs7NqyIaiOUrKXerAO8A5gE3A/s6Y2o7y1dSm2wGnJUuS+/pzKmtLF9JbbQR8BPgiiHvQZAaZflKarOZ6c7oI51FtYnlK6kLjgauSk8RSNmzfCV1xavSd8EuXqDsWb6SuuR5wG+ADzurypnlK6mLTgaOdWaVK8tXUlfNGWIZVKkWlq+kLvsA8CVnWLmxfCV13SHAYRUfo8tLaiCWr6QI5gL7VXica/gq0iAsX0lRnJm28qzCZF9FGoTlKymSc4DVKzjepb6KNAjLV1IkxX7SpzrjaprlKyma/dJewVJjLF9JEZ3kOtBqkuUrKaLnAyc482qK5Sspqv2BXZ19NcHylRTZ5519NcHylRTZNsA7fQWobpavpOg+FT0A1c/ylRTdVp79qm6WryTBx8xAdbJ8JQlmAq8zB9XF8pWk/znIHFQXy1fDmGpq6qC3p7WfpcpZvhrGJFNTB00A9nJiVQfLtzlt3oLM7dPUVXs6s6qD5ducKVEPXMrYdsCWTpCqZvk2x/KV8rSb86KqWb7N8dKtlKc3OC+q2kQTloayDHgQWFLhh9jiv7EqsFr6ey6Wp5uTuvr+sS2wAXBXBmNRR1m+0mAuB74AXAPcm4qoqvItro5MTl9R5HSlpPggMA5YF3gFsE+6VDsug7GVYbX03e9P2n8oypXlK/VvLnBEzXk9Adyf6RzdCVwHnJGK+KvAOzIYVxl2sHxVJb/zlfpzYQPF2yYLgX2B3TO7RD6s7ds5bLWF5Sv15+vm1JcL0qXoR1sw1rG8HJiW7/DUdpav1FtxY9U8c+rbDcAbWzLW51IsobpFnkNTF1i+Um8LM/7eNVfzOrBN34wMxqCOsnyl3h4zo6EUN2D9roXjfspL8xiGusjylXqbYEZDO66l4y5slcEY1FGWr6Qq/Rq4rKUJb5DBGKrizmQNs3wlVe30lia8CfDCDMZRBffkbpjlK6lqv27po0erAOtnMI4quLZ8wyxfSVW7B/hDS1PuavmqYZavpDpc3tKUN8pgDOogy1dSHa5racqe+aoSlq+kOtza0pSnZDAGdZDlK6kOC1p6k886GYxBHWT5SqrDIuDfLUx6cgZjUAdZvpLq8Hj6aZs1fHWoCpavpDqMSz9tM9FXh6pg+Uqqw+rAai1MelkGY1AHWb6S6rAusGYLk14rgzGogyxfSXVYt6Upu6OVKmH5SqrD1i1N+YEMxqAOsnwl1WFmS1NeksEY1EGWr6SqFe8zr21pym28Q1stYPlKqtqb0964bfSQrw5VwfKVVLV3tzjhhzMYgzrI8pVUpZ2AvVqc8MIMxqAOsnwlVenElqfrZWdVwvKVVJVTgBktT/fuDMagDrJ8JVXhS8DBHUj2tgzGoA5y0XBJZSrWcP4R8KaOpLoggzGogzzzlVSGKcCcdINSV4r3EeBfGYxDHeSZr9Sf7dJqR+NdeIGlwPPSes3TgZ2BWcAqGYytTLd5t7OqYvlKvc0H9gM+bFah3BI9AFXHy85Sb8Ul1cOB280qlBuiB6DqWL5Sb2sDDwJHmVUoV0cPQNWxfKXenvqO93TfkEP5S/QAVB3LVxqMZ78x3JR+pEpYvtJgfgn8zMw67/LoAahalq80uCPNrPMuix6AqmX5SoMr7oL9srl11mLLV1WzfKXhzAXuNbtOmueazqqa5SsN537gc2bXSedHD0DVs3yl4X0N+JP5dcoSb6hTHSxfaTRHmF+n/BS4NXoIqp7lK43mF54pdcqp0QNQPSxfaXQuvNEN1wIXRg9B9bB8pdFd76NHnfCV6AGoPpavVI5jgPvMsrWKD1Dfix6C6mP5SuVY5KNHrXZc9ABUL8tXKs/JwHXm2TrFalZnRw9B9bJ8pXL56FH7zI4egOpn+UrlugA4z0xbo7jcfFX0EFQ/y1cqn48etUOxOtlh0UNQMyxfqXx/Bk4y16wVy0i+K3oIao7lK1Xj8+56lLX9gRtLHODSDmakClm+UjWKZ36PNtssfQb4QckDW6Mj2agmlq9UnZPT4g3Kx9cq+lA02TnWICzf5niZKoYjoweQkW8CH6loOP7/rIFYvs1ZNeqBB3Oem7NnoVi3+YPRQ1A+LN/mbBz1wAPy7LdZnwAOiRyA8mP5NmeXqAceUPHo0YnRQ2jA48BrzV45snybsTnw+ogHHthc4IHoIdToYmDDtG6zVrTETJpl+Tbj0xEPOrh73fWoFk8AB6QPt4sCHO+wprZz2N1h+dbvoPSAv+I50V2PKlXczby2+/L2ZcsWjLHTLN96FaV7WqQD1gpc97l8ZwKbpLuZH+nawVVkG2DHTh5ZS1i+9Vgz7Rd6RoSD1ZiKx45+YUQjWwAcA6yX1mi+reXH04RzPANuzsSS/8sbAC8BHmtTCCVblj7UrAu8GNgVeCswoVNHqVEUe/7uZoIDK743/3k60724ZWPP0QZpBbbiprRr0/jKeJ8al94HF6XFR9p6kleMe3E6jtWAhcD307GNrOzyPQvYueTfKXVNsZXdV4GPOrNjuifttfvHVLbFn8szHm9b7ez7dt8eKGvRnDLL921OoNS344GZ6SuJhxuIbXk6y3l+OlOpu9QmpOdwH0rHX5xV3AXcCvwDuBn4u8s2KjNzcizfI0r8Xcqbl9BHVxTN9m0/CCmYbYF9gHNHPeyyrsW/B5hR0u9S/h51jiQFVco6DWWV72El/R61w0POk6SgXplOOEdSRvkWi5ZP91UYyt3RA5AU2qGjHvyo5bsGMDv6LAR0c/QAJIW2xahbVI5avp9Iz4oplvnOt/QMLlgUzyGj3LQ8ygvmBWWceqt17gRudNqkZ3jSOMIpFpT60LAHPUr5znZnjJCudDsyaQVNPKut5n0SmDLMKIYt3+npkrPiudQ5l1bgEwAxbTjsd7/Dlu+ctCqO4rko4DGXsparOu0epzesTwFrDXrww5Tv1mlPWsXz+6Df9071hhr14ON3cU0DPjbo0Q/zhuIyknH9OOiRr1LBJiTqlhucz9AOTdtb9m3Q8n0NsFf0lINalLbTkrSiW8wktCnp5qu+DVq+c6InHNh30n6qklZ0fdosQ3EVjx1t1O/RD1K+xebfb/CFFdap0QOQxlBsun6FAYU2aZAT1EHK1+964/o6cFP0EKQeLjag8N7f714H/ZbvvmkfQ8VTPL94rPMu9fQbIwpvfHr0qKd+y/fw6IkG9tm0pKSksRUbjvzWjMJ7L/CKXiH0U74fSDs4KJ4/Al923qW+nWZUSpsujKlX+U4qa9d+tdJIW2ZJAf0Q+KsTH94BwMyxQuhVvh8HXhQ9xaCKtbuvjR6CNIQTDU29nvsdq3zXdsvAsM70DUQa2inA1cYX3t7Ajs8VwljlWxTvOtHTC6h409g/egjSiGYboMZ67ve5yvdFnvWGdAfwRmB59CCkEV3q1SMBbwJet7Ignqt8P50Wk1ccxdKRO7uEpFSa4r6Ja4wzvMNWFsDKynfz9HiR4lgIbAP8wzmXSrUHcL+RhrYL8JZnB7Cy8nUZyViKwt0S+Gf0IKQK3J4uOy423NBWOPt9dvlum5aSVAyXAC8DFjjfUmX+BGwPPG7EYW0H7PP0g392+a702rQ66dj0iXyJ0ytV7qp0hekOow7rGXfAP718izfi3esfj2pWfL+7k+t1S7UrvuLZFLjA6EMqVrx611MH/vTyPSp6MgF8BVgfmBc9CKkhi9NJTvEm/ISTEM7/dzx6qnz3TmdD6qbz0rPbh/gMr5SFYhW5acBJTkcoxVcP7+Np5et3vd1TfKr+dtrYeY9016WkfDya1s8vVhI8Jn0lpO777wJW49NfZjjhnfAgcD5wILAWcLDP7krZuw84ElgP2BX4FnCL09ZZmwFfnJhutComf/4Am+urWePTp+Zi3m4D/pbWZL4SeDLTuZmfPhy07cPAtPRG6OV61eGi9FPYKJ0YTU9/L+7XWB1YGnAmive84smMB4BlwLgMxjSMYuwbAsv/A4jqpJ30lJRnAAAAAElFTkSuQmCC)}.BaseImagePlaceholder.transparent-theme{background-color:transparent;background-image:none}.BaseImagePlaceholder.no-logo{background-image:none}.BasePlaceholder .wrapper{width:0;animation:fullView .5s forwards cubic-bezier(.25,.46,.45,.94)}@keyframes fullView{to{width:100%}}.BasePlaceholder .animate-loading{animation:shimmer 2s infinite linear;background:linear-gradient(to right,#eff1f3 4%,#e2e2e2 25%,#eff1f3 36%);background-size:1000px 100%}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.BackToTop>button{display:none}@media print{.BackToTop>button{display:none}}.BackToTop[data-alwaysvisible]>button{display:block}.BackToTop .IconDropdown{--tw-rotate:180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));font-size:.875rem}@media (min-width: 640px){.BackToTop .IconDropdown{margin-right:.5rem}}.BackToTop .label-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media (min-width: 640px){.BackToTop .label-text{position:static;width:auto;height:auto;padding:0;margin:0;overflow:visible;clip:auto;white-space:normal}}.BlockCircleImageCard{--image-size: 90px;display:flex;align-items:center;gap:calc(var(--image-size) / 2)}@media (min-width: 1024px){.BlockCircleImageCard{--image-size: 130px}}.BlockCircleImageCard .BaseImagePlaceholder{width:var(--image-size);height:var(--image-size);margin:0 calc(-1 * var(--image-size) / 2)}.BlockCircleImageCard.imageOnRight{flex-direction:row-reverse}.BlockImageCarousel .BaseLightboxOpenButton{opacity:0;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.1s}.BlockImageCarousel:hover .BaseLightboxOpenButton{opacity:1;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:75ms}.BlockImageCarousel .swiper .swiper-prev{margin-right:1px}.BlockImageCarousel .swiper .swiper-prev.swiper-button-disabled,.BlockImageCarousel .swiper .swiper-next.swiper-button-disabled{cursor:default;background-image:none;opacity:.75}.BlockImageCarousel .swiper-nav{padding-top:56.25%}.BlockImageCarousel .swiper-dots{padding-top:56.25%;pointer-events:none}.BlockImageCarousel .swiper-dots .swiper-dot{pointer-events:auto;display:inline-block;cursor:pointer;padding:.75rem .25rem}.BlockImageCarousel .swiper-dots .swiper-dot:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.BlockImageCarousel .swiper-dots .swiper-dot>span{display:inline-block;height:.75rem;width:.75rem;border-radius:9999px;--tw-bg-opacity:1;background-color:rgb(216 216 216 / var(--tw-bg-opacity))}.BlockImageCarousel .swiper-dots .swiper-dot.swiper-dot-active>span{--tw-bg-opacity:1;background-color:rgb(227 25 55 / var(--tw-bg-opacity))}.BlockImageCarousel .swiper-slide .slide-caption{visibility:hidden}.BlockImageCarousel .swiper-slide.swiper-slide-active .slide-caption{visibility:visible}.BlockImageGallery .BaseLightboxOpenButton{display:none}@media (min-width: 1024px){.BlockImageGallery .BaseImageCaption{padding-left:2rem}}@media (min-width: 1800px){.BlockImageGallery .BaseImageCaption{padding-left:0}}.ThemeVariantDark .BlockInlineImage>div{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.BlockKeyPoints ul li:before{--tw-bg-opacity:1;background-color:rgb(227 25 55 / var(--tw-bg-opacity));display:inline-block;position:relative;margin-right:1rem;flex-shrink:0;margin-top:.75rem;content:"";width:30px;height:2px;vertical-align:middle}.BlockKeyPoints ul li .BlockText p,.BlockKeyPoints ul li .BlockTable .rich_text p,.BlockTable .BlockKeyPoints ul li .rich_text p,.BlockKeyPoints ul li .BlockTable .link p,.BlockTable .BlockKeyPoints ul li .link p,.BlockKeyPoints ul li .BlockTable .\!link p,.BlockTable .BlockKeyPoints ul li .\!link p{margin-bottom:.5rem}@media (min-width: 1024px){.BlockKeyPoints ul li .BlockText p,.BlockKeyPoints ul li .BlockTable .rich_text p,.BlockTable .BlockKeyPoints ul li .rich_text p,.BlockKeyPoints ul li .BlockTable .link p,.BlockTable .BlockKeyPoints ul li .link p,.BlockKeyPoints ul li .BlockTable .\!link p,.BlockTable .BlockKeyPoints ul li .\!link p{margin-bottom:.5rem}}.BlockKeyPoints ul li .BlockText p:last-child,.BlockKeyPoints ul li .BlockTable .rich_text p:last-child,.BlockTable .BlockKeyPoints ul li .rich_text p:last-child,.BlockKeyPoints ul li .BlockTable .link p:last-child,.BlockTable .BlockKeyPoints ul li .link p:last-child{margin-bottom:0}.BlockKeyPoints ul li .BlockTable .\!link p:last-child,.BlockTable .BlockKeyPoints ul li .\!link p:last-child{margin-bottom:0}.BlockQuote{text-align:center}.BlockQuote>div>div>.attribution-image{width:60px;min-width:60px;height:auto;margin-top:.5rem;margin-bottom:.5rem;display:block;border-radius:9999px}@media (min-width: 1024px){.BlockQuote>div>div>.attribution-image{width:80px;min-width:80px;height:auto;margin-top:1.25rem;margin-bottom:1.25rem;margin-right:.75rem}}.BlockQuote>hr{max-width:100px;margin-left:auto;margin-right:auto;border-top-width:1px;border-color:var(--color-primary-light)}@media (min-width: 1024px){.BlockQuote>hr{max-width:120px}}.BlockQuote>.quote{line-height:1.4;padding-top:1rem;padding-bottom:1rem;font-family:Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:1.25rem;font-weight:500;font-style:italic;color:var(--color-primary)}.ThemeEdu .BlockQuote>.quote{font-weight:800}.BlockQuote>.quote.ThemeEdu{font-weight:800}@media (min-width: 1024px){.BlockQuote>.quote{font-size:1.875rem;font-weight:400}}.BlockQuote>div>div>.attribution-text{margin-top:.25rem;display:flex;align-items:flex-start;justify-content:center;padding-left:1rem;padding-right:1rem;padding-bottom:1rem;text-align:left;font-family:Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:.875rem;line-height:1.5;--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity))}.BlockQuote>div>div>.attribution-text:before{content:"—";margin-right:.5rem}@media (min-width: 1024px){.BlockQuote>div>div>.attribution-text{align-items:center;text-align:center;font-size:1rem}}.ThemeVariantLight .BlockQuote>hr{border-color:var(--color-primary)}.ThemeVariantLight .BlockQuote>.quote{color:var(--color-primary)}.ThemeVariantLight .BlockQuote>div>div>.attribution-text{--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity))}.ThemeVariantDark .BlockQuote>.quote{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.ThemeVariantDark .BlockQuote>div>div>.attribution-text{--tw-text-opacity:1;color:rgb(148 148 148 / var(--tw-text-opacity))}.BlockTable table{width:100%;border-collapse:collapse;border-top-width:1px;border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(216 216 216 / var(--tw-border-opacity))}.SearchResultCard .BlockTable thead mark{border-radius:.25rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(111 111 111 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(34 34 34 / var(--tw-bg-opacity));padding:.125rem;--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.BlockTable thead{--tw-bg-opacity:1;background-color:rgb(0 69 98 / var(--tw-bg-opacity))}.BlockTable th{font-family:Archivo Narrow,Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:1rem;text-transform:uppercase;line-height:1.25;letter-spacing:1px}.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th{--tw-text-opacity:1;color:rgb(0 96 119 / var(--tw-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th>span{border-width:0px}@media (hover: hover){.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th:hover{--tw-text-opacity:1;color:rgb(16 130 158 / var(--tw-text-opacity))}}.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th svg.IconExternal{margin-left:.25rem;display:inline-block;vertical-align:baseline;font-size:.75rem}.NavInternal .NavInternalPanel .NavInternalSection>.BlockTable th{font-size:1.125rem}@media (min-width: 1024px){.NavInternal .NavInternalPanel .NavInternalSection>.BlockTable th{font-size:1rem}}.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th.active{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))}.NavInternal .NavInternalPanel .NavInternalSection a.BlockTable th.active>span{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(227 25 55 / var(--tw-border-opacity))}.BlockTable th{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(216 216 216 / var(--tw-border-opacity));padding:.75rem;text-align:left;font-weight:400;--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}@media (min-width: 1024px){.BlockTable th{padding:1.25rem}}.BlockTable tbody{--tw-text-opacity:1;color:rgb(34 34 34 / var(--tw-text-opacity))}.BlockTable tbody tr{display:table-row;border-top-width:1px;--tw-border-opacity:1;border-color:rgb(216 216 216 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.BlockTable td{padding:.75rem}@media (min-width: 1024px){.BlockTable td{padding:1.25rem}}.BlockTable td.rich_text p{margin-bottom:1rem}.BlockTable td.rich_text ol{margin-bottom:1rem;padding-left:1.5rem}.BlockTable td.rich_text ul{margin-bottom:1rem;list-style-type:disc;padding-left:1.5rem}.BlockTable td.rich_text ul li{padding:0}.BlockTable td.rich_text ul li:before{display:none}.BlockTable td.rich_text ul li,.BlockTable td.rich_text ol li{margin-top:.25rem;margin-bottom:.25rem}.BlockTable td.rich_text hr{margin-top:1rem;margin-bottom:1rem}.BlockTeaser .cover-bg{width:100%;--tw-bg-opacity:1;background-color:rgb(34 34 34 / var(--tw-bg-opacity))}@media (min-width: 1024px){.BlockTeaser .cover-bg{font-family:"object-fit: cover";position:absolute;right:0;height:100%;width:50%;object-fit:cover}.BlockTeaser .cover-bg.-full{right:auto;width:auto;min-width:100%;left:50%;top:50%;transform:translate(-50%,-50%)}}.BlockText a,.BlockTable .rich_text a,.BlockTable .link a,.BlockTable .\!link a{cursor:pointer;overflow-wrap:break-word;color:var(--color-action);text-decoration-line:underline}@media (hover: hover){.BlockText a:hover,.BlockTable .rich_text a:hover,.BlockTable .link a:hover,.BlockTable .\!link a:hover{color:var(--color-action-dark)}}.BlockText p,.BlockTable .rich_text p,.BlockTable .link p,.BlockTable .\!link p{margin-bottom:1.25rem}@media (min-width: 1024px){.BlockText p,.BlockTable .rich_text p,.BlockTable .link p,.BlockTable .\!link p{margin-bottom:2rem}}.BlockText p:last-child,.BlockTable .rich_text p:last-child,.BlockTable .link p:last-child{margin-bottom:0}.BlockTable .\!link p:last-child{margin-bottom:0}.BlockText h1,.BlockTable .rich_text h1,.BlockTable .link h1,.BlockText h2,.BlockTable .rich_text h2,.BlockTable .link h2,.BlockText h3,.BlockTable .rich_text h3,.BlockTable .link h3,.BlockText h4,.BlockTable .rich_text h4,.BlockTable .link h4,.BlockText h5,.BlockTable .rich_text h5,.BlockTable .link h5,.BlockText h6,.BlockTable .rich_text h6,.BlockTable .link h6{margin-top:2.5rem;margin-bottom:1.25rem}@media (min-width: 1024px){.BlockText h1,.BlockTable .rich_text h1,.BlockTable .link h1,.BlockText h2,.BlockTable .rich_text h2,.BlockTable .link h2,.BlockText h3,.BlockTable .rich_text h3,.BlockTable .link h3,.BlockText h4,.BlockTable .rich_text h4,.BlockTable .link h4,.BlockText h5,.BlockTable .rich_text h5,.BlockTable .link h5,.BlockText h6,.BlockTable .rich_text h6,.BlockTable .link h6{margin-top:4.5rem}}.BlockTable .\!link h1,.BlockTable .\!link h2,.BlockTable .\!link h3,.BlockTable .\!link h4,.BlockTable .\!link h5,.BlockTable .\!link h6{margin-top:2.5rem;margin-bottom:1.25rem}@media (min-width: 1024px){.BlockTable .\!link h1,.BlockTable .\!link h2,.BlockTable .\!link h3,.BlockTable .\!link h4,.BlockTable .\!link h5,.BlockTable .\!link h6{margin-top:4.5rem}}.BlockText h1:last-child,.BlockTable .rich_text h1:last-child,.BlockTable .link h1:last-child,.BlockText h2:last-child,.BlockTable .rich_text h2:last-child,.BlockTable .link h2:last-child,.BlockText h3:last-child,.BlockTable .rich_text h3:last-child,.BlockTable .link h3:last-child,.BlockText h4:last-child,.BlockTable .rich_text h4:last-child,.BlockTable .link h4:last-child,.BlockText h5:last-child,.BlockTable .rich_text h5:last-child,.BlockTable .link h5:last-child,.BlockText h6:last-child,.BlockTable .rich_text h6:last-child,.BlockTable .link h6:last-child{margin-bottom:0}.BlockTable .\!link h1:last-child,.BlockTable .\!link h2:last-child,.BlockTable .\!link h3:last-child,.BlockTable .\!link h4:last-child,.BlockTable .\!link h5:last-child,.BlockTable .\!link h6:last-child{margin-bottom:0}.BlockText hr,.BlockTable .rich_text hr,.BlockTable .link hr,.BlockTable .\!link hr{margin-top:1.25rem;margin-bottom:1.25rem;border-top-width:1px;--tw-border-opacity:1;border-color:rgb(216 216 216 / var(--tw-border-opacity))}@media (min-width: 1024px){.BlockText hr,.BlockTable .rich_text hr,.BlockTable .link hr,.BlockTable .\!link hr{margin-top:2rem;margin-bottom:2rem}}.BlockText hr+h1,.BlockTable .rich_text hr+h1,.BlockTable .link hr+h1,.BlockText hr+h2,.BlockTable .rich_text hr+h2,.BlockTable .link hr+h2,.BlockText hr+h3,.BlockTable .rich_text hr+h3,.BlockTable .link hr+h3,.BlockText hr+h4,.BlockTable .rich_text hr+h4,.BlockTable .link hr+h4,.BlockText hr+h5,.BlockTable .rich_text hr+h5,.BlockTable .link hr+h5,.BlockText hr+h6,.BlockTable .rich_text hr+h6,.BlockTable .link hr+h6{margin-top:1.25rem}@media (min-width: 1024px){.BlockText hr+h1,.BlockTable .rich_text hr+h1,.BlockTable .link hr+h1,.BlockText hr+h2,.BlockTable .rich_text hr+h2,.BlockTable .link hr+h2,.BlockText hr+h3,.BlockTable .rich_text hr+h3,.BlockTable .link hr+h3,.BlockText hr+h4,.BlockTable .rich_text hr+h4,.BlockTable .link hr+h4,.BlockText hr+h5,.BlockTable .rich_text hr+h5,.BlockTable .link hr+h5,.BlockText hr+h6,.BlockTable .rich_text hr+h6,.BlockTable .link hr+h6{margin-top:2rem}}.BlockTable .\!link hr+h1,.BlockTable .\!link hr+h2,.BlockTable .\!link hr+h3,.BlockTable .\!link hr+h4,.BlockTable .\!link hr+h5,.BlockTable .\!link hr+h6{margin-top:1.25rem}@media (min-width: 1024px){.BlockTable .\!link hr+h1,.BlockTable .\!link hr+h2,.BlockTable .\!link hr+h3,.BlockTable .\!link hr+h4,.BlockTable .\!link hr+h5,.BlockTable .\!link hr+h6{margin-top:2rem}}.BlockText hr:last-child,.BlockTable .rich_text hr:last-child,.BlockTable .link hr:last-child{margin-bottom:0}.BlockTable .\!link hr:last-child{margin-bottom:0}.BlockText ol,.BlockTable .rich_text ol,.BlockTable .link ol,.BlockText ul,.BlockTable .rich_text ul,.BlockTable .link ul,.BlockTable .\!link ol,.BlockTable .\!link ul{margin-bottom:1.25rem}@media (min-width: 1024px){.BlockText ol,.BlockTable .rich_text ol,.BlockTable .link ol,.BlockText ul,.BlockTable .rich_text ul,.BlockTable .link ul,.BlockTable .\!link ol,.BlockTable .\!link ul{margin-bottom:2rem}}.BlockText ol:last-child,.BlockTable .rich_text ol:last-child,.BlockTable .link ol:last-child,.BlockText ul:last-child,.BlockTable .rich_text ul:last-child,.BlockTable .link ul:last-child{margin-bottom:0}.BlockTable .\!link ol:last-child,.BlockTable .\!link ul:last-child{margin-bottom:0}.BlockText ol li,.BlockTable .rich_text ol li,.BlockTable .link ol li,.BlockText ul li,.BlockTable .rich_text ul li,.BlockTable .link ul li,.BlockTable .\!link ol li,.BlockTable .\!link ul li{margin-top:.75rem;margin-bottom:.75rem}.BlockText ol li:last-child,.BlockTable .rich_text ol li:last-child,.BlockTable .link ol li:last-child,.BlockText ul li:last-child,.BlockTable .rich_text ul li:last-child,.BlockTable .link ul li:last-child{margin-bottom:0}.BlockTable .\!link ol li:last-child,.BlockTable .\!link ul li:last-child{margin-bottom:0}.BlockText ol,.BlockTable .rich_text ol,.BlockTable .link ol,.BlockTable .\!link ol{list-style-type:decimal;padding-left:3rem}.BlockText ul li,.BlockTable .rich_text ul li,.BlockTable .link ul li,.BlockTable .\!link ul li{position:relative;padding-left:3rem}.BlockText ul li:before,.BlockTable .rich_text ul li:before,.BlockTable .link ul li:before{content:"";width:30px;height:2px}.BlockTable .\!link ul li:before{content:""!important;width:30px!important;height:2px!important}.BlockText ul li:before,.BlockTable .rich_text ul li:before,.BlockTable .link ul li:before{position:absolute;top:0;left:0;margin-top:.75rem;display:block;--tw-bg-opacity:1;background-color:rgb(227 25 55 / var(--tw-bg-opacity))}.BlockTable .\!link ul li:before{position:absolute;top:0;left:0;margin-top:.75rem;display:block;--tw-bg-opacity:1;background-color:rgb(227 25 55 / var(--tw-bg-opacity))}@media (min-width: 640px){.BlockText ul li:before,.BlockTable .rich_text ul li:before,.BlockTable .link ul li:before{margin-top:1rem}.BlockTable .\!link ul li:before{margin-top:1rem}}.ThemeVariantDark .BlockText ul li:before,.ThemeVariantDark .BlockTable .rich_text ul li:before,.BlockTable .ThemeVariantDark .rich_text ul li:before,.ThemeVariantDark .BlockTable .link ul li:before,.BlockTable .ThemeVariantDark .link ul li:before{--tw-bg-opacity:1;background-color:rgb(231 59 84 / var(--tw-bg-opacity))}.ThemeVariantDark .BlockTable .\!link ul li:before,.BlockTable .ThemeVariantDark .\!link ul li:before{--tw-bg-opacity:1;background-color:rgb(231 59 84 / var(--tw-bg-opacity))}.BlockVideoEmbed iframe{min-width:100%;left:0;right:0}.FooterInternal svg.IconExternal{margin-left:.5rem;font-size:.75rem}@media (min-width: 1024px){.HeroLarge .content-wrapper,.HeroFocalPoint .content-wrapper{min-height:548px}}@media (min-width: 1280px){.HeroLarge .content-wrapper,.HeroFocalPoint .content-wrapper{min-height:684px}}@media (min-width: 1440px){.HeroLarge .content-wrapper,.HeroFocalPoint .content-wrapper{min-height:770px}}@media (min-width: 1800px){.HeroLarge .content-wrapper,.HeroFocalPoint .content-wrapper{min-height:963px}}@media (min-width: 640px){.HeroMedia>div>.vh-crop{max-height:65vh;min-height:255px}}@media (min-width: 768px){.HeroMedia>div>.vh-crop{min-height:300px}}@media (min-width: 1024px){.HeroMedia>div>.vh-crop{min-height:375px}}@media (min-width: 1280px){.HeroMedia>div>.vh-crop{min-height:430px}}.HeroMedia>div>.vh-crop>.hero{height:30vh;min-height:200px;display:flex;width:100%;align-items:center;overflow:hidden}@media (min-width: 640px){.HeroMedia>div>.vh-crop>.hero{height:auto;min-height:none}}@media (min-width: 1024px){.HeroMedia>div>.vh-crop>.hero{max-height:625px}}.HeroMedia #HeroMediaCaptionToggle .IconClose{display:none}.HeroMedia #HeroMediaCaptionToggle .IconInfo{font-size:1.25rem}.HeroMedia #HeroMediaCaptionToggle.expanded .IconClose{display:block}.HeroMedia #HeroMediaCaptionToggle.expanded .IconInfo{display:none}.HeroMedium,.HeroMedium.swiper-slide,.HeroFeature,.HeroFeature.swiper-slide{min-height:400px}@media (min-width: 1024px){.HeroMedium,.HeroMedium.swiper-slide,.HeroFeature,.HeroFeature.swiper-slide{height:600px;min-height:600px}}.HeroSmall,.HeroSmall.swiper-slide{min-height:200px}@media (min-width: 1024px){.HeroSmall,.HeroSmall.swiper-slide{height:360px;min-height:360px}}.Icon360{width:2.75em;height:2.75em}.IconArrow{width:1em;height:1em}.IconArrows{width:2em;height:2em}.IconAudio{width:2.75em;height:2.75em}.IconCalendar,.IconCaret,.IconCheckbox,.IconCheckboxSelected,.IconClose,.IconCloseLightbox,.IconDownload,.IconDropdown{width:1em;height:1em}.IconExpand{width:2.75em;height:2.75em}.IconExternal,.IconFilter,.IconGrid,.IconInfo,.IconList,.IconLocation,.IconMenu,.IconMinus{width:1em;height:1em}.IconMute,.IconNext,.IconPause,.IconPlay{width:2.75em;height:2.75em}.IconPlus{width:1em;height:1em}.IconPrev{width:2.75em;height:2.75em}.IconSearch,.IconSocialEmail,.IconSocialFacebook,.IconSocialInstagram,.IconSocialTwitter,.IconSocialYoutube,.IconSocialReddit{width:1em;height:1em}.IconStop{width:2.75em;height:2.75em}.IconTime{width:1em;height:1em}.IconUser{width:1.4em;height:1.4em}.IconVolume{width:2.75em;height:2.75em}.MixinAnimationCaret,.AnimationCaret{display:flex;align-items:center}.MixinAnimationCaret>.arrow-wrapper,.AnimationCaret>.arrow-wrapper{position:relative;display:block;height:1.5rem;width:1.5rem}.MixinAnimationCaret>.arrow-wrapper>.arrow,.MixinAnimationCaret>.arrow-wrapper>.arrow-fixed,.AnimationCaret>.arrow-wrapper>.arrow,.AnimationCaret>.arrow-wrapper>.arrow-fixed{position:absolute;top:50%;left:0;display:block;--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));font-size:.875rem}@media (hover: hover){.MixinAnimationCaret:hover>.arrow-wrapper>.arrow,.AnimationCaret:hover>.arrow-wrapper>.arrow{animation:arrow-anim .25s ease-in normal}.MixinAnimationCaret:hover>.arrow-wrapper>.arrow-fixed,.AnimationCaret:hover>.arrow-wrapper>.arrow-fixed{animation:arrow-fixed-anim .25s ease-in normal}}.MixinAnimationCaret.caret-inline,.AnimationCaret.caret-inline{display:inline-block}.MixinAnimationCaret.caret-inline>.arrow-wrapper,.AnimationCaret.caret-inline>.arrow-wrapper{display:inline-block;width:1px}.MixinAnimationCaret.caret-inline>.arrow-wrapper>.arrow,.MixinAnimationCaret.caret-inline>.arrow-wrapper>.arrow-fixed,.AnimationCaret.caret-inline>.arrow-wrapper>.arrow,.AnimationCaret.caret-inline>.arrow-wrapper>.arrow-fixed{margin-top:.45em}@keyframes arrow-anim{0%{opacity:1;transform:translateY(-50%)}50%{transform:translate(1rem,-50%);opacity:0}to{transform:translate(1rem,-50%);opacity:0}}@keyframes arrow-fixed-anim{0%{opacity:0;transform:translate(-.5rem,-50%)}to{opacity:1;transform:translateY(-50%)}}.MixinCarousel .swiper,.BaseCarouselCards .swiper{overflow:visible!important}.MixinCarousel .swiper .swiper-prev,.MixinCarousel .swiper .swiper-next,.BaseCarouselCards .swiper .swiper-prev,.BaseCarouselCards .swiper .swiper-next{margin-top:-.25rem;height:auto;width:auto}.MixinCarousel .swiper .swiper-prev.swiper-button-disabled,.MixinCarousel .swiper .swiper-next.swiper-button-disabled,.BaseCarouselCards .swiper .swiper-prev.swiper-button-disabled,.BaseCarouselCards .swiper .swiper-next.swiper-button-disabled{visibility:hidden}.MixinCarousel .swiper .swiper-prev.BaseButton,.MixinCarousel .swiper .swiper-next.BaseButton,.BaseCarouselCards .swiper .swiper-prev.BaseButton,.BaseCarouselCards .swiper .swiper-next.BaseButton{transition-property:none!important}.MixinCarousel .swiper .swiper-prev.BaseButton>.label,.MixinCarousel .swiper .swiper-next.BaseButton>.label,.BaseCarouselCards .swiper .swiper-prev.BaseButton>.label,.BaseCarouselCards .swiper .swiper-next.BaseButton>.label{display:flex;overflow:hidden}.MixinCarousel .swiper .swiper-prev.BaseButton>.label>.arrow-wrapper,.MixinCarousel .swiper .swiper-next.BaseButton>.label>.arrow-wrapper,.BaseCarouselCards .swiper .swiper-prev.BaseButton>.label>.arrow-wrapper,.BaseCarouselCards .swiper .swiper-next.BaseButton>.label>.arrow-wrapper{position:relative;display:block;height:100%;width:100%;overflow:hidden}.MixinCarousel .swiper .swiper-prev.BaseButton>.label>.arrow-wrapper>.arrow,.MixinCarousel .swiper .swiper-next.BaseButton>.label>.arrow-wrapper>.arrow,.BaseCarouselCards .swiper .swiper-prev.BaseButton>.label>.arrow-wrapper>.arrow,.BaseCarouselCards .swiper .swiper-next.BaseButton>.label>.arrow-wrapper>.arrow{display:block}.MixinCarousel .swiper .swiper-prev.BaseButton>.label>.arrow-wrapper>.arrow-fixed,.MixinCarousel .swiper .swiper-next.BaseButton>.label>.arrow-wrapper>.arrow-fixed,.BaseCarouselCards .swiper .swiper-prev.BaseButton>.label>.arrow-wrapper>.arrow-fixed,.BaseCarouselCards .swiper .swiper-next.BaseButton>.label>.arrow-wrapper>.arrow-fixed{position:absolute;top:0;left:0;display:block}@media (hover: hover){.MixinCarousel .swiper .swiper-prev.BaseButton>.label:hover>.arrow-wrapper>.arrow,.MixinCarousel .swiper .swiper-prev.BaseButton>.label:hover>.arrow-wrapper>.arrow-fixed,.MixinCarousel .swiper .swiper-next.BaseButton>.label:hover>.arrow-wrapper>.arrow,.MixinCarousel .swiper .swiper-next.BaseButton>.label:hover>.arrow-wrapper>.arrow-fixed,.BaseCarouselCards .swiper .swiper-prev.BaseButton>.label:hover>.arrow-wrapper>.arrow,.BaseCarouselCards .swiper .swiper-prev.BaseButton>.label:hover>.arrow-wrapper>.arrow-fixed,.BaseCarouselCards .swiper .swiper-next.BaseButton>.label:hover>.arrow-wrapper>.arrow,.BaseCarouselCards .swiper .swiper-next.BaseButton>.label:hover>.arrow-wrapper>.arrow-fixed{animation-delay:50ms!important}}@media (min-width: 1024px){@media (hover: hover){.MixinCarousel .swiper .swiper-next.BaseButton>.label:hover>.arrow-wrapper>.arrow,.BaseCarouselCards .swiper .swiper-next.BaseButton>.label:hover>.arrow-wrapper>.arrow{animation:arrow-carousel-next-anim .1s linear normal}.MixinCarousel .swiper .swiper-next.BaseButton>.label:hover>.arrow-wrapper>.arrow-fixed,.BaseCarouselCards .swiper .swiper-next.BaseButton>.label:hover>.arrow-wrapper>.arrow-fixed{animation:arrow-carousel-next-fixed-anim .1s linear normal}.MixinCarousel .swiper .swiper-prev.BaseButton>.label:hover>.arrow-wrapper>.arrow,.BaseCarouselCards .swiper .swiper-prev.BaseButton>.label:hover>.arrow-wrapper>.arrow{animation:arrow-carousel-prev-anim .1s linear normal}.MixinCarousel .swiper .swiper-prev.BaseButton>.label:hover>.arrow-wrapper>.arrow-fixed,.BaseCarouselCards .swiper .swiper-prev.BaseButton>.label:hover>.arrow-wrapper>.arrow-fixed{animation:arrow-carousel-prev-fixed-anim .1s linear normal}}}.MixinCarousel .swiper-wrapper,.BaseCarouselCards .swiper-wrapper{overflow:visible!important}.MixinCarousel .swiper-wrapper .swiper-slide,.BaseCarouselCards .swiper-wrapper .swiper-slide{height:auto;opacity:.5;transition-property:opacity;transition-duration:.5s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.MixinCarousel .swiper-wrapper .swiper-slide.swiper-slide-visible,.MixinCarousel .swiper-wrapper .swiper-slide:focus,.MixinCarousel .swiper-wrapper .swiper-slide:focus-within,.BaseCarouselCards .swiper-wrapper .swiper-slide.swiper-slide-visible,.BaseCarouselCards .swiper-wrapper .swiper-slide:focus,.BaseCarouselCards .swiper-wrapper .swiper-slide:focus-within{opacity:1}.MixinCarousel.-cards .swiper .swiper-navigation,.BaseCarouselCards.-cards .swiper .swiper-navigation{padding-top:28.125%}.MixinCarousel.-cards .swiper .swiper-navigation .swiper-prev,.MixinCarousel.-cards .swiper .swiper-navigation .swiper-next,.BaseCarouselCards.-cards .swiper .swiper-navigation .swiper-prev,.BaseCarouselCards.-cards .swiper .swiper-navigation .swiper-next{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.MixinCarousel.-tiles,.BaseCarouselCards.-tiles{padding-bottom:1.25rem}.MixinCarousel.-tiles .swiper .swiper-navigation,.BaseCarouselCards.-tiles .swiper .swiper-navigation{top:50%}.MixinCarousel.-tiles .swiper .swiper-navigation .swiper-prev,.MixinCarousel.-tiles .swiper .swiper-navigation .swiper-next,.BaseCarouselCards.-tiles .swiper .swiper-navigation .swiper-prev,.BaseCarouselCards.-tiles .swiper .swiper-navigation .swiper-next{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.MixinCarousel .swiper-lazy,.BaseCarouselCards .swiper-lazy{opacity:0}.MixinCarousel .swiper-lazy.swiper-lazy-loaded,.BaseCarouselCards .swiper-lazy.swiper-lazy-loaded{opacity:1}.NavInternal{position:relative;left:0;right:0;z-index:20;height:100%;overflow-y:auto}@media (min-width: 1024px){.NavInternal{position:unset;overflow-y:unset;left:unset;right:unset;height:unset;z-index:unset}}.NavInternal .panel-wrapper{visibility:hidden;max-height:0;opacity:0;transition:visibility 0s linear .3s,opacity .3s,max-height 0s linear 300s;height:0px;overflow:hidden}@media (min-width: 1024px){.NavInternal .panel-wrapper{height:unset}}.NavInternal .panel-wrapper.spacer:before{content:"";position:relative;z-index:0;display:block;height:100%;width:100%;--tw-shadow:0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(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)}.NavInternal li.expanded .panel-wrapper{visibility:visible;max-height:100%;opacity:1;transition:visibility 0s,opacity .3s,max-height 0s;height:auto;overflow:visible}@media (min-width: 1024px){.NavInternal li.expanded .panel-wrapper{height:unset}}.NavInternal .top-level{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.4) transparent}.NavInternal .top-level::-webkit-scrollbar{width:1px}.NavInternal .top-level::-webkit-scrollbar-track{background:transparent}.NavInternal .top-level::-webkit-scrollbar-thumb{background-color:#0006;border-radius:6px;border:6px solid white;border-left:none;border-right:none}@media (min-width: 1024px){.NavInternal .top-level>li{border-top-width:3px;border-color:transparent}}.NavInternal .top-level>li>button,.NavInternal .top-level>li>a{cursor:pointer;border-left-width:3px;border-color:transparent;padding:.75rem 1rem;text-align:left;font-size:1.25rem;font-weight:500;line-height:1.25;--tw-text-opacity:1;color:rgb(34 34 34 / var(--tw-text-opacity))}@media (min-width: 1024px){.NavInternal .top-level>li>button,.NavInternal .top-level>li>a{position:relative;z-index:10;margin-left:1rem;margin-right:1rem;height:100%;white-space:nowrap;border-left-width:0px;border-bottom-width:3px;padding:1.5rem .25rem;font-size:1rem}}.NavInternal .top-level>li>button:focus,.NavInternal .top-level>li>a:focus{border-color:#2223;outline:2px solid transparent;outline-offset:2px}@media (hover: hover){.NavInternal .top-level>li>button:hover,.NavInternal .top-level>li>a:hover{--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity))}}.NavInternal .top-level>li>button>span,.NavInternal .top-level>li>a>span{display:inline-flex;flex-direction:column}.NavInternal .top-level>li>button>span:after,.NavInternal .top-level>li>a>span:after{content:attr(data-text);content:attr(data-text)/"";-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none;visibility:hidden;height:0px;overflow:hidden;font-weight:700}@media speech{.NavInternal .top-level>li>button>span:after,.NavInternal .top-level>li>a>span:after{display:none}}.NavInternal .top-level>li>button .IconDropdown{font-size:.6rem;pointer-events:none;margin-left:.5rem;flex-shrink:0}@media (min-width: 1024px){.NavInternal .top-level>li:first-child>button,.NavInternal .top-level>li:first-child>a{margin-left:0;padding-left:0}.NavInternal .top-level>li:last-child>button,.NavInternal .top-level>li:last-child>a{margin-right:0;padding-right:0}}.NavInternal .top-level>li.active>button,.NavInternal .top-level>li.active>a,.NavInternal .top-level>li.ancestor>button,.NavInternal .top-level>li.ancestor>a{--tw-border-opacity:1;border-color:rgb(227 25 55 / var(--tw-border-opacity));font-weight:700}.NavInternal .top-level>li.expanded>button{--tw-border-opacity:1;border-color:rgb(0 0 0 / var(--tw-border-opacity));font-weight:700}.NavInternal .NavInternalPanel{--tw-bg-opacity:1;background-color:rgb(250 250 250 / var(--tw-bg-opacity))}@media (min-width: 1024px){.NavInternal .NavInternalPanel{max-height:60vh;overflow-y:auto}}.NavInternal .NavInternalPanel .NavInternalSection{page-break-inside:avoid;-moz-column-break-inside:avoid;break-inside:avoid}@supports (-moz-appearance: none){.NavInternal .NavInternalPanel .NavInternalSection{display:inline-grid}}@media not all and (min-resolution: .001dpcm){@supports (-webkit-appearance: none) and (stroke-color: transparent){.NavInternal .NavInternalPanel .NavInternalSection{display:inline-grid}}}.NavInternal .NavInternalPanel.allow-breaks .NavInternalSection{page-break-inside:auto;-moz-column-break-inside:auto;break-inside:auto;display:block}.NavInternal .NavInternalPanel p.NavInternalSection:last-of-type{margin-bottom:1.5rem}.NavInternal .NavInternalPanel .NavInternalSection.has-children{margin-bottom:1.5rem}.NavInternal .NavInternalPanel .NavInternalSection:last-child{margin-bottom:0}@media (min-width: 1024px){.NavInternal .NavInternalPanel .NavInternalSection:last-child{margin-bottom:1.5rem}}.NavInternal .NavInternalPanel .repeated-item a{font-size:1.125rem;font-weight:500;line-height:1.25;--tw-text-opacity:1;color:rgb(0 96 119 / var(--tw-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.NavInternal .NavInternalPanel .repeated-item a span{border-bottom-width:1px;border-color:transparent}@media (hover: hover){.NavInternal .NavInternalPanel .repeated-item a:hover{--tw-text-opacity:1;color:rgb(16 130 158 / var(--tw-text-opacity))}}.NavInternal .NavInternalPanel .repeated-item a.active{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))}.NavInternal .NavInternalPanel .repeated-item a.active>span{--tw-border-opacity:1;border-color:rgb(227 25 55 / var(--tw-border-opacity))}.NavInternal .NavInternalPanel .NavInternalSection a{font-size:1.125rem;font-weight:500;line-height:1.25;--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;page-break-inside:avoid;-moz-column-break-inside:avoid;break-inside:avoid;display:block}@media (min-width: 1024px){.NavInternal .NavInternalPanel .NavInternalSection a{font-size:1rem;font-weight:400}}.NavInternal .NavInternalPanel .NavInternalSection a>span{border-bottom-width:1px;border-color:transparent}.NavInternal .NavInternalPanel .NavInternalSection a svg{display:inline-block}.NavInternal .NavInternalPanel .NavInternalSection a svg.IconExternal{font-size:.875em}.NavInternal .NavInternalPanel .NavInternalSection a svg.IconDownload{position:relative;top:-.125rem}@media (hover: hover){.NavInternal .NavInternalPanel .NavInternalSection a:hover{--tw-text-opacity:1;color:rgb(34 34 34 / var(--tw-text-opacity))}.NavInternal .NavInternalPanel .NavInternalSection a:hover>span{--tw-border-opacity:1;border-color:rgb(34 34 34 / var(--tw-border-opacity))}}.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle{--tw-text-opacity:1;color:rgb(0 96 119 / var(--tw-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle>span{border-width:0px}@media (hover: hover){.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle:hover{--tw-text-opacity:1;color:rgb(16 130 158 / var(--tw-text-opacity))}}.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle svg.IconExternal{margin-left:.25rem;display:inline-block;vertical-align:baseline;font-size:.75rem}.NavInternal .NavInternalPanel .NavInternalSection a svg.IconArrow{display:none}.NavInternal .NavInternalPanel .NavInternalSection a svg.IconDownload{margin-left:.25rem;font-size:.875rem}.NavInternal .NavInternalPanel .NavInternalSection a svg.IconExternal{margin-left:.25rem;font-size:.75rem}.NavInternal .NavInternalPanel .NavInternalSection>.text-subtitle{font-size:1.125rem}@media (min-width: 1024px){.NavInternal .NavInternalPanel .NavInternalSection>.text-subtitle{font-size:1rem}}.NavInternal .NavInternalPanel .NavInternalSection a.active,.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle.active{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))}.NavInternal .NavInternalPanel .NavInternalSection a.active>span,.NavInternal .NavInternalPanel .NavInternalSection a.text-subtitle.active>span{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(227 25 55 / var(--tw-border-opacity))}#NavMobileToggle .IconClose,#NavMobileToggle.expanded .IconMenu{display:none}#NavMobileToggle.expanded .IconClose{display:block}#NavBgOverlay{visibility:visible;opacity:.8;transition:visibility 0s linear 0s,opacity .3s}#NavBgOverlay.invisible-overlay{visibility:hidden;opacity:0;transition:visibility 0s linear .3s,opacity .3s}.SearchResultCard .bg-dark-blue mark{border-radius:.25rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(111 111 111 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(34 34 34 / var(--tw-bg-opacity));padding:.125rem;--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}@tailwind utilities;@font-face{font-family:Metropolis;font-weight:800;font-style:normal;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-ExtraBold.woff2) format("woff2")}@font-face{font-family:Metropolis;font-weight:700;font-style:normal;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-Bold.woff2) format("woff2")}@font-face{font-family:Metropolis;font-weight:700;font-style:italic;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-BoldItalic.woff2) format("woff2")}@font-face{font-family:Metropolis;font-weight:600;font-style:normal;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-SemiBold.woff2) format("woff2")}@font-face{font-family:Metropolis;font-weight:600;font-style:italic;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-SemiBoldItalic.woff2) format("woff2")}@font-face{font-family:Metropolis;font-weight:500;font-style:normal;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-Medium.woff2) format("woff2")}@font-face{font-family:Metropolis;font-weight:500;font-style:italic;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-MediumItalic.woff2) format("woff2")}@font-face{font-family:Metropolis;font-weight:400;font-style:normal;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-Regular.woff2) format("woff2")}@font-face{font-family:Metropolis;font-weight:400;font-style:italic;font-display:swap;src:url(/assets/fonts/metropolis/Metropolis-RegularItalic.woff2) format("woff2")}@font-face{font-family:Archivo Narrow;font-weight:700;font-style:normal;font-display:swap;src:url(/assets/fonts/archivo-narrow/ArchivoNarrow-Bold.woff2) format("woff2")}@font-face{font-family:Archivo Narrow;font-weight:700;font-style:italic;font-display:swap;src:url(/assets/fonts/archivo-narrow/ArchivoNarrow-BoldItalic.woff2) format("woff2")}@font-face{font-family:Archivo Narrow;font-weight:600;font-style:normal;font-display:swap;src:url(/assets/fonts/archivo-narrow/ArchivoNarrow-SemiBold.woff2) format("woff2")}@font-face{font-family:Archivo Narrow;font-weight:600;font-style:italic;font-display:swap;src:url(/assets/fonts/archivo-narrow/ArchivoNarrow-SemiBoldItalic.woff2) format("woff2")}/*! tailwindcss v3.4.4 | MIT License | https://tailwindcss.com + */*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}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}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}[type=text],input:where(:not([type])),[type=email],[type=url],[type=password],[type=number],[type=date],[type=datetime-local],[type=month],[type=search],[type=tel],[type=time],[type=week],[multiple],textarea,select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow:0 0 #0000}[type=text]:focus,input:where(:not([type])):focus,[type=email]:focus,[type=url]:focus,[type=password]:focus,[type=number]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=month]:focus,[type=search]:focus,[type=tel]:focus,[type=time]:focus,[type=week]:focus,[multiple]:focus,textarea:focus,select:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#2563eb}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{padding-top:0;padding-bottom:0}select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])){background-image:initial;background-position:initial;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#2563eb;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow:0 0 #0000}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}[type=checkbox]:checked,[type=radio]:checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:center;background-repeat:no-repeat}[type=checkbox]:checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")}@media (forced-colors: active){[type=checkbox]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=radio]:checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e")}@media (forced-colors: active){[type=radio]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=checkbox]:checked:hover,[type=checkbox]:checked:focus,[type=radio]:checked:hover,[type=radio]:checked:focus{border-color:transparent;background-color:currentColor}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:center;background-repeat:no-repeat}@media (forced-colors: active){[type=checkbox]:indeterminate{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=checkbox]:indeterminate:hover,[type=checkbox]:indeterminate:focus{border-color:transparent;background-color:currentColor}[type=file]{background:unset;border-color:inherit;border-width:0;border-radius:0;padding:0;font-size:unset;line-height:inherit}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}:root,.ThemeVariantLight{--color-primary:#E31937;--color-primary-light:#E73B54;--color-primary-dark:#C1152E;--color-primary-darker:#5C0411;--color-secondary:var(--color-primary);--color-secondary-light:var(--color-primary-light);--color-secondary-dark:var(--color-primary-dark);--color-secondary-darker:var(--color-primary-darker);--color-action:var(--color-primary);--color-action-light:var(--color-primary-light);--color-action-dark:var(--color-primary-dark);--color-action-darker:var(--color-primary-darker)}.ThemeVariantDark{--color-primary:#E73B54;--color-primary-light:#E73B54;--color-primary-dark:#E31937;--color-primary-darker:#C1152E}.ThemeEdu,.ThemeEdu.ThemeVariantLight,.ThemeEdu .ThemeVariantLight{--color-primary:#6019E3;--color-primary-light:#905FEC;--color-primary-dark:#3C00AB;--color-primary-darker:#280073;--color-secondary:#E31937;--color-secondary-light:#E73B54;--color-secondary-dark:#C1152E;--color-secondary-darker:#5C0411;--color-action:#10829E;--color-action-light:#4BA7BE;--color-action-dark:#006077;--color-action-darker:#004050}.ThemeEdu .ThemeVariantDark,.ThemeEdu.ThemeVariantDark{--color-primary:#905FEC;--color-primary-light:#905FEC;--color-primary-dark:#6019E3;--color-primary-darker:#3C00AB;--color-secondary:#E73B54;--color-secondary-light:#E73B54;--color-secondary-dark:#E31937;--color-secondary-darker:#C1152E;--color-action:#4BA7BE;--color-action-light:#4BA7BE;--color-action-dark:#10829E;--color-action-darker:#006077}.ThemeInternal,.ThemeInternal.ThemeVariantLight,.ThemeInternal .ThemeVariantLight{--color-primary:#10829E;--color-primary-light:#4BA7BE;--color-primary-dark:#006077;--color-primary-darker:#004050;--color-secondary:var(--color-primary);--color-secondary-light:var(--color-primary-light);--color-secondary-dark:var(--color-primary-dark);--color-secondary-darker:var(--color-primary-darker);--color-action:var(--color-primary);--color-action-light:var(--color-primary-light);--color-action-dark:var(--color-primary-dark);--color-action-darker:var(--color-primary-darker)}.ThemeInternal .ThemeVariantDark,.ThemeInternal.ThemeVariantDark{--color-primary:#4BA7BE;--color-primary-light:#4BA7BE;--color-primary-dark:#10829E;--color-primary-darker:#006077}:root{--backgroundImage-star-pattern:url(/explorer-1/bg-stars.jpg)}.ThemeInternal{--backgroundImage-star-pattern:url(/explorer-1/bg-stars.jpg)}[type=text],[type=email],[type=url],[type=password],[type=number],[type=date],[type=datetime-local],[type=month],[type=search],[type=tel],[type=time],[type=week],[multiple],textarea,select,.form-input,.form-textarea,.form-select,.form-multiselect{--tw-border-opacity:1;border-color:rgb(216 216 216 / var(--tw-border-opacity))}[type=text]:focus,[type=email]:focus,[type=url]:focus,[type=password]:focus,[type=number]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=month]:focus,[type=search]:focus,[type=tel]:focus,[type=time]:focus,[type=week]:focus,[multiple]:focus,textarea:focus,select:focus,.form-input:focus,.form-textarea:focus,.form-select:focus,.form-multiselect:focus{--tw-ring-color: #1871c9;--tw-border-opacity:1;border-color:rgb(24 113 201 / var(--tw-border-opacity))}input::-moz-placeholder,textarea::-moz-placeholder,.form-input::-moz-placeholder,.form-textarea::-moz-placeholder{--tw-text-opacity:1;color:rgb(148 148 148 / var(--tw-text-opacity))}input::placeholder,textarea::placeholder,.form-input::placeholder,.form-textarea::placeholder{--tw-text-opacity:1;color:rgb(148 148 148 / var(--tw-text-opacity))}select,.form-select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23949494' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")}[type=checkbox],[type=radio],.form-checkbox,.form-radio{--tw-border-opacity:1;border-color:rgb(148 148 148 / var(--tw-border-opacity));--tw-text-opacity:1;color:rgb(24 113 201 / var(--tw-text-opacity))}[type=checkbox]:focus,[type=radio]:focus,.form-checkbox:focus,.form-radio:focus{--tw-ring-color: #1871c9}.BaseGrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.5rem}@media (min-width: 640px){.MixedBleedGrid{grid-template-columns:[bleed-start] auto [container-start] 53.33px [indent-col-2] 53.33px [indent-col-3] 533.33px [container-end] auto [bleed-end];display:grid;gap:0px}}@media (min-width: 768px){.MixedBleedGrid{grid-template-columns:[bleed-start] auto [container-start] 64px [indent-col-2] 64px [indent-col-3] 640px [container-end] auto [bleed-end];display:grid}}@media (min-width: 1024px){.MixedBleedGrid{grid-template-columns:[bleed-start] auto [container-start] 85.33px [indent-col-2] 85.33px [indent-col-3] 853.33px [container-end] auto [bleed-end];display:grid}}@media (min-width: 1280px){.MixedBleedGrid{grid-template-columns:[bleed-start] auto [container-start] 108px [indent-col-2] 108px [indent-col-3] 1088px [container-end] auto [bleed-end];display:grid}}@media (min-width: 1440px){.MixedBleedGrid{grid-template-columns:[bleed-start] auto [container-start] 110px [indent-col-2] 110px [indent-col-3] 1100px [container-end] auto [bleed-end];display:grid}}.MixedBleedGrid .col-start-bleed{grid-column-start:bleed-start}.MixedBleedGrid .col-end-container-start{grid-column-end:container-start}.MixedBleedGrid .col-start-container{grid-column-start:container-start}.MixedBleedGrid .col-start-indent-col-2{grid-column-start:indent-col-2}.MixedBleedGrid .col-start-indent-col-3{grid-column-start:indent-col-3}.MixedBleedGrid .col-end-container{grid-column-end:container-end}.MixedBleedGrid .col-start-container-end{grid-column-start:container-end}.MixedBleedGrid .col-end-bleed{grid-column-end:bleed-end}.nav-offset{padding-top:4.5rem}@media (min-width: 1024px){.nav-offset{padding-top:0}.-nav-offset{margin-top:-7.25rem}}html{font-family:Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;text-rendering:optimizelegibility}.text-h1-alt{font-weight:700;letter-spacing:-1px}.ThemeEdu .text-h1-alt,.text-h1-alt.ThemeEdu{font-weight:800}.text-h1-alt{font-size:2.8125rem;line-height:1}@media (min-width: 640px){.text-h1-alt{font-size:3.40625rem}}@media (min-width: 768px){.text-h1-alt{letter-spacing:-2px;font-size:4.09375rem}}@media (min-width: 1024px){.text-h1-alt{font-size:4.5rem}}@media (min-width: 1280px){.text-h1-alt{font-size:6.25rem}}h1,.text-h1{font-weight:500;letter-spacing:-1px}.ThemeEdu h1,.ThemeEdu .text-h1,h1.ThemeEdu,.text-h1.ThemeEdu{font-weight:800}h1,.text-h1{font-size:2.625rem;line-height:1.15}@media (min-width: 640px){h1,.text-h1{font-size:2.875rem}}@media (min-width: 768px){h1,.text-h1{font-size:3.125rem;letter-spacing:-1.5px}}@media (min-width: 1024px){h1,.text-h1{font-size:3.375rem}}@media (min-width: 1280px){h1,.text-h1{font-size:3.625rem}}h2,.text-h2{font-weight:500;letter-spacing:-.5px}.ThemeEdu h2,.ThemeEdu .text-h2,h2.ThemeEdu,.text-h2.ThemeEdu{font-weight:800}h2,.text-h2{font-size:2.25rem;line-height:1.25}@media (min-width: 640px){h2,.text-h2{font-size:2.375rem}}@media (min-width: 768px){h2,.text-h2{letter-spacing:-1px;font-size:2.5rem}}@media (min-width: 1024px){h2,.text-h2{font-size:2.625rem}}@media (min-width: 1280px){h2,.text-h2{font-size:2.75rem}}h3,.text-h3{font-weight:500;letter-spacing:-.5px}.ThemeEdu h3,.ThemeEdu .text-h3,h3.ThemeEdu,.text-h3.ThemeEdu{font-weight:800}h3,.text-h3{font-size:1.6875rem;line-height:1.25}@media (min-width: 640px){h3,.text-h3{font-size:1.765625rem}}@media (min-width: 768px){h3,.text-h3{letter-spacing:-1px;font-size:1.875rem}}@media (min-width: 1024px){h3,.text-h3{font-size:1.953125rem}}@media (min-width: 1280px){h3,.text-h3{font-size:2.0625rem}}h4,.text-h4{font-weight:500;letter-spacing:0}.ThemeEdu h4,.ThemeEdu .text-h4,h4.ThemeEdu,.text-h4.ThemeEdu{font-weight:800}h4,.text-h4{font-size:1.375rem;line-height:1.25}@media (min-width: 640px){h4,.text-h4{font-size:1.453125rem}}@media (min-width: 768px){h4,.text-h4{letter-spacing:-.5px;font-size:1.546875rem}}@media (min-width: 1024px){h4,.text-h4{font-size:1.609375rem}}@media (min-width: 1280px){h4,.text-h4{font-size:1.6875rem}}h5,.text-h5{font-weight:500;letter-spacing:0}.ThemeEdu h5,.ThemeEdu .text-h5,h5.ThemeEdu,.text-h5.ThemeEdu{font-weight:800}h5,.text-h5{font-size:1.25rem;line-height:1.25}@media (min-width: 640px){h5,.text-h5{font-size:1.3125rem}}@media (min-width: 768px){h5,.text-h5{font-size:1.390625rem}}@media (min-width: 1024px){h5,.text-h5{font-size:1.453125rem}}@media (min-width: 1280px){h5,.text-h5{font-size:1.515625rem}}h6,.text-h6{font-weight:700;letter-spacing:0}.ThemeEdu h6,.ThemeEdu .text-h6,h6.ThemeEdu,.text-h6.ThemeEdu{font-weight:700}h6,.text-h6{font-size:1.125rem;line-height:1.6667}@media (min-width: 640px){h6,.text-h6{font-size:1.1875rem}}@media (min-width: 768px){h6,.text-h6{font-size:1.25rem}}@media (min-width: 1024px){h6,.text-h6{font-size:1.3125rem}}@media (min-width: 1280px){h6,.text-h6{font-size:1.375rem}}h1 b,h1 strong,.text-h1 b,.text-h1 strong,h2 b,h2 strong,.text-h2 b,.text-h2 strong,h3 b,h3 strong,.text-h3 b,.text-h3 strong,h4 b,h4 strong,.text-h4 b,.text-h4 strong,h5 b,h5 strong,.text-h5 b,.text-h5 strong{font-weight:inherit}.text-subtitle{font-family:Archivo Narrow,Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:1rem;text-transform:uppercase;line-height:1.25;letter-spacing:1px}.text-subtitle-sm{font-family:Archivo Narrow,Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:.875rem;text-transform:uppercase;line-height:1.25;letter-spacing:1px}.text-body-lg{font-size:1.125rem;line-height:1.6667}@media (min-width: 640px){.text-body-lg{font-size:1.1875rem}}@media (min-width: 768px){.text-body-lg{font-size:1.25rem}}@media (min-width: 1024px){.text-body-lg{font-size:1.3125rem}}@media (min-width: 1280px){.text-body-lg{font-size:1.375rem}}.text-body-md{font-size:1rem;line-height:1.6667}@media (min-width: 1024px){.text-body-md{font-size:1.125rem}}.text-body-sm{font-size:.875rem;line-height:1.6667}@media (min-width: 1024px){.text-body-sm{font-size:1rem}}.text-body-xs{font-size:.875rem;line-height:1.6667}.text-stats-xl{font-weight:800;line-height:1;font-size:2.125rem}@media (min-width: 1024px){.text-stats-xl{font-size:2.4rem}}@media (min-width: 1280px){.text-stats-xl{font-size:2.75rem}}.text-stats-lg{font-weight:800;line-height:1;font-size:2.125rem}@media (min-width: 1024px){.text-stats-lg{font-size:2.125rem}}@media (min-width: 1280px){.text-stats-lg{font-size:2.25rem}}mark{border-radius:.25rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(255 186 50 / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgb(255 249 235 / var(--tw-bg-opacity));padding:.125rem}.object-contain{font-family:"object-fit: contain"}.object-cover{font-family:"object-fit: cover"}.object-fill{font-family:"object-fit: fill"}.object-scale-down{font-family:"object-fit: scale-down"}.LogoJPL{width:4.5rem;height:auto}.indent-col-base{grid-column-start:1;grid-column-end:13}@media (min-width: 1024px){.indent-col-2{grid-column-start:2;grid-column-end:12}.indent-col-3{grid-column-start:3;grid-column-end:11}}@media (min-width: 768px){.indent-col-4{grid-column-start:3;grid-column-end:11}}@media (min-width: 1024px){.indent-col-4{grid-column-start:4;grid-column-end:10}}*,: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 / .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 / .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: }.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}.pointer-events-auto{pointer-events:auto}.visible{visibility:visible}.invisible{visibility:hidden}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{top:0;right:0;bottom:0;left:0}.inset-x-0{left:0;right:0}.inset-y-0{top:0;bottom:0}.-bottom-4{bottom:-1rem}.-left-2px{left:-2px}.-right-px{right:-1px}.-top-0{top:-0px}.-top-0\.5{top:-.125rem}.-top-1{top:-.25rem}.-top-px{top:-1px}.bottom-0{bottom:0}.bottom-10{bottom:2.5rem}.left-0{left:0}.left-1\/2{left:50%}.left-auto{left:auto}.right-0{right:0}.right-10{right:2.5rem}.right-5{right:1.25rem}.right-px{right:1px}.top-0{top:0}.top-1\/2{top:50%}.top-5{top:1.25rem}.top-auto{top:auto}.top-px{top:1px}.isolate{isolation:isolate}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-60{z-index:60}.order-1{order:1}.order-2{order:2}.order-3{order:3}.col-span-1{grid-column:span 1 / span 1}.col-span-10{grid-column:span 10 / span 10}.col-span-11{grid-column:span 11 / span 11}.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-7{grid-column:span 7 / span 7}.col-span-8{grid-column:span 8 / span 8}.col-span-9{grid-column:span 9 / span 9}.col-span-full{grid-column:1 / -1}.col-start-1{grid-column-start:1}.col-start-10{grid-column-start:10}.col-start-2{grid-column-start:2}.col-start-3{grid-column-start:3}.col-start-4{grid-column-start:4}.col-start-6{grid-column-start:6}.col-start-7{grid-column-start:7}.col-start-8{grid-column-start:8}.col-start-9{grid-column-start:9}.col-end-10{grid-column-end:10}.col-end-11{grid-column-end:11}.col-end-12{grid-column-end:12}.col-end-13{grid-column-end:13}.col-end-6{grid-column-end:6}.col-end-7{grid-column-end:7}.col-end-8{grid-column-end:8}.col-end-9{grid-column-end:9}.row-span-1{grid-row:span 1 / span 1}.row-span-2{grid-row:span 2 / span 2}.row-start-2{grid-row-start:2}.m-0{margin:0}.m-3{margin:.75rem}.m-auto{margin:auto}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.-mx-4{margin-left:-1rem;margin-right:-1rem}.-my-2{margin-top:-.5rem;margin-bottom:-.5rem}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.mx-auto{margin-left:auto;margin-right:auto}.my-10{margin-top:2.5rem;margin-bottom:2.5rem}.my-12{margin-top:3rem;margin-bottom:3rem}.my-16{margin-top:4rem;margin-bottom:4rem}.my-18{margin-top:4.5rem;margin-bottom:4.5rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.my-3{margin-top:.75rem;margin-bottom:.75rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-5{margin-top:1.25rem;margin-bottom:1.25rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.my-8{margin-top:2rem;margin-bottom:2rem}.my-auto{margin-top:auto;margin-bottom:auto}.-mb-1{margin-bottom:-.25rem}.-mb-2{margin-bottom:-.5rem}.-mb-3{margin-bottom:-.75rem}.-mb-5{margin-bottom:-1.25rem}.-ml-1{margin-left:-.25rem}.-ml-16{margin-left:-4rem}.-ml-2{margin-left:-.5rem}.-ml-20{margin-left:-5rem}.-ml-3{margin-left:-.75rem}.-ml-4{margin-left:-1rem}.-ml-5{margin-left:-1.25rem}.-ml-8{margin-left:-2rem}.-ml-px{margin-left:-1px}.-mr-16{margin-right:-4rem}.-mr-2{margin-right:-.5rem}.-mr-20{margin-right:-5rem}.-mr-26{margin-right:-6.5rem}.-mr-3{margin-right:-.75rem}.-mr-4{margin-right:-1rem}.-mt-1{margin-top:-.25rem}.-mt-1\.5{margin-top:-.375rem}.-mt-10{margin-top:-2.5rem}.-mt-12{margin-top:-3rem}.-mt-14{margin-top:-3.5rem}.-mt-18{margin-top:-4.5rem}.-mt-2{margin-top:-.5rem}.-mt-20{margin-top:-5rem}.-mt-24{margin-top:-6rem}.-mt-3{margin-top:-.75rem}.-mt-5{margin-top:-1.25rem}.-mt-6{margin-top:-1.5rem}.-mt-px{margin-top:-1px}.mb-0{margin-bottom:0}.mb-0\.5{margin-bottom:.125rem}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-14{margin-bottom:3.5rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-2\.5{margin-bottom:.625rem}.mb-20{margin-bottom:5rem}.mb-22{margin-bottom:5.5rem}.mb-3{margin-bottom:.75rem}.mb-30{margin-bottom:7.5rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-px{margin-bottom:1px}.ml-0{margin-left:0}.ml-1{margin-left:.25rem}.ml-14{margin-left:3.5rem}.ml-2{margin-left:.5rem}.ml-2\.5{margin-left:.625rem}.ml-3{margin-left:.75rem}.ml-4{margin-left:1rem}.ml-5{margin-left:1.25rem}.ml-6{margin-left:1.5rem}.ml-7{margin-left:1.75rem}.ml-auto{margin-left:auto}.mr-0{margin-right:0}.mr-1{margin-right:.25rem}.mr-10{margin-right:2.5rem}.mr-16{margin-right:4rem}.mr-2{margin-right:.5rem}.mr-3{margin-right:.75rem}.mr-4{margin-right:1rem}.mr-5{margin-right:1.25rem}.mr-6{margin-right:1.5rem}.mr-8{margin-right:2rem}.mr-auto{margin-right:auto}.mt-0{margin-top:0}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-16{margin-top:4rem}.mt-18{margin-top:4.5rem}.mt-2{margin-top:.5rem}.mt-20{margin-top:5rem}.mt-24{margin-top:6rem}.mt-26{margin-top:6.5rem}.mt-28{margin-top:7rem}.mt-3{margin-top:.75rem}.mt-36{margin-top:9rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-px{margin-top:1px}.block{display:block}.inline-block{display:inline-block}.\!inline{display:inline!important}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.\!grid{display:grid!important}.grid{display:grid}.inline-grid{display:inline-grid}.contents{display:contents}.hidden{display:none}.h-0{height:0px}.h-1{height:.25rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-16{height:4rem}.h-18{height:4.5rem}.h-2{height:.5rem}.h-20{height:5rem}.h-22{height:5.5rem}.h-24{height:6rem}.h-25{height:6.25rem}.h-28{height:7rem}.h-2px{height:2px}.h-3{height:.75rem}.h-30{height:7.5rem}.h-38{height:9.5rem}.h-4{height:1rem}.h-40{height:10rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-80{height:20rem}.h-auto{height:auto}.h-full{height:100%}.h-screen{height:100vh}.max-h-48{max-height:12rem}.max-h-full{max-height:100%}.max-h-screen{max-height:100vh}.max-h-xl{max-height:36rem}.min-h-1\/2{min-height:50%}.min-h-100{min-height:25rem}.min-h-28{min-height:7rem}.min-h-32{min-height:8rem}.min-h-66{min-height:16rem}.min-h-full{min-height:100%}.w-0{width:0px}.w-1{width:.25rem}.w-1\/2{width:50%}.w-1\/3{width:33.333333%}.w-1\/4{width:25%}.w-1\/5{width:20%}.w-1\/6{width:16.666667%}.w-12{width:3rem}.w-14{width:3.5rem}.w-16{width:4rem}.w-18{width:4.5rem}.w-2{width:.5rem}.w-2\/3{width:66.666667%}.w-2\/5{width:40%}.w-20{width:5rem}.w-22{width:5.5rem}.w-25{width:6.25rem}.w-26{width:6.5rem}.w-3{width:.75rem}.w-3\/5{width:60%}.w-30{width:7.5rem}.w-38{width:9.5rem}.w-4\/5{width:80%}.w-40{width:10rem}.w-5{width:1.25rem}.w-5\/6{width:83.333333%}.w-56{width:14rem}.w-6{width:1.5rem}.w-64{width:16rem}.w-7{width:1.75rem}.w-72{width:17.5rem}.w-8{width:2rem}.w-96{width:24rem}.w-auto{width:auto}.w-full{width:100%}.w-xl{width:36rem}.min-w-12{min-width:3rem}.min-w-full{min-width:100%}.max-w-2xl{max-width:42rem}.max-w-4xl{max-width:56rem}.max-w-full{max-width:100%}.max-w-lg{max-width:32rem}.max-w-none{max-width:none}.max-w-screen-2xl{max-width:1440px}.max-w-screen-3xl{max-width:1800px}.max-w-screen-4xl{max-width:1900px}.max-w-screen-xl{max-width:1280px}.max-w-sm{max-width:24rem}.max-w-xl{max-width:36rem}.flex-1{flex:1 1 0%}.flex-none{flex:none}.flex-shrink-0,.shrink-0{flex-shrink:0}.flex-grow{flex-grow:1}.table-auto{table-layout:auto}.border-collapse{border-collapse:collapse}.-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-1\/3{--tw-translate-x:-33.333333%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-1\/4{--tw-translate-x:-25%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-3\/7{--tw-translate-x:-42.8571429%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(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)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-2{--tw-translate-y:-.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-full{--tw-translate-y:-100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-0{--tw-translate-x:0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-0\.5{--tw-translate-x:.125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\/2{--tw-translate-x:50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\/3{--tw-translate-x:33.333333%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\/4{--tw-translate-x:25%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-0{--tw-translate-y:0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-12{--tw-translate-y:3rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-32{--tw-translate-y:8rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(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)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-45{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(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)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-100{--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-103{--tw-scale-x:1.03;--tw-scale-y:1.03;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.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)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-125{--tw-scale-x:1.25;--tw-scale-y:1.25;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(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)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.animate-fadeIn{animation:fadeIn .5s ease-in forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.animate-fadeInSlow{animation:fadeIn 1s ease-in forwards}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes rotate{to{transform:rotate(360deg)}}.animate-rotate{animation:rotate 1s linear infinite}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize{resize:both}.list-none{list-style-type:none}.list-square{list-style-type:square}.grid-cols-10{grid-template-columns:repeat(10,minmax(0,1fr))}.grid-cols-11{grid-template-columns:repeat(11,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))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}.grid-cols-9{grid-template-columns:repeat(9,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.content-center{align-content:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.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}.justify-items-center{justify-items:center}.gap-10{gap:2.5rem}.gap-14{gap:3.5rem}.gap-2{gap:.5rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-7{gap:1.75rem}.gap-8{gap:2rem}.gap-y-0{row-gap:0px}.gap-y-10{row-gap:2.5rem}.gap-y-8{row-gap:2rem}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.divide-x>:not([hidden])~:not([hidden]){--tw-divide-x-reverse:0;border-right-width:calc(1px * var(--tw-divide-x-reverse));border-left-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)))}.divide-x-2>:not([hidden])~:not([hidden]){--tw-divide-x-reverse:0;border-right-width:calc(2px * var(--tw-divide-x-reverse));border-left-width:calc(2px * calc(1 - var(--tw-divide-x-reverse)))}.divide-gray-light-mid>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(216 216 216 / var(--tw-divide-opacity))}.divide-gray-mid>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(148 148 148 / var(--tw-divide-opacity))}.divide-gray-mid-dark>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(111 111 111 / var(--tw-divide-opacity))}.divide-white>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgb(255 255 255 / var(--tw-divide-opacity))}.divide-opacity-40>:not([hidden])~:not([hidden]){--tw-divide-opacity:.4}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-x-visible{overflow-x:visible}.overflow-y-scroll{overflow-y:scroll}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.whitespace-nowrap{white-space:nowrap}.break-normal{overflow-wrap:normal;word-break:normal}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-none{border-radius:0}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-0{border-width:0px}.border-2{border-width:2px}.border-4{border-width:4px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-b-3{border-bottom-width:3px}.border-l{border-left-width:1px}.border-l-0{border-left-width:0px}.border-l-2{border-left-width:2px}.border-l-4{border-left-width:4px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-t-2{border-top-width:2px}.border-t-3{border-top-width:3px}.border-dashed{border-style:dashed}.border-none{border-style:none}.border-black{--tw-border-opacity:1;border-color:rgb(0 0 0 / var(--tw-border-opacity))}.border-black\/50{border-color:#00000080}.border-blue{--tw-border-opacity:1;border-color:rgb(139 203 250 / var(--tw-border-opacity))}.border-gray-dark{--tw-border-opacity:1;border-color:rgb(34 34 34 / var(--tw-border-opacity))}.border-gray-light-mid{--tw-border-opacity:1;border-color:rgb(216 216 216 / var(--tw-border-opacity))}.border-gray-mid{--tw-border-opacity:1;border-color:rgb(148 148 148 / var(--tw-border-opacity))}.border-gray-mid-dark{--tw-border-opacity:1;border-color:rgb(111 111 111 / var(--tw-border-opacity))}.border-jpl-red{--tw-border-opacity:1;border-color:rgb(227 25 55 / var(--tw-border-opacity))}.border-jpl-red-light{--tw-border-opacity:1;border-color:rgb(231 59 84 / var(--tw-border-opacity))}.border-success-green{--tw-border-opacity:1;border-color:rgb(51 161 123 / 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))}.border-opacity-0{--tw-border-opacity:0}.border-opacity-100{--tw-border-opacity:1}.border-opacity-30{--tw-border-opacity:.3}.border-opacity-40{--tw-border-opacity:.4}.border-opacity-50{--tw-border-opacity:.5}.bg-alert-gold{--tw-bg-opacity:1;background-color:rgb(255 186 50 / var(--tw-bg-opacity))}.bg-alert-gold-light{--tw-bg-opacity:1;background-color:rgb(255 249 235 / var(--tw-bg-opacity))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity))}.bg-black\/15{background-color:#00000026}.bg-black\/30{background-color:#0000004d}.bg-blue{--tw-bg-opacity:1;background-color:rgb(139 203 250 / var(--tw-bg-opacity))}.bg-dark-blue{--tw-bg-opacity:1;background-color:rgb(0 69 98 / var(--tw-bg-opacity))}.bg-disabled-gray{--tw-bg-opacity:1;background-color:rgb(216 216 216 / var(--tw-bg-opacity))}.bg-error-red{--tw-bg-opacity:1;background-color:rgb(193 21 46 / var(--tw-bg-opacity))}.bg-error-red-light{--tw-bg-opacity:1;background-color:rgb(255 232 235 / var(--tw-bg-opacity))}.bg-focus-blue{--tw-bg-opacity:1;background-color:rgb(24 113 201 / var(--tw-bg-opacity))}.bg-focus-blue-light{--tw-bg-opacity:1;background-color:rgb(232 241 250 / var(--tw-bg-opacity))}.bg-gray-dark{--tw-bg-opacity:1;background-color:rgb(34 34 34 / var(--tw-bg-opacity))}.bg-gray-light{--tw-bg-opacity:1;background-color:rgb(245 245 245 / var(--tw-bg-opacity))}.bg-gray-light-mid{--tw-bg-opacity:1;background-color:rgb(216 216 216 / var(--tw-bg-opacity))}.bg-gray-light\/90{background-color:#f5f5f5e6}.bg-gray-mid{--tw-bg-opacity:1;background-color:rgb(148 148 148 / var(--tw-bg-opacity))}.bg-gray-mid-dark{--tw-bg-opacity:1;background-color:rgb(111 111 111 / var(--tw-bg-opacity))}.bg-green{--tw-bg-opacity:1;background-color:rgb(20 201 122 / var(--tw-bg-opacity))}.bg-jpl-aqua{--tw-bg-opacity:1;background-color:rgb(72 159 223 / var(--tw-bg-opacity))}.bg-jpl-red{--tw-bg-opacity:1;background-color:rgb(227 25 55 / var(--tw-bg-opacity))}.bg-jpl-red-dark{--tw-bg-opacity:1;background-color:rgb(193 21 46 / var(--tw-bg-opacity))}.bg-jpl-red-darker{--tw-bg-opacity:1;background-color:rgb(92 4 17 / var(--tw-bg-opacity))}.bg-jpl-red-light{--tw-bg-opacity:1;background-color:rgb(231 59 84 / var(--tw-bg-opacity))}.bg-jpl-sky-blue{--tw-bg-opacity:1;background-color:rgb(16 130 158 / var(--tw-bg-opacity))}.bg-jpl-sky-blue-dark{--tw-bg-opacity:1;background-color:rgb(0 96 119 / var(--tw-bg-opacity))}.bg-off-white{--tw-bg-opacity:1;background-color:rgb(250 250 250 / var(--tw-bg-opacity))}.bg-success-green{--tw-bg-opacity:1;background-color:rgb(51 161 123 / var(--tw-bg-opacity))}.bg-success-green-light{--tw-bg-opacity:1;background-color:rgb(225 245 238 / 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\/10{background-color:#ffffff1a}.bg-white\/90{background-color:#ffffffe6}.bg-opacity-0{--tw-bg-opacity:0}.bg-opacity-15{--tw-bg-opacity:.15}.bg-opacity-25{--tw-bg-opacity:.25}.bg-opacity-50{--tw-bg-opacity:.5}.bg-opacity-75{--tw-bg-opacity:.75}.bg-opacity-90{--tw-bg-opacity:.9}.bg-opacity-98{--tw-bg-opacity:.98}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.bg-gradient-to-bl{background-image:linear-gradient(to bottom left,var(--tw-gradient-stops))}.bg-gradient-to-l{background-image:linear-gradient(to left,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.bg-none{background-image:none}.from-jpl-red{--tw-gradient-from:#E31937 var(--tw-gradient-from-position);--tw-gradient-to:rgb(227 25 55 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.from-transparent-black-75{--tw-gradient-from:rgba(0 0 0 / 75%) var(--tw-gradient-from-position);--tw-gradient-to:rgba(0, 0, 0, 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.from-transparent-w25{--tw-gradient-from:transparent 25% var(--tw-gradient-from-position);--tw-gradient-to:rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.from-transparent-w50{--tw-gradient-from:transparent 50% var(--tw-gradient-from-position);--tw-gradient-to:rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.from-white{--tw-gradient-from:#FFFFFF var(--tw-gradient-from-position);--tw-gradient-to:rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.to-black{--tw-gradient-to:#000000 var(--tw-gradient-to-position)}.to-jpl-red-darker{--tw-gradient-to:#5C0411 var(--tw-gradient-to-position)}.to-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position)}.to-transparent-black-50{--tw-gradient-to:rgba(0 0 0 / 50%) var(--tw-gradient-to-position)}.to-transparent-black-75{--tw-gradient-to:rgba(0 0 0 / 75%) var(--tw-gradient-to-position)}.to-transparent-black-90{--tw-gradient-to:rgba(0 0 0 / 90%) var(--tw-gradient-to-position)}.bg-cover{background-size:cover}.bg-center{background-position:center}.bg-no-repeat{background-repeat:no-repeat}.object-contain{object-fit:contain}.object-cover{object-fit:cover}.object-fill{object-fit:fill}.object-none{object-fit:none}.object-scale-down{object-fit:scale-down}.object-bottom{object-position:bottom}.object-center{object-position:center}.p-0{padding:0}.p-10{padding:2.5rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-0{padding-left:0;padding-right:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-3\.5{padding-left:.875rem;padding-right:.875rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.px-px{padding-left:1px;padding-right:1px}.py-0{padding-top:0;padding-bottom:0}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-28{padding-top:7rem;padding-bottom:7rem}.py-2px{padding-top:2px;padding-bottom:2px}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.py-px{padding-top:1px;padding-bottom:1px}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25rem}.pb-10{padding-bottom:2.5rem}.pb-12{padding-bottom:3rem}.pb-14{padding-bottom:3.5rem}.pb-2{padding-bottom:.5rem}.pb-22{padding-bottom:5.5rem}.pb-24{padding-bottom:6rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pb-5{padding-bottom:1.25rem}.pb-6{padding-bottom:1.5rem}.pb-8{padding-bottom:2rem}.pb-80{padding-bottom:20rem}.pl-0{padding-left:0}.pl-1{padding-left:.25rem}.pl-10{padding-left:2.5rem}.pl-12{padding-left:3rem}.pl-14{padding-left:3.5rem}.pl-18{padding-left:4.5rem}.pl-2{padding-left:.5rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pl-5{padding-left:1.25rem}.pl-6{padding-left:1.5rem}.pl-8{padding-left:2rem}.pr-0{padding-right:0}.pr-0\.5{padding-right:.125rem}.pr-1{padding-right:.25rem}.pr-14{padding-right:3.5rem}.pr-2{padding-right:.5rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.pr-5{padding-right:1.25rem}.pr-6{padding-right:1.5rem}.pr-8{padding-right:2rem}.pt-1{padding-top:.25rem}.pt-10{padding-top:2.5rem}.pt-12{padding-top:3rem}.pt-14{padding-top:3.5rem}.pt-2{padding-top:.5rem}.pt-2\.5{padding-top:.625rem}.pt-22{padding-top:5.5rem}.pt-3{padding-top:.75rem}.pt-4{padding-top:1rem}.pt-40{padding-top:10rem}.pt-5{padding-top:1.25rem}.pt-6{padding-top:1.5rem}.pt-8{padding-top:2rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.align-top{vertical-align:top}.align-middle{vertical-align:middle}.font-primary{font-family:Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.font-secondary{font-family:Archivo Narrow,Metropolis,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}.text-2xl{font-size:1.375rem}.text-3xl{font-size:1.5rem}.text-4xl{font-size:1.625rem}.text-5xl{font-size:1.75rem}.text-6xl{font-size:2rem}.text-7xl{font-size:2.5rem}.text-8xl{font-size:2.75rem}.text-base{font-size:1rem}.text-lg{font-size:1.125rem}.text-sm{font-size:.875rem}.text-xl{font-size:1.25rem}.text-xs{font-size:.75rem}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-light{font-weight:300}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.normal-case{text-transform:none}.not-italic{font-style:normal}.leading-none{line-height:1}.leading-normal{line-height:1.5}.leading-relaxed{line-height:1.75}.leading-tight{line-height:1.25}.leading-tighter{line-height:1.125}.tracking-normal{letter-spacing:0}.tracking-tight{letter-spacing:-.5px}.tracking-tighter{letter-spacing:-1px}.tracking-wider{letter-spacing:1px}.text-action{color:var(--color-action)}.text-action-hover{color:var(--color-action-dark)}.text-black{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))}.text-blue{--tw-text-opacity:1;color:rgb(139 203 250 / var(--tw-text-opacity))}.text-facebook{--tw-text-opacity:1;color:rgb(59 89 152 / var(--tw-text-opacity))}.text-gray-dark{--tw-text-opacity:1;color:rgb(34 34 34 / var(--tw-text-opacity))}.text-gray-light{--tw-text-opacity:1;color:rgb(245 245 245 / var(--tw-text-opacity))}.text-gray-light-mid{--tw-text-opacity:1;color:rgb(216 216 216 / var(--tw-text-opacity))}.text-gray-mid{--tw-text-opacity:1;color:rgb(148 148 148 / var(--tw-text-opacity))}.text-gray-mid-dark{--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity))}.text-instagram{--tw-text-opacity:1;color:rgb(221 42 123 / var(--tw-text-opacity))}.text-jpl-aqua{--tw-text-opacity:1;color:rgb(72 159 223 / var(--tw-text-opacity))}.text-jpl-red{--tw-text-opacity:1;color:rgb(227 25 55 / var(--tw-text-opacity))}.text-jpl-red-dark{--tw-text-opacity:1;color:rgb(193 21 46 / var(--tw-text-opacity))}.text-jpl-red-light{--tw-text-opacity:1;color:rgb(231 59 84 / var(--tw-text-opacity))}.text-jpl-sky-blue{--tw-text-opacity:1;color:rgb(16 130 158 / var(--tw-text-opacity))}.text-jpl-sky-blue-dark{--tw-text-opacity:1;color:rgb(0 96 119 / var(--tw-text-opacity))}.text-reddit{--tw-text-opacity:1;color:rgb(255 69 0 / var(--tw-text-opacity))}.text-secondary{color:var(--color-secondary)}.text-transparent{color:transparent}.text-twitter{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.text-youtube{--tw-text-opacity:1;color:rgb(255 0 0 / var(--tw-text-opacity))}.text-opacity-75{--tw-text-opacity:.75}.text-opacity-90{--tw-text-opacity:.9}.underline{text-decoration-line:underline}.no-underline{text-decoration-line:none}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-70{opacity:.7}.opacity-75{opacity:.75}.opacity-80{opacity:.8}.opacity-90{opacity:.9}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(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-jpl{--tw-shadow:-4px 5px 60px 0 rgba(0, 0, 0, .1);--tw-shadow-colored:-4px 5px 60px 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-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(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-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)}.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)}.drop-shadow-lg{--tw-drop-shadow:drop-shadow(0 10px 8px rgb(0 0 0 / .04)) drop-shadow(0 4px 3px rgb(0 0 0 / .1));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)}.invert{--tw-invert:invert(100%);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)}.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(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-border-opacity{transition-property:border-opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-none{transition-property:none}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.delay-200{transition-delay:.2s}.delay-500{transition-delay:.5s}.duration-100{transition-duration:.1s}.duration-1000{transition-duration:1s}.duration-150{transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-2000{transition-duration:2s}.duration-300{transition-duration:.3s}.duration-3500{transition-duration:3.5s}.duration-500{transition-duration:.5s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-linear{transition-timing-function:linear}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.fancybox__slide{padding:36px}@media (min-width: 1024px){.fancybox__slide{padding:64px}}.fancybox__content{padding:18px}@media (min-width: 1024px){.fancybox__content{padding:36px}}.aspect-ratio-none>div:first-of-type:before{content:"";display:flex;width:auto;padding-bottom:unset}.aspect-ratio-none>div:first-of-type iframe,.aspect-ratio-none>div:first-of-type img{position:relative;margin-left:auto;margin-right:auto;height:100%;max-width:100%}.aspect-ratio-twentyone-nine>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:42.8571428571%}.aspect-ratio-twentyone-nine>div:first-of-type iframe,.aspect-ratio-twentyone-nine>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-sixteen-nine>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:56.25%}.aspect-ratio-sixteen-nine>div:first-of-type iframe,.aspect-ratio-sixteen-nine>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-sixteen-seven>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:43.75%}.aspect-ratio-sixteen-seven>div:first-of-type iframe,.aspect-ratio-sixteen-seven>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-twelve-nine>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:75%}.aspect-ratio-twelve-nine>div:first-of-type iframe,.aspect-ratio-twelve-nine>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-nine-sixteen>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:177.7777777778%}.aspect-ratio-nine-sixteen>div:first-of-type iframe,.aspect-ratio-nine-sixteen>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-seven-eight>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:114.2857142857%}.aspect-ratio-seven-eight>div:first-of-type iframe,.aspect-ratio-seven-eight>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-eight-seven>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:87.5%}.aspect-ratio-eight-seven>div:first-of-type iframe,.aspect-ratio-eight-seven>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-four-three>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:75%}.aspect-ratio-four-three>div:first-of-type iframe,.aspect-ratio-four-three>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-four-five>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:125%}.aspect-ratio-four-five>div:first-of-type iframe,.aspect-ratio-four-five>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-two-one>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:50%}.aspect-ratio-two-one>div:first-of-type iframe,.aspect-ratio-two-one>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-three-two>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:66.6666666667%}.aspect-ratio-three-two>div:first-of-type iframe,.aspect-ratio-three-two>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-two-three>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:150%}.aspect-ratio-two-three>div:first-of-type iframe,.aspect-ratio-two-three>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.aspect-ratio-one-one>div:first-of-type:before,.aspect-ratio-square>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:100%}.aspect-ratio-one-one>div:first-of-type iframe,.aspect-ratio-one-one>div:first-of-type img,.aspect-ratio-square>div:first-of-type iframe,.aspect-ratio-square>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.text-contrast{text-shadow:1px 1px 2px rgba(0,0,0,.7)}.text-contrast-none{text-shadow:none}.NavInternal .NavInternalPanel .auto-cols-2,.NavInternal .NavInternalPanel .auto-cols-3{-moz-column-gap:3.5rem;column-gap:3.5rem}.NavInternal .NavInternalPanel .auto-cols-2{-moz-column-count:2;column-count:2}.NavInternal .NavInternalPanel .auto-cols-3{-moz-column-count:3;column-count:3}.NavInternal .NavInternalPanel .no-auto-cols{-moz-column-count:auto;column-count:auto}@keyframes arrow-carousel-next-anim{0%{transform:translate(0)}to{transform:translate(3rem)}}@keyframes arrow-carousel-next-fixed-anim{0%{transform:translate(-3rem)}to{transform:translate(0)}}@keyframes arrow-carousel-prev-anim{0%{transform:translate(0)}to{transform:translate(-3rem)}}@keyframes arrow-carousel-prev-fixed-anim{0%{transform:translate(3rem)}to{transform:translate(0)}}@media (min-width: 640px){.sm\:BaseGrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.5rem}.sm\:object-cover{font-family:"object-fit: cover"}}@media (min-width: 768px){.md\:BaseGrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.5rem}}@media (min-width: 1024px){.lg\:BaseGrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.5rem}}@media (min-width: 1280px){.xl\:BaseGrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.5rem}}@media (min-width: 1440px){.MixedBleedGrid .\32xl\:col-start-indent-col-3{grid-column-start:indent-col-3}}@media (min-width: 1024px){.lg\:container{width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 640px){.lg\:container{max-width:640px}}@media (min-width: 768px){.lg\:container{max-width:768px}}.lg\:container{max-width:1024px}@media (min-width: 1280px){.lg\:container{max-width:1280px}}@media (min-width: 1320px){.lg\:container{max-width:1320px}}}.last\:mr-0:last-child{margin-right:0}.focus-within\:opacity-100:focus-within{opacity:1}@media (hover: hover) and (pointer: fine){.hover\:border-gray-dark:hover{--tw-border-opacity:1;border-color:rgb(34 34 34 / var(--tw-border-opacity))}.hover\:text-jpl-red-dark:hover{--tw-text-opacity:1;color:rgb(193 21 46 / var(--tw-text-opacity))}.hover\:text-jpl-red-light:hover{--tw-text-opacity:1;color:rgb(231 59 84 / var(--tw-text-opacity))}}.focus\:not-sr-only:focus{position:static;width:auto;height:auto;padding:0;margin:0;overflow:visible;clip:auto;white-space:normal}.focus\:border-focus-blue:focus{--tw-border-opacity:1;border-color:rgb(24 113 201 / var(--tw-border-opacity))}.focus\:border-gray-dark\/20:focus{border-color:#2223}.focus\:underline:focus{text-decoration-line:underline}.focus\:shadow-jpl:focus{--tw-shadow:-4px 5px 60px 0 rgba(0, 0, 0, .1);--tw-shadow-colored:-4px 5px 60px 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)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-jpl-red:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(227 25 55 / var(--tw-ring-opacity))}.focus\:ring-transparent:focus{--tw-ring-color:transparent}.focus\:ring-opacity-50:focus{--tw-ring-opacity:.5}@media (hover: hover) and (pointer: fine){.group:hover .group-hover\:opacity-100{opacity:1}.group:hover .group-hover\:opacity-75{opacity:.75}}@media (prefers-reduced-motion: no-preference){@keyframes ping{75%,to{transform:scale(2);opacity:0}}.motion-safe\:animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite}}@media (min-width: 640px){.sm\:absolute{position:absolute}.sm\:col-span-3{grid-column:span 3 / span 3}.sm\:col-span-5{grid-column:span 5 / span 5}.sm\:col-span-6{grid-column:span 6 / span 6}.sm\:col-span-7{grid-column:span 7 / span 7}.sm\:col-end-11{grid-column-end:11}.sm\:mx-20{margin-left:5rem;margin-right:5rem}.sm\:mx-auto{margin-left:auto;margin-right:auto}.sm\:-ml-10{margin-left:-2.5rem}.sm\:-mt-0{margin-top:-0px}.sm\:-mt-0\.5{margin-top:-.125rem}.sm\:-mt-2{margin-top:-.5rem}.sm\:mb-0{margin-bottom:0}.sm\:mb-3{margin-bottom:.75rem}.sm\:mb-8{margin-bottom:2rem}.sm\:mr-0{margin-right:0}.sm\:mt-0{margin-top:0}.sm\:mt-0\.5{margin-top:.125rem}.sm\:mt-16{margin-top:4rem}.sm\:block{display:block}.sm\:flex{display:flex}.sm\:grid{display:grid}.sm\:hidden{display:none}.sm\:h-10{height:2.5rem}.sm\:h-26{height:6.5rem}.sm\:h-40{height:10rem}.sm\:w-24{width:6rem}.sm\:w-26{width:6.5rem}.sm\:w-3\/4{width:75%}.sm\:w-80{width:20rem}.sm\:w-auto{width:auto}.sm\:w-xl{width:36rem}.sm\:max-w-xl{max-width:36rem}.sm\:whitespace-nowrap{white-space:nowrap}.sm\:object-cover{object-fit:cover}.sm\:p-10{padding:2.5rem}.sm\:px-10{padding-left:2.5rem;padding-right:2.5rem}.sm\:px-5{padding-left:1.25rem;padding-right:1.25rem}.sm\:py-0{padding-top:0;padding-bottom:0}.sm\:py-8{padding-top:2rem;padding-bottom:2rem}.sm\:pr-5{padding-right:1.25rem}.sm\:pt-24{padding-top:6rem}.sm\:text-left{text-align:left}.sm\:text-2xl{font-size:1.375rem}.sm\:text-4xl{font-size:1.625rem}.sm\:text-6xl{font-size:2rem}.sm\:leading-normal{line-height:1.5}}@media (min-width: 768px){.md\:visible{visibility:visible}.md\:top-2{top:.5rem}.md\:order-first{order:-9999}.md\:order-last{order:9999}.md\:col-span-3{grid-column:span 3 / span 3}.md\:col-span-6{grid-column:span 6 / span 6}.md\:col-start-2{grid-column-start:2}.md\:col-start-3{grid-column-start:3}.md\:col-start-6{grid-column-start:6}.md\:col-start-7{grid-column-start:7}.md\:col-end-11{grid-column-end:11}.md\:col-end-13{grid-column-end:13}.md\:-mx-4{margin-left:-1rem;margin-right:-1rem}.md\:mx-0{margin-left:0;margin-right:0}.md\:mx-16{margin-left:4rem;margin-right:4rem}.md\:mx-4{margin-left:1rem;margin-right:1rem}.md\:my-12{margin-top:3rem;margin-bottom:3rem}.md\:mb-0{margin-bottom:0}.md\:mb-10{margin-bottom:2.5rem}.md\:mb-12{margin-bottom:3rem}.md\:mb-2{margin-bottom:.5rem}.md\:mb-3{margin-bottom:.75rem}.md\:mb-40{margin-bottom:10rem}.md\:mb-7{margin-bottom:1.75rem}.md\:mb-8{margin-bottom:2rem}.md\:ml-8{margin-left:2rem}.md\:mr-0{margin-right:0}.md\:mr-16{margin-right:4rem}.md\:mr-6{margin-right:1.5rem}.md\:mt-0{margin-top:0}.md\:mt-1{margin-top:.25rem}.md\:mt-10{margin-top:2.5rem}.md\:mt-5{margin-top:1.25rem}.md\:block{display:block}.md\:inline{display:inline}.md\:flex{display:flex}.md\:grid{display:grid}.md\:hidden{display:none}.md\:w-2\/3{width:66.666667%}.md\:w-56{width:14rem}.md\:max-w-3xl{max-width:48rem}.md\:max-w-none{max-width:none}.md\:flex-none{flex:none}.md\:flex-grow-0{flex-grow:0}.md\:-translate-y-full{--tw-translate-y:-100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.md\:translate-x-0{--tw-translate-x:0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.md\:transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.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\:flex-row{flex-direction:row}.md\:flex-wrap{flex-wrap:wrap}.md\:justify-start{justify-content:flex-start}.md\:justify-end{justify-content:flex-end}.md\:object-right{object-position:right}.md\:px-0{padding-left:0;padding-right:0}.md\:px-4{padding-left:1rem;padding-right:1rem}.md\:px-5{padding-left:1.25rem;padding-right:1.25rem}.md\:py-10{padding-top:2.5rem;padding-bottom:2.5rem}.md\:py-5{padding-top:1.25rem;padding-bottom:1.25rem}.md\:pl-3{padding-left:.75rem}.md\:pr-3{padding-right:.75rem}.md\:pt-5{padding-top:1.25rem}.md\:pt-8{padding-top:2rem}.md\:text-2xl{font-size:1.375rem}.md\:text-3xl{font-size:1.5rem}.md\:text-8xl{font-size:2.75rem}.md\:text-base{font-size:1rem}.md\:aspect-ratio-four-three>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:75%}.md\:aspect-ratio-four-three>div:first-of-type iframe,.md\:aspect-ratio-four-three>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}}@media (min-width: 1024px){.lg\:absolute{position:absolute}.lg\:relative{position:relative}.lg\:inset-0{top:0;right:0;bottom:0;left:0}.lg\:inset-y-0{top:0;bottom:0}.lg\:left-0{left:0}.lg\:left-auto{left:auto}.lg\:right-1\/2{right:50%}.lg\:top-0{top:0}.lg\:top-1\/2{top:50%}.lg\:z-20{z-index:20}.lg\:order-1{order:1}.lg\:order-2{order:2}.lg\:order-3{order:3}.lg\:col-span-2{grid-column:span 2 / span 2}.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-9{grid-column:span 9 / span 9}.lg\:col-start-1{grid-column-start:1}.lg\:col-start-2{grid-column-start:2}.lg\:col-start-3{grid-column-start:3}.lg\:col-start-4{grid-column-start:4}.lg\:col-start-5{grid-column-start:5}.lg\:col-start-6{grid-column-start:6}.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-10{grid-column-end:10}.lg\:col-end-11{grid-column-end:11}.lg\:col-end-12{grid-column-end:12}.lg\:col-end-13{grid-column-end:13}.lg\:col-end-5{grid-column-end:5}.lg\:col-end-6{grid-column-end:6}.lg\:col-end-8{grid-column-end:8}.lg\:col-end-9{grid-column-end:9}.lg\:row-span-2{grid-row:span 2 / span 2}.lg\:mx-0{margin-left:0;margin-right:0}.lg\:mx-1{margin-left:.25rem;margin-right:.25rem}.lg\:mx-1\.5{margin-left:.375rem;margin-right:.375rem}.lg\:my-16{margin-top:4rem;margin-bottom:4rem}.lg\:my-18{margin-top:4.5rem;margin-bottom:4.5rem}.lg\:my-20{margin-top:5rem;margin-bottom:5rem}.lg\:my-24{margin-top:6rem;margin-bottom:6rem}.lg\:my-28{margin-top:7rem;margin-bottom:7rem}.lg\:my-8{margin-top:2rem;margin-bottom:2rem}.lg\:-mb-3{margin-bottom:-.75rem}.lg\:-mb-8{margin-bottom:-2rem}.lg\:-ml-24{margin-left:-6rem}.lg\:-ml-3{margin-left:-.75rem}.lg\:-ml-4{margin-left:-1rem}.lg\:-mr-8{margin-right:-2rem}.lg\:-mt-0{margin-top:-0px}.lg\:-mt-0\.5{margin-top:-.125rem}.lg\:-mt-2{margin-top:-.5rem}.lg\:-mt-2\.5{margin-top:-.625rem}.lg\:-mt-20{margin-top:-5rem}.lg\:-mt-26{margin-top:-6.5rem}.lg\:-mt-28{margin-top:-7rem}.lg\:-mt-6{margin-top:-1.5rem}.lg\:-mt-px{margin-top:-1px}.lg\:mb-0{margin-bottom:0}.lg\:mb-10{margin-bottom:2.5rem}.lg\:mb-12{margin-bottom:3rem}.lg\:mb-14{margin-bottom:3.5rem}.lg\:mb-16{margin-bottom:4rem}.lg\:mb-18{margin-bottom:4.5rem}.lg\:mb-2{margin-bottom:.5rem}.lg\:mb-20{margin-bottom:5rem}.lg\:mb-22{margin-bottom:5.5rem}.lg\:mb-24{margin-bottom:6rem}.lg\:mb-25{margin-bottom:6.25rem}.lg\:mb-3{margin-bottom:.75rem}.lg\:mb-36{margin-bottom:9rem}.lg\:mb-4{margin-bottom:1rem}.lg\:mb-5{margin-bottom:1.25rem}.lg\:mb-6{margin-bottom:1.5rem}.lg\:mb-8{margin-bottom:2rem}.lg\:mb-80{margin-bottom:20rem}.lg\:ml-0{margin-left:0}.lg\:ml-30{margin-left:7.5rem}.lg\:ml-6{margin-left:1.5rem}.lg\:mr-0{margin-right:0}.lg\:mr-20{margin-right:5rem}.lg\:mr-3{margin-right:.75rem}.lg\:mr-8{margin-right:2rem}.lg\:mt-0{margin-top:0}.lg\:mt-1{margin-top:.25rem}.lg\:mt-1\.5{margin-top:.375rem}.lg\:mt-10{margin-top:2.5rem}.lg\:mt-12{margin-top:3rem}.lg\:mt-18{margin-top:4.5rem}.lg\:mt-2{margin-top:.5rem}.lg\:mt-20{margin-top:5rem}.lg\:mt-24{margin-top:6rem}.lg\:mt-28{margin-top:7rem}.lg\:mt-3{margin-top:.75rem}.lg\:mt-6{margin-top:1.5rem}.lg\:mt-8{margin-top:2rem}.lg\:block{display:block}.lg\:inline-block{display:inline-block}.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:hidden{display:none}.lg\:h-full{height:100%}.lg\:max-h-3xl{max-height:48rem}.lg\:min-h-100{min-height:25rem}.lg\:min-h-28{min-height:7rem}.lg\:w-1\/2{width:50%}.lg\:w-14{width:3.5rem}.lg\:w-14\.5{width:3.625rem}.lg\:w-2\/3{width:66.666667%}.lg\:w-25{width:6.25rem}.lg\:w-3\/4{width:75%}.lg\:w-35{width:8.75rem}.lg\:w-3xl{width:48rem}.lg\:w-48{width:12rem}.lg\:w-5\/6{width:83.333333%}.lg\:w-64{width:16rem}.lg\:w-auto{width:auto}.lg\:w-full{width:100%}.lg\:max-w-3xl{max-width:48rem}.lg\:max-w-none{max-width:none}.lg\:flex-shrink-0{flex-shrink:0}.lg\:-translate-y-1\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.lg\:-translate-y-3\/7{--tw-translate-y:-42.8571429%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.lg\:translate-x-1\/2{--tw-translate-x:50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.lg\:grid-cols-10{grid-template-columns:repeat(10,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:flex-row{flex-direction:row}.lg\:flex-col{flex-direction:column}.lg\:flex-wrap{flex-wrap:wrap}.lg\:items-end{align-items:flex-end}.lg\:items-center{align-items:center}.lg\:justify-start{justify-content:flex-start}.lg\:justify-end{justify-content:flex-end}.lg\:gap-x-6{-moz-column-gap:1.5rem;column-gap:1.5rem}.lg\:gap-y-0{row-gap:0px}.lg\:overflow-hidden{overflow:hidden}.lg\:overflow-visible{overflow:visible}.lg\:overflow-x-auto{overflow-x:auto}.lg\:whitespace-normal{white-space:normal}.lg\:border-0{border-width:0px}.lg\:border-b{border-bottom-width:1px}.lg\:border-t{border-top-width:1px}.lg\:border-none{border-style:none}.lg\:border-gray-light-mid{--tw-border-opacity:1;border-color:rgb(216 216 216 / var(--tw-border-opacity))}.lg\:border-gray-mid{--tw-border-opacity:1;border-color:rgb(148 148 148 / var(--tw-border-opacity))}.lg\:bg-gray-light\/100{background-color:#f5f5f5}.lg\:bg-opacity-100{--tw-bg-opacity:1}.lg\:bg-gradient-to-bl{background-image:linear-gradient(to bottom left,var(--tw-gradient-stops))}.lg\:bg-gradient-to-l{background-image:linear-gradient(to left,var(--tw-gradient-stops))}.lg\:bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.lg\:from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.lg\:from-transparent-w50{--tw-gradient-from:transparent 50% var(--tw-gradient-from-position);--tw-gradient-to:rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.lg\:to-transparent-black-50{--tw-gradient-to:rgba(0 0 0 / 50%) var(--tw-gradient-to-position)}.lg\:to-transparent-black-75{--tw-gradient-to:rgba(0 0 0 / 75%) var(--tw-gradient-to-position)}.lg\:to-transparent-black-90{--tw-gradient-to:rgba(0 0 0 / 90%) var(--tw-gradient-to-position)}.lg\:p-0{padding:0}.lg\:p-1{padding:.25rem}.lg\:p-20{padding:5rem}.lg\:p-5{padding:1.25rem}.lg\:px-0{padding-left:0;padding-right:0}.lg\:px-10{padding-left:2.5rem;padding-right:2.5rem}.lg\:px-12{padding-left:3rem;padding-right:3rem}.lg\:px-3{padding-left:.75rem;padding-right:.75rem}.lg\:px-4{padding-left:1rem;padding-right:1rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:py-0{padding-top:0;padding-bottom:0}.lg\:py-10{padding-top:2.5rem;padding-bottom:2.5rem}.lg\:py-12{padding-top:3rem;padding-bottom:3rem}.lg\:py-16{padding-top:4rem;padding-bottom:4rem}.lg\:py-18{padding-top:4.5rem;padding-bottom:4.5rem}.lg\:py-2{padding-top:.5rem;padding-bottom:.5rem}.lg\:py-24{padding-top:6rem;padding-bottom:6rem}.lg\:py-36{padding-top:9rem;padding-bottom:9rem}.lg\:py-4{padding-top:1rem;padding-bottom:1rem}.lg\:py-48{padding-top:12rem;padding-bottom:12rem}.lg\:py-5{padding-top:1.25rem;padding-bottom:1.25rem}.lg\:py-6{padding-top:1.5rem;padding-bottom:1.5rem}.lg\:py-8{padding-top:2rem;padding-bottom:2rem}.lg\:pb-0{padding-bottom:0}.lg\:pb-10{padding-bottom:2.5rem}.lg\:pb-14{padding-bottom:3.5rem}.lg\:pb-18{padding-bottom:4.5rem}.lg\:pb-2{padding-bottom:.5rem}.lg\:pb-24{padding-bottom:6rem}.lg\:pb-4{padding-bottom:1rem}.lg\:pb-6{padding-bottom:1.5rem}.lg\:pl-0{padding-left:0}.lg\:pl-6{padding-left:1.5rem}.lg\:pr-1{padding-right:.25rem}.lg\:pr-12{padding-right:3rem}.lg\:pr-14{padding-right:3.5rem}.lg\:pr-3{padding-right:.75rem}.lg\:pr-4{padding-right:1rem}.lg\:pr-5{padding-right:1.25rem}.lg\:pt-0{padding-top:0}.lg\:pt-10{padding-top:2.5rem}.lg\:pt-12{padding-top:3rem}.lg\:pt-2{padding-top:.5rem}.lg\:pt-20{padding-top:5rem}.lg\:pt-22{padding-top:5.5rem}.lg\:pt-3{padding-top:.75rem}.lg\:pt-3\.5{padding-top:.875rem}.lg\:pt-4{padding-top:1rem}.lg\:pt-6{padding-top:1.5rem}.lg\:pt-8{padding-top:2rem}.lg\:text-left{text-align:left}.lg\:text-center{text-align:center}.lg\:text-2xl{font-size:1.375rem}.lg\:text-3xl{font-size:1.5rem}.lg\:text-4xl{font-size:1.625rem}.lg\:text-6xl{font-size:2rem}.lg\:text-7xl{font-size:2.5rem}.lg\:text-9xl{font-size:3.5rem}.lg\:text-base{font-size:1rem}.lg\:text-xl{font-size:1.25rem}.lg\:font-normal{font-weight:400}.lg\:leading-tight{line-height:1.25}.lg\:leading-tighter{line-height:1.125}.lg\:tracking-tight{letter-spacing:-.5px}.lg\:tracking-tightest{letter-spacing:-2px}.lg\:text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.lg\:opacity-0{opacity:0}.lg\:shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(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)}.lg\:shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(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)}.lg\:aspect-ratio-two-one>div:first-of-type:before{content:"";display:block;width:100%;padding-bottom:50%}.lg\:aspect-ratio-two-one>div:first-of-type iframe,.lg\:aspect-ratio-two-one>div:first-of-type img{position:absolute;top:0;right:0;bottom:0;left:0;height:100%;width:100%}.lg\:text-contrast{text-shadow:1px 1px 2px rgba(0,0,0,.7)}.NavInternal .NavInternalPanel .lg\:auto-cols-2,.NavInternal .NavInternalPanel .lg\:auto-cols-3{-moz-column-gap:3.5rem;column-gap:3.5rem}.NavInternal .NavInternalPanel .lg\:auto-cols-2{-moz-column-count:2;column-count:2}.NavInternal .NavInternalPanel .lg\:auto-cols-3{-moz-column-count:3;column-count:3}@media (hover: hover) and (pointer: fine){.group:hover .lg\:group-hover\:mb-1{margin-bottom:.25rem}.group:hover .lg\:group-hover\:mb-3{margin-bottom:.75rem}.group:hover .lg\:group-hover\:ml-0{margin-left:0}.group:hover .lg\: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)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .lg\:group-hover\:opacity-100{opacity:1}}}@media (min-width: 1280px){.xl\:col-span-2{grid-column:span 2 / span 2}.xl\:col-span-3{grid-column:span 3 / span 3}.xl\:col-span-4{grid-column:span 4 / span 4}.xl\:col-span-7{grid-column:span 7 / span 7}.xl\:col-start-6{grid-column-start:6}.xl\:col-start-9{grid-column-start:9}.xl\:col-end-11{grid-column-end:11}.xl\:col-end-6{grid-column-end:6}.xl\:col-end-7{grid-column-end:7}.xl\:col-end-8{grid-column-end:8}.xl\:col-end-9{grid-column-end:9}.xl\:mx-24{margin-left:6rem;margin-right:6rem}.xl\:mx-4{margin-left:1rem;margin-right:1rem}.xl\:-ml-20{margin-left:-5rem}.xl\:-ml-22{margin-left:-5.5rem}.xl\:-mr-22{margin-right:-5.5rem}.xl\:mb-3{margin-bottom:.75rem}.xl\:block{display:block}.xl\:w-1\/2{width:50%}.xl\:w-2\/3{width:66.666667%}.xl\:w-3\/5{width:60%}.xl\:w-5\/12{width:41.666667%}.xl\:-translate-x-1\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.xl\:grid-cols-9{grid-template-columns:repeat(9,minmax(0,1fr))}.xl\:from-transparent-w25{--tw-gradient-from:transparent 25% var(--tw-gradient-from-position);--tw-gradient-to:rgb(255 255 255 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.xl\:px-0{padding-left:0;padding-right:0}.xl\:px-10{padding-left:2.5rem;padding-right:2.5rem}.xl\:px-8{padding-left:2rem;padding-right:2rem}.xl\:py-6{padding-top:1.5rem;padding-bottom:1.5rem}.xl\:pl-14{padding-left:3.5rem}.xl\:pr-18{padding-right:4.5rem}.xl\:pr-26{padding-right:6.5rem}.xl\:pr-4{padding-right:1rem}.xl\:pr-6{padding-right:1.5rem}.xl\:text-10xl{font-size:4.5rem}.xl\:text-2xl{font-size:1.375rem}.xl\:text-6xl{font-size:2rem}.xl\:text-base{font-size:1rem}.xl\:text-xl{font-size:1.25rem}.xl\:leading-normal{line-height:1.5}}@media (min-width: 1440px){.\32xl\:col-span-3{grid-column:span 3 / span 3}.\32xl\:-mr-3{margin-right:-.75rem}.\32xl\:w-2\/5{width:40%}.\32xl\:grid-cols-11{grid-template-columns:repeat(11,minmax(0,1fr))}.\32xl\:px-0{padding-left:0;padding-right:0}.\32xl\:pl-0{padding-left:0}.\32xl\:pr-0{padding-right:0}}@media (min-width: 1800px){.\33xl\:col-end-12{grid-column-end:12}.\33xl\:col-end-13{grid-column-end:13}.\33xl\:ml-0{margin-left:0}.\33xl\:ml-40{margin-left:10rem}.\33xl\:mr-16{margin-right:4rem}.\33xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.\33xl\:px-0{padding-left:0;padding-right:0}}@media (hover: hover){.can-hover\:-ml-3{margin-left:-.75rem}.can-hover\:block{display:block}.can-hover\:opacity-0{opacity:0}.can-hover\:opacity-100{opacity:1}@media (hover: hover) and (pointer: fine){.can-hover\:hover\:font-medium:hover{font-weight:500}.can-hover\:hover\:text-action-hover:hover{color:var(--color-action-dark)}.can-hover\:hover\:text-gray-dark:hover{--tw-text-opacity:1;color:rgb(34 34 34 / var(--tw-text-opacity))}.can-hover\:hover\:text-gray-mid-dark:hover{--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity))}.can-hover\:hover\:text-jpl-sky-blue-dark:hover{--tw-text-opacity:1;color:rgb(0 96 119 / var(--tw-text-opacity))}.can-hover\:hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.can-hover\:hover\:text-opacity-100:hover{--tw-text-opacity:1}.can-hover\:hover\:underline:hover{text-decoration-line:underline}.can-hover\:hover\:opacity-95:hover{opacity:.95}.can-hover\:hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(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)}.group:hover .can-hover\:group-hover\:-mt-3{margin-top:-.75rem}.group:hover .can-hover\:group-hover\:ml-0{margin-left:0}.group:hover .can-hover\:group-hover\:ml-2{margin-left:.5rem}.group:hover .can-hover\:group-hover\:ml-3{margin-left:.75rem}.group:hover .can-hover\:group-hover\:ml-5{margin-left:1.25rem}.group:hover .can-hover\:group-hover\:-translate-y-2{--tw-translate-y:-.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .can-hover\:group-hover\:-translate-y-3{--tw-translate-y:-.75rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .can-hover\:group-hover\:scale-100{--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .can-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)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .can-hover\:group-hover\:border-b-2{border-bottom-width:2px}.group:hover .can-hover\:group-hover\:border-gray-mid-dark{--tw-border-opacity:1;border-color:rgb(111 111 111 / var(--tw-border-opacity))}.group:hover .can-hover\:group-hover\:border-jpl-red{--tw-border-opacity:1;border-color:rgb(227 25 55 / var(--tw-border-opacity))}.group:hover .can-hover\:group-hover\:border-jpl-red-light{--tw-border-opacity:1;border-color:rgb(231 59 84 / var(--tw-border-opacity))}.group:hover .can-hover\:group-hover\:bg-jpl-red-light{--tw-bg-opacity:1;background-color:rgb(231 59 84 / var(--tw-bg-opacity))}.group:hover .can-hover\:group-hover\:text-gray-mid-dark{--tw-text-opacity:1;color:rgb(111 111 111 / var(--tw-text-opacity))}.group:hover .can-hover\:group-hover\:underline{text-decoration-line:underline}.group:hover .can-hover\:group-hover\:opacity-100{opacity:1}.group:hover .can-hover\:group-hover\:delay-200{transition-delay:.2s}}} diff --git a/packages/html/dist/assets/js/explorer-1.min.js b/packages/html/dist/assets/js/explorer-1.min.js index 98010d0e..339029ac 100644 --- a/packages/html/dist/assets/js/explorer-1.min.js +++ b/packages/html/dist/assets/js/explorer-1.min.js @@ -1,8 +1,8 @@ -(function(){const e=document.createElement("link").relList;if(e&&e.supports&&e.supports("modulepreload"))return;for(const s of document.querySelectorAll('link[rel="modulepreload"]'))i(s);new MutationObserver(s=>{for(const o of s)if(o.type==="childList")for(const a of o.addedNodes)a.tagName==="LINK"&&a.rel==="modulepreload"&&i(a)}).observe(document,{childList:!0,subtree:!0});function t(s){const o={};return s.integrity&&(o.integrity=s.integrity),s.referrerPolicy&&(o.referrerPolicy=s.referrerPolicy),s.crossOrigin==="use-credentials"?o.credentials="include":s.crossOrigin==="anonymous"?o.credentials="omit":o.credentials="same-origin",o}function i(s){if(s.ep)return;s.ep=!0;const o=t(s);fetch(s.href,o)}})();const Se=n=>typeof n=="object"&&n!==null&&n.constructor===Object&&Object.prototype.toString.call(n)==="[object Object]",K=(...n)=>{let e=!1;typeof n[0]=="boolean"&&(e=n.shift());let t=n[0];if(!t||typeof t!="object")throw new Error("extendee must be an object");const i=n.slice(1),s=i.length;for(let o=0;o(n=parseFloat(n)||0,Math.round((n+Number.EPSILON)*e)/e),_e=function(n){return!!(n&&typeof n=="object"&&n instanceof Element&&n!==document.body)&&!n.__Panzoom&&(function(e){const t=getComputedStyle(e)["overflow-y"],i=getComputedStyle(e)["overflow-x"],s=(t==="scroll"||t==="auto")&&Math.abs(e.scrollHeight-e.clientHeight)>1,o=(i==="scroll"||i==="auto")&&Math.abs(e.scrollWidth-e.clientWidth)>1;return s||o}(n)?n:_e(n.parentNode))},qt=typeof window<"u"&&window.ResizeObserver||class{constructor(n){this.observables=[],this.boundCheck=this.check.bind(this),this.boundCheck(),this.callback=n}observe(n){if(this.observables.some(t=>t.el===n))return;const e={el:n,size:{height:n.clientHeight,width:n.clientWidth}};this.observables.push(e)}unobserve(n){this.observables=this.observables.filter(e=>e.el!==n)}disconnect(){this.observables=[]}check(){const n=this.observables.filter(e=>{const t=e.el.clientHeight,i=e.el.clientWidth;if(e.size.height!==t||e.size.width!==i)return e.size.height=t,e.size.width=i,!0}).map(e=>e.el);n.length>0&&this.callback(n),window.requestAnimationFrame(this.boundCheck)}};class xe{constructor(e){this.id=self.Touch&&e instanceof Touch?e.identifier:-1,this.pageX=e.pageX,this.pageY=e.pageY,this.clientX=e.clientX,this.clientY=e.clientY}}const at=(n,e)=>e?Math.sqrt((e.clientX-n.clientX)**2+(e.clientY-n.clientY)**2):0,Re=(n,e)=>e?{clientX:(n.clientX+e.clientX)/2,clientY:(n.clientY+e.clientY)/2}:n;class Xt{constructor(e,{start:t=()=>!0,move:i=()=>{},end:s=()=>{}}={}){this._element=e,this.startPointers=[],this.currentPointers=[],this._pointerStart=o=>{if(o.buttons>0&&o.button!==0)return;const a=new xe(o);this.currentPointers.some(r=>r.id===a.id)||this._triggerPointerStart(a,o)&&(window.addEventListener("mousemove",this._move),window.addEventListener("mouseup",this._pointerEnd))},this._touchStart=o=>{for(const a of Array.from(o.changedTouches||[]))this._triggerPointerStart(new xe(a),o)},this._move=o=>{const a=this.currentPointers.slice(),r=(l=>"changedTouches"in l)(o)?Array.from(o.changedTouches).map(l=>new xe(l)):[new xe(o)];for(const l of r){const d=this.currentPointers.findIndex(c=>c.id===l.id);d<0||(this.currentPointers[d]=l)}this._moveCallback(a,this.currentPointers.slice(),o)},this._triggerPointerEnd=(o,a)=>{const r=this.currentPointers.findIndex(l=>l.id===o.id);return!(r<0)&&(this.currentPointers.splice(r,1),this.startPointers.splice(r,1),this._endCallback(o,a),!0)},this._pointerEnd=o=>{o.buttons>0&&o.button!==0||this._triggerPointerEnd(new xe(o),o)&&(window.removeEventListener("mousemove",this._move,{passive:!1}),window.removeEventListener("mouseup",this._pointerEnd,{passive:!1}))},this._touchEnd=o=>{for(const a of Array.from(o.changedTouches||[]))this._triggerPointerEnd(new xe(a),o)},this._startCallback=t,this._moveCallback=i,this._endCallback=s,this._element.addEventListener("mousedown",this._pointerStart,{passive:!1}),this._element.addEventListener("touchstart",this._touchStart,{passive:!1}),this._element.addEventListener("touchmove",this._move,{passive:!1}),this._element.addEventListener("touchend",this._touchEnd),this._element.addEventListener("touchcancel",this._touchEnd)}stop(){this._element.removeEventListener("mousedown",this._pointerStart,{passive:!1}),this._element.removeEventListener("touchstart",this._touchStart,{passive:!1}),this._element.removeEventListener("touchmove",this._move,{passive:!1}),this._element.removeEventListener("touchend",this._touchEnd),this._element.removeEventListener("touchcancel",this._touchEnd),window.removeEventListener("mousemove",this._move),window.removeEventListener("mouseup",this._pointerEnd)}_triggerPointerStart(e,t){return!!this._startCallback(e,t)&&(this.currentPointers.push(e),this.startPointers.push(e),!0)}}class Je{constructor(e={}){this.options=K(!0,{},e),this.plugins=[],this.events={};for(const t of["on","once"])for(const i of Object.entries(this.options[t]||{}))this[t](...i)}option(e,t,...i){e=String(e);let s=(o=e,a=this.options,o.split(".").reduce(function(r,l){return r&&r[l]},a));var o,a;return typeof s=="function"&&(s=s.call(this,this,...i)),s===void 0?t:s}localize(e,t=[]){return e=(e=String(e).replace(/\{\{(\w+).?(\w+)?\}\}/g,(i,s,o)=>{let a="";o?a=this.option(`${s[0]+s.toLowerCase().substring(1)}.l10n.${o}`):s&&(a=this.option(`l10n.${s}`)),a||(a=i);for(let r=0;rs)}on(e,t){if(Se(e)){for(const i of Object.entries(e))this.on(...i);return this}return String(e).split(" ").forEach(i=>{const s=this.events[i]=this.events[i]||[];s.indexOf(t)==-1&&s.push(t)}),this}once(e,t){if(Se(e)){for(const i of Object.entries(e))this.once(...i);return this}return String(e).split(" ").forEach(i=>{const s=(...o)=>{this.off(i,s),t.call(this,this,...o)};s._=t,this.on(i,s)}),this}off(e,t){if(!Se(e))return e.split(" ").forEach(i=>{const s=this.events[i];if(!s||!s.length)return this;let o=-1;for(let a=0,r=s.length;a1||Math.abs(t.left-this.dragStart.rect.left)>1))return e.preventDefault(),void e.stopPropagation();this.trigger("click",e)!==!1&&this.option("zoom")&&this.option("click")==="toggleZoom"&&(e.preventDefault(),e.stopPropagation(),this.zoomWithClick(e))}onWheel(e){this.trigger("wheel",e)!==!1&&this.option("zoom")&&this.option("wheel")&&this.zoomWithWheel(e)}zoomWithWheel(e){this.changedDelta===void 0&&(this.changedDelta=0);const t=Math.max(-1,Math.min(1,-e.deltaY||-e.deltaX||e.wheelDelta||-e.detail)),i=this.content.scale;let s=i*(100+t*this.option("wheelFactor"))/100;if(t<0&&Math.abs(i-this.option("minScale"))<.01||t>0&&Math.abs(i-this.option("maxScale"))<.01?(this.changedDelta+=Math.abs(t),s=i):(this.changedDelta=0,s=Math.max(Math.min(s,this.option("maxScale")),this.option("minScale"))),this.changedDelta>this.option("wheelLimit")||(e.preventDefault(),s===i))return;const o=this.$content.getBoundingClientRect(),a=e.clientX-o.left,r=e.clientY-o.top;this.zoomTo(s,{x:a,y:r})}zoomWithClick(e){const t=this.$content.getClientRects()[0],i=e.clientX-t.left,s=e.clientY-t.top;this.toggleZoom({x:i,y:s})}attachEvents(){this.$content.addEventListener("load",this.onLoad),this.$container.addEventListener("wheel",this.onWheel,{passive:!1}),this.$container.addEventListener("click",this.onClick,{passive:!1}),this.initObserver();const e=new Xt(this.$container,{start:(t,i)=>{if(!this.option("touch")||this.velocity.scale<0)return!1;const s=i.composedPath()[0];return!e.currentPointers.length&&(["BUTTON","TEXTAREA","OPTION","INPUT","SELECT","VIDEO"].indexOf(s.nodeName)!==-1||this.option("textSelection")&&((o,a,r)=>{const l=o.childNodes,d=document.createRange();for(let c=0;c=p.left&&r>=p.top&&a<=p.right&&r<=p.bottom)return u}return!1})(s,t.clientX,t.clientY))?!1:!_e(s)&&this.trigger("touchStart",i)!==!1&&(i.type==="mousedown"&&i.preventDefault(),this.state="pointerdown",this.resetDragPosition(),this.dragPosition.midPoint=null,this.dragPosition.time=Date.now(),!0)},move:(t,i,s)=>{if(this.state!=="pointerdown")return;if(this.trigger("touchMove",s)===!1)return void s.preventDefault();if(i.length<2&&this.option("panOnlyZoomed")===!0&&this.content.width<=this.viewport.width&&this.content.height<=this.viewport.height&&this.transform.scale<=this.option("baseScale")||i.length>1&&(!this.option("zoom")||this.option("pinchToZoom")===!1))return;const o=Re(t[0],t[1]),a=Re(i[0],i[1]),r=a.clientX-o.clientX,l=a.clientY-o.clientY,d=at(t[0],t[1]),c=at(i[0],i[1]),u=d&&c?c/d:1;this.dragOffset.x+=r,this.dragOffset.y+=l,this.dragOffset.scale*=u,this.dragOffset.time=Date.now()-this.dragPosition.time;const p=this.dragStart.scale===1&&this.option("lockAxis");if(p&&!this.lockAxis){if(Math.abs(this.dragOffset.x)<6&&Math.abs(this.dragOffset.y)<6)return void s.preventDefault();const f=Math.abs(180*Math.atan2(this.dragOffset.y,this.dragOffset.x)/Math.PI);this.lockAxis=f>45&&f<135?"y":"x"}if(p==="xy"||this.lockAxis!=="y"){if(s.preventDefault(),s.stopPropagation(),s.stopImmediatePropagation(),this.lockAxis&&(this.dragOffset[this.lockAxis==="x"?"y":"x"]=0),this.$container.classList.add(this.option("draggingClass")),this.transform.scale===this.option("baseScale")&&this.lockAxis==="y"||(this.dragPosition.x=this.dragStart.x+this.dragOffset.x),this.transform.scale===this.option("baseScale")&&this.lockAxis==="x"||(this.dragPosition.y=this.dragStart.y+this.dragOffset.y),this.dragPosition.scale=this.dragStart.scale*this.dragOffset.scale,i.length>1){const f=Re(e.startPointers[0],e.startPointers[1]),m=f.clientX-this.dragStart.rect.x,v=f.clientY-this.dragStart.rect.y,{deltaX:x,deltaY:h}=this.getZoomDelta(this.content.scale*this.dragOffset.scale,m,v);this.dragPosition.x-=x,this.dragPosition.y-=h,this.dragPosition.midPoint=a}else this.setDragResistance();this.transform={x:this.dragPosition.x,y:this.dragPosition.y,scale:this.dragPosition.scale},this.startAnimation()}},end:(t,i)=>{if(this.state!=="pointerdown")return;if(this._dragOffset={...this.dragOffset},e.currentPointers.length)return void this.resetDragPosition();if(this.state="decel",this.friction=this.option("decelFriction"),this.recalculateTransform(),this.$container.classList.remove(this.option("draggingClass")),this.trigger("touchEnd",i)===!1||this.state!=="decel")return;const s=this.option("minScale");if(this.transform.scale.01){const a=this.dragPosition.midPoint||t,r=this.$content.getClientRects()[0];this.zoomTo(o,{friction:.64,x:a.clientX-r.left,y:a.clientY-r.top})}}});this.pointerTracker=e}initObserver(){this.resizeObserver||(this.resizeObserver=new qt(()=>{this.updateTimer||(this.updateTimer=setTimeout(()=>{const e=this.$container.getBoundingClientRect();e.width&&e.height?((Math.abs(e.width-this.container.width)>1||Math.abs(e.height-this.container.height)>1)&&(this.isAnimating()&&this.endAnimation(!0),this.updateMetrics(),this.panTo({x:this.content.x,y:this.content.y,scale:this.option("baseScale"),friction:0})),this.updateTimer=null):this.updateTimer=null},this.updateRate))}),this.resizeObserver.observe(this.$container))}resetDragPosition(){this.lockAxis=null,this.friction=this.option("friction"),this.velocity={x:0,y:0,scale:0};const{x:e,y:t,scale:i}=this.content;this.dragStart={rect:this.$content.getBoundingClientRect(),x:e,y:t,scale:i},this.dragPosition={...this.dragPosition,x:e,y:t,scale:i},this.dragOffset={x:0,y:0,scale:1,time:0}}updateMetrics(e){e!==!0&&this.trigger("beforeUpdate");const t=this.$container,i=this.$content,s=this.$viewport,o=i instanceof HTMLImageElement,a=this.option("zoom"),r=this.option("resizeParent",a);let l=this.option("width"),d=this.option("height"),c=l||(u=i,Math.max(parseFloat(u.naturalWidth||0),parseFloat(u.width&&u.width.baseVal&&u.width.baseVal.value||0),parseFloat(u.offsetWidth||0),parseFloat(u.scrollWidth||0)));var u;let p=d||(w=>Math.max(parseFloat(w.naturalHeight||0),parseFloat(w.height&&w.height.baseVal&&w.height.baseVal.value||0),parseFloat(w.offsetHeight||0),parseFloat(w.scrollHeight||0)))(i);Object.assign(i.style,{width:l?`${l}px`:"",height:d?`${d}px`:"",maxWidth:"",maxHeight:""}),r&&Object.assign(s.style,{width:"",height:""});const f=this.option("ratio");c=j(c*f),p=j(p*f),l=c,d=p;const m=i.getBoundingClientRect(),v=s.getBoundingClientRect(),x=s==t?v:t.getBoundingClientRect();let h=Math.max(s.offsetWidth,j(v.width)),g=Math.max(s.offsetHeight,j(v.height)),y=window.getComputedStyle(s);if(h-=parseFloat(y.paddingLeft)+parseFloat(y.paddingRight),g-=parseFloat(y.paddingTop)+parseFloat(y.paddingBottom),this.viewport.width=h,this.viewport.height=g,a){if(Math.abs(c-m.width)>.1||Math.abs(p-m.height)>.1){const w=((C,k,q,z)=>{const H=Math.min(q/C||0,z/k);return{width:C*H||0,height:k*H||0}})(c,p,Math.min(c,m.width),Math.min(p,m.height));l=j(w.width),d=j(w.height)}Object.assign(i.style,{width:`${l}px`,height:`${d}px`,transform:""})}if(r&&(Object.assign(s.style,{width:`${l}px`,height:`${d}px`}),this.viewport={...this.viewport,width:l,height:d}),o&&a&&typeof this.options.maxScale!="function"){const w=this.option("maxScale");this.options.maxScale=function(){return this.content.origWidth>0&&this.content.fitWidth>0?this.content.origWidth/this.content.fitWidth:w}}this.content={...this.content,origWidth:c,origHeight:p,fitWidth:l,fitHeight:d,width:l,height:d,scale:1,isZoomable:a},this.container={width:x.width,height:x.height},e!==!0&&this.trigger("afterUpdate")}zoomIn(e){this.zoomTo(this.content.scale+(e||this.option("step")))}zoomOut(e){this.zoomTo(this.content.scale-(e||this.option("step")))}toggleZoom(e={}){const t=this.option("maxScale"),i=this.option("baseScale"),s=this.content.scale>i+.5*(t-i)?i:t;this.zoomTo(s,e)}zoomTo(e=this.option("baseScale"),{x:t=null,y:i=null}={}){e=Math.max(Math.min(e,this.option("maxScale")),this.option("minScale"));const s=j(this.content.scale/(this.content.width/this.content.fitWidth),1e7);t===null&&(t=this.content.width*s*.5),i===null&&(i=this.content.height*s*.5);const{deltaX:o,deltaY:a}=this.getZoomDelta(e,t,i);t=this.content.x-o,i=this.content.y-a,this.panTo({x:t,y:i,scale:e,friction:this.option("zoomFriction")})}getZoomDelta(e,t=0,i=0){const s=this.content.fitWidth*this.content.scale,o=this.content.fitHeight*this.content.scale,a=t>0&&s?t/s:0,r=i>0&&o?i/o:0;return{deltaX:(this.content.fitWidth*e-s)*a,deltaY:(this.content.fitHeight*e-o)*r}}panTo({x:e=this.content.x,y:t=this.content.y,scale:i,friction:s=this.option("friction"),ignoreBounds:o=!1}={}){if(i=i||this.content.scale||1,!o){const{boundX:a,boundY:r}=this.getBounds(i);a&&(e=Math.max(Math.min(e,a.to),a.from)),r&&(t=Math.max(Math.min(t,r.to),r.from))}this.friction=s,this.transform={...this.transform,x:e,y:t,scale:i},s?(this.state="panning",this.velocity={x:(1/this.friction-1)*(e-this.content.x),y:(1/this.friction-1)*(t-this.content.y),scale:(1/this.friction-1)*(i-this.content.scale)},this.startAnimation()):this.endAnimation()}startAnimation(){this.rAF?cancelAnimationFrame(this.rAF):this.trigger("startAnimation"),this.rAF=requestAnimationFrame(()=>this.animate())}animate(){if(this.setEdgeForce(),this.setDragForce(),this.velocity.x*=this.friction,this.velocity.y*=this.friction,this.velocity.scale*=this.friction,this.content.x+=this.velocity.x,this.content.y+=this.velocity.y,this.content.scale+=this.velocity.scale,this.isAnimating())this.setTransform();else if(this.state!=="pointerdown")return void this.endAnimation();this.rAF=requestAnimationFrame(()=>this.animate())}getBounds(e){let t=this.boundX,i=this.boundY;if(t!==void 0&&i!==void 0)return{boundX:t,boundY:i};t={from:0,to:0},i={from:0,to:0},e=e||this.transform.scale;const s=this.content.fitWidth*e,o=this.content.fitHeight*e,a=this.viewport.width,r=this.viewport.height;if(st.to),i&&(a=this.content.yi.to),s||o){let l=((s?t.from:t.to)-this.content.x)*e;const d=this.content.x+(this.velocity.x+l)/this.friction;d>=t.from&&d<=t.to&&(l+=this.velocity.x),this.velocity.x=l,this.recalculateTransform()}if(a||r){let l=((a?i.from:i.to)-this.content.y)*e;const d=this.content.y+(l+this.velocity.y)/this.friction;d>=i.from&&d<=i.to&&(l+=this.velocity.y),this.velocity.y=l,this.recalculateTransform()}}setDragResistance(){if(this.state!=="pointerdown")return;const{boundX:e,boundY:t}=this.getBounds(this.dragPosition.scale);let i,s,o,a;if(e&&(i=this.dragPosition.xe.to),t&&(o=this.dragPosition.yt.to),(i||s)&&(!i||!s)){const r=i?e.from:e.to,l=r-this.dragPosition.x;this.dragPosition.x=r-.3*l}if((o||a)&&(!o||!a)){const r=o?t.from:t.to,l=r-this.dragPosition.y;this.dragPosition.y=r-.3*l}}setDragForce(){this.state==="pointerdown"&&(this.velocity.x=this.dragPosition.x-this.content.x,this.velocity.y=this.dragPosition.y-this.content.y,this.velocity.scale=this.dragPosition.scale-this.content.scale)}recalculateTransform(){this.transform.x=this.content.x+this.velocity.x/(1/this.friction-1),this.transform.y=this.content.y+this.velocity.y/(1/this.friction-1),this.transform.scale=this.content.scale+this.velocity.scale/(1/this.friction-1)}isAnimating(){return!(!this.friction||!(Math.abs(this.velocity.x)>.05||Math.abs(this.velocity.y)>.05||Math.abs(this.velocity.scale)>.05))}setTransform(e){let t,i,s;if(e?(t=j(this.transform.x),i=j(this.transform.y),s=this.transform.scale,this.content={...this.content,x:t,y:i,scale:s}):(t=j(this.content.x),i=j(this.content.y),s=this.content.scale/(this.content.width/this.content.fitWidth),this.content={...this.content,x:t,y:i}),this.trigger("beforeTransform"),t=j(this.content.x),i=j(this.content.y),e&&this.option("zoom")){let o,a;o=j(this.content.fitWidth*s),a=j(this.content.fitHeight*s),this.content.width=o,this.content.height=a,this.transform={...this.transform,width:o,height:a,scale:s},Object.assign(this.$content.style,{width:`${o}px`,height:`${a}px`,maxWidth:"none",maxHeight:"none",transform:`translate3d(${t}px, ${i}px, 0) scale(1)`})}else this.$content.style.transform=`translate3d(${t}px, ${i}px, 0) scale(${s})`;this.trigger("afterTransform")}endAnimation(e){cancelAnimationFrame(this.rAF),this.rAF=null,this.velocity={x:0,y:0,scale:0},this.setTransform(!0),this.state="ready",this.handleCursor(),e!==!0&&this.trigger("endAnimation")}handleCursor(){const e=this.option("draggableClass");e&&this.option("touch")&&(this.option("panOnlyZoomed")==1&&this.content.width<=this.viewport.width&&this.content.height<=this.viewport.height&&this.transform.scale<=this.option("baseScale")?this.$container.classList.remove(e):this.$container.classList.add(e))}detachEvents(){this.$content.removeEventListener("load",this.onLoad),this.$container.removeEventListener("wheel",this.onWheel,{passive:!1}),this.$container.removeEventListener("click",this.onClick,{passive:!1}),this.pointerTracker&&(this.pointerTracker.stop(),this.pointerTracker=null),this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=null)}destroy(){this.state!=="destroy"&&(this.state="destroy",clearTimeout(this.updateTimer),this.updateTimer=null,cancelAnimationFrame(this.rAF),this.rAF=null,this.detachEvents(),this.detachPlugins(),this.resetDragPosition())}}Ee.version="4.0.31",Ee.Plugins={};const rt=(n,e)=>{let t=0;return function(...i){const s=new Date().getTime();if(!(s-t{s.preventDefault(),s.stopPropagation(),this.carousel["slide"+(e==="next"?"Next":"Prev")]()}),t}build(){this.$container||(this.$container=document.createElement("div"),this.$container.classList.add(...this.option("classNames.main").split(" ")),this.carousel.$container.appendChild(this.$container)),this.$next||(this.$next=this.createButton("next"),this.$container.appendChild(this.$next)),this.$prev||(this.$prev=this.createButton("prev"),this.$container.appendChild(this.$prev))}onRefresh(){const e=this.carousel.pages.length;e<=1||e>1&&this.carousel.elemDimWidth=e-1&&this.$next.setAttribute("disabled","")))}cleanup(){this.$prev&&this.$prev.remove(),this.$prev=null,this.$next&&this.$next.remove(),this.$next=null,this.$container&&this.$container.remove(),this.$container=null}attach(){this.carousel.on("refresh change",this.onRefresh)}detach(){this.carousel.off("refresh change",this.onRefresh),this.cleanup()}}mt.defaults={prevTpl:'',nextTpl:'',classNames:{main:"carousel__nav",button:"carousel__button",next:"is-next",prev:"is-prev"}};class vt{constructor(e){this.carousel=e,this.selectedIndex=null,this.friction=0,this.onNavReady=this.onNavReady.bind(this),this.onNavClick=this.onNavClick.bind(this),this.onNavCreateSlide=this.onNavCreateSlide.bind(this),this.onTargetChange=this.onTargetChange.bind(this)}addAsTargetFor(e){this.target=this.carousel,this.nav=e,this.attachEvents()}addAsNavFor(e){this.target=e,this.nav=this.carousel,this.attachEvents()}attachEvents(){this.nav.options.initialSlide=this.target.options.initialPage,this.nav.on("ready",this.onNavReady),this.nav.on("createSlide",this.onNavCreateSlide),this.nav.on("Panzoom.click",this.onNavClick),this.target.on("change",this.onTargetChange),this.target.on("Panzoom.afterUpdate",this.onTargetChange)}onNavReady(){this.onTargetChange(!0)}onNavClick(e,t,i){const s=i.target.closest(".carousel__slide");if(!s)return;i.stopPropagation();const o=parseInt(s.dataset.index,10),a=this.target.findPageForSlide(o);this.target.page!==a&&this.target.slideTo(a,{friction:this.friction}),this.markSelectedSlide(o)}onNavCreateSlide(e,t){t.index===this.selectedIndex&&this.markSelectedSlide(t.index)}onTargetChange(){const e=this.target.pages[this.target.page].indexes[0],t=this.nav.findPageForSlide(e);this.nav.slideTo(t),this.markSelectedSlide(e)}markSelectedSlide(e){this.selectedIndex=e,[...this.nav.slides].filter(i=>i.$el&&i.$el.classList.remove("is-nav-selected"));const t=this.nav.slides[e];t&&t.$el&&t.$el.classList.add("is-nav-selected")}attach(e){const t=e.options.Sync;(t.target||t.nav)&&(t.target?this.addAsNavFor(t.target):t.nav&&this.addAsTargetFor(t.nav),this.friction=t.friction)}detach(){this.nav&&(this.nav.off("ready",this.onNavReady),this.nav.off("Panzoom.click",this.onNavClick),this.nav.off("createSlide",this.onNavCreateSlide)),this.target&&(this.target.off("Panzoom.afterUpdate",this.onTargetChange),this.target.off("change",this.onTargetChange))}}vt.defaults={friction:.92};const Yt={Navigation:mt,Dots:class{constructor(n){this.carousel=n,this.$list=null,this.events={change:this.onChange.bind(this),refresh:this.onRefresh.bind(this)}}buildList(){if(this.carousel.pages.length{if(!("page"in e.target.dataset))return;e.preventDefault(),e.stopPropagation();const t=parseInt(e.target.dataset.page,10),i=this.carousel;t!==i.page&&(i.pages.length<3&&i.option("infinite")?i[t==0?"slidePrev":"slideNext"]():i.slideTo(t))}),this.$list=n,this.carousel.$container.appendChild(n),this.carousel.$container.classList.add("has-dots"),n}removeList(){this.$list&&(this.$list.parentNode.removeChild(this.$list),this.$list=null),this.carousel.$container.classList.remove("has-dots")}rebuildDots(){let n=this.$list;const e=!!n,t=this.carousel.pages.length;if(t<2)return void(e&&this.removeList());e||(n=this.buildList());const i=this.$list.children.length;if(i>t)for(let s=t;s{const r=a.code;let l;r==="Enter"||r==="NumpadEnter"?l=o:r==="ArrowRight"?l=o.nextSibling:r==="ArrowLeft"&&(l=o.previousSibling),l&&l.click()}),this.$list.appendChild(o)}this.setActiveDot()}}setActiveDot(){if(!this.$list)return;this.$list.childNodes.forEach(e=>{e.classList.remove("is-selected")});const n=this.$list.childNodes[this.carousel.page];n&&n.classList.add("is-selected")}onChange(){this.setActiveDot()}onRefresh(){this.rebuildDots()}attach(){this.carousel.on(this.events)}detach(){this.removeList(),this.carousel.off(this.events),this.carousel=null}},Sync:vt},Ut={slides:[],preload:0,slidesPerPage:"auto",initialPage:null,initialSlide:null,friction:.92,center:!0,infinite:!0,fill:!0,dragFree:!1,prefix:"",classNames:{viewport:"carousel__viewport",track:"carousel__track",slide:"carousel__slide",slideSelected:"is-selected"},l10n:{NEXT:"Next slide",PREV:"Previous slide",GOTO:"Go to slide #%d"}};class Te extends Je{constructor(e,t={}){if(super(t=K(!0,{},Ut,t)),this.state="init",this.$container=e,!(this.$container instanceof HTMLElement))throw new Error("No root element provided");this.slideNext=rt(this.slideNext.bind(this),250),this.slidePrev=rt(this.slidePrev.bind(this),250),this.init(),e.__Carousel=this}init(){this.pages=[],this.page=this.pageIndex=null,this.prevPage=this.prevPageIndex=null,this.attachPlugins(Te.Plugins),this.trigger("init"),this.initLayout(),this.initSlides(),this.updateMetrics(),this.$track&&this.pages.length&&(this.$track.style.transform=`translate3d(${-1*this.pages[this.page].left}px, 0px, 0) scale(1)`),this.manageSlideVisiblity(),this.initPanzoom(),this.state="ready",this.trigger("ready")}initLayout(){const e=this.option("prefix"),t=this.option("classNames");this.$viewport=this.option("viewport")||this.$container.querySelector(`.${e}${t.viewport}`),this.$viewport||(this.$viewport=document.createElement("div"),this.$viewport.classList.add(...(e+t.viewport).split(" ")),this.$viewport.append(...this.$container.childNodes),this.$container.appendChild(this.$viewport)),this.$track=this.option("track")||this.$container.querySelector(`.${e}${t.track}`),this.$track||(this.$track=document.createElement("div"),this.$track.classList.add(...(e+t.track).split(" ")),this.$track.append(...this.$viewport.childNodes),this.$viewport.appendChild(this.$track))}initSlides(){this.slides=[],this.$viewport.querySelectorAll(`.${this.option("prefix")}${this.option("classNames.slide")}`).forEach(e=>{const t={$el:e,isDom:!0};this.slides.push(t),this.trigger("createSlide",t,this.slides.length)}),Array.isArray(this.options.slides)&&(this.slides=K(!0,[...this.slides],this.options.slides))}updateMetrics(){let e,t=0,i=[];this.slides.forEach((f,m)=>{const v=f.$el,x=f.isDom||!e?this.getSlideMetrics(v):e;f.index=m,f.width=x,f.left=t,e=x,t+=x,i.push(m)});let s=Math.max(this.$track.offsetWidth,j(this.$track.getBoundingClientRect().width)),o=getComputedStyle(this.$track);s-=parseFloat(o.paddingLeft)+parseFloat(o.paddingRight),this.contentWidth=t,this.viewportWidth=s;const a=[],r=this.option("slidesPerPage");if(Number.isInteger(r)&&t>s)for(let f=0;fs)&&(a.push({indexes:[],slides:[]}),f=a.length-1,m=0),m+=x.width,a[f].indexes.push(v),a[f].slides.push(x)}}const l=this.option("center"),d=this.option("fill");a.forEach((f,m)=>{f.index=m,f.width=f.slides.reduce((v,x)=>v+x.width,0),f.left=f.slides[0].left,l&&(f.left+=.5*(s-f.width)*-1),d&&!this.option("infiniteX",this.option("infinite"))&&t>s&&(f.left=Math.max(f.left,0),f.left=Math.min(f.left,t-s))});const c=[];let u;a.forEach(f=>{const m={...f};u&&m.left===u.left?(u.width+=m.width,u.slides=[...u.slides,...m.slides],u.indexes=[...u.indexes,...m.indexes]):(m.index=c.length,u=m,c.push(m))}),this.pages=c;let p=this.page;if(p===null){const f=this.option("initialSlide");p=f!==null?this.findPageForSlide(f):parseInt(this.option("initialPage",0),10)||0,c[p]||(p=c.length&&p>c.length?c[c.length-1].index:0),this.page=p,this.pageIndex=p}this.updatePanzoom(),this.trigger("refresh")}getSlideMetrics(e){if(!e){const s=this.slides[0];(e=document.createElement("div")).dataset.isTestEl=1,e.style.visibility="hidden",e.classList.add(...(this.option("prefix")+this.option("classNames.slide")).split(" ")),s.customClass&&e.classList.add(...s.customClass.split(" ")),this.$track.prepend(e)}let t=Math.max(e.offsetWidth,j(e.getBoundingClientRect().width));const i=e.currentStyle||window.getComputedStyle(e);return t=t+(parseFloat(i.marginLeft)||0)+(parseFloat(i.marginRight)||0),e.dataset.isTestEl&&e.remove(),t}findPageForSlide(e){e=parseInt(e,10)||0;const t=this.pages.find(i=>i.indexes.indexOf(e)>-1);return t?t.index:null}slideNext(){this.slideTo(this.pageIndex+1)}slidePrev(){this.slideTo(this.pageIndex-1)}slideTo(e,t={}){const{x:i=-1*this.setPage(e,!0),y:s=0,friction:o=this.option("friction")}=t;this.Panzoom.content.x===i&&!this.Panzoom.velocity.x&&o||(this.Panzoom.panTo({x:i,y:s,friction:o,ignoreBounds:!0}),this.state==="ready"&&this.Panzoom.state==="ready"&&this.trigger("settle"))}initPanzoom(){this.Panzoom&&this.Panzoom.destroy();const e=K(!0,{},{content:this.$track,wrapInner:!1,resizeParent:!1,zoom:!1,click:!1,lockAxis:"x",x:this.pages.length?-1*this.pages[this.page].left:0,centerOnStart:!1,textSelection:()=>this.option("textSelection",!1),panOnlyZoomed:function(){return this.content.width<=this.viewport.width}},this.option("Panzoom"));this.Panzoom=new Ee(this.$container,e),this.Panzoom.on({"*":(t,...i)=>this.trigger(`Panzoom.${t}`,...i),afterUpdate:()=>{this.updatePage()},beforeTransform:this.onBeforeTransform.bind(this),touchEnd:this.onTouchEnd.bind(this),endAnimation:()=>{this.trigger("settle")}}),this.updateMetrics(),this.manageSlideVisiblity()}updatePanzoom(){this.Panzoom&&(this.Panzoom.content={...this.Panzoom.content,fitWidth:this.contentWidth,origWidth:this.contentWidth,width:this.contentWidth},this.pages.length>1&&this.option("infiniteX",this.option("infinite"))?this.Panzoom.boundX=null:this.pages.length&&(this.Panzoom.boundX={from:-1*this.pages[this.pages.length-1].left,to:-1*this.pages[0].left}),this.option("infiniteY",this.option("infinite"))?this.Panzoom.boundY=null:this.Panzoom.boundY={from:0,to:0},this.Panzoom.handleCursor())}manageSlideVisiblity(){const e=this.contentWidth,t=this.viewportWidth;let i=this.Panzoom?-1*this.Panzoom.content.x:this.pages.length?this.pages[this.page].left:0;const s=this.option("preload"),o=this.option("infiniteX",this.option("infinite")),a=parseFloat(getComputedStyle(this.$viewport,null).getPropertyValue("padding-left")),r=parseFloat(getComputedStyle(this.$viewport,null).getPropertyValue("padding-right"));this.slides.forEach(c=>{let u,p,f=0;u=i-a,p=i+t+r,u-=s*(t+a+r),p+=s*(t+a+r);const m=c.left+c.width>u&&c.leftu&&c.leftu&&c.lefti&&c.left<=i+t+r&&(f=0)):this.removeSlideEl(c),c.hasDiff=f});let l=0,d=0;this.slides.forEach((c,u)=>{let p=0;c.$el?(u!==l||c.hasDiff?p=d+c.hasDiff*e:d=0,c.$el.style.left=Math.abs(p)>.1?`${d+c.hasDiff*e}px`:"",l++):d+=c.width}),this.markSelectedSlides()}createSlideEl(e){if(!e)return;if(e.$el){let a=e.$el.dataset.index;if(!a||parseInt(a,10)!==e.index){let r;e.$el.dataset.index=e.index,e.$el.querySelectorAll("[data-lazy-srcset]").forEach(l=>{l.srcset=l.dataset.lazySrcset}),e.$el.querySelectorAll("[data-lazy-src]").forEach(l=>{let d=l.dataset.lazySrc;l instanceof HTMLImageElement?l.src=d:l.style.backgroundImage=`url('${d}')`}),(r=e.$el.dataset.lazySrc)&&(e.$el.style.backgroundImage=`url('${r}')`),e.state="ready"}return}const t=document.createElement("div");t.dataset.index=e.index,t.classList.add(...(this.option("prefix")+this.option("classNames.slide")).split(" ")),e.customClass&&t.classList.add(...e.customClass.split(" ")),e.html&&(t.innerHTML=e.html);const i=[];this.slides.forEach((a,r)=>{a.$el&&i.push(r)});const s=e.index;let o=null;if(i.length){let a=i.reduce((r,l)=>Math.abs(l-s){const o=i.$el;if(!o)return;const a=this.pages[this.page];a&&a.indexes&&a.indexes.indexOf(s)>-1?(e&&!o.classList.contains(e)&&(o.classList.add(e),this.trigger("selectSlide",i)),o.removeAttribute(t)):(e&&o.classList.contains(e)&&(o.classList.remove(e),this.trigger("unselectSlide",i)),o.setAttribute(t,!0))})}updatePage(){this.updateMetrics(),this.slideTo(this.page,{friction:0})}onBeforeTransform(){this.option("infiniteX",this.option("infinite"))&&this.manageInfiniteTrack(),this.manageSlideVisiblity()}manageInfiniteTrack(){const e=this.contentWidth,t=this.viewportWidth;if(!this.option("infiniteX",this.option("infinite"))||this.pages.length<2||et&&(i.content.x-=e,this.pageIndex=this.pageIndex+this.pages.length,s=!0),s&&i.state==="pointerdown"&&i.resetDragPosition(),s}onTouchEnd(e,t){const i=this.option("dragFree");if(!i&&this.pages.length>1&&e.dragOffset.time<350&&Math.abs(e.dragOffset.y)<1&&Math.abs(e.dragOffset.x)>5)this[e.dragOffset.x<0?"slideNext":"slidePrev"]();else if(i){const[,s]=this.getPageFromPosition(-1*e.transform.x);this.setPage(s)}else this.slideToClosest()}slideToClosest(e={}){let[,t]=this.getPageFromPosition(-1*this.Panzoom.content.x);this.slideTo(t,e)}getPageFromPosition(e){const t=this.pages.length;this.option("center")&&(e+=.5*this.viewportWidth);const i=Math.floor(e/this.contentWidth);e-=i*this.contentWidth;let s=this.slides.find(o=>o.left<=e&&o.left+o.width>e);if(s){let o=this.findPageForSlide(s.index);return[o,o+i*t]}return[0,0]}setPage(e,t){let i=0,s=parseInt(e,10)||0;const o=this.page,a=this.pageIndex,r=this.pages.length,l=this.contentWidth,d=this.viewportWidth;if(e=(s%r+r)%r,this.option("infiniteX",this.option("infinite"))&&l>d){const c=Math.floor(s/r)||0,u=l;if(i=this.pages[e].left+c*u,t===!0&&r>2){let p=-1*this.Panzoom.content.x;const f=i-u,m=i+u,v=Math.abs(p-i),x=Math.abs(p-f),h=Math.abs(p-m);h{this.removeSlideEl(e)}),this.slides=[],this.Panzoom.destroy(),this.detachPlugins()}}Te.version="4.0.31",Te.Plugins=Yt;const Fe=!(typeof window>"u"||!window.document||!window.document.createElement);let He=null;const lt=["a[href]","area[href]",'input:not([disabled]):not([type="hidden"]):not([aria-hidden])',"select:not([disabled]):not([aria-hidden])","textarea:not([disabled]):not([aria-hidden])","button:not([disabled]):not([aria-hidden])","iframe","object","embed","video","audio","[contenteditable]",'[tabindex]:not([tabindex^="-"]):not([disabled]):not([aria-hidden])'],Pe=n=>{if(n&&Fe){He===null&&document.createElement("div").focus({get preventScroll(){return He=!0,!1}});try{if(n.setActive)n.setActive();else if(He)n.focus({preventScroll:!0});else{const e=window.pageXOffset||document.body.scrollTop,t=window.pageYOffset||document.body.scrollLeft;n.focus(),document.body.scrollTo({top:e,left:t,behavior:"auto"})}}catch{}}},Zt={minSlideCount:2,minScreenHeight:500,autoStart:!0,key:"t",Carousel:{},tpl:`
`};class yt{constructor(e){this.fancybox=e,this.$container=null,this.state="init";for(const t of["onPrepare","onClosing","onKeydown"])this[t]=this[t].bind(this);this.events={prepare:this.onPrepare,closing:this.onClosing,keydown:this.onKeydown}}onPrepare(){this.getSlides().length=this.fancybox.option("Thumbs.minScreenHeight")&&this.build()}onClosing(){this.Carousel&&this.Carousel.Panzoom.detachEvents()}onKeydown(e,t){t===e.option("Thumbs.key")&&this.toggle()}build(){if(this.$container)return;const e=document.createElement("div");e.classList.add("fancybox__thumbs"),this.fancybox.$carousel.parentNode.insertBefore(e,this.fancybox.$carousel.nextSibling),this.Carousel=new Te(e,K(!0,{Dots:!1,Navigation:!1,Sync:{friction:0},infinite:!1,center:!0,fill:!0,dragFree:!0,slidesPerPage:1,preload:1},this.fancybox.option("Thumbs.Carousel"),{Sync:{target:this.fancybox.Carousel},slides:this.getSlides()})),this.Carousel.Panzoom.on("wheel",(t,i)=>{i.preventDefault(),this.fancybox[i.deltaY<0?"prev":"next"]()}),this.$container=e,this.state="visible"}getSlides(){const e=[];for(const t of this.fancybox.items){const i=t.thumb;i&&e.push({html:this.fancybox.option("Thumbs.tpl").replace(/\{\{src\}\}/gi,i),customClass:`has-thumb has-${t.type||"image"}`})}return e}toggle(){this.state==="visible"?this.hide():this.state==="hidden"?this.show():this.build()}show(){this.state==="hidden"&&(this.$container.style.display="",this.Carousel.Panzoom.attachEvents(),this.state="visible")}hide(){this.state==="visible"&&(this.Carousel.Panzoom.detachEvents(),this.$container.style.display="none",this.state="hidden")}cleanup(){this.Carousel&&(this.Carousel.destroy(),this.Carousel=null),this.$container&&(this.$container.remove(),this.$container=null),this.state="init"}attach(){this.fancybox.on(this.events)}detach(){this.fancybox.off(this.events),this.cleanup()}}yt.defaults=Zt;const ct=(n,e)=>{const t=new URL(n),i=new URLSearchParams(t.search);let s=new URLSearchParams;for(const[a,r]of[...i,...Object.entries(e)])a==="t"?s.set("start",parseInt(r)):s.set(a,r);s=s.toString();let o=n.match(/#t=((.*)?\d+s)/);return o&&(s+=`#t=${o[1]}`),s},bt={video:{autoplay:!0,ratio:16/9},youtube:{autohide:1,fs:1,rel:0,hd:1,wmode:"transparent",enablejsapi:1,html5:1},vimeo:{hd:1,show_title:1,show_byline:1,show_portrait:0,fullscreen:1},html5video:{tpl:`