/******************
    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: 14px;
    line-height: 1.42857143;
    margin: 0 !important;
    padding: 0 !important;
}

body .top-container {
    margin: 0;
}

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

.text-danger {
    color: #a94442 !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;
}

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

.survey-welcome {
    margin-top: 15px;
}

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

/* Privacy */

.privacy {
    margin-top: 15px;
    padding: 15px 0;
    margin: 15px 1px;
}

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

.privacy-heading.h4.text-primary {
    font-size: 14px;
    color: #333 !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;
}

.privacy-block div.align-items-center div:first-child {
    margin-top: 15px;
    display: flex;
    column-gap: 5px;
}

input#datasecurity_accepted {
    width: 17px;
    height: 17px;
    margin-top: 2px;
    flex-shrink: 0;
}

/* #################### 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;
}

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

.top-container {
    margin: 0;
}

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

/* Default Progress Bar */
.default-progressbar-container .progress-bar {
    background-color: #292E36;
}

/* Bubble Style Progress Bar */
.bubble-progressbar-container .progress-bar {
    background-color: #292E36;
}

@font-face {
    font-family: "Font Awesome 6 Pro";
    src: url("./icon/fa-light-300.woff2") format("woff2");
}

.bubble-progressbar-container .custom-progressbar-container {
    padding: 1em 0;  
}

.bubble-progressbar-container #custom-progressbar {
    width: 100%;
    margin: 10px 0px;
    padding: 0px;   
    display: inline-flex;
    justify-content: center;
    column-gap: 15px;
    flex-wrap: wrap;
} 

.bubble-progressbar-container #custom-progressbar .index-item-current .dot {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 15px;
    height: 15px;
    background-color: #292E36;
    border-radius: 50%;
}

.bubble-progressbar-container #custom-progressbar li {
    width: 10%;    
    font-size: 10px;    
    position: relative;    
    float: left;
    list-style-type: none;    
    font-weight: 400;
}

.bubble-progressbar-container #custom-progressbar .step0:before {
    font-family: FontAwesome;
    content: "\f10c";
    color: #fff;
}

.bubble-progressbar-container #custom-progressbar li:before {
    width: 40px;
    height: 40px;
    line-height: 43px;
    display: block;
    font-size: 20px;
    background: #292E36;
    border-radius: 50%;
    margin: auto;
    padding: 0px;
}

/*ProgressBar connectors*/
.bubble-progressbar-container #custom-progressbar li:after {
    content: '';
    width: 100%;
    height: 6px;
    background-color: #292E36;
    position: absolute;
    left: 100;
    top: 18px;
    z-index: -1;
}

.bubble-progressbar-container #custom-progressbar li.index-item-current:after,
.bubble-progressbar-container #custom-progressbar li.index-item-active:after  {
    background-color: #292E36 !important;
}

.bubble-progressbar-container #custom-progressbar li.index-item-active:before {
	background-color: #ffffff !important;
	border: 2px solid #292E36 !important;
}

.bubble-progressbar-container #custom-progressbar li.index-item-current.active:before {
    background-color:  #ffffff;
    border: 2px solid #292E36;
}

.bubble-progressbar-container #custom-progressbar li:last-child:after {
    height: 0;
}

/*Color number of the step and the connector before it*/
.bubble-progressbar-container #custom-progressbar li.active:before, 
.bubble-progressbar-container #progressbar li.active:after {
    background-color: #292E36;
}

.bubble-progressbar-container #custom-progressbar li.active:before {
    content: "\f00c";
    font-family: "Font Awesome 6 Pro";
}

.bubble-progressbar-container .icon {
    width: 60px;
    height: 60px;
    margin-right: 15px;
}

.bubble-progressbar-container .icon-content { 
    padding-bottom: 20px;
}

@media screen and (max-width: 992px) {
    .bubble-progressbar-container .icon-content {
        width: 50%;
    }
}

/* Group Titles Progress Bar */
.group-progressbar-container {
    display: block;
}

.group-progressbar-container .progress-bar {
    padding: 4px;
    color: #ffffff;
    background-color: #292E36;
    border-bottom-right-radius: 12px;
    border-top-right-radius: 12px;
    font-weight: bold;
    text-align: right;
}

.group-progressbar-container div.progress {
    position: relative;
    overflow: revert;
}

.group-progressbar-container div.progress div.progress-bar {
    position: absolute;
    line-height: 13px;
    padding-right: 12px;
    min-width: 3em !important;
}

.group-progressbar-container div.progress div.progress-bar::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 10px;
    height: 100%;
    border: 10px solid #292E36;
    border-left: none;
    border-radius: 0 50% 50% 0;
    z-index: 99;
}

.group-progressbar-container div.progress div.progress-step {
    flex: 1;
    border-right: 4px solid #fff;
    z-index: 9;
    position: relative;
}

.group-progressbar-container div.progress div.progress-step:last-child {
    border-right:none;
}

.group-progressbar-container div.progress div.progress-step span {
    width: 100%;   
    font-weight: bold;        
    padding-left: 6px;        
    position: absolute;
    top: 24px;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
}

@media only screen and (max-width: 768px) {
    
    .group-progressbar-container div.progress div.progress-step span {
        top: 47px;
        zoom: 0.5;
    }
    
}

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

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

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

.group-title {
    font-size: 1.4rem;
    margin: 0;
    margin-bottom: 15px;
    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: 15px;
}

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

.question-text {
    font-size: 120%;
}

.question-help-container {
    font-size: 12.6px;
    margin-top: 10px;
    color: #888 !important;
}

.question-valid-container {
    color: #333 !important;
    padding-left: 0;
    padding-right: 0;
    font-size: 12.6px;
    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: 3px;
}

.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;
    background-color: transparent;
}

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

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

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 {
    background-color: #ccc;
}

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

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

li.form-change-lang .dropdown-menu.dropdown-menu-end.show {
    inset: 0px 43% auto auto !important;
}

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

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

#navbar {
    padding: 0 !important;
}

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

ul.navbar-right {
    padding: 0;
}

.navbar-item-left a,
.navbar-item-middle a,
a:link {
    color: #888;
}

#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: #333;
    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: #f0f0f0;
}

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) !important;
    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: #ddd;
    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;

}

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

/*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 !important;
    border-color: #5cb85c !important;
    background-color: #4cae4c !important;
}

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

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

@media only screen and (max-width: 768px) {
    .radio-item label::before,
    .checkbox-item label::before {
        top: 3px;
    }
    
    .radio-item label::after {
        top: 6px;
    }
    
    .checkbox-item label::after {
        top: 3px;
    }
}

/* Logos appear well on mobile devices. */
@media only screen and (max-width: 768px) {
    .logo-bar {
        justify-content: center;        
        flex-direction: column;
        row-gap: 15px;
    }
}

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

/****Fixed css for misaligned array buttons****/
.row.array-flexible-column .radio-item label::before {
    top: 1px;
}

.row.array-flexible-column .radio-item label::after {
    top: 4px;
}