// // Theme colors // $brand-primary: $brand-apricot; $brand-secondary: $brand-petrol; $brand-secondary-75: $brand-petrol-75; $brand-interaction: $brand-apricot; $brand-hover: $brand-apricot-transparent; $brand-text: $brand-gray; $brand-text-light: $brand-white; $brand-background: $brand-white; $brand-muted: $brand-gray-25; // //ATOMS // // Avatars $avatar-default-bg-color: $brand-gray-10; // Buttons $button-border-color: $brand-secondary; $button-background: transparent; $button-color: $brand-secondary; $button-hover-background: $brand-interaction; $button-hover-color: $brand-white; $button-hover-border-color: $brand-secondary; $button-cta-border-color: $brand-interaction; $button-cta-background: $brand-interaction; $button-cta-color: $brand-secondary; $button-cta-hover-background: $brand-secondary; $button-cta-hover-color: $brand-white; $button-cta-hover-border-color: $brand-secondary; $button-inverted-border-color: $brand-white; $button-inverted-background: transparent; $button-inverted-color: $brand-white; $button-inverted-hover-background: $brand-interaction; $button-inverted-hover-color: $brand-secondary; $button-inverted-hover-border-color: $brand-secondary; // Checkbox $checkbox-bg: $brand-white; $checkbox-bg-active: $brand-secondary; $checkbox-bg-disabled: $brand-gray-20; $checkbox-border: $brand-secondary; $checkbox-border-hoverfocus: $brand-interaction; $checkbox-border-disabled: $brand-gray-25; $checkbox-color-active: $brand-white; $checkbox-color-disabled: $brand-gray-50; // Form $form-control-border-color: $brand-secondary; $form-control-placeholder-color: $brand-gray-50; $form-control-caret-color: $brand-white; $form-control-focus-color: $brand-white; $form-control-focus-bg: $brand-secondary; $form-control-invalid-border-color: $brand-danger; $form-label-invalid-color: $brand-danger; $form-label-color: $brand-secondary; $form-legend-color: $brand-primary; $alert-color: $brand-white; // Form (inverted) $form-control-inverted-border-color: $brand-white; $form-control-inverted-focus-bg: $brand-white; $form-control-inverted-focus-color: $brand-secondary; $form-label-inverted-color: $brand-white; // Radiobuttons $radio-bg: $brand-white; $radio-bg-disabled: $brand-gray-20; $radio-border: $brand-secondary; $radio-border-hoverfocus: $brand-interaction; $radio-border-disabled: $brand-gray-25; $radio-color: $brand-secondary; $radio-color-disabled: $brand-gray-50; // Search field $search-field-caret-color: $brand-interaction; $search-field-border-color: $brand-interaction; $search-field-background: $brand-secondary; $search-field-color: $brand-interaction; // Search result $search-result-color: $brand-secondary; $search-result-border-color: $brand-primary; // Paginator $paginator-focus-color: $brand-interaction; // Headlines $h1-color: $brand-secondary; $h2-color: $brand-secondary; $h3-color: $brand-secondary; $h4-color: $brand-secondary; $h5-color: $brand-secondary; $h6-color: $brand-secondary; $teaser-section-heading-border-color: $brand-secondary; $section-heading-border-color: $brand-primary; // Inline $link-color: $brand-text; $link-hover-color: $brand-interaction; $link-hover-color-light: $brand-hover; $link-teaser-border-color: $brand-interaction; $link-teaser-text-color: $brand-secondary; $link-teaser-inverted-text-border-color: $brand-secondary; $link-teaser-inverted-text-text-color: $brand-white; $link-teaser-inverted-interaction-border-color: $brand-interaction; $link-teaser-inverted-interaction-text-color: $brand-white; $hover-color: $brand-interaction; $mark-color: $brand-hover; $code-background-color: $brand-gray-10; // Pull Quote $pull-quote-border-color: $brand-primary; $pull-quote-color: $brand-secondary; $superquote-color: $brand-interaction; $quote-color: $brand-secondary; $quote-bg-color: $brand-primary; // ZigZag $zzbgc: $brand-white; $zzlinecolor: $brand-secondary; // hr line $horizontal-line-color: $brand-primary; //Waiting Dots $dot-color: $brand-secondary; // Lists $bullet-list-color: $brand-primary; $bullet-list-color-primary: $brand-primary; $bullet-list-color-secondary: $brand-secondary; $definition-list-dt-color: $brand-secondary; $tupel-list-label-color: $brand-secondary; // label $talk-label-background-color: $brand-primary; $talk-label-text-color: $brand-secondary; $training-label-background-color: $brand-secondary; $training-label-text-color: $brand-primary; $slides-label-background-color: $brand-green; $slides-label-text-color: $brand-text; $badge-background-color: $brand-primary; $badge-background-color-inverted: $brand-secondary; $badge-text-color: $brand-secondary; $badge-text-color-inverted: $brand-primary; // Author $author-bio-background-color: $brand-gray-10; $author-bio-social-border-color: $brand-gray-25; $author-bio-link-color: $brand-white; $author-bio-link-background-color: $brand-interaction; // Artist-in-Residence $artwork-title-color: $brand-red; $artwork-title-color-edition-2: $brand-primary; $artist-collabo-subtitle-color: $brand-primary; // Content Seperator $box-shadow-color-light: $brand-white; $box-shadow-color-dark: $brand-secondary; $content-seperator-text-color: $brand-secondary; // Table of Content $toc-heading-color: $brand-secondary; $toc-border-color: $brand-gray-25; $toc-anchor-text-color: $brand-secondary; $toc-anchor-hover-text-color: $brand-secondary; // Conclusion $conclusion-border-color: $brand-primary; $conclusion-background-color: $brand-secondary; $conclusion-headline-color: $brand-primary; $conclusion-subheadline-color: $brand-primary; $conclusion-text-color: $brand-white; $conclusion-link-color: $brand-white; $conclusion-link-hover-color: $brand-secondary; // Tag List $tag-background-color: $brand-secondary; $tag-background-color-hover: $brand-primary; $tag-text-color-hover: $brand-secondary; $tag-text-color: $brand-primary; // Tag Section $meta-tags-background-color: $brand-gray-10; $meta-tags-headline-text-color: $brand-secondary; // Table $table-header-text-color: $brand-primary; $table-header-background-color: $brand-secondary; $table-row-border-color: $brand-gray-75; $table-row-color-dark: $brand-gray-10; $table-border-color: $brand-secondary; // Infobox $infobox-teaser-text-color-closed: $brand-secondary; $infobox-teaser-text-color-open: $brand-gray-10; $infobox-teaser-background-color-closed: $brand-gray-10; $infobox-teaser-background-color-open: $brand-secondary; $infobox-content-background-color: $brand-gray-10; $infobox-teaser-border-color: $brand-primary; // Sharing Section $sharing-headline-color: $brand-secondary; $sharing-interaction-color: $brand-interaction; // Tooltip / Footnote $footnote-link-color: $brand-interaction; $footnote-index-color: $brand-secondary; $tooltip-shadow-color: $brand-gray-75; $tooltip-background-color: $brand-white; $footnote-section-headline-color: $brand-secondary; // Navbar $navbar-body-bg: $brand-secondary; $navbar-link-color: $brand-white; $navbar-link-active-color: $brand-primary; $navbar-link-hover-color: $brand-interaction; $navbar-lightened-bg: lighten($navbar-body-bg, 5%); // Dropdown $dropdown-link-hover-color: $brand-interaction; // Date section $date-section-background-color: $brand-secondary; $date-section-day-color: $brand-primary; $date-section-month-color: $brand-white; $date-section-year-color: $brand-white; // Date Location Section $date-location-section-border-color: $brand-gray-25; // Wall note $wall-note-content-bg-color: $brand-white; // // Teasers // // Content Teaser $content-teaser-default-bg: $brand-white; $content-teaser-default-color: $brand-secondary; $content-teaser-inverted-bg: $brand-secondary; $content-teaser-inverted-color: $brand-white; $content-teaser-colored-bg: $brand-interaction; $content-teaser-colored-color: $brand-secondary; $content-teaser-accent-color: $brand-interaction; $big-content-teaser-headline-inverted-color: $brand-primary; $big-content-teaser-headline-color: $brand-secondary; $big-content-teaser-text-color: $brand-secondary; $big-content-teaser-bg-color: $brand-white; $big-content-teaser-bg-color-primary: $brand-primary; $big-content-teaser-bg-color-secondary: $brand-secondary; $big-content-teaser-image-headline-color: $brand-primary; // Full width default teaser $full-width-teaser-body-bg: $brand-white; $full-width-teaser-body-color: $brand-secondary; // Case Teaser $case-teaser-body-bg: $brand-white; $case-teaser-body-color: $brand-secondary; $case-tile-teaser-body-bg-color: $brand-white; $case-tile-teaser-text-color: $brand-secondary; // Topic Teaser $topic-teaser-body-color: $brand-white; // List Teaser $list-teaser-headline-color: $brand-secondary; $list-teaser-border-color: $brand-secondary; $list-teaser-background-color: $brand-white; $list-teaser-caption-color: $brand-primary; $list-teaser-abstract-primary-bg-color: $brand-primary; $list-teaser-abstract-secondary-bg-color: $brand-secondary; $list-teaser-abstract-primary-text-color: $brand-secondary; $list-teaser-abstract-secondary-text-color: $brand-primary; $list-teaser-abstract-primary-drop-caps-color: $brand-secondary; $list-teaser-abstract-secondary-drop-caps-color: $brand-primary; $list-teaser-abstract-primary-author-name-color: $brand-secondary; $list-teaser-abstract-secondary-author-name-color: $brand-primary; $list-teaser-abstract-caption-color: $brand-white; $list-teaser-abstract-headline-color: $brand-white; $list-teaser-event-headline-color: $brand-secondary; $list-teaser-event-subheadline-color: $brand-secondary; $list-teaser-product-headline-color: $brand-primary; $list-teaser-product-caption-color: $brand-secondary; $list-teaser-product-border-color: $brand-secondary; $list-teaser-product-border-color-muted: $brand-gray-25; $list-teaser-product-background-color: $brand-white; $list-teaser-product-background-color-cta: $brand-secondary; $list-teaser-product-color-cta: $brand-primary; $list-teaser-training-bg-color-primary: $brand-primary; $list-teaser-training-bg-color-secondary: $brand-secondary; $list-teaser-training-text-color-primary: $brand-white; $list-teaser-training-text-color-secondary: $brand-white; // Simple Teaser $simple-teaser-bg: $brand-secondary; $simple-teaser-color: $brand-primary; $simple-teaser-link-focus-color: $brand-primary; // Podcast Teaser $podcast-teaser-default-bg: $brand-primary; $podcast-teaser-light-bg: $brand-white; $podcast-teaser-default-color: $brand-secondary; $podcast-teaser-default-color-secondary: $brand-primary; $podcast-teaser-overlay-color: $brand-primary; $podcast-teaser-overlay-color-secondary: $brand-secondary; // Security-Podcast Teaser $podcast-teaser-default-bg-sec: $brand-gray; $podcast-teaser-default-color-sec: $brand-white; $podcast-teaser-overlay-color-sec: $brand-yellow; $static-tile-teaser-text-color: $brand-secondary; // Project Index $project-index-text-color: $brand-secondary; $project-index-title-color: $brand-secondary; $project-index-highlight-color: $brand-interaction; $project-index-text-inverted-color: $brand-primary; // Dropdown $dropdown-menu-body-bg: $brand-text; $dropdown-link-hover-color: $brand-interaction; // Footer $footer-body-bg: $brand-secondary; $footer-color: $brand-white; $footer-heading-color: $brand-primary; $footer-link-hover-color: $brand-interaction; // Eyecatcher $eyecatcher-body-bg: $brand-interaction; $eyecatcher-text-color: $brand-secondary; $eyecatcher-color-inverted: $brand-white; // Newsletter Optin $newsletter-optin-color: $brand-white; // Page Headers $standard-header-title-color: $brand-white; $standard-header-subtitle-color: $brand-white; $standard-header-type-color: $brand-white; $standard-header-type-underline-color: $brand-primary; $standard-header-intro-bg: $brand-secondary; $standard-header-intro-label-color: $brand-white; $standard-header-intro-label-bg: $brand-primary; $standard-header-intro-text-color: $brand-white; $standard-header-inverted-title-color: $brand-secondary; $standard-header-inverted-subtitle-color: $brand-interaction; $standard-header-inverted-type-color: $brand-secondary; $standard-header-podcast-subtitle-color: $brand-secondary; $standard-header-podcast-overlay-color: $brand-primary; $standard-header-podcast-intro-label-bg-color: $brand-white; $standard-header-podcast-intro-label-color: $brand-secondary; $staff-header-quote-color: $brand-primary; $staff-header-quote-author-color: $brand-primary; $staff-header-quote-bg-color: $brand-secondary; $staff-header-bg-color: $brand-secondary; $staff-header-content-bg-color: $brand-gray-10; $staff-header-intro-text-border: $brand-secondary; $staff-header-intro-text-color: $brand-secondary; $staff-header-intro-bg-color: $brand-primary; $staff-header-icon-hover-color: $brand-white; $landing-page-header-border-color: $brand-primary; $landing-page-header-intro-text-color: $brand-secondary; $landing-page-header-intro-bg-color: $brand-white; $landing-page-header-inverted-text-color: $brand-white; $topic-header-intro-text-color: $brand-secondary; $topic-header-intro-bg-color: $brand-primary; $claim-header-bg-color: $brand-primary; $claim-header-type-color: $brand-secondary; $claim-header-title-color: $brand-secondary; $claim-header-divider-color: $brand-secondary; $image-header-bg-color: $brand-primary; $image-header-content-bg-color: $brand-white; $text-header-bg-color: $brand-white; $text-header-color: $brand-secondary; // Toolbar $toolbar-link-hover-color: $brand-interaction; $toolbar-link-color: $brand-secondary; //Card $card-tag-bg-color: $brand-primary; $card-tag-text-color: $brand-secondary; $card-headline-color: $brand-primary; $card-subheadline-color: $brand-white; $card-bg-color: $brand-secondary; $card-text-color: $brand-white; // Paginator $paginator-text-color: $brand-secondary; $paginator-active-color: $brand-interaction; // Service Intro $service-intro-text-color: $brand-secondary; // image-divider $image-divider-center-bg-color: $brand-white; $image-divider-center-color: $brand-secondary; $image-divider-bg-color: $brand-white; $image-divider-right-color: $brand-secondary; $triplet-divider-bg-color-primary: $brand-primary; $triplet-divider-bg-color-secondary: $brand-secondary; $triplet-divider-color-primary: $brand-primary; $triplet-divider-color-secondary: $brand-secondary;