/******************
    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
*/
:root {
  --bs-primary: #ff9600;
  --bs-primary-dark: #ff7e00;
  --bs-secondary: #0091a3;
  --bs-secondary-dark: #007180;
  --bs-info: #1FA138;
  --bs-info-rgb: 0, 145, 163;
}

.navbar-toggler .navbar-toggler-text {
    font-size: .7em;
    position: relative;
    top: -6px;
}

#welcome-container {
  max-width: unset;
}
.question-container .asterisk {
    vertical-align: 1em;
    font-size: 0.5em;
    color: var(--bs-primary-dark);
}
#outerframeContainer {
  word-wrap: unset;
  -webkit-hyphens: unset;
  -o-hyphens: unset;
  hyphens: unset;
}

.btn-primary {
  color: #000;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-primary:hover {
  color: #000;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-primary:disabled, .btn-primary.disabled {
  color: #000;
  background-color: var(--bs-primary-dark);
  border-color: var(--bs-primary-dark);
}

.btn-outline-primary {
  color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-outline-primary:hover {
  color: #000;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {
  color: #000;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-outline-primary:disabled, .btn-outline-primary.disabled {
  color: var(--bs-primary);
  background-color: transparent;
}
.link-primary {
  color: var(--bs-primary);
}
.link-primary:hover, .link-primary:focus {
  color: #f1736b;
}
.border-primary {
  border-color: var(--bs-primary) !important;
}
.fruity_twentythree .input-group-addon {
  color: white;
  background-color: var(--bs-primary);
}
.fruity_twentythree .label-primary {
  background-color: var(--bs-primary);
}
.fruity_twentythree .label-success {
  background-color: var(--bs-primary);
}
.fruity_twentythree .card-primary {
  border: 1px solid var(--bs-primary);
}
.fruity_twentythree .card-primary > .card-header {
  color: #ffffff;
  background-color: var(--bs-primary);
  border: 1px solid var(--bs-primary);
}
.fruity_twentythree .card-primary > .card-header + .panel-collapse .card-body {
  border-top-color: var(--bs-primary);
}
.fruity_twentythree .card-primary > .card-footer + .panel-collapse .card-body {
  border-bottom-color: var(--bs-primary);
}
.fruity_twentythree .card-success > .card-header {
  color: var(--bs-primary);
  background-color: white;
  border: 1px solid white;
}
.fruity_twentythree .nav-pills > li.active > a:focus {
  color: #ffffff;
  background-color: var(--bs-primary);
}
.fruity_twentythree .nav-pills > .active > a > .badge {
  color: var(--bs-primary);
  background-color: #ffffff;
}
.fruity_twentythree .container-fluid .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .fruity_twentythree .container-sm .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .fruity_twentythree .container-md .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .fruity_twentythree .container-lg .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .fruity_twentythree .container-xl .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .fruity_twentythree .container-xxl .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.fruity_twentythree .container-fluid .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.fruity_twentythree .container-sm .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.fruity_twentythree .container-md .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.fruity_twentythree .container-lg .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.fruity_twentythree .container-xl .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.fruity_twentythree .container-xxl .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
  color: #fff;
  background: var(--bs-primary);
}
.fruity_twentythree .em-function {
  color: var(--bs-primary);
}
.fruity_twentythree #carousel-example-generic .carousel-control {
  color: var(--bs-primary);
}
.fruity_twentythree #carousel-example-generic .card-title {
  color: var(--bs-primary);
}
.fruity_twentythree #carousel-example-generic .carousel-indicators .active {
  background-color: var(--bs-primary);
}
.fruity_twentythree #carousel-example-generic .carousel-indicators li {
  border: 1px solid var(--bs-primary);
}

