/******************
    User custom CSS
    ---------------
    Template v1.2
    17-06-2023
    WCAG

    Bij kopie thema vervang:

    lettertype:     Public Sans
    rood:           var(--color-primary-rgb)
    oranje:         var(--color-primary-tint-rgb)

*/

/** Font */

@import url('https://fonts.googleapis.com/css2?family=Karma:wght@300;400;500;600;700&family=Public+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Paytone+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');

/** make 1 rem 10px*/
:root {
    font-size: 62.5% !important;
    --outline: 2px dashed #000;
    --outline-offset: 2px;

    --color-primary: #334734;
	--color-primary-rgb: 51,71,52;
	--color-primary-contrast: #ffffff;
	--color-primary-contrast-rgb: 255,255,255;
	--color-primary-shade: #2d3e2e;
	--color-primary-tint: rgb(71, 89, 72);
    --color-primary-tint-rgb: 71, 89, 72;

    --color-default: #334734;
	--color-default-rgb: 51,71,52;
	--color-default-contrast: #ffffff;
	--color-default-contrast-rgb: 255,255,255;
	--color-default-shade: #2d3e2e;
	--color-default-tint: rgb(71, 89, 72);
    --color-default-tint-rgb: 71, 89, 72;

    --color-nah: #C02A2D;
	--color-nah-rgb: 192,42,45;
	--color-nah-contrast: #ffffff;
	--color-nah-contrast-rgb: 255,255,255;
	--color-nah-shade: #a92528;
	--color-nah-tint: #c63f42;
    --color-nah-tint-rgb: 198,63,66;

	--color-parkinson: #203C62;
	--color-parkinson-rgb: 32,60,98;
	--color-parkinson-contrast: #ffffff;
	--color-parkinson-contrast-rgb: 255,255,255;
	--color-parkinson-shade: #1c3556;
	--color-parkinson-tint: #365072;
	--color-parkinson-tint-rgb: 54,80,114;

	--color-migraine: #75AC4E;
	--color-migraine-rgb: 117,172,78;
	--color-migraine-contrast: #000000;
	--color-migraine-contrast-rgb: 0,0,0;
	--color-migraine-shade: #679745;
	--color-migraine-tint: #83b460;
	--color-migraine-tint-rgb: 131,180,96;

	--color-ms: #800080;
	--color-ms-rgb: 128,0,128;
	--color-ms-contrast: #ffffff;
	--color-ms-contrast-rgb: 255,255,255;
	--color-ms-shade: #710071;
	--color-ms-tint: #8d1a8d;
	--color-ms-tint-rgb: 141,26,141;

	--color-nah-migraine: #ffc409;
	--color-nah-migraine-rgb: 255,196,9;
	--color-nah-migraine-contrast: #000000;
	--color-nah-migraine-contrast-rgb: 0,0,0;
	--color-nah-migraine-shade: #e0ac08;
	--color-nah-migraine-tint: #ffca22;
	--color-nah-migraine-tint-rgb: 255,202,34;

    --color-secondary: #F58266;
	--color-secondary-rgb: 245,130,102;
	--color-secondary-contrast: #000000;
	--color-secondary-contrast-rgb: 0,0,0;
	--color-secondary-shade: #d8725a;
	--color-secondary-tint: rgb(246, 143, 117);
    --color-secondary-tint-rgb: 246, 143, 117;

    --color-tertiary: #FCF2EB;
	--color-tertiary-rgb: 252,242,235;
	--color-tertiary-contrast: #000000;
	--color-tertiary-contrast-rgb: 0,0,0;
	--color-tertiary-shade: #ded5cf;
	--color-tertiary-tint: rgb(252, 243, 237);
    --color-tertiary-tint-rgb: 252, 243, 237;

    --color-Quaternary: #FFB86E;
	--color-Quaternary-rgb: 255,184,110;
	--color-Quaternary-contrast: #000000;
	--color-Quaternary-contrast-rgb: 0,0,0;
	--color-Quaternary-shade: #e0a261;
	--color-Quaternary-tint: rgb(255, 191, 125);
    --color-Quaternary-tint-rgb: 255, 191, 125;

    --animate-delay: 0.9s;
}
html, body {
    min-height: 100vh;
    line-height: 1.6;
    max-width: 100%;
    overflow-x: hidden;
}
body {
    /* font-family: 'Public Sans light', sans-serif !important; */
    font-family: 'Nunito', sans-serif !important;
    font-size: 1.8rem;
    line-height: 1.6;
    position: relative !important;
    /* background: linear-gradient(180deg, rgb(var(--color-Quaternary-rgb)) 67%, rgb(var(--color-Quaternary-rgb)) 100%); */
    padding-top: 0px !important;
    /* Zonder nav logo */
    /*padding-top: 60px !important;*/ /* Bij nav logo */
}
p {
    margin: 0 0 2rem;
}
.footer-container {
    background-color: var(--color-primary);
    position: absolute;
    bottom: 0;
    text-align: center;
    font-size: small;
    width: 100vw !important;
    padding: 8px;
}
.footer-top {
    background-color: var(--color-tertiary);
    position: absolute;
    bottom: 44px;
    text-align: center;
    font-size: small;
    width: 100vw !important;
    padding: 8px;
}

.footer-top h2 {
    font-size: large !important;
    text-align: left !important;
}

.footer-top ul {
    list-style: none;
    text-align: left !important;
    padding: 0 !important;
}

html body .navbar.navbar-default.navbar-fixed-top {
    z-index: 1000 !important;
}

.footer-container  a {
    color: var(--color-tertiary) !important;

}
/** zorgen dat de vraag niet buiten de pagina valt */
/* @media (max-width: 767px) {
    #dynamicReloadContainer {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
} */
@media (max-width: 767px) {
    #dynamicReloadContainer {
        padding-left: 4px !important;
        padding-right: 4px !important;
    }
    #main-row {
        padding: 0 16px !important;
    }
}
#navigator-container {
    padding: 0 2rem;
}
.asset-title{
    width: 60px;
    float: left;
}
/* Knoppen even groot als verzenden knop */
#ls-button-previous,
#ls-button-submit {
    width: 135px;
}
.navbar-brand {
    padding: 0;
    margin-left: 77px;
}
/** Background color */

