/*
    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
		7.9 Popover
	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_IDAuthenticationQuestions
		8.16 fiVISION_ProductFundingV2
		8.17 fiVISION_ACH
		8.18 fiVISION_CreditCardV2
		8.19 fiVISION_ApplicantWithdraw
		8.20 fiVISION_ProgressBar
		8.21 fiVISON_IndividualHandler
		8.22 Status Center Login
		8.23 Status Center Summary
		8.24 v3TextBox
		8.25 fiVISION_FinicityFundingAccountVerification
		8.26 fiVISION_OneTimePasscode
		8.27 fiVISION_WorkflowSurvey
	9. Page Specific
		9.1 Default Page
		9.2 Status Center - Default
		9.3 Status Center - Status Center
		9.4 Funding Method
		9.5 eSign Agreement
	10. ControlID Specific
	11. Admin Console

    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: #fff;
	--color-white-dark: #e5e7eb;
	--color-gray-light: #8d93b2;
	--color-gray-normal: #f0efea;
	--color-gray-dark: #474747;
	--color-black-light: #0b0731;
	--color-black-normal: #000;
	--color-black-dark: #000;
	/*client colors*/
	--color-primary-light: #bcafa0;
	--color-primary-normal: #864e60;
	--color-primary-dark: #864e60;
	--color-secondary-light: #0d0734;
	--color-secondary-normal: #0d0734;
	--color-secondary-dark: #0d0734;
	--color-tertiary-light: #d4dffd;
	--color-tertiary-normal: #d4dffd;
	--color-tertiary-dark: #d4dffd;
	--color-quaternary-light: #0d0734;
	--color-quaternary-normal: #0d0734;
	--color-quaternary-dark: #0d0734;
	/*font family*/
	--font-family-pri: "Barlow", sans-serif;
	--font-family-alt: "Lato", sans-serif;
	/*fonts*/
	/*default font*/
	--font-size: 14px;
	--font-lineheight: 20px;
	--font-color: var(--color-black-light);
	--font-weight: 500;
	--font-family: var(--font-family-pri);
	/*input font*/
	--font-size-input: 20px;
	--font-lineheight-input: 22px;
	--font-color-input: var(--font-color);
	--font-weight-input: var(--font-weight);
	--font-family-input: var(--font-family);
	/*label font*/
	--font-size-label: 20px;
	--font-lineheight-label: var(--font-lineheight);
	--font-color-label: var(--font-color);
	--font-weight-label: 300;
	--font-family-label: var(--font-family-alt);
	/*h1 font*/
	--font-size-h1: 32px;
	--font-lineheight-h1: 42px;
	--font-color-h1: var(--color-black-light);
	--font-weight-h1: 600;
	--font-family-h1: var(--font-family-prim);
	/*h2 font*/
	--font-size-h2: 24px;
	--font-lineheight-h2: 26px;
	--font-color-h2: var(--font-color-h1);
	--font-weight-h2: 600;
	--font-family-h2: var(--font-family-input);
	/*h3 font*/
	--font-size-h3: 18px;
	--font-lineheight-h3: 22px;
	--font-color-h3: var(--color-secondary-dark);
	--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-h1);
	--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-75: calc(var(--gap-horizontal) * 0.75);
	--gap-horizontal-150: calc(var(--gap-horizontal) * 1.5);
	--gap-horizontal-200: calc(var(--gap-horizontal) * 2);
	/*input and label structure*/
	--fiviInput-width: var(--column-width-6);
	--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-3);
	--fiviInput-width-partial-alt: var(--column-width-3);
	--input-height: 60px;
	--input-focusLabel-fontSize: 12px;
	--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-150);
	--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+96px+2px = 1106px
            -12 columns -> 8 columns 
            -fiviInput-width goes to 4 columns
            -should accomidate 2 inputs per row
        */
	:root {
		--font-size-input: 18px;
		--font-size-label: 18px;
		--font-lineheight-label: var(--font-lineheight);
		--column-width-11: 100%;
		--column-width-12: 100%;
		--column-width-10: 100%;
		--fiviInput-width: var(--column-width-4);
		--fiviInput-width-partial-main: var(--column-width-2);
		--fiviInput-width-partial-alt: var(--column-width-2);
		--fiviInput-width-half: var(--column-width-2);
	}
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
	/*
            @786px+48px+2px = 836px
            -9 columns -> 6 columns 
            -fiviInput-width goes to 3 columns
            -should accomidate 2 inputs per row
        */
	:root {
		--font-size: 14px;
		--font-size-h1: 30px;
		--font-lineheight-h1: 32px;
		--font-size-h2: 22px;
		--font-lineheight-h2: 24px;
		--font-size-h3: 18px;
		--font-lineheight-h3: 20px;
		--column-width-8: 100%;
		--column-width-9: 100%;
		--fiviInput-width: var(--column-width-6);
		--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 -> 4 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-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: 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-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: center;
}

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);
}

a:visited {
	color: var(--color-primary-normal);
}

a:hover {
	text-decoration: underline;
	color: var(--color-primary-dark);
}

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;
}

.flex-row.flex-align-horizontal-center {
	justify-content: center;
}

.flex-column.flex-align-horizontal-center {
	align-items: center;
}

.flex-row.flex-space-between {
	justify-content: space-between;
}

.flex-column.flex-space-between {
	align-items: space-between;
}

/*
        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) !important;
}

.flex-gap-50 {
	gap: var(--gap-vertical-50) var(--gap-horizontal) !important;
}

.flex-gap-75 {
	gap: var(--gap-vertical-75) var(--gap-horizontal) !important;
}

.flex-gap-100 {
	gap: var(--gap-vertical) var(--gap-horizontal) !important;
}

.flex-gap-150 {
	gap: var(--gap-vertical-150) var(--gap-horizontal) !important;
}

.flex-gap-200 {
	gap: var(--gap-vertical-200) var(--gap-horizontal) !important;
}

/*
        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
    */
.page-text {
	font-size: calc(var(--font-size) + 2px);
	line-height: var(--font-lineheight);
	font-weight: 400;
	color: var(--font-color);
	width: 100%;
}

.page-text-small {
	font-size: calc(var(--font-size) - 2px);
	line-height: var(--font-lineheight);
	font-weight: var(--font-weight);
	color: var(--font-color);
	width: 100%;
}

.page-text-large {
	/*
        font-size: calc(var(--font-size) + 2px);
        line-height: calc(var(--font-lineheight) + 3px);
        width: 100%;
        */
	font-size: calc(var(--font-size) + 2px);
	line-height: var(--font-lineheight);
	font-weight: var(--font-weight);
	color: var(--font-color);
	width: 100%;
}

.no-wrap {
	white-space: nowrap;
	text-wrap: nowrap;
	width: fit-content;
}

.spacer-vertical {
	/*
            no height is required here, gap should handle it,
            will double the space between the previous and next elements
        */
	width: 100%;
}

.fiviHide {
	display: none !important;
}

/*
        3. Page Structure
    */
/*
        3.1 Page Structure
    */
.layout {
	background-color: var(--color-gray-normal);
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: 100vh;
}

header,
main {
	width: 100%;
	display: flex;
	margin: 0;
	padding: var(--gap-vertical) var(--gap-horizontal);
	text-align: left;
}

header {
	box-shadow: none;
	background-color: var(--color-white-dark);
}

main {
	flex-grow: 1;
	margin-bottom: auto;
	align-items: flex-start;
	height: 100%;
	flex-direction: column;
	padding: 0;
}

footer {
	background-color: #576b8e;
}

header > .layout-container,
main > .layout-container {
	max-width: var(--column-width-12);
	width: 100%;
	margin: 0 auto;
	min-height: 62px;
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
	.layout {
		gap: 0;
	}

	header,
	main {
		padding: var(--gap-vertical-50) var(--gap-horizontal-50);
	}

	header > .layout-container {
		min-height: 50px;
		flex-direction: column;
		justify-content: center;
	}
}

/*
        3.2 Header Styling
    */
header {
	/* border-bottom: 2px solid var(--color-gray-dark); */
}

