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

.table-bordered>thead>tr>th {
    border: 1px solid #dadada;
}

.table-bordered>thead>tr>td {
    border: 1px solid #dadada;
}

/* #################### general css ################### */

body {
    font-size: 22px;
    line-height: 1.42857143;
    margin: 0 !important;
    padding: 0 !important;
}

body .top-container {
    margin: 0;
}

.text-info {
    color: #333 !important;
}

.text-danger {
    color: #95232C !important;
}

div.save-survey-form {
    padding: 15px;
}

img {
    max-width: 100%;
}

.uploadedfiles .upload.comment {
    word-break: break-all;
}

.top-container .progress {
    background-color: #f0f0f0;
}

.table>:not(:first-child) {
    border-top: none; 
}

.asterisk.float-start {
    margin-right: 5px;
    font-size: 90%;
    vertical-align: top;
}

.leftheader.information-item {
    display: none !important;
}

.rightheader.information-item {
    display: none !important;
}

.group-description {
    text-align: center;
}

div.answer-item.dropdow-item.language-item {
    width: 200px;
}

.other-text-item {
    padding: 0px;
}

.othertext-label-checkox-container {
    margin-bottom: 15px;
}

@media only screen and (max-width: 768px) {
    .list-dropdown.question-container .ls-answers.answer-item div:nth-child(1),
    .list-dropdown.question-container .ls-answers.answer-item div:nth-child(3).text-item.other-text-item {
        width: 100%;
    }
}

@media (max-width: 768px) {
    #navbar ul.nav.navbar-nav {
        padding: 7.5px 0px;    
        border-bottom: 1px solid #dee2e6;
    }
}

.radio-item label::after {
    background-color: #333;
}

.checkbox-item label::after {
    color: #333;
}

.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #737373;
}

.form-control:focus {
    border-color: #000;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0,0,0, .6);
}

@media (max-width: 767px) {
    .date.question-container .date-item  div.col-12:nth-child(2),
    .date.question-container .date-item  div.col-12:nth-child(4) {
        display: none;
    }
}

.navbar-toggler {
    background-color: #fff !important;
}

.navbar-toggler:focus {
    background-color: #eee;
    box-shadow: none;
}

li.radio-item, 
li.checkbox-item, 
li.radio-text-item, 
li.checkbox-text-item {
    margin-bottom: 14px !important;
}

.numeric-multi ul.number-list li.ls-group-remaining.ls-group-dynamic  {
    display: inline-flex;
    flex-wrap: wrap;
    width: 100%;
}

@media (max-width: 768px) {
    .numeric-multi ul.number-list li.ls-group-remaining.ls-group-dynamic div:nth-child(1)  {
        text-align: center;
    }
}

.numeric-multi ul.number-list li.ls-group-total.ls-group-dynamic {
    display: inline-flex;
    flex-wrap: wrap;
    width: 100%;
    margin-left: auto;
}

@media (max-width: 768px) {
    .numeric-multi ul.number-list li.ls-group-total.ls-group-dynamic div:nth-child(1) {
        text-align: center;
    }
}

.ls-group-remaining div:nth-child(1),
.ls-group-total div:nth-child(1) {
   text-align: center; 
}

/* #################### first page start ################### */

.question-count-text {
    margin-top: 15px;
}

/* Privacy */

.privacy {
    margin-top: 15px;
    padding: 15px 0;
    margin: 15px 0px;
    border-top: 1px solid #ffffff; /* weiße obere Linie */
}

.privacy-block div:nth-child(2) {
    padding-top: 20px;
}

.privacy-heading {
    font-size: 20px;
    color: #a1a1a1 !important;
    font-weight: bold;
}

p.ls-privacy-body {
    margin: 15px 0 0 0;
    /* font-style: italic; */
}

/* Privacy policy */

.panel {
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0;
    background-color: transparent;
}

.panel-primary {
    border-color: transparent;
}

.panel-primary>.panel-heading {
    color: #000;
    background-color: transparent;
    border-color: transparent;
    padding: 15px 0;
}

.panel-body {
    padding: 5px 0;
}

.panel-footer {
    padding: 10px 0;
    background-color: transparent;
    border-top: transparent;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

input#datasecurity_accepted {
    vertical-align: top;
}

/* #################### first page end ################### */

/* logo header */

span.navbar-banner {
    display: block;
    width: 100%;
    text-align: center;
}

.logo-bar {
    margin-top: 0;
    padding: 15px 0;
    display: flex;
    align-items: center;    
}

.navbar-logo-left {
    padding: 0px 10px;
}

.navbar-logo-middle {
    padding: 0px 10px;
    text-align: center;
}

.navbar-logo-right {
    padding: 0px 10px;
    text-align: right;
}

/* survey heading */

.survey-name {
    font-weight: 700;
    line-height: 130%;
    font-size: 1.8rem;
}

/* progress-bar */

.progress-bar {
    background-color: #333;
}

/* #################### group start ################### */

.group-outer-container,
.group-container {
    margin-bottom: 0;
}

.group-title {
    font-size: 1.4rem;
    margin: 0;
    margin-bottom: 20px;
    padding: 0px 15px;
}

.well {
    justify-content: center;
    background-color: transparent;
    margin-top: 0px;
    padding: 0px 15px;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

/* #################### group end ################### */

/* #################### question start ################### */

.question-container {
    background-color: transparent;
    padding-bottom: 15px;
    border: 1px solid #aaa;
}

.question-title-container {
    margin-bottom: 0;
}

.question-number,
.question-code {
    font-weight: normal;
    float: none;
    margin: 0;
}

.question-text {
    font-size: 32px;
    font-family: "GT-America-Stand-Medium";
}

.question-help-container {
    padding: 0px;    
    font-size: 20px;
    margin-top: 10px;
    color: #000 !important;
}

.question-valid-container {
    color: #000 !important; /* #95232C */
    padding-left: 0;
    padding-right: 0;
    font-size: 20px;
    margin-top: 5px;
}

@media only screen and (max-device-width: 760px) {
    .ls-questionhelp, .help-block {
        font-size: 11.34px;
    }
}

.ls-answers tbody .answertext {
    text-align: left;
}

.array-flexible-row .ls-answers .answertextright {
    text-align: right;
}

/* #################### question end ################### */

/* #################### particular question start ################### */

.choice-5-pt-radio li.radio-item {
    margin-right: 15px;
}

.choice-5-pt-radio .radio-item label::before,
.list-radio .radio-item label::before,
.list-with-comment .radio-item label::before {
    top: 5px;
}

.choice-5-pt-radio .radio-item label::after,
.list-radio .radio-item label::after,
.list-with-comment .radio-item label::after {
    top: 6px;
}

.multiple-opt .checkbox-item label::before,
.multiple-opt-comments .checkbox-item label::before {
    top: 3px;
}

.multiple-opt .checkbox-item label::after,
.multiple-opt-comments .checkbox-item label::after {
    top: 4px;
}

.array-multi-flexi .checkbox-item label::after {
    left: 0px;
}

div.gender-button,
div.yesno-button {
    column-gap: 10px;
}

@media only screen and (max-width: 468px) {
    .date .date-item div:nth-child(1).col-3 {
        width: 100%;
    }
}

/* #################### particular question end ################### */

/* #################### dropdown & link start ################### */

.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus {
    color: #ffffff;
    background-color: #7591C4;
}

.form-change-lang.dropdown.nav-item {
    list-style: none;
    text-align: center;
}

.form-change-lang .nav-link.dropdown-toggle {
    color: #000000;
    margin: 15px 0px;
    padding: 0;
}

/* #################### dropdown & link end ################### */

/* #################### footer navbar start ################### */

#navbar {
    padding: 0 !important;
}