a.animate:after,
.answer-item label::after,
.progress-bar,
.geoloc-item .input-group-addon,
input[type="checkbox"]:checked:after,
.slider-selection,
.slider-handle {
    border-color: rgb(var(--color-primary-rgb)) !important;
    background-color: rgb(var(--color-primary-rgb)) !important;
    background: linear-gradient(90deg, rgba(var(--color-primary-rgb),1) 0%, rgba(var(--color-primary-tint-rgb),1) 100%) !important;
    color: #fff !important;
}
#navbar,
.navbar-default {
    border-color: rgb(var(--color-tertiary-rgb)) !important;
    background-color: rgb(var(--color-tertiary-rgb)) !important;
    background: linear-gradient(90deg, rgba(var(--color-tertiary-rgb),1) 0%, rgba(var(--color-tertiary-tint-rgb),1) 100%) !important;
    color: #fff !important;
}
.slider-selection{
    background: linear-gradient(90deg, rgba(var(--color-tertiary-rgb),1) 0%, rgba(var(--color-tertiary-tint-rgb),1) 100%) !important;
}
button,
.btn,
.btn.active {
    border-color: rgb(var(--color-secondary-rgb)) !important;
    background-color: rgb(var(--color-secondary-rgb)) !important;
    background: linear-gradient(90deg, rgba(var(--color-secondary-rgb),1) 0%, rgba(var(--color-secondary-tint-rgb),1) 100%) !important;
    color: #fff !important;
}
/** Background:hover color */

button:hover,
.btn:hover,
.slider-handle:hover {
    background-color: rgb(var(--color-primary-tint-rgb)) !important;
    background: linear-gradient(90deg, rgba(var(--color-primary-rgb),1) 0%, rgba(var(--color-primary-tint-rgb),1) 100%) !important;
}
button.active,
.btn.active,
button.focus,
.btn.focus {
    background: rgba(var(--color-primary-rgb),0.5) !important;
}
.radio-list .btn,
.checkbox-list .btn,
.button-list .btn,
.sortable-choice li {
    font-weight: 600;
    background: rgba(var(--color-primary-rgb),0.05) !important;
    background-color: none !important;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    /* color: rgb(var(--color-primary-rgb)) !important; */
    color: #222 !important;
    box-shadow: none !important;
}
.radio-list .btn.active,
.radio-list .btn:hover,
.checkbox-list .btn.active,
.checkbox-list .btn:hover,
.button-list .btn.active,
.button-list .btn:hover,
.sortable-rank li {
    background: linear-gradient(90deg, rgba(var(--color-primary-rgb),1) 0%, rgba(var(--color-primary-tint-rgb),1) 100%) !important;
    color: #fff !important;
    box-shadow: 0 7px 21px rgba(var(--color-primary-rgb),0.33) !important;
}
.yesno-button li {
    margin-right: 5px;
}
.geoloc-item input[type="checkbox"] {
    filter: grayscale(1)
}
.leaflet-container {
    margin: 1rem 0;
}
.sortable-choice li,
.sortable-rank li {
    margin: 5px !important;
    border-radius: 40px !important;
    border: none !important;
}
.ls-answers tbody .answertext {
    text-align: left !important;
}

.fruity .well {
    border-radius: 40px;
}
/** Text */

h1, h2 {
    font-weight: 500;
    color: rgb(var(--color-primary-rgb)) !important;
}
.question-text h1 {
    font-weight: 500;
    color: #fff !important;
}
h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}
h2, .h2, h3, .h3, h4, .h4 {
    font-family: 'Paytone One', sans-serif !important;
    font-weight: 500;
    line-height: unset !important;
}
.question-text h2,
.question-text .h2 {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
}
a {
    color: rgb(var(--color-primary-rgb)) !important;
}

body,
.text-primary {
    color: #222 !important;
}

.text-info,
.fruity .text-info {
	color: var(--color-Quinary) !important;
	font-size: 1.6rem;
}
.text-info:hover {
    /* color: #11a9c4 !important; */
    color: var(--color-Quinary) !important;
    font-size: 1.6rem;
}
.text-danger {
	color: #B60000 !important;
}

.alert {
    /* border-radius: 1.5rem; */
    border-radius: 40px;
}

.ls-question-message {
    opacity: 0.5;
    color: #222;
}
.ls-question-message:hover {
    opacity: 1;
}
.input-error .ls-question-message {
    opacity: 1;
}

.question-text {
    font-weight: 600;
    font-size: 1.8rem;
    color: rgba(var(--color-secondary-rgb),1);
    display: inline-block;
}

.asterisk.pull-left {
    float: none !important;
    margin-top: 10px;
}

.fa-asterisk:before{
	content: "* Verplichte vraag";
	color: #222 !important;
    font-size: 16px;
	font-weight: 500;
	font-family: 'Poppins', sans-serif !important;
}

.ls-question-mandatory.text-danger {
    /* display: none; */
}

.fa-exclamation-circle,
.ls-questionhelp:before  {
    display: none;
}
.dir-ltr .ls-questionhelp {
    margin-left: unset;
}

.question-text p {
	margin: 0 !important;
}
.answer-container p {
    white-space: initial;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.answers-list.radio-list .button-item {
    white-space: normal !important;
}

/** no tables on mobile */

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

    table.ls-answers,
    table.ls-answers thead,
    table.ls-answers tbody,
    table.ls-answers th,
    table.ls-answers td,
    table.ls-answers tr {
        display: block;
    }

    .dir-ltr table.ls-answers,
    .dir-ltr table.ls-answers thead,
    .dir-ltr table.ls-answers tbody,
    .dir-ltr table.ls-answers th,
    .dir-ltr table.ls-answers td,
    table.ls-answers tr {
        text-align: left;
    }

    .dir-rtl table.ls-answers,
    .dir-rtl table.ls-answers thead,
    .dir-rtl table.ls-answers tbody,
    .dir-rtl table.ls-answers th,
    .dir-rtl table.ls-answers td,
    table.ls-answers tr {
        text-align: right;
    }

    table.ls-answers thead {
        display: none
    }


    /* We don't need it for accessibility : we already have the label */

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

    table.ls-answers .information-item:empty {
        display: none
    }

    .dir-rtl table.ls-answers tbody td {
        text-align: right;
    }

    .ls-answers td.radio-item,
    .ls-answers td.checkbox-item {
        padding: 4px;
    }

    .radio-item label {
        width: 100%;
    }

    .dir-ltr .ls-answers td.radio-item,
    .dir-ltr .ls-answers td.checkbox-item {
        padding-left: 24px;
        padding-right: 4px;
    }

    .dir-rtl .ls-answers td.radio-item,
    .dir-rtl .ls-answers td.checkbox-item {
        padding-right: 24px;
        padding-left: 4px;
    }

    table.ls-answers tbody .control-label {
        text-align: left
    }

    .dir-rtl table.ls-answers tbody .control-label {
        text-align: right
    }

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

    .dir-rtl table.ls-answers .answertextright {
        text-align: left
    }

    /* Show the label */
    table.ls-answers .ls-label-xs-visibility {
        display: block;
        position: relative;
        width: auto;
        height: auto;
        overflow: initial;
        white-space: normal;
    }

    .dir-ltr table.ls-answers .ls-label-xs-visibility {
        left: auto;
    }

    .dir-rtl table.ls-answers .ls-label-xs-visibility {
        right: auto;
    }

    table.ls-answers .radio-item .ls-label-xs-visibility,
    table.ls-answers .checkbox-item .ls-label-xs-visibility {
        line-height: initial;
        text-indent: initial;
    }

    .dir-ltr table.ls-answers .radio-item .ls-label-xs-visibility,
    .dir-ltr table.ls-answers .checkbox-item .ls-label-xs-visibility {
        margin-left: 0;
    }

    .dir-rtl table.ls-answers .radio-item .ls-label-xs-visibility,
    .dir-rtl table.ls-answers .checkbox-item .ls-label-xs-visibility {
        margin-right: 0;
    }

    table.ls-answers .ls-label-xs-visibility>* {
        position: relative;
        top: auto;
        width: auto;
        height: auto;
        overflow: auto;
    }

    .dir-ltr table.ls-answers .ls-label-xs-visibility>* {
        left: auto;
    }

    .dir-rtl table.ls-answers .ls-label-xs-visibility>* {
        right: auto;
    }

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

    .dir-rtl table.ls-answers .radio-item label.ls-label-xs-visibility::before,
    .dir-rtl table.ls-answers .checkbox-item label.ls-label-xs-visibility::before {
        margin-right: -20px;
    }

    .dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::after,
    .dir-ltr table.ls-answers .checkbox-item label.ls-label-xs-visibility::after {
        margin-left: -20px;
    }

    .dir-rtl table.ls-answers .radio-item label.ls-label-xs-visibility::after,
    .dir-rtl table.ls-answers .checkbox-item label.ls-label-xs-visibility::after {
        margin-right: -20px;
    }

    table.ls-answers>tbody>tr:hover {
        background-color: transparent;
    }

    /* bs fix */
    table.ls-answers td.visible-xs,
    table.ls-answers th.visible-xs {
        display: block !important
    }
}