.header-logo {
	width: 300px;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
	header > .layout-container {
		flex-direction: column;
		justify-content: center;
		gap: var(--gap-horizontal-50);
	}
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
	.header-logo {
		width: 240px;
	}
}

/*
        3.3 Main Styling
    */
main > .layout-container {
	flex-grow: 1;
	height: 100%;
	padding: var(--gap-vertical-150) var(--column-spacer);
	max-width: calc(var(--column-width-12) + calc(var(--column-spacer) * 2));
	background-color: var(--color-white-normal);
	outline: 1px solid var(--color-gray-dark);
}

main > .layout-container > span {
	/*
            this is span that start the fivision_PageContent
        */
	display: flex;
	width: 100%;
	height: 100%;
	flex-direction: column;
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
	main > .layout-container {
		padding: var(--gap-vertical-150) calc(var(--column-spacer) / 2);
		max-width: calc(var(--column-width-8) + var(--column-spacer));
	}
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
	main > .layout-container {
		max-width: calc(var(--column-width-6) + var(--column-spacer));
	}
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
	main > .layout-container {
		max-width: calc(var(--column-width-5) + var(--column-spacer));
	}
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
}

/*
        3.4 Footer Styling
    */
/*
        4. Page General Containers
    */
.page-container,
#IndividualHandler01 {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: var(--gap-vertical-150);
	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%;
	text-align: center;
}

.section-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: var(--gap-vertical-150);
	max-width: var(--column-width-12);
	width: 100%;
}

.section-header {
	display: flex;
	align-items: center;
	gap: var(--gap-vertical-50);
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 1px;
	text-wrap: nowrap;
	white-space: nowrap;
}

.section-header:after {
	content: "";
	display: inline;
	width: 100%;
	height: 1px;
	background-color: var(--color-gray-dark);
}

.page-navigation-container {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start;
	justify-content: space-between;
	width: var(--column-width-12);
	margin-top: var(--gap-vertical-200);
}

.page-navigation-container .button-link {
	text-transform: none;
}

.navigation-forward-container {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: var(--gap-horizontal);
}

.navigation-other-container {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-50);
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
	.page-navigation-container {
		flex-direction: column;
		align-items: center;
		gap: var(--gap-vertical);
	}

	.navigation-forward-container {
		flex-direction: column-reverse;
	}

	.navigation-other-container {
		align-items: center;
		gap: var(--gap-vertical);
	}

	.navigation-other-container .button-link {
		text-align: center;
	}
}

/*
        5. Buttons
    */
.button-primary,
.fiviDocumentList #email-submit-btn,
.V3StatusCenterLogin .DefaultNextButton,
.DefaultNextButton {
	display: inline-flex !important;
	justify-content: center;
	align-items: center;
	min-width: var(--column-width-2);
	width: fit-content !important;
	height: var(--gap-vertical-200);
	margin: 0;
	padding: 0 10px;
	color: white;
	font-size: 18px;
	line-height: 18px;
	font-weight: 600;
	background-color: var(--color-primary-normal);
	/* border: 2px solid var(--color-primary-normal); */
	border-radius: 10px;
	/* box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; */
	text-transform: uppercase;
	text-decoration: none;
	font-family: var(--font-family-pri);
	text-shadow: none;
	box-shadow: none;
	border: none;
}

.btn-primary:active,
.btn-primary.active {
	border: none;
}

.button-primary:visited {
	color: white;
}

.button-primary:hover:not(:disabled),
.button-primary:active:not(:disabled),
.button-primary:focus:not(:disabled),
.fiviDocumentList #email-submit-btn:hover:not(:disabled),
.fiviDocumentList #email-submit-btn:active:not(:disabled),
.fiviDocumentList #email-submit-btn:focus:not(:disabled),
.V3StatusCenterLogin .DefaultNextButton:hover:not(:disabled),
.V3StatusCenterLogin .DefaultNextButton:active:not(:disabled),
.V3StatusCenterLogin .DefaultNextButton:hover:not(:disabled),
.DefaultNextButton:hover:not(:disabled) {
	background-color: var(--color-primary-normal);
	color: #fff;
	text-decoration: none;
	transition: 0.1s opacity linear;
	opacity: 0.8;
}

.button-primary:disabled,
.fiviDocumentList #email-submit-btn:disabled {
	opacity: 0.5;
}

.button-other,
.MinorButton,
.fiviAddAnotherButton > a,
.fiviDocumentList .modal-footer > button,
.V3SummaryButtons.active,
.V3SummaryControl .fiviDocumentList .fiviFileUpload + .btn-default,
.V3SummaryControl .btn-primary,
.fiviDocumentList .btn-default,
.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] label {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	max-width: var(--fiviInput-width);
	min-width: var(--column-width-2);
	width: fit-content !important;
	height: var(--gap-vertical-150);
	line-height: calc(var(--gap-vertical-150) - 4px);
	margin: 0;
	padding: 0 10px;
	color: #fff;
	font-size: 14px;
	/* font-weight: 600; */
	background-color: var(--color-gray-dark);
	/* border: 2px solid var(--color-secondary-normal); */
	border-radius: 10px;
	box-shadow: none;
	text-transform: uppercase;
	text-decoration: none;
	text-align: center;
}

.btn-primary {
	border: none;
}

.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),
.fiviDocumentList .modal-footer > button:hover:not(:disabled),
.fiviDocumentList .modal-footer > button:active:not(:disabled),
.fiviDocumentList .modal-footer > button:focus:not(:disabled),
.V3SummaryButtons.active:hover:not(:disabled),
.V3SummaryButtons.active:active:not(:disabled),
.V3SummaryButtons.active:focus:not(:disabled),
.V3SummaryControl .fiviDocumentList .fiviFileUpload + .btn-default:hover:not(:disabled),
.V3SummaryControl .fiviDocumentList .fiviFileUpload + .btn-default:active:not(:disabled),
.V3SummaryControl .fiviDocumentList .fiviFileUpload + .btn-default:focus:not(:disabled),
.V3SummaryControl .btn-primary:hover:not(:disabled),
.V3SummaryControl .btn-primary:active:not(:disabled),
.V3SummaryControl .btn-primary:focus:not(:disabled),
.fiviDocumentList .btn-default:hover:not(:disabled),
.fiviDocumentList .btn-default:active:not(:disabled),
.fiviDocumentList .btn-default:hover:not(:disabled),
.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] label:hover:not(:disabled),
.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] label:active:not(:disabled),
.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] label:focus:not(:disabled) {
	/* font-weight: 600; */
	box-shadow: none;
	text-decoration: none;
	opacity: 0.8;
	background: var(--color-gray-dark);
	border-color: var(--color-gray-dark);
}

.button-other:disabled,
.MinorButton:disabled,
.fiviAddAnotherButton > a:disabled,
.fiviDocumentList .modal-footer > button:disabled,
.V3SummaryButtons.active:disabled,
.V3SummaryControl .fiviDocumentList .fiviFileUpload + .btn-default:disabled,
.V3SummaryControl .btn-primary:disabled,
.fiviDocumentList .btn-default:disabled {
	opacity: 0.5;
}

.button-link,
.button-link-alt,
.V3StatusCenterLogin .btn-link,
.V3SummaryControl .btn-link,
.V3SummaryControl .LinkClass {
	/* min-width: var(--column-width-2); */
	text-align: left;
	background-color: transparent;
	border: none;
	font-size: 16px;
	line-height: 18px;
	font-weight: 600;
	color: var(--color-primary-normal);
	text-transform: uppercase;
	width: fit-content !important;
	padding: 0;
}

.btn-link,
.LinkClass {
	text-transform: capitalize !important;
	text-decoration: underline;
	text-underline-offset: 2px !important;
}

.btn-link:hover,
.LinkClass:hover {
	opacity: 0.8;
}

.button-link-alt {
	text-transform: uppercase;
	font-weight: 600;
}

