/**
 * Question part
 */
/** Question Design **/

.question-container {
  margin-bottom: 1.7em;
  border: 1px solid #F0F2F4;
  background-color: #F0F2F4;
}


/* Define the color for Awesome Bootsrap Checkboxes ; based on bg-primary background-color*/
label::after{background-color:#F0F2F4}


/* Custom Styles */

/* Hintergrund des gesamten Body auf Weiß setzen */
body {
    background-color: #ffffff; /* Weiß */
}

/* Hintergrund des Headers auf Dunkelblau setzen und die Schriftfarbe auf Weiß */
.navbar, .navbar-default {
    background-color: #011E4A; /* Dunkelblau */
    color: #ffffff; /* Weiß */
}

/* Stelle sicher, dass die Schriftfarbe aller Elemente im Header Weiß ist */
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-brand {
    color: #ffffff; /* Weiß */
}

/* Standardtextfarbe auf Blau setzen */
body, .navbar-default .navbar-brand {
    color: #011E4A; /* Dunkelblau */
}

body p,
body div,
body a,
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-brand,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .active > a {
    color: #011E4A !important; /* Dunkelblau mit der '!important'-Anweisung zur Erhöhung der Priorität */
}

/* Grundlegender Stil für den Ladebalken: Hintergrund hell */
.progress {
    background-color: #F0F2F4; /* Ein helles Grau als Hintergrundfarbe */
    border-radius: 4px; /* Optional: Fügt abgerundete Ecken hinzu */
}

/* Der gefüllte Teil des Ladebalkens auf Pink setzen */
.progress-bar {
    background-color: #D4004B !important; /* Pink */
    color: #ffffff !important; /* Weiß mit !important, falls andere Stile dies überschreiben */
}

/* Überschreibe die Schriftart für alle Textelemente auf Georgia-BoldItalic */
body,
.navbar,
.btn,
.question-title-container,
.group-description,
.progress-bar, /* Auch der Text im Ladebalken, falls dort Text vorhanden ist */
.alert,
.well,
.panel {
    font-family: 'Museo Sans', !important;
}


/* Setze die Hintergrundfarbe aller blauen Boxen (Buttons, etc.) auf Pink */
.btn-primary,
.btn-info,
.alert-info,
.label-info {
    background-color: #D4004B; /* Pink, anhand deiner vorherigen Angaben */
    border-color: #D4004B; /* Auch für den Rand, falls notwendig */
    
}
#ls-button-submit:hover {
  background-color: #EA80A5;
  border-color: #EA80A5;
}





/* Überschreibe die Textfarbe für Links in den pinken Boxen auf Weiß, falls notwendig */
.btn-primary a,
.btn-info a,
.alert-info a,
.label-info a,
.text-info a {
    color: #ffffff; /* Weiß */
}

/* Überschriftenfarbe auf Pink setzen */
h1, h2, h3, h4, h5, h6,
.navbar-default .navbar-brand,
.group-title-container .group-title {
    color: #294eff; /* Pink */
}

/* Stelle sicher, dass Links in der Navigation auch in Weiß sind */
.navbar-default .navbar-nav > li > a {
    color: #ffffff;
}

/* Schriftgröße für Fragegruppentitel erhöhen */
.group-title-container {
    font-size: 1.2em; /* Erhöhte Schriftgröße */
}

/* Schriftgröße für Fragen erhöhen */
.question-title-container {
    font-size: 1.2em; /* Erhöhte Schriftgröße */
}

/* Schriftgröße für die Fragebeschreibung erhöhen, falls vorhanden */
.group-description {
    font-size: 1.2em; /* Erhöhte Schriftgröße */
}

/* Schriftgröße für die Fragebeschreibung erhöhen, falls vorhanden */
.group-description {
    font-size: 1.2em; /* Erhöhte Schriftgröße */
}

/* Fortschrittsbalken-Stand pink färben */
.progress-bar {
    background-color: #294eff; /* Pink */
}

/* Font Family für Textelemente setzen */
body, .navbar, .btn, .question-title-container, .group-description, .ls, .ls-answer, {
    font-family: 'Museo Sans', serif;
}

/* Schriftgröße für den Inhalt von Fragen erhöhen */
.ls-answers {
    font-size: 1.2em; /* Erhöhte Schriftgröße */
}

/* Schriftgröße für den Inhalt von Fragen erhöhen */
.ls {
    font-size: 1.2em; /* Erhöhte Schriftgröße */
}

/* SLIDER */

.slider-button { background: #D4004B}

/* SLIDER END ************************************************

/* little icon near the question-help */
.ls-questionhelp{
    color:#D4004B;
}

.tooltip-inner{
    color: #ffffff !important;
    background-color: #D4004B;
}

.tooltip-arrow {
    border-top-color: #D4004B !important;
}

.slider-handle{
    background-color: #D4004B !important;
}

.logo-progress {
    margin-top: 15px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.top-container {
    margin-top: 25px !important;
}

.survey-name {
    color: #011E4A;
}

.panel-heading, .modal-title {
    background-color: #011E4A !important;
    color: #ffffff !important;
}

.btn-primary:hover {
  background-color: #EA80A5;
  border-color: #EA80A5 !important;
}

.ls-move-btn, .ls-move-next-btn, .ls-move-submit-btn, .action--ls-button-submit, .btn-primary {
  background-color: #D4004B !important;
  border-color: #D4004B !important;
  border-color: #EA80A5 !important;
}

.ls-button-label:active {
  background-color: #ffffff !important;
  color:#EA80A5 !important;
   border-color: #EA80A5 !important;
  transform: translateY(4px);
}