.scxx .pathway-ui {
   width: 100%;
   min-height: 200px;
   overflow: hidden;
   position: relative;
}

.scxx .pathway-threads-container {
   width: 100%;
   min-height: 80vh;
   transition: all 0.6s ease-in-out;
   padding-top: 70px;
   max-width: 1400px;
   margin: 0 auto;
}

.scxx .pathway-thread {
   min-height: 250px;
}

.scxx .pathway-help-plan-container.display {
   animation: swipe-in-left 0.4s forwards ease-out;
}

.scxx .toastify.preference-failure {
   color: var(--s-red);
}

.scxx .toastify.preference-failure:before {
   content: "\e810";
}

.scxx .toastify.preference-no-change {
   color: var(--s-purple-bright);
}

.scxx .toastify.preference-no-change:before {
   content: "\f1de";
}

@keyframes swipe-in-left {
   0% {
      transform: translateX(20%);
      opacity: 0;
   }

   100% {
      transform: translateX(0%);
      opacity: 1;
   }
}

.scxx .blur-out {
   -webkit-filter: blur(2px);
   transform: scale(0.95);
   opacity: 0;
}

.scxx .interact-prompt {
   margin: 15px;
   border-radius: 0 7px 7px 7px;
   background: #00bfb6;
   color: #fff;
   padding: 6px 10px;
   position: relative;
}

.scxx .interact-prompt:before {
   content: "";
   width: 0px;
   height: 0px;
   position: absolute;
   border-left: 5px solid transparent;
   border-right: 5px solid #00bfb6;
   border-top: 5px solid #00bfb6;
   border-bottom: 5px solid transparent;
   left: -9px;
   top: 0px;
}

.scxx .block-interaction {
   pointer-events: none;
}

.scxx .useful-questions-bar {
   min-width: 75vw;
   border-left: 2px solid var(--s-blue);
   margin: 15px 0;
}

.scxx .useful-questions-label {
   background: #fff;
   padding: 2px 8px;
   font-family: "CeraRound";
   color: var(--s-purple-bright);
}

.scxx .useful-questions-bar .pathway-interact-element {
   margin: 10px;
}

.scxx .no-opacity {
   opacity: 0;
}

.scxx .pathway-navigation-container {
   pointer-events: none;
}

.scxx .pathway-navigation-container.enable {
   pointer-events: all;
}

.scxx .pathway-navigation-panel {
   position: fixed;
   bottom: 0;
   left: 0;
   right: 0;
   height: 75px;
   text-align: center;
   color: #fff;
   z-index: 1;
   display: flex;
   justify-content: center;
   align-items: center;
   font-family: "CeraRound";
   font-size: 1.2rem;
   overflow: hidden;
}

.scxx .pathway-navigation-panel-container {
   position: relative;
   width: 100%;
   height: 100%;
   transform: translate(0, 100px);
}

.scxx .pathway-navigation-panel-background {
   fill: #7b649c;
   height: 100%;
   width: 100%;
}

.scxx .pathway-navigation-panel-content {
   position: absolute;
   width: 100%;
   height: 100%;
   z-index: 1;
   top: 0;
   bottom: 0;
   display: flex;
   justify-content: center;
   align-items: center;
   font-family: "CeraRound";
   font-size: 1.2rem;
   color: #fff;
}

.scxx .pathway-navigation-panel-content {
   position: absolute;
   width: 100%;
   height: 100%;
   z-index: 1;
}

.scxx .slide-up {
   animation: slide-up 0.8s forwards ease-out;
}

.scxx .slide-down {
   animation: slide-down 0.6s forwards ease-out;
}

@keyframes slide-up {
   0% {
      transform: translate(0, 100px);
   }

   100% {
      transform: translate(0, 0px);
   }
}

@keyframes slide-down {
   0% {
      transform: translate(0, 0);
   }

   100% {
      transform: translate(0, 100px);
   }
}

.scxx .pulse {
   box-shadow: 0 0 0 rgba(255, 255, 255, 0.4);
   animation: pulse 2s infinite;
}
.scxx .pulse:hover {
   animation: none;
}

@-webkit-keyframes pulse {
   0% {
      -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
   }
   70% {
      -webkit-box-shadow: 0 0 0 9px rgba(204, 169, 44, 0);
   }
   100% {
      -webkit-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
   }
}
@keyframes pulse {
   0% {
      -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
   }
   70% {
      -moz-box-shadow: 0 0 0 9px rgba(204, 169, 44, 0);
      box-shadow: 0 0 0 9px rgba(204, 169, 44, 0);
   }
   100% {
      -moz-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
      box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
   }
}

