:root {
// FONTS
--font-family: Lato, arial, sans-serif;
--font-size-1: 1.6rem;
--font-size-2: 1.4rem;
--font-size-3: 1.2rem;
--font-weight: 400;
--bold: 900;
--letter-spacing: 0;
--line-height-1: 1.58;
--line-height-2: 1.35;
--line-height-3: 1.1;
:lang(ja) {
--font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Lato, arial, sans-serif;
}
:lang(zh-hans) {
--font-family: "Microsoft YaHei New", "Microsoft Yahei", SimSun, STXihei, Lato, arial, sans-serif;
}
// HEADINGS
--heading-margin: var(--spacing-2);
--heading-font-family: var(--font-family);
--heading-letter-spacing: 0;
--heading-line-height: 1.35;
--heading-weight: 900;
--heading-tag-size: 1rem;
--heading-color: inherit;
--heading-tag-color: #3a3a3a;
--heading-border-width: 8.4rem;
--heading-border-margin-bottom: 3.6rem;
--heading-border-padding-top: 3.6rem;
--heading-border: 0.2rem solid var(--white);
h1,.heading--1 {
--heading-size: 4.4rem;
--heading-line-height: 1.1;
}
h2,.heading--2 {
--heading-size: 3.6rem;
}
h3,.heading--3 {
--heading-size: 3rem;
}
h4,.heading--4 {
--heading-size: 2.4rem;
--heading-weight: 700;
}
h5,.heading--5 {
--heading-size: 2rem;
--heading-weight: 700;
}
h6,.heading--6 {
--heading-size: 1.6rem;
}
// MARGIN / PADDING
--spacing-1: 1.2rem;
--spacing-2: 2.4rem;
--spacing-3: 4.8rem;
--spacing-4: 7.2rem;
--spacing-5: 8.4rem;
--spacing-6: 9.6rem;
// LAYER
--layer-1: 100;
--layer-2: 200;
--layer-3: 300;
--layer-4: 400;
--layer-5: 500;
--layer-6: 600;
// BACKGROUND COLORS
--body-background: var(--very-dark-grey);
--background-color: var(--white);
--post-view-more-background: var(--white);
--related-background: var(--mostly-white);
--selection-background: yellow;
--selection-color: #000000;
--gradient-background: linear-gradient(108deg, #0F2027 0%, #203A43 33%, #2C5364 100%);
--gradient-background-ie: linear-gradient(135deg, #131919 0, #271f0e 100%);
--divider-background: var(--black);
--table-background: var(--white);
--table-hover-background: var(--mostly-white);
--dropdown-background: var(--white);
// BORDERS
--border-color: var(--very-light-grey);
--inverted-border-color: var(--very-light-grey);
--table-heading-border: var(--black);
--table-border: var(--very-light-grey);
// BORDER RADIUS
--border-radius: 0.6rem;
// BLUR
--blur: 1.2rem;
// SHADOWS
--shadow: 0 0.4rem 1.5rem 0.2rem rgba(173, 173, 173, 0.3);
// COLORS
--white: #FFFFFF;
--mostly-white: #F5F5F5;
--very-light-grey: #DDDDDD;
--grey: #ABABAB;
--black: #000000;
--mostly-black: #101010;
--very-dark-grey: #212121;
--feature-color: #ffd500;
--feature-hover-color: #ffd500cc;
--primary-1-d-50: #660019;
--primary-1-d-25: #990026;
--primary-1: #cc0033;
--primary-1-l-25: #D94066;
--primary-1-l-50: #E58099;
--primary-1-l-75: #F2BFCC;
--primary-1-l-90: #fae6eb;
--primary-2-d-50: #2f3538;
--primary-2-d-25: #464f55;
--primary-2: #5E6A71;
--primary-2-l-25: #868F94;
--primary-2-l-50: #AEB4B8;
--primary-2-l-75: #D7DADB;
--primary-2-l-90: #eff0f1;
--accent-1-d-50: none;
--accent-1-d-25: none;
--accent-1: none;
--accent-1-l-25: none;
--accent-1-l-50: none;
--accent-1-l-75: none;
--accent-1-l-90: none;
--accent-2-d-50: none;
--accent-2-d-25: none;
--accent-2: none;
--accent-2-l-25: none;
--accent-2-l-50: none;
--accent-2-l-75: none;
--accent-2-l-90: none;
--accent-3-d-50: none;
--accent-3-d-25: none;
--accent-3: none;
--accent-3-l-25: none;
--accent-3-l-50: none;
--accent-3-l-75: none;
--accent-3-l-90: none;
--accent-4-d-50: none;
--accent-4-d-25: none;
--accent-4: none;
--accent-4-l-25: none;
--accent-4-l-50: none;
--accent-4-l-75: none;
--accent-4-l-90: none;
--accent-5-d-50: none;
--accent-5-d-25: none;
--accent-5: none;
--accent-5-l-25: none;
--accent-5-l-50: none;
--accent-5-l-75: none;
--accent-5-l-90: none;
--accent-6-d-50: none;
--accent-6-d-25: none;
--accent-6: none;
--accent-6-l-25: none;
--accent-6-l-50: none;
--accent-6-l-75: none;
--accent-6-l-90: none;
--success: #22CB86;
--warning: #FFBE00;
--error: #D61616;
--text-color: var(--black);
--inverted-text-color: var(--white);
--link-color: #0069B9;
--link-hover-color: #00518e;
--premium-report-color: #cc0033;
--eu-rating-color: #fc7822;
// COLORS OUTLOOKS
--outlook-positive: #56B94D;
--outlook-negative: #ED4740;
--outlook-stable: #FFBC20;
--outlook-evolving: #83A7FF;
// COMPONENTS
// ACCORDION
--accordion-icon-color: var(--text-color);
// ANALYSTS
--analysts-expander-background: var(--white);
--analysts-expander-color: var(--black);
--analysts-quote-color: var(--very-light-grey);
// BACK TO TOP
--back-to-top-position: absolute;
--back-to-top-bottom: -4.1rem;
--back-to-top-left: 50%;
--back-to-top-transform: rotate(45deg) translateX(-50%);
--back-to-top-width: 4.8rem;
--back-to-top-height: 4.8rem;
--back-to-top-background: var(--black);
--back-to-top-hover-background: var(--very-dark-grey);
--back-to-top-border-radius: 0px;
--back-to-top-shadow: 0 0 2.4rem rgba(255,255,255,.5);
--back-to-top-hover-shadow: 0 0 2.4rem rgba(0, 0, 0, 0.3);
--back-to-top-color: var(--white);
--back-to-top-hover-color: var(--white);
--back-to-top-i-transform: rotate(-45deg) translate(-50%, -50%);
--back-to-top-i-transform-origin: top left;
--back-to-top-i-font-size: var(--font-size-1);
// BANNER / PAGE HEADER
--banner-width: 100%;
--banner-height: 80vh;
--banner-max-height: 84rem;
--banner-margin: 0;
--banner-heading-size: 6rem;
--banner-heading-margin: 2rem;
--banner-heading-sub-size: 1.6rem;
--banner-heading-sub-margin: 2.2rem;
--banner-paragraph-size: 1.8rem;
--banner-paragraph-margin: 2.4rem;
--banner-text-max-width: 76rem;
--banner-text-margin: 0 0 0 7.2rem;
--banner-text-padding: 0 2.4rem 0 0;
--banner-grid-background: var(--primary-1);
// BRAND NAVIGATION
--brand-navigation-dropdown-width: 24rem;
--brand-navigation-dropdown-padding: 0.9rem 0;
--brand-navigation-dropdown-background: var(--white);
--brand-navigation-dropdown-link-padding: 0.9rem 1.8rem;
--brand-navigation-dropdown-link-background: var(--white);
--brand-navigation-dropdown-link-hover-background: var(--primary-2);
--brand-navigation-dropdown-link-color: var(--black);
--brand-navigation-dropdown-link-hover-color: var(--white);
// BUTTONS
--button-width-fixed: 20rem;
--button-padding: 1.5rem 1.8rem;
--button-font-size: 1.5rem;
--button-font-weight: var(--bold);
--button-letter-spacing: 0;
--button-line-height: 1;
--button-text-transform: uppercase;
--button-border: 0 none;
--button-border-radius: 0.5rem;
.column__left,
.column__right {
--button-padding: 1.1rem 1.4rem;
--button-font-size: 1.4rem;
}
.button--1 {
--button-background: #00cc99;
--button-border: #00cc99;
--button-color: var(--white);
--button-hover-background: #00e0a8;
--button-hover-border: #00e0a8;
--button-hover-color: var(--white);
}
.button--2 {
--button-background: var(--white);
--button-border: var(--white);
--button-color: var(--black);
--button-hover-background: var(--mostly-white);
--button-hover-border: var(--mostly-white);
--button-hover-color: var(--black);
}
.button--3 {
--button-background: transparent;
--button-border: var(--white);
--button-color: var(--white);
--button-hover-background: var(--white);
--button-hover-border: var(--white);
--button-hover-color: var(--black);
}
.button--4 {
--button-background: transparent;
--button-border: var(--black);
--button-color: var(--black);
--button-hover-background: var(--black);
--button-hover-border: var(--black);
--button-hover-color: var(--white);
}
.button--5 {
--button-background: var(--very-light-grey);
--button-border: var(--very-light-grey);
--button-color: var(--black);
--button-hover-background: #e5e5e5;
--button-hover-border: #e5e5e5;
--button-hover-color: var(--black);
}
.button--6 {
--button-background: transparent;
--button-border: transparent;
--button-color: #0069B9;
--button-hover-background: transparent;
--button-hover-border: transparent;
--button-hover-color: #0377cf;
}
// BUTTON ACTION
--button-action-padding: 0.7rem 1.5rem;
--button-action-font-size: 1.2rem;
--button-action-border-radius: 1.2rem;
.button--action-1 {
--button-background: #2a8abf;
--button-border: #2a8abf;
--button-color: var(--black);
--button-hover-background: transparent;
--button-hover-border: transparent;
--button-hover-color: var(--black);
}
.button--action-2 {
--button-background: var(--white);
--button-border: var(--very-light-grey);
--button-color: var(--black);
--button-hover-background: var(--mostly-white);
--button-hover-border: var(--very-light-grey);
--button-hover-color: var(--black);
}
.button--action-3 {
--button-background: #46a3d6;
--button-border: #46a3d6;
--button-color: var(--black);
--button-hover-background: #46a3d6;
--button-hover-border: #46a3d6;
--button-hover-color: var(--black);
}
// BUTTON SVG
--button-svg-background: var(--white);
--button-svg-background-hover: var(--mostly-white);
// BUTTON LOGIN
--button-login-padding: 0.5rem 0.9rem;
--button-login-font-size: 1.4rem;
--button-login-font-weight: var(--bold);
--button-login-letter-spacing: 0;
--button-login-line-height: 1.1;
--button-login-text-transform: uppercase;
--button-login-border: 0 none;
--button-login-border-radius: 1.2rem;
--button-login-background: #2a8abf;
--button-login-color: var(--white);
--button-login-background-hover: #46a3d6;
--button-login-color-hover: var(--mostly-white);
// CARD
--card-margin-bottom: var(--spacing-2);
--card-padding-bottom: var(--spacing-2);
--card-border: 0.1rem solid var(--border-color);
--card-border-radius: var(--border-radius);
--card-text-align: center;
--card-image-spacing: var(--spacing-3);
--card-image-ratio: 16/9;
--card-content-padding: 0 var(--spacing-2);
// CAROUSEL
--carousel-controls-background: rgba(208, 208, 208, 0.84);
--carousel-controls-hover-background: rgba(248,248,248,0.6);
--carousel-pager-dot-background: var(--black);
--carousel-pager-dot-border: var(--black);
--carousel-pager-dot-hover-background: var(--feature-color);
--carousel-pager-dot-hover-border: var(--feature-color);
--carousel-pager-dot-active-background: transparent;
--carousel-pager-dot-active-border: var(--black);
--carousel-pager-card-background: rgba(0,0,0,0.6);
--carousel-pager-card-hover-background: rgba(0,0,0,0.4);
--carousel-text-color: var(--white);
// EVENTS
--event-filter-active-color: var(--feature-color);
--event-filter-hover-color: var(--feature-hover-color);
--event-teaser-background: var(--primary-1);
--event-teaser-map-background: var(--mostly-white);
--event-teaser-color: var(--white);
--event-listing-background-image: url('https://www.fitch.group/sites/default/files/background-image/GettyImages-652232222.jpg');
// FIGURE
--figure-text-align: center;
--figure-number-margin-bottom: var(--spacing-1);
--figure-number-size: 7.2rem;
--figure-number-weight: var(--bold);
--filter-number-transform: none;
--figure-number-color: var(--text-color);
--figure-title-margin-bottom: calc(var(--spacing-1) / 2);
--figure-title-size: var(--font-size-1);
--figure-title-weight: var(--bold);
--filter-title-transform: uppercase;
--figure-title-color: var(--text-color);
--figure-text-margin-bottom: var(--spacing-1);
--filter-text-transform: none;
--figure-text-size: var(--font-size-1);
--figure-text-weight: normal;
--figure-text-color: var(--text-color);
// FORM
--form-required: var(--error);
--form-error-background: var(--error);
--form-error-border: 0.1rem solid var(--error);
--form-button-position: right;
// KEY HIGHLIGHT
--key-highlight-padding: 3.6rem var(--spacing-2);
// KEY POINT
--key-point-margin: 0 calc(50% - 50vw);
--key-point-padding: 10.8rem var(--spacing-2);
--key-point-font-size: 1.8rem;
// LEADERSHIP
--leadership-background: #c7c7c74d;
// NAVIGATION
--navigation-burger-background: var(--black);
--navigation-burger-active-background: var(--black);
--navigation-font-size: 1.4rem;
--navigation-font-weight: var(--bold);
--navigation-text-transform: uppercase;
--navigation-color: var(--black);
--navigation-link-color: var(--black);
--navigation-link-hover-color: var(--grey);
.header--inverted {
--navigation-color: var(--white);
--navigation-link-color: var(--white);
}
// NAVIGATION DROPDOWN
--navigation-dropdown-top: 4.1rem;
--navigation-dropdown-width: 26.4rem;
--navigation-dropdown-font-size: 1.6rem;
--navigation-dropdown-font-weight: var(--bold);
--navigation-dropdown-line-height: 1.2;
--navigation-dropdown-text-align: left;
--navigation-dropdown-text-transform: none;
--navigation-dropdown-background: #eff0f1;
--navigation-dropdown-color: var(--black);
.menu-level--1 {
--navigation-dropdown-background: #eff0f1;
--navigation-dropdown-hover-background: #e4e4e4;
--navigation-dropdown-active-background: #e4e4e4;
--navigation-dropdown-color: var(--black);
--navigation-dropdown-hover-color: var(--black);
--navigation-dropdown-border: 0px none;
}
.menu-level--2 {
--navigation-dropdown-background: #D7DADB;
--navigation-dropdown-hover-background: #d1d2d2;
--navigation-dropdown-active-background: #d1d2d2;
--navigation-dropdown-color: var(--black);
--navigation-dropdown-hover-color: var(--black);
--navigation-dropdown-border: 0px none;
}
.menu-level--3 {
--navigation-dropdown-background: #AEB4B8;
--navigation-dropdown-hover-background: #9fa4a7;
--navigation-dropdown-active-background: #9fa4a7;
--navigation-dropdown-color: var(--black);
--navigation-dropdown-hover-color: var(--black);
--navigation-dropdown-border: 0px none;
}
// NAVIGATION OVERLAY
--navigation-overlay-teaser-color: #000000;
// OVERLAY
--overlay-background: var(--mostly-black);
--overlay-header-background: transparent;
--overlay-content-background: var(--white);
--overlay-opacity: 0.44;
// PAGER
--pager-background: var(--white);
--pager-hover-background: var(--mostly-white);
--pager-active-background: var(--feature-color);
--pager-border: var(--very-light-grey);
--pager-text-color: var(--black);
--pager-hover-text-color: var(--black);
--pager-active-text-color: var(--white);
// PROFILE BANNER
--profile-banner-background: #eff0f1;
// QUOTE
--quote-font-size: 3.6rem;
--quote-font-weight: 300;
--quote-color: var(--feature-color);
// SEARCH
--search-placeholder: var(--very-light-grey);
--search-border: var(--black);
--search-bar-margin: 4.4rem 0 1.7rem;
--search-tools-padding: 0 1.2rem;
// SOCIAL ICONS
--social-icon-margin-top: 0;
--social-icon-font-size: 3.6rem;
// TABS
--tab-padding: 1.2rem 1.2rem 2.4rem;
--tab-button-hover-background: var(--mostly-white);
--tab-button-active-background: #171721;
--tab-button-hover-color: var(--text-color);
--tab-button-active-color: var(--white);
--tab-button-border: #171721;
--tab-text-align: left;
--tab-text-transform: uppercase;
--tab-text-hover-color: var(--grey);
--tab-text-active-border: var(--feature-color);
// TAGS
--tag-wrapper-margin: 1.8rem 0 12rem;
--tag-background: var(--very-light-grey);
--tag-margin: 0.6rem 0.3rem;
--tag-padding: 0.4rem 0.8rem;
// LAYOUT
// SIDE BAR
--side-bar-width: 0px;
--side-bar-height: 100vh;
--side-bar-padding: 0px;
--side-bar-background: var(--mostly-black);
--side-bar-color: var(--white);
// TOP BAR
--top-bar-background: var(--black);
--top-bar-color: var(--white);
// HEADER
--header-spacing: 3rem;
--region-logo-width: 27.6rem;
--region-nav-width: calc(100% - 55.2rem);
--region-nav-text-align: center;
--region-user-width: 27.6rem;
--region-user-text-align: center;
// MAIN
--main-spacing: 19.1rem;
--main-height: calc(100vh - 28.4rem);
.header--sticky + .main,
.header--sticky + div .main {
--main-spacing: 0px;
}
// FOOTER
--footer-legal-padding: 2.4rem 0;
--footer-links-background: var(--mostly-black);
--footer-legal-background: var(--black);
--footer-color: var(--white);
--footer-links-padding: 9.6rem 0;
--footer-link-color: #aaaaaa;
--footer-link-hover-color: #d2d2d2;
// SECTION
--section-spacing: 5.4rem;
--section-background: var(--white);
--section-full-height: 84rem;
.section--padding-1 {
--section-padding: 10.8rem 0;
}
.section--padding-2 {
--section-padding: 5.4rem 4.8rem;
}
.section--padding-3 {
--section-padding: 3.6rem 2.4rem;
}
// WRAPPER
--wrapper-1: 136.8rem;
--wrapper-2: 106.8rem;
--wrapper-3: 76.8rem;
// GRID
--grid-column-gap: 2.4rem;
--grid-row-gap: 2.4rem;
--grid-padding-1: 3.6rem 2.4rem;
--grid-padding-2: 5.4rem 4.8rem;
--grid-padding-3: 0 2.4rem;
// COLUMN
--column-padding: 1.2rem;
// PAGE LAYOUT
// PAGE LAYOUT 1
--page-layout-1-lmr-l-width: 23.63%;
--page-layout-1-lmr-l-padding-right: var(--spacing-3);
--page-layout-1-lmr-m-width: 49%;
--page-layout-1-lmr-r-width: 23.63%;
--page-layout-1-lmr-r-padding-left: var(--spacing-3);
--page-layout-1-lm-l-width: 30rem;
--page-layout-1-lm-l-padding-right: var(--spacing-3);
--page-layout-1-lm-m-width: calc(100% - 30rem);
--page-layout-1-mr-m-width: calc(100% - 30rem);
--page-layout-1-mr-r-width: 30rem;
--page-layout-1-mr-r-padding-left: var(--spacing-3);
// PAGE LAYOUT 2
--page-layout-2-lmr-l-width: 13.18%;
--page-layout-2-lmr-l-margin-top: 5.4rem;
--page-layout-2-lmr-l-padding-right: 0;
--page-layout-2-lmr-m-width: 63.18%;
--page-layout-2-lmr-m-margin-top: 0;
--page-layout-2-lmr-m-padding-right: 17.1rem;
--page-layout-2-lmr-r-width: 23.63%;
--page-layout-2-lmr-r-margin-top: var(--spacing-3);
--page-layout-2-lm-l-width: 13.18%;
--page-layout-2-lm-l-margin-top: 0;
--page-layout-2-lm-l-padding-right: 0;
--page-layout-2-lm-m-width: calc(100% - 13.18%);
--page-layout-2-lm-m-margin-top: 0;
--page-layout-2-mr-m-width: 74.54%;
--page-layout-2-mr-m-margin-top: 0;
--page-layout-2-mr-m-padding-right: 4.8rem;
--page-layout-2-mr-r-width: 23.63%;
--page-layout-2-mr-r-margin-top: 0;
// PAGE LAYOUT 3
--page-layout-3-lmr-l-width: 300px;
--page-layout-3-lmr-l-padding-right: var(--spacing-3);
--page-layout-3-lmr-m-width: calc(100% - 500px);
--page-layout-3-lmr-r-width: 200px;
--page-layout-3-lmr-r-padding-left: var(--spacing-3);
--page-layout-3-lm-l-width: 300px;
--page-layout-3-lm-l-padding-right: var(--spacing-3);
--page-layout-3-lm-m-width: calc(100% - 300px);
--page-layout-3-mr-m-width: calc(100% - 200px);
--page-layout-3-mr-m-padding-right: var(--spacing-3);
--page-layout-3-mr-r-width: 200px;
// ARTICLE
--header-article-spacing: 0px
}
[data-brand="fitch-group"] {
// HEADINGS
--header-spacing: 3rem;
// BACKGROUND COLORS
--gradient-background: linear-gradient(108deg, #0f2027 0%, #203a43 33%, #2c5364 100%);
--gradient-background-ie: linear-gradient(135deg, #131919 0, #271f0e 100%);
// COLORS
--feature-color: var(--accent-1);
--primary-1-d-50: #660019;
--primary-1-d-25: #990026;
--primary-1: #cc0033;
--primary-1-l-25: #D94066;
--primary-1-l-50: #E58099;
--primary-1-l-75: #F2BFCC;
--primary-1-l-90: #fae6eb;
--primary-2-d-50: #2f3538;
--primary-2-d-25: #464f55;
--primary-2: #5E6A71;
--primary-2-l-25: #868F94;
--primary-2-l-50: #AEB4B8;
--primary-2-l-75: #D7DADB;
--primary-2-l-90: #eff0f1;
--primary-3-d-50: #686a69;
--primary-3-d-25: #9d9f9e;
--primary-3: #D1D4D3;
--primary-3-l-25: #dddfde;
--primary-3-l-50: #e8eae9;
--primary-3-l-75: #f3f4f4;
--primary-3-l-90: #fafbfb;
--primary-4-d-50: #191919;
--primary-4-d-25: #262626;
--primary-4: #333333;
--primary-4-l-25: #666666;
--primary-4-l-50: #999999;
--primary-4-l-75: #cccccc;
--primary-4-l-90: #ebebeb;
--accent-1-d-50: #0b0b10;
--accent-1-d-25: #111119;
--accent-1: #171721;
--accent-1-l-25: #515159;
--accent-1-l-50: #8b8b90;
--accent-1-l-75: #c5c5c7;
--accent-1-l-90: #e8e8e9;
--accent-2-d-50: #1f1f2d;
--accent-2-d-25: #2f2f44;
--accent-2: #3f3f5b;
--accent-2-l-25: #6f6f84;
--accent-2-l-50: #9f9fad;
--accent-2-l-75: #cfcfd6;
--accent-2-l-90: #ececef;
--accent-3-d-50: #7f1731;
--accent-3-d-25: #bf234a;
--accent-3: #ff2f63;
--accent-3-l-25: #ff638a;
--accent-3-l-50: #ff97b1;
--accent-3-l-75: #ffcbd8;
--accent-3-l-90: #ffebf0;
--accent-4-d-50: #7f6a00;
--accent-4-d-25: #bfa000;
--accent-4: #ffd500;
--accent-4-l-25: #ffe040;
--accent-4-l-50: #ffea80;
--accent-4-l-75: #fff4bf;
--accent-4-l-90: #fffbe6;
// COMPONENTS
// EVENTS
--event-filter-active-color: var(--accent-4);
--event-filter-hover-color: var(--accent-4);
--event-teaser-background: var(--accent-1);
// PAGER
--pager-active-background: var(--feature-color);
// TABS
--tab-button-active-background: #171721;
// LAYOUT
// SIDE BAR
--side-bar-width: 12rem;
--side-bar-padding: 1.2rem;
// MAIN
--main-height: calc(100vh - 7.012rem);
}
[data-brand="fitch-ratings"] {
// FONTS
--heading-weight-3: 300;
// BACKGROUND COLORS
--gradient-background: linear-gradient(108deg, #3e5151 0%,#decba4 100%);
--gradient-background-ie: linear-gradient(135deg, #131919 0, #271f0e 100%);
// COLORS
--feature-color: var(--accent-1);
--primary-1-d-50: #660019;
--primary-1-d-25: #990026;
--primary-1: #cc0033;
--primary-1-l-25: #D94066;
--primary-1-l-50: #E58099;
--primary-1-l-75: #F2BFCC;
--primary-1-l-90: #fae6eb;
--primary-2-d-50: #2f3538;
--primary-2-d-25: #464f55;
--primary-2: #5E6A71;
--primary-2-l-25: #868F94;
--primary-2-l-50: #AEB4B8;
--primary-2-l-75: #D7DADB;
--primary-2-l-90: #eff0f1;
--primary-3-d-50: #686a69;
--primary-3-d-25: #9d9f9e;
--primary-3: #D1D4D3;
--primary-3-l-25: #dddfde;
--primary-3-l-50: #e8eae9;
--primary-3-l-75: #f3f4f4;
--primary-3-l-90: #fafbfb;
--primary-4-d-50: #191919;
--primary-4-d-25: #262626;
--primary-4: #333333;
--primary-4-l-25: #666666;
--primary-4-l-50: #999999;
--primary-4-l-75: #cccccc;
--primary-4-l-90: #ebebeb;
--accent-1-d-50: #0b0b10;
--accent-1-d-25: #111119;
--accent-1: #171721;
--accent-1-l-25: #515159;
--accent-1-l-50: #8b8b90;
--accent-1-l-75: #c5c5c7;
--accent-1-l-90: #e8e8e9;
--accent-2-d-50: #1f1f2d;
--accent-2-d-25: #2f2f44;
--accent-2: #3f3f5b;
--accent-2-l-25: #6f6f84;
--accent-2-l-50: #9f9fad;
--accent-2-l-75: #cfcfd6;
--accent-2-l-90: #ececef;
--accent-3-d-50: #7f1731;
--accent-3-d-25: #bf234a;
--accent-3: #ff2f63;
--accent-3-l-25: #ff638a;
--accent-3-l-50: #ff97b1;
--accent-3-l-75: #ffcbd8;
--accent-3-l-90: #ffebf0;
--accent-4-d-50: #7f6a00;
--accent-4-d-25: #bfa000;
--accent-4: #ffd500;
--accent-4-l-25: #ffe040;
--accent-4-l-50: #ffea80;
--accent-4-l-75: #fff4bf;
--accent-4-l-90: #fffbe6;
// COMPONENTS
// EVENTS
--event-filter-active-color: var(--accent-4);
--event-filter-hover-color: var(--accent-4);
--event-listing-background-image: url('https://images.ctfassets.net/03fbs7oah13w/1duv1G8KG9R9YS70znGcwt/d7f31c88d7e9c46e5034e4dc8477a0c4/fr-page-header-001.jpg');
--event-teaser-background: var(--accent-1);
// PAGER
--pager-active-background: var(--feature-color);
// TABS
--tab-button-active-background: #171721;
// LAYOUT
// HEADER
--header-spacing: 3rem;
--region-logo-width: 35rem;
--region-nav-width: calc(100% - 70rem);
--region-user-width: 35rem;
// SEARCH
--search-tools-padding: 0;
// SIDE BAR
--side-bar-width: 24rem;
--side-bar-padding: 1.2rem 2.4rem;
// PAGE LAYOUT
// PAGE LAYOUT 2
--page-layout-2-lmr-m-padding-right: 10.7rem;
--page-layout-2-mr-m-padding-right: 10.7rem;
}
[data-brand="fitch-solutions"] {
// FONTS
--bold: 700;
// HEADING
h1,.heading--1 {--heading-weight: 300;}
h2,.heading--2 {--heading-weight: 300;}
h3,.heading--3 {--heading-weight: 300;}
h4,.heading--4 {--heading-weight: 700;}
// BACKGROUND COLORS
--gradient-background: linear-gradient(108deg, #afc0e7 0%, var(--accent-4) 100%);
--gradient-background-ie: linear-gradient(135deg, #525b70 0, #686976 100%);
// COLORS
--feature-color: var(--primary-2);
--primary-1-d-50: #660019;
--primary-1-d-25: #990026;
--primary-1: #cc0033;
--primary-1-l-25: #d94066;
--primary-1-l-50: #e68099;
--primary-1-l-75: #f2bfcc;
--primary-1-l-90: #fae6eb;
--primary-2-d-50: #0b203a;
--primary-2-d-25: #113157;
--primary-2: #174174;
--primary-2-l-25: #517197;
--primary-2-l-50: #8ba0ba;
--primary-2-l-75: #c5cfdc;
--primary-2-l-90: #e8ecf1;
--accent-1-d-50: #161b27;
--accent-1-d-25: #22293a;
--accent-1: #2d374e;
--accent-1-l-25: #62697a;
--accent-1-l-50: #969ba7;
--accent-1-l-75: #cacdd3;
--accent-1-l-90: #eaebee;
--accent-2-d-50: #15455f;
--accent-2-d-25: #1f678f;
--accent-2: #2a8abf;
--accent-2-l-25: #5fa7cf;
--accent-2-l-50: #95c5df;
--accent-2-l-75: #cae2ef;
--accent-2-l-90: #eaf4f9;
--accent-3-d-50: #19667f;
--accent-3-d-25: #2699bf;
--accent-3: #33ccff;
--accent-3-l-25: #66d9ff;
--accent-3-l-50: #99e6ff;
--accent-3-l-75: #ccf2ff;
--accent-3-l-90: #ebfaff;
--accent-4-d-50: #6d6e79;
--accent-4-d-25: #a4a6b6;
--accent-4: #dbddf3;
--accent-4-l-25: #e4e6f6;
--accent-4-l-50: #edeef9;
--accent-4-l-75: #f6f6fc;
--accent-4-l-90: #fbfcfe;
--accent-5-d-50: #191919;
--accent-5-d-25: #262626;
--accent-5: #333333;
--accent-5-l-25: #666666;
--accent-5-l-50: #999999;
--accent-5-l-75: #cccccc;
--accent-5-l-90: #ebebeb;
--accent-6-d-50: #444444;
--accent-6-d-25: #666666;
--accent-6: #888888;
--accent-6-l-25: #a6a6a6;
--accent-6-l-50: #c4c4c4;
--accent-6-l-75: #e1e1e1;
--accent-6-l-90: #f3f3f3;
// COMPONENTS
// ANALYSTS
--analysts-expander-background: var(--feature-color);
--analysts-expander-color: var(--white);
--analysts-quote-color: var(--accent-3);
// BANNER
--banner-grid-background: var(--primary-2);
// BUTTONS
--button-font-weight: 900;
.button--action-2 {
--button-hover-background: var(--black);
--button-hover-border: var(--black);
--button-hover-color: var(--white);
}
// EVENTS
--event-filter-active-color: #ffd500;
--event-filter-hover-color: #ffd500;
--event-listing-background-image: url('https://your.fitchsolutions.com/rs/732-CKH-767/images/170096240.jpg');
--event-teaser-background: var(--primary-2);
// NAVIGATION
--navigation-burger-active-background: var(--white);
// PAGER
--pager-active-background: var(--feature-color);
// SEARCH
--search-bar-margin: 4.4rem 0 1.7rem;
// SOCIAL ICONS
// --social-icon-margin-top: 21rem;
--social-icon-font-size: 3rem;
// TABS
--tab-button-active-background: var(--feature-color);
// LAYOUT
// HEADER
--header-spacing: 0px;
--region-logo-width: 30rem;
--region-nav-width: calc(100% - 70rem);
--region-user-width: 40rem;
// PAGE LAYOUT
// PAGE LAYOUT 2
// --page-layout-2-lmr-l-width: 7.5%;
// --page-layout-2-lmr-l-margin-top: 0;
// --page-layout-2-lmr-m-width: 62%;
// --page-layout-2-lmr-m-padding-right: 3rem;
// --page-layout-2-lmr-r-width: 30.5%;
// --page-layout-2-lmr-r-margin-top: 0;
// --page-layout-2-mr-m-padding-right: 3rem;
}
[data-brand="fitch-learning"] {
// FONTS
--font-family: Interface, arial, sans-serif;
--bold: 600;
// HEADINGS
h1,.heading--1 {--heading-weight: 200;}
h2,.heading--2 {--heading-weight: 200;}
h3,.heading--3 {--heading-weight: 200;}
h4,.heading--4 {--heading-weight: 400;}
h5,.heading--5 {--heading-weight: 400;}
h6,.heading--6 {--heading-weight: 600;}
// BACKGROUND COLORS
--gradient-background: linear-gradient(108deg, #7b797d 0%, #7e8687 100%);
--gradient-background-ie: linear-gradient(135deg, #363437 0%, #363c3c 100%);
// COLORS
--feature-color: var(--primary-1-l-25);
--primary-1-d-50: #1d132f;
--primary-1-d-25: #2c1c46;
--primary-1: #3b265e;
--primary-1-l-25: #6c5c86;
--primary-1-l-50: #9D92AE;
--primary-1-l-75: #CEC9D7;
--primary-1-l-90: #eceaef;
--primary-2-d-50: #003d43;
--primary-2-d-25: #005b65;
--primary-2: #007A87;
--primary-2-l-25: #409BA5;
--primary-2-l-50: #80BCC3;
--primary-2-l-75: #BFDEE1;
--primary-2-l-90: #e6f2f3;
--accent-1-d-50: #6d7175;
--accent-1-d-25: #a3aaaf;
--accent-1: #DAE3EA;
--accent-1-l-25: #E3EAEF;
--accent-1-l-50: #ECF1F4;
--accent-1-l-75: #F6F8FA;
--accent-1-l-90: #fbfcfd;
--accent-2-d-50: #2f3538;
--accent-2-d-25: #464f55;
--accent-2: #5E6A71;
--accent-2-l-25: #868F94;
--accent-2-l-50: #AEB4B8;
--accent-2-l-75: #D7DADB;
--accent-2-l-90: #eff0f1;
--accent-3-d-50: #660019;
--accent-3-d-25: #990026;
--accent-3: #CC0033;
--accent-3-l-25: #D94066;
--accent-3-l-50: #E58099;
--accent-3-l-75: #F2BFCC;
--accent-3-l-90: #fae6eb;
--accent-4-d-50: #002e5c;
--accent-4-d-25: #00458b;
--accent-4: #005CB9;
--accent-4-l-25: #4085CA;
--accent-4-l-50: #80ADDC;
--accent-4-l-75: #BFD6ED;
--accent-4-l-90: #e6eff8;
--accent-5-d-50: #020407;
--accent-5-d-25: #03070a;
--accent-5: #04090E;
--accent-5-l-25: #434A51;
--accent-5-l-50: #7C8186;
--accent-5-l-75: #BBBDC0;
--accent-5-l-90: #e6e7e7;
--text-color: #333333;
// COMPONENTS
// BANNER
--banner-width: calc(100% - 4.8rem);
--banner-margin: 0 2.4rem;
--banner-grid-background: var(--primary-2);
// BUTTONS
--button-padding: 1.8rem 3rem;
--button-font-size: 1.4rem;
--button-font-weight: 900;
--button-letter-spacing: 0.2rem;
--button-line-height: 1.2;
.column__left,
.column__right {
--button-padding: 1.4rem 2.6rem;
--button-font-size: 1.3rem;
}
.button--1 {
--button-background: var(--primary-2);
--button-border: var(--primary-2);
--button-color: var(--white);
--button-hover-background: var(--primary-2-l-25);
--button-hover-border: var(--primary-2-l-25);
--button-hover-color: var(--white);
}
.button--2 {
--button-background: var(--white);
--button-border: var(--white);
--button-color: var(--black);
--button-hover-background: var(--mostly-white);
--button-hover-border: var(--mostly-white);
--button-hover-color: var(--black);
}
.button--3 {
--button-background: transparent;
--button-border: var(--white);
--button-color: var(--white);
--button-hover-background: var(--white);
--button-hover-border: var(--white);
--button-hover-color: var(--black);
}
.button--4 {
--button-background: transparent;
--button-border: var(--black);
--button-color: var(--black);
--button-hover-background: var(--black);
--button-hover-border: var(--black);
--button-hover-color: var(--white);
}
.button--5 {
--button-background: var(--very-light-grey);
--button-border: var(--very-light-grey);
--button-color: var(--black);
--button-hover-background: #e5e5e5;
--button-hover-border: #e5e5e5;
--button-hover-color: var(--black);
}
.button--6 {
--button-background: transparent;
--button-border: transparent;
--button-color: var(--accent-4);
--button-hover-background: transparent;
--button-hover-border: transparent;
--button-hover-color: var(--accent-4-l-25);
}
// EVENTS
--event-filter-active-color: #ffd500;
--event-filter-hover-color: #ffd500;
--event-listing-background-image: url('https://your.fitchlearning.com//rs/732-CKH-767/images/fitch-learning-events.jpg');
// FIGURE
--figure-number-color: var(--primary-2);
// PAGER
--pager-active-background: var(--feature-color);
// TABS
--tab-button-active-background: var(--feature-color);
// LAYOUT
// HEADER
--header-spacing: 0rem;
.header {
height: 10rem;
padding: 1.2rem 0;
}
// MAIN
--main-spacing: 10rem;
// ARTICLE
--header-article-spacing: 10rem;
}
[data-brand="fitch-bohua"] {
// FONTS
--font-family: 'PingFang SC', 'Microsoft Yahei';
--font-weight: normal;
--bold: bold;
// BACKGROUND COLORS
--gradient-background: linear-gradient(135deg, #403b4a 0%, #e7e9bb 100%);
--gradient-background-ie: linear-gradient(135deg, #131919 0, #271f0e 100%);
// COLORS
--feature-color: var(--primary-1);
--primary-1-d-50: #0d355a;
--primary-1-d-25: #135087;
--primary-1: #1A6BB4;
--primary-1-l-25: #5390c7;
--primary-1-l-50: #8db5da;
--primary-1-l-75: #c6daec;
--primary-1-l-90: #e9f0f8;
--primary-2-d-50: #6e7179;
--primary-2-d-25: #a6aab5;
--primary-2: #dde3f2;
--primary-2-l-25: #e6eaf5;
--primary-2-l-50: #eef1f9;
--primary-2-l-75: #f6f8fc;
--primary-2-l-90: #fcfcfe;
// COMPONENTS
// ANALYSTS
--analysts-expander-background: var(--feature-color);
--analysts-expander-color: var(--white);
--analysts-quote-color: var(--accent-3);
// EVENTS
--event-filter-active-color: #ffd500;
--event-filter-hover-color: #ffd500;
--event-listing-background-image: url('https://your.fitchsolutions.com/rs/732-CKH-767/images/170096240.jpg');
// NAVIGATION DROPDOWN
--navigation-font-size: 1.6rem;
--navigation-burger-active-background: var(--white);
--navigation-dropdown-background: var(--primary-1);
--navigation-dropdown-color: var(--white);
.menu-level--1 {
--navigation-dropdown-background: var(--primary-1);
--navigation-dropdown-hover-background: var(--primary-1-l-25);
--navigation-dropdown-active-background: var(--primary-1-l-25);
--navigation-dropdown-color: var(--white);
--navigation-dropdown-hover-color: var(--white);
--navigation-dropdown-border: 0px none;
}
.menu-level--2 {
--navigation-dropdown-background: var(--primary-1-l-25);
--navigation-dropdown-hover-background: var(--primary-1-l-50);
--navigation-dropdown-active-background: var(--primary-1-l-50);
--navigation-dropdown-color: var(--white);
--navigation-dropdown-hover-color: var(--white);
--navigation-dropdown-border: 0px none;
}
.menu-level--3 {
--navigation-dropdown-background: var(--primary-1-l-50);
--navigation-dropdown-hover-background: var(--primary-1-l-75);
--navigation-dropdown-active-background: var(--primary-1-l-75);
--navigation-dropdown-color: var(--white);
--navigation-dropdown-hover-color: var(--very-dark-grey);
--navigation-dropdown-border: 0px none;
}
// PAGER
--pager-active-background: var(--feature-color);
// TABS
--tab-button-active-background: var(--primary-1-d-50);
// LAYOUT
// HEADER
--header-spacing: 0px;
}
[data-brand="sustainable-fitch"] {
// BACKGROUND COLORS
--background-color: var(--mostly-white);
--selection-background: yellow;
--gradient-background: linear-gradient(108deg, var(--primary-1-l-50) 0%, var(--accent-3-l-50) 100%);
--gradient-background-ie: linear-gradient(135deg, #344137 0, #514e39 100%);
// BORDER RADIUS
--border-radius: 1.2rem;
// COLORS
--feature-color: var(--primary-1);
--primary-1-d-50: #033f37;
--primary-1-d-25: #045f53;
--primary-1: #067F6F;
--primary-1-l-25: #449f93;
--primary-1-l-50: #83bfb7;
--primary-1-l-75: #c1dfdb;
--primary-1-l-90: #e7f2f1;
--accent-1-d-50: #39652e;
--accent-1-d-25: #559845;
--accent-1: #72cb5c;
--accent-1-l-25: #95d885;
--accent-1-l-50: #b9e5ae;
--accent-1-l-75: #dcf2d6;
--accent-1-l-90: #f1faef;
--accent-2-d-50: #366175;
--accent-2-d-25: #5292af;
--accent-2: #6dc3ea;
--accent-2-l-25: #92d2ef;
--accent-2-l-50: #b6e1f5;
--accent-2-l-75: #daf0fa;
--accent-2-l-90: #f1f9fd;
--accent-3-d-50: #75672b;
--accent-3-d-25: #b09a40;
--accent-3: #ebce56;
--accent-3-l-25: #f0da80;
--accent-3-l-50: #f5e7ab;
--accent-3-l-75: #faf3d5;
--accent-3-l-90: #fdfaee;
// COMPONENTS
// BANNER
--banner-text-margin: 0;
--banner-text-padding: 0;
--banner-grid-background: var(--primary-1);
// BUTTONS
.button--1 {
--button-background: var(--primary-1);
--button-border: var(--primary-1);
--button-color: var(--white);
--button-hover-background: var(--primary-1-l-2);
--button-hover-border: var(--primary-1-l-2);
--button-hover-color: var(--white);
}
// EVENTS
--event-filter-active-color: var(--accent-3);
--event-filter-hover-color: var(--accent-3-l-25);
--event-listing-background-image: url("https://images.ctfassets.net/03fbs7oah13w/6l3rAyD8KglUsH6O63oHkc/ca569493d8d7ce2b4f183cb6ed9ac018/GettyImages-1067689028.jpg");
// LOGO
.logo__wrapper {
margin-top: 0;
}
// NAVIGATION
--navigation-burger-active-background: var(--black);
--navigation-font-size: 1.6rem;
--navigation-font-weight: 700;
// NAVIGATION DROPDOWN
--navigation-dropdown-font-weight: 700;
--navigation-dropdown-background: #ffffff;
.menu-level--1 {
--navigation-dropdown-background: #ffffff;
--navigation-dropdown-hover-background: #ffffff;
--navigation-dropdown-active-background: #ffffff;
--navigation-dropdown-color: var(--black);
--navigation-dropdown-hover-color: var(--black);
--navigation-dropdown-border: 6px solid var(--primary-1);
}
.menu-level--2 {
--navigation-dropdown-background: #0d98831f;
--navigation-dropdown-hover-background: #0d98831f;
--navigation-dropdown-active-background: #0d98831f;
--navigation-dropdown-color: var(--black);
--navigation-dropdown-hover-color: var(--black);
--navigation-dropdown-border: 0px none;
}
.menu-level--3 {
--navigation-dropdown-background: #0d98831f;
--navigation-dropdown-hover-background: #0d98831f;
--navigation-dropdown-active-background: #0d98831f;
--navigation-dropdown-color: var(--black);
--navigation-dropdown-hover-color: var(--black);
--navigation-dropdown-border: 0px none;
}
// PAGER
--pager-active-background: var(--feature-color);
// TABS
--tab-button-active-background: var(--primary-1);
// LAYOUT
// HEADER
--header-spacing: 2.3rem;
--region-logo-width: 35rem;
--region-nav-width: calc(100% - 70rem);
--region-user-width: 35rem;
// PAGE LAYOUT
// PAGE LAYOUT 2
--page-layout-2-lmr-m-padding-right: 10.7rem;
--page-layout-2-mr-m-padding-right: 10.7rem;
}
[data-brand="global-credit-certificate"] {
// FONTS
--font-family: mulish, arial, sans-serif;
--bold: 800;
// HEADINGS
--heading-margin: var(--spacing-1);
--heading-tag-color: var(--primary-2);
h1,
.heading--1 {
--heading-size: 4.2rem;
--heading-weight: 200;
}
h2,
.heading--2 {
--heading-size: 3.2rem;
--heading-weight: 200;
}
h3,
.heading--3 {
--heading-size: 2.8rem;
--heading-weight: 200;
}
h4,
.heading--4 {
--heading-size: 2.2rem;
--heading-weight: 800;
}
h5,
.heading--5 {
--heading-size: 2rem;
--heading-weight: 800;
}
h6,
.heading--6 {
--heading-size: 1.8rem;
--heading-weight: 800;
}
// MARGIN / PADDING
--spacing-1: 1.5rem;
--spacing-2: 3rem;
--spacing-3: 4.5rem;
--spacing-4: 6rem;
--spacing-5: 7.5rem;
--spacing-6: 9rem;
// BACKGROUND COLORS
--gradient-background: linear-gradient(108deg, var(--primary-1-d-25) 0%, var(--primary-2-l-75) 100%);
--gradient-background-ie: linear-gradient(135deg, #302f31 0, #434753 100%);
--post-view-more-background: var(--primary-2-l-90);
--table-hover-background: var(--primary-1-l-90);
// BORDER COLORS
--border-color: var(--primary-1-l-75);
--table-border: var(--primary-1-l-5);
// BORDER RADIUS
--border-radius: 0;
// COLORS
--feature-color: var(--primary-2);
--primary-1-d-50: #191f24;
--primary-1-d-25: #252e36;
--primary-1: #323E48;
--primary-1-l-25: #656e76;
--primary-1-l-50: #999fa4;
--primary-1-l-75: #cccfd1;
--primary-1-l-90: #ebeced;
--primary-2-d-50: #003867;
--primary-2-d-25: #00559a;
--primary-2: #0071CE;
--primary-2-l-25: #4095da;
--primary-2-l-50: #80b8e7;
--primary-2-l-75: #bfdbf3;
--primary-2-l-90: #e6f1fa;
--accent-1-d-50: #00673e;
--accent-1-d-25: #009a5d;
--accent-1: #00ce7c;
--accent-1-l-25: #40da9d;
--accent-1-l-50: #80e7be;
--accent-1-l-75: #bff3de;
--accent-1-l-90: #e6faf2;
--accent-2-d-50: #4a3c69;
--accent-2-d-25: #705a9e;
--accent-2: #9578d3;
--accent-2-l-25: #b09ade;
--accent-2-l-50: #cabce9;
--accent-2-l-75: #e4ddf4;
--accent-2-l-90: #f5f2fb;
--accent-3-d-50: #722130;
--accent-3-d-25: #ac3248;
--accent-3: #e54360;
--accent-3-l-25: #ec7288;
--accent-3-l-50: #f2a1b0;
--accent-3-l-75: #f8d0d7;
--accent-3-l-90: #fcedef;
--accent-4-d-50: #7f5200;
--accent-4-d-25: #bf7b00;
--accent-4: #ffa400;
--accent-4-l-25: #ffbb40;
--accent-4-l-50: #ffd280;
--accent-4-l-75: #ffe8bf;
--accent-4-l-90: #fff6e6;
--accent-5-d-50: #7f6820;
--accent-5-d-25: #bf9c30;
--accent-5: #ffd040;
--accent-5-l-25: #ffdc70;
--accent-5-l-50: #ffe8a0;
--accent-5-l-75: #fff3cf;
--accent-5-l-90: #fffaec;
--accent-6-d-50: #6b6865;
--accent-6-d-25: #a09d97;
--accent-6: #d6d1ca;
--accent-6-l-25: #e0ddd7;
--accent-6-l-50: #ebe8e5;
--accent-6-l-75: #f5f3f2;
--accent-6-l-90: #fbfafa;
--text-color: var(--primary-1-d-50);
--link-color: var(--primary-2);
--link-hover-color: var(--primary-2-d-25);
// COMPONENTS
// ACCORDION
--accordion-icon-color: var(--primary-2);
// ANALYSTS
--analysts-expander-background: var(--primary-2-l-90);
--analysts-expander-color: var(--primary-1-d-50);
// BANNER / PAGE HEADER
--banner-height: 45vh;
--banner-max-height: 45rem;
--banner-heading-size: 4.5rem;
// BUTTONS
--button-letter-spacing: 1px;
--button-border-radius: 0;
.button--1,
.mktoButton,
.button--primary-2,
.form-submit:not(.search__submit) {
--button-background: var(--primary-2);
--button-border: var(--primary-2);
--button-color: var(--white);
--button-hover-background: var(--primary-2-d-25);
--button-hover-border: var(--primary-2-d-25);
--button-hover-color: var(--white);
}
.button--4 {
--button-border: var(--primary-1);
--button-hover-background: var(--primary-1-d-25);
--button-hover-border: var(--primary-1-d-25);
}
// BUTTON LOGIN
--button-login-padding: 1rem 1.5rem;
--button-login-line-height: 1;
--button-login-border-radius: 0;
--button-login-background: var(--primary-2);
--button-login-background-hover: var(--primary-2-d-25);
// CARD
--card-padding-bottom: 0;
--card-text-align: left;
// EVENTS
--event-filter-active-color: var(--accent-5);
--event-filter-hover-color: var(--accent-5-l-25);
--event-listing-background-image: url("https://your.fitchlearning.com/rs/732-CKH-767/images/corporate-credit-analysis-background.jpg");
--event-teaser-background: var(--primary-2);
// FIGURE
--figure-number-color: var(--primary-2);
// FORM
--form-button-position: center;
// KEY HIGHLIGHT
--key-highlight-padding: 4.5rem 3rem;
// NAVIGATION
--navigation-font-size: 1.4rem;
// --navigation-text-transform: initial;
// PAGER
--pager-active-background: var(--feature-color);
// QUOTE
--quote-font-size: 2.5rem;
--quote-font-weight: var(--bold);
// TABS
--tab-button-active-background: var(--primary-2);
// LAYOUT
// HEADER
--header-spacing: 0;
.header {
height: 13.5rem;
}
// MAIN
--main-spacing: 13.5rem;
// FOOTER
--footer-links-padding: 0 0 3rem 0;
--footer-links-background: none;
--footer-legal-padding: 0 0 3rem 0;
--footer-legal-background: none;
--footer-color: var(--white);
// SECTION
--section-spacing: 6rem;
// GRID
--grid-column-gap: 3rem;
--grid-row-gap: 3rem;
--grid-padding-1: 4.5rem 3rem;
--grid-padding-2: 6rem 4.5rem;
--grid-padding-3: 0 3rem;
// COLUMN
--column-padding: 1.5rem;
// ARTICLE
--header-article-spacing: 5rem;
}
[data-brand="quant-insights"] {
// FONTS
--font-family: "Open Sans", arial, sans-serif;
--bold: 800;
// HEADINGS
--heading-tag-size: 1.2rem;
--heading-weight: 400;
--heading-line-height: 1.35;
h1,.heading--1 {--heading-weight: 600;}
h4,.heading--4 {--heading-weight: 700;}
h5,.heading--5 {--heading-weight: 700;}
// BACKGROUND COLORS
--background-color: #eeeeee;
--selection-background: yellow;
--gradient-background: linear-gradient(108deg, #888888 0%, #888888 100%);
--gradient-background-ie: linear-gradient(135deg, #373636 0, #373636 100%);
// COLORS
--feature-color: var(--primary-1);
--primary-1-d-50: #0d1d27;
--primary-1-d-25: #142c3a;
--primary-1: #1B3B4E;
--primary-1-l-25: #546c7a;
--primary-1-l-50: #8d9da7;
--primary-1-l-75: #c6ced3;
--primary-1-l-90: #e9ecee;
--accent-1-d-50: #51585b;
--accent-1-d-25: #7a8489;
--accent-1: #A3B0B7;
--accent-1-l-25: #bac4c9;
--accent-1-l-50: #d1d8db;
--accent-1-l-75: #e8ebed;
--accent-1-l-90: #f6f7f8;
--accent-2-d-50: #747475;
--accent-2-d-25: #aeaeaf;
--accent-2: #E8E8EA;
--accent-2-l-25: #eeeeef;
--accent-2-l-50: #f4f4f5;
--accent-2-l-75: #f9f9fa;
--accent-2-l-90: #fdfdfd;
// COMPONENTS
// BUTTONS
.button--1 {
--button-background: #006A72;
--button-border: #006A72;
--button-color: var(--white);
--button-hover-background: #0799A3;
--button-hover-border: #0799A3;
--button-hover-color: var(--white);
}
.button--2 {
--button-background: var(--white);
--button-border: var(--white);
--button-color: var(--black);
--button-hover-background: #DEDBDB;
--button-hover-border: #DEDBDB;
--button-hover-color: var(--black);
}
// EVENTS
--event-filter-active-color: #ffd500;
--event-filter-hover-color: #ffd500;
--event-listing-background-image: url('https://images.ctfassets.net/03fbs7oah13w/5nmbp0HB7MgvtZrA36YPZZ/600b34500a82214c519d3e9814b7606c/glass_building.jpg');
// PAGER
--pager-active-background: var(--feature-color);
// TABS
--tab-button-active-background: var(--primary-1);
// LAYOUT
.header {
height: 7.6rem;
padding: 1.2rem 0;
background: var(--background-color);
}
.region--logo {
padding: 1rem 0;
}
// MAIN
--main-spacing: 7.6rem;
// ARTICLE
--header-article-spacing: 5.5rem;
}
[data-brand="fca"] {
// FONTS
--font-family: Verdana,Helvetica,Arial,sans-serif;
--font-size-1: 1.5rem;
--line-height-1: 1.62857;
--bold: 700;
// HEADINGS
--heading-margin: var(--spacing-1);
--heading-tag-color: var(--primary-2);
--heading-line-height: 1.3;
--heading-border-width: 10rem;
--heading-border: 1rem solid var(--primary-1);
h1,
.heading--1 {
--heading-size: 3rem;
--heading-weight: 500;
}
h2,
.heading--2 {
--heading-size: 2.4rem;
--heading-weight: 500;
}
h3,
.heading--3 {
--heading-size: 2rem;
--heading-weight: 500;
}
h4,
.heading--4 {
--heading-size: 1.8rem;
--heading-weight: 500;
}
h5,
.heading--5 {
--heading-size: 1.6rem;
--heading-weight: 500;
}
h6,
.heading--6 {
--heading-size: 1.4rem;
--heading-weight: 500;
}
// MARGIN / PADDING
--spacing-1: 1.5rem;
--spacing-2: 2.5rem;
--spacing-3: 4.5rem;
--spacing-4: 6rem;
--spacing-5: 7.5rem;
--spacing-6: 9rem;
// BACKGROUND COLORS
--gradient-background: linear-gradient(90deg, var(--primary-1) 0%, var(--primary-1-l-90) 100%);
--gradient-background-ie: linear-gradient(135deg, #360e22 0, #f1e9ed 100%);
// BORDER
--border-color: var(--primary-1);
// BORDER RADIUS
--border-radius: 0;
// COLORS
--feature-color: var(--primary-1-l-25);
--primary-1-d-50: #360e22;
--primary-1-d-25: #511634;
--primary-1: #6c1d45;
--primary-1-l-25: #915674;
--primary-1-l-50: #b68ea2;
--primary-1-l-75: #dac6d0;
--primary-1-l-90: #f1e9ed;
--primary-2-d-50: none;
--primary-2-d-25: none;
--primary-2: none;
--primary-2-l-25: none;
--primary-2-l-50: none;
--primary-2-l-75: none;
--primary-2-l-90: none;
--accent-1-d-50: #7f2c2e;
--accent-1-d-25: #bf4246;
--accent-1: #ff585d;
--accent-1-l-25: #ff8286;
--accent-1-l-50: #ffacae;
--accent-1-l-75: #ffd5d6;
--accent-1-l-90: #ffefef;
--accent-2-d-50: #003a4f;
--accent-2-d-25: #005776;
--accent-2: #00749e;
--accent-2-l-25: #4097b6;
--accent-2-l-50: #80bacf;
--accent-2-l-75: #bfdce7;
--accent-2-l-90: #e6f1f5;
--accent-3-d-50: #001e38;
--accent-3-d-25: #002d55;
--accent-3: #003c71;
--accent-3-l-25: #406d95;
--accent-3-l-50: #809eb8;
--accent-3-l-75: #bfcedb;
--accent-3-l-90: #e6ecf1;
--accent-4-d-50: #003d43;
--accent-4-d-25: #005b65;
--accent-4: #007A87;
--accent-4-l-25: #409BA5;
--accent-4-l-50: #80BCC3;
--accent-4-l-75: #BFDEE1;
--accent-4-l-90: #e6f2f3;
--text-color: #000000;
--link-color: var(--primary-1);
--link-hover-color: #300d1e;
// COMPONENTS
// BACK TO TOP
--back-to-top-bottom: -5.8rem;
--back-to-top-transform: translateX(-50%);
--back-to-top-width: 4.2rem;
--back-to-top-height: 4.2rem;
--back-to-top-background: var(--white);
--back-to-top-hover-background: var(--very-light-grey);
--back-to-top-border-radius: 100%;
--back-to-top-shadow: none;
--back-to-top-hover-shadow: none;
--back-to-top-color: var(--primary-1);
--back-to-top-hover-color: var(--primary-1);
--back-to-top-i-transform: translate(-50%, -54%);
--back-to-top-i-font-size: 2.2rem;
// BANNER / PAGE HEADER
--banner-height: 65vh;
--banner-max-height: 65rem;
--banner-heading-size: 3rem;
--banner-heading-margin: 4rem;
--banner-text-max-width: 50rem;
--banner-text-margin: 0;
--banner-text-padding: 3.2rem 2.5rem;
// BUTTONS
--button-padding: 1.3rem 1.5rem;
--button-font-size: 1.5rem;
--button-font-weight: normal;
--button-letter-spacing: 1px;
--button-text-transform: initial;
--button-border-radius: 0;
.button--1,
.mktoButton,
.button--primary-2,
.form-submit:not(.search__submit) {
--button-background: var(--primary-1);
--button-border: var(--primary-1);
--button-color: var(--white);
--button-hover-background: var(--primary-1-l-25);
--button-hover-border: var(--primary-1-l-25);
--button-hover-color: var(--white);
}
.button--3 {
--button-background: var(--accent-1);
--button-border: var(--accent-1);
--button-color: var(--white);
--button-hover-background: var(--accent-1-l-25);
--button-hover-border: var(--accent-1-l-25);
--button-hover-color: var(--white);
}
.button--4 {
--button-background: var(--accent-2);
--button-border: var(--accent-2);
--button-color: var(--white);
--button-hover-background: var(--accent-2-l-25);
--button-hover-border: var(--accent-2-l-25);
--button-hover-color: var(--white);
}
.button--5 {
--button-background: var(--accent-3);
--button-border: var(--primary-3);
--button-color: var(--white);
--button-hover-background: var(--accent-3-l-25);
--button-hover-border: var(--accent-3-l-25);
--button-hover-color: var(--white);
}
.button--6 {
padding: var(--button-padding);
--button-background: var(--accent-4);
--button-border: var(--accent-4);
--button-color: var(--black);
--button-hover-background: var(--accent-4-l-25);
--button-hover-border: var(--accent-4-l-25);
--button-hover-color: var(--black);
}
// CARD
--card-padding-bottom: 0;
--card-border: 0.1rem solid var(--primary-1);
--card-text-align: left;
--card-image-spacing: 0;
--card-image-ratio: 16/10;
--card-content-padding: 3.2rem 2rem 0;
// KEY HIGHLIGHT
--key-highlight-padding: 3rem 2rem;
// NAVIGATION
--navigation-font-size: 1.5rem;
--navigation-font-weight: normal;
--navigation-text-transform: none;
// QUOTE
--quote-font-size: 2rem;
--quote-font-weight: 300;
--quote-color: var(--feature-color);
// LAYOUT
// HEADER
--header-spacing: 0;
--region-nav-width: calc(100% - 27.6rem);
--region-nav-text-align: right;
.header {
height: 8.6rem;
padding: 1.2rem 0;
background-color: var(--background-color);
}
// MAIN
--main-spacing: 8.6rem;
--main-height: calc(100vh - 15.72rem);
// SECTION
--section-spacing: 8rem;
// TABS
--tab-padding: 2rem 2.5rem;
--tab-button-active-background: var(--primary-1);
--tab-text-align: center;
--tab-text-transform: initial;
// WRAPPER
--wrapper-1: 120rem;
--wrapper-2: 106.8rem;
--wrapper-3: 76.8rem;
// ARTICLE
--header-article-spacing: 8rem;
}
[data-brand="making-the-grade"] {
// HEADINGS
--heading-tag-size: 1.4rem;
--heading-color: var(--primary-1);
// MARGIN / PADDING
--spacing-1: 1.5rem;
--spacing-2: 3rem;
--spacing-3: 6rem;
--spacing-4: 7.5rem;
--spacing-5: 7rem;
--spacing-6: 10.5rem;
// BACKGROUND COLORS
--gradient-background: linear-gradient(108deg, var(--primary-1-l-50) 0%, var(--accent-1-d-25) 100%);
--gradient-background-ie: linear-gradient(135deg, #04264e 0, #5c5c5c 100%);
// BORDER RADIUS
--border-radius: 0.5rem;
// COLORS
--feature-color: var(--primary-1);
--primary-1-d-50: #04264e;
--primary-1-d-25: #073975;
--primary-1: #094c9c;
--primary-1-l-25: #4779b5;
--primary-1-l-50: #84a6ce;
--primary-1-l-75: #c1d2e6;
--primary-1-l-90: #e7edf5;
--primary-2-d-50: #7b3416;
--primary-2-d-25: #b84f21;
--primary-2: #f6692c;
--primary-2-l-25: #f88f61;
--primary-2-l-50: #fbb496;
--primary-2-l-75: #fdd9ca;
--primary-2-l-90: #fef0ea;
--accent-1-d-50: #5c5c5c;
--accent-1-d-25: #8a8a8a;
--accent-1: #b8b8b8;
--accent-1-l-25: #cacaca;
--accent-1-l-50: #dcdcdc;
--accent-1-l-75: #ededed;
--accent-1-l-90: #f8f8f8;
--text-color: #222222;
// COMPONENTS
// BUTTONS
.button--1,
.mktoButton,
.button--primary-2,
.form-submit:not(.search__submit) {
--button-background: var(--primary-2);
--button-border: var(--primary-2);
--button-color: var(--white);
--button-hover-background: var(--primary-2-l-25);
--button-hover-border: var(--primary-2-l-25);
--button-hover-color: var(--white);
}
// CARD
--card-border: 0 none;
--card-border-radius: 0;
--card-text-align: left;
--card-image-spacing: var(--spacing-1);
--card-content-padding: var(--spacing-2) 0;
// FIGURE
--figure-number-margin-bottom: calc(var(--spacing-1) / 2);
--figure-number-size: 4rem;
--figure-number-color: var(--primary-2);
--figure-title-size: 3rem;
--figure-title-color: var(--primary-2);
// FORM
--form-button-position: center;
// LAYOUT
// SECTION
--section-spacing: 6rem;
// GRID
--grid-column-gap: 3rem;
--grid-row-gap: 2.5rem;
// COLUMN
--column-padding: 1.5rem;
// ARTICLE
--header-article-spacing: 8rem;
}
.bg--shape {
z-index: 1;
&:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
transform: scale(1.2);
background-color: var(--accent-1-l-90);
z-index: -1;
}
}
[data-theme="dark"] {
// --nav-hover-background-color: #25252f;
// --tab-button-background: var(--mostly-white);
// --tab-button-color: var(--black);
// BACKGROUND COLORS
--background-color: radial-gradient(ellipse at top, #26262e, var(--mostly-black));
--post-view-more-background: #2f2f39;
--related-background: #0d0d0d;
--gradient-background: linear-gradient(108deg, #0F2027 0%, #203A43 33%, #2C5364 100%);
--divider-background: var(--white);
// BORDERS
--border-color: #181818;
// SHADOW
--shadow: rgba(83, 84, 108, 0.3);
// COLORS
--white: #ffffff;
--color: var(--white);
--text-color: var(--white);
--link-color: #c1a57b;
--link-hover-color: #cfb184;
// HEADINGS
--heading-tag-color: var(--white);
// INVERT
.disclaimer img,
.column__right .idio-recommendations[style*="color:#000"] {
filter: invert(1);
}
[style*=" background-color: #f5f5f5"] .button--4 {
--button-border: var(--black);
--button-color: var(--black);
}
// COMPONENTS
// BUTTONS
.button--4 {
--button-border: var(--white);
--button-color: var(--white);
}
.button--6 {
--button-color:var(--link-color);
--button-hover-color: var(--link-hover-color);
}
// EVENTS
--event-filter-active-color: var(--link-color);
--event-filter-hover-color: var(--link-hover-color);
// PAGER
--pager-active-background: var(--feature-color);
// PROFILE BANNER
--profile-banner-background: #2f2f39;
// LOGOS
.logo {
--logo-color-1: var(--white);
--logo-color-2: var(--white);
--logo-color-3: var(--white);
--logo-color-4: var(--white);
--logo-color-5: var(--white);
--logo-color-6: var(--white);
&--bohua-swirl {
--logo-opacity: 0.36;
}
}
// NAVIGATION
--navigation-color: var(--white);
// SEARCH
--search-placeholder: var(--white);
--search-border: var(--white);
// TABS
--tab-button-hover-color: var(--black);
// TAGS
--tag-background: #2f2f39;
}
