/*
        Table of Contents

    1. Variables
        1.1 Mobile Variables
    2. General Elements & Classes
        2.1 General Elements
        2.2 iCheck
        2.3 Flex Helper Classes
        2.4 Column Helper Classes
        2.5 General Helper Classes
    3. Page Structure
        3.1 Page Structure
		3.2 Header Styling
		3.3 Main Styling
		3.4 Footer Styling
    4. Page General Containers
    5. Buttons
		5.1 Button Containers
	6. Accordions
	7. Inputs and Labels
		7.1 Labels
		7.2 Inputs
		7.3 Fivi Input Containers
		7.4 Fivi Checkbox/Radio Buttons
    7.5 Validator
		7.6 Tool Tips
		7.7 Seperators
		7.8 Loader
	8. fiVISION Controls
        8.1 fiVISION_ErrorSummary
		8.2 fiVISION_Panel
		8.3 fiVISION_ProductsAndServicesV2
		8.4 fiVISION_AddressTextBoxV2
		8.5 fiVISION_PhoneTextBoxV2
		8.6 fiVISION_IDTypeV2
		8.7 fiVISION_HousingDurationHistory
		8.8 fiVISION_EmploymentHistory
		8.9 fiVISION_IndividualIncome
		8.10 fiVISION_IndividualDetails
		8.11 fiVISION_ProductsAndServicesSelected
		8.12 fiVISION_ProductRelationships
		8.13 fiVISION_DocumentListV2
		8.14 fiVISION_DisclosuresList
		8.15 fiVISION_ProductFundingV2
		8.16 fiVISION_ProveIndividualLookup
		8.17 fiVISION_ACH
		8.18 fiVISION_CreditCardV2
		8.19 fiVISION_ApplicantWithdraw
		8.20 fiVISION_ProgressBar
		8.21 fiVISON_IndividualHandler
        8.22 fiVISION_EmailTextBoxV2
        8.23 fiVISION_CollateralHandler
        8.24 fiVISION_IDAuthentication
        8.25 fiVISION_PlaidFundingAccountVerification
        8.26 fiVISION_WorkflowSurvey
		8.27 fiVISION_MoneyTextBoxV2
	9. Page Specific
		9.1 Default Page
        9.2 Applicant Prove
        9.3 Select Accounts
        9.4 Disclosures
        9.5 Funding
        9.6 Pending/Approved/Denied
        9.7 Decline Disclosures
		9.8 Payment Interest Options
	10. ControlID Specific
	11. Admin Console
	12. Client Header/Footer
	13. Business App

    Mobile Reference Media Queries for stepping down
    Assumes column width 66px and column spacer 24px
    
    @media all and (max-device-width: 1106px), all and (max-width: 1106px) {
    
    }

    @media all and (max-device-width: 836px), all and (max-width: 836px) {

    }

    @media all and (max-device-width: 656px), all and (max-width: 656px) {

    }

    @media all and (max-device-width: 452px), all and (max-width: 452px) {

    }

*/
/*
    1. Variables
*/
:root {
  /*colors*/
  /*gray scale*/
  --color-white-light: #fdfcfa;
  --color-white-normal: #f0efea;
  --color-white-dark: #e5e7eb;
  --color-gray-light: #8d93b2;
  --color-gray-normal: #55698b;
  --color-gray-dark: #474747;
  --color-black-light: #33374d;
  --color-black-normal: #101325;
  --color-black-dark: #0b0e1e;
  /*client colors*/
  --color-primary-light: #bcafa0;
  /*#ced8ff;*/
  --color-primary-normal: #864e60;
  /* #4d6dee; */
  --color-primary-dark: #864e60;
  /*#273166; */
  --color-secondary-light: #3c7ccd;
  --color-secondary-normal: #21253d;
  --color-secondary-dark: #0b0e1e;
  --color-tertiary-light: #10b981;
  --color-tertiary-normal: #059669;
  --color-tertiary-dark: #047857;
  --color-quaternary-light: #fcd34d;
  --color-quaternary-normal: #fbbf24;
  --color-quaternary-dark: #f59e0b;
  --color-accent-blue: #abb6c0;
  /*font family*/
  --font-family-pri: "Barlow", sans-serif;
  --font-family-alt: "Lato", sans-serif;
  /*fonts*/
  /*default font*/
  --font-size: 16px;
  --font-lineheight: 20px;
  --font-color: var(--color-black-white);
  --font-color-light: var(--color-gray-normal);
  --font-weight: 400;
  --font-family: var(--font-family-pri);
  /*input font*/
  --font-size-input: var(--font-size);
  --font-lineheight-input: var(--font-lineheight);
  --font-color-input: var(--color-black-light);
  --font-weight-input: var(--font-weight);
  --font-family-input: var(--font-family);
  /*label font*/
  --font-size-label: var(--font-size);
  --font-lineheight-label: var(--font-lineheight);
  --font-color-label: var(--color-black-light);
  --font-color-label-focus: var(--font-color);
  --font-weight-label: 500;
  --font-family-label: var(--font-family-alt);
  /*title font*/
  --font-size-title: 38px;
  --font-lineheight-title: 34px;
  --font-color-title: var(--color-gray-dark);
  --font-weight-title: 600;
  --font-family-title: var(--font-family-pri);
  /*h1 font*/
  --font-size-h1: calc(var(--font-size) + 6px);
  --font-lineheight-h1: calc(var(--font-size-h1) + 3px);
  --font-color-h1: var(--font-color-light);
  --font-weight-h1: 500;
  --font-family-h1: var(--font-family-pri);
  /*h2 font*/
  --font-size-h2: calc(var(--font-size) + 4px);
  --font-lineheight-h2: calc(var(--font-size-h2) + 3px);
  --font-color-h2: var(--font-color-h1);
  --font-weight-h2: var(--font-weight-h1);
  --font-family-h2: var(--font-family-input);
  /*h3 font*/
  --font-size-h3: calc(var(--font-size) + 2px);
  --font-lineheight-h3: calc(var(--font-size-h3) + 3px);
  --font-color-h3: var(--font-color-light);
  --font-weight-h3: 600;
  --font-family-h3: var(--font-family);
  /*h4 font*/
  --font-size-h4: 16px;
  --font-lineheight-h4: 18px;
  --font-color-h4: var(--font-color-h3);
  --font-weight-h4: 500;
  --font-family-h4: var(--font-family);
  /*page structure*/
  --column-width: 66px;
  --column-spacer: 24px;
  --column-width-half: calc(var(--column-width) / 2);
  /*33px*/
  --column-width-2: calc(calc(var(--column-width) * 2) + var(--column-spacer));
  /*156px*/
  --column-width-3: calc(
    calc(var(--column-width) * 3) + calc(var(--column-spacer) * 2)
  );
  /*246px*/
  --column-width-4: calc(
    calc(var(--column-width) * 4) + calc(var(--column-spacer) * 3)
  );
  /*336px*/
  --column-width-5: calc(
    calc(var(--column-width) * 5) + calc(var(--column-spacer) * 4)
  );
  /*426px*/
  --column-width-6: calc(
    calc(var(--column-width) * 6) + calc(var(--column-spacer) * 5)
  );
  /*516px*/
  --column-width-7: calc(
    calc(var(--column-width) * 7) + calc(var(--column-spacer) * 6)
  );
  /*606px*/
  --column-width-8: calc(
    calc(var(--column-width) * 8) + calc(var(--column-spacer) * 7)
  );
  /*696px*/
  --column-width-9: calc(
    calc(var(--column-width) * 9) + calc(var(--column-spacer) * 8)
  );
  /*786px*/
  --column-width-10: calc(
    calc(var(--column-width) * 10) + calc(var(--column-spacer) * 9)
  );
  /*876px*/
  --column-width-11: calc(
    calc(var(--column-width) * 11) + calc(var(--column-spacer) * 10)
  );
  /*966px*/
  --column-width-12: calc(
    calc(var(--column-width) * 12) + calc(var(--column-spacer) * 11)
  );
  /*1056px*/
  --column-width-full: 100%;
  /*flex properties*/
  --gap-vertical: var(--column-spacer);
  --gap-vertical-25: calc(var(--gap-vertical) * 0.25);
  --gap-vertical-50: calc(var(--gap-vertical) * 0.5);
  --gap-vertical-75: calc(var(--gap-vertical) * 0.75);
  --gap-vertical-150: calc(var(--gap-vertical) * 1.5);
  --gap-vertical-200: calc(var(--gap-vertical) * 2);
  --gap-horizontal: var(--column-spacer);
  --gap-horizontal-25: calc(var(--gap-horizontal) * 0.25);
  --gap-horizontal-50: calc(var(--gap-horizontal) * 0.5);
  --gap-horizontal-150: calc(var(--gap-horizontal) * 1.5);
  --gap-horizontal-200: calc(var(--gap-horizontal) * 2);
  /*border properties*/
  --border-radius: var(--gap-vertical) var(--gap-horizontal);
  --border-color: var(--color-gray-light);
  --border-color-focus: var(--color-primary-normal);
  /*color properties*/
  --background-input-color: var(--color-white-light);
  --background-color: var(--color-white-normal);
  --background-color-page: var(--color-white-light);
  --background-color-alt: var(--color-white-normal);
  /*input and label structure*/
  --fiviInput-width: var(--column-width-4);
  --fiviInput-width-half: calc(
    calc(var(--fiviInput-width) - var(--column-spacer)) / 2
  );
  --fiviInput-width-double: calc(
    calc(var(--fiviInput-width) * 2) + var(--column-spacer)
  );
  /*the below two should add to the above, sometimes 3+2 or 2+2 or 2+1, main is always >= alt*/
  --fiviInput-width-partial-main: var(--column-width-2);
  --fiviInput-width-partial-alt: var(--column-width-2);
  --input-height: 50px;
  --input-focusLabel-fontSize: calc(var(--font-size-label) - 2px);
  --input-focusLabel-offset: calc(var(--input-height) + var(--gap-vertical-25));
  --input-marginTop-forLabelFocusSpace: calc(
    var(--input-focusLabel-fontSize) + var(--gap-vertical-25)
  );
  /* how much space between each input */
  --fiviInput-vertical-spacing: var(--gap-vertical-75);
  --fiviInput-horizontal-spacing: var(--gap-horizontal);
}

/*
          1.1 Mobile Variables
      
          We are going to do a step down approach.  We need to account for the 
          head/main/foot left/right padding of column width (*2 as there are left and right).
          add a couple pixels for good measure.
      */
@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  /*
              @1056px+48px+2px = 1106px
              -12 columns -> 7 columns 
              -fiviInput-width goes to 5 columns
              -should accomidate 2 inputs per row
          */
  :root {
    --column-width-11: 100%;
    --column-width-12: 100%;
    --column-width-10: 100%;
    --fiviInput-width: var(--column-width-5);
    --fiviInput-width-partial-main: var(--column-width-3);
    --fiviInput-width-partial-alt: var(--column-width-2);
    --fiviInput-width-half: calc(
      calc(var(--fiviInput-width) - var(--column-spacer)) / 2
    );
  }
}

@media all and (max-device-width: 988px), all and (max-width: 988px) {
  :root {
    --fiviInput-width: var(--column-width-4);
    --fiviInput-width-partial-main: var(--column-width-2);
    --fiviInput-width-partial-alt: var(--column-width-2);
  }
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  /*
              @786px+48px+2px = 836px
              -9 columns -> 7 columns 
              -fiviInput-width goes to 3 columns
              -should accomidate 2 inputs per row
          */
  :root {
    --font-size: 14px;
    /* --font-size-h1: 20px;
              --font-lineheight-h1: 23px; */
    /* --font-size-h2: 16px;
              --font-lineheight-h2: 18px;
              --font-size-h3: 14px;
              --font-lineheight-h3: 16px; */
    --column-width-8: 100%;
    --column-width-9: 100%;
  }
}

@media all and (max-device-width: 808px), all and (max-width: 808px) {
  :root {
    --fiviInput-width: var(--column-width-3);
    --fiviInput-width-partial-main: var(--column-width-3);
    --fiviInput-width-partial-alt: var(--column-width-3);
    --fiviInput-width-half: calc(
      calc(var(--fiviInput-width) - var(--column-spacer)) / 2
    );
  }
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  /*
              @606px+48+2px = 656px
              -7 columns -> 5 columns
              -fiviInput-width goes to 4 columns
              -accomidate 1 input, with an exception or two, inputs go 1 per row
          */
  :root {
    --column-width-6: 100%;
    --column-width-7: 100%;
    --fiviInput-width: var(--column-width-3);
    --fiviInput-width-partial-main: var(--column-width-3);
    --fiviInput-width-partial-alt: var(--column-width-3);
    --fiviInput-width-half: var(--column-width-2);
  }
}

@media all and (max-device-width: 628px), all and (max-width: 628px) {
  /*
              @606px+48+2px = 656px
              -7 columns -> 5 columns
              -fiviInput-width goes to 4 columns
              -accomidate 1 input, with an exception or two, inputs go 1 per row
          */
  :root {
    --fiviInput-width: var(--column-width-5);
    --fiviInput-width-partial-main: var(--column-width-3);
    --fiviInput-width-partial-alt: var(--column-width-2);
    --fiviInput-width-half: calc(
      calc(var(--fiviInput-width) - var(--column-spacer)) / 2
    );
  }
}

@media all and (max-device-width: 540px), all and (max-width: 540px) {
  /*
              @606px+48+2px = 656px
              -7 columns -> 5 columns
              -fiviInput-width goes to 4 columns
              -accomidate 1 input, with an exception or two, inputs go 1 per row
          */
  :root {
    --column-width-3: 100%;
    --column-width-4: 100%;
    --column-width-5: 100%;
    --fiviInput-width: 100%;
    --fiviInput-width: var(--column-width-4);
    --fiviInput-width-half: calc(50% - calc(var(--column-spacer) / 2));
    --fiviInput-width-partial-main: var(--fiviInput-width-half);
    --fiviInput-width-partial-alt: var(--fiviInput-width-half);
  }
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  /*
              @426px+24px+2px = 452px
              - any column width > 2 goes to 100%
          */
  :root {
    --column-width-3: 100%;
    --column-width-4: 100%;
    --column-width-5: 100%;
    --fiviInput-width: 100%;
    --fiviInput-width-half: calc(50% - calc(var(--column-spacer) / 2));
  }
}

/*
          2. General Elements & Classes
      */
/*
          2.1 General Elements
      */
html,
body {
  width: 100%;
  height: 100%;
  margin: 0px;
  padding: 0px;
  overflow-x: hidden;
}

html,
body {
  font-size: var(--font-size);
  line-height: var(--font-size);
  color: var(--font-color);
  font-weight: var(--font-weight);
  font-family: var(--font-family);
}

