/******************
    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
*/
/* 
.bg-primary {
    background-color: #67726B;
}
.text-danger {
    color: #f52222;
}
 */

:root {
    --bs-bg-primary: #eee;
    --bs-primary-rgb: 238,238,238;
    --bs-info-rgb: 55, 73, 105;
}

.flatly .smiley-list .smiley-item label::before { border: 0; }

.smiley-list .smiley-item input[type="radio"]:checked + label, .smiley-list .smiley-item input[type="radio"]:hover + label {
  background: #435e93;
}

.flatly .btn, .flatly .btn-lg, .flatly .form-control, .flatly .well { border-radius: 0px; }

.flatly label::after{background-color:#32466e;}

.flatly .dropdown-item:focus-visible, .flatly .dropdown-item:hover{background-color:#32466e;}

/* .flatly .btn-check:active + .btn-primary, .flatly .btn-primary.active, .flatly .btn-primary:active, .flatly .btn-check:checked + .btn-primary, */
.flatly .btn-check .btn-primary:focus-visible, .flatly .btn-check:focus-visible + .btn-primary, .flatly .btn-primary:focus-visible, .flatly .show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #32466e;
    border: 1px solid #32466e;
    box-shadow: none;
    outline-offset: 2px;
    outline: 2.5px dashed #374968;
}

.flatly .answer-container input[type="checkbox"]:focus-visible:checked + label::before, .flatly .answer-container input[type="radio"]:focus-visible:checked + label::before, .flatly .form-control:focus-visible, .flatly .form-select:focus-visible, .btn:focus-visible {
    outline: 2.5px dashed #fff;
}

.flatly .btn-check:focus-visible:checked + .btn-primary, .flatly .btn-check .btn-primary:focus-visible:checked, .flatly .btn-check:focus-visible:checked + .btn-primary {
    background-color: #1e2a43;
    border-color: #1e2a43;
    outline-offset: 2px;
    outline: 2.5px dashed #374968;
}

.flatly .btn-check:checked + .btn-primary, .flatly .btn-check:focus:checked + .btn-primary, .flatly .btn-check .btn-primary:focus:checked {
    background-color: #1e2a43;
    border-color: #1e2a43;
}

.flatly .checkbox-item label::before, .flatly .radio-item label::before {
    border: 1px solid #000;
}

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

.flatly .checkbox-item label::after {
    color:#fff;
    top: 0;
    left: 0;
    height: 17px;
    width: 17px;
}

.flatly .table .radio-item label::before {
    left: 6px;
    top: 6px;
}

.flatly .radio-item label.ls-label-xs-visibility::after, .flatly .checkbox-item label.ls-label-xs-visibility::after {
  margin-left: 6px;
  margin-top: 6px;
}

/* breaks smileys inserted as HTML in Matrix question texts.. #12753
and also normal labels for matrix questions #12811
specificity too high
moved down to next style
*/
/*.flatly .radio-item .ls-label-xs-visibility, .checkbox-item .ls-label-xs-visibility {
  width: 27px;
  height: 27px;
}*/


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

.flatly .answer-container input[type="checkbox"]:focus-visible + label::before, .flatly .answer-container input[type="radio"]:focus-visible + label::before, .flatly .form-control:focus-visible, .flatly .form-select:focus-visible, .btn:focus-visible {
    outline-offset: 2px;
    outline: 2.5px dashed #374968;
    box-shadow: unset;
    border-color: unset;
}

.flatly .btn-primary {
  color: #fff;
  background-color: #32466e;
  border-color: #32466e;
}

.flatly .btn-primary:hover {
  color: #fff;
  background-color: #1e2a43;
  border-color: #1e2a43;
}

.flatly .btn-outline-secondary {
  color: #585858;
  border-color: #585858;
}

.flatly .btn-outline-secondary:hover {
  color: #2d2d2d;
  background-color: #dadada;
  border-color: #dadada;
}

.flatly .ls-group-remaining .ls-input-group {
  display: inline;
}
 
.bg-primary {
    background-color: #eee;
    color: #000;
}

/* @font-face {
  font-family: 'oswaldregular';
  font-style: normal;
  font-weight: normal;
  src: url('./font-src/oswald-webfont.eot?#iefix') format('embedded-opentype'), url('./font-src/oswald-webfont.woff') format('woff'), url('./font-src/oswald-webfont.ttf') format('truetype'), url('oswald-webfont.svg#oswaldregular') format('svg');
} */

/* h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "oswaldregular";   
} */

body {
  color: #000;
  font-family: 'Noto Sans';
}

.question-valid-container .text-danger {
    font-weight: normal;
}

.input-error .asterisk {
    font-size: 15px;
    margin-top: 0;
}

.logo-container > img {
    padding: 0;
    height: auto;
    width: auto;
}

.navbar-brand {
    padding: 2px 0px 5px 15px;
}

.text-primary, .text-primary:hover {
    color: #000;   
}

.text-info, .text-info:hover {
    color: #000;
}

.survey-welcome {
    font-size: 16px;
}

.fa-asterisk::before {
    margin-right: 0.3em;
}

@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {
    table.ls-answers .ls-label-xs-visibility
    {
        padding-top: 3px;
    }
    table.ls-answers .ls-label-xs-visibility > p > img
    {
        width: 27px;
    }
    table.ls-answers .ls-label-xs-visibility > p + p
    {
        position: absolute;
        left: 35px !important;
        top: 3px;
        width: 100%;
    }
    .dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::after, .dir-ltr table.ls-answ
    {
        margin-left: -14px;
    }