@view-transition {
	navigation: auto;
}
html summary::-webkit-details-marker {
	display: none;
}
* {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	font-family: aktiv-grotesk, 'Helvetica Neue', 'Helvetica', sans-serif;
	font-weight: 400;
	font-style: normal;
	font-optical-sizing: auto;
	padding: 0;
	margin: 0;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: subpixel-antialiased;
	font-smoothing: subpixel-antialiased;
	font-synthesis: none;
	-moz-font-feature-settings: 'kern';
	shape-rendering: geometricPrecision;
	direction: ltr;
	line-height: 100%;
	color: var(--color-text);
	-webkit-tap-highlight-color: transparent;
}

/*
	
	Aktiv Grotesk Hair
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 200;
	font-style: normal;
	
	Aktiv Grotesk Hair Italic
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 200;
	font-style: italic;
	
	Aktiv Grotesk Light
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 300;
	font-style: normal;
	
	Aktiv Grotesk Light Italic
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 300;
	font-style: italic;
	
	Aktiv Grotesk Regular
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 400;
	font-style: normal;
	
	Aktiv Grotesk Italic
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 400;
	font-style: italic;
	Aktiv Grotesk Medium
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 500;
	font-style: normal;
	Aktiv Grotesk Medium Italic
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 500;
	font-style: italic;
	Aktiv Grotesk SemiBold
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 600;
	font-style: normal;
	Aktiv Grotesk SemiBold Italic
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 600;
	font-style: italic;
	Aktiv Grotesk Bold
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 700;
	font-style: normal;
	Aktiv Grotesk Bold Italic
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 700;
	font-style: italic;
	Aktiv Grotesk XBold
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 800;
	font-style: normal;
	Aktiv Grotesk XBold Italic
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 800;
	font-style: italic;
	Aktiv Grotesk Black
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 900;
	font-style: normal;
	Aktiv Grotesk Black Italic
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 900;
	font-style: italic;
	Aktiv Grotesk Thin
	font-family: "aktiv-grotesk-thin", sans-serif;
	font-weight: 200;
	font-style: normal;
	Aktiv Grotesk Thin Italic
	font-family: "aktiv-grotesk-thin", sans-serif;
	font-weight: 200;
	font-style: italic;	
	
*/

ul,
ol,
li {
	list-style: none;
}
html {
	position: relative;
}
body,
html {
	height: 100%;
}
body {
	font-size: 13px;
	animation: bugfix infinite 1s;
	-webkit-animation: bugfix infinite 1s;
	min-width: 375px;
	overflow: hidden;
	position: relative;
	width: 100%;
	line-height: 100%;
	-webkit-overflow-scrolling: touch;
	background: var(--color-background-body);
}
body.body-signup {
	background: var(--color-xdarker-gray);
}
svg {
	shape-rendering: geometricPrecision;
}
fieldset {
	outline: 0;
	border: 0;
}

/* BUTTONS */

button {
	border: 0;
	outline: 0;
	white-space: nowrap;
	cursor: pointer;
	border-radius: var(--border-radius-10);
	background: var(--color-button-primary-gradient-bg);
	padding: 0.6em 1.5em;
}
button[disabled] {
	opacity: 0.4;
	cursor: not-allowed;
}
button.light.faded {
	background: var(--color-background-white-trans-05);
	outline: 0;
	border: 0;
	color: var(--color-white);
}
button.secondary {
	border: 1px solid var(--color-primary);
	padding: 0.6em 1em;
	background: transparent;
	color: var(--color-text);
}
button.small {
	font-size: 0.8rem;
	padding: 8px 14px;
	border-radius: var(--border-radius-8);
}
button.medium {
	font-size: 0.85rem;
	padding: 10px 16px;
	border-radius: var(--border-radius-8);
}
button.large {
	font-size: 1.1rem;
	padding: 8px 16px;
	border-radius: var(--border-radius-8);
}
button.xlarge {
	font-size: 1.2rem;
	font-weight: 600;
	padding: 3px 10px;
	border-radius: var(--border-radius-5);
}
button.add {
	font-size: var(--font-size-xlarge);
	padding: 0;
	width: 25px;
	height: 25px;
	border-radius: var(--border-radius-circle);
	position: relative;
}
button.add:after {
	mask: var(--icon-add) left center / 10px 10px no-repeat;
	background: var(--color-white);
	position: absolute;
	top: 50%;
	left: 50%;
	width: 10px;
	height: 10px;
	content: '';
	transform: translate(-50%, -50%);
}

/* BUTTON INFO */

button.info {
	padding: 8px 12px;
	width: 2em;
	height: 2em;
	position: relative;
}
button.info:before {
	mask: var(--icon-info) center center / 10px 10px no-repeat;
	background: var(--color-white);
	width: 10px;
	height: 10px;
	content: '';
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	left: 50%;
}

/* BUTTON PRIMARY */