h1,
h2,
h3,
h4,
.h1,
.h2,
.h3,
.h4,
p,
label,
input,
select,
textarea,
form {
  margin: 0;
  margin-block: 0;
  padding: 0;
  padding-block: 0;
  width: 100%;
}

b {
  font-weight: 600;
}

h1,
.h1 {
  font-size: var(--font-size-h1);
  line-height: var(--font-lineheight-h1);
  color: var(--font-color-h1);
  font-weight: var(--font-weight-h1);
  font-family: var(--font-family-h1);
  text-align: left;
  line-height: 150%;
}

h2,
.h2 {
  font-size: var(--font-size-h2);
  line-height: var(--font-lineheight-h2);
  color: var(--font-color-h2);
  font-weight: var(--font-weight-h2);
  font-family: var(--font-family-h2);
  text-align: left;
}

h3,
.h3 {
  font-size: var(--font-size-h3);
  line-height: var(--font-lineheight-h3);
  color: var(--font-color-h3);
  font-weight: var(--font-weight-h3);
  font-family: var(--font-family-h3);
  text-align: left;
}

h4,
.h4 {
  font-size: var(--font-size-h4);
  line-height: var(--font-lineheight-h4);
  color: var(--font-color-h4);
  font-weight: var(--font-weight-h4);
  font-family: var(--font-family-h4);
  text-align: left;
}

legend {
  display: none;
}

a {
  color: var(--color-primary-normal);
  text-decoration: underline;
}

a:hover {
  text-decoration: underline;
  color: rgba(123, 78, 96, 0.5);
}

a:visited,
a:focus {
  color: var(--color-primary-normal);
}

ul,
ol {
  margin-bottom: 0;
  line-height: calc(var(--font-size) * 1.25);
  padding-left: var(--gap-horizontal);
}

ul > li:not(:last-of-type),
ol > li:not(:last-of-type) {
  margin-bottom: var(--gap-vertical-25);
}

/*
          2.2 iCheck
      */
.icheckbox_square-black,
.icheckbox_square-red,
.icheckbox_square-green,
.icheckbox_square-blue,
.icheckbox_square-aero,
.icheckbox_square-grey,
.icheckbox_square-orange,
.icheckbox_square-yellow,
.icheckbox_square-pink,
.icheckbox_square-purple {
  background-color: white;
  margin: 0;
}

.iradio_square-black,
.iradio_square-red,
.iradio_square-green,
.iradio_square-blue,
.iradio_square-aero,
.iradio_square-grey,
.iradio_square-orange,
.iradio_square-yellow,
.iradio_square-pink,
.iradio_square-purple {
  background-color: white;
  border-radius: 50%;
  margin: 0;
}

/*
          2.3 Flex Helper Classes
      */
.flex-row {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--fiviInput-vertical-spacing) var(--fiviInput-horizontal-spacing);
  flex-wrap: wrap;
  width: 100%;
}

.flex-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--fiviInput-vertical-spacing) var(--fiviInput-horizontal-spacing);
  width: 100%;
}

.flex-row.flex-align-vertical-center {
  align-items: center;
}

.flex-column.flex-align-vertical-center {
  justify-content: center;
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .flex-row.flex-align-vertical-center {
    flex-direction: column;
    align-items: center;
    gap: var(--gap-vertical);
  }
}

.flex-row.flex-align-horizontal-center {
  justify-content: center;
}

.flex-row.flex-space-between {
  justify-content: space-between;
}

.flex-column.flex-space-between {
  align-items: space-between;
}

.flex-column.flex-align-vertical-center {
  align-items: center;
}

.flex-row.flex-align-horizontal-end {
  justify-content: flex-end;
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .flex-row.flex-align-horizontal-end {
    flex-direction: column;
    justify-content: center !important;
    gap: var(--gap-vertical);
    text-align: center;
  }
}

.flex-column.flex-align-horizontal-end {
  align-items: flex-end;
}

.flex-row.flex-align-vertical-end {
  align-items: flex-end;
}

.flex-column.flex-align-vertical-end {
  justify-content: flex-end;
}

/*
          gap is almost always going to govern the vertical, 
          horizontal should rarely be modified, if ever.  If you
          need to, add/modify a custom class.
      */
.flex-gap-25 {
  gap: var(--gap-vertical-25) var(--gap-horizontal-25);
}

.flex-gap-50 {
  gap: var(--gap-vertical-50) var(--gap-horizontal);
}

.flex-gap-100 {
  gap: var(--gap-vertical) var(--gap-horizontal);
}

.flex-gap-150 {
  gap: var(--gap-vertical-150) var(--gap-horizontal);
}

.flex-gap-200 {
  gap: var(--gap-vertical-200) var(--gap-horizontal);
}

/*
          2.4 Column Helper Classes
      */
.column-width-fiviInput {
  max-width: var(--fiviInput-width);
  width: 100vw;
}

.column-width-1 {
  max-width: var(--column-width);
  width: 100vw;
}

.column-width-2 {
  max-width: var(--column-width-2);
  width: 100vw;
}

.column-width-3 {
  max-width: var(--column-width-3);
  width: 100vw;
}

.column-width-4 {
  max-width: var(--column-width-4);
  width: 100vw;
}

.column-width-5 {
  max-width: var(--column-width-5);
  width: 100vw;
}

.column-width-6 {
  max-width: var(--column-width-6);
  width: 100vw;
}

.column-width-7 {
  max-width: var(--column-width-7);
  width: 100vw;
}

.column-width-8 {
  max-width: var(--column-width-8);
  width: 100vw;
}

.column-width-9 {
  max-width: var(--column-width-9);
  width: 100vw;
}

.column-width-10 {
  max-width: var(--column-width-10);
  width: 100vw;
}

.column-width-11 {
  max-width: var(--column-width-11);
  width: 100vw;
}

.column-width-12 {
  max-width: var(--column-width-12);
  width: 100vw;
}

.column-width-full {
  max-width: 100%;
  width: 100vw;
}

/*
          2.5 General Helper Classes
      */
.title-text {
  font-size: var(--font-size-title);
  line-height: var(--font-lineheight-title);
  color: var(--font-color-title);
  font-weight: var(--font-weight-title);
  font-family: var(--font-family-title);
  text-align: left;
}

.page-text {
  font-size: var(--font-size);
  line-height: var(--font-lineheight);
  font-weight: var(--font-weight);
  color: var(--font-color);
  width: 100%;
}

.page-text-small {
  font-size: calc(var(--font-size) - 4px);
  width: 100%;
}

.page-text-large {
  font-size: calc(var(--font-size) + 2px);
  line-height: calc(var(--font-lineheight) + 3px);
  width: 100%;
}

.header-container .page-text-large {
  color: var(--color-gray-light);
  font-size: calc(var(--font-size) + 6px);
  font-weight: 500;
  letter-spacing: 1px;
}

.spacer-vertical {
  /*
              no height is required here, gap should handle it,
              will double the space between the previous and next elements
          */
  width: 100%;
}

.indentLeft {
  margin-left: var(--gap-horizontal);
}

.loader-container {
  display: block;
  background-color: transparent;
}

.loader-container .loader {
  position: relative;
  top: 0;
  left: 0;
  border-top-color: var(--color-primary-normal);
  margin: var(--gap-vertical-50) var(--gap-horizontal-50);
}

.alert-container-box {
  background: var(--color-white-dark);
  border-radius: var(--border-radius);
  font-size: var(--font-size-h4);
  align-items: center;
  text-align: center;
  padding: var(--gap-vertical) var(--gap-horizontal);
}

.vertical-divider {
  max-height: 100%;
  border-left: 0.5px solid var(--border-color);
  position: relative;
  flex-grow: 1;
  flex-basis: 0;
}

.horizontal-divider {
  height: 1px;
  width: 100%;
  border-top: 0.5px solid var(--color-gray-light);
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .page-text-small {
    font-size: calc(var(--font-size) - 2px);
  }
}

/*
          3. Page Structure
      */
/*
          3.1 Page Structure
      */
.layout {
  background-color: var(--background-color);
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 100vh;
}

header,
main,
footer {
  width: 100%;
  display: flex;
  margin: 0;
  text-align: left;
  flex-direction: column;
}

header {
  box-shadow: none;
  background-color: var(--color-black-normal);
  border-bottom: 1px solid var(--border-color);
}

main {
  position: relative;
  margin-bottom: auto;
  align-items: flex-start;
  padding: var(--gap-vertical-200) 0;
  flex: 1;
  flex-direction: row;
  max-width: var(--column-width-12);
}

footer {
  /* background-color: var(--color-black-normal); */
  border-top: 1px solid var(--border-color);
  position: relative;
  padding: 0;
}

header > .layout-container,
main > .layout-container,
footer > .layout-container {
  max-width: var(--column-width-12);
  width: 100%;
  margin: 0 auto;
  min-height: 62px;
  padding: var(--gap-vertical) var(--gap-horizontal);
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  header,
  footer {
    padding: 0;
  }

  main {
    padding: var(--gap-vertical) var(--gap-horizontal-50);
  }

  header > .layout-container {
    min-height: 50px;
    justify-content: center;
  }
}

/*
          3.2 Header Styling
      */
.header-logo {
  width: 320px;
}

.header-contact {
  min-width: 0;
  justify-content: flex-end;
  flex: 1;
}

.header-contact-info {
  min-width: 0;
  flex-shrink: 1;
  width: unset;
}

.header-contact-info.page-text {
  color: var(--color-white-light);
  font-size: calc(var(--font-size) - 2px);
}

.header-info-bar {
  width: 100%;
  background-color: var(--color-secondary-normal);
  padding: var(--gap-vertical-25) var(--gap-horizontal-25);
}

.header-info-bar > .flex-row {
  max-width: var(--column-width-12);
  margin: 0 auto;
}

.header-info-bar .page-text {
  flex: 0 1 auto;
  width: fit-content;
  color: var(--color-white-normal);
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  header .layout-container {
    flex-direction: column;
  }

  .header-contact {
    justify-content: center;
  }
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  .header-logo {
    width: 240px;
  }
}

/*
          3.3 Main Styling
      */
main > .layout-container {
  position: relative;
  display: flex;
  align-self: stretch;
  padding: 0;
  flex-grow: 1;
  flex-basis: 0;
  flex-direction: column;
  justify-content: stretch;
  gap: var(--gap-vertical);
  border: 1px solid var(--border-color);
  background-color: var(--background-color-page);
  margin: 0 var(--gap-horizontal);
  border-radius: 5px;
}

main > .layout-container > span {
  /*
              this is span that start the fivision_PageContent
          */
  display: flex;
  width: 100%;
  flex-direction: column;
  align-self: stretch;
  justify-content: stretch;
  flex-basis: 0;
  flex-grow: 1;
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  main > .layout-container {
    min-width: 0;
  }

  main > .layout-container > span {
    max-width: var(--column-width-12);
  }
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  main > .layout-container {
    margin: 0;
  }
}

/*
          3.4 Footer Styling
      */
footer > .layout-container {
  font-size: var(--font-size);
}

footer .h1,
footer .h2,
footer .h3,
footer .h4 {
  color: var(--color-white-normal);
  font-weight: 500;
}

footer .page-text {
  color: var(--color-white-normal);
}

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

footer > .layout-container > div {
  max-width: var(--column-width-4);
  width: 100%;
}

footer > .layout-container > .h2 {
  /* max-width: 100%; */
}

footer > .layout-container > .h2 {
  font-family: var(--font-family-alt);
}

footer > .layout-container > .h2:after {
  content: "";
  display: block;
  width: var(--column-width-2);
  height: 2px;
  background-color: var(--color-primary-normal);
  align-self: flex-start;
  margin-top: var(--gap-vertical-50);
}

.institution-copywrite,
.institution-links {
  display: flex;
  flex-wrap: wrap;
}

.institution-info > .flex-row,
.routing-links > .flex-row {
  gap: 5px;
}

.institution-eho-ncua-logos {
  width: 100%;
}

.img-eho {
  width: 50px;
}

.img-ncua {
  height: 50px;
}

.institution-insured-text {
  font-size: 14px;
  font-style: italic;
  text-align: center;
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  footer > .layout-container > .institution-info {
    max-width: var(--column-width-3);
    width: 100%;
  }

  footer > .layout-container > .routing-links {
    max-width: var(--column-width-4);
    width: 100%;
  }

  footer > .layout-container > .euo-ncua {
    max-width: var(--column-width-2);
    width: 100%;
  }

  .img-eho {
    width: 40px;
  }

  .img-ncua {
    height: 40px;
  }
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  footer > .layout-container.flex-row.flex-row.flex-space-between {
    justify-content: flex-start;
  }

  footer > .layout-container > .institution-info {
    max-width: var(--column-width-3);
    width: 100%;
  }
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  footer > .layout-container.flex-row.flex-row.flex-space-between {
    flex-direction: column;
  }

  footer > .layout-container > .institution-info,
  footer > .layout-container > .routing-links,
  footer > .layout-container > .euo-ncua {
    max-width: var(--column-width-4);
    width: 100%;
  }

  .ecu-ncua-container.flex-row.flex-align-horizontal-center {
    justify-content: flex-start;
  }

  .euo-ncua center {
    text-align: left;
  }
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  .ecu-ncua-container.flex-row,
  .routing-links .flex-row,
  .institution-info .flex-row {
    flex-direction: row;
  }
}

/*
          4. Page General Containers
      */
.page-container,
#IndividualHandler01 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: stretch;
  gap: var(--gap-vertical-150);
  max-width: var(--column-width-9);
  width: 100vw;
  flex-grow: 1;
  flex-basis: 0;
  align-self: stretch;
}

.progress-container:not(:has(> span)) + .layout-container .page-container {
  max-width: 100%;
}

.header-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-vertical-50);
  max-width: var(--column-width-12);
  width: 100%;
  padding: 0 var(--gap-horizontal);
}

.section-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--gap-vertical);
  max-width: var(--column-width-12);
  width: 100%;
  padding: 0 var(--gap-horizontal);
}

.error-container {
  height: fit-content;
}

.section-header:after {
  content: "";
  display: block;
  width: var(--column-width-2);
  height: 1px;
  background-color: rgba(0, 0, 0, 0.2);
  align-self: flex-start;
  margin-top: var(--gap-vertical-25);
}

.page-navigation-container {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: var(--gap-horizontal);
  /* position: absolute; */
  bottom: 0;
  left: 0;
  padding: var(--gap-vertical) var(--gap-horizontal);
  border-top: 0.5px solid var(--border-color);
  margin-top: auto;
}

.navigation-forward-container,
.navigation-other-container {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-50);
  align-items: flex-end;
}

.navigation-forward-container {
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
}

