:root {
  --main-color: #F11237;
  --secondary-color: #043b62;
}
@font-face {
    font-family: "Poppins";
    src: url("../font/Poppins-Regular.woff") format("woff"),
      url("../font/Poppins-Regular.ttf") format("truetype");
    /*font-weight: normal;
               font-style: normal;*/
  }
  */ @font-face {
    font-family: "Poppins";
  }
  
  .callout__text[_ngcontent-wfj-c68] {
    background-color: #1a73e8;
    border-radius: 8px;
    color: #fff;
    position: relative;
    text-align: left;
    z-index: 80;
  }
  .gf-dark-theme[_nghost-wfj-c68] .callout__text[_ngcontent-wfj-c68],
  .gf-dark-theme [_nghost-wfj-c68] .callout__text[_ngcontent-wfj-c68] {
    background-color: #8ab4f8;
    color: #202124;
  }
  .gf-dark-theme[_nghost-wfj-c68] .callout__text[_ngcontent-wfj-c68]:after,
  .gf-dark-theme [_nghost-wfj-c68] .callout__text[_ngcontent-wfj-c68]:after {
    border-color: transparent transparent #8ab4f8;
  }
  .callout[_ngcontent-wfj-c68] {
    bottom: -9px;
    opacity: 0;
    position: absolute;
    -webkit-transform: scale(0.8) translateY(-10px);
    transform: scale(0.8) translateY(-10px);
    -webkit-transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1),
      -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1),
      -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
      opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
      opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1),
      -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .google-header-shopping-bag-callout[_nghost-wfj-c68]
    .callout[_ngcontent-wfj-c68],
  .google-header-shopping-bag-callout
    [_nghost-wfj-c68]
    .callout[_ngcontent-wfj-c68] {
    right: 60px;
  }
  @media (max-width: 1024px) {
    .google-header-shopping-bag-callout[_nghost-wfj-c68]
      .callout[_ngcontent-wfj-c68],
    .google-header-shopping-bag-callout
      [_nghost-wfj-c68]
      .callout[_ngcontent-wfj-c68] {
      right: 15px;
    }
  }
  .toolbar__shopping-bag-callout[_nghost-wfj-c68] .callout[_ngcontent-wfj-c68],
  .toolbar__shopping-bag-callout [_nghost-wfj-c68] .callout[_ngcontent-wfj-c68] {
    display: none;
  }
  .global-toolbar--fixed-to-top[_nghost-wfj-c68] .callout[_ngcontent-wfj-c68],
  .global-toolbar--fixed-to-top [_nghost-wfj-c68] .callout[_ngcontent-wfj-c68] {
    display: block;
    right: 0;
  }
  .callout--show[_ngcontent-wfj-c68] {
    opacity: 1;
    -webkit-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0);
  }
  .callout__text[_ngcontent-wfj-c68] {
    padding: 16px;
    position: absolute;
    right: 0;
    top: 3px;
    white-space: nowrap;
  }
  .callout__text[_ngcontent-wfj-c68]:after {
    border: 10px solid transparent;
    border-bottom-color: #1a73e8;
    content: " ";
    height: 0;
    position: absolute;
    width: 0;
    right: 12px;
    top: -20px;
  }
  .callout__link[_ngcontent-wfj-c68] {
    color: #fff;
    cursor: pointer;
    margin-left: 16px;
  }
  .callout__link[_ngcontent-wfj-c68]:active {
    color: #fff;
  }
  .gf-dark-theme[_nghost-wfj-c68] .callout__text[_ngcontent-wfj-c68],
  .gf-dark-theme [_nghost-wfj-c68] .callout__text[_ngcontent-wfj-c68] {
    box-shadow: 0 0 0 0 rgba(60, 64, 67, 0.3), 0 0 0 0 rgba(60, 64, 67, 0.15);
  }
  .gf-dark-theme[_nghost-wfj-c68] .callout__link[_ngcontent-wfj-c68],
  .gf-dark-theme [_nghost-wfj-c68] .callout__link[_ngcontent-wfj-c68] {
    color: #202124;
  }
  .gf-dark-theme[_nghost-wfj-c68] .callout__link[_ngcontent-wfj-c68]:active,
  .gf-dark-theme [_nghost-wfj-c68] .callout__link[_ngcontent-wfj-c68]:active {
    color: #202124;
  }
  .styles-anchor-container[_ngcontent-wfj-c200] {
    color: #1a73e8;
    cursor: pointer;
    margin-bottom: 16px;
    text-align: center;
  }
  .styles-anchor-container[_ngcontent-wfj-c200]
    .styles-anchor-icon[_ngcontent-wfj-c200] {
    margin-right: 8px;
    vertical-align: middle;
  }
  .styles-anchor-container[_ngcontent-wfj-c200] a[_ngcontent-wfj-c200] {
    font-size: 14px;
    line-height: 20px;
    text-decoration: none;
  }
  .specimen-section[_ngcontent-wfj-c200] {
    border-top: 1px solid #dadce0;
    margin-top: 80px;
    padding-top: 40px;
  }
  .specimen-section--styles[_ngcontent-wfj-c200] {
    border: none;
    margin-top: 0;
  }
  @media (max-width: 720px) {
    .specimen-section--glyphs[_ngcontent-wfj-c200] {
      display: none;
    }
  }
  .specimen__glyphs--variable-specimen[_ngcontent-wfj-c200] {
    border-top: none;
  }
  .specimen-section__text-only-content[_ngcontent-wfj-c200] {
    max-width: 800px;
  }
  .specimen-section__title[_ngcontent-wfj-c200] {
    margin-bottom: 40px;
  }
  .specimen-section__title-with-small-spacing[_ngcontent-wfj-c200] {
    margin-bottom: 24px;
  }
  .glyphs-content[_ngcontent-wfj-c200] {
    font-size: 24px;
    letter-spacing: 4px;
    line-height: 24px;
  }
  .glyphs-content__char[_ngcontent-wfj-c200] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #dadce0;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 41px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: -1px;
    margin-top: -1px;
    width: 44px;
  }
  .specimen__designers-title[_ngcontent-wfj-c200] {
    margin-bottom: 24px;
    margin-top: 40px;
  }
  .specimen__designers[_ngcontent-wfj-c200] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: wrap;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
  }
  .specimen__feedback-button[_ngcontent-wfj-c200] {
    margin-top: 24px;
  }
  .license__paragraph[_ngcontent-wfj-c200] {
    margin-bottom: 24px;
  }
  .license__paragraph[_ngcontent-wfj-c200]:last-child {
    margin-bottom: 0;
  }
  .specimen__content--sticky-header-fixed[_ngcontent-wfj-c200] {
    padding-top: 48px;
  }
  @media (max-width: 720px) {
    .specimen__content--sticky-header-fixed[_ngcontent-wfj-c200] {
      padding-top: 0;
    }
  }
  .gf-dark-theme[_nghost-wfj-c200] .styles-anchor-container[_ngcontent-wfj-c200],
  .gf-dark-theme
    [_nghost-wfj-c200]
    .styles-anchor-container[_ngcontent-wfj-c200] {
    color: #8ab4f8;
  }
  .gf-dark-theme[_nghost-wfj-c200] .specimen-section[_ngcontent-wfj-c200],
  .gf-dark-theme [_nghost-wfj-c200] .specimen-section[_ngcontent-wfj-c200] {
    border-top: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c200] .specimen-section--styles[_ngcontent-wfj-c200],
  .gf-dark-theme
    [_nghost-wfj-c200]
    .specimen-section--styles[_ngcontent-wfj-c200] {
    border: none;
  }
  .gf-dark-theme[_nghost-wfj-c200]
    .specimen__glyphs--variable-specimen[_ngcontent-wfj-c200],
  .gf-dark-theme
    [_nghost-wfj-c200]
    .specimen__glyphs--variable-specimen[_ngcontent-wfj-c200] {
    border-top: none;
  }
  .gf-dark-theme[_nghost-wfj-c200] .glyphs-content__char[_ngcontent-wfj-c200],
  .gf-dark-theme [_nghost-wfj-c200] .glyphs-content__char[_ngcontent-wfj-c200] {
    border: 1px solid #5f6368;
  }
  .styles-anchor-container[_ngcontent-wfj-c199] {
    color: #1a73e8;
    cursor: pointer;
    margin-bottom: 16px;
    text-align: center;
  }
  .styles-anchor-container[_ngcontent-wfj-c199]
    .styles-anchor-icon[_ngcontent-wfj-c199] {
    margin-right: 8px;
    vertical-align: middle;
  }
  .styles-anchor-container[_ngcontent-wfj-c199] a[_ngcontent-wfj-c199] {
    font-size: 14px;
    line-height: 20px;
    text-decoration: none;
  }
  .specimen-section[_ngcontent-wfj-c199] {
    border-top: 1px solid #dadce0;
    margin-top: 3px;
    padding-top: 80px;
  }
  .specimen-section--no-border[_ngcontent-wfj-c199] {
    border-top: none;
  }
  .specimen-section--styles[_ngcontent-wfj-c199] {
    border: none;
    margin-top: 0;
  }
  .specimen-section--type-tester[_ngcontent-wfj-c199] {
    display: block;
    margin-top: 25px;
  }
  @media (max-width: 720px) {
    .specimen-section--type-tester[_ngcontent-wfj-c199] {
      display: none;
    }
  }
  .specimen-section--glyphs[_ngcontent-wfj-c199] {
    border-top: none;
  }
  @media (max-width: 720px) {
    .specimen-section--glyphs[_ngcontent-wfj-c199] {
      display: none;
    }
  }
  .specimen__glyphs--variable-specimen[_ngcontent-wfj-c199] {
    border-top: none;
  }
  .specimen-section__text-only-content[_ngcontent-wfj-c199] {
    max-width: 100%;
  }
  .specimen-section__title[_ngcontent-wfj-c199] {
    margin-bottom: 40px;
  }
  .specimen-section__title-with-small-spacing[_ngcontent-wfj-c199] {
    margin-bottom: 24px;
  }
  .glyphs-content[_ngcontent-wfj-c199] {
    font-size: 24px;
    letter-spacing: 4px;
    line-height: 24px;
  }
  .glyphs-content__char[_ngcontent-wfj-c199] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid #dadce0;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 41px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: -1px;
    margin-top: -1px;
    width: 44px;
  }
  .specimen__designers-title[_ngcontent-wfj-c199] {
    margin-bottom: 24px;
    margin-top: 40px;
  }
  .specimen__designers[_ngcontent-wfj-c199] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: wrap;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
  }
  .specimen__feedback-button[_ngcontent-wfj-c199] {
    display: block;
    margin-top: 24px;
  }
  .license__paragraph[_ngcontent-wfj-c199] {
    margin-bottom: 24px;
  }
  .license__paragraph[_ngcontent-wfj-c199]:last-child {
    margin-bottom: 0;
  }
  .specimen__content--sticky-header-fixed[_ngcontent-wfj-c199] {
    padding-top: 48px;
  }
  @media (max-width: 720px) {
    .specimen__content--sticky-header-fixed[_ngcontent-wfj-c199] {
      padding-top: 0;
    }
  }
  .gf-dark-theme[_nghost-wfj-c199] .styles-anchor-container[_ngcontent-wfj-c199],
  .gf-dark-theme
    [_nghost-wfj-c199]
    .styles-anchor-container[_ngcontent-wfj-c199] {
    color: #8ab4f8;
  }
  .gf-dark-theme[_nghost-wfj-c199] .specimen-section[_ngcontent-wfj-c199],
  .gf-dark-theme [_nghost-wfj-c199] .specimen-section[_ngcontent-wfj-c199] {
    border-top: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c199] .specimen-section--styles[_ngcontent-wfj-c199],
  .gf-dark-theme
    [_nghost-wfj-c199]
    .specimen-section--styles[_ngcontent-wfj-c199] {
    border: none;
  }
  .gf-dark-theme[_nghost-wfj-c199]
    .specimen__glyphs--variable-specimen[_ngcontent-wfj-c199],
  .gf-dark-theme
    [_nghost-wfj-c199]
    .specimen__glyphs--variable-specimen[_ngcontent-wfj-c199] {
    border-top: none;
  }
  .gf-dark-theme[_nghost-wfj-c199] .glyphs-content__char[_ngcontent-wfj-c199],
  .gf-dark-theme [_nghost-wfj-c199] .glyphs-content__char[_ngcontent-wfj-c199] {
    border: 1px solid #5f6368;
  }
  [_nghost-wfj-c167] {
    background: #f8f8f8;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    left: 0;
    max-width: 1440px;
    position: absolute;
    top: 0;
    width: 100%;
    -webkit-transform: translate3d(0, -108px, 0);
    transform: translate3d(0, -108px, 0);
  }
  .sticky-header--collection-expanded.sticky-header--fixed[_nghost-wfj-c167] {
    padding-right: 340px;
  }
  .sticky-header--fixed[_nghost-wfj-c167] {
    border-bottom: 1px solid #dadce0;
    height: 64px;
    left: 0;
    max-width: 100%;
    padding-left: 60px;
    padding-right: 60px;
    position: fixed;
    top: 0;
    -webkit-transform: none;
    transform: none;
    -webkit-transition: padding-right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    transition: padding-right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 30;
  }
  @media (max-width: 1024px) {
    .sticky-header--fixed[_nghost-wfj-c167] {
      padding-left: 20px;
      padding-right: 20px;
    }
  }
  .sticky-header--fixed[_nghost-wfj-c167]
    .sticky-header__subtitle[_ngcontent-wfj-c167] {
    display: none;
  }
  .sticky-header[_ngcontent-wfj-c167] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
  }
  .sticky-header--fixed[_nghost-wfj-c167] .sticky-header[_ngcontent-wfj-c167] {
    height: 100%;
    margin: 0 auto;
    max-width: 1440px;
    padding: 0;
    position: relative;
  }
  .sticky-header__title[_ngcontent-wfj-c167] {
    line-height: 64px;
    margin: 0;
    white-space: nowrap;
  }
  .sticky-header__cta[_ngcontent-wfj-c167] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    max-height: 78px;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0;
  }
  /*@media (max-width:1024px) {
      .sticky-header__cta[_ngcontent-wfj-c167] {
          display: none
      }
  }*/
  
  .sticky-header--fixed[_nghost-wfj-c167]
    .sticky-header__cta[_ngcontent-wfj-c167] {
    overflow: visible;
  }
  .cta-button__icon[_ngcontent-wfj-c167] {
    margin-right: 4px;
  }
  .sticky-header__cta-button[_ngcontent-wfj-c167] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    -webkit-transform: translateX(44px);
    transform: translateX(0px);
  }
  .cta-button__content[_ngcontent-wfj-c167] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }
  .sticky-header__shopping-bag[_ngcontent-wfj-c167] {
    -webkit-transform: translateX(44px);
    transform: translateX(44px);
  }
  .sticky-header--fixed[_nghost-wfj-c167]
    .mat-mdc-outlined-button[_ngcontent-wfj-c167],
  .sticky-header--fixed[_nghost-wfj-c167]
    .sticky-header__shopping-bag[_ngcontent-wfj-c167] {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  .gf-dark-theme[_nghost-wfj-c167],
  .gf-dark-theme [_nghost-wfj-c167] {
    background: #202124;
  }
  .gf-dark-theme.sticky-header--fixed[_nghost-wfj-c167],
  .gf-dark-theme .sticky-header--fixed[_nghost-wfj-c167] {
    border-bottom: 1px solid #5f6368;
  }
  [_nghost-wfj-c195] {
    background: #fff;
    display: block;
    position: relative;
    top: 0;
    text-align: center;
    width: 100%;
    z-index: 29;
  }
  @media (max-width: 720px) {
    [_nghost-wfj-c195] {
      display: none;
    }
  }
  .sticky-navbar--fixed[_nghost-wfj-c195] {
    left: 0;
    padding-left: 60px;
    padding-right: 60px;
    position: fixed;
    top: 64px;
  }
  @media (max-width: 1024px) {
    .sticky-navbar--fixed[_nghost-wfj-c195] {
      padding-left: 20px;
      padding-right: 20px;
    }
  }
  @media print {
    .sticky-navbar--fixed[_nghost-wfj-c195] {
      position: static;
    }
  }
  .sticky-navbar--fixed-and-collection-expanded[_nghost-wfj-c195] {
    padding-right: 340px;
  }
  @media (max-width: 1024px) {
    .sticky-navbar--fixed-and-collection-expanded[_nghost-wfj-c195] {
      padding-right: 0;
    }
  }
  .sticky-navbar-tab-bar[_ngcontent-wfj-c195] {
    border-bottom: 1px solid #dadce0;
    height: 48px;
    margin-right: 0;
    max-width: 1440px;
    width: 100%;
    background: #f8f8f8;
  }
  .gf-dark-theme[_nghost-wfj-c195],
  .gf-dark-theme [_nghost-wfj-c195] {
    background: #202124;
  }
  .gf-dark-theme[_nghost-wfj-c195] .sticky-navbar-tab-bar[_ngcontent-wfj-c195],
  .gf-dark-theme [_nghost-wfj-c195] .sticky-navbar-tab-bar[_ngcontent-wfj-c195] {
    border-bottom: 1px solid #5f6368;
  }
  .variable-axes__header[_ngcontent-wfj-c179] {
    margin-top: 120px;
  }
  .variable-axes__header.isMobile[_ngcontent-wfj-c179] {
    margin-top: 80px;
  }
  .variable-axes__learn-more[_ngcontent-wfj-c179] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-top: 8px;
    margin-bottom: 40px;
    padding: 0;
  }
  .variable-axes__learn-more-icon[_ngcontent-wfj-c179] {
    margin-left: 4px;
    vertical-align: middle;
  }
  .type-tester--no-heading[_nghost-wfj-c192]
    .type-tester__header[_ngcontent-wfj-c192],
  .type-tester--no-heading
    [_nghost-wfj-c192]
    .type-tester__header[_ngcontent-wfj-c192] {
    display: none;
  }
  .type-tester__learn-more[_ngcontent-wfj-c192] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-top: 8px;
    margin-bottom: 40px;
    padding: 0;
  }
  .type-tester__learn-more-icon[_ngcontent-wfj-c192] {
    margin-left: 4px;
    vertical-align: middle;
  }
  .type-tester__header--static-font[_ngcontent-wfj-c192] {
    margin-bottom: 40px;
  }
  .filter-row[_ngcontent-wfj-c192] {
    display: inline-block;
    margin-top: 40px;
  }
  .filter-row__label[_ngcontent-wfj-c192] {
    margin-right: 8px;
  }
  .font-render-content[_ngcontent-wfj-c154] {
    opacity: 0;
    -webkit-transform: translate3d(0, 6px, 0);
    transform: translate3d(0, 6px, 0);
    -webkit-transition-duration: 0.35s;
    transition-duration: 0.35s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
  .font-render-content--loaded[_ngcontent-wfj-c154] {
    color: #202124;
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
  [_nghost-wfj-c154]:not(.no-line-height)
    .font-render-content[_ngcontent-wfj-c154] {
    line-height: normal;
  }
  .inline[_nghost-wfj-c154] .font-render-content[_ngcontent-wfj-c154] {
    display: inline;
  }
  .gf-dark-theme[_nghost-wfj-c154]
    .font-render-content--loaded[_ngcontent-wfj-c154],
  .gf-dark-theme
    [_nghost-wfj-c154]
    .font-render-content--loaded[_ngcontent-wfj-c154] {
    color: #e8eaed;
  }
  [_nghost-wfj-c171] {
    display: block;
    margin-top: 16px;
  }
  .choosing-type__container[_ngcontent-wfj-c171] {
    background: #fef7e0;
    padding-top: 80px;
  }
  @media (max-width: 720px) {
    .choosing-type__container[_ngcontent-wfj-c171] {
      padding-top: 40px;
    }
  }
  .choosing-type__module-section[_ngcontent-wfj-c171] {
    display: block;
    margin-bottom: 40px;
  }
  @media (max-width: 720px) {
    .choosing-type__module-section[_ngcontent-wfj-c171] {
      margin-bottom: -80px;
    }
  }
  .choosing-type__knowledge-link-container[_ngcontent-wfj-c171] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .choosing-type__knowledge-link[_ngcontent-wfj-c171] {
    margin: 0 auto;
  }
  .choosing-type__knowledge-link.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c171]:not(
      [disabled]
    ) {
    border-color: #1967d2;
    color: #1967d2;
  }
  .gf-dark-theme[_nghost-wfj-c171] .choosing-type__container[_ngcontent-wfj-c171],
  .gf-dark-theme
    [_nghost-wfj-c171]
    .choosing-type__container[_ngcontent-wfj-c171] {
    background: #3b372c;
  }
  .gf-dark-theme[_nghost-wfj-c171]
    .choosing-type__knowledge-link.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c171]:not(
      [disabled]
    ),
  .gf-dark-theme
    [_nghost-wfj-c171]
    .choosing-type__knowledge-link.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c171]:not(
      [disabled]
    ) {
    border-color: #8ab4f8;
    color: #8ab4f8;
  }
  .controls[_ngcontent-wfj-c161] {
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
    -moz-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    height: 56px;
    margin-bottom: 40px;
    margin-top: 40px;
    position: relative;
    z-index: 2;
  }
  @media (max-width: 720px) {
    .controls[_ngcontent-wfj-c161] {
      display: none;
    }
  }
  @media (max-width: 1024px) {
    .noto-specimen__styles[_nghost-wfj-c161] .controls[_ngcontent-wfj-c161],
    .noto-specimen__styles [_nghost-wfj-c161] .controls[_ngcontent-wfj-c161] {
      display: block;
      margin-bottom: 24px;
      margin-top: 24px;
    }
  }
  @media (max-width: 1024px) {
    .noto-specimen__styles[_nghost-wfj-c161] .text-input[_ngcontent-wfj-c161],
    .noto-specimen__styles [_nghost-wfj-c161] .text-input[_ngcontent-wfj-c161] {
      display: none;
    }
  }
  .controls__input[_ngcontent-wfj-c161] {
    text-overflow: ellipsis;
  }
  .text-input[_ngcontent-wfj-c161] {
    margin-right: 24px;
    width: 100%;
  }
  .text-input-label[_ngcontent-wfj-c161] {
    font-size: 16px;
  }
  gf-font-size-modifer[_ngcontent-wfj-c161] {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    max-width: 400px;
    width: 100%;
  }
  .optical-size[_ngcontent-wfj-c161] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #5f6368;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: 32px;
  }
  .optical-size__label[_ngcontent-wfj-c161] {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
  }
  .optical-size__toggle[_ngcontent-wfj-c161] {
    margin-left: 16px;
  }
  .optical-size__tooltip-image[_ngcontent-wfj-c161] {
    background-color: #e8f0fe;
    display: block;
    margin-bottom: 0;
  }
  .optical-size__tooltip-description[_ngcontent-wfj-c161] {
    margin-top: 16px;
  }
  .gf-dark-theme[_nghost-wfj-c161] .optical-size[_ngcontent-wfj-c161],
  .gf-dark-theme [_nghost-wfj-c161] .optical-size[_ngcontent-wfj-c161] {
    color: #e8eaed;
  }
  .gf-dark-theme[_nghost-wfj-c161] .optical-size__label[_ngcontent-wfj-c161],
  .gf-dark-theme [_nghost-wfj-c161] .optical-size__label[_ngcontent-wfj-c161] {
    color: #e8eaed;
  }
  .variants[_ngcontent-wfj-c162] {
    overflow: hidden;
    white-space: nowrap;
  }
  .variant[_ngcontent-wfj-c162] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-left: 0;
    padding-bottom: 20px;
    padding-top: 16px;
    position: relative;
    z-index: 1;
  }
  .variant[_ngcontent-wfj-c162]:before,
  .variant[_ngcontent-wfj-c162]:last-child:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    z-index: 20;
  }
  .variant[_ngcontent-wfj-c162]:before {
    top: 0;
    border-top: 1px solid #dadce0;
  }
  .variant[_ngcontent-wfj-c162]:last-child:after {
    bottom: 0;
    border-bottom: 1px solid #dadce0;
  }
  .variant__selection-toggle[_ngcontent-wfj-c162] {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
  .variant__content[_ngcontent-wfj-c162] {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 42px;
    padding-left: 16px;
    padding-right: 8px;
  }
  .variant__font-render[_ngcontent-wfj-c162] {
    overflow: hidden;
    position: relative;
  }
  .variant__style[_ngcontent-wfj-c162] {
    margin-bottom: 20px;
    margin-right: 8px;
    display: block;
    left: 0;
    position: -webkit-sticky;
    position: sticky;
  }
  .gf-dark-theme[_nghost-wfj-c162] .variant[_ngcontent-wfj-c162]:before,
  .gf-dark-theme [_nghost-wfj-c162] .variant[_ngcontent-wfj-c162]:before {
    border-top: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c162] .variant[_ngcontent-wfj-c162]:last-child:after,
  .gf-dark-theme
    [_nghost-wfj-c162]
    .variant[_ngcontent-wfj-c162]:last-child:after {
    border-bottom: 1px solid #5f6368;
  }
  .filter-row[_ngcontent-wfj-c191] {
    margin-bottom: 32px;
    margin-top: 40px;
  }
  .filter-row[_ngcontent-wfj-c191] gf-noto-filter-row[_ngcontent-wfj-c191] {
    display: inline-block;
  }
  .filter-row__label[_ngcontent-wfj-c191] {
    margin-right: 8px;
  }
  .playground__container[_ngcontent-wfj-c191] {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .sliders-wrapper[_ngcontent-wfj-c191] {
    margin-right: 40px;
  }
  .preview-wrapper[_ngcontent-wfj-c191] {
    border: 1px solid #dadce0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    min-width: 282px;
  }
  .preview__text[_ngcontent-wfj-c191] {
    border-bottom: 1px solid #dadce0;
  }
  .toolbar[_ngcontent-wfj-c191] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    background: #f8f9fa;
    border-bottom: 1px solid #dadce0;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 4px 0;
    width: 100%;
  }
  .toolbar__divider[_ngcontent-wfj-c191] {
    height: 24px;
  }
  .toolbar__alignments-and-line-spacing[_ngcontent-wfj-c191] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }
  gf-content-editable[_ngcontent-wfj-c191] {
    padding: 20px 24px;
  }
  gf-content-editable[_ngcontent-wfj-c191]:focus-visible {
    outline: none;
  }
  gf-content-editable.focused[_ngcontent-wfj-c191] {
    border-left: 4px solid #5f6368;
    border-right: 4px solid #5f6368;
    padding-left: 20px;
    padding-right: 20px;
  }
  gf-content-editable.hovered[_ngcontent-wfj-c191] {
    border-left: 4px solid #9aa0a6;
    border-right: 4px solid #9aa0a6;
    padding-left: 20px;
    padding-right: 20px;
  }
  .gf-dark-theme[_nghost-wfj-c191] .preview-wrapper[_ngcontent-wfj-c191],
  .gf-dark-theme [_nghost-wfj-c191] .preview-wrapper[_ngcontent-wfj-c191] {
    border: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c191] .preview__text[_ngcontent-wfj-c191],
  .gf-dark-theme [_nghost-wfj-c191] .preview__text[_ngcontent-wfj-c191] {
    border-bottom: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c191] .toolbar[_ngcontent-wfj-c191],
  .gf-dark-theme [_nghost-wfj-c191] .toolbar[_ngcontent-wfj-c191] {
    background: #202124;
    border-bottom: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c191]
    gf-content-editable.focused[_ngcontent-wfj-c191],
  .gf-dark-theme
    [_nghost-wfj-c191]
    gf-content-editable.focused[_ngcontent-wfj-c191] {
    border-left-color: #dadce0;
    border-right-color: #dadce0;
  }
  .gf-dark-theme[_nghost-wfj-c191]
    gf-content-editable.hovered[_ngcontent-wfj-c191],
  .gf-dark-theme
    [_nghost-wfj-c191]
    gf-content-editable.hovered[_ngcontent-wfj-c191] {
    border-left-color: #9aa0a6;
    border-right-color: #9aa0a6;
  }
  [_nghost-wfj-c155] {
    min-width: -webkit-fit-content;
    min-width: -moz-fit-content;
    min-width: fit-content;
  }
  .selection-toggle-button[_ngcontent-wfj-c155] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }
  .selection-toggle-button__content[_ngcontent-wfj-c155],
  .selection-toggle__icon[_ngcontent-wfj-c155] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .with--icon-label[_ngcontent-wfj-c155] {
    margin-left: 8px;
  }
  .selection-toggle__icon[_ngcontent-wfj-c155] {
    width: 20px;
  }
  gf-mini-playground[_nghost-wfj-c155]
    .selection-toggle-button__content[_ngcontent-wfj-c155],
  gf-mini-playground
    [_nghost-wfj-c155]
    .selection-toggle-button__content[_ngcontent-wfj-c155] {
    color: #1967d2;
  }
  .gf-dark-theme
    gf-mini-playground[_nghost-wfj-c155]
    .selection-toggle-button__content[_ngcontent-wfj-c155],
  .gf-dark-theme
    gf-mini-playground
    [_nghost-wfj-c155]
    .selection-toggle-button__content[_ngcontent-wfj-c155] {
    color: #8ab4f8;
  }
  [_nghost-wfj-c186] {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 0 8px;
  }
  .gf-menu-item[_ngcontent-wfj-c186] {
    border-bottom: 1px solid #dadce0;
  }
  .gf-menu-item[_ngcontent-wfj-c186]:last-child {
    border-bottom: none;
  }
  .menu-item-check-icon[_ngcontent-wfj-c186] {
    position: absolute;
    right: 16px;
  }
  .gf-dark-theme[_nghost-wfj-c186] .gf-menu-item[_ngcontent-wfj-c186],
  .gf-dark-theme [_nghost-wfj-c186] .gf-menu-item[_ngcontent-wfj-c186] {
    border-bottom: 1px solid #5f6368;
  }
  [_nghost-wfj-c185] {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }
  .color-item[_ngcontent-wfj-c185] {
    border: 1px solid transparent;
    border-radius: 10px;
    display: inline-block;
    height: 20px;
    margin-right: 4px;
    margin-bottom: 4px;
    min-height: 0;
    padding: 0;
    vertical-align: middle;
    width: 20px;
  }
  .color-item[_ngcontent-wfj-c185]:focus {
    box-shadow: 0 0 3px 1px #202124;
  }
  .color-item.color-item--dark[_ngcontent-wfj-c185]:focus {
    box-shadow: 0 0 3px 1px #f1f3f4;
  }
  .color-item--checked[_ngcontent-wfj-c185] {
    color: #202124;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    top: -1px;
  }
  .color-picker__hex[_ngcontent-wfj-c185] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 16px;
  }
  .color-item__hex[_ngcontent-wfj-c185] {
    border-color: #dadce0;
    border-radius: 10px;
    margin: 0 8px 0 0;
  }
  .color-picker__input[_ngcontent-wfj-c185] {
    border-radius: 4px;
    margin-left: 8px;
    min-height: 0;
    padding-left: 16px;
  }
  .color-item__hex-prefix[_ngcontent-wfj-c185] {
    position: absolute;
    left: 16px;
  }
  .color-item__hex-exclamation[_ngcontent-wfj-c185] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    background: #d93025;
    border-radius: 10px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 0;
    position: absolute;
    right: 0;
  }
  .color-picker__exclamation-icon[_ngcontent-wfj-c185] {
    color: #fff;
  }
  [_nghost-wfj-c187] {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }
  .menu-item-check-icon[_ngcontent-wfj-c187] {
    position: absolute;
    right: 12px;
  }
  .mat-expansion-panel[_ngcontent-wfj-c189] {
    margin: 0;
  }
  .select-expansion__title[_ngcontent-wfj-c189] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .select-expansion__icon[_ngcontent-wfj-c189] {
    color: #1a73e8;
  }
  .select-expansion__variant[_ngcontent-wfj-c189] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #dadce0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 8px 24px;
  }
  .select-expansion__variant[_ngcontent-wfj-c189]:first-child {
    border-top: 1px solid #dadce0;
  }
  .select-expansion__variant[_ngcontent-wfj-c189]:last-child {
    border-bottom: none;
  }
  .select-expansion__variant--focused[_ngcontent-wfj-c189],
  .select-expansion__variant[_ngcontent-wfj-c189]:hover {
    background-color: #f8f9fa;
  }
  .select-expansion__variant--focused[_ngcontent-wfj-c189] {
    border-left: 4px solid #5f6368;
    border-right: 4px solid #5f6368;
    padding: 8px 20px;
  }
  .select-expansion__variant-label[_ngcontent-wfj-c189] {
    color: #5f6368;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
  }
  .select-expansion__segment[_ngcontent-wfj-c189] {
    background: #f8f9fa;
    border-radius: 4px;
    font-variant-numeric: tabular-nums;
    padding: 8px;
  }
  .select-expansion__variant--focused[_ngcontent-wfj-c189]
    .select-expansion__segment[_ngcontent-wfj-c189],
  .select-expansion__variant[_ngcontent-wfj-c189]:hover
    .select-expansion__segment[_ngcontent-wfj-c189] {
    background: #e8eaed;
  }
  .select-expansion__toggle[_ngcontent-wfj-c189] {
    white-space: pre-line;
  }
  .gf-dark-theme[_nghost-wfj-c189] .mat-expansion-panel[_ngcontent-wfj-c189],
  .gf-dark-theme [_nghost-wfj-c189] .mat-expansion-panel[_ngcontent-wfj-c189] {
    background-color: #202124;
  }
  .gf-dark-theme[_nghost-wfj-c189] .select-expansion__icon[_ngcontent-wfj-c189],
  .gf-dark-theme [_nghost-wfj-c189] .select-expansion__icon[_ngcontent-wfj-c189] {
    color: #8ab4f8;
  }
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189],
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189] {
    border-bottom: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189]:first-child,
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189]:first-child {
    border-top: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant--focused[_ngcontent-wfj-c189],
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant--focused[_ngcontent-wfj-c189],
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189]:hover,
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189]:hover {
    background-color: #28292c;
  }
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189]:hover,
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189]:hover {
    border-left-color: #e8eaed;
    border-right-color: #e8eaed;
  }
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant--focused[_ngcontent-wfj-c189],
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant--focused[_ngcontent-wfj-c189] {
    border-left-color: #dadce0;
    border-right-color: #dadce0;
  }
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant--focused[_ngcontent-wfj-c189]:hover
    .select-expansion__segment[_ngcontent-wfj-c189],
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant--focused[_ngcontent-wfj-c189]:hover
    .select-expansion__segment[_ngcontent-wfj-c189],
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant-label[_ngcontent-wfj-c189],
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant-label[_ngcontent-wfj-c189] {
    color: #e8eaed;
  }
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__segment[_ngcontent-wfj-c189],
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__segment[_ngcontent-wfj-c189] {
    background-color: #3c4043;
  }
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant--focused[_ngcontent-wfj-c189]
    .select-expansion__segment[_ngcontent-wfj-c189],
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant--focused[_ngcontent-wfj-c189]
    .select-expansion__segment[_ngcontent-wfj-c189],
  .gf-dark-theme[_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189]:hover
    .select-expansion__segment[_ngcontent-wfj-c189],
  .gf-dark-theme
    [_nghost-wfj-c189]
    .select-expansion__variant[_ngcontent-wfj-c189]:hover
    .select-expansion__segment[_ngcontent-wfj-c189] {
    background: #5f6368;
  }
  [_nghost-wfj-c193] {
    display: inline-block;
  }
  [_nghost-wfj-c193] .specimen__designers[_nghost-wfj-c193],
  .specimen__designers [_nghost-wfj-c193] {
    margin-right: 40px;
    width: auto;
  }
  [_nghost-wfj-c193] .specimen__designers.designer-has-bio[_nghost-wfj-c193],
  .specimen__designers .designer-has-bio[_nghost-wfj-c193] {
    width: 100%;
    margin-right: 8px;
  }
  [_nghost-wfj-c193] .specimen__designers[_nghost-wfj-c193]:not(:last-child),
  .specimen__designers [_nghost-wfj-c193]:not(:last-child) {
    margin-bottom: 24px;
  }
  .designer-header[_ngcontent-wfj-c193] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
  .designer-header__avatar[_ngcontent-wfj-c193],
  .designer-header__initials[_ngcontent-wfj-c193] {
    border-radius: 100%;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 40px;
    margin-right: 16px;
    width: 40px;
  }
  .designer-image[_ngcontent-wfj-c193] {
    object-fit: cover;
  }
  .designer-header__initials[_ngcontent-wfj-c193] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
  }
  .designer-header__initials--0[_ngcontent-wfj-c193] {
    background: #34a853;
  }
  .designer-header__initials--1[_ngcontent-wfj-c193] {
    background: #fa7b17;
  }
  .designer-header__initials--2[_ngcontent-wfj-c193] {
    background: #f439a0;
  }
  .designer-header__initials--3[_ngcontent-wfj-c193] {
    background: #a142f4;
  }
  .designer-header__initials--4[_ngcontent-wfj-c193] {
    background: #24c1e0;
  }
  .designer-bio[_ngcontent-wfj-c193] {
    margin-top: 24px;
    max-width: 800px;
    padding-bottom: 40px;
  }
  [_nghost-wfj-c151] {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 1090px;
    padding-top: 64px;
  }
  .has-no-breadcrumb[_nghost-wfj-c151] {
    padding-top: 0;
  }
  .content__main[_ngcontent-wfj-c151] {
    margin: 0 auto;
    max-width: 760px;
    width: 100%;
  }
  .content__main--has-aside[_ngcontent-wfj-c151] {
    max-width: calc(100% - 272px);
  }
  @media (max-width: 720px) {
    .content__main--has-aside[_ngcontent-wfj-c151] {
      max-width: 100%;
    }
  }
  .content__aside[_ngcontent-wfj-c151] {
    min-width: 240px;
    margin-left: 24px;
    position: relative;
    width: 240px;
  }
  @media (max-width: 720px) {
    .content__aside[_ngcontent-wfj-c151] {
      width: 100%;
      margin-left: unset;
    }
  }
  .knowledge-glossary-page[_nghost-wfj-c151] .content__main[_ngcontent-wfj-c151],
  .knowledge-glossary-page
    [_nghost-wfj-c151]
    .content__main[_ngcontent-wfj-c151] {
    min-width: 760px;
  }
  @media (min-width: 721px) and (max-width: 1024px) {
    .knowledge-glossary-page[_nghost-wfj-c151]
      .content__main[_ngcontent-wfj-c151],
    .knowledge-glossary-page
      [_nghost-wfj-c151]
      .content__main[_ngcontent-wfj-c151] {
      min-width: calc(100% - 272px);
    }
  }
  .knowledge-glossary-page[_nghost-wfj-c151] .content__aside[_ngcontent-wfj-c151],
  .knowledge-glossary-page
    [_nghost-wfj-c151]
    .content__aside[_ngcontent-wfj-c151] {
    min-width: unset;
    margin-left: 16px;
  }
  .description[_ngcontent-wfj-c157] {
    margin-bottom: 40px;
  }
  @media (max-width: 720px) {
    gf-knowledge-choosing-type[_nghost-wfj-c157]
      .description[_ngcontent-wfj-c157],
    gf-knowledge-choosing-type
      [_nghost-wfj-c157]
      .description[_ngcontent-wfj-c157] {
      margin-bottom: 24px;
    }
  }
  gf-knowledge-module-section.featured[_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ),
  gf-knowledge-choosing-type[_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ),
  gf-knowledge-choosing-type
    [_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ) {
    border-color: #1967d2;
    color: #1967d2;
  }
  .gf-dark-theme
    gf-knowledge-module-section.featured[_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ),
  .gf-dark-themegf-knowledge-choosing-type[_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ),
  .gf-dark-themegf-knowledge-choosing-type
    [_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ),
  .gf-dark-theme
    gf-knowledge-choosing-type[_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ),
  .gf-dark-theme
    gf-knowledge-choosing-type
    [_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ),
  gf-knowledge-choosing-type
    .gf-dark-theme[_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ),
  gf-knowledge-choosing-type
    .gf-dark-theme
    [_nghost-wfj-c157]
    .module__view-all-button.mat-mdc-outlined-button.mat-primary[_ngcontent-wfj-c157]:not(
      [disabled]
    ) {
    border-color: #8ab4f8;
    color: #8ab4f8;
  }
  [_nghost-wfj-c156] {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    aspect-ratio: 5;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    line-height: 0;
    margin: 32px auto 0;
    max-width: 568px;
    width: 100%;
  }
  svg[_ngcontent-wfj-c156] {
    bottom: 0;
    left: 50%;
    max-width: 500px;
    position: absolute;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    width: 80%;
  }
  .static[_nghost-wfj-c156],
  .static [_nghost-wfj-c156] {
    margin-top: 0;
  }
  .static[_nghost-wfj-c156] svg[_ngcontent-wfj-c156],
  .static [_nghost-wfj-c156] svg[_ngcontent-wfj-c156] {
    bottom: auto;
    left: auto;
    position: static;
    -webkit-transform: none;
    transform: none;
  }
  .short[_nghost-wfj-c156],
  .short [_nghost-wfj-c156] {
    margin-bottom: -16px;
    margin-top: -8px;
  }
  .header[_ngcontent-wfj-c153] {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 40px;
  }
  @media (max-width: 720px) {
    .header[_ngcontent-wfj-c153] {
      margin-bottom: 24px;
    }
  }
  @media (max-width: 720px) {
    footer[_ngcontent-wfj-c153] {
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -moz-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin-bottom: 80px;
    }
  }
  .featured[_nghost-wfj-c153] footer[_ngcontent-wfj-c153],
  .featured [_nghost-wfj-c153] footer[_ngcontent-wfj-c153] {
    margin-bottom: 0;
  }
  [_nghost-wfj-c152] {
    display: block;
    margin: 0 0 24px;
    position: relative;
  }
  @media (max-width: 720px) {
    [_nghost-wfj-c152] {
      overflow: hidden;
    }
  }
  .gradient[_ngcontent-wfj-c152] {
    content: "";
    display: block;
    height: 100%;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 87px;
    z-index: 2;
  }
  .gradient--right[_ngcontent-wfj-c152] {
    background: -webkit-linear-gradient(
      179.53deg,
      #fff 56.18%,
      hsla(0, 0%, 100%, 0) 97.24%
    );
    background: linear-gradient(
      270.47deg,
      #fff 56.18%,
      hsla(0, 0%, 100%, 0) 97.24%
    );
    right: -43px;
  }
  .gradient--left[_ngcontent-wfj-c152] {
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      color-stop(56.18%, #fff),
      color-stop(97.24%, hsla(0, 0%, 100%, 0))
    );
    background: -webkit-linear-gradient(
      left,
      #fff 56.18%,
      hsla(0, 0%, 100%, 0) 97.24%
    );
    background: linear-gradient(90deg, #fff 56.18%, hsla(0, 0%, 100%, 0) 97.24%);
    left: -43px;
  }
  .featured[_nghost-wfj-c152] .gradient--right[_ngcontent-wfj-c152],
  .featured [_nghost-wfj-c152] .gradient--right[_ngcontent-wfj-c152] {
    background: -webkit-linear-gradient(
      179.53deg,
      #e6f4ea 56.18%,
      rgba(230, 244, 234, 0) 97.24%
    );
    background: linear-gradient(
      270.47deg,
      #e6f4ea 56.18%,
      rgba(230, 244, 234, 0) 97.24%
    );
  }
  .featured[_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152],
  .featured [_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152] {
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      color-stop(56.18%, #e6f4ea),
      color-stop(97.24%, rgba(230, 244, 234, 0))
    );
    background: -webkit-linear-gradient(
      left,
      #e6f4ea 56.18%,
      rgba(230, 244, 234, 0) 97.24%
    );
    background: linear-gradient(
      90deg,
      #e6f4ea 56.18%,
      rgba(230, 244, 234, 0) 97.24%
    );
  }
  .glossary-carousel[_nghost-wfj-c152] .gradient--right[_ngcontent-wfj-c152],
  gf-knowledge-choosing-type[_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  gf-knowledge-choosing-type
    [_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152] {
    background: -webkit-linear-gradient(
      179.53deg,
      #fef7e0 56.18%,
      rgba(254, 247, 224, 0) 97.24%
    );
    background: linear-gradient(
      270.47deg,
      #fef7e0 56.18%,
      rgba(254, 247, 224, 0) 97.24%
    );
  }
  .glossary-carousel[_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152],
  gf-knowledge-choosing-type[_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152],
  gf-knowledge-choosing-type
    [_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152] {
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      color-stop(56.18%, #fef7e0),
      color-stop(97.24%, rgba(254, 247, 224, 0))
    );
    background: -webkit-linear-gradient(
      left,
      #fef7e0 56.18%,
      rgba(254, 247, 224, 0) 97.24%
    );
    background: linear-gradient(
      90deg,
      #fef7e0 56.18%,
      rgba(254, 247, 224, 0) 97.24%
    );
  }
  .scrollable[_ngcontent-wfj-c152] {
    -ms-overflow-style: none;
    overflow: auto;
    scroll-behavior: smooth;
    -webkit-scroll-snap-type: x mandatory;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    scrollbar-color: transparent transparent;
    scrollbar-width: none;
    width: 100%;
  }
  .scrollable[_ngcontent-wfj-c152]::-webkit-scrollbar {
    display: none;
  }
  .wrapper[_ngcontent-wfj-c152] {
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
  }
  @media (max-width: 1024px) {
    .wrapper[_ngcontent-wfj-c152] {
      gap: 8px;
    }
  }
  .wrapper[_ngcontent-wfj-c152] .carousel-item {
    overflow: hidden;
    scroll-snap-align: start;
    word-wrap: break-word;
  }
  .wrapper.carousel__cols-5[_ngcontent-wfj-c152] .carousel-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(22.2% - 14.2222222222px);
    -moz-box-flex: 0;
    -ms-flex: 0 0 calc(22.2% - 14.2222222222px);
    flex: 0 0 calc(22.2% - 14.2222222222px);
  }
  .wrapper.carousel__cols-5.show-full[_ngcontent-wfj-c152] .carousel-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(20% - 12.8px);
    -moz-box-flex: 0;
    -ms-flex: 0 0 calc(20% - 12.8px);
    flex: 0 0 calc(20% - 12.8px);
  }
  @media (max-width: 1024px) {
    .wrapper.carousel__cols-5.show-full[_ngcontent-wfj-c152] .carousel-item,
    .wrapper.carousel__cols-5[_ngcontent-wfj-c152] .carousel-item {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 140px;
      -moz-box-flex: 0;
      -ms-flex: 0 0 140px;
      flex: 0 0 140px;
    }
  }
  .tiny[_nghost-wfj-c152] .wrapper.carousel__cols-5[_ngcontent-wfj-c152],
  .tiny [_nghost-wfj-c152] .wrapper.carousel__cols-5[_ngcontent-wfj-c152] {
    gap: 8px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
  .tiny[_nghost-wfj-c152]
    .wrapper.carousel__cols-5[_ngcontent-wfj-c152]
    .carousel-item,
  .tiny
    [_nghost-wfj-c152]
    .wrapper.carousel__cols-5[_ngcontent-wfj-c152]
    .carousel-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 120px;
    -moz-box-flex: 0;
    -ms-flex: 0 1 120px;
    flex: 0 1 120px;
    padding: 8px 4px;
  }
  @media (max-width: 1024px) {
    .tiny[_nghost-wfj-c152]
      .wrapper.carousel__cols-5[_ngcontent-wfj-c152]
      .carousel-item,
    .tiny
      [_nghost-wfj-c152]
      .wrapper.carousel__cols-5[_ngcontent-wfj-c152]
      .carousel-item {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 88px;
      -moz-box-flex: 0;
      -ms-flex: 0 0 88px;
      flex: 0 0 88px;
    }
  }
  .wrapper.carousel__cols-3[_ngcontent-wfj-c152] .carousel-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(40% - 9.6px);
    -moz-box-flex: 0;
    -ms-flex: 0 0 calc(40% - 9.6px);
    flex: 0 0 calc(40% - 9.6px);
  }
  .wrapper.carousel__cols-3.show-full[_ngcontent-wfj-c152] .carousel-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(33.3% - 10.6666666667px);
    -moz-box-flex: 0;
    -ms-flex: 0 0 calc(33.3% - 10.6666666667px);
    flex: 0 0 calc(33.3% - 10.6666666667px);
  }
  @media (max-width: 1024px) {
    .wrapper.carousel__cols-3.show-full[_ngcontent-wfj-c152] .carousel-item,
    .wrapper.carousel__cols-3[_ngcontent-wfj-c152] .carousel-item {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 288px;
      -moz-box-flex: 0;
      -ms-flex: 0 0 288px;
      flex: 0 0 288px;
    }
  }
  .wrapper.carousel__cols-2[_ngcontent-wfj-c152] .carousel-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(60% + 1.6px);
    -moz-box-flex: 0;
    -ms-flex: 0 0 calc(60% + 1.6px);
    flex: 0 0 calc(60% + 1.6px);
  }
  .wrapper.carousel__cols-2.show-full[_ngcontent-wfj-c152] .carousel-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(50% - 8px);
    -moz-box-flex: 0;
    -ms-flex: 0 0 calc(50% - 8px);
    flex: 0 0 calc(50% - 8px);
  }
  @media (max-width: 1024px) {
    .wrapper.carousel__cols-2.show-full[_ngcontent-wfj-c152] .carousel-item,
    .wrapper.carousel__cols-2[_ngcontent-wfj-c152] .carousel-item {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 440px;
      -moz-box-flex: 0;
      -ms-flex: 0 0 440px;
      flex: 0 0 440px;
    }
  }
  .flip-horizontally[_ngcontent-wfj-c152] {
    -webkit-transform: scaleX(-1) translateX(2px);
    transform: scaleX(-1) translateX(2px);
  }
  .nav-button[_ngcontent-wfj-c152] {
    background: #fff;
    color: #5f6368;
    height: 48px;
    position: absolute;
    top: 50%;
    width: 48px;
    z-index: 20;
  }
  @media (max-width: 720px) {
    .nav-button[_ngcontent-wfj-c152] {
      display: none;
    }
  }
  .nav-button--left[_ngcontent-wfj-c152] {
    left: 0;
    -webkit-transform: translate(-50%, -24px);
    transform: translate(-50%, -24px);
  }
  .nav-button--right[_ngcontent-wfj-c152] {
    right: 0;
    -webkit-transform: translate(50%, -24px);
    transform: translate(50%, -24px);
  }
  .nav-button__icon[_ngcontent-wfj-c152] {
    color: #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c152] .nav-button[_ngcontent-wfj-c152],
  .gf-dark-theme [_nghost-wfj-c152] .nav-button[_ngcontent-wfj-c152] {
    background: #3c4043;
    color: #9aa0a6;
  }
  .gf-dark-theme[_nghost-wfj-c152] .nav-button__icon[_ngcontent-wfj-c152],
  .gf-dark-theme [_nghost-wfj-c152] .nav-button__icon[_ngcontent-wfj-c152] {
    color: #e8eaed;
  }
  .gf-dark-theme[_nghost-wfj-c152] .gradient--right[_ngcontent-wfj-c152],
  .gf-dark-theme [_nghost-wfj-c152] .gradient--right[_ngcontent-wfj-c152] {
    background: -webkit-linear-gradient(
      179.53deg,
      #202124 56.18%,
      rgba(32, 33, 36, 0) 97.24%
    );
    background: linear-gradient(
      270.47deg,
      #202124 56.18%,
      rgba(32, 33, 36, 0) 97.24%
    );
  }
  .gf-dark-theme[_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152],
  .gf-dark-theme [_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152] {
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      color-stop(56.18%, #202124),
      color-stop(97.24%, rgba(32, 33, 36, 0))
    );
    background: -webkit-linear-gradient(
      left,
      #202124 56.18%,
      rgba(32, 33, 36, 0) 97.24%
    );
    background: linear-gradient(
      90deg,
      #202124 56.18%,
      rgba(32, 33, 36, 0) 97.24%
    );
  }
  .gf-dark-theme
    .glossary-carousel[_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  .gf-dark-themegf-knowledge-choosing-type[_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  .gf-dark-themegf-knowledge-choosing-type
    [_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  .gf-dark-theme
    gf-knowledge-choosing-type[_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  .gf-dark-theme
    gf-knowledge-choosing-type
    [_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  gf-knowledge-choosing-type
    .gf-dark-theme[_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  gf-knowledge-choosing-type
    .gf-dark-theme
    [_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152] {
    background: -webkit-linear-gradient(
      179.53deg,
      #3b372c 56.18%,
      rgba(59, 55, 44, 0) 97.24%
    );
    background: linear-gradient(
      270.47deg,
      #3b372c 56.18%,
      rgba(59, 55, 44, 0) 97.24%
    );
  }
  .gf-dark-theme
    .glossary-carousel[_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152],
  .gf-dark-themegf-knowledge-choosing-type[_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152],
  .gf-dark-themegf-knowledge-choosing-type
    [_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152],
  .gf-dark-theme
    gf-knowledge-choosing-type[_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152],
  .gf-dark-theme
    gf-knowledge-choosing-type
    [_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152],
  gf-knowledge-choosing-type
    .gf-dark-theme[_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152],
  gf-knowledge-choosing-type
    .gf-dark-theme
    [_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152] {
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      color-stop(56.18%, #3b372c),
      color-stop(97.24%, rgba(59, 55, 44, 0))
    );
    background: -webkit-linear-gradient(
      left,
      #3b372c 56.18%,
      rgba(59, 55, 44, 0) 97.24%
    );
    background: linear-gradient(
      90deg,
      #3b372c 56.18%,
      rgba(59, 55, 44, 0) 97.24%
    );
  }
  .gf-dark-theme.featured[_nghost-wfj-c152] .gradient--right[_ngcontent-wfj-c152],
  .gf-dark-theme.featured
    [_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  .gf-dark-theme
    .featured[_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  .gf-dark-theme
    .featured
    [_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  .featured
    .gf-dark-theme[_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152],
  .featured
    .gf-dark-theme
    [_nghost-wfj-c152]
    .gradient--right[_ngcontent-wfj-c152] {
    background: -webkit-linear-gradient(
      179.53deg,
      #2c3532 56.18%,
      rgba(44, 53, 50, 0) 97.24%
    );
    background: linear-gradient(
      270.47deg,
      #2c3532 56.18%,
      rgba(44, 53, 50, 0) 97.24%
    );
  }
  .gf-dark-theme.featured[_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152],
  .gf-dark-theme.featured [_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152],
  .gf-dark-theme .featured[_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152],
  .gf-dark-theme
    .featured
    [_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152],
  .featured .gf-dark-theme[_nghost-wfj-c152] .gradient--left[_ngcontent-wfj-c152],
  .featured
    .gf-dark-theme
    [_nghost-wfj-c152]
    .gradient--left[_ngcontent-wfj-c152] {
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      color-stop(56.18%, #2c3532),
      color-stop(97.24%, rgba(44, 53, 50, 0))
    );
    background: -webkit-linear-gradient(
      left,
      #2c3532 56.18%,
      rgba(44, 53, 50, 0) 97.24%
    );
    background: linear-gradient(
      90deg,
      #2c3532 56.18%,
      rgba(44, 53, 50, 0) 97.24%
    );
  }
  .card__wrapper[_ngcontent-wfj-c150] {
    background: #fff;
    border: 1px solid #dadce0;
    border-radius: 12px;
    display: inline-block;
    padding: 16px;
    width: 100%;
  }
  .card__wrapper[_ngcontent-wfj-c150]:focus {
    background: #e8e8e8;
  }
  .card__wrapper[_ngcontent-wfj-c150]:hover {
    background: #f7f7f7;
  }
  .card__wrapper[_ngcontent-wfj-c150]:active {
    background: #fdfdfd;
  }
  .small[_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150],
  .small [_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150] {
    padding: 8px;
    text-align: center;
  }
  .fill-height[_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150],
  .fill-height [_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150] {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -webkit-box-pack: start;
    -webkit-justify-content: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start;
  }
  .fill-height[_nghost-wfj-c150]
    .card__wrapper.card__wrapper--no-image[_ngcontent-wfj-c150],
  .fill-height
    [_nghost-wfj-c150]
    .card__wrapper.card__wrapper--no-image[_ngcontent-wfj-c150] {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
  .condensed[_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150],
  .condensed [_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150] {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    height: 144px;
  }
  .condensed[_nghost-wfj-c150] .card__image[_ngcontent-wfj-c150],
  .condensed [_nghost-wfj-c150] .card__image[_ngcontent-wfj-c150] {
    height: 100%;
    margin-right: 24px;
    width: auto;
  }
  .condensed[_nghost-wfj-c150] .card__title[_ngcontent-wfj-c150],
  .condensed [_nghost-wfj-c150] .card__title[_ngcontent-wfj-c150] {
    margin-top: 0;
  }
  .card__image[_ngcontent-wfj-c150] {
    width: 100%;
  }
  .card__image--painted[_ngcontent-wfj-c150] {
    background: rgba(232, 240, 254, 0.6);
  }
  .card__title[_ngcontent-wfj-c150] {
    color: #3c4043;
    margin-top: 24px;
  }
  .card__title.card__title--no-image[_ngcontent-wfj-c150] {
    margin-top: 8px;
  }
  .card__title.card__title--no-description[_ngcontent-wfj-c150] {
    margin-bottom: 8px;
  }
  .card__description[_ngcontent-wfj-c150] {
    color: #5f6368;
    margin: 8px 0;
  }
  .card__description.card__description--no-image[_ngcontent-wfj-c150] {
    margin-bottom: 0;
  }
  .gf-dark-theme[_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150],
  .gf-dark-theme [_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150] {
    background: transparent;
    border: 1px solid #5f6368;
  }
  .gf-dark-theme[_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150]:focus,
  .gf-dark-theme [_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150]:focus {
    background: #38393c;
  }
  .gf-dark-theme[_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150]:hover,
  .gf-dark-theme [_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150]:hover {
    background: #28292c;
  }
  .gf-dark-theme[_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150]:active,
  .gf-dark-theme [_nghost-wfj-c150] .card__wrapper[_ngcontent-wfj-c150]:active {
    background: #222326;
  }
  .gf-dark-theme[_nghost-wfj-c150] .card__title[_ngcontent-wfj-c150],
  .gf-dark-theme [_nghost-wfj-c150] .card__title[_ngcontent-wfj-c150] {
    color: #e8eaed;
  }
  .gf-dark-theme[_nghost-wfj-c150] .card__description[_ngcontent-wfj-c150],
  .gf-dark-theme [_nghost-wfj-c150] .card__description[_ngcontent-wfj-c150] {
    color: #9aa0a6;
  }
  .gf-dark-theme[_nghost-wfj-c150] .card__image[_ngcontent-wfj-c150],
  .gf-dark-theme [_nghost-wfj-c150] .card__image[_ngcontent-wfj-c150] {
    background: #f3f7fe;
  }
  .mdc-tooltip__surface {
    border-radius: 4px;
    border-radius: var(--mdc-shape-small, 4px);
  }
  .mdc-tooltip__caret-surface-top,
  .mdc-tooltip__caret-surface-bottom {
    border-radius: 4px;
    border-radius: var(--mdc-shape-small, 4px);
  }
  .mdc-tooltip__surface {
    word-break: break-all;
    word-break: var(--mdc-tooltip-word-break, normal);
    overflow-wrap: anywhere;
  }
  .mdc-tooltip {
    z-index: 9;
  }
  .mdc-tooltip {
    position: fixed;
    display: none;
  }
  .mdc-tooltip-wrapper--rich {
    position: relative;
  }
  .mdc-tooltip--shown,
  .mdc-tooltip--showing,
  .mdc-tooltip--hide {
    display: inline-flex;
  }
  .mdc-tooltip--shown.mdc-tooltip--rich,
  .mdc-tooltip--showing.mdc-tooltip--rich,
  .mdc-tooltip--hide.mdc-tooltip--rich {
    display: inline-block;
    left: -320px;
    position: absolute;
  }
  .mdc-tooltip__surface {
    line-height: 16px;
    padding: 4px 8px;
    min-width: 40px;
    max-width: 200px;
    min-height: 24px;
    max-height: 40vh;
    box-sizing: border-box;
    overflow: hidden;
    text-align: center;
  }
  .mdc-tooltip__surface::before {
    position: absolute;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: 1px solid transparent;
    border-radius: inherit;
    content: "";
    pointer-events: none;
  }
  @media screen and (forced-colors: active) {
    .mdc-tooltip__surface::before {
      border-color: CanvasText;
    }
  }
  .mdc-tooltip--rich .mdc-tooltip__surface {
    align-items: flex-start;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    line-height: 20px;
    min-height: 24px;
    min-width: 40px;
    max-width: 320px;
    position: relative;
  }
  .mdc-tooltip--rich .mdc-tooltip__surface .mdc-elevation-overlay {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }
  .mdc-tooltip--multiline .mdc-tooltip__surface {
    text-align: left;
  }
  [dir="rtl"] .mdc-tooltip--multiline .mdc-tooltip__surface,
  .mdc-tooltip--multiline .mdc-tooltip__surface[dir="rtl"] {
    text-align: right;
  }
  .mdc-tooltip__surface .mdc-tooltip__title {
    display: block;
    margin-top: 0;
    line-height: 20px;
    margin: 0 8px;
  }
  .mdc-tooltip__surface .mdc-tooltip__title::before {
    display: inline-block;
    width: 0;
    height: 24px;
    content: "";
    vertical-align: 0;
  }
  .mdc-tooltip__surface .mdc-tooltip__content {
    max-width: calc(200px - (2 * 8px));
    margin: 8px;
    text-align: left;
  }
  [dir="rtl"] .mdc-tooltip__surface .mdc-tooltip__content,
  .mdc-tooltip__surface .mdc-tooltip__content[dir="rtl"] {
    text-align: right;
  }
  .mdc-tooltip--rich .mdc-tooltip__surface .mdc-tooltip__content {
    max-width: calc(320px - (2 * 8px));
    align-self: stretch;
  }
  .mdc-tooltip__surface .mdc-tooltip__content-link {
    text-decoration: none;
  }
  .mdc-tooltip--rich-actions,
  .mdc-tooltip__content,
  .mdc-tooltip__title {
    z-index: 1;
  }
  .mdc-tooltip__surface-animation {
    opacity: 0;
    transform: scale(0.8);
    will-change: transform, opacity;
  }
  .mdc-tooltip--shown .mdc-tooltip__surface-animation {
    transform: scale(1);
    opacity: 1;
  }
  .mdc-tooltip--hide .mdc-tooltip__surface-animation {
    transform: scale(1);
  }
  .mdc-tooltip__caret-surface-top,
  .mdc-tooltip__caret-surface-bottom {
    position: absolute;
    height: 24px;
    width: 24px;
    transform: rotate(35deg) skewY(20deg) scaleX(0.9396926208);
  }
  .mdc-tooltip__caret-surface-top .mdc-elevation-overlay,
  .mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }
  .mdc-tooltip__caret-surface-bottom {
    outline: 1px solid transparent;
    z-index: -1;
  }
  @media screen and (forced-colors: active) {
    .mdc-tooltip__caret-surface-bottom {
      outline-color: CanvasText;
    }
  }
  .mat-mdc-tooltip {
    position: relative;
    transform: scale(0);
  }
  .mat-mdc-tooltip::before {
    content: "";
    top: -8px;
    right: -8px;
    bottom: -8px;
    left: -8px;
    z-index: -1;
    position: absolute;
  }
  .mat-mdc-tooltip._mat-animation-noopable {
    animation: none;
    transform: scale(1);
  }
  .mat-mdc-tooltip-panel-non-interactive {
    pointer-events: none;
  }
  @keyframes mat-mdc-tooltip-show {
    0% {
      opacity: 0;
      transform: scale(0.8);
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  @keyframes mat-mdc-tooltip-hide {
    0% {
      opacity: 1;
      transform: scale(1);
    }
    100% {
      opacity: 0;
      transform: scale(0.8);
    }
  }
  .mat-mdc-tooltip-show {
    animation: mat-mdc-tooltip-show 150ms cubic-bezier(0, 0, 0.2, 1) forwards;
  }
  .mat-mdc-tooltip-hide {
    animation: mat-mdc-tooltip-hide 75ms cubic-bezier(0.4, 0, 1, 1) forwards;
  }
  .button-25 {
    appearance: button;
    background-color: #F11237;
    border: 1px solid #F11237;
    border-radius: 4px;
    box-sizing: border-box;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    line-height: 1.15;
    overflow: visible;
    padding: 12px 16px;
    position: relative;
    text-align: center;
    text-transform: none;
    transition: all 80ms ease-in-out;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    width: fit-content;
  }
  .button-26 {
    appearance: button;
    background-color: var(--main-color);
    border: 1px solid var(--main-color);
    border-radius: 4px;
    box-sizing: border-box;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    line-height: 1.15;
    overflow: visible;
    padding: 12px 16px;
    position: relative;
    text-align: center;
    text-transform: none;
    transition: all 80ms ease-in-out;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    width: fit-content;
  }
  .button-26:disabled {
    opacity: 0.5;
  }
  .button-26:focus {
    outline: 0;
  }
  .button-26:hover {
    background-color: #FF294C;
    border-color: #FF294C;
  }
  .button-26:active {
    background-color: #0039d7;
    border-color: #0039d7;
  }
  .head-title {
    padding: 10px 0px 10px 0;
    display: flex;
    font-size: 1.8rem;
    border-radius: 5px;
  }
  
  /* font image */
  .cont-img {
    height: 500px;
    margin-bottom: 15px;
  }
  
  .font-image {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    object-fit: cover;
  }
  
  /* font description */
  .font-description {
    margin: 25px 0 25px 0;
  }
  
  /* navbar */
  .navbar-first .container-fluid .navbar-header .navbar-nav .nav-item ul li a {
    color: #333;
  }
  .navbar-third .container-fluid .navbar-header .navbar-nav .nav-item ul li a {
    color: #333;
  }
  .navbar-fifth .container-fluid .navbar-header .navbar-nav .nav-item ul li a {
    color: #333;
  }
  .navbar-sixth .container-fluid .navbar-header .navbar-nav .nav-item ul li a {
    color: #333;
  }
  .navbar-seventh .container-fluid .navbar-header .navbar-nav .nav-item ul li a {
    color: #333;
  }
  .navbar-eighth .container-fluid .navbar-header .navbar-nav .nav-item ul li a {
    color: #333;
  }
  .navbar-ninth .container-fluid .navbar-header .navbar-nav .nav-item ul li a {
    color: #333;
  }
  
  /* category bar */
  .categoryBar {
    width: 100%;
    background-color: #1a3d56;
    font-size: 12px;
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 5px;
    font-size: 12px;
    margin-top: 15px;
    padding-bottom: 15px;
  }
  .categoryBarInner {
    padding: 12px;
    border-radius: 7px;
  }
  .letterListing {
    margin-left: auto;
    margin-right: auto;
  }
  .categoryLink,
  .letterLink {
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .categoryLink {
    width: 132px;
  }
  .cont-cate{
    width: 100%;
  }
  .categoryLink a {
    color: #fffafa;
  }
  .categoryLink a:hover {
    color: #faf5a9;
  }
  
  .letterListing .tittle-abc {
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
    font-weight: 700;
  }
  
  /* nav category */
  .nav-cat {
    margin: 20px auto 0;
    position: relative;
    width: 100%;
    height: 50px;
    background-color: #1a3d56;
    border-radius: 5px;
    font-size: 0;
    display: flex;
  }
  .nav-cat a {
    line-height: 50px;
    height: 100%;
    font-size: 15px;
    display: inline-block;
    position: relative;
    z-index: 1;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    color: white;
    cursor: pointer;
    width: inherit;
  }
  .nav-cat .animation {
    position: absolute;
    height: 100%;
    top: 0;
    z-index: 0;
    transition: all 0.5s ease 0s;
    border-radius: 8px;
  }
  
  .nav-cat a:hover {
    background-color: #e68500;
    border-radius: 5px;
  }
  
  /* search bar */
  .wrapper {
    width: 100%;
    max-width: 31.25rem;
    /*margin: 6rem auto;*/
  }
  
  .label {
    font-size: 0.625rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: +1.3px;
    margin-bottom: 1rem;
  }
  
  .searchBar {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  
  .searchQueryInput {
    font-family: "Poppins", Arial, sans-serif;
    width: 100%;
    height: 2.4rem;
    background: #f5f5f5;
    outline: none;
    border: none;
    border-radius: 1.625rem;
    padding: 0 3.5rem 0 1.5rem;
    font-size: 1rem;
  }
  
  .searchQuerySubmit {
    width: 3.5rem;
    height: 2.4rem;
    margin-left: -3.5rem;
    background: none;
    border: none;
    outline: none;
  }
  
  .searchQuerySubmit:hover {
    cursor: pointer;
  }
  
  /* ads */
  .space-for-ads{
    width: 100%;
    margin: 10px 0 10px 0;
    height: auto !important;
  }
  
  
  /* FontOverviewBox */
  .text-center {
    text-align: center;
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
  }
  
  .character {
    padding-top: 20px;
    padding-bottom: 20px;
    line-height: 1.4;
    word-wrap: break-word;
    padding-top: 0.7em;
  }
  
  .style-target {
    font-size: 42.4px;
  }
  
  .alphabet {
    background-color: var(--secondary-color);
    color: #fff;
    border-radius: 5px;
  }
  
  .Showcase {
    background: #f6f6f6;
    padding: 20px 40px;
    width: auto;
    display: block;
  }
  
  .Showcase .ShowCaseItem {
    display: inline-block;
    padding: 20px;
    text-align: center;
    font-family: "Poppins", "Arial", sans-serif;
    font-style: normal;
    font-weight: normal;
    font-stretch: normal;
    color: #888;
    cursor: default;
  }
  
  @media (min-width: 1025px) {
    .Showcase .ShowCaseItem {
      font-size: 15px;
    }
  }
  
  @media (max-width: 1024px) {
    .Showcase .ShowCaseItem {
      font-size: 18px;
    }
  }
  
  .Showcase .ShowCaseItem .ItemHead {
    font-size: 130px;
    line-height: 100%;
    color: #000;
  }
  
  .Showcase .ShowCaseItem .ItemHead a {
    color: #000;
  }
  
  .Showcase .ShowCaseItem .ItemHead a:hover,
  .Showcase .ShowCaseItem .ItemHead a:focus {
    text-decoration: none;
  }
  
  .OverviewMainSettings {
    text-align: right;
    padding: 0 20px;
  }
  
  .OverviewMainSettings .PermalinkResetDropdown {
    text-align: left;
  }
  
  .OverviewMainSettings .AvailableEncodingCustomTextsDropdown {
    display: inline-block;
    margin: 20px 10px;
  }
  
  .OverviewStickyScroll {
    position: absolute;
    font-family: "Greta Sans Light", "Helvetica Neue", "Helvetica", "Arial",
      sans-serif;
    font-style: normal;
    font-weight: normal;
    font-stretch: normal;
    padding-left: 10px;
  }
  
  @media (min-width: 1025px) {
    .OverviewStickyScroll {
      font-size: 15px;
    }
  }
  
  @media (max-width: 1024px) {
    .OverviewStickyScroll {
      font-size: 18px;
    }
  }
  
  .OverviewStickyScroll.fixed {
    position: fixed;
  }
  
  .OverviewStickyScroll .StickyPanel {
    z-index: 10;
  }
  
  .OverviewStickyScroll .StickyPanel > a {
    display: block;
    border-radius: 15px;
    padding: 0 10px 0 0;
    color: #555;
  }
  
  .OverviewStickyScroll .StickyPanel > a.active:hover .dot,
  .OverviewStickyScroll .StickyPanel > a.active:focus .dot {
    background: #555;
  }
  
  .OverviewStickyScroll .StickyPanel > a.active .dot {
    background: #222;
  }
  
  .OverviewStickyScroll .StickyPanel > a > span {
    display: none;
    z-index: 10;
    line-height: 25px;
  }
  
  .OverviewStickyScroll .StickyPanel > a .dot {
    width: 6px;
    height: 6px;
    background: #ddd;
    border-radius: 3px;
    display: inline-block;
    vertical-align: middle;
    margin: 10px;
  }
  
  .OverviewStickyScroll .StickyPanel > a:hover,
  .OverviewStickyScroll .StickyPanel > a:focus {
    background: #222;
    color: #aaa;
  }
  
  .OverviewStickyScroll .StickyPanel > a:hover > span,
  .OverviewStickyScroll .StickyPanel > a:focus > span {
    display: inline-block;
  }
  
  .OverviewStickyScroll .StickyPanel > a:hover .dot,
  .OverviewStickyScroll .StickyPanel > a:focus .dot {
    background: #ddd;
  }
  
  .OverviewContainer {
    margin: 0 90px 90px;
  }
  
  .OverviewContainer .Text:focus {
    outline: 0px transparent;
  }
  
  .OverviewContainer .CustomEncodingText {
    display: none;
  }
  
  .FontOverviewBox {
    display: none;
    position: relative;
    padding: 0 10px 70px;
  }
  
  .FontOverviewBox:hover,
  .FontOverviewBox:focus {
    background: #f6f6f6;
  }
  
  .FontOverviewBox:hover > .StatusBar,
  .FontOverviewBox:focus > .StatusBar {
    display: none !important;
  }
  
  .FontOverviewBox:hover .Settings,
  .FontOverviewBox:focus .Settings {
    background-color: #f6f6f6;
  }
  
  .FontOverviewBox .Loader {
    display: none;
    background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 3;
  }
  
  .FontOverviewBox .Settings {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    height: 24px;
    z-index: 2;
    background-color: #fff;
  }
  
  .FontOverviewBox .Settings .field {
    display: inline-table;
    float: left;
  }
  
  .FontOverviewBox .Settings .field label {
    display: none;
  }
  
  .FontOverviewBox .Settings #StyleName select {
    border: transparent !important;
    height: 24px;
    line-height: 24px;
    float: left;
  }
  
  .FontOverviewBox .Settings #StyleAlign .align {
    background: transparent;
    cursor: pointer;
    display: inline-block;
  }
  
  .FontOverviewBox .Settings #StyleAlign .align .icon {
    fill: #aaa;
  }
  
  .FontOverviewBox .Settings #StyleAlign .align.selected .icon,
  .FontOverviewBox .Settings #StyleAlign .align:hover .icon,
  .FontOverviewBox .Settings #StyleAlign .align:focus .icon {
    fill: #000;
  }
  
  .FontOverviewBox .Settings #StyleAlign .align.selected {
    pointer-events: none;
    cursor: default;
  }
  
  .FontOverviewBox .Settings #StyleSize {
    position: relative;
    top: 10px;
  }
  
  .FontOverviewBox .Settings .FontPreviewLetters {
    display: none;
  }
  
  .FontOverviewBox .Text {
    position: relative;
    top: 40px;
    color: #000;
    width: 100%;
    overflow: hidden;
  }
  
  .FontOverviewBox .Text:hover,
  .FontOverviewBox .Text:focus {
    cursor: pointer;
  }
  
  .FontOverviewBox .Text:hover .mytooltip,
  .FontOverviewBox .Text:focus .mytooltip {
    display: block;
    position: fixed;
    overflow: hidden;
  }
  
  .FontOverviewBox .Text:focus {
    cursor: text;
  }
  
  .FontOverviewBox .Text:focus .mytooltip {
    display: none;
  }
  
  .FontOverviewBox .Text.Columns {
    width: 50%;
    float: left;
  }
  
  .FontOverviewBox .Text.col-first,
  .FontOverviewBox .Text.col-last {
    padding-right: 20px;
  }
  
  .FontOverviewBox .Text[data-text-type="paragraph"],
  .FontOverviewBox .Text[data-text-type="subheader"] {
    line-height: 1.4;
  }
  
  .FontOverviewBox .Text.rtl {
    direction: rtl;
  }
  
  .FontOverviewBox .StatusBar {
    display: block;
    height: 24px;
    line-height: 24px;
    padding-left: 6px;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 13px;
    font-family: "Poppins", "Arial", sans-serif;
    font-style: normal;
    font-weight: normal;
    font-stretch: normal;
    color: #444;
  }
  
  .FontOverviewBox .StatusBar span {
    position: relative;
  }
  
  .FontOverviewBox .StatusBar .FontSize {
    color: #aaa;
  }
  
  .FontOverviewBox .StatusBar:hover,
  .FontOverviewBox .StatusBar:focus {
    text-decoration: none;
  }
  
  .FontOverviewBox .GoToFamilyWrapper {
    font-size: 13px;
    position: absolute;
    top: 3px;
    right: 7px;
  }
  
  .mytooltip {
    display: none;
    font-family: "Greta Sans Light", "Helvetica Neue", "Helvetica", "Arial",
      sans-serif;
    font-style: normal;
    font-weight: normal;
    font-stretch: normal;
    background: #222;
    height: 24px;
    text-align: center;
    color: #aaa;
    border-radius: 12px;
    line-height: 24px;
    padding: 0 10px;
    text-decoration: none;
    z-index: 100;
    letter-spacing: initial;
  }
  
  @media (min-width: 1025px) {
    .mytooltip {
      font-size: 15px;
    }
  }
  
  @media (max-width: 1024px) {
    .mytooltip {
      font-size: 18px;
    }
  }
  
  .FontOverviewHeadline .Text {
    white-space: nowrap;
    font-size: 100px;
    line-height: 110px;
  }
  
  .OverviewColumns {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }
  
  .clearfix::after,
  .row::after {
    clear: both;
  }
  
  .clearfix::after,
  .clearfix::before {
    content: " ";
    display: table;
  }