button.primary {
	background: var(--color-button-primary-gradient-bg);
	color: var(--color-white);
	font-weight: 500;
	padding: 16px 26px;
	font-size: var(--font-size-xxmedium);
	cursor: pointer;
	transition: var(--transition);
	box-shadow:
		8px 8px 16px var(--shadow-dark),
		-8px -8px 16px var(--shadow-light);
}
body.body-home button.primary,
.signup-container button.primary {
	background: var(--color-button-primary-gradient-bg);
	color: var(--color-white);
	font-weight: 500;
	padding: 16px 26px;
	font-size: var(--font-size-xxmedium);
	cursor: pointer;
	transition: var(--transition);
	box-shadow: none;
}
button.primary label {
	color: var(--color-black);
	width: 100%;
	height: 100%;
	display: block;
	font-weight: 500;
	font-size: var(--font-size-xxmedium);
}
button.primary:hover {
}
button.clear {
	background: var(--color-background-white-trans-10);
	color: var(--color-white);
	font-weight: 500;
	padding: 12px 26px;
	font-size: var(--font-size-xxmedium);
}
button.signup {
	background: var(--color-button-primary-gradient-bg);
	padding: 20px 36px;
	border-radius: var(--border-radius-10);
	font-size: var(--font-size-xxxlarge);
	color: var(--color-black);
	font-weight: 500;
	margin: 40px 0 0 0;
}
/* *::-webkit-scrollbar {
	  display: none;
	}	 */
select {
	appearance: none;
	-webkit-appearance: none;
	border: none;
	padding: 10px 15px;
	margin: 0;
	width: 100%;
	font-family: inherit;
	font-size: inherit;
	cursor: inherit;
	line-height: 115%;
	z-index: 1;
	outline: none;
}
.icon.check-green {
	background: url('../icons/check-green.svg') no-repeat;
}
textarea {
	border-radius: var(--border-radius-8);
	border: 1px solid var(--color-xmedium-gray);
	padding: 1.5em;
	background: transparent;
	outline: none;
	resize: none;
}
input,
select {
	border: 0;
	outline: 0;
}
.alert {
	mask: var(--icon-alert) top left / 12px 12px no-repeat;
	background: var(--color-live);
	width: 12px;
	height: 12px;
}

/* BADGES */

.badge {
	padding: 4px 7px;
	text-transform: uppercase;
	font-weight: 600;
	font-size: var(--font-size-xxsmall);
	border-radius: var(--border-radius-5);
	display: inline-flex;
	line-height: 100%;
}
.badge.update {
	background: var(--color-live);
	color: var(--color-black);
}
.badge.new {
	background: var(--color-primary);
	color: var(--color-white);
	text-shadow: 1px 1px 0px var(--color-background-black-trans-50);
}

/* MODALS (*NEW* TYPE JS) */

.modal {
	display: none;
	width: 100vw;
	height: 100vh;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 10;
	visibility: visible;
	opacity: 1;
	transition: opacity 0.2s ease-in;
	background: var(--color-background-black-trans-70);
}
.modal-content {
	max-width: none;
	width: 90dvw;
	height: 90dvh;
	padding: 0;
	border-radius: var(--border-radius-20);
	text-align: center;
	background-color: var(--color-white);
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 999;
	pointer-events: auto;
	cursor: auto;
	visibility: visible;
	box-shadow: 0 0 20px var(--color-background-black-trans-30);
	display: flex;
	justify-content: center;
}
.close {
	color: var(--color-light-gray);
	float: right;
	font-size: var(--font-size-xmedium);
	font-weight: 600;
}
.close:hover,
.close:focus {
	color: var(--color-black);
	text-decoration: none;
	cursor: pointer;
}

/* GLOBAL FRAME & HEADER */

.app-container {
	position: relative;
	display: grid;
	grid-template-columns: 100dvw;
	grid-column-gap: 70px;
	justify-content: start;
	z-index: 0;
	width: 100dvw;
	align-items: start;
	margin: 40px 0 50px 0;
}
.web-container {
	position: relative;
	display: grid;
	grid-template-columns: 100dvw;
	grid-column-gap: 70px;
	justify-content: start;
	z-index: 0;
	width: 100dvw;
	align-items: start;
	margin: 0 100px;
}
body.body-global .background-img-signup,
body.body-dealroom .background-img-signup,
body.body-listing .background-img-signup,
body.body-signup .background-img-signup {
	object-fit: cover;
	width: 100%;
	height: 100%;
	z-index: -1;
	position: absolute;
	top: 0;
	left: 0;
}
body.body-global .background-img-signup .image-1,
body.body-dealroom .background-img-signup .image-1,
body.body-signup .background-img-signup .image-1 {
	background: url('../../resources/images/backgrounds/bg-image-ss-1.jpg') center center / cover
		no-repeat;
	object-fit: cover;
	width: 100%;
	height: 100%;
	z-index: 0;
	position: absolute;
	top: 0;
	left: 0;
	/* opacity: .6; */
	opacity: 1;
	filter: blur(100px);
}
body.body-listing .background-img-signup .image-1 {
	background: url('../../resources/images/backgrounds/bg-image-ss-1.jpg') center center / cover
		no-repeat;
	object-fit: cover;
	width: 100%;
	height: 100%;
	z-index: 0;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	filter: blur(100px);
}
body.body-global .background-img-signup .gradient-1 {
	background: linear-gradient(
		180deg,
		hsla(209, 100%, 7%, 0.8) 0%,
		var(--color-background-black-trans-90) 100%
	);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	backdrop-filter: blur(90px);
}
body.body-listing .background-img-signup .gradient-1 {
	background: var(--color-primary-trans-05);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	backdrop-filter: blur(90px);
}
body.body-global .background-img-signup .gradient-1,
body.body-dealroom .background-img-signup .gradient-1,
body.body-signup .background-img-signup .gradient-1 {
	/* background: linear-gradient(180deg, hsla(209,100%,7%,.8) 0%, var(--color-background-black-trans-70) 100%); */
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	backdrop-filter: blur(90px);
	filter: brightness(1);
	background: hsla(209, 100%, 7%, 0.6);
}
.app-container .col0 {
	width: 70px;
	background: var(--color-background-black-trans-40);
	border-radius: 0 var(--border-radius-20) 0 0;
	padding: 15px 0 0 0;
	overflow-y: visible;
	z-index: 0;
	height: 100dvh;
	position: fixed;
	left: 0;
}