.navigation-forward-container .button-link {
  text-align: center;
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  .page-container,
  #IndividualHandler01 {
    max-width: var(--column-width-10);
  }
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .header-container,
  .section-container {
    min-width: 0;
  }

  .page-navigation-container {
    flex-direction: column;
    align-items: center;
    gap: var(--gap-vertical);
  }

  .navigation-other-container {
    flex-direction: column-reverse;
    align-items: center;
    gap: var(--gap-vertical);
  }

  .navigation-other-container .button-link {
    text-align: center;
  }
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  .navigation-forward-container {
    flex-direction: column;
    text-align: right;
  }
}

/*
          5. Buttons
      */
.button-primary {
  min-width: var(--column-width-2);
  width: fit-content !important;
  margin: 0;
  padding: var(--gap-vertical-25) var(--gap-horizontal-200);
  background-color: var(--color-primary-normal);
  color: white;
  border: 2px solid var(--color-primary-normal);
  border-radius: 10px;
  font-size: 15px;
  line-height: 18px;
  font-weight: 600;
  box-shadow: none;
  transition-duration: 500ms;
  transition-property: border-radius;
  text-transform: uppercase;
}

.button-primary:hover:not(:disabled),
.button-primary:active:not(:disabled),
.button-primary:focus:not(:disabled),
.button-primary:visited:not(:disabled) {
  text-decoration: none;
  color: white;
  transition: 0.1s opacity linear;
  opacity: 0.8;
}

.button-primary:disabled {
  opacity: 0.5;
}

.button-other,
.MinorButton,
.fiviAddAnotherButton > a,
.fiviPlaid .btn-default {
  justify-content: center;
  align-items: center;
  max-width: var(--fiviInput-width);
  min-width: var(--fiviInput-width-half);
  width: fit-content !important;
  margin: 0;
  padding: 1em;
  background-color: var(--background-input-color);
  color: var(--color-primary-normal);
  border: 1px solid var(--color-primary-normal);
  border-radius: 10px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 500;
  box-shadow: none;
  transition-duration: 500ms;
  transition-property: color, background-color;
  height: var(--input-height);
  cursor: pointer;
  text-shadow: none;
}

.button-other,
.MinorButton {
  display: inline-flex;
}

.button-other,
.MinorButton {
  background: var(--color-gray-dark);
  color: #fff;
  text-transform: uppercase;
  font-weight: 600;
  border-color: var(--color-gray-dark) !important;
}

#btnAdd {
  width: 100%;
  margin: 0 1em;
}

#btnAdd {
  text-wrap: auto;
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  #btnAdd.button-other {
    padding: 1em 1em 3em 1em;
  }
}

.fiviAddAnotherButton > a {
  display: inline-flex;
}

.button-other:hover:not(:disabled),
.button-other:active:not(:disabled),
.button-other:focus:not(:disabled),
.MinorButton:hover:not(:disabled),
.MinorButton:active:not(:disabled),
.MinorButton:focus:not(:disabled),
.fiviAddAnotherButton > a:hover:not(:disabled),
.fiviAddAnotherButton > a:active:not(:disabled),
.fiviAddAnotherButton > a:focus:not(:disabled),
.fiviPlaid .btn-default:hover:not(:disabled),
.fiviPlaid .btn-default:active:not(:disabled),
.fiviPlaid .btn-default:focus:not(:disabled) {
  background-color: var(--color-primary-normal);
  color: var(--color-white-normal);
  box-shadow: none;
  text-decoration: none;
  text-shadow: none;
  border-color: var(--color-primary-normal);
  outline: none;
}

.button-other:hover,
.MinorButton:hover {
  opacity: 0.8;
  background: var(--color-gray-dark) !important;
  border-color: var(--color-gray-dark) !important;
}

.button-other:disabled,
.MinorButton:disabled,
.fiviAddAnotherButton > a:disabled {
  opacity: 0.5;
}

.scan-button {
  border: none;
  text-align: center;
  line-height: 1.2;
}

.button-link,
.button-link-alt,
.button-upload #btnBack {
  min-width: var(--column-width-2);
  text-align: left;
  background-color: transparent;
  border: 2px solid transparent;
  font-size: 16px;
  line-height: 18px;
  font-weight: 600;
  color: var(--color-primary-normal);
  width: fit-content !important;
  cursor: pointer;
}

.button-link {
  text-decoration: underline;
}

.button-link:hover {
  color: rgba(123, 78, 96, 0.5);
}

.button-link-alt {
  text-transform: uppercase;
  font-weight: 600;
}

#btnBack input {
  min-width: var(--column-width-2) !important;
  text-align: left !important;
  background-color: transparent !important;
  border: 2px solid transparent !important;
  font-size: 16px !important;
  line-height: 18px;
  font-weight: 700 !important;
  color: var(--color-primary-normal) !important;
  width: fit-content !important;
  cursor: pointer;
  font-family: var(--font-family-pri) !important;
  text-transform: capitalize;
  text-decoration: underline;
}

.page-ApplicantExistingOTP {
  display: flex;
  justify-content: flex-start;
}

.page-ApplicantExistingOTP div:has(> #btnBack) {
  display: flex;
  justify-content: center;
}

#btnOTPSendCode {
  align-content: center !important;
}

#btnOTPSendCode input {
  height: 34px;
  font-family: var(--font-family-pri) !important;
}

.button-upload {
  cursor: pointer;
}

.button-upload:hover:not(:disabled),
.button-upload:active:not(:disabled),
.button-upload:focus:not(:disabled),
.button-link:hover:not(:disabled),
.button-link:active:not(:disabled),
.button-link:focus:not(:disabled),
.button-link-alt:hover:not(:disabled),
.button-link-alt:active:not(:disabled),
.button-link-alt:focus:not(:disabled) {
  text-decoration: underline;
}

.button-other:disabled,
.button-other-alt:disabled {
  opacity: 0.5;
}

.fiviRemoveBtn {
  position: absolute;
  color: var(--color-primary-normal);
  cursor: pointer;
  left: var(--fiviInput-width);
  background: white;
}

.fiviRemoveBtn:hover:not(:disabled),
.fiviRemoveBtn:active:not(:disabled),
.fiviRemoveBtn:focus:not(:disabled) {
  color: var(--color-secondary-normal);
}

/*
          5.1 Button Containers
      */
.add-another-individual-container {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: var(--fiviInput-width);
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  .add-another-individual-container {
    width: var(--fiviInput-width-double);
  }
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .add-another-individual-container {
    width: var(--fiviInput-width);
  }
}

/*
          6. Accordions
      */
.panel.panel-default {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  width: 100%;
  padding: var(--gap-vertical) var(--gap-horizontal);
  gap: var(--gap-vertical);
  background-color: var(--background-color-alt);
}

/*
      #accordion {
          display: flex;
          flex-direction: column;
          max-width: var(--column-width-12);
          width: 100%;
          gap: var(--gap-vertical);
      }
      
      #accordion>.panel {
          outline: none;
          border: none;
          border-radius: var(--border-radius);
          background-color: transparent;
          box-shadow: none;
          margin: 0;
      }
      
      #accordion>.panel:has(> .panel-heading.collapsed) {
          outline: 1px solid var(--color-primary-normal);
          box-shadow: rgba(0, 0, 0, 0.05) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
      }
      
      #accordion>.panel>.panel-heading {
          display: flex;
          align-items: center;
          background: white;
          border: none;
          border-radius: var(--border-radius);
          padding: var(--gap-vertical-50);
          cursor: pointer;
      
      }
      
      #accordion>.panel>.panel-heading>.panel-title {
          display: flex;
          align-items: flex-start;
          justify-content: space-between;
          flex-direction: column;
          flex-wrap: wrap;
          position: relative;
      }
      
      #accordion>.panel>.panel-heading .panel-title>.panelArrow {
          position: absolute;
          right: 0;
          height: 100%;
          display: flex;
          align-items: center;
          justify-content: center;
      }
      
      #accordion>.panel .panel-body {
          display: flex;
          flex-direction: column;
          gap: var(--gap-vertical);
          border: none;
          border-radius: var(--border-radius);
          padding: var(--gap-vertical) 0;
      }*/
.panel-group {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-50);
}

.panel-default > .panel-heading {
  color: unset;
  background-color: unset;
  border-color: unset;
  background-image: unset;
}

.panel-group .panel + .panel {
  margin-top: unset;
}

.panel-heading {
  display: flex;
  cursor: pointer;
  padding: 0;
}

.panel-title > i:before {
  display: none;
}

.panel-heading > .panel-title > i:before {
  display: unset;
}

.panel-body::before,
.panel-body::after {
  display: none;
}

/*
          this is the accordion open
      */
/*
      #accordion>.panel>.panel-heading:has(+ .collapse.in) {
          padding-left: 0;
          background: transparent;
          transition: padding-left .5s ease-in-out;
      }
      
      #accordion>.panel>.panel-heading:has(+ .collapse.in)>.panel-title {
          font-size: var(--font-size-h3);
          line-height: var(--font-size-h3);
          transition: font-size .5s ease-in-out;
      }
      */
/*
          this is the accordion opening
      */
/*
      #accordion>.panel>.panel-heading:has(+ .collapsing) {
          padding-left: 0;
          background: transparent;
          transition: padding-left .5s ease-in-out;
      }
      
      #accordion>.panel>.panel-heading:has(+ .collapsing)>.panel-title {
          font-size: var(--font-size-h3);
          line-height: var(--font-size-h3);
          transition: font-size .5s ease-in-out;
      }
      */
/*
          this is with the accordion closed
      */
/*
      #accordion>.panel>.panel-heading.collapsed:has(+ .collapse:not(.in)) {
          padding-left: var(--gap-horizontal);
          transition: padding-left .5s ease-in-out;
      }
      
      #accordion>.panel>.panel-heading.collapsed:has(+ .collapse:not(.in))>.panel-title {
          font-size: var(--font-size-h4);
          line-height: var(--font-size-h4);
          transition: font-size .5s ease-in-out;
      }
      */
/*
          this is with the accordion closing
      */
/*
      #accordion>.panel>.panel-heading.collapsed:has(+ .collapsing) {
          padding-left: var(--gap-horizontal);
          transition: padding-left .5s ease-in-out;
      }
      
      #accordion>.panel>.panel-heading.collapsed:has(+ .collapsing)>.panel-title {
          font-size: var(--font-size-h4);
          line-height: var(--font-size-h4);
          transition: font-size .5s ease-in-out;
      }
      */
/*
          7. Inputs and Labels
      */
/*
          7.1 Labels
      */
label {
  font-weight: var(--font-weight-label);
}

.DefaultLabelClass {
  display: flex;
  align-items: center;
  height: var(--input-height);
  position: absolute;
  left: var(--gap-horizontal-50);
  bottom: 0;
  font-size: var(--font-size-label);
  font-weight: var(--font-weight-label);
  line-height: var(--font-size-label);
  color: var(--font-color-label);
  font-family: var(--font-family-label);
  transition: all 0.2s ease-in-out;
}

.FocusLabelClass {
  height: var(--input-focusLabel-fontSize);
  font-size: var(--input-focusLabel-fontSize);
  bottom: var(--input-focusLabel-offset);
  color: var(--font-color-label-focus);
  left: 0;
  font-weight: 500;
}

.checkbox-label {
  font-weight: var(--font-weight);
  flex: 1;
}

.DefaultLabelClass:has(+ select) {
  pointer-events: none;
}

/*
          7.2 Inputs
      */
.fiviInput {
  display: inline-flex;
  width: 100vw;
  max-width: var(--fiviInput-width);
  position: relative;
}

.form-control {
  display: flex;
  align-items: center;
  width: 100% !important;
  height: var(--input-height);
  padding: 0px var(--gap-horizontal-50);
  margin-top: var(--input-marginTop-forLabelFocusSpace);
  font-size: var(--font-size-input);
  font-weight: var(--font-weight-input);
  line-height: var(--font-lineheight-input);
  color: var(--font-color-input);
  font-family: var(--font-family-input);
  border: 1px solid var(--border-color) !important;
  border-radius: 8px;
  background-color: var(--background-input-color) !important;
  flex: 1 1 0;
}

.form-control:focus {
  border: 2px solid var(--border-color-focus) !important;
  box-shadow: none;
  /* -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px color-mix(in srgb, var(--border-color-focus), transparent 40%);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px color-mix(in srgb, var(--border-color-focus), transparent 40%); */
  color: var(--font-color-label-focus);
}

.form-control[disabled] {
  background-color: #eee !important;
}

.fiviTransparent {
  color: transparent;
}

/*
          7.3 Fivi Input Containers
      */
.fiviTwoInput,
.fiviLongInput {
  /*
              can container either input elements or fiviInput containers
          */
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-horizontal-25) var(--gap-vertical);
  flex-wrap: wrap;
}

.fiviTwoInput > input,
.fiviTwoInput > .fiviInput {
  max-width: var(--fiviInput-width-half);
}

.fiviTwoInput > .DefaultLabelClass {
  height: var(--input-focusLabel-fontSize);
  font-size: var(--input-focusLabel-fontSize);
  bottom: var(--input-focusLabel-offset);
  color: var(--font-color-label-focus);
  left: 0;
  text-transform: none;
}

/*
          these containers normally contain a bunch of .fiviInput containers
      */
.fiviMultiInput {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--fiviInput-vertical-spacing) var(--fiviInput-horizontal-spacing);
  flex-wrap: wrap;
  max-width: 100%;
  width: 100%;
  position: relative;
}

.fiviMultiContainer {
  display: flex;
  flex-direction: column;
  max-width: var(--column-width-full);
  width: 100%;
  gap: var(--gap-vertical) var(--gap-horizontal);
}

.fiviTwoInputContainer {
  /*
              Use this when you want two .fiviInputs to take
              up half the normal width and behave like a standard
              width .fiviInput.
          */
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: var(--fiviInput-vertical-spacing) var(--fiviInput-horizontal-spacing);
  flex-wrap: wrap;
  max-width: var(--fiviInput-width);
  width: 100vw;
  position: relative;
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  .fiviTwoInput > input {
    max-width: var(--fiviInput-width-half);
  }

  .fiviMultiInput {
    max-width: var(--fiviInput-width);
    width: 100%;
  }
}

/*
          7.4 Fivi Checkbox/Radio Buttons
      */
.fiviCheckBox,
.fiviCheckBox > span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap-horizontal-50);
  max-width: fit-content;
  flex-direction: row;
}

.fiviCheckBox > label,
.fiviCheckBox > span > label {
  display: flex;
  height: var(--column-spacer);
  align-items: center;
  gap: var(--gap-horizontal-50);
}

.icheckbox_square-blue,
.iradio_square-blue {
  background-image: unset;
  width: 0;
  height: 0;
  appearance: none;
  position: absolute !important;
}

input[type="checkbox"],
input[type="radio"] {
  appearance: none;
  position: absolute;
  width: 0;
  height: 0;
}

.fiviCheckBox {
  /* display: block !important; */
}

.fiviCheckBox label {
  /* display: none; */
}

