@font-face {
   font-family: 'DB Helvethaica';
   src: url('../fonts/DBHelvethaicaX-Li.woff2') format('woff2'),
      url('../fonts/DBHelvethaicaX-Li.woff') format('woff');
   font-weight: 300;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'DB Helvethaica';
   src: url('../fonts/DBHelvethaicaX-55Regular.woff2') format('woff2'),
      url('../fonts/DBHelvethaicaX-55Regular.woff') format('woff');
   font-weight: 400;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'DB Helvethaica';
   src: url('../fonts/DBHelvethaicaX-Med.woff2') format('woff2'),
      url('../fonts/DBHelvethaicaX-Med.woff') format('woff');
   font-weight: 500;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'DB Helvethaica';
   src: url('../fonts/DBHeavent-Bold.woff2') format('woff2'),
      url('../fonts/DBHeavent-Bold.woff') format('woff');
   font-weight: bold;
   font-style: normal;
   font-display: swap;
}


/* form base */

.formall,
.formall button,
.formall input,
.formall select,
.formall textarea {
   font-family: 'DB Helvethaica', sans-serif;
}

.rendered-form {
   font-size: 25px;
   font-weight: 400;
   line-height: 1;
   color: #000;
}

.rendered-form * {
   box-sizing: border-box;
}

.rendered-form .form-group {
   position: relative;
   margin-left: 0 !important;
   margin-bottom: 30px !important;
}

.rendered-form .form-group > label {
   position: static;
   z-index: 2;
   display: block;
   margin: 0 0 8px;
   font-size: 22px;
   font-weight: 300;
   line-height: 1;
   color: #787777;
}

.rendered-form .fb-required,
.rendered-form .required-asterisk {
   padding-left: 3px;
   color: #d5121f !important;
}

.rendered-form .survey-control {
   position: relative;
}

.rendered-form .field-line .survey-control::after {
   position: absolute;
   right: 0;
   bottom: 0;
   left: 0;
   height: 2px;
   content: '';
   background-color: #d5121f;
   transform: scaleX(0);
   transform-origin: left center;
   transition: transform 0.25s ease;
   pointer-events: none;
}

.rendered-form .field-line.is-focused .survey-control::after {
   transform: scaleX(1);
}


/* input */

.rendered-form .field-line .form-control {
   display: block !important;
   width: 100% !important;
   height: 52px !important;
   margin: 0 !important;
   padding: 0 0 4px !important;
   font-family: 'DB Helvethaica', sans-serif !important;
   font-size: 25px !important;
   font-weight: 400;
   line-height: 1 !important;
   color: #000 !important;
   background-color: transparent !important;
   background-image: none !important;
   border: 0 !important;
   border-bottom: 1px solid #cccccc !important;
   border-radius: 0 !important;
   outline: 0 !important;
   box-shadow: none !important;
   transition: border-color 0.25s ease;
}

.rendered-form .field-line .form-control:hover {
   border-bottom-color: #999999 !important;
}

.rendered-form .field-line .form-control:focus {
   border-bottom-color: #cccccc !important;
   outline: 0 !important;
   box-shadow: none !important;
}

.rendered-form .field-line .form-control:disabled {
   color: #9f9f9f !important;
   border-bottom-style: dashed !important;
   opacity: 1;
}

.rendered-form .field-line .form-control[readonly] {
   color: #555555 !important;
   background-color: transparent !important;
}

.rendered-form .field-line .form-control:-webkit-autofill,
.rendered-form .field-line .form-control:-webkit-autofill:hover,
.rendered-form .field-line .form-control:-webkit-autofill:focus {
   -webkit-text-fill-color: #000;
   -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
   transition: background-color 9999s ease-out;
}

.rendered-form .form-control.number {
   width: 100% !important;
}

.rendered-form .form-control[type='color'] {
   display: inline-block !important;
   width: 60px !important;
   height: 42px !important;
   padding: 2px !important;
   border: 1px solid #dddddd !important;
   border-radius: 6px !important;
}

.rendered-form select.form-control[multiple] {
   height: auto !important;
   min-height: 110px;
   padding: 10px 0 !important;
}


/* floating label */

.rendered-form .field-floating {
   padding-top: 8px;
}