/** Navbar */
/* div.navbar.navbar-default.navbar-fixed-top {
	display: none !important;
} */
.ls-link-action.ls-link-loadall.animate {
    display: none;
}

.language_change_container {
    height: unset;
}

#langs-container {
    overflow: unset !important;
}

/** Form global */

.input-error {

}

/** Form field colors */
.form-control:focus,
.select-search .dropdown-item .selectize-input.focus {
    border: 1px solid rgb(var(--color-primary-rgb)) !important;
    box-shadow: inset 0 1px 1px rgba(var(--color-primary-rgb),20%), 0 0 8px rgba(var(--color-primary-rgb),60%) !important;
}

.input-group label {
    line-height: 2rem !important;
}
/** controleren wat nodig is voor de sliders */
.slider-handle {
    border-radius: 100% !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3) !important;
    cursor: pointer;
}
.slider-untouched .slider-selection {
    background: rgba(204, 204, 204, 0) !important;
}
.slider-untouched .slider-handle {
    background: #555 !important;
}
.btn-slider-reset {
    padding: 0px !important;
    height: 1.5em;
    width: 1.5em;
    top: -0.5em;
    background: #777 !important;
}
.btn-slider-reset span {
    display: none;
}
.slider-container > .ls-input-group-extra {
    vertical-align: unset !important;
}
.slider-container > .ls-input-group-reset .btn-slider-reset {
    border: 1px solid #ccc !important;
    color: #ccc !important;
    background: transparent !important;
    width: 3.5rem !important;
    height: 2rem;
    line-height: 1.75rem;
    /* margin-top: 2em; */
}
.slider-container > .ls-input-group-reset .btn-slider-reset:hover {
    border: 1px solid rgb(var(--color-primary-rgb)) !important;
    color: rgb(var(--color-primary-rgb)) !important;
    background: transparent !important;
}
.slider-container > .ls-input-group-reset .btn-slider-reset:focus {
    outline: 1px !important;
}
.slider-container > .ls-input-group-reset .btn-slider-reset::after {
    content:"N.V.T.";
    font-weight: bold;
    font-size: 8px;
}
.slider-container > .ls-input-group-reset i {
    display: none;
}
.slider-left, .slider-right {
    hyphens: none !important;
    font-size: 1.8rem !important;
    display: flex;
    padding: 0;
}
.slider-left {
    text-align: left;
    padding-left: 1em;
}
.slider-right {
    text-align: left;
    padding-right: 1em;
}
.form-horizontal .control-label {
    text-align: left;
}
.slider-list .slider-container {
    margin-top: 0;
}
.slider.slider-horizontal.slider-untouched {
    margin-top: 2em;
}
@media (min-width: 769px) {
    .slider-list .slider-left, .slider-list .slider-right {
        margin-top: unset;
    }
}

.slider.slider-horizontal.slider-untouched {
    margin-top: unset;
}

.slider-list .slider-item .col-sm-12 .ls-input-group {
    margin-top: 20px;
}
/* .slider-item .container-fluid .col-sm-2 {
    margin-top: 0 !important;
}
.slider-left, .slider-right {
    text-align: left !important;
    hyphens: none !important;
    font-size: 1.6rem !important;
} */

/** Transitions */

a,
button,
#navbar,
.navbar-default,
.text-info,
.question-container,
.radio-list .btn,
.checkbox-list .btn,
.button-list .btn,
.sortable-choice li {
    transition: all 0.2s ease;
}

/** Animations */

button:hover,
button:active,
button:focus,
/* #navbar:hover,
.navbar-default:hover, */
.slider-handle:hover {
    box-shadow: 0 7px 21px rgba(var(--color-secondary-rgb),0.33);
}

.question-container:hover,
.question-container:active,
.question-container:focus {
    box-shadow: 0 7px 21px rgba(0,0,0,0.14);
}

.question-container.input-error {
    box-shadow: 0 7px 21px rgba(var(--color-secondary-rgb),0.33) !important;
}

/** Regular */

p,
.h4 {
  line-height: 1.5em;
}