.scxx .pathway-navigation-panel-continue {
   color: var(--s-purple);
   border-radius: 30px;
   padding: 7px 20px;
   font-size: 1.2rem;
   background: #fff;
}

.scxx .pathway-navigation-panel-continue:hover {
   background: #fff;
   color: var(--s-purple-bright);
}

.scxx .pathway-navigation-panel-content-text {
   margin-right: 15px;
}

.scxx .fade-in-from-bottom {
   animation: scxx-fade-in-from-bottom 0.6s forwards ease-out;
}
.scxx .fade-in-from-top {
   animation: scxx-fade-in-from-top 0.6s forwards ease-out;
}
.scxx .fade-out-to-bottom {
   animation: scxx-fade-out-to-bottom 0.6s forwards ease-out;
}
.scxx .fade-out-to-top {
   animation: scxx-fade-out-to-top 0.6s forwards ease-out;
}

.scxx .fade-out-to-top-small {
   animation: scxx-fade-out-to-top-small 0.6s forwards ease-out;
}

.scxx .fade-out-shrink {
   animation: scxx-fade-out-shrink 0.6s forwards ease-out;
}

.scxx .fade-out-shrink-large {
   animation: scxx-fade-out-shrink-large 0.6s forwards ease-out;
}

.scxx .fade-in-grow {
   animation: scxx-fade-in-grow 0.6s forwards ease-out;
}

.scxx .transparent {
   opacity: 0;
}

@keyframes scxx-fade-out-shrink {
   0% {
      opacity: 1;
      transform: scale(1);
   }
   100% {
      opacity: 0;
      transform: scale(0.95);
   }
}

@keyframes scxx-fade-out-shrink-large {
   0% {
      opacity: 1;
      transform: scale(1);
   }
   100% {
      opacity: 0;
      transform: scale(0.85);
   }
}

@keyframes scxx-fade-in-grow {
   0% {
      opacity: 0;
      transform: scale(0.8);
   }
   100% {
      opacity: 1;
      transform: scale(1);
   }
}

@keyframes scxx-fade-in-from-top {
   0% {
      opacity: 0;
      transform: translate(0, -8vh);
   }
   100% {
      opacity: 1;
      transform: translate(0, 0px);
   }
}

@keyframes scxx-fade-in-from-bottom {
   0% {
      opacity: 0;
      transform: translate(0, 30px);
   }

   80% {
      opacity: 10%;
   }

   100% {
      opacity: 1;
      transform: translate(0, 0px);
   }
}

@keyframes scxx-fade-out-to-top {
   0% {
      opacity: 1;
      transform: translate(0, 0px);
   }
   100% {
      opacity: 0;
      transform: translate(0, -8vh);
   }
}

@keyframes scxx-fade-out-to-top-small {
   0% {
      opacity: 1;
      transform: translate(0, 0px);
   }
   100% {
      opacity: 0;
      transform: translate(0, -20px);
   }
}

@keyframes scxx-fade-out-to-bottom {
   0% {
      opacity: 1;
      transform: translate(0, 0px);
   }
   100% {
      opacity: 0;
      transform: translate(0, 8vh);
   }
}

.scxx .age-picker-container {
   display: flex;
   max-width: 250px;
   flex-wrap: wrap;
   justify-content: center;
   margin: auto;
}

.scxx .age-picker-container input {
   display: none;
}

.scxx .age-picker-button {
   font-family: "ceraRound";
   font-size: 1.3rem;
   width: 39px;
   background: #fff;
   border-radius: 4px;
   margin: 3px;
   height: 35px;
   display: flex;
   justify-content: center;
   align-items: center;
   cursor: pointer;
}

.scxx .age-picker-button:hover {
   outline: 2px dashed var(--s-primary);
   border-width: 0px;
}

.scxx input:checked + .age-picker-button {
   background: var(--s-green);
   border-color: var(--s-green);
   color: #fff;
   outline: none;
}

.scxx .interact-step-elements-container {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   min-height: 100px;
}

.scxx .loading-support .interact-step-elements-container {
   min-height: 400px;
}

.scxx .step-question {
   max-width: 800px;
}

.scxx .step-question-text {
   font-weight: 700;
   color: var(--s-purple);
   font-size: 1.4rem;
   font-family: "CeraRound";
   margin-bottom: 12px;
}

.scxx .question-multi-select-notice {
   margin: 10px 0 15px;
   color: var(--s-purple);
   font-family: "ceraRound";
   text-align: center;
}

.scxx .question-multi-select-notice:before {
   content: "\e84a";
   font-family: "icons";
   text-align: center;
   margin-right: 7px;
   font-size: 1rem;
   background: var(--s-purple-bright);
   border-radius: 10px;
   width: 16px;
   display: inline-block;
   height: 16px;
   color: #fff;
   line-height: 18px;
}

