Footer Stable
The bottom edge of the site or application.
Slim footer
<footer class="footer">
<div class="container">
<div class="row">
<div class="col-12">
<hr>
<ul class="legal-links">
<li class="legal-links__item">Siemens Healthcare GmbH ©2019</li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/corporate-info" class="legal-links__link">Corporate Information</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/siemens-website-privacy-policy" class="legal-links__link">Privacy Policy</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/cookie" class="legal-links__link">Cookie Policy</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/terms-of-use" class="legal-links__link">Terms of Use</a></li>
</ul> </div>
</div>
</div>
</footer>
Rich footer
<footer class="footer">
<div class="container">
<div class="row">
<div class="col-12">
<hr>
</div>
</div>
<div class="row">
<div class="col">
<div class="sitemap">
<div class="row">
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="sitemap__title">
<a href="#" class="">Products & Services</a>
</h5>
<ul class="bare-list sitemap__list">
<li class="sitemap__item">
<a href="#" class="sitemap__link">Medical Imaging</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Ultrasound</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Laboratory Diagnostics</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Point-of-Care-Testing</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Healthcare IT</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Services</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Clinical Specialties & Diseases</a>
</li>
</ul>
</div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="sitemap__title">
<a href="#" class="">Support & Documentation</a>
</h5>
<ul class="bare-list sitemap__list">
<li class="sitemap__item">
<a href="#" class="sitemap__link">Document Library (SDS, IFU, etc.)</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Education & Training</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">PEPconnect <i class="icon-extern color-orange-shade-1"></i></a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">LifeNet</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Webshop <i class="icon-extern color-orange-shade-1"></i></a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">All Online Services <i class="icon-extern color-orange-shade-1"></i></a>
</li>
</ul>
</div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="sitemap__title">
<a href="#" class="">Insights</a>
</h5>
<ul class="bare-list sitemap__list">
<li class="sitemap__item">
<a href="#" class="sitemap__link">Expanding Precision Medicine</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Improving Patient Experience</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Transforming Care Delivery</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Digitalizing Healthcare</a>
</li>
</ul>
</div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="sitemap__title">
<a href="#" class="">About Us</a>
</h5>
<ul class="bare-list sitemap__list">
<li class="sitemap__item">
<a href="#" class="sitemap__link">About Siemens Healthineers</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Conference & Events</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">News & Stories</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Press Room</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Investor Relations <i class="icon-extern color-orange-shade-1"></i></a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Careers</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Contact Us</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Job Search <i class="icon-extern color-orange-shade-1"></i></a>
</li>
</ul>
</div>
</div>
</div> </div>
</div>
<div class="row">
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="footer__col-title"> </h5>
<ul class="social-list">
<li class="social-list__item">
<a href="https://twitter.com/SiemensHealth" title="Twitter" class="button button--control" target="_blank">
<i class="icon-twitter"></i>
<span class="visually-hidden">Twitter</span>
</a>
</li>
<li class="social-list__item">
<a href="https://www.facebook.com/SiemensHealthineers" title="Facebook" class="button button--control " target="_blank">
<i class="icon-facebook"></i>
<span class="visually-hidden">Facebook</span>
</a>
</li>
<li class="social-list__item">
<a href="https://www.instagram.com/siemens.healthineers/" title="Instagram" class="button button--control" target="_blank">
<i class="icon-instagram"></i>
<span class="visually-hidden">Instagram</span>
</a>
</li>
<li class="social-list__item">
<a href="https://www.linkedin.com/company/siemens-healthineers" title="LinkedIn" class="button button--control" target="_blank">
<i class="icon-linkedin"></i>
<span class="visually-hidden">LinkedIn</span>
</a>
</li>
<li class="social-list__item">
<a href="https://www.youtube.com/siemenshealthineers" title="Youtube" class="button button--control" target="_blank">
<i class="icon-youtube"></i>
<span class="visually-hidden">Youtube</span>
</a>
</li>
</ul> </div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="footer__col-title" id="subscribe">Newsletter</h5>
<a href="#" title="Subscribe" class="button button--primary" target="_blank">Subscribe</a> </div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
</div>
</div>
<div class="row">
<div class="col-12">
<hr>
<ul class="legal-links">
<li class="legal-links__item">Siemens Healthcare GmbH ©2019</li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/corporate-info" class="legal-links__link">Corporate Information</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/siemens-website-privacy-policy" class="legal-links__link">Privacy Policy</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/cookie" class="legal-links__link">Cookie Policy</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/terms-of-use" class="legal-links__link">Terms of Use</a></li>
</ul> </div>
</div>
</div>
</footer>
Dark footer
<footer class="footer bg-color-gray-shade-4">
<div class="container">
<div class="row">
<div class="col-12">
<hr>
</div>
</div>
<div class="row">
<div class="col">
<div class="sitemap">
<div class="row">
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="sitemap__title">
<a href="#" class="">Products & Services</a>
</h5>
<ul class="bare-list sitemap__list">
<li class="sitemap__item">
<a href="#" class="sitemap__link">Medical Imaging</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Ultrasound</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Laboratory Diagnostics</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Point-of-Care-Testing</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Healthcare IT</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Services</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Clinical Specialties & Diseases</a>
</li>
</ul>
</div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="sitemap__title">
<a href="#" class="">Support & Documentation</a>
</h5>
<ul class="bare-list sitemap__list">
<li class="sitemap__item">
<a href="#" class="sitemap__link">Document Library (SDS, IFU, etc.)</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Education & Training</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">PEPconnect <i class="icon-extern color-orange-shade-1"></i></a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">LifeNet</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Webshop <i class="icon-extern color-orange-shade-1"></i></a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">All Online Services <i class="icon-extern color-orange-shade-1"></i></a>
</li>
</ul>
</div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="sitemap__title">
<a href="#" class="">Insights</a>
</h5>
<ul class="bare-list sitemap__list">
<li class="sitemap__item">
<a href="#" class="sitemap__link">Expanding Precision Medicine</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Improving Patient Experience</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Transforming Care Delivery</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Digitalizing Healthcare</a>
</li>
</ul>
</div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="sitemap__title">
<a href="#" class="">About Us</a>
</h5>
<ul class="bare-list sitemap__list">
<li class="sitemap__item">
<a href="#" class="sitemap__link">About Siemens Healthineers</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Conference & Events</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">News & Stories</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Press Room</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Investor Relations <i class="icon-extern color-orange-shade-1"></i></a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Careers</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Contact Us</a>
</li>
<li class="sitemap__item">
<a href="#" class="sitemap__link">Job Search <i class="icon-extern color-orange-shade-1"></i></a>
</li>
</ul>
</div>
</div>
</div> </div>
</div>
<div class="row">
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="footer__col-title"> </h5>
<ul class="social-list">
<li class="social-list__item">
<a href="https://twitter.com/SiemensHealth" title="Twitter" class="button button--control" target="_blank">
<i class="icon-twitter"></i>
<span class="visually-hidden">Twitter</span>
</a>
</li>
<li class="social-list__item">
<a href="https://www.facebook.com/SiemensHealthineers" title="Facebook" class="button button--control " target="_blank">
<i class="icon-facebook"></i>
<span class="visually-hidden">Facebook</span>
</a>
</li>
<li class="social-list__item">
<a href="https://www.instagram.com/siemens.healthineers/" title="Instagram" class="button button--control" target="_blank">
<i class="icon-instagram"></i>
<span class="visually-hidden">Instagram</span>
</a>
</li>
<li class="social-list__item">
<a href="https://www.linkedin.com/company/siemens-healthineers" title="LinkedIn" class="button button--control" target="_blank">
<i class="icon-linkedin"></i>
<span class="visually-hidden">LinkedIn</span>
</a>
</li>
<li class="social-list__item">
<a href="https://www.youtube.com/siemenshealthineers" title="Youtube" class="button button--control" target="_blank">
<i class="icon-youtube"></i>
<span class="visually-hidden">Youtube</span>
</a>
</li>
</ul> </div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
<h5 class="footer__col-title" id="subscribe">Newsletter</h5>
<a href="#" title="Subscribe" class="button button--primary" target="_blank">Subscribe</a> </div>
<div class="col-12 col-md-6 col-lg-4 col-xl-3">
</div>
</div>
<div class="row">
<div class="col-12">
<hr>
<ul class="legal-links">
<li class="legal-links__item">Siemens Healthcare GmbH ©2019</li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/corporate-info" class="legal-links__link">Corporate Information</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/siemens-website-privacy-policy" class="legal-links__link">Privacy Policy</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/cookie" class="legal-links__link">Cookie Policy</a></li>
<li class="legal-links__item"><a href="https://www.siemens-healthineers.com/terms-of-use" class="legal-links__link">Terms of Use</a></li>
</ul> </div>
</div>
</div>
</footer>