:root,
:after,
:before {
  --max-view-width: 1047px;
  --wrapper-padding-x: var(--space-s);
  --default-outline: -webkit-focus-ring-color auto 2px;
  --color-primary: #092a68;
  --color-primary-support: #163c82;
  --color-primary-light: #234d9c;
  --color-coral: #fa602d;
  --color-red-01: #d30000;
  --color-red-02: #dd0000;
  --color-yellow: #f6bd00;
  --color-pink: #f9e4e4;
  --color-green: #1a8509;
  --color-light-green: #f2f6eb;
  --color-rose-white: #feefea;
  --color-off-yellow: #fef5d9;
  --color-gray-01: #f4f6f9;
  --color-gray-02: #c2cad8;
  --color-gray-03: #5e6778;
  --color-gray-04: #181f2c;
  --color-interaction: var(var(--color-primary-support));
  --color-hover: var(--color-primary-light);
  --color-error: var(--color-red-02);
  --color-error-light: var(--color-pink);
  --color-success-light: var(--color-light-green);
  --color-warning: var(--color-rose-white);
  --color-other-message: var(--color-off-yellow);
  --color-success: var(--color-green);
  --color-black: #000000;
  --color-white: #ffffff;
  --color-grays-white: #fff;
  --gradient-background: linear-gradient(
    223.79deg,
    #092a68 23.88%,
    #163c82 86.94%
  );
  --gradient-background-2: linear-gradient(90deg, #092a68 40.21%, #163c82 100%);
  --thecb-primary-font: "Lexend Deca";
  --font-primary-gray: #4b4b4b;
  --font-weight-normal: 400;
  --font-weight-semi-bold: 600;
  --font-weight-bold: 700;
  --thecb-font-awesome: "Font Awesome 6 Pro";
  --thecb-font-awesome-weight: 400;
  --thecb-font-awesome-weight-solid: 900;
  --12px: 0.75rem;
  --14px: 0.875rem;
  --16px: 1rem;
  --18px: 1.125rem;
  --19px: 1.188rem;
  --20px: 1.25rem;
  --22px: 1.375rem;
  --24px: 1.5rem;
  --25px: 1.563rem;
  --26px: 1.625rem;
  --28px: 1.75rem;
  --29px: 1.813rem;
  --30px: 1.875rem;
  --32px: 2rem;
  --34px: 2.125rem;
  --36px: 2.24rem;
  --37px: 2.313rem;
  --38px: 2.375rem;
  --40px: 2.5rem;
  --42px: 2.625rem;
  --44px: 2.75rem;
  --45px: 2.183rem;
  --46px: 2.875rem;
  --48px: 3rem;
  --50px: 3.125rem;
  --51px: 3.188rem;
  --52px: 3.25rem;
  --54px: 3.375rem;
  --55px: 3.4375rem;
  --56px: 3.5rem;
  --60px: 3.75rem;
  --64px: 4rem;
  --66px: 4.125rem;
  --68px: 4.25rem;
  --74px: 4.625rem;
  --77px: 4.813rem;
  --78px: 4.875rem;
  --80px: 5rem;
  --82px: 5.125rem;
  --98px: 6.125rem;
  --102px: 6.375rem;
  --font-size-small: var(--14px);
  --line-height-small: var(--22px);
  --font-size-medium: var(--16px);
  --line-height-medium: var(--26px);
  --font-size-large: var(--18px);
  --line-height-large: var(--29px);
  --font-size-caption: var(--12px);
  --line-height-caption: var(--19px);
  --font-size-form: var(--font-size-medium);
  --line-height-form: var(--22px);
  --font-size-title: var(--64px);
  --line-height-title: var(--102px);
  --font-size-h1: var(--48px);
  --line-height-h1: var(--50px);
  --font-size-h2: var(--40px);
  --line-height-h2: var(--64px);
  --font-size-h3: var(--32px);
  --line-height-h3: var(--40px);
  --font-size-h4: var(--22px);
  --line-height-h4: var(--30px);
  --font-size-h5: var(--20px);
  --line-height-h5: var(--32px);
  --line-height-button: var(--32px);
  --icon-height-medium: var(--25px);
  --icon-spacing-medium: 27px;
  --margin-spacing-small: var(--12px);
  --content-spacing-large: var(--45px);
  --fa-sm: 1rem;
  --fa-md: 1.125rem;
  --fa-lg: 1.5rem;
  --base-spacer: 8px;
  --space-xxxs: calc(var(--base-spacer) / 2);
  --space-xxs: var(--base-spacer);
  --space-xs: calc(var(--base-spacer) * 2);
  --space-s: calc(var(--base-spacer) * 3);
  --space-m: calc(var(--base-spacer) * 4);
  --space-l: calc(var(--base-spacer) * 5);
  --space-xl: calc(var(--base-spacer) * 7);
  --space-xxl: calc(var(--base-spacer) * 9);
  --space-xxxl: calc(var(--base-spacer) * 13.5);
  --space-xxxxl: calc(var(--base-spacer) * 22.5);
  --base-token-spacer: 8px;
  --token-spacer-a: calc(var(--base-token-spacer) * 1);
  --token-spacer-b: calc(var(--base-token-spacer) * 2);
  --token-spacer-c: calc(var(--base-token-spacer) * 3);
  --token-spacer-d: calc(var(--base-token-spacer) * 4);
  --token-spacer-e: calc(var(--base-token-spacer) * 6);
  --token-spacer-f: calc(var(--base-token-spacer) * 8);
  --token-spacer-g: calc(var(--base-token-spacer) * 10);
  --token-spacer-h: calc(var(--base-token-spacer) * 13);
  --thecb-box-shadow-1: 0px 4px 4px rgba(0, 0, 0, 0.25);
  --thecb-box-shadow-2: 0px 12px 12px rgba(0, 0, 0, 0.25);
  --thecb-box-shadow-3: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  --thecb-content-padding-1: 0px var(--space-s);
  --thecb-content-padding-2: 2px var(--space-s);
  --thecb-content-padding-3: 4px var(--space-xs);
  --thecb-content-padding-4: 8px var(--space-s);
  --acordion-transition-duration: 0.3s;
}

@media all and (max-width: 789px) {
  :root,
  :after,
  :before {
    --font-size-title: var(--48px);
    --line-height-title: var(--60px);
    --font-size-h1: var(--40px);
    --line-height-h1: var(--50px);
    --font-size-h2: var(--36px);
    --line-height-h2: var(--45px);
    --font-size-h3: var(--32px);
    --line-height-h3: var(--40px);
    --font-size-h4: var(--22px);
    --line-height-h4: var(--30px);
    --font-size-h5: var(--20px);
    --line-height-h5: var(--25px);
  }
}

* {
  box-sizing: border-box;
}

main {
  position: relative;
  width: 100%;
}

main:before {
  content: "";
  background-image: url(https://devstgapplytxb2c.blob.core.windows.net/b2c/grid-background.a36064fb.png);
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  opacity: 0.6;
  z-index: -1;
}

a:hover {
  color: var(--color-primary-light);
}

html {
  font-size: var(--16px);
}

body {
  color: var(--font-primary-gray);
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-large);
  font-weight: var(--font-weight-normal);
  letter-spacing: 0;
  line-height: var(--line-height-large);
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5 {
  font-family: var(--thecb-primary-font);
  font-weight: var(--font-weight-bold);
}
h3 {
  color: var(--color-primary);
}

.banner-header {
  color: var(--color-gray-04);
}

.hero-title {
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-title);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-title);
  text-transform: uppercase;
}

