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

/*****************************************************************/
/***************************shop_tfr*****************************/
/*****************************************************************/

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

body {
    font-family: "Open Sans";
    font-size: 14px;
    line-height: 2.2rem;
    color: #4d4d4d;
    background-color: #eeeeee;
    margin: 0 !important;
    padding: 0 !important;
}

/* remove the all outline in the survey */
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: none;
}

.radio-item input[type="radio"]:focus+label::before {
    outline: none;
}

.checkbox-item input[type="checkbox"]:focus+label::before,
.checkbox-item input[type="radio"]:focus+label::before {
    outline: none;
}

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

.fa-asterisk:before {
    color: #a94442;
}

.table-bordered>thead>tr>td {
    border: none;
}

.table-bordered>thead>tr>th {
    border: none;
}

tbody,
td,
tfoot,
th,
thead,
tr {
    border: none;
}

img {
    width: 100%;
}

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

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

.brand-logo .top-container .top-content {
    padding-top: 1em;
}

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

#survey-nav div.container-fluid:nth-child(1) {
    display: block;
}

#survey-nav div.container-fluid:nth-child(1) button.navbar-toggler { 
    position: relative;
    float: right;
    margin-top: -2.8rem;
    border-radius: 4px;
    font-size: 14px;
}

#navbar ul li.index-menu-full ul li.list-group-itemindex-item {
    text-align: center;
}

li.nav-item a.nav-link {
    color: #4d4d4d;
    width: fit-content;
    border: 1px solid #959595;
    background-color: #d5d5d5;
    margin: auto;
    border-radius: 4px;
    background-image: -webkit-linear-gradient(#eeeeee, #d5d5d5);

}

li.nav-item.ls-no-js-hidden {
    list-style: none;
    text-align: center;
}

#navbar .dropdown-toggle:after {
	display: none;
}

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

.othertext-label-checkox-container {
    padding: 0px;
    margin-bottom: 10px;
}

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

.dropdown-item:focus, 
.dropdown-item:hover {
    background-color: #f5f5f5 !important;
}

.boilerplate {
    padding-bottom: 0px !important;
}

.dir-ltr .ls-questionhelp {
    margin-left: 1.8em;
}

.ls-question-help, 
.ls-questionhelp {
    margin-top: 5px;
    margin-bottom: 5px !important;
}

.boilerplate .answer-container {
	padding: 0px;
}

.question-help-container {
    margin-top: 10px;
    line-height: 17px;
}

.form-select:focus,
.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: 768px) {
    .ls-answers .text-end, 
    .ls-answers .text-start {
        text-align: center !important;
    }
}

@media only screen and (max-width: 1024px) {
    table.ls-answers > tbody > tr td.answer-item.radio-item, 
    table.ls-answers > tbody > tr th.answertext.control-label, 
    table.ls-answers > tbody > tr td.answer-item.checkbox-item {
        border-bottom: 1px solid #ddd;
        padding: 0px;
    }
}

@media only screen and (max-width: 1024px) {
    .dir-ltr table.ls-answers .radio-item .ls-label-xs-visibility, 
    .dir-ltr table.ls-answers .checkbox-item .ls-label-xs-visibility {
        margin: 0;
        padding: 15px 15px 15px 40px;
    }
}

/*@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {*/
/*    .dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::before, */
/*    .dir-ltr table.ls-answers .checkbox-item label.ls-label-xs-visibility::before {*/
/*        margin-left: -8px;*/
/*        top: 2px;*/
/*    }*/
/*}*/

 /*For small phones only */
@media only screen and (max-width: 768px) {
    .dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::before,
    .dir-ltr table.ls-answers .checkbox-item label.ls-label-xs-visibility::before {
        margin-left: 16px;
        top: 15px;
    }
}

/* For tablets in portrait only */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
    .dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::before,
    .dir-ltr table.ls-answers .checkbox-item label.ls-label-xs-visibility::before {
        margin-left: -6px;
        top: 2px;
    }
}

/* Optional: For tablets in landscape — override or reset */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
    .dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::before,
    .dir-ltr table.ls-answers .checkbox-item label.ls-label-xs-visibility::before {
        margin-left: -20px;  /* or better-aligned value */
        top: 0px;
    }
}