.rendered-form .field-floating > label,
.rendered-form .field-floating > label.active {
   position: absolute !important;
   top: 25px !important;
   left: 0 !important;
   z-index: 2;
   max-width: calc(100% - 10px);
   margin: 0 !important;
   overflow: hidden;
   font-size: 24px !important;
   font-weight: 300 !important;
   line-height: 1 !important;
   color: #555555 !important;
   text-overflow: ellipsis;
   white-space: nowrap;
   opacity: 1 !important;
   transform: none !important;
   transition: top 0.22s ease, color 0.22s ease, font-size 0.22s ease;
}

.rendered-form .field-floating .form-control {
   height: 55px !important;
   padding: 17px 0 3px !important;
}

.rendered-form .field-floating .form-control::placeholder {
   color: #9f9f9f;
   opacity: 0;
   transition: opacity 0.2s ease;
}

.rendered-form .field-floating.is-filled > label,
.rendered-form .field-floating.is-filled > label.active,
.rendered-form .field-floating.is-focused > label,
.rendered-form .field-floating.is-focused > label.active {
   top: 0 !important;
   font-size: 19px !important;
   font-weight: 400 !important;
   color: #787777 !important;
}

.rendered-form .field-floating.is-focused > label,
.rendered-form .field-floating.is-focused > label.active {
   color: #d5121f !important;
}

.rendered-form .field-floating.is-focused .form-control::placeholder {
   opacity: 1;
}

.rendered-form .field-floating textarea.form-control {
   height: auto !important;
   min-height: 140px;
   padding: 23px 0 12px !important;
   line-height: 1.2 !important;
   overflow: auto;
   resize: vertical;
}


/* select and date */

.rendered-form .field-static > label {
   margin-bottom: 6px;
   font-size: 21px;
   font-weight: 300;
   color: #787777;
}

.rendered-form .field-select select.form-control {
   padding-right: 35px !important;
   cursor: pointer;
   appearance: none;
   -webkit-appearance: none;
}

.rendered-form .field-select .survey-control::before {
   position: absolute;
   z-index: 2;
   top: 17px;
   right: 5px;
   width: 9px;
   height: 9px;
   content: '';
   border-right: 1px solid #555555;
   border-bottom: 1px solid #555555;
   transform: rotate(45deg);
   pointer-events: none;
}

.rendered-form .field-date input.form-control {
   cursor: pointer;
}

.rendered-form select.form-control option {
   font-family: sans-serif;
   font-size: 14px;
}


/* checkbox and radio */

.rendered-form .fb-checkbox-group > label,
.rendered-form .fb-radio-group > label {
   margin-bottom: 12px;
   font-size: 24px;
   font-weight: 400;
   color: #000;
}

.rendered-form .checkbox-group,
.rendered-form .radio-group {
   display: grid;
   gap: 10px;
}

.rendered-form .checkbox-group.is-inline,
.rendered-form .radio-group.is-inline {
   display: flex;
   flex-wrap: wrap;
}

.rendered-form .fb-checkbox-group .checkbox,
.rendered-form .fb-checkbox-group .checkbox-inline,
.rendered-form .fb-radio-group .radio,
.rendered-form .fb-radio-group .radio-inline {
   position: relative;
   display: flex;
   align-items: center;
   min-height: 54px;
   margin: 0 !important;
   padding: 12px 15px !important;
   background-color: #fff;
   border: 1px solid #dddddd;
   border-radius: 8px;
   transition: border-color 0.2s ease, background-color 0.2s ease;
}

.rendered-form .fb-checkbox-group .checkbox-inline,
.rendered-form .fb-radio-group .radio-inline {
   width: auto;
}

.rendered-form .fb-checkbox-group .checkbox:hover,
.rendered-form .fb-checkbox-group .checkbox-inline:hover,
.rendered-form .fb-radio-group .radio:hover,
.rendered-form .fb-radio-group .radio-inline:hover {
   border-color: #b8b8b8;
}

.rendered-form .fb-checkbox-group .is-selected,
.rendered-form .fb-radio-group .is-selected {
   background-color: #fff7f8;
   border-color: #d5121f;
}