h1,
.h1 {
  font-size: var(--font-size-h1);
  line-height: var(--line-height-h1);
}

h2,
.h2 {
  font-size: var(--font-size-h2);
  line-height: var(--line-height-h2);
}

h3,
.h3 {
  font-size: var(--font-size-h3);
  line-height: var(--line-height-h3);
}

h4,
.h4 {
  font-size: var(--font-size-h4);
  line-height: var(--line-height-h4);
}

h5,
.h5 {
  font-size: var(--font-size-h5);
  line-height: var(--line-height-h5);
}

p,
ul {
  font-size: var(--font-size-large);
  line-height: var(--line-height-large);
}

.font-size-large {
  font-size: var(--font-size-large) !important;
  line-height: var(--line-height-large) !important;
}

.font-size-medium {
  font-size: var(--font-size-medium) !important;
  line-height: var(--line-height-medium) !important;
}

.font-size-small:before,
.font-size-small:after {
  --icon-margin: var(--space-xxs) !important;
  --icon-size: var(--fa-sm) !important;
}

.caption,
.caption-bold,
figcaption {
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-caption);
  line-height: var(--line-height-caption);
}

.caption-bold {
  font-weight: var(--font-weight-bold);
}

label,
.label {
  color: var(--color-gray-03);
  font-size: var(--font-size-medium);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-medium);
}

a,
.button-link {
  color: var(--color-primary);
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-medium);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-medium);
  text-decoration: underline;
}

p a,
p .button-link {
  font-size: inherit;
  color: var(--color-primary);
}

a:hover,
a:focus,
.button-link:hover,
.button-link:focus {
  color: var(--color-hover);
}

.delete-link,
.edit-link,
.share-link,
.arrow-link,
.download-link,
.external-link {
  font-size: var(--font-size-medium);
  line-height: var(--line-height-medium);
  text-decoration: none;
}

.delete-link:before,
.edit-link:before,
.share-link:before,
.arrow-link:after,
.external-link:after,
.download-link:before {
  --icon-margin: var(--space-xxs);
  --icon-size: var(--font-size-large);
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-family: var(--thecb-font-awesome);
  font-size: var(--icon-size);
  font-style: normal;
  font-variant: normal;
  font-weight: var(--thecb-font-awesome-weight);
  line-height: var(--line-height-medium);
  text-rendering: auto;
}

.arrow-link:after,
.external-link:after {
  margin-left: var(--icon-margin);
}

.arrow-link:after {
  content: "\f35a";
}

.external-link:after {
  content: "\f08e";
}

.delete-link:before,
.edit-link:before,
.share-link:before,
.download-link:before {
  margin-right: var(--icon-margin);
}

.download-link:before {
  content: "\f019";
}

.share-link:before {
  content: "\f1e0";
}

.edit-link:before {
  content: "\f044";
}

.delete-link:before {
  content: "\f2ed";
}

.button-link {
  background: none !important;
  border: none;
  cursor: pointer;
  display: inline !important;
  margin: 0;
  padding: 0 !important;
  text-align: left;
  user-select: text;
  -moz-user-select: text;
}

button {
  font-family: var(--thecb-primary-font);
}

.bold {
  font-weight: var(--font-weight-bold);
}

.font-color-primary-brand {
  color: var(--color-primary);
}