.fiviCheckBox .CtlValidator {
  top: -4px;
  margin: 0;
  padding: 0;
  left: -20;
  height: 25px;
}

.icheckbox_square-blue + label,
.iradio_square-blue + label,
.iradio_square-blue + span + label {
  position: relative;
  margin-bottom: 0;
  cursor: pointer;
}

.icheckbox_square-blue + label:before,
.iradio_square-blue + label:before,
.iradio_square-blue + span + label:before {
  content: "";
  margin: 0;
  min-width: calc(var(--column-spacer) * 2);
  border-radius: 40px;
  height: var(--column-spacer);
  position: relative;
  cursor: pointer;
  background-color: var(--color-gray-light);
  transition-duration: 500ms;
  max-width: calc(var(--column-spacer) * 2);
}

.icheckbox_square-blue + label:after,
.iradio_square-blue + label:after,
.iradio_square-blue + span + label:after {
  content: "";
  position: absolute;
  background-color: var(--color-black-light);
  cursor: pointer;
  left: 0;
  width: var(--column-spacer);
  height: var(--column-spacer);
  border-radius: 50%;
  border: 0.5px solid var(--border-color);
  transition-duration: 500ms;
}

.icheckbox_square-blue.checked + label:before,
.iradio_square-blue.checked + label:before,
.iradio_square-blue.checked + span + label:before {
  background-color: var(--color-accent-blue);
}

.icheckbox_square-blue.checked + label:after,
.iradio_square-blue.checked + label:after,
.iradio_square-blue.checked + span + label:after {
  background-color: var(--color-primary-dark);
  border-color: var(--color-primary-light);
  left: var(--column-spacer);
}

.icheckbox_square-blue.checked.disabled + label:after,
.iradio_square-blue.checked.disabled + label:after,
.iradio_square-blue.checked.disabled + span + label:after {
  cursor: not-allowed;
}

.icheckbox_square-blue.checked.disabled + label:before,
.iradio_square-blue.checked.disabled + label:before,
.iradio_square-blue.checked.disabled + span + label:before {
  display: flex;
  align-items: center;
  padding-left: calc(var(--column-spacer) / 2);
  background-color: var(--color-primary-light);
  color: var(--color-primary-dark);
  content: "\f023";
  font-family: FontAwesome;
  font-size: 14px;
  cursor: not-allowed;
}

/* Button radio style */
.fiviRadioButton {
  display: flex;
  position: relative;
  align-items: center;
  z-index: 0;
}

.fiviRadioButton input + label {
  position: relative;
  padding: 0 var(--gap-horizontal-25);
  margin-bottom: 0;
  width: 100%;
  justify-content: center;
  height: calc(var(--input-height));
  cursor: pointer;
  text-align: center;
  color: var(--color-primary-normal);
  align-content: center;
  pointer-events: all !important;
}

.fiviRadioButton input + label:before {
  display: none;
}

.fiviRadioButton input + label:after {
  content: "";
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  min-width: fit-content;
  padding: var(--gap-vertical) var(--gap-horizontal);
  background-color: var(--background-color-alt);
  color: var(--color-primary-normal);
  border: 1px solid var(--color-primary-normal);
  border-radius: 5px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 500;
  box-shadow: none;
  transition-duration: 500ms;
  transition-property: color, background-color;
  z-index: -1;
}

.fiviRadioButton input + label:hover,
.fiviRadioButton input + label:focus,
.fiviRadioButton input + label:active,
.fiviRadioButton input:checked + label {
  color: var(--color-white-normal);
}

.fiviRadioButton input + label:hover:after,
.fiviRadioButton input + label:focus:after,
.fiviRadioButton input + label:active:after,
.fiviRadioButton input:checked + label:after {
  background-color: var(--color-primary-normal);
  box-shadow: none;
  text-decoration: none;
  left: 0;
}

.fiviRadioButton input:checked:disabled + label:after {
  cursor: not-allowed;
}

.fiviRadioButton input:checked:disabled + label:before {
  display: none;
}

/*
          7.5 Validator
      */
.CtlValidator {
  position: absolute;
  line-height: var(--input-height);
  bottom: -3px;
  left: 3.5px;
  z-index: 5;
}

/*
          7.6 Tool Tips
      */
.DefaultTooltipClass {
  position: absolute;
  width: fit-content;
}

.fiviInput .DefaultTooltipClass {
  bottom: 0;
  right: var(--gap-horizontal-50);
  height: var(--input-height);
  display: flex;
  align-items: center;
}

.fiviInput select ~ .DefaultTooltipClass {
  right: calc(var(--gap-horizontal) - var(--gap-horizontal-25));
}

.tooltip-arrow {
  display: none;
}

.tooltip-inner {
  width: max-content;
  max-width: 300px !important;
  text-align: left;
}

.popover-content {
  color: var(--color-black-normal);
}

/*
          7.7 Seperators
      */
.fiviMultiSeperator {
  width: 100%;
  height: 2px;
  margin: 14px 0;
}

.fiviMultiSeperator::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  max-width: calc(var(--fiviInput-width) * 2 + var(--column-spacer));
  background-color: var(--border-color);
}

/*
          8. fiVISION Controls
      */
/*
          8.1 fiVISION_ErrorSummary
      */
#ErrorSummary1 {
  display: none;
}

#ErrorSummary1:has(li) {
  display: block;
  padding: 0 var(--gap-horizontal);
}

#ErrorSummary1 li,
.errorSummary {
  font-size: calc(var(--font-size) - 2px);
  font-weight: 500;
  margin-bottom: 0;
}

/*
          8.2 fiVISION_Panel
      */
.fiviPanel {
  display: inline-flex;
  flex-direction: unset;
  flex-wrap: unset;
  width: unset;
  justify-content: unset;
}

.fiviPanel,
.fiviPanel > .fiviPanelContainer {
  display: block;
  max-width: 100%;
}

/*
          8.3 fiVISION_ProductsAndServicesV2
      */
.fiviProdServControl {
  display: flex;
  flex-wrap: wrap;
  max-width: var(--column-width-12);
  width: 100%;
  gap: var(--gap-vertical);
}

.fiviProdServControl .fiviCheckBox > label,
.fiviProdServControl .fiviCheckBox > span > label {
  text-indent: -3px;
}

.fiviProdServControl .DefaultTooltipClass {
  top: 0;
  position: relative;
}

.fiviProdContainer {
  max-width: 100%;
  width: 100%;
  position: relative;
}

.fiviProdContainer:not(:last-child) {
  padding-bottom: var(--gap-vertical);
  border-bottom: 1px solid var(--border-color);
}

.fiviProdServ {
  display: flex;
  flex-direction: row;
  gap: var(--gap-vertical-50) var(--gap-horizontal-50);
  align-items: center;
}

.fiviProdServ > .fiviCheckBox > .DefaultTooltipClass,
.fiviProdServ > .fiviCheckBox > span > .DefaultTooltipClass {
  color: var(--color-black-dark);
}

.fiviProdServ > .fiviCheckBox > label,
.fiviProdServ > .fiviCheckBox > span > label {
  font-size: calc(var(--font-size-label) + 4px);
  font-weight: 400;
}

.fiviProdServ .fiviAddAnotherButton {
  display: flex;
  width: fit-content;
  align-self: center;
  justify-content: flex-start;
}

.fiviProdServ .fiviAddAnotherButton > a {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: auto;
}

.Product_MoreInfo {
  width: 100%;
}

.fiviProdPanel {
  max-width: 100%;
  width: 100%;
}

.fiviProdPanel:not(.fiviProdPanel:has(> *)) {
  display: none !important;
}

.fiviProdPanel > .fiviInput {
  max-width: 100%;
  width: var(--fiviInput-width);
}

.fiviProdPanel > .fiviProdInnerPanel:first-of-type {
  margin-top: var(--gap-vertical-50);
}

.fiviProdPanel > .fiviProdInnerPanel:not(:first-of-type) {
  margin-top: var(--gap-vertical);
}

.fiviProdInnerPanel {
  display: flex;
  flex-direction: row;
  gap: var(--gap-vertical-50);
  flex-wrap: wrap;
  width: 100%;
  padding: 0 var(--gap-horizontal);
  position: relative;
}

.Service_MoreInfo {
  width: 100%;
  font-size: 14px;
}

.fiviCDWizardInfo {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  max-width: var(--column-width-12);
  min-height: fit-content;
  padding: 0;
  background-color: transparent;
  border: none;
  box-shadow: none;
}

.fiviCDWizardInfo > .fiviCheckBox {
  height: var(--input-height);
  align-self: flex-end;
  width: 100%;
}

.fiviCDWizardInfo > .fiviInput > input {
  color: inherit !important;
}

/*
          8.4 fiVISION_AddressTextBoxV2
      */
.address-container {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--fiviInput-vertical-spacing);
  width: 100%;
  max-width: var(--fiviInput-width);
}

.fiviAddress {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-25);
  width: 100%;
}

.fiviAddress > .fiviMultiInput {
  display: flex;
  flex-direction: column;
  gap: var(--fiviInput-vertical-spacing);
  width: 100%;
}

.fiviAddress > .fiviSameAs {
  max-width: calc(calc(var(--fiviInput-width) / 2) + var(--gap-horizontal-50));
  position: absolute;
  top: calc(
    calc(var(--font-lineheight-h3) + var(--fiviInput-vertical-spacing)) * -1
  );
  right: 0;
}

.fiviAddress > .fiviSameAs label {
  font-size: calc(var(--font-size-label) - 2px);
}

.fiviAddress > .DefaultAddressVerifyingClass {
  font-size: calc(var(--font-size) - 2px);
  line-height: var(--font-lineheight);
  font-weight: 500;
  text-align: center;
  color: var(--font-color-light) !important;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .address-container {
    /* max-width: 100%; */
  }

  .address-container > h3 {
    max-width: 100%;
  }

  .fiviAddress .fiviInput {
    /* max-width: var(--column-width-4); */
  }

  .fiviAddress > .fiviSameAs {
    max-width: 100%;
    position: relative;
    top: unset;
    right: unset;
  }
}

/*
          8.5 fiVISION_PhoneTextBoxV2
              --fiviLongInput has the phone field, phone type, and preferred
              --fiviTwoInput has the phone field and either phone type or preferred
              --else its just the phone field
      */
.fiviPhoneControl {
  margin: 0;
  max-width: var(--fiviInput-width);
}

.fiviTwoInput.fiviPhoneControl,
.fiviLongInput.fiviPhoneControl {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--gap-vertical) var(--gap-horizontal);
  flex-wrap: wrap;
}

.fiviLongInput.fiviPhoneControl {
  width: 100%;
}

.fiviPhoneControl.fiviTwoInput > .DefaultLabelClass,
.fiviPhoneControl.fiviLongInput > .DefaultLabelClass {
  height: var(--input-height);
  font-size: var(--font-size-label);
  left: var(--gap-horizontal-50);
  font-weight: var(--font-weight-label);
  text-transform: none;
  color: var(--font-color-label);
}

.fiviPhoneControl.fiviTwoInput > .FocusLabelClass,
.fiviPhoneControl.fiviLongInput > .FocusLabelClass {
  height: var(--input-focusLabel-fontSize);
  font-size: var(--input-focusLabel-fontSize);
  left: 0;
  font-weight: 500;
  color: var(--font-color-label-focus);
}

.fiviPhoneControl.fiviTwoInput > .DefaultLabelClass {
  bottom: 0;
}

.fiviPhoneControl.fiviTwoInput > .FocusLabelClass {
  bottom: var(--input-focusLabel-offset);
}

.fiviPhoneControl.fiviLongInput > .DefaultLabelClass {
  top: var(--input-marginTop-forLabelFocusSpace);
}

.fiviPhoneControl.fiviLongInput > .FocusLabelClass {
  top: 0;
}

.fiviLongInput.fiviPhoneControl > input.form-control,
.fiviTwoInput.fiviPhoneControl > input.form-control {
  max-width: var(--fiviInput-width-partial-main) !important;
  width: 100%;
}

.fiviPhoneControl > .fiviCheckBox,
.fiviPhoneControl > select.form-control {
  max-width: var(--fiviInput-width-partial-alt) !important;
  width: 100%;
}

.fiviPhoneControl > .fiviCheckBox {
  background: transparent;
  border: none !important;
  box-shadow: none;
  padding: 0;
}

.fiviSMSOptInOut {
  width: 100%;
}

.fiviSMSOptions {
  width: 100%;
  background: var(--background-color) !important;
  border: solid 1px var(--border-color);
  border-radius: 5px;
  gap: var(--gap-vertical);
  padding: var(--gap-horizontal) !important;
  min-width: unset !important;
}

.fiviSMSOptionsButtonPanel .fiviInput {
  flex: 1 0 0;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .fiviTwoInput.fiviPhoneControl {
    max-width: var(--column-width-6);
    width: 100%;
  }

  .fiviTwoInput.fiviPhoneControl > input.form-control,
  .fiviTwoInput.fiviPhoneControl > select.form-control {
    max-width: var(--column-width-3);
  }

  .fiviLongInput.fiviPhoneControl > .fiviCheckBox {
    margin-top: 0;
    max-width: 100%;
  }

  .fiviLongInput.fiviPhoneControl > label.DefaultLabelClass {
    bottom: calc(var(--input-height) + var(--gap-horizontal-25));
  }

  .fiviLongInput.fiviPhoneControl > label.DefaultLabelClass.FocusLabelClass {
    bottom: calc(
      var(--input-focusLabel-offset) +
        calc(var(--input-height) + var(--gap-horizontal-25))
    );
  }
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .fiviTwoInput.fiviPhoneControl > input.form-control,
  .fiviTwoInput.fiviPhoneControl > select.form-control {
    max-width: var(--column-width-2);
  }
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  .fiviTwoInput.fiviPhoneControl {
    gap: var(--gap-horizontal-25) var(--gap-vertical);
  }

  .fiviTwoInput.fiviPhoneControl > input.form-control,
  .fiviLongInput.fiviPhoneControl > input.form-control,
  .fiviTwoInput.fiviPhoneControl > select.form-control,
  .fiviLongInput.fiviPhoneControl > select.form-control {
    max-width: 100% !important;
  }

  .fiviTwoInput.fiviPhoneControl > select.form-control,
  .fiviLongInput.fiviPhoneControl > select.form-control {
    /*         margin-top: 0px; */
  }

  .fiviPhoneControl > .fiviCheckBox {
    margin-top: 0;
    max-width: 100%;
  }

  .fiviTwoInput.fiviPhoneControl > label.DefaultLabelClass {
    /*! bottom: calc(var(--input-height) + var(--gap-horizontal-25)); */
  }

  .fiviTwoInput.fiviPhoneControl > label.DefaultLabelClass.FocusLabelClass {
    /*         bottom: calc(var(--input-focusLabel-offset) + calc(var(--input-height) + var(--gap-horizontal-25))); */
  }

  .fiviLongInput.fiviPhoneControl > label.DefaultLabelClass {
    bottom: calc(calc(var(--input-height) + var(--gap-horizontal-25)) * 2);
  }

  .fiviLongInput.fiviPhoneControl > label.DefaultLabelClass.FocusLabelClass {
    bottom: calc(
      var(--input-focusLabel-offset) +
        calc(calc(var(--input-height) + var(--gap-horizontal-25)) * 2)
    );
  }
}