.navbar,
.navbar ul li {
    /* height: 40px !important;
    min-height: 40px !important;
    line-height: 40px !important; */
}
.navbar .logo {
    /* width: auto;
    max-height: 60px; */
}
.container-all-logos {
    display: flex;
    padding-top: 15px;
    align-items: center;
}
.logo-custom {
    width: auto;
    max-height: 60px;
    border-radius: 10px;
    margin-right: 10px;
}
.img-responsive {
    padding: 0 !important;
}
.logo-container>img {
    padding: 0 !important;
}
#navbar,
.navbar-default {
    box-shadow: 0 0px 7px rgba(0,0,0,0.33);
}
#navbar a,
.navbar-default a {
    color: var(--color-primary);
    line-height: 3rem;
}
#navbar .open > a,
.navbar-default .open > a {
    background-color: transparent !important;
}
#navbar .dropdown-menu a,
.navbar-default .dropdown-menu a {
    color: #222 !important;
}
@media only screen and (max-width: 767px) {
    #navbar .dropdown-menu a,
    .navbar-default .dropdown-menu a {
        color: #fff !important;
    }
}
/* #navbar .dropdown-menu a:hover,
.navbar-default .dropdown-menu a:hover {
    background-color: rgba(0,0,0,0.1) !important;
} */
.top-container,
.completed-wrapper {
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 135px !important;
}

.top-container .progress {
    /* border-radius: 1.5rem; */
    border-radius: 40px;
}
button,
.btn {
    box-shadow: 0 2px 4px rgb(0 0 0 / 33%);
    border: none !important;
    border-radius: 40px !important;
    font-weight: 600;
    /* font-size: 1.5rem; */
    /* text-transform: uppercase; */
    hyphens: none !important;
}

.question-container {
    border-radius: 20px;
}

.navbar-toggle {
    background: none !important;
    color: #334733!important;
    padding: 5px !important;
    box-shadow: none !important;
    position: absolute;
    right: 1px;
}
.navbar-toggle .icon-bar {
    color: #334733 !important;
}

/** Select */

.select-search .answer-item {
    display: block !important;
}
.answer-item.radio-item:hover {
    background: rgba(21, 66, 114, 0.08);
    border-radius: 5px;
}
.select-search .dropdown-item .selectize-control {
    width: 100%;
}

/** CB */
.radio-list:not(.image-radio) .radio-item label::before,
.radio-list:not(.image-radio) .radio-item label::after,
.radio-list:not(.image-radio) .radio-item label:focus::before,
.radio-list:not(.image-radio) .radio-item label:active::before,
.checkbox-list label::before,
.checkbox-list .checkbox-item label::after,
.checkbox-list .checkbox-item label:focus::before,
.checkbox-list .checkbox-item label:active::before,
.list-radio:not(.image-radio) .radio-item label::before,
.list-radio:not(.image-radio) .radio-item label::after,
.list-radio:not(.image-radio) .radio-item label:focus::before,
.list-radio:not(.image-radio) .radio-item label:active::before {
    content: none;
    background-color: transparent;
}
.radio-list:not(.image-radio) .radio-item input[type="radio"] + label::before,
.checkbox-list .checkbox-item input[type="checkbox"] + label::before,
.list-radio:not(.image-radio) .radio-item input[type="radio"] + label::before {
    font-family: Arial;
    font-size: 2rem;
    line-height: 1rem;
    content: "";
    font-weight: bold;
    background-color: transparent;
    /* color: #ccc !important; */
    color: #222 !important;
    border: solid 1px;
}
.radio-list:not(.image-radio) .radio-item input[type="radio"]:checked + label::after,
.checkbox-list .checkbox-item input[type="checkbox"]:checked + label::after,
.list-radio:not(.image-radio) .radio-item input[type="radio"]:checked + label::after {
    font-family: Arial;
    font-size: 2rem;
    line-height: 1rem;
    content: "\2713";
    font-weight: bold;
    background-color: transparent !important;
    color: rgb(var(--color-primary-tint-rgb)) !important;
    background: none !important;
    border-color: #222;
}
.radio-item label::before,
.radio-item label::after{
    top: 5px !important;
}

.radio-list .radio-item input[type="radio"]:checked + label::after,
.list-radio:not(.image-radio) .radio-item input[type="radio"]:checked + label {
    font-weight: bold;
}
.dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::after {
    margin-left: -23px;
}
.ls-answers.answers-list.radio-list.multiple-list.nbcol-7.row {
    gap: 4px;
    padding: 8px;
}
/** fix matrix radio possition and visability */
.radio-item .ls-label-xs-visibility {
    height: 25px !important;
}
.dir-ltr .radio-item .ls-label-xs-visibility {
    margin-top: 9px !important;
}

/** CB: Image */

.image-radio ul {
    margin: 0;
    padding: 0;
}
.image-radio .radio-item {
    padding: 0 !important;
    margin: 0 !important;
}
.image-radio .radio-item label {
    font-size: 2rem;
    width: 100%;
}
.image-radio .radio-item img {
    max-width: 100px !important;
    max-height: 50px;
}
.image-radio .radio-item label:hover {
    background: rgba(var(--color-primary-rgb), 0.25);
    border-radius: 20px;
}
.image-radio .radio-item label::before {
    content: none !important;
    border-radius: 20px;
}
.image-radio .radio-item input[type="radio"]:checked + label {
    background: rgba(var(--color-primary-rgb), 0.50);
	border-radius: 20px;
}
.image-radio .radio-item input[type="radio"]:checked + label::after {
    content: none !important;
	text-align: center;
}

.image-radio-small .radio-item label {
    padding: 1rem 1rem;
}

.image-radio-small .radio-item img {
    max-width: 50px !important;
    margin: 1rem;
}

.ls-answers.answers-list.radio-list.multiple-list {
    display: flex;
    justify-content: space-evenly;
}

.multiple-opt ul {
    margin: 0;
    padding: 0 2rem;
}
.multiple-opt .answer-item {
    padding: 0 !important;
    margin: 0 !important;
}
.multiple-opt .answer-item label {
    padding-left: 3rem;
    font-size: 1rem;
    font: unset;
    font-family: unset;
    /* text-align: center; */
    width: 100%;
}
.multiple-opt .answer-item img {
    max-width: 100px !important;
}
@media (hover: hover) {
    .multiple-opt .answer-item label:hover {
        background: linear-gradient(90deg, rgba(var(--color-primary-rgb),0.1) 0%, rgba(var(--color-primary-tint-rgb),0.1) 100%) !important;
    }
}
.multiple-opt .answer-item label::before {
    content: none !important;
}
.multiple-opt .answer-item input[type="radio"]:checked + label,
.multiple-opt .answer-item input[type="checkbox"]:checked + label {
    background: linear-gradient(90deg, rgba(var(--color-primary-rgb),0.33) 0%, rgba(var(--color-primary-tint-rgb),0.33) 100%) !important;
    height: 100%;
}
.multiple-opt .answer-item input[type="radio"]:checked + label::after,
.multiple-opt .answer-item input[type="checkbox"]:checked + label::after {
    content: none !important;
}

.multiple-opt-small .answer-item label {
    padding: 1rem 1rem;
}

.multiple-opt-small .answer-item img {
    max-width: 50%;
    margin: 1rem;
}

/** Triade */

