/******************
    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
    
    #outerframeContainer {
    -webkit-hyphens: none!important;
    -o-hyphens: none!important;
    hyphens: none!important;
}
    
*/

/* General adjustments */
body {
    -webkit-hyphens: none!important;
    -o-hyphens: none!important;
    hyphens: none!important;
     padding-bottom: 0; /* no bottom padding, footer should be bottom aligned */
     flex-direction: column; /* article, then footer */
     display: flex; /* flex, to extend the content to full size */
     min-height: 100vh; /* full height, to bottom-align footer */
}
#outerframeContainer {
    -webkit-hyphens: none!important;
    -o-hyphens: none!important;
    hyphens: none!important;
}
body > article {
    flex: 1; /* the main article should use as much space as possible */
}

.asterisk {
    font-size:1rem;
    vertical-align:top!important;
    margin-top:-5px;
}
.top-container, .question-container .question-title-container, .group-container .group-title {
    margin:0px!important;
}
.question-container {
    margin-bottom: 2em;
}
.text-align-right {
    text-align: right;
}
.question-container .ls-question-message, .question-container .ls-questionhelp {
    font-size: 1rem;
}

/* Captcha */
.frc-captcha {
    overflow:visible !important;
}
.frc-i-widget {
    left:0px;
}

/* Welcome page (group-0) */
#group-0 .group-title, #group-0 .group-description, #group-0 .question-title-container, .form-captcha  {
    max-width:80%;
}
#group-0 .full-text-display div {
    max-width:100%;
}
.group-container .group-description, .default-text-display div {
    font-size: 18px!important;
    line-height: 26px!important;
    font-weight: 400!important;
}
.small-text-display div {
    font-size: 14px!important;
    line-height: 20px!important;
    font-weight: 400!important;
}
.default-text-display .question-valid-container, .full-text-display .question-valid-container, .small-text-display .question-valid-container {
    display:none;
}

/* Question-specific changes */
.custom-help-text .ls-em-tip em_default, .custom-help-text .ls-em-tip {
    display:none;
}
.ls-answers ul {
    margin-bottom:0;
}
li.answer-item {
    margin-bottom:0.5em;
}
.other-text-item {
    margin-top: -8px;
}
.consent-text ul:first-child {
    margin-top:20px;
}
.consent-text li {
    padding: 0.5rem;
    font-size: 16px;
    line-height: 20px;
}
.consent-text, .consent-form {
    margin-top: 0px!important;
    margin-bottom: 0px!important;
}
.consent-form .question-title-container, .consent-form .ls-question-mandatory-multiplechoice {
    display:none;
}
.slider-list .ls-slider-item-horizontal .slider.slider-horizontal .slider-track {
    height: 7px;
    margin-top: -4px;
}
.slider-list .ls-slider-item-horizontal .slider-container {
    padding: 10px 20px;
}
.select-sortable-lists:not(.ranking-advanced-style) .sortable-rank-subtitle {
    display:block;
    margin: 15px 0px;
}

/* Responsive logo */
.navbar-brand {
    height:60px;
    min-height:40px!important;
}
.logo-container > img {
    max-height:100%!important;
    padding:10px 0px!important;
}
.brand-logo .top-container .top-content {
    margin-top:0px!important;
    padding-top:0px!important;
}
@media (max-device-width: 760px) {
    .navbar-brand {
        height:40px!important;
    }
    .navbar {
        padding:5px 0px!important;
    }
    .logo-container > img {
        max-height:100%!important;
        padding:5px 0px!important;
    }
    #group-0 .group-title, #group-0 .group-description, #group-0 .question-title-container, .group-description, .completed-wrapper, .form-captcha  {
        max-width:100%;
    }
}

:root{
  --my-primary: #FF515F;          /* <— set your new HEX here */
  --my-primary-rgb: 255, 81, 95;  /* <— same color as R,G,B */
}