/*
          8.6 fiVISION_IDTypeV2
      */
.fiviIDType {
  max-width: calc(calc(var(--fiviInput-width) * 2) + var(--column-spacer));
}

#statesDiv:has(+ #countriesDiv[style="display: none"]) {
  display: block !important;
}

.fiviIDType > div[id*="issueDateDiv"],
.fiviIDType > div[id*="expirationDateDiv"] {
  max-width: var(--fiviInput-width-half);
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .fiviIDType > div[id*="issueDateDiv"],
  .fiviIDType > div[id*="expirationDateDiv"] {
    max-width: var(--fiviInput-width);
  }
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .fiviIDType {
    max-width: var(--fiviInput-width);
  }

  .fiviIDType > div[id*="issueDateDiv"],
  .fiviIDType > div[id*="expirationDateDiv"] {
    max-width: var(--fiviInput-width-half);
  }
}

/*
          8.7 fiVISION_HousingDurationHistory
      */
.fiviHousingDurationHistory {
  max-width: var(--column-width-full);
}

.fiviHousingDurationHistory .fiviInput[id$="HousingTypeInput"],
.fiviHousingDurationHistory .fiviInput[id$="HousingPaymentMoneyTextBoxInput"] {
  max-width: var(--fiviInput-width-half);
}

.fiviHousingDurationHistory center {
  width: var(--fiviInput-width);
}

.fiviHousingDurationHistory .DefaultAddressVerifyingClass {
  width: var(--fiviInput-width);
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  .fiviHousingDurationHistory center {
    width: var(--fiviInput-width-double);
  }
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .fiviHousingDurationHistory .fiviInput[id$="HousingTypeInput"],
  .fiviHousingDurationHistory
    .fiviInput[id$="HousingPaymentMoneyTextBoxInput"] {
    max-width: var(--fiviInput-width);
  }

  .fiviHousingDurationHistory .DefaultAddressVerifyingClass {
    width: var(--column-width-4);
  }

  .fiviHousingDurationHistory center {
    width: var(--fiviInput-width);
  }
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .fiviHousingDurationHistory .fiviInput[id$="HousingTypeInput"],
  .fiviHousingDurationHistory
    .fiviInput[id$="HousingPaymentMoneyTextBoxInput"] {
    max-width: var(--fiviInput-width-half);
  }
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  .fiviHousingDurationHistory .fiviInput[id$="HousingTypeInput"],
  .fiviHousingDurationHistory
    .fiviInput[id$="HousingPaymentMoneyTextBoxInput"] {
    max-width: var(--fiviInput-width-half);
  }
}

/*
          8.8 fiVISION_EmploymentHistory
      */
.fiviEmpHistoryControl {
  max-width: var(--column-width-full);
  width: 100%;
}

.fiviEmpHistoryControl center {
  width: var(--fiviInput-width);
}

.fiviEmpHistoryControl .fiviInput > input {
  color: inherit !important;
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  .fiviEmpHistoryControl center {
    width: var(--fiviInput-width-double);
  }
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .fiviEmpHistoryControl center {
    width: var(--fiviInput-width);
  }
}

/*
          8.9 fiVISION_IndividualIncome
      */
.fiviIncomeControl {
  max-width: var(--column-width-full);
}

.fiviIncomeControl .fiviMultiSeperator {
  display: none;
}

.fiviIncomeControl .fiviMultiInput > .fiviInput {
  max-width: var(--fiviInput-width-half);
}

.fiviIncomeControl > .fiviMultiContainer > div:has(span[id*="btnAddIncome"]) {
  width: var(--fiviInput-width);
}

.fiviIncomeControl .fiviRemoveBtn {
  position: relative;
  left: unset;
  align-self: center;
  order: 2;
  margin-top: var(--input-marginTop-forLabelFocusSpace);
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  .fiviIncomeControl .fiviMultiInput > .fiviInput {
    max-width: var(--fiviInput-width);
  }

  .fiviIncomeControl > .fiviMultiContainer > div:has(span[id*="btnAddIncome"]) {
    width: var(--fiviInput-width-double);
  }
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .fiviIncomeControl > .fiviMultiContainer > div:has(span[id*="btnAddIncome"]) {
    width: var(--fiviInput-width);
  }
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .fiviIncomeControl .fiviMultiSeperator {
    display: block;
  }

  .fiviIncomeControl .fiviRemoveBtn {
    position: absolute;
    left: var(--fiviInput-width-half);
    align-self: unset;
    order: 0;
    height: unset;
  }
}

/*
          8.10 fiVISION_IndividualDetails
      */
.fiviIndDetails {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-50);
}

.fiviIndDetails > div {
  display: flex;
  gap: var(--gap-horizontal-50);
  padding-left: var(--gap-horizontal-200);
}

.fiviIndDetails
  > div:not(.fiviIndDetailsSection):not(.fiviIndDetailsName):before {
  content: "\f111";
  font-family: "Font Awesome 5 Free";
  font-size: 6px;
}

.fiviIndDetails > .fiviIndDetailsSection {
  padding-left: var(--gap-horizontal);
  font-style: italic;
}

.fiviIndDetailsSection > b {
  font-weight: 500;
}

.fiviIndDetails > .fiviIndDetailsName {
  font-size: var(--font-size);
  font-weight: 500;
  padding-left: var(--gap-horizontal-50);
  border-left: 2px solid var(--color-primary-normal);
}

.fiviIndDetails > .fiviIndDetailsName:not(:first-of-type) {
  margin-top: var(--gap-vertical-75);
}

/*
          8.11 fiVISION_ProductsAndServicesSelected
      */
.fiviProdServiceSelected > div {
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-75);
  font-size: calc(var(--font-size) + 2px);
  font-weight: 600;
}

.fiviProdServiceSelected > div > ul {
  padding: 0;
  list-style: none;
  display: flex;
  gap: var(--gap-vertical-25) 1px;
  flex-wrap: wrap;
  font-weight: 400;
  font-size: var(--font-size);
  flex-direction: row;
}

.fiviProdServiceSelected > div > ul > i {
  margin-left: var(--gap-horizontal);
}

.fiviProdServiceSelected > div > ul > li {
  margin: var(--gap-vertical-25) 0 0 0;
  font-size: var(--font-size);
  width: 100%;
  border-left: 2px solid var(--color-primary-normal);
  padding-left: var(--gap-horizontal-50);
}

.fiviProdServiceSelected > div > ul > li > b {
  font-weight: 500;
}

.fiviProdServiceSelected > div > ul > li:first-of-type {
  margin-top: 0;
}

.fiviProdServiceSelected > div > ul > ul {
  margin: 0;
  width: 100%;
  margin-left: var(--gap-horizontal);
}

.fiviProdServiceSelected > div > br + ul > li {
  margin-left: var(--gap-horizontal-25);
  font-size: var(--font-size);
  margin-top: 0;
}

.fiviProdServiceSelected > div > br + ul > li > b {
  font-weight: 500;
}

/*
          8.12 fiVISION_ProductRelationships
      */
.fiviProductRelationship {
  display: block;
  overflow-x: auto;
  white-space: nowrap;
  border: 1px solid var(--color-secondary-dark);
  border-radius: 5px;
  max-width: 100%;
  width: fit-content;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px,
    rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

.fiviProductRelationship table {
  overflow-x: auto;
  white-space: nowrap;
  border: none;
  margin: 0;
}

.fiviProductRelationship tr {
  display: flex;
  flex-wrap: nowrap;
  padding: 0 var(--column-spacer);
  border-bottom: 1px solid var(--color-white-dark);
}

.fiviProductRelationship tr:nth-of-type(odd) {
  background-color: white !important;
}

.fiviProductRelationship tr:nth-of-type(even) {
  background-color: transparent !important;
}

.fiviProductRelationship tr:last-of-type {
  border: none;
}

.fiviProductRelationship td {
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--column-width-2);
  height: calc(var(--font-size) * 3);
  text-wrap: wrap;
  padding: 0 !important;
  line-height: var(--font-lineheight);
  background-color: transparent !important;
  border: none !important;
  font-size: var(--font-size);
}

.fiviProductRelationship tr > td:first-of-type {
  justify-content: flex-start;
  font-weight: 600;
  width: var(--column-width-3);
}

.fiviProductRelationship tr[id*="_ServiceRow"] > td:first-of-type {
  padding-left: var(--column-spacer) !important;
  font-weight: 400;
}

.fiviProductRelationship tr:first-of-type > td {
  font-weight: bold;
  text-align: left !important;
  border: none;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .fiviProductRelationship tr {
    gap: 0 var(--column-spacer);
  }

  .fiviProductRelationship td {
    width: var(--column-width);
  }

  .fiviProductRelationship tr > td:first-of-type {
    width: var(--column-width-2);
  }

  .fiviProductRelationship tr:first-of-type > td {
    text-align: center !important;
  }
}

/*
          8.13 fiVISION_DocumentListV2
      */
.fiviDocumentList {
  width: 100%;
  display: flex;
  flex-direction: column-reverse;
  gap: var(--gap-vertical-75);
  align-items: center;
}

.fividocumentlist > span {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical);
}

.fiviDocumentList > input:first-of-type {
  align-self: center;
}

.fiviDocumentList > span:has(> table),
.fiviDocumentList > div:has(> table) {
  width: 100%;
}

.fiviDocumentList table {
  display: block;
  width: 100%;
  margin: 0;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  /* box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; */
}

.fiviDocumentList table > thead,
.fiviDocumentList table > tbody {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.fividocumentlist table > thead > tr,
.fiviDocumentList table > tbody > tr {
  display: flex;
  flex-wrap: nowrap;
  position: relative;
  padding: 0 var(--column-spacer);
  border: none;
  border-radius: 5px;
  border-bottom: 1px solid var(--color-white-dark);
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}

.fividocumentlist table > thead > tr {
  justify-content: stretch;
  width: 100%;
}

.fiviDocumentList table > thead > tr:nth-of-type(odd),
.fiviDocumentList table > .DocUploadGridClass > tr:nth-of-type(odd) {
  background-color: var(--background-color-alt);
}

.fiviDocumentList table > thead > tr:nth-of-type(even),
.fiviDocumentList table > .DocUploadGridClass > tr:nth-of-type(even) {
  background-color: transparent !important;
}

.fiviDocumentList table > tbody > tr:last-of-type {
  border: none;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.fiviDocumentList table > thead > tr > th,
.fiviDocumentList table > thead > tr > td,
.fiviDocumentList table > tbody > tr > th,
.fiviDocumentList table > tbody > tr > td {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  max-width: var(--column-width-3);
  width: 100% !important;
  padding: calc(var(--gap-horizontal) / 2) 0 !important;
  background-color: transparent !important;
  border-top: none;
  border-bottom: none;
  flex: 1 1 0;
}

.fiviDocumentList table td {
  border: none !important;
}

.fiviDocumentList table th:first-of-type,
.fiviDocumentList table.V3StatusCenterTableClass tr > th:nth-child(2),
.fiviDocumentList table td:first-of-type,
.fiviDocumentList table.V3StatusCenterTableClass tr > td:nth-child(2) {
  justify-content: flex-start;
}

.fiviDocumentList table th:last-of-type,
.fiviDocumentList table td:last-of-type {
  display: flex;
  flex-direction: row;
  max-width: var(--column-width-4);
  width: 100%;
  background-color: transparent !important;
}

.fiviDocumentList table td:last-of-type > br {
  display: none;
}

.fiviDocumentList .button-link,
.fiviDocumentList .button-upload {
  text-align: center;
  min-width: inherit;
}

.fiviDocumentList .DefaultTooltipClass {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--column-spacer);
  /* height: var(--input-height); */
  margin: var(--gap-vertical-50) var(--gap-horizontal-50) !important;
  /* position: absolute; */
  right: 0;
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .fiviDocumentList .DocUploadHeadClass {
    display: none;
  }

  .fiviDocumentList table > thead > tr,
  .fiviDocumentList table > tbody > tr {
    flex-direction: row;
    padding: 0;
    gap: var(--gap-vertical-50);
    flex-wrap: wrap;
  }

  .fiviDocumentList table td:first-of-type {
    justify-content: center;
  }

  .fiviDocumentList table > thead > tr > th,
  .fiviDocumentList table > tbody > tr > td {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    padding: var(--gap-vertical-25) var(--gap-horizontal-50) !important;
    flex: 1 1 0;
  }

  .fiviDocumentList table > tbody > tr > td > label.button-link {
    min-width: 0;
    width: 100% !important;
  }

  .fiviDocumentList table > tbody > tr > td:nth-of-type(4) {
    flex-direction: row;
    justify-content: center;
    padding: var(--gap-vertical-50) 0 !important;
  }

  .fiviDocumentList .DefaultTooltipClass {
    position: relative;
    height: fit-content;
    margin: var(--gap-vertical-25) 0 !important;
  }
}

/* -----------------Document List Updates --------- */
.fiviDocumentList {
  max-width: var(--column-width-10);
  width: 100%;
  display: flex;
  flex-direction: column-reverse;
  gap: var(--gap-vertical-75);
}

.V3SummaryControl .fiviDocumentList {
  max-width: var(--column-width-12);
}

.fiviDocumentList > input:first-of-type {
  align-self: center;
}

.fiviDocumentList table {
  /* display: block; */
  width: 100%;
  margin: 0;
  border: 1px solid var(--color-gray-dark);
  border-radius: 5px;
  box-shadow: none;
}

.fiviDocumentList table > tbody,
.fiviDocumentList table > thead {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.fiviDocumentList table > tbody > tr,
.fiviDocumentList table > thead > tr {
  display: flex;
  flex-wrap: nowrap;
  position: relative;
  padding: 0 var(--column-spacer);
  border: none;
  border-radius: 5px;
  border-bottom: 1px solid var(--color-gray-dark);
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}

.fiviDocumentList table > tbody > tr:nth-of-type(odd) {
  background-color: white !important;
}

.fiviDocumentList table > tbody > tr:nth-of-type(even) {
  background-color: transparent !important;
}

.fiviDocumentList table > tbody > tr:last-of-type {
  border: none;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.fiviDocumentList table th,
.fiviDocumentList table td {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: var(--column-width-3);
  width: 100%;
  padding: var(--gap-horizontal) 0 !important;
  background-color: transparent !important;
}

.V3MessagesHeaderClass th {
  max-width: var(--column-width-3) !important;
  width: 100% !important;
}

.fiviDocumentList table td,
.fiviDocumentList .V3MessagesHeaderClass th {
  border: none !important;
}

.fiviDocumentList table th:first-of-type,
.fiviDocumentList table td:first-of-type {
  justify-content: flex-start;
}

.fiviDocumentList table th:last-of-type,
.fiviDocumentList table td:last-of-type {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: var(--column-width-4);
  width: 100%;
  background-color: transparent !important;
}

.fiviDocumentList table td:last-of-type br {
  display: none;
}

.fiviDocumentList table td:last-of-type > span:has(.btn-default) {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  margin-top: var(--gap-vertical-25);
}

.fiviDocumentList table td:last-of-type > div[id*="UploadProgressBar_"] {
  max-width: var(--fiviInput-width);
  min-width: var(--column-width-2);
  width: fit-content;
  display: flex;
  align-items: center;
  gap: var(--gap-horizontal-25);
  margin-top: var(--gap-vertical-25);
}

.fiviDocumentList .DefaultTooltipClass {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--column-spacer);
  height: 100%;
  margin: 0 !important;
  position: absolute;
  top: 0;
  right: var(--gap-horizontal-25);
}

.fiviDocumentList .ng-modal-dialog {
  left: 0;
  width: var(--column-width-6) !important;
}

.fiviDocumentList .ng-modal-dialog-content {
  padding: var(--column-spacer);
}

.fiviDocumentList .ModalContent > div {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-50);
}

.fiviDocumentList .ModalContent br {
  display: none;
}

.fiviDocumentList .ModalContent > div > .modal-header {
  padding: 0;
}

.fiviDocumentList .ModalContent > div > .modal-header .close {
  font-size: var(--font-size-h1);
  color: var(--color-black-dark);
  opacity: 1;
}

.fiviDocumentList .ModalContent > div > .modal-header .close:hover {
  opacity: 0.5;
}

.fiviDocumentList .ModalContent > div .modal-body-insideItem {
  text-align: left;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: var(--gap-horizontal-50);
}

.fiviDocumentList .ModalContent > div .text-muted {
  font-size: var(--font-size);
  color: var(--font-color);
  line-height: var(--font-lineheight);
}

.fiviDocumentList .ModalContent > div .text-muted > br {
  display: inline-block;
}

.fiviDocumentList .ModalContent #qrcode {
  margin: 0 !important;
}