.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),
.V3StatusCenterLogin .btn-link:hover:not(:disabled),
.V3StatusCenterLogin .btn-link:active:not(:disabled),
.V3StatusCenterLogin .btn-link:focus:not(:disabled),
.V3SummaryControl .btn-link:hover:not(:disabled),
.V3SummaryControl .btn-link:active:not(:disabled),
.V3SummaryControl .btn-link:focus:not(:disabled),
.V3SummaryControl .LinkClass:hover:not(:disabled),
.V3SummaryControl .LinkClass:active:not(:disabled),
.V3SummaryControl .LinkClass:focus:not(:disabled) {
	text-decoration: underline;
	font-weight: 600;
	color: var(--color-primary-dark);
}

.button-other:disabled,
.button-other-alt:disabled,
.V3StatusCenterLogin .btn-link:disabled,
.V3SummaryControl .btn-link:disabled,
.V3SummaryControl .LinkClass:disabled {
	opacity: 0.5;
}

.fiviRemoveBtn {
	position: absolute;
	color: var(--color-primary-dark);
	cursor: pointer;
	left: var(--fiviInput-width);
}

.fiviRemoveBtn:hover:not(:disabled),
.fiviRemoveBtn:active:not(:disabled),
.fiviRemoveBtn.focus:not(:disabled) {
	color: var(--color-primary-dark);
}

/*
        5.1 Button Containers
    */
.add-another-individual-container {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

@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
    */
#accordion {
	display: flex;
	flex-direction: column;
	max-width: var(--column-width-12);
	width: 100%;
	gap: var(--gap-vertical);
}

#accordion > .panel {
	outline: none;
	padding: 0 0 0 0;
	border: none;
	border-radius: 2px;
	background-color: transparent;
	box-shadow: none;
	margin: 0;
}

#accordion > .panel:has(> .panel-heading.collapsed) {
	outline: 2px solid var(--color-gray-dark);
	box-shadow: none;
}

#accordion > .panel > .panel-heading {
	display: flex;
	align-items: center;
	height: var(--input-height);
	padding: 0 var(--column-spacer) 0 0;
	background: white;
	border: none;
	border-radius: 5px;
}

#accordion > .panel > .panel-heading > .panel-title {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-direction: column;
	flex-wrap: wrap;
	position: relative;
	text-transform: none;
}

#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-75);
	border: none;
	border-radius: 5px;
	padding: 0 0 var(--column-spacer) 0;
}

.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 0.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 0.5s ease-in-out;
}

/*
        this is the accordion opening
    */
#accordion > .panel > .panel-heading:has(+ .collapsing) {
	padding-left: 0;
	background: transparent;
	outline: none;
	transition: padding-left 0.5s ease-in-out;
}

#accordion > .panel > .panel-heading:has(+ .collapsing) > .panel-title {
	font-size: var(--font-size-h3);
	line-height: var(--font-size-h3);
	outline: none;
	transition: font-size 0.5s ease-in-out;
}

/*
        this is with the accordion closed
    */
#accordion > .panel > .panel-heading.collapsed:has(+ .collapse:not(.in)) {
	padding-left: var(--column-spacer);
	transition: padding-left 0.5s ease-in-out;
}

#accordion > .panel > .panel-heading.collapsed:has(+ .collapse:not(.in)) > .panel-title {
	font-size: var(--font-size-h3);
	line-height: var(--font-size-h3);
	transition: font-size 0.5s ease-in-out;
}

/*
        this is with the accordion closing
    */
#accordion > .panel > .panel-heading.collapsed:has(+ .collapsing) {
	padding-left: var(--column-spacer);
	outline: none;
	transition: padding-left 0.5s ease-in-out;
}

#accordion > .panel > .panel-heading.collapsed:has(+ .collapsing) > .panel-title {
	font-size: var(--font-size-h3);
	line-height: var(--font-size-h3);
	outline: none;
	transition: font-size 0.5s ease-in-out;
}

/*
        7. Inputs and Labels
    */
/*
        7.1 Labels
    */
label {
	font-weight: var(--font-weight-label);
}

.DefaultLabelClass,
.DefaultLabelClassV3 {
	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: bottom 0.25s ease-in-out, left 0.25s ease-in-out, font-size 0.25s ease-in-out, font-weight 0.25s ease-in-out;
	pointer-events: none;
}

.FocusLabelClass {
	height: var(--input-focusLabel-fontSize);
	font-size: var(--input-focusLabel-fontSize);
	bottom: var(--input-focusLabel-offset);
	left: 0;
	font-weight: 600;
	text-transform: uppercase;
}

/* v3 specific */
.fiviLabelContainer {
	display: flex;
}

.fiviControl > .fiviLabelContainer {
	position: absolute;
	height: 100%;
	width: 100%;
	pointer-events: none;
}

.DefaultLabelClassV3,
.fiviStaticLabel {
	display: flex;
	align-items: center;
	height: var(--input-height);
	margin: 0 !important;
	position: absolute !important;
	left: var(--gap-horizontal-50) !important;
	top: unset !important;
	bottom: 0;
	font-size: var(--font-size-label) !important;
	font-weight: var(--font-weight-label);
	line-height: var(--font-size-label) !important;
	color: var(--font-color-label);
	font-family: var(--font-family-label);
	transition: bottom 0.25s ease-in-out, left 0.25s ease-in-out, font-size 0.25s ease-in-out, font-weight 0.25s ease-in-out !important;
}

.DefaultLabelClassV3.FocusLabelClass,
.fiviStaticLabel {
	height: var(--input-focusLabel-fontSize);
	bottom: var(--input-focusLabel-offset) !important;
	font-size: var(--input-focusLabel-fontSize) !important;
	left: 0 !important;
	font-weight: 600;
	color: var(--font-color-label) !important;
	text-transform: uppercase;
}

/*
        7.2 Inputs
    */
.fiviInput,
.fiviSCDropDown {
	display: inline-flex;
	width: 100vw;
	/*oh my vw actually worked*/
	max-width: var(--fiviInput-width);
	position: relative;
	/* flex-grow: 1; */
}

.form-control {
	display: flex;
	align-items: center;
	width: 100% !important;
	height: var(--input-height);
	padding: 0 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: 2px solid var(--color-gray-dark) !important;
	border-radius: 2px;
}

.form-control:focus {
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px color-mix(in srgb, var(--color-gray-dark) 60%, transparent);
}

.fiviTransparent {
	color: transparent;
}

/* v3 specific */
.DefaultFormControlClassV3 {
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0px;
}

.fiviNewLine {
	display: none !important;
}

/*
        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-vertical-25) var(--gap-horizontal);
	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);
	left: 0;
	font-weight: 600;
	text-transform: uppercase;
}

/*
        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%;
	}
}

/*
        v3 specific containers
    */
.fiviParentControl {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: var(--gap-vertical);
	max-width: var(--column-width-12);
	width: 100%;
	margin: 0;
}

.fiviControl {
	display: inline-flex;
	padding: 0 !important;
	width: 100% !important;
	margin-bottom: calc(calc(var(--font-size) - 4px) + var(--gap-vertical-25)) !important;
}

/*
        7.4 Fivi Checkbox/Radio Buttons
    */
.fiviCheckBox,
.fiviCheckBox > span {
	display: flex;
	align-items: center;
	gap: var(--gap-horizontal-50);
	max-width: fit-content;
}

.fiviCheckBox > label,
.fiviCheckBox > span > label {
	text-indent: -3px;
	font-weight: 500;
	font-size: calc(var(--font-size-label) - 2px);
	line-height: var(--font-lineheight-input);
}

/*
        v3 checkbox
    */
.fiviCheckBox:has(> input[type="checkbox"]) {
	margin: 0 !important;
}

.fiviCheckBox > input[type="checkbox"] {
	width: fit-content;
	margin: 0;
}

/*
        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;
}

.tooltip-arrow {
	display: none;
}

.tooltip-inner {
	width: max-content;
	max-width: 300px !important;
	text-align: left;
}

.fa-question-circle {
	padding-left: 0.25em;
}

/*
        7.7 Seperators
    */
.fiviMultiSeperator {
	width: 100%;
	height: 2px;
	margin: 14px 0;
}