.rendered-form .fb-checkbox-group .checkbox input,
.rendered-form .fb-checkbox-group .checkbox-inline input,
.rendered-form .fb-radio-group .radio input,
.rendered-form .fb-radio-group .radio-inline input {
   position: relative;
   flex: 0 0 20px;
   width: 20px;
   height: 20px;
   margin: 0 10px 0 0 !important;
   accent-color: #d5121f;
   cursor: pointer;
}

.rendered-form .fb-checkbox-group .checkbox label,
.rendered-form .fb-checkbox-group .checkbox-inline label,
.rendered-form .fb-radio-group .radio label,
.rendered-form .fb-radio-group .radio-inline label {
   flex: 1;
   margin: 0;
   padding-left: 0 !important;
   font-size: 23px !important;
   font-weight: 300;
   line-height: 1.1 !important;
   color: #000;
   cursor: pointer;
}

.rendered-form .other-val {
   height: 42px;
   margin: 10px 0 0 30px !important;
   padding: 0 12px;
   font-size: 22px;
   color: #000;
   background-color: #fff;
   border: 1px solid #dddddd;
   border-radius: 6px;
   outline: 0;
}

.rendered-form .other-val:focus {
   border-color: #d5121f;
}


/* file upload */

.rendered-form .field-file > label {
   margin-bottom: 10px;
   font-size: 22px;
   font-weight: 300;
   color: #787777;
}

.rendered-form input[type='file'].form-control:not(.survey-file-native) {
   height: 52px !important;
   padding: 5px !important;
   font-size: 21px !important;
   line-height: 1 !important;
   background-color: #f5f5f5;
   border: 1px solid #dddddd;
   border-radius: 8px !important;
}

.rendered-form input[type='file'].form-control:not(.survey-file-native)::file-selector-button {
   height: 40px;
   margin-right: 12px;
   padding: 0 20px;
   font-family: 'DB Helvethaica', sans-serif;
   font-size: 21px;
   color: #fff;
   background-color: #d5121f;
   border: 0;
   border-radius: 6px;
   cursor: pointer;
}

.rendered-form .survey-file-native {
   position: absolute !important;
   width: 1px !important;
   height: 1px !important;
   margin: -1px !important;
   padding: 0 !important;
   overflow: hidden;
   white-space: nowrap;
   border: 0 !important;
   clip: rect(0 0 0 0);
   clip-path: inset(50%);
   opacity: 0;
}

.rendered-form .survey-file-control {
   display: flex;
   align-items: center;
   width: 100%;
   min-height: 86px;
   margin: 0;
   padding: 15px 18px;
   font-family: 'DB Helvethaica', sans-serif;
   color: #000;
   text-align: left;
   background-color: #f5f5f5;
   border: 1px solid #dddddd;
   border-radius: 10px;
   cursor: pointer;
   transition: border-color 0.2s ease, background-color 0.2s ease;
}

.rendered-form .survey-file-control:hover,
.rendered-form .survey-file-control:focus {
   background-color: #fffafa;
   border-color: #d5121f;
   outline: 0;
   box-shadow: none;
}

.rendered-form .survey-file-icon {
   position: relative;
   display: flex;
   flex: 0 0 42px;
   align-items: center;
   justify-content: center;
   width: 42px;
   height: 42px;
   margin-right: 14px;
   font-size: 28px;
   font-weight: 300;
   line-height: 1;
   color: #d5121f;
   background-color: #fcf2f1;
   border-radius: 100%;
}

.rendered-form .survey-file-icon::before {
   content: '+';
}

.rendered-form .field-file.has-file .survey-file-icon {
   color: #fff;
   background-color: #d5121f;
}

.rendered-form .field-file.has-file .survey-file-icon::before {
   content: '\2713';
   font-size: 22px;
}

.rendered-form .survey-file-copy {
   display: block;
   min-width: 0;
   padding-right: 15px;
}

.rendered-form .survey-file-copy strong,
.rendered-form .survey-file-copy small {
   display: block;
}

.rendered-form .survey-file-copy strong {
   margin-bottom: 5px;
   font-size: 24px;
   font-weight: 500;
   line-height: 1;
}

