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



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

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

/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: url(./fonts/S6u8w4BMUTPHjxsAUi-qJCY.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: url(./fonts/S6u8w4BMUTPHjxsAXC-q.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url(./fonts/S6uyw4BMUTPHjxAwXjeu.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url(./fonts/S6uyw4BMUTPHjx4wXg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url(./fonts/S6u9w4BMUTPHh6UVSwaPGR_p.woff2) format('woff2');
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url(./fonts/S6u9w4BMUTPHh6UVSwiPGQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
    padding-bottom: 0px;
    color: #2C3E50;
    font-family: 'Lato';
    font-size: 15px;
    line-height: 1.42857143;    
}

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

a {
    color: #0047B9;
    text-decoration: none;
}

a:hover {
    color: #0a58ca;
    text-decoration: underline;
}

.dropdown-item {
    color: #0047B9;
}

.flatly .dropdown-item:focus, 
.flatly .dropdown-item:hover {
    background-color: transparent;    
    color: #0047B9;
    text-decoration: underline;
}

.dropdown-item.active, 
.dropdown-item:active {
    background-color: #0047B9;
    color: #FFFFFF;
    border-color: #0047B9;
}

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

img {
    width: 100%;
}

#main-row .alert-dismissible {
    margin: 15px 0px 0px 0px;
    border-radius: 0;
}

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

tbody, td, tfoot, th, thead, tr {
    border-color: #dee2e6;
}

#firstpage-changelang {
    display: none;
}

.tempus-dominus-widget .text-danger { 
    color: #E74C3C !important;
}

option {
    text-align: center;
}

.btn {
    padding: 10px 15px;
}

.btn-group-lg>.btn, .btn-lg {
    padding: 18px 27px;
}

button.navbar-toggler {
    margin-right: 6px;
    background-color: #0047B9;
    border-color: #1a242f;
}

.icon-bar {
    width: 22px;
    height: 2px;
    margin-top: 4px;  
    background-color: #FFFFFF;
    border-radius: 1px;    
    display: block;    
}

.icon-bar:last-child {
  margin-bottom: 4px;   
}

.navbar-toggler:focus {
    box-shadow: none;
}

.answer-container {
    padding-top: 20px;
}

.form-check-input:checked {
    background-color: #0047B9;
    border-color: #0047B9;
}

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

li.index-menu-full .dropdown-menu[data-bs-popper] {
    left: -125px;
}

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

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

.logo-container>img {
    height: 75px;
}

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

#navbar .nav-link {
    color: #0047B9;
}

#surveytitle_bar {
    width: 100%;
    height: 40px;   
    padding: 1.5px 0px 1.5px 15px;
    background-color: #0047B9;  
    color: #FFFFFF;
    font-size: 19px;
    display: flex;
    align-items: center;
    position: fixed;
    top: 75px;
    z-index: 6;
}

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

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

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

.top-container .progress {
    border-radius: 0;
}

.progress-bar {
    background-color: #0047B9;
}

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

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

#outerframeContainer #main-col:first-child,
div#group-0.group-outer-container,
div#group-0.group-outer-container .group-container:first-child {
    margin-top: 5rem;
    margin-bottom: 0;
}

.group-title {
    margin-bottom: 2rem;
}

.group-description,
.question-container {
    margin-left: 0;
    margin-right: 0;
}

.group-description .well {
    border-radius: 0;
    box-shadow: none;
}

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

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

.question-title-container {
    background-color: #0047B9;
    color: #FFFFFF;     
}

.question-title-container a {
    color: #FFFFFF; 
}

.question-title-container a:hover {
    text-decoration: underline;
}

.question-valid-container {
    background-color: #0047B9 !important;
    color: #FFFFFF !important;
    text-align: left;
    top: -1px;
}

.form-select,
.form-control {
    padding: 10px 15px;
}

.form-select:focus,
.form-control:focus {
    border-color: #66AFE9;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}

.table-col-hover col:hover, 
.table-col-hover col.hover {
    background-color: rgba(0, 0, 0, 0.075);
}

.flatly label::after {
    background-color: #0047B9;
}

.checkbox-item label::after {
    width: 13px !important;   
    height: 13px;
    color: #0047B9;
    left: 2px;
    top: 2px;    
}

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

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

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

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

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

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

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

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

.gender .gender-button,
.yes-no .yesno-button {
    column-gap: 15px;
}

.flatly .array-flexible-dual-scale .dropdown-item:focus, 
.flatly .array-flexible-dual-scale .dropdown-item:hover {
    text-decoration: none;
}

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

.multiple-opt .question-valid-container .ls-questionhelp:before {
	color: #FFFFFF;
}

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

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

/*****************************************************************/
/*                     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, 
.modal-content, 
.question-container {
    border-radius: 0px;
}

/* Improve button focus and hover effects */
.btn, 
.progress, 
.dropdown-menu, 
.checkbox-item label::before, 
.checkbox-item label::after, 
.form-control, 
.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;
}

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