.fiviMultiSeperator::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	background-color: var(--color-gray-dark);
}

.divider {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 1px;
}

.divider::before {
	content: "";
	display: block;
	width: var(--column-width-3);
	height: 1px;
	background-color: var(--color-gray-dark);
}

/*
        7.8 Loader
    */
.section-container > .loader {
	position: relative;
	left: unset;
	right: unset;
	top: unset;
	margin: 0 auto;
}

/*
        7.9 Popover
            v2: .popover
            v3: .fivisionpopover
    */
.popover > .arrow,
.fivisionpopover > .arrow {
	display: none;
}

.fivisionpopover .popover-content {
	font-size: calc(var(--font-size) - 4px);
	font-weight: 500;
	color: red;
	padding: 0;
}

.fivisionpopover {
	position: absolute !important;
	top: calc(var(--input-height) + var(--input-marginTop-forLabelFocusSpace)) !important;
	box-shadow: none;
	border: none;
	background-color: transparent;
	margin-top: var(--gap-vertical-25) !important;
}

/*
        8. fiVISION Controls
    */
/*
        8.1 fiVISION_ErrorSummary
            v2: #ErrorSummary
            v3: .fiviErrorSummary
    */
#ErrorSummary1,
.fiviErrorSummary {
	display: none;
}

#ErrorSummary1:has(li) {
	display: block;
	max-width: var(--column-width-6);
	width: 100%;
	margin: 0 auto;
}

.fiviErrorSummary:has(div) {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-25);
}

#ErrorSummary1 ul {
	padding-left: 0;
}

#ErrorSummary1 li,
.fiviErrorSummary > div {
	font-size: var(--font-size);
	line-height: var(--font-lineheight);
	font-weight: 500;
	color: red;
	margin-bottom: 0;
	list-style: none;
	text-align: center;
}

/*
        8.2 fiVISION_Panel
    */
.fiviPanel {
	display: inline-flex;
	flex-direction: unset;
	flex-wrap: unset;
	width: unset;
	justify-content: unset;
}

.fiviPanel,
.fiviPanel > .fiviPanelContainer {
	max-width: 100%;
	/* width: 100%; */
}

.page-container > .fiviPanel,
.section-container > .fiviPanel,
.header-container > .fiviPanel {
	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 .DefaultTooltipClass {
	top: 0;
	right: 0;
}

.fiviProdContainer {
	max-width: var(--column-width-4);
	width: 100%;
	min-height: 100px;
	padding: var(--gap-horizontal-75);
	position: relative;
	background: white;
	border: 2px solid var(--color-gray-dark);
	border-radius: 3px;
	box-shadow: none;
}

.fiviProdContainer:has(input[id*="_ProductCheckbox_"]:checked),
.fiviProdContainer:has(input[id*="_GeneralService"]:checked) {
	background-color: var(--color-gray-normal);
}

.fiviProdServ {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical) var(--gap-horizontal-50);
	height: 100%;
}

.fiviProdServ > .fiviCheckBox,
.fiviProdServ > .fiviCheckBox > span {
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	max-width: 100%;
	width: 100%;
}

.fiviProdServ > .fiviCheckBox > div:first-child,
.fiviProdServ > .fiviCheckBox > span > div:first-child {
	order: 3;
}

.fiviProdServ > .fiviCheckBox > .DefaultTooltipClass,
.fiviProdServ > .fiviCheckBox > span > .DefaultTooltipClass {
	position: relative;
	order: 2;
}

.fiviProdServ > .fiviCheckBox > label,
.fiviProdServ > .fiviCheckBox > span > label {
	font-size: var(--font-size-label);
	font-weight: 600;
	margin-left: -3px;
	width: fit-content;
	text-wrap: nowrap;
	white-space: nowrap;
	order: 1;
}

.fiviProdServ .fiviAddAnotherButton {
	display: none;
	width: fit-content;
	align-self: center;
	justify-content: flex-end;
}

.fiviProdContainer:has(input[id*="_ProductCheckbox_"]:checked) .fiviAddAnotherButton {
	display: flex;
}

.fiviProdServ .fiviAddAnotherButton > a {
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: auto;
}

.fiviProdPanel {
	max-width: 100%;
	display: flex;
	flex-direction: column;
}

.fiviProdPanel:has(*):before {
	content: "";
	display: block;
	height: 2px;
	width: calc(100% + var(--gap-horizontal-150));
	margin-left: calc(var(--gap-horizontal-75) * -1);
	background-color: var(--color-gray-dark);
}

.fiviProdPanel > .fiviInput {
	max-width: 100%;
}

.fiviProdPanel > .fiviProdInnerPanel:first-of-type,
.fiviProdPanel > .fiviInput {
	margin-top: var(--gap-vertical);
}

.fiviProdPanel > .fiviProdInnerPanel:not(:first-of-type) {
	margin-top: var(--gap-vertical);
}

.fiviProdInnerPanel {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-50) 0;
	flex-wrap: wrap;
	width: 100%;
	padding: 0;
	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%;
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
	.fiviProdContainer {
		max-width: 100%;
	}
}

/*
        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(--gap-vertical-50);
	width: 100%;
}

.fiviAddress > .fiviSameAs {
	max-width: calc(calc(var(--fiviInput-width) / 2) - var(--column-spacer));
	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) - 4px);
	line-height: var(--font-lineheight);
}

.fiviAddress > .DefaultAddressVerifyingClass {
	font-size: calc(var(--font-size) - 2px);
	line-height: var(--font-lineheight);
	font-weight: 500;
	text-align: center;
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
	.address-container {
		max-width: 100%;
	}

	.address-container > h3 {
		max-width: 100%;
	}

	.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-horizontal-25) var(--gap-vertical);
	flex-wrap: wrap;
}

.fiviLongInput.fiviPhoneControl {
	max-width: 100%;
	width: 100%;
}

.fiviPhoneControl .CtlValidator {
	top: calc(var(--input-marginTop-forLabelFocusSpace) + 3px);
	bottom: unset;
}

.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);
	width: 100%;
}

.fiviPhoneControl > .fiviCheckBox {
	background: transparent;
	border: none !important;
	box-shadow: none;
	padding: 0;
}

.fiviPhoneControl:has(> div[id*="_pnlSMSOptInOut"]) {
	flex-wrap: wrap;
	gap: var(--gap-vertical-50);
}

.fiviTwoInput.fiviPhoneControl:has(> div[id*="_pnlSMSOptInOut"]) > .DefaultLabelClass,
.fiviLongInput.fiviPhoneControl:has(> div[id*="_pnlSMSOptInOut"]) > .DefaultLabelClass {
	top: 0;
}

.fiviPhoneControl:has(> div[id*="_pnlSMSOptInOut"]) > .DefaultLabelClass {
	top: var(--input-marginTop-forLabelFocusSpace);
	transition: top 0.25s ease-in-out, left 0.25s ease-in-out, font-size 0.25s ease-in-out, font-weight 0.25s ease-in-out;
}

.fiviPhoneControl:has(> div[id*="_pnlSMSOptInOut"]) > .DefaultLabelClass.FocusLabelClass {
	top: 0;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] {
	width: 100%;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] br {
	display: none;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_smsOptionsDiv"] {
	background-color: var(--color-gray-normal) !important;
	padding: var(--gap-horizontal) !important;
	display: flex !important;
	gap: var(--gap-vertical);
	flex-direction: column;
	min-width: unset !important;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_smsOptionsDiv"] > span {
	display: block;
	width: 100%;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_messageIconDiv"] {
	display: none;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] {
	display: flex;
	gap: var(--gap-horizontal);
	width: 100%;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] div.form-element {
	width: calc(calc(100% - var(--gap-horizontal)) / 2);
	height: fit-content;
	padding: 0;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] div.form-element > span {
	width: 100%;
	height: 100%;
	display: block;
	padding: 0;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] label {
	min-width: unset;
	width: 100% !important;
}

.fiviPhoneControl > div[id*="_pnlSMSOptInOut"] div[id*="_outerButtonDiv"] div.form-element > span > input:checked + label {
	border: 2px solid var(--color-primary-normal);
	background: var(--color-primary-normal);
}

@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));
}

.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);
}

.fiviEmpHistoryControl center {
	width: var(--fiviInput-width);
}

@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: 100%;
	width: 100%;
}

.fiviIncomeControl > .fiviMultiContainer {
	flex-direction: row;
	flex-wrap: wrap;
	max-width: 100%;
}

.fiviIncomeControl > .fiviMultiContainer > div {
	max-width: 100%;
	width: 100vw;
}

.fiviIncomeControl .fiviMultiSeperator {
	display: none;
}

.fiviIncomeControl .fiviMultiInput .fiviInput {
	max-width: var(--fiviInput-width-half);
}

.fiviIncomeControl > .fiviMultiContainer > div:has(span[id*="btnAddIncome"]) {
	display: flex;
	width: 100%;
	max-width: 100%;
}

.fiviIncomeControl > .fiviMultiContainer > div:has(span[id*="btnAddIncome"]) > span {
	width: var(--fiviInput-width);
}

.fiviIncomeControl .fiviRemoveBtn {
}

.fiviIncomeControl input[id*="ntbHoursPerWeek"]::placeholder {
	color: transparent;
}

@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);
	}

	.fiviIncomeControl .fiviRemoveBtn {
		left: var(--fiviInput-width);
	}
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
	.fiviIncomeControl > .fiviMultiContainer > div:has(span[id*="btnAddIncome"]) {
		width: var(--fiviInput-width);
	}

	.fiviIncomeControl .fiviRemoveBtn {
		top: var(--input-marginTop-forLabelFocusSpace);
		left: unset;
		right: var(--gap-horizontal-25);
	}
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
}

/*
        8.10 fiVISION_IndividualDetails
    */