@media only screen and (max-width: 768px) {
    td.radio-item input[type='radio']:checked + label, 
    td.checkbox-item input[type='checkbox']:checked + label {
        color: white;
        background-color: #496b38;
        background-image: -webkit-linear-gradient(#638f4d, #496b38);
        opacity: 0.85;
    }
}

@media only screen and (max-width: 768px) {
    input[type='radio']:checked + label:before, 
    input[type='radio']:checked + .label:before, 
    input[type='radio']:checked:focus + label:before, 
    input[type='radio']:checked:focus + .label:before, 
    input[type='checkbox']:checked + label:before, 
    input[type='checkbox']:checked + .label:before, 
    input[type='checkbox']:checked:focus + label:before, 
    input[type='checkbox']:checked:focus + .label:before {
        color: white !important;
    }
}

@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    .table-hover>tbody>tr:hover>*{
        --bs-table-accent-bg: transparent !important;
    }
    
    .table-hover>tbody>tr:hover, tr.answers-list:hover, 
    .array-flexible-column tr.answers-list:hover {
        background-color: transparent !important;
    }
}

@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;
    }
}

@media screen and (max-width: 768px) {
    div.gender-button, div.yesno-button {
        width: 100%;
    }
}

.dynamic-total, 
.dynamic-remaining {
    background: #ddd;
    font-weight: 700;
    border-radius: 4px;
}

.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;
    }
}

input[type='radio']:checked + label.radio-label, 
input[type='radio']:checked + label.label-radio, 
input[type='radio']:checked + label.label-radio:before, 
input[type='checkbox']:checked + label.checkbox-label, 
input[type='checkbox']:checked + label.answertext, 
input[type='checkbox']:checked + label.answertext:before {
    color: #ffffff;
    background-color: #496b38;
    background-image: -webkit-linear-gradient(#638f4d, #496b38);
}

.radio-list li label, 
.radio-list li .label, 
.checkbox-list li label, 
.checkbox-list li .label, 
.checkbox-text-list li label, 
.checkbox-text-list li .label {
    position: relative;
    display: block;
    padding: 15px 15px;    
    padding-left: 3rem;
    margin: 0;
}

input[type='radio']:checked + .radio-label:before, 
input[type='radio']:checked:focus + .radio-label:before, 
input[type='checkbox']:checked + .checkbox-label:before, 
input[type='checkbox']:checked:focus + .checkbox-label:before {
    color: #fff;
}

.checkbox-list ul.list-unstyled li.checkbox-item div:nth-child(1) {
    display: block;
}

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

.ls-group-remaining span.dynamic-remaining,
.ls-group-total span.dynamic-total {
    padding: 8px 15px;
}

ul.checkbox-text-list li.checkbox-text-item .form-check {
    padding-left: 15px;
}

ul.checkbox-text-list li.checkbox-text-item .checkbox-item {
    padding-left: 0px;
}

.multiple-opt.question-container .checkbox-list.multiple-list ul:nth-child(1)  {
    margin-bottom: 0px !important;
}

.multiple-opt.question-container .checkbox-list.multiple-list ul:nth-child(1) li:last-child {
    margin-bottom: 0px !important;
}

.multiple-opt.question-container .checkbox-list.multiple-list ul:nth-child(2)  {
    margin-bottom: 0px !important;
}

.multiple-opt.question-container .checkbox-list.multiple-list ul:nth-child(2) li:last-child {
    margin-bottom: 0px !important;
}

.multiple-opt.question-container .checkbox-list.multiple-list ul:nth-child(3)  {
    margin-bottom: 0px !important;
}

.multiple-opt.question-container .checkbox-list.multiple-list ul:nth-child(3) li:last-child {
    margin-bottom: 0px !important;
}

/* ############ welcome page css ############# */

/* privacy */

.privacy {
    margin: 15px 1px;
}

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

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

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

.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: 6px;       
    visibility: visible;
    opacity: 1;
    flex-shrink: 0;
}

.multiple-opt.question-container li.checkbox-text-item div.row:nth-child(1) {
	flex-direction: column;
}

/* ############ header css ############# */

.top-survey-nav {
    position: fixed;
    z-index: 100;
    top: 0;
    width: 100%;
    border-radius: 0;
    border-bottom: 1px solid rgba(102, 102, 102, 0.35) !important;
    background-color: rgba(255, 255, 255, 0.85) !important;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}

#survey-nav .container-fluid div.top-container {
    margin: 0px;
    width: 94%;
}

