Elementbaukasten Footer

Der Footer ist Pflicht für jede Webseite und muss mindestens folgende Informationen enthalten:

Links zu den Social Media Kanälen
Copyright und Anschrift
Link zu AGB, Datenschutz und Impressum

Optional kann bei Bedarf eine Sitemap sowie der Link zur Länderauswahl mit aufgenommen werden.

Verwendung

Der Footer stellt den Abschluss einer Seite dar und muss auf jeder Seite eingebunden werden.

Vorschau

HTML

                
                  <footer id="cnt_footer">
  <div class="container languageselect_container">
    <div class="languageselect_wrapper">
      <a href="#" class="country_fancybox country_trigger" data-fancybox-type="iframe">
        <span>Schöck international</span><span class="hidden-sm hidden-xs"> - </span><span>Please choose your country</span><span class="hidden-sm hidden-xs caret"></span>
      </a>
    </div>
  </div>
  <div class="container hidden-sm hidden-xs">
    <div class="sitemap_wrapper">
      <nav id="footer_sitemap">
        <ul class="clearfix level-1">
          <li>
            <a href="#">Produkte</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Produktfinder</a>
              </li>
              <li>
                <a href="#">Isokorb®</a>
              </li>
              <li>
                <a href="#">Tronsole®</a>
              </li>
              <li>
                <a href="#">Thermoanker</a>
              </li>
              <li>
                <a href="#">Novomur®</a>
              </li>
              <li>
                <a href="#">Dorn</a>
              </li>
              <li>
                <a href="#">Bole®</a>
              </li>
              <li>
                <a href="#">Combar®</a>
              </li>
              <li>
                <a href="#">ASE</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Downloads</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Preisliste</a>
              </li>
              <li>
                <a href="#">Prospekte</a>
              </li>
              <li>
                <a href="#">Technische Informationen</a>
              </li>
              <li>
                <a href="#">Einbauanleitungen</a>
              </li>
              <li>
                <a href="#">Zulassungen</a>
              </li>
              <li>
                <a href="#">Typenprüfungen</a>
              </li>
              <li>
                <a href="#">Gutachten</a>
              </li>
              <li>
                <a href="#">Software</a>
              </li>
              <li>
                <a href="#">Bauphysik</a>
              </li>
              <li>
                <a href="#">Übereinstimmungszertifikate</a>
              </li>
              <li>
                <a href="#">Leistungserklärungen</a>
              </li>
              <li>
                <a href="#">CAD/BIM-Dateien</a>
              </li>
              <li>
                <a href="#">Detailcenter</a>
              </li>
              <li>
                <a href="#">Ausschreibungstexte</a>
              </li>
              <li>
                <a href="#">Kundenmagazin Statikus</a>
              </li>
              <li>
                <a href="#">Rechtliches</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Service</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Detailcenter</a>
              </li>
              <li><a href="#">BIM</a></li>
              <li>
                <a href="#">Wärmebrücken-Rechner</a>
              </li>
              <li>
                <a href="#">Bemessungssoftware</a>
              </li>
              <li>
                <a href="#">Veranstaltungen</a>
              </li>
              <li>
                <a href="#">Planungsunterlagen bestellen</a>
              </li>
              <li>
                <a href="#">Zertifizierung Einbau Schöck Tronsole®</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Wissensportale</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Wärmebrückenportal</a>
              </li>
              <li>
                <a href="#">Trittschallportal</a>
              </li>
              <li>
                <a href="#">Passivhausportal</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Unternehmen</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Über Schöck</a>
              </li>
              <li><a href="#">Karriere</a></li>
              <li>
                <a href="#">News und Presse</a>
              </li>
              <li>
                <a href="#">Kundenmagazin Statikus</a>
              </li>
              <li>
                <a href="#">Mitgliedschaften</a>
              </li>
              <li>
                <a href="#">Zertifikate und Auszeichnungen</a>
              </li>
              <li>
                <a href="#">Referenzen</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Kontakt</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Beratung für Planer</a>
              </li>
              <li>
                <a href="#">Beratung für Händler</a>
              </li>
              <li>
                <a href="#">Beratung für Verarbeiter</a>
              </li>
              <li>
                <a href="#">Beratung international</a>
              </li>
              <li>
                <a href="#">Händler in Ihrer Nähe</a>
              </li>
              <li>
                <a href="#">Kontakt zu zertifizierten Verarbeitern</a>
              </li>
              <li>
                <a href="#">Kontaktformulare</a>
              </li>
              <li>
                <a href="#">Ihre Ideen</a>
              </li>
            </ul>
          </li>
        </ul>
      </nav>
    </div>
  </div>
  <div class="container">
    <div class="socialmedia_wrapper clearfix">
      <div class="socialmedia_text">
        Bleiben Sie in Kontakt mit uns und besuchen Sie uns auch auf
      </div>
      <div class="socialmedia_icons">
        <ul class="clearfix">
          <li>
            <a href="#" class="blog" title="www.schoeck-blog.de" ><span>www.schoeck-blog.de</span></a>
          </li>
          <li>
            <a href="#" class="fb" title="www.facebook.com/SchoeckBauteileGmbH" ><span>www.facebook.com/SchoeckBauteileGmbH</span></a>
          </li>
          <li>
            <a href="#" class="rss" title="RSS Feed" ><span>RSS Feed</span></a>
          </li>
          <li>
            <a href="#" class="twitter" title="www.twitter.com/SchoeckBauteile" ><span>www.twitter.com/SchoeckBauteile</span></a>
          </li>
          <li>
            <a href="#" class="youtube" title="www.youtube.com/user/SchoeckBauteile" ><span>www.youtube.com/user/SchoeckBauteile</span></a>
          </li>
          <li>
            <a href="#" class="xing" title="Xing" ><span>Xing</span></a>
          </li>
        </ul>
      </div>
    </div>
  </div>
  <div class="meta_copy_wrapper">
    <div class="container">
      <div class="meta_copy_wrapper_inner clearfix">
        <div class="copyright clearfix">
          <span>© 2017&nbsp;</span>
          <a href="#" class="location" >Schöck Bauteile GmbH, Vimbucher Straße 2, 76534 Baden-Baden</a>
        </div>
        <div class="metanav">
          <nav id="footer_navigation">
            <ul class="level-1">
              <li>
                <a href="#">TeamViewer Online-Meeting</a>
              </li>
              <li>
                <a href="#">AGB</a>
              </li>
              <li>
                <a href="#">Datenschutz</a>
              </li>
              <li>
                <a href="#">Impressum</a>
              </li>
            </ul>
          </nav>
        </div>
      </div>
    </div>
  </div>
