/* ============================================================= */
/*	Color Scheme */
/* ============================================================= */
/* Ersetzen Sie folgende Farben (Hex-Werte) durch Ihre Unternehmensfarben */
:root {
  --primary-color: #0082a1;
  /* Primär Farbe */
  --secondary-color: #BB9F84;
  /* Sekundär Farbe */
  --color-bar-background: #ffffff;
  /* Hintergrundfarbe für Farbleiste */
  --color-bar-font-color: #666666;
  /* Farbleiste Schrift Farbe */
  --color-bar-divider-color: #ffffff;
  /* Farbleiste Trennstrich Farbe */
  --base-font-color: #000000;
  /* Schrift Farbe */
  --h1-font-color: #000000;
  /* Schrift Farbe Titel H1 */
  --h2-font-color: #000000;
  /* Schrift Farbe Titel H2 */
  --h3-font-color: #000000;
  /* Schrift Farbe Titel H3 */
  --link-font-color: #0082a1;
  /* Schrift Farbe Hyperlink */
  --link-font-color-hover: #0082a1;
  /* Schrift Farbe Hyperlink bei mouseover */
  --border-color: #e5e5e5;
  /* Farbe Trennlinie */
  --table-highlight-color: #666666;
  /* Textfarbe für jede zweite Zeile einer Tabelle */
  --table-highlight-background: #e6e6e6;
  /* Hintergrundfarbe für jede zweite Zeile einer Tabelle */
  --card-backside-background: #ffffff;
  /* Karte mit Titel, Text und CTA - Rückseite Hintergrundfarbe */
  --card-backside-font-color: #666666;
  /* Karte mit Titel, Text und CTA - Rückseite Textfarbe */
  --form-field-active-background: #5d5d5d;
  /* Formularfeld Hintergrundfarbe für aktive Felder (Checkbox, Radio, NPS, ...) */
  --form-field-active-font-color: #ffffff;
  /* Formularfeld Schriftfarbe für aktive Felder (Checkbox, Radio, NPS, ...) */
  --form-field-border: #5d5d5d;
  /* Formular Rahmen Farbe */
  --form-field-border-checked: #000000;
  /* Formular Rahmen Farbe für ausgewählte Felder (Checkbox, Radio) */
  --form-field-background: #ffffff;
  /* Formularfeld Hintergrundfarbe */
  --form-field-font-color: #5d5d5d;
  /* Formularfeld Textfarbe */
  --form-field-font-color-checked: #000000;
  /* Formularfeld Textfarbe für ausgewählte Felder (Checkbox, Radio)*/
  --form-field-invalid-color: #ff0000;
  /* Formularfeld Farbe für "Pflichtfeld nicht ausgefüllt" */
  --form-color: #000000;
  /* Formular Text Farbe */
  --navigation-background-color: #ffffff;
  /* Navigation Hintergrundfarbe */
  --navigation-text-color: #000000;
  /* Navigation Text Farbe */
  --header-background: #ffffff;
  /* Header Hintergrund */
  --header-text-color: #666666;
  /* Header Hintergrund */
  --header-scene-text-color: #ffffff;
  /* Text Farbe für Bildüberschrift im Header */
  --background-site: #ffffff;
  /* Hintergrundfarbe der Seite */
  --text-primary-bg: #ffffff;
  /* Text-Farbe auf Primär Hintergrund */
  --background-content: #ffffff;
  /* Hintergrundfarbe für Inhalt */
  --form-field-active-background-primary-bg: #ffffff;
  /* Formularfeld Hintergrundfarbe für aktive Felder (Checkbox, Radio, NPS, ...) auf primär Hintergrund */
  --form-field-active-font-color-primary-bg: #0082a1;
  /* Formularfeld Schriftfarbe für aktive Felder (Checkbox, Radio, NPS, ...) auf primär Hintergrund */
  --form-field-border-primary-bg: #ffffff;
  /* Formular Rahmen Farbe auf primär Hintergrund */
  --form-field-background-primary-bg: #ffffff;
  /* Formularfeld Hintergrundfarbe auf primär Hintergrund */
  --form-field-font-color-primary-bg: #ffffff;
  /* Formularfeld Textfarbe auf primär Hintergrund */
  --form-field-invalid-color-primary-bg: #ff0000;
  /* Formularfeld Farbe für "Pflichtfeld nicht ausgefüllt" auf primär Hintergrund */
  --form-color-primary-bg: #ffffff;
  /* Formular Text Farbe auf primär Hintergrund */
  --text-secondary-bg: #ffffff;
  /* Text-Farbe auf Sekundär Hintergrund */
  --form-field-active-background-secondary-bg: #ffffff;
  /* Formularfeld Hintergrundfarbe für aktive Felder (Checkbox, Radio, NPS, ...) auf sekundär Hintergrund */
  --form-field-active-font-color-secondary-bg: #0082a1;
  /* Formularfeld Schriftfarbe für aktive Felder (Checkbox, Radio, NPS, ...) auf sekundär Hintergrund */
  --form-field-border-secondary-bg: #ffffff;
  /* Formular Rahmen Farbe auf sekundär Hintergrund */
  --form-field-background-secondary-bg: #ffffff;
  /* Formularfeld Hintergrundfarbe auf sekundär Hintergrund */
  --form-field-font-color-secondary-bg: #ffffff;
  /* Formularfeld Textfarbe auf sekundär Hintergrund */
  --form-field-invalid-color-secondary-bg: #ff0000;
  /* Formularfeld Farbe für "Pflichtfeld nicht ausgefüllt" auf sekundär Hintergrund */
  --form-color-secondary-bg: #ffffff;
  /* Formular Text Farbe auf sekundär Hintergrund */
  --link-color: rgba(0, 0, 0, 0.6);
  --error-bg: #000000;
  --post-yellow: #ffcc00;
}
/* ============================================================= */
/*	Color Definition */
/* ============================================================= */
body {
  background: var(--background-site);
}
body,
h4,
h5,
p {
  color: var(--base-font-color);
}
h1 {
  color: var(--h1-font-color);
}
h2 {
  color: var(--h2-font-color);
}
h3 {
  color: var(--h3-font-color);
}
/* BUTTON */
.button a {
  background: var(--primary-color);
  border: 1px solid var(--primary-color);
  color: var(--text-primary-bg);
}
/* Trenner */
.divider {
  border-bottom: 1px solid var(--border-color);
}
/* Hervorgehobener Inhalt Primär-Farbe
   =================================== */