.othertext-label-checkox-container {
    margin-right: 0px;
}

.list-with-comment.question-container .ls-answers{
	flex-direction: column;
	width: 100%; 
}

.list-with-comment.question-container .answers-list.radio-list,
.list-with-comment.question-container .answer-item.text-item  {
	width: 100%; 
}

.list-radio .form-inline .radio-item:last-child, 
.list-radio .form-inline .checkbox-item:last-child, 
.list-radio li.radio-item:last-child, 
.list-radio li.checkbox-item:last-child {
	border-bottom: none;
}

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

div#survey-nav {
    min-height: 85px;
}

.top-container {
    margin: 0;
}

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

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

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

@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: #702000;
    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: #702000;
    border-radius: 50%;
    margin: auto;
    padding: 0px;
}

/*ProgressBar connectors*/
.bubble-progressbar-container #custom-progressbar li:after {
    content: '';
    width: 100%;
    height: 6px;
    background-color: #702000;
    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: #702000 !important;
}

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

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

.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: #702000;
}

.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: #702000;
    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 #702000;
    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                                */
/*****************************************************************/

/* navbar right css */

a.question-index-btn {
    color: #702000 !important;
    background-color: transparent !important;
    border: none !important;
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    background-image: none !important;
}

div#indexbody {
    width: 100%;
}

.navbar-right ul.show li.list-group-itemindex-item a {
    display: block;
    padding: 7.5px 15px;
    height: auto;
    width: 100%;
    margin: 8px 2px;
    white-space: normal;
    font-size: 14px;
    line-height: 22px;
    color: #ffffff;
    border: 1px solid #496b38;
    border-radius: 4px;
    background-color: #496b38;
    background-image: -webkit-linear-gradient(#638f4d, #496b38);
    cursor: pointer;
}

.navbar-right ul.dropdown-menu.show li.index-item-unanswered a,
.navbar-right ul.dropdown-menu.show li.index-item-current a {
    color: #4d4d4d;
    border: 1px solid #959595;
    background-color: #d5d5d5;
    background-image: -webkit-linear-gradient(#eeeeee, #d5d5d5);
}

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

ul.navbar-right li.index-menu-full {
    width: 100%;
}

ul.navbar-right li.index-menu-full .dropdown-menu {
    background-color: transparent;
    border: none;
}

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

    .navbar-expand-md .navbar-nav-scroll {
        overflow: hidden;
    }    
}

@media only screen and (max-width: 3200px) {

    .navbar-expand-md .navbar-toggler,
    .navbar-expand-md .offcanvas-header {
        display: block;
    }

    .collapse:not(.show) {
        display: none !important;
    }
}



/* ############ content css ############# */

#outerframeContainer {
    margin-top: 80px;
    margin-bottom: 15px;
    float: none;
    clear: both;
    background-color: transparent;
}

div#welcome-container {
    margin: 0;
    padding: 3rem;
    margin-bottom: 3rem;
    border-radius: 4px;
    border: 1px solid rgba(102, 102, 102, 0.35);
    background-color: rgba(255, 255, 255, 0.5);
}

@media only screen and (max-width: 768px) {
    div#welcome-container {
        padding: 20px;
    }
}

.survey-description,
.survey-welcome {
    color: #4d4d4d !important;
    text-align: left !important;
    font-size: 14px;
    line-height: 22px;
}

.group-title {
    color: #702000;
    margin: 0;
    margin-bottom: 10px;
    text-align: left;
}

.group-description {
    margin-top: 0;
    min-height: 20px;
    padding: 0;
    background-color: transparent;
    border: none;
    box-shadow: none;
    --bs-gutter-x: 0px;
}

/* survey name css */

h1.survey-name {
    color: #702000;
    font-size: 1.8rem;
    font-style: normal;
    font-weight: normal;
    line-height: 3.3rem;
}

/* language changer css */

div.form-change-lang a.nav-link.dropdown-toggle {
    color: #888;
    text-decoration: none;
    display: inline-block;
    background-color: #fff;
    padding: 10px;
    border: 1px solid rgba(102, 102, 102, 0.35);
    border-radius: 4px;
}

/* question-container css */

.question-container {
    margin-bottom: 30px;
    margin-top: 15px;
    padding-bottom: 15px;
    border: 1px solid rgba(102, 102, 102, 0.35) !important;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 4px;
}