.scxx .useful-questions-bar .step-question {
   box-sizing: border-box;
   max-width: none;
   width: 100%;
}

.scxx .useful-questions-bar .step-question-text {
   font-size: 1.1rem;
   margin: 2px 0;
}

.scxx .type-picker .select-component-container {
   margin: auto;
}

.scxx .pathway-interact-element .select-component-button {
   min-width: 100px;
   white-space: normal;
   display: inline-block;
   cursor: pointer;
   font-weight: 500;
   text-align: center;
   font-size: 1.15rem;
   padding: 10px 10px;
   margin: 6px;
   color: var(--s-link);
   position: relative;
   display: flex;
   flex-direction: column;
   background: #fff;
   border: 0px solid #d0dbec;
   border-radius: 10px;
   box-shadow: 2px 1px 4px #d2e3ff;
   transition: color 0.3s, background-color 0.3s;
}

.scxx .vertical .select-component-button-container {
   flex-direction: column;
   min-width: 320px;
   margin: auto;
}

.scxx .select-component-container.vertical {
   margin: auto;
   padding: 8px 20px;
   border-radius: 30px;
}

.scxx .pathway-interact-element .vertical .select-component-button {
   align-items: center;
   flex-grow: 1;
}

.scxx .pathway-interact-element .select-component-button:hover {
   box-shadow: 2px 1px 4px #a0b8df;
}

.scxx .pathway-interact-element .select-component-button-icon {
   width: 40px;
   display: block;
   line-height: 40px;
   font-size: 1.8rem;
   opacity: 0.3;
   transition: all 0.4s;
}

.scxx .pathway-interact-element .select-component-button:hover .select-component-button-icon {
   font-size: 2rem;
   opacity: 0.6;
}

.scxx .pathway-interact-element .select-component-button.selected {
   color: var(--s-green);
   border: 1px solid var(--s-green);
}

.scxx .pathway-interact-element .select-component-button.none-selected {
   color: var(--s-grey-text);
   background: #fafafa;
   border-color: var(--s-grey-text);
   border: 1px dashed var(--s-grey-text);
}

.scxx .pathway-interact-element .select-component-button.selected:after {
   content: "\e80e";
   font-family: "icons";
   position: absolute;
   right: 3px;
   top: 2px;
   background: var(--s-green);
   color: #fff;
   font-weight: 400;
   font-size: 0.8rem;
   border-radius: 33px;
   width: 18px;
   height: 17px;
   line-height: 18px;
}

.scxx .pathway-interact-element .select-component-button:hover {
   color: var(--s-purple-bright);
}

.scxx .pathway-interact-element .tiles .select-component-button {
   width: 265px;
   padding: 6px 10px 6px 15px !important;
   justify-content: center;
   min-height: 50px;
   align-items: center;
}

.scxx .pathway-interact-element .tiles .select-component-button.has-icon {
   padding: 6px 15px 6px 35px !important;
}

.scxx .pathway-interact-element .tiles .select-component-button-icon {
   font-size: 2rem;
}

.scxx .tiles .has-content .select-component-button-label {
   max-width: 215px;
   transition: all 0.5s;
   padding: 2px 8px 6px 8px;
   transform: translateY(calc(100% / 3 + 6px));
   height: 100%;
}

.scxx .tiles .has-content:hover .select-component-button-label {
   transform: translateY(8px);
}

.scxx .pathway-interact-element .tiles .select-component-button-subtext {
   font-weight: 300;
   font-size: 1rem;
   margin-top: 6px;
   color: #63759c;
   flex-grow: 1;
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   opacity: 0;
   transform: translateY(5px);
   transition: 0.5s all;
}

.scxx .pathway-interact-element .tiles button:hover .select-component-button-subtext,
.scxx .pathway-interact-element .tiles button:focus .select-component-button-subtext {
   transform: translateY(0px);
   opacity: 1;
}

.scxx .select-component-button.help-plan-button {
   background: var(--s-purple-bright);
   color: #fff;
   border-radius: 30px;
   margin: 15px auto 35px;
   padding-right: 25px;
   align-self: flex-start;
}

.scxx .select-component-button.help-plan-button.selected {
   background: var(--s-green);
   color: #fff;
}

.scxx .select-component-button.help-plan-button.selected:after {
   display: none;
}

.scxx .select-component-button.help-plan-button:hover {
   color: #fff !important;
}

.scxx .step-question-icon {
   position: absolute;
   pointer-events: none;
   color: #92bfdc;
   font-size: 2rem;
   opacity: 0.3;
   transform: translate(-30px, -30px);
   transition: all 1.2s;
}

.scxx .step-question-icon:before {
   opacity: 0.15;
}