</footer>

                
                  <footer id="cnt_footer">
  <div class="container languageselect_container">
    <div class="languageselect_wrapper">
      <a href="#" class="country_fancybox country_trigger" data-fancybox-type="iframe">
        <span>Schöck international</span><span class="hidden-sm hidden-xs"> - </span><span>Please choose your country</span><span class="hidden-sm hidden-xs caret"></span>
      </a>
    </div>
  </div>
  <div class="container hidden-sm hidden-xs">
    <div class="sitemap_wrapper">
      <nav id="footer_sitemap">
        <ul class="clearfix level-1">
          <li>
            <a href="#">Produkte</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Produktfinder</a>
              </li>
              <li>
                <a href="#">Isokorb®</a>
              </li>
              <li>
                <a href="#">Tronsole®</a>
              </li>
              <li>
                <a href="#">Thermoanker</a>
              </li>
              <li>
                <a href="#">Novomur®</a>
              </li>
              <li>
                <a href="#">Dorn</a>
              </li>
              <li>
                <a href="#">Bole®</a>
              </li>
              <li>
                <a href="#">Combar®</a>
              </li>
              <li>
                <a href="#">ASE</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Downloads</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Preisliste</a>
              </li>
              <li>
                <a href="#">Prospekte</a>
              </li>
              <li>
                <a href="#">Technische Informationen</a>
              </li>
              <li>
                <a href="#">Einbauanleitungen</a>
              </li>
              <li>
                <a href="#">Zulassungen</a>
              </li>
              <li>
                <a href="#">Typenprüfungen</a>
              </li>
              <li>
                <a href="#">Gutachten</a>
              </li>
              <li>
                <a href="#">Software</a>
              </li>
              <li>
                <a href="#">Bauphysik</a>
              </li>
              <li>
                <a href="#">Übereinstimmungszertifikate</a>
              </li>
              <li>
                <a href="#">Leistungserklärungen</a>
              </li>
              <li>
                <a href="#">CAD/BIM-Dateien</a>
              </li>
              <li>
                <a href="#">Detailcenter</a>
              </li>
              <li>
                <a href="#">Ausschreibungstexte</a>
              </li>
              <li>
                <a href="#">Kundenmagazin Statikus</a>
              </li>
              <li>
                <a href="#">Rechtliches</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Service</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Detailcenter</a>
              </li>
              <li><a href="#">BIM</a></li>
              <li>
                <a href="#">Wärmebrücken-Rechner</a>
              </li>
              <li>
                <a href="#">Bemessungssoftware</a>
              </li>
              <li>
                <a href="#">Veranstaltungen</a>
              </li>
              <li>
                <a href="#">Planungsunterlagen bestellen</a>
              </li>
              <li>
                <a href="#">Zertifizierung Einbau Schöck Tronsole®</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Wissensportale</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Wärmebrückenportal</a>
              </li>
              <li>
                <a href="#">Trittschallportal</a>
              </li>
              <li>
                <a href="#">Passivhausportal</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Unternehmen</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Über Schöck</a>
              </li>
              <li><a href="#">Karriere</a></li>
              <li>
                <a href="#">News und Presse</a>
              </li>
              <li>
                <a href="#">Kundenmagazin Statikus</a>
              </li>
              <li>
                <a href="#">Mitgliedschaften</a>
              </li>
              <li>
                <a href="#">Zertifikate und Auszeichnungen</a>
              </li>
              <li>
                <a href="#">Referenzen</a>
              </li>
            </ul>
          </li>
          <li>
            <a href="#">Kontakt</a>
            <ul class="clearfix level-2">
              <li>
                <a href="#">Beratung für Planer</a>
              </li>
              <li>
                <a href="#">Beratung für Händler</a>
              </li>
              <li>
                <a href="#">Beratung für Verarbeiter</a>
              </li>
              <li>
                <a href="#">Beratung international</a>
              </li>
              <li>
                <a href="#">Händler in Ihrer Nähe</a>
              </li>
              <li>
                <a href="#">Kontakt zu zertifizierten Verarbeitern</a>
              </li>
              <li>
                <a href="#">Kontaktformulare</a>
              </li>
              <li>
                <a href="#">Ihre Ideen</a>
              </li>
            </ul>
          </li>
        </ul>
      </nav>
    </div>
  </div>
  <div class="container">
    <div class="socialmedia_wrapper clearfix">
      <div class="socialmedia_text">
        Bleiben Sie in Kontakt mit uns und besuchen Sie uns auch auf
      </div>
      <div class="socialmedia_icons">
        <ul class="clearfix">
          <li>
            <a href="#" class="blog" title="www.schoeck-blog.de" ><span>www.schoeck-blog.de</span></a>
          </li>
          <li>
            <a href="#" class="fb" title="www.facebook.com/SchoeckBauteileGmbH" ><span>www.facebook.com/SchoeckBauteileGmbH</span></a>
          </li>
          <li>
            <a href="#" class="rss" title="RSS Feed" ><span>RSS Feed</span></a>
          </li>
          <li>
            <a href="#" class="twitter" title="www.twitter.com/SchoeckBauteile" ><span>www.twitter.com/SchoeckBauteile</span></a>
          </li>
          <li>
            <a href="#" class="youtube" title="www.youtube.com/user/SchoeckBauteile" ><span>www.youtube.com/user/SchoeckBauteile</span></a>
          </li>
          <li>
            <a href="#" class="xing" title="Xing" ><span>Xing</span></a>
          </li>
        </ul>
      </div>
    </div>
  </div>
  <div class="meta_copy_wrapper">
    <div class="container">
      <div class="meta_copy_wrapper_inner clearfix">
        <div class="copyright clearfix">
          <span>© 2017&nbsp;</span>
          <a href="#" class="location" >Schöck Bauteile GmbH, Vimbucher Straße 2, 76534 Baden-Baden</a>
        </div>
        <div class="metanav">
          <nav id="footer_navigation">
            <ul class="level-1">
              <li>
                <a href="#">TeamViewer Online-Meeting</a>
              </li>
              <li>
                <a href="#">AGB</a>
              </li>
              <li>
                <a href="#">Datenschutz</a>
              </li>
              <li>
                <a href="#">Impressum</a>
              </li>
            </ul>
          </nav>
        </div>
      </div>
    </div>
  </div>
