41 #siteheader Site header

Example 
<header class="site-header " role="banner">
  <div class="container-fluid">
    <a href="#" class="logo site-header__logo logo--logotype" title="Home - European Commission">
      <img class="logo__image img-responsive" src="public/images/svg/logo/logo--en.svg">
      <span class="sr-only">Home - European Commission</span>
    </a>
    <section class="top-bar" aria-label="Site tools">
      <section class="lang-select-site clearfix">
        <a href="#" class="lang-select-site__link">
          <span class="lang-select-site__code">
            <span class="icon icon--language lang-select-site__icon"></span>
            <span class="lang-select-site__code-text">en</span>
          </span>
          <span class="lang-select-site__label">English</span>
        </a>
        <div class="splash-page splash-page--overlay"></div>
      </section>
      <section class="block-nexteuropa-europa-search">
        <div class="search-form__wrapper">
          <a class="search-form__toggle" href="#">
            <span class="icon icon--search search-form__toggle-icon"></span>
            <span class="search-form__toggle-label">Search</span>
          </a>
          <form class="search-form">
            <div>
              <div class="input-group input-group-search">
                <label class="search-form__textfield-wrapper">
                  <span class="sr-only">Search this website</span>
                  <input type="search" class="search-form__textfield form-control form-text" title="Search">
                </label>
                <div class="input-group-btn search-form__btn-wrapper">
                  <button type="submit" class="btn-search search-form__btn btn" value="Search">Search</button>
                </div>
              </div>
            </div>
          </form>
        </div>
      </section>
    </section>
  </div>
</header>

41.1 #siteheader.langselect Language select (Site)

Language selector that is used across the whole site.

Example 
<header class="site-header" role="banner">
  <div class="container-fluid">
    <div class="lang-select-site">
      <a href="#" class="lang-select-site__link">
        <span class="lang-select-site__code">
          <span class="icon icon--language lang-select-site__icon"></span>
          <span class="lang-select-site__code-text">en</span>
        </span>
        <span class="lang-select-site__label">English</span>
      </a>
    </div>
  </div>
</header>

41.3 #siteheader.logo--logotype EC logotype

EC logo with text.

Example
Home 
<div class="clearfix"> <!-- Only required for the style guide. -->
  <a href="link-to-homepage" class="logo--logotype" title="Home">
    <!-- Replace logo--en if you want to display logo in different language. -->
    <img class="logo__image img-responsive" src="public/images/svg/logo/logo--en.svg">
    <span class="sr-only">Home</span>
  </a>
</div>

41.4 #siteheader.site-slogan Site slogan

@todo Do we still use this component?

Example

European Union because simple is better!

<h2 class="site-slogan">European Union because simple is better!</h2>