.rendered-form .survey-file-copy small {
   overflow: hidden;
   font-size: 20px;
   font-weight: 300;
   line-height: 1.1;
   color: #787777;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.rendered-form .survey-file-action {
   flex: 0 0 auto;
   min-width: 105px;
   height: 38px;
   margin-left: auto;
   padding: 0 18px;
   font-size: 21px;
   font-weight: 400;
   line-height: 36px;
   color: #d5121f;
   text-align: center;
   background-color: #fff;
   border: 1px solid #d5121f;
   border-radius: 6px;
}


/* autocomplete and toggle */

.rendered-form .fb-autocomplete-list {
   width: 100%;
   max-height: 210px;
   margin-top: -1px;
   overflow-y: auto;
   background-color: #fff;
   border: 1px solid #dddddd;
   border-radius: 0 0 8px 8px;
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.rendered-form .fb-autocomplete-list li {
   padding: 10px 15px !important;
   font-size: 22px;
   font-weight: 300;
   line-height: 1.1;
}

.rendered-form .fb-autocomplete-list li.active-option,
.rendered-form .fb-autocomplete-list li:hover {
   background-color: #f5f5f5 !important;
}

.rendered-form .kc-toggle {
   padding-left: 0 !important;
}

.rendered-form .kc-toggle input:checked + span::before {
   background-color: #d5121f !important;
}


/* content */

.rendered-form .header-class {
   margin: 40px 0 22px !important;
   padding-bottom: 12px;
   font-size: 30px !important;
   font-weight: 500;
   line-height: 1.1;
   color: #000;
   border-bottom: 1px solid #e0e0e0;
}

.rendered-form .form-group:first-child .header-class {
   margin-top: 0 !important;
}

.rendered-form .paragraph-class {
   margin: 0 0 20px;
   font-size: 24px !important;
   font-weight: 300;
   line-height: 1.25;
   color: #333333;
}

.rendered-form .tooltip-element {
   width: 16px;
   height: 16px;
   margin: 0 5px;
   font-size: 12px;
   line-height: 16px;
   color: #fff;
   background-color: #d5121f;
   border-radius: 100%;
}

[tooltip]:hover::after {
   padding: 8px 10px;
   font-family: Arial, sans-serif;
   font-size: 12px;
   line-height: 1.4;
   background-color: rgba(0, 0, 0, 0.9);
   border-radius: 5px;
}


/* validation */

.rendered-form .has-error .form-control,
.rendered-form .form-group.is-error .form-control {
   border-bottom-color: #d5121f !important;
}

.rendered-form .has-error .survey-control::after,
.rendered-form .form-group.is-error .survey-control::after {
   transform: scaleX(1);
}

.rendered-form .help-block {
   position: static;
   display: block;
   margin-top: 7px;
   font-size: 19px;
   font-weight: 300;
   line-height: 1.1;
   color: #d5121f;
}

.rendered-form .help-block ul {
   margin: 0;
   padding: 0;
   font-size: 19px;
   color: #d5121f;
}


/* button */

.rendered-form .btn,
.formall > input.btn {
   display: inline-flex !important;
   align-items: center;
   justify-content: center;
   height: 50px;
   margin-bottom: 0;
   padding: 0 30px !important;
   font-family: 'DB Helvethaica', sans-serif !important;
   font-size: 25px !important;
   font-weight: 500 !important;
   line-height: 1 !important;
   text-align: center;
   white-space: nowrap;
   vertical-align: middle;
   background-image: none !important;
   border-radius: 10px !important;
   box-shadow: none !important;
   transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.rendered-form .btn-primary,
.formall > input.btn-primary {
   color: #fff;
   background-color: #d5121f;
   border: 1px solid #d5121f;
}

.rendered-form .btn-primary:hover,
.rendered-form .btn-primary:focus,
.formall > input.btn-primary:hover,
.formall > input.btn-primary:focus {
   color: #fff;
   background-color: #b90f1a;
   border-color: #b90f1a;
}

.rendered-form .btn-default,
.formall > input.btn-default {
   margin-left: 5px;
   color: #d5121f;
   background-color: #fff;
   border: 1px solid #d5121f;
}

.rendered-form .btn-default:hover,
.rendered-form .btn-default:focus,
.formall > input.btn-default:hover,
.formall > input.btn-default:focus {
   color: #fff;
   background-color: #d5121f;
   border-color: #d5121f;
}

.formall .LoginCanonID {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   min-height: 50px;
   padding: 10px 20px;
   font-family: 'DB Helvethaica', sans-serif;
   font-size: 25px;
   font-weight: 500;
   line-height: 1.1;
   white-space: normal;
   color: #fff;
   background-color: #d5121f;
   border: 1px solid #d5121f;
   border-radius: 10px;
}

.rendered-form .btn:disabled,
.rendered-form .btn.disabled,
.formall > input.btn:disabled,
.formall > input.btn.disabled {
   color: #b0b0b0 !important;
   background-color: #f1f1f1 !important;
   border-color: #f1f1f1 !important;
   opacity: 1;
   cursor: not-allowed;
}

.rendered-form .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
   border-top-right-radius: 0 !important;
   border-bottom-right-radius: 0 !important;
}

.rendered-form .btn-group > .btn:last-child:not(:first-child),
.rendered-form .btn-group > .dropdown-toggle:not(:first-child) {
   border-top-left-radius: 0 !important;
   border-bottom-left-radius: 0 !important;
}


/* divider */

.render-wrap + .text-center,
#login_canonid .text-center {
   margin-top: 35px;
   padding: 0 !important;
   background-color: transparent !important;
   border-bottom: 1px solid #e0e0e0 !important;
}