.fiviIndividualDetails {
	width: 100%;
}

.fiviIndDetails {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-25);
}

.fiviIndDetails > div {
	margin-left: var(--gap-horizontal-25);
	font-weight: 400;
}

.fiviIndDetails > .fiviIndDetailsSection {
	margin-left: 0;
}

.fiviIndDetailsSection > b {
	font-weight: 600;
}

.fiviIndDetails > .fiviIndDetailsName {
	font-size: calc(var(--font-size) + 2px);
	font-weight: 600;
	margin-bottom: var(--gap-vertical-25);
	margin-left: 0;
}

.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);
}

.fiviProdServiceSelected > div > ul > i {
	margin-left: var(--gap-horizontal-25);
}

.fiviProdServiceSelected > div > ul > li {
	margin: var(--gap-vertical-25) 0 0 0;
	width: 100%;
	font-size: calc(var(--font-size) + 2px);
}

.fiviProdServiceSelected > div > ul > li:first-of-type {
	margin-top: 0;
}

.fiviProdServiceSelected > div > ul > ul {
	margin: 0;
	width: 100%;
}

.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-gray-dark);
	border-radius: 5px;
	max-width: 100%;
	width: fit-content;
	box-shadow: none;
}

.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-gray-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;
	white-space: nowrap;
	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 {
	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 table:not(.V3StatusCenterTableClass) tbody > tr:first-of-type {
		display: none;
	}

	.fiviDocumentList table.V3StatusCenterTableClass thead {
		display: none;
	}

	.fiviDocumentList table > tbody > tr {
		flex-direction: column;
		padding: calc(var(--column-spacer) / 2);
		gap: var(--gap-vertical-75);
	}

	.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%;
		gap: var(--gap-vertical-25);
	}

	.fiviDocumentList table > tbody > tr > td::before {
		font-size: var(--font-size-h2);
		line-height: var(--font-lineheight-h4);
		color: var(--font-color-h4);
		font-weight: 600;
		font-family: var(--font-family-h4);
		text-decoration: underline;
	}

	.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: " ";
	}

	.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;
	}
}

/*
        8.14 fiVISION_DisclosuresList
    */
.fiviDisclosureList {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-50);
	width: 100%;
	padding-left: var(--gap-horizontal-150);
}

.fivi-disclosure-modal > .fiviDisclosure-checkbox-container {
	display: flex;
	gap: var(--gap-horizontal-50);
	align-items: center;
}

.fivi-disclosure-modal > .fiviDisclosure-checkbox-container label {
	font-weight: 500;
	font-size: calc(var(--font-size) + 2px);
	width: fit-content;
}

.fivi-disclosure-modal > .fiviDisclosure-modal-button {
	margin-bottom: var(--gap-vertical-50);
}

.fivi-disclosure-modal > .fiviDisclosure-checkbox-container > i {
	padding: 0 !important;
}

.fivi-disclosure-modal .modal-body > div:last-of-type {
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
	padding: 0 var(--gap-horizontal);
}

.fivi-disclosure-modal .modal-header {
	font-size: var(--font-size-h3);
	line-height: var(--font-lineheight-h4);
	color: var(--font-color-h4);
	font-weight: var(--font-weight-h4);
	font-family: var(--font-family-h4);
}

/*
        8.15 fiVISION_IDAuthenticationQuestions
    */
.fiviIDAuth {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: var(--gap-vertical-75) var(--gap-horizontal-25);
	width: 100%;
}

.fiviIDAuth br {
	display: none;
}

.fiviIDAuth > span:has(label) {
	display: flex;
	gap: var(--gap-horizontal-25);
	max-width: 95%;
	width: fit-content;
	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;
}

.fiviIDAuth > span > label {
	font-weight: 500;
	font-size: var(--font-size-label);
}

.fiviIDAuth > span:has(b) {
	width: fit-content;
}

.fiviIDAuth > div:has(table) {
	width: 100%;
}

.fiviIDAuth tbody {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-25);
}

.fiviIDAuth tbody td {
	display: flex;
	align-items: center;
	gap: var(--gap-horizontal-25);
}

.fiviIDAuth tbody td > label {
	font-size: calc(var(--font-size-label) - 2px);
	font-weight: 400;
	line-height: var(--font-size-label);
	color: var(--font-color-label);
	font-family: var(--font-family-label);
}

/*
        8.16 fiVISION_ProductFundingV2
    */
.fiviProductFunding {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-75);
	max-width: var(--column-width-10);
	width: 100%;
	align-self: center;
}

.fiviProductFunding > .fiviProductFundingItem,
.fiviProductFunding > .fiviFundingAmount {
	margin: 0;
	padding: 0;
	width: 100%;
}

.fiviProductFunding > .fiviProductFundingItem > .fiviInput {
	max-width: 100%;
	align-items: center;
	justify-content: space-between;
	gap: var(--column-spacer);
}

.fiviProductFunding > .fiviProductFundingItem > .fiviInput > input,
.fiviProductFunding > .fiviProductFundingItem > .fiviInput > label {
	margin-top: 0;
	max-width: var(--column-width-3);
}

.fiviProductFunding > .fiviProductFundingItem > .fiviInput > label {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-50);
	font-size: var(--font-size-label);
	font-weight: 500;
}

.fiviProductFundingItem > .fiviInput > label:after {
	content: "funding required";
	color: red;
	font-size: calc(var(--font-size) - 2px);
	font-style: italic;
	padding-left: var(--gap-horizontal-50);
}

.fiviProductFundingItem > .fiviInput:has(> input[min="0"]) > label:after {
	content: "funding optional";
	color: var(--color-primary-normal);
}

.fiviProductFunding > .fiviProductFundingItem > .fiviInput > .CtlValidator {
	left: -5px;
}

.fiviProductFunding > .fiviFundingAmount {
	display: flex;
	justify-content: space-between;
	border-top: 1px solid var(--color-gray-dark);
	padding-top: var(--gap-vertical-50);
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
	.fiviProductFunding > .fiviProductFundingItem > .fiviInput {
		flex-direction: column;
		gap: var(--gap-vertical-50);
	}
}

/*
        8.17 fiVISION_ACH
    */
.fiviACHControl > span[id*="_Consent"] {
	max-width: 100%;
	width: 100%;
	order: 7;
}