.font-color-secondary-gray {
  color: var(--color-gray-02);
}

.font-color-error {
  color: var(--color-error);
}

@media all and (max-width: 789px) {
  p,
  ul,
  .delete-link,
  .edit-link,
  .share-link,
  .arrow-link,
  .external-link,
  .download-link {
    font-size: var(--font-size-medium);
    line-height: var(--line-height-medium);
  }

  .delete-link:before,
  .edit-link:before,
  .share-link:before,
  .arrow-link:after,
  .external-link:after,
  .download-link:before {
    --icon-margin: var(--space-xxs);
    --icon-size: var(--fa-md);
  }
}

.wrapper {
  margin: auto;
  max-width: var(--max-view-width);
  padding: 0 var(--space-s);
  right: 0;
}

.container {
  --grid-gap: var(--space-xs);
  --columns: 12;
  display: grid;
  grid-auto-columns: minmax(1fr, auto);
  grid-template-columns: repeat(12, [col-start] 1fr);
  gap: var(--grid-gap);
  grid-auto-rows: auto;
  justify-content: center;
}

.container .col-1,
.container .col-2,
.container .col-3,
.container .col-4,
.container .col-5,
.container .col-6,
.container .col-7,
.container .col-8,
.container .col-9,
.container .col-10,
.container .col-11,
.container .col-12 {
  --col-multiplier: 1;
  box-sizing: border-box;
  grid-column-end: span var(--col-multiplier);
  width: 100%;
}

.container .col-2 {
  --col-multiplier: 2;
}

.container .col-3 {
  --col-multiplier: 3;
}

.container .col-4 {
  --col-multiplier: 4;
}

.container .col-5 {
  --col-multiplier: 5;
}

.container .col-6 {
  --col-multiplier: 6;
}

.container .col-7 {
  --col-multiplier: 7;
}

.container .col-8 {
  --col-multiplier: 8;
}

.container .col-9 {
  --col-multiplier: 9;
}

.container .col-10 {
  --col-multiplier: 10;
}

.container .col-11 {
  --col-multiplier: 11;
}

.container .col-12 {
  --col-multiplier: 12;
}

.container .col-start-1,
.container .col-start-2,
.container .col-start-3,
.container .col-start-4,
.container .col-start-5,
.container .col-start-6,
.container .col-start-7,
.container .col-start-8,
.container .col-start-9,
.container .col-start-10,
.container .col-start-11,
.container .col-start-12 {
  --col-start: 1;
  grid-column-start: var(--col-start);
}

.container .col-start-2 {
  --col-start: 2;
}

.container .col-start-3 {
  --col-start: 3;
}

.container .col-start-4 {
  --col-start: 4;
}

.container .col-start-5 {
  --col-start: 5;
}

.container .col-start-6 {
  --col-start: 6;
}

.container .col-start-7 {
  --col-start: 7;
}

.container .col-start-8 {
  --col-start: 8;
}

.container .col-start-9 {
  --col-start: 9;
}

.container .col-start-10 {
  --col-start: 10;
}

.container .col-start-11 {
  --col-start: 11;
}

.container .col-start-12 {
  --col-start: 12;
}

.col-first {
  order: -1;
}

.col-last {
  order: 12;
}

@media screen and (max-width: 789px) {
  .wrapper {
    padding: 0 var(--space-s);
  }

  .container {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
  }

  .container .col-1,
  .container .col-2,
  .container .col-3,
  .container .col-4,
  .container .col-5,
  .container .col-6,
  .container .col-7,
  .container .col-8,
  .container .col-9,
  .container .col-10,
  .container .col-11,
  .container .col-12,
  .container .col {
    grid-column: auto;
  }

  .col-first-mobile {
    order: -1;
  }

  .col-last-mobile {
    order: 12;
  }
}

.thecb-button--large,
.thecb-button--primary,
.thecb-button--secondary,
.thecb-button--small,
.thecb-button--secondary--small {
  align-items: center;
  border: 0;
  box-sizing: border-box;
  column-gap: var(--space-xxs);
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  text-align: center;
  text-decoration: none;
}

.thecb-button--primary,
.thecb-button--secondary {
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-h5);
}

.thecb-button--large {
  font-size: var(--font-size-large);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-large);
}

.thecb-button--large:disabled,
.thecb-button--primary:disabled,
.thecb-button--secondary:disabled,
.thecb-button--large.disabled,
.thecb-button--primary.disabled,
.thecb-button--secondary.disabled,
.thecb-button--secondary--small.disabled {
  background-color: var(--color-gray-04);
  color: var(--color-gray-01);
}

.thecb-button--large.disabled,
.thecb-button--primary.disabled,
.thecb-button--secondary.disabled,
.thecb-button--secondary--small.disabled {
  cursor: not-allowed;
  pointer-events: none;
}

.thecb-button--large {
  background-color: var(--color-primary);
  border-radius: 8px;
  border: none;
  color: var(--color-white);
  padding: 21.5px 24px;
}

.thecb-button--large:not(:disabled):hover,
.thecb-button--large:not(:disabled):focus {
  background-color: var(--color-hover-dark);
  color: var(--color-white);
}

.thecb-button--primary,
.thecb-button--secondary {
  --primary-secondary-padding-x: 24px;
  --primary-secondary-padding-y: 8px;
  border-radius: 36px;
  padding: var(--primary-secondary-padding-y) var(--primary-secondary-padding-x);
}