@keyframes preload-cycle-1 {
  5% {
    transform: rotateZ(60deg) rotateY(90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
  10%, 75% {
    transform: rotateZ(60deg) rotateY(0) rotateX(0deg);
    border-left-color: #ef665d;
  }
  80%, 100% {
    transform: rotateZ(60deg) rotateY(90deg) rotateX(0deg);
    border-left-color: var(--bs-primary);
  }
}
@keyframes preload-cycle-2 {
  10% {
    transform: rotateZ(120deg) rotateY(90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
  15%, 70% {
    transform: rotateZ(120deg) rotateY(0) rotateX(0deg);
    border-left-color: #ef665d;
  }
  75%, 100% {
    transform: rotateZ(120deg) rotateY(90deg) rotateX(0deg);
    border-left-color: var(--bs-primary);
  }
}
@keyframes preload-cycle-3 {
  15% {
    transform: rotateZ(180deg) rotateY(90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
  20%, 65% {
    transform: rotateZ(180deg) rotateY(0) rotateX(0deg);
    border-left-color: #ef665d;
  }
  70%, 100% {
    transform: rotateZ(180deg) rotateY(90deg) rotateX(0deg);
    border-left-color: var(--bs-primary);
  }
}
@keyframes preload-show-4 {
  from {
    transform: rotateZ(240deg) rotateY(-90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
}
@keyframes preload-hide-4 {
  to {
    transform: rotateZ(240deg) rotateY(-90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
}
@keyframes preload-cycle-4 {
  20% {
    transform: rotateZ(240deg) rotateY(90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
  25%, 60% {
    transform: rotateZ(240deg) rotateY(0) rotateX(0deg);
    border-left-color: #ef665d;
  }
  65%, 100% {
    transform: rotateZ(240deg) rotateY(90deg) rotateX(0deg);
    border-left-color: var(--bs-primary);
  }
}
@keyframes preload-show-5 {
  from {
    transform: rotateZ(300deg) rotateY(-90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
}
@keyframes preload-hide-5 {
  to {
    transform: rotateZ(300deg) rotateY(-90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
}
@keyframes preload-cycle-5 {
  25% {
    transform: rotateZ(300deg) rotateY(90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
  30%, 55% {
    transform: rotateZ(300deg) rotateY(0) rotateX(0deg);
    border-left-color: #ef665d;
  }
  60%, 100% {
    transform: rotateZ(300deg) rotateY(90deg) rotateX(0deg);
    border-left-color: var(--bs-primary);
  }
}
@keyframes preload-show-6 {
  from {
    transform: rotateZ(360deg) rotateY(-90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
}
@keyframes preload-hide-6 {
  to {
    transform: rotateZ(360deg) rotateY(-90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
}
@keyframes preload-cycle-6 {
  30% {
    transform: rotateZ(360deg) rotateY(90deg) rotateX(0deg);
    border-left-color: #bb1c12;
  }
  35%, 50% {
    transform: rotateZ(360deg) rotateY(0) rotateX(0deg);
    border-left-color: #ef665d;
  }
  55%, 100% {
    transform: rotateZ(360deg) rotateY(90deg) rotateX(0deg);
    border-left-color: var(--bs-primary);
  }
}
@keyframes animate-gradient {
  0% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 1px, #ffffff 2px, #ffffff 100%);
  }
  10% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 2px, #ffffff 3px, #ffffff 100%);
  }
  20% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 3px, #ffffff 4px, #ffffff 100%);
  }
  30% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 4px, #ffffff 5px, #ffffff 100%);
  }
  40% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 5px, #ffffff 6px, #ffffff 100%);
  }
  50% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 6px, #ffffff 7px, #ffffff 100%);
  }
  60% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 7px, #ffffff 8px, #ffffff 100%);
  }
  70% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 8px, #ffffff 9px, #ffffff 100%);
  }
  80% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 9px, #ffffff 10px, #ffffff 100%);
  }
  90% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 10px, #ffffff 10px, #ffffff 100%);
  }
  100% {
    background: radial-gradient(circle at center, var(--bs-primary) 0px, var(--bs-primary) 8px, #ffffff 9px, #ffffff 100%);
  }
}
.fruity_twentythree #comfortUpdateGeneralWrap h3.maintitle, .fruity_twentythree #comfortUpdateGeneralWrap .maintitle.h3 {
  background-color: transparent;
  color: var(--bs-primary);
  border-bottom: 1px solid var(--bs-primary);
}
.fruity_twentythree #comfortUpdateGeneralWrap .on span {
  display: block;
  background-color: var(--bs-primary);
  color: #fff;
}
/* Define the color for Awesome Bootsrap Checkboxes ; based on bg-primary background-color*/
body .answer-item label::after {
  background-color: var(--bs-primary);
}
.fruity_twentythree pagination > li > a {
  color: var(--bs-primary);
  background-color: #ffffff;
  border: 1px solid #dadada;
}
.fruity_twentythree .side-body h3, .fruity_twentythree .side-body .h3, .fruity_twentythree .pagetitle, .fruity_twentythree .list-surveys h3, .fruity_twentythree .list-surveys .h3 {
  color: #ffffff;
  color: #333333;
  border-bottom: solid 2px var(--bs-primary);
}
.navbar-toggle {
  border: solid 1px var(--bs-primary);
}

.navbar-toggle .icon-bar {
  background-color: var(--bs-primary);
}
.btn-primary {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #ffffff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary:active:focus, .btn-primary.dropdown-toggle.show, .btn-primary.dropdown-toggle.show:focus {
  color: #ffffff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-outline-primary {
  color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-outline-primary:hover {
  color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: 0px 0px 0px 3px rgba(123, 97, 255, 0.4);
}
.btn-outline-primary:focus, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary:active:focus, .btn-outline-primary.dropdown-toggle.show, .btn-outline-primary.dropdown-toggle.show:focus, .btn-outline-primary.show {
  color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: var(--bs-primary);
}
.btn-link {
  color: var(--bs-primary);
}
.btn-link:hover, .btn-link:focus {
  color: var(--bs-primary);
}
.btn-check + .btn-primary:hover {
  color: #ffffff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: none;
}
.btn-check + .btn-primary:active, .btn-check + .btn-primary.active, .btn-check + .btn-primary:active:focus {
  color: #ffffff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: none;
}
.btn-check:active + .btn-primary {
  color: #ffffff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: none;
}
.btn-check:checked + .btn-primary, .btn-check:checked + .btn-primary:focus, .btn-check:focus:checked + .btn-primary {
  color: #ffffff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  box-shadow: none;
}
a {
  color: var(--bs-primary);
}
a:hover {
  color: var(--bs-primary-dark);
}
.input-group-text, label .input-group-text {
  color: #ffffff;
  background-color: var(--bs-primary);
  border-color: #6E748C;
}
.has-success .form-control {
  box-shadow: 4px 4px 0 var(--bs-primary);
  z-index: 3;
}
.has-success .form-control:focus {
  box-shadow: 4px 4px 0 var(--bs-primary);
}
.radio-item label::after {
  background-color: var(--bs-primary);
}
.radio-item input[type=radio] + label::after {
  background-color: var(--bs-primary);
}

.radio-item input[type=radio]:checked + label::before {
  border-color: var(--bs-primary);
}

.radio-item input[type=radio]:checked + label::after {
  background-color: var(--bs-primary);
}

.radio-item input[type=radio]:checked + label {
  color: var(--bs-primary);
}
.checkbox-item input[type=checkbox]:checked + label {
  color: var(--bs-primary);
}
.checkbox-item input[type=checkbox]:checked + label::before {
  border-color: var(--bs-primary);
}
.checkbox-item input[type=checkbox]:checked + label::after {
  background-color: transparent;
  color: var(--bs-primary);
}

input[type=checkbox]:checked:after,
.checkbox input[type=checkbox]:checked:after,
.checkbox-inline input[type=checkbox]:checked:after {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.tempus-dominus-widget .date-container-decades div:not(.no-highlight).active,
.tempus-dominus-widget .date-container-years div:not(.no-highlight).active,
.tempus-dominus-widget .date-container-months div:not(.no-highlight).active,
.tempus-dominus-widget .date-container-days div:not(.no-highlight).active,
.tempus-dominus-widget .time-container-clock div:not(.no-highlight).active,
.tempus-dominus-widget .time-container-hour div:not(.no-highlight).active,
.tempus-dominus-widget .time-container-minute div:not(.no-highlight).active,
.tempus-dominus-widget .time-container-second div:not(.no-highlight).active {
  background-color: var(--bs-primary);
  color: #fff;
  text-shadow: none;
}
.tempus-dominus-widget .date-container-decades div:not(.no-highlight).today:before,
.tempus-dominus-widget .date-container-years div:not(.no-highlight).today:before,
.tempus-dominus-widget .date-container-months div:not(.no-highlight).today:before,
.tempus-dominus-widget .date-container-days div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-clock div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-hour div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-minute div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-second div:not(.no-highlight).today:before {
  border-bottom-color: var(--bs-primary);
  border-top-color: rgba(0, 0, 0, 0.2);
}
.tempus-dominus-widget button {
  color: #fff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.tempus-dominus-widget .date-container-years div:not(.no-highlight).today:before,
.tempus-dominus-widget .date-container-months div:not(.no-highlight).today:before,
.tempus-dominus-widget .date-container-days div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-clock div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-hour div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-minute div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-second div:not(.no-highlight).today:before {
  border-bottom-color: var(--bs-primary);
  border-top-color: rgba(0, 0, 0, 0.2);
}
.tempus-dominus-widget button {
  color: #fff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.tempus-dominus-widget .date-container-decades div:not(.no-highlight).today:before,
.tempus-dominus-widget .date-container-years div:not(.no-highlight).today:before,
.tempus-dominus-widget .date-container-months div:not(.no-highlight).today:before,
.tempus-dominus-widget .date-container-days div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-clock div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-hour div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-minute div:not(.no-highlight).today:before,
.tempus-dominus-widget .time-container-second div:not(.no-highlight).today:before {
  border-bottom-color: var(--bs-primary);
  border-top-color: rgba(0, 0, 0, 0.2);
}
.tempus-dominus-widget button {
  color: #fff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.slider.slider-horizontal .slider-tick.triangle,
.slider.slider-horizontal .slider-handle.triangle {
  border-bottom-color: var(--bs-primary);
}

.slider.slider-vertical .slider-tick.triangle,
.slider.slider-vertical .slider-handle.triangle {
  border-left-color: var(--bs-primary);
  border-right-color: var(--bs-primary);
}

.slider-tick.custom::before {
  color: var(--bs-primary);
}
.slider-list .slider .slider-handle {
  background-color: var(--bs-primary);
  background-image: unset;
}
.slider-list .slider .slider-handle.custom::before {
  color: var(--bs-primary);
}
.slider-list .slider .slider-selection {
  background-color: var(--bs-primary);
  background-image: unset;
}
.has-success .help-block {
  color: var(--bs-primary);
}
.has-success .control-label {
  color: var(--bs-primary);
}
.has-success .radio {
  color: var(--bs-primary);
}
.has-success .checkbox {
  color: var(--bs-primary);
}
.has-success .radio-inline {
  color: var(--bs-primary);
}
.has-success .checkbox-inline {
  color: var(--bs-primary);
}

.has-warning .help-block {
  color: #FFE046;
}
.has-warning .control-label {
  color: #FFE046;
}
.has-warning .radio {
  color: #FFE046;
}
.has-warning .checkbox {
  color: #FFE046;
}
.has-warning .radio-inline {
  color: #FFE046;
}
.has-warning .checkbox-inline {
  color: #FFE046;
}
.progress-bar {
  color: #ffffff;
  background-color: var(--bs-primary);
  box-shadow: none;
}
.list-group-item-success {
  color: #ffffff;
  background-color: var(--bs-primary);
}
.privacy .checkbox-item label::before {
  border: 3px solid var(--bs-primary);
}
.form-change-lang #language-changer-select {
  color: var(--bs-primary);
  background-color: transparent;
}
.form-change-lang #lang-select::after {
  cursor: pointer;
  position: relative;
  right: 16px;
  color: var(--bs-primary);
  font-family: "remixicon";
  content: "\ea50";
  z-index: 5;
}
li.imageselect-listitem .imageselect-container input.imageselect-checkbox:checked + label {
  border: 2px solid var(--bs-primary) !important;
}

li.imageselect-listitem .imageselect-container input.imageselect-checkbox:checked + label + .imageselect-radiobutton:after {
  background-color: var(--bs-primary);
}
li.imageselect-listitem .imageselect-container input.imageselect-checkbox:checked + label + .imageselect-radiobutton:before {
  border-color: var(--bs-primary);
}
input.imageselect-checkbox:checked ~ .imageselect-select::before {
  border-color: var(--bs-primary);
}

input.imageselect-checkbox:checked ~ .imageselect-select::after {
  background-color: #fff;
  color: var(--bs-primary);
}
.select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-item {
  border: 1px solid var(--bs-primary);
  color: #1E1E1E;
}
.ranking-advanced-style .sortable-rank,
.ranking-advanced-style .ranking-advanced-sorted-items .sortable-item {
  border: 2px solid var(--bs-primary);
}
.ranking-advanced-style .sortable-rank .selector__dragHandle.d-none,
.ranking-advanced-style .sortable-rank .selector__index_row,
.ranking-advanced-style .ranking-advanced-sorted-items .sortable-item .selector__dragHandle.d-none,
.ranking-advanced-style .ranking-advanced-sorted-items .sortable-item .selector__index_row {
  color: var(--bs-primary);
}
.numeric-multi .ls-group-total-separator hr {
  border-color: var(--bs-primary);
  opacity: 1;
}
.numeric-multi .ls-group-total .control-label {
  color: var(--bs-primary);
}
.numeric-multi .dynamic-total.text-success {
  color: var(--bs-primary) !important;
}
.dropdown-menu > li > a:hover {
  color: #ffffff;
  background-color: var(--bs-primary) !important;
}
.dropdown-menu > li > a:focus {
  color: #ffffff;
  background-color: var(--bs-primary) !important;
}
.dropdown-menu > .active > a {
  color: #ffffff;
  background-color: var(--bs-primary) !important;
}
.dropdown-menu > .active > a:hover {
  color: #ffffff;
  background-color: var(--bs-primary) !important;
}
.dropdown-menu > .active > a:focus {
  color: #ffffff;
  background-color: var(--bs-primary) !important;
}
.success-border {
  border-color: var(--bs-primary);
}