.scxx .step-question.minimized {
   position: relative;
   padding: 8px 120px 8px 8px;
}

.scxx .step-question.minimized .step-question-response {
   display: none;
}

.scxx .step-question.minimized:hover {
   background: #fff;
   cursor: pointer;
}

.scxx .step-question-expand {
   position: absolute;
   right: 0;
   top: 0px;
}

.scxx .step-question.minimized:hover .step-question-expand {
   background: var(--s-primary);
   color: #fff;
}

.scxx .icon-large .step-question-icon {
   font-size: 7rem;
   transform: translate(-3vw, -40px) scale(0.5, 0.5);
   animation: question-icons 2s forwards;
}

@keyframes question-icons {
   0% {
      transform: translate(-3vw, -80px) scale(0.7, 0.7);
      opacity: 0;
   }
   100% {
      opacity: 1;
      transform: translate(2.5vw, -125px) scale(1, 1);
   }
}

.scxx .step-question-response.vertical {
   width: 450px;
   max-width: 99vw;
   margin: auto;
}

.scxx .inline-text .step-question-response {
   display: flex;
   justify-content: center;
}

.scxx .inline-text .step-question-response > div {
   margin: 0 2px;
}

.scxx .interact-step-top-navigation {
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
   max-width: 1100px;
   margin: auto;
}

.scxx .interact-step-top-main {
   display: flex;
   justify-content: space-between;
   margin: auto;
}

.scxx .interact-step-top-back-container {
   position: absolute;
   left: 20px;
   bottom: 0px;
}

.scxx .interact-step-top-next-container {
   position: absolute;
   bottom: 0;
   right: 10px;
}

.scxx .pathway-back,
.scxx .pathway-nav-continue {
   background: #f0f7fc;
   border: 1px solid #9bb9d045;
   border-width: 1px 1px 0 0px;
   transition: all 0.3s;
   color: #1d4f72;
   padding: 4px 10px;
   font-size: 1.1rem;
   z-index: 1;
   border-radius: 8px 8px 0 0;
   margin: 0;
}

.scxx .pathway-back:before,
.scxx .pathway-nav-continue:before {
   margin-right: 4px;
   color: #9fa9bb;
}

.scxx .pathway-back:hover,
.scxx .pathway-nav-continue:hover {
   background: var(--s-purple-bright);
   color: #fff;
}

.scxx .bottom-nav-progression {
   background: rgba(255, 255, 255, 0.6);
   color: var(--s-purple-bright);
   border-radius: 7px;
   padding: 8px 18px 8px 22px;
   box-shadow: 1px 1px 6px rgb(0 0 0 / 5%);
   font-size: 1.1rem;
   font-family: "CeraRound";
   font-weight: 700;
}

.scxx .bottom-nav-progression:hover {
   background: rgba(255, 255, 255, 1);
   color: var(--s-purple-bright);
}

.scxx .interact-step-bottom-navigation {
   display: flex;
   justify-content: center;
   margin-top: 40px;
}

.scxx .eligibility-notice-or {
   border-bottom: 1px dashed #fff;
   margin-bottom: 7px;
}

.scxx .eligibility-notice-requirement {
   display: flex;
   align-items: center;
   font-size: 1.15rem;
   color: var(--s-purple-bright);
}

.scxx .eligibility-requirement {
   width: 33px;
   height: 33px;
   text-align: center;
   line-height: 30px;
   margin: 6px;
   margin-right: 15px;
   border-right: 2px solid #9f9f9f;
}

.scxx .eligibility-requirement.positive:before {
   font-family: "icons";
   content: "\e80e";
   color: var(--s-green);
}

.scxx .eligibility-requirement.negative:before {
   font-family: "icons";
   content: "\e80f";
   color: var(--s-red);
}

.scxx .display-requirements-action {
   padding-left: 50px !important;
}

.scxx .display-requirements-action-container {
   margin-top: 30px;
}

.scxx .eligibility-notice-group {
   display: inline-block;
   background: #fff;
   padding: 4px 8px;
   border-radius: 4px;
   margin: 2px 8px;
   box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
}

.scxx .pools-more-container {
   margin-top: 40px;
}

.scxx .question-help-text-button {
   color: var(--s-primary);
   padding: 0px;
   background: none;
   transform: translateY(-11px);
   font-size: 1.2rem;
}

.scxx .question-help-text-button:before {
   content: "\e825";
   font-family: "icons";
}

.scxx .question-help-text-button:hover {
   color: var(--s-purple-bright);
   background: none;
}

.scxx .question-help-text-container {
   position: absolute;
   font-family: "ceraRound";
   font-size: 1.25rem;
   color: var(--s-purple-bright);
   transform: translate(0px, 0px);
   opacity: 0;
   transition: all 0.4s;
   pointer-events: none;
   z-index: 1;
}