#survey-nav .container-fluid {
    padding: 0;
}

ul.navbar-right {
    padding: 0;
}

#navbar ul.nav.navbar-nav {
    width: 100%;
}

#navbar li.navbar-item-middle {
    text-align: center;
}

#navbar li.navbar-item-right {
    text-align: right;
}

.nav-item-fload {
    list-style: none;
}

.nav-item-fload a {
    color: #888;
    text-align: center;
}

.list-group-itemindex-item.index-item-seen.index-item-unanswered.index-item-current {
    background-color: #7591C4;
    color: #fff;
}

#survey-nav .container-fluid {
    justify-content: center;
}

@media screen and (max-width: 768px) {
    #survey-nav .container-fluid {
        padding-top: 15px;
    }

    div.gender-button,
    div.yesno-button {
        width: 100%;
    }
}

.navbar-toggler {
    color: rgba(0, 0, 0, .55);
    background-color: #eee;
    border-color: rgba(0, 0, 0, .1);
}

span.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(0, 0, 0, 0.55)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
}

@media screen and (max-width: 768px) {
    .navbar-item-left a {
        text-align: center;
    }

    #survey-nav {
        border-bottom: none !important;
    }
}

.dropdown-item.disabled,
.dropdown-item:disabled {
    color: #fff !important;
    background-color: #333 !important;
}

.navbar-item-middle li.list-group-itemindex-item a {
    color: #333;
}

/* #################### footer navbar end ################### */

/* #################### footer start ################### */

footer {
    text-align: center;
    padding: 20px;
}

footer a {
    color: #333 !important;
}

/* #################### footer end ################### */

label::after {
    background-color: transparent;
}

tr.ls-odd,
.array-flexible-column tr.answers-list:nth-child(even) {
    background-color: transparent;
}

tbody,
td,
tfoot,
th,
thead,
tr,
.table-bordered>thead>tr>td,
.table-bordered>thead>tr>th {
    border: none;
}

.btn-group>.btn-group:not(:last-child)>.btn,
.btn-group>.btn:not(:last-child):not(.dropdown-toggle) {
    border-radius: 0;
}

.btn-group>.btn-group:not(:first-child)>.btn,
.btn-group>.btn:nth-child(n+3),
.btn-group>:not(.btn-check)+.btn {
    border-radius: 0;
}

.form-select:focus {
    border-color: #000;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(0, 0, 0, .6);
    outline: 0;
}

.table-hover>tbody>tr:hover,
tr.answers-list:hover,
.array-flexible-column tr.answers-list:hover {
    background-color: #ddd;
}

.table-hover>tbody>tr:hover>* {
    --bs-table-accent-bg: transparent;
    color: #333;
}

.ls-input-group-extra {
    vertical-align: top;
    padding: 1rem 1.2rem;
}

@media (min-width: 768px) {
    .navbar-expand-md .navbar-nav .dropdown-menu {
        position: absolute;
        inset: auto 70px auto auto;
    }
}

@media only screen and (max-width: 760px),
(max-device-width: 1024px) and (min-device-width: 768px) {

    table.ls-answers>tbody>tr td.answer-item.radio-item,
    table.ls-answers>tbody>tr td.answer-item.checkbox-item {
        border-bottom: 1px solid #ddd;
        padding-left: 30px;
        padding-top: 10px;
        padding-bottom: 0px;
    }
}

/*--------------------start button--------------------- */

.btn {
    font-size: 110%;
    border-radius: 4px;
    padding: 6px 12px;
}

.btn-group-lg>.btn,
.btn-lg {
    line-height: 1.3333333;
    padding: 10px 16px;
}

/* Customize Admin page survey title buttons */
.surveytitle.btn-primary {
    color: #fff;
    background-color: #333;
    border-color: #333;
}

.surveytitle.btn-primary:hover {
    color: #fff;
    background-color: #111;
    border-color: #111;    
}

/*btn btn-primary*/

/*next-btn*/
.ls-move-submit-btn:active,
.ls-move-submit-btn.active,
.ls-move-submit-btn:focus,
.ls-move-submit-btn.focus,
.ls-move-submit-btn:active:focus,
.ls-move-submit-btn.active:focus,
.ls-move-submit-btn:active.focus,
.ls-move-submit-btn.active.focus,

.ls-move-next-btn:active,
.ls-move-next-btn.active,
.ls-move-next-btn:focus,
.ls-move-next-btn.focus,
.ls-move-next-btn:active:focus,
.ls-move-next-btn.active:focus,
.ls-move-next-btn:active.focus,
.ls-move-next-btn.active.focus,

