/******************
    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
*/

/*
Schwarz     #000000     (Text)
Weiss       #ffffff     (Text, Häkchen, etc. vor farbigem Hintergrund)
Dunkelgrau  #C2C9CC     (Inaktive Optionen zB ja/nein)
Hellgrau    #F2F2F2     (Hintergrund von Fragen oder Textblöcken)
Grün        #004743     (Highlight alt: 7BBD14)
Hellblau    #D5F3FD     (Hover)
Rot         #F42C5E     (Fehlermeldungen)
*/

/** Navbar and Logo **/
.logo {
    padding: 0 !important;
}

#dynamicReloadContainer > div.navbar.navbar-default.navbar-fixed-top {
    background-color: white !important;
}

.rtable td,
      .rtable th {
        text-align: left;
        vertical-align: text-top;
        padding: 10px;
      }
      .rtable {
        border-collapse: collapse;
      }
      .rtable tr {
        border: none;
      }
      .rtable td {
        border-top: solid 1px #000;
        border-bottom: solid 1px #000;
      }
      
.table > thead > tr > th {
  vertical-align: top;
  border-bottom: 2px solid #ddd;
}

@media only screen and (max-width: 600px) {
  body .top-container {
        margin-top: 0 !important;
    }
}

.survey-description li, .survey-description p {
    text-align: left;
    color: black;
} 

.progress-bar, body .answer-item label::after {
    background-color:  #2CC4F4 !important;
}

.btn-primary {
    background-color: #004743 !important;
    border: 1px solid #004743 !important;
}

/* Remove the blue frame around clicked buttons */
button:active,
button:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* Remove the thinner frame around clicked buttons */
button::-moz-focus-inner {
  border: 0;
}


.btn-default {
    background-color: #FFFFFF !important;
    color: #004743 !important;
    border: 1px solid #004743 !important;
}

/******************************************************************/
/******************************************************************/
/* CSS zur Datenschutzerklärung ***********************************/

#datasecurity_accepted {
    vertical-align: top;
    float: left;
    margin-right: 10px !important;
    filter: grayscale(1) saturate(200%);
}

.panel-heading {
    background-color: #F2F2F2 !important;
    color: #000000 !important;
    font-size: 18px;
    border: none !important;
}

.panel-primary {
    border: solid 3px #F2F2F2 !important;
}

.panel-footer {
    background-color: #F2F2F2 !important;
}

.panel-footer > button:nth-child(1) {
    background-color: #004743 !important;
}

button.btn:nth-child(2) {
    border: solid 1px #004743 !important;
}

.control-label > a:nth-child(2), .control-label > a:nth-child(3) {
    color: #004743;
    font-weight: bold;
}

/******************************************************************/
/******************************************************************/
/** ALLGEMEINE FRAGENFORMATIERUNG *********************************/

.answer-container {
    padding-bottom: 0.5em;
}

.question-title-container {
    padding-top: 1em !important;
    padding-bottom: 1em !important;
}

.fruity .question-item {
    padding-top: 0em !important;
}

.ls-answers {
    padding-top: 0px !important;
    padding-bottom: 5px !important;
    margin-bottom: 0 !important;
}

ol, ul {
    margin-top: 0 !important;
    margin-bottom: 0px !important;
}

.group-description{
    min-height: 20px;
    padding: 19px;
    background-color: white;
    border: none;
    box-shadow: none;
}


/******************************************************************/
/******************************************************************/
/* RESPONSIVE DESIGN **********************************************/

@media only screen and (max-device-width: 760px) {
  .answer-item input[type="radio"] {
  display: block;
  margin: 0 auto;
  }
}

@media only screen and (max-device-width: 760px) {
    .question-title-container {
        padding-top: 10px !important;
        padding-bottom: 5px !important;
    }
    
    #navigator-container {
        padding-right: 15px;
        padding-left:  15px;
    }
    
    .h3 {
    font-size: 28px !important;
    }
    
    .h4 {
        font-size: 16px !important;
        line-height: 1.42857143 !important;
        color: #333 !important;
    }
    
    #limesurvey > div.privacy.row > div > div.row > div > label, #datasecurity_accepted {
        display: inline;
    }
    
    #answer771691X379X5579 {
        width: 50% !important;
    }
    
    tr {
        border: 2px #C2C9CC solid;
    }
    
    select.form-control {
		font-size: 16px;
		height: auto;
	}
	
	label {
	    font-weight: normal;
	}
}

.h1, h1 {
    font-size: 28px;
    line-height: 1.42857143 !important;
    color: #333 !important;
}


.h4 {
    font-size: 16px !important;
    line-height: 1.42857143 !important;
    color: #333 !important;
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.42857143 !important;
    color: #333 !important;
    background-color: #fff !important;
}