.scxx .question-help-text-container.visible {
   transform: translate(0px, -35px);
   opacity: 1;
}

.scxx .question-help-text {
   position: relative;
   color: #fff;
   background: var(--s-purple-bright);
   border-radius: 4px;
   padding: 3px 10px;
   font-size: 1rem;
}

.scxx .question-help-text:after {
   content: "";
   position: absolute;
   top: 100%;
   left: 10%;
   width: 0;
   height: 0;
   border-top: solid 6px var(--s-purple-bright);
   border-left: solid 6px transparent;
   border-right: solid 6px transparent;
}

.scxx .step-support-lookup-container {
   margin: 5px 0px 5px 12px;
   flex-grow: 1;
}

.scxx .step-dialog-heading {
   font-family: "CeraRound";
   color: var(--s-purple-bright);
   font-size: 1.3rem;
   margin-bottom: 10px;
}

.scxx .step-dialog-text {
   margin: 20px 5px;
}

.scxx .pathway-content {
   max-width: 500px;
   background: #fff;
   border-radius: 5px;
   padding: 12px;
   letter-spacing: 0.02rem;
   font-size: 1.1rem;
   color: var(--s-grey-text);
   text-align: center;
   margin: 10px auto;
}

.scxx .custom-thread {
   margin: 30px 0;
   border-left: 3px solid #a5c2e3;
   padding: 6px 6px 6px 14px;
   background: #fff;
   border-radius: 0 5px 5px 0;
}

.scxx .custom-thread .pathway-interact-element {
   width: 100%;
}

.scxx .custom-thread .result-container {
   border: 0;
}

.scxx .custom-thread .step-question-text {
   font-size: 1.2rem;
   color: var(--s-primary);
}

.scxx .custom-thread .pathway-interact-element .select-component-button {
   border: 2px solid;
   box-shadow: none;
   padding: 5px 20px;
   min-width: auto;
}

.scxx .custom-thread .pathway-interact-element .select-component-button:hover {
   border-color: var(--s-green);
   color: var(--s-green);
}

.scxx .custom-thread .results-picker.pools {
   background: #ecf5fb;
   box-sizing: border-box;
   padding: 0 10px;
   max-height: 400px;
   overflow-y: scroll;
   border-radius: 6px;
   border: 1px solid #c3d3e6;
}

.scxx .custom-thread .pool,
.scxx .custom-thread .pool-container-mini,
.scxx .custom-thread .results-picker .help-plan-item-add-placeholder,
.scxx .custom-thread .interact-step-bottom-navigation {
   margin-top: 10px;
}

.scxx .custom-thread .pathway-thread {
   overflow: hidden;
   min-height: 200px;
}

.scxx .custom-thread .pathway-thread .step-question {
   margin-top: 25px;
}

.scxx .custom-thread .result {
   margin-bottom: 0px;
}

/* Journey styles */

.scxx .journey-offer-component {
   width: 100%;
   max-width: 750px;
}

.scxx .journey-offer {
   width: 100%;
   background: #fff;
   box-shadow: 2px 1px 4px #d2e3ff;
   margin: 0 0 30px;
   padding: 0;
   position: relative;
   padding-left: 160px;
   overflow: hidden;
   z-index: 1;
}

.scxx .journey-offer:hover {
   background: #fff;
   box-shadow: 2px 1px 4px #a0b8df;
}

.scxx .journey-offer-image {
   position: absolute;
   overflow: hidden;
   width: 160px;
   height: 100%;
   left: 0;
   background-position: top;
}

.scxx .journey-offer-image:before {
   font-size: 3rem;
   content: "\e87e";
   position: absolute;
   left: 10px;
   top: 10px;
   color: #fff;
}

.scxx .journey-offer-body {
   flex-grow: 1;
   text-align: left;
   padding: 6px 10px 6px 14px;
   white-space: normal;
}

.scxx .journey-offer-title {
   color: var(--s-purple-bright);
   letter-spacing: 0.04rem;
   font-weight: 700;
   font-size: 1.4rem;
}

.scxx .journey-offer-sub-text {
   color: #444;
}

.scxx .journey-offer-actions {
   margin-top: 8px;
}

.scxx .journey-offer-start {
   background: var(--s-green);
   padding: 2px 10px 2px 6px;
   border-radius: 5px;
   margin-right: 12px;
}

.scxx .journey-offer-start:before {
   margin-right: 6px;
}

.scxx .journey-offer-meta {
   color: var(--s-grey-text);
}

.scxx .journey-progress-container {
   position: absolute;
   width: 100%;
}