.thecb-button--primary i,
.thecb-button--secondary i,
.thecb-button--secondary--small i {
  font-size: var(--fa-sm);
}

.thecb-button--primary {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.thecb-button--primary:not(:disabled):hover,
.thecb-button--primary:not(:disabled):focus {
  background-color: var(--color-hover-dark);
  color: var(--color-white);
}

.thecb-button--secondary {
  --button-border: 6px;
  background-color: var(--color-white);
  border: var(--button-border) solid var(--color-razzmatazz);
  color: var(--color-razzmatazz);
  padding: calc(var(--primary-secondary-padding-y) - var(--button-border))
    calc(var(--primary-secondary-padding-x) - var(--button-border));
}

.thecb-button--secondary:not(:disabled):hover,
.thecb-button--secondary:not(:disabled):focus,
.thecb-button--secondary--small:hover,
.thecb-button--secondary--small:not(:disabled):focus {
  border: var(--button-border) solid var(--color-razzmatazz-dark);
  color: var(--color-razzmatazz-dark);
}

.thecb-button--secondary--small,
.thecb-button--small {
  background-color: var(--color-white);
  font-size: var(--font-size-small);
  line-height: var(--line-height-h5);
  padding: 8px 24px;
}

.thecb-button--secondary--small {
  --button-border: 6px;
  border: var(--button-border) solid var(--color-razzmatazz);
  border-radius: 82px;
  color: var(--color-razzmatazz);
  font-weight: var(--font-weight-bold);
}

.thecb-button--small {
  border-radius: 36px;
  color: var(--color-primary);
  font-weight: var(--font-weight-normal);
}

.thecb-button-default--small {
  border-radius: 36px;
  color: var(--color-white);
  background-color: unset !important;
  font-weight: var(--font-weight-normal);
}

@media all and (max-width: 480px) {
  .thecb-button--large,
  .thecb-button--primary,
  .thecb-button--secondary,
  .thecb-button--small {
    box-sizing: border-box;
    width: 100%;
  }
}

.site-header {
  --nav-padding: 3px;
  background-color: var(--color-primary);
  color: var(--color-white);
  padding: var(--nav-padding) 0;
  position: relative;
  z-index: 10;

  > .wrapper {
    max-width: 100% !important;
  }
}

.site-header__content {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.site-header__content a {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.site-header__content a img {
  max-width: 100%;
}

a.skip-to-content {
  background: var(--color-white);
  color: var(--color-primary);
  left: 0;
  padding: var(--space-xxs);
  position: absolute;
  transform: translateY(-100%);
  transition: transform 0.3s;
  z-index: 101;
}

a.skip-to-content:focus {
  transform: translateY(0);
}

@media all and (max-width: 480px) {
  .site-header__content .thecb-button--small {
    width: initial;
  }
}

.footer {
  background: var(--color-primary);
  box-shadow: 0 0 8px #00000040;
  font-size: var(--font-size-caption);
  padding: var(--token-spacer-e) 0;
  color: var(--color-white);
}

.nav-footer-logo {
  height: 100px;
  width: auto;
}

.nav-top-wrapper {
  font-size: var(--font-size-caption);
}

.nav-footer-menu-container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.nav-footer-menu-items {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: var(--token-space-a);
  list-style: none;
}

.nav-footer-menu-items li.nav-footer-menu-item a {
  font-size: var(--font-size-caption);
  font-weight: var(--font-weight-normal);
  text-decoration: none;
}

.footer a {
  color: var(--color-white);
  text-decoration: none;
}

.nav-footer-social-container {
  border-top: 1px solid #c2cad84d;
  margin-top: var(--token-spacer-f);
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

ul.nav-footer-social-list {
  list-style: none;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 18px;
}

ul.nav-footer-social-list li a img {
  width: 24px;
  aspect-ratio: auto 24 / 24;
  height: 24px;
}

.footer-site-info-section {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  padding: 25px 0 62px;
}

.footer-site-info-section p {
  color: var(--color-white);
}

.footer-menu-links {
  --menu-links-col-gap: var(--space-xxxl);
  align-items: center;
  column-gap: var(--menu-links-col-gap);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  row-gap: var(--space-s);
}

.footer-menu,
.footer-menu-links {
  padding: 0;
}

.footer-menu li,
.footer-menu-links li {
  display: inline;
  list-style: none;
}

.footer-menu li a,
.footer-menu-links li a {
  font-weight: var(--font-weight-normal);
}

.footer-menu li a:hover,
.footer-menu-links li a:hover {
  cursor: pointer;
  color: var(--color-light-blue);
}

.footer-menu-icons {
  padding-right: 30px;
}

.footer-logo-wrapper {
  display: flex;
  flex: 1;
  margin-bottom: -25px;
  margin-left: -25px;
}

@media screen and (max-width: 1368px) {
  .footer-secondary-links {
    --menu-links-col-gap: var(--space-xxl);
  }
}

@media (max-width: 768px) {
  .footer-links-section {
    align-items: flex-start;
    flex-direction: column-reverse;
  }

  .footer-menu-items {
    padding-right: 0;
  }

  .footer-menu-links {
    --menu-links-col-gap: 0px;
    align-items: flex-start;
  }

  .footer-secondary-links {
    --menu-links-col-gap: 0px;
    flex-direction: column;
  }

  .footer-menu-links li {
    flex-basis: 50%;
    padding-bottom: 30px;
  }

  .footer-site-info-section {
    align-items: flex-start;
    flex-direction: column-reverse;
  }
}

.login-card {
  align-items: center;
  background: var(--color-white);
  box-sizing: border-box;
  flex-direction: column;
  height: 100%;
  display: flex;
  flex-direction: row;
  padding: 0;
  border-radius: 32px;
  overflow: hidden;
}

.login-card .login-form,
.login-card .login-image {
  width: 50%;
}

.login-card .login-form {
  padding: var(--token-spacer-d) var(--token-spacer-e) var(--token-spacer-a);
}

@media (min-width: 768px) {
  .login-card {
    border-radius: 32px;
    box-shadow: 0 0px 12px #00000040;
  }
}

@media (max-width: 768px) {
  .login-card .login-form {
    width: 100%;
  }
}

.login-page .login-card {
  height: inherit;
  margin: 10px 0;
}

.login-page #api .claims-provider-list-buttons,
.login-page #api .divider {
  display: none;
}

.login-page .login-image-wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
}

@media (max-width: 768px) {
  .login-page .login-image {
    display: none;
  }
}

.login-page #api {
  --form-margin-bottom: var(--token-spacer-b);
}

.login-page #api .intro {
  margin-bottom: var(--form-margin-bottom);
}