.primary-color-bg {
  background: var(--primary-color);
}
.primary-color-bg,
.primary-color-bg p,
.primary-color-bg h1,
.primary-color-bg h2,
.primary-color-bg h3,
.primary-color-bg h4,
.primary-color-bg h5,
.primary-color-bg ul li,
.primary-color-bg ol li,
.primary-color-bg a,
.primary-color-bg .image-legend {
  color: var(--text-primary-bg);
}
.primary-color-bg .button a {
  background: var(--text-primary-bg);
  border: 1px solid var(--text-primary-bg);
  color: var(--primary-color);
}
.primary-color-bg .divider {
  border-bottom: 1px solid var(--text-primary-bg);
}
/* Hervorgehobener Inhalt Sekundär-Farbe
   =================================== */
.secondary-color-bg {
  background: var(--secondary-color);
}
.secondary-color-bg,
.secondary-color-bg p,
.secondary-color-bg h1,
.secondary-color-bg h2,
.secondary-color-bg h3,
.secondary-color-bg h4,
.secondary-color-bg h5,
.secondary-color-bg ul li,
.secondary-color-bg ol li,
.secondary-color-bg a,
.secondary-color-bg .image-legend {
  color: var(--text-secondary-bg);
}
.secondary-color-bg .button a {
  background: var(--text-secondary-bg);
  border: 1px solid var(--text-secondary-bg);
  color: var(--secondary-color);
}
.secondary-color-bg .divider {
  border-bottom: 1px solid var(--text-secondary-bg);
}
/* Hervorgehobener Inhalt Sekundär-Farbe
  ====================================== */