.render-wrap + .text-center + .text-center {
   height: 20px;
}


/* mobile field */

@media screen and (max-width: 575.98px) {
   .rendered-form .form-group {
      margin-bottom: 26px !important;
   }

   .rendered-form .survey-file-control {
      flex-wrap: wrap;
      padding: 15px;
   }

   .rendered-form .survey-file-copy {
      width: calc(100% - 56px);
      padding-right: 0;
   }

   .rendered-form .survey-file-action {
      width: 100%;
      margin-top: 12px;
      margin-left: 0;
   }

   .formall > input.btn-primary,
   .formall > input.btn-default {
      width: 100%;
      margin-right: 0;
      margin-bottom: 8px;
      margin-left: 0;
   }
}

html,
body {
   min-height: 100%;
}

body {
   font-family: 'DB Helvethaica', sans-serif;
   background-color: #f8f8f8 !important;
}

body::before {
   position: fixed;
   z-index: 999;
   top: 0;
   right: 0;
   left: 0;
   height: 5px;
   content: '';
   background-color: #005bac;
}

.container {
   width: 100%;
   max-width: 1000px;
   padding-bottom: 50px;
}

.header {
   margin-top: 10px;
}

#_banner_image_ {
   border-radius: 0 !important;
   box-shadow: none !important;
}

.formall {
   padding: 20px 30px;
   background-color: #fff;
   border: 10px solid #fbfbfb;
}

.formall,
.formall button,
.formall input,
.formall select,
.formall textarea {
   font-family: 'DB Helvethaica', sans-serif;
}

#formFields {
   font-size: 25px;
   font-weight: 400;
   line-height: 1;
   color: #000;
}

#formFields * {
   box-sizing: border-box;
}

.fc-field-card {
   position: relative;
   margin: 0 0 30px !important;
   padding: 0 !important;
   text-align: left;
   background-color: transparent !important;
   border: 0 !important;
   border-radius: 0 !important;
   box-shadow: none !important;
}

.fc-field-card:focus-within {
   border: 0 !important;
   box-shadow: none !important;
}

.fc-field-label,
.survey-field-label {
   position: static;
   z-index: 2;
   display: block;
   margin: 0 0 8px;
   font-size: 22px;
   font-weight: 300;
   line-height: 1;
   color: #787777;
}

.fc-field-desc {
   margin: 0 0 12px;
   font-size: 20px;
   font-weight: 300;
   line-height: 1.2;
   color: #787777;
}

.fc-req-star {
   padding-left: 3px;
   color: #d5121f !important;
}