/* OVERTURE BRAND ASSETS */

.overture-wordmark-black {
	background-image: var(--overture-wordmark-black);
	background-size: 150px 100px;
	background-repeat: no-repeat;
	width: 150px;
	height: 100px;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
}

/* CLOSE BUTTON (MODAL) */

.close-btn {
	display: inline-block;
	width: 20px;
	height: 20px;
	cursor: pointer;
	position: absolute;
	top: 30px;
	right: 20px;
}
.close-btn::before,
.close-btn::after {
	content: '';
	position: absolute;
	height: 20px;
	width: 2px;
	background: var(--color-black);
	transform: rotate(-45deg);
}
.close-btn::after {
	transform: rotate(45deg);
}
.panel-floating .close-btn::before,
.panel-floating .close-btn::after {
	background: var(--color-white);
}

/* CUSTOM RADIO AND CHECKBOXES */

input.card-input-element + .card {
	width: 100%;
	height: 100%;
	padding: 18px 24px;
	justify-content: center;
	-webkit-box-shadow: none;
	box-shadow: none;
	border: 1px solid var(--color-background-white-trans-20);
	border-radius: 10px;
	text-align: left;
	-webkit-box-shadow: var(--box-shadow-level-0);
	box-shadow: var(--box-shadow-level-0);
	position: relative;
	display: flex;
	flex-flow: column;
	align-items: start;
	grid-row-gap: 5px;
}
input.card-input-element + .card.medtall {
	padding: 0 24px;
	min-height: 140px;
}
input[type='radio'].card-input-element + .card.medtall .content span,
input[type='checkbox'].card-input-element + .card.medtall .content span {
	font-size: var(--font-size-xxlarge);
}
input.card-input-element + .card.tall {
	padding: 42px 24px;
}
input[type='radio'].card-input-element + .card.tall .content,
input[type='checkbox'].card-input-element + .card.tall .content,
input[type='checkbox'].card-input-element + .card.big .content {
	font-size: var(--font-size-xxlarge);
	color: var(--color-light-gray);
}
input.card-input-element + .card:hover {
	cursor: pointer;
}
input.card-input-element + .card .content {
	color: var(--color-white);
}
input.card-input-element + .card .desc {
	color: var(--color-light-gray);
	line-height: 140%;
	padding: 0 50px 0 0;
}
input.card-input-element.full + .card .content {
	width: 100%;
}
input.card-input-element.full + .card .content input[type='text'] {
	width: 100%;
	margin: 22px 0 0 0;
	opacity: 0.1;
	pointer-events: none;
	user-select: none;
}
input[type='radio'].card-input-element + .card .content,
fieldset.buyer-industries input[type='checkbox'].card-input-element + .card .content,
fieldset.buyer-attributes input[type='checkbox'].card-input-element + .card .content,
fieldset.buyer-type input[type='checkbox'].card-input-element + .card .content {
	font-size: var(--font-size-xlarge);
}
input[type='radio'].card-input-element + .card .content span,
input[type='checkbox'].card-input-element + .card .content span {
	display: block;
	color: var(--color-light-gray);
	font-size: var(--font-size-small);
	padding: 8px 0 0 0;
}
input[type='checkbox'].card-input-element + .card .content {
	font-size: var(--font-size-xmedium);
}
input[type='checkbox'].card-input-element + .card .content span.comment {
	display: block;
	font-size: var(--font-size-xsmall);
	color: var(--color-medium-light-gray);
	margin: 5px 0 0 0;
}
input.card-input-element:checked + .card {
	border: 1px solid var(--color-primary);
	-webkit-transition: border 0.3s;
	-o-transition: border 0.3s;
	transition: border 0.3s;
	position: relative;
}
input.card-input-element:checked + .card .content {
	color: var(--color-white);
}
input.card-input-element:checked + .card .content span.comment {
	color: var(--color-light-gray);
}
input.card-input-element + .card::after {
	content: '';
	border: 1px solid var(--color-light-gray);
	width: 22px;
	height: 22px;
	border-radius: 50%;
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-animation-name: fadeInCheckbox;
	animation-name: fadeInCheckbox;
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
	-webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 0;
}
input.card-input-element:checked + .card::after {
	content: '';
	mask: var(--icon-check) right center / 24px 24px no-repeat;
	background: var(--color-primary);
	position: absolute;
	right: 20px;
	top: 50%;
	width: 24px;
	height: 24px;
	transform: translateY(-50%);
	-webkit-animation-name: fadeInCheckbox;
	animation-name: fadeInCheckbox;
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
	-webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 1;
}
input.card-input-element.full + .card::after {
	top: 18px;
	transform: none;
}
input.card-input-element.full:checked + .card::after {
	top: 18px;
	transform: none;
}
input.card-input-element.full:checked + .card .content input[type='text'] {
	opacity: 1;
	pointer-events: auto;
	user-select: auto;
}
input.card-input-element[type='radio'],
input.card-input-element[type='checkbox'] {
	display: none;
}
@-webkit-keyframes fadeInCheckbox {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
@keyframes fadeInCheckbox {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

/* CUSTOM SELECT MENU */

.custom-select {
	appearance: none;
	background: var(--color-primary-lightest-2)
		url('https://api.iconify.design/tabler/chevron-down.svg') center right 20px / 22px 22px
		no-repeat;
	background-repeat: no-repeat;
	border-radius: var(--border-radius-10);
	box-sizing: border-box;
	color: var(--color-light-gray);
	font-size: var(--font-size-large);
	flex: 1;
	padding: 38px 20px 16px 20px;
	width: 100%;
}
.custom-select::placeholder {
}
.custom-select,
.custom-select::picker(select) {
	appearance: base-select;
	font-weight: 500;
	color: var(--color-black);
}
.custom-select::picker(select) {
	appearance: base-select;
	background: var(--color-white);
	border: 0;
	overflow: auto;
	margin: 0;
	max-height: 90%;
	padding: 10px 30px 10px 10px;
	border-radius: var(--border-radius-10);
}
.custom-select::picker-icon {
	content: '';
}
.custom-select:open {
	background-image: url('https://api.iconify.design/tabler/chevron-up.svg');
}
.fcustom-select option {
	padding: 10px;
}
.custom-select option:enabled {
	color: var(--color-medium-light-gray);
	background-color: transparent;
	padding: 9px 0;
	cursor: pointer;
}
.custom-select option:enabled:hover {
	color: var(--color-black);
	font-weight: 500;
}
.custom-select option:enabled:first-child {
	color: var(--color-black);
	font-weight: 600;
}
.inner-dark-container {
	border-radius: var(--border-radius-20);
}
.inner-dark-container .upload-container .file-wrap {
	margin-top: 15px;
	padding: 20px 20px 20px 0;
}
.inner-dark-container .upload-container .upload-text-file {
	font-size: var(--font-size-xlarge);
}
.link-quickbooks {
	position: relative;
	padding: 0 0 0 45px;
	display: flex;
	justify-content: start;
	align-items: center;
	font-size: var(--font-size-xxmedium);
	flex-flow: row;
	grid-gap: 20px;
}
.link-quickbooks img {
	width: 180px;
}
.link-quickbooks span {
	position: relative;
}
.link-quickbooks:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	mask: var(--icon-link) left center / 30px 30px no-repeat;
	background: var(--color-primary);
}
.link-files {
	position: relative;
	padding: 0 0 0 45px;
	display: flex;
	justify-content: start;
	align-items: start;
	font-size: var(--font-size-xxmedium);
	flex-flow: column;
	grid-gap: 10px;
}
.link-files img {
	width: 240px;
}
.link-files span {
	position: relative;
}
span.file-types {
	color: var(--color-light-gray);
	font-size: var(--font-size-small) !important;
	display: block;
	margin: 5px 0 0 0;
}
.link-files:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	mask: var(--icon-upload-file) left center / 30px 30px no-repeat;
	background: var(--color-primary);
}
.or {
	width: 100%;
	position: relative;
	height: 30px;
	text-transform: uppercase;
	font-size: var(--font-size-xxsmall);
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	color: var(--color-light-gray);
}
.or:before {
	background: linear-gradient(90deg, hsla(0, 0%, 45%, 0) 0%, hsla(0, 0%, 65%, 1) 100%);
	width: calc(50% - 40px);
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	height: 1px;
	content: '';
}
.or:after {
	background: linear-gradient(90deg, hsla(0, 0%, 65%, 1) 0%, hsla(0, 0%, 45%, 0) 100%);
	width: calc(50% - 40px);
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	height: 1px;
	content: '';
}