.ls-move-submit-btn:hover,
.ls-move-submit-btn:active:hover,
.ls-move-submit-btn.active:hover,
.ls-move-next-btn:hover,
.ls-move-next-btn:active:hover,
.ls-move-next-btn.active:hover {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

.ls-move-submit-btn,
.ls-move-next-btn {
    color: #fff;
    background-color: #333;
    border-color: #333;
}

/*gender/yes/no... : default*/
.gender-button .btn-primary,
.yes-no .btn-primary,
.bootstrap-buttons-div .button-item {
    color: #333;
    background-color: #eee;
    border-color: #eee;
}

/*gender/yes/no... : hover*/
.gender-button .btn-primary:hover,
.yes-no .btn-primary:hover,
.bootstrap-buttons-div .button-item:hover {
    color: #fff;
    background-color: #777;
    border-color: #777;

}

/*gender/yes/no... : active*/
.gender-button .btn-primary:active,
.gender-button .btn-primary.active:hover,
.gender-button .btn-primary:focus,
.gender-button .btn-primary.active,
.gender-button .btn-primary.active:focus,
.yes-no .btn-primary:focus,
.yes-no .btn-primary.active,
.yes-no .btn-primary.active:hover,
.yes-no .btn-primary.active:focus,
.bootstrap-buttons-div .button-item:focus,
.bootstrap-buttons-div .button-item.active,
.bootstrap-buttons-div .button-item:focus {
    color: #fff;
    background-color: #777;
    border-color: #777;
}

/*date picker*/
.date-timepicker-group .btn-primary,
.date-timepicker-group .btn-primary:hover,
.date-timepicker-group .btn-primary:active,
.date-timepicker-group .btn-primary:focus,
.date-timepicker-group .btn-primary:active:hover,
.date-timepicker-group .btn-primary:active:focus,
.date-timepicker-group .btn-primary:active.focus,
.date-timepicker-group .btn-primary.hover,
.date-timepicker-group .btn-primary.active,
.date-timepicker-group .btn-primary.focus,
.date-timepicker-group .btn-primary.active:hover,
.date-timepicker-group .btn-primary.active:focus,
.date-timepicker-group .btn-primary.active.focus {
    color: #fff;
    background-color: #333;
    border-color: #333;
}

/*btn btn-default*/

/*previous-btn*/
.ls-move-previous-btn:hover,
.ls-move-previous-btn:active:hover,
.ls-move-previous-btn.active:hover,
.ls-move-previous-btn:active,
.ls-move-previous-btn.active,
.ls-move-previous-btn:focus,
.ls-move-previous-btn.focus,
.ls-move-previous-btn:active:focus,
.ls-move-previous-btn.active:focus,
.ls-move-previous-btn:active.focus,
.ls-move-previous-btn.active.focus {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad;
}

.ls-move-previous-btn {
    color: #333;
    background-color: #fff;
    border-color: #adadad;
}

/*###############Upload start###########*/
/*upload: Save Changes...*/
.upload.btn-primary {
    color: #fff;
    background-color: #333;
    border-color: #333;
}

.upload.btn-primary:hover,
.upload.btn-primary:active:hover,
.upload.btn-primary.active:hover {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

.upload.btn-primary:active,
.upload.btn-primary.active,
.upload.btn-primary:focus,
.upload.btn-primary.focus,
.upload.btn-primary:active:focus,
.upload.btn-primary.active:focus,
.upload.btn-primary:active.focus,
.upload.btn-primary.active.focus {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

/*upload popup start*/
/*start: upload: Select file...*/
.upload-div .btn {
    color: #fff;
    background-color: #333;
    border-color: #333;
}

.upload-div .btn:active,
.upload-div .btn.active,
.upload-div .btn:focus,
.upload-div .btn.focus,
.upload-div .btn:focus,
.upload-div .btn:focus,
.upload-div .btn.focus,
.upload-div .btn.focus {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

.upload-div .btn:hover,
.upload-div .btn:active:hover,
.upload-div .btn.active:hover {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

.upload-files .uploadedfiles td a.btn-primary {
    color: #fff;
    background-color: #333;
    border-color: #333;
}

.upload-files .uploadedfiles td a.btn-primary:hover,
.upload-files .uploadedfiles td a.btn-primary:active,
.upload-files .uploadedfiles td a.btn-primary:focus {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

fieldset div:nth-child(3) a.btn {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
}

/*end: upload: Select file...*/

/*upload: You can upload...*/
.uploader .alert-info {
    color: #fff;
    background-color: #333;
    border: 0px;
}


/*file upload popup save-changes*/
.file-upload-modal-footer .btn {
    color: #fff;
    background-color: #333;
    border-color: #333;
}


.file-upload-modal-footer .btn:active,
.file-upload-modal-footer .btn.active,
.file-upload-modal-footer .btn:focus,
.file-upload-modal-footer .btn.focus,
.file-upload-modal-footer .btn:active:focus,
.file-upload-modal-footer .btn.active:focus,
.file-upload-modal-footer .btn:active.focus,
.file-upload-modal-footer .btn.active.focus {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

.file-upload-modal-footer .btn:hover,
.file-upload-modal-footer .btn:active:hover,
.file-upload-modal-footer .btn.active:hover {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

.file-upload-modal-footer .btn, 
.file-upload-modal-footer .btn:active, 
.file-upload-modal-footer .btn.active {
    color: #ffffff;
    border-color: #5cb85c;
    background-color: #4cae4c;
}

.file-upload-modal-footer .btn:hover, 
.file-upload-modal-footer .btn:active:hover, 
.file-upload-modal-footer .btn.active:hover {
    color: #ffffff;
    border-color: #398439;
    background-color: #449d44;
}

/*upload popup end*/

/*###############Upload end###########*/

.save-survey-input .btn,
.modal-dialog .btn {
    color: #fff;
    background-color: #333;
    border-color: #333;
}

.save-survey-input .btn:hover,
.save-survey-input .btn:active:hover,
.save-survey-input .btn.active:hover,
.modal-dialog .btn:hover,
.modal-dialog .btn:active:hover,
.modal-dialog .btn.active:hover {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

.btn-info {
    color: #fff;
    background-color: #333;
    border-color: #333;
}

.btn-info:hover {
    color: #fff;
    background-color: #111;
    border-color: #111;
}

/*--------------------end button--------------------- */

/*--------------------start sortables----------------*/

.list-samechoiceheight .sortable-list {
    border: 1px dotted #ccc;
    padding: 5px;
}

/*unsorted*/
.sortable-choice .ls-choice.sortable-item {
    background-color: #ddd;
    border: 1px solid #ddd;
    margin-bottom: 5px;
}

/*sorted*/
.sortable-rank .ls-choice.sortable-item {
    color: #fff;
    background-color: #333;
    border-color: #333;
    margin-bottom: 5px;
}

/*--------------------end sortables----------------*/
.slider-list .slider.slider-untouched .slider-handle {
    background-color: #333;
}

.slider-touched .tooltip-inner,
.slider-touched .slider-handle {
    background-color: #111;
}


.slider-touched .tooltip.top .tooltip-arrow {
    border-top-color: #111;
}

.slider-handle {
    background-color: #111;
    background-image: linear-gradient(to bottom, #111 0%, #111 100%);
}

.slider-selection {
    background-image: linear-gradient(to bottom, #111 0%, #111 100%);
}

@media only screen and (max-width: 760px), (max-device-width: 1024px) and (min-device-width: 768px) {
    .array-flexible-row .ls-answers .answertextright {
        text-align: left;
    }
}

/* 2021-06-23: Add visual separator for dual scale questions */
@media only screen and (min-width: 768px) {

    .array-flexible-dual-scale col.col-answers,
    .array-flexible-dual-scale col.separator,
    .array-flexible-duel-scale col.col-answers,
    .array-flexible-duel-scale col.separator {
        width: auto !important;
    }

    .array-flexible-dual-scale .header_separator,
    .array-flexible-dual-scale .dual_scale_separator,
    .array-flexible-duel-scale .header_separator,
    .array-flexible-duel-scale .dual_scale_separator {
        width: 4px !important;
        padding: 0 !important;
        background-color: grey;
        border-color: grey;
    }

    .array-flexible-dual-scale .table-hover>tbody>tr:hover>* {
        --bs-table-accent-bg: transparent;
        color: var(--bs-table-hover-color);
    }
}

@media only screen and (max-device-width: 1028px) {
	.ls-answers > tbody > tr > td.radio-item, 
	.ls-answers > tbody > tr > td.checkbox-item {
	min-height: 44px;
	}
}

/* [04-10-2024] : Trivender Singh */
.hidden {
    display: none;
}

/*****************************************************************/
/*                           sotomo theme                        */
/*****************************************************************/

/*****************************************************************/
/*                        Start General CSS                      */
/*****************************************************************/

@font-face {
    font-family: GT-America-Stand-Thin;
    src: url(./fonts/GT-America/GT-America-Standard-Thin.otf) format("opentype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: GT-America-Stand-Regular;
    src: url(./fonts/GT-America/GT-America-Standard-Regular.otf) format("opentype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: GT-America-Stand-Medium;
    src: url(./fonts/GT-America/GT-America-Standard-Medium.otf) format("opentype");
    font-weight: 300;
    font-style: normal
}

/*****Condensed*****/
@font-face {
    font-family: GT-America-Cond-Regular;
    src: url(./fonts/GT-America/GT-America-Condensed-Regular.otf) format("opentype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: GT-America-Cond-Medium;
    src: url(./fonts/GT-America/GT-America-Condensed-Medium.otf) format("opentype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: GT-America-Cond-Light;
    src: url(./fonts/GT-America/GT-America-Condensed-Light.otf) format("opentype");
    font-weight: 400;
    font-style: normal
}

/*****Compressed*****/
@font-face {
    font-family: GT-America-Comp-Regular;
    src: url(./fonts/GT-America/GT-America-Compressed-Regular.otf) format("opentype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: GT-America-Comp-Medium;
    src: url(./fonts/GT-America/GT-America-Compressed-Medium.otf) format("opentype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: "Font Awesome Thin";
    font-style: normal;
    font-weight: 100;
    font-display: block;
    src: url(./fonts/fa-thin-100.woff2) format("woff2"),
    url(./fonts/fa-thin-100.ttf) format("truetype")
}

@font-face {
    font-family: "Font Awesome 6 Sharp";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url(./fonts/fa-sharp-regular-400.woff2) format("woff2"),
    url(./fonts/fa-sharp-regular-400.ttf) format("truetype")
}

.language-changer,
.footer-text {
    font-family: "GT-America-Stand-Regular";
}

body, 
.font-GTAmerica {
    font-family:"GT-America-Stand-Regular";
}

#outerframeContainer {
    padding: 0px;
    background-color: #ffffff;
    border: 0.5px solid #000000;
}

#navigator-container {
    padding-bottom: 0;
}

.space-col {
    margin-top: 0;
    margin-bottom: 0;
}

#main-col {
    margin-top: 0;
}

.script-container {
    height: auto;
}

/*****************************************************************/
/*                        End General CSS                        */
/*****************************************************************/

/*****************************************************************/
/*                         Start Dropdown & Links                */
/*****************************************************************/

.dropdown-item.active, 
.dropdown-item:active {
    background-color: #333333;
}

.dropdown-item:focus, 
.dropdown-item:hover {
    text-decoration: none;
    background-color: transparent;
}

a,
a:link,
#survey-nav .nav-link {   
    color: #888888;   
}

a.dropdown-item.ls-language-link {
    color: #000000;
}

a:hover,
#survey-nav .nav-link:hover, 
#survey-nav .nav-link:focus {
    color: #7591C4;
}

.radio-item label,
.checkbox-item label {
    padding-left: 15px;
}

/*****************************************************************/
/*                          End Dropdown & Links                 */
/*****************************************************************/

/*****************************************************************/
/*                       Start First Page                        */
/*****************************************************************/

div#welcome-container {
    padding: 35px 40px;
}

.survey-description {
    font-size: 35px;
    line-height: 42px;        
    letter-spacing: -0.59px;    
}

.survey-welcome {
    margin-top: 15px;
    font-size: 15px;
    line-height: 140%;    
}

.privacy {
    border-top: 0.5px solid #ffffff;
    padding: 5px 40px;
    letter-spacing: -0.59px;
    line-height: 20px; /*42px */
}

.privacy-heading,
p.ls-privacy-body {
    font-size: 20px;
    color: #a1a1a1; /* grau */
}


.form-check-input:focus {
    box-shadow: none;
}

.form-check-input:checked {
    background-color: #7591C4;
    border-color: #7591C4;
    box-shadow: none;
}

/*****************************************************************/
/*                        End First Page                         */
/*****************************************************************/

/*****************************************************************/
/*                   Start Progress Bar                          */
/*****************************************************************/

.top-container .top-content {
    padding: 0;
    margin-bottom: 0;
}

.top-container .progress {
    height: 6px;
    border-bottom: 0.5px solid #000000;
}

.progress-bar {
    color: #7591C4;
    background-color: #7591C4;
}

/*****************************************************************/
/*                    End Progress Bar                           */
/*****************************************************************/

/*****************************************************************/
/*                     Start Top Navbar Bar                      */
/*****************************************************************/

.header-wrapper {
    margin: 0px;
    background-color: #ffffff;
    position: sticky;
    top: 0px;
    z-index: 999;
}

.header-wrapper .container-md:first-child {
    padding: 0px;
}

.logo-bar {
    padding: 0px;
    border-bottom: 0.5px solid #000000;
}

h1.survey-name  {
    margin-top: 1rem;    
    padding-left: 40px;
    padding-right: 40px;    
    font-size: 90px;
    font-weight: normal;
    display: none;
    text-align: left;
    line-height: 100px;
    letter-spacing: -2.25px;
    font-family: "GT-America-Stand-Medium";
}

.navbar-logo-left {
    padding-left: 40px;
}

.language-changer {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 87px;
    border-left: 0.5px solid #000000;
}

.language-changer .form-change-lang {
    width: 100%;
}

.language-changer a.nav-link {
    font-weight: normal;
}

.language-changer .form-change-lang ul.dropdown-menu {
    width: 101%;
    border: 0.5px solid #000000;
    border-top: 0px;
    min-height: 100px; 
    height: auto;
    transform: none !important; 
    inset: -13px -1px auto auto !important;
    font-size: 1.8rem; /* größere Schrift */
    padding: 10px; /* mehr Innenabstand */
}

/*****************************************************************/
/*                      End Top Navbar Bar                       */
/*****************************************************************/

/*****************************************************************/
/* Start Group Container / Group Title / Group Description       */
/*****************************************************************/

.group-title {
    font-size: 90px;
    padding-left: 40px;
    padding-right: 40px;
    letter-spacing: -2.25px;
    line-height: 130px;
    font-family: "GT-America-Stand-Medium";
}

.group-description {
    font-size: 28px;
    text-align: left;
    padding: 18px 77px 25px 77px;
    letter-spacing: -0.59px;
}

/*****************************************************************/
/* End Group Container / Group Title / Group Description         */
/*****************************************************************/

/*****************************************************************/
/*                  Start Question Container                     */
/*****************************************************************/

.question-container.row {
    background-color: #ffffff;
    border: none;
}

.question-title-container {
    padding: 0;
}

.question-container {
    margin-top: 0;
    margin-bottom: 0;
    padding: 40px;
    border-top: 0.5px solid #000000 !important;
}

.answer-container {
    padding: 0px;
}

.radio-item input[type="radio"]:checked+label::before,
.checkbox-item input[type="checkbox"]:checked+label::before {
    border-color: #7591C4;
}

.table-hover>tbody>tr:hover,
tr.answers-list:hover,
.array-flexible-column tr.answers-list:hover {
    background-color: transparent;
}

.multiple-short-txt ul.text-list li.text-item {
    align-items: center;
}

/*****************************************************************/
/*                 End Question Container                        */
/*****************************************************************/

/*****************************************************************/
/*             Start Specified Question Container                */
/*****************************************************************/

.array-flexible-dual-scale .dropdown-item:focus, 
.array-flexible-dual-scale .dropdown-item:hover {
    background-color: transparent;
}

/* Multiple images selection */
li.imageselect-listitem .imageselect-container .imageselect-label {
    border: 18px solid #e4e4e3;
}

li.imageselect-listitem .imageselect-container input.imageselect-checkbox:checked+label {
    border: 18px solid #7591C4;
}

/* Add line button */
button.btn.btn-outline-secondary.selector--inputondemand-addlinebutton {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

button.btn.btn-outline-secondary.selector--inputondemand-addlinebutton:hover, 
button.btn.btn-outline-secondary.selector--inputondemand-addlinebutton:active {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

/* Multiplechoice bootstrap buttons selection */
Multiplechoice bootstrap buttons unchecked focus .btn-check .btn-primary:focus, 
.btn-check:focus+.btn-primary {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

.equation.question-container,
.boilerplate.question-container {
	padding-bottom: 40px;
}
 
.equation .question-title-container,
.boilerplate .question-title-container {
    margin-bottom: 0;
}

.equation .question-help-container,
.boilerplate .question-help-container {
    margin: 10px 0px;
}

/*****************************************************************/
/*            End Specified Question Container                   */
/*****************************************************************/

/*****************************************************************/
/*                      Start Specified css                      */
/*****************************************************************/

.completed-wrapper {
    padding: 15px 40px 15px 30px;
}

/*****************************************************************/
/*                     End Specified css                         */
/*****************************************************************/

/*****************************************************************/
/*                     Start All Buttons                         */
/*****************************************************************/

/* Remove the default border-radius on all buttons */
.btn,
.progress,
.dropdown-menu,
.checkbox-item label::before,
.checkbox-item label::after,
.form-control,
.form-select,
.modal-content,
.question-container,
.bootstrap-select>.dropdown-toggle,
.bootstrap-select>.dropdown-toggle.bs-placeholder {
    border-radius: 0px;
}

/* Improve button focus and hover effects */
.btn,
.progress,
.dropdown-menu,
.checkbox-item label::before,
.checkbox-item label::after,
.form-control,
.form-select,
.modal-content,
.question-container {
    outline: none;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: none;
}

input[type=checkbox]:focus,
input[type=file]:focus,
input[type=radio]:focus {
    outline: none;
}

.form-control, 
.form-select,
button.btn.dropdown-toggle.btn-outline-secondary,
button.btn.dropdown-toggle.bs-placeholder.btn-outline-secondary {
    font-size: 22px;
    border: 1.5px solid #7591C4;
}

.form-control:focus, 
.form-select:focus {
    box-shadow: none;
    border: 1.5px solid #7591C4;
}

/* box-shadow */
.btn-check:active+.btn-outline-secondary:focus, 
.btn-check:checked+.btn-outline-secondary:focus, 
.btn-outline-secondary.active:focus, 
.btn-outline-secondary.dropdown-toggle.show:focus, 
.btn-outline-secondary:active:focus {
    box-shadow: none;
}

.btn-check:focus+.btn-outline-secondary, 
.btn-outline-secondary:focus {
    box-shadow: none;
}

.btn-check:active+.btn-primary:focus, 
.btn-check:checked+.btn-primary:focus, 
.btn-primary.active:focus, 
.btn-primary:active:focus, 
.show>.btn-primary.dropdown-toggle:focus {
    box-shadow: none;
}

.btn-check:focus+.btn-primary, 
.btn-primary:focus {
    box-shadow: none;
}

/* Improve radio and checkbox button focus effects */
.radio-item input[type="radio"]:focus+label::before,
.checkbox-item input[type="checkbox"]:focus+label::before,
.radio-item input[type="radio"]:focus+label::after,
.checkbox-item input[type="checkbox"]:focus+label::after {
    outline: none;
}

.radio-item .ls-label-xs-visibility, 
.checkbox-item .ls-label-xs-visibility {
    width: 24px;
    height: 24px;
}

/* Fix (07/2026): In Matrix-Fragen (Array, Typ F) wurden die auf 24px vergroesserten
   Radios/Checkboxen abgeschnitten: Das Basis-Theme re-initialisiert
   .ls-label-xs-visibility in Tabellen mit einer kleineren Box (overflow: hidden)
   und hoeherer Selektor-Spezifitaet, wodurch die 24px-Regel oben nicht mehr greift.
   Darum hier: Label-Box mit hoher Spezifitaet auf 24px setzen und die
   Pseudo-Elemente (Kreis/Punkt) an der linken oberen Ecke verankern. */
table.ls-answers td.answer-item.radio-item label.ls-label-xs-visibility,
table.ls-answers td.answer-item.checkbox-item label.ls-label-xs-visibility {
    position: relative;
    top: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 24px;
    height: 24px;
    overflow: hidden;
    clip: auto;
    clip-path: none;
}

table.ls-answers td.answer-item.radio-item label.ls-label-xs-visibility::before,
table.ls-answers td.answer-item.checkbox-item label.ls-label-xs-visibility::before {
    left: 0;
    top: 0;
    width: 24px;
    height: 24px;
}

table.ls-answers td.answer-item.radio-item label.ls-label-xs-visibility::after,
table.ls-answers td.answer-item.checkbox-item label.ls-label-xs-visibility::after {
    left: 1px;
    top: 1px;
    width: 22px;
    height: 22px;
}

.radio-item label::before,
.checkbox-item label::before {
    width: 24px;
    height: 24px;
    border: 1px solid #7591C4;
}

.radio-item label::after,
.checkbox-item label::after {
    width: 22px;
    height: 22px;
    left: 1px;
    top: 1px;
}

.radio-item label::after,
.radio-item label:hover::before {
    background-color: #7591C4;
}

.checkbox-item input[type="checkbox"]:checked+label::after,
.checkbox-item input[type="radio"]:checked+label::after {
    font-family: "Font Awesome Thin";
    font-size: 21px;
    font-weight: 800;
}

.array-multi-flexi .radio-item .ls-label-xs-visibility,
.array-multi-flexi .checkbox-item .ls-label-xs-visibility {
    text-indent: 0px;
}

.checkbox-item label::before {
    color: #ffffff;
    width: 24px;
    height: 24px;
    border: 2px solid #7591C4;
    border-radius: 0px;
}

.checkbox-item label:hover::before {
    font-size: 21px;
    font-weight: 800;
    font-family: "Font Awesome Thin";
    content: "\f00c";
    color: #ffffff;
    background-color: #7591C4;
    line-height: 21px;
    padding-left: 0px;
}

.checkbox-item label::after {
    color: #ffffff;
    background-color: #7591C4;
    width: 24px !important;
    height: 24px;
    border-radius: 0px;
    line-height: 24px !important;
    left: 0px;
    top: 0px;
}

/* Customize Admin page survey title buttons */
.surveytitle.btn-primary {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.surveytitle.btn-primary:hover {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

/* Customize Next/Submit buttons */

.ls-move-submit-btn, 
.ls-move-next-btn, 
.ls-move-previous-btn {
    height: 120px; /* 119px */
    width: 100%;
}

.ls-move-submit-btn,
.ls-move-next-btn {
    color: #000000;
    background-color: transparent;
    border: 0.5px solid #000000;
    border-left: 0;
    border-right: 0;
}

.ls-move-next-btn:before {
    content: "\f061";
    font-family: 'Font Awesome 6 Sharp';
    font-size: 90px;
    line-height: 70px;
}

.ls-move-submit-btn:active,
.ls-move-submit-btn.active,
.ls-move-submit-btn:focus,
.ls-move-submit-btn.focus,
.ls-move-submit-btn:active:focus,
.ls-move-submit-btn.active:focus,
.ls-move-submit-btn:active.focus,
.ls-move-submit-btn.active.focus,
.ls-move-next-btn:active,
.ls-move-next-btn.active,
.ls-move-next-btn:focus,
.ls-move-next-btn.focus,
.ls-move-next-btn:active:focus,
.ls-move-next-btn.active:focus,
.ls-move-next-btn:active.focus,
.ls-move-next-btn.active.focus,
.ls-move-submit-btn:hover,
.ls-move-submit-btn:active:hover,
.ls-move-submit-btn.active:hover,
.ls-move-next-btn:hover,
.ls-move-next-btn:active:hover,
.ls-move-next-btn.active:hover {
    background-color: #7591C4;
    color: #ffffff;
    border-color: #000000;
}

/* Customize gender/yes-no buttons */
.gender-button .btn-primary,
.yes-no .btn-primary {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.btn-check:active+.btn-primary, 
.btn-check:checked+.btn-primary, 
.btn-primary.active, .btn-primary:active, 
.show>.btn-primary.dropdown-toggle {
    color: #ffffff !important;
    background-color: #7591C4 !important;
    border-color: #7591C4 !important;
}

.btn-primary.disabled, 
.btn-primary:disabled {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

.gender-button .btn-primary:hover,
.yes-no .btn-primary:hover {
    color: #fff;
    background-color: #000;
    border-color: #000;
}

.gender-button .btn-primary:hover,
.yes-no .btn-primary:hover,
.gender-button .btn-primary:active,
.gender-button .btn-check:checked+.btn-primary,
.gender-button .btn-primary.active:hover,
.gender-button .btn-primary:focus,
.gender-button .btn-primary.active,
.gender-button .btn-primary.active:focus,
.yes-no .btn-check:checked+.btn-primary,
.yes-no .btn-primary:active,
.yes-no .btn-primary:focus,
.yes-no .btn-primary.active,
.yes-no .btn-primary.active:hover,
.yes-no .btn-primary.active:focus {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

/* Customize Date Picker button */
.date-timepicker-group .btn-primary,
.date-timepicker-group .btn-primary:hover,
.date-timepicker-group .btn-primary:active,
.date-timepicker-group .btn-primary:focus,
.date-timepicker-group .btn-primary:active:hover,
.date-timepicker-group .btn-primary:active:focus,
.date-timepicker-group .btn-primary:active.focus,
.date-timepicker-group .btn-primary.hover,
.date-timepicker-group .btn-primary.active,
.date-timepicker-group .btn-primary.focus,
.date-timepicker-group .btn-primary.active:hover,
.date-timepicker-group .btn-primary.active:focus,
.date-timepicker-group .btn-primary.active.focus {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

/* Customize Previous buttons */
.ls-move-previous-btn {
    color: #000000;
    background-color: transparent;
    border: 0.5px solid #000000;
    border-left: 0;
}

#ls-button-previous:before {
    content: "\f060";
    font-family: 'Font Awesome 6 Sharp';
    font-size: 90px;
    line-height: 70px;
}

.ls-move-previous-btn:hover,
.ls-move-previous-btn:active:hover,
.ls-move-previous-btn.active:hover,
.ls-move-previous-btn:active,
.ls-move-previous-btn.active,
.ls-move-previous-btn:focus,
.ls-move-previous-btn.focus,
.ls-move-previous-btn:active:focus,
.ls-move-previous-btn.active:focus,
.ls-move-previous-btn:active.focus,
.ls-move-previous-btn.active.focus {
    background-color: #7591C4;
    color: #ffffff;
    border-color: #000000;    
}

/* Customize Upload buttons */
.upload.btn-primary {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.upload.btn-primary:hover,
.upload.btn-primary:active:hover,
.upload.btn-primary.active:hover {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

.upload.btn-primary:active,
.upload.btn-primary.active,
.upload.btn-primary:focus,
.upload.btn-primary.focus,
.upload.btn-primary:active:focus,
.upload.btn-primary.active:focus,
.upload.btn-primary:active.focus,
.upload.btn-primary.active.focus {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

.upload-div .btn {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.upload-div .btn:active,
.upload-div .btn.active,
.upload-div .btn:focus,
.upload-div .btn.focus,
.upload-div .btn:focus,
.upload-div .btn:focus,
.upload-div .btn.focus,
.upload-div .btn.focus {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

.upload-div .btn:hover,
.upload-div .btn:active:hover,
.upload-div .btn.active:hover {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

.uploader .alert-info {
    color: rgb(102 102 102);
    background-color: #000;
    border: 0px;
}

.file-upload-modal-footer .btn {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.file-upload-modal-footer .btn:active,
.file-upload-modal-footer .btn.active,
.file-upload-modal-footer .btn:focus,
.file-upload-modal-footer .btn.focus,
.file-upload-modal-footer .btn:active:focus,
.file-upload-modal-footer .btn.active:focus,
.file-upload-modal-footer .btn:active.focus,
.file-upload-modal-footer .btn.active.focus {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

.file-upload-modal-footer .btn:hover,
.file-upload-modal-footer .btn:active:hover,
.file-upload-modal-footer .btn.active:hover {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

/* Improve hover effect on uploaded files buttons */
.upload-files .uploadedfiles td a.btn-primary {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.upload-files .uploadedfiles td a.btn-primary:hover,
.upload-files .uploadedfiles td a.btn-primary:active,
.upload-files .uploadedfiles td a.btn-primary:focus {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

/* Customize the delete button for uploaded files */
.upload-files ul.files-list fieldset div:nth-child(3) a.btn-danger {
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a;
}

.upload-files ul.files-list fieldset div:nth-child(3) a.btn-danger:hover {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925;
}

.save-survey-input .btn,
.modal-dialog .btn {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.save-survey-input .btn:hover,
.save-survey-input .btn:active:hover,
.save-survey-input .btn.active:hover,
.modal-dialog .btn:hover,
.modal-dialog .btn:active:hover,
.modal-dialog .btn.active:hover {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

.btn-info {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.btn-info:hover {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

/* Customize bootstrap buttons */
.bootstrap-buttons-div .btn-primary {
    color: #000000;
    background-color: #ffffff;
    border-color: #000000;
}

.bootstrap-buttons-div .btn-primary:hover {
    color: #ffffff;
    background-color: #7591C4;
    border-color: #7591C4;
}

button.btn.dropdown-toggle.btn-outline-secondary, 
button.btn.dropdown-toggle.bs-placeholder.btn-outline-secondary {
    color: #212524;
    background: transparent;
}

.bootstrap-select>.dropdown-toggle.bs-placeholder,
.bootstrap-select>.dropdown-toggle.bs-placeholder:active,
.bootstrap-select>.dropdown-toggle.bs-placeholder:focus,
.bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
    color: #000000;
    background-color: transparent;
    border-color: #cccccc;
}

.bootstrap-select>.dropdown-toggle {
    width: 250px;
    border: 1px solid #cccccc;
}

.dropdown.bootstrap-select .dropdown-menu.show {
    width: 250px;
}

.btn-check:active+.btn-outline-secondary,
.btn-check:checked+.btn-outline-secondary,
.btn-outline-secondary.active,
.btn-outline-secondary.dropdown-toggle.show,
.btn-outline-secondary:active {
    color: #6c757d;
}

.bootstrap-select .btn-check:active+.btn-outline-secondary,
.bootstrap-select .btn-check:checked+.btn-outline-secondary,
.bootstrap-select .btn-outline-secondary.active,
.bootstrap-select .btn-outline-secondary.dropdown-toggle.show,
.bootstrap-select .btn-outline-secondary:active {
    background-color: transparent;
}

.bootstrap-select .dropdown-toggle:focus,
.bootstrap-select>select.mobile-device:focus+.dropdown-toggle {
    outline: none !important;
}

/*****************************************************************/
/*                        End All Buttons                        */
/*****************************************************************/

/*****************************************************************/
/*                       Start Sortables                         */
/*****************************************************************/
/*unsorted*/
.sortable-choice .ls-choice.sortable-item {
	color: #000000;
    background-color: #ffffff;
    border: 2px solid #7591C4;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/*sorted*/
.sortable-rank .ls-choice.sortable-item {
    color: #ffffff;
    background-color: #7591C4;
    border: 2px solid #7591C4;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/*****************************************************************/
/*                      End Sortables                            */
/*****************************************************************/

/*****************************************************************/
/*                       Start Slider                            */
/*****************************************************************/

.tooltip-inner {
	background-color: #7591C4;
}

.slider-list .slider.slider-untouched .slider-handle {
    background-color: #7591C4;
}

.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow:before,
.bs-tooltip-top .tooltip-arrow:before {
    border-top-color: #7591C4;
}

.slider-touched .tooltip-inner,
.slider-touched .slider-handle {
    background-color: #7591C4;
}

.slider-touched .tooltip.top .tooltip-arrow {
    border-top-color: #7591C4;
}

.slider-handle {
    background-color: #7591C4;
    background-image: linear-gradient(to bottom, #7591C4 0%, #7591C4 100%);
}

.slider-selection {
    background-image: linear-gradient(to bottom, #7591C4 0%, #7591C4 100%);
}

/*****************************************************************/
/*                       End Slider                              */
/*****************************************************************/

/*****************************************************************/
/*                       Start Footer                            */
/*****************************************************************/

#navigator-container {
    margin-right: 0px;
    margin-left: 0px;
}

#navigator-container .left-btn {
    height: 121px;
    padding-left: 0px;
    padding-right: 0px;
}

#navigator-container .right-btn {
    height: 121px;
    padding-left: 0px;
    padding-right: 0px;
}

 /* Removed the classess background color in the question index */
li.navbar-item-middle ul li.index-item-current {
    background-color: transparent;
}

/* Removed the classess background color in the question index */
li.navbar-item-middle ul li a.bg-warning,
li.navbar-item-middle ul li a.bg-danger {
    background-color: transparent !important;
}

li.navbar-item-middle ul li a.bg-warning:hover,
li.navbar-item-middle ul li a.bg-danger:hover {
    background-color: #95232C !important;
}

.navbar-item-middle li.list-group-itemindex-item a:hover {
    color: #ffffff;
}

footer .copyright {
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

footer .footer-text {
    font-size: 16px;
    margin-bottom: 0px;
}

/*****************************************************************/
/*                       End Footer                              */
/*****************************************************************/

/*****************************************************************/
/*                       Start Responsive                        */
/*****************************************************************/

img.logo-left {
    max-width: 80%;
}

@media only screen and (min-width: 524px) {
    img.logo-left {
        max-width: 50%;
    }
}

@media only screen and (min-width: 768px) {
    img.logo-left {
        max-width: 33%;
    }
}

@media only screen and (min-width: 987px) {
    img.logo-left {
        max-width: 25%;
    }
}

@media only screen and (max-width: 768px) {
    #navbar li.navbar-item-right {
        text-align: center;
    }
    
    .radio-item label::before,
    .checkbox-item label::before {
        top: 3px;
    }
    
    .radio-item label::after {
        top: 4px;
    }
    
    .checkbox-item label::after {
        top: 3px;
    }
}

@media only screen and (max-width: 1200px) {
    .container-md {
        max-width: 100%;
    }
}

@media only screen and (min-width: 1026px) {
    .array-flexible-row .answers-list.radio-list.ls-even, 
	.array-yes-uncertain-no .answers-list.radio-list.ls-even, 
	.array-increase-same-decrease .answers-list.radio-list.ls-even, 
	.array-5-pt .answers-list.radio-list.ls-even, 
	.array-10-pt .answers-list.radio-list.ls-even,
    .array-flexible-row .answers-list.radio-list.ls-odd, 
	.array-yes-uncertain-no .answers-list.radio-list.ls-odd, 
	.array-increase-same-decrease .answers-list.radio-list.ls-odd, 
	.array-5-pt .answers-list.radio-list.ls-odd, 
	.array-10-pt .answers-list.radio-list.ls-odd {
        border-top: 0.5px solid #000000;
    }   
    
    .array-flexible-row tr:last-child, 
    .array-yes-uncertain-no tr:last-child, 
    .array-increase-same-decrease tr:last-child, 
    .array-5-pt tr:last-child, 
    .array-10-pt tr:last-child {
        border-bottom: 0.5px solid #000000;
    } 
    
    .array-flexible-column .array-radio col.answers-list {
        border-left: 0.5px solid #000000;
        border-right: 0.5px solid #000000;
    }
}

@media only screen and (max-width: 987px) {
    h1.survey-name {
        font-size: 70px;
    }
}

@media only screen and (max-width: 524px) {
    .language-changer a.nav-link, 
    .language-changer a:link.nav-link {
        font-size: 23px;
    }
  
    div#welcome-container {
        font-size: 23px;
        line-height: 30px;
    }
  
    .privacy-heading, 
    p.ls-privacy-body {
        font-size: 15px;
        color: #666; /* grau */
    }
    
    .group-title {
        font-size: 40px;
        line-height: 45px;
        padding-left: 20px;  
        padding-right: 20px;
    }
    
    .question-text {
        font-size: 23px;
    }
    
    table.ls-answers > tbody > tr th.answertext, 
    table.ls-answers > tbody > tr th.answertextright {
        font-size: 20px;
        font-weight: bold;
    }
    
    body{
        font-size: 20px;
    }
    
    .ls-question-help, 
	.ls-questionhelp {
        font-size: 16px;
    }
    
    ul#langs-container {
        font-size: 16px;
    }
    
    div#welcome-container {
        padding: 15px 20px;
    }
    
    h1.survey-name {
        padding-left: 20px;
        padding-right: 20px;      
        font-size: 40px;
        line-height: 45px;
    }
    
    .navbar-logo-left {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .privacy {
        padding: 35px 20px;
    }
    
    .group-description {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .question-container {
        padding: 20px;
    }
    
    .alert-warning {
        padding-left: 20px;
        padding-right: 20px;
    }
    
}

/*****************************************************************/
/*                       End Responsive                          */
/*****************************************************************/


/*****************************************************************/
/*        Frage-Hinweis- & Warn-Icons (Info vs. Warnung)         */
/*****************************************************************/
/*
   ls6: .ls-questionhelp:before zeichnet fest ein Fragezeichen (\f059)
   auf den Hinweis-/Validierungscontainer. Info-Hinweis und Warnung
   erzeugen so je ein Fragezeichen; wird die Warnung wieder ausge-
   blendet, bleibt ihr Icon als Geist stehen und ueberschneidet sich
   mit dem Info-Icon.
   Fix: Icon zustandsabhaengig setzen (Warnung = Ausrufezeichen),
   und bei leerem/ausgeblendetem Container gar kein Icon zeichnen.
*/

/* Echte ls6-Struktur (per Inspector verifiziert):

   Info-Hilfetext:
     .question-help-container.text-info
       > .ls-questionhelp            (Icon ::before, nur Text darin)

   Validierung/Warnung:
     .question-valid-container.text-info
       > .ls-questionhelp.text-info.tip-was-hidden   (Icon ::before)
           > .ls-em-tip.ls-em-error.text-danger      (die Meldung)

   Wichtig: der Fehlerzustand (ls-em-error / text-danger) liegt auf
   einem KIND von .ls-questionhelp -> per :has() nach unten pruefen.
   Die Geist-Regeln nur im .question-valid-container anwenden, damit
   das Fragezeichen des Info-Hilfetexts nie faelschlich verschwindet. */

/* Anpassung (07/2026): Das Standard-Fragezeichen wird jetzt IMMER
   entfernt und der Hilfetext buendig am Fragetitel ausgerichtet
   (der 1.2em-Einzug aus theme.css entfaellt). Nur Warnungen/Fehler
   zeigen weiterhin ein Icon - neu inline vor dem Text, damit die
   Ausrichtung erhalten bleibt. */
.dir-ltr .ls-questionhelp {
    margin-left: 0;
}

.dir-rtl .ls-questionhelp {
    margin-right: 0;
}

.ls-questionhelp:before {
    content: none;
}

/* Warnung/Fehler -> Ausrufezeichen statt Fragezeichen. */
.ls-questionhelp:has(.ls-em-error):before,
.ls-questionhelp:has(.text-danger):before,
.ls-questionhelp:has(.error):before {
    content: "\f06a" !important; /* exclamation-circle */
    display: inline-block !important;
    position: static !important;
    height: auto !important;
    margin-right: 0.35em;
}

/* Geist entfernen - nur im Validierungscontainer.
   Nach dem Korrigieren tauscht ls6 die Meldung nicht aus, sondern
   wechselt nur die Klasse ls-em-error -> ls-em-success (die
   Erfolgsmeldung "Format ist korrekt" bleibt stehen). Dieser
   Erfolgs-Zustand soll KEIN Icon zeigen - sonst erscheint dort wieder
   das Standard-Fragezeichen und ueberlappt den Info-Hinweis.
   Ebenso, wenn gar keine sichtbare Meldung (mehr) vorhanden ist. */
.question-valid-container .ls-questionhelp:has(.ls-em-success):not(:has(.ls-em-error)):before,
.question-valid-container .ls-questionhelp:has(.good):not(:has(.error)):before,
.question-valid-container .ls-questionhelp:not(:has(.ls-em-tip)):before,
.question-valid-container .ls-questionhelp:not(:has(.ls-em-tip:not(:empty))):before,
.question-valid-container .ls-questionhelp:not(:has(.ls-em-tip:not([style*="display: none"]):not([style*="display:none"]):not(.ls-em-hidden))):before {
    content: "" !important;
    display: none !important;
}