.scxx .journey-progress-indicator {
   margin: auto;
   position: relative;
   top: -6px;
   height: 5px;
   width: 100%;
   background: #e6eff6;
   overflow: hidden;
   transform: translate(0px, 10px);
}

.scxx .journey-progress-progress {
   background: #709dfb;
   height: 100%;
   border-radius: 0 10px 10px 0;
   transition: width 1.5s cubic-bezier(0.42, 0, 0.58, 1);
}

/*High contrast styles */

.scxx .high-contrast .step-question-text,
.scxx .high-contrast .select-component-input[type="text"]::placeholder,
.scxx .high-contrast .bottom-nav-progression,
.scxx .high-contrast .select-component-result-none,
.scxx .high-contrast .form-element-invalid-message,
.scxx .high-contrast .pathway-interact-element,
.scxx .high-contrast .select-component-button,
.scxx .high-contrast .pathway-interact-element .tiles .select-component-button-subtext,
.scxx .high-contrast .result-select,
.scxx .high-contrast .other-issues-select {
   color: #000 !important;
}

/* Split page style */

.scxx #full-page-logo-container {
   position: absolute;
}

.scxx .interact-container {
   padding: 0;
}

.scxx .panel {
   align-items: flex-start;
}

.scxx .pathway-threads-container {
   padding-top: 0;
   max-width: none;
}

.scxx .interact-step-top-navigation {
   max-width: none;
   background: #fff;
   width: 100%;
   min-height: 160px;
   align-items: flex-end;
   margin-bottom: 25px;
   z-index: 1;
   position: relative;
   padding-bottom: 35px;
}

.scxx .interact-step-top-icon-container {
   position: absolute;
   top: -24px;
   left: calc(50% - 500px);
}

.scxx .split-layout-icon {
   background: #f5f6fb;
   border-radius: 200px;
   width: 130px;
   height: 130px;
   text-align: center;
   line-height: 130px;
   font-size: 5rem;
   color: #dbd6ec;
}

.scxx .split-layout-title {
   display: flex;
   align-items: end;
   box-sizing: border-box;
   font-weight: 700;
   color: var(--s-purple);
   letter-spacing: 0.02rem;
   font-size: 1.4rem;
   margin: 100px auto 0 auto;
   width: 800px;
   max-width: 95vw;
   min-height: 56px;
}

.scxx .step-question-response {
   width: 860px;
   max-width: 98vw;
}

.scxx .preferences-navigator-question .step-question-response {
   width: auto;
}

.scxx .preferences-navigator-question {
   margin-top: 30px;
}

.scxx .interact-step-top-progress-container {
   position: absolute;
   left: 0;
   right: 0;
   bottom: -2px;
   opacity: 0;
   transition: all 0.4s;
}

.scxx .interact-step-top-progress-container.show {
   opacity: 1;
}

.scxx .step-help-text-button {
   display: block;
   font-size: 1.1rem;
   text-decoration: none !important;
}

.scxx .step-help-text-button:before {
   content: "\e825";
   font-family: "icons";
   margin-right: 5px;
}

.scxx .step-help-text {
   font-weight: 400;
   font-size: 1.1rem;
   color: #391f61;
   background: #f8f4fb;
   padding: 4px 8px;
   border-radius: 4px;
}

.scxx .split-layout-sub-text {
   color: var(--s-link);
   font-size: 1.1rem;
   font-weight: 500;
   margin-top: 5px;
}

.scxx .pathway-nav-continue:after {
   font-family: "icons";
   content: "\0196";
   padding-left: 4px;
}

.scxx .support-select-actions-container {
   align-items: baseline;
}

.scxx .consent-notice {
   max-width: 600px;
   margin: 40px auto 15px;
   background: #fff;
   padding: 8px 12px;
   border-radius: 8px;
}

.scxx .pathway-text {
   font-size: 1.2rem;
   color: #043a58;
   margin: 20px;
}

.scxx .step-question-response .translation-component {
   background: #fff;
}

.scxx .step-question-response .translation-component:hover {
   background: var(--s-blue);
}

.scxx .step-question-response .accessibility-options {
   margin: 25px 0;
}

.scxx .accessibility-options button {
   background: #fff;
   color: var(--s-button);
   border-radius: 4px;
   margin: 5px;
   box-shadow: 1px 1px rgb(12 35 109 / 20%);
}

.scxx .accessibility-options button:hover {
   color: #fff;
   background: var(--s-button);
}

.scxx .accessibility-colour-select {
   width: 400px;
   margin: auto;
}

.scxx .accessibility-colour-select button {
   background: #fff;
   color: #222;
   transition: all 0.3s;
   border-radius: 10px;
   box-shadow: 2px 1px 4px #d2e3ff;
   padding: 8px 16px;
   width: 170px;
   font-size: 1.1rem;
   border: 1px solid rgba(0, 0, 0, 0);
}

