# Buttons & Links
Eine stringente Benutzung von Navigationselementen erleichtert dem Besucher die Navigation und Benutzung der Website. Im folgenden wird die Anwendung der einzelnen Elemente beschrieben.

## Links
Links werden innerhalb von Texten verwendet um [zusätzliche Informationen](http://www.google.de) auf anderen Seiten zu "verlinken". Neben dem werden Links in den Navigationen verwendet oder um Texte und Wörter mit Dateien oder Funktionen (Telefon, E-Mail) zu verknüpfen.
Links Default
Lorem ipsum dolor sit amet, [normaler Link](#) consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, [.link-text](#) ultricies nec, pellentesque eu, pretium quis, sem. Nulla [.link-muted ](#)consequat massa quis enim.
Links Contrast
Lorem [normaler Link](#) ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, [.link-text-contrast](#) ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

## Buttons
Buttons erfüllen folgende konkrete Funktionen:
- Kennzeichnung von Elementen, die eine Funktion auslösen (z. B. Absenden eines Formulars)
- Gezielte und hervorgehobene Nutzerführung
Dabei sind Buttons nach Prioritäten geordnet und sollten entsprechend verwendet werden:
- **btn-primary:** Priorätit 1; maximal 1-2 mal pro Seite
- **btn-secondary:** Priorität 2; bis zu 4 mal pro Seite
- **btn-link:** Priorität 3; bis zu 6 mal pro Seite
Buttons Default

### .btn-primary
[Button Primary](http://www.google.de)

### .btn-secondary
[Button Secondary](http://www.google.de)

### .btn-link
[Button Link](http://www.google.de)
Buttons Contrast

### .btn-primary-contrast
[Button Primary Contrast](http://www.google.de)

### .btn-secondary-contrast
[Button Secondary Contrast](http://www.google.de)

### .btn-link-contrast
[Button Link Contrast](http://www.google.de)
Button Varianten

### .btn-forward
[Button Primary Forward](http://www.google.de) [Button Secondary Forward](http://www.google.de) [Button Link Forward](http://www.google.de)

### .btn-back
[Button Primary Back](http://www.google.de) [Button Secondary Back](http://www.google.de) [Button Link Back](http://www.google.de)

### .btn-block
[Button Primary Block](http://www.google.de) [Button Secondary Block](http://www.google.de) [Button Link Block](http://www.google.de)

### .btn-xs
[Button Primary Extra-Small](http://www.google.de) [Button Secondary Extra-Small](http://www.google.de) [Button Link Extra-Small](http://www.google.de)

### .btn-sm
[Button Primary Small](http://www.google.de) [Button Secondary Small](http://www.google.de) [Button Link Small](http://www.google.de)

### .btn-lg
[Button Primary Large](http://www.google.de) [Button Secondary Large](http://www.google.de) [Button Link Large](http://www.google.de)