</footer>

CSS

                
                  @charset "UTF-8";
#cnt_footer {
  background-image: url("/appresources/styleguide/img/footer_bg.jpg");
  background-repeat: repeat;
  overflow: hidden;
}
@media screen and (max-width: 991px) {
  #cnt_footer {
    background: #eff0f1;
  }
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_container {
    border-bottom: 1px solid #dbdbdc;
  }
}
#cnt_footer .languageselect_wrapper {
  border-bottom: 1px solid #dbdbdc;
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_wrapper {
    border-bottom: none;
  }
}
#cnt_footer .languageselect_wrapper .country_trigger {
  padding: 34px 30px;
  display: block;
  line-height: 37px;
  font-size: 16px;
  font-size: 1rem;
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_wrapper .country_trigger {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
#cnt_footer .languageselect_wrapper .country_trigger:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .languageselect_wrapper .country_trigger:before {
  color: #b3b3b3;
  float: right;
  font-size: 37px;
  margin-right: 47px;
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_wrapper .country_trigger:before {
    float: none;
    margin-right: 0;
    margin-bottom: 25px;
    display: inline-block;
  }
}
#cnt_footer .languageselect_wrapper .country_trigger .caret {
  border: 4px solid transparent;
  border-left-color: #b3b3b3;
  margin-left: 15px;
  transition: 0.2s border-color ease;
}
#cnt_footer .languageselect_wrapper .country_trigger:hover .caret {
  border-left-color: #f9b200;
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_wrapper .country_trigger {
    text-align: center;
    line-height: 20px;
    line-height: 1.25rem;
  }
  #cnt_footer .languageselect_wrapper .country_trigger span {
    display: block;
  }
}
#cnt_footer .sitemap_wrapper {
  padding: 50px 30px;
  border-bottom: 1px solid #dbdbdc;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul li {
  list-style: none;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 {
  display: flex;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li {
  margin-right: 50px;
  float: left;
  /* flex fullwidth */
  -webkit-flex-grow: 1;
  /* Safari */
  flex-grow: 1;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li:last-child {
  margin-right: 0;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li > a {
  font-size: 16px;
  font-size: 1rem;
  line-height: 22px;
  line-height: 1.375rem;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 {
  margin-top: 10px;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 > li {
  line-height: 16px;
  line-height: 1rem;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 > li > a {
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 16px;
  line-height: 1rem;
  font-family: 'Corpid_TT5_Regular', Arial;
  font-weight: normal;
  font-style: normal;
  color: #7c7c7b;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 > li > a:focus, #cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 > li > a:hover {
  color: #f9b200;
}
#cnt_footer .socialmedia_wrapper {
  padding: 36px 30px;
}
@media screen and (max-width: 991px) {
  #cnt_footer .socialmedia_wrapper {
    text-align: center;
    padding: 50px 0;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_text {
  float: left;
  line-height: 25px;
  /* synched to ul height of the icons */
  font-size: 16px;
  font-size: 1rem;
  font-family: 'CorpidCd_TT7', Arial;
  font-weight: normal;
  font-style: normal;
  color: #0069b4;
}
@media screen and (max-width: 991px) {
  #cnt_footer .socialmedia_wrapper .socialmedia_text {
    float: none;
    margin-bottom: 20px;
    color: #b3b3b3;
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 16px;
    line-height: 1rem;
    padding: 0 30px;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons {
  float: right;
}
@media screen and (max-width: 991px) {
  #cnt_footer .socialmedia_wrapper .socialmedia_icons {
    float: none;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul {
  font-size: 0;
  height: 25px;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li {
  display: inline-block;
  margin-left: 25px;
  line-height: 25px;
}
@media screen and (max-width: 991px) {
  #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li {
    margin-left: 24px;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li:first-child {
  margin-left: 0;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a {
  display: block;
  height: 25px;
  line-height: 25px;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a span {
  display: none;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a:before {
  color: #b3b3b3;
  transition: 0.2s color ease;
  font-size: 24px;
  line-height: 25px;
}
@media screen and (max-width: 767) {
  #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a:before {
    transition: none;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a:hover:before {
  color: #0069b4;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.blog:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.blog:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.blog:hover:before {
  color: #f57d00;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.twitter:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.twitter:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.twitter:hover:before {
  color: #55acee;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.fb:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.fb:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.fb:hover:before {
  color: #3b5998;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.xing:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.xing:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.xing:hover:before {
  color: #026466;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.youtube:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.youtube:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.youtube:hover:before {
  color: #cd201f;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.rss:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.rss:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.rss:hover:before {
  color: #f26522;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.linkedin:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.linkedin:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.linkedin:hover:before {
  color: #0077b5;
}
#cnt_footer .meta_copy_wrapper {
  background-color: rgba(124, 124, 123, 0.15);
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner {
  padding: 15px 30px;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner {
    text-align: center;
    padding: 20px 0;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright {
  color: #7c7c7b;
  float: left;
  height: 16px;
  font-family: 'CorpidCd_TT5', Arial;
  font-weight: normal;
  font-style: normal;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright {
    float: none;
    height: auto;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright > span {
  display: block;
  float: left;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 16px;
  line-height: 1rem;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright > span {
    float: none;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location {
  display: block;
  float: left;
  height: 16px;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 16px;
  line-height: 1rem;
  color: #7c7c7b;
  font-family: 'CorpidCd_TT5', Arial;
  font-weight: normal;
  font-style: normal;
  position: relative;
  padding-right: 20px;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:after {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location {
    float: none;
    height: auto;
    margin-top: 10px;
    padding-right: 0;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location span {
  text-indent: -9999em;
  font-size: 0;
  color: transparent;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:after {
  font-size: 16px;
  position: absolute;
  right: 0;
  top: 0;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:after {
    display: block;
    margin-top: 10px;
    position: static;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:focus, #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:hover {
  color: #f9b200;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav {
  float: right;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav {
    float: none;
    text-align: center;
    margin-top: 15px;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul {
  font-size: 0;
  height: 16px;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li {
  display: inline-block;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 16px;
  line-height: 1rem;
  margin-left: 15px;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li:first-child {
  margin-left: 0;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li a {
  color: #7c7c7b;
  font-family: 'CorpidCd_TT5', Arial;
  font-weight: normal;
  font-style: normal;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li a:focus, #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li a:hover {
  color: #f9b200;
}

              @charset "UTF-8";
#cnt_footer {
  background-image: url("/appresources/styleguide/img/footer_bg.jpg");
  background-repeat: repeat;
  overflow: hidden;
}
@media screen and (max-width: 991px) {
  #cnt_footer {
    background: #eff0f1;
  }
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_container {
    border-bottom: 1px solid #dbdbdc;
  }
}
#cnt_footer .languageselect_wrapper {
  border-bottom: 1px solid #dbdbdc;
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_wrapper {
    border-bottom: none;
  }
}
#cnt_footer .languageselect_wrapper .country_trigger {
  padding: 34px 30px;
  display: block;
  line-height: 37px;
  font-size: 16px;
  font-size: 1rem;
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_wrapper .country_trigger {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
#cnt_footer .languageselect_wrapper .country_trigger:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .languageselect_wrapper .country_trigger:before {
  color: #b3b3b3;
  float: right;
  font-size: 37px;
  margin-right: 47px;
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_wrapper .country_trigger:before {
    float: none;
    margin-right: 0;
    margin-bottom: 25px;
    display: inline-block;
  }
}
#cnt_footer .languageselect_wrapper .country_trigger .caret {
  border: 4px solid transparent;
  border-left-color: #b3b3b3;
  margin-left: 15px;
  transition: 0.2s border-color ease;
}
#cnt_footer .languageselect_wrapper .country_trigger:hover .caret {
  border-left-color: #f9b200;
}
@media screen and (max-width: 991px) {
  #cnt_footer .languageselect_wrapper .country_trigger {
    text-align: center;
    line-height: 20px;
    line-height: 1.25rem;
  }
  #cnt_footer .languageselect_wrapper .country_trigger span {
    display: block;
  }
}
#cnt_footer .sitemap_wrapper {
  padding: 50px 30px;
  border-bottom: 1px solid #dbdbdc;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul li {
  list-style: none;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 {
  display: flex;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li {
  margin-right: 50px;
  float: left;
  /* flex fullwidth */
  -webkit-flex-grow: 1;
  /* Safari */
  flex-grow: 1;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li:last-child {
  margin-right: 0;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li > a {
  font-size: 16px;
  font-size: 1rem;
  line-height: 22px;
  line-height: 1.375rem;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 {
  margin-top: 10px;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 > li {
  line-height: 16px;
  line-height: 1rem;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 > li > a {
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 16px;
  line-height: 1rem;
  font-family: 'Corpid_TT5_Regular', Arial;
  font-weight: normal;
  font-style: normal;
  color: #7c7c7b;
}
#cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 > li > a:focus, #cnt_footer .sitemap_wrapper #footer_sitemap ul.level-1 > li ul.level-2 > li > a:hover {
  color: #f9b200;
}
#cnt_footer .socialmedia_wrapper {
  padding: 36px 30px;
}
@media screen and (max-width: 991px) {
  #cnt_footer .socialmedia_wrapper {
    text-align: center;
    padding: 50px 0;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_text {
  float: left;
  line-height: 25px;
  /* synched to ul height of the icons */
  font-size: 16px;
  font-size: 1rem;
  font-family: 'CorpidCd_TT7', Arial;
  font-weight: normal;
  font-style: normal;
  color: #0069b4;
}
@media screen and (max-width: 991px) {
  #cnt_footer .socialmedia_wrapper .socialmedia_text {
    float: none;
    margin-bottom: 20px;
    color: #b3b3b3;
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 16px;
    line-height: 1rem;
    padding: 0 30px;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons {
  float: right;
}
@media screen and (max-width: 991px) {
  #cnt_footer .socialmedia_wrapper .socialmedia_icons {
    float: none;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul {
  font-size: 0;
  height: 25px;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li {
  display: inline-block;
  margin-left: 25px;
  line-height: 25px;
}
@media screen and (max-width: 991px) {
  #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li {
    margin-left: 24px;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li:first-child {
  margin-left: 0;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a {
  display: block;
  height: 25px;
  line-height: 25px;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a span {
  display: none;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a:before {
  color: #b3b3b3;
  transition: 0.2s color ease;
  font-size: 24px;
  line-height: 25px;
}
@media screen and (max-width: 767) {
  #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a:before {
    transition: none;
  }
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a:hover:before {
  color: #0069b4;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.blog:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.blog:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.blog:hover:before {
  color: #f57d00;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.twitter:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.twitter:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.twitter:hover:before {
  color: #55acee;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.fb:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.fb:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.fb:hover:before {
  color: #3b5998;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.xing:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.xing:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.xing:hover:before {
  color: #026466;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.youtube:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.youtube:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.youtube:hover:before {
  color: #cd201f;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.rss:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.rss:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.rss:hover:before {
  color: #f26522;
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.linkedin:before {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
#cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.linkedin:focus:before, #cnt_footer .socialmedia_wrapper .socialmedia_icons ul li a.linkedin:hover:before {
  color: #0077b5;
}
#cnt_footer .meta_copy_wrapper {
  background-color: rgba(124, 124, 123, 0.15);
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner {
  padding: 15px 30px;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner {
    text-align: center;
    padding: 20px 0;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright {
  color: #7c7c7b;
  float: left;
  height: 16px;
  font-family: 'CorpidCd_TT5', Arial;
  font-weight: normal;
  font-style: normal;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright {
    float: none;
    height: auto;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright > span {
  display: block;
  float: left;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 16px;
  line-height: 1rem;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright > span {
    float: none;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location {
  display: block;
  float: left;
  height: 16px;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 16px;
  line-height: 1rem;
  color: #7c7c7b;
  font-family: 'CorpidCd_TT5', Arial;
  font-weight: normal;
  font-style: normal;
  position: relative;
  padding-right: 20px;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:after {
  font-family: 'schoeck';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "";
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location {
    float: none;
    height: auto;
    margin-top: 10px;
    padding-right: 0;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location span {
  text-indent: -9999em;
  font-size: 0;
  color: transparent;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:after {
  font-size: 16px;
  position: absolute;
  right: 0;
  top: 0;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:after {
    display: block;
    margin-top: 10px;
    position: static;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:focus, #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .copyright .location:hover {
  color: #f9b200;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav {
  float: right;
}
@media screen and (max-width: 991px) {
  #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav {
    float: none;
    text-align: center;
    margin-top: 15px;
  }
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul {
  font-size: 0;
  height: 16px;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li {
  display: inline-block;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 16px;
  line-height: 1rem;
  margin-left: 15px;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li:first-child {
  margin-left: 0;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li a {
  color: #7c7c7b;
  font-family: 'CorpidCd_TT5', Arial;
  font-weight: normal;
  font-style: normal;
}
#cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li a:focus, #cnt_footer .meta_copy_wrapper .meta_copy_wrapper_inner .metanav #footer_navigation ul li a:hover {
  color: #f9b200;
}

SCSS

                
                  @import "../general/_general";

#cnt_footer {
  background-image:url('/appresources/styleguide/img/footer_bg.jpg');
  background-repeat:repeat;
  overflow:hidden;

  @media screen and (max-width:$screen-sm-max) {
    background:#eff0f1;
  }

  .languageselect_container {
    @media screen and (max-width:$screen-sm-max) {
      border-bottom:1px solid #dbdbdc;
    }
  }

  .languageselect_wrapper {
    border-bottom:1px solid #dbdbdc;

    @media screen and (max-width:$screen-sm-max) {
      border-bottom:none;
    }

    .country_trigger {
      padding:34px 30px;
      display:block;
      line-height:37px;

      @media screen and (max-width:$screen-sm-max) {
        padding-top:50px;
        padding-bottom:50px;
      }

      @include rem-font-size(16);

      @include schoeck-icon($icon-worldmap);

      &:before {
        color:$grey;
        float:right;
        font-size:37px;
        margin-right:47px;

        @media screen and (max-width:$screen-sm-max) {
          float:none;
          margin-right:0;
          margin-bottom:25px;
          display:inline-block;
        }
      }

      .caret {
        border:4px solid transparent;
        border-left-color:$grey;
        margin-left:15px;
        @include transition($linkcolor-transition-duration border-color ease);
      }

      &:hover {
        .caret {
          border-left-color:$orange;
        }
      }

      @media screen and (max-width:$screen-sm-max) {
        text-align:center;
        @include rem-line-height(20);

        span {
          display:block;
        }
      }
    }
  }

  .sitemap_wrapper {
    padding:50px 30px;
    border-bottom:1px solid #dbdbdc;

    #footer_sitemap {
      ul {
        li {
          list-style:none;
        }
      }
      ul.level-1 {
        display:flex;

        > li {
          margin-right:50px;
          float:left;

          /* flex fullwidth */
          -webkit-flex-grow:1; /* Safari */
          flex-grow:1;

          &:last-child {
            margin-right:0;
          }

          > a {
            @include rem-font-size(16);
            @include rem-line-height(22);
          }

          ul.level-2 {
            margin-top:10px;

            > li {
              @include rem-line-height(16);

              > a {
                @include rem-font-size(12);
                @include rem-line-height(16);
                @include corpid-regular;
                color:$darkgrey;

                &:focus,
                &:hover {
                  color:$orange;
                }
              }
            }
          }
        }
      }
    }
  }

  .socialmedia_wrapper {
    padding:36px 30px;

    @media screen and (max-width:$screen-sm-max) {
      text-align:center;
      padding:50px 0;
    }

    .socialmedia_text {
      float:left;
      line-height:25px; /* synched to ul height of the icons */
      @include rem-font-size(16);
      @include corpid-cd-bold;
      color:$blue;

      @media screen and (max-width:$screen-sm-max) {
        float:none;
        margin-bottom:20px;
        color:$grey;

        @include rem-font-size(12);
        @include rem-line-height(16);

        padding:0 30px;
      }
    }

    .socialmedia_icons {
      float:right;

      @media screen and (max-width:$screen-sm-max) {
        float:none;
      }

      ul {
        font-size:0;
        height:25px;

        li {
          display:inline-block;
          margin-left:25px;
          line-height:25px;

          @media screen and (max-width:$screen-sm-max) {
            margin-left:24px;
          }

          &:first-child {
            margin-left:0;
          }

          a {
            display:block;
            height:25px;
            line-height:25px;

            span {
              display:none;
            }

            &:before {
              color:$grey;
              @include linkcolor-transition;
              font-size:24px;
              line-height:25px;
            }

            &:focus,
            &:hover {
              &:before {
                color:$blue;
              }
            }

            &.blog {
              @include schoeck-icon($icon-socialmedia-blog);

              &:focus,
              &:hover {
                &:before {
                  color:$blogger-orange;
                }
              }
            }
            &.twitter {
              @include schoeck-icon($icon-socialmedia-twitter);

              &:focus,
              &:hover {
                &:before {
                  color:$twitter-blue;
                }
              }
            }
            &.fb {
              @include schoeck-icon($icon-socialmedia-facebook);

              &:focus,
              &:hover {
                &:before {
                  color:$facebook-blue;
                }
              }
            }
            &.xing {
              @include schoeck-icon($icon-socialmedia-xing);

              &:focus,
              &:hover {
                &:before {
                  color:$xing-darkgreen;
                }
              }
            }
            &.youtube {
              @include schoeck-icon($icon-socialmedia-youtube);

              &:focus,
              &:hover {
                &:before {
                  color:$youtube-red;
                }
              }
            }
            &.rss {
              @include schoeck-icon($icon-socialmedia-rss);

              &:focus,
              &:hover {
                &:before {
                  color:$rss-yellow;
                }
              }
            }
            &.linkedin {
              @include schoeck-icon($icon-socialmedia-linkedin);

              &:focus,
              &:hover {
                &:before {
                  color:$linkedin-blue;
                }
              }
            }
          }
        }
      }
    }
  }

  .meta_copy_wrapper {
    background-color:rgba($darkgrey, 0.15);

    .meta_copy_wrapper_inner {
      padding:15px 30px;

      @media screen and (max-width:$screen-sm-max) {
        text-align:center;
        padding:20px 0;
      }

      .copyright {
        color:$darkgrey;
        float:left;
        height:16px;
        @include corpid-cd-regular;

        @media screen and (max-width:$screen-sm-max) {
          float:none;
          height:auto;
        }

        > span {
          display:block;
          float:left;
          @include rem-font-size(13);
          @include rem-line-height(16);

          @media screen and (max-width:$screen-sm-max) {
            float:none;
          }
        }

        .location {
          @include schoeck-icon-after($icon-location);
          display:block;
          float:left;
          height:16px;
          @include rem-font-size(13);
          @include rem-line-height(16);
          color:$darkgrey;
          @include corpid-cd-regular;
          position:relative;
          padding-right:20px;

          @media screen and (max-width:$screen-sm-max) {
            float:none;
            height:auto;
            margin-top:10px;
            padding-right:0;
          }

          span {
            text-indent:-9999em;
            font-size:0;
            color:transparent;
          }

          &:after {
            font-size:16px;
            position:absolute;
            right:0;
            top:0;

            @media screen and (max-width:$screen-sm-max) {
              display:block;
              margin-top:10px;
              position:static;
            }
          }

          &:focus,
          &:hover {
            color:$orange;
          }
        }
      }

      .metanav {
        float:right;

        @media screen and (max-width:$screen-sm-max) {
          float:none;
          text-align:center;
          margin-top:15px;
        }

        #footer_navigation {
          ul {
            font-size:0;
            height:16px;

            li {
              display:inline-block;
              @include rem-font-size(13);
              @include rem-line-height(16);
              margin-left:15px;

              &:first-child {
                margin-left:0;
              }

              a {
                color:$darkgrey;
                @include corpid-cd-regular;

                &:focus,
                &:hover {
                  color:$orange;
                }
              }
            }
          }
        }
      }
    }
  }
}

              @import "../general/_general";

#cnt_footer {
  background-image:url('/appresources/styleguide/img/footer_bg.jpg');
  background-repeat:repeat;
  overflow:hidden;

  @media screen and (max-width:$screen-sm-max) {
    background:#eff0f1;
  }

  .languageselect_container {
    @media screen and (max-width:$screen-sm-max) {
      border-bottom:1px solid #dbdbdc;
    }
  }

  .languageselect_wrapper {
    border-bottom:1px solid #dbdbdc;

    @media screen and (max-width:$screen-sm-max) {
      border-bottom:none;
    }

    .country_trigger {
      padding:34px 30px;
      display:block;
      line-height:37px;

      @media screen and (max-width:$screen-sm-max) {
        padding-top:50px;
        padding-bottom:50px;
      }

      @include rem-font-size(16);

      @include schoeck-icon($icon-worldmap);

      &:before {
        color:$grey;
        float:right;
        font-size:37px;
        margin-right:47px;

        @media screen and (max-width:$screen-sm-max) {
          float:none;
          margin-right:0;
          margin-bottom:25px;
          display:inline-block;
        }
      }

      .caret {
        border:4px solid transparent;
        border-left-color:$grey;
        margin-left:15px;
        @include transition($linkcolor-transition-duration border-color ease);
      }

      &:hover {
        .caret {
          border-left-color:$orange;
        }
      }

      @media screen and (max-width:$screen-sm-max) {
        text-align:center;
        @include rem-line-height(20);

        span {
          display:block;
        }
      }
    }
  }

  .sitemap_wrapper {
    padding:50px 30px;
    border-bottom:1px solid #dbdbdc;

    #footer_sitemap {
      ul {
        li {
          list-style:none;
        }
      }
      ul.level-1 {
        display:flex;

        > li {
          margin-right:50px;
          float:left;

          /* flex fullwidth */
          -webkit-flex-grow:1; /* Safari */
          flex-grow:1;

          &:last-child {
            margin-right:0;
          }

          > a {
            @include rem-font-size(16);
            @include rem-line-height(22);
          }

          ul.level-2 {
            margin-top:10px;

            > li {
              @include rem-line-height(16);

              > a {
                @include rem-font-size(12);
                @include rem-line-height(16);
                @include corpid-regular;
                color:$darkgrey;

                &:focus,
                &:hover {
                  color:$orange;
                }
              }
            }
          }
        }
      }
    }
  }

  .socialmedia_wrapper {
    padding:36px 30px;

    @media screen and (max-width:$screen-sm-max) {
      text-align:center;
      padding:50px 0;
    }

    .socialmedia_text {
      float:left;
      line-height:25px; /* synched to ul height of the icons */
      @include rem-font-size(16);
      @include corpid-cd-bold;
      color:$blue;

      @media screen and (max-width:$screen-sm-max) {
        float:none;
        margin-bottom:20px;
        color:$grey;

        @include rem-font-size(12);
        @include rem-line-height(16);

        padding:0 30px;
      }
    }

    .socialmedia_icons {
      float:right;

      @media screen and (max-width:$screen-sm-max) {
        float:none;
      }

      ul {
        font-size:0;
        height:25px;

        li {
          display:inline-block;
          margin-left:25px;
          line-height:25px;

          @media screen and (max-width:$screen-sm-max) {
            margin-left:24px;
          }

          &:first-child {
            margin-left:0;
          }

          a {
            display:block;
            height:25px;
            line-height:25px;

            span {
              display:none;
            }

            &:before {
              color:$grey;
              @include linkcolor-transition;
              font-size:24px;
              line-height:25px;
            }

            &:focus,
            &:hover {
              &:before {
                color:$blue;
              }
            }

            &.blog {
              @include schoeck-icon($icon-socialmedia-blog);

              &:focus,
              &:hover {
                &:before {
                  color:$blogger-orange;
                }
              }
            }
            &.twitter {
              @include schoeck-icon($icon-socialmedia-twitter);

              &:focus,
              &:hover {
                &:before {
                  color:$twitter-blue;
                }
              }
            }
            &.fb {
              @include schoeck-icon($icon-socialmedia-facebook);

              &:focus,
              &:hover {
                &:before {
                  color:$facebook-blue;
                }
              }
            }
            &.xing {
              @include schoeck-icon($icon-socialmedia-xing);

              &:focus,
              &:hover {
                &:before {
                  color:$xing-darkgreen;
                }
              }
            }
            &.youtube {
              @include schoeck-icon($icon-socialmedia-youtube);

              &:focus,
              &:hover {
                &:before {
                  color:$youtube-red;
                }
              }
            }
            &.rss {
              @include schoeck-icon($icon-socialmedia-rss);

              &:focus,
              &:hover {
                &:before {
                  color:$rss-yellow;
                }
              }
            }
            &.linkedin {
              @include schoeck-icon($icon-socialmedia-linkedin);

              &:focus,
              &:hover {
                &:before {
                  color:$linkedin-blue;
                }
              }
            }
          }
        }
      }
    }
  }

  .meta_copy_wrapper {
    background-color:rgba($darkgrey, 0.15);

    .meta_copy_wrapper_inner {
      padding:15px 30px;

      @media screen and (max-width:$screen-sm-max) {
        text-align:center;
        padding:20px 0;
      }

      .copyright {
        color:$darkgrey;
        float:left;
        height:16px;
        @include corpid-cd-regular;

        @media screen and (max-width:$screen-sm-max) {
          float:none;
          height:auto;
        }

        > span {
          display:block;
          float:left;
          @include rem-font-size(13);
          @include rem-line-height(16);

          @media screen and (max-width:$screen-sm-max) {
            float:none;
          }
        }

        .location {
          @include schoeck-icon-after($icon-location);
          display:block;
          float:left;
          height:16px;
          @include rem-font-size(13);
          @include rem-line-height(16);
          color:$darkgrey;
          @include corpid-cd-regular;
          position:relative;
          padding-right:20px;

          @media screen and (max-width:$screen-sm-max) {
            float:none;
            height:auto;
            margin-top:10px;
            padding-right:0;
          }

          span {
            text-indent:-9999em;
            font-size:0;
            color:transparent;
          }

          &:after {
            font-size:16px;
            position:absolute;
            right:0;
            top:0;

            @media screen and (max-width:$screen-sm-max) {
              display:block;
              margin-top:10px;
              position:static;
            }
          }

          &:focus,
          &:hover {
            color:$orange;
          }
        }
      }

      .metanav {
        float:right;

        @media screen and (max-width:$screen-sm-max) {
          float:none;
          text-align:center;
          margin-top:15px;
        }

        #footer_navigation {
          ul {
            font-size:0;
            height:16px;

            li {
              display:inline-block;
              @include rem-font-size(13);
              @include rem-line-height(16);
              margin-left:15px;

              &:first-child {
                margin-left:0;
              }

              a {
                color:$darkgrey;
                @include corpid-cd-regular;

                &:focus,
                &:hover {
                  color:$orange;
                }
              }
            }
          }
        }
      }
    }
  }
}