.scxx .accessibility-colour-select button:hover {
   border: 1px solid var(--s-blue);
}

.scxx .wide-horizontal-buttons .step-question-response.vertical {
   width: 800px;
}

.scxx .wide-horizontal-buttons .select-component-button-subtext {
   color: #496589;
}

.scxx .location-input-component-input {
   padding: 12px 12px 12px 35px !important;
}

.scxx .location-input .icon-location {
   position: absolute;
   font-size: 2.5rem;
   color: #dbd6ec;
   left: 8px;
   top: -14px;
}

.scxx .location-input-status-indicator {
   top: 10px;
}

.scxx .object-list-item {
   background: #fff;
   padding: 4px 6px;
   border-radius: 6px;
   box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.05);
   margin: 7px 2px;
}

.scxx .org-contact-title .lookup-component-logo {
   margin: auto;
}

.scxx .org-contact-title label,
.scxx .org-contact-container label {
   font-weight: bold;
   margin: 20px 0;
   display: block;
   font-size: 1.15rem;
   color: var(--s-purple);
}

.scxx .org-contact-container {
   text-align: center;
   margin: auto;
   max-width: 800px;
}

.scxx .org-contact-container button {
   white-space: normal;
   font-weight: 500;
   font-size: 1.15rem;
   margin: 6px;
   color: var(--s-link);
   background: #fff;
   border-radius: 10px;
   box-shadow: 2px 1px 4px #d2e3ff;
   transition: color 0.3s, background-color 0.3s;
   width: 100%;
}

.scxx .org-contact-container button:hover {
   box-shadow: 2px 1px 4px #a0b8df;
}

.scxx .lookup-component-logo {
   width: 80px;
   height: 28px;
   background-size: contain;
   background-repeat: no-repeat;
   background-position: 50% 50%;
   margin-right: 15px;
   background-color: #fff;
   margin-right: 15px;
   border-radius: 6px;
   border: 4px solid #fff;
   border-width: 4px 0 4px 0px;
}

.scxx .service-select-headline {
   font-weight: 400;
   color: #444;
   font-size: 1.1rem;
}

.scxx .object-list-container {
   margin: 30px 0;
}

.scxx .multi-element-step {
   margin: 30px 0;
}

.scxx .multi-element-step .step-question-icon {
   display: none;
}

@media screen and (max-width: 480px) {
   .scxx .result {
      padding: 0px;
   }

   .scxx .result-image {
      position: absolute;
      height: 80px;
      width: 110px;
      padding: 0px;
   }

   .scxx .result-image-canvass {
      width: 100px;
      height: 60px;
   }

   .scxx .results-display-canvass .result-main {
      width: 100%;
   }

   .scxx .result-service-category {
      float: none;
      margin: 6px 0 0 0;
   }

   .scxx .result-main {
      width: 100%;
   }

   .scxx .result-servicename {
      margin-top: 5px;
      height: auto;
      margin-left: 110px;
      line-height: 1.2rem;
      overflow-wrap: break-word;
      min-height: 80px;
   }

   .scxx .results-display-canvass .result-servicename {
      font-size: 1.4rem;
      min-height: 80px;
   }

   .scxx .result-servicename span {
      display: block;
   }

   .scxx .result-service-category {
      margin-top: 8px;
      display: none;
   }

   .scxx .result-further-info {
      display: flex;
      flex-wrap: wrap;
      -webkit-box-align: start;
      -webkit-align-items: flex-start;
      -ms-flex-align: start;
      align-items: flex-start;
   }

   .scxx .result-further-info span {
      margin-top: 7px;
   }

   .scxx .result-more {
      -webkit-box-ordinal-group: 3;
      -webkit-order: 2;
      -ms-flex-order: 2;
      order: 2;
      margin-left: 3px;
   }

   .scxx .result-selection {
      width: 100%;
      padding: 0px 0;
   }

   .scxx .result-panel-details .contact {
      font-size: 1.2rem;
   }

   .scxx .delivery-label {
      display: block;
      border-right: 0px;
   }

   .scxx .now {
      display: none;
   }

   .scxx .results-component-manual-items-container .help-plan.result .result-container,
   .scxx .results-component-manual-items-container .list-item {
      padding-right: 10px;
      padding-bottom: 65px;
   }

   .scxx .results-picker .help-plan-item-actions {
      right: calc(50% - 85px);
      top: auto;
      bottom: 12px;
   }

   .scxx .result-select {
      max-width: none;
   }

   .scxx .pathway-nav-continue {
      display: none;
   }

   .scxx .step-support-lookup-container {
      margin: 2px 0px 0px 0px;
   }

   .scxx .nlp-input {
      margin: 0 1px;
      padding-left: 4px;
   }

   .scxx .split-layout-icon {
      width: 100px;
      height: 100px;
      line-height: 100px;
      font-size: 4rem;
   }

   .scxx .split-layout-title {
      margin: 80px auto 0 auto;
   }

   .scxx .interact-step-top-navigation {
      min-height: 130px;
      padding-bottom: 50px;
   }
}

