/* root 1 */ :root { --cloudx_cms-paletteIndigo10: rgb(32, 6, 71); --cloudx_cms-popoverWalkthroughHeaderImage: 1; --cloudx_cms-zIndexDialog: 6000; --cloudx_cms-colorPickerSelectorWidth: 14rem; --cloudx_cms-nubbinSizeDefault: 1rem; --cloudx_cms-paletteCloudBlue40: rgb(5, 98, 138); --cloudx_cms-colorBackgroundContextBarInverseItemHover: rgba(255, 255, 255, 0.2); --cloudx_cms-dropZoneSlotHeight: 0.25rem; --cloudx_cms-colorTextTabLabelSelected: rgb(1, 118, 211); --cloudx_cms-colorStrokeBrandActive: rgb(3, 45, 96); --cloudx_cms-paletteIndigo15: rgb(31, 9, 116); --cloudx_cms-cardBodyPadding: 0 1rem; --cloudx_cms-varSpacingHorizontalSmall: 0.75rem; --cloudx_cms-tableColorBackgroundHeaderResizableHandle: rgb(174, 174, 174); --cloudx_cms-colorBackgroundPathActiveHover: rgb(3, 45, 96); --cloudx_cms-brandPrimaryTransparent: rgba(21, 137, 238, 0.1); --cloudx_cms-brandPrimaryTransparent40: rgba(21, 137, 238, 0.4); --cloudx_cms-colorBorderButtonDefault: rgb(201, 201, 201); --cloudx_cms-paletteIndigo20: rgb(50, 29, 113); --cloudx_cms-popoverColorText: rgb(201, 201, 201); --cloudx_cms-paletteCloudBlue30: rgb(8, 73, 104); --cloudx_cms-colorTextButtonDefaultActive: rgb(1, 118, 211); --cloudx_cms-colorPickerSliderHeight: 1.5rem; --cloudx_cms-colorTextIconInverse: rgb(255, 255, 255); --cloudx_cms-heightFooter: 3.75rem; --cloudx_cms-splitViewColorBorder: rgb(201, 201, 201); --cloudx_cms-colorBorderRowSelectedHover: rgb(27, 150, 255); --cloudx_cms-fontSizeTextXxSmall: 0.625rem; --cloudx_cms-lineHeightHeading: 1.25; --cloudx_cms-cardHeaderMargin: 0 0 0.75rem; --cloudx_cms-paletteIndigo30: rgb(47, 44, 183); --cloudx_cms-mqMediumLandscape: only screen and (min-width: 48em) and (min-aspect-ratio: 4/3); --cloudx_cms-brandBandImageHeightMedium: 12.5rem; --cloudx_cms-illustrationColorSecondary: rgb(207, 233, 254); --cloudx_cms-zIndexDefault: 1; --cloudx_cms-colorBorderSelectionActive: rgb(243, 243, 243); --cloudx_cms-paletteCloudBlue20: rgb(2, 50, 72); --cloudx_cms-utilityBarColorBackgroundNotificationFocus: rgb(201, 201, 201); --cloudx_cms-colorTextIconDefaultDisabled: rgb(201, 201, 201); --cloudx_cms-colorTextBrand: rgb(27, 150, 255); --cloudx_cms-durationToastMedium: 9.6s; --cloudx_cms-colorBackgroundButtonIconActive: rgb(243, 243, 243); --cloudx_cms-brandHeaderContrastWeak: rgb(145, 145, 145); --cloudx_cms-colorBackgroundNotificationNew: rgb(243, 243, 243); --cloudx_cms-brandHeaderContrastInverseActive: rgb(238, 238, 238); --cloudx_cms-colorBackgroundInputCheckboxSelected: rgb(27, 150, 255); --cloudx_cms-progressColorBorder: rgb(255, 255, 255); --cloudx_cms-spacingXxxSmall: 0.125rem; --cloudx_cms-paletteIndigo40: rgb(58, 73, 218); --cloudx_cms-colorBackgroundProgressRingContent: rgb(255, 255, 255); --cloudx_cms-lineHeightButtonSmall: 1.75rem; --cloudx_cms-salesforceSansBoldItalicWoff: url(../fonts/SalesforceSans-BoldItalic.woff); --cloudx_cms-brandBackgroundDarkTransparent: rgba(221, 219, 218, 0); --cloudx_cms-colorPickerThumbWidth: 0.375rem; --cloudx_cms-paletteCloudBlue10: rgb(0, 26, 40); --cloudx_cms-brandHeaderIconActive: rgb(129, 129, 129); --cloudx_cms-widthStageLeftCollapsed: 4rem; --cloudx_cms-paletteCloudBlue15: rgb(10, 38, 54); --cloudx_cms-colorBorderOffline: rgb(68, 68, 68); --cloudx_cms-colorBackgroundUtilityBarHover: rgb(243, 243, 243); --cloudx_cms-sliderHandleColorBackgroundHover: rgb(1, 118, 211); --cloudx_cms-colorTextIconInverseHint: rgba(255, 255, 255, 0.5); --cloudx_cms-sizeMedium: 20rem; --cloudx_cms-brandPrimaryTransparent10: rgba(21, 137, 238, 0.1); --cloudx_cms-colorBorderIconInverseHintHover: rgba(255, 255, 255, 0.75); --cloudx_cms-colorTextDefault: rgb(3, 45, 96); --cloudx_cms-paletteIndigo50: rgb(88, 103, 232); --cloudx_cms-progressBarHeight: 0.125rem; --cloudx_cms-colorBackgroundWarning: rgb(254, 147, 57); --cloudx_cms-colorBackgroundBrandPrimaryActive: rgb(3, 45, 96); --cloudx_cms-paletteBlue90: rgb(216, 230, 254); --cloudx_cms-brandHeaderContrastCool: rgb(1, 68, 134); --cloudx_cms-paletteCloudBlue80: rgb(144, 208, 254); --cloudx_cms-paletteBlue95: rgb(238, 244, 255); --cloudx_cms-colorBorderSelectionHover: rgb(27, 150, 255); --cloudx_cms-zIndexPopup: 5000; --cloudx_cms-borderRadiusLarge: 0.5rem; --cloudx_cms-colorTextIconInverseHintHover: rgba(255, 255, 255, 0.75); --cloudx_cms-popoverBrandBorderWidth: 0.25rem; --cloudx_cms-fontSizeHeadingXLarge: 1.75rem; --cloudx_cms-typingIconDotColorBackgroundGrayDark: rgb(201, 201, 201); --cloudx_cms-paletteIndigo65: rgb(142, 155, 239); --cloudx_cms-varSpacingLarge: 1.5rem; --cloudx_cms-pageHeaderSpacingMargin: 0; --cloudx_cms-fontSizeTextXLarge: 1.25rem; --cloudx_cms-paletteIndigo60: rgb(127, 140, 237); --cloudx_cms-paletteCloudBlue70: rgb(26, 185, 255); --cloudx_cms-welcomeMatColorActionShadow: rgba(0, 0, 0, 0.05); --cloudx_cms-colorTextBrowser: rgb(255, 255, 255); --cloudx_cms-welcomeMatSpacingInfo: 7.75rem; --cloudx_cms-mqLarge: only screen and (min-width: 64.0625em); --cloudx_cms-paletteIndigo70: rgb(158, 169, 241); --cloudx_cms-squareTappableSmall: 2rem; --cloudx_cms-colorTextActionLabel: rgb(116, 116, 116); --cloudx_cms-paletteCloudBlue60: rgb(13, 157, 218); --cloudx_cms-paletteBlue70: rgb(120, 176, 253); --cloudx_cms-colorBorderTabActive: rgb(255, 255, 255); --cloudx_cms-paletteCloudBlue65: rgb(8, 171, 237); --cloudx_cms-globalnavigationItemHeightAccentFocus: 4px; --cloudx_cms-colorBorderDestructiveHover: rgb(186, 5, 23); --cloudx_cms-buttonLineHeightTouch: 2.65rem; --cloudx_cms-colorTextCustomer: rgb(254, 147, 57); --cloudx_cms-squareIconUtilitySmall: 1rem; --cloudx_cms-colorBackgroundModalButtonActive: rgba(0, 0, 0, 0.16); --cloudx_cms-colorTextBrandPrimary: rgb(255, 255, 255); --cloudx_cms-squareIconXSmallBoundary: 1.25rem; --cloudx_cms-widthToggle: 3rem; --cloudx_cms-paletteIndigo80: rgb(190, 199, 246); --cloudx_cms-welcomeMatMinHeight: 25rem; --cloudx_cms-zIndexDocked: 4; --cloudx_cms-squareIconMediumBoundaryAlt: 2.25rem; --cloudx_cms-colorBorderSelection: rgb(1, 118, 211); --cloudx_cms-paletteBlue80: rgb(170, 203, 255); --cloudx_cms-paletteCloudBlue50: rgb(16, 124, 173); --cloudx_cms-brandHeaderContrastActive: rgb(80, 80, 80); --cloudx_cms-formLabelFontSize: 0.75rem; --cloudx_cms-colorTextActionLabelActive: rgb(3, 45, 96); --cloudx_cms-colorBackgroundBackdropTint: rgb(243, 243, 243); --cloudx_cms-durationSlowly: 0.4s; --cloudx_cms-colorBackgroundRowHover: rgb(243, 243, 243); --cloudx_cms-popoverWalkthroughAltNubbinColorBackground: rgb(1, 118, 211); --cloudx_cms-spinnerSizeSmall: 1.25rem; --cloudx_cms-sliderTrackColorBackgroundFill: rgb(27, 150, 255); --cloudx_cms-welcomeMatWidth: 52.0625rem; --cloudx_cms-paletteIndigo95: rgb(241, 243, 251); --cloudx_cms-paletteIndigo90: rgb(224, 229, 248); --cloudx_cms-filesZIndexHover: 5; --cloudx_cms-colorTextPill: rgb(1, 118, 211); --cloudx_cms-varSpacingSmall: 0.75rem; --cloudx_cms-heightDockedBar: 2.5rem; --cloudx_cms-paletteBlue50: rgb(1, 118, 211); --cloudx_cms-colorTextTabLabelHover: rgb(1, 68, 134); --cloudx_cms-fontSizeHeadingXSmall: 0.75rem; --cloudx_cms-colorStrokeDisabled: rgb(243, 243, 243); --cloudx_cms-widthPathBorderCurrent: 0.125rem; --cloudx_cms-colorBackgroundButtonDefaultHover: rgb(243, 243, 243); --cloudx_cms-varSpacingVerticalXxSmall: 0.25rem; --cloudx_cms-colorTextButtonDefaultHover: rgb(1, 118, 211); --cloudx_cms-durationPromptly: 0.2s; --cloudx_cms-colorBorderPathCurrent: rgb(1, 68, 134); --cloudx_cms-colorBackgroundButtonDefaultActive: rgb(243, 243, 243); --cloudx_cms-colorTextStageLeft: rgb(243, 243, 243); --cloudx_cms-colorBorderHint: rgb(3, 45, 96); --cloudx_cms-colorTextPrimary: rgb(3, 45, 96); --cloudx_cms-brandBandColorBackgroundSecondaryTransparent: rgba(0, 0, 0, 0); --cloudx_cms-paletteBlue60: rgb(27, 150, 255); --cloudx_cms-cardColorBackground: rgb(255, 255, 255); --cloudx_cms-brandHeaderIcon: rgb(145, 145, 145); --cloudx_cms-paletteBlue65: rgb(87, 163, 253); --cloudx_cms-spacingLarge: 1.5rem; --cloudx_cms-pageHeaderColorBorder: rgba(0, 0, 0, 0); --cloudx_cms-cardFooterMargin: 0.75rem; --cloudx_cms-fontSizeTextSmall: 0.8125rem; --cloudx_cms-colorTextLinkInverseActive: rgba(255, 255, 255, 0.5); --cloudx_cms-durationToastShort: 4.8s; --cloudx_cms-lineHeightButton: 1.875rem; --cloudx_cms-panelDockedLeftShadow: 1px 0 3px rgba(0, 0, 0, 0.25); --cloudx_cms-panelDockedRightShadow: -1px 0 3px 0 rgba(0, 0, 0, 0.25); --cloudx_cms-colorTextLinkPrimaryHover: rgb(1, 118, 211); --cloudx_cms-shadowButton: 0 1px 1px 0 rgba(0, 0, 0, 0.05); --cloudx_cms-welcomeMatMaxHeight: 37.5rem; --cloudx_cms-colorBorderToggleChecked: rgb(255, 255, 255); --cloudx_cms-shadowHeader: 0 2px 4px rgba(0, 0, 0, 0.07); --cloudx_cms-sizeXxLarge: 60rem; --cloudx_cms-colorBackgroundDockedPanelHeader: rgb(255, 255, 255); --cloudx_cms-paletteBlue30: rgb(1, 68, 134); --cloudx_cms-lineHeightSalespath: 1.5rem; --cloudx_cms-shadowDrag: 0 2px 4px 0 rgba(0, 0, 0, 0.40); --cloudx_cms-colorBackgroundPathExpanded: rgb(255, 255, 255); --cloudx_cms-colorBackground: rgb(243, 243, 243); --cloudx_cms-colorBackgroundInput: rgb(255, 255, 255); --cloudx_cms-sizeSmall: 15rem; --cloudx_cms-userDefaultAvatar: url(/_slds/images/profile_avatar_200.png?cache=7bdcafae); --cloudx_cms-colorTextButtonInverse: rgb(243, 243, 243); --cloudx_cms-colorBackgroundInputCheckboxDisabled: rgb(201, 201, 201); --cloudx_cms-tableColorTextHeader: rgb(68, 68, 68); --cloudx_cms-paletteBlue40: rgb(11, 92, 171); --cloudx_cms-cardColorBorder: rgb(201, 201, 201); --cloudx_cms-squareIconUtilityMedium: 1.25rem; --cloudx_cms-colorBackgroundButtonSuccessHover: rgb(46, 132, 74); --cloudx_cms-colorBorderButtonBrandDisabled: rgba(0, 0, 0, 0); --cloudx_cms-fontSizeHeadingXxSmall: 0.625rem; --cloudx_cms-colorBackgroundButtonInverseActive: rgba(0, 0, 0, 0.24); --cloudx_cms-illustrationEmptyStateEvents: url(/_slds/images/illustrations/empty-state-events.svg?cache=985b247a); --cloudx_cms-colorBackgroundToggle: rgb(174, 174, 174); --cloudx_cms-colorBackgroundStencil: rgb(243, 243, 243); --cloudx_cms-welcomeMatCheckSize: 0.625rem; --cloudx_cms-colorTextButtonBrandHover: rgb(255, 255, 255); --cloudx_cms-buttonColorBackgroundSecondary: rgba(255, 255, 255, 0.8); --cloudx_cms-paletteBlue10: rgb(0, 22, 57); --cloudx_cms-varSpacingVerticalLarge: 1.5rem; --cloudx_cms-colorBorderReminder: rgb(243, 243, 243); --cloudx_cms-colorBrandDark: rgb(1, 118, 211); --cloudx_cms-paletteBlue15: rgb(3, 35, 77); --cloudx_cms-colorBorderBrandPrimaryFocus: rgb(1, 118, 211); --cloudx_cms-salesforceSansItalicWoff: url(../fonts/SalesforceSans-Italic.woff); --cloudx_cms-colorBorderBrandPrimaryActive: rgb(3, 45, 96); --cloudx_cms-datepickerColorTextDayAdjacentMonth: rgb(116, 116, 116); --cloudx_cms-colorBorderErrorAlt: rgb(254, 143, 125); --cloudx_cms-shadowReminder: 0 2px 3px 0 rgba(0, 0, 0, 0.20); --cloudx_cms-brandTextLinkActive: rgb(1, 68, 134); --cloudx_cms-pageHeaderColorBackground: rgb(243, 243, 243); --cloudx_cms-salesforceSansBoldWoff2: url(../fonts/SalesforceSans-Bold.woff2); --cloudx_cms-fontSizeHeadingLarge: 1.5rem; --cloudx_cms-colorBackgroundStencilAlt: rgb(243, 243, 243); --cloudx_cms-paletteBlue20: rgb(3, 45, 96); --cloudx_cms-elevationInverseShadow3Below: 0 -3px 3px 0 rgba(0, 0, 0, 0.16) inset; --cloudx_cms-varSpacingHorizontalXxSmall: 0.25rem; --cloudx_cms-colorBorderSeparatorAlt: rgb(201, 201, 201); --cloudx_cms-colorPickerRangeHeight: 5rem; --cloudx_cms-colorBackgroundButtonIcon: rgba(0, 0, 0, 0); --cloudx_cms-paletteTeal15: rgb(7, 40, 37); --cloudx_cms-buttonIconColorBorderPrimary: rgb(255, 255, 255); --cloudx_cms-brandAccessibleActive: rgb(1, 68, 134); --cloudx_cms-paletteYellow80: rgb(252, 192, 3); --cloudx_cms-zIndexSpinner: 9050; --cloudx_cms-colorBackgroundContextTabBarItem: rgb(255, 255, 255); --cloudx_cms-fontWeightBold: 700; --cloudx_cms-paletteTeal10: rgb(7, 27, 18); --cloudx_cms-colorBackgroundContextBarItemActive: rgb(255, 255, 255); --cloudx_cms-shadowFocusInset: 0 0 2px 2px #1b96ff inset; --cloudx_cms-colorBackgroundAltInverse: rgb(3, 45, 96); --cloudx_cms-colorBackgroundPathIncompleteHover: rgb(201, 201, 201); --cloudx_cms-squareIconMediumContent: 1rem; --cloudx_cms-colorBackgroundContextBar: rgb(255, 255, 255); --cloudx_cms-colorTextInverseHover: rgb(174, 174, 174); --cloudx_cms-colorBackgroundInputActive: rgb(255, 255, 255); --cloudx_cms-brandContrast: rgb(26, 27, 30); --cloudx_cms-colorTextSecondary: rgb(116, 116, 116); --cloudx_cms-fillHeaderButtonHover: rgb(1, 68, 134); --cloudx_cms-fontFamilyText: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; --cloudx_cms-welcomeMatCompleteIconSize: 1.25rem; --cloudx_cms-varSpacingXxLarge: 3rem; --cloudx_cms-paletteYellow95: rgb(251, 243, 224); --cloudx_cms-paletteYellow90: rgb(249, 227, 182); --cloudx_cms-brandBackgroundPrimary: rgb(250, 250, 249); --cloudx_cms-paletteTeal20: rgb(2, 52, 52); --cloudx_cms-progressRingWidth: 0.1875rem; --cloudx_cms-paletteYellow65: rgb(215, 147, 4); --cloudx_cms-paletteYellow60: rgb(202, 133, 1); --cloudx_cms-colorBorderInputCheckboxSelectedCheckmark: rgb(255, 255, 255); --cloudx_cms-colorBorderCanvasElementSelectionHover: rgb(1, 68, 134); --cloudx_cms-borderRadiusSmall: 0.125rem; --cloudx_cms-progressBarColorBackground: rgb(201, 201, 201); --cloudx_cms-durationInstantly: 0s; --cloudx_cms-colorBackgroundToastSuccess: rgb(46, 132, 74); --cloudx_cms-tabsFontWeight: 400; --cloudx_cms-colorBackgroundPost: rgb(243, 243, 243); --cloudx_cms-colorTextPlaceholderInverse: rgb(243, 243, 243); --cloudx_cms-colorTextInputIcon: rgb(174, 174, 174); --cloudx_cms-sliderHandleShadow: rgba(0, 0, 0, 0.16) 0 2px 3px; --cloudx_cms-paletteYellow70: rgb(228, 162, 1); --cloudx_cms-fontWeightLight: 300; --cloudx_cms-colorTextError: rgb(234, 0, 30); --cloudx_cms-varSpacingXxSmall: 0.25rem; --cloudx_cms-colorBorderInput: rgb(201, 201, 201); --cloudx_cms-brandAccessible: rgb(1, 118, 211); --cloudx_cms-pageColorBackgroundPrimary: rgb(255, 255, 255); --cloudx_cms-cardShadow: none; --cloudx_cms-lineClamp: 3; --cloudx_cms-welcomeMatWidthProgressBar: 12.5rem; --cloudx_cms-progressColorBackgroundShade: rgb(243, 243, 243); --cloudx_cms-globalActionFillHover: rgb(1, 68, 134); --cloudx_cms-illustrationEmptyStateAssistant: url(/_slds/images/illustrations/empty-state-assistant.svg?cache=127a789e); --cloudx_cms-varSpacingHorizontalXSmall: 0.5rem; --cloudx_cms-colorPickerInputCustomHexFontSize: 0.75rem; --cloudx_cms-varSpacingMedium: 1rem; --cloudx_cms-colorBackgroundShadeDark: rgb(201, 201, 201); --cloudx_cms-colorPickerSwatchesWidth: 13.3rem; --cloudx_cms-squareIconLargeBoundaryAlt: 5rem; --cloudx_cms-colorBorderInputDisabled: rgb(201, 201, 201); --cloudx_cms-paletteYellow40: rgb(140, 75, 2); --cloudx_cms-cardWrapperSpacing: 1rem; --cloudx_cms-colorBackgroundNotificationBadgeActive: rgb(3, 45, 96); --cloudx_cms-colorBackgroundHighlight: rgb(250, 255, 189); --cloudx_cms-colorBackgroundRowActive: rgb(243, 243, 243); --cloudx_cms-componentSpacingMargin: 0; --cloudx_cms-colorBorderButtonFocusInverse: rgb(243, 243, 243); --cloudx_cms-shadowButtonFocus: 0 0 3px #0176d3; --cloudx_cms-varSpacingVerticalXLarge: 2rem; --cloudx_cms-tableColorBackgroundHeaderHover: rgb(243, 243, 243); --cloudx_cms-colorBackgroundDockedPanel: rgb(255, 255, 255); --cloudx_cms-colorTextTertiary: rgb(116, 116, 116); --cloudx_cms-varSpacingVerticalXxLarge: 3rem; --cloudx_cms-paletteYellow50: rgb(168, 100, 3); --cloudx_cms-brandContrastActive: rgb(13, 14, 18); --cloudx_cms-squareIconLargeContent: 2rem; --cloudx_cms-colorPickerSliderThumbColorBackground: rgb(243, 243, 243); --cloudx_cms-inputStaticFontSize: 0.8125rem; --cloudx_cms-borderWidthThin: 1px; --cloudx_cms-fontWeightRegular: 400; --cloudx_cms-colorBackgroundButtonSuccess: rgb(69, 198, 90); --cloudx_cms-splitViewColorBackgroundRowHover: rgb(255, 255, 255); --cloudx_cms-paletteYellow20: rgb(79, 33, 0); --cloudx_cms-bannerUserDefaultImage: ; --cloudx_cms-elevation8: 8; --cloudx_cms-brandDark: rgb(1, 118, 211); --cloudx_cms-colorBackgroundPathCurrentHover: rgb(255, 255, 255); --cloudx_cms-elevation0: 0; --cloudx_cms-elevation2: 2; --cloudx_cms-pageHeaderJoinedColorBorder: rgb(201, 201, 201); --cloudx_cms-elevation4: 4; --cloudx_cms-durationPaused: 3.2s; --cloudx_cms-colorBrand: rgb(27, 150, 255); --cloudx_cms-colorBackgroundPathComplete: rgb(59, 167, 85); --cloudx_cms-progressColorBorderHover: rgb(1, 118, 211); --cloudx_cms-spacingXxSmall: 0.25rem; --cloudx_cms-tableCellSpacing: 0.5rem; --cloudx_cms-colorBorderContextBarThemeDefault: rgb(13, 157, 218); --cloudx_cms-colorBackgroundAnchor: rgb(243, 243, 243); --cloudx_cms-paletteYellow30: rgb(111, 52, 0); --cloudx_cms-shadowButtonFocusInverse: 0 0 3px #f3f3f3; --cloudx_cms-welcomeMatFontSizeInfoTitle: 2.625rem; --cloudx_cms-colorBorderLinkFocusInverse: rgb(243, 243, 243); --cloudx_cms-borderRadiusCircle: 50%; --cloudx_cms-buttonColorBorderSecondary: rgba(255, 255, 255, 0.8); --cloudx_cms-colorTextSuccessInverse: rgb(69, 198, 90); --cloudx_cms-varSpacingXLarge: 2rem; --cloudx_cms-sizeXLarge: 40rem; --cloudx_cms-varSpacingHorizontalXxxSmall: 0.125rem; --cloudx_cms-elevation3Inset: -3; --cloudx_cms-lineHeightTab: 2.5rem; --cloudx_cms-colorBackgroundDestructiveActive: rgb(142, 3, 15); --cloudx_cms-colorTextLinkPrimaryActive: rgb(3, 45, 96); --cloudx_cms-colorBackgroundPageHeader: rgb(255, 255, 255); --cloudx_cms-colorBackgroundPill: rgb(255, 255, 255); --cloudx_cms-fillBrandHover: rgb(1, 68, 134); --cloudx_cms-colorBorderContextBarItem: rgba(0, 0, 0, 0.2); --cloudx_cms-borderStrokeWidthThin: 1px; --cloudx_cms-progressColorBorderShade: rgb(243, 243, 243); --cloudx_cms-heightHeader: 2.75rem; --cloudx_cms-shadowInlineEdit: 0 2px 4px 4px rgba(0, 0, 0, 0.16); --cloudx_cms-colorBackgroundNotificationBadgeHover: rgb(1, 68, 134); --cloudx_cms-borderRadiusPill: 15rem; --cloudx_cms-colorTextButtonInverseDisabled: rgba(255, 255, 255, 0.5); --cloudx_cms-sizeXxxSmall: 3rem; --cloudx_cms-colorBackgroundSuccessDarker: rgb(25, 78, 49); --cloudx_cms-colorBackgroundToggleHover: rgb(147, 147, 147); --cloudx_cms-paletteYellow15: rgb(46, 34, 4); --cloudx_cms-paletteYellow10: rgb(40, 18, 2); --cloudx_cms-cardSpacingSmall: 0.75rem; --cloudx_cms-illustrationEmptyStateTasks: url(/_slds/images/illustrations/empty-state-tasks.svg?cache=dc5e5e5b); --cloudx_cms-brandBandScrimHeight: 3.125rem; --cloudx_cms-popoverWalkthroughColorBackground: rgb(0, 22, 57); --cloudx_cms-colorBorderErrorDark: rgb(254, 143, 125); --cloudx_cms-heightTappableSmall: 2rem; --cloudx_cms-colorBackgroundButtonBrandDisabled: rgb(243, 243, 243); --cloudx_cms-colorBorderPrimary: rgb(201, 201, 201); --cloudx_cms-colorGray1: rgb(255, 255, 255); --cloudx_cms-fontSizeXLarge: 1.5rem; --cloudx_cms-varSquareIconMediumBoundary: 2rem; --cloudx_cms-colorGray5: rgb(221, 219, 218); --cloudx_cms-colorGray4: rgb(236, 235, 234); --cloudx_cms-colorGray3: rgb(243, 242, 242); --cloudx_cms-colorGray2: rgb(250, 250, 249); --cloudx_cms-opacity8: 0.8; --cloudx_cms-salesforceSansBoldItalicWoff2: url(../fonts/SalesforceSans-BoldItalic.woff2); --cloudx_cms-opacity5: 0.5; --cloudx_cms-squareIconGlobalIdentityIcon: 1.25rem; --cloudx_cms-colorBackgroundBrowser: rgb(116, 116, 116); --cloudx_cms-colorTextIconInverseActive: rgb(255, 255, 255); --cloudx_cms-shadowDocked: 0 -2px 2px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-colorBackgroundInputError: rgb(253, 221, 227); --cloudx_cms-colorGray9: rgb(112, 110, 107); --cloudx_cms-colorGray8: rgb(150, 148, 146); --cloudx_cms-colorGray7: rgb(176, 173, 171); --cloudx_cms-colorGray6: rgb(201, 199, 197); --cloudx_cms-colorTextLinkInverse: rgb(255, 255, 255); --cloudx_cms-squareIconSmallBoundary: 1.5rem; --cloudx_cms-varSpacingHorizontalXLarge: 2rem; --cloudx_cms-colorBackgroundDark: rgb(243, 243, 243); --cloudx_cms-colorTextWarningAlt: rgb(140, 75, 2); --cloudx_cms-elevationInverseShadow2: 0 -2px 2px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-elevationInverseShadow0: none; --cloudx_cms-colorStrokeBrand: rgb(1, 118, 211); --cloudx_cms-colorBackgroundToggleActive: rgb(1, 68, 134); --cloudx_cms-colorBorderContextBarDivider: rgba(255, 255, 255, 0.2); --cloudx_cms-zIndexToast: 10000; --cloudx_cms-colorBackgroundContextBarActionHighlight: rgba(255, 255, 255, 0.2); --cloudx_cms-colorBackgroundBrandPrimaryFocus: rgb(1, 68, 134); --cloudx_cms-buttonColorBackgroundBrandPrimary: rgb(1, 118, 211); --cloudx_cms-brandHeaderContrastWarm: rgb(186, 5, 23); --cloudx_cms-buttonColorTextPrimary: rgb(255, 255, 255); --cloudx_cms-colorBrandDarker: rgb(1, 68, 134); --cloudx_cms-colorBorderPathCurrentHover: rgb(3, 45, 96); --cloudx_cms-colorTextButtonDefaultDisabled: rgb(201, 201, 201); --cloudx_cms-colorBackgroundPathLost: rgb(234, 0, 30); --cloudx_cms-einsteinHeaderBackground: url(/_slds/images/einstein-headers/einstein-header-background.svg?cache=ff7fa2ff); --cloudx_cms-brandTextLink: rgb(1, 118, 211); --cloudx_cms-sliderTrackColorBackground: rgb(243, 243, 243); --cloudx_cms-colorContrastPrimary: rgb(243, 243, 243); --cloudx_cms-groupDefaultAvatar: url(/_slds/images/group_avatar_200.png?cache=a0044dae); --cloudx_cms-templateProfileGutters: 0; --cloudx_cms-sizeXxSmall: 6rem; --cloudx_cms-colorBackgroundPayload: rgb(243, 243, 243); --cloudx_cms-paletteCloudBlue90: rgb(207, 233, 254); --cloudx_cms-colorBackgroundPathActive: rgb(1, 68, 134); --cloudx_cms-colorTextDestructive: rgb(234, 0, 30); --cloudx_cms-squareIconLargeBoundary: 3rem; --cloudx_cms-colorBorderWarning: rgb(254, 147, 57); --cloudx_cms-shadowSoftPrimaryHover: none; --cloudx_cms-paletteCloudBlue95: rgb(234, 245, 254); --cloudx_cms-spacingSmall: 0.75rem; --cloudx_cms-colorBackgroundErrorDark: rgb(186, 5, 23); --cloudx_cms-brandHeaderContrastWeakDisabled: rgba(166, 166, 166, 0.25); --cloudx_cms-squareIconMediumContentAlt: 0.875rem; --cloudx_cms-colorBackgroundButtonInverse: rgba(0, 0, 0, 0); --cloudx_cms-brandHeader: rgb(255, 255, 255); --cloudx_cms-lineHeightText: 1.5; --cloudx_cms-widthStageLeftExpanded: 15rem; --cloudx_cms-colorBackgroundError: rgb(254, 92, 76); --cloudx_cms-colorTextButtonBrandActive: rgb(255, 255, 255); --cloudx_cms-fontFamily: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; --cloudx_cms-mqMedium: only screen and (min-width: 48em); --cloudx_cms-brandDarkActive: rgb(37, 48, 69); --cloudx_cms-colorBackgroundPathStepActionActive: rgb(0, 22, 57); --cloudx_cms-neutrafaceDisplayWoff2: url(../fonts/NeutrafaceDisplay.woff2); --cloudx_cms-spacingMedium: 1rem; --cloudx_cms-colorTextModal: rgb(255, 255, 255); --cloudx_cms-spinnerSizeLarge: 2.75rem; --cloudx_cms-carouselIndicatorColorBackgroundHover: rgb(243, 243, 243); --cloudx_cms-shadowActionOverflowFooter: 0 -2px 4px #f3f3f3; --cloudx_cms-popoverWalkthroughHeaderColorBackground: rgb(3, 45, 96); --cloudx_cms-colorBackgroundPathWon: rgb(46, 132, 74); --cloudx_cms-lineHeightToggle: 1.3rem; --cloudx_cms-neutrafaceDisplayWoff: url(../fonts/NeutrafaceDisplay.woff); --cloudx_cms-cardFooterPadding: 0 1rem 0.75rem; --cloudx_cms-sliderHandleColorBackground: rgb(27, 150, 255); --cloudx_cms-colorBackgroundErrorAlt: rgb(254, 143, 125); --cloudx_cms-colorBackgroundIndicatorDot: rgb(3, 45, 96); --cloudx_cms-chatMessageColorBackgroundInbound: rgb(243, 243, 243); --cloudx_cms-elevationShadow0: none; --cloudx_cms-heightPill: 1.625rem; --cloudx_cms-elevationShadow4: 0 4px 4px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-elevationShadow2: 0 2px 2px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-elevationShadow8: 0 8px 8px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-varFontSize8: 1.5rem; --cloudx_cms-colorBackgroundButtonDefaultDisabled: rgb(255, 255, 255); --cloudx_cms-varFontSize7: 1.25rem; --cloudx_cms-elevationInverseShadow8: 0 -8px 8px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-varFontSize9: 1.75rem; --cloudx_cms-brandBandColorBackgroundPrimary: rgba(0, 0, 0, 0); --cloudx_cms-colorTextButtonBrand: rgb(255, 255, 255); --cloudx_cms-elevationInverseShadow4: 0 -4px 4px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-colorBackgroundToggleActiveHover: rgb(1, 68, 134); --cloudx_cms-welcomeMatBackgroundImageInfo: url(/_slds/images/welcome-mat/bg-info@2x.png?cache=ddb4e82f); --cloudx_cms-varFontSize2: 0.75rem; --cloudx_cms-varFontSize1: 0.625rem; --cloudx_cms-varFontSize4: 0.875rem; --cloudx_cms-pageHeaderSpacingRow: 0.75rem 1rem; --cloudx_cms-varFontSize3: 0.8125rem; --cloudx_cms-varFontSize6: 1.125rem; --cloudx_cms-varFontSize5: 1rem; --cloudx_cms-varSpacingVerticalMedium: 1rem; --cloudx_cms-pageHeaderSpacingPadding: 1rem; --cloudx_cms-colorTextModalButton: rgb(116, 116, 116); --cloudx_cms-colorBackgroundPrimary: rgb(255, 255, 255); --cloudx_cms-colorTextInputFocusInverse: rgb(3, 45, 96); --cloudx_cms-colorBackgroundScrollbarTrack: rgb(201, 201, 201); --cloudx_cms-paletteNeutral70: rgb(174, 174, 174); --cloudx_cms-brandPrimaryActive: rgb(1, 118, 211); --cloudx_cms-popoverWalkthroughAltImage: ; --cloudx_cms-nubbinTriangleOffset: -0.1875rem; --cloudx_cms-salesforceSansLightWoff: url(../fonts/SalesforceSans-Light.woff); --cloudx_cms-colorBorderSuccessDark: rgb(46, 132, 74); --cloudx_cms-mqHighRes: only screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx); --cloudx_cms-brandBandColorBackgroundPrimaryTransparent: rgba(0, 0, 0, 0); --cloudx_cms-colorBackgroundContextBarInverseItemActive: rgba(255, 255, 255, 0.4); --cloudx_cms-colorTextButtonDefaultHint: rgb(174, 174, 174); --cloudx_cms-salesforceSansItalicWoff2: url(../fonts/SalesforceSans-Italic.woff2); --cloudx_cms-paletteGreen60: rgb(59, 167, 85); --cloudx_cms-heightContextBar: 2.5rem; --cloudx_cms-colorBackgroundOrgSwitcherArrow: rgb(0, 22, 57); --cloudx_cms-paletteGreen65: rgb(65, 182, 88); --cloudx_cms-brandHeaderContrastInverse: rgb(255, 255, 255); --cloudx_cms-notificationColorBackgroundInverse: rgb(116, 116, 116); --cloudx_cms-colorBackgroundButtonIconDisabled: rgb(255, 255, 255); --cloudx_cms-paletteNeutral60: rgb(147, 147, 147); --cloudx_cms-colorBorderContextBarThemeDefaultAlt: rgb(243, 243, 243); --cloudx_cms-fillBrand: rgb(1, 118, 211); --cloudx_cms-colorBackgroundInputCheckbox: rgb(255, 255, 255); --cloudx_cms-colorBorder: rgb(201, 201, 201); --cloudx_cms-squareIconSmall: 1rem; --cloudx_cms-varSpacingHorizontalMedium: 1rem; --cloudx_cms-illustrationColorPrimary: rgb(144, 208, 254); --cloudx_cms-varSpacingVerticalXSmall: 0.5rem; --cloudx_cms-colorTextPlaceholder: rgb(116, 116, 116); --cloudx_cms-einsteinHeaderBackgroundColor: rgb(144, 208, 254); --cloudx_cms-paletteGreen70: rgb(69, 198, 90); --cloudx_cms-brandHeaderContrast: rgb(94, 94, 94); --cloudx_cms-inputStaticColor: rgb(24, 24, 24); --cloudx_cms-paletteNeutral90: rgb(229, 229, 229); --cloudx_cms-paletteGreen90: rgb(205, 239, 196); --cloudx_cms-spacingXxLarge: 3rem; --cloudx_cms-shadowDropDown: 0 2px 3px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-paletteNeutral95: rgb(243, 243, 243); --cloudx_cms-colorBackgroundModal: rgb(255, 255, 255); --cloudx_cms-elevationShadow3Below: 0 3px 3px 0 rgba(0, 0, 0, 0.16) inset; --cloudx_cms-paletteRed80: rgb(254, 184, 171); --cloudx_cms-sliderTrackWidth: 100%; --cloudx_cms-elevation32: 32; --cloudx_cms-globalHeaderColorBackground: rgb(255, 255, 255); --cloudx_cms-spacingXLarge: 2rem; --cloudx_cms-paletteGreen80: rgb(145, 219, 139); --cloudx_cms-colorBorderInputActive: rgb(27, 150, 255); --cloudx_cms-varSpacingXSmall: 0.5rem; --cloudx_cms-paletteNeutral80: rgb(201, 201, 201); --cloudx_cms-colorBackgroundModalButton: rgba(0, 0, 0, 0.07); --cloudx_cms-colorBorderPathDivider: rgb(255, 255, 255); --cloudx_cms-colorTextIconDefault: rgb(116, 116, 116); --cloudx_cms-zIndexDeepdive: -99999; --cloudx_cms-elevation16: 16; --cloudx_cms-paletteRed90: rgb(254, 222, 216); --cloudx_cms-globalnavigationItemHeightAccentActive: 3px; --cloudx_cms-templateGutters: 0; --cloudx_cms-paletteRed95: rgb(254, 241, 238); --cloudx_cms-buttonColorBorderBrandPrimary: rgb(1, 118, 211); --cloudx_cms-buttonIconBoundaryTouch: 2.75rem; --cloudx_cms-brandBackgroundPrimaryTransparent: rgba(176, 196, 223, 0); --cloudx_cms-fillHeaderButtonFocus: rgb(1, 118, 211); --cloudx_cms-colorBorderError: rgb(234, 0, 30); --cloudx_cms-colorTextLinkHover: rgb(1, 68, 134); --cloudx_cms-paletteGreen95: rgb(235, 247, 230); --cloudx_cms-einsteinHeaderFigure: url(/_slds/images/einstein-headers/einstein-figure.svg?cache=ec975fb1); --cloudx_cms-colorBorderRowSelected: rgb(1, 118, 211); --cloudx_cms-colorStrokeBrandHover: rgb(1, 118, 211); --cloudx_cms-paletteNeutral30: rgb(68, 68, 68); --cloudx_cms-varSpacingVerticalXxxSmall: 0.125rem; --cloudx_cms-paletteHotOrange10: rgb(40, 18, 2); --cloudx_cms-colorTextButtonBrandDisabled: rgb(255, 255, 255); --cloudx_cms-squareIconXSmallContent: 0.5rem; --cloudx_cms-varFontSize10: 2rem; --cloudx_cms-paletteRed60: rgb(254, 92, 76); --cloudx_cms-varFontSize11: 2.625rem; --cloudx_cms-paletteRed65: rgb(254, 119, 101); --cloudx_cms-buttonBorderRadius: .25rem; --cloudx_cms-squareTappableXSmall: 1.5rem; --cloudx_cms-colorBackgroundGuidance: rgb(255, 255, 255); --cloudx_cms-colorTextContextBarInverse: rgb(255, 255, 255); --cloudx_cms-paletteNeutral20: rgb(46, 46, 46); --cloudx_cms-fontFamilyHeading: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; --cloudx_cms-paletteRed70: rgb(254, 143, 125); --cloudx_cms-brandHeaderContrastCoolActive: rgb(1, 68, 134); --cloudx_cms-borderWidthThick: 2px; --cloudx_cms-pageHeaderShadow: none; --cloudx_cms-spinnerSizeXxSmall: 0.5rem; --cloudx_cms-tableColorBackgroundHeader: rgb(255, 255, 255); --cloudx_cms-pageHeaderColorBackgroundAlt: rgb(255, 255, 255); --cloudx_cms-colorBorderBrandPrimaryHover: rgb(1, 118, 211); --cloudx_cms-colorTextTabLabelActive: rgb(3, 45, 96); --cloudx_cms-paletteNeutral50: rgb(116, 116, 116); --cloudx_cms-colorBackgroundTempModalTint: rgba(126, 140, 153, 0.8); --cloudx_cms-fontSizeMedium: 1rem; --cloudx_cms-colorBorderButtonBrand: rgb(1, 118, 211); --cloudx_cms-paletteHotOrange30: rgb(126, 38, 0); --cloudx_cms-paletteRed40: rgb(186, 5, 23); --cloudx_cms-brandBandImageHeightSmall: 6rem; --cloudx_cms-colorTextInverseWeak: rgb(174, 174, 174); --cloudx_cms-colorTextInverse: rgb(255, 255, 255); --cloudx_cms-shadowLinkFocusInverse: 0 0 3px #f3f3f3; --cloudx_cms-squareIconXxSmallBoundary: 1rem; --cloudx_cms-lineHeightReset: 1; --cloudx_cms-verticalNavigationColorBackgroundShadeRowActive: rgb(243, 243, 243); --cloudx_cms-colorBackgroundTempModal: rgba(126, 140, 153, 0.8); --cloudx_cms-colorBackgroundToggleDisabled: rgb(174, 174, 174); --cloudx_cms-colorGray13: rgb(8, 7, 7); --cloudx_cms-colorGray10: rgb(81, 79, 77); --cloudx_cms-paletteNeutral40: rgb(92, 92, 92); --cloudx_cms-colorBorderInverse: rgb(0, 22, 57); --cloudx_cms-carouselIndicatorColorBackgroundActive: rgb(1, 118, 211); --cloudx_cms-colorBackgroundBackdrop: rgba(255, 255, 255, 0.75); --cloudx_cms-colorGray12: rgb(43, 40, 38); --cloudx_cms-colorGray11: rgb(62, 62, 60); --cloudx_cms-colorTextContextBarActionTrigger: rgba(255, 255, 255, 0.4); --cloudx_cms-paletteHotOrange20: rgb(74, 36, 19); --cloudx_cms-colorBackgroundNotification: rgb(255, 255, 255); --cloudx_cms-colorBackgroundPathStepActionCurrent: rgb(1, 68, 134); --cloudx_cms-badgeColorBackgroundInverse: rgb(116, 116, 116); --cloudx_cms-colorBorderSeparatorInverse: rgb(3, 45, 96); --cloudx_cms-paletteRed50: rgb(234, 0, 30); --cloudx_cms-colorBackgroundSpinnerDot: rgb(174, 174, 174); --cloudx_cms-colorBackgroundButtonBrandActive: rgb(3, 45, 96); --cloudx_cms-paletteHotOrange15: rgb(66, 22, 4); --cloudx_cms-sliderHandleColorBackgroundFocus: rgb(1, 118, 211); --cloudx_cms-spinnerSizeMedium: 2rem; --cloudx_cms-brandPrimary: rgb(27, 150, 255); --cloudx_cms-paletteHotOrange50: rgb(216, 58, 0); --cloudx_cms-colorTextLinkPrimaryFocus: rgb(1, 118, 211); --cloudx_cms-colorTextInputDisabled: rgb(116, 116, 116); --cloudx_cms-brandLogoImage: url(/_slds/images/logo-noname.svg?cache=380754d9); --cloudx_cms-brandLight: rgb(244, 246, 254); --cloudx_cms-paletteRed20: rgb(100, 1, 3); --cloudx_cms-fillHeaderButton: rgb(174, 174, 174); --cloudx_cms-varLineHeightText: 1.5; --cloudx_cms-colorBackgroundPathCurrent: rgb(255, 255, 255); --cloudx_cms-colorBackgroundOffline: rgb(68, 68, 68); --cloudx_cms-colorBorderTabSelected: rgb(1, 118, 211); --cloudx_cms-colorTextWarning: rgb(254, 147, 57); --cloudx_cms-salesforceSansRegularWoff: url(../fonts/SalesforceSans-Regular.woff); --cloudx_cms-paletteHotOrange40: rgb(170, 48, 1); --cloudx_cms-cardSpacingLarge: 1.5rem; --cloudx_cms-paletteRed30: rgb(142, 3, 15); --cloudx_cms-fontSizeMediumA: 1.125rem; --cloudx_cms-borderRadiusMedium: 0.25rem; --cloudx_cms-colorPickerSliderThumbBorderColor: rgb(68, 68, 68); --cloudx_cms-shadowSoftPrimary: none; --cloudx_cms-zIndexDropdown: 7000; --cloudx_cms-paletteHotOrange70: rgb(255, 144, 110); --cloudx_cms-verticalNavigationColorBackgroundShadeRowHover: rgb(243, 243, 243); --cloudx_cms-squareIconMediumBoundary: 2rem; --cloudx_cms-colorBackgroundButtonDefaultFocus: rgb(243, 243, 243); --cloudx_cms-heightTappable: 2.75rem; --cloudx_cms-colorBackgroundToastError: rgb(234, 0, 30); --cloudx_cms-brandBandDefaultImage: ; --cloudx_cms-durationQuickly: 0.1s; --cloudx_cms-colorBackgroundSelection: rgb(216, 230, 254); --cloudx_cms-paletteHotOrange60: rgb(255, 93, 45); --cloudx_cms-colorBackgroundActionbarIconUtility: rgb(116, 116, 116); --cloudx_cms-colorBackgroundNotificationBadgeFocus: rgb(1, 68, 134); --cloudx_cms-paletteHotOrange65: rgb(255, 120, 79); --cloudx_cms-cardFooterTextAlign: right; --cloudx_cms-colorBorderBrandDark: rgb(1, 68, 134); --cloudx_cms-brandBackgroundDark: rgb(232, 232, 232); --cloudx_cms-avatarGroupColorBackgroundLightest: rgb(255, 255, 255); --cloudx_cms-colorTextContextBar: rgb(68, 68, 68); --cloudx_cms-inputStaticFontWeight: 400; --cloudx_cms-paletteRed10: rgb(48, 12, 1); --cloudx_cms-colorTextLinkDisabled: rgb(3, 45, 96); --cloudx_cms-colorTextPathCurrent: rgb(1, 68, 134); --cloudx_cms-paletteRed15: rgb(74, 12, 4); --cloudx_cms-zIndexOverlay: 8000; --cloudx_cms-buttonColorBorderPrimary: rgb(243, 243, 243); --cloudx_cms-paletteHotOrange90: rgb(255, 222, 213); --cloudx_cms-shadowImage: 0 1px 1px rgba(0, 0, 0, 0.16); --cloudx_cms-paletteHotOrange95: rgb(254, 241, 237); --cloudx_cms-cardHeaderPadding: 0.75rem 1rem 0; --cloudx_cms-colorBorderSeparatorAlt2: rgb(201, 201, 201); --cloudx_cms-fillBrandActive: rgb(3, 45, 96); --cloudx_cms-fontSizeTextMedium: 1rem; --cloudx_cms-spacingXSmall: 0.5rem; --cloudx_cms-chatMessageColorBackgroundOutboundAgent: rgb(116, 116, 116); --cloudx_cms-colorBackgroundButtonIconHover: rgb(243, 243, 243); --cloudx_cms-sliderHandleColorBackgroundActive: rgb(1, 118, 211); --cloudx_cms-colorBorderSuccess: rgb(145, 219, 139); --cloudx_cms-colorTextIconInverseHover: rgb(255, 255, 255); --cloudx_cms-componentSpacingPadding: 1rem; --cloudx_cms-colorBorderDestructiveActive: rgb(142, 3, 15); --cloudx_cms-colorBackgroundButtonInverseDisabled: rgba(0, 0, 0, 0); --cloudx_cms-colorTextTabLabelFocus: rgb(1, 68, 134); --cloudx_cms-paletteHotOrange80: rgb(254, 185, 165); --cloudx_cms-colorBackgroundNotificationBadge: rgb(234, 0, 30); --cloudx_cms-zIndexReminder: 8500; --cloudx_cms-colorBackgroundImageOverlay: rgba(0, 0, 0, 0.4); --cloudx_cms-colorBackgroundReminderHover: rgb(255, 255, 255); --cloudx_cms-colorTextPathCurrentHover: rgb(3, 45, 96); --cloudx_cms-colorBackgroundCustomer: rgb(254, 147, 57); --cloudx_cms-colorBackgroundButtonDefault: rgb(255, 255, 255); --cloudx_cms-colorBackgroundInverseLight: rgb(3, 45, 96); --cloudx_cms-salesforceSansBoldWoff: url(../fonts/SalesforceSans-Bold.woff); --cloudx_cms-progressColorBorderActive: rgb(27, 150, 255); --cloudx_cms-fontSizeLarge: 1.25rem; --cloudx_cms-brandHeaderContrastWeakActive: rgb(129, 129, 129); --cloudx_cms-brandHeaderContrastWarmActive: rgb(186, 5, 23); --cloudx_cms-squareToggleSlider: 1.25rem; --cloudx_cms-progressBarColorBackgroundFillSuccess: rgb(46, 132, 74); --cloudx_cms-colorBackgroundButtonBrand: rgb(1, 118, 211); --cloudx_cms-colorBackgroundWarningDark: rgb(254, 147, 57); --cloudx_cms-colorTextIconUtility: rgb(174, 174, 174); --cloudx_cms-colorBackgroundScrollbar: rgb(243, 243, 243); --cloudx_cms-chatMessageColorBackgroundStatus: rgb(255, 255, 255); --cloudx_cms-colorBackgroundTempModalTintAlt: rgba(255, 255, 255, 0.75); --cloudx_cms-pageHeaderBorderRadius: 0; --cloudx_cms-palettePink95: rgb(254, 240, 243); --cloudx_cms-welcomeMatColorIconComplete: rgb(201, 201, 201); --cloudx_cms-palettePink90: rgb(253, 221, 227); --cloudx_cms-paletteViolet50: rgb(186, 1, 255); --cloudx_cms-paletteTeal30: rgb(2, 77, 76); --cloudx_cms-colorTextIconInverseDisabled: rgba(255, 255, 255, 0.15); --cloudx_cms-bannerGroupDefaultImage: ; --cloudx_cms-colorBorderBrand: rgb(27, 150, 255); --cloudx_cms-colorBackgroundInfo: rgb(116, 116, 116); --cloudx_cms-heightToggle: 1.5rem; --cloudx_cms-badgeColorBackgroundLightest: rgb(255, 255, 255); --cloudx_cms-brandBandColorBackgroundSecondary: rgba(0, 0, 0, 0); --cloudx_cms-shadowSoftPrimaryActive: none; --cloudx_cms-colorTextIconDefaultHint: rgb(174, 174, 174); --cloudx_cms-colorBackgroundChromeMobile: rgb(1, 118, 211); --cloudx_cms-colorPickerSwatchSize: 1.25rem; --cloudx_cms-colorBackgroundPathIncomplete: rgb(243, 243, 243); --cloudx_cms-paletteTeal40: rgb(5, 103, 100); --cloudx_cms-colorTextToggleDisabled: rgb(201, 201, 201); --cloudx_cms-paletteViolet40: rgb(150, 2, 199); --cloudx_cms-colorTextLinkInverseHover: rgba(255, 255, 255, 0.75); --cloudx_cms-palettePink80: rgb(253, 182, 197); --cloudx_cms-zIndexModal: 9000; --cloudx_cms-pageHeaderIconSize: 2.25rem; --cloudx_cms-colorTextDestructiveHover: rgb(186, 5, 23); --cloudx_cms-colorBorderCanvasElementSelection: rgb(26, 185, 255); --cloudx_cms-colorBackgroundSuccess: rgb(69, 198, 90); --cloudx_cms-carouselIndicatorColorBackground: rgb(255, 255, 255); --cloudx_cms-sliderTrackHeight: 4px; --cloudx_cms-squareIconSmallContent: 0.75rem; --cloudx_cms-colorBackgroundInputDisabled: rgb(243, 243, 243); --cloudx_cms-paletteTeal50: rgb(11, 130, 124); --cloudx_cms-palettePink70: rgb(254, 138, 167); --cloudx_cms-paletteViolet30: rgb(115, 3, 148); --cloudx_cms-mqSmall: only screen and (max-width: 47.9375em); --cloudx_cms-brandBandImageHeightLarge: 18.75rem; --cloudx_cms-carouselIndicatorWidth: 1rem; --cloudx_cms-colorTextLinkActive: rgb(3, 45, 96); --cloudx_cms-squareIconXxSmallContent: .875rem; --cloudx_cms-fontSizeXSmall: 0.625rem; --cloudx_cms-palettePink65: rgb(254, 114, 152); --cloudx_cms-sliderColorBackgroundDisabled: rgb(243, 243, 243); --cloudx_cms-colorContrastSecondary: rgb(255, 255, 255); --cloudx_cms-welcomeMatColorBackgroundProgressBar: rgb(255, 255, 255); --cloudx_cms-globalActionIconSize: 1.5rem; --cloudx_cms-paletteViolet20: rgb(72, 26, 84); --cloudx_cms-fontSizeHeadingSmall: 0.875rem; --cloudx_cms-colorPickerRangeIndicatorSize: 0.75rem; --cloudx_cms-paletteOrange15: rgb(55, 30, 3); --cloudx_cms-sliderHandleSize: 1rem; --cloudx_cms-tableBorderRadius: 0; --cloudx_cms-paletteTeal60: rgb(6, 165, 154); --cloudx_cms-userDefaultAvatarSmall: url(/_slds/images/profile_avatar_96.png?cache=3c01f25f); --cloudx_cms-buttonColorBackgroundPrimary: rgb(255, 255, 255); --cloudx_cms-colorPickerInputCustomHexWidth: 4.2rem; --cloudx_cms-paletteOrange10: rgb(32, 22, 0); --cloudx_cms-palettePink60: rgb(255, 83, 138); --cloudx_cms-paletteTeal65: rgb(3, 180, 167); --cloudx_cms-colorBackgroundRowSelected: rgb(243, 243, 243); --cloudx_cms-colorBackgroundContextBarBrandAccent: rgb(13, 157, 218); --cloudx_cms-fontFamilyMonospace: Consolas, Menlo, Monaco, Courier, monospace; --cloudx_cms-cardFooterColorBorder: rgba(0, 0, 0, 0); --cloudx_cms-palettePurple80: rgb(215, 191, 242); --cloudx_cms-varSpacingHorizontalLarge: 1.5rem; --cloudx_cms-colorTextRequired: rgb(234, 0, 30); --cloudx_cms-elevationShadow16: 0 16px 16px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-paletteViolet10: rgb(46, 0, 57); --cloudx_cms-shadowHardPrimary: none; --cloudx_cms-paletteOrange20: rgb(62, 43, 2); --cloudx_cms-paletteViolet15: rgb(61, 1, 87); --cloudx_cms-radioButtonGroupLineHeightTouch: 2.69rem; --cloudx_cms-colorBackgroundBrandPrimary: rgb(1, 118, 211); --cloudx_cms-paletteTeal70: rgb(1, 195, 179); --cloudx_cms-colorBackgroundUtilityBarActive: rgb(27, 150, 255); --cloudx_cms-zIndexSticky: 100; --cloudx_cms-colorBackgroundContextBarShadow: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0, rgba(0, 0, 0, 0) 100%); --cloudx_cms-paletteTeal80: rgb(4, 225, 203); --cloudx_cms-palettePurple90: rgb(236, 225, 249); --cloudx_cms-squareIconUtilityLarge: 1.5rem; --cloudx_cms-fontSize10: 2rem; --cloudx_cms-groupDefaultAvatarMedium: url(/_slds/images/group_avatar_160.png?cache=b8fe8e83); --cloudx_cms-elevationShadow32: 0 32px 32px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-paletteOrange30: rgb(95, 62, 2); --cloudx_cms-colorBorderButtonInverseDisabled: rgba(255, 255, 255, 0.15); --cloudx_cms-fontSize11: 2.625rem; --cloudx_cms-einsteinHeaderTextShadow: #cfe9fe; --cloudx_cms-palettePurple95: rgb(246, 242, 251); --cloudx_cms-squareTappableXxSmall: 1.25rem; --cloudx_cms-colorBackgroundDestructiveHover: rgb(142, 3, 15); --cloudx_cms-fontSize9: 1.75rem; --cloudx_cms-colorBackgroundLight: rgb(255, 255, 255); --cloudx_cms-fontSize8: 1.5rem; --cloudx_cms-paletteTeal90: rgb(172, 243, 228); --cloudx_cms-shadowActive: 0 0 2px #0176d3; --cloudx_cms-fontSize1: 0.625rem; --cloudx_cms-paletteNeutral100: rgb(255, 255, 255); --cloudx_cms-colorTextLink: rgb(1, 118, 211); --cloudx_cms-pageHeaderTitleFontSize: 1.125rem; --cloudx_cms-fontSize3: 0.8125rem; --cloudx_cms-fontSize2: 0.75rem; --cloudx_cms-colorTextLinkInverseDisabled: rgba(255, 255, 255, 0.15); --cloudx_cms-fontSize5: 1rem; --cloudx_cms-fontSize4: 0.875rem; --cloudx_cms-fontSize7: 1.25rem; --cloudx_cms-fontSize6: 1.125rem; --cloudx_cms-spacingNone: 0; --cloudx_cms-paletteOrange40: rgb(130, 81, 1); --cloudx_cms-inputReadonlyFontWeight: 400; --cloudx_cms-palettePurple60: rgb(173, 123, 238); --cloudx_cms-paletteTeal95: rgb(222, 249, 243); --cloudx_cms-colorStrokeHeaderButton: rgb(174, 174, 174); --cloudx_cms-typingIconDotColorBackgroundGray: rgb(201, 201, 201); --cloudx_cms-palettePurple65: rgb(183, 141, 239); --cloudx_cms-pageHeaderTitleFontWeight: 400; --cloudx_cms-colorBackgroundButtonIconFocus: rgb(243, 243, 243); --cloudx_cms-groupDefaultAvatarSmall: url(/_slds/images/group_avatar_96.png?cache=d0659d12); --cloudx_cms-colorBackgroundModalBrand: rgb(1, 68, 134); --cloudx_cms-colorTextInverseActive: rgb(26, 185, 255); --cloudx_cms-colorBackgroundHighlightSearch: rgb(255, 240, 63); --cloudx_cms-paletteOrange50: rgb(169, 100, 4); --cloudx_cms-colorBackgroundSuccessDark: rgb(46, 132, 74); --cloudx_cms-shadowOverlay: 0 -2px 4px rgba(0, 0, 0, 0.07); --cloudx_cms-sizeXSmall: 12rem; --cloudx_cms-colorBackgroundDestructive: rgb(186, 5, 23); --cloudx_cms-typingIconDotSize: .5rem; --cloudx_cms-palettePurple70: rgb(194, 158, 241); --cloudx_cms-colorBorderInfo: rgb(116, 116, 116); --cloudx_cms-colorTextTabLabel: rgb(3, 45, 96); --cloudx_cms-palettePink15: rgb(75, 6, 32); --cloudx_cms-popoverWalkthroughColorBackgroundAlt: rgb(1, 118, 211); --cloudx_cms-durationImmediately: 0.05s; --cloudx_cms-palettePink10: rgb(55, 1, 20); --cloudx_cms-elevationInverseShadow16: 0 -16px 16px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-salesforceSansLightWoff2: url(../fonts/SalesforceSans-Light.woff2); --cloudx_cms-splitViewWidth: 25rem; --cloudx_cms-colorBorderIconInverseHint: rgba(255, 255, 255, 0.5); --cloudx_cms-brandDisabled: rgb(201, 199, 197); --cloudx_cms-paletteOrange60: rgb(221, 122, 1); --cloudx_cms-palettePurple40: rgb(117, 38, 227); --cloudx_cms-paletteOrange65: rgb(243, 131, 3); --cloudx_cms-progressColorBackground: rgb(255, 255, 255); --cloudx_cms-colorBorderContextBarThemeDefaultActive: rgb(243, 243, 243); --cloudx_cms-avatarGroupColorBackgroundInverse: rgb(116, 116, 116); --cloudx_cms-colorBackgroundAlt2: rgb(243, 243, 243); --cloudx_cms-cardFontWeight: 400; --cloudx_cms-colorPickerSwatchShadow: inset 0 0 1px rgba(0, 0, 0, 0.4); --cloudx_cms-paletteOrange70: rgb(254, 147, 57); --cloudx_cms-colorTextIconBrand: rgb(1, 118, 211); --cloudx_cms-colorTextButtonDefault: rgb(1, 118, 211); --cloudx_cms-palettePurple50: rgb(144, 80, 233); --cloudx_cms-pathButtonWidthFixed: 13rem; --cloudx_cms-sizeLarge: 25rem; --cloudx_cms-userDefaultAvatarMedium: url(/_slds/images/profile_avatar_160.png?cache=bfba2c9a); --cloudx_cms-colorBorderDestructive: rgb(234, 0, 30); --cloudx_cms-colorTextWeak: rgb(116, 116, 116); --cloudx_cms-fontSizeHeadingMedium: 1.125rem; --cloudx_cms-mqSingleColumnRecordLayout: (max-width: 599px); --cloudx_cms-colorBackgroundInputSearch: rgba(0, 0, 0, 0.16); --cloudx_cms-welcomeMatBackgroundColorInfo: rgb(207, 233, 254); --cloudx_cms-colorBorderBrandPrimary: rgb(27, 150, 255); --cloudx_cms-colorBackgroundInverse: rgb(0, 22, 57); --cloudx_cms-maxWidthActionOverflowMenu: 512px; --cloudx_cms-paletteNeutral10: rgb(24, 24, 24); --cloudx_cms-carouselColorBackground: rgb(255, 255, 255); --cloudx_cms-colorTextLabel: rgb(116, 116, 116); --cloudx_cms-colorBackgroundButtonSuccessActive: rgb(46, 132, 74); --cloudx_cms-squareIconLarge: 3.125rem; --cloudx_cms-spinnerSizeXSmall: 1rem; --cloudx_cms-paletteOrange80: rgb(255, 186, 144); --cloudx_cms-cardSpacingMargin: 1rem; --cloudx_cms-colorTextBrowserActive: rgba(0, 0, 0, 0.4); --cloudx_cms-colorBackgroundButtonBrandHover: rgb(1, 68, 134); --cloudx_cms-chatMessageColorBackgroundOutbound: rgb(1, 68, 134); --cloudx_cms-colorTextIconDefaultActive: rgb(3, 45, 96); --cloudx_cms-palettePurple20: rgb(64, 16, 117); --cloudx_cms-colorTextIconDefaultHover: rgb(1, 118, 211); --cloudx_cms-colorTextLinkPrimary: rgb(1, 118, 211); --cloudx_cms-fontSizeTextXSmall: 0.75rem; --cloudx_cms-colorBackgroundToast: rgb(116, 116, 116); --cloudx_cms-fontSizeXxLarge: 2rem; --cloudx_cms-heightSalesPath: 2rem; --cloudx_cms-colorTextIconDefaultHintBorderless: rgb(243, 243, 243); --cloudx_cms-paletteOrange95: rgb(255, 241, 234); --cloudx_cms-colorForegroundPrimary: rgb(255, 255, 255); --cloudx_cms-paletteOrange90: rgb(254, 223, 208); --cloudx_cms-colorBackgroundRowNew: rgb(205, 239, 196); --cloudx_cms-fontSizeTextLarge: 1.125rem; --cloudx_cms-paletteGreen15: rgb(12, 41, 18); --cloudx_cms-colorBackgroundShade: rgb(243, 243, 243); --cloudx_cms-paletteGreen10: rgb(7, 27, 18); --cloudx_cms-palettePurple30: rgb(90, 27, 169); --cloudx_cms-varSpacingXxxSmall: 0.125rem; --cloudx_cms-brandLightActive: rgb(227, 229, 237); --cloudx_cms-welcomeMatTextColorInfo: rgb(3, 45, 96); --cloudx_cms-colorBackgroundIconWaffle: rgb(116, 116, 116); --cloudx_cms-colorBackgroundContextBarItemHover: rgb(255, 255, 255); --cloudx_cms-fontSizeXLargeA: 1.57rem; --cloudx_cms-colorBackgroundPathCompleteHover: rgb(46, 132, 74); --cloudx_cms-palettePink50: rgb(227, 6, 106); --cloudx_cms-paletteViolet90: rgb(242, 222, 254); --cloudx_cms-paletteGreen20: rgb(28, 51, 38); --cloudx_cms-paletteViolet95: rgb(249, 240, 255); --cloudx_cms-colorBorderContextBarThemeDefaultHover: rgb(50, 29, 113); --cloudx_cms-squareIconMedium: 2.375rem; --cloudx_cms-textTransform: none; --cloudx_cms-colorBackgroundBrandPrimaryHover: rgb(1, 68, 134); --cloudx_cms-colorTextSuccess: rgb(46, 132, 74); --cloudx_cms-carouselIndicatorColorBackgroundFocus: rgb(1, 68, 134); --cloudx_cms-colorBackgroundChromeDesktop: rgb(255, 255, 255); --cloudx_cms-borderStrokeWidthThick: 2px; --cloudx_cms-colorBackgroundReminder: rgb(243, 243, 243); --cloudx_cms-palettePurple15: rgb(48, 11, 96); --cloudx_cms-colorTextToast: rgb(243, 243, 243); --cloudx_cms-paletteViolet80: rgb(229, 185, 254); --cloudx_cms-colorBackgroundAlt: rgb(255, 255, 255); --cloudx_cms-palettePink40: rgb(182, 5, 84); --cloudx_cms-paletteGreen30: rgb(25, 78, 49); --cloudx_cms-palettePurple10: rgb(36, 6, 67); --cloudx_cms-elevationInverseShadow32: 0 -32px 32px 0 rgba(0, 0, 0, 0.16); --cloudx_cms-colorBorderCustomer: rgb(254, 147, 57); --cloudx_cms-tableColorBackgroundStripes: rgb(243, 243, 243); --cloudx_cms-varSpacingVerticalSmall: 0.75rem; --cloudx_cms-palettePink30: rgb(138, 3, 62); --cloudx_cms-paletteViolet70: rgb(216, 146, 254); --cloudx_cms-colorBorderContextBarInverseItem: rgba(255, 255, 255, 0.2); --cloudx_cms-utilityBarColorBackgroundNotificationBadge: rgb(254, 92, 76); --cloudx_cms-colorTextTabLabelDisabled: rgb(243, 243, 243); --cloudx_cms-heightInput: 1.875rem; --cloudx_cms-squareTappable: 2.75rem; --cloudx_cms-fontSizeSmall: 0.875rem; --cloudx_cms-paletteGreen40: rgb(57, 101, 71); --cloudx_cms-tableColorBackgroundHeaderFocus: rgb(255, 255, 255); --cloudx_cms-salesforceSansRegularWoff2: url(../fonts/SalesforceSans-Regular.woff2); --cloudx_cms-varSpacingHorizontalXxLarge: 3rem; --cloudx_cms-paletteViolet65: rgb(209, 125, 254); --cloudx_cms-progressBarColorBackgroundFill: rgb(26, 185, 255); --cloudx_cms-colorBorderSeparator: rgb(243, 243, 243); --cloudx_cms-paletteGreen50: rgb(46, 132, 74); --cloudx_cms-brandHeaderIconDisabled: rgba(145, 145, 145, 0.25); --cloudx_cms-palettePink20: rgb(97, 2, 42); --cloudx_cms-splitViewColorBackground: rgb(243, 243, 243); --cloudx_cms-colorBackgroundSecondary: rgb(243, 243, 243); --cloudx_cms-colorTextLinkFocus: rgb(1, 68, 134); --cloudx_cms-paletteViolet60: rgb(203, 101, 255); --c-paletteIndigo10: rgb(32, 6, 71); --c-popoverWalkthroughHeaderImage: ; --c-zIndexDialog: 6000; --c-colorPickerSelectorWidth: 14rem; --c-nubbinSizeDefault: 1rem; --c-paletteCloudBlue40: rgb(5, 98, 138); --c-colorBackgroundContextBarInverseItemHover: rgba(255, 255, 255, 0.2); --c-dropZoneSlotHeight: 0.25rem; --c-colorTextTabLabelSelected: rgb(1, 118, 211); --c-colorStrokeBrandActive: rgb(3, 45, 96); --c-paletteIndigo15: rgb(31, 9, 116); --c-cardBodyPadding: 0 1rem; --c-varSpacingHorizontalSmall: 0.75rem; --c-tableColorBackgroundHeaderResizableHandle: rgb(174, 174, 174); --c-colorBackgroundPathActiveHover: rgb(3, 45, 96); --c-brandPrimaryTransparent: rgba(21, 137, 238, 0.1); --c-brandPrimaryTransparent40: rgba(21, 137, 238, 0.4); --c-colorBorderButtonDefault: rgb(201, 201, 201); --c-paletteIndigo20: rgb(50, 29, 113); --c-popoverColorText: rgb(201, 201, 201); --c-paletteCloudBlue30: rgb(8, 73, 104); --c-colorTextButtonDefaultActive: rgb(1, 118, 211); --c-colorPickerSliderHeight: 1.5rem; --c-colorTextIconInverse: rgb(255, 255, 255); --c-heightFooter: 3.75rem; --c-splitViewColorBorder: rgb(201, 201, 201); --c-colorBorderRowSelectedHover: rgb(27, 150, 255); --c-fontSizeTextXxSmall: 0.625rem; --c-lineHeightHeading: 1.25; --c-cardHeaderMargin: 0 0 0.75rem; --c-paletteIndigo30: rgb(47, 44, 183); --c-mqMediumLandscape: only screen and (min-width: 48em) and (min-aspect-ratio: 4/3); --c-brandBandImageHeightMedium: 12.5rem; --c-illustrationColorSecondary: rgb(207, 233, 254); --c-zIndexDefault: 1; --c-colorBorderSelectionActive: rgb(243, 243, 243); --c-paletteCloudBlue20: rgb(2, 50, 72); --c-utilityBarColorBackgroundNotificationFocus: rgb(201, 201, 201); --c-colorTextIconDefaultDisabled: rgb(201, 201, 201); --c-colorTextBrand: rgb(27, 150, 255); --c-durationToastMedium: 9.6s; --c-colorBackgroundButtonIconActive: rgb(243, 243, 243); --c-brandHeaderContrastWeak: rgb(145, 145, 145); --c-colorBackgroundNotificationNew: rgb(243, 243, 243); --c-brandHeaderContrastInverseActive: rgb(238, 238, 238); --c-colorBackgroundInputCheckboxSelected: rgb(27, 150, 255); --c-progressColorBorder: rgb(255, 255, 255); --c-spacingXxxSmall: 0.125rem; --c-paletteIndigo40: rgb(58, 73, 218); --c-colorBackgroundProgressRingContent: rgb(255, 255, 255); --c-lineHeightButtonSmall: 1.75rem; --c-salesforceSansBoldItalicWoff: url(../fonts/SalesforceSans-BoldItalic.woff); --c-brandBackgroundDarkTransparent: rgba(221, 219, 218, 0); --c-colorPickerThumbWidth: 0.375rem; --c-paletteCloudBlue10: rgb(0, 26, 40); --c-brandHeaderIconActive: rgb(129, 129, 129); --c-widthStageLeftCollapsed: 4rem; --c-paletteCloudBlue15: rgb(10, 38, 54); --c-colorBorderOffline: rgb(68, 68, 68); --c-pdpWarningBorder: #FFCF94; --c-colorBackgroundUtilityBarHover: rgb(243, 243, 243); --c-sliderHandleColorBackgroundHover: rgb(1, 118, 211); --c-colorTextIconInverseHint: rgba(255, 255, 255, 0.5); --c-sizeMedium: 20rem; --c-brandPrimaryTransparent10: rgba(21, 137, 238, 0.1); --c-colorBorderIconInverseHintHover: rgba(255, 255, 255, 0.75); --c-colorTextDefault: rgb(3, 45, 96); --c-paletteIndigo50: rgb(88, 103, 232); --c-progressBarHeight: 0.125rem; --c-colorBackgroundWarning: rgb(254, 147, 57); --c-colorBackgroundBrandPrimaryActive: rgb(3, 45, 96); --c-paletteBlue90: rgb(216, 230, 254); --c-brandHeaderContrastCool: rgb(1, 68, 134); --c-paletteCloudBlue80: rgb(144, 208, 254); --c-paletteBlue95: rgb(238, 244, 255); --c-colorBorderSelectionHover: rgb(27, 150, 255); --c-zIndexPopup: 5000; --c-borderRadiusLarge: 0.5rem; --c-colorTextIconInverseHintHover: rgba(255, 255, 255, 0.75); --c-popoverBrandBorderWidth: 0.25rem; --c-fontSizeHeadingXLarge: 1.75rem; --c-typingIconDotColorBackgroundGrayDark: rgb(201, 201, 201); --c-paletteIndigo65: rgb(142, 155, 239); --c-varSpacingLarge: 1.5rem; --c-pageHeaderSpacingMargin: 0; --c-fontSizeTextXLarge: 1.25rem; --c-paletteIndigo60: rgb(127, 140, 237); --c-paletteCloudBlue70: rgb(26, 185, 255); --c-welcomeMatColorActionShadow: rgba(0, 0, 0, 0.05); --c-colorTextBrowser: rgb(255, 255, 255); --c-welcomeMatSpacingInfo: 7.75rem; --c-mqLarge: only screen and (min-width: 64.0625em); --c-paletteIndigo70: rgb(158, 169, 241); --c-squareTappableSmall: 2rem; --c-colorTextActionLabel: rgb(116, 116, 116); --c-paletteCloudBlue60: rgb(13, 157, 218); --c-paletteBlue70: rgb(120, 176, 253); --c-colorBorderTabActive: rgb(255, 255, 255); --c-paletteCloudBlue65: rgb(8, 171, 237); --c-globalnavigationItemHeightAccentFocus: 4px; --c-colorBorderDestructiveHover: rgb(186, 5, 23); --c-buttonLineHeightTouch: 2.65rem; --c-colorTextCustomer: rgb(254, 147, 57); --c-squareIconUtilitySmall: 1rem; --c-colorBackgroundModalButtonActive: rgba(0, 0, 0, 0.16); --c-colorTextBrandPrimary: rgb(255, 255, 255); --c-pdpVeryLightGray: #F5F5F5; --c-squareIconXSmallBoundary: 1.25rem; --c-widthToggle: 3rem; --c-paletteIndigo80: rgb(190, 199, 246); --c-welcomeMatMinHeight: 25rem; --c-zIndexDocked: 4; --c-squareIconMediumBoundaryAlt: 2.25rem; --c-colorBorderSelection: rgb(1, 118, 211); --c-paletteBlue80: rgb(170, 203, 255); --c-paletteCloudBlue50: rgb(16, 124, 173); --c-brandHeaderContrastActive: rgb(80, 80, 80); --c-formLabelFontSize: 0.75rem; --c-colorTextActionLabelActive: rgb(3, 45, 96); --c-colorBackgroundBackdropTint: rgb(243, 243, 243); --c-durationSlowly: 0.4s; --c-colorBackgroundRowHover: rgb(243, 243, 243); --c-popoverWalkthroughAltNubbinColorBackground: rgb(1, 118, 211); --c-spinnerSizeSmall: 1.25rem; --c-sliderTrackColorBackgroundFill: rgb(27, 150, 255); --c-welcomeMatWidth: 52.0625rem; --c-paletteIndigo95: rgb(241, 243, 251); --c-paletteIndigo90: rgb(224, 229, 248); --c-filesZIndexHover: 5; --c-colorTextPill: rgb(1, 118, 211); --c-varSpacingSmall: 0.75rem; --c-heightDockedBar: 2.5rem; --c-maxMenuWidth: 1280px; --c-paletteBlue50: rgb(1, 118, 211); --c-colorTextTabLabelHover: rgb(1, 68, 134); --c-fontSizeHeadingXSmall: 0.75rem; --c-colorStrokeDisabled: rgb(243, 243, 243); --c-widthPathBorderCurrent: 0.125rem; --c-plpItemNoText: #5B6770; --c-colorBackgroundButtonDefaultHover: rgb(243, 243, 243); --c-varSpacingVerticalXxSmall: 0.25rem; --c-colorTextButtonDefaultHover: rgb(1, 118, 211); --c-durationPromptly: 0.2s; --c-colorBorderPathCurrent: rgb(1, 68, 134); --c-colorBackgroundButtonDefaultActive: rgb(243, 243, 243); --c-colorTextStageLeft: rgb(243, 243, 243); --c-colorBorderHint: rgb(3, 45, 96); --c-colorTextPrimary: rgb(3, 45, 96); --c-brandBandColorBackgroundSecondaryTransparent: rgba(0, 0, 0, 0); --c-pdpMedGray: #5B6770; --c-paletteBlue60: rgb(27, 150, 255); --c-cardColorBackground: rgb(255, 255, 255); --c-brandHeaderIcon: rgb(145, 145, 145); --c-paletteBlue65: rgb(87, 163, 253); --c-spacingLarge: 1.5rem; --c-pageHeaderColorBorder: rgba(0, 0, 0, 0); --c-cardFooterMargin: 0.75rem; --c-fontSizeTextSmall: 0.8125rem; --c-colorTextLinkInverseActive: rgba(255, 255, 255, 0.5); --c-durationToastShort: 4.8s; --c-lineHeightButton: 1.875rem; --c-panelDockedLeftShadow: 1px 0 3px rgba(0, 0, 0, 0.25); --c-panelDockedRightShadow: -1px 0 3px 0 rgba(0, 0, 0, 0.25); --c-colorTextLinkPrimaryHover: rgb(1, 118, 211); --c-shadowButton: 0 1px 1px 0 rgba(0, 0, 0, 0.05); --c-welcomeMatMaxHeight: 37.5rem; --c-colorBorderToggleChecked: rgb(255, 255, 255); --c-shadowHeader: 0 2px 4px rgba(0, 0, 0, 0.07); --c-sizeXxLarge: 60rem; --c-colorBackgroundDockedPanelHeader: rgb(255, 255, 255); --c-paletteBlue30: rgb(1, 68, 134); --c-lineHeightSalespath: 1.5rem; --c-shadowDrag: 0 2px 4px 0 rgba(0, 0, 0, 0.40); --c-colorBackgroundPathExpanded: rgb(255, 255, 255); --c-colorBackground: rgb(243, 243, 243); --c-colorBackgroundInput: rgb(255, 255, 255); --c-sizeSmall: 15rem; --c-userDefaultAvatar: url(/_slds/images/profile_avatar_200.png?cache=7bdcafae); --c-colorTextButtonInverse: rgb(243, 243, 243); --c-colorBackgroundInputCheckboxDisabled: rgb(201, 201, 201); --c-tableColorTextHeader: rgb(68, 68, 68); --c-paletteBlue40: rgb(11, 92, 171); --c-cardColorBorder: rgb(201, 201, 201); --c-squareIconUtilityMedium: 1.25rem; --c-colorBackgroundButtonSuccessHover: rgb(46, 132, 74); --c-colorBorderButtonBrandDisabled: rgba(0, 0, 0, 0); --c-fontSizeHeadingXxSmall: 0.625rem; --c-colorBackgroundButtonInverseActive: rgba(0, 0, 0, 0.24); --c-illustrationEmptyStateEvents: url(/_slds/images/illustrations/empty-state-events.svg?cache=985b247a); --c-colorBackgroundToggle: rgb(174, 174, 174); --c-colorBackgroundStencil: rgb(243, 243, 243); --c-welcomeMatCheckSize: 0.625rem; --c-colorTextButtonBrandHover: rgb(255, 255, 255); --c-buttonColorBackgroundSecondary: rgba(255, 255, 255, 0.8); --c-paletteBlue10: rgb(0, 22, 57); --c-varSpacingVerticalLarge: 1.5rem; --c-colorBorderReminder: rgb(243, 243, 243); --c-colorBrandDark: rgb(1, 118, 211); --c-paletteBlue15: rgb(3, 35, 77); --c-pdpButtonNeutral: #FFFFFF; --c-colorBorderBrandPrimaryFocus: rgb(1, 118, 211); --c-salesforceSansItalicWoff: url(../fonts/SalesforceSans-Italic.woff); --c-colorBorderBrandPrimaryActive: rgb(3, 45, 96); --c-datepickerColorTextDayAdjacentMonth: rgb(116, 116, 116); --c-colorBorderErrorAlt: rgb(254, 143, 125); --c-shadowReminder: 0 2px 3px 0 rgba(0, 0, 0, 0.20); --c-brandTextLinkActive: rgb(1, 68, 134); --c-pageHeaderColorBackground: rgb(243, 243, 243); --c-salesforceSansBoldWoff2: url(../fonts/SalesforceSans-Bold.woff2); --c-fontSizeHeadingLarge: 1.5rem; --c-colorBackgroundStencilAlt: rgb(243, 243, 243); --c-paletteBlue20: rgb(3, 45, 96); --c-elevationInverseShadow3Below: 0 -3px 3px 0 rgba(0, 0, 0, 0.16) inset; --c-varSpacingHorizontalXxSmall: 0.25rem; --c-pdpButtonBrandHover: #184569; --c-colorBorderSeparatorAlt: rgb(201, 201, 201); --c-colorPickerRangeHeight: 5rem; --c-colorBackgroundButtonIcon: rgba(0, 0, 0, 0); --c-paletteTeal15: rgb(7, 40, 37); --c-buttonIconColorBorderPrimary: rgb(255, 255, 255); --c-brandAccessibleActive: rgb(1, 68, 134); --c-paletteYellow80: rgb(252, 192, 3); --c-zIndexSpinner: 9050; --c-colorBackgroundContextTabBarItem: rgb(255, 255, 255); --c-fontWeightBold: 700; --c-paletteTeal10: rgb(7, 27, 18); --c-colorBackgroundContextBarItemActive: rgb(255, 255, 255); --c-shadowFocusInset: 0 0 2px 2px #1b96ff inset; --c-colorBackgroundAltInverse: rgb(3, 45, 96); --c-colorBackgroundPathIncompleteHover: rgb(201, 201, 201); --c-squareIconMediumContent: 1rem; --c-colorBackgroundContextBar: rgb(255, 255, 255); --c-colorTextInverseHover: rgb(174, 174, 174); --c-colorBackgroundInputActive: rgb(255, 255, 255); --c-brandContrast: rgb(26, 27, 30); --c-colorTextSecondary: rgb(116, 116, 116); --c-fillHeaderButtonHover: rgb(1, 68, 134); --c-fontFamilyText: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; --c-welcomeMatCompleteIconSize: 1.25rem; --c-varSpacingXxLarge: 3rem; --c-paletteYellow95: rgb(251, 243, 224); --c-paletteYellow90: rgb(249, 227, 182); --c-brandBackgroundPrimary: rgb(250, 250, 249); --c-paletteTeal20: rgb(2, 52, 52); --c-progressRingWidth: 0.1875rem; --c-paletteYellow65: rgb(215, 147, 4); --c-paletteYellow60: rgb(202, 133, 1); --c-colorBorderInputCheckboxSelectedCheckmark: rgb(255, 255, 255); --c-colorBorderCanvasElementSelectionHover: rgb(1, 68, 134); --c-borderRadiusSmall: 0.125rem; --c-progressBarColorBackground: rgb(201, 201, 201); --c-durationInstantly: 0s; --c-colorBackgroundToastSuccess: rgb(46, 132, 74); --c-tabsFontWeight: 400; --c-colorBackgroundPost: rgb(243, 243, 243); --c-colorTextPlaceholderInverse: rgb(243, 243, 243); --c-colorTextInputIcon: rgb(174, 174, 174); --c-sliderHandleShadow: rgba(0, 0, 0, 0.16) 0 2px 3px; --c-paletteYellow70: rgb(228, 162, 1); --c-fontWeightLight: 300; --c-colorTextError: rgb(234, 0, 30); --c-varSpacingXxSmall: 0.25rem; --c-colorBorderInput: rgb(201, 201, 201); --c-brandAccessible: rgb(1, 118, 211); --c-pageColorBackgroundPrimary: rgb(255, 255, 255); --c-cardShadow: none; --c-lineClamp: 3; --c-welcomeMatWidthProgressBar: 12.5rem; --c-progressColorBackgroundShade: rgb(243, 243, 243); --c-globalActionFillHover: rgb(1, 68, 134); --c-illustrationEmptyStateAssistant: url(/_slds/images/illustrations/empty-state-assistant.svg?cache=127a789e); --c-varSpacingHorizontalXSmall: 0.5rem; --c-colorPickerInputCustomHexFontSize: 0.75rem; --c-varSpacingMedium: 1rem; --c-colorBackgroundShadeDark: rgb(201, 201, 201); --c-colorPickerSwatchesWidth: 13.3rem; --c-squareIconLargeBoundaryAlt: 5rem; --c-colorBorderInputDisabled: rgb(201, 201, 201); --c-paletteYellow40: rgb(140, 75, 2); --c-cardWrapperSpacing: 1rem; --c-colorBackgroundNotificationBadgeActive: rgb(3, 45, 96); --c-colorBackgroundHighlight: rgb(250, 255, 189); --c-colorBackgroundRowActive: rgb(243, 243, 243); --c-componentSpacingMargin: 0; --c-colorBorderButtonFocusInverse: rgb(243, 243, 243); --c-shadowButtonFocus: 0 0 3px #0176d3; --c-varSpacingVerticalXLarge: 2rem; --c-pdpStandardText: #231F20; --c-tableColorBackgroundHeaderHover: rgb(243, 243, 243); --c-colorBackgroundDockedPanel: rgb(255, 255, 255); --c-colorTextTertiary: rgb(116, 116, 116); --c-varSpacingVerticalXxLarge: 3rem; --c-paletteYellow50: rgb(168, 100, 3); --c-brandContrastActive: rgb(13, 14, 18); --c-squareIconLargeContent: 2rem; --c-colorPickerSliderThumbColorBackground: rgb(243, 243, 243); --c-inputStaticFontSize: 0.8125rem; --c-borderWidthThin: 1px; --c-fontWeightRegular: 400; --c-colorBackgroundButtonSuccess: rgb(69, 198, 90); --c-splitViewColorBackgroundRowHover: rgb(255, 255, 255); --c-plpCardOrderName: 3; --c-paletteYellow20: rgb(79, 33, 0); --c-bannerUserDefaultImage: ; --c-elevation8: 8; --c-brandDark: rgb(1, 118, 211); --c-colorBackgroundPathCurrentHover: rgb(255, 255, 255); --c-elevation0: 0; --c-elevation2: 2; --c-pageHeaderJoinedColorBorder: rgb(201, 201, 201); --c-elevation4: 4; --c-durationPaused: 3.2s; --c-colorBrand: rgb(27, 150, 255); --c-colorBackgroundPathComplete: rgb(59, 167, 85); --c-progressColorBorderHover: rgb(1, 118, 211); --c-spacingXxSmall: 0.25rem; --c-tableCellSpacing: 0.5rem; --c-colorBorderContextBarThemeDefault: rgb(13, 157, 218); --c-colorBackgroundAnchor: rgb(243, 243, 243); --c-paletteYellow30: rgb(111, 52, 0); --c-shadowButtonFocusInverse: 0 0 3px #f3f3f3; --c-welcomeMatFontSizeInfoTitle: 2.625rem; --c-colorBorderLinkFocusInverse: rgb(243, 243, 243); --c-borderRadiusCircle: 50%; --c-buttonColorBorderSecondary: rgba(255, 255, 255, 0.8); --c-colorTextSuccessInverse: rgb(69, 198, 90); --c-varSpacingXLarge: 2rem; --c-sizeXLarge: 40rem; --c-varSpacingHorizontalXxxSmall: 0.125rem; --c-elevation3Inset: -3; --c-lineHeightTab: 2.5rem; --c-colorBackgroundDestructiveActive: rgb(142, 3, 15); --c-plpCardOrderPrice: 6; --c-colorTextLinkPrimaryActive: rgb(3, 45, 96); --c-colorBackgroundPageHeader: rgb(255, 255, 255); --c-colorBackgroundPill: rgb(255, 255, 255); --c-fillBrandHover: rgb(1, 68, 134); --c-colorBorderContextBarItem: rgba(0, 0, 0, 0.2); --c-borderStrokeWidthThin: 1px; --c-progressColorBorderShade: rgb(243, 243, 243); --c-heightHeader: 2.75rem; --c-shadowInlineEdit: 0 2px 4px 4px rgba(0, 0, 0, 0.16); --c-colorBackgroundNotificationBadgeHover: rgb(1, 68, 134); --c-borderRadiusPill: 15rem; --c-colorTextButtonInverseDisabled: rgba(255, 255, 255, 0.5); --c-sizeXxxSmall: 3rem; --c-colorBackgroundSuccessDarker: rgb(25, 78, 49); --c-colorBackgroundToggleHover: rgb(147, 147, 147); --c-paletteYellow15: rgb(46, 34, 4); --c-paletteYellow10: rgb(40, 18, 2); --c-cardSpacingSmall: 0.75rem; --c-illustrationEmptyStateTasks: url(/_slds/images/illustrations/empty-state-tasks.svg?cache=dc5e5e5b); --c-brandBandScrimHeight: 3.125rem; --c-popoverWalkthroughColorBackground: rgb(0, 22, 57); --c-colorBorderErrorDark: rgb(254, 143, 125); --c-heightTappableSmall: 2rem; --c-colorBackgroundButtonBrandDisabled: rgb(243, 243, 243); --c-colorBorderPrimary: rgb(201, 201, 201); --c-colorGray1: rgb(255, 255, 255); --c-fontSizeXLarge: 1.5rem; --c-varSquareIconMediumBoundary: 2rem; --c-colorGray5: rgb(221, 219, 218); --c-colorGray4: rgb(236, 235, 234); --c-colorGray3: rgb(243, 242, 242); --c-colorGray2: rgb(250, 250, 249); --c-opacity8: 0.8; --c-salesforceSansBoldItalicWoff2: url(../fonts/SalesforceSans-BoldItalic.woff2); --c-opacity5: 0.5; --c-pdpTagText: #216093; --c-squareIconGlobalIdentityIcon: 1.25rem; --c-colorBackgroundBrowser: rgb(116, 116, 116); --c-colorTextIconInverseActive: rgb(255, 255, 255); --c-shadowDocked: 0 -2px 2px 0 rgba(0, 0, 0, 0.16); --c-colorBackgroundInputError: rgb(253, 221, 227); --c-colorGray9: rgb(112, 110, 107); --c-colorGray8: rgb(150, 148, 146); --c-colorGray7: rgb(176, 173, 171); --c-colorGray6: rgb(201, 199, 197); --c-colorTextLinkInverse: rgb(255, 255, 255); --c-squareIconSmallBoundary: 1.5rem; --c-varSpacingHorizontalXLarge: 2rem; --c-colorBackgroundDark: rgb(243, 243, 243); --c-colorTextWarningAlt: rgb(140, 75, 2); --c-elevationInverseShadow2: 0 -2px 2px 0 rgba(0, 0, 0, 0.16); --c-elevationInverseShadow0: none; --c-colorStrokeBrand: rgb(1, 118, 211); --c-colorBackgroundToggleActive: rgb(1, 68, 134); --c-colorBorderContextBarDivider: rgba(255, 255, 255, 0.2); --c-zIndexToast: 10000; --c-colorBackgroundContextBarActionHighlight: rgba(255, 255, 255, 0.2); --c-colorBackgroundBrandPrimaryFocus: rgb(1, 68, 134); --c-buttonColorBackgroundBrandPrimary: rgb(1, 118, 211); --c-brandHeaderContrastWarm: rgb(186, 5, 23); --c-buttonColorTextPrimary: rgb(255, 255, 255); --c-colorBrandDarker: rgb(1, 68, 134); --c-colorBorderPathCurrentHover: rgb(3, 45, 96); --c-colorTextButtonDefaultDisabled: rgb(201, 201, 201); --c-colorBackgroundPathLost: rgb(234, 0, 30); --c-einsteinHeaderBackground: url(/_slds/images/einstein-headers/einstein-header-background.svg?cache=ff7fa2ff); --c-brandTextLink: rgb(1, 118, 211); --c-sliderTrackColorBackground: rgb(243, 243, 243); --c-colorContrastPrimary: rgb(243, 243, 243); --c-groupDefaultAvatar: url(/_slds/images/group_avatar_200.png?cache=a0044dae); --c-templateProfileGutters: 0; --c-sizeXxSmall: 6rem; --c-colorBackgroundPayload: rgb(243, 243, 243); --c-plpCardOrderTags: 2; --c-paletteCloudBlue90: rgb(207, 233, 254); --c-colorBackgroundPathActive: rgb(1, 68, 134); --c-colorTextDestructive: rgb(234, 0, 30); --c-squareIconLargeBoundary: 3rem; --c-colorBorderWarning: rgb(254, 147, 57); --c-shadowSoftPrimaryHover: none; --c-paletteCloudBlue95: rgb(234, 245, 254); --c-spacingSmall: 0.75rem; --c-colorBackgroundErrorDark: rgb(186, 5, 23); --c-brandHeaderContrastWeakDisabled: rgba(166, 166, 166, 0.25); --c-squareIconMediumContentAlt: 0.875rem; --c-colorBackgroundButtonInverse: rgba(0, 0, 0, 0); --c-brandHeader: rgb(255, 255, 255); --c-lineHeightText: 1.5; --c-widthStageLeftExpanded: 15rem; --c-colorBackgroundError: rgb(254, 92, 76); --c-colorTextButtonBrandActive: rgb(255, 255, 255); --c-fontFamily: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; --c-mqMedium: only screen and (min-width: 48em); --c-brandDarkActive: rgb(37, 48, 69); --c-colorBackgroundPathStepActionActive: rgb(0, 22, 57); --c-neutrafaceDisplayWoff2: url(../fonts/NeutrafaceDisplay.woff2); --c-spacingMedium: 1rem; --c-colorTextModal: rgb(255, 255, 255); --c-spinnerSizeLarge: 2.75rem; --c-carouselIndicatorColorBackgroundHover: rgb(243, 243, 243); --c-shadowActionOverflowFooter: 0 -2px 4px #f3f3f3; --c-popoverWalkthroughHeaderColorBackground: rgb(3, 45, 96); --c-colorBackgroundPathWon: rgb(46, 132, 74); --c-lineHeightToggle: 1.3rem; --c-neutrafaceDisplayWoff: url(../fonts/NeutrafaceDisplay.woff); --c-cardFooterPadding: 0 1rem 0.75rem; --c-sliderHandleColorBackground: rgb(27, 150, 255); --c-colorBackgroundErrorAlt: rgb(254, 143, 125); --c-colorBackgroundIndicatorDot: rgb(3, 45, 96); --c-chatMessageColorBackgroundInbound: rgb(243, 243, 243); --c-elevationShadow0: none; --c-heightPill: 1.625rem; --c-elevationShadow4: 0 4px 4px 0 rgba(0, 0, 0, 0.16); --c-elevationShadow2: 0 2px 2px 0 rgba(0, 0, 0, 0.16); --c-plpCardOrderSku: 5; --c-elevationShadow8: 0 8px 8px 0 rgba(0, 0, 0, 0.16); --c-varFontSize8: 1.5rem; --c-colorBackgroundButtonDefaultDisabled: rgb(255, 255, 255); --c-varFontSize7: 1.25rem; --c-elevationInverseShadow8: 0 -8px 8px 0 rgba(0, 0, 0, 0.16); --c-varFontSize9: 1.75rem; --c-brandBandColorBackgroundPrimary: rgba(0, 0, 0, 0); --c-colorTextButtonBrand: rgb(255, 255, 255); --c-elevationInverseShadow4: 0 -4px 4px 0 rgba(0, 0, 0, 0.16); --c-colorBackgroundToggleActiveHover: rgb(1, 68, 134); --c-welcomeMatBackgroundImageInfo: url(/_slds/images/welcome-mat/bg-info@2x.png?cache=ddb4e82f); --c-varFontSize2: 0.75rem; --c-varFontSize1: 0.625rem; --c-varFontSize4: 0.875rem; --c-pageHeaderSpacingRow: 0.75rem 1rem; --c-varFontSize3: 0.8125rem; --c-varFontSize6: 1.125rem; --c-varFontSize5: 1rem; --c-varSpacingVerticalMedium: 1rem; --c-pageHeaderSpacingPadding: 1rem; --c-colorTextModalButton: rgb(116, 116, 116); --c-colorBackgroundPrimary: rgb(255, 255, 255); --c-colorTextInputFocusInverse: rgb(3, 45, 96); --c-colorBackgroundScrollbarTrack: rgb(201, 201, 201); --c-paletteNeutral70: rgb(174, 174, 174); --c-brandPrimaryActive: rgb(1, 118, 211); --c-popoverWalkthroughAltImage: ; --c-nubbinTriangleOffset: -0.1875rem; --c-salesforceSansLightWoff: url(../fonts/SalesforceSans-Light.woff); --c-colorBorderSuccessDark: rgb(46, 132, 74); --c-mqHighRes: only screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx); --c-brandBandColorBackgroundPrimaryTransparent: rgba(0, 0, 0, 0); --c-colorBackgroundContextBarInverseItemActive: rgba(255, 255, 255, 0.4); --c-colorTextButtonDefaultHint: rgb(174, 174, 174); --c-salesforceSansItalicWoff2: url(../fonts/SalesforceSans-Italic.woff2); --c-paletteGreen60: rgb(59, 167, 85); --c-heightContextBar: 2.5rem; --c-colorBackgroundOrgSwitcherArrow: rgb(0, 22, 57); --c-paletteGreen65: rgb(65, 182, 88); --c-brandHeaderContrastInverse: rgb(255, 255, 255); --c-notificationColorBackgroundInverse: rgb(116, 116, 116); --c-colorBackgroundButtonIconDisabled: rgb(255, 255, 255); --c-paletteNeutral60: rgb(147, 147, 147); --c-colorBorderContextBarThemeDefaultAlt: rgb(243, 243, 243); --c-fillBrand: rgb(1, 118, 211); --c-colorBackgroundInputCheckbox: rgb(255, 255, 255); --c-colorBorder: rgb(201, 201, 201); --c-squareIconSmall: 1rem; --c-varSpacingHorizontalMedium: 1rem; --c-illustrationColorPrimary: rgb(144, 208, 254); --c-varSpacingVerticalXSmall: 0.5rem; --c-colorTextPlaceholder: rgb(116, 116, 116); --c-einsteinHeaderBackgroundColor: rgb(144, 208, 254); --c-paletteGreen70: rgb(69, 198, 90); --c-brandHeaderContrast: rgb(94, 94, 94); --c-inputStaticColor: rgb(24, 24, 24); --c-plpTag: #C23934; --c-paletteNeutral90: rgb(229, 229, 229); --c-paletteGreen90: rgb(205, 239, 196); --c-spacingXxLarge: 3rem; --c-shadowDropDown: 0 2px 3px 0 rgba(0, 0, 0, 0.16); --c-paletteNeutral95: rgb(243, 243, 243); --c-colorBackgroundModal: rgb(255, 255, 255); --c-elevationShadow3Below: 0 3px 3px 0 rgba(0, 0, 0, 0.16) inset; --c-paletteRed80: rgb(254, 184, 171); --c-sliderTrackWidth: 100%; --c-elevation32: 32; --c-globalHeaderColorBackground: rgb(255, 255, 255); --c-spacingXLarge: 2rem; --c-paletteGreen80: rgb(145, 219, 139); --c-colorBorderInputActive: rgb(27, 150, 255); --c-varSpacingXSmall: 0.5rem; --c-paletteNeutral80: rgb(201, 201, 201); --c-colorBackgroundModalButton: rgba(0, 0, 0, 0.07); --c-colorBorderPathDivider: rgb(255, 255, 255); --c-colorTextIconDefault: rgb(116, 116, 116); --c-zIndexDeepdive: -99999; --c-elevation16: 16; --c-paletteRed90: rgb(254, 222, 216); --c-globalnavigationItemHeightAccentActive: 3px; --c-templateGutters: 0; --c-paletteRed95: rgb(254, 241, 238); --c-buttonColorBorderBrandPrimary: rgb(1, 118, 211); --c-buttonIconBoundaryTouch: 2.75rem; --c-brandBackgroundPrimaryTransparent: rgba(176, 196, 223, 0); --c-fillHeaderButtonFocus: rgb(1, 118, 211); --c-colorBorderError: rgb(234, 0, 30); --c-colorTextLinkHover: rgb(1, 68, 134); --c-paletteGreen95: rgb(235, 247, 230); --c-einsteinHeaderFigure: url(/_slds/images/einstein-headers/einstein-figure.svg?cache=ec975fb1); --c-colorBorderRowSelected: rgb(1, 118, 211); --c-colorStrokeBrandHover: rgb(1, 118, 211); --c-paletteNeutral30: rgb(68, 68, 68); --c-varSpacingVerticalXxxSmall: 0.125rem; --c-paletteHotOrange10: rgb(40, 18, 2); --c-colorTextButtonBrandDisabled: rgb(255, 255, 255); --c-squareIconXSmallContent: 0.5rem; --c-varFontSize10: 2rem; --c-paletteRed60: rgb(254, 92, 76); --c-varFontSize11: 2.625rem; --c-paletteRed65: rgb(254, 119, 101); --c-buttonBorderRadius: .25rem; --c-squareTappableXSmall: 1.5rem; --c-colorBackgroundGuidance: rgb(255, 255, 255); --c-colorTextContextBarInverse: rgb(255, 255, 255); --c-paletteNeutral20: rgb(46, 46, 46); --c-fontFamilyHeading: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'; --c-paletteRed70: rgb(254, 143, 125); --c-brandHeaderContrastCoolActive: rgb(1, 68, 134); --c-borderWidthThick: 2px; --c-pageHeaderShadow: none; --c-spinnerSizeXxSmall: 0.5rem; --c-tableColorBackgroundHeader: rgb(255, 255, 255); --c-pageHeaderColorBackgroundAlt: rgb(255, 255, 255); --c-colorBorderBrandPrimaryHover: rgb(1, 118, 211); --c-colorTextTabLabelActive: rgb(3, 45, 96); --c-paletteNeutral50: rgb(116, 116, 116); --c-colorBackgroundTempModalTint: rgba(126, 140, 153, 0.8); --c-fontSizeMedium: 1rem; --c-colorBorderButtonBrand: rgb(1, 118, 211); --c-paletteHotOrange30: rgb(126, 38, 0); --c-paletteRed40: rgb(186, 5, 23); --c-brandBandImageHeightSmall: 6rem; --c-colorTextInverseWeak: rgb(174, 174, 174); --c-colorTextInverse: rgb(255, 255, 255); --c-shadowLinkFocusInverse: 0 0 3px #f3f3f3; --c-squareIconXxSmallBoundary: 1rem; --c-lineHeightReset: 1; --c-verticalNavigationColorBackgroundShadeRowActive: rgb(243, 243, 243); --c-colorBackgroundTempModal: rgba(126, 140, 153, 0.8); --c-colorBackgroundToggleDisabled: rgb(174, 174, 174); --c-colorGray13: rgb(8, 7, 7); --c-colorGray10: rgb(81, 79, 77); --c-paletteNeutral40: rgb(92, 92, 92); --c-colorBorderInverse: rgb(0, 22, 57); --c-carouselIndicatorColorBackgroundActive: rgb(1, 118, 211); --c-colorBackgroundBackdrop: rgba(255, 255, 255, 0.75); --c-colorGray12: rgb(43, 40, 38); --c-colorGray11: rgb(62, 62, 60); --c-colorTextContextBarActionTrigger: rgba(255, 255, 255, 0.4); --c-paletteHotOrange20: rgb(74, 36, 19); --c-colorBackgroundNotification: rgb(255, 255, 255); --c-colorBackgroundPathStepActionCurrent: rgb(1, 68, 134); --c-badgeColorBackgroundInverse: rgb(116, 116, 116); --c-colorBorderSeparatorInverse: rgb(3, 45, 96); --c-paletteRed50: rgb(234, 0, 30); --c-colorBackgroundSpinnerDot: rgb(174, 174, 174); --c-colorBackgroundButtonBrandActive: rgb(3, 45, 96); --c-paletteHotOrange15: rgb(66, 22, 4); --c-sliderHandleColorBackgroundFocus: rgb(1, 118, 211); --c-spinnerSizeMedium: 2rem; --c-brandPrimary: rgb(27, 150, 255); --c-paletteHotOrange50: rgb(216, 58, 0); --c-colorTextLinkPrimaryFocus: rgb(1, 118, 211); --c-colorTextInputDisabled: rgb(116, 116, 116); --c-brandLogoImage: ; --c-brandLight: rgb(244, 246, 254); --c-paletteRed20: rgb(100, 1, 3); --c-fillHeaderButton: rgb(174, 174, 174); --c-varLineHeightText: 1.5; --c-colorBackgroundPathCurrent: rgb(255, 255, 255); --c-colorBackgroundOffline: rgb(68, 68, 68); --c-colorBorderTabSelected: rgb(1, 118, 211); --c-colorTextWarning: rgb(254, 147, 57); --c-salesforceSansRegularWoff: url(../fonts/SalesforceSans-Regular.woff); --c-paletteHotOrange40: rgb(170, 48, 1); --c-cardSpacingLarge: 1.5rem; --c-paletteRed30: rgb(142, 3, 15); --c-fontSizeMediumA: 1.125rem; --c-borderRadiusMedium: 0.25rem; --c-colorPickerSliderThumbBorderColor: rgb(68, 68, 68); --c-shadowSoftPrimary: none; --c-zIndexDropdown: 7000; --c-paletteHotOrange70: rgb(255, 144, 110); --c-verticalNavigationColorBackgroundShadeRowHover: rgb(243, 243, 243); --c-squareIconMediumBoundary: 2rem; --c-colorBackgroundButtonDefaultFocus: rgb(243, 243, 243); --c-heightTappable: 2.75rem; --c-colorBackgroundToastError: rgb(234, 0, 30); --c-brandBandDefaultImage: ; --c-durationQuickly: 0.1s; --c-colorBackgroundSelection: rgb(216, 230, 254); --c-paletteHotOrange60: rgb(255, 93, 45); --c-colorBackgroundActionbarIconUtility: rgb(116, 116, 116); --c-colorBackgroundNotificationBadgeFocus: rgb(1, 68, 134); --c-paletteHotOrange65: rgb(255, 120, 79); --c-cardFooterTextAlign: right; --c-colorBorderBrandDark: rgb(1, 68, 134); --c-brandBackgroundDark: rgb(232, 232, 232); --c-avatarGroupColorBackgroundLightest: rgb(255, 255, 255); --c-colorTextContextBar: rgb(68, 68, 68); --c-inputStaticFontWeight: 400; --c-paletteRed10: rgb(48, 12, 1); --c-colorTextLinkDisabled: rgb(3, 45, 96); --c-colorTextPathCurrent: rgb(1, 68, 134); --c-paletteRed15: rgb(74, 12, 4); --c-zIndexOverlay: 8000; --c-buttonColorBorderPrimary: rgb(243, 243, 243); --c-pdpSaleRed: #C23934; --c-paletteHotOrange90: rgb(255, 222, 213); --c-pdpLightGray: #DDDCD9; --c-shadowImage: 0 1px 1px rgba(0, 0, 0, 0.16); --c-paletteHotOrange95: rgb(254, 241, 237); --c-cardHeaderPadding: 0.75rem 1rem 0; --c-colorBorderSeparatorAlt2: rgb(201, 201, 201); --c-plpCardOrderSwatches: 4; --c-fillBrandActive: rgb(3, 45, 96); --c-fontSizeTextMedium: 1rem; --c-spacingXSmall: 0.5rem; --c-chatMessageColorBackgroundOutboundAgent: rgb(116, 116, 116); --c-colorBackgroundButtonIconHover: rgb(243, 243, 243); --c-sliderHandleColorBackgroundActive: rgb(1, 118, 211); --c-colorBorderSuccess: rgb(145, 219, 139); --c-colorTextIconInverseHover: rgb(255, 255, 255); --c-componentSpacingPadding: 1rem; --c-colorBorderDestructiveActive: rgb(142, 3, 15); --c-colorBackgroundButtonInverseDisabled: rgba(0, 0, 0, 0); --c-colorTextTabLabelFocus: rgb(1, 68, 134); --c-paletteHotOrange80: rgb(254, 185, 165); --c-colorBackgroundNotificationBadge: rgb(234, 0, 30); --c-zIndexReminder: 8500; --c-colorBackgroundImageOverlay: rgba(0, 0, 0, 0.4); --c-colorBackgroundReminderHover: rgb(255, 255, 255); --c-colorTextPathCurrentHover: rgb(3, 45, 96); --c-colorBackgroundCustomer: rgb(254, 147, 57); --c-colorBackgroundButtonDefault: rgb(255, 255, 255); --c-colorBackgroundInverseLight: rgb(3, 45, 96); --c-salesforceSansBoldWoff: url(../fonts/SalesforceSans-Bold.woff); --c-progressColorBorderActive: rgb(27, 150, 255); --c-plpCardOrderMainImage: 1; --c-fontSizeLarge: 1.25rem; --c-brandHeaderContrastWeakActive: rgb(129, 129, 129); --c-brandHeaderContrastWarmActive: rgb(186, 5, 23); --c-squareToggleSlider: 1.25rem; --c-pdpWarningBackground: #FFEACC; --c-progressBarColorBackgroundFillSuccess: rgb(46, 132, 74); --c-colorBackgroundButtonBrand: rgb(1, 118, 211); --c-colorBackgroundWarningDark: rgb(254, 147, 57); --c-colorTextIconUtility: rgb(174, 174, 174); --c-colorBackgroundScrollbar: rgb(243, 243, 243); --c-chatMessageColorBackgroundStatus: rgb(255, 255, 255); --c-colorBackgroundTempModalTintAlt: rgba(255, 255, 255, 0.75); --c-pageHeaderBorderRadius: 0; --c-palettePink95: rgb(254, 240, 243); --c-welcomeMatColorIconComplete: rgb(201, 201, 201); --c-palettePink90: rgb(253, 221, 227); --c-paletteViolet50: rgb(186, 1, 255); --c-paletteTeal30: rgb(2, 77, 76); --c-colorTextIconInverseDisabled: rgba(255, 255, 255, 0.15); --c-bannerGroupDefaultImage: ; --c-colorBorderBrand: rgb(27, 150, 255); --c-colorBackgroundInfo: rgb(116, 116, 116); --c-heightToggle: 1.5rem; --c-badgeColorBackgroundLightest: rgb(255, 255, 255); --c-brandBandColorBackgroundSecondary: rgba(0, 0, 0, 0); --c-shadowSoftPrimaryActive: none; --c-colorTextIconDefaultHint: rgb(174, 174, 174); --c-colorBackgroundChromeMobile: rgb(1, 118, 211); --c-colorPickerSwatchSize: 1.25rem; --c-colorBackgroundPathIncomplete: rgb(243, 243, 243); --c-paletteTeal40: rgb(5, 103, 100); --c-pdpButtonBrand: #216093; --c-colorTextToggleDisabled: rgb(201, 201, 201); --c-paletteViolet40: rgb(150, 2, 199); --c-colorTextLinkInverseHover: rgba(255, 255, 255, 0.75); --c-palettePink80: rgb(253, 182, 197); --c-zIndexModal: 9000; --c-pageHeaderIconSize: 2.25rem; --c-colorTextDestructiveHover: rgb(186, 5, 23); --c-colorBorderCanvasElementSelection: rgb(26, 185, 255); --c-colorBackgroundSuccess: rgb(69, 198, 90); --c-carouselIndicatorColorBackground: rgb(255, 255, 255); --c-sliderTrackHeight: 4px; --c-squareIconSmallContent: 0.75rem; --c-colorBackgroundInputDisabled: rgb(243, 243, 243); --c-paletteTeal50: rgb(11, 130, 124); --c-pdpDarkGray: #6B6D70; --c-palettePink70: rgb(254, 138, 167); --c-paletteViolet30: rgb(115, 3, 148); --c-mqSmall: only screen and (max-width: 47.9375em); --c-brandBandImageHeightLarge: 18.75rem; --c-carouselIndicatorWidth: 1rem; --c-colorTextLinkActive: rgb(3, 45, 96); --c-squareIconXxSmallContent: .875rem; --c-fontSizeXSmall: 0.625rem; --c-palettePink65: rgb(254, 114, 152); --c-sliderColorBackgroundDisabled: rgb(243, 243, 243); --c-colorContrastSecondary: rgb(255, 255, 255); --c-welcomeMatColorBackgroundProgressBar: rgb(255, 255, 255); --c-globalActionIconSize: 1.5rem; --c-paletteViolet20: rgb(72, 26, 84); --c-fontSizeHeadingSmall: 0.875rem; --c-colorPickerRangeIndicatorSize: 0.75rem; --c-paletteOrange15: rgb(55, 30, 3); --c-sliderHandleSize: 1rem; --c-tableBorderRadius: 0; --c-paletteTeal60: rgb(6, 165, 154); --c-userDefaultAvatarSmall: url(/_slds/images/profile_avatar_96.png?cache=3c01f25f); --c-buttonColorBackgroundPrimary: rgb(255, 255, 255); --c-colorPickerInputCustomHexWidth: 4.2rem; --c-paletteOrange10: rgb(32, 22, 0); --c-plpCardButtons: 7; --c-palettePink60: rgb(255, 83, 138); --c-paletteTeal65: rgb(3, 180, 167); --c-colorBackgroundRowSelected: rgb(243, 243, 243); --c-colorBackgroundContextBarBrandAccent: rgb(13, 157, 218); --c-fontFamilyMonospace: Consolas, Menlo, Monaco, Courier, monospace; --c-cardFooterColorBorder: rgba(0, 0, 0, 0); --c-palettePurple80: rgb(215, 191, 242); --c-varSpacingHorizontalLarge: 1.5rem; --c-colorTextRequired: rgb(234, 0, 30); --c-elevationShadow16: 0 16px 16px 0 rgba(0, 0, 0, 0.16); --c-paletteViolet10: rgb(46, 0, 57); --c-shadowHardPrimary: none; --c-paletteOrange20: rgb(62, 43, 2); --c-paletteViolet15: rgb(61, 1, 87); --c-radioButtonGroupLineHeightTouch: 2.69rem; --c-colorBackgroundBrandPrimary: rgb(1, 118, 211); --c-paletteTeal70: rgb(1, 195, 179); --c-colorBackgroundUtilityBarActive: rgb(27, 150, 255); --c-zIndexSticky: 100; --c-colorBackgroundContextBarShadow: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0, rgba(0, 0, 0, 0) 100%); --c-paletteTeal80: rgb(4, 225, 203); --c-palettePurple90: rgb(236, 225, 249); --c-squareIconUtilityLarge: 1.5rem; --c-fontSize10: 2rem; --c-groupDefaultAvatarMedium: url(/_slds/images/group_avatar_160.png?cache=b8fe8e83); --c-elevationShadow32: 0 32px 32px 0 rgba(0, 0, 0, 0.16); --c-paletteOrange30: rgb(95, 62, 2); --c-colorBorderButtonInverseDisabled: rgba(255, 255, 255, 0.15); --c-fontSize11: 2.625rem; --c-einsteinHeaderTextShadow: #cfe9fe; --c-palettePurple95: rgb(246, 242, 251); --c-squareTappableXxSmall: 1.25rem; --c-colorBackgroundDestructiveHover: rgb(142, 3, 15); --c-fontSize9: 1.75rem; --c-colorBackgroundLight: rgb(255, 255, 255); --c-fontSize8: 1.5rem; --c-paletteTeal90: rgb(172, 243, 228); --c-shadowActive: 0 0 2px #0176d3; --c-fontSize1: 0.625rem; --c-paletteNeutral100: rgb(255, 255, 255); --c-colorTextLink: rgb(1, 118, 211); --c-pageHeaderTitleFontSize: 1.125rem; --c-fontSize3: 0.8125rem; --c-fontSize2: 0.75rem; --c-colorTextLinkInverseDisabled: rgba(255, 255, 255, 0.15); --c-fontSize5: 1rem; --c-fontSize4: 0.875rem; --c-fontSize7: 1.25rem; --c-fontSize6: 1.125rem; --c-spacingNone: 0; --c-paletteOrange40: rgb(130, 81, 1); --c-inputReadonlyFontWeight: 400; --c-palettePurple60: rgb(173, 123, 238); --c-paletteTeal95: rgb(222, 249, 243); --c-colorStrokeHeaderButton: rgb(174, 174, 174); --c-typingIconDotColorBackgroundGray: rgb(201, 201, 201); --c-palettePurple65: rgb(183, 141, 239); --c-pageHeaderTitleFontWeight: 400; --c-colorBackgroundButtonIconFocus: rgb(243, 243, 243); --c-groupDefaultAvatarSmall: url(/_slds/images/group_avatar_96.png?cache=d0659d12); --c-colorBackgroundModalBrand: rgb(1, 68, 134); --c-colorTextInverseActive: rgb(26, 185, 255); --c-colorBackgroundHighlightSearch: rgb(255, 240, 63); --c-paletteOrange50: rgb(169, 100, 4); --c-colorBackgroundSuccessDark: rgb(46, 132, 74); --c-shadowOverlay: 0 -2px 4px rgba(0, 0, 0, 0.07); --c-sizeXSmall: 12rem; --c-colorBackgroundDestructive: rgb(186, 5, 23); --c-typingIconDotSize: .5rem; --c-palettePurple70: rgb(194, 158, 241); --c-colorBorderInfo: rgb(116, 116, 116); --c-colorTextTabLabel: rgb(3, 45, 96); --c-palettePink15: rgb(75, 6, 32); --c-popoverWalkthroughColorBackgroundAlt: rgb(1, 118, 211); --c-durationImmediately: 0.05s; --c-palettePink10: rgb(55, 1, 20); --c-elevationInverseShadow16: 0 -16px 16px 0 rgba(0, 0, 0, 0.16); --c-salesforceSansLightWoff2: url(../fonts/SalesforceSans-Light.woff2); --c-splitViewWidth: 25rem; --c-colorBorderIconInverseHint: rgba(255, 255, 255, 0.5); --c-brandDisabled: rgb(201, 199, 197); --c-paletteOrange60: rgb(221, 122, 1); --c-palettePurple40: rgb(117, 38, 227); --c-paletteOrange65: rgb(243, 131, 3); --c-progressColorBackground: rgb(255, 255, 255); --c-colorBorderContextBarThemeDefaultActive: rgb(243, 243, 243); --c-avatarGroupColorBackgroundInverse: rgb(116, 116, 116); --c-colorBackgroundAlt2: rgb(243, 243, 243); --c-cardFontWeight: 400; --c-colorPickerSwatchShadow: inset 0 0 1px rgba(0, 0, 0, 0.4); --c-paletteOrange70: rgb(254, 147, 57); --c-colorTextIconBrand: rgb(1, 118, 211); --c-colorTextButtonDefault: rgb(1, 118, 211); --c-palettePurple50: rgb(144, 80, 233); --c-pathButtonWidthFixed: 13rem; --c-sizeLarge: 25rem; --c-userDefaultAvatarMedium: url(/_slds/images/profile_avatar_160.png?cache=bfba2c9a); --c-colorBorderDestructive: rgb(234, 0, 30); --c-colorTextWeak: rgb(116, 116, 116); --c-fontSizeHeadingMedium: 1.125rem; --c-mqSingleColumnRecordLayout: (max-width: 599px); --c-colorBackgroundInputSearch: rgba(0, 0, 0, 0.16); --c-welcomeMatBackgroundColorInfo: rgb(207, 233, 254); --c-colorBorderBrandPrimary: rgb(27, 150, 255); --c-colorBackgroundInverse: rgb(0, 22, 57); --c-maxWidthActionOverflowMenu: 512px; --c-paletteNeutral10: rgb(24, 24, 24); --c-carouselColorBackground: rgb(255, 255, 255); --c-colorTextLabel: rgb(116, 116, 116); --c-colorBackgroundButtonSuccessActive: rgb(46, 132, 74); --c-squareIconLarge: 3.125rem; --c-spinnerSizeXSmall: 1rem; --c-paletteOrange80: rgb(255, 186, 144); --c-cardSpacingMargin: 1rem; --c-colorTextBrowserActive: rgba(0, 0, 0, 0.4); --c-colorBackgroundButtonBrandHover: rgb(1, 68, 134); --c-chatMessageColorBackgroundOutbound: rgb(1, 68, 134); --c-colorTextIconDefaultActive: rgb(3, 45, 96); --c-palettePurple20: rgb(64, 16, 117); --c-colorTextIconDefaultHover: rgb(1, 118, 211); --c-colorTextLinkPrimary: rgb(1, 118, 211); --c-fontSizeTextXSmall: 0.75rem; --c-colorBackgroundToast: rgb(116, 116, 116); --c-fontSizeXxLarge: 2rem; --c-heightSalesPath: 2rem; --c-colorTextIconDefaultHintBorderless: rgb(243, 243, 243); --c-paletteOrange95: rgb(255, 241, 234); --c-colorForegroundPrimary: rgb(255, 255, 255); --c-paletteOrange90: rgb(254, 223, 208); --c-colorBackgroundRowNew: rgb(205, 239, 196); --c-fontSizeTextLarge: 1.125rem; --c-paletteGreen15: rgb(12, 41, 18); --c-colorBackgroundShade: rgb(243, 243, 243); --c-paletteGreen10: rgb(7, 27, 18); --c-palettePurple30: rgb(90, 27, 169); --c-varSpacingXxxSmall: 0.125rem; --c-brandLightActive: rgb(227, 229, 237); --c-welcomeMatTextColorInfo: rgb(3, 45, 96); --c-pdpTagBackground: #E3F1FD; --c-colorBackgroundIconWaffle: rgb(116, 116, 116); --c-colorBackgroundContextBarItemHover: rgb(255, 255, 255); --c-fontSizeXLargeA: 1.57rem; --c-colorBackgroundPathCompleteHover: rgb(46, 132, 74); --c-palettePink50: rgb(227, 6, 106); --c-paletteViolet90: rgb(242, 222, 254); --c-paletteGreen20: rgb(28, 51, 38); --c-paletteViolet95: rgb(249, 240, 255); --c-colorBorderContextBarThemeDefaultHover: rgb(50, 29, 113); --c-squareIconMedium: 2.375rem; --c-textTransform: none; --c-colorBackgroundBrandPrimaryHover: rgb(1, 68, 134); --c-colorTextSuccess: rgb(46, 132, 74); --c-carouselIndicatorColorBackgroundFocus: rgb(1, 68, 134); --c-colorBackgroundChromeDesktop: rgb(255, 255, 255); --c-borderStrokeWidthThick: 2px; --c-colorBackgroundReminder: rgb(243, 243, 243); --c-palettePurple15: rgb(48, 11, 96); --c-colorTextToast: rgb(243, 243, 243); --c-paletteViolet80: rgb(229, 185, 254); --c-colorBackgroundAlt: rgb(255, 255, 255); --c-palettePink40: rgb(182, 5, 84); --c-paletteGreen30: rgb(25, 78, 49); --c-palettePurple10: rgb(36, 6, 67); --c-elevationInverseShadow32: 0 -32px 32px 0 rgba(0, 0, 0, 0.16); --c-colorBorderCustomer: rgb(254, 147, 57); --c-tableColorBackgroundStripes: rgb(243, 243, 243); --c-varSpacingVerticalSmall: 0.75rem; --c-palettePink30: rgb(138, 3, 62); --c-paletteViolet70: rgb(216, 146, 254); --c-colorBorderContextBarInverseItem: rgba(255, 255, 255, 0.2); --c-utilityBarColorBackgroundNotificationBadge: rgb(254, 92, 76); --c-colorTextTabLabelDisabled: rgb(243, 243, 243); --c-heightInput: 1.875rem; --c-squareTappable: 2.75rem; --c-fontSizeSmall: 0.875rem; --c-paletteGreen40: rgb(57, 101, 71); --c-tableColorBackgroundHeaderFocus: rgb(255, 255, 255); --c-salesforceSansRegularWoff2: url(../fonts/SalesforceSans-Regular.woff2); --c-varSpacingHorizontalXxLarge: 3rem; --c-paletteViolet65: rgb(209, 125, 254); --c-progressBarColorBackgroundFill: rgb(26, 185, 255); --c-colorBorderSeparator: rgb(243, 243, 243); --c-paletteGreen50: rgb(46, 132, 74); --c-brandHeaderIconDisabled: rgba(145, 145, 145, 0.25); --c-palettePink20: rgb(97, 2, 42); --c-splitViewColorBackground: rgb(243, 243, 243); --c-colorBackgroundSecondary: rgb(243, 243, 243); --c-colorTextLinkFocus: rgb(1, 68, 134); --c-paletteViolet60: rgb(203, 101, 255); } /* root 2 */ :root { --dxp-g-root: var(--lwc-dxpGRoot, #FFFFFF); --dxp-g-root-1: var(--lwc-dxpGRoot1, rgb(235, 235, 235)); --dxp-g-root-2: var(--lwc-dxpGRoot2, rgb(194, 194, 194)); --dxp-g-root-3: var(--lwc-dxpGRoot3, rgb(133, 133, 133)); --dxp-g-root-contrast: var(--lwc-dxpGRootContrast, rgb(35, 31, 32)); --dxp-g-root-contrast-1: var(--lwc-dxpGRootContrast1, rgb(13, 12, 12)); --dxp-g-root-contrast-2: var(--lwc-dxpGRootContrast2, rgb(0, 0, 0)); --dxp-g-root-contrast-3: var(--lwc-dxpGRootContrast3, rgb(0, 0, 0)); --dxp-g-neutral: var(--lwc-dxpGNeutral, #ecebea); --dxp-g-neutral-1: var(--lwc-dxpGNeutral1, rgb(217, 215, 213)); --dxp-g-neutral-2: var(--lwc-dxpGNeutral2, rgb(178, 174, 170)); --dxp-g-neutral-3: var(--lwc-dxpGNeutral3, rgb(118, 113, 107)); --dxp-g-neutral-contrast: var(--lwc-dxpGNeutralContrast, #000); --dxp-g-neutral-contrast-1: var(--lwc-dxpGNeutralContrast1, #000); --dxp-g-neutral-contrast-2: var(--lwc-dxpGNeutralContrast2, #000); --dxp-g-neutral-contrast-3: var(--lwc-dxpGNeutralContrast3, #fff); --dxp-g-brand: var(--lwc-dxpGBrand, rgb(33, 96, 147)); --dxp-g-brand-1: var(--lwc-dxpGBrand1, rgb(26, 74, 114)); --dxp-g-brand-2: var(--lwc-dxpGBrand2, rgb(11, 31, 47)); --dxp-g-brand-3: var(--lwc-dxpGBrand3, rgb(0, 0, 0)); --dxp-g-brand-contrast: var(--lwc-dxpGBrandContrast, #FFFFFF); --dxp-g-brand-contrast-1: var(--lwc-dxpGBrandContrast1, rgb(255, 255, 255)); --dxp-g-brand-contrast-2: var(--lwc-dxpGBrandContrast2, rgb(255, 255, 255)); --dxp-g-brand-contrast-3: var(--lwc-dxpGBrandContrast3, rgb(255, 255, 255)); --dxp-g-success: #4bca81; --dxp-g-success-1: #36b66c; --dxp-g-success-2: #237747; --dxp-g-success-3: #07190f; --dxp-g-success-contrast: #000; --dxp-g-success-contrast-1: #000; --dxp-g-success-contrast-2: #fff; --dxp-g-success-contrast-3: #fff; --dxp-g-destructive: #c23934; --dxp-g-destructive-1: #a2302b; --dxp-g-destructive-2: #611d1a; --dxp-g-destructive-3: #010000; --dxp-g-destructive-contrast: #fff; --dxp-g-destructive-contrast-1: #fff; --dxp-g-destructive-contrast-2: #fff; --dxp-g-destructive-contrast-3: #fff; --dxp-g-warning: #ffb75d; --dxp-g-warning-1: #ffa534; --dxp-g-warning-2: #e27d00; --dxp-g-warning-3: #673900; --dxp-g-warning-contrast: #000; --dxp-g-warning-contrast-1: #000; --dxp-g-warning-contrast-2: #000; --dxp-g-warning-contrast-3: #fff; --dxp-g-info: #16325c; --dxp-g-info-1: #0e203b; --dxp-g-info-2: #000000; --dxp-g-info-3: #000000; --dxp-g-info-contrast: #fff; --dxp-g-info-contrast-1: #fff; --dxp-g-info-contrast-2: #fff; --dxp-g-info-contrast-3: #fff; --dxp-g-offline: #444; --dxp-g-offline-1: #303030; --dxp-g-offline-2: #070707; --dxp-g-offline-3: #000000; --dxp-g-offline-contrast: #fff; --dxp-g-offline-contrast-1: #fff; --dxp-g-offline-contrast-2: #fff; --dxp-g-offline-contrast-3: #fff; --dxp-g-spacing-none: 0 !important; --dxp-g-spacing-xxxsmall: .125rem; --dxp-g-spacing-xxsmall: .25rem; --dxp-g-spacing-xsmall: .5rem; --dxp-g-spacing-small: .75rem; --dxp-g-spacing-medium: 1rem; --dxp-g-spacing-large: 1.5rem; --dxp-g-spacing-xlarge: 2rem; --dxp-g-spacing-xxlarge: 3rem; --dxp-g-root-font-family: var(--lwc-fontFamily, Libre Franklin); --dxp-g-heading-font-family: var(--lwc-fontFamilyHeader, Libre Franklin); --dxp-g-font-size-1: .625rem; --dxp-g-font-size-2: .75rem; --dxp-g-font-size-3: .8125rem; --dxp-g-font-size-4: .875rem; --dxp-g-font-size-5: 1rem; --dxp-g-font-size-6: 1.125rem; --dxp-g-font-size-7: 1.25rem; --dxp-g-font-size-8: 1.5rem; --dxp-g-font-size-9: 1.75rem; --dxp-g-font-size-10: 2rem; --dxp-g-font-size-11: 2.625rem; --dxp-s-html-font-size: 16px; --dxp-s-text-heading-extra-large-font-family: var(--lwc-fontFamilyHeader, Libre Franklin); --dxp-s-text-heading-extra-large-font-size: 2.5rem; --dxp-s-text-heading-extra-large-font-style: normal; --dxp-s-text-heading-extra-large-font-weight: 300; --dxp-s-text-heading-extra-large-text-decoration: none; --dxp-s-text-heading-extra-large-text-transform: var(--lwc-textTransform, capitalize); --dxp-s-text-heading-extra-large-line-height: 1.25; --dxp-s-text-heading-extra-large-letter-spacing: 0; --dxp-s-text-heading-large-font-family: var(--lwc-fontFamilyHeader, Libre Franklin); --dxp-s-text-heading-large-font-size: 1.75rem; --dxp-s-text-heading-large-font-style: normal; --dxp-s-text-heading-large-font-weight: 300; --dxp-s-text-heading-large-text-decoration: none; --dxp-s-text-heading-large-text-transform: var(--lwc-textTransform, capitalize); --dxp-s-text-heading-large-line-height: 1.25; --dxp-s-text-heading-large-letter-spacing: 0; --dxp-s-text-heading-medium-font-family: var(--lwc-fontFamilyHeader, Libre Franklin); --dxp-s-text-heading-medium-font-size: 1.25rem; --dxp-s-text-heading-medium-font-style: normal; --dxp-s-text-heading-medium-font-weight: 300; --dxp-s-text-heading-medium-text-decoration: none; --dxp-s-text-heading-medium-text-transform: var(--lwc-textTransform, capitalize); --dxp-s-text-heading-medium-line-height: 1.25; --dxp-s-text-heading-medium-letter-spacing: 0; --dxp-s-text-heading-small-font-family: var(--lwc-fontFamilyHeader, Libre Franklin); --dxp-s-text-heading-small-font-size: 1.125rem; --dxp-s-text-heading-small-font-style: normal; --dxp-s-text-heading-small-font-weight: 300; --dxp-s-text-heading-small-text-decoration: none; --dxp-s-text-heading-small-text-transform: var(--lwc-textTransform, capitalize); --dxp-s-text-heading-small-line-height: 1.25; --dxp-s-text-heading-small-letter-spacing: 0; --dxp-s-body-font-family: var(--lwc-fontFamily, Libre Franklin); --dxp-s-body-font-size: 1rem; --dxp-s-body-font-style: normal; --dxp-s-body-font-weight: 400; --dxp-s-body-text-decoration: none; --dxp-s-body-text-transform: none; --dxp-s-body-line-height: 1.5; --dxp-s-body-letter-spacing: 0; --dxp-s-body-small-font-family: var(--lwc-fontFamily, Libre Franklin); --dxp-s-body-small-font-size: .75rem; --dxp-s-body-small-font-style: normal; --dxp-s-body-small-font-weight: 400; --dxp-s-body-small-text-decoration: none; --dxp-s-body-small-text-transform: none; --dxp-s-body-small-line-height: 1.25; --dxp-s-body-small-letter-spacing: 0; --dxp-s-button-font-family: var(--lwc-fontFamily, Libre Franklin); --dxp-s-button-font-size: 1rem; --dxp-s-button-font-style: normal; --dxp-s-button-font-weight: 400; --dxp-s-button-text-transform: var(--lwc-textTransform, capitalize); --dxp-s-button-line-height: 2; --dxp-s-button-letter-spacing: 0; --dxp-s-link-text-decoration: none; --dxp-s-link-text-decoration-focus: underline; --dxp-s-link-text-decoration-hover: underline; --dxp-s-site-logo-path: var(--lwc-brandLogoImage, /file-asset/Gem_logo_WPC_V5_VentiCF_Bold_480x12?v=1&height=300&width=300); --dxp-s-site-logo-url: var(--lwc-brandLogoImage, url(/file-asset/Gem_logo_WPC_V5_VentiCF_Bold_480x12?v=1&height=300&width=300)); --dxp-s-section-columns-max-width: 1800px; --dxp-s-header-content-max-width: 1rem; --dxp-s-footer-content-max-width: 1rem; --dxp-s-section-content-spacing-block-start: 1rem; --dxp-s-section-content-spacing-block-end: 1rem; --dxp-s-column-spacer-size: 1rem; --dxp-s-component-wrapper-spacer-size: 1.5rem; --dxp-s-section-columns-max-width-mobile: none; --dxp-s-header-content-max-width-mobile: none; --dxp-s-footer-content-max-width-mobile: none; --dxp-s-section-content-spacing-block-start-mobile: .75rem; --dxp-s-section-content-spacing-block-end-mobile: .75rem; --dxp-s-column-spacer-size-mobile: .75rem; --dxp-s-component-wrapper-spacer-size-mobile: 1.5rem } /* customer css */ /* Gemline Logo in Header */ .logo-container .company-logo { height: 52px !important; width: 213px !important; } /* New CMS Theme */ .cThemeLayoutRefreshNew .body-content.body-content { width: auto; } /* TEST STYLE GUIDE TABS */ .comm-page-custom-styleguide div[data-component-label="Tab Layout (New)"] div[role="tabpanel"]>div:first-child { display: flex; flex-wrap: wrap; } .comm-page-custom-styleguide div[data-component-label="Tab Layout (New)"] div[data-component-label="HTML Editor"]:nth-child(3n-2) { min-width: 800px; max-width: 1420px; width: 100%; border: 1px solid green; } .comm-page-custom-styleguide div[data-component-label="Tab Layout (New)"] div[data-component-label="HTML Editor"] { min-width: 50%; max-width: 50%; } .comm-page-custom-styleguide div[data-component-label="Tab Layout (New)"] div[data-component-label="CMS Single Item"] { min-width: 50%; max-width: 50%; } .comm-page-custom-about-us-practice .cThemeLayoutRefreshNew .body-content, .comm-page-custom-about-us .cThemeLayoutRefreshNew .body-content { width: 100%; max-width: none; margin: 0 auto; overflow-x: hidden; } /* section layout - set a max width if width is set to 90%*/ .cThemeLayoutRefreshNew .cb-section>.cb-section_row[style*="max-width: 95%;"] { max-width: 1600px !important; } .cThemeLayoutRefreshNew .cb-section>.cb-section_row[style*="max-width: 90%;"] { max-width: 1280px !important; } .cThemeLayoutRefreshNew .cb-section>.cb-section_row[style*="max-width: 80%;"] { max-width: 960px !important; } /* darken image for now */ div[data-item-id="48a559ef-d932-4ee1-9e88-d29c570a0c1c"] img, div[data-item-id="0182cbdd-4a3b-4f3b-b4a2-cffee32c8caf"] .js-content-image { mix-blend-mode: darken; } /* Force all default size text from rich text editor to be 14px and 1.5 line-height */ .cThemeLayoutRefreshNew .uiOutputRichText p, .cThemeLayoutRefreshNew .uiOutputRichText li, .cThemeLayoutRefreshNew .forceCommunityRichText p, .cThemeLayoutRefreshNew .forceCommunityRichText li, .cThemeLayoutRefreshNew .slds-rich-text-editor__output { font-size: 16px; line-height: 1.5; text-wrap: pretty; } .cThemeLayoutRefreshNew .uiOutputRichText a, .cThemeLayoutRefreshNew .forceCommunityRichText a, .cThemeLayoutRefreshNew .slds-rich-text-editor__output a, .cThemeLayoutRefreshNew .filters .subcat-link a, .cThemeLayoutRefreshNew .slds-breadcrumb__item a, .cThemeLayoutRefreshNew .salesforceIdentityLoginForm2 a, .cThemeLayoutRefreshNew .registrationContainer a, a.loginLink { text-decoration: underline; } .cThemeLayoutRefreshNew .uiOutputRichText a:hover, .themeLayoutStarterWrapper .forceCommunityRichText a:hover, .cThemeLayoutRefreshNew .slds-rich-text-editor__output a:hover, .themeLayoutStarterWrapper .filters .subcat-link a:hover, .cThemeLayoutRefreshNew .slds-breadcrumb__item a:hover, .themeLayoutStarterWrapper .salesforceIdentityLoginForm2 a:hover, .cThemeLayoutRefreshNew .registrationContainer a:hover, .themeLayoutStarterWrapper a.loginLink:hover { text-decoration: none !important; } .cThemeLayoutRefreshNew .uiOutputRichText .slds-text-longform ul, .cThemeLayoutRefreshNew .forceCommunityRichText .slds-text-longform ul, .cThemeLayoutRefreshNew .uiOutputRichText .slds-text-longform ol, .cThemeLayoutRefreshNew .forceCommunityRichText .slds-text-longform ol { margin-left: 0 !important; } .cThemeLayoutRefreshNew .uiOutputRichText .slds-text-longform h3, .cThemeLayoutRefreshNew .forceCommunityRichText .slds-text-longform h3 { margin-bottom: 0; } .cThemeLayoutRefreshNew .uiOutputRichText a:visit, .cThemeLayoutRefreshNew .forceCommunityRichText a:visited { color: #7b668f; } /* -- */ /* Force all h1 from rich text editor to be 28px, 1.25 line-height and bold */ .cThemeLayoutRefreshNew .uiOutputRichText h1, .cThemeLayoutRefreshNew .forceCommunityRichText h1, .cThemeLayoutRefreshNew .slds-rich-text-editor__output h1, .cThemeLayoutRefreshNew .js-content h1 { font-size: var(--dxp-s-text-heading-extra-large-font-size, 2.5rem) !important; line-height: 1.2; font-weight: unset; text-wrap: pretty; } /* Force all h2 from rich text editor to be 24px, 1.25 line-height and bold */ .cThemeLayoutRefreshNew .uiOutputRichText h2, .cThemeLayoutRefreshNew .forceCommunityRichText h2, .cThemeLayoutRefreshNew .slds-rich-text-editor__output h2 { font-size: var(--dxp-s-text-heading-large-font-size, 1.75rem) !important; line-height: 1.2; font-weight: unset; text-wrap: pretty; } /* Force all h3 from rich text editor to be 24px, 1.25 line-height and bold */ .cThemeLayoutRefreshNew .uiOutputRichText h3, .cThemeLayoutRefreshNew .forceCommunityRichText h3, .cThemeLayoutRefreshNew .slds-rich-text-editor__output h3 { font-size: var(--dxp-s-text-heading-medium-font-size, 1.75rem) !important; line-height: 1.2; font-weight: unset; text-wrap: pretty; } /* Force all h6 from rich text editor */ /*.cThemeLayoutRefreshNew .uiOutputRichText h6, .cThemeLayoutRefreshNew .forceCommunityRichText h6, .cThemeLayoutRefreshNew .slds-rich-text-editor__output h6 { font-size:13px !important; font-weight:normal !important; text-transform: uppercase; color: rgb(108, 117, 118); } */ /* Add 1rem margin between headings and paragraphs */ .cThemeLayoutRefreshNew .uiOutputRichText h1+p, .cThemeLayoutRefreshNew .forceCommunityRichText h1+p, .cThemeLayoutRefreshNew .uiOutputRichText h2+p, .cThemeLayoutRefreshNew .forceCommunityRichText h2+p, .cThemeLayoutRefreshNew .uiOutputRichText h3+p, .cThemeLayoutRefreshNew .forceCommunityRichText h3+p .cThemeLayoutRefreshNew .uiOutputRichText:not(.forceCommunityHtmlBlock) *+*, .cThemeLayoutRefreshNew .forceCommunityRichText:not(.forceCommunityHtmlBlock) *+*, .cThemeLayoutRefreshNew .slds-rich-text-editor__output *+* { margin-top: 1rem; } /* Add .5rem margin between text list elements */ .cThemeLayoutRefreshNew .uiOutputRichText:not(.forceCommunityHtmlBlock) li+li, .cThemeLayoutRefreshNew .forceCommunityRichText:not(.forceCommunityHtmlBlock) li+li, .cThemeLayoutRefreshNew .slds-rich-text-editor__output li+li { margin-top: .5rem; margin-bottom: 0; } /* Add 3rem margin between paragraph and and h2 */ .cThemeLayoutRefreshNew .uiOutputRichText *+h2, .cThemeLayoutRefreshNew .forceCommunityRichText *+h2, .cThemeLayoutRefreshNew .uiOutputRichText:not(.forceCommunityHtmlBlock) *+h2, .cThemeLayoutRefreshNew .forceCommunityRichText:not(.forceCommunityHtmlBlock) *+h2 { margin-top: 3rem; } /* Create an eyebrow style design by adding a pragraph with 14px font following by a heading. */ .cThemeLayoutRefreshNew .uiOutputRichText p:has(span)+h2, .cThemeLayoutRefreshNew .forceCommunityRichText p:has(span)+h2 { margin-top: .5rem; margin-bottom: 1rem; } /* CARD LAYOUTS */ /* Header Divider */ .cThemeLayoutRefreshNew .forceCommunityCardLayout .slds-rich-text-editor__output h2:after, .cThemeLayoutRefreshNew .uiOutputRichText p:has(span)+h2:after, .cThemeLayoutRefreshNew .forceCommunityRichText p:has(span)+h2:after, .cThemeLayoutRefreshNew .forceCommunityCardLayout .slds-rich-text-editor__output h3:after, .cThemeLayoutRefreshNew .uiOutputRichText p:has(span)+h3:after, .cThemeLayoutRefreshNew .forceCommunityRichText p:has(span)+h3:after, .cThemeLayoutRefreshNew .forceCommunityRichText h2:has(span):after, .cThemeLayoutRefreshNew .gemline-heading-divider:after, /* Trends page - video */ .cThemeLayoutRefreshNew div[data-item-id="93c06928-038e-4190-a425-fe0049b3d6f4"] a.js-content-title:after { display: block; content: ""; height: 2px; border-radius: 4px; width: 6rem; background: #dfd0a6; margin: 1.25rem 0; } /* reset heading color to match brand color for a heading that has a color of black added in experience builder */ .cThemeLayoutRefreshNew .forceCommunityRichText h2 span[style*="color: rgb(0, 0, 0);"] { color: var(--lwc-colorTextDefault, rgb(35, 31, 32)) !important; } /* set h2 and h3 text to be the same size and have same decoration for cards */ .cThemeLayoutRefreshNew .forceCommunityCardLayout .slds-rich-text-editor__output h3 { font-size: var(--dxp-s-text-heading-large-font-size, 1.75rem) !important; line-height: 1.2; font-weight: unset; text-wrap: pretty; } /* center align divider is heading is centered */ .cThemeLayoutRefreshNew .forceCommunityCardLayout .slds-rich-text-editor__output h2[style*="text-align: center;"]:after, .cThemeLayoutRefreshNew .uiOutputRichText p:has(span)+h2[style*="text-align: center;"]:after, .cThemeLayoutRefreshNew .forceCommunityRichText p:has(span)+h2[style*="text-align: center;"]:after, .cThemeLayoutRefreshNew .forceCommunityRichText h2[style*="text-align: center;"]:after { margin: 1.25rem auto 2.5rem auto; } /* Randomize Divider Colors for card layouts */ .cThemeLayoutRefreshNew .forceCommunitySection>.cb-section_row>.cb-section_column.slds-size_12-of-12>div>.ui-widget:nth-child(4n+1) .forceCommunityCardLayout .slds-rich-text-editor__output h2:after, .cThemeLayoutRefreshNew .forceCommunitySection>.cb-section_row>.cb-section_column.slds-size_12-of-12>div>.ui-widget:nth-child(4n+1) .forceCommunityCardLayout .slds-rich-text-editor__output h3:after { background: #2E4E73; } .cThemeLayoutRefreshNew .forceCommunitySection>.cb-section_row>.cb-section_column.slds-size_12-of-12>div>.ui-widget:nth-child(2n) .forceCommunityCardLayout .slds-rich-text-editor__output h2:after, .cThemeLayoutRefreshNew .forceCommunitySection>.cb-section_row>.cb-section_column.slds-size_12-of-12>div>.ui-widget:nth-child(2n) .forceCommunityCardLayout .slds-rich-text-editor__output h3:after { background: #D3C498; } .cThemeLayoutRefreshNew .forceCommunitySection>.cb-section_row>.cb-section_column.slds-size_12-of-12>div>.ui-widget:nth-child(3n) .forceCommunityCardLayout .slds-rich-text-editor__output h2:after, .cThemeLayoutRefreshNew .forceCommunitySection>.cb-section_row>.cb-section_column.slds-size_12-of-12>div>.ui-widget:nth-child(3n) .forceCommunityCardLayout .slds-rich-text-editor__output h3:after { background: #98AAAD; } .cThemeLayoutRefreshNew .forceCommunitySection>.cb-section_row>.cb-section_column.slds-size_12-of-12>div>.ui-widget:nth-child(4n) .forceCommunityCardLayout .slds-rich-text-editor__output h2:after, .cThemeLayoutRefreshNew .forceCommunitySection>.cb-section_row>.cb-section_column.slds-size_12-of-12>div>.ui-widget:nth-child(4n) .forceCommunityCardLayout .slds-rich-text-editor__output h3:after { background: #89C3D1; } .cThemeLayoutRefreshNew .forceCommunityCardLayout .js-content-eyebrow+.slds-m-top_small { margin-top: .25rem; } /* If there is a card element which should have a full height image - set that image height to be 450px, then CSS will take over */ .cThemeLayoutRefreshNew .forceCommunityCardLayout .mediaContainer[style*="height: 450px;"] { height: auto !important; min-height: 350px; } .cThemeLayoutRefreshNew .forceCommunityCardLayout .mediaContainer[style*="height: 450px;"]>div { height: 100% !important; } @media only screen and (max-width: 47.9375em) { .cThemeLayoutRefreshNew .forceCommunityCardLayout .mediaContainer[style*="height: 450px;"] { aspect-ratio: 16/9; min-height: 0; } .cThemeLayoutRefreshNew .forceCommunityCardLayout .mediaContainer[style*="height: 450px;"]>div { height: 100% !important; } } /* NEW BANNER LAYOUT */ .cThemeLayoutRefreshNew .forceCommunityBannerLayout .js-content[style*="width: 25%"] { width: fit-content !important; max-width: 40rem; padding: var(--lwc-spacingLarge, 1.5rem) var(--lwc-spacingXLarge, 1.75rem) var(--lwc-spacingXSmall, .75rem) var(--lwc-spacingXLarge, 1.75rem); background: rgba(255, 255, 255, .75); background-image: linear-gradient(rgba(255, 255, 255, .95), rgba(255, 255, 255, .5)); /*backdrop-filter: blur(18px);*/ box-shadow: var(--lwc-elevationShadow32), inset 1px 1px 0 rgba(255, 255, 255, .7); overflow: hidden; border-radius: 0.5rem; } .cThemeLayoutRefreshNew .forceCommunityBannerLayout .js-content[style*="width: 25%"] .layout_subtitle { max-height: none; } /* clips content outside of container */ .cThemeLayoutRefreshNew .forceCommunityBannerLayout { overflow: hidden; border-radius: 1rem; } /* adjust eyebrow of the banner */ .cThemeLayoutRefreshNew .forceCommunityBannerLayout .js-content-eyebrow { font-size: 2em; margin-top: 0; } /* -- GRID CARDS -- */ /* Boxed Card With Shadow */ .cThemeLayoutRefreshNew .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout>div[style*="border-color: rgb(180, 180, 180);"] { box-shadow: var(--sds-c-card-shadow, 0 2px 2px 0 rgba(0, 0, 0, .1)); } /* Small Icon in the top top */ .cThemeLayoutRefreshNew .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout>div>.slds-is-relative[style*="height: 100px;"], .cThemeLayoutRefreshNew .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout>div>.slds-is-relative[style*="height: 100px;"]>.slds-is-relative { height: 48px !important; width: 48px !important; } /* ABOUT US PILLARS - Change heading color to match icon */ .ui-widget[data-item-id="05771a2c-31d6-4a21-9271-c2a2a1298f62"] .forceCommunityDynamicCollectionGrid>.slds-grid>div:nth-child(1) h3 { color: #F47920; } .ui-widget[data-item-id="05771a2c-31d6-4a21-9271-c2a2a1298f62"] .forceCommunityDynamicCollectionGrid>.slds-grid>div:nth-child(2) h3 { color: #009CC1; } .ui-widget[data-item-id="05771a2c-31d6-4a21-9271-c2a2a1298f62"] .forceCommunityDynamicCollectionGrid>.slds-grid>div:nth-child(3) h3 { color: #59659C; } .ui-widget[data-item-id="05771a2c-31d6-4a21-9271-c2a2a1298f62"] .forceCommunityDynamicCollectionGrid>.slds-grid>div:nth-child(4) h3 { color: #DB4157; } .ui-widget[data-item-id="05771a2c-31d6-4a21-9271-c2a2a1298f62"] .forceCommunityDynamicCollectionGrid>.slds-grid>div:nth-child(5) h3 { color: #5CA43F; } /* --- PVC PAGE --- */ /* change color of heading dividers */ .comm-page-custom-pvc .cThemeLayoutRefreshNew .forceCommunitySection .gem-grid-pvc h3:after, .comm-page-custom-pvc .cThemeLayoutRefreshNew [data-item-id="c7bb5693-aaf7-4ac0-89e2-f4746bfa2606"] h2:after { background: #DA4936; } /* --- Flyers --- */ .comm-page-custom-flyers .cThemeLayoutRefreshNew .forceCommunityDynamicCollectionGrid .slds-has-block-links_space a { padding-left: 0 !important; } /* ================= */ /* Hide Kitting From Mobile */ @media (max-width: 736px) { .cHeaderAccount .kits-container, .plp-add-to-kit, .cProductDetailTopCardButtons c-add-to-kit-button, .myaccount-container .account-menu ul li:nth-child(6n), #fulfillment-kit-button { display: none !important; } .cProductListItemCard .plp-action-container .plp-action.plp-add-to-favorites_button { margin-right: 0; } } /* ---- 1.0 Custom Google Fonts ---- */ @font-face { font-family: 'Libre Franklin'; src: url('/s/fonts/subset-LibreFranklin-BoldItalic.woff2') format('woff2'), url('/s/fonts/subset-LibreFranklin-BoldItalic.woff') format('woff'); font-weight: bold; font-style: italic; font-display: swap; } @font-face { font-family: 'Libre Franklin'; src: url('/s/fonts/subset-LibreFranklin-Bold.woff2') format('woff2'), url('/s/fonts/subset-LibreFranklin-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Libre Franklin'; src: url('/s/fonts/subset-LibreFranklin-Italic.woff2') format('woff2'), url('/s/fonts/subset-LibreFranklin-Italic.woff') format('woff'); font-weight: normal; font-style: italic; font-display: swap; } @font-face { font-family: 'Libre Franklin'; src: url('/s/fonts/subset-LibreFranklin-Regular.woff2') format('woff2'), url('/s/fonts/subset-LibreFranklin-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Venti CF'; src: url('/s/fonts-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } /* ---- 1.0 Home Page Styles ---- */ /* Make the full width slideshow responsive fd3f6efe-c2cf-4d96-b1df-2cb5f11d7367 */ .comm-page-home div[data-item-id="34bc46c6-34e9-4c0d-8dbb-915521d7b638"] .carouselSlide>.slds-is-relative, .comm-page-home .carouselSlide>.slds-is-relative>.slds-is-relative, .comm-page-home div[data-item-id="3e0fc8eb-de77-451f-aca3-ffab8d04fb4b"] .carouselSlide>.slds-is-relative, .comm-page-home .carouselSlide>.slds-is-relative>.slds-is-relative { height: auto !important; } .comm-page-home div[data-item-id="34bc46c6-34e9-4c0d-8dbb-915521d7b638"] .carouselSlide>.slds-is-relative>.slds-is-relative, .comm-page-home div[data-item-id="3e0fc8eb-de77-451f-aca3-ffab8d04fb4b"] .carouselSlide>.slds-is-relative>.slds-is-relative { padding-bottom: 32%; } .comm-page-home div[data-item-id="34bc46c6-34e9-4c0d-8dbb-915521d7b638"] .carouselSlide .bannerLayoutButton, .comm-page-home div[data-item-id="a382466c-9163-4ae7-ac9b-969389400fb9"] .carouselSlide .bannerLayoutButton, .comm-page-home div[data-item-id="3e0fc8eb-de77-451f-aca3-ffab8d04fb4b"] .carouselSlide .bannerLayoutButton { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* regular banner - not slideshow */ .comm-page-home div[data-item-id="fd3f6efe-c2cf-4d96-b1df-2cb5f11d7367"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="fd3f6efe-c2cf-4d96-b1df-2cb5f11d7367"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="746de536-3d16-4d75-9f39-73c9377edd84"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="746de536-3d16-4d75-9f39-73c9377edd84"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="f214ca1a-61a6-46c0-ad5f-586da1a04d60"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="f214ca1a-61a6-46c0-ad5f-586da1a04d60"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="fb32a59e-0630-4155-bed6-cccfaf81aa77"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="fb32a59e-0630-4155-bed6-cccfaf81aa77"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="db0e9382-23ec-4484-86d1-53a0c6403ffa"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="db0e9382-23ec-4484-86d1-53a0c6403ffa"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="955fba6a-423f-4460-8805-3206dec64e1c"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="955fba6a-423f-4460-8805-3206dec64e1c"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="7bc9148e-9b21-4db2-b507-d870d8643d1d"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="7bc9148e-9b21-4db2-b507-d870d8643d1d"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="e0740ae4-2dbd-438c-a6c5-53c6feb3a61a"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="e0740ae4-2dbd-438c-a6c5-53c6feb3a61a"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="871aea5c-bccf-4626-a56d-a8881ef51e89"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="871aea5c-bccf-4626-a56d-a8881ef51e89"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="105f1776-4cdb-4980-822d-ca6aa9df2e2c"] .forceCommunityBannerLayout, .comm-page-home div[data-item-id="105f1776-4cdb-4980-822d-ca6aa9df2e2c"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="404f3850-3adb-49dd-956e-e65eaf80af03"] .forceCommunityBannerLayout, div[data-item-id="404f3850-3adb-49dd-956e-e65eaf80af03"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="a1320942-79dc-4334-8a5e-085ce4a2fe03"] .forceCommunityBannerLayout, div[data-item-id="a1320942-79dc-4334-8a5e-085ce4a2fe03"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="da62cdc6-2ed4-4246-a808-23473d5f1223"] .forceCommunityBannerLayout, div[data-item-id="da62cdc6-2ed4-4246-a808-23473d5f1223"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="321f4c19-9d79-4ccc-9dd4-878fa49b0882"] .forceCommunityBannerLayout, div[data-item-id="321f4c19-9d79-4ccc-9dd4-878fa49b0882"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="91587d8e-2925-47d0-b767-5fcf0600510c"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="91587d8e-2925-47d0-b767-5fcf0600510c"] .forceCommunityBannerLayout { height: auto !important; } /*visit us ppai*/ div[data-item-id="da62cdc6-2ed4-4246-a808-23473d5f1223"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="da62cdc6-2ed4-4246-a808-23473d5f1223"] .contentImage { aspect-ratio: 2278/759; } /*ppai + trends*/ div[data-item-id="321f4c19-9d79-4ccc-9dd4-878fa49b0882"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="321f4c19-9d79-4ccc-9dd4-878fa49b0882"] .contentImage, div[data-item-id="a1320942-79dc-4334-8a5e-085ce4a2fe03"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="a1320942-79dc-4334-8a5e-085ce4a2fe03"] .contentImage, div[data-item-id="404f3850-3adb-49dd-956e-e65eaf80af03"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="404f3850-3adb-49dd-956e-e65eaf80af03"] .contentImage { aspect-ratio: 2278/1708; } div[data-item-id="fb32a59e-0630-4155-bed6-cccfaf81aa77"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="fb32a59e-0630-4155-bed6-cccfaf81aa77"] .contentImage { aspect-ratio: 1600/600; } div[data-item-id="db0e9382-23ec-4484-86d1-53a0c6403ffa"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="db0e9382-23ec-4484-86d1-53a0c6403ffa"] .contentImage { aspect-ratio: 1400/480; } div[data-item-id="91587d8e-2925-47d0-b767-5fcf0600510c"] .forceCommunityBannerLayout>.slds-is-relative, div[data-item-id="91587d8e-2925-47d0-b767-5fcf0600510c"] .contentImage { aspect-ratio: 1248/470; } .comm-page-home div[data-item-id="fd3f6efe-c2cf-4d96-b1df-2cb5f11d7367"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="fd3f6efe-c2cf-4d96-b1df-2cb5f11d7367"] .contentImage, .comm-page-home div[data-item-id="746de536-3d16-4d75-9f39-73c9377edd84"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="746de536-3d16-4d75-9f39-73c9377edd84"] .contentImage, .comm-page-home div[data-item-id="f214ca1a-61a6-46c0-ad5f-586da1a04d60"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="f214ca1a-61a6-46c0-ad5f-586da1a04d60"] .contentImage, .comm-page-home div[data-item-id="955fba6a-423f-4460-8805-3206dec64e1c"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="955fba6a-423f-4460-8805-3206dec64e1c"] .contentImage, .comm-page-home div[data-item-id="7bc9148e-9b21-4db2-b507-d870d8643d1d"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="7bc9148e-9b21-4db2-b507-d870d8643d1d"] .contentImage, .comm-page-home div[data-item-id="e0740ae4-2dbd-438c-a6c5-53c6feb3a61a"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="e0740ae4-2dbd-438c-a6c5-53c6feb3a61a"] .contentImage, .comm-page-home div[data-item-id="871aea5c-bccf-4626-a56d-a8881ef51e89"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="871aea5c-bccf-4626-a56d-a8881ef51e89"] .contentImage, .comm-page-home div[data-item-id="105f1776-4cdb-4980-822d-ca6aa9df2e2c"] .forceCommunityBannerLayout>.slds-is-relative, .comm-page-home div[data-item-id="105f1776-4cdb-4980-822d-ca6aa9df2e2c"] .contentImage { padding-bottom: 35%; } .comm-page-home div[data-item-id="fb32a59e-0630-4155-bed6-cccfaf81aa77"] .forceCommunityBannerLayout .bannerLayoutButton, .comm-page-home div[data-item-id="746de536-3d16-4d75-9f39-73c9377edd84"] .forceCommunityBannerLayout .bannerLayoutButton, .comm-page-home div[data-item-id="f214ca1a-61a6-46c0-ad5f-586da1a04d60"] .forceCommunityBannerLayout .bannerLayoutButton, .comm-page-home div[data-item-id="db0e9382-23ec-4484-86d1-53a0c6403ffa"] .forceCommunityBannerLayout .bannerLayoutButton, .comm-page-home div[data-item-id="fd3f6efe-c2cf-4d96-b1df-2cb5f11d7367"] .forceCommunityBannerLayout .bannerLayoutButton, .comm-page-home div[data-item-id="955fba6a-423f-4460-8805-3206dec64e1c"] .forceCommunityBannerLayout .bannerLayoutButton, .comm-page-home div[data-item-id="7bc9148e-9b21-4db2-b507-d870d8643d1d"] .forceCommunityBannerLayout .bannerLayoutButton, div[data-item-id="404f3850-3adb-49dd-956e-e65eaf80af03"] .forceCommunityBannerLayout .bannerLayoutButton, div[data-item-id="a1320942-79dc-4334-8a5e-085ce4a2fe03"] .forceCommunityBannerLayout .bannerLayoutButton { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* Make Spotlight product text smaller */ div[data-item-id="fb5247a2-4856-40f8-bc3f-640dcf3f0c9d"] .js-content-navlink.slds-text-heading_small, div[data-item-id="4d1ec113-b2e3-49c4-b68a-64a4479ebb79"] .js-content-navlink.slds-text-heading_small { font-size: .875rem !important; } /* Move Spotlight banner text so that it's not so close to the edges */ div[data-item-id="aae27715-ad05-4342-b10f-f9592e114648"] .slds-template__container>.slds-p-around_medium, div[data-item-id="6893c2dd-df39-43b4-b135-9128f4b6edcb"] .slds-template__container>.slds-p-around_medium { padding-top: var(--lwc-spacingXLarge); padding-bottom: var(--lwc-spacingXLarge); } /* Add text shadow to spotlight title and to tile titles */ div[data-item-id="aae27715-ad05-4342-b10f-f9592e114648"] .slds-template__container p.js-content-title, div[data-item-id="6893c2dd-df39-43b4-b135-9128f4b6edcb"] .slds-template__container p.js-content-title, .comm-page-home .forceCommunityDynamicCollectionGrid .forceCommunityBannerLayout p.js-content-title { text-shadow: 0 1px 6px rgba(0, 0, 0, .2), 0 1px 2px rgba(0, 0, 0, .7); } /* ---- 2.0 Header Styles ---- */ /* Cart Button Fill Color */ .forceCommunityThemeHeaderB2B .cartButton svg { fill: #5b6770 !important; } /* custom styles */ #minHeader { background-color: #2c5c95; font-size: 20px; color: white; padding: 16px; } #miniList { padding: 20; /* Remove padding */ margin: 20; /* Remove margins */ ; } /* ---- 3.0 Rich Content Editor ---- */ /* Force all default size text from rich text editor to be 14px and 1.5 line-height */ .uiOutputRichText p, .uiOutputRichText li, .forceCommunityRichText p, .forceCommunityRichText li { font-size: 14px; line-height: 1.5; } .uiOutputRichText a, .forceCommunityRichText a, .slds-rich-text-editor__output a, .filters .subcat-link a, .slds-breadcrumb__item a, .salesforceIdentityLoginForm2 a, .registrationContainer a, a.loginLink { text-decoration: underline; } .uiOutputRichText a:hover, .forceCommunityRichText a:hover, .slds-rich-text-editor__output a:hover, .filters .subcat-link a:hover, .slds-breadcrumb__item a:hover, .salesforceIdentityLoginForm2 a:hover, .registrationContainer a:hover, a.loginLink:hover { text-decoration: none !important; } .uiOutputRichText .slds-text-longform ul, .forceCommunityRichText .slds-text-longform ul { margin-left: 0 !important; } .uiOutputRichText .slds-text-longform h3, .forceCommunityRichText .slds-text-longform h3 { margin-bottom: 0; } .uiOutputRichText a:visit, .forceCommunityRichText a:visited { color: #7b668f; } /* Force all h1 from rich text editor to be 28px, 1.25 line-height and bold */ .uiOutputRichText h1, .forceCommunityRichText h1 { font-size: 28px !important; line-height: 1.25; font-weight: bold; } /* Force all h2 from rich text editor to be 24px, 1.25 line-height and bold */ .uiOutputRichText h2, .forceCommunityRichText h2 { font-size: 24px !important; line-height: 1.25; font-weight: bold; } .uiOutputRichText h1+p, .forceCommunityRichText h1+p, .uiOutputRichText h2+p, .forceCommunityRichText h2+p, .uiOutputRichText h3+p, .forceCommunityRichText h3+p { margin-top: .5rem; } /* add underline when hovering over a link from rich text editor */ .uiOutputRichText a:hover { text-decoration: underline; } /* adding an icon to any download link in the rich text editor */ .uiOutputRichText a[href*='/sfsites/c/file-asset'], .uiOutputRichText a[href*='https://go.pardot.com']:not(.gem-no-icon) { display: inline-block; position: relative; padding: 4px 0 2px 0; } .uiOutputRichText a[href*='/sfsites/c/file-asset']:before, .uiOutputRichText a[href*='https://go.pardot.com']:not(.gem-no-icon):before { display: inline-block; vertical-align: middle; width: 16px; height: 16px; content: ""; margin-right: 2px; transform: translatey(-1px); background-size: cover; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAKKADAAQAAAABAAAAKAAAAABZLkSWAAACIElEQVRYCe1XPU/DMBA9lyJ2RsTSgZGfwcDaESSgqAP/AYoEbf8FlBYBGxILMCAx8QtgZGBBHdkrSI2fi1u3cXuuk0zkpMRfd/denp3EJsotmQIiWbgVLaWgZmdL9xzu3pAQ0hoNri4ER04GLpa2KYquSMoyvby+0/Pd26RLSLsQEuSMiaK1Yb9dH3aGVdIjGIbPRuUEWYkYh1xBRiB2OFeQlYhxyBVkBGKHcwVZiRiHXEFGIHa4yHoYB+z3Gu1N3Tzae5x7vxcY7z/FINfv3+urfnGm9n3+m134IsbEmwc1Dz+j9CdoJ5FyXwP6kDTkEBNg/gQH09oaYviQdJETokXI5Wn+BHHGqFWqau35kZxGbpDD+7ziv47ME08DJvpU6/JYuwlxqspV1R5NKx5sTnLINT9BRLlIEn2pkWUMK7PrCiWMHBKFEUSkmyRGxi0BOSSKEwSw7/mWI+lDjsGLf6hBDudbWLOD+zVuTsOLI2VVfXKg6Gi9wdmHHPwYvPhbbJ9p7TqSucz1dvuSQz4bw67/YcUVdJHg+oySjfatdg35FU7BSIcgkoMk0YPGqVV0kcYtPsVpZE0xR04wqZjxNShEV30yBnmFKNPJeVKM2fHAGOF1J50dBItPRN89krSkAtdVAK7sbEiOeiSAPW7xNVjb+SAqHKh/TG/cNcOWxlKYGnscJ/6rM+P1yxLJnw2l4orpyqTEkoJyDnKZ4P27pL9KAexy/1ZblQAAAABJRU5ErkJggg==); /*background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAArBJREFUWAntmM9rE0EUx7+zWasXsaIXQXtQPIgIgteqyaHgUb0b6/oHSE9SklLTtPSoZ6Ex4MVT8aQXJUGvKoJS8eLBnupJQUGSZsc302yz28xMyOxsEM2Dyb597+W9z77Znf0BjOUf7wAzHl+j4eP113Ng4SFjnM6Z40dx3H+OYvGXLmSQXQ+48vgYOq2X4DgzKInZz35jAmcxH3wxx6m9ntpM1k6rnB5OZOcH0EYTq7WT2loGh2/wdTvH3sNjc4Y4tYuHN+kAZ6WT8xNoMwGZH7aTBkBG3eUAw3cs3GqqKQzWylo+4bWE1E9xInvaHbYiM0jI4aZ7NICLQZmmwgpyNICifZaQowO0hDRcJPKscfNTWbvXS8S3SX9F4xLkOem9wWp9BvOzb3sxPS07QMa2CSCqtBgpfVseHkYLT8h+us9HhuymOOc/BWObqqJ9No+1+2xdQ3YdLBU/Uo0pXWFpX6o1qcuXabn9povLroO6ikPa3QJWH12BGA7FHWC1foqm65kcQnck7gBBDwScMzmE7kgcAjoi2pNmDLinIUPv2q+DS/UL4OEDWurXsRDcV1au1uYQ4jp83EEpeKeMGWC0B0R4lR5opwlgGpXaEarzIlGrUltGyEvS1mHXaGsFaH8OenjYu5VJkCAGSHoXTtzuRKyl2AOWg03sQ34XMgxv7DJEuoATMSLWUuwBRUHxKhmHjENEcJavm1GqdIBJyK0oKXV1S4KnhBP50gNGkPvpqQT4KYfQHcCJ1CmuYvH3mNy9/Zn2DsYsTlQ3HXSCok7y1wMappiH8pg4JukZL68+vpRWzid3MnRrKdIZAPGJ4gu04J6nO0JD8V93Ju5t6JLppzg3sUzfZQRkxsI24Ps7Xx0UlfTfB0Vw2g+YioIJE/d+4OLUBxQK4l15LP9nB/4AsyXRalWBqPkAAAAASUVORK5CYII=")*/ } /* Remove hyphens from small text heading */ .slds-text-heading_small { hyphens: none; } li { list-style-position: outside; } /* ---- CSR Update ---- */ .betterway1 { border: none; border-bottom: 1px dashed #000000; border-right: 1px dashed #000000; padding-bottom: 0px; margin-bottom: 0px; } .betterway2 { border: none; border-bottom: 1px dashed #000000; padding-bottom: 0px; margin-bottom: 0px; } .betterway3 { border: none; border-bottom: 1px dashed #000000; border-right: 1px dashed #000000; padding-bottom: 0px; margin-bottom: 0px; } .betterway4 { border: none; border-bottom: 1px dashed #000000; padding-bottom: 0px; margin-bottom: 0px; } .betterway5 { border: none; border-right: 1px dashed #000000; margin-bottom: 0px; } @media only screen and (max-width: 601px) { .betterway1 { border: none; border-bottom: 1px dashed #000000; } } @media only screen and (max-width: 601px) { .betterway2 { border: none; border-bottom: 1px dashed #000000; } } @media only screen and (max-width: 601px) { .betterway3 { border: none; border-bottom: 1px dashed #000000; } } @media only screen and (max-width: 601px) { .betterway4 { border: none; border-bottom: 1px dashed #000000; } } @media only screen and (max-width: 601px) { .betterway5 { border: none; border-bottom: 1px dashed #000000; } } /* ---- 4.0 Banners ---- */ /* Remove hyphenation from banners */ .cThemeLayoutRefreshNew .forceCommunityBannerLayout .slds-grid .slds-hyphenate { word-wrap: normal; hyphens: none !important; -webkit-hyphens: none !important; overflow-wrap: normal; } .cThemeLayoutRefreshNew .forceCommunityBannerLayout .layout_title { max-height: none; overflow: visible; -webkit-line-clamp: none; display: block; } .cThemeLayoutRefreshNew .forceCommunityBannerLayout .slds-scrollable_none { overflow: visible; } .comm-page-custom-case-studies-2 .slds-col>span:first-child { min-height: 56px; display: inline-block; } /* ---- 5.0 Tile Styles ---- */ /* tightening up the links section */ .slds-item { height: 20px; } /* 5.1 Download Icon */ /* layout setup for icons */ .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a[href*='/sfsites/c/file-asset'], .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href*='/sfsites/c/file-asset'], .comm-page-custom-product-videos .slds-has-block-links_space>li a, .comm-page-custom-webinars .slds-has-block-links_space>li a, .comm-page-custom-e-catalogs .slds-has-block-links_space>li a, .comm-page-custom-promotions .slds-has-block-links_space a[href*='/sfsites/c/file-asset'], .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a[href*='https://go.pardot.com'], .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href*='https://go.pardot.com'], .comm-page-custom-product-videos .slds-has-block-links_space>li a, .comm-page-custom-webinars .slds-has-block-links_space>li a, .comm-page-custom-e-catalogs .slds-has-block-links_space>li a, .comm-page-custom-promotions .slds-has-block-links_space a[href*='https://go.pardot.com'], .slds-has-block-links_space a[href*='https://bit.ly/'], .comm-page-custom-fulfillment .slds-has-block-links_space a[href*='https://go.pardot.com'] { display: inline-block; position: relative; text-align: center; } /* underline on hover */ .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a[href*='/sfsites/c/file-asset']:hover, .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href*='/sfsites/c/file-asset']:hover, .comm-page-custom-product-videos .slds-has-block-links_space>li a:hover, .comm-page-custom-webinars .slds-has-block-links_space>li a:hover, .comm-page-custom-e-catalogs .slds-has-block-links_space>li a:hover, .comm-page-custom-promotions .slds-has-block-links_space a[href*='/sfsites/c/file-asset']:hover, .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a[href*='https://go.pardot.com']:hover, .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href*='https://go.pardot.com']:hover, .comm-page-custom-product-videos .slds-has-block-links_space>li a:hover, .comm-page-custom-webinars .slds-has-block-links_space>li a:hover, .comm-page-custom-e-catalogs .slds-has-block-links_space>li a:hover, .comm-page-custom-promotions .slds-has-block-links_space a[href*='https://go.pardot.com']:hover, .slds-has-block-links_space a[href*='https://bit.ly/']:hover, .comm-page-custom-fulfillment .slds-has-block-links_space a[href*='https://go.pardot.com']:hover { text-decoration: underline; } /* add the icon to any link that will download a file */ .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a:before, .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href*='/sfsites/c/file-asset']:before, .comm-page-custom-product-videos .slds-has-block-links_space>li a:before, .comm-page-custom-webinars .slds-has-block-links_space>li a:before, .comm-page-custom-promotions .slds-has-block-links_space a[href*='/sfsites/c/file-asset']:before, .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a[href*='https://go.pardot.com']:before, .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href*='https://go.pardot.com']:before, .comm-page-custom-product-videos .slds-has-block-links_space>li a:before, .comm-page-custom-webinars .slds-has-block-links_space>li a:before, .comm-page-custom-promotions .slds-has-block-links_space a[href*='https://go.pardot.com']:before, .comm-page-custom-fulfillment .slds-has-block-links_space a[href*='https://go.pardot.com']:before { display: block; content: ""; background-size: 16px; margin: 0 auto 2px auto; background-color: #F4F3F1; border-radius: 4px; width: 32px; height: 32px; background-repeat: no-repeat; background-position: center; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAKKADAAQAAAABAAAAKAAAAABZLkSWAAAC70lEQVRYCe2XTWgTQRTH5+3GqElvFg8SafWiB08iCCU5iKAg4sGT0ou3npJasEkTLzk1iYFSk7ugoFcFtZ4EoaWIgngTb0oDtZKclJQ22X3OW7Jhu+xkZjdLWyRzyM68eR+/+c9mMmHskDcIi282m79lgHme8vGk3+qVyuswcocCOJd9eKmDnc9OoIiuXVkulz84bUH6WpAgd4zJzFNum2Gws25bkHEogEEKq8aMAFWVEvmNFBQpo2ofKaiqlMhvpKBIGVX7/6VgulY7qrrysPwiKonmlpaOd35tvWQbjWQ6uzBTf1R+rhLn9knP51MMzBfI8Ot4LHa3WCz+dfu4x9It5kmi3c2tVwzxOjIWRzSfcshpdyLZmOAQzBVETDBkN1vt9sqDajUui5MCtra37/AVX3Mk0v1C2nB8kWN2HkSW2m02Z+yx6CkFRE37xADcW6EM6QVHMACwy9VcE4HZdqULq/XuMOMdbbEd2HsaAFqOK3OBq3zPOQcMniGDNwzwiVM58iE4fu2+zW/db50xXn0lQAoUKeGVdJDNDxzlUQYk52Eh/cL5BhwGMgjcHsB8Pn+ibejjZDQTJ3/UM5kd6ns1v0qqwNGPgNb4PUn1YrrRLJVKLepbWzybyyVNZO/5typKRt5+wunEuTAgVeFwo/Gd152g4hSjAbv6uFJZs44Zg7EpBxz5TNiroYFXq1dLq4DaDY8jqO+uAkfOvVoWHI2JhZisOfoI2gZBqsLJaksPalkCL8iw4Kj20ICUxIYEYH/4S72jeghTrKyFAkhFCHJM188ci8cmVX4hZGD2vNJ1y3aWPe2jQebnZz40Bf0U9eMrBMSIecRPomF8B9USbjF2uwuZQqEMXa0zTHFZLMFRLZGfGBDZNHa6vm/OokJCu2T51hYDYluY4IAmbCYLUMfI+gFxCMvaTDp5fFxf3bycSkb5n5mUMGIfJ0CDxVrvn+OeC+v9+cJFA7pTCBDbR55+KdpWUm65uvilbzzsnX/OLEMMas+xEQAAAABJRU5ErkJggg=="); } /* 5.2 Customize Icon */ .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a, .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href^='https://gemline.zoomcustom.com'], .comm-page-custom-e-catalogs .slds-has-block-links_space li a { display: inline-block; position: relative; text-align: center; } .comm-page-custom-flyers .slds-has-block-links_space a[href^='/s/zoomforwarding']:hover, /* test*/ .comm-page-custom-flyers .slds-has-block-links_space a[href^='https://gemline.zoomcustom.com']:hover, .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href^='https://gemline.zoomcustom.com']:hover, .comm-page-custom-e-catalogs .slds-has-block-links_space li a:hover { text-decoration: underline; } .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a[href^='/s/zoomforwarding']:before, .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space a[href^='https://gemline.zoomcustom.com']:before, /* test*/ .comm-page-custom-case-studies-2 .slds-has-block-links_space a[href^='/s/zoomforwarding']:before { /*width:20px; height:21px;*/ display: block; content: ""; background-size: 16px; margin: 0 auto 2px auto; background-color: #F4F3F1; border-radius: 4px; width: 32px; height: 32px; background-repeat: no-repeat; background-position: center; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAKKADAAQAAAABAAAAKAAAAABZLkSWAAAErklEQVRYCe1YXWhcRRSeM7s1P7aoTSQ1SrFUQbBPAaEUX9Q3URGCVNEHH/ypmN1qJXsvqcg+2OzuJZBkV1uDoI+i+I8PPrRFBBGx0JdSUAS1NpCXxmLtxjS7c/zuTSadvblzdzY/b70Q5sw53znz3XPOzJ2NEDeejWWATPdisdg9v7AwxMyDpj5NJqKlbt55Ogi8Kxrn+/5tiyqzdzI4dkbr1jtmtWPe8w5cqi98BHK7tc5lBF7Uxfx3wD6k8f8qNS5YvZzzvFdqlcqM1q9nlKFT+MZK8WedktMLEol7tByOKMuOcGDFJ0KSpq1TOSJ4ValH4LirU2cHfEjyeK5QGHHAJkIigkLIPYnWTVKiC2ogmV9PuIggE7dslvUEaucDktMg+Vo7XNy+ksG4emvmIDmZK/hvdBJ9SwiykA0bCWY1AZKjNntcvyUEifjH+ELmHCSD/Kj/gqmzyavnYBIAjXkV+iXTxkLcgnlqz/b19Lx/qV6/F7CDgnm76a9lJblfy2ljtNCI5xWE4koLkOSx/t7ut/B1UaY+Pza2jxvNszgzV18OX5Nrfb09O4C9ZmI3Q7aWmIT6Ok4uXLA6Pn4OWfzDXBxkb0LGHjN1myXbCRLdnbQISG8nwQNrbRQeyPvX6jemSSkx1YnFKWSrpWwgNwTdHsuyTZT7JyH4vGBqWjBoTVoUGZqplUrnrZgVw2ofrQEy94LI43E9dGlPBuU+AAD+UpA4EKlJ2ETi0bRgoc1a4naOG7XjRW51iWHPYORNsyhpS4nTgiJnd8G+LQ2jbcutoGfL4+tHj94p+vrmJ48cWdAWK0Ei6deCcuvRo70s42HP241r268g2mWBRGoSdDK7a2DMxITXssZS4x2em5s7XHjz4eng7V9Cu7XEUorTZgAXebpSucBEf6ZhI3J3DDxhZikkh2vZuyi7ROsOKl7ydQwrQVZ0nwa5jrlqtYuYd9rwaeTgE50oGJuUoY91DGuJWagPcgXvJbyRew9evBi+VOInzJWclPRctVz+tj3B5U/ZgxroNFpOFhdy2DQN/HR4tlqpfGKuZc2gCdqI7EoO5+Yz1UrwaXytVIJoinO4a7cpMW3DjWUfAuseWl3DhRzAuC3x07Ug+HzV0RDsBEm+imPmuIG1ijnff56b6sMWANFvXbf3PzlhnGl6twKnX2ZJZuRB9NwXLb7GxEowI8XPBi5dZD67FsAnJ0ZHw/tk9CSSk/QUyH2lMUmj9ZhRzENJDok65r1xPcr7X4tO8STmUebC+yNJGsaGSCUX+lsziIPzvZGCl0PE9B5kzmBd9KBlC7ewBBLkJMvh6aD0TcyUOLUSjNDM9zsti9tJ24eEj3L14Cj5AeS+b4tfAaQTdI2SgANnZPb6g106dX3mLll70D1EMhKZeiDZ0pk2yiD+sYAXdihTB7Hx4d8/UiicyGazM6TUP3HXxuDgbC2fX4zr4/OVEqvf44ZNmbM4hCvUoaRY8q/ZAHovyWbqohLfLOUpKOdMw1bK2MlKZuWXLmtEBMvl8t+4RQzD8YKL00Yw6M0r+EH14lSplPrfB72G/uREc/yk7PhfwDqQ0yjl5Ux395mpYvGyE/4GaBMy8D85usUqFAHrZAAAAABJRU5ErkJggg=="); } /* 5.3 Adjust E-Catalogs Icons */ .comm-page-custom-e-catalogs .slds-has-block-links_space>li a:before { display: block; content: ""; background-size: 16px; margin: 0 auto 2px auto; background-color: #F4F3F1; border-radius: 4px; width: 32px; height: 32px; background-repeat: no-repeat; background-position: center; } /* insert icon */ .comm-page-custom-e-catalogs .slds-has-block-links_space>li:nth-child(1) a:before { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAKKADAAQAAAABAAAAKAAAAABZLkSWAAADTElEQVRYCe1XTWgTURCet2lCGxCVltJ6UhEvIv40KKgnEUS8RxRFb3oo9kdIs7XoFmqTBmyt9uJNURRzFz2IJ0UoUQviRUQ92VpaVMS0JNkdZ5K87es2mzQKstB9h7yZ+WbmfTvv7bwNgD/8CvgV8Cuwtisg/uXx+/r61i8i7rMAdoAQzWBBczGfBvOAOK8BvG8UYnJkZOTn365TN8FYzNi0AItnAK1TCLCTFq6VA8nhHQjtQRM03kuljK/1kK2V3M7VOTCwReRy1xAhSsaADdQnmEJAGkOhyxNDQ59XE1qToGEYoflsdogK1YWIodUkreUjhMgB4HhzODxA+Ul2H1UJ9sTj2/KW9QgQ9rqnKO7xHArxTEP4wn6WgM0C8QgdgZZqcXQ43gQ17cRYMvnRzc+VYJeu77cK5lNaZINrsBDTAlA/FIncj0ajpuqXTqcDLzKZ0wgiQZVvVzFVJgI/iOjRW6nUpGqXckWCnbp+UJjmEzpv66Sjc6ZtehtoCBy/MTw87cRUvbu/v90smI+J5B7Vrsp0Ln9hIHBsIpF4qdpZXkGQtnVr3sIMtYmNTmepE7lpItchyV0yjJZ8Nnueqh0pJ80Ew+Hb1w1jjvUyydfVKklt6ntQExHa7k9ynXKuJbVndLSpMPPtFSXatWRdKWkCzt1Mpe4y0hmPHwbTekhiq8NzFgLayYlk8jnbL8ZiZy2EOw4fpzoVbG87MNbbuyAB6qVLozAzM1iLHJV8js8cR3HlXMgx3MpY0YcUjuFYBqqM3cxBxW2Cvbq+nc5ctwpWkvltlS9E7vfCBfJxVk4Na+WtZwPHcKwKVpZFF3ORmE0wb5pXyBiUgNssW0kRF9jh5ift8lyyvixWOjhm2sFQrmBdlWabINLjSaOXZptgqEEbLHX46vS4CUsPeqKMlN1m1UeNdfWnW4a5SNwmOJpIfODrRwJuM98Q3IQZ51ZC06ybL2NlH+AYjq3iW4ZwvMSlpNoEWW1oa+O9nypBlX/pTLXwDcFosc9RKyGxEslim5G9sHSr1Lj6aO0yB3tx2oHlw9ONWlL19FUnSXr6Y0GS9PTnliTp6Q9WSZJnz37yqyRZ9uyfJidR1v/H385K6/o2vwJ+BfwKrKUK/AGjx7krt6mFVQAAAABJRU5ErkJggg=="); } .comm-page-custom-e-catalogs .slds-has-block-links_space>li:nth-child(2) a:before { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAKKADAAQAAAABAAAAKAAAAABZLkSWAAAErklEQVRYCe1YXWhcRRSeM7s1P7aoTSQ1SrFUQbBPAaEUX9Q3URGCVNEHH/ypmN1qJXsvqcg+2OzuJZBkV1uDoI+i+I8PPrRFBBGx0JdSUAS1NpCXxmLtxjS7c/zuTSadvblzdzY/b70Q5sw53znz3XPOzJ2NEDeejWWATPdisdg9v7AwxMyDpj5NJqKlbt55Ogi8Kxrn+/5tiyqzdzI4dkbr1jtmtWPe8w5cqi98BHK7tc5lBF7Uxfx3wD6k8f8qNS5YvZzzvFdqlcqM1q9nlKFT+MZK8WedktMLEol7tByOKMuOcGDFJ0KSpq1TOSJ4ValH4LirU2cHfEjyeK5QGHHAJkIigkLIPYnWTVKiC2ogmV9PuIggE7dslvUEaucDktMg+Vo7XNy+ksG4emvmIDmZK/hvdBJ9SwiykA0bCWY1AZKjNntcvyUEifjH+ELmHCSD/Kj/gqmzyavnYBIAjXkV+iXTxkLcgnlqz/b19Lx/qV6/F7CDgnm76a9lJblfy2ljtNCI5xWE4koLkOSx/t7ut/B1UaY+Pza2jxvNszgzV18OX5Nrfb09O4C9ZmI3Q7aWmIT6Ok4uXLA6Pn4OWfzDXBxkb0LGHjN1myXbCRLdnbQISG8nwQNrbRQeyPvX6jemSSkx1YnFKWSrpWwgNwTdHsuyTZT7JyH4vGBqWjBoTVoUGZqplUrnrZgVw2ofrQEy94LI43E9dGlPBuU+AAD+UpA4EKlJ2ETi0bRgoc1a4naOG7XjRW51iWHPYORNsyhpS4nTgiJnd8G+LQ2jbcutoGfL4+tHj94p+vrmJ48cWdAWK0Ei6deCcuvRo70s42HP241r268g2mWBRGoSdDK7a2DMxITXssZS4x2em5s7XHjz4eng7V9Cu7XEUorTZgAXebpSucBEf6ZhI3J3DDxhZikkh2vZuyi7ROsOKl7ydQwrQVZ0nwa5jrlqtYuYd9rwaeTgE50oGJuUoY91DGuJWagPcgXvJbyRew9evBi+VOInzJWclPRctVz+tj3B5U/ZgxroNFpOFhdy2DQN/HR4tlqpfGKuZc2gCdqI7EoO5+Yz1UrwaXytVIJoinO4a7cpMW3DjWUfAuseWl3DhRzAuC3x07Ug+HzV0RDsBEm+imPmuIG1ijnff56b6sMWANFvXbf3PzlhnGl6twKnX2ZJZuRB9NwXLb7GxEowI8XPBi5dZD67FsAnJ0ZHw/tk9CSSk/QUyH2lMUmj9ZhRzENJDok65r1xPcr7X4tO8STmUebC+yNJGsaGSCUX+lsziIPzvZGCl0PE9B5kzmBd9KBlC7ewBBLkJMvh6aD0TcyUOLUSjNDM9zsti9tJ24eEj3L14Cj5AeS+b4tfAaQTdI2SgANnZPb6g106dX3mLll70D1EMhKZeiDZ0pk2yiD+sYAXdihTB7Hx4d8/UiicyGazM6TUP3HXxuDgbC2fX4zr4/OVEqvf44ZNmbM4hCvUoaRY8q/ZAHovyWbqohLfLOUpKOdMw1bK2MlKZuWXLmtEBMvl8t+4RQzD8YKL00Yw6M0r+EH14lSplPrfB72G/uREc/yk7PhfwDqQ0yjl5Ux395mpYvGyE/4GaBMy8D85usUqFAHrZAAAAABJRU5ErkJggg=="); } .comm-page-custom-e-catalogs .slds-has-block-links_space>li:nth-child(3) a:before { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAKKADAAQAAAABAAAAKAAAAABZLkSWAAAC70lEQVRYCe2XTWgTQRTH5+3GqElvFg8SafWiB08iCCU5iKAg4sGT0ou3npJasEkTLzk1iYFSk7ugoFcFtZ4EoaWIgngTb0oDtZKclJQ22X3OW7Jhu+xkZjdLWyRzyM68eR+/+c9mMmHskDcIi282m79lgHme8vGk3+qVyuswcocCOJd9eKmDnc9OoIiuXVkulz84bUH6WpAgd4zJzFNum2Gws25bkHEogEEKq8aMAFWVEvmNFBQpo2ofKaiqlMhvpKBIGVX7/6VgulY7qrrysPwiKonmlpaOd35tvWQbjWQ6uzBTf1R+rhLn9knP51MMzBfI8Ot4LHa3WCz+dfu4x9It5kmi3c2tVwzxOjIWRzSfcshpdyLZmOAQzBVETDBkN1vt9sqDajUui5MCtra37/AVX3Mk0v1C2nB8kWN2HkSW2m02Z+yx6CkFRE37xADcW6EM6QVHMACwy9VcE4HZdqULq/XuMOMdbbEd2HsaAFqOK3OBq3zPOQcMniGDNwzwiVM58iE4fu2+zW/db50xXn0lQAoUKeGVdJDNDxzlUQYk52Eh/cL5BhwGMgjcHsB8Pn+ibejjZDQTJ3/UM5kd6ns1v0qqwNGPgNb4PUn1YrrRLJVKLepbWzybyyVNZO/5typKRt5+wunEuTAgVeFwo/Gd152g4hSjAbv6uFJZs44Zg7EpBxz5TNiroYFXq1dLq4DaDY8jqO+uAkfOvVoWHI2JhZisOfoI2gZBqsLJaksPalkCL8iw4Kj20ICUxIYEYH/4S72jeghTrKyFAkhFCHJM188ci8cmVX4hZGD2vNJ1y3aWPe2jQebnZz40Bf0U9eMrBMSIecRPomF8B9USbjF2uwuZQqEMXa0zTHFZLMFRLZGfGBDZNHa6vm/OokJCu2T51hYDYluY4IAmbCYLUMfI+gFxCMvaTDp5fFxf3bycSkb5n5mUMGIfJ0CDxVrvn+OeC+v9+cJFA7pTCBDbR55+KdpWUm65uvilbzzsnX/OLEMMas+xEQAAAABJRU5ErkJggg=="); } /* 5.4 Horizontal Version for videos */ /* set text link so that it'll be vertically centered with icon */ .comm-page-custom-product-videos .slds-has-block-links_space>li a, .comm-page-custom-webinars .slds-has-block-links_space>li a { padding-left: 0; margin-top: 2px; } /* css for icon to vertically center it with text and add margin on the right */ .comm-page-custom-product-videos .slds-has-block-links_space>li a:before, .comm-page-custom-webinars .slds-has-block-links_space>li a:before { display: inline-block; margin: 0 4px 0 0; vertical-align: bottom; } /* 5.5 Remove default behavior of headline text for tiles. By default all headlines are a link, but we want to remove that. */ .comm-page-custom-how-to-use-self-service-tools .slds-grid .js-content-title, .comm-page-custom-fulfillment .slds-grid .js-content-title, .comm-page-custom-order-policy .slds-grid .js-content-title, .comm-page-custom-flyers .slds-grid .js-content-title, .comm-page-custom-case-studies-2 .slds-grid .js-content-title, .comm-page-custom-partners .slds-grid .js-content-title, .comm-page-custom-2021-trends .slds-grid .js-content-title, .comm-page-custom-give-back .slds-grid .js-content-title, .comm-page-custom-decoration-and-charges .slds-grid .js-content-title, .comm-page-custom-e-catalogs .slds-grid .js-content-title, .comm-page-custom-global-solutions .slds-grid .js-content-title, .comm-page-custom-shipping-information .slds-grid .js-content-title, .comm-page-custom-promotions .slds-grid .js-content-title, .comm-page-custom-corporate-social-responsibility .slds-grid .js-content-title, .comm-page-custom-fulfillment .slds-grid .js-content-title { pointer-events: none; cursor: text; } /* make the parent element for the flyer headlines have no pointer events to prevent Chrome and Edge from executing the link the first time someone clicks on it. */ .comm-page-custom-how-to-use-self-service-tools .slds-grid>.slds-col>span, .comm-page-custom-fulfillment .slds-grid>.slds-col>span, .comm-page-custom-order-policy .slds-grid>.slds-col>span, .comm-page-custom-flyers .slds-grid>.slds-col>span, .comm-page-custom-case-studies-2 .slds-grid>.slds-col>span, .comm-page-custom-partners .slds-grid>.slds-col>span, .comm-page-custom-2021-trends .slds-grid>.slds-col>span, .comm-page-custom-give-back .slds-grid>.slds-col>span, .comm-page-custom-decoration-and-charges .slds-grid>.slds-col>span, .comm-page-custom-e-catalogs .slds-grid>.slds-col>span, .comm-page-custom-global-solutions .slds-grid>.slds-col>span, .comm-page-custom-shipping-information .slds-grid>.slds-col>span, .comm-page-custom-promotions .slds-grid>.slds-col>span, .comm-page-custom-fulfillment .slds-grid>.slds-col>span { pointer-events: none; cursor: default; display: block; } .comm-page-custom-how-to-use-self-service-tools .slds-grid .js-content-title, .comm-page-custom-how-to-use-self-service-tools .slds-grid .js-content-title:hover, .comm-page-custom-order-policy .slds-grid .js-content-title, .comm-page-custom-order-policy .slds-grid .js-content-title:hover, .comm-page-custom-fulfillment .slds-grid .js-content-title, .comm-page-custom-fulfillment .slds-grid .js-content-title:hover, .comm-page-custom-flyers .slds-grid .js-content-title, .comm-page-custom-flyers .slds-grid .js-content-title:hover, .comm-page-custom-case-studies-2 .slds-grid .js-content-title, .comm-page-custom-case-studies-2 .slds-grid .js-content-title:hover, .comm-page-custom-partners .slds-grid .js-content-title:hover, .comm-page-custom-2021-trends .slds-grid .js-content-title:hover, .comm-page-custom-give-back .slds-grid .js-content-title:hover, .comm-page-custom-decoration-and-charges .slds-grid .js-content-title:hover, .comm-page-custom-e-catalogs .slds-grid .js-content-title:hover, .comm-page-custom-global-solutions .slds-grid .js-content-title:hover, .comm-page-custom-shipping-information .slds-grid .js-content-title:hover, .comm-page-custom-promotions .slds-grid .js-content-title:hover, .comm-page-custom-fulfillment .slds-grid .js-content-title:hover { text-decoration: none; } /* 5.5 Flex Layout for Tiles */ /* Set flex layout for tiles */ .comm-page-custom-partners .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col, .comm-page-custom-give-back .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col, .comm-page-custom-decoration-and-charges .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col, .comm-page-custom-global-solutions .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col, .comm-page-custom-promotions .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col, .comm-page-home .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col { display: flex; flex-direction: column; align-content: flex-start; } .comm-page-custom-promotions .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col { align-content: stretch; } .comm-page-custom-partners .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col>span, .comm-page-custom-give-back .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col>span, .comm-page-custom-decoration-and-charges .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col>.js-content-subtitle, .comm-page-custom-global-solutions .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col>.js-content-subtitle, .comm-page-custom-promotions .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col>.js-content-title, .comm-page-custom-promotions .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col .slds-has-block-links_space, .comm-page-home .forceCommunityDynamicCollectionGrid .forceCommunityTileLayout .slds-col>span { flex-grow: 1; } /* 5.6 Specific Page Overrides for button links */ /* set the links in the Give Back tiles to have no forced height so that they aren't so close together */ .comm-page-custom-give-back .slds-has-block-links_space .slds-item { height: auto; } /* add a bit of padding below the button for these tiles so that it has some breathing room */ .comm-page-custom-e-catalogs .slds-grid .js-content-metadata, .comm-page-custom-promotions .slds-grid .js-content-metadata { margin-bottom: .5rem; } /* remove an empty space at the bottom of the Give Back tiles */ .comm-page-custom-give-back .js-dynamic-collection .slds-grid .js-content-metadata { display: none; } /* ---- 6.0 Turn Text Links into Buttons ---- */ /* Updated Flyer Icon */ /* Fully Customizable Icons Top Row */ .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space>li a, .comm-page-custom-practice-page .slds-has-block-links_space>li a { display: block; position: relative; text-align: center; } .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space>li, .comm-page-custom-practice-page .slds-has-block-links_space>li { width: 50%; } /* .comm-page-custom-practice-page .slds-has-block-links_space, .comm-page-custom-practice-page .slds-has-block-links_space li { padding:0; margin:0; list-style-type:none; } .comm-page-custom-practice-page .slds-has-block-links_space li:before { display:none !important; } */ .comm-page-custom-flyers .cThemeLayoutMain .slds-has-block-links_space>li a:before, .comm-page-custom-practice-page .slds-has-block-links_space>li a:before { display: block; content: ""; background-size: 16px; margin: 0 auto 2px auto; background-color: #F4F3F1; border-radius: 4px; width: 32px; height: 32px; background-repeat: no-repeat; background-position: center; } .comm-page-custom-flyers .cThemeLayoutMain .slds-grid .slds-has-block-links_space>li:nth-child(1) a:before, .comm-page-custom-practice-page .slds-grid .slds-has-block-links_space>li:nth-child(1) a:before { background-image: url(/sfsites/c/file-asset/BrandedIconpng); } .comm-page-custom-flyers .cThemeLayoutMain .slds-grid .slds-has-block-links_space>li:nth-child(2) a:before, .comm-page-custom-practice-page .slds-grid .slds-has-block-links_space>li:nth-child(2) a:before { background-image: url(/sfsites/c/file-asset/UnbrandedIconpng); } /* Fully Customizable Icons Bottom Row */ .comm-page-custom-flyers .cThemeLayoutMain .js-content-metadata>li, .comm-page-custom-practice-page .js-content-metadata>li { display: inline-block; position: relative; text-align: center; width: 50%; } .comm-page-custom-flyers .cThemeLayoutMain .js-content-metadata>li a, .comm-page-custom-practice-page .js-content-metadata>li a { display: block; } .comm-page-custom-flyers .cThemeLayoutMain .js-content-metadata, .comm-page-custom-flyers .cThemeLayoutMain .js-content-metadata li, .comm-page-custom-practice-page .js-content-metadata, .comm-page-custom-practice-page .js-content-metadata li { margin-left: 0; margin-right: 0; list-style-type: none; padding-left: 0; padding-right: 0; } .comm-page-custom-flyers .cThemeLayoutMain .js-content-metadata li:before, .comm-page-custom-practice-page .js-content-metadata li:before { display: none !important; } .comm-page-custom-flyers .cThemeLayoutMain .js-content-metadata>li a:before, .comm-page-custom-practice-page .js-content-metadata>li a:before { display: block; content: ""; background-size: 16px; margin: 0 auto 2px auto; background-color: #F4F3F1; border-radius: 4px; width: 32px; height: 32px; background-repeat: no-repeat; background-position: center; } .comm-page-custom-flyers .cThemeLayoutMain .slds-grid .js-content-metadata>li:nth-child(1) a:before, .comm-page-custom-practice-page .slds-grid .js-content-metadata>li:nth-child(1) a:before { background-image: url(/sfsites/c/file-asset/UnbrandedSemiIconpng); } .comm-page-custom-flyers .cThemeLayoutMain .slds-grid .js-content-metadata>li:nth-child(2) a:before, .comm-page-custom-practice-page .slds-grid .js-content-metadata>li:nth-child(2) a:before { background-image: url(/sfsites/c/file-asset/UnbrandedFullyIconpng); } .comm-page-custom-flyers .cThemeLayoutMain .slds-grid .js-content-metadata>li a[href="/delete"], .comm-page-custom-practice-page .slds-grid .js-content-metadata>li a[href="/delete"] { display: none; } /* 6.1 Brand Outline */ /* Default State */ .comm-page-custom-partners .slds-item a, .comm-page-custom-order-policy .slds-grid .js-content-metadata>li a, .comm-page-custom-decoration-and-charges .slds-item a, .comm-page-custom-decoration-methods-headwear .slds-item a, .comm-page-custom-global-solutions .slds-item a, .comm-page-custom-product-data .slds-has-block-links_space a, .comm-page-custom-product-data-practice .slds-has-block-links_space a, .comm-page-custom-2021-trends .slds-has-block-links_space a, .comm-page-custom-give-back .slds-has-block-links_space .slds-item:last-child a, .comm-page-custom-e-catalogs .slds-grid .js-content-metadata>li a, .comm-page-custom-promotions .slds-grid .js-content-metadata>li a { display: block; max-width: 180px; border: 1px solid rgb(33, 96, 147); /* Action Color */ margin: 1rem auto 0 auto; border-radius: 4px; box-sizing: border-box; font-size: 13px; text-decoration: none; line-height: 1.875rem; color: rgb(33, 96, 147); font-weight: 400; text-align: center; padding: 0 32px; transition: none; } /* Hover State */ .comm-page-custom-partners .slds-item a:hover, .comm-page-custom-order-policy .slds-grid .js-content-metadata>li a:hover, .comm-page-custom-decoration-and-charges .slds-item a:hover, .comm-page-custom-global-solutions .slds-item a:hover, .comm-page-custom-product-data .slds-has-block-links_space a:hover, .comm-page-custom-product-data-practice .slds-has-block-links_space a:hover, .comm-page-custom-2021-trends .slds-has-block-links_space a:hover, .comm-page-custom-give-back .slds-has-block-links_space .slds-item:last-child a:hover, .comm-page-custom-e-catalogs .slds-grid .js-content-metadata>li a:hover, .comm-page-custom-promotions .slds-grid .js-content-metadata>li a:hover { background-color: rgb(33, 96, 147); color: white; border: 1px solid rgb(33, 96, 147); } /* 6.2 Brand Primary (Filled In) */ /* Default State */ .comm-page-custom-product-data .js-content-metadata a, .comm-page-custom-product-data-practice .js-content-metadata a, .comm-page-custom-carbon-footprint .slds-has-block-links_space a { display: inline-block; border: 1px solid rgb(33, 96, 147); border-radius: 4px; box-sizing: border-box; font-size: 13px; text-decoration: none; line-height: 1.875rem; color: white; font-weight: 400; background: rgb(33, 96, 147); padding: 0 16px; transition: none; } /* Hover State */ .comm-page-custom-product-data .js-content-metadata a:hover, .comm-page-custom-product-data-practice .js-content-metadata a:hover, .comm-page-custom-carbon-footprint .slds-has-block-links_space a:hover { background-color: rgb(24, 68, 104); color: white !important; border: 1px solid rgb(24, 68, 104); text-decoration: none !important; } /* ---- 7.0 Product Videos Page ---- */ /* remove make space between content sections a bit smaller */ .comm-page-custom-product-videos .forceCommunitySection .slds-grid .cb-section_column .ui-widget:first-child { margin-bottom: 0; } .comm-page-custom-product-videos .forceCommunitySection .cb-section_column:only-child { padding-bottom: 0; } /* center video grid */ .comm-page-custom-product-videos .forceCommunityDynamicCollectionGrid .slds-wrap, .comm-page-custom-global-solutions .forceCommunityDynamicCollectionGrid .slds-wrap { justify-content: center; } /* ---- 8.0 Custom Solutions Page ---- */ /* custom solutions page */ .comm-page-custom-custom-solutions .steps { max-width: 650px; margin-left: auto; margin-right: auto; } .comm-page-custom-custom-solutions .steps>.slds-grid { padding-bottom: 2.5em; margin-bottom: 2.5em; border-bottom: 1px solid #dddcd9; } .comm-page-custom-custom-solutions .steps>.slds-grid img { margin-bottom: 1em; } .comm-page-custom-custom-solutions .number { color: rgb(132, 213, 253); font-size: 50px; padding-top: 0px; padding-right: 15px; padding-left: 15px; } .comm-page-custom-custom-solutions .step-title { padding-top: 10px; margin-bottom: .5rem; } .cms-page-content p { line-height: 24px; margin: 0 0 1.5em; } /* ---- 9.0 Stock Modified Page ---- */ /* Stock Modiļ¬ed */ .comm-page-custom-stock-modied .circle { width: 40px; height: 40px; line-height: 35px; border-radius: 50%; text-align: center; font-size: 17px; border: 3px solid rgb(91, 102, 112); margin: 10px 10px 10px 10px; color: rgb(91, 102, 112); font-weight: bold; display: inline-block; } .comm-page-custom-stock-modied .container { margin-left: auto; margin-right: auto; max-width: 838px; font-size: 14px; font-weight: bold; } /* ---- 10.0 Table Styles ---- */ table.info-table { background-color: #ffffff; border: 1px solid #050404; border-style: solid; border-width: 1px; margin-bottom: 30px; } table.info-table td { padding: 10px; } table.info-table .info-table-header { background-color: #b7cbf4; } /* This will apply to tables pasted into a rich text editor */ .ql-table-blob, .info-table { background-color: #fff; font-size: 14px; line-height: 1.25; width: 100%; border-collapse: separate; border: 1px solid #dddcd9; border-spacing: 0; margin: .5rem 0; } .ql-table-blob thead td, .info-table thead td { background-color: #f4f3f1; color: #231f20; padding: .5rem .5rem; padding-left: 0.5rem; font-weight: bold; border-left: 1px solid #dddcd9; } .ql-table-blob tbody td, .info-table tbody td { color: #231f20; padding: .5rem .5rem; padding-left: 0.5rem; font-weight: normal; border-top: 1px solid #dddcd9; border-left: 1px solid #dddcd9; } .ql-table-blob tbody td:first-child, .info-table tbody td:first-child, .ql-table-blob thead td:first-child, .info-table thead td:first-child { border-left: none; } .ql-table-blob tr, .info-table tr { counter-increment: row-number; } .ql-table-blob tr:hover td, .info-table tr:hover td { background: #f9f9f8; } /* ---- 11.0 Pardot Contact Form iframe container ---- */ #get-in-touch { height: 600px; } /* ---- 12.0 Product Data Page ---- */ .comm-page-custom-product-data [data-item-id="0d2541c5-b19a-4f51-889c-a87bbab95ec2"] {} /* ---- 13.0 Careers Page ---- */ /* Style to create the blue backgrounds for the headlines */ h3.careers { color: white; font-weight: bold; background-color: #295993; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px; } .comm-page-custom-careers .forceCommunityBannerLayout .layout_title { max-height: none; overflow: visible; -webkit-line-clamp: none; display: block; } /* ---- 14.0 Flyers Page ---- */ /* center the tab links on the Flyers page */ .comm-page-custom-flyers .tabs__nav { justify-content: center; } /* ---- 15.0 Login Page ---- */ .comm-page-login-home a { color: rgb(0, 129, 157) !important; } .comm-page-login-home a:hover { text-decoration: underline !important; } .comm-page-login-home .forceCommunityRichText { width: 100%; display: flex; margin-top: 6px; } /* ---- 16.0 Cookie Consent ---- */ .cookiecon-footer-container-fixed .slds-has-dividers_left>.slds-list__item::before, .cookiecon-footer-container-fixed .slds-has-dividers--left>.slds-list__item::before, .cookiecon-footer-container-fixed .slds-has-dividers_left>.slds-item::before, .cookiecon-footer-container-fixed .slds-has-dividers--left>.slds-item::before { display: none; } .cookiecon-footer-container-fixed .slds-has-dividers_left>.slds-item a { text-decoration: underline; } .cookiecon-footer-container-fixed .slds-has-dividers_left>.slds-item a:hover { text-decoration: none; } .cookiecon-footer-container-fixed>.slds-wrap { max-width: 1328px; margin: 0 auto; } /* ---- 17.0 What's New ---- */ .comm-page-custom-whats-new .forceCommunityBannerLayout .layout_title { max-width: 480px; } .comm-page-custom-whats-new .forceCommunityBannerLayout .js-content { transform: translateY(-2em); } /* ---- 18.0 Video Banner ---- */ /* YouTube Embed Responsive */ figure.cloudx_cmsSS_uiVideoBanner .slds-image__crop, div[data-item-id="fd3f6efe-c2cf-4d96-b1df-2cb5f11d7367"] figure .slds-image__crop, div[data-item-id="d7646e41-a467-4a11-a401-ff5464fce770"] figure .slds-image__crop, div[data-item-id="4bf1785e-8093-491a-9d4a-0dd77d8a2c88"] figure .slds-image__crop, div[data-item-id="7faf37f3-ad64-4fa5-994a-8b45ddc6abfc"] figure .slds-image__crop /* Cuisinart Video */ { position: relative; width: 100%; height: 0 !important; padding-bottom: 56.25%; } figure.cloudx_cmsSS_uiVideoBanner .slds-image__crop iframe, div[data-item-id="fd3f6efe-c2cf-4d96-b1df-2cb5f11d7367"] figure .slds-image__crop iframe, div[data-item-id="d7646e41-a467-4a11-a401-ff5464fce770"] figure .slds-image__crop iframe, div[data-item-id="4bf1785e-8093-491a-9d4a-0dd77d8a2c88"] figure .slds-image__crop iframe, div[data-item-id="7faf37f3-ad64-4fa5-994a-8b45ddc6abfc"] figure .slds-image__crop iframe /* Cuisinart Video */ { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: none !important; } /* ---- 18.0 Corporate Social Responsibility ---- */ /* ---- .comm-page-custom-corporate-social-responsibility .accordion { position:relative; } .comm-page-custom-corporate-social-responsibility .accordion input[type=checkbox] { position: absolute; cursor: pointer; width: 100%; height: 100%; z-index: 1; opacity: 0; } .comm-page-custom-corporate-social-responsibility .accordion_content { z-index:2; display:none; position:relative; } .comm-page-custom-corporate-social-responsibility .accordion input[type=checkbox]:checked ~ .accordion_content { display:block; z-index:2; } .comm-page-custom-corporate-social-responsibility .accordion .slds-accordion__summary-heading { position:relative; display:block; padding-right:40px; box-shadow:12px 0 0 0 rgba(255,255,255,0), -12px 0 0 0 rgba(255,255,255,0); transition:background-color .25s ease-in-out, box-shadow .25s ease-in-out; } .comm-page-custom-corporate-social-responsibility .accordion:hover .slds-accordion__summary-heading { background:#f4f3f1; box-shadow:12px 0 0 0 #f4f3f1, -12px 0 0 0 #f4f3f1; } .comm-page-custom-corporate-social-responsibility .accordion .slds-accordion__summary-heading:before { width:32px; height:32px; position:absolute; right:0; top:16px; content:''; background:url(https://www.gemline.com/sfsites/c/file-asset/icon_chevron_down); background-size:cover; transition:transform .15s ease-in-out; } .comm-page-custom-corporate-social-responsibility .accordion input[type=checkbox]:checked ~ .slds-accordion__summary-heading:before { transform:rotate(180deg); } .comm-page-custom-corporate-social-responsibility .gem-products-grid .slds-text-heading_small a { color:var(--lwc-colorTextPrimary); } .comm-page-custom-corporate-social-responsibility .gem-products-grid .slds-box:hover { border-color:var(--lwc-brandPrimary); } .comm-page-custom-corporate-social-responsibility .slds-button_brand { color:var(--lwc-buttonColorTextPrimary); margin-left:auto; margin-right:auto; } .comm-page-custom-corporate-social-responsibility .slds-button_brand:hover { color:var(--lwc-buttonColorTextPrimary); text-decoration:none; } */ .comm-page-custom-corporate-social-responsibility .gem-infographics_environment .slds-col .slds-box { /* border:1px solid var(--lwc-brandPrimary); color:var(--lwc-brandPrimary); box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; */ } /*.comm-page-custom-corporate-social-responsibility .gem-infographics_environment .slds-col:nth-child(odd) .slds-box { border-color:#88d0e6; }*/ .csr_product_name { color: black; } .gem_image { display: block; max-width: 100%; height: auto; } /* .comm-page-custom-corporate-social-responsibility .slds-media { overflow:hidden; display:flex; align-content:stretch; align-items:stretch; height:100%; } .comm-page-custom-corporate-social-responsibility .slds-media.csr-border { border-radius:10px; border:1px solid var(--lwc-brandPrimary); box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; } */ /* .comm-page-custom-corporate-social-responsibility .slds-media__figure { width:88px; text-align:center; display:flex; align-items:center; align-content:center; flex-direction:column; margin-right:0; } .comm-page-custom-corporate-social-responsibility .slds-media__figure.gem-justify-center { justify-content:center; } */ /* .comm-page-custom-corporate-social-responsibility .slds-media__body .slds-text-heading_large strong { color: var(--lwc-brandPrimary); } .comm-page-custom-corporate-social-responsibility .slds-media__body .slds-text-heading_large strong::selection, .comm-page-custom-corporate-social-responsibility .slds-media__body .slds-text-heading_large strong::-moz-selection { color: var(--lwc-colorTextPrimary); -webkit-text-fill-color: var(--lwc-colorTextPrimary); } .comm-page-custom-corporate-social-responsibility .slds-media__body { flex-grow:1; } */ .comm-page-list-1Os .slds-table tr td:last-child, .comm-page-list-1Os .slds-table tr th:last-child, .comm-page-list-1Os .forceCommunityRecordListMobile .forceRecordLayout .slds-button { display: none; } /* ---- home page buttons .forceCommunityRichText .uiOutputRichText a.create_home_button_custom { padding-top: 5px; padding-bottom: 5px; color: #2673a9; font-weight: bold; } .forceCommunityRichText .uiOutputRichText a.reate_home_button_custom { color: #206093 !important; } --- */ /* ---- 19.0 Login Update - Buttons/Troubleshooting Page --- */ .forceCommunityRichText .uiOutputRichText a { padding-top: 5px; padding-bottom: 5px; /* color: #206093; */ color: #0d839e; } .forceCommunityRichText .uiOutputRichText a.slds-button_outline-brand { color: var(--lwc-colorTextBrand, rgb(33, 96, 147)); } .forceCommunityRichText .uiOutputRichText a.create_login_button_custom, .forceCommunityRichText .uiOutputRichText a.reset_pass_button_custom, .forceCommunityRichText .uiOutputRichText a.login_custom_backtolog_button { color: #2673a9 !important; } .forceCommunityRichText .uiOutputRichText a.create_login_button_custom, .forceCommunityRichText .uiOutputRichText a.login_custom_register_button, .forceCommunityRichText .uiOutputRichText a.login_custom_backtolog_button, .forceCommunityRichText .uiOutputRichText a.reset_pass_button_custom { font-weight: bold; } .forceCommunityRichText .uiOutputRichText { width: 100%; } .salesforceIdentityLoginForm2 .uiButton { margin-bottom: 0 !important; } .comm-page-login-home .forceCommunityRichText { margin-top: 0 !important; } .salesforceIdentityForgotPassword2 .uiButton { margin-bottom: 0 !important; } /* Troubleshooting page accordion */ .comm-page-custom-account-troubleshooting .accordion { position: relative; } .comm-page-custom-account-troubleshooting .accordion input[type=checkbox] { position: absolute; cursor: pointer; width: 100%; height: 100%; z-index: 1; opacity: 0; } .comm-page-custom-account-troubleshooting .accordion_content { z-index: 2; display: none; position: relative; } .comm-page-custom-account-troubleshooting .accordion input[type=checkbox]:checked~.accordion_content { display: block; z-index: 2; } .comm-page-custom-account-troubleshooting .accordion .slds-accordion__summary-heading { position: relative; display: block; padding-right: 40px; box-shadow: 12px 0 0 0 rgba(255, 255, 255, 0), -12px 0 0 0 rgba(255, 255, 255, 0); transition: background-color .25s ease-in-out, box-shadow .25s ease-in-out; } .comm-page-custom-account-troubleshooting .accordion:hover .slds-accordion__summary-heading { background: #f4f3f1; box-shadow: 12px 0 0 0 #f4f3f1, -12px 0 0 0 #f4f3f1; } .comm-page-custom-account-troubleshooting .accordion .slds-accordion__summary-heading:before { width: 32px; height: 32px; position: absolute; right: 0; top: 16px; content: ''; background: url(https://www.gemline.com/sfsites/c/file-asset/icon_chevron_down); background-size: cover; transition: transform .15s ease-in-out; } .comm-page-custom-account-troubleshooting .accordion input[type=checkbox]:checked~.slds-accordion__summary-heading:before { transform: rotate(180deg); } /* Order Status Page FAQ */ .comm-page-custom-orders .accordion { position: relative; } .comm-page-custom-orders .accordion input[type=checkbox] { position: absolute; cursor: pointer; width: 100%; height: 100%; z-index: 1; opacity: 0; } .comm-page-custom-orders .accordion_content { z-index: 2; display: none; position: relative; } .comm-page-custom-orders .accordion input[type=checkbox]:checked~.accordion_content { display: block; z-index: 2; } .comm-page-custom-orders .accordion .slds-accordion__summary-heading { position: relative; display: block; padding-right: 40px; box-shadow: 12px 0 0 0 rgba(255, 255, 255, 0), -12px 0 0 0 rgba(255, 255, 255, 0); transition: background-color .25s ease-in-out, box-shadow .25s ease-in-out; } .comm-page-custom-orders .accordion:hover .slds-accordion__summary-heading { background: #f4f3f1; box-shadow: 12px 0 0 0 #f4f3f1, -12px 0 0 0 #f4f3f1; } .comm-page-custom-orders .accordion .slds-accordion__summary-heading:before { width: 32px; height: 32px; position: absolute; right: 0; top: 16px; content: ''; background: url(https://www.gemline.com/sfsites/c/file-asset/icon_chevron_down); background-size: cover; transition: transform .15s ease-in-out; } .comm-page-custom-orders .accordion input[type=checkbox]:checked~.slds-accordion__summary-heading:before { transform: rotate(180deg); } /* ---- 19.0 Fulfillment ---- */ /* Kitting Grid */ [data-item-id="45c1c41c-944c-4932-ae18-7f59dde8b9fa"] .js-content-subtitle.slds-text-body_regular { font-size: var(--lwc-fontSize6); margin-top: 0; } [data-item-id="45c1c41c-944c-4932-ae18-7f59dde8b9fa"] .js-content-eyebrow.slds-text-body_regular { font-size: var(--lwc-fontSize5); } [data-item-id="45c1c41c-944c-4932-ae18-7f59dde8b9fa"] .forceCommunityDynamicCollectionGrid>.slds-grid { justify-content: center; } @media (max-width:767px) { [data-item-id="45c1c41c-944c-4932-ae18-7f59dde8b9fa"] .forceCommunityFlexTileLayout { max-width: 400px; margin-left: auto; margin-right: auto; } } [data-item-id="0c423dbf-e8ad-459b-9246-e0f5cf0508b1"] .uiOutputRichText { max-width: 80ch; margin: 0 auto; } /* BuyBoxes CTA Section */ /* round corners of container */ [data-item-id="c504457c-9887-4a16-8078-967e81530be9"]>.forceCommunitySection, [data-item-id="47665804-1b7f-4822-a3ea-b81913802159"]>.forceCommunitySection { border-radius: 1.25rem; overflow: hidden; max-width: 1248px; margin: 0 1rem; } /* make image stick to the bottom right of the container */ [data-item-id="c504457c-9887-4a16-8078-967e81530be9"] .forceCommunitySection .cb-section_column:last-child, [data-item-id="47665804-1b7f-4822-a3ea-b81913802159"] .forceCommunitySection .cb-section_column:last-child { padding-bottom: 0; padding-top: 0; padding-right: 0 !important; display: flex; align-items: flex-end; justify-content: flex-end; } /* Limit the size of the image so it's not huge on tablet */ [data-item-id="c504457c-9887-4a16-8078-967e81530be9"] .forceCommunitySection .cb-section_column:last-child img, [data-item-id="47665804-1b7f-4822-a3ea-b81913802159"] .forceCommunitySection .cb-section_column:last-child img { max-width: 550px; width: 100%; } /* center text */ [data-item-id="c504457c-9887-4a16-8078-967e81530be9"] .forceCommunitySection .cb-section_column:first-child, [data-item-id="47665804-1b7f-4822-a3ea-b81913802159"] .forceCommunitySection .cb-section_column:first-child { display: flex; align-items: center; } /* limit the max-width of the paragraph */ [data-item-id="c504457c-9887-4a16-8078-967e81530be9"] .forceCommunitySection .cb-section_column:first-child p, [data-item-id="47665804-1b7f-4822-a3ea-b81913802159"] .forceCommunitySection .cb-section_column:first-child p { max-width: 60ch; } /* give text area some horizontal padding */ [data-item-id="c1977e7d-778b-46de-b857-51170afc1fda"], [data-item-id="fa1ccacd-b034-47dc-9f28-56f11ba7937c"] { padding: 1rem 1.125rem; } /* Kitting Flyer */ [data-item-id="ba40f657-b7a9-4ba0-bdc6-c224732dee94"] .forceCommunityDynamicCollectionGrid .slds-grid, [data-item-id="98bfb9b0-b52a-47d4-ab9e-12efe31815a3"] .forceCommunityDynamicCollectionGrid .slds-grid { justify-content: center; } div[data-item-id="0ec2e16e-46d9-4f0b-b7ea-d34c737e7162"] .forceCommunitySection .cb-section_background, div[data-item-id="af97c16c-52a9-4255-ae08-799b425f35f2"] .forceCommunitySection .cb-section_background { border-radius: 8px; } div[data-item-id="0ec2e16e-46d9-4f0b-b7ea-d34c737e7162"] .forceCommunitySection, div[data-item-id="af97c16c-52a9-4255-ae08-799b425f35f2"] .forceCommunitySection { padding: 24px 8px 24px 8px; } @media (min-width: 1024px) { div[data-item-id="79ad7694-7e9d-4320-b31b-5455f38a08c1"] .uiOutputRichText { padding-top: 4em; padding-right: 4em; } div[data-item-id="57efa8e4-80e4-4430-9b53-1e09ceb8d219"] .uiOutputRichText { padding-top: 4em; padding-left: 4em; } .block-on-desktop { display: block; } } @media (max-width: 600px) { .blockandfont-on-mobile { display: block; font-size: 36px; } .justifyandfont-on-mobile { text-align: justify; font-size: 36px; } } @media (max-width: 1023px) { div[data-item-id="af97c16c-52a9-4255-ae08-799b425f35f2"] .cb-section_row>.cb-section_column:first-child { order: 1; } div[data-item-id="af97c16c-52a9-4255-ae08-799b425f35f2"] .cb-section_row>.cb-section_column:nth-child(2) { order: 3; } div[data-item-id="af97c16c-52a9-4255-ae08-799b425f35f2"] .cb-section_row>.cb-section_column:nth-child(3) { order: 2; } div[data-item-id="af97c16c-52a9-4255-ae08-799b425f35f2"] .cb-section_row>.cb-section_column:nth-child(4) { order: 4; } } /*div[data-item-id="9e4a7fdf-5a91-45f1-818f-e8a83aeb257e"] .forceCommunitySection .cb-section_background { border-radius:0 0 8px 8px; } div[data-item-id="9e4a7fdf-5a91-45f1-818f-e8a83aeb257e"] .forceCommunitySection { padding:0 8px 24px 8px; } div[data-item-id="0ec2e16e-46d9-4f0b-b7ea-d34c737e7162"] .forceCommunitySection .uiOutputRichText h3 { min-height:54px; } div[data-item-id="0ec2e16e-46d9-4f0b-b7ea-d34c737e7162"] .cb-section_column.slds-large-size_2-of-12 { display:flex; align-items:center; } div[data-item-id="7377d8ac-7d20-40bb-8fee-3c510e83d996"] { width:100%; }*/ .gem-hr { position: relative; display: block; margin: 0 auto; max-width: 300px; } .gem-hr:before { height: 2px; width: 100%; position: absolute; left: 0; background: #dddcd9; top: calc(50% - 1px); content: ''; z-index: 1; } .comm-page-custom-fulfillment h5 b { color: #216093; } .gem-hr>span { position: relative; display: inline-block; padding: 0 .5rem; background: rgb(255, 255, 255); z-index: 2; } /* Floating Animation */ @keyframes float-up { 0% { transform: translatey(10px); } 50% { transform: translatey(0px); } 100% { transform: translatey(10px); } } /* Floating Animation */ @keyframes float-up { 0% { opacity: 0; transform: translatey(30px); } 100% { opacity: 1; transform: translatey(0); } } /* apply floating animation to images */ .comm-page-custom-fulfillment img[class*="fulfillment-float-"] { transform: translatey(30px); opacity: 0; } .comm-page-custom-fulfillment .fulfillment-float-1 { animation: .5s ease-in-out 1.25s 1 normal forwards float-up; } .comm-page-custom-fulfillment .fulfillment-float-2 { animation: .5s ease-in-out 1.75s 1 normal forwards float-up; } .comm-page-custom-fulfillment .fulfillment-float-3 { animation: .5s ease-in-out 2.25s 1 normal forwards float-up; } .comm-page-custom-fulfillment .fulfillment-float-4 { animation: .5s ease-in-out 3s 1 normal forwards float-up; } .comm-page-custom-fulfillment .fulfillment-float-5 { animation: .5s ease-in-out 3.5s 1 normal forwards float-up; } .comm-page-custom-fulfillment .fulfillment-float-6 { animation: .5s ease-in-out 4s 1 normal forwards float-up; } .cart-notification-modal .slds-modal__close.uiButton--modal-closeBtn { top: -3rem; right: 0; } .cart-notification-modal .slds-modal__close.uiButton--modal-closeBtn .slds-icon_container, .cart-notification-modal .slds-modal__close.uiButton--modal-closeBtn svg[data-key="close"] { width: var(--lwc-squareIconMediumBoundary, 2rem); height: var(--lwc-squareIconMediumBoundary, 2rem); } /* PPAI column reducer */ @media only screen and (max-width: 1023px) { [data-item-id="c2d619d0-92a6-485e-8b25-8f15771ac356"] .cb-section_row .cb-section_column:first-child, [data-item-id="c2d619d0-92a6-485e-8b25-8f15771ac356"] .cb-section_row .cb-section_column:last-child { display: none; } } @media only screen and (max-width: 1023px) { [data-item-id="c2d619d0-92a6-485e-8b25-8f15771ac356"] .cb-section_row .cb-section_column:nth-child(2) { padding-top: 16px; } } @media only screen and (max-width: 1023px) { [data-item-id="e3a5d77b-c9a3-4926-82f8-a1361c71dac6"] .cb-section_row .cb-section_column:last-child { padding-bottom: 8px; } } @media only screen and (max-width: 1023px) { [data-item-id="e3a5d77b-c9a3-4926-82f8-a1361c71dac6"] .cb-section_row .cb-section_column:nth-child(2), [data-item-id="e3a5d77b-c9a3-4926-82f8-a1361c71dac6"] .cb-section_row .cb-section_column:last-child, [data-item-id="c2d619d0-92a6-485e-8b25-8f15771ac356"] .cb-section_row .cb-section_column:nth-child(3) { padding-top: 16px; } } @media only screen and (max-width: 1023px) { .footer-top .footer-subscribe-container .media-label .register-label #text { font-size: 12px } } @media only screen and (max-width: 600px) { .ppai-btn { width: 100%; } } @media only screen and (min-width: 601px) { .ppai-btn { width: 270px; } } /* SHOW PAGES */ .forceCommunityRichText a.slds-button, .forceCommunityRichText a.slds-button:hover, .forceCommunityRichText a.slds-button:visited, .forceCommunityRichText a.slds-button:active { text-decoration: none; } .forceCommunityRichText a.slds-button:not(.slds-button_outline-brand), .forceCommunityRichText a.slds-button:not(.slds-button_outline-brand):hover, .forceCommunityRichText a.slds-button:not(.slds-button_outline-brand):visited, .forceCommunityRichText a.slds-button:not(.slds-button_outline-brand):active { color: #fff; } .comm-page-custom-shows .sfdcCbImage { display: block; max-width: 100%; width: 356px; margin: 0 auto; } @media only screen and (max-width: 845px) { .forceCommunityUserSettingsCustomizable .sectionbox .settingsEmail, lightning-input, lightning-combobox, lightning-textarea, select, .search-bar, .selector-input, .shareUrlInput, .slds-input, .customWidthHeight input { font-size: 16px; } } /* ifs_notification */ @media only screen and (max-width: 480px) { .ifs_notification { display: block; } } /* iframe border */ iframe { border: none; } /* product data */ .gem-product-data-list>.slds-item { border-top: none; margin-left: 0; position: relative; padding: var(--lwc-spacingXxSmall, 0.25rem) 0 var(--lwc-spacingXxSmall, 0.25rem) 1.75rem; } .forceCommunityRichText .gem-product-data-list>.slds-item::before { content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj48cGF0aCBmaWxsPSIjMjE2MDkzIiBkPSJNMTUuOTc4MjEwMSwxLjYwMTYyNjE5IEw1Ljk3ODIxMDEsMTEuNjAxNjI2MiBDNS44MDIzMDIwOSwxMS43NzgxNDYxIDUuNTYzMzUyMTEsMTEuODc3MzY1NSA1LjMxNDE0NzYsMTEuODc3MzY1NSBDNS4wNjQ5NDMwOSwxMS44NzczNjU1IDQuODI1OTkzMSwxMS43NzgxNDYxIDQuNjUwMDg1MSwxMS42MDE2MjYyIEwwLjI3NTA4NTA5OCw3LjIyNjYyNjE5IEMwLjAzNzgzODQwODYsNi45ODkzNzk1MSAtMC4wNTQ4MTY5NzM3LDYuNjQzNTg0OTQgMC4wMzIwMjEzMzc0LDYuMzE5NDk5OTQgQzAuMTE4ODU5NjQ4LDUuOTk1NDE0OTQgMC4zNzE5OTg4NDcsNS43NDIyNzU3NCAwLjY5NjA4Mzg0NSw1LjY1NTQzNzQzIEMxLjAyMDE2ODg0LDUuNTY4NTk5MTIgMS4zNjU5NjM0Miw1LjY2MTI1NDUgMS42MDMyMTAxLDUuODk4NTAxMTkgTDUuMzE0OTI4ODUsOS42MTAyMTk5NCBMMTQuNjUxNjQ3NiwwLjI3NTA2MzY5NCBDMTUuMDE4Mzk5MiwtMC4wOTE2ODc4OTc5IDE1LjYxMzAyMSwtMC4wOTE2ODc4OTc5IDE1Ljk3OTc3MjYsMC4yNzUwNjM2OTQgQzE2LjM0NjUyNDIsMC42NDE4MTUyODUgMTYuMzQ2NTI0MiwxLjIzNjQzNzEgMTUuOTc5NzcyNiwxLjYwMzE4ODY5IEwxNS45NzgyMTAxLDEuNjAxNjI2MTkgWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMiA0KSIvPjwvc3ZnPg=="); position: absolute; top: .29rem; left: 0; margin-left: 0; } #product-data-table { margin-left: -1rem; margin-right: -1rem; border-radius: 1.5rem; background: rgb(245, 245, 245); padding-top: var(--lwc-spacingsmall, 1rem); } #product-data-table .product-data-background-container { display: none; } #product-data-table .product-data-table-card { margin-bottom: var(--lwc-spacingsmall, 1rem); } #product-data-table .product-data-table-card>.slds-card { border-radius: .75rem; } @media only screen and (min-width:768px) { #product-data-table { overflow: hidden; border-radius: 1.5rem; background: none; padding-top: 0; } #product-data-table .product-data-background-container { display: block; position: absolute; left: 0; bottom: 16px; width: 100%; height: 75%; border-radius: 1.5rem; background: rgb(245, 245, 245); box-shadow: inset 0 -8px 16px -12px rgba(0, 0, 0, .2); } #product-data-table .product-data-table-card { margin-bottom: 0; } #product-data-table .product-data-table-card>.slds-card { background: linear-gradient(180deg, rgba(255, 255, 255, 1) 90%, rgba(255, 255, 255, .2) 100%); border-radius: .75rem .75rem 0 0; height: 100%; border-bottom: none; box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px; } } .siteforceContentArea .comm-layout-column .ui-widget:not(:last-child), .siteforceContentArea .cb-section_column .ui-widget:not(:last-child) { margin-bottom: var(--lwc-uiWidgetMarginBottom, 1.5rem) } .siteforceContentArea .comm-layout-column:not(:empty) { padding-top: var(--lwc-layoutVerticalPadding, 0.75rem); padding-bottom: var(--lwc-layoutVerticalPadding, 0.75rem) }