.triadeQuestion .survey-question-help::before,
.triadeQuestion .triade-container .triade-cancel:before,
.triadeQuestion .triade-container .triade-cancel.checked:before{
    color: rgb(var(--color-secondary-rgb));
}
 .triadeQuestion .triade-draggable {
     background-color: rgb(var(--color-secondary-rgb));
     border-color: rgb(var(--color-secondary-rgb));
     transition: transform 0.3s, box-shadow 0.3s; /* Voeg een overgang toe voor een soepele animatie */
     /* 3D-effect */
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2), 0 8px 20px rgba(0, 0, 0, 0.1); /* Schaduw voor diepte */
 }

 .triadeQuestion .ui-draggable-dragging {
	background-color:  rgb(var(--color-secondary-tint-rgb));
}

.triadeQuestion .triade-draggable-droppable {
	background-color: rgb(var(--color-primary-rgb));
}

.triadeQuestion .triade-draggable-dropped {
    background-color: rgb(var(--color-primary-tint-rgb));
}

.triadeQuestion .triade-draggable:hover {
    transform: translateY(-5px) scale(1.05); /* Verhoog de hoogte en schaal bij hover */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3), 0 16px 40px rgba(0, 0, 0, 0.2); /* Versterk de schaduw bij hover */
}

.triade-draggable {
    animation: jump 1.5s infinite; /* Puls animatie */
}

.triade-draggable-droppable {
    animation: none;
}

@keyframes jump {
    0% {
        transform: translateY(0) scale(1);
    }
    30% {
        transform: translateY(-10px) scale(1.1); /* Spring omhoog en vergroot iets */
    }
    50% {
        transform: translateY(0) scale(1); /* Terug naar de originele positie */
    }
    70% {
        transform: translateY(-5px) scale(1.05); /* Een subtiele tweede sprongetje */
    }
    100% {
        transform: translateY(0) scale(1); /* Terug naar de originele positie */
    }
}

 /**lengte dropdown balk volledig*/
.form-inline .form-group{
    flex-wrap: wrap;
    gap: 8px;
	display: flex !important;
	width: 100% !important;
}
.selectize-input{
	width:100% !important;
}
.form-control {
	max-width: 100% !important;
	width: 100% !important;
    /* border-radius: 1.5rem; */
    border-radius: 20px;
}
.selectize-dropdown{
	width: 100% !important;
}
.selectize-control.single{
	width: 100% !important;
}
.yesno-button{
	width: 100% !important;
}
/** Playfull */
#ls-button-previous {
    margin-left: -2rem;
}
#ls-button-submit {
    margin-right: -2rem;
}
.question-container {
    /* border-radius: 2rem; */
    border-radius: 20px;
    background-color: #fff;
    box-shadow: 0 0 33px rgb(0 0 0 / 15%);
}
.question-title-container {
    padding-bottom: 16px !important;
}
.question-text {
	/* border-radius: 1.125rem; */
    border-radius: 40px;
    display: inline-block;
    padding: 1rem 2rem;
    margin-left: -4rem;
    background: linear-gradient(90deg, rgba(var(--color-primary-rgb),1) 0%, rgba(var(--color-primary-tint-rgb),1) 100%) !important;
    box-shadow: 0 0 14px rgb(0 0 0 / 15%);
    min-width: 75%;
}

.ls-label-question {
    color: #fff !important;
    font-weight: 500;
}
/* Kleur vragen aanpassen */
.ls-label-question > h2, h3 {
    color: #fff !important;
    font-size: 1.8rem;
}
h3 {
    color: var(--color-primary) !important;
}
/** mobiele weergav*/
@media only screen and (max-width: 600px) {
    body {
        background-color: #fff;
    }
    #navigator-container {
        margin-top: -40px;
    }
    .question-container {
        background-color: #fff;
        box-shadow: 0 0 14px rgb(0 0 0 / 15%);
        padding: 1rem;
    }
    .group-container {
        padding-left: unset;
        padding-right: unset;
    }
    .question-text {
        display: block;
        padding: 1rem 2rem;
        margin: 0;
        background-color: #fff;
        box-shadow: none;
    }

    .ls-label-question {
        /* font-weight: bold; */
    }

    .image-radio .radio-item img {
        max-height: 80px;
    }
    #dynamicReloadContainer,
    .dynamicReloadContainer {
        padding: 16px !important;
    }
}
@media only screen and (max-width: 375px) {
    .question-container {
        background-color: transparent !important;
        box-shadow: unset !important;
        border: unset !important;
    }
    .question-text {

    }
    .question-title-container {
        padding-left: unset !important;
        padding-right: unset !important;
        margin-bottom: 8px !important;
        width: 100%;
    }
    .footer-container {
        font-size: x-small;
    }
}
/**Wit regels instellen*/
body{
	line-height: 2.8rem !important;
}

@media (max-width: 767px) {
	#bootstrap-alert-box-modal {
		bottom: unset;
	}
    .ls-answers.answers-list.radio-list.multiple-list {
        flex-direction: column;
    }
    body {
        padding-top: 0px !important;
        hyphens: none !important;
    }
}
/** Privacy */
.fruity .panel-primary>.panel-heading {
    background-color: rgba(var(--color-primary-rgb));
    border: 1px solid  rgba(var(--color-primary-rgb));
    border-radius: 15px 15px 0 0;
}

.fruity .panel-primary {
    border: 1px solid  rgba(var(--color-primary-rgb));
}

.privacy.row {
    padding: 15px 15px;
}
/** overig */
.group-description.row.well.space-col{
    background-color: transparent;
    border: none;
    box-shadow: none;
}

dt {
    color: rgba(var(--color-primary-rgb));
    font-weight: 500;
}

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

.select-sortable-lists .list-unstyled  {
    list-style: auto;
    padding-left: 10px;
    height: auto;
}
/* Voortgangs balk */
/* .top-container .container-fluid {
    width: 33%;
    max-width: 1200px;
    align-self: center;
}
@media only screen and (max-width: 1200px) {
    .top-container .container-fluid {
        width: 66%;
    }
} */
/* WCAG */
li:has(:focus-visible),
.privacy:has(input:focus-visible),
label:has(input:focus-visible),
li:focus
.privacy:focus,
label:focus
.table-array-radio td:focus,
.btn:focus-visible,
label .focus,
label .active,
.btn.focus,
.btn.active.focus,
td:has(:focus-within),
input:active,
input:focus,
input:focus-visible,
textarea:active,
textarea:focus,
textarea:focus-visible,
.navbar-header button:focus-visible {
    outline: 2px dashed #000 !important;
    /* z-index: 1010; */
    outline-offset: 0;
    -webkit-box-shadow: 0 0 0 2px #fff;
    box-shadow: 0 0 0 2px #fff !important;
}