.fiviACHControl > span[id*="_tbFirstName"] {
	order: 1;
}

.fiviACHControl > span[id*="_tbLastName"] {
	order: 2;
}

.fiviACHControl > span[id*="_tbRoutingNumber"] {
	order: 3;
}

.fiviACHControl > span[id*="_tbAccountNumber"] {
	order: 4;
}

.fiviACHControl > .fiviACHStatus {
	order: 5;
}

.fiviACHControl > .fiviACHcbCont {
	order: 6;
}

.fiviACHControl > .fiviACHStatus,
.fiviACHControl > .fiviACHcbCont {
	max-width: var(--fiviInput-width);
	width: 100%;
}

.fiviACHControl > .fiviACHStatus > span {
	font-size: calc(var(--font-size) - 2px);
	line-height: var(--font-lineheight);
	font-weight: 400 !important;
	font-style: italic;
}

.fiviACHControl > .fiviACHcbCont {
	display: flex;
	flex-direction: row;
	gap: var(--column-spacer);
}

.fiviACHControl > .CtlValidator {
	top: var(--input-marginTop-forLabelFocusSpace);
	bottom: unset;
	z-index: 5;
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
	.fiviACHControl > span[id*="_tbAccountNumber"] {
		order: 5;
	}

	.fiviACHControl > .fiviACHStatus {
		order: 4;
	}

	.fiviACHControl > .fiviACHcbCont {
		order: 6;
	}
}

/*
        8.18 fiVISION_CreditCardV2
    */
.fiviCreditCardControl > .fiviCCCardInfo > .DefaultAddressVerifyingClass {
	position: absolute;
	left: var(--fiviInput-width);
	transform: translateX(-100%);
	font-size: calc(var(--font-size) - 2px);
	width: 100%;
	text-align: right;
}

.fiviCreditCardControl > .fiviCCCardInfo > .fiviTwoInput {
	gap: var(--gap-vertical-25) 0;
}

.fiviCreditCardControl > .fiviCCCardInfo > .fiviTwoInput > label {
	position: relative;
	bottom: unset;
}

.fiviCreditCardControl > .fiviCCCardInfo > .fiviTwoInput > select,
.fiviCreditCardControl > .fiviCCCardInfo > .fiviTwoInput > .TwoControls {
	width: calc(100% / 3) !important;
	margin: 0;
}

.fiviCreditCardControl > .fiviCCCardInfo > .fiviTwoInput > .TwoControls > .DefaultTooltipClass {
	right: var(--gap-horizontal-25);
	height: var(--input-height);
	display: flex;
	align-items: center;
	justify-content: center;
}

.fiviCreditCardControl > .fiviCCCardInfo > .fiviTwoInput > select:nth-of-type(1) {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-right-color: transparent !important;
}

.fiviCreditCardControl > .fiviCCCardInfo > .fiviTwoInput > select:nth-of-type(2) {
	border-radius: 0;
}

.fiviCreditCardControl > .fiviCCCardInfo > .fiviTwoInput > .TwoControls > input {
	margin: 0;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	border-left-color: transparent !important;
}

/*
        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 {
	flex-grow: 1;
}

.journey-bar-icons {
	display: none;
}

.journey-bar {
	margin-bottom: 0;
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	width: 100%;
}

.journey-bar > tbody > tr {
	display: flex;
	gap: var(--gap-horizontal-50);
}

.journey-bar > tbody > tr > td {
	border-top: none;
	padding: 0;
}

.journey-bar-group {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	min-width: var(--column-width);
	gap: var(--gap-vertical-25);
}

.journey-bar-group > span {
	opacity: 20%;
}

.journey-bar-group > span {
	padding: 0 var(--gap-horizontal-25);
	font-size: calc(var(--font-size) - 2px);
	font-weight: 500;
}

.journey-bar-group:after {
	content: " ";
	width: 100%;
	height: 10px;
	border-radius: 5px;
}

.journey-bar-group.previous-group:after {
	background-color: color-mix(in srgb, var(--color-primary-normal) 50%, transparent);
}

.journey-bar-group.current-group:after {
	background-color: var(--color-primary-normal);
}

.journey-bar-group.current-group > span {
	opacity: 100%;
}

.journey-bar-group.future-group:after {
	background-color: color-mix(in srgb, var(--color-primary-normal) 10%, transparent);
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
	.journey-bar {
		justify-content: flex-start;
	}

	.journey-bar-group > span {
		display: none;
	}
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
	.progress-container {
		width: 100%;
		flex-grow: unset;
	}

	.journey-bar {
		justify-content: center;
	}

	.journey-bar > tbody {
		width: 100%;
	}

	.journey-bar > tbody > tr {
		width: 100%;
	}

	.journey-bar-group {
		min-width: calc(calc(100% / 5) - var(--gap-horizontal-50));
	}
}

/*
        8.21 fiVISON_IndividualHandler
    */
#IndividualHandler01 {
	width: 100%;
}

/*
        8.22 Status Center Login (v3)
    */
.V3StatusCenterLogin {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: var(--gap-vertical-150);
	max-width: var(--column-width-12);
	width: 100%;
	line-height: var(--font-lineheight);
}

.V3StatusCenterLogin div,
.V3StatusCenterLogin > div > span {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--gap-vertical);
}

.V3StatusCenterLogin > div span:has(> .btn-link) {
	display: block;
}

.V3StatusCenterLogin br {
	display: none;
}

.V3StatusCenterLogin > #pnlShowMFACode .fiviCheckBox {
	display: flex;
}

/*
        8.23 Status Center Summary (v3)
    */
.V3SummaryControl {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: var(--gap-vertical-150);
	max-width: var(--column-width-12);
	width: 100%;
	line-height: var(--font-lineheight);
}

.V3SummaryControl span:has(> button.btn-link) {
	/* we need to add some structure to spans that have buttons. */
	display: inline-flex;
	align-items: center;
}

.V3SummaryControl br {
	display: none;
}

.V3StatusCenterLogin > #pnlEnterPassword,
.V3StatusCenterLogin > #pnlShowCreatePass,
.V3StatusCenterLogin > #pnlShowMFACode,
.V3StatusCenterLogin > #pnlShowMFADropdown {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: var(--gap-vertical);
	max-width: var(--column-width-12);
	width: 100%;
	margin: 0;
}

@media all and (max-device-width: 769px), all and (max-width: 769px) {
	.V3SummaryControl {
		gap: var(--gap-vertical);
	}
}

/*
        8.23.1 SC Summary Header (v3)
    */
.V3SummaryControl > header {
	display: block;
	box-shadow: none;
	padding: 0;
	background-color: transparent;
	border-bottom: none;
}

.V3SummaryHeader {
	background-image: none;
	background-color: transparent;
	border: none;
	box-shadow: none;
}

.V3SummaryHeader:before,
.V3SummaryHeader:after {
	display: none;
}

/*
        8.23.1.1 SC Summary Header Mobile Badge
            Hiding this and handling mobile styling differently.  If you want to use it
            un-display-none the navbar-header and uncomment out the commented out bits.
    */
.V3SummaryHeader > #navbar-header {
	display: none !important;
}

/*
    
    .V3SummaryHeader > #navbar-header .V3SummaryCollapsedMenuButton {
        border: 2px solid var(--color-secondary-light);
        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;
        margin: 0 var(--gap-horizontal-50) 0 0;
    }
    
    .V3SummaryHeader > #navbar-header .V3SummaryCollapsedMenuButton > .icon-bar {
        background-color: var(--color-primary-dark);
    }
    
    .V3SummaryHeader > #navbar-header .V3SummaryBadge {
        right: var(--gap-vertical-25);
        left: unset;
        background-color: var(--color-secondary-dark);
        z-index: 2;
    }
    
    .V3SummaryHeader > #navbar-header #mobile-badge.V3SummaryBadge {
        top: calc(var(--gap-vertical-50) * -1);
    }
    
    */
/*
        8.23.1.2 SC Summary Header Icons/Navigation
            id of topNav
    */
.V3SummaryHeader > #topNav {
	display: block !important;
	width: 100%;
	padding: 0;
}