.question-title-container {
    padding: 1rem 1.5rem;
    color: #4d4d4d;
    background-color: #e2e2e2;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    color: #702000;
}

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

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

.question-help-container,
.question-valid-container {
    color: #888 !important;
    font-size: 12px;
}

.ls-question-help,
.ls-questionhelp {
    margin-bottom: 0px;
}

.ls-questionhelp:before {
    content: "\f129";
    font-size: 140%;
    line-height: 110%;
    color: #638f4d;
    top: 6px;
}

.answer-container {
    padding: 15px;
}

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

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

.answer-container tr,
.array-flexible-column tr.answers-list {
    border-bottom: 1px solid rgba(102, 102, 102, 0.35);
}

.table>thead>tr>th,
.table>tbody>tr>th,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td {
    border: 0;
    padding: 15px 8px;
}

ul#sortable-choice-795,
ul#sortable-rank-795 {
    padding: 10px;
    margin-bottom: 20px;
}

.sortable-choice .ls-choice.sortable-item,
.sortable-rank .ls-choice.sortable-item {
    padding: 10px 15px;
    margin-bottom: 5px;
}

/* Particular question css */

.btn-group>.btn-group:not(:last-child)>.btn,
.btn-group>.btn:not(:last-child):not(.dropdown-toggle),
.btn-group>.btn-group:not(:first-child)>.btn,
.btn-group>.btn:nth-child(n+3),
.btn-group>:not(.btn-check)+.btn {
    border-radius: 6px;
}

.gender.question-container input[type='radio']:checked+label:before,
.gender.question-container input[type='radio']:checked+.label:before,
.gender.question-container input[type='radio']:checked:focus+label:before,
.gender.question-container input[type='radio']:checked:focus+.label:before,
.yes-no.question-container input[type='radio']:checked+label:before,
.yes-no.question-container input[type='radio']:checked+.label:before,
.yes-no.question-container input[type='radio']:checked:focus+label:before,
.yes-no.question-container input[type='radio']:checked:focus+.label:before {
    content: "";
}

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

.gender-button .btn-primary,
.yes-no .btn-primary,
.bootstrap-buttons-div .button-item {
    color: #4d4d4d;
    background-color: #ddd;
    background-image: none;
    border: 3px solid #f6f6f6;
    border-radius: 6px;
    padding: 18px 6px;
}

.choice-5-pt-radio .list-group-horizontal {
    flex-direction: column;
}

.list-radio li.radio-text-item {
	display: block !important;
}

.multiple-opt.question-container .othertext-label-checkox-container {
    padding: 0;
}

/* radio-item css */

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

.radio-item label::before {
    border: none;
    background-color: transparent;
    transition: color 0s ease-in;
    font-family: 'FontAwesome';
    visibility: visible;
    content: "\f1db";
    font-size: 160%;
    color: #bbb;
}

input[type='radio']:checked+label:before,
input[type='radio']:checked+.label:before,
input[type='radio']:checked:focus+label:before,
input[type='radio']:checked:focus+.label:before {
    font-family: 'FontAwesome';
    visibility: visible;
    transition: color 0.5s ease-in;
    content: "\f00c";
    font-size: 160%;
    color: #638f4d;
}

.radio-item label::after,
.checkbox-item label::after,
input[type='radio'],
input[type='checkbox'],
.radio-item input[type="radio"],
.radio-item input[type="checkbox"] {
    opacity: 0;
    visibility: hidden;
}

.dir-ltr .radio-item label.ls-label-xs-visibility::before,
.dir-ltr .checkbox-item label.ls-label-xs-visibility::before,
.dir-ltr .radio-item .ls-label-xs-visibility,
.dir-ltr .checkbox-item .ls-label-xs-visibility {
    margin-left: -21px;
}

/* checkbox-item css */

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

.checkbox-item label::before {
    border: none;
    background-color: transparent;
    transition: color 0s ease-in;
    font-family: 'FontAwesome';
    visibility: visible;
    content: "\f096";
    font-size: 160%;
    color: #bbb;
}

input[type='checkbox']:checked+label:before,
input[type='checkbox']:checked+.label:before,
input[type='checkbox']:checked:focus+label:before,
input[type='checkbox']:checked:focus+.label:before {
    font-family: 'FontAwesome';
    visibility: visible;
    transition: color 0.5s ease-in;
    content: "\f046";
    font-size: 160%;
    color: #638f4d;
}