.fiviDocumentList .ModalContent #UploadWrapper > div:nth-of-type(2) {
  margin: 0 !important;
  height: auto !important;
  border: none !important;
  text-align: left !important;
}

.fiviDocumentList .ModalContent #UploadWrapper > div:nth-of-type(2) > span {
  font-size: var(--font-size-h2) !important;
  color: var(--font-color-h2) !important;
  line-height: var(--font-lineheight-h2) !important;
  font-weight: var(--font-weight-h2);
  padding: 0 !important;
  text-align: left !important;
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .fiviDocumentList tbody > tr:first-of-type {
    /* display: none; */
  }

  .fiviDocumentList table > tbody > tr {
    flex-direction: column;
    padding: calc(var(--column-spacer) / 2);
    gap: calc(var(--column-spacer) / 2);
  }

  .fiviDocumentList table > tbody > tr > td {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: var(--font-size-h3);
    max-width: 100%;
    padding: 0 !important;
    width: 100%;
  }

  .fiviDocumentList table > tbody > tr > td::before {
    font-size: var(--font-size-);
    line-height: var(--font-lineheight-h4);
    color: var(--font-color-h4);
    font-weight: 700;
    font-family: var(--font-family-h4);
  }

  .fiviDocumentList table > tbody > tr > td:nth-of-type(1):before {
    content: "Applicant Name";
  }

  .fiviDocumentList table > tbody > tr > td:nth-of-type(2):before {
    content: "Document Type";
  }

  /* status center column names */
  .fiviDocumentList
    table.V3StatusCenterTableClass
    > tbody
    > tr
    > td:nth-of-type(1):before {
    content: "Application Number";
  }

  .fiviDocumentList
    table.V3StatusCenterTableClass
    > tbody
    > tr
    > td:nth-of-type(2):before {
    content: "Individual";
  }

  .fiviDocumentList
    table.V3StatusCenterTableClass
    > tbody
    > tr
    > td:nth-of-type(3):before {
    content: "Document Type";
  }

  .fiviDocumentList
    table.V3StatusCenterTableClass
    > tbody
    > tr
    > td:nth-of-type(4):before {
    content: "Upload";
  }

  .fiviDocumentList table > tbody > tr > td:nth-of-type(3),
  .fiviDocumentList table td:last-of-type {
    max-width: 100%;
  }

  .fiviDocumentList .DefaultTooltipClass {
    position: relative;
    height: fit-content;
    width: 100%;
    margin: var(--gap-vertical-25) 0 !important;
  }

  .fiviDocumentList > input:first-of-type {
    display: none !important;
  }

  /* spacing for mobile Select File link  */
  .DocUploadGridText .button-link {
    padding-left: 0.5em;
  }
}

/* ^^^^^^-----------------Document List Updates ---------^^^^^^^ */

/*
          8.14 fiVISION_DisclosuresList
      */
.fiviDisclosureList {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-50);
  position: relative;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  padding: var(--gap-horizontal-50);
  /* margin-top: calc(var(--input-height) + var(--gap-vertical-50)); */
  width: 100%;
}

.fivi-disclosure-modal .modal-header {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

.fivi-disclosure-modal .modal-content {
  background-color: var(--background-color-alt);
  border-radius: 5px;
}

.fiviDisclosure-modal-button {
  position: absolute;
  top: calc(calc(var(--input-height) + var(--gap-vertical-50)) * -1);
  left: 0;
  display: flex;
  justify-content: center;
  width: 100%;
}

.fiviDisclosure-checkbox-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--gap-horizontal-50);
}

.fiviDisclosure-checkbox-container .fa-square {
  color: var(--color-primary-light) !important;
}

.fiviDisclosure-checkbox-container > label {
  width: unset;
}

.fiviDisclosure-checkbox-container > i {
  padding-right: unset !important;
}

.fiviDisclosure-checkbox-container .button-link {
  text-align: center;
  min-width: fit-content;
}

.fivi-disclosure-modal .modal-body > div {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
}

.fivi-disclosure-modal .modal-body .button-link {
  text-align: center;
}

/*
          8.15 fiVISION_ProductFundingV2
      */
.fiviProductFunding {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  gap: var(--gap-vertical);
}

.fiviProductFundingItem,
.fiviFundingAmount {
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  position: relative;
  padding: var(--gap-vertical-50);
  margin: 0;
}

.fiviFundingAmount {
  padding: var(--gap-vertical) var(--gap-horizontal-50);
}

.fiviFundingAmount > b > div {
  padding-right: var(--gap-horizontal-50);
  width: var(--column-width-2);
  text-align: end;
}

.fiviFundingAmount {
  display: flex;
  justify-content: space-between;
  width: 100% !important;
}

.fiviProductFundingItem > .fiviInput {
  padding: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  gap: var(--gap-horizontal);
}

.fiviProductFundingItem > .fiviInput > label {
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-end;
  border-right: 1px solid var(--border-color);
  font-weight: normal;
  flex: 1;
  gap: var(--gap-vertical-25);
}

.fiviProductFundingItem > .fiviInput > .form-control {
  width: var(--column-width-2) !important;
  margin-top: 0;
  color: var(--font-color-input) !important;
}

.fiviProductFundingItem > .fiviInput > .form-control:focus {
  color: var(--font-color-label-focus) !important;
}

.fiviProductFundingItem > .fiviInput > label:before {
  content: "* funding required";
  color: var(--color-primary-dark);
  font-size: 10px;
  padding: 0 4px;
  font-weight: bold;
  border-radius: var(--border-radius);
  position: relative;
  bottom: calc(var(--gap-vertical) * 0);
  font-style: italic;
}

.fiviProductFundingItem > .fiviInput:has(> input[min="0"]) > label:before {
  content: "funding optional";
  color: var(--font-color-h3);
  font-style: italic;
}

.ProductTypes_Funding {
  display: none;
}

@media all and (max-device-width: 450px), all and (max-width: 450px) {
  .fiviProductFundingItem > .fiviInput {
    flex-direction: column;
    text-align: center;
    height: calc(var(--input-height) * 2);
  }

  .fiviProductFundingItem > .fiviInput > label {
    border-right: none;
  }

  .fiviProductFunding {
    align-items: flex-end;
  }

  .fiviFundingAmount {
    flex-direction: column;
    text-align: center;
  }

  .fiviFundingAmount > b > div {
    text-align: center;
    padding: 0;
    width: 100%;
  }
}

#ACH_rbCheckingAccountType {
  padding-right: 1em;
}

/*
          8.16 fiVISION_ProveIndividualLookup
      */
.prove-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--gap-vertical);
  width: 100%;
}

.prove-container > div {
  width: 100%;
}

.fiviProveIndividualLookup {
  display: flex;
  flex-direction: column;
  border-radius: var(--border-radius);
  align-items: stretch;
}

.prove-direction-buttons {
  gap: var(--gap-horizontal);
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-start;
  width: 100%;
  margin-top: var(--gap-vertical);
  align-items: center;
}

/*
          8.17 fiVISION_ACH
      */
.fiviACHControl {
  justify-content: center;
}

.fiviACHStatus {
  max-width: var(--fiviInput-width);
  display: block;
}

.fiviACHStatus > span {
  font-weight: normal !important;
  color: var(--font-color) !important;
}

.fiviACHcbCont {
  max-width: var(--fiviInput-width);
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
}

.fiviACHControl > .fiviCheckBox {
  width: 100%;
}

/*
          8.18 fiVISION_CreditCardV2
      */
.fiviCreditCardControl {
  display: flex;
  flex-direction: column;
  gap: var(--column-spacer);
  align-items: center;
}

.fiviCreditCardControl,
.fiviCCIndInfo,
.fiviCCIndNameInfo,
.fiviCCIndAddy,
.fiviCCCardInfo {
  justify-content: center;
}

.fiviCCIndAddy {
  flex-direction: row;
}

.fiviCCCardInfo {
  position: relative;
}

.fiviCCCardInfo > .DefaultAddressVerifyingClass {
  position: absolute;
  text-align: right;
  width: calc(50% - var(--fiviInput-horizontal-spacing));
  font-size: var(--input-focusLabel-fontSize);
  height: var(--input-focusLabel-fontSize);
  left: 0;
}

.fiviCCCardInfo .fiviTwoInput {
  gap: 0;
}

.fiviCCCardInfo .TwoControls {
  width: 33% !important;
  padding: 0 0 0 0;
}

.fiviCCCardInfo .form-control.TwoControls {
  padding: 0 10px 0 10px;
}

.fiviCCCardInfo .TwoControls .form-control {
  width: 100% !important;
}

.fiviCCCardInfo .TwoControls .DefaultTooltipClass {
  right: 8px;
  color: var(--font-color-input);
}

#CreditCard_Month {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

#CreditCard_Year {
  border-radius: 0;
  border-left: none;
  border-right: none;
}

#CreditCard_CVV {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.fiviCreditCardControl .loading {
  position: absolute;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .fiviCCCardInfo > .DefaultAddressVerifyingClass {
    right: 0;
    width: 100%;
  }
}

/*
          8.19 fiVISION_FinicityFundingAccountVerification
      */
.fiviFinicity {
  justify-content: center;
}

#RealTimeInput > div {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 0 !important;
  width: 100% !important;
}

.fivi-verifyNow-contents {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical);
}

.fivi-verifyNow-btn-contanier {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--gap-vertical);
  text-align: center;
}

/*
          8.19 fiVISION_ApplicantWithdraw
      */
.fiviApplicantWithdraw {
  max-width: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-75);
  position: relative;
}

.fiviApplicantWithdraw > .CtlValidator {
  top: -3px;
  bottom: unset;
  left: -8px;
}

/*
          8.20 fiVISION_ProgressBar
      */
.progress-container {
  display: flex;
  align-self: stretch;
  width: 100%;
}

.progress-container > span {
  display: flex;
  width: 100%;
  background-color: var(--color-secondary-normal);
  min-width: var(--column-width-3);
}

.progress-container-header > span {
  display: flex;
  width: 100%;
  background-color: var(--color-white-light);
}

.progress-container-header > span:last-child {
  border-bottom: 1px solid var(--border-color);
}

.progress-container-main > span {
  display: flex;
  width: 100%;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

.journey-bar-icons {
  display: none;
}

.journey-bar {
  margin-bottom: 0;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  width: 100%;
  padding: var(--gap-horizontal-150);
  background-color: var(--background-color);
  align-self: stretch;
}

.journey-bar > tbody > tr {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-200);
}

.journey-bar > tbody > tr > td {
  border-top: none;
  padding: 0;
}

.journey-bar .journey-bar-group {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: var(--gap-vertical-25);
  min-width: var(--column-width);
}

.journey-bar .journey-bar-group > span {
  font-size: calc(var(--font-size) - 2px);
  color: var(--color-gray-light);
}

.journey-bar .journey-bar-group:before {
  content: "";
  font-size: calc(var(--font-size) - 2px);
  font-family: var(--font-family-alt);
}

.journey-bar .current-group:before {
  color: var(--color-primary-normal);
  font-weight: bold;
}

.journey-bar .journey-bar-group:has(> img[alt="Start"]):before {
  content: "1.";
}

.journey-bar .journey-bar-group:has(> img[alt="Products"]):before {
  content: "2.";
}

.journey-bar .journey-bar-group:has(> img[alt="Details"]):before {
  content: "3.";
}

.journey-bar .journey-bar-group:has(> img[alt="Verification"]):before {
  content: "4.";
}

.journey-bar .journey-bar-group:has(> img[alt="Funding"]):before {
  content: "5.";
}

.journey-bar .journey-bar-group:after {
  display: block;
  content: "";
  width: 100%;
  font-size: calc(var(--font-size) - 2px);
  color: var(--color-gray-light);
}

.journey-bar .journey-bar-group:has(> img[alt="Start"]):after {
  content: "Help us try to find your information for the fastest, smoothest experience possible!";
}

.journey-bar .journey-bar-group:has(> img[alt="Products"]):after {
  content: "Select or review your choices.";
}

.journey-bar .journey-bar-group:has(> img[alt="Details"]):after {
  content: "Provide a little more information based on the accounts and services you selected.";
}

.journey-bar .journey-bar-group:has(> img[alt="Verification"]):after {
  content: "Let's make sure we've dotted our i's and crossed our t's.";
}

.journey-bar .journey-bar-group:has(> img[alt="Funding"]):after {
  content: "You have many options for your first deposit. Select the one that works for you.";
}