.navbar-fixed-top{
    z-index: 9999;
}

.tooltip {
    z-index: 1 !important;
}

.navbar-header button:focus-visible {
    border-radius: unset !important;
}

label.btn.btn-primary.active {
    border: none !important;
}
.hasFocus {
    background: rgba(var(--color-primary-tint-rgb)) !important;
    outline: var(--outline) !important;
    outline-offset: var(--outline-offset) !important;
}
/** ranking zichtbaar maken. Gebeurt ook met een tab*/
.js .ls-js-hidden-sr:has(:focus-visible) {
    position: unset;
    top: unset;
    width: unset;
    white-space: unset;
    height: unset;
    overflow: unset;
     clip: unset;
 }
 /* Tekst invoer */
.fruity .form-control {
    color: #222;
    background-color: #fff;
    border: 1px solid #222;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
}

.text-info, .fruity .text-info {
    color: #222 !important;
    font-size: 1.8rem;
}

.help-block.slider-min-block,
.help-block.slider-max-block {
    color: #222;
}
.ls-no-js-hidden.panel-footer {
    border-radius: 0 0 15px 15px;
}

.panel-heading {
    border-radius: 40px 15px 0 0;
}

.panel.panel-primary    {
    border-radius: 17px 17px 15px 15px;
}

.fruity .panel-footer {
    background-color: #fff !important;
    border: none !important;
}
.fruity .dropdown-menu>li>a:focus {
    color: #fff;
    background-color:rgba(var(--color-primary-tint-rgb)) !important;
}
/** array vraag */

.array-vraag {
    font-weight: bold;
}

button.close {
    padding: 0.25em;
}
.close {
    opacity: 1;
}

.checkbox-item input[type="checkbox"] {
    opacity: 1;
    z-index: unset;
}

.ls-privacy-body,
.text-primary {
    padding: 0 15px;
}

.question-help-container .col-sm-4 > img,
.sortable-choice li > img,
.list-samechoiceheight .sortable-list  {
    /* border-radius: 1.125rem; */
    border-radius: 20px;
}

/** Matrix remove borders and round the borders */
table {
    margin-left: -10px !important;
    border-spacing: 10px;
    border-collapse: separate;
}

.fruity .table-bordered,
td,
th {
 border-color: transparent !important;
 /* border-radius: 1.25rem !important; */
 border-radius: 20px;
}

#outerframeContainer {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}
@media (min-width: 766px) {
    #outerframeContainer {
        padding-left: 4rem !important;
        padding-right: 4rem !important;
    }
}

/** Bij klein mobiel scherm */

.navigator-container {
    background-color: #55367e;
}

/** Custom .info-text */
.info-text {
    border: unset !important;
    box-shadow: unset !important;
    background-color: unset !important;
    margin: 0 !important;
    letter-spacing: 0.3px;
    font-family: 'Paytone One';
    font-style: normal;
    font-weight: 400;
}

.info-text .question-text {
    border-radius: 40px;
    display: inline-block;
    /* padding: 2rem 4rem; */
    padding: 5% 10%;
    text-align: center;
    margin-left: unset !important;
    background: rgb(var(--color-Quaternary-rgb)) !important;
    box-shadow: 0 0 14px rgb(0 0 0 / 15%);
    min-width: 100%;
}

.info-text .question-title-container {
    padding-bottom: 35px !important;
    padding-left: unset !important;
    padding-right: unset !important;
}

.disable-slider-number .tooltip-inner {
    display: none;
}

.disable-slider-number .tooltip.top .tooltip-arrow {
    bottom: -15px;
    margin-left: -10px;
    border-width: 10px 10px 0;
}

.image-radio-small .answer-item label {
    padding: 5px 0;
    display: flex;
    justify-items: center;
    align-items: center;
    font-size: small;
}

.image-radio-small .answer-item label p {
    margin: 0;
}

#question1000 .answer-item  {
    height: 80px;
}

.image-radio-small .answer-item img {
    max-width: 50px !important;
    margin: 0;
    margin-right: 10px;
    max-height: 50px;
    width:auto !important;
}

.image-radio-small input[type="checkbox"]{
    z-index: -1 !important;
    outline: unset !important;
}

.hide-slider-label .slider-left,
.hide-slider-label .slider-right {
    color: transparent !important;
}

.hide-slider-label .slider.slider-horizontal .slider-track {
    height: 20px !important;
    margin-top: -11px;;
}

.hide-slider-label .slider-handle {
    height: 30px !important;
    width: 30px !important;
    top: -5px !important;
}


/* JLAM CUSTOM CSS */
.JLAM-header {
    height: 32px;
    color: var(--color-primary);
    background-color: var(--color-primary);
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    overflow: hidden;
}

.JLAM-header-text {
    color: var(--color-tertiary);
}

.JLAM-header-text span {
    padding-left: calc(1.2em / 2);
    padding-right: calc(1.2em / 2);
    padding-top: 0.6em;
    padding-bottom: 0.6em;
    font-style: normal;
    font-weight: 200;
    font-size: 12px;
    letter-spacing: 0.075em;
}

#chat-button {
   display: none !important;
   background: unset !important;
   border: none;
   position: fixed;
   bottom: 10px;
   right: 10px;
   box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 4px, rgba(0, 0, 0, 0.2) 0px 2px 12px;
   border-radius: 50%;
   height: 60px;
   width: 60px;
   z-index: 1;
}

.progress-icon {
    /* position: relative; */
    top: 15%;
    left: 50%;
    width: 40px;
    height: 40px;
    /* margin:-40px 0 0 -40px; */
}

.animate__animated {
    animation-duration: 1s !important;
}

.spin-once {
    position: relative;
    -webkit-animation: spin 0.25s linear 2; /* 1 second per spin, 3 iterations */
    -moz-animation: spin 0.25s linear 2;    /* 1 second per spin, 3 iterations */
    animation: spin 0.25s linear 2;         /* 1 second per spin, 3 iterations */
}

.spin {
    position: relative;
    animation: spin 45s linear infinite; /* Keep the original infinite spin for .spin class */
    -webkit-animation:spin 45s linear infinite;
    -moz-animation:spin 45s linear infinite;
}

@-moz-keyframes spin {
    100% { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform:rotate(360deg);
    }
}

.lowercase {
    text-transform: lowercase;
}

.top-header-link {
    color: var(--color-tertiary) !important;
    padding-left: calc(1.2em / 2) !important;
    padding-right: calc(1.2em / 2) !important;
    padding-top: 0.6em !important;
    padding-bottom: 0.6em !important;
    font-style: normal !important;
    font-weight: 200 !important;
    font-size: 12px !important;
    letter-spacing: 0.075em !important;
}

