/**
 * audi-icon - Audi Icons as SVG, PNG, Icon Font and EPS.
 * @version v1.0.0-alpha.1
 * @copyright 2016 Audi
 * @link https://github.com/audi/audi-icon
 */
.glyph-codepoint,
.glyph-name {
  color: #000;
  display: block;
  padding: 4px; }

.glyph-name {
  padding-bottom: 0; }

.glyph-codepoint {
  color: #777;
  font-family: 'Inconsolata', 'Monaco', monospace; }

.glyph-codepoint__large {
  display: none; }

.glyph--large ~ .glyph-codepoint .glyph-codepoint__small {
  display: none; }

.glyph--large ~ .glyph-codepoint .glyph-codepoint__large {
  display: inline; }

.glyph {
  display: block;
  font-size: 24px;
  padding: 5px;
  background-color: white; }
  .glyph--large {
    font-size: 48px; }

.icon-list, .glyph-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row wrap;
      flex-flow: row wrap;
  padding: 0;
  margin: 0;
  list-style: none;
  font-size: 12px;
  line-height: 1.2; }
  .icon-list > li, .glyph-list > li {
    display: inline-block;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    margin: .3em .2em;
    width: 100px;
    background: #fff;
    position: relative;
    text-align: center;
    background-color: #f5f5f5;
    padding: 1px; }

.icon-name {
  color: #000;
  display: block;
  padding: 4px; }

.icon {
  display: block;
  font-size: 24px;
  padding: 5px;
  background-color: white; }

.page {
  padding-top: 7.5rem;
  padding-bottom: 5rem; }

.control {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999; }

.aui-headline-1 {
  margin-bottom: 5rem; }