.radio-item label::after,
.checkbox-item label::after,
input[type='radio'],
input[type='checkbox'],
.radio-item input[type="radio"],
.radio-item input[type="checkbox"] {
    opacity: 0;
    visibility: hidden;
}

.dir-ltr .radio-item label.ls-label-xs-visibility::before,
.dir-ltr .checkbox-item label.ls-label-xs-visibility::before,
.dir-ltr .radio-item .ls-label-xs-visibility,
.dir-ltr .checkbox-item .ls-label-xs-visibility {
    margin-left: -19px;
}

/* both radio & checkbox item css */

li.radio-item:first-child,
li.checkbox-item:first-child {
    border-top: 1px solid rgba(102, 102, 102, 0.35);
}

.form-inline .radio-item,
.form-inline .checkbox-item,
li.radio-item,
li.checkbox-item {
    display: block;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid rgba(102, 102, 102, 0.35);
}

input[type='radio'] + .radio-label:before, 
input[type='radio'] + .label-radio:before, 
input[type='radio'] + .answertext:before, 
input[type='checkbox'] + .checkbox-label:before, 
input[type='checkbox'] + .label-checkbox:before, 
input[type='checkbox'] + .answertext:before, 
.other-item label:before, .other-item .label:before,
label.answer-comment-wrapper:before, 
.answer-comment-wrapper.label:before {
    position: absolute;
    left: 32px;
    top: 15px;
}

/* ############ footer css ############# */
div#group-0,
.group-container {
    margin-bottom: 0;
}

#navigator-container {
    margin: 0px;
}

footer .row .copyright a {
    color: #4d4d4d;
}

footer .copyright {
    text-align: center;
    margin: 20px 0;
    font-size: 90%;
}

/*****************************************************************/
/***************************Trivender*****************************/
/*****************************************************************/