.journey-bar .current-group:after {
  color: var(--font-color);
}

.journey-bar .current-group > span {
  font-weight: bold;
  color: var(--color-primary-normal);
}

.journey-bar .journey-bar-group.previous-group:before,
.journey-bar .journey-bar-group.future-group:before {
  color: var(--color-gray-light);
}

.progress-container-header .journey-bar-current,
.progress-bar-outer,
.progress-bar-text {
  display: none;
}

.progress-container-header {
  display: block;
  width: 100%;
  position: relative;
  width: 100%;
}

.progress-container-main {
  width: 100%;
}

#progbar {
  width: 100%;
  display: flex;
}

.progress-bar-outer {
  width: 100%;
  position: absolute;
}

.progress-bar-inner {
  background-color: var(--color-primary-normal);
  font-size: 0;
  height: 3px;
}

.journey-bar-current {
  display: flex;
  justify-content: stretch;
  align-items: flex-start;
  width: 100%;
  padding: var(--gap-vertical) var(--gap-horizontal);
  margin-bottom: 0;
  border-bottom: 1px solid var(--border-color);
}

.journey-bar-current > tbody,
.progress-bar-outer > tbody {
  width: 100%;
  display: flex;
}

.journey-bar-current > tbody > tr,
.progress-bar-outer > tbody > tr {
  display: flex;
  width: 100%;
}

.progress-bar-outer > tbody > tr > td {
  font-size: 0;
}

.journey-bar-current .journey-bar-group:not(.current-group) {
  display: none;
}

.journey-bar-current .current-group {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 0;
  border-top: none;
}

.journey-bar-current .current-group > span {
  font-size: calc(var(--font-size-h1) + 2px);
  font-weight: var(--font-weight-h1);
  color: var(--color-primary-normal);
  order: -1;
  width: 100%;
  display: flex !important;
  align-items: center;
}

.journey-bar-current .journey-bar-group.current-group > span:before {
  content: "";
  display: block;
  border: 3px solid var(--color-black-light);
  border-radius: 50%;
  position: absolute;
  /* Size of 3 letters divided by the ratio of circle width to letter width divided by offset ratio from right edge */
  right: calc(var(--gap-horizontal) - calc(var(--font-size-h1) * 3 / 2.25 / 4));
  width: calc(var(--font-size-h1) * 2.25);
  height: calc(var(--font-size-h1) * 2.25);
}

.journey-bar-current .journey-bar-group.current-group:before {
  content: "1";
  font-size: var(--font-size-h1);
  font-weight: 800;
  font-family: var(--font-family-alt);
  color: var(--color-primary-normal);
}

.journey-bar-current .journey-bar-group.current-group:after {
  content: "/5";
  font-size: var(--font-size-h1);
  font-family: var(--font-family-alt);
  color: var(--color-gray-light);
  width: 21px;
  /* Required for Firefox */
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Start"]):before {
  content: "1";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Products"]):before {
  content: "2";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Details"]):before {
  content: "3";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Verification"]):before {
  content: "4";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Funding"]):before {
  content: "5";
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  .progress-container {
    display: none;
  }

  .progress-container-header .journey-bar-current,
  .progress-bar-outer {
    display: flex;
  }

  .progress-container-main .journey-bar-current {
    display: none;
  }
}

/* Hide journeybar in MC  */
.AdminConsole .progress-container {
  display: none;
}

.AdminConsole .progress-container-main {
  display: none;
}

.AdminConsole .layout-container {
  padding: 1em;
}

.AdminConsole .section-container {
  padding-bottom: 1em;
}

/*
          8.21 fiVISON_IndividualHandler
      */
#IndividualHandler01 {
  width: 100%;
}

#IndividualHandler02 {
  width: 100%;
}

/*
          8.22 fiVISION_EmailTextBoxV2
      */
.email-container {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--fiviInput-vertical-spacing);
  width: 100%;
  max-width: var(--fiviInput-width);
}

/* 
          8.23 fiVISION_CollateralHandler
      */
#CollateralHandler01 {
  flex-grow: 1;
  flex-basis: 0;
  display: flex;
  flex-direction: column;
}

#CollateralHandler01 > .fivipanelcontainer {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

#CollateralHandler01 > .fivipanelcontainer > .flex-column {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

/*
          8.24 fiVISION_IDAuthentication
      */
.fiviIDAuth tbody {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-25);
}

.fiviIDAuth .iradio_square-blue + label {
  display: flex;
  gap: var(--gap-horizontal-25);
  font-weight: 300;
  white-space: nowrap;
}

/* 
          8.25 fiVISION_PlaidFundingAccountVerification
      */
.fiviPlaid br {
  display: none;
}

.fiviPlaid #ACHFundingAccountVerification_results {
  display: flex;
}

.fiviPlaid #RealTimeInput > div > div > div > div:last-of-type {
  display: flex;
  justify-content: center;
}

/* 
          8.26 fiVISION_WorkflowSurvey
      */
.fiviWorkflowSurvey {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical);
  width: 100%;
  align-items: center;
}

.fiviWorkflowSurveyDescription,
.fiviWorkflowSurveyQuestions {
  width: 100%;
}

.fiviWorkflowSurveyAnswers {
  display: flex;
  gap: var(--gap-horizontal);
  width: 100%;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .fiviWorkflowSurveyAnswers {
    flex-direction: column;
  }
}

/* 
          8.27 fiVISION_MoneyTextBoxV2
      */
.fiviInput > input[id$="_MoneyTextBox"] {
  color: inherit !important;
}

/*
          9. Page Specific
      */
/*
          9.1 Default Page
      */
.default-thumbnail-container {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical);
  width: 100%;
  padding-bottom: 2em;
}

.page-Default-Content.page-container {
  margin-top: var(--gap-vertical);
  gap: var(--gap-vertical-200);
}

.page-Default-Content .header-container {
  gap: var(--gap-vertical);
}

.page-Default-Content .thumbnail {
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: center;
  gap: var(--gap-vertical);
  width: 100%;
  margin: 0;
  padding: 0;
  border-radius: 5px;
  border: 1px solid var(--border-color);
  box-shadow: none;
  position: relative;
  background-color: var(--color-white-light);
  color: var(--color-primary-normal);
}

.page-Default-Content .thumbnail:hover,
.page-Default-Content .thumbnail:active,
.page-Default-Content .thumbnail:focus {
  background-color: var(--color-white-dark);
  cursor: pointer;
}

.page-Default-Content .thumbnail .button-link {
  font-weight: 500;
  height: 100%;
  width: 100% !important;
  padding: var(--gap-vertical) calc(var(--gap-horizontal) * 2.5);
  margin: 0;
  text-decoration: none;
  color: inherit;
}

.page-Default-Content .thumbnail > span {
  width: 100%;
}

.thumbnail-img {
  position: absolute;
  pointer-events: none;
  left: var(--gap-horizontal-50);
  padding: 5px;
  border-radius: 5px;
}

.thumbnail-img svg {
  stroke: var(--color-primary-normal);
}

.thumbnail .fas {
  position: absolute;
  pointer-events: none;
  right: var(--gap-horizontal-50);
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
  .lets-get-started-container {
    max-width: var(--column-width-5);
  }

  .what-you-need {
    font-size: calc(var(--font-size) - 2px);
  }
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .default-thumbnail-container {
    max-width: 100%;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .page-Default-Content .thumbnail {
  }
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
  .page-Default-Content .thumbnail {
    max-width: var(--column-width-4);
  }

  .lets-get-started-container {
    align-items: center;
  }

  .lets-get-started-container > #IndividualHandler01 {
    align-items: center;
  }

  .lets-get-started-container > .h2 {
    text-align: center;
    justify-content: center;
  }

  .lets-get-started-container > h2 {
    flex-direction: column;
    gap: var(--gap-vertical-25);
  }
}

/*
          9.2 Applicant Prove
      */
.prove-start-container {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical);
  flex-grow: 1;
  flex-basis: 0;
  padding-bottom: calc(var(--gap-vertical) * 3.5);
}

.prove-start-container .fiviMultiInput {
  position: unset;
}

.prove-or-existing {
  padding: 0 var(--gap-horizontal);
  align-items: stretch;
  justify-content: space-between;
  min-width: 0;
  flex-grow: 1;
  flex-basis: 0;
  align-self: stretch;
}

.prove-new {
  flex-grow: 3;
  flex-basis: 0;
  min-width: 0;
  justify-content: center;
  align-self: stretch;
  gap: var(--gap-vertical-150);
}

.prove-new .fa-user-circle {
  font-size: 60px;
  color: var(--color-primary-normal);
}

.prove-new .fiviInput {
  max-width: 100%;
  width: 100%;
}

.prove-divider {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: stretch;
  gap: var(--gap-vertical-25);
  align-self: stretch;
}

.prove-existing {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 var(--gap-horizontal);
  flex-basis: 0;
  flex-grow: 2;
}

.prove-existing > span {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: row;
}

.prove-disclosure {
}

.prove-direction-buttons {
  border-top: 0.5px solid var(--border-color);
  padding: var(--gap-vertical) var(--gap-horizontal);
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100vw;
  max-width: 100%;
}

#proveWorking,
.loading {
  display: block;
  background-color: transparent;
  width: fit-content;
}

#proveWorking .loader,
.loading .loader {
  position: relative;
  top: 0;
  left: 0;
  border-top-color: var(--color-primary-normal);
  margin: var(--gap-vertical-50) var(--gap-horizontal-50);
}

.prove-check-phone-image-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

#proveIndividualErrorMessage {
  color: red;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .prove-start-container .fiviInput,
  .prove-start-container .button-other {
    max-width: 100%;
  }

  .prove-or-existing {
    padding: 0;
    flex-direction: column;
    gap: var(--gap-vertical);
    flex-wrap: nowrap;
  }

  .prove-divider {
    justify-content: center;
    flex-direction: row;
    text-align: center;
    gap: var(--gap-horizontal);
    padding: 0 var(--gap-horizontal);
  }

  .prove-divider .page-text {
    width: fit-content;
  }

  .prove-existing .button-other {
    width: 100% !important;
  }

  .prove-new,
  .prove-divider,
  .prove-existing,
  .prove-disclosure {
    width: 100%;
  }

  .prove-disclosure {
    margin: 0;
  }

  .vertical-divider {
    height: 1px;
    width: 100%;
    border-top: 0.5px solid var(--border-color);
  }
}

/* 
          9.3 Select Accounts
      */
.page-SelectAccount .fiviPanel {
  width: 100%;
}

/* 
          9.4 Disclosures
      */
.accept-disclosures-container {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  padding: var(--gap-horizontal-50);
  width: 100%;
}

.accept-disclosures-container .flex-column {
  flex: 1;
}

.bw-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  text-align: center;
  gap: var(--gap-horizontal);
  width: 100%;
}

.bw-divider .page-text {
  width: fit-content;
}

#pnlBackupWithholding .fiviCheckBox {
  /* width: 100%; */
  max-width: 100%;
  position: relative;
  z-index: 1;
}

#pnlBackupWithholding .iradio_square-blue + label {
  position: relative;
  padding: var(--gap-vertical) var(--gap-horizontal);
  margin-bottom: 0;
  width: 100%;
  justify-content: center;
  height: calc(var(--input-height) + var(--gap-vertical-200));
  cursor: pointer;
  color: var(--color-primary-normal);
}

#pnlBackupWithholding .iradio_square-blue + label:before {
  display: none;
}

#pnlBackupWithholding .iradio_square-blue + label:after {
  content: "";
  left: 0;
  position: absolute;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: fit-content;
  padding: var(--gap-vertical) var(--gap-horizontal-200);
  background-color: var(--background-input-color);
  color: var(--color-primary-normal);
  border: 1px solid var(--color-primary-normal);
  border-radius: 5px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 500;
  box-shadow: none;
  transition-duration: 500ms;
  transition-property: color, background-color;
  z-index: -1;
}

#pnlBackupWithholding .iradio_square-blue + label:hover,
#pnlBackupWithholding .iradio_square-blue.checked + label {
  color: var(--color-white-normal);
}

#pnlBackupWithholding .iradio_square-blue + label:hover:after,
#pnlBackupWithholding .iradio_square-blue.checked + label:after {
  background-color: var(--color-primary-normal);
  box-shadow: none;
  text-decoration: none;
  left: 0;
}

#pnlBackupWithholding .iradio_square-blue.checked.disabled + label:after {
  cursor: not-allowed;
}

#pnlBackupWithholding .iradio_square-blue.checked.disabled + label:before {
  display: none;
}

/*
          9.5 Funding
      */
#pnlFundingAmount,
#pnlACHDetails,
#pnlCreditCardDetails,
#pnlMailDetails {
  width: 100%;
}

#pnlFundingMethods {
  position: relative;
  max-width: 100%;
  width: 100%;
}

#pnlFundingMethods .fiviPanel {
  /* max-width: 100%; */
}

.funding-method-container {
  max-width: 100%;
  gap: var(--gap-horizontal-50);
}

.funding-method-container > span {
  max-width: 100%;
  /* border-radius: 5px; */
  position: relative;
  flex: 1;
}

.funding-method .fiviCheckBox {
  width: 100%;
  max-width: 100%;
  position: relative;
  z-index: 1;
  gap: 0;
}

.funding-method-container .iradio_square-blue + label {
  position: relative;
  padding: 0 var(--gap-horizontal-25);
  margin-bottom: 0;
  width: 100%;
  justify-content: center;
  height: calc(var(--input-height));
  cursor: pointer;
  text-align: center;
  color: var(--color-primary-normal);
}

.funding-method-container .iradio_square-blue + label:before {
  display: none;
}

.funding-method-container .iradio_square-blue + label:after {
  content: "";
  left: 0;
  position: absolute;
  width: 100%;
  min-width: fit-content;
  padding: var(--gap-vertical) var(--gap-horizontal-200);
  background-color: var(--background-input-color);
  color: var(--color-primary-normal);
  border: 1px solid var(--color-primary-normal);
  border-radius: 5px;
  font-size: 14px;
  line-height: 14px;
  font-weight: 500;
  box-shadow: none;
  transition-duration: 500ms;
  transition-property: color, background-color;
  z-index: -1;
}

.funding-method-container .iradio_square-blue + label:hover,
.funding-method-container .iradio_square-blue.checked + label {
  color: var(--color-white-normal);
}

.funding-method-container .iradio_square-blue + label:hover:after,
.funding-method-container .iradio_square-blue.checked + label:after {
  background-color: var(--color-primary-normal);
  box-shadow: none;
  text-decoration: none;
  left: 0;
}

.funding-method-container .iradio_square-blue.checked.disabled + label:after {
  cursor: not-allowed;
}

.funding-method-container .iradio_square-blue.checked.disabled + label:before {
  display: none;
}

