@CHARSET "ISO-8859-1"; /****** ATTENTION *********************************************************************/ /* DO NOT USE TERMS USED IN FIGMA FOR OWN DEFINITIONS OR DEFINITIONS MISSING IN FIGMA */ /* THIS WILL ONLY CONFUSE THE UNSUSPECTING READER */ /* E.G. DO NOT USE primary, secondary, tertiary, strong, thin, thick IF NOT */ /* EXPLICITELY USED FOR THIS VERY PROPERTY IN FIGMA */ /**************************************************************************************/ :root { /********* Named dimensions ************/ --SPACE_1: 4px; --SPACE_2: 8px; --SPACE_3: 12px; --SPACE_4: 16px; --SPACE_5: 20px; --SPACE_6: 24px; --SPACE_8: 32px; --SPACE_10: 40px; /********* Standard dimensions ************/ --ICON_SIZE_M: 24px; --BUTTON_SIZE_S_ICON_PADDING_SIZE: 8px; --TRANSITION_FAST_TIMING: cubic-bezier(0.5, 0, 0.2, 1); --TRANSITION_FAST_DURATION: 300ms; --TRANSITION_FAST: var(--TRANSITION_FAST_DURATION) var(--TRANSITION_FAST_TIMING); --TRANSITION_FADE_TIMING: cubic-bezier(0,0,0,1); --TRANSITION_FADE_DURATION: 400ms; --TRANSITION_FADE: var(--TRANSITION_FADE_DURATION) var(--TRANSITION_FADE_TIMING); --TRANSITION_FADE_BORDER: box-shadow var(--TRANSITION_FADE); --TRANSITION_INPUT_LABEL: all var(--TRANSITION_FADE); --WINDOW_MIN_WIDTH: 320px; /* For WCAG 2.1 1.4.10 (Reflow) */ --WINDOW_TO_HEADER_GAP_DESKTOP: 40px; --WINDOW_TO_HEADER_TABLET: 40px; --WINDOW_TO_HEADER_MOBILE: 24px; --HEADER_TO_FORM_GAP_DESKTOP: 40px; --HEADER_TO_FORM_GAP_TABLET: 40px; --HEADER_TO_FORM_GAP_MOBILE: 24px; --HEADER_HORIZONTAL_PADDING_DESKTOP: 80px; --HEADER_HORIZONTAL_PADDING_TABLET: 48px; --HEADER_HORIZONTAL_PADDING_MOBILE: 16px; --HEADER_MAX_WIDTH_DESKTOP: 800px; --HEADER_MAX_WIDTH_TABLET: 9999px; --HEADER_MAX_WIDTH_MOBILE: 9999px; --HEADER_ROWS_GAP: 8px; --HEADER_PRICE_MENU_GAP: 8px; --HEADER_MENU_BUTTON_SIZE: 32px; --FORM_CONTAINER_TOPBOTTOM_DESKTOP: 64px; --FORM_CONTAINER_TOPBOTTOM_TABLET: 64px; --FORM_CONTAINER_TOPBOTTOM_MOBILE: 24px; --FORM_CONTAINER_MARGIN_DESKTOP: 80px; --FORM_CONTAINER_MARGIN_TABLET: 0px; --FORM_CONTAINER_MARGIN_MOBILE: 0px; --FORM_CONTAINER_PADDING_DESKTOP: 80px; --FORM_CONTAINER_PADDING_TABLET: 48px; --FORM_CONTAINER_PADDING_MOBILE: 16px; --FORM_CONTAINER_MAX_WIDTH_DESKTOP: 1280px; --FORM_CONTAINER_MAX_WIDTH_TABLET: 99999px; --FORM_CONTAINER_MAX_WIDTH_MOBILE: 99999px; --FORM_TO_FOOTER_GAP_DESKTOP: 40px; --FORM_TO_FOOTER_GAP_TABLET: 40px; --FORM_TO_FOOTER_GAP_MOBILE: 24px; --FOOTER_HORIZONTAL_PADDING_DESKTOP: 80px; --FOOTER_HORIZONTAL_PADDING_TABLET: 48px; --FOOTER_HORIZONTAL_PADDING_MOBILE: 16px; --FOOTER_MAX_WIDTH_DESKTOP: 800px; --FOOTER_MAX_WIDTH_TABLET: 9999px; --FOOTER_MAX_WIDTH_MOBILE: 9999px; --FOOTER_COLUMNS_GAP: 8px; --SECTION_GAP_DESKTOP: 80px; --SECTION_GAP_TABLET: 48px; --SECTION_GAP_MOBILE: 48px; --FORM_SECTION_HEADER_GAP_DESKTOP: 80px; --FORM_SECTION_HEADER_GAP_TABLET: 48px; --FORM_SECTION_HEADER_GAP_MOBILE: 48px; --FORM_FIELD_ROW_GAP_DESKTOP: 24px; --FORM_FIELD_ROW_GAP_TABLET: 24px; --FORM_FIELD_ROW_GAP_MOBILE: 16px; --GRID_COLUMN_COUNT_DESKTOP: 2; --GRID_COLUMN_COUNT_TABLET: 2; --GRID_COLUMN_COUNT_MOBILE: 1; --ITEM_GAP_DESKTOP: 16px; --ITEM_GAP_TABLET: 16px; --ITEM_GAP_MOBILE: 0px; --ICON_TO_LABEL_GAP: 12px; --BUTTON_LABEL_SIZE: var(--SPACE_6); /********* Named fonts ************/ --FONT_SIZE_5XL: 3.5rem; --FONT_SIZE_3XL: 2.25rem; --FONT_SIZE_2XL: 2rem; --FONT_SIZE_XL: 1.75rem; --FONT_SIZE_BASE: 1rem; --FONT_SIZE_TEXT_LG: 1.375rem; --FONT_SIZE_TEXT_XS: 0.75rem; --FONT_HEADLINE_L_MAX: normal normal 500 var(--FONT_SIZE_5XL)/100% GT_Walsheim_ARAG_CondensedRegular; --FONT_HEADLINE_L_MAX_LETTER_SPACING: -0.01em; --FONT_HEADLINE_L_MIN: normal normal 500 var(--FONT_SIZE_3XL)/100% GT_Walsheim_ARAG_CondensedRegular; --FONT_HEADLINE_L_MIN_LETTER_SPACING: -0.01em; --FONT_HEADLINE_M_MAX: normal normal 500 var(--FONT_SIZE_2XL)/100% GT_Walsheim_ARAG_CondensedRegular; --FONT_HEADLINE_M_MAX_LETTER_SPACING: normal; --FONT_HEADLINE_M_MIN: normal normal 500 var(--FONT_SIZE_XL)/115% GT_Walsheim_ARAG_CondensedRegular; --FONT_HEADLINE_M_MIN_LETTER_SPACING: normal; --FONT_COPY_DEFAULT: normal normal 400 var(--FONT_SIZE_BASE)/150% GT_Walsheim_ARAG_Regular; --FONT_COPY_DEFAULT_LETTER_SPACING: 0.02em; --FONT_COPY_STRONG: normal normal 500 var(--FONT_SIZE_BASE)/150% GT_Walsheim_ARAG_Medium; --FONT_COPY_STRONG_LETTER_SPACING: 0.02em; --FONT_COPY_L: normal normal 300 var(--FONT_SIZE_XL)/210% GT_Walsheim_ARAG_Regular; --FONT_COPY_L_LETTER_SPACING: normal; --FONT_COPY_M: normal normal 300 var(--FONT_SIZE_TEXT_LG)/199.375% GT_Walsheim_ARAG_Regular; --FONT_COPY_M_LETTER_SPACING: 0.0275rem; --FONT_COPY_XS: normal normal 400 var(--FONT_SIZE_TEXT_XS)/150% GT_Walsheim_ARAG_Regular; --FONT_COPY_XS_LETTER_SPACING: 0.02em; --FONT_LINK_DEFAULT: normal normal 500 var(--FONT_SIZE_BASE)/100% GT_Walsheim_ARAG_Medium; --FONT_LINK_DEFAULT_LETTER_SPACING: 0.02em; --FONT_LINK_XS: normal normal 500 var(--FONT_SIZE_TEXT_XS)/130% GT_Walsheim_ARAG_Regular; --FONT_LINK_XS_LETTER_SPACING: 0.02em; --FONT_DECORATIVE_DEFAULT: normal normal 400 var(--FONT_SIZE_BASE)/100% GT-Alpina-ARAG-Condensed-Regular-Italic; --FONT_DECORATIVE_DEFAULT_LETTER_SPACING:0.02em; /********* Common fonts ************/ --FONT_FIELD_OUTERLABEL: var(--FONT_LINK_XS); --FONT_FIELD_OUTERLABEL_LETTERSPACING: var(--FONT_LINK_XS_LETTER_SPACING); --FONT_FIELD_LABEL: var(--FONT_LINK_XS); --FONT_FIELD_LABEL_LETTERSPACING: var(--FONT_LINK_XS_LETTER_SPACING); --FONT_FIELD_INPUT: var(--FONT_COPY_DEFAULT); /*SOLL COPY_S SEIN */ --FONT_FIELD_INPUT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); /********* Control fonts ************/ --FONT_HEADER_FEE_MENU_LEFT: var(--FONT_COPY_XS); --FONT_HEADER_FEE_MENU_LEFT_LETTER_SPACING: var(--FONT_COPY_XS_LETTER_SPACING); --FONT_FOOTER: var(--FONT_LINK_DEFAULT); --FONT_FOOTER_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_ERROR_MESSAGE: var(--FONT_COPY_XS); --FONT_ERROR_MESSAGE_LETTER_SPACING: var(--FONT_COPY_XS_LETTER_SPACING); --FONT_PROGRESSINDICATOR_NUMBER: var(--FONT_LINK_XS); --FONT_PROGRESSINDICATOR_NUMBER_SPACING: var(--FONT_LINK_XS_LETTER_SPACING); --FONT_SECTION_HEADER_SUBLABEL: var(--FONT_COPY_M); --FONT_SECTION_HEADER_SUBLABEL_LETTERSPACING: var(--FONT_COPY_M_LETTER_SPACING); --FONT_FORWARD_LABEL: var(--FONT_LINK_DEFAULT); --FONT_FORWARD_LABEL_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_BACKWARD_LABEL: var(--FONT_LINK_DEFAULT); --FONT_BACKWARD_LABEL_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_BUTTON_PRIMARY: var(--FONT_LINK_DEFAULT); --FONT_BUTTON_PRIMARY_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_BUTTON_SECONDARY: var(--FONT_LINK_DEFAULT); --FONT_BUTTON_SECONDARY_LETTERSPACING:var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_MENU_ITEM: var(--FONT_COPY_DEFAULT); --FONT_MENU_ITEM_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_CHECKBOX3_LABEL: var(--FONT_COPY_DEFAULT); --FONT_CHECKBOX3_LABEL_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_CHECKBOX_IMAGE_LABEL: var(--FONT_COPY_DEFAULT); --FONT_CHECKBOX_IMAGE_LABEL_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_SELECTCARDSINGLE1_LABEL: var(--FONT_COPY_DEFAULT); --FONT_SELECTCARDSINGLE1_LABEL_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_SELECTCARDSINGLE1_TEXT: var(--FONT_COPY_XS); --FONT_SELECTCARDSINGLE1_TEXT_LETTERSPACING: var(--FONT_COPY_XS_LETTER_SPACING); --FONT_SELECTCARDMULTI1_LABEL: var(--FONT_COPY_DEFAULT); --FONT_SELECTCARDMULTI1_LABEL_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_SELECTCARDMULTI1_TEXT: var(--FONT_COPY_XS); --FONT_SELECTCARDMULTI1_TEXT_LETTERSPACING: var(--FONT_COPY_XS_LETTER_SPACING); --FONT_TABGROUPCUSTOM1_ITEM: var(--FONT_LINK_DEFAULT); --FONT_TABGROUPCUSTOM1_ITEM_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTERSPACING); --FONT_RADIO2_LABEL: var(--FONT_COPY_DEFAULT); --FONT_RADIO2_LABEL_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_RADIO2_ITEM: var(--FONT_COPY_DEFAULT); --FONT_RADIO2_ITEM_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_SELECT2_LABEL: var(--FONT_FIELD_LABEL); --FONT_SELECT2_LABEL_LETTERSPACING: var(--FONT_FIELD_LABEL_LETTERSPACING); --FONT_SELECT2_OUTERLABEL: var(--FONT_FIELD_OUTERLABEL); --FONT_SELECT2_OUTERLABEL_LETTERSPACING: var(--FONT_FIELD_OUTERLABEL_LETTERSPACING); --FONT_SELECT2_INPUT: var(--FONT_COPY_DEFAULT); --FONT_SELECT2_INPUT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_DATETIME_OUTERLABEL: var(--FONT_COPY_DEFAULT); --FONT_DATETIME_OUTERLABEL_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_DATETIME_LABEL: var(--FONT_FIELD_LABEL); --FONT_DATETIME_LABEL_LETTERSPACING: var(--FONT_FIELD_LABEL_LETTERSPACING); --FONT_DATETIME_INPUT: var(--FONT_COPY_DEFAULT); --FONT_DATETIME_INPUT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_STRING_OUTERLABEL: var(--FONT_FIELD_OUTERLABEL); --FONT_STRING_OUTERLABEL_LETTERSPACING:var(--FONT_FIELD_OUTERLABEL_LETTERSPACING); --FONT_STRING_LABEL: var(--FONT_FIELD_LABEL); --FONT_STRING_LABEL_LETTERSPACING: var(--FONT_FIELD_LABEL_LETTERSPACING); --FONT_STRING_INPUT: var(--FONT_COPY_DEFAULT); --FONT_STRING_INPUT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_NUMBER1_LABEL: var(--FONT_FIELD_LABEL); --FONT_NUMBER1_LABEL_LETTERSPACING: var(--FONT_FIELD_LABEL_LETTERSPACING); --FONT_NUMBER1_INPUT: var(--FONT_COPY_DEFAULT); --FONT_NUMBER1_INPUT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_TEXTAREA1_OUTERLABEL: var(--FONT_COPY_DEFAULT); --FONT_TEXTAREA1_OUTERLABEL_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_TEXTAREA1_FORCEDOUTERLABEL: var(--FONT_LINK_XS); --FONT_TEXTAREA1_FORCEDOUTERLABEL_LETTERSPACING:var(--FONT_LINK_XS_LETTER_SPACING); --FONT_TEXTAREA1_LABEL: var(--FONT_FIELD_LABEL); --FONT_TEXTAREA1_LABEL_LETTERSPACING:var(--FONT_FIELD_LABEL_LETTERSPACING); --FONT_TEXTAREA1_INPUT: var(--FONT_COPY_DEFAULT); --FONT_TEXTAREA1_INPUT_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_SOLFINSEARCH2_OUTERLABEL: var(--FONT_COPY_DEFAULT); --FONT_SOLFINSEARCH2_OUTERLABEL_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_SOLFINSEARCH2_LABEL: var(--FONT_FIELD_LABEL); --FONT_SOLFINSEARCH2_LABEL_LETTERSPACING: var(--FONT_FIELD_LABEL_LETTERSPACING); --FONT_SOLFINSEARCH2_INPUT: var(--FONT_COPY_DEFAULT); --FONT_SOLFINSEARCH2_INPUT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_CONTACTS_LABEL: var(--FONT_COPY_DEFAULT); --FONT_CONTACTS_LABEL_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_AMOUNT_ITEM: var(--FONT_COPY_DEFAULT); --FONT_AMOUNT_ITEM_LETTER_SPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_AMOUNT_SUM: var(--FONT_COPY_DEFAULT); --FONT_AMOUNT_SUM_LETTER_SPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_PRINT1_LABEL: var(--FONT_LINK_DEFAULT); --FONT_PRINT1_LABEL_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_LINK: var(--FONT_LINK_DEFAULT); --FONT_LINK_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_LINK_SUBTEXT: var(--FONT_COPY_DEFAULT); --FONT_LINK_SUBTEXT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_LINKTEXT: var(--FONT_COPY_DEFAULT); --FONT_LINKTEXT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_LINKCARD1_LABEL: var(--FONT_COPY_DEFAULT); --FONT_LINKCARD1_LABEL_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_LINKCARD1_TEXT: var(--FONT_COPY_XS); --FONT_LINKCARD1_TEXT_LETTERSPACING: var(--FONT_COPY_XS_LETTER_SPACING); --FONT_LINKCARD1_LINK: var(--FONT_LINK_XS); --FONT_LINKCARD1_LINK_LETTERSPACING: var(--FONT_LINK_XS_LETTER_SPACING); --FONT_CONTACTS: var(--FONT_LINK_DEFAULT); --FONT_CONTACTS_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_LABEL1: var(--FONT_COPY_STRONG); --FONT_LABEL1_LETTERSPACING: var(--FONT_COPY_STRONG_LETTER_SPACING); --FONT_INFO: var(--FONT_COPY_DEFAULT); --FONT_INFO_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_HINT1_TEXT: var(--FONT_COPY_DEFAULT); --FONT_HINT1_TEXT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_LIST1_S_TEXT: var(--FONT_COPY_DEFAULT); --FONT_LIST1_S_TEXT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_LIST1_M_TEXT: var(--FONT_COPY_M); --FONT_LIST1_M_TEXT_LETTERSPACING: var(--FONT_COPY_M_LETTER_SPACING); --FONT_LIST1_L_TEXT: var(--FONT_COPY_L); --FONT_LIST1_L_TEXT_LETTERSPACING: var(--FONT_COPY_L_LETTER_SPACING); --FONT_PRICINGITEM1: var(--FONT_COPY_DEFAULT); --FONT_PRICINGITEM1_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_PRICINGITEM1_RESULT: var(--FONT_COPY_STRONG); --FONT_PRICINGITEM1_RESULT_LETTERSPACING: var(--FONT_COPY_STRONG_LETTER_SPACING); --FONT_PRICINGITEM1_BADGE: var(--FONT_DECORATIVE_DEFAULT); --FONT_PRICINGITEM1_BADGE_LETTERSPACING: var(--FONT_DECORATIVE_DEFAULT_LETTER_SPACING); --FONT_PRICINGITEMCHECKBOX1_LABEL: var(--FONT_COPY_DEFAULT); --FONT_PRICINGITEMCHECKBOX1_LABEL_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_PRICINGITEMCHECKBOX1_PRICE: var(--FONT_COPY_DEFAULT); --FONT_PRICINGITEMCHECKBOX1_PRICE_LETTERSPACING:var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_TABLE1_SUBTITLE: var(--FONT_COPY_STRONG); --FONT_TABLE1_SUBTITLE_LETTERSPACING:var(--FONT_COPY_STRONG_LETTER_SPACING); --FONT_TABLE1_CONTENT: var(--FONT_COPY_DEFAULT); --FONT_TABLE1_CONTENT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_CAPTCHA1_LABEL: var(--FONT_LINK_DEFAULT); --FONT_CAPTCHA1_LABEL_LETTERSPACING: var(--FONT_LINK_DEFAULT_LETTER_SPACING); --FONT_RADIO5_ZAHLWEISE: var(--FONT_DECORATIVE_DEFAULT); --FONT_RADIO5_ZAHLWEISE_LETTERSPACING:var(--FONT_DECORATIVE_DEFAULT_LETTER_SPACING); --FONT_UPLOAD1_LABEL: var(--FONT_COPY_DEFAULT); --FONT_UPLOAD1_LABEL_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_UPLOAD1_LINKTEXT: var(--FONT_COPY_DEFAULT); --FONT_UPLOAD1_LINKTEXT_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); --FONT_UPLOAD1_FILELIST_ITEM: var(--FONT_COPY_DEFAULT); --FONT_UPLOAD1_FILELIST_ITEM_LETTERSPACING: var(--FONT_COPY_DEFAULT_LETTER_SPACING); /********* Colors ************/ --COLOR_NEUTRALS_BLACK: #000; --COLOR_NEUTRALS_WHITE: #FFFFFF; --COLOR_BRAND_YELLOW: #FFF100; --COLOR_BRAND_BLUSH: #F8F0DD; --COLOR_BRAND_BLUSH_LIGHT: #FCF9F4; --COLOR_BRAND_SANDDARK: #F1E5C7; --COLOR_ADDITIONAL_RED_100: #B4053C; --COLOR_ADDITIONAL_BLUE_100: #2832C8; --COLOR_ADDITIONAL_GREEN_100: #00785A; --COLOR_ADDITIONAL_PURPLE_100: #6E0F69; --COLOR_NEUTRALS_BLACK_4PERCENT: #0000000A; --COLOR_NEUTRALS_BLACK_16PERCENT:#00000029; --COLOR_NEUTRALS_BLACK_56PERCENT:#0000008F; --COLOR_CANVAS_PRIMARY: var(--COLOR_NEUTRALS_WHITE); --COLOR_CANVAS_SECONDARY: var(--COLOR_BRAND_BLUSH); --COLOR_CANVAS_TERTIARY: var(--COLOR_BRAND_BLUSH_LIGHT); --COLOR_SURFACE_PRIMARY: var(--COLOR_BRAND_YELLOW); --COLOR_SURFACE_SECONDARY:var(--COLOR_BRAND_BLUSH); /*Make wizard button background this and primary instead of background-color in images*/ --COLOR_SURFACE_TERTIARY: var(--COLOR_NEUTRALS_BLACK_4PERCENT); --COLOR_SURFACE_ACCENT: var(--COLOR_BRAND_SANDDARK); --COLOR_SURFACE_INFO: var(--COLOR_ADDITIONAL_BLUE_100); --COLOR_SURFACE_WARNING: var(--COLOR_ADDITIONAL_RED_100); --COLOR_SURFACE_SUCCESS: var(--COLOR_ADDITIONAL_GREEN_100); --COLOR_SURFACE_SALE: var(--COLOR_ADDITIONAL_PURPLE_100); --COLOR_FG_TERTIARY: var(--COLOR_NEUTRALS_BLACK_16PERCENT); --COLOR_BORDER_PRIMARY: #8f862b; --COLOR_BORDER_SECONDARY: #999485; --COLOR_BORDER_TERTIARY: var(--COLOR_NEUTRALS_BLACK_16PERCENT); --COLOR_BORDER_STRONG: var(--COLOR_NEUTRALS_BLACK); --COLOR_BORDER_DISABLED: var(--COLOR_BORDER_TERTIARY); --COLOR_BORDER_INFO: var(--COLOR_ADDITIONAL_BLUE_100); --COLOR_BORDER_WARNING: var(--COLOR_ADDITIONAL_RED_100); --COLOR_BORDER_SALE: var(--COLOR_ADDITIONAL_PURPLE_100); --COLOR_TEXT_PRIMARY: var(--COLOR_NEUTRALS_BLACK); --COLOR_TEXT_SECONDARY: var(--COLOR_NEUTRALS_BLACK_56PERCENT); --COLOR_TEXT_TERTIARY: var(--COLOR_NEUTRALS_BLACK_16PERCENT); --COLOR_TEXT_LINK: var(--COLOR_NEUTRALS_BLACK); --COLOR_TEXT_INFO: var(--COLOR_ADDITIONAL_BLUE_100); --COLOR_TEXT_WARNING: var(--COLOR_ADDITIONAL_RED_100); --COLOR_TEXT_SALE: var(--COLOR_ADDITIONAL_PURPLE_100); /********* Control colors ************/ --COLOR_FORM_CONTAINER: var(--COLOR_CANVAS_TERTIARY); --COLOR_FORWARD_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_FORWARD_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_BACKWARD_BACKGROUND:transparent; --COLOR_BACKWARD_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_BUTTON_PRIMARY_BACKGROUND:var(--COLOR_SURFACE_PRIMARY); --COLOR_BUTTON_PRIMARY_LABEL:var(--COLOR_TEXT_PRIMARY); --COLOR_BUTTON_SECONDARY_BACKGROUND: transparent; --COLOR_BUTTON_SECONDARY_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_MENU_POPUP: var(--COLOR_CANVAS_PRIMARY); --COLOR_MENU_POPUP_ITEM: var(--COLOR_TEXT_LINK); --COLOR_MENU_ITEM_BACKGROUND_HOVER: lightGrey; /*not specified and not viewable in css*/ --COLOR_INFO: var(--COLOR_TEXT_PRIMARY); --COLOR_TABGROUPCUSTOM1_ITEM: var(--COLOR_TEXT_PRIMARY); --COLOR_RADIO2_ITEM: var(--COLOR_TEXT_PRIMARY); --COLOR_RADIO2_ITEM_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_RADIO2_CHECKED_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_RADIO2_UNCHECKED_BACKGROUND: transparent; --COLOR_RADIO2_CHECKED_DISABLED_BACKGROUND: var(--COLOR_SURFACE_TERTIARY); --COLOR_SELECT2_LABEL_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_SELECT2_ITEM_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_CHECKBOX3_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_CHECKBOX3_LABEL_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_CHECKBOX3_BACKGROUND: var(--COLOR_CANVAS_TERTIARY); --COLOR_CHECKBOX3_CHECKED_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_CHECKBOX3_DISABLED_BACKGROUND: var(--COLOR_CANVAS_TERTIARY); --COLOR_CHECKBOX_IMAGE_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_CHECKBOX_IMAGE_BACKGROUND: var(--COLOR_CANVAS_TERTIARY); --COLOR_CHECKBOX_IMAGE_CHECKED_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_SELECTCARDSINGLE1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_SELECTCARDSINGLE1_LABEL_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_SELECTCARDSINGLE1_CHECKED_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_SELECTCARDSINGLE1_CHECKBOX_BACKGROUND: var(--COLOR_CANVAS_PRIMARY); --COLOR_SELECTCARDSINGLE1_DISABLED_BACKGROUND: var(--COLOR_SURFACE_TERTIARY); --COLOR_SELECTCARDMULTI1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_SELECTCARDMULTI1_LABEL_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_SELECTCARDMULTI1_CHECKED_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_SELECTCARDMULTI1_CHECKBOX_BACKGROUND: var(--COLOR_CANVAS_PRIMARY); --COLOR_SELECTCARDMULTI1_DISABLED_BACKGROUND: var(--COLOR_SURFACE_TERTIARY); --COLOR_STRING_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_STRING_INPUT: var(--COLOR_TEXT_PRIMARY); --COLOR_STRING_LABEL_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_STRING_INPUT_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_NUMBER1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_NUMBER1_INPUT: var(--COLOR_TEXT_PRIMARY); --COLOR_NUMBER1_LABEL_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_NUMBER1_INPUT_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_TEXTAREA1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_TEXTAREA1_INPUT: var(--COLOR_TEXT_PRIMARY); --COLOR_SOLFINSEARCH2_LABEL:var(--COLOR_TEXT_PRIMARY); --COLOR_SOLFINSEARCH2_INPUT:var(--COLOR_TEXT_PRIMARY); --COLOR_SOLFINSEARCH2_LABEL_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_SOLFINSEARCH2_INPUT_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_DATETIME1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_DATETIME1_INPUT: var(--COLOR_TEXT_PRIMARY); --COLOR_DATETIME1_LABEL_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_DATETIME1_INPUT_DISABLED: var(--COLOR_TEXT_SECONDARY); --COLOR_CONTACTS_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_LABEL1: var(--COLOR_TEXT_PRIMARY); --COLOR_HINT1_INFO_LABEL: var(--COLOR_TEXT_INFO); --COLOR_HINT1_WARNING_LABEL:var(--COLOR_TEXT_WARNING); --COLOR_HINT1_SALE_LABEL: var(--COLOR_TEXT_SALE); --COLOR_HINT1_BACKGROUND: var(--COLOR_CANVAS_SECONDARY); --COLOR_HINT1_ICON_BACKGROUND: var(--COLOR_SURFACE_INFO); --COLOR_HINT1_WARNING_ICON_BACKGROUND: var(--COLOR_SURFACE_WARNING); --COLOR_HINT1_SALE_ICON_BACKGROUND: var(--COLOR_SURFACE_SALE); --COLOR_TABGROUPCUSTOM1_CHECKED_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_TABGROUPCUSTOM1_SECONDARY_CHECKED_BACKGROUND: var(--COLOR_CANVAS_SECONDARY); --COLOR_TABGROUPCUSTOM1_SCROLLBUTTON_BACKGROUND: var(--COLOR_CANVAS_PRIMARY); --COLOR_PRICINGITEM_BADGE_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_PRICINGITEMCHECKBOX1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_PRICINGITEMCHECKBOX1_BACKGROUND: var(--COLOR_CANVAS_TERTIARY); --COLOR_PRICINGITEMCHECKBOX1_CHECKED_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_PRINT1_BACKGROUND: transparent; /*discuss if there should be a COLOR_SURFACE_QUARTENARY being transparent so non-emphasized button backgrounds etc can be changed all at once, just like emphasized (primary) backgrounds*/ --COLOR_PRINT1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_LINK: var(--COLOR_TEXT_PRIMARY); --COLOR_LINKTEXT: var(--COLOR_TEXT_PRIMARY); --COLOR_LINKCARD1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_LINKCARD1_BACKGROUND: var(--COLOR_SURFACE_PRIMARY); --COLOR_LINKCARD1_PRODUCTDISABLED_BACKGROUND: var(--COLOR_SURFACE_ACCENT); --COLOR_CONTACTS: var(--COLOR_TEXT_PRIMARY); --COLOR_FOOTER: var(--COLOR_TEXT_PRIMARY); --COLOR_TABLE1_BACKGROUND: transparent; --COLOR_TABLE1_SUBTITLE: var(--COLOR_TEXT_PRIMARY); --COLOR_TABLE1_CONTENT: var(--COLOR_TEXT_PRIMARY); --COLOR_UPLOAD1_BACKGROUND: transparent; --COLOR_UPLOAD1_BACKGROUND_DRAG: var(--COLOR_SURFACE_TERTIARY); --COLOR_UPLOAD1_SUBTITLE: var(--COLOR_TEXT_PRIMARY); --COLOR_UPLOAD1_CONTENT: var(--COLOR_TEXT_PRIMARY); --COLOR_UPLOAD1_LINKTEXT: var(--COLOR_TEXT_PRIMARY); --COLOR_UPLOAD1_LINKTEXT_DRAG: var(--COLOR_TEXT_TERTIARY); --COLOR_CAPTCHA1_LABEL: var(--COLOR_TEXT_PRIMARY); --COLOR_POPUP_BACKGROUND: var(--COLOR_CANVAS_TERTIARY); /********* Borders ************/ --BORDER_RADIUS_ROUNDEDFULL: 9999px; --BORDER_WIDTH_PRIMARY: 1px; /* No term for this in Figma definition, consider changing to THIN and THICK, see --BORDER_WIDTH_THICK */ --BORDER_WIDTH_SECONDARY: 1px; /* No term for this in Figma definition, consider changing to THIN and THICK, see --BORDER_WIDTH_THICK */ --BORDER_WIDTH_TERTIARY: 1px; /* No term for this in Figma definition, consider changing to THIN and THICK, see --BORDER_WIDTH_THICK */ --BORDER_WIDTH_THICK: 2px; /* Term "BorderThick" taken from Figma input anatomy, since there is no semantic border definition elsewhere */ --BORDER_WIDTH_THIN: 1px; /* Term "BorderThin" taken from Figma input anatomy, since there is no semantic border definition elsewhere */ --BORDER_TERTIARY: 0 var(--BORDER_WIDTH_TERTIARY) 0 0 var(--COLOR_BORDER_TERTIARY); --BORDER_INFO: 2px solid var(--COLOR_BORDER_INFO); --BORDER_WARNING: 2px solid var(--COLOR_BORDER_WARNING); --BORDER_SALE: 2px solid var(--COLOR_BORDER_SALE); --BOXSHADOW_BOTTOM: 0px var(--BORDER_WIDTH_PRIMARY) 0px 0px var(--COLOR_BORDER_PRIMARY); --BOXSHADOW_BOTTOM_HOVER: 0px var(--BORDER_WIDTH_THICK) 0px 0px var(--COLOR_BORDER_STRONG); --BOXSHADOW_BOTTOM_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --BOXSHADOW_BOTTOM_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --BOXSHADOW_BOTTOM_FOCUSOUTLINE_WIDTH: 1px; --BOXSHADOW_BOTTOM_FOCUSOUTLINE_SPACETOBORDER: 3px; --BOXSHADOW_BOTTOM_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --BOXSHADOW_BOTTOM_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --BOXSHADOW_BOTTOM_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--BOXSHADOW_BOTTOM_FOCUSOUTLINE_SPACETOBORDER) + var(--BOXSHADOW_BOTTOM_FOCUSOUTLINE_WIDTH)); --BOXSHADOW_BOTTOM_FOCUS: 0px 0px 0px var(--BOXSHADOW_BOTTOM_FOCUSOUTLINE_SPACETOBORDER) var(--BOXSHADOW_BOTTOM_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--BOXSHADOW_BOTTOM_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--BOXSHADOW_BOTTOM_FOCUSOUTLINE_COLOR),0px var(--BOXSHADOW_BOTTOM_FOCUS_WITDH) 0px 0px var(--BOXSHADOW_BOTTOM_FOCUS_COLOR); /********* Fields ************/ --FIELD_MIN_HEIGHT: 64px; --FIELD_CONTENT_HORIZONTAL_PAD: 32px; --FIELD_CONTENT_VERTICAL_PAD: 20px; --FIELD_ERROR_MESSAGE_GAP: 8px; --FIELD_ERROR_MESSAGE_ICON_WIDTH: 16px; --FIELD_ERROR_MESSAGE_ICON_TEXT_GAP:10px; --FIELD_HELP_SIZE: var(--ICON_SIZE_M); --FIELD_TO_HELP_GAP: var(--ICON_TO_LABEL_GAP); --FIELD_OUTERLABEL_TO_CONTROL_GAP: var(--SPACE_2); --FIELD_PADDING_OUTERLABEL: 0 var(--SPACE_2) var(--SPACE_2) var(--SPACE_2); /********* Field Borders ************/ --FIELD_BORDER_WIDTH: var(--BORDER_WIDTH_PRIMARY); --FIELD_BORDER: 0px solid transparent; --FIELD_BORDER_RADIUS: var(--BORDER_RADIUS_ROUNDEDFULL); --FIELD_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_SECONDARY) inset var(--COLOR_BORDER_SECONDARY); --FIELD_BOXSHADOW_DISABLED: 0px 0px 0px var(--BORDER_WIDTH_TERTIARY) inset var(--COLOR_BORDER_DISABLED); --FIELD_BOXSHADOW_ERROR: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_WARNING); --FIELD_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --FIELD_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --FIELD_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --FIELD_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --FIELD_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --FIELD_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --FIELD_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --FIELD_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--FIELD_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--FIELD_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --FIELD_BOXSHADOW_FOCUS: 0px 0px 0px var(--FIELD_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--FIELD_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--FIELD_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--FIELD_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--FIELD_BOXSHADOW_FOCUS_WITDH) inset var(--FIELD_BOXSHADOW_FOCUS_COLOR); --INPUT_BORDER: none; /********* Radio2 Borders ************/ --RADIO2_BOXSHADOW: var(--FIELD_BOXSHADOW); --RADIO2_BOXSHADOW_DISABLED: none; --RADIO2_BOXSHADOW_ERROR: var(--FIELD_BOXSHADOW_ERROR); --RADIO2_BOXSHADOW_HOVER: var(--FIELD_BOXSHADOW_HOVER); --RADIO2_BOXSHADOW_FOCUS: var(--FIELD_BOXSHADOW_FOCUS); /********* TabGroupCustom1 Borders ************/ --TABGROUPCUSTOM1_BORDER: 0px solid transparent; --TABGROUPCUSTOM1_BORDER_RADIUS: var(--BORDER_RADIUS_ROUNDEDFULL); --TABGROUPCUSTOM1_BOXSHADOW: var(--FIELD_BOXSHADOW); --TABGROUPCUSTOM1_BOXSHADOW_HOVER: var(--FIELD_BOXSHADOW_HOVER); --TABGROUPCUSTOM1_BOXSHADOW_FOCUS: var(--FIELD_BOXSHADOW_FOCUS); /********* Checkbox3 Borders ************/ --CHECKBOX3_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_SECONDARY); --CHECKBOX3_BOXSHADOW_DISABLED: 0px 0px 0px var(--BORDER_WIDTH_TERTIARY) inset var(--COLOR_BORDER_TERTIARY); --CHECKBOX3_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --CHECKBOX3_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --CHECKBOX3_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --CHECKBOX3_BOXSHADOW_FOCUS: 0px 0px 0px var(--CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--CHECKBOX3_BOXSHADOW_FOCUS_WITDH) inset var(--CHECKBOX3_BOXSHADOW_FOCUS_COLOR); /********* CheckboxImage ************/ --CHECKBOX_IMAGE_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_PRIMARY); --CHECKBOX_IMAGE_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --CHECKBOX_IMAGE_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --CHECKBOX_IMAGE_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --CHECKBOX_IMAGE_BOXSHADOW_FOCUS: 0px 0px 0px var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUS_WITDH) inset var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUS_COLOR); /********* Checkbox3 Borders ************/ --CHECKBOX_IMAGE_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_PRIMARY); --CHECKBOX_IMAGE_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --CHECKBOX_IMAGE_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --CHECKBOX_IMAGE_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --CHECKBOX_IMAGE_BOXSHADOW_FOCUS: 0px 0px 0px var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--CHECKBOX_IMAGE_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--CHECKBOX3_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--CHECKBOX3_BOXSHADOW_FOCUS_WITDH) inset var(--CHECKBOX3_BOXSHADOW_FOCUS_COLOR); /********* PricingItem1 Borders ************/ --PRICINGITEM1_BADGE_BORDER: 0px solid transparent; --PRICINGITEM1_BADGE_BORDER_RADIUS: var(--BORDER_RADIUS_ROUNDEDFULL); /********* PricingItemCheckbox1 Borders ************/ --PRICINGITEMCHECKBOX1_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_SECONDARY); --PRICINGITEMCHECKBOX1_BOXSHADOW_DISABLED: 0px 0px 0px var(--BORDER_WIDTH_TERTIARY) inset var(--COLOR_BORDER_TERTIARY); --PRICINGITEMCHECKBOX1_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUS: 0px 0px 0px var(--PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUS_WITDH) inset var(--PRICINGITEMCHECKBOX1_BOXSHADOW_FOCUS_COLOR); /********* SelectCardSingl1 Borders ************/ --SELECTCARDSINGLE1_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_PRIMARY); --SELECTCARDSINGLE1_BOXSHADOW_DISABLED: 0px 0px 0px var(--BORDER_WIDTH_TERTIARY) inset var(--COLOR_BORDER_TERTIARY); --SELECTCARDSINGLE1_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --SELECTCARDSINGLE1_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --SELECTCARDSINGLE1_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --SELECTCARDSINGLE1_BOXSHADOW_FOCUS: 0px 0px 0px var(--SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--SELECTCARDSINGLE1_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--SELECTCARDSINGLE1_BOXSHADOW_FOCUS_WITDH) inset var(--SELECTCARDSINGLE1_BOXSHADOW_FOCUS_COLOR); --SELECTCARDSINGLE1_BOXSHADOW_ERROR: 1px solid var(--COLOR_ADDITIONAL_RED_100); --SELECTCARDSINGLE1_BORDER_BGKNOD_HOVER: 2px solid var(--COLOR_NEUTRALS_BLACK); --SELECTCARDSINGLE1_KNOB_WIDTH_HOVER: 4px; --SELECTCARDSINGLE1_KNOB_HEIGHT_HOVER: 4px; /********* SelectCardMulti1 Borders ************/ --SELECTCARDMULTI1_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_PRIMARY); --SELECTCARDMULTI1_BOXSHADOW_DISABLED: 0px 0px 0px var(--BORDER_WIDTH_TERTIARY) inset var(--COLOR_BORDER_TERTIARY); --SELECTCARDMULTI1_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --SELECTCARDMULTI1_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --SELECTCARDMULTI1_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --SELECTCARDMULTI1_BOXSHADOW_FOCUS: 0px 0px 0px var(--SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--SELECTCARDMULTI1_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--SELECTCARDMULTI1_BOXSHADOW_FOCUS_WITDH) inset var(--SELECTCARDMULTI1_BOXSHADOW_FOCUS_COLOR); /********* Print1 Borders ************/ --PRINT1_BORDER: 0px solid transparent; --PRINT1_BORDER_RADIUS: var(--BORDER_RADIUS_ROUNDEDFULL); --PRINT1_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_SECONDARY); --PRINT1_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --PRINT1_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --PRINT1_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --PRINT1_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --PRINT1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --PRINT1_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --PRINT1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --PRINT1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--PRINT1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--PRINT1_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --PRINT1_BOXSHADOW_FOCUS: 0px 0px 0px var(--PRINT1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--PRINT1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--PRINT1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--PRINT1_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--PRINT1_BOXSHADOW_FOCUS_WITDH) inset var(--PRINT1_BOXSHADOW_FOCUS_COLOR); /********* Link Borders ************/ --LINK_BOXSHADOW: 0px var(--BORDER_WIDTH_PRIMARY) 0px 0px var(--COLOR_BORDER_SECONDARY); --LINK_BOXSHADOW_HOVER: 0px var(--BORDER_WIDTH_THICK) 0px 0px var(--COLOR_BORDER_STRONG); --LINK_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --LINK_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --LINK_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --LINK_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --LINK_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --LINK_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --LINK_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--LINK_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--LINK_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --LINK_BOXSHADOW_FOCUS: 0px 0px 0px var(--LINK_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--LINK_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--LINK_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--LINK_BOXSHADOW_FOCUSOUTLINE_COLOR),0px var(--LINK_BOXSHADOW_FOCUS_WITDH) 0px 0px var(--LINK_BOXSHADOW_FOCUS_COLOR); /********* LinkCard1 Borders ************/ --LINKCARD1_BOXSHADOW: 0px 0px 0px var(--BORDER_WIDTH_PRIMARY) inset var(--COLOR_BORDER_PRIMARY); --LINKCARD1_BOXSHADOW_HOVER: 0px 0px 0px var(--BORDER_WIDTH_THICK) inset var(--COLOR_BORDER_STRONG); --LINKCARD1_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --LINKCARD1_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --LINKCARD1_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --LINKCARD1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --LINKCARD1_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --LINKCARD1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --LINKCARD1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--LINKCARD1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--LINKCARD1_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --LINKCARD1_BOXSHADOW_FOCUS: 0px 0px 0px var(--LINKCARD1_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--LINKCARD1_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--LINKCARD1_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--LINKCARD1_BOXSHADOW_FOCUSOUTLINE_COLOR),0px 0px 0px var(--LINKCARD1_BOXSHADOW_FOCUS_WITDH) inset var(--LINKCARD1_BOXSHADOW_FOCUS_COLOR); /********* Contacts Borders ************/ --CONTACTS_BOXSHADOW: 0px var(--BORDER_WIDTH_PRIMARY) 0px 0px var(--COLOR_BORDER_SECONDARY); --CONTACTS_BOXSHADOW_HOVER: 0px var(--BORDER_WIDTH_THICK) 0px 0px var(--COLOR_BORDER_STRONG); --CONTACTS_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --CONTACTS_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --CONTACTS_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --CONTACTS_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --CONTACTS_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --CONTACTS_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --CONTACTS_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--CONTACTS_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--CONTACTS_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --CONTACTS_BOXSHADOW_FOCUS: 0px 0px 0px var(--CONTACTS_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--CONTACTS_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--CONTACTS_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--CONTACTS_BOXSHADOW_FOCUSOUTLINE_COLOR),0px var(--CONTACTS_BOXSHADOW_FOCUS_WITDH) 0px 0px var(--CONTACTS_BOXSHADOW_FOCUS_COLOR); /********* Table1 Borders ************/ --TABLE1_BOXSHADOW: var(--BOXSHADOW_BOTTOM); --TABLE1_BOXSHADOW_HOVER: var(--BOXSHADOW_BOTTOM_HOVER); --TABLE1_BOXSHADOW_FOCUS: var(--BOXSHADOW_BOTTOM_FOCUS); /********* Upload1 Borders ************/ --UPDATE1_FILELIST_BOXSHADOW: var(--BOXSHADOW_BOTTOM); --UPDATE1_FILELIST_BOXSHADOW_HOVER: var(--BOXSHADOW_BOTTOM_HOVER); --UPDATE1_FILELIST_BOXSHADOW_FOCUS: var(--BOXSHADOW_BOTTOM_FOCUS); /********* Footer Borders ************/ --FOOTER_BOXSHADOW: 0px var(--BORDER_WIDTH_PRIMARY) 0px 0px var(--COLOR_BORDER_SECONDARY); --FOOTER_BOXSHADOW_HOVER: 0px var(--BORDER_WIDTH_THICK) 0px 0px var(--COLOR_BORDER_STRONG); --FOOTER_BOXSHADOW_FOCUS_COLOR: var(--COLOR_BORDER_STRONG); --FOOTER_BOXSHADOW_FOCUS_WITDH: var(--BORDER_WIDTH_THICK); --FOOTER_BOXSHADOW_FOCUSOUTLINE_WIDTH: 1px; --FOOTER_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER: 3px; --FOOTER_BOXSHADOW_FOCUSOUTLINE_COLOR: var(--COLOR_NEUTRALS_BLACK); --FOOTER_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR: var(--COLOR_FORM_CONTAINER); --FOOTER_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH: calc(var(--FOOTER_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) + var(--FOOTER_BOXSHADOW_FOCUSOUTLINE_WIDTH)); --FOOTER_BOXSHADOW_FOCUS: 0px 0px 0px var(--FOOTER_BOXSHADOW_FOCUSOUTLINE_SPACETOBORDER) var(--FOOTER_BOXSHADOW_FOCUSOUTLINE_HIDE_COLOR), 0px 0px 0px var(--FOOTER_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH) var(--FOOTER_BOXSHADOW_FOCUSOUTLINE_COLOR),0px var(--FOOTER_BOXSHADOW_FOCUS_WITDH) 0px 0px var(--FOOTER_BOXSHADOW_FOCUS_COLOR); /********* SectionHeader ************/ --SECTIONHEADER_LABEL_TO_SUBLABEL_GAP: var(--SPACE_6); /********* Radio2 ************/ --RADIO2_OUTERLABEL_TO_CONTROL_GAP: var(--FIELD_OUTERLABEL_TO_CONTROL_GAP); --RADIO2_BUTTON_TO_TEXT_GAP: 12px; --RADIO2_BUTTON_BORDER: 1px solid var(--COLOR_BORDER_PRIMARY); --RADIO2_BUTTON_BORDER_ERROR: 1px solid var(--COLOR_BORDER_WARNING); --RADIO2_BUTTON_DISABLED_BORDER: 1px solid var(--COLOR_BORDER_TERTIARY); --RADIO2_BUTTON_COLOR: var(--COLOR_NEUTRALS_BLACK); --RADIO2_BUTTON_DISABLED_COLOR: var(--COLOR_FG_TERTIARY); --RADIO2_BUTTON_UNCHECKED_HOVER_COLOR: var(--COLOR_NEUTRALS_BLACK_16PERCENT); /********* Select2 ************/ --SELECT2_OPENER_SIZE: var(--ICON_SIZE_M); --SELECT2_LABEL_TO_OPENER_GAP: var(--ICON_SIZE_M); --SELECT2_PADDING_OUTERLABEL: var(--FIELD_PADDING_OUTERLABEL); /********* Checkbox3 ************/ --CHECKBOX3_BOX_SIZE: var(--ICON_SIZE_M); --CHECKBOX3_BOX_TO_LABEL_GAP: var(--ICON_TO_LABEL_GAP); --CHECKBOX3_CHECK_PADDING: 1px; --CHECKBOX3_CHECK_SIZE: calc( var(--CHECKBOX3_BOX_SIZE) - var(--CHECKBOX3_CHECK_PADDING)); --CHECKBOX3_HOVER_CHECK_OPACITY:16%; /********* checkboxImage ************/ --CHECKBOX_IMAGE_BOX_SIZE: var(--ICON_SIZE_M); --CHECKBOX_IMAGE_BOX_TO_LABEL_GAP: var(--ICON_TO_LABEL_GAP); --CHECKBOX_IMAGE_CHECK_PADDING: 1px; --CHECKBOX_IMAGE_CHECK_SIZE: calc( var(--CHECKBOX_IMAGE_BOX_SIZE) - var(--CHECKBOX_IMAGE_CHECK_PADDING)); --CHECKBOX_IMAGE_HOVER_CHECK_OPACITY:16%; /********* tabGroupCustom1 ************/ --TABGROUPCUSTOM1_GAP_BETWEEN_TABS: var(--SPACE_5); --TABGROUPCUSTOM1_TAB_MIN_HEIGHT: var(--FIELD_MIN_HEIGHT); --TABGROUPCUSTOM1_TAB_MIN_WIDTH: 240px; --TABGROUPCUSTOM1_TAB_HORIZONTAL_PAD: var(--SPACE_6); --TABGROUPCUSTOM1_PAD_FOR_FOCUSOUTLINE: var(--FIELD_BOXSHADOW_FOCUSOUTLINE_BOXSHADOW_WIDTH); --TABGROUPCUSTOM1_SCROLLBUTTON_TO_TABS_GAP: var(--SPACE_2); --TABGROUPCUSTOM1_SCROLLBUTTON_VERTICAL_PAD: var(--SPACE_5); --TABGROUPCUSTOM1_SCROLLBUTTON_HORIZONTAL_PAD: var(--SPACE_2); --TABGROUPCUSTOM1_SCROLLBUTTON_ICON_SIZE: var(--ICON_SIZE_M); --TABGROUPCUSTOM1_REMOVE_ICON_SIZE: var(--ICON_SIZE_M); --TABGROUPCUSTOM1_REMOVE_ICON_PADDING_SIZE: var(--BUTTON_SIZE_S_ICON_PADDING_SIZE); /********* SelectCardSingle1 ************/ --SELECTCARDSINGLE1_MIN_HEIGHT: 150px; --SELECTCARDSINGLE1_MIN_WIDTH: 148px; --SELECTCARDSINGLE1_BORDER_RADIUS: 32px; --SELECTCARDSINGLE1_CONTENT_PADDING: var(--SPACE_6) var(--SPACE_6); --SELECTCARDSINGLE1_BOX_TO_LABEL_GAP: var(--SPACE_3); --SELECTCARDSINGLE1_LABEL_TO_TEXT_GAP: var(--SPACE_1); --SELECTCARDSINGLE1_CHECKBOX_SIZE: var(--ICON_SIZE_M); --SELECTCARDSINGLE1_CHECK_PADDING: 1px; --SELECTCARDSINGLE1_CHECK_SIZE: calc( var(--SELECTCARDSINGLE1_CHECKBOX_SIZE) - var(--SELECTCARDSINGLE1_CHECK_PADDING)); --SELECTCARDSINGLE1_HOVER_CHECK_OPACITY:16%; --SELECTCARDSINGLE1_BUTTON_TO_TEXT_GAP: 12px; --SELECTCARDSINGLE1_BUTTON_BORDER: 1px solid var(--COLOR_BORDER_PRIMARY); --SELECTCARDSINGLE1_BUTTON_BORDER_ERROR:1px solid var(--COLOR_BORDER_WARNING); --SELECTCARDSINGLE1_BGKNOB_HEIGHT: 26px; --SELECTCARDSINGLE1_BGKNOB_WIDTH: 26px; --SELECTCARDSINGLE1_KNOB_HEIGHT: 8px; --SELECTCARDSINGLE1_KNOB_WIDTH: 8px; --SELECTCARDSINGLE1_PRICE_HEIGHT: var(--SPACE_6); /********* SelectCardMulti1 ************/ --SELECTCARDMULTI1_MIN_HEIGHT: 150px; --SELECTCARDMULTI1_BORDER_RADIUS: 32px; --SELECTCARDMULTI1_CONTENT_PADDING_HORIZONTAL: var(--SPACE_6); --SELECTCARDMULTI1_CONTENT_PADDING_VERTICAL: var(--SPACE_6); --SELECTCARDMULTI1_CONTENT_PADDING: var(--SELECTCARDMULTI1_CONTENT_PADDING_VERTICAL) var(--SELECTCARDMULTI1_CONTENT_PADDING_HORIZONTAL); --SELECTCARDMULTI1_BOX_TO_LABEL_GAP: var(--SPACE_3); --SELECTCARDMULTI1_LABEL_TO_TEXT_GAP: var(--SPACE_1); --SELECTCARDMULTI1_CHECKBOX_SIZE: var(--ICON_SIZE_M); --SELECTCARDMULTI1_CHECK_PADDING: 1px; --SELECTCARDMULTI1_CHECK_SIZE: calc( var(--SELECTCARDMULTI1_CHECKBOX_SIZE) - var(--SELECTCARDMULTI1_CHECK_PADDING)); --SELECTCARDMULTI1_HOVER_CHECK_OPACITY:16%; --SELECTCARDMULTI1_PRICE_HEIGHT: var(--SPACE_6); /********* String1 ************/ --STRING_OUTERLABEL_TO_CONTROL_GAP: var(--FIELD_OUTERLABEL_TO_CONTROL_GAP); /********* TextArea1 ************/ --TEXTAREA1_OUTERLABEL_TO_CONTROL_GAP: var(--FIELD_OUTERLABEL_TO_CONTROL_GAP); --TEXTAREA1_PADDING_OUTERLABEL: var(--FIELD_PADDING_OUTERLABEL); --TEXTAREA1_CONTENT_HORIZONTAL_PAD: var(--FIELD_CONTENT_HORIZONTAL_PAD); --TEXTAREA1_CONTENT_VERTICAL_PAD: 32px; --TEXTAREA1_BORDER: 0px solid transparent; --TEXTAREA1_BORDER_RADIUS: var(--TEXTAREA1_CONTENT_HORIZONTAL_PAD); --TEXTAREA1_TEXTAREA_MIN_HEIGHT: 240px; --TEXTAREA1_TEXTAREA_MAX_HEIGHT: 480px; /********* SolfinSearch2 ************/ --SOLFINSEARCH2_OUTERLABEL_TO_CONTROL_GAP: var(--FIELD_OUTERLABEL_TO_CONTROL_GAP); /********* DateTime ************/ --DATETIME_OUTERLABEL_TO_CONTROL_GAP: var(--FIELD_OUTERLABEL_TO_CONTROL_GAP); --DATETIME_PICKER_SIZE: var(--ICON_SIZE_M); --DATETIME_LABEL_TO_PICKER_GAP: var(--ICON_TO_LABEL_GAP); /********* Print1 ************/ --PRINT1_ICON_TO_LABEL_GAP: var(--ICON_TO_LABEL_GAP); --PRINT1_ICON_SIZE: var(--ICON_SIZE_M); --PRINT1_ICON_PADDING_SIZE: var(--BUTTON_SIZE_S_ICON_PADDING_SIZE); /********* Link ************/ --LINK_ICON_TO_LABEL_GAP: var(--ICON_TO_LABEL_GAP); --LINK_ICON_SIZE: var(--ICON_SIZE_M); --LINK_LABEL_TO_ARROW_GAP:var(--ICON_TO_LABEL_GAP); --LINK_LABEL_VERTICAL_PAD:20px; /********* LinkCard1 ************/ --LINKCARD1_MIN_HEIGHT: 150px; --LINKCARD1_BORDER_RADIUS: 32px; --LINKCARD1_CONTENT_PADDING: var(--SPACE_6) var(--SPACE_6); --LINKCARD1_LABEL_TO_TEXT_GAP: var(--SPACE_1); --LINKCARD1_LINK_HEIGHT: calc( var(--SPACE_6) + var(--SPACE_1) ); --LINKCARD1_LABEL_TO_ARROW_GAP: var(--SPACE_2); --LINKCARD1_ARROW_WIDTH: var(--ICON_SIZE_M); /********* Contacts ************/ --CONTACTS_ICON_TO_LABEL_GAP: var(--ICON_TO_LABEL_GAP); --CONTACTS_ICON_SIZE: var(--ICON_SIZE_M); --CONTACTS_LABEL_TO_ARROW_GAP:var(--ICON_TO_LABEL_GAP); --CONTACTS_LABEL_VERTICAL_PAD:20px; /********* Hint1 ************/ --HINT1_PADDING: var(--SPACE_8) var(--SPACE_8); --HINT1_INFO_BORDER: var(--BORDER_INFO); --HINT1_WARNING_BORDER: var(--BORDER_WARNING); --HINT1_SALE_BORDER: var(--BORDER_SALE); --HINT1_ICON_TO_LABEL_GAP: var(--SPACE_8); --HINT1_LABEL_TO_TEXT_GAP: var(--SPACE_4); --HINT1_ICON_BACKGROUND_SIZE: 56px; /********* List1 ************/ --LIST1_LABEL_TO_TEXT_GAP: var(--SPACE_6); --LIST1_L_ITEMS_GAP: var(--SPACE_6); --LIST1_M_ITEMS_GAP: var(--SPACE_4); --LIST1_S_ITEMS_GAP: var(--SPACE_3); /********* PricingItem1 ************/ --PRICINGITEM1_PAD_RIGHT: var(--SPACE_4); --PRICINGITEM1_PAD_TOP: var(--SPACE_6); --PRICINGITEM1_PAD_BOTTOM: var(--SPACE_6); --PRICINGITEM1_BORDER: 0 var(--BORDER_WIDTH_THIN) 0 0 var(--COLOR_BORDER_SECONDARY); --PRICINGITEM1_RESULT_BORDER: 0 var(--BORDER_WIDTH_THIN) 0 0 var(--COLOR_BORDER_STRONG); /* There seems to be no real connection between border color ("border/Strong") and border thickness (color border/strong) is used for 1px and 2px borders); there are no semantic names for borders, so thick and thin are used here */ --PRICINGITEM1_LEFT_TO_RIGHT_ITEMS_GAP: var(--SPACE_4);; --PRICINGITEM1_LEFT_ITEMS_GAP: var(--SPACE_3); --PRICINGITEM1_RIGHT_ITEMS_GAP: var(--SPACE_4); --PRICINGITEM1_BADGE_PAD: var(--SPACE_2) var(--SPACE_3); --PRICINGITEM1_BADGE_MAX_HEIGHT:var(--SPACE_6); /********* PricingItemCheckbox1 ************/ --PRICINGITEMCHECKBOX1_PAD_RIGHT: var(--SPACE_4); --PRICINGITEMCHECKBOX1_PAD_TOP: var(--SPACE_6); --PRICINGITEMCHECKBOX1_PAD_BOTTOM: var(--SPACE_6); --PRICINGITEMCHECKBOX1_BOX_SIZE: var(--ICON_SIZE_M); --PRICINGITEMCHECKBOX1_BOX_TO_LABEL_GAP: var(--ICON_TO_LABEL_GAP); --PRICINGITEMCHECKBOX1_CHECK_PADDING: 1px; --PRICINGITEMCHECKBOX1_CHECK_SIZE: calc( var(--PRICINGITEMCHECKBOX1_BOX_SIZE) - var(--PRICINGITEMCHECKBOX1_CHECK_PADDING)); --PRICINGITEMCHECKBOX1_HOVER_CHECK_OPACITY:16%; --PRICINGITEMCHECKBOX1_BORDER: 0 var(--BORDER_WIDTH_THIN) 0 0 var(--COLOR_BORDER_SECONDARY); /********* Divider ************/ --DIVIDER_HEIGHT: var(--SPACE_8); --DIVIDER_BORDER_TOP: var(--BORDER_WIDTH_THICK) solid var(--COLOR_BORDER_STRONG); /********* Table1 ************/ --TABLE1_OUTERLABEL_TO_CONTROL_GAP: 0; --TABLE1_VERTICAL_PAD: calc( var(--SPACE_6) + var(--SPACE_2) ); --TABLE1_PADDING_RIGHT: var(--SPACE_4); --TABLE1_TEXT_CONTENT_TO_SUBTITLE_GAP: var(--SPACE_2); --TABLE1_LIST_CONTENT_TO_SUBTITLE_GAP: var(--SPACE_4); --TABLE1_LISTNEW_BUTTON_GEP: var(--SPACE_10); /********* Update1 ************/ --UPDATE1_FILELIST_OUTERLABEL_TO_CONTROL_GAP: 0; --UPDATE1_FILELIST_VERTICAL_PAD: calc( var(--SPACE_6) + var(--SPACE_2) ); --UPDATE1_FILELIST_PADDING_RIGHT: var(--SPACE_4); --UPDATE1_DRAGFIELD_BORDER_RADIUS: 32px; --UPDATE1_DRAGFIELD_BORDER: 1px dashed var(--COLOR_BORDER_SECONDARY); /********* SECONDARY_BUTTON ************/ --PRIMARY_BUTTON_LABEL_SIZE: var(--BUTTON_LABEL_SIZE); /********* SECONDARY_BUTTON ************/ --SECONDARY_BUTTON_LABEL_SIZE: var(--BUTTON_LABEL_SIZE); /********* Button_Forward ************/ --BUTTON_FORWARD_LABEL_SIZE: var(--BUTTON_LABEL_SIZE); /********* Button_Backward ************/ --BUTTON_BACKWARD_LABEL_SIZE: var(--BUTTON_LABEL_SIZE); /********* Contacts ************/ --CONTACTS_MARGIN_LEFT: calc(var(--CHECKBOX3_BOX_SIZE) + var(--CHECKBOX3_BOX_TO_LABEL_GAP)); /* contacts are idented to align with text of Checkbox3 which is the control above it) /********* Captcha1 ************/ --CAPTCHA1_LABEL_TO_CAPTCHA_GAP: 10px; /********* Inputs ************/ --INPUT_BACKGROUND: transparent; /********* HeaderMenu ************/ --HEADERMENU_POPUP_MARGIN_RIGHT: 4px; --HEADERMENU_POPUP_TO_BUTTON_GAP: 4px; /*Estimated, not specified and not viewable in css*/ --HEADERMENU_POPUP_PAD_TOPBOTTOM: 8px; --HEADERMENU_ITEM_PAD: 12px 24px; --HEADERMENU_BORDER: 1px solid var(--COLOR_NEUTRALS_BLACK); /*not specified and not viewable in css*/ --HEADERMENU_BORDER_RADIUS: 24px 24px 24px 24px; /*not specified and not viewable in css*/ --TRANSITION_MENU_POPUP: all var(--TRANSITION_FAST); /********* Popup ************/ --POPUP_BORDER: 0px solid var(--COLOR_NEUTRALS_BLACK); /*not specified since no spec for popups*/ --POPUP_BORDER_RADIUS: 24px 24px 24px 24px; /*not specified since no spec for popups*/ /********* HelpDiv ************/ --HELPPOPUP_CLOSE_ICON_SIZE: var(--ICON_SIZE_M); --HELPPOPUP_CLOSE_MARGIN_TOPRIGHT: var(--ICON_SIZE_M); --HELPPOPUP_TRANSITION: all var(--TRANSITION_FAST); /********* Amount ************/ --AMOUNT_BORDER_TEXT_SECONDARY: 0 var(--BORDER_WIDTH_THIN) 0 0 var(--COLOR_BORDER_SECONDARY); --AMOUNT_BORDER_TEXT_PRIMARY: 0 var(--BORDER_WIDTH_THIN) 0 0 var(--COLOR_BORDER_STRONG); /* There seems to be no real connection between border color ("border/Strong") and border thickness (color border/strong) is used for 1px and 2px borders); there are no semantic names for borders, so thick and thin are used here */ /********* Footer ************/ --FOOTER_LABEL_VERTICAL_PAD: 20px; } /* @media (max-width: 767px) { body { container-type: inline-size; container-name: mobileScreen; } } */ @media (min-width: 768px) and (max-width: 1023px) { body { container-type: inline-size; container-name: tabletScreen; } } @media (min-width: 1024px) { body { container-type: inline-size; container-name: desktopScreen; } } @container desktopScreen (min-width: 0) { #wrap1 { --HEADER_HORIZONTAL_PADDING:var(--HEADER_HORIZONTAL_PADDING_DESKTOP); --HEADER_MAX_WIDTH: var(--HEADER_MAX_WIDTH_DESKTOP); --WINDOW_TO_HEADER_GAP: var(--HEADER_TO_FORM_GAP_DESKTOP); --HEADER_TO_FORM_GAP: var(--HEADER_TO_FORM_GAP_DESKTOP); --FOOTER_HORIZONTAL_PADDING:var(--FOOTER_HORIZONTAL_PADDING_DESKTOP); --FOOTER_MAX_WIDTH: var(--FOOTER_MAX_WIDTH_DESKTOP); --FORM_TO_FOOTER_GAP: var(--FORM_TO_FOOTER_GAP_DESKTOP); --GRID_COLUMN_COUNT: var(--GRID_COLUMN_COUNT_DESKTOP); --ITEM_GAP: var(--ITEM_GAP_DESKTOP); --FORM_FIELD_ROW_GAP: var(--FORM_FIELD_ROW_GAP_DESKTOP); --FORM_CONTAINER_TOPBOTTOM: var(--FORM_CONTAINER_TOPBOTTOM_DESKTOP); --FORM_CONTAINER_MARGIN: var(--FORM_CONTAINER_MARGIN_DESKTOP); --FORM_CONTAINER_PADDING: var(--FORM_CONTAINER_PADDING_DESKTOP); --FORM_CONTAINER_MAX_WIDTH: var(--FORM_CONTAINER_MAX_WIDTH_DESKTOP); --FORM_SECTION_HEADER_GAP: var(--FORM_SECTION_HEADER_GAP_DESKTOP); --FONT_HEADLINE_M: var(--FONT_HEADLINE_M_MAX); --FONT_HEADLINE_M_LETTERSPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --FONT_PAGE_HEADER: var(--FONT_HEADLINE_M_MAX); --FONT_HEADER_FEE_VALUE: var(--FONT_HEADLINE_M_MAX); --FONT_FORM_CONTAINER_HEADER: var(--FONT_HEADLINE_L_MAX); --FONT_FORM_CONTAINER_HEADER_LETTER_SPACING: var(--FONT_HEADLINE_L_MAX_LETTER_SPACING); --FONT_SECTION_HEADER: var(--FONT_HEADLINE_M_MAX); --FONT_SECTION_HEADER_LETTER_SPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --FONT_PROGRESSINDICATOR_TEXT: var(--FONT_HEADLINE_L_MAX); --FONT_PROGRESSINDICATOR_TEXT_LETTERSPACING: var(--FONT_HEADLINE_L_MAX_LETTER_SPACING); --FONT_HINT1_LABEL: var(--FONT_HEADLINE_M_MAX); --FONT_HINT1_LABEL_LETTERSPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --FONT_UPLOAD1_FILELIST_LABEL: var(--FONT_HEADLINE_M_MAX); --FONT_UPLOAD1_FILELIST_LABEL_LETTERSPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --HELPPOPUP_WIDTH_DESKTOP: calc( 100% - var(--FORM_CONTAINER_PADDING) ); --HELPPOPUP_MAX_WIDTH_DESKTOP: 800px; --HELPPOPUP_WIDTH: var(--HELPPOPUP_WIDTH_DESKTOP); --HELPPOPUP_MAX_WIDTH: var(--HELPPOPUP_MAX_WIDTH_DESKTOP); } } @container tabletScreen (min-width: 0) { #wrap1 { --HEADER_HORIZONTAL_PADDING:var(--HEADER_HORIZONTAL_PADDING_TABLET); --HEADER_MAX_WIDTH: var(--HEADER_MAX_WIDTH_TABLET); --WINDOW_TO_HEADER_GAP: var(--HEADER_TO_FORM_GAP_TABLET); --HEADER_TO_FORM_GAP: var(--HEADER_TO_FORM_GAP_TABLET); --FOOTER_HORIZONTAL_PADDING:var(--FOOTER_HORIZONTAL_PADDING_TABLET); --FOOTER_MAX_WIDTH: var(--FOOTER_MAX_WIDTH_TABLET); --FORM_TO_FOOTER_GAP: var(--FORM_TO_FOOTER_GAP_TABLET); --GRID_COLUMN_COUNT: var(--GRID_COLUMN_COUNT_TABLET); --ITEM_GAP: var(--ITEM_GAP_TABLET); --FORM_FIELD_ROW_GAP: var(--FORM_FIELD_ROW_GAP_TABLET); --FORM_CONTAINER_TOPBOTTOM: var(--FORM_CONTAINER_TOPBOTTOM_TABLET); --FORM_CONTAINER_MARGIN: var(--FORM_CONTAINER_MARGIN_TABLET); --FORM_CONTAINER_PADDING: var(--FORM_CONTAINER_PADDING_TABLET); --FORM_CONTAINER_MAX_WIDTH: var(--FORM_CONTAINER_MAX_WIDTH_TABLET); --FORM_SECTION_HEADER_GAP: var(--FORM_SECTION_HEADER_GAP_TABLET); --FONT_HEADLINE_M: var(--FONT_HEADLINE_M_MAX); --FONT_HEADLINE_M_LETTERSPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --FONT_PAGE_HEADER: var(--FONT_HEADLINE_M_MAX); --FONT_HEADER_FEE_VALUE: var(--FONT_HEADLINE_M_MAX); --FONT_FORM_CONTAINER_HEADER: var(--FONT_HEADLINE_L_MAX); --FONT_FORM_CONTAINER_HEADER_LETTER_SPACING: var(--FONT_HEADLINE_L_MAX_LETTER_SPACING); --FONT_SECTION_HEADER: var(--FONT_HEADLINE_M_MAX); --FONT_SECTION_HEADER_LETTER_SPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --FONT_PROGRESSINDICATOR_TEXT: var(--FONT_HEADLINE_L_MAX); --FONT_PROGRESSINDICATOR_TEXT_LETTERSPACING: var(--FONT_HEADLINE_L_MAX_LETTER_SPACING); --FONT_HINT1_LABEL: var(--FONT_HEADLINE_M_MAX); --FONT_HINT1_LABEL_LETTERSPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --FONT_UPLOAD1_FILELIST_LABEL: var(--FONT_HEADLINE_M_MAX); --FONT_UPLOAD1_FILELIST_LABEL_LETTERSPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --HELPPOPUP_WIDTH_TABLET: calc( 100% - var(--FORM_CONTAINER_PADDING) ); --HELPPOPUP_MAX_WIDTH_TABLET: none; --HELPPOPUP_WIDTH: var(--HELPPOPUP_WIDTH_TABLET); --HELPPOPUP_MAX_WIDTH: var(--HELPPOPUP_MAX_WIDTH_TABLET); } } /*@container mobileScreen (min-width: 0) {*/ @media (max-width: 767px) { #wrap1 { --HEADER_HORIZONTAL_PADDING:var(--HEADER_HORIZONTAL_PADDING_MOBILE); --HEADER_MAX_WIDTH: var(--HEADER_MAX_WIDTH_MOBILE); --WINDOW_TO_HEADER_GAP: var(--HEADER_TO_FORM_GAP_MOBILE); --HEADER_TO_FORM_GAP: var(--HEADER_TO_FORM_GAP_MOBILE); --FOOTER_HORIZONTAL_PADDING:var(--FOOTER_HORIZONTAL_PADDING_MOBILE); --FOOTER_MAX_WIDTH: var(--FOOTER_MAX_WIDTH_MOBILE); --FORM_TO_FOOTER_GAP: var(--FORM_TO_FOOTER_GAP_MOBILE); --GRID_COLUMN_COUNT: var(--GRID_COLUMN_COUNT_MOBILE); --ITEM_GAP: var(--ITEM_GAP_MOBILE); --FORM_FIELD_ROW_GAP: var(--FORM_FIELD_ROW_GAP_MOBILE); --FORM_CONTAINER_TOPBOTTOM: var(--FORM_CONTAINER_TOPBOTTOM_MOBILE); --FORM_CONTAINER_MARGIN: var(--FORM_CONTAINER_MARGIN_MOBILE); --FORM_CONTAINER_PADDING: var(--FORM_CONTAINER_PADDING_MOBILE); --FORM_CONTAINER_MAX_WIDTH: var(--FORM_CONTAINER_MAX_WIDTH_MOBILE); --FORM_SECTION_HEADER_GAP: var(--FORM_SECTION_HEADER_GAP_MOBILE); --FONT_HEADLINE_M: var(--FONT_HEADLINE_M_MIN); --FONT_HEADLINE_M_LETTERSPACING: var(--FONT_HEADLINE_M_MIN_LETTER_SPACING); --FONT_PAGE_HEADER: var(--FONT_HEADLINE_M_MIN); --FONT_HEADER_FEE_VALUE: var(--FONT_HEADLINE_M_MIN); --FONT_FORM_CONTAINER_HEADER: var(--FONT_HEADLINE_L_MIN); --FONT_FORM_CONTAINER_HEADER_LETTER_SPACING: var(--FONT_HEADLINE_L_MIN_LETTER_SPACING); --FONT_SECTION_HEADER: var(--FONT_HEADLINE_M_MIN); --FONT_SECTION_HEADER_LETTER_SPACING: var(--FONT_HEADLINE_M_MIN_LETTER_SPACING); --FONT_PROGRESSINDICATOR_TEXT: var(--FONT_HEADLINE_L_MIN); --FONT_PROGRESSINDICATOR_TEXT_LETTERSPACING: var(--FONT_HEADLINE_L_MIN_LETTER_SPACING); --FONT_HINT1_LABEL: var(--FONT_HEADLINE_M_MAX); --FONT_HINT1_LABEL_LETTERSPACING: var(--FONT_HEADLINE_M_MAX_LETTER_SPACING); --FONT_UPLOAD1_FILELIST_LABEL: var(--FONT_HEADLINE_M_MIN); --FONT_UPLOAD1_FILELIST_LABEL_LETTERSPACING: var(--FONT_HEADLINE_M_MIN_LETTER_SPACING); --HELPPOPUP_WIDTH_MOBILE: 100%; --HELPPOPUP_MAX_WIDTH_MOBILE: none; --HELPPOPUP_WIDTH: var(--HELPPOPUP_WIDTH_MOBILE); --HELPPOPUP_MAX_WIDTH: var(--HELPPOPUP_MAX_WIDTH_MOBILE); --TABGROUPCUSTOM1_TAB_MIN_WIDTH: 160px; } } /* Calculation is the same for all sizes, but uses (global) Variables set individually above; the following media type will be interpreted AFTER the types above */ @media (min-width: 0px) { #wrap1 { --FORM_SECTION_HEADER_IN_ITEM_MARGIN_TOP: calc( var(--FORM_SECTION_HEADER_GAP) - var(--FORM_FIELD_ROW_GAP) ); --FORM_SECTION_HEADER_NOLABEL_MARGIN_TOP: calc( var(--FORM_SECTION_HEADER_IN_ITEM_MARGIN_TOP) - var(--FORM_FIELD_ROW_GAP) ); --NAVIGATION_MARGIN_TOP: var(--FORM_SECTION_HEADER_GAP); --PRIVACY_MARGIN_TOP: var(--FORM_SECTION_HEADER_GAP); --FONT_AMOUNT_TITLE: var(--FONT_SECTION_HEADER); --FONT_AMOUNT_TITLE_LETTER_SPACING: var(--FONT_SECTION_HEADER_LETTER_SPACING); --FONT_TABLE1_OUTERLABEL: var(--FONT_SECTION_HEADER); --FONT_TABLE1_OUTERLABEL_LETTERSPACING: var(--FONT_SECTION_HEADER_LETTER_SPACING); --FONT_RADIO5_MOBILE_PRICE: var(--FONT_HEADLINE_M); --FONT_RADIO5_MOBILE_PRICE_LETTERSPACING: var(--FONT_HEADLINE_M_LETTERSPACING); --FONT_LIST1_LABEL: var(--FONT_SECTION_HEADER); --FONT_LIST1_LABEL_LETTERSPACING: var(--FONT_SECTION_HEADER_LETTER_SPACING); } } @font-face { font-family: GT_Walsheim_ARAG_CondensedMedium; src: url("GT-Walsheim-ARAG-Condensed-Medium.otf") format("opentype"); } @font-face { font-family: GT_Walsheim_ARAG_MediumOblique; src: url("GT-Walsheim-ARAG-Condensed-Medium-Oblique.otf") format("opentype"); } @font-face { font-family: GT_Walsheim_ARAG_Light; src: url("GT-Walsheim-ARAG-Light.otf") format("opentype"); } @font-face { font-family: GT_Walsheim_ARAG_LightOblique; src: url("GT-Walsheim-ARAG-Light-Oblique.otf") format("opentype"); } @font-face { font-family: GT_Walsheim_ARAG_Medium; src: url("GT-Walsheim-ARAG-Medium.otf") format("opentype"); } @font-face { font-family: GT_Walsheim_ARAG_MediumOblique; src: url("GT-Walsheim-ARAG-Medium-Oblique.otf") format("opentype"); } @font-face { font-family: GT_Walsheim_ARAG_Regular; src: url("GT-Walsheim-ARAG-Regular.otf") format("opentype"); } @font-face { font-family: GT_Walsheim_ARAG_CondensedRegular; src: url("GT-Walsheim-ARAG-Condensed-Medium.otf") format("opentype"); } @font-face { font-family: GT_Walsheim_ARAG_RegularOblique; src: url("GT-Walsheim-ARAG-Regular-Oblique.otf") format("opentype"); } @font-face { font-family: GT-Alpina-ARAG-Condensed-Regular-Italic; src: url("GT-Alpina-ARAG-Condensed-Regular-Italic.otf") format("opentype"); }