einundzwanzig.space/src/css/sections/media.css

#media {
  & article + article {
    margin-top: var(--space-xl);
  }

  & .logo {
    display: inline-block;
    max-width: 100%;
    background: #FFF;
    border-radius: var(--space-s);
    padding: var(--space-m);
  }

  & .logo-square {
    width: 9em;
  }

  & .logo-horizontal {
    width: 21em;
  }

  & .cover {
    display: inline-block;
    width: 9em;
    max-width: 100%;
    margin: 0 var(--space-l) var(--space-l) 0;
    border-radius: var(--space-s);
  }

  & img {
    display: block;
    width: 100%;
  }

  & .colors {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    list-style: none;
    color: #FFF;
    font-weight: var(--font-weight-bold);

    & li {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 6em;
      height: 6em;
      border-radius: 50%;
      margin: 0 var(--space-l) var(--space-l) 0;
    }

    & .orange {
      background: var(--color-accent);
    }

    & .derweg {
      background: var(--color-derweg);
    }

    & .interview {
      background: var(--color-interview);
    }
  }

  & .telegram {
    display: inline-block;
    width: 9em;
  }

  & .wallpaper {
    display: inline-block;
    max-width: 21em;
    margin: 0 var(--space-l) var(--space-l) 0;

    & img {
      display: block;
      width: 100%;
    }
  }
}