/* CUSTOM IMAGE UPLOAD */

.upload-container {
	width: 100%;
	position: relative;
	border-radius: var(--border-radius-10);
}
fieldset.radios.column.label.buyer-funding .upload-container {
	grid-area: upload-container;
}
.upload-container .file-wrap {
	border: 1px dashed var(--color-white);
	border-radius: var(--border-radius-10);
	position: relative;
	transition: all 0.5s ease;
	transform: scale(1);
}
.upload-container .file-wrap.dragging {
	transform: scale(1.1);
}
.upload-container .file-wrap input[type='file'] {
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	opacity: 0;
	cursor: pointer;
	z-index: 2;
}
.upload-container .custom-upload-design {
	padding: 25px;
	display: flex;
	align-items: center;
	justify-content: start;
	flex-direction: row;
}
.upload-container .upload-text-photo,
.upload-container .upload-text-file {
	text-align: left;
	font-size: var(--font-size-large);
	position: relative;
	padding-left: 50px;
}
.upload-container .upload-text-photo:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	mask: var(--icon-upload-image) left center / 30px 30px no-repeat;
	background: var(--color-primary);
}
.upload-container .upload-text-file:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 30px;
	mask: var(--icon-upload-file) left center / 30px 30px no-repeat;
	background: var(--color-primary);
}
.upload-container .upload-icon {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: scale(1);
	transition: transform 0.5s ease-in-out;
	display: none;
}
.upload-container .upload-icon img {
	max-width: 20px;
}
.upload-container .dropped .upload-text-photo,
.upload-container .dropped .upload-text-file {
	display: none;
}
.upload-container .dropped .upload-icon {
	transform: scale(2.8);
	opacity: 1;
	transition: all 0.5s ease-in-out;
	animation: bounce 1s 0.5s;
}
.upload-container .animate .upload-icon {
	opacity: 0;
}
.upload-container .dropped .upload-icon img {
	opacity: 0;
}
.upload-container .file-wrap.dropped {
	border-color: transparent;
}
.upload-container .after-upload-container {
	position: absolute;
	left: 0;
	top: -10px;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	zoom: 0.7;
}
.upload-container .animated-line {
	stroke: var(--color-primary);
	stroke-width: 7;
	fill: transparent;
	animation: progressAnimation 2s linear;
	position: relative;
	top: -6px;
	z-index: 1;
}
.upload-container .animated-line-2 {
	stroke: var(--color-white);
	stroke-width: 10;
	fill: transparent;
	position: absolute;
	margin: auto;
	top: 19px;
	display: none;
}