.V3SummaryHeader > #topNav > ul {
	display: flex;
	width: 100%;
	justify-content: center;
	gap: var(--gap-horizontal) var(--gap-vertical);
}

.navbar-nav {
	background: var(--color-white-normal);
}

.V3SummaryHeader > #topNav:before,
.V3SummaryHeader > #topNav:after,
.V3SummaryHeader > #topNav > ul:before,
.V3SummaryHeader > #topNav > ul:after {
	display: none;
}

.V3SummaryHeader > #topNav > ul > .nav-item {
	margin: 0;
	padding: var(--gap-vertical-75);
	min-width: 100px;
}

.V3SummaryHeader > #topNav > ul > .nav-item.active {
	border: 1px solid var(--color-secondary-light);
	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;
}

.V3SummaryHeader > #topNav > ul > .nav-item > a {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-25);
	padding: 0;
	margin: 0;
	font-size: calc(var(--font-size) + 2px);
	font-weight: 500;
	color: var(--color-primary-dark) !important;
	fill: var(--color-primary-dark) !important;
}

.V3SummaryHeader > #topNav > ul > .nav-item.active > a {
	background-image: none;
	background-color: transparent;
	box-shadow: none;
	color: var(--color-secondary-dark) !important;
	fill: var(--color-secondary-dark) !important;
}

.V3SummaryHeader > #topNav > ul > .nav-item .badge {
	right: var(--gap-vertical-25);
	left: unset;
	background-color: var(--color-secondary-dark);
	z-index: 2;
}

.V3SummaryHeader > #topNav > ul > #nav-apps.nav-item .badge {
	right: var(--gap-vertical-75);
}

@media all and (max-device-width: 992px), all and (max-width: 992px) {
	.V3SummaryHeader > #topNav > ul > .nav-item {
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		gap: var(--gap-horizontal-25);
	}

	.V3SummaryHeader > #topNav > ul > .nav-item .badge,
	.V3SummaryHeader > #topNav > ul > #nav-apps.nav-item .badge {
		position: relative;
		width: fit-content;
		height: fit-content;
		right: unset;
	}

	.V3SummaryHeader > #topNav > ul > .nav-item > a {
		flex-direction: row;
	}

	.V3SummaryHeader > #topNav > ul > .nav-item > a > svg {
		margin: 0 0 0 0;
	}
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
	.V3SummaryHeader > #topNav {
		border: none;
	}

	.V3SummaryHeader > #topNav > ul {
		flex-wrap: wrap;
		margin: 0;
		gap: var(--gap-vertical-25);
		border: none;
		justify-content: space-between;
	}

	.V3SummaryHeader > #topNav > ul > .nav-item {
		width: calc(50% - var(--gap-vertical-25));
		justify-content: center;
	}
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
	.V3SummaryHeader > #topNav > ul > .nav-item {
		justify-content: center;
		padding: var(--gap-vertical-50);
	}

	.V3SummaryHeader > #topNav > ul > .nav-item > a {
		flex-direction: column;
		justify-content: center;
	}

	.V3SummaryHeader > #topNav > ul > .nav-item .badge,
	.V3SummaryHeader > #topNav > ul > #nav-apps.nav-item .badge {
		position: absolute;
		right: var(--gap-vertical-25);
		top: var(--gap-vertical-50);
		left: unset;
		background-color: var(--color-secondary-dark);
		z-index: 2;
	}
}

/*
        8.23.2 SC Summary Content
    */
.V3SummaryControl > article {
	margin: 0;
}

.V3SummaryControl .container-fluid {
	padding: 0;
}

.V3SummaryControl .container-fluid:before,
.V3SummaryControl .container-fluid:after {
	display: none;
}

.V3SummaryControl .container-fluid > div {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-75);
}

.V3SummaryControl .headline-container {
	padding: 0;
	background: transparent;
	margin: 0;
	text-align: left;
}

.V3SummaryControl .headline-container > h1 {
	font-size: var(--font-size-h1);
	text-transform: capitalize;
	font-weight: var(--font-weight-h1);
	text-align: center;
}

/*
        8.23.2.1 SC Summary Content Home
    */
.V3SummaryControl .container-fluid > div > .task {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: var(--gap-horizontal-50);
	margin: 0;
	border: 1px solid var(--color-secondary-light);
	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;
}

.V3SummaryControl .container-fluid > div > .task > .task-icon {
	fill: var(--color-primary-dark);
}

.V3SummaryControl .container-fluid > div > .task > .task-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--gap-horizontal-50);
	margin: 0;
}

.V3SummaryControl .container-fluid > div > .task .task-text {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-25);
}

.V3SummaryControl .container-fluid > div > .task .task-title {
	color: var(--color-primary-dark);
	font-size: var(--font-size-h3);
	text-transform: capitalize;
	margin: 0;
}

.V3SummaryControl .container-fluid > div > .task .task-description {
	font-size: var(--font-size);
	color: var(--font-color);
}

/*
        8.23.2.2 SC Summary Content Messages
    */
.V3SummaryControl header:has(#nav-messages.active) + article .headline-container,
.V3SummaryControl header:has(#nav-messages.active) + article .headline-container > span {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-150);
	align-items: center;
}

.V3SummaryControl header:has(#nav-messages.active) + article .headline-container > span div:has(.btn-primary) {
	margin-bottom: var(--gap-vertical-150);
	text-align: center;
}

.V3SummaryControl .fiviSCSendMessage > div {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-75);
}

article .task:hover {
	background: var(--color-white-dark);
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
	.V3SummaryControl .container-fluid > div > .task > .task-icon {
		display: none;
	}
}

/*
        8.24 v3TextBox
            ***MOVE TO TOP OF fivi Controls when converting to v3***
            its a base level control, it should be first in the hierarchy of controls
            for now its only SC so here is fine.
    */
.fiviTextBox {
	flex-wrap: nowrap;
}

/*
        8.25 fiVISION_FinicityFundingAccountVerification
    */
.fiviFinicity,
.fiviFinicity #RealTimeInput,
.fiviFinicity .fivi-verifyNow-contents {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--gap-vertical-50);
	font-size: calc(var(--font-size) + 2px);
}

.fiviFinicity #RealTimeInput > div {
	width: 100% !important;
	text-align: center;
}

/*
        fiVISION_OneTimePasscode 
    */
.fiviOneTimePasscode .fiviPanelContainer {
	width: 100%;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	gap: var(--gap-horizontal);
}

.fiviOneTimePasscode .fiviOTPButtonGroup {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: var(--gap-horizontal);
	margin-top: var(--gap-horizontal-50);
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
	.fiviOneTimePasscode .fiviOTPButtonGroup {
		flex-direction: column-reverse;
		gap: var(--gap-vertical);
	}
}

/*
        fiVISION_WorkflowSurvey
    */
.fiviWorkflowSurvey {
	width: 100%;
	max-width: 100%;
}

.fiviWorkflowSurvey > div {
	width: 100%;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	gap: var(--gap-horizontal);
}

.fivi-workflow-survey-item {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-50);
}

.fivi-workflow-survey-question > label {
	font-weight: 600;
}

.fivi-workflow-survey-answers {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-25);
	padding-left: var(--gap-horizontal);
}

.fivi-workflow-survey-answers .fiviCheckBox > label {
	font-weight: 400;
}

.ErrorMessage.fivi-workflow-survey-error {
	font-weight: 600;
	font-size: calc(var(--font-size) - 2px);
}

/*
        9. Page Specific
    */
/*
        9.1 Default Page
    */
main > .layout-container:has(.page-Default-Content) {
	background-color: unset;
	outline: none;
}

.page-Default-Content .h1 {
	font-weight: 300;
}

.lets-get-started-container {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical-75);
	max-width: var(--column-width-6);
	width: 100%;
	height: calc(460px + var(--gap-vertical));
	padding: var(--gap-vertical) var(--gap-horizontal);
	background: var(--color-white-normal);
	border: 1px solid var(--color-gray-dark);
}