/* Customize Admin page survey title buttons */
.surveytitle.btn-primary {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #264f7b;
    background-image: -webkit-linear-gradient(#3268a2, #264f7b);
}

.surveytitle.btn-primary:hover {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #204268;
    background-image: -webkit-linear-gradient(#31659e, #204268);   
}

/*--------------------start button--------------------- */
/*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: #ffffff;
    border: 1px solid #08101a;
    background-color: #204268;
    background-image: -webkit-linear-gradient(#31659e, #204268);
}


.ls-move-submit-btn,
.ls-move-next-btn {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #264f7b;
    background-image: -webkit-linear-gradient(#3268a2, #264f7b);
}


/*gender/yes/no... : default*/
.gender-button .btn-primary,
.yes-no .btn-primary,
.bootstrap-buttons-div .button-item {
    color: #4d4d4d;
    background-color: #ddd;
    border: 3px solid #f6f6f6;
}

/*gender/yes/no... : hover*/
.gender-button .btn-primary:hover,
.yes-no .btn-primary:hover,
.bootstrap-buttons-div .button-item:hover,
.btn-check:active+.btn-primary,
.btn-check:checked+.btn-primary,
.btn-primary.active,
.btn-primary:active,
.show>.btn-primary.dropdown-toggle {
    color: #ffffff;
    border: 3px solid #f6f6f6;
    background-color: #496b38;
    opacity: 0.75;
    filter: alpha(opacity=75);
    background-image: none;
    transition: 0.125s ease-in-out;

}

/*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: #ffffff;
    border: 3px solid #f6f6f6;
    background-color: #496b38;
    opacity: 0.75;
    filter: alpha(opacity=75);
    background-image: none;
    transition: 0.125s ease-in-out;
}


/*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: #ffffff;
    border-color: 1px solid #08101a;
    background-color: #264f7b;
    background-image: -webkit-linear-gradient(#3268a2, #264f7b);
}

/*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: #1a1a1a;
    border: 1px solid #959595;
    background-color: #c8c8c8;
    background-image: -webkit-linear-gradient(#ebebeb, #c8c8c8);
}

.ls-move-previous-btn {
    color: #4d4d4d;
    border-color: 1px solid #959595;
    background-color: #d5d5d5;
    background-image: -webkit-linear-gradient(#eeeeee, #d5d5d5);
}

/*###############Upload start###########*/
/*upload: Save Changes...*/
.upload.btn-primary {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #264f7b;
    background-image: -webkit-linear-gradient(#3268a2, #264f7b);
}

.upload.btn-primary:hover,
.upload.btn-primary:active:hover,
.upload.btn-primary.active:hover {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #204268;
    background-image: -webkit-linear-gradient(#31659e, #204268);
}

.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;
    border: 1px solid #08101a;
    background-color: #204268;
    background-image: -webkit-linear-gradient(#31659e, #204268);
}

/*upload popup start*/
/*start: upload: Select file...*/
.upload-div .btn {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #264f7b;
    background-image: -webkit-linear-gradient(#3268a2, #264f7b);
}

.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;
    border: 1px solid #08101a;
    background-color: #204268;
    background-image: -webkit-linear-gradient(#31659e, #204268);
}

.upload-div .btn:hover,
.upload-div .btn:active:hover,
.upload-div .btn.active:hover {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #204268;
    background-image: -webkit-linear-gradient(#31659e, #204268);
}

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

/*upload: You can upload...*/
.uploader .alert-info {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #264f7b;
    background-image: -webkit-linear-gradient(#3268a2, #264f7b);
}


/*file upload popup save-changes*/
.file-upload-modal-footer .btn {
    color: #ffffff !important;
    border-color: #4cae4c !important;
    background-color: #5cb85c !important;
    background-image: -webkit-linear-gradient(#5cb85c, #4cae4c) !important;
}


.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;
    border: 1px solid #08101a;
    background-color: #204268;
    background-image: -webkit-linear-gradient(#31659e, #204268);
}

.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;
    background-image: -webkit-linear-gradient(#449d44, #398439) !important;
}

.upload-files .uploadedfiles td a.btn-primary {
    color: #ffffff;
    border: 1px solid #08101a;
    background-color: #264f7b;
    background-image: -webkit-linear-gradient(#3268a2, #264f7b);
}

.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;
    border: 1px solid #08101a;
    background-color: #204268;
    background-image: -webkit-linear-gradient(#31659e, #204268);
}

.btn-success {
    color: #fff;
    background-color: #5cb85c !important;
    border-color: #4cae4c !important;
}

.btn-success:hover {
    color: #fff;
    background-color: #449d44 !important;
    border-color: #398439 !important;
}

/*upload popup end*/

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

.save-survey-input .btn,
.modal-dialog .btn {
    color: #ffffff;
    border: 3px solid #f6f6f6;
    background-color: #496b38;
    opacity: 0.75;
    filter: alpha(opacity=75);
    background-image: none;
    transition: 0.125s ease-in-out;
}

.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;
    border: 3px solid #f6f6f6;
    background-color: #496b38;
    opacity: 0.75;
    filter: alpha(opacity=75);
    background-image: none;
    transition: 0.125s ease-in-out;
}

.btn-info {
    color: #ffffff;
    border: 3px solid #f6f6f6;
    background-color: #496b38;
    opacity: 0.75;
    filter: alpha(opacity=75);
    background-image: none;
    transition: 0.125s ease-in-out;
}

.btn-info:hover {
    color: #ffffff;
    border: 3px solid #f6f6f6;
    background-color: #496b38;
    opacity: 0.75;
    filter: alpha(opacity=75);
    background-image: none;
    transition: 0.125s ease-in-out;
}

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

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

/*sorted*/
.sortable-rank .ls-choice.sortable-item {
    color: #ffffff;
    border: 1px solid #496b38;
    background-color: #496b38;
    background-image: -webkit-linear-gradient(#638f4d, #496b38);
}

/*--------------------end sortables----------------*/

.slider-touched .tooltip-inner {
    background-color: #999999;
}

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

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

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

.slider-selection {
    background-color: #496b38;
    background-image: -webkit-linear-gradient(#638f4d, #496b38);
    opacity: 0.85;
}

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

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

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

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

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

/****Fixed css for misaligned array buttons****/
.dir-ltr .radio-item label.ls-label-xs-visibility::before, 
.dir-ltr .checkbox-item label.ls-label-xs-visibility::before {
    left: -6px;
    top: 0px;
}

.dir-ltr .radio-item label.ls-label-xs-visibility::after {
    left: 3px;
    top: 3px;
}

.dir-ltr .checkbox-item label.ls-label-xs-visibility::after {
    left: 0px;
    top: 0px;
}

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

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