@keyframes progressAnimation {
	0% {
		stroke-dasharray: 0, 565;
		stroke: var(--color-alert);
	}
	100% {
		stroke-dasharray: 565;
		stroke: var(--color-primary);
	}
}
.upload-container .after-upload-container > div {
	position: absolute;
	left: 0px;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	max-width: 100px;
	margin: 0 auto;
}
.upload-container uploaded .after-upload-container {
	transform: scale(0.5);
	top: -10px;
	transition: all 0.5s ease;
}
.upload-container .tick-line {
	width: 60px;
	height: 60px;
	left: 20px;
	position: relative;
	top: 7px;
}
.upload-container .path {
	stroke-dasharray: 1000;
	stroke-dashoffset: 0;
}
.path.check {
	stroke-dashoffset: -100;
	-webkit-animation: dash-check 0.9s 0.35s ease-in-out forwards;
	animation: dash-check 0.9s 0.35s ease-in-out forwards;
}
@-webkit-keyframes dash-check {
	0% {
		stroke-dashoffset: -100;
	}
	100% {
		stroke-dashoffset: 900;
	}
}
@keyframes dash-check {
	0% {
		stroke-dashoffset: -100;
	}
	100% {
		stroke-dashoffset: 900;
	}
}
.upload-container .text-uploaded {
	position: absolute;
	bottom: -30px;
	font-size: 32px;
	left: 0;
	right: 0;
	text-align: center;
	display: none;
}

/* APP LEFT NAV */