.login-page #api .intro h2 {
  margin: 0;
}

.login-page #api form .entry .entry-item {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--form-margin-bottom);
}

.login-page #api form .entry .entry-item label {
  color: var(--color-gray-04);
  display: inline;
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-bold);
  line-height: normal;
  margin: 0 0 var(--token-spacer-a);
  overflow-wrap: break-word;
}

.login-page #api form .entry .entry-item input {
  --additional-padding: 1px;
  --input-padding: var(--token-spacer-b);
  --input-radius: 8px;
  --input-background-color: var(--color-gray-01);
  -moz-column-gap: var(--token-spacer-a);
  background: var(--input-background-color);
  border-radius: var(--input-radius);
  border: 1px solid var(--input-background-color);
  color: var(--color-gray-04);
  column-gap: var(--token-spacer-a);
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-normal);
  height: 100%;
  padding: calc(var(--input-padding) + var(--additional-padding));
  width: 100%;
}

.login-page #api form .error.pageLevel,
.login-page #api form .entry .entry-item .error.itemLevel[aria-hidden="false"] {
  color: var(--color-error);
  font-weight: 700;
  order: 3;
}

.login-page
  #api
  form
  .entry
  .entry-item
  .error.itemLevel[aria-hidden="false"]
  p {
  margin: 0;
}

.login-page
  #api
  form
  .entry
  .entry-item
  .error.itemLevel[aria-hidden="false"]
  ~ input {
  border: 2px solid var(--color-error);
}

.login-page #api form .entry .entry-item .password-label {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.login-page #api form .entry .entry-item .password-label a#forgotPassword {
  font-size: var(--font-size-small);
  line-height: normal;
  margin: 0 0 var(--token-spacer-a);
}

.login-page #api form .rememberMe {
  margin-bottom: var(--form-margin-bottom);
}

.login-page #api form .rememberMe label {
  font-weight: 400;
}

@media (max-width: 768px) {
  #api form .rememberMe {
    text-align: left;
  }
}

.login-page #api form .buttons {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-bottom: var(--form-margin-bottom);
}

.login-page #api form .buttons button {
  --primary-secondary-padding-x: 24px;
  --primary-secondary-padding-y: 8px;
  -moz-column-gap: var(--token-spacer-a);
  align-items: baseline;
  background-color: var(--color-primary);
  border-radius: 36px;
  border: 0;
  box-sizing: border-box;
  color: var(--color-white);
  column-gap: var(--token-spacer-a);
  cursor: pointer;
  display: inline-flex;
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-medium);
  font-weight: var(--font-weight-bold);
  justify-content: center;
  line-height: var(--line-height-large);
  padding: var(--primary-secondary-padding-y) var(--primary-secondary-padding-x);
  text-align: center;
  text-decoration: none;
  width: 100%;
}

.login-page #api form .buttons button:hover,
.login-page #api form .buttons button:focus {
  background-color: var(--color-primary-light);
}

.login-page #api form .create {
  display: flex;
  flex-direction: row;
  justify-content: left;
}

.login-page #api form .create p {
  margin: 0;
}

.login-page #api form .create p,
.login-page #api form .create a {
  font-size: var(--font-size-medium);
  line-height: var(--32px);
}

.login-page #api form .create a {
  margin-left: 5px;
}

.create-account-page h2 {
  margin-bottom: var(--space-xxs);
}

.create-account-page #api .intro {
  display: none;
}

.create-account-page #api form .error.pageLevel {
  color: var(--color-error);
  font-size: var(--font-size-medium);
  font-weight: 700;
}

.create-account-page #api form #attributeList.attr ul {
  display: grid;
  gap: var(--space-m);
  grid-template-columns: 1fr 1fr;
  list-style: none;
  padding: 0;
}

.create-account-page #api form #attributeList.attr ul li.TextBox:first-of-type,
.create-account-page #api form #attributeList.attr ul li.Password,
.create-account-page #api form #attributeList.attr ul li.Paragraph,
.create-account-page #api form #attributeList.attr ul li.email_li,
.create-account-page #api form #attributeList.attr ul li.newPassword_li,
.create-account-page #api form #attributeList.attr ul li.reenterPassword_li,
.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li.customPasswordUserText_li,
.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li.termsAndServiceText_li {
  grid-column: 1/-1;
}