.slider-list .slider-item .control-label {
    margin-top: unset;
}

.gezondheid-img {
    height: 50px !important;
    width: auto !important;
}

#question15118 .slider-container {
    /* padding-top: 40px; */
}
#question15118 h3 {
    margin-top: 0 !important;
}

#question15111  {
    background-color: var(--color-primary) !important;
}

.help-text-leefstijlroer {
    color: var(--color-Quaternary);
    font-size: small;
    padding-left: 9px;
}

.animate__shakeX,
.animate__pulse {
    animation-duration: 0.25s !important;
}

#leefstijl-notification {
    position: absolute;
    display: none;
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
    margin: 8px 0;
    border-radius: 24px;
    line-height: 1.35;
    font-size: small;
    padding: 40px;
    max-width: 100%;
    margin-right: 15px;
    text-align: center;
    hyphens: none;
}

.leefstijlroer-text-container {
    background-color: #FFFFFF;
    padding: 8px;
    margin: 8px 0;
    border-radius: 24px;
    line-height: 1.35;
    font-size: small;
    padding: 9px;
}

.leefstijlroer-text-container:hover {
    cursor: pointer;
}


.leefstijlroer-text-container h3 {
    color: var(--color-secondary) !important;
    text-align: center !important;
}

.leefstijlroer-img-container {
    background-color: var(--color-tertiary);
    border-radius: 24px;
    text-align: center;
    padding: 16px;
    margin-bottom: 8px;
}

.Arts-en-leefstijl {
    width: 50%;
    height: auto;
    display: none;
}

.leefstijl-col {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.leefstijl-row {
    display: flex;
}

.leefstijlroer-container {
    margin-top: 8px;
    display: block;
}

.leefstijl-center-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.leefstijlroer-container input {
    position: absolute;
    opacity: 0;
}

.middelen.checked {
    border: 5px  #fff solid;
    background-color: #F39118;
    /* outline: 2px white solid; */
    padding: 4px;
    color: #fff !important;
}

.voeding.checked {
    border: 5px #fff solid;
    background-color:#026331;
    /* outline: 2px white solid; */
    padding: 4px;
    color: #fff !important;
}

.verbinding.checked {
    border: 5px #fff solid;
    background-color: #E3051B;
    /* outline: 2px white solid; */
    padding: 4px;
    color: #fff !important;
}

.slaap.checked {
    border: 5px #fff solid;
    background-color: #153D70;
    /* outline: 2px white solid; */
    padding: 4px;
    color: #fff !important;
}

.ontspanning.checked {
    border: 5px #fff solid;
    background-color: #FFCC00 !important;
    /* outline: 2px white solid; */
    padding: 4px;
    color: #fff !important;
}

.beweging.checked {
    border: 5px #fff solid;
    background-color: #66B132;
    /* outline: 2px white solid; */
    padding: 4px;
    color: #fff !important;
}

.checked h3 {
    color: #fff !important;
}
/* #question15094 .question-text, */
.group-title,
#question15092,
#question15111 .answer-container  {
    display: none !important;
}

#question15094 .ls-answers {
    display: flex;
    flex-direction: row;
    gap: 10px;
}

#question15094 label {
    align-content: center !important;
}

#question15094 .bootstrap-buttons-div,
#question15094 .button-item {
    display: flex;
}

#question15094 .button-item {
    min-height: 124px;

}

#ls-button-submit {
    margin-bottom: 40px;
    background-color: var(--color-secondary) !important;
}

#answer788363X533X15118Fysiekslid-container .slider-handle.min-slider-handle.round {
    background-image: url('https://ls.vertelpunt.nl/upload/surveys/788363/images/lichaam.png') !important;
    background-size: cover !important; /* Ensures the image covers the entire slider handle */
    background-repeat: no-repeat !important; /* Prevents the image from repeating */
    background-position: center !important; /* Centers the image within the slider handle */
    transform: translateX(-10px);
    height: 40px;
    width: 40px;
    top: -10px !important;
    margin-right: 10px !important;
}

.tooltip-inner {
    display: none;
}

.tooltip.top .tooltip-arrow {
    bottom: -20px !important;
    border-width: 8px 8px 0;
    margin-left: -8px;
}

#question15118 .slider-handle.min-slider-handle.round {
    background-size: cover !important; /* Ensures the image covers the entire slider handle */
    background-repeat: no-repeat !important; /* Prevents the image from repeating */
    background-position: center !important; /* Centers the image within the slider handle */
    transform: translateX(-10px);
    height: 40px;
    width: 40px;
    top: -10px !important;
    margin-right: 10px !important;
}

#question15118 .tooltip.top .tooltip-arrow {
    bottom: 0 !important;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}

#question15118 .tooltip-inner {
    display: block;
}

#question15118 .slider .tooltip.top {
    margin-top: -46px;
}

#answer788363X533X15118Mentaalslid-container .slider-handle.min-slider-handle.round {
    background-image: url('https://ls.vertelpunt.nl/upload/surveys/788363/images/mentaal.png') !important;
}

#answer788363X533X15118Zingevingslid-container .slider-handle.min-slider-handle.round {
    background-image: url('https://ls.vertelpunt.nl/upload/surveys/788363/images/Zingeving.png') !important;

}
#answer788363X533X15118Welzijnslid-container .slider-handle.min-slider-handle.round {
    background-image: url('https://ls.vertelpunt.nl/upload/surveys/788363/images/Kwaliteit.png') !important;

}
#answer788363X533X15118Meedoenslid-container .slider-handle.min-slider-handle.round {
    background-image: url('https://ls.vertelpunt.nl/upload/surveys/788363/images/meedoen.png') !important;
}
#answer788363X533X15118Dagelijksslid-container .slider-handle.min-slider-handle.round {
    background-image: url('https://ls.vertelpunt.nl/upload/surveys/788363/images/dagelijks.png') !important;
}

.welkomst-tekst {
    font-family: 'Nunito', sans-serif !important;
    font-size: 1.8rem !important;
    line-height: 1.6 !important;
    position: relative !important;
    font-weight: 100 !important;
}

#welkomst-img {
    max-width: 100%;
    height: auto;
    border-radius: 2rem 100% 2rem 2rem;
}
.footer-top {
    display: none;
}

@media (min-width: 991px) {
    #welkomst-img {
        padding-right: 40px;
    }
    #limesurvey {
        margin-bottom: 230px;
    }
}

@media (min-width: 1110px) {
    .footer-top {
        display: block;
    }
}

.survey-welcome .container {
    display: flex;
    flex-direction: column;
    align-items: stretch; /* Ensures that child rows take full width */
    padding-top: 10px;
}

.survey-welcome .row {
    display: flex;
    flex-direction: row;
    width: 100%; /* Ensure rows take full width */
}