.col0 ul {
	padding: 0 0.75em;
}
.col0 li:nth-child(5),
.col0 li:nth-child(7) {
	padding-top: 0.5rem;
	border-top: 1px solid var(--color-background-white-trans-15);
	margin-top: 0.5em;
}
.col0 li + li {
	/* margin-top: 0.75rem; */
}
.col0 a {
	color: var(--color-white-background-trans-30);
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 3rem;
	border-radius: 8px;
	position: relative;
}
.col0 a:hover,
.col0 a:focus,
.col0 a.active {
	background-color: var(--color-background-white-trans-15);
	outline: 0;
}
.col0 a:hover span,
.col0 a:focus span,
.col0 a.active span {
	transform: scale(1);
	opacity: 1;
}
.col0 a .icon.active {
	background: var(--color-primary);
	box-shadow: 0 0 30px 0 var(--color-primary);
}
.col0 a span {
	position: absolute;
	background-color: var(--color-black);
	white-space: nowrap;
	padding: 0.5rem 1rem;
	border-radius: 6px;
	left: calc(100% + 1.5rem);
	transform-origin: center left;
	transform: scale(0);
	opacity: 0;
	transition: 0.15s ease;
}
.col0 a span:before {
	content: '';
	display: block;
	width: 12px;
	height: 12px;
	position: absolute;
	background-color: var(--color-black);
	left: -5px;
	top: 50%;
	transform: translatey(-50%) rotate(45deg);
	border-radius: 3px;
}
.col0 .icon-dashboard {
	mask: url('../icons/icon-dashboard.svg') center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.col0 .icon-documents {
	mask: var(--icon-document) center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.profile .icon-messages {
	mask: var(--icon-message) center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.col0 .icon-messages {
	mask: var(--icon-message) center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.profile .icon-notifications {
	mask: url('../icons/icon-notification.svg') center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.col0 .icon-notifications {
	mask: url('../icons/icon-notification.svg') center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.col0 .icon-settings {
	mask: url('../icons/icon-settings.svg') center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.col0 .icon-history {
	mask: var(--icon-history) center center / 20px 20px no-repeat;
	background: var(--color-nav-icon);
	width: 20px;
	height: 20px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.col0 .icon-profile {
	mask: url('../icons/icon-profile.svg') center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.col0 .icon-plus {
	mask: url('../icons/icon-plus.svg') center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
.col0 .icon-minus {
	mask: url('../icons/icon-minus.svg') center center / 18px 18px no-repeat;
	background: var(--color-nav-icon);
	width: 18px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	content: '';
}
body.zero-point .col0 a.indicator-messages {
	pointer-events: none;
	opacity: 0.3;
}
body.zero-point .col0 a.indicator-messages .dot.new {
	display: none;
}
.col0 a .dot.new {
	position: absolute;
	left: 5px;
}
.dot.new {
	width: 5px;
	height: 5px;
	border-radius: var(--border-radius-circle);
	background: var(--color-primary);
}
.col0 .notification-count {
	background: var(--color-primary);
	font-size: var(--font-size-xxxsmall);
	width: 15px;
	height: 15px;
	position: absolute;
	right: 6px;
	top: 6px;
	color: var(--color-white);
	border-radius: var(--border-radius-5);
	line-height: 0;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 600;
}
@keyframes scale {
	0% {
		transform: scale(0);
	}
	100% {
		transform: scale(1);
	}
}

/* ============= */

body #root {
	display: grid;
	grid-row-gap: 30px;
	justify-content: center;
	align-items: start;
	height: 100dvh;
	width: 100dvw;
	overflow-y: auto;
}
body.body-home #root {
	display: block;
	width: auto;
	overflow-y: hidden;
}
body.body-signup #root {
	grid-template-rows: min-content auto min-content;
	padding: 0;
	align-items: start;
	grid-row-gap: 0;
	overflow-y: hidden;
}
body.body-global #root {
	grid-template-rows: min-content auto min-content;
	padding: 0;
	align-items: start;
	grid-row-gap: 0;
}
body.body-listing #root {
	grid-template-rows: min-content auto min-content;
	padding: 0;
	align-items: start;
	grid-row-gap: 0;
}
body.body-dealroom #root {
	/* grid-template-rows: min-content auto min-content; */

	/* This is to allow for the footer in the Dealroom to be hidden unless scrolled down */
	grid-row-gap: 0;
	grid-template-rows: min-content 100% min-content;
	overflow-y: hidden;
}

[type='text'],
[type='email'],
[type='tel'],
[type='password'],
textarea {
	padding: 18px 20px;
	border-radius: var(--border-radius-10);
	width: 100%;
	color: var(--color-black);
	font-size: var(--font-size-large);
	font-weight: 400;
	background: var(--color-primary-lightest-2);
	background: var(--color-white);
	/* box-shadow: inset 5px 5px 10px var(--color-xxlight-gray),
	inset -5px -5px 10px #fff;	 */
	border: 1px solid var(--color-primary);
}
textarea {
	height: 130px;
	line-height: 160%;
}
[type='tel'],
.business-website [type='text'],
.your-website [type='text'],
input.owner-pay-amount,
input.estimated-business-value,
input.annual-amount {
	padding-top: 38px;
	padding-bottom: 16px;
}
[type='text']::placeholder,
[type='email']::placeholder,
[type='tel']::placeholder,
[type='password']::placeholder {
	color: var(--color-medium-light-gray);
	font-size: var(--font-size-large);
}
textarea::placeholder {
	color: var(--color-medium-light-gray);
	font-size: var(--font-size-large);
	line-height: 160%;
}
.label-input-group,
.label-input-group.currency {
	position: relative;
}
.label-input-group.currency label {
	top: 16px;
}
.label-input-group.currency:before {
	content: '$ ';
	position: absolute;
	left: 20px;
	top: calc(50% + 12px);
	transform: translateY(-50%);
	z-index: 2;
	color: var(--color-black);
	font-size: var(--font-size-xxlarge);
	font-weight: 600;
}
.label-input-group.currency [type='text'] {
	padding-top: 38px;
	padding-left: 34px;
	font-size: var(--font-size-xxlarge);
}
label[for='mobile-number'],
label[for='business-website'],
label[for='your-website'],
label[for='owner-pay-amount'],
label[for='estimated-business-value'],
label.label-input-group-label {
	position: absolute;
	top: 16px;
	left: 20px;
	color: var(--color-medium-light-gray);
	font-size: var(--font-size-medium);
	font-weight: 400;
	z-index: 1;
}
fieldset.buttons {
	display: flex;
	justify-content: space-between;
	width: 100%;
	padding-top: 40px;
	flex-flow: column;
}
fieldset.buttons button {
	width: 100%;
}

.body-home #section1 h1 {
	position: relative;
	padding: 80px 0 0 0;
}
.body-home #section1 .vcalc-title {
	font-size: var(--font-size-h1x);
	font-weight: 300;
	color: var(--color-black);
}
.body-home #section1 h1:before {
	mask: var(--icon-calculator) top center / 60px 60px no-repeat;
	background: var(--color-primary);
	left: 50%;
	content: '';
	position: absolute;
	top: 0;
	transform: translateX(-50%);
	width: 60px;
	height: 60px;
}
.body-home .vcalc-container {
	margin: 0 auto;
	position: relative;
	display: grid;
	grid-template-columns: auto auto;
	justify-content: center;
}
.body-home .content-container {
	width: 600px;
	background: var(--color-background-white-trans-10);
	border-radius: var(--border-radius-20) 0 0 var(--border-radius-20);
	padding: 50px 50px;
	display: flex;
	grid-gap: 15px;
	flex-flow: column;
	margin: 0;
	height: auto;
	overflow-y: hidden;
}
.body-home fieldset.inputs {
	display: flex;
	flex-flow: column;
	position: relative;
	grid-row-gap: 10px;
}
.body-home .content-container:nth-child(2) {
	width: 600px;
	background: var(--color-white);
	border-radius: 0 var(--border-radius-20) var(--border-radius-20) 0;
	padding: 40px 50px 0 50px;
	display: flex;
	grid-gap: 15px;
	flex-flow: column;
}
.body-home .content-container:nth-child(2) .results {
	display: flex;
	grid-row-gap: 10px;
	flex-flow: column;
	margin: 15px 0 0 0;
}
.body-home .content-container:nth-child(2) .results div {
	color: var(--color-black);
}
.body-home .content-container:nth-child(2) .results .line {
	background: var(--color-medium-light-gray);
	height: 1px;
	width: 100%;
	margin: 20px 0;
}
.body-home .content-container:nth-child(2) .results .url {
	font-size: var(--font-size-xxxlarge);
	letter-spacing: -0.01em;
	font-weight: 600;
	color: var(--color-primary);
}
.body-home .content-container:nth-child(2) .results .url.place-filler {
	width: 100%;
	background: var(--color-primary-lightest-2);
	height: 25px;
}
.body-home .content-container:nth-child(2) .results .industry-state.place-filler {
	width: 50%;
	background: var(--color-primary-lightest-2);
	height: 13px;
}
.body-home .content-container:nth-child(2) .results .values-container {
	display: flex;
	grid-row-gap: 15px;
	flex-flow: column;
	margin: 20px 0 0 0;
}
.body-home .content-container:nth-child(2) .results .annual-revenue,
.body-home .content-container:nth-child(2) .results .net-profit,
.body-home .content-container:nth-child(2) .results .annual-revenue {
	display: flex;
	flex-flow: column;
	grid-gap: 5px;
}
.body-home .content-container:nth-child(2) .results .annual-revenue .title,
.body-home .content-container:nth-child(2) .results .net-profit .title,
.body-home .content-container:nth-child(2) .results .annual-revenue .title {
	color: var(--color-medium-gray);
}
.body-home .content-container:nth-child(2) .results .annual-revenue .value,
.body-home .content-container:nth-child(2) .results .net-profit .value,
.body-home .content-container:nth-child(2) .results .annual-revenue .value {
	font-weight: 600;
	font-size: var(--font-size-xxlarge);
}
.body-home .content-container:nth-child(2) .results .annual-revenue .value.place-filler,
.body-home .content-container:nth-child(2) .results .net-profit .value.place-filler,
.body-home .content-container:nth-child(2) .results .annual-revenue .value.place-filler {
	width: 40%;
	background: var(--color-primary-lightest-2);
	height: 19px;
}
.body-home .content-container:nth-child(2) .results .totals-range {
	font-size: var(--font-size-h1);
	letter-spacing: -0.02em;
	font-weight: 600;
}
.body-home .content-container:nth-child(2) .results .totals-range.place-filler {
	width: 60%;
	background: var(--color-primary-lightest-2);
	height: 45px;
}
.bar-graph .label {
	-webkit-animation: fade-in-text 2.2s 0.1s forwards;
	-moz-animation: fade-in-text 2.2s 0.1s forwards;
	animation: fade-in-text 2.2s 0.1s forwards;
	opacity: 0;
}
.bar-graph-horizontal {
	margin: 30px -50px 0 -50px;
	position: relative;
	width: calc(100% + 100px);
	background: var(--color-primary-lightest);
	padding: 30px;
	border-radius: 0 0 var(--border-radius-20) 0;
}
.bar-graph-horizontal > div {
	float: left;
	margin-bottom: 8px;
	width: 100%;
}
.bar-graph-horizontal .label {
	position: absolute;
	left: 15px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--color-white);
	z-index: 1;
}
.bar-graph-horizontal .bar {
	border-radius: 5px var(--border-radius-10) var(--border-radius-10) 5px;
	height: 40px;
	float: left;
	overflow: hidden;
	position: relative;
	width: 0;
}
.bar-graph .bar::after {
	-webkit-animation: fade-in-text 2.2s 0.1s forwards;
	-moz-animation: fade-in-text 2.2s 0.1s forwards;
	animation: fade-in-text 2.2s 0.1s forwards;
	color: var(--color-white);
	content: attr(data-percentage);
	font-weight: 700;
	position: absolute;
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
}
.bar-graph .bar-one,
.bar-graph .bar-two {
	position: relative;
}
.bar-graph.place-filler .bar-one,
.bar-graph.place-filler .bar-two {
	display: none;
}
.bar-graph.place-filler {
	height: 170px;
	background: var(--color-primary-lightest-2);
	border-radius: 0;
}
.bar-graph .bar-one .bar {
	background-color: var(--color-primary);
	-webkit-animation: show-bar-one 1.2s 0.1s forwards;
	-moz-animation: show-bar-one 1.2s 0.1s forwards;
	animation: show-bar-one 1.2s 0.1s forwards;
}
.bar-graph .bar-two .bar {
	background-color: var(--color-brand-supp-1);
	-webkit-animation: show-bar-two 1.2s 0.4s forwards;
	-moz-animation: show-bar-two 1.2s 0.4s forwards;
	animation: show-bar-two 1.2s 0.4s forwards;
}
@-webkit-keyframes show-bar-one {
	0% {
		width: 0;
	}
	100% {
		width: 89.6%;
	}
}
@-webkit-keyframes show-bar-two {
	0% {
		width: 0;
	}
	100% {
		width: 56.8%;
	}
}
@-webkit-keyframes fade-in-text {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

/* PROFILE HEADER */

.profile {
	position: relative;
}
.profile-trigger {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	transition: var(--transition-04);
	border-radius: var(--border-radius-20);
}
/* .profile-trigger:hover .circle {
	background: var(--color-background-white-trans-10);
	} */
.profile-trigger:hover .circle .initials {
	color: var(--color-primary);
}
.profile-avatar {
	width: 38px;
	height: 38px;
	background: var(--color-primary);
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.avatar-text {
	color: black;
	font-weight: 600;
	font-size: 0.9rem;
}
.profile-info {
	display: flex;
	flex-direction: column;
	grid-gap: 5px;
}
.profile-name {
	font-weight: 500;
	font-size: var(--font-size-xmedium);
	white-space: nowrap;
}
.profile-role {
	font-size: 0.8rem;
	color: var(--text-secondary);
}
.profile-trigger i {
	color: var(--text-secondary);
	transition: transform var(--transition-04);
}
.profile-dropdown {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	width: 280px;
	background: var(--color-background-black-trans-20);
	background: var(--color-black);
	/* backdrop-filter: blur(20px); */
	border-radius: 15px;
	box-shadow: var(--card-shadow);
	display: none;
	z-index: 1000;
}
.profile-dropdown.active {
	display: block;
	animation: fadeIn 0.3s ease;
}
.dropdown-header {
	padding: 20px;
	display: flex;
	align-items: center;
	grid-gap: 15px;
	background: var(--color-background-black-trans-20);
	border-radius: var(--border-radius-20) var(--border-radius-20) 0 0;
}
.header-avatar {
	width: 48px;
	height: 48px;
	background: var(--color-primary);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.header-info {
	display: flex;
	flex-flow: column;
	grid-row-gap: 5px;
}
.header-info h4 {
	margin: 0;
	font-size: var(--font-size-xmedium);
}
.header-info span {
	color: var(--color-white);
}
.dropdown-divider {
	height: 1px;
	background: var(--color-background-white-trans-10);
}
.dropdown-menu {
	list-style: none;
}
.dropdown-menu li {
	padding: 15px 20px;
	border-radius: 0;
	display: flex;
	align-items: center;
	grid-column-gap: 10px;
	cursor: pointer;
	transition: var(--transition-04);
}
.dropdown-menu li span {
	font-size: var(--font-size-xmedium);
}
.dropdown-menu li:hover {
	background: var(--color-background-white-trans-10);
}
.dropdown-menu li i {
	width: 20px;
	color: var(--color-primary);
	font-size: 1.1rem;
}
.dropdown-menu li.logout {
	color: var(--danger);
}
.dropdown-menu li.logout i {
	color: var(--danger);
}
.theme-switch,
.toggle-switch {
	position: relative;
	display: inline-block;
	width: 44px;
	height: 22px;
	margin-left: auto;
}
.theme-switch input,
.toggle-switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.switch-slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--color-black);
	transition: 0.4s;
	border-radius: 34px;
}
.switch-slider:before {
	position: absolute;
	content: '';
	height: 16px;
	width: 16px;
	left: 3px;
	bottom: 3px;
	background-color: var(--color-white);
	transition: 0.4s;
	border-radius: 50%;
}
input:checked + .switch-slider {
	background-color: var(--color-primary);
}
input:checked + .switch-slider:before {
	transform: translateX(22px);
}
.svg-inline--fa {
	font-size: 1.5em;
}
.footer {
	position: relative;
	margin: 0 auto 15px auto;
	width: 100%;
	text-align: center;
	font-size: 0.7rem;
	opacity: 0.5;
	z-index: 4;
}
.footer .beam {
	padding: 0 10px;
	display: inline-block;
}
body.body-dealroom .footer {
	padding: 30px 0 0 0;
}

/* DIV SHOW/HIDE TOGGLE (SIMPLE) */

.toggle-container {
	display: none;
}

/* 
	
@media (max-height: 1000px) {
	
	.content-container {
		min-height: fit-content;
		height: fit-content;
		}
	}	
	 */
@media (max-width: 1200px) {
	.steps-container {
		padding-left: 30px;
		padding-right: 30px;
	}
	.content-container {
		padding-left: 30px;
		padding-right: 30px;
	}
}