.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li.TextBox:first-of-type
  .attrEntry,
.create-account-page #api form #attributeList.attr ul li.Password {
  width: 50%;
  padding-right: calc(var(--space-m) / 2);
}

.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li.TextBox:first-of-type
  .attrEntry
  > div {
  display: none;
}

.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li.TextBox:first-of-type
  .attrEntry
  .buttons.verify {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.create-account-page #api form #attributeList.attr ul li .attrEntry {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--form-margin-bottom);
}

.create-account-page #api form #attributeList.attr ul li .attrEntry input,
.create-account-page #api form #attributeList.attr ul li .attrEntry select {
  --additional-padding: 1px;
  --input-padding: var(--space-xs);
  --input-radius: 8px;
  -moz-column-gap: var(--space-xxs);
  background: var(--color-gray-01);
  border-radius: var(--input-radius);
  border: 1px solid var(--color-gray-03);
  color: var(--color-gray-04);
  column-gap: var(--space-xxs);
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-medium);
  font-weight: var(--font-weight-normal);
  height: 100%;
  padding: calc(var(--input-padding) + var(--additional-padding));
  width: 100%;
}

.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  input::placeholder {
  opacity: 0;
}

.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  .error.itemLevel[aria-hidden="false"] {
  color: var(--color-error);
  font-size: var(--font-size-medium);
  font-weight: 700;
  order: 3;
}

.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  .error.itemLevel[aria-hidden="false"]
  p {
  margin: 0;
}

.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  .error.itemLevel[aria-hidden="false"]
  ~ input,
.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  .error.itemLevel[aria-hidden="false"]
  ~ div
  select {
  border: 2px solid var(--color-error);
}

.create-account-page #api form #attributeList.attr ul li .attrEntry select {
  height: 60px;
}

.create-account-page #api form #attributeList.attr ul li .attrEntry .date {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr 1fr;
}

.create-account-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  a.helpLink.tiny {
  display: none;
}

.create-account-page #api form .buttons {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}

.create-account-page #api form .buttons button {
  --primary-secondary-padding-x: 24px;
  --primary-secondary-padding-y: 8px;
  -moz-column-gap: var(--space-xxs);
  align-items: baseline;
  background-color: var(--color-primary);
  border-radius: 36px;
  border: 0;
  box-sizing: border-box;
  color: var(--color-white);
  column-gap: var(--space-xxs);
  cursor: pointer;
  display: inline-flex;
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-medium);
  justify-content: center;
  line-height: var(--line-height-large);
  padding: var(--primary-secondary-padding-y) var(--primary-secondary-padding-x);
  margin: var(--token-spacer-b);
  text-align: center;
  text-decoration: none;
}

.create-account-page #api form .buttons button:hover,
.create-account-page #api form .buttons button:focus {
  background-color: var(--color-hover);
}

.create-account-page #api form .verifying-modal #verifying_blurb,
.create-account-page label#customPasswordUserText_label,
.create-account-page label#termsAndServiceText_label,
.create-account-page #api form .buttons button#cancel {
  display: none;
}

.create-account-page #api form .buttons button#continue {
  width: 250px;
}

@media (max-width: 768px) {
  .create-account-page
    #api
    form
    #attributeList.attr
    ul
    li.TextBox:first-of-type
    .attrEntry,
  .create-account-page #api form #attributeList.attr ul li.Password {
    width: 100%;
    padding-right: unset;
  }

  .create-account-page #api form #attributeList.attr ul {
    grid-template-columns: 1fr;
  }

  .create-account-page #api form .buttons {
    justify-content: center;
    margin-bottom: var(--space-m);
  }

  .create-account-page #api form .buttons button#continue {
    width: 100%;
  }
}

.password-reset-page .login-card {
  text-align: center;
  display: flex;
  flex-direction: column;
  padding: var(--token-spacer-d);
}

.password-reset-page .login-card h2,
.password-reset-page #api {
  width: 100%;
}

.password-reset-page #api div,
p {
  font-size: var(--font-size-medium) !important;
  color: var(--color-gray-04);
  line-height: var(--line-height-medium) !important;
}

.password-reset-page #api .heading {
  display: none;
}

.password-reset-page #api form .error.pageLevel {
  color: var(--color-error);
  font-size: var(--16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--32px);
}

.password-reset-page #api form #attributeList.attr ul {
  list-style: none;
  padding: 0;
  margin-bottom: var(--space-s);
}

.password-reset-page #api form #attributeList.attr ul li .attrEntry {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--form-margin-bottom);
}

.password-reset-page #api form #attributeList.attr ul li .attrEntry label {
  display: none;
}

.password-reset-page #api form #attributeList.attr ul li .attrEntry input {
  --additional-padding: 1px;
  --input-padding: var(--space-xs);
  --input-radius: 8px;
  -moz-column-gap: var(--space-xxs);
  background: var(--input-background-color);
  border-radius: var(--input-radius);
  border: 1px solid var(--color-gray-03);
  color: var(--color-gray-04);
  column-gap: var(--space-xxs);
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-medium);
  font-weight: var(--font-weight-normal);
  height: 100%;
  margin: var(--space-s) 0;
  padding: calc(var(--input-padding) + var(--additional-padding));
  width: 100%;
}

.password-reset-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  a.helpLink.tiny {
  display: none;
}

.password-reset-page
  #api
  form
  #attributeList.attr
  ul
  li
  #resetEmail_intro.verificationInfoText {
  display: none !important;
}