@media screen and (max-width: 1000px) {
   .scxx .interact-step-top-icon-container {
      left: 20px;
   }
}

@media screen and (max-width: 800px) {
   .scxx .result-details-container {
      display: block;
   }

   .scxx .service-description-panel {
      width: 100%;
   }
}

@media screen and (max-width: 700px) {
   .scxx .pathway-interact-element .tiles .select-component-button {
      margin: 6px auto;
   }

   .scxx .pool .pool-header {
      display: block;
   }

   .scxx .pool.minimized .pool-header-text {
      width: auto;
   }

   .scxx .pool.minimized.has-help-text .pool-explanation:before {
      font-size: 2rem !important;
      width: 30px;
   }

   .scxx .pool.minimized .pool-explanation,
   .scxx .pool.minimized .pool-help-text {
      padding-left: 45px;
      max-width: none;
   }

   .scxx .step-question.minimized {
      padding-right: 25px;
   }

   .scxx .step-question-expand {
      width: 25px;
      height: 25px;
      overflow: hidden;
      padding: 2px 0 0 6px;
   }
}

.scxx .accessibility-size-large,
.scxx .accessibility-size-large button,
.scxx .accessibility-size-large .bottom-nav-progression,
.scxx .accessibility-size-large .split-layout-sub-text,
.scxx .accessibility-size-large .pathway-back,
.scxx .accessibility-size-large .pathway-nav-continue,
.scxx .accessibility-size-large .pathway-interact-element .select-component-button,
.scxx .accessibility-size-large .form-element-input-container input,
.scxx .accessibility-size-large .pool-explanation,
.scxx .accessibility-size-large .rounded-button,
.scxx .accessibility-size-large .service-tag,
.scxx .accessibility-size-large .service-info-panel .delivery-tag,
.scxx .accessibility-size-large .pathway-navigation-panel-content,
.scxx .accessibility-size-large .interact-flash-message-text,
.scxx .accessibility-size-large .useful-questions-bar .step-question-text,
.scxx .accessibility-size-large .preferences-panel-set-toggle-title,
.scxx .accessibility-size-large .preferences-panel-set-toggle-subtitle {
   font-size: 20px !important;
}

.scxx .accessibility-size-large .split-layout-title {
   font-size: 1.6rem;
}

.scxx .floating-menu-edit.fixed-width button,
.scxx .accessibility-size-xlarge .floating-menu-edit.fixed-width button {
   width: auto;
}

.scxx .accessibility-size-xlarge,
.scxx .accessibility-size-xlarge button,
.scxx .accessibility-size-xlarge .bottom-nav-progression,
.scxx .accessibility-size-xlarge .split-layout-sub-text,
.scxx .accessibility-size-xlarge .pathway-back,
.scxx .accessibility-size-xlarge .pathway-nav-continue,
.scxx .accessibility-size-xlarge .pathway-interact-element .select-component-button,
.scxx .accessibility-size-xlarge .form-element-input-container input,
.scxx .accessibility-size-xlarge .pool-explanation,
.scxx .accessibility-size-xlarge .rounded-button,
.scxx .accessibility-size-xlarge .service-tag,
.scxx .accessibility-size-xlarge .service-info-panel .delivery-tag,
.scxx .accessibility-size-xlarge .pathway-navigation-panel-content,
.scxx .accessibility-size-xlarge .interact-flash-message-text,
.scxx .accessibility-size-xlarge .useful-questions-bar .step-question-text,
.scxx .accessibility-size-xlarge .preferences-panel-set-toggle-title,
.scxx .accessibility-size-xlarge .preferences-panel-set-toggle-subtitle {
   font-size: 24pt !important;
}

.scxx .accessibility-size-xlarge .split-layout-title {
   font-size: 1.8rem;
}

.scxx .accessibility-size-xlarge .results-picker {
   width: auto;
}

.scxx .accessibility-size-xlarge .service-info-accordion-toggle {
   padding-left: 50px;
}

.scxx .accessibility-size-xlarge .result-select {
   height: 52px;
   max-width: 240px;
}

.scxx .pathway-navigation-panel-disabled {
   background: #ccc;
   color: #666;
   pointer-events: none;
}