.fc-form-input {
   display: block !important;
   width: 100% !important;
   height: 52px !important;
   margin: 0 !important;
   padding: 0 0 4px !important;
   font-family: 'DB Helvethaica', sans-serif !important;
   font-size: 25px !important;
   font-weight: 400;
   line-height: 1 !important;
   color: #000 !important;
   background-color: transparent !important;
   background-image: linear-gradient(#d5121f, #d5121f) !important;
   background-repeat: no-repeat !important;
   background-position: left bottom !important;
   background-size: 0 2px !important;
   border: 0 !important;
   border-bottom: 1px solid #cccccc !important;
   border-radius: 0 !important;
   outline: 0 !important;
   box-shadow: none !important;
   transition: border-color 0.25s ease, background-size 0.25s ease;
}

.fc-form-input:hover {
   border-bottom-color: #999999 !important;
}

.fc-form-input:focus,
.field-line.is-focused .fc-form-input {
   background-size: 100% 2px !important;
   border-bottom-color: #cccccc !important;
   outline: 0 !important;
   box-shadow: none !important;
}

.fc-form-input:disabled {
   color: #9f9f9f !important;
   border-bottom-style: dashed !important;
   opacity: 1;
}

.fc-form-input[readonly] {
   color: #555555 !important;
   background-color: transparent !important;
}

.fc-form-input:-webkit-autofill,
.fc-form-input:-webkit-autofill:hover,
.fc-form-input:-webkit-autofill:focus {
   -webkit-text-fill-color: #000;
   -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
   transition: background-color 9999s ease-out;
}

.fc-form-input[type='color'] {
   display: inline-block !important;
   width: 60px !important;
   height: 42px !important;
   padding: 2px !important;
   border: 1px solid #dddddd !important;
   border-radius: 6px !important;
}

select.fc-form-input[multiple] {
   height: auto !important;
   min-height: 110px;
   padding: 10px 0 !important;
}

.field-floating {
   padding-top: 8px !important;
}

.field-floating .survey-field-label {
   position: absolute !important;
   top: 25px !important;
   left: 0 !important;
   z-index: 2;
   max-width: calc(100% - 10px);
   margin: 0 !important;
   overflow: hidden;
   font-size: 24px !important;
   font-weight: 300 !important;
   line-height: 1 !important;
   color: #555555 !important;
   text-overflow: ellipsis;
   white-space: nowrap;
   opacity: 1 !important;
   transform: none !important;
   transition: top 0.22s ease, color 0.22s ease, font-size 0.22s ease;
   pointer-events: none;
}

.field-floating .fc-form-input {
   height: 55px !important;
   padding: 17px 0 3px !important;
}

.field-floating .fc-form-input::placeholder {
   color: #9f9f9f;
   opacity: 0;
   transition: opacity 0.2s ease;
}

.field-floating.is-filled .survey-field-label,
.field-floating.is-focused .survey-field-label {
   top: 0 !important;
   font-size: 19px !important;
   font-weight: 400 !important;
   color: #787777 !important;
}

.field-floating.is-focused .survey-field-label {
   color: #d5121f !important;
}

.field-floating.is-focused .fc-form-input::placeholder {
   opacity: 1;
}

.field-floating textarea.fc-form-input {
   height: auto !important;
   min-height: 140px;
   padding: 23px 0 12px !important;
   line-height: 1.2 !important;
   overflow: auto;
   resize: vertical;
}

.field-static .survey-field-label,
.field-file .survey-field-label {
   margin-bottom: 6px;
   font-size: 21px;
   font-weight: 300;
   color: #787777;
}

.field-select select.fc-form-input {
   padding-right: 35px !important;
   cursor: pointer;
   appearance: none;
   -webkit-appearance: none;
}

.field-select::before {
   position: absolute;
   z-index: 2;
   right: 5px;
   bottom: 20px;
   width: 9px;
   height: 9px;
   content: '';
   border-right: 1px solid #555555;
   border-bottom: 1px solid #555555;
   transform: rotate(45deg);
   pointer-events: none;
}

.field-date input.fc-form-input {
   cursor: pointer;
}

select.fc-form-input option {
   font-family: sans-serif;
   font-size: 14px;
}

.field-choice .survey-field-label,
.field-rating .survey-field-label {
   margin-bottom: 12px;
   font-size: 24px;
   font-weight: 400;
   color: #000;
}

.fc-option-label {
   position: relative;
   display: flex;
   align-items: center;
   min-height: 54px;
   margin: 0 0 10px !important;
   padding: 12px 15px !important;
   font-size: 23px;
   font-weight: 300;
   line-height: 1.1;
   color: #000;
   background-color: #fff !important;
   border: 1px solid #dddddd;
   border-radius: 8px;
   cursor: pointer;
   transition: border-color 0.2s ease, background-color 0.2s ease;
}

.fc-option-label:hover {
   background-color: #fff !important;
   border-color: #b8b8b8;
}

.fc-option-label.is-selected {
   background-color: #fff7f8 !important;
   border-color: #d5121f;
}

.fc-option-label input[type='checkbox'],
.fc-option-label input[type='radio'] {
   position: relative;
   flex: 0 0 20px;
   width: 20px;
   height: 20px;
   margin: 0 10px 0 0 !important;
   accent-color: #d5121f;
   cursor: pointer;
}

.field-scale .fc-option-label {
   display: inline-flex;
   flex-direction: column;
   min-width: 36px;
   min-height: 0;
   margin: 0 4px 8px !important;
   padding: 0 !important;
   font-size: 20px;
   text-align: center;
   background-color: transparent !important;
   border: 0;
   border-radius: 0;
}

.field-scale .fc-option-label:hover,
.field-scale .fc-option-label.is-selected {
   background-color: transparent !important;
   border: 0;
}

.field-scale .fc-option-label input[type='radio'] {
   margin: 7px 0 0 !important;
}

.survey-file-native {
   position: absolute !important;
   width: 1px !important;
   height: 1px !important;
   margin: -1px !important;
   padding: 0 !important;
   overflow: hidden;
   border: 0 !important;
   clip: rect(0 0 0 0);
   clip-path: inset(50%);
   opacity: 0;
}

.upload-wrap {
   position: relative;
}

.upload-wrap .survey-file-name {
   display: block;
   width: 100%;
   height: 50px;
   padding: 0 220px 0 20px;
   font-family: 'DB Helvethaica', sans-serif;
   font-size: 22px;
   font-weight: 300;
   line-height: 1;
   color: #000;
   background-color: #fff;
   border: 1px solid #dddddd;
   border-radius: 10px;
   outline: 0;
   box-shadow: none;
}

.upload-wrap .survey-file-name::placeholder {
   color: #9f9f9f;
   opacity: 1;
}

.upload-wrap .btn-upload {
   position: absolute;
   z-index: 2;
   top: 50%;
   right: 10px;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 12px;
   min-width: 200px;
   height: 40px;
   margin: 0;
   padding: 0 20px;
   font-family: 'DB Helvethaica', sans-serif;
   font-size: 23px;
   font-weight: 400;
   line-height: 1;
   color: #fff;
   background-color: #ed111f;
   border: 0;
   border-radius: 6px;
   transform: translateY(-50%);
   cursor: pointer;
   white-space: nowrap;
}

.upload-wrap .btn-upload i {
   font-size: 22px;
   line-height: 1;
}

.field-file.is-disabled .btn-upload {
   color: #b0b0b0;
   background-color: #f1f1f1;
   cursor: not-allowed;
}

.star-rating {
   display: flex;
   flex-direction: row-reverse;
   justify-content: flex-end;
   gap: 4px;
}

.star-rating input {
   position: absolute;
   width: 1px;
   height: 1px;
   opacity: 0;
}

.star-rating label {
   margin: 0;
   font-size: 40px;
   line-height: 1;
   color: #a6a6a6;
   cursor: pointer;
}

.star-rating input:checked ~ label,
.star-rating label:hover,
.star-rating label:hover ~ label {
   color: #f39800 !important;
}

.fc-section-header {
   margin: 40px 0 22px !important;
   padding: 0 0 12px !important;
   font-size: 30px;
   font-weight: 500;
   line-height: 1.1;
   color: #000 !important;
   text-align: left;
   background-color: transparent !important;
   border-bottom: 1px solid #e0e0e0;
   border-radius: 0 !important;
}

.fc-html-content {
   margin: 0 0 20px;
   padding: 0 !important;
   font-size: 24px;
   font-weight: 300;
   line-height: 1.25;
   color: #333333;
   text-align: left;
   background-color: transparent !important;
   border: 0 !important;
   border-radius: 0 !important;
}

.survey-intro {
   display: grid;
   grid-template-columns: auto 1fr;
   align-items: center;
   column-gap: 20px;
   padding-bottom: 20px !important;
   border-bottom: 1px solid #e0e0e0 !important;
}

.survey-intro > img {
   grid-row: 1 / span 2;
   width: auto;
   max-width: 125px;
   height: auto;
}

.survey-intro h1,
.survey-intro h2,
.survey-intro h3 {
   margin: 0 0 5px;
   font-size: 30px;
   font-weight: 500;
   line-height: 1.1;
   color: #000;
}

.survey-intro .fc-field-desc {
   grid-column: 2;
   margin: 0;
}

.survey-image img {
   display: block;
   width: 100%;
   height: auto;
}

.fc-form-input.is-invalid,
.fc-field-card.is-error .fc-form-input,
.fc-field-card.has-error .fc-form-input {
   background-size: 100% 2px !important;
   border-bottom-color: #d5121f !important;
}

.invalid-feedback,
.fc-error,
.help-block {
   display: block;
   margin-top: 7px;
   font-size: 19px;
   font-weight: 300;
   line-height: 1.1;
   color: #d5121f;
}

.formall > input.btn,
.formall .btn-primary,
.formall .btn-default {
   display: inline-flex !important;
   align-items: center;
   justify-content: center;
   height: 50px;
   margin-bottom: 0;
   padding: 0 30px !important;
   font-family: 'DB Helvethaica', sans-serif !important;
   font-size: 25px !important;
   font-weight: 500 !important;
   line-height: 1 !important;
   text-align: center;
   white-space: nowrap;
   vertical-align: middle;
   background-image: none !important;
   border-radius: 10px !important;
   box-shadow: none !important;
   transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.formall > input.btn-primary,
.formall .btn-primary {
   color: #fff !important;
   background-color: #d5121f !important;
   border: 1px solid #d5121f !important;
}

.formall > input.btn-primary:hover,
.formall > input.btn-primary:focus,
.formall .btn-primary:hover,
.formall .btn-primary:focus {
   color: #fff !important;
   background-color: #b90f1a !important;
   border-color: #b90f1a !important;
}

.formall > input.btn-default,
.formall .btn-default {
   margin-left: 5px;
   color: #d5121f !important;
   background-color: #fff !important;
   border: 1px solid #d5121f !important;
}

.formall > input.btn-default:hover,
.formall > input.btn-default:focus,
.formall .btn-default:hover,
.formall .btn-default:focus {
   color: #fff !important;
   background-color: #d5121f !important;
   border-color: #d5121f !important;
}

.formall .LoginCanonID {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   min-height: 50px;
   padding: 10px 20px;
   font-size: 25px;
   font-weight: 500;
   line-height: 1.1;
   white-space: normal;
   color: #fff;
   background-color: #d5121f;
   border: 1px solid #d5121f;
   border-radius: 10px;
}

.formall > input.btn:disabled,
.formall > input.btn.disabled,
.formall .btn:disabled,
.formall .btn.disabled {
   color: #b0b0b0 !important;
   background-color: #f1f1f1 !important;
   border-color: #f1f1f1 !important;
   opacity: 1;
   cursor: not-allowed;
}

@media screen and (max-width: 575.98px) {
   .container {
      padding-right: 0;
      padding-left: 0;
   }

   .header {
      padding-right: 15px;
      padding-left: 15px;
   }

   .formall {
      padding: 20px;
      border: 0;
   }

   .fc-field-card {
      margin-bottom: 26px !important;
   }

   .upload-wrap .survey-file-name {
      padding-right: 175px;
   }

   .upload-wrap .btn-upload {
      right: 5px;
      gap: 8px;
      min-width: 160px;
      padding: 0 14px;
      font-size: 20px;
   }

   .upload-wrap .btn-upload i {
      font-size: 20px;
   }

   .formall > input.btn-primary,
   .formall > input.btn-default {
      width: 100%;
      margin-right: 0;
      margin-bottom: 8px;
      margin-left: 0;
   }
}

@media screen and (max-width: 450px) {
   .survey-intro {
      grid-template-columns: 1fr;
   }

   .survey-intro > img {
      grid-row: auto;
      max-width: 125px;
      margin-bottom: 15px;
   }

   .survey-intro .fc-field-desc {
      grid-column: 1;
   }
}


#formFields input[type='radio'],
#formFields input[type='checkbox'] {
   accent-color: #d5121f !important;
}