/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

/**************************************************
    GLOBALE Vorlage-Einstellungen (NICHT ÄNDERN!!!)
    -----------------------------------------------
***************************************************/
/*Zur Info, in dieser Designvorlage wurde auch eine individuelle Anpassung im theme.css vorgenommen:
Grund: Entfernung des "Fragezeichen-Symbols" vor dem Hilfstext
Zeile 181: alt: .ls-questionhelp:before{content:"\f059"}
			neu: .ls-questionhelp:before{content:""}
*/


/*hide question-message */
.question-valid-container {display:none;}


/*hide "Pflichtfragen-Symbol vor der Frage (kleines rotes Kreuz)" */
.text-danger {display:none;}


/*Umfragetitel auf Willkommensseite NICHT anzeigen --> ermöglicht Projektnummer als Umfragtitel zu verwenden
    --> sichtbarer Name der Umfrage muss dann als "Beschreibung" angegeben werden */
.survey-name {display:none;}


/*Label-Text bei Mehrfachantwort mit Kommentar linksbündig */
.control-label.checkbox-label {text-align: left;}


/*Fortschrittsbalken schmälern, damit er in der mobilen Version nicht zu lang ist */
.top-container .container-fluid {width: 30em;}


/*Name der Umfrage weniger an den oberen Rand gequetscht */
.name-container {margin-top: 20px;}


.no-tooltip .withslider .tooltip { display: none !important; }


/*Abstand zwischen Antwortoptionen in Mehrfachantworten verringern */
.checkbox-item, .checkbox-text-item { 
   margin-bottom: 0em !important; 
} 


/*Abstand zwischen Antwortoptionen in Einfachantworten verringern */
.radio-item, .radio-text-item { 
   margin-bottom: 0,5em !important; 
} 


/*Schriftart in Dropdown-Listen anpassen - funktioniert nicht */
.fruity .body {
   font-family: 'Arial', 'Roboto', 'Noto Sans' !important;  
} 


/*Schwarze Linien um Matrix-Spaltenüberschriften löschen */




/********************************************************************************
    INDIVIDUELLE Einstellungen für relevante Umfrage (MÜSSEN ANGEPASST WERDEN!!!)
    -----------------------------------------------------------------------------
    
    HIER: STW Dresden - Projektnummer: C2521
    
*********************************************************************************/


/*Farben von Radio-Buttons bei Einfachantworten anpassen*/
.radio-item label::before { 
        border-color: grey; 
    } 
    .radio-item input[type="radio"]:checked + label::before { 
        border-color: grey; 
    } 
    .radio-item input[type="radio"]:checked + label::after { 
        background: #00A0E6; 
    } 


/*Farben von Checkboxen bei Mehrfachantworten anpassen*/
.checkbox-item label::before { 
        border-color: grey; 
    } 
    .checkbox-item input[type="checkbox"]:checked + label::before { 
        border-color: #00A0E6; 
    } 
    .checkbox-item input[type="checkbox"]:checked + label::after { 
        background: #00A0E6; 
    } 


/*Hintergrundfarbe und Rahmen des Buttons "weiter" anpassen*/
.btn-primary { 
    background-color: #00A0E6 !important; 
    border-color: #0087C4 !important; 
} 


/*Farbe beim Hovern über Button "weiter" dunkler stellen*/
.fruity .btn-primary:hover, 
.fruity .btn-primary:focus, 
.fruity .btn-primary:active, 
.fruity .btn-primary.active, 
.fruity .btn-primary.active:focus, 
.fruity .open .dropdown-toggle.btn-primary { 
color: #fff; 
background-color: #0087C4 !important; 
border: 1px solid #0087C4 !important; 
} 


/*Rand- und Schriftfarbe des Buttons "zurück" anpassen*/
.fruity .btn-outline-secondary { 
    border: 1px solid #00A0E6; 
    color: #00A0E6; 
} 


/*Farbe beim Hovern über Button "zurück" dunkler stellen*/
.fruity .btn-outline-secondary:hover, 
.fruity .btn-outline-secondary:focus, 
.fruity .btn-outline-secondary:active, 
.fruity .btn-outline-secondary.active, 
.fruity .btn-outline-secondary.active:focus, 
.fruity .open .dropdown-toggle.btn-outline-secondary { 
color: #fff; 
background-color: #0087C4; 
border: 1px solid #0087C4; 
}


/*Umrandung und Schatten der Texteingabefelder beim Klick in das Textfeld/ Ausfüllen des Textfeldes*/
/*falls kein Schatten gewünscht: nach nach "box shadow:" den Text ab "inset..." durch "none" ersetzen*/
.fruity .form-control:focus, 
.fruity .form-control:hover { 
    border-color: #00A0E6; 
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 4px #00A0E6;
} 


/*Farbe des Fortschrittsbalken anpassen*/
.fruity .progress-bar {
    background-color: #00A0E6;
 }
 
 
/*Farbe des Einleitungstexts auf der Startseite anpassen*/
.fruity .text-primary {  
    color: #444444 !important;  
 }  
 
 
/*Farbe des Hilfstext ("Bitte kreuzen Sie Zutreffendes an") unter den Fragetexten anpassen*/
.fruity .text-info  {
    color: #444444 !important;
}


/*Farben der Datenschutzerklärung anpassen*/
.fruity .panel {  
    border-color: #00A0E6;  
 }  

.fruity .panel-heading {  
    background-color: #00A0E6;  
 }  

.fruity .bg-primary {
   background-color: #00A0E6 !important; 
 }  

.fruity .card-primary {
   border: 1px solid #00A0E6 !important; 
 }  
 
.fruity .card-primary .card-header {
   border: 1px solid #00A0E6 !important; 
 }
 
.fruity a { 
    color: #00A0E6; 
} 

.fruity a[aria-expanded="true"] {
    color: #0087C4 !important;  /* Farbe für den geöffneten Zustand des Links*/
}

.fruity a[aria-expanded="false"] {
	color: #00A0E6 !important; /* Farbe für den geschlossenen Zustand des Links*/
}

.fruity a:hover {
	color: #0087C4 !important;  /* Farbe beim Hover über den Link*/
}

.fruity input[type="checkbox"]:checked {
	background-color: #00A0E6;
	border-color: #00A0E6;
}

.fruity input[type="checkbox"]:focus {
	outline: none !important;
	box-shadow: none !important;
}

.logo-container > img { 
    max-height: 90px; 
    padding: 15px;} 

.question-text{ 
    font-size: 16px; 
    } 
    
.ls-questionhelp{ 
    color: #7f8c8d; 
    } 

/* Dropdown-Feld (Liste/Klappbox) */
select.form-control {
    font-family: "Noto sans", sans-serif; /* Schriftart anpassen */
    font-size: 14px; /* Schriftgröße anpassen */
}
    
/* Mehrfache kurze Texte */
input.form-control {
    font-family: "Noto sans", sans-serif; 
    font-size: 14px;
}

/* Dropdown-Feld (Liste/Klappbox) */ 
select.form-control { 
    font-family: "Noto sans", sans-serif; /* Schriftart anpassen */ 
    font-size: 14px; /* Schriftgröße anpassen */ 
} 


@media only screen and (min-width: 768px) {  
    .question-flex-container { 
        display: flex; 
        justify-content: space-evenly; 
        align-items: flex-start; /* Richtet die Listen oben aus */ 
    } 

    .question-flex-container .flex-layout { 
        align-self: flex-start; 
        width: 100%; 
    } 
}