.secondary-color-bg {
  background: var(--secondary-color);
}
/* Formular Farben
================================= */
::-webkit-input-placeholder,
::-moz-placeholder,
:-moz-placeholder,
:-ms-input-placeholder {
  color: var(--form-field-font-color);
}
.primary-color-bg textarea,
.primary-color-bg input,
.primary-color-bg select,
.primary-color-bg .form-button-container a {
  border: 1px solid var(--form-field-border-primary-bg);
  color: var(--form-field-font-color-primary-bg);
}
.primary-color-bg input[type="file"] {
  color: var(--form-field-border-primary-bg);
}
.primary-color-bg input[type='reset'] {
  color: var(--form-field-border-primary-bg);
}
.secondary-color-bg textarea,
.secondary-color-bg input,
.secondary-color-bg select,
.secondary-color-bg .form-button-container a {
  border: 1px solid var(--form-field-border-secondary-bg);
  color: var(--form-field-font-color-secondary-bg);
}
.secondary-color-bg input[type="file"] {
  color: var(--form-field-border-secondary-bg);
}
.secondary-color-bg input[type='reset'] {
  color: var(--form-field-border-secondary-bg);
}
input[type="file"] {
  color: var(--form-field-border);
}
/* extended implementation of input=file with additional icon to remove file*/
.primary-color-bg .form-file-input .input-container {
  border: 1px solid var(--form-field-border-primary-bg);
  background-color: var(--text-primary-bg);
  color: var(--form-field-font-color-primary-bg);
}
.primary-color-bg .form-file-input .input-container input[type="file"] {
  color: var(--form-field-font-color-primary-bg);
  border: 0px;
}
.secondary-color-bg .form-file-input .input-container {
  border: 1px solid var(--form-field-border-secondary-bg);
  background-color: var(--text-primary-bg);
  color: var(--form-field-font-color-secondary-bg);
}
.secondary-color-bg .form-file-input .input-container input[type="file"] {
  color: var(--form-field-font-color-secondary-bg);
  border: 0px;
}
.form-file-input .input-container {
  border: 1px solid var(--form-field-border);
  background-color: var(--form-field-background-primary-bg);
  color: var(--form-field-font-color);
}
.form-file-input .input-container input[type="file"] {
  color: var(--form-field-font-color);
  border: 0px;
}
.primary-color-bg form input[type='radio']:not(checked) + label:before,
.primary-color-bg form input[type='checkbox']:not(checked) + label:before {
  color: var(--form-field-border-primary-bg);
}
.primary-color-bg form input[type='radio']:checked + label:before,
.primary-color-bg form input[type='checkbox']:checked + label:before {
  color: var(--form-field-border-primary-bg);
}
.secondary-color-bg form input[type='radio']:not(checked) + label:before,
.secondary-color-bg form input[type='checkbox']:not(checked) + label:before {
  color: var(--form-field-border-secondary-bg);
}
.secondary-color-bg form input[type='radio']:checked + label:before,
.secondary-color-bg form input[type='checkbox']:checked + label:before {
  color: var(--form-field-border-primary-bg);
}
form input[type='radio']:not(checked) + label:before,
form input[type='checkbox']:not(checked) + label:before {
  color: var(--form-field-border);
}
form input[type='radio']:checked + label:before,
form input[type='checkbox']:checked + label:before {
  color: var(--form-field-border-checked);
}
.primary-color-bg form input[type='checkbox']:not(checked) + label,
.primary-color-bg form input[type='radio']:not(checked) + label {
  color: var(--form-color-primary-bg);
}
.primary-color-bg form input[type='checkbox']:checked + label,
.primary-color-bg form input[type='radio']:checked + label {
  color: var(--form-color-primary-bg);
}
.secondary-color-bg form input[type='checkbox']:not(checked) + label,
.secondary-color-bg form input[type='radio']:not(checked) + label {
  color: var(--form-color-secondary-bg);
}
.secondary-color-bg form input[type='checkbox']:checked + label,
.secondary-color-bg form input[type='radio']:checked + label {
  color: var(--form-color-secondary-bg);
}
form input[type='checkbox']:not(checked) + label,
form input[type='radio']:not(checked) + label {
  color: var(--form-field-font-color);
}
form input[type='checkbox']:checked + label,
form input[type='radio']:checked + label {
  color: var(--form-field-font-color-checked);
}
.primary-color-bg form .form-select-enhanced option.placeholder {
  color: rgba(255, 255, 255, 0.8);
}
.secondary-color-bg form .form-select-enhanced option.placeholder {
  color: rgba(255, 255, 255, 0.8);
}
form .form-select-enhanced option.placeholder {
  color: rgba(93, 93, 93, 0.8);
}
/* extended implementation of input=tel with contry selection based on 3rd party library*/
.primary-color-bg .form-tel-input .iti__flag-container .iti__arrow {
  border-top-color: var(--form-field-font-color-primary-bg);
}
.primary-color-bg .form-tel-input .iti__flag-container .iti__arrow--up {
  border-bottom-color: var(--form-field-font-color-primary-bg);
}
.primary-color-bg .form-tel-input .iti__country-list {
  border: 1px solid var(--form-field-border-primary-bg);
  color: var(--form-field-font-color-primary-bg);
  background-color: var(--primary-color);
}
.primary-color-bg .form-tel-input .iti__country-list .iti__country.iti__highlight {
  background-color: rgba(0, 0, 0, 0.15);
}
.primary-color-bg .form-tel-input .iti__country-list .iti__dial-code {
  color: var(--form-field-font-color-primary-bg);
}
.primary-color-bg .form-tel-input .iti__country-list .iti__divider {
  border-top: var(--form-field-font-color-primary-bg);
}
.primary-color-bg .form-tel-input input {
  color: var(--form-field-font-color-primary-bg);
}
.primary-color-bg .form-tel-input input::placeholder {
  color: var(--form-field-font-color-primary-bg);
  opacity: 0.5;
}
.secondary-color-bg .form-tel-input .iti__flag-container .iti__arrow {
  border-top-color: var(--form-field-font-color-secondary-bg);
}
.secondary-color-bg .form-tel-input .iti__flag-container .iti__arrow--up {
  border-bottom-color: var(--form-field-font-color-secondary-bg);
}
.secondary-color-bg .form-tel-input .iti__country-list {
  border: 1px solid var(--form-field-border-secondary-bg);
  color: var(--form-field-font-color-secondary-bg);
  background-color: var(--secondary-color);
}
.secondary-color-bg .form-tel-input .iti__country-list .iti__country.iti__highlight {
  background-color: rgba(0, 0, 0, 0.15);
}
.secondary-color-bg .form-tel-input .iti__country-list .iti__dial-code {
  color: var(--form-field-font-color-secondary-bg);
}
.secondary-color-bg .form-tel-input .iti__country-list .iti__divider {
  border-top: var(--form-field-font-color-secondary-bg);
}
.secondary-color-bg .form-tel-input input {
  color: var(--form-field-font-color-secondary-bg);
}
.secondary-color-bg .form-tel-input input::placeholder {
  color: var(--form-field-font-color-secondary-bg);
  opacity: 0.5;
}
.form-tel-input .iti__flag-container .iti__arrow {
  border-top-color: var(--form-field-font-color);
}
.form-tel-input .iti__flag-container .iti__arrow--up {
  border-bottom-color: var(--form-field-font-color);
}
.form-tel-input .iti__country-list {
  border: 1px solid var(--form-field-border);
  color: var(--form-field-font-color);
  background-color: var(--form-field-background);
}
.form-tel-input .iti__country-list .iti__country.iti__highlight {
  background-color: rgba(0, 0, 0, 0.15);
}
.form-tel-input .iti__country-list .iti__dial-code {
  color: var(--form-field-font-color);
}
.form-tel-input .iti__country-list .iti__divider {
  border-top: var(--form-field-font-color);
}
.form-tel-input input {
  color: var(--form-field-font-color);
}
.form-tel-input input::placeholder {
  color: var(--form-field-font-color);
  opacity: 0.5;
}
/* Header Farben
============================================= */
.header {
  background: var(--header-background);
  color: var(--header-text-color);
}