.funding-method-detail .fiviInput {
  width: calc(50% - var(--fiviInput-horizontal-spacing));
  max-width: var(--fiviInput-width);
}

.funding-method-detail .fiviCCCardInfo .form-control.CCCVVClass {
  width: 100%;
}

.funding-method-detail .fiviCCCardInfo .form-control.TwoControls,
.funding-method-detail .fiviCCCardInfo .fiviInput.TwoControls {
  width: 33% !important;
}

.funding-method-detail {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical-50);
  border: 1px solid var(--border-color);
  border-radius: 5px;
  background-color: var(--background-color-alt);
  padding: var(--gap-vertical);
  width: 100%;
  line-height: 1.5;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
  .funding-method-detail .fiviInput {
    max-width: 100%;
    width: 100%;
  }

  .funding-method-detail .fiviCCCardInfo .form-control.TwoControls,
  .funding-method-detail .fiviCCCardInfo .fiviInput.TwoControls {
    width: 33% !important;
    max-width: 100%;
  }
}

/*
          9.6 Pending/Approved/Denied
      */
.page-Approved .header-container,
.page-Pending .header-container,
.page-Denied .header-container {
  flex-direction: row;
}

.page-Approved .header-container .flex-column,
.page-Pending .header-container .flex-column,
.page-Denied .header-container .flex-column {
  flex: 1;
}

.application-info-container {
  text-align: right;
}

.app-status-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: 5px;
  padding: var(--gap-vertical);
  background-color: var(--background-color-alt);
}

.app-status-img svg {
  stroke: var(--color-primary-normal);
}

.app-status-container .page-text {
  letter-spacing: 1px;
  font-weight: 300;
}

.app-status-container .flex-row .page-text {
  flex: 1;
}

.app-status-container .fiviPanel {
  width: 100%;
}

.app-status-account-container {
  display: flex;
  flex-direction: column;
  gap: var(--gap-vertical);
  width: 100%;
}

.app-status-account-container .fiviProdServiceSelected {
  background-color: var(--background-color-page);
  padding: var(--gap-vertical);
  border-radius: 5px;
  border: 1px solid var(--border-color);
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
  .page-Approved .header-container,
  .page-Pending .header-container,
  .page-Denied .header-container {
    flex-direction: column-reverse;
  }

  .application-info-container {
    width: 100%;
  }
}

/*
          9.7 Decline Disclosures
      */
.page-DeclineDisclosures .h1 {
  text-align: center;
}

/*
      9.8 Payment Interest Options
  */

.fiviRepeater {
  width: 100%;
}

.fiviRepeater .rbButtonGroup {
  margin-bottom: 1rem;
}

.repeater-radio-answer .fiviCheckBox {
  padding: 0.5rem 0 !important;
}

/*
          10. ControlID Specific
      */
#tbCamera {
  display: none;
  /* max-width: var(--fiviInput-width); */
}

#tbCamera #lblLicenseScan {
  display: block;
  left: 0;
  transform: none;
  margin: 0 auto;
  width: fit-content !important;
  height: fit-content;
  max-width: 100%;
  max-height: 100%;
}

@media all and (max-device-width: 834px), all and (max-width: 834px) {
  #tbCamera {
    display: block;
    max-width: var(--column-width-full);
  }
}

#pnlBackupWithholding {
  background-color: var(--background-color-alt);
  padding: var(--gap-vertical) var(--gap-horizontal);
  border: 1px solid var(--border-color);
  border-radius: 5px;
}

#LoanStatus {
  display: flex;
  flex-direction: column;
  gap: var(--gap-horizontal);
  width: 100%;
  padding: var(--gap-horizontal);
  background-color: var(--color-white-light);
  border-radius: var(--border-radius);
}

#UploadWrapper .flex-column {
  align-items: center;
  justify-content: center;
  gap: var(--gap-vertical-25);
}

#UploadWrapper h3,
#MoreUploadOptionsModalEmailSent h3 {
  text-align: center;
  padding: var(--gap-vertical-50);
  color: var(--color-gray-normal);
}

#UploadWrapper .text-muted,
#MoreUploadOptionsModalEmailSent .text-muted {
  font-size: var(--font-size);
  color: var(--color-black-light);
  line-height: var(--font-lineheight);
}

#UploadWrapper .modal-body-insideItem {
  align-items: stretch;
}

#UploadWrapper .styledInput {
  font-size: var(--font-size-input);
  color: var(--color-gray-normal);
  width: 100%;
}

#cbColorModeToggle .icheckbox_square-blue + label:before {
  content: "";
  background-color: var(--color-accent-blue);
}

#cbColorModeToggle .icheckbox_square-blue + label:after {
  content: "\f0eb";
  font-family: "Font Awesome 5 Free";
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-primary-dark);
  border-color: black;
}

#cbColorModeToggle .icheckbox_square-blue.checked + label:before {
  background-color: var(--color-secondary-light);
}

#cbColorModeToggle .icheckbox_square-blue.checked + label:after {
  content: "\f186";
  font-family: "Font Awesome 5 Free";
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--color-white-normal);
  background-color: var(--color-secondary-dark);
  border-color: var(--color-secondary-light);
}

#__asptrace,
#__asptrace > span {
  display: block;
  max-width: 100vw;
  overflow-x: scroll;
}

/*
          11. Admin Console
      */
#Content {
  width: 100% !important;
}

.AdminContent {
  width: 100%;
}

.AdminContent > table > tbody > tr > td:nth-child(2) > table > tbody > tr {
  display: flex;
}

.AdminContent > table > tbody > tr > td:nth-child(2) > table > tbody > tr > td {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
}

.AdminContent
  > table
  > tbody
  > tr
  > td:nth-child(2)
  > table
  > tbody
  > tr
  > td:last-of-type
  .form-control {
  max-width: 200px;
  margin-top: 0;
}

.AdminContent
  > table
  > tbody
  > tr
  > td:nth-child(2)
  > table
  > tbody
  > tr
  > td
  input[type="checkbox"] {
  appearance: auto;
  position: static;
  width: inherit;
  height: inherit;
  margin: 0;
}

.AdminContent .aspNetDisabled {
  display: flex;
  width: fit-content;
  align-items: center;
  min-width: 200px;
}

.AdminContent .aspNetDisabled > input {
  width: 20px;
}

.layout.AdminConsole {
  min-height: auto;
}

.layout.AdminConsole > header,
.layout.AdminConsole > footer {
  display: none;
}

.layout.AdminConsole > main {
  padding: 40px 10px;
}

.layout.AdminConsole > main > .layout-container {
  width: 100%;
  max-width: calc(980px - 40px);
}

.layout.AdminConsole .page-navigation-container {
  max-width: 100%;
}

/*
          12. Client Header/Footer
      */
/* 1. Header */
header {
  background: #576b8e !important;
}

/* 2. Footer  */
footer {
  font-family: "Barlow", sans-serif;
  color: #fff;
  font-size: 16px;
  background: #576b8e;
}

footer a {
  transition: border-color 0.15s ease-out, color 0.15s ease-out;
}

.row {
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding: 10px;
  background: #576b8e;
  padding: 6em 7em 2em 7em;
  margin-top: -1px;
}

@media all and (max-device-width: 808px), all and (max-width: 808px) {
  .row {
    flex-direction: column;
  }

  .bottom-links {
    flex-direction: row;
  }
}

.col-2 {
  display: flex;
  flex-direction: column;
}

.heading {
  padding: 1em 0;
  font-weight: 700;
  color: #fff;
  font-size: 18px !important;
}

#contactblock {
  padding: 1em 4em 2em 0;
  align-content: left;
  text-align: left;
  line-height: 1.5;
}

.footerlogo > img {
  width: 360px !important;
  padding-bottom: 4em;
}

@media all and (max-device-width: 808px), all and (max-width: 808px) {
  .footerlogo {
    display: flex;
    justify-content: center;
    padding-left: 4em;
  }
}

#wrap-row {
  display: flex;
  flex-wrap: wrap;
}

.col-wrap {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  text-align: left;
  /* padding: 1em; */
}

.link-list,
.contacElements > ul {
  list-style-type: none;
  padding: 0.7em 0;
  font-weight: 500;
  width: 220px;
}

.link-list > li {
  padding: 5px 0 5px 0;
}

.link-list > li > a,
.link-style {
  color: #fff;
  text-decoration: underline;
  text-decoration-color: rgba(253, 253, 252, 0.15);
  text-underline-offset: 5px !important;
}

.link-list > li > a:hover,
.link-list > li > a:visited,
.link-style:hover,
.link-style:visited {
  color: rgba(253, 253, 252, 0.6);
  border-color: rgba(253, 253, 252, 0.15);
}

#contactlink {
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 5px !important;
  color: #fff;
  text-transform: uppercase;
  font-size: 18px;
  line-height: 1.5;
}

#contactlink > .link-style:hover {
  color: #fff;
}

.caps {
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 2px;
  font-size: 16px;
}

.col-wrap > .caps {
  padding-top: 1em;
}

.contacElements > ul > li {
  width: 105%;
}

.horizontal-rule {
  width: 90%;
  max-width: 780px;
  margin: 2em auto;
  border: none;
  height: 1px;
  background: #fff;
  margin-bottom: 2em;
}

.apy {
  padding: 2em 3em;
  font-style: italic;
  font-weight: 500;
  text-align: center;
  line-height: 1.5em;
}

.bottom-links {
  padding: 1em 3em 4em 3em;
  flex-wrap: wrap;
  line-height: 1.5em;
}

.bottom-links > a {
  padding: 0 0.35em;
}

.footer-icon {
  width: 9px;
  padding-bottom: 5px;
}

.nowrap {
  white-space: nowrap;
}

#lblLayoutFooterYear_Label {
  padding-left: 5px;
}

/* 13. Business App  */

/* 13.0 General  */

/* Journeybar updates for Business App */

.journey-bar .journey-bar-group:has(> img[alt="Start-oba"]):before {
  content: "1.";
}

.journey-bar .journey-bar-group:has(> img[alt="Products-oba"]):before {
  content: "2.";
}

.journey-bar .journey-bar-group:has(> img[alt="Details-oba"]):before {
  content: "3.";
}

.journey-bar .journey-bar-group:has(> img[alt="Verification-oba"]):before {
  content: "4.";
}

.journey-bar .journey-bar-group:has(> img[alt="Funding-oba"]):before {
  content: "5.";
}

.journey-bar .journey-bar-group:has(> img[alt="Start-oba"]):after {
  content: "Tell us a little about your organization.";
}

.journey-bar .journey-bar-group:has(> img[alt="Products-oba"]):after {
  content: "Select or review your choices.";
}

.journey-bar .journey-bar-group:has(> img[alt="Details-oba"]):after {
  content: "Provide a little more information about your organization and the individuals on the account.";
}

.journey-bar .journey-bar-group:has(> img[alt="Verification-oba"]):after {
  content: "Let's make sure we've dotted our i's and crossed our t's.";
}

.journey-bar .journey-bar-group:has(> img[alt="Funding-oba"]):after {
  content: "Select the funding option that works best for your organzation.";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Start-oba"]):before {
  content: "1";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Products-oba"]):before {
  content: "2";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Details-oba"]):before {
  content: "3";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Verification-oba"]):before {
  content: "4";
}

.journey-bar-current
  .journey-bar-group.current-group:has(> img[alt="Funding-oba"]):before {
  content: "5";
}

/* 13.1.ExpectedActivity  */
.rbGroupQuest {
  padding-bottom: 1em;
}

.rbGroupTwoAnswers {
  display: flex;
  flex-direction: row;
}

.rbGroupTwoAnswers > span:nth-child(1) {
  padding-right: 1em;
}

.cbButtonGroup > span {
  padding: 0.3em 0;
}

@media all and (max-device-width: 540px), all and (max-width: 540px) {
  .rbGroupAnswer.flex-row {
    max-width: 81%;
  }
}

/* 13.2.AuthorizedSigners  */
#pnlPowersGranted .cbButtonGroup {
  display: flex;
  flex-direction: column;
  gap: 10px !important;
  flex-wrap: wrap;
}

#pnlPowersGranted .cbButtonGroup > span > label {
  white-space: normal;
  word-wrap: break-word !important;
  overflow: hidden;
  max-width: 100%;
  height: 100%;
}

.page-AuthorizedSigners #btnAdd,
.page-AddBeneficialOwners #btnAdd {
  margin-right: 1em;
}

/*13.3 BeneficalOwnership  */

.page-BeneficialOwnership .section-container .flex-row > span {
  width: 100%;
}

#BeneficialOwnership_tableHeader td {
  background: var(--color-accent-blue);
  border: 1px solid var(--border-color);
  font-weight: 600;
}

#BeneficialOwnership_table {
  border: 1px solid var(--border-color);
}

#BeneficialOwnership {
  text-align: center;
}

/* iCheck */
.page-BeneficialOwnership .iradio_square-blue {
  position: relative;
  margin-bottom: 0;
  cursor: pointer;
  background: var(--color-accent-blue);
}

.page-BeneficialOwnership .iradio_square-blue:after {
  content: "";
  position: absolute;
  background-color: var(--color-black-light);
  cursor: pointer;
  left: 0;
  width: var(--column-spacer);
  height: var(--column-spacer);
  border-radius: 50%;
  border: 0.5px solid var(--border-color);
  transition-duration: 500ms;
}

/* Toggled on */
.page-BeneficialOwnership .iradio_square-blue.checked:after {
  background-color: var(--color-primary-dark);
  border-color: var(--color-primary-light);
  left: 26px;
}

.page-BeneficialOwnership .iradio_square-blue.checked.disabled:after {
  cursor: not-allowed;
}

.page-BeneficialOwnership .iradio_square-blue.checked.disabled:before {
  display: flex;
  align-items: center;
  padding-left: calc(var(--column-spacer) / 2);
  background-color: var(--color-primary-light);
  color: var(--color-primary-dark);
  content: "\f023";
  font-family: FontAwesome;
  font-size: 14px;
  cursor: not-allowed;
}

/* Style the container to resemble a toggle */
.page-BeneficialOwnership .iradio_square-blue {
  display: inline-block;
  position: relative;
  width: 50px; /* Width of the toggle */
  height: 24px; /* Height of the toggle */
  border-radius: 24px;
  transition: background-color 0.3s ease;
  cursor: pointer;
}

/* 13.4 ApplicationSummary */

.SumGroup .button-other {
  margin: 1em;
}

.SelectedProdGroup {
  padding-top: 1em;
}

.SelectedProdGroup h3 {
  color: black;
  padding-bottom: 1em;
}

.SelectedProdGroup h3::after {
  content: ":";
}

@media all and (max-device-width: 809px), all and (max-width: 809px) {
  .page-ApplicationSummary .flex-row {
    justify-content: space-between;
    margin: 0 1em;
  }
}