.password-reset-page #api form .buttons.verify {
  display: flex;
  flex-direction: column;
}

.password-reset-page #api form .buttons.verify input {
  --additional-padding: 1px;
  --input-padding: var(--space-xs);
  --input-radius: 8px;
  -moz-column-gap: var(--space-xxs);
  background: var(--input-background-color);
  border-radius: var(--input-radius);
  border: 1px solid var(--color-gray-03);
  color: var(--color-gray-01);
  column-gap: var(--space-xxs);
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-medium);
  font-weight: var(--font-weight-normal);
  height: 100%;
  margin-bottom: var(--space-l);
  padding: calc(var(--input-padding) + var(--additional-padding));
  width: 100%;
}

.password-reset-page #api form .buttons.verify label {
  align-self: baseline;
}

.password-reset-page #api form .buttons.verify button:not(.editButton) {
  --primary-secondary-padding-x: 24px;
  --primary-secondary-padding-y: 8px;
  -moz-column-gap: var(--space-xxs);
  align-items: baseline;
  background-color: var(--color-primary);
  border-radius: 36px;
  border: 0;
  box-sizing: border-box;
  color: var(--color-white);
  column-gap: var(--space-xxs);
  cursor: pointer;
  display: inline-flex;
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-large);
  font-weight: var(--font-weight-bold);
  justify-content: center;
  line-height: var(--line-height-large);
  margin-bottom: var(--space-s);
  padding: var(--primary-secondary-padding-y) var(--primary-secondary-padding-x);
  text-align: center;
  text-decoration: none;
  width: 100%;
}

.password-reset-page #api form .buttons.verify button:hover,
.password-reset-page #api form .buttons.verify button:focus {
  background-color: var(--color-primary-light);
}

.password-reset-page #api form .buttons button:hover,
.password-reset-page #api form .buttons button:focus {
  color: var(--color-primary-light);
}

.password-reset-page #api form .buttons button#continue[aria-disabled="true"] {
  display: none;
}

.password-reset-page #api form .buttons:not(.verify) {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.password-reset-page #api form .buttons.verify button#resetEmail_ver_but_resend,
.password-reset-page #api form .buttons button {
  background: transparent;
  border: none;
  color: var(--color-primary);
  font-size: var(--16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--32px);
  text-align: center;
  text-decoration-line: underline;
}

.password-reset-page #api form .buttons button.sendCode {
  background: var(--color-primary);
  border: none;
  color: var(--color-white);
  border-radius: 36px;
  text-decoration-line: none;
  width: 100%;
  margin-top: 10px;
}

.password-reset-page #api form .buttons button.sendCode:disabled {
  background: #c3cad7;
  border: none;
  color: var(--color-white);
  border-radius: 36px;
  text-decoration-line: none;
  width: 100%;
  margin-top: 10px;
}

.password-reset-page #api form .buttons button.verifyCode {
  background: var(--color-primary);
  border: none;
  color: var(--color-white);
  border-radius: 36px;
  text-decoration-line: none;
  width: 50%;
}

.password-reset-page #api form .buttons button.sendNewCode {
  background: var(--color-primary);
  border: none;
  color: var(--color-white);
  border-radius: 36px;
  text-decoration-line: none;
  width: 50%;
}

.password-reset-page #api form .buttons button.changeClaims {
  display: none !important;
}

.password-reset-page #api div.intro,
.password-reset-page #api #claimVerificationServerError,
.password-reset-page #api form .buttons.verify button.editButton,
.password-reset-page #api div.verifying-modal {
  display: none !important;
}

.multi-factor-page .login-card {
  text-align: center;
  display: flex;
  flex-direction: column;
  padding: var(--token-spacer-d);
}

.multi-factor-page .login-card h2,
.multi-factor-page #api {
  width: 100%;
}

.multi-factor-page #api .heading,
.multi-factor-page #api .intro {
  display: none;
}

.multi-factor-page #api .verificationInfoText {
  display: block;
  margin-bottom: var(--space-l);
}

.multi-factor-page #api form .error.pageLevel {
  color: var(--color-error);
  font-size: var(--16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--32px);
}

.multi-factor-page #api form #attributeList.attr ul {
  list-style: none;
  padding: 0;
}

.multi-factor-page #api form #attributeList.attr ul li .attrEntry {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--form-margin-bottom);
}

.multi-factor-page #api form #attributeList.attr ul li .attrEntry label {
  display: none;
}

.multi-factor-page #api form #attributeList.attr ul li .attrEntry input {
  --additional-padding: 1px;
  --input-padding: var(--space-xs);
  --input-radius: 8px;
  -moz-column-gap: var(--space-xxs);
  background: var(--input-background-color);
  border-radius: var(--input-radius);
  border: 1px solid var(--color-gray-03);
  color: var(--color-gray-04);
  column-gap: var(--space-xxs);
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-medium);
  font-weight: var(--font-weight-normal);
  height: 100%;
  margin: var(--space-l) 0;
  max-height: 56px;
  padding: calc(var(--input-padding) + var(--additional-padding));
  width: 100%;
}

.multi-factor-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  input#readOnlyEmail,
.multi-factor-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  a.helpLink.tiny {
  display: none;
}