.survey-welcome .col-md-6 {
    flex: 0 0 50%;
    max-width: 50%;
    box-sizing: border-box; /* Ensures padding/margin doesn't affect width calculation */
    animation-duration: 1s;
}

.welkomst-tekst {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Centers the text vertically */
}

#welcome-container {
    width: 100% !important;
    margin-top: 160px;
}

.has-survey-welcome {
    padding: 0 !important;
}

.question-text a {
    color: var(--color-Quaternary) !important;
}

.chapter-stepper {
    width: 100% !important;
}

.top-container .row {
    display: flex !important;
    flex-wrap: wrap;
    flex-direction: row !important;
    justify-content: space-around;
}

.top-container .col-md-2 {
    text-align: center;
}

.top-container h3 {
    margin: 0 !important;
    font-size: small;
}

.stepper-img-container {
    height: 44px;
}

.top-container {
    margin-bottom: 10px !important;
}

.top-container .active {
    border-bottom: var(--color-primary) 4px solid;
}

.chapter-stepper .completed .stepper-img-container {
    background-image: url("https://ls.vertelpunt.nl/tmp/assets/8dc57f2f/Asset-1.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    filter: grayscale(1);
    opacity: 0.5;


}
.av-contains-svg {
    /* position: absolute; */
    top: 39px;
    box-shadow: none !important;
}

@media (max-width: 769px) {
    .top-container .col-md-2 {
        padding-right: 8px !important;
        padding-left: 8px !important;
    }
    .JLAM-header-text span {
        font-style: normal;
        font-weight: 200;
        font-size: 10px;
        letter-spacing: 0.075em;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }
    .av-contains-svg {
        position: unset;
        top: unset;

    }
}

@media (max-width: 769px) {
    .leefstijl-row {
        flex-direction: column;
    }
    #question15094 .ls-answers {
        flex-direction: column;
    }
    #question15094 .button-item {
        align-items: center;
    }
    .leefstijlroer-img-container {
        order: 1;
    }
    .leefstijl-col {
        order: 2;
    }
    .survey-welcome .row {
        flex-direction: column;
    }
    .survey-welcome .col-md-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .img-column {
        justify-content: center; /* Center the image on smaller screens if needed */
    }
    .welkomst-tekst {
        justify-content: center; /* Center the text on smaller screens if needed */
    }
    #welkomst-img {
        padding-right: 10px;
        margin-bottom: 20px;
    }
}
@media (max-width: 601px) {
    .privacy {
        margin-bottom: 60px !important;
    }
}

@media (max-width: 576px) {
    #outerframeContainer,
    #dynamicReloadContainer {
        padding: 0 4px 0 4px !important;
    }
    .triadeQuestion,
    .answer-container {
        padding: 0 !important;
    }
    .navbar-brand {
        margin: 0 !important;
    }
    .info-text .question-text {
        font-size: 1.4rem !important;
    }
}
@media (max-width: 500px) {
    .container-all-logos {
        padding-top: 8px !important;
    }
    .logo-container>img {
        max-height: 70px !important;
    }
}
@media (max-width: 455px) {
    .modal-footer a {
        margin-bottom: 8px !important;
        padding: 16px !important;
        width: 100%;
    }
    .modal-footer .btn {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .top-container .row {
        justify-content: center !important;
    }
}

@media (max-width: 389px) {
    .av-contains-svg {
        display: none;
    }
}

.btn-nah {
    background: var(--color-nah) !important;
    background-color: var(--color-nah) !important; /* Rood */
}
.btn-migraine {
    background: var(--color-migraine) !important;
    background-color: var(--color-migraine) !important; /* Groen */
}
.btn-ms {
    background: var(--color-ms) !important;
    background-color: var(--color-ms) !important; /* Blauw */
}
.btn-parkinson {
    background: var(--color-parkinson) !important;
    background-color: var(--color-parkinson) !important; /* Oranje */
}
.btn-nah-migraine {
    background: var(--color-nah-migraine) !important;
    background-color: var(--color-nah-migraine) !important; /* Purple */
}
.btn-terug {
    background: var(--color-primary)  !important;
    background-color: var(--color-primary) !important; /* Zwart */
}

.afsluiter .col-md-12 {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    text-align: center !important;
}

.afsluiter .col-md-6 button {
    width: 100% !important; /* Zorgt ervoor dat alle knoppen even breed zijn */
    margin-bottom: 10px !important; /* Ruimte tussen de knoppen */
    max-width: 300px !important; /* Optioneel: maximale breedte van de knoppen */
}

.afsluiter .col-md-6 button:hover {
    background: var(--color-secondary) !important;
    background-color: var(--color-secondary) !important;
    color: var(--color-secondary-contrast) !important;
}
.migraine-logo-container, .parkinson-logo-container, .ms-logo-container, .nah-logo-container {
    display: none;
    padding: 0 8px;
}
.default-title, .migraine-title, .ms-title, .parkinson-title, .nah-title {
    /* display: none; */
    justify-self: center !important;
}
.top-title-container {
    justify-items: center !important;
}
.top-title-container h1 {
    margin-bottom: 0 !important;
}

/* Titelgroepen styling */
.title-hidden {
    display: none !important;
}
.title-group h1, .default-title h1 {
    font-family: 'Paytone One', 'Public Sans', sans-serif;
    font-size: 3.2rem;
    margin-bottom: 0.5rem;
    text-align: center;
    letter-spacing: 0.03em;
}
.title-group h2 {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 2rem;
    font-weight: 400;
    margin-bottom: 1.5rem;
    text-align: center;
    /* color: var(--color-primary-tint); */
    color: #222 !important;
}
.migraine-title h1 { color: var(--color-migraine) !important; }
.ms-title h1 { color: var(--color-ms) !important; }
.parkinson-title h1 { color: var(--color-parkinson) !important; }
.nah-title h1 { color: var(--color-nah) !important; }

/* Fade-in animatie voor titels */
@keyframes fadeInTitle {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.title-group, .default-title {
    opacity: 0;
    animation: fadeInTitle 0.7s ease forwards;
}
.title-group:not(.title-hidden), .default-title:not(.title-hidden) {
    opacity: 1;
}
.title-group h2 {
    color: #666 !important; /* Iets lichter voor hiërarchie */
    font-weight: 400;
}
input.numeric {
    text-align: left !important;
    width: 150px !important;
}

.img-column {
    display: flex;
    flex-direction: column;
    justify-content: flex-end; /* Aligns the image at the bottom */
    animation-duration: 0.25s !important;
}

.accept-privacy-btn-text {
    text-align: start !important;
}

@media (min-width: 769px) {
    .img-column {
        padding-left: 0 !important;
    }
}