.question-container {
    background-color: #f2f2f2;
    border: none !important;
    box-shadow: none !important;
}

.logo {
    max-height: 60px !important;
}

.logo-container.hidden-xs {
    display: block !important;
}

.space-col {
    margin-top: 1em !important;
    margin-bottom: 1em !important;
}


@media only screen and (max-width: 600px) {
    .question-title-container {
        margin-bottom: 15px !important; /* Abstand zwischen Frage und Antworten */
    }

    .ls-answers {
        padding-top: 10px !important;
    }
}

@media (max-width: 760px) {
    .ka-option {
        display: none;
    }
    .ka-short {
        display: inline;
    }
}

@media (min-width: 760px) {
    .ka-option {
        display: inline;
    }
    .ka-short {
        display: none;
    }
}


/******************************************************************/
/******************************************************************/
/* Checkboxen *****************************************************/

.progress-bar, body .answer-item label::after {
    background-color:  #004743 !important;
}

.radio-item label,.checkbox-item label {
    cursor: pointer;
    font-weight: normal;
}

.checkbox-item input[type="checkbox"]:checked+label::after {
    color: white;
}

/******************************************************************/
/******************************************************************/
/* Freitextfelder *************************************************/

.form-control:focus {
    border: 1px solid #004743 !important;
    border-color: #004743 !important;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(123, 189, 20, 0.6) !important;
}

input[type="text"] {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 13px;
    line-height: 1.42857143; 
}


/******************************************************************/
/******************************************************************/
/* Ja/Nein-Fragen *************************************************/

.yesno-button .btn-primary {
    background-color: #C2C9CC !important;
    border: none !important;
}

.yesno-button .btn-primary.active.focus {
    background-color: #004743 !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.yesno-button .btn-primary.active {
    background-color: #004743 !important;
    border: none !important;
}

.yesno-button .btn-primary:hover {
    background-color: #004743 !important;
}

/* Remove the thinner frame around clicked Yes/No buttons
.yesNoOption label::-moz-focus-inner {
  border: 0;
} */


/******************************************************************/
/******************************************************************/
/* Zwischenüberschriften ******************************************/

.zwischen {
    margin-top: 0em !important;
    margin-bottom: 0em !important;
    padding-bottom: 1em !important;
    padding-left: 1em !important;
    padding-right: 1em !important;
    padding-top: 1em !important;
}


/******************************************************************/
/******************************************************************/
/* Warnmeldungen **************************************************/

.ls-em-error {
    color: #F42C5E !important;
}

.ls-em-success {
    color: #004743 !important;
}

/******************************************************************/
/******************************************************************/
/* Endnachricht ***************************************************/

.completed-text > p:nth-child(4) > a:nth-child(1) {
    color: #004743 !important;;
}

/******************************************************************/
/******************************************************************/
/* Matrixfragen ***************************************************/

/*@media only screen and (max-device-width: 1024px) {
    
}**/


td {
        position:relative;
        Vertical-align: top;
        text-align: center;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    th.answertext.control-label {
        font-weight: normal !important;
    }

    .ls-label-xs-visibility {
        margin-left: 0 !important;
    }
    
    th.answer-text {
        text-align: center;
    } 
    
tbody tr:nth-child(odd){
  background-color: white;
  
}


p a {
    color: #004743 !important;
}

.other-text-item, .other-text-item .input-sm {
    width: 100% !important;
}

.control-label {
    font-weight: normal !important;
}

/** CLO, 21.09.2023: new for right side of semantic differential **/
.answertextright.information-item {
    font-weight: normal !important;
}

/** General Question Texts/Labels **/
.ls-label-question {
    font-weight: bold !important;
}

/** Question type "Text" **/
.boilerplate {
    background-color: white !important;
    text-align: center !important;
    margin-bottom: 0px !important;
}

/* Entfernt Abstand vor/nach Textblöcken */
.question-container.boilerplate {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.question-container.boilerplate .question-title-container {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/** Numeric input fields **/
.numeric {
    text-align: left;
}

/** General Input Fields **/
div.answer-container.col-xs-12 {
    padding-bottom: 0.5em;
}

/** Answer options for matrices  **/
@media only screen and (max-width: 800px) {
    input.numeric {
        width: 90%;
    }
    
    .withsuffix > div > input, .withsuffix > div > div {
        display: inline !important;
    }
    
    .optional{
        display: none;
    }
}

@media only screen and (min-width: 801px) {
    .optional {
        display: block !important;
        vertical-align: bottom !important;
        text-align: center;
    }
    td, th {
        vertical-align: bottom !important;
    }
}