.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: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-outline-secondary, 
.btn-outline-secondary:focus,
.btn-check:focus+.btn-primary, 
.btn-primary:focus {
   box-shadow: none; 
}

/* Customize Next/Submit buttons */
.selector--inputondemand-addlinebutton,
.ls-move-submit-btn, 
.ls-move-next-btn {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.selector--inputondemand-addlinebutton:hover,
.selector--inputondemand-addlinebutton:active,
.selector--inputondemand-addlinebutton:focus,
.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: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.btn-primary.disabled, 
.btn-primary:disabled {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

/* Customize gender/yes-no buttons */
.gender-button .btn-primary, 
.yes-no .btn-primary, 
.bootstrap-buttons-div .button-item {
    background-color: #FFFFFF;	
    color: #0047B9;
    border-color: #0047B9;
}

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

.gender-button .btn-primary:hover, 
.yes-no .btn-primary:hover, 
.bootstrap-buttons-div .button-item:hover {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.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 {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

/* 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 {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

/* Customize Previous buttons */
.ls-move-previous-btn {
    background-color: #FFFFFF;	
    color: #0047B9;
    border-color: #0047B9;
}

.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: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

/* Customize Upload buttons */
.upload.btn-primary {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.upload.btn-primary:hover, 
.upload.btn-primary:active:hover, 
.upload.btn-primary.active:hover {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
    text-decoration: none;
}

.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 {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.upload-div .btn {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.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 {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.upload-div .btn:hover,
.upload-div .btn:active:hover,
.upload-div .btn.active:hover {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.uploader .alert-info {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.file-upload-modal-footer .btn {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.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 {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.file-upload-modal-footer .btn:hover,
.file-upload-modal-footer .btn:active:hover,
.file-upload-modal-footer .btn.active:hover {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

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

.upload-files .uploadedfiles td a.btn-primary:hover, 
.upload-files .uploadedfiles td a.btn-primary:active,
.upload-files .uploadedfiles td a.btn-primary:focus {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
    text-decoration: none;
}

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

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

.save-survey-input .btn,
.modal-dialog .btn {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.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 {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
    text-decoration: none;
}

.btn-info {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.btn-info:hover {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

/* Customize bootstrap buttons */
.bootstrap-buttons-div .btn-primary {
    background-color: #FFFFFF;	
    color: #0047B9;
    border-color: #0047B9;
}

.bootstrap-buttons-div .btn-primary:hover {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.flatly .btn-check .btn-primary:focus, 
.flatly .btn-check:focus + .btn-primary {
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

.bootstrap-select .filter-option-inner-inner {
    text-align: center;
}

.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;
	border-color: #cccccc;
	border-radius: 4px;
}

.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 .btn-outline-secondary,
.bootstrap-select .btn-outline-secondary:hover,
.bootstrap-select .btn-outline-secondary:active,
.bootstrap-select .btn-outline-secondary:focus {
	background-color: #FFFFFF;
	color: #212529;
	border-color: #ced4da;
}

.flatly .bootstrap-select .dropdown-item:focus, 
.flatly .bootstrap-select .dropdown-item:hover {
    background-color: #0047B9;
    color: #FFFFFF;
    border-color: #0047B9;
}

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

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

/*****************************************************************/
/*                       Start Sortables                         */
/*****************************************************************/

.list-samechoiceheight .sortable-list {
    padding: 8px;
    border-radius: 0;
}

/*unsorted*/
.sortable-choice .ls-choice.sortable-item {
    padding: 15px;       
    background-color: #FFFFFF;	
    color: #0047B9;
    border-color: #0047B9;
}

/*sorted*/
.sortable-rank .ls-choice.sortable-item {
    padding: 15px;      
    background-color: #0047B9;	
    color: #FFFFFF;
    border-color: #0047B9;
}

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

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

.tooltip-inner {
    background-color: #0047B9;
}

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

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

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

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

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

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

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

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

#navbar ul li.index-item-current {
    background-color: #0047B9;
}

#navbar ul li.index-item-current a {
    color: #FFFFFF !important;
}

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

#myfooter {
    width: 100%;
    min-height: 20px;
    padding: 19px;
    background-color: #0047B9;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    position: relative;
}


#myfooter a {
    color: #FFFFFF; 
}

#myfooter a:hover {
    color: #FFFFFF; 
    text-decoration: underline;
}

#footer_container {
    line-height: 35px;
    text-align: center;
}

.ul_footer {
    margin: 0;
    padding: 0;
    list-style: none;
}

.li_footer {
    display: inline-block;
    margin-left: 1.5em;
}

.li_footer:first-child {
    margin-left: 0;
}

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

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

@media only screen and (max-width: 768px) {
    .logo-container {
        width: 80%;
    }
    
    div#navbar {
        padding-top: 50px;
    }
    
    div.gender-button, 
    div.yesno-button {
        width: 100%;
    }
    
    option {
        text-align: left;
    }
    
    .btn-group-lg>.btn, .btn-lg {
        padding: 10px 15px;
    }
    
    .table-hover>tbody>tr:hover>* {
        --bs-table-accent-bg: transparent;
    }
}

@media only screen and (max-width: 760px), 
(min-device-width: 768px) and (max-device-width: 1024px) {
    table.ls-answers td {
        min-height: 2em;
        border: 1px solid #ecf0f1;
    }
}

@media (max-width: 768px) {
    .date.question-container .date-item div.col-12:nth-child(2), 
    .date.question-container .date-item div.col-12:nth-child(4) {
        display: none;
    }
    
    .date .date-item.ls-no-js-hidden div.col-12:nth-child(1), 
    .date .date-item.ls-no-js-hidden div.col-12:nth-child(3), 
    .date .date-item.ls-no-js-hidden div.col-12:nth-child(5) {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .date .date-item.ls-no-js-hidden div.col-12:nth-child(1), 
    .date .date-item.ls-no-js-hidden div.col-12:nth-child(3), 
    .date .date-item.ls-no-js-hidden div.col-12:nth-child(5) {
        width: 100px;
    }
}

body,
.form-control {
    font-size: 20px;
}

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

.answer-unknown {
    border-left: 4px solid #888;
    padding-left: 15px;
    box-shadow: -10px 0 0 #fff;
}

.erw .ls-answers th:last-child,
.erw .ls-answers td:last-child {
    border-left: 6px solid #666;
    padding-left: 20px;
    background: #f5f5f5;
}

/* Frage-Container mit Rahmen */
.white-bg {
    background-color: #ffffff !important; /* Weißer Hintergrund */
    border: 2px solid #000000 !important; /* Schwarzer Rahmen */
    border-radius: 20px;                   /* Abgerundete Ecken */
}

/* Text innerhalb des Containers leicht einrücken + Trennstrich unten */
.white-bg .question-title-container,
.white-bg .question-text {
    padding: 10px 15px !important;             /* Abstand innen */
    color: #000000 !important;                 /* Schriftfarbe schwarz */
    background-color: transparent !important;  /* Hintergrund bleibt vom Container */
    margin-bottom: 10px;                       /* Abstand zwischen Trennstrich und Antworten */
}

/* LimeSurvey: Nur das Freitextfeld der "Other"-Option ausblenden */
.hide-other-textfield .other-text-item {
    display: none !important;
}

/* Optional: auch technisch deaktivieren (kein Fokus, keine Eingabe) */
.hide-other-textfield .other-text-item input {
    pointer-events: none;
}

/* Label ausblenden */
label[for="saveemail"] {
    display: none !important;
}

/* Eingabefeld ausblenden */
#saveemail {
    display: none !important;
}
.info-email-optional {
    display: none !important;
}

label[for="savename"] {
    position: relative;
    color: transparent;
}

label[for="savename"]::before {
    content: "Pseudonym:";
    left: 0;
    top: 0;
    color: #212529;
}

.text-warning {
    display: none !important;
}

.question-container.hide-title > .question-title-container {
    display: none !important;
}

.question-container.hide-title {
    margin-top: -10px !important;
    padding-top: -10px !important;
    border-top: 1px solid #dee2e6;
}


.other-small .radio-text-item {
    display: flex !important;
    align-items: center;
    max-width: 400px;
    gap: 10px;
}

.other-small .othertext-label-checkox-container {
    flex: 0 0 auto;
    white-space: nowrap;
}

.other-small .other-text-item {
    flex: 1;
}

.other-small .other-text-item input {
    max-width: 250px;
}


<div class="text-info">

    <h3 style="color:#000000; margin-bottom:15px;">
        Umfrage pausieren und später fortsetzen
    </h3>

    <p style="color:#000000;">
        Vergeben Sie einen Namen (Pseudonym) und ein Passwort (mind. 5 Zeichen),
        notieren Sie sich beides und klicken Sie auf
        <strong style="color:#005EA8;">„Jetzt speichern“</strong>.
    </p>

    <p style="color:#000000;">
        Sie können den Browser nun schließen. Ihre Eingaben bleiben gespeichert.
    </p>

    <p style="color:#000000;">
        Jeder Klick auf
        <strong style="color:#005EA8;">„Später fortfahren“</strong>
        speichert Ihren aktuellen Stand erneut.
    </p>

    <p style="color:#000000;">
        <strong style="color:#000000;">Fortsetzen:</strong><br>
        Öffnen Sie den ursprünglichen Umfrage-Link,
        bestätigen Sie die Datenschutzerklärung und klicken Sie oben rechts auf
        <strong style="color:#005EA8;">„Zwischengespeicherte Umfrage laden“</strong>.
    </p>

</div>


/* Text innerhalb des Containers leicht einrücken + Trennstrich unten 
/* .white-bg .question-title-container {
/*    border-bottom: 2px solid #000000;         /* Trennstrich unter dem Fragetext */
/* }


/* letzte Antwort-Spalte hervorheben und absetzen 
.ls-answers th:last-child,
.ls-answers td:last-child {
    border-left: 6px solid #666;
    padding-left: 20px;
    background-color: #f5f5f5;
}*/