.lets-get-started-container > h2 {
	display: flex;
	align-items: center;
	gap: var(--gap-horizontal-50);
}

.lets-get-started-container > h2 > .DefaultTooltipClass {
	position: relative;
	display: none;
}

.what-you-need li {
	font-size: 13px;
}

.lets-get-started-container > #IndividualHandler01 {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}

.default-thumbnail-container {
	display: flex;
	flex-direction: column;
	gap: var(--gap-vertical);
}

.page-Default-Content .thumbnail {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: left;
	gap: var(--gap-vertical-75);
	max-width: var(--column-width-5);
	width: 100%;
	min-height: 230px;
	margin: 0;
	padding: var(--gap-vertical) var(--gap-horizontal);
	border: 1px solid var(--color-gray-dark);
	background-color: var(--color-gray-light);
	border-radius: 0px;
	transition: none;
	box-shadow: none;
}

.page-Default-Content .thumbnail > .h3 {
	text-align: left;
}

.page-Default-Content .thumbnail-call-to-action {
	width: 100%;
	margin-top: auto;
	display: flex;
	align-items: flex-end;
}

span#btnNonMember::after,
span#btnMember::after,
.arrow-right {
	content: "\2192";
	font-size: 25px;
	font-weight: 900;
	color: var(--color-primary-normal);
	padding-left: var(--gap-vertical-25);
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	height: 23px;
}

.thumbnail-call-to-action:hover span#btnNonMember::after,
.thumbnail-call-to-action:hover span#btnMember::after,
.thumbnail-call-to-action:hover .arrow-right {
	color: var(--color-primary-dark);
}

@media all and (max-device-width: 1106px), all and (max-width: 1106px) {
	.lets-get-started-container {
		max-width: var(--column-width-5);
	}

	.page-Default-Content .thumbnail {
		max-width: var(--column-width-4);
	}

	.what-you-need {
		font-size: calc(var(--font-size) - 2px);
	}
}

@media all and (max-device-width: 836px), all and (max-width: 836px) {
	.lets-get-started-container {
		max-width: 100%;
		height: fit-content;
	}

	.lets-get-started-container > #IndividualHandler01 {
		align-items: flex-start;
	}

	.default-thumbnail-container {
		max-width: 100%;
		width: 100%;
		flex-direction: row;
		flex-wrap: nowrap;
	}

	.page-Default-Content .thumbnail {
		max-width: 100%;
		min-height: fit-content;
	}
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
	.default-thumbnail-container {
		flex-wrap: wrap;
	}

	.default-thumbnail-container > .thumbnail {
		min-height: fit-content;
	}

	.thumbnail-call-to-action,
	.thumbnail-call-to-action > #IndividualHandler01 {
		flex-direction: row;
		justify-content: flex-end;
	}

	.what-you-need {
		font-size: var(--font-size);
	}

	.what-you-need-header,
	.what-you-need {
		display: none;
	}

	.lets-get-started-container > h2 > .DefaultTooltipClass {
		display: inline;
	}
}

@media all and (max-device-width: 525px), all and (max-width: 525px) {
}

@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;
	}
}

/*
        9.2 Status Center - Default
    */
.page-StatusCenterDefault {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: var(--gap-vertical-200);
	max-width: var(--column-width-12);
	width: 100%;
	line-height: var(--font-lineheight);
}

.page-StatusCenterDefault > .page-navigation-container {
	flex-direction: column;
	align-items: center;
	margin-top: 0;
}

/*
        9.3 Status Center - Status Center
    */
.page-StatusCenter {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	gap: var(--gap-vertical-200);
	max-width: var(--column-width-12);
	width: 100%;
	line-height: var(--font-lineheight);
}

.page-StatusCenter > .page-navigation-container {
	flex-direction: column;
	align-items: center;
	margin-top: 0;
}

/*
        9.4 Funding Method
    */
.funding-method-container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: var(--column-width-12);
	gap: var(--gap-vertical) var(--gap-horizontal);
}

.funding-method-container > .fiviPanel > .fiviMultiInput,
.funding-method-container > .fiviPanel {
	width: 100%;
	max-width: var(--column-width-3);
}

.funding-method-container .fiviCheckBox > div {
	display: none;
}

.funding-method-container .fiviCheckBox > label {
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--column-width-3);
	height: var(--input-height);
	border: 2px solid var(--color-gray-dark);
	border-radius: 2px;
	padding: 0 var(--column-spacer);
	text-align: center;
	cursor: pointer;
}

.funding-method-container .fiviCheckBox > div.checked + label {
	color: var(--color-primary-dark);
	border-color: var(--color-primary-dark);
	background-color: var(--color-gray-light);
}

.funding-method-container .fiviCheckBox > label:hover {
	color: var(--color-primary-normal);
	border-color: var(--color-primary-normal);
}

#pnlSelectFundingMethodDetails .fiviPanel {
	width: 100%;
}

.funding-detail {
	padding: var(--column-spacer);
	outline: 2px solid var(--color-gray-dark);
	gap: var(--gap-vertical-50);
	width: 100%;
	max-width: calc(var(--fiviInput-width) + calc(var(--column-spacer) * 2));
	margin: 0 auto;
}

.funding-detail .section-header,
.funding-detail .page-text-small,
.funding-detail .page-text,
.funding-detail .page-text-large {
	text-align: center;
}

.funding-detail .section-header:before {
	content: "";
	display: inline;
	width: 100%;
	height: 1px;
	background-color: var(--color-gray-dark);
}

.funding-detail .fiviInput,
.funding-detail .fiviTwoInput {
	width: 100%;
}

@media all and (max-device-width: 656px), all and (max-width: 656px) {
	.funding-method-container > .fiviPanel {
		width: 100%;
		max-width: calc(50% - calc(var(--column-spacer) / 2));
	}

	.funding-method-container > .fiviPanel > .fiviMultiInput {
		max-width: 100%;
		width: 100%;
	}

	.funding-method-container > .fiviPanel > .fiviMultiInput > .rb-as-button {
		max-width: 100%;
	}

	.funding-method-container .fiviCheckBox > label {
		width: 100%;
	}
}

@media all and (max-device-width: 452px), all and (max-width: 452px) {
	.funding-method-container > .fiviPanel {
		width: 100%;
		max-width: 100%;
	}
}

/*
        9.5 eSign Agreement
    */
.page-eSignAgreement #lnkESignAgreement,
.page-eSignAgreement .fiviCheckBox > label {
	font-size: calc(var(--font-size) + 2px);
}

/*
        10. ControlID Specific
    */
#tbCamera {
	display: none;
	max-width: var(--fiviInput-width);
	width: 100%;
}

#tbCamera #lblLicenseScan {
	display: block;
	left: 0;
	transform: none;
	margin: 0 auto;
}

#pnlDocuments {
	width: 100%;
}

@media all and (max-device-width: 834px), all and (max-width: 834px) {
	#tbCamera {
		display: block;
		max-width: var(--column-width-full);
		width: fit-content !important;
	}
}

/*
        11. Admin Console
    */
.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;
}

@media all and (max-device-width: 808px), all and (max-width: 808px) {
	.footerlogo {
		display: flex;
		justify-content: center;
		padding-left: 4em;
	}
}

/* 2. Footer  */
footer {
	font-family: "Barlow", sans-serif;
	color: #fff;
	font-size: 16px;
	width: 100%;
	background: #576b8e;
}

footer a {
	transition: border-color 0.15s ease-out, color 0.15s ease-out;
}

.footerlogo > img {
	max-width: 360px !important;
	padding-bottom: 4em;
}

@media all and (max-device-width: 400px), all and (max-width: 400px) {
	.footerlogo > img {
		max-width: 260px !important;
	}
}

.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;
}

#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;
}

.contacElements h4 {
	font-family: "Barlow", sans-serif;
}

.contacElements {
	font-weight: 400;
}

#showTimeout,
#showWarning {
	text-align: center;
}

.form-inline.fiviSCSendMessage > div > input {
	margin: auto;
}

.fiviLabelContainer {
	padding-left: 5px !important;
}