.multi-factor-page #api form .buttons.verify button:not(.sendButton),
.multi-factor-page #api form .attr ul li .attrEntry .buttons.verify button {
  --primary-secondary-padding-x: 24px;
  --primary-secondary-padding-y: 8px;
  -moz-column-gap: var(--space-xxs);
  align-items: baseline;
  background-color: var(--color-primary);
  border-radius: 36px;
  border: 0;
  box-sizing: border-box;
  color: var(--color-white);
  column-gap: var(--space-xxs);
  cursor: pointer;
  display: inline-flex;
  font-family: var(--thecb-primary-font);
  font-size: var(--font-size-large);
  font-weight: var(--font-weight-bold);
  justify-content: center;
  line-height: var(--line-height-large);
  padding: var(--primary-secondary-padding-y) var(--primary-secondary-padding-x);
  text-align: center;
  text-decoration: none;
  max-width: 100%;
}

.multi-factor-page #api form .buttons button {
  background: transparent;
  border: none;
  color: var(--color-primary);
  font-size: var(--16px);
  font-style: normal;
  font-weight: 700;
  line-height: var(--32px);
  text-align: center;
  text-decoration-line: underline;
}

.multi-factor-page #api form .buttons button#continue {
  float: right;
}

.multi-factor-page #api form .buttons.verify .sendButton:hover,
.multi-factor-page #api form .buttons.verify .sendButton:focus,
.multi-factor-page #api form .buttons button:hover,
.multi-factor-page #api form .buttons button:focus {
  background-color: var(--color-primary-light);
}

.multi-factor-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  .buttons.verify
  label {
  display: none !important;
}

.multi-factor-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  .buttons.verify
  #readOnlyEmail_ver_but_resend {
  background: transparent;
  border: none;
  color: var(--color-primary-light);
  display: flex;
  flex-direction: row-reverse !important;
  font-size: var(--16px);
  text-decoration: underline;
}

.multi-factor-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  .buttons.verify
  .sendButton
  p {
  text-decoration: none;
}

.multi-factor-page
  #api
  form
  #attributeList.attr
  ul
  li
  .attrEntry
  .buttons.verify
  .sendButton
  p:last-of-type {
  display: none;
}

.multi-factor-page #api #claimVerificationServerError,
.multi-factor-page #api div.verifying-modal {
  display: none !important;
}

.simplemodal-container .simplemodal-wrap {
  background: var(--color-white);
  border-radius: 8px;
  border-style: none;
  box-shadow: 0 12px 12px #00000040;
  display: flex;
  flex-direction: column;
  font-size: 16px;
  height: auto;
  justify-content: center;
  line-height: 25.6px;
  width: 200px;
  padding: 24px;
  text-align: center;
}

.thecb-banner {
  align-items: center;
  border-radius: 8px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: var(--space-s);
}

.thecb-banner h3,
.thecb-banner p {
  margin: 0;
}

.thecb-banner .thecb-banner-button {
  align-items: center;
  background: transparent;
  border: none;
  cursor: pointer;
  display: inherit;
  margin-left: var(--space-xxxxl);
}

.thecb-banner .thecb-banner-button i {
  margin-right: var(--space-xxs);
}

.thecb-alert-banner {
  background-color: var(--color-white);
  border-left: var(--space-xs) solid var(--color-primary-blue);
  box-shadow: 0 4px 4px #00000040;
  color: var(--font-primary-gray);
}

.thecb-alert-banner .thecb-banner-button {
  color: var(--color-razzmatazz);
}

.thecb-success-banner {
  background-color: var(--color-success-light);
  border-left: 8px solid var(--color-success);
  padding: var(--space-s) var(--space-m);
}

@media all and (max-width: 790px) {
  .thecb-banner {
    align-items: flex-start;
    flex-direction: column;
    padding: var(--space-s);
  }

  .thecb-banner .thecb-banner-button {
    margin-left: 0;
    margin-top: var(--space-s);
  }

  .thecb-alert-banner {
    border-left: var(--space-xxxs) solid var(--color-primary-blue);
  }
}

.thecb-failure-banner {
  background-color: var(--color-error-light);
  border-left: 8px solid var(--color-error);
  padding: var(--space-s) var(--space-m);
}

.thecb-system-banner {
  background-color: var(--color-warning);
  border-left: 8px solid var(--color-coral);
  padding: var(--space-s) var(--space-m);
}

.thecb-other-banner {
  background-color: var(--color-other-message);
  border-left: 8px solid var(--color-yellow);
  padding: var(--space-s) var(--space-m);
}

body {
  margin: 0;
}

html,
body,
body .layout {
  height: 100%;
}

.layout {
  display: flex;
  flex-direction: column;
}

main {
  background-color: var(--color-gray-05);
  flex: 1 0 auto;
  padding: var(--space-xxl) 0;
}

footer {
  flex-shrink: 0;
}

.font-size-small {
  height: 65px;
  font-size: var(--font-size-small) !important;
  line-height: var(--line-height-small) !important;
}
@media (max-width: 875px) {
  .font-size-small {
    height: 100px;
    margin-top: 30px;
  }
}

@media (max-width: 768px) {
  main {
    padding: 0;
  }
}

.hr {
  border: 1px solid #cacaca;
  margin: 0 0 var(--space-m) 0;
}

.hr-yellow {
  border-color: var(--color-yellow);
}

.hr.hr-bottom {
  margin-top: var(--space-m);
}

.textCentre {
  text-align: center;
}

#api .heading {
  display: none !important;
}

#g-recaptcha-response-toms {
  display: none;
}

label[for="g-recaptcha-response-toms"] {
  display: none;
}
