:root {
	--Font: 'Poppins', sans-serif;

	--Glow-Size: 1rem;
	--Border-Thickness: 0.15rem;
	--Transition: 0.15s ease-out all;
	--Border-Radius: 0.5rem;
	--Border-Radius-Bottom: 0 0 1rem 1rem;
	--Padding: 0.5rem 1rem;
	--Blur: 0;
	--Outline: -1px -1px 0 var(--BG-Halo);

	--Green: #84c225;
	--Green-Halo: rgba(132, 194, 37, 0.5);
	--Red: #c22525;
	--Red-Halo: rgba(194, 37, 37, 0.5);
	--Purple: #8325c2;
	--Purple-Halo: rgba(131, 37, 194, 0.5);
	--Cyan: #00f0c8;
	--Cyan-Halo: rgb(0, 240, 200, 0.5);
	--Yellow: #ecf000;
	--Yellow-Halo: rgba(236, 240, 0, 0.5);
	--Blue: #00b0f0;
	--Blue-Halo: rgba(0, 176, 240, 0.5);
	--Pink: #ef5bc5;
	--Pink-Halo: rgba(239, 91, 197, 0.5);
	--Orange: #ffbf00;
	--Orange-Halo: rgba(255, 192, 0, 0.5);
	--Lime: #b6e000;
	--Lime-Halo: rgba(182, 224, 0, 0.5);
	--Dark: #0c0c0c;
	--Dark-Halo: rgba(12, 12, 12, 0.5);
	--Grey: #85858d;
	--Grey-Halo: rgba(133, 133, 141, 0.5);
	--Light: #efeff0;
	--Light-Halo: #efeff080;
	--Light-Halo-Ultra: rgba(239, 239, 240, 0.75);
	--Dark-Halo-Ultra: rgba(12, 12, 12, 0.75);

	--Success: var(--Green);
	--Info: var(--Blue);
	--Warning: var(--Orange);
	--Danger: var(--Red);

	--Free: #efeff0;
	--Free-Halo: rgba(239, 239, 240, 0.5);
	--Plus: var(--Lime);
	--Plus-Halo: var(--Lime-Halo);
	--Xtra: var(--Blue);
	--Xtra-Halo: var(--Blue-Halo);
	--Max: var(--Purple);
	--Max-Halo: var(--Purple-Halo);
	--Hub: var(--Red);
	--Hub-Halo: var(--Red-Halo);

	/* Theme colors fallback */
	--Primary: var(--Lime);
	--Primary-Halo: var(--Lime-Halo);
	--Secondary: var(--Purple);
	--Secondary-Halo: var(--Purple-Halo);
	--FG: var(--Light);
	--FG-Halo: var(--Light-Halo);
	--BG: var(--Dark);
	--BG-Halo: var(--Dark-Halo);
	--BG-Halo-Ultra: var(--Dark-Halo-Ultra);
}

::placeholder {
	color: var(--Grey-Halo);
}
body {
	background-color: var(--Dark);
	font-family: var(--Font) !important;
	color: var(--FG);
	overflow-y: auto;
	overflow-x: hidden;
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;

	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

body {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center top;
}

.about-body {
	margin: 1rem;
}

.main {
	overflow-y: auto;
	overflow-x: hidden;
	height: calc(100% - 2rem);
	width: 100%;
	left: 0;
	top: 4rem;
	bottom: 0;
	padding-bottom: 4rem;
	margin-top: 0;
}

.main-home {
	overflow-y: auto;
	overflow-x: hidden;
	height: calc(100% - 2rem);
	width: 100%;
	left: 0;
	top: 0rem;
	bottom: 0;
	padding-bottom: 4rem;
	margin-top: 0;
	position: fixed;
}

.pretty {
	font-family: var(--Font);
	border: none;
	margin: 0;
	padding: 1rem;
	white-space: pre-wrap;
	word-break: keep-all;
}

.spacer {
	margin: 1rem;
	content: '';
}
/* .uppy-Dashboard-FileCard-info {
	display: none !important;
	height: 0;
} */
.uppy-StatusBar-actionBtn--done {
	display: none !important;
	opacity: 0;
}

.uppy-StatusBar-actions {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
}

.uppy-StatusBar-progress .uppy-StatusBar.is-complete .uppy-StatusBar-progress {
	background-color: var(--Primary) !important;
}
.uppy-StatusBar.is-complete .uppy-StatusBar-statusIndicator {
	color: var(--Primary);
}
.uppy-Dashboard-inner {
	width: unset !important;
	height: unset !important;
}

@media only screen and (max-width: 1024px) {
	html body {
		width: 100vw;
		height: 100vh;
		overflow: hidden;
	}

	.main {
		height: calc(100vh - 2rem);
		overflow-x: hidden;
		margin-top: 0;
	}
}

.page-pad {
	padding: 1rem;
	padding-top: 6rem;
	padding-bottom: 4rem;
	height: calc(100vh - 8rem);
	overflow: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	text-transform: uppercase;
}

a {
	color: inherit;
	padding: 0;
	text-decoration: none;
	transition: var(--Transition);
}

a:hover {
	text-shadow: 0 0 20px var(--FG);
	transition: var(--Transition);
}

p {
	font-size: 16px;
	color: var(--FG);
}

code {
	font-family: 'DM Mono', monospace;
	font-size: 1rem;
}
.badge {
	width: 1rem;
	height: 1rem;
	min-width: 1rem;
	min-height: 1rem;
	text-align: center;
	align-items: center;
	vertical-align: middle;
	border-radius: 50%;
	content: '';
	display: inline-block;
	color: var(--FG);
	margin: var(--Padding);
}

.row {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	overflow-x: hidden;
}
.tall {
	height: auto;
	overflow: auto;
}

.sticky {
	position: sticky;
	margin: 4rem;
	z-index: 10;
}

.scroll {
	overflow-x: auto;
}

.row-tiles {
	align-items: stretch;
	justify-content: center;
	flex-direction: row;
}

.fill {
	display: flex;
	justify-content: stretch;
	align-items: stretch;
	overflow: auto;
}

.my {
	margin: var(--Padding) 0 var(--Padding) 0;
}
.even {
	justify-content: space-evenly;
}

.stretch {
	align-items: stretch;
	justify-content: stretch;
}

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

.label {
	width: 25%;
	min-width: 25%;
	text-align: right;
	margin-right: 1rem;
	color: var(--FG-Halo);
}

.label-string {
	color: var(--Secondary) !important;
}
.label-object {
	color: var(--Primary) !important;
}
.label-number {
	color: var(--Cyan) !important;
}
.label-integer {
	color: var(--Blue) !important;
}
.label-boolean {
	color: var(--Red) !important;
}

.static {
	margin: var(--Padding);
	color: var(--Grey);
}

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

.right {
	margin-left: auto;
}

.pr {
	padding-right: 1rem;
}

.mr {
	margin-right: 1rem;
}

.bottom {
	margin-top: auto;
	bottom: 0;
}

pre {
	margin: 2rem;
	padding: 1rem;
	border: 2px solid var(--FG-Halo);
	font-size: 1rem;
}

.logo {
	width: auto;
	height: 2rem;
	opacity: 0.66;
	transition: var(--Transition);
}

.logo:hover {
	opacity: 1;
	transition: var(--Transition);
	-webkit-filter: drop-shadow(0 0 var(--Glow-Size) -var(--Primary));
	filter: drop-shadow(0 0 var(--Glow-Size) var(--Primary));
}

.navitems {
	width: 100vw;
	text-align: center;
	justify-content: center;
	align-items: center;
	display: flex;
}

.navitem {
	display: block;
	font-size: 1.5rem;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 0.25rem;
	opacity: 0.95;
	transition: var(--Transition);
	text-shadow: 0 0 20px var(--BG);
	line-height: 1rem;
}

.highlight-row {
	background-color: var(--BG-Halo-Ultra) !important;
	border-left: 10px solid var(--Primary) !important;
}

.fas .fab .far {
	text-shadow: 0 0 var(--Glow-Size) var(--BG);
}

textarea {
	font: var(--Font);
	background-color: var(--BG-Halo);
	font-size: 1rem;
	line-height: 2rem;
	padding: var(--Padding);
	border: none;
	color: var(--FG);
	width: 66%;
	min-width: 66%;
	max-width: 66%;
	min-height: 2rem;
	border-radius: var(--Border-Radius);
	margin: var(--Padding);
}
@media only screen and (max-width: 1024px) {
	.logo {
		width: auto;
		height: 1rem;
		opacity: 0.66;
		transition: var(--Transition);
	}

	textarea {
		font: var(--Font);
		background-color: var(--BG-Halo);
		font-size: 1rem;
		line-height: 2rem;
		padding: var(--Padding);
		border: none;
		color: var(--FG);
		width: initial;
		min-width: 0;
		max-width: initial;
		min-height: 2rem;
		border-radius: var(--Border-Radius);
		margin: var(--Padding);
	}
}

.is_label:hover {
	scale: 1;
	opacity: 0.5;
	cursor: unset;
	transition: var(--Transition);
}

.navitem a {
	text-decoration: none;
}

.primary {
	background-color: var(--Primary);
}

.text-primary {
	color: var(--Primary);
}

.text-light {
	color: var(--FG-Halo);
}

.secondary {
	background-color: var(--Secondary);
}

.text-secondary {
	color: var(--Secondary);
}

.success {
	background-color: var(--Green);
}

.text-success {
	color: var(--Green);
}

.text-danger {
	color: var(--Red);
}
.info {
	background-color: var(--Blue);
}

.text-info {
	color: var(--Blue);
}

.warning {
	background-color: var(--Orange);
}

.danger {
	background-color: var(--Red);
}

.light {
	background-color: var(--FG);
	color: var(--BG);
}

.dark {
	background-color: var(--BG);
	color: var(--FG);
}

.hub {
	color: var(--Hub);
}

.free {
	color: var(--Free);
}

.plus {
	color: var(--Plus);
}

.xtra {
	color: var(--Xtra);
}

.max {
	color: var(--Max);
}

.hub:hover {
	text-shadow: 0 0 20px var(--Hub);
}

.free:hover {
	text-shadow: 0 0 20px var(--Free);
}

.plus:hover {
	text-shadow: 0 0 20px var(--Plus);
}

.xtra:hover {
	text-shadow: 0 0 20px var(--Xtra);
}

.max:hover {
	text-shadow: 0 0 20px var(--Max);
}

.focused {
	background-color: green;
	backdrop-filter: blur(20px);
}

.fusion .shepherd-button {
	color: var(--FG);
	font-size: 1rem;
	line-height: 0;
	white-space: nowrap;
	font-weight: 600 !important;
	font: var(--Font);
	display: flex;
	text-align: center;
	text-transform: uppercase;
	justify-content: space-around;
	align-items: center;
	flex-shrink: 0;
	transition: var(--Transition);
	margin: var(--Padding);
	border-radius: var(--Border-Radius);
	border: var(--Border-Thickness) solid var(--Primary-Halo);
	background: var(--BG-Halo);
	text-shadow: 0 0 1rem var(--BG);
	min-width: 4rem;
	min-height: 2rem;
	padding: var(--Padding);
}

.fusion .shepherd-button:hover {
	transition: var(--Transition);
	cursor: pointer;
	border: var(--Border-Thickness) solid var(--FG);
	background: var(--Primary);
}

.shepherd-content {
	padding: 1rem 2rem;
	outline: none;
	border: solid var(--Primary) var(--Border-Thickness);
	background-color: var(--BG-Halo-Ultra);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border-radius: var(--Border-Radius);
}

.shepherd-element {
	background: var(--BG-Halo-Ultra);
	border-radius: var(--Border-Radius);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	opacity: 0;
	outline: none;
	transition:
		opacity 0.3s,
		visibility 0.3s;
	visibility: hidden;
	z-index: 9999;
}

.shepherd-enabled.shepherd-element {
	opacity: 1;
	visibility: visible;
}

.shepherd-cancel-icon {
	background: transparent;
	border: none;
	color: var(--FG-Halo);
	cursor: pointer;
	font-size: 2em;
	font-weight: 400;
	margin: 0;
	padding: 0;
	transition: color 0.5s ease;
}

.shepherd-cancel-icon:hover {
	color: var(--FG);
}

.shepherd-has-title .shepherd-content .shepherd-cancel-icon {
	color: hsla(0, 0%, 50%, 0.75);
}

.shepherd-has-title .shepherd-content .shepherd-cancel-icon:hover {
	color: rgba(0, 0, 0, 0.75);
}

.shepherd-title {
	color: var(--FG);
	display: flex;
	flex: 1 0 auto;
	font-size: 1rem;
	font-weight: 400;
	margin: 0;
	padding: 0;
	font-weight: bold;
}

.shepherd-header {
	align-items: center;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	display: flex;
	justify-content: flex-end;
	line-height: 2em;
	padding: 0.75rem 0.75rem 0;
}
.shepherd-footer {
	display: flex;
	justify-content: center;
}

.shepherd-modal-overlay-container {
	height: 0;
	left: 0;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	position: fixed;
	top: 0;
	transition:
		all 0.3s ease-out,
		height 0ms 0.3s,
		opacity 0.3s 0ms;
	width: 100vw;
	z-index: 9997;
}

.shepherd-modal-overlay-container.shepherd-modal-is-visible {
	height: 100vh;
	opacity: 0.75;
	transform: translateZ(0);
	transition:
		all 0.3s ease-out,
		height 0s 0s,
		opacity 0.3s 0s;
}

.shepherd-modal-overlay-container.shepherd-modal-is-visible path {
	pointer-events: all;
	border: 0.125rem solid var(--Primary);
}

.shepherd-element[data-popper-reference-hidden]:not(.shepherd-centered) {
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}

.shepherd-element,
.shepherd-element *,
.shepherd-element :after,
.shepherd-element :before {
	box-sizing: border-box;
}

.shepherd-arrow,
.shepherd-arrow:before {
	height: 16px;
	position: absolute;
	width: 16px;
	z-index: -1;
}

.shepherd-arrow:before {
	background: var(--Primary);
	content: '';
	transform: rotate(45deg);
}

.shepherd-element[data-popper-placement^='top'] > .shepherd-arrow {
	bottom: -8px;
}

.shepherd-element[data-popper-placement^='bottom'] > .shepherd-arrow {
	top: -8px;
}

.shepherd-element[data-popper-placement^='left'] > .shepherd-arrow {
	right: -8px;
}

.shepherd-element[data-popper-placement^='right'] > .shepherd-arrow {
	left: -8px;
}

.shepherd-element.shepherd-centered > .shepherd-arrow {
	opacity: 0;
}

.shepherd-element.shepherd-has-title[data-popper-placement^='bottom'] > .shepherd-arrow:before {
	background-color: var(--Primary-Halo);
}

.shepherd-target-click-disabled.shepherd-enabled.shepherd-target,
.shepherd-target-click-disabled.shepherd-enabled.shepherd-target * {
	pointer-events: none;
}

.avatar {
	border-radius: 50%;
	width: 64px;
	height: 64px;
	margin: var(--Padding);
	padding: var(--Padding);
}
.avatar-small {
	border-radius: 50%;
	width: 32px;
	height: 32px;
	margin: var(--Padding);
	padding: var(--Padding);
}

.nav_start {
	align-items: center;
	float: left;
	margin-left: 0.25rem;
	display: flex;
}

.nav_end {
	align-items: center;
	float: right;
	margin-right: 0rem;
	display: flex;
}

button {
	background-color: transparent;
	border: none;
	outline: none;
	color: var(--FG);
	font: var(--Font);
	display: flex;
	text-align: left;
	text-transform: uppercase;
	align-items: start;
	flex-shrink: 0;
	transition: var(--Transition);
	text-shadow: 0 0 1rem var(--BG);
	padding: var(--Padding);
}
button:hover {
	cursor: pointer;
}

.naviconbutton {
	margin: 0.5rem;
	color: var(--FG-Halo);
	transition: var(--Transition);
}

.naviconbutton:hover {
	scale: 1.15;
	cursor: pointer;
	color: var(--FG);
	transition: var(--Transition);
}

/* Add Animation */
@keyframes animatetop {
	from {
		opacity: 0;
		backdrop-filter: blur(0rem);
		-webkit-backdrop-filter: blur(0rem);
	}

	to {
		opacity: 1;
		-webkit-backdrop-filter: blur(var(--Blur));
		-webkit-backdrop-filter: blur(var(--Blur));
	}
}

input,
textarea,
select {
	border-radius: 0;
	font-size: 1rem;
	padding: 0.5rem 1rem;
	font: var(--Font);
	border: var(--Border-Thickness) solid transparent;
	border-bottom: var(--Border-Thickness) solid var(--FG-Halo);
	text-align: left;
	background-color: var(--BG-Halo);
	color: var(--FG);
	width: 100%;
	min-width: 33%;
	max-width: 100%;
	margin: var(--Padding);
	transition: var(--Transition);
	border-radius: var(--Border-Radius);
}

input[type='checkbox'] {
	width: auto;
	min-width: auto;
	max-width: auto;
}
::-webkit-inner-spin-button {
	font-size: 1rem;
	width: 1rem;
	height: 1rem;
}

input:disabled,
textarea:disabled,
select:disabled {
	color: var(--FG-Halo);
	background-color: var(--BG-Halo-Ultra);
	border: none;
}

input:focus,
textarea:focus,
select:focus {
	outline: none;
	border: var(--Border-Thickness) solid var(--FG);
	transition: var(--Transition);
}

input:read-only,
textarea:read-only {
	color: var(--FG-Halo);
	background-color: var(--BG-Halo-Ultra);
	border: none;
}

option {
	padding: var(--Padding);
}

.no-bg {
	background-color: none !important;
}

.danger-bg-hover:hover {
	background-color: var(--Red);
	transition: var(--Transition);
}

.danger-fg {
	color: var(--Red);
}

.container {
	display: grid;
	gap: 200px;
	height: auto;
	overflow: hidden;
}

.page {
	position: absolute;
	width: 80%;
	overflow-y: scroll;
	overflow-x: hidden;
	height: calc(100% - 5rem);
	left: 20%;
	top: 0;
	padding-top: 3rem;
}
.page-full {
	position: absolute;
	width: 100%;
	overflow-y: scroll;
	height: calc(100% - 6rem);
	top: 0;
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.page-bg {
	backdrop-filter: blur(var(--Blur));
	background-color: var(--BG-Halo-Ultra);
}

.content {
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	background-color: var(--BG-Halo-Ultra);
	padding: 0;
	margin-bottom: 1rem;
	border-radius: var(--Border-Radius);
	overflow-y: auto;
	overflow-x: hidden;
	width: auto;
	left: 2vw;
	box-shadow: 0 0 var(--Glow-Size) var(--BG-Halo);
}

.basic-box {
	backdrop-filter: blur(var(--Blur));
	background-color: var(--BG-Halo-Ultra);
	padding: var(--Padding);
	margin: var(--Padding);
	border-radius: var(--Border-Radius);
	box-shadow: 0 0 var(--Glow-Size) var(--BG-Halo);
}

.editable[contenteditable='true']:focus {
	border: var(--Border-Radius) solid var(--FG-Halo);
	border-radius: var(--Border-Radius);
}

.image-small {
	width: auto;
	max-height: 2rem;
	object-fit: fill;
	display: flex;
	justify-content: center;
	align-items: center;
}

.image-thumb {
	max-width: 4rem;
	max-height: 2rem;
	object-fit: fill;
	display: flex;
	justify-content: center;
	align-items: center;
}

.center {
	align-items: center;
	justify-content: center;
	justify-items: center;
	margin: auto;
	text-align: center;
}

.justify {
	text-align: justify;
}

.stretch {
	justify-content: stretch;
}

.end {
	justify-content: end;
	align-items: center;
}

.even {
	align-items: center;
	justify-content: space-evenly;
	justify-items: center;
	margin: auto;
}

#mobile_sidebar_toggle {
	visibility: collapse;
	display: none;
}

::-moz-selection {
	background-color: var(--Primary);
}

::selection {
	background-color: var(--Primary);
}

[data-tg-tour] {
	scroll-margin: 30px 0;
}
.tg-backdrop {
	position: absolute;
	align-items: center;
	justify-content: center;
	display: none;
	z-index: 999;
	border-radius: var(--Border-Radius);
	box-shadow:
		rgba(33, 33, 33, 0.8) 0 0 1px 2px,
		rgba(33, 33, 33, 0.8) 0 0 0 1000vh;
	border: 0.15rem solid var(--Grey);
	top: 50vh;
	left: 50vw;
	width: 0;
	height: 0;
}
.tg-backdrop.tg-backdrop-animate {
	transition: all 250ms;
}
.tg-dialog {
	border-radius: var(--Border-Radius);
	animation-delay: 100ms;
	min-height: 120px;
	background: var(--BG);
	color: var(--FG);
	max-width: 340px;
	width: max-content;
	z-index: 9999;
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	padding: 0;
	font-size: 0.9rem;
}
.tg-dialog .tg-dialog-header {
	display: flex;
	align-items: center;
	padding: var(--Padding);
}
.tg-dialog .tg-dialog-header .tg-dialog-title {
	font-size: 1rem;
	font-weight: 700;
	padding: 0;
	margin: 0;
	padding-bottom: 0.5rem;
	color: var(--Primary);
	border-bottom: 0.15rem solid var(--Primary);
	width: 100%;
	text-align: center;
}
.tg-dialog .tg-dialog-header .tg-dialog-title + .tg-dialog-body {
	padding: var(--Padding);
}
.tg-dialog .tg-dialog-header .tg-dialog-close-btn {
	width: 12px;
	height: 12px;
	margin-left: 10px;
	opacity: 0.4;
	cursor: pointer;
	white-space: nowrap;
	background-color: var(--FG-Halo);
}
.tg-dialog .tg-dialog-header .tg-dialog-close-btn:hover {
	opacity: 8;
}
.tg-dialog .tg-dialog-header .tg-dialog-close-btn:focus {
	opacity: 1;
}
.tg-dialog .tg-dialog-header .tg-dialog-spinner {
	display: none;
	opacity: 0.4;
	margin-top: -1px;
	-webkit-animation: tg-spin 1s linear infinite;
	-moz-animation: tg-spin 1s linear infinite;
	-o-animation: tg-spin 1s linear infinite;
	animation: tg-spin 1s linear infinite;
}
@keyframes tg-spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(359deg);
	}
}
.tg-dialog .tg-dialog-progress-bar {
	background: #f1f1f1;
	height: 5px;
	display: block;
	margin-top: 18.75px;
	position: relative;
}
.tg-dialog .tg-dialog-progress-bar > .tg-bar {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 4px;
	background: #414144;
	height: 100%;
	display: block;
	transition: all 300ms;
}
.tg-dialog .tg-dialog-body {
	padding: var(--Padding);
	font-weight: 400;
}
.tg-dialog .tg-dialog-dots {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 15px 0;
	margin-bottom: 10px;
	border-top: 1px solid #dedee7;
	border-bottom: 1px solid #dedee7;
}
.tg-dialog .tg-dialog-dots > span.tg-dot {
	display: inline-block;
	width: 9px;
	height: 9px;
	background: var(--FG-Halo);
	border-radius: 12px;
	margin: 0 4px;
}
.tg-dialog .tg-dialog-dots > span.tg-dot.tg-dot-active {
	background: var(--Primary);
}
.tg-dialog .tg-dialog-footer {
	padding: 12.5px 25px 25px 25px;
	display: flex;
	align-items: center;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn {
	padding: 5px 10px;
	border: 0.15rem solid var(--FG);
	color: var(--FG);
	border-radius: 4px;
	font-weight: 500;
	font-size: 1rem;
	white-space: nowrap;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn + button {
	margin-left: auto;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn.disabled {
	pointer-events: none;
	color: var(--FG-Halo);
	border: 0.15rem solid var(--FG-Halo);
	opacity: 0.6;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn:hover {
	color: var(--Primary);
	border: 0.15rem solid var(--Primary);
	outline: none;
	box-shadow: none;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn:focus {
	outline: none;
	box-shadow: none;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn:active {
	color: #4655cb;
	background: #f1f2ff;
	border: 1px solid #5362d9;
	outline: none;
	box-shadow: none;
}
.tg-dialog .tg-dialog-footer .tg-dialog-footer-sup {
	margin: 0 auto;
	padding: 0 10px;
	text-align: center;
	line-height: 1;
}
.tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-step-progress {
	font-size: 0.78rem;
	font-weight: 700;
	margin: 0 auto;
	opacity: 0.4;
	letter-spacing: 1px;
	display: inline-block;
}
.tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-dialog-dots {
	padding: 0;
	margin: 0;
	border: none;
}
.tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-dialog-dots > span.tg-dot {
	width: 8px;
	height: 8px;
	margin: 0 3px;
}
.tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-dialog-dots + .tg-step-progress {
	margin-top: 10px;
	font-size: 0.68rem;
}
.tg-dialog .tg-arrow {
	position: absolute;
	background: #fff;
	width: 9px;
	height: 9px;
	border-radius: 1px;
	transform: rotate(45deg);
}
.tg-dialog.tg-dialog-fixed {
	transition: none;
	animation-delay: 0ms;
}
.tg-dialog.animate-position {
	transition: all 300ms;
}
.tg-dialog.tg-dialog-loading .tg-dialog-header .tg-dialog-title {
	opacity: 0.4;
}
.tg-dialog.tg-dialog-loading .tg-dialog-header .tg-dialog-close-btn {
	display: none;
}
.tg-dialog.tg-dialog-loading .tg-dialog-header .tg-dialog-spinner {
	display: inline-block;
}
.tg-dialog.tg-dialog-loading .tg-dialog-body {
	opacity: 0.4;
	pointer-events: none;
}
.tg-dialog.tg-dialog-loading .tg-dialog-footer {
	pointer-events: none;
	opacity: 0.4;
}

@media only screen and (max-width: 1024px) {
	:root {
		--Border-Radius: 0.5rem;
		width: 100vw;
	}

	html {
		margin: 0;
		padding: 0;
		font-size: 1rem;
	}

	body {
		padding: 0;
		margin: 0;
		background-size: auto 100vh;
		background-repeat: no-repeat;
		background-position: center top;
	}

	.container {
		display: grid;
		gap: 200px;
		height: auto;
		overflow: hidden;
	}

	.page {
		position: absolute;
		width: 100vw;
		overflow-y: scroll;
		height: calc(100% - 5rem);
		margin: 0;
		padding: 0;
		left: 0;
		right: 0;
		top: 3rem;
	}
	.page-full {
		position: absolute;
		min-width: 0;
		width: 100%;
		overflow-y: scroll;
		overflow-x: hidden;
		height: calc(100% - 3rem);
		left: 0%;
		top: 0rem;
		padding-top: 1rem;
	}

	.row {
		display: flex;
		flex-direction: row;
		align-items: center;
		width: 100%;
		overflow-x: hidden;
	}

	.row-tiles {
		flex-direction: column;
	}

	.rowcol {
		flex-direction: column;
	}

	.content {
		background-color: var(--BG-Halo-Ultra);
		margin: 0;
		margin-top: 2rem;
		padding: 0;
		border-radius: 0;
		white-space: normal;
		word-wrap: break-word;
	}

	.navbar {
		border-radius: 0;
		position: fixed;
		bottom: 0;
		background-color: var(--BG-Halo);
		border: none;
	}

	.navitems {
		width: 100vw;
		text-align: center;
		justify-content: space-evenly;
		align-items: center;
		display: flex;
	}

	.navitem {
		padding: 0;
		margin: 0.1rem;
		font-size: 1rem;
		opacity: 1;
	}

	.is_label {
		font-size: 1.5rem;
	}

	.logo {
		margin: 0;
		opacity: 1;
		height: 2rem;
	}

	a {
		padding: 0;
	}

	.label {
		width: 30%;
		font-size: 0.8rem;
	}

	.tooltip .tooltip_text {
		padding: 0;
		margin: none;
		display: none !important;
	}

	.modal {
		overflow: hidden;
	}

	.modal-content {
		position: relative;
		background-color: var(--BG-Halo);
		margin: auto;
		padding: 0;
		width: 100%;
		height: 100%;
		top: 0;
		border: none;
	}

	.modal-header {
		border-radius: 0;
	}

	.modal-footer {
		border-radius: 0;
	}

	#mobile_sidebar_toggle {
		visibility: visible;
		display: contents;
	}

	button {
		padding: 0;
	}
}

::-webkit-scrollbar {
	width: 0.5rem;
	background: var(--BG-Halo);
}
::-webkit-scrollbar:horizontal {
	height: 0.5rem;
}

::-webkit-scrollbar-track {
	background: var(--BG-Halo);
}

::-webkit-scrollbar-thumb {
	background: var(--FG-Halo);
}

::-webkit-scrollbar-thumb:hover {
	transition: var(--Transition);
	background: var(--FG);
	cursor: pointer;
}

.hidden {
	visibility: collapse !important;
	display: none !important;
}

.chart-container {
	font-family: var(--Font) !important;
}

.line-horizontal,
.line-vertical {
	display: none !important;
}

.vds-video-layout {
	--video-brand: var(--Primary);
	--video-controls-color: var(--FG);
	--video-focus-ring-color: rgb(78 156 246);
	--video-focus-ring: 0 0 0 1rem var(--media-focus-ring-color);
	--video-font-family: var(--Font);

	--video-bg: var(--BG);
	--video-border-radius: var(--Border-Radius);
	--video-border: 1px solid var(--BG-Halo);

	--video-fullscreen-chapter-title-font-size: 16px;
	--video-gesture-seek-width: 20%;

	/* Load. */
	--video-load-button-size: 4rem;
	--video-load-button-border: var(--color);
	--video-load-button-bg: var(--media-brand);
	--video-load-button-border-radius: 100%;

	--video-sm-load-button-size: 48px;

	/* Buttons. */
	--video-sm-button-size: 32px;
	--video-sm-play-button-size: 40px;
	--video-sm-play-button-transform: translateY(25%);
	--video-sm-play-button-bg: rgba(0 0 0 / 0.6);

	/* Sliders. */
	--video-slider-thumbnail-border: 1px solid var(--FG);
	--video-slider-thumbnail-border-radius: 2px;
	--video-volume-slider-max-width: 72px;

	--video-sm-slider-focus-track-height: 12px;

	/* Time. */
	--video-time-bg: unset;
	--video-fullscreen-time-font-size: 16px;

	--video-sm-time-font-size: 14px;
	--video-sm-start-duration-bg: rgba(0 0 0 / 0.64);
	--video-sm-start-duration-padding: 1rem;
	--video-sm-start-duration-color: var(--video: controls-color);

	/* Captions. */
	--video-captions-offset: 78px;
	--video-captions-transition: bottom 0.15s linear;

	--video-sm-captions-offset: 48px;
	--video-lg-fullscreen-captions-offset: 54px;

	--video-sm-captions-offset: 48px;

	/* Buffering. */
	--media-buffering-animation: vds-buffering-spin 1s linear infinite;
	--media-buffering-size: 96px;
	--media-buffering-track-color: var(--FG-Halo);
	--media-buffering-track-fill-color: var(--media-brand);
	--media-buffering-track-fill-offset: 50;
	--media-buffering-track-fill-opacity: 0.75;
	--media-buffering-track-fill-width: 9;
	--media-buffering-track-opacity: 0.25;
	--media-buffering-track-width: 8;
	--media-buffering-transition: opacity 200ms ease;
}

.vds-time-group {
	font-family: var(--Font);
	font-size: 1rem;
}

.vds-buffering-indicator,
.vds-buffering-spinner,
media-spinner {
	align-items: center;
	justify-content: center;
	display: flex;
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	position: absolute;
	width: 3rem;
	height: 3rem;
	left: calc(50% - 1.5rem);
	top: calc(50% - 1.5rem);
}

[data-media-provider] {
	width: 100vw;
}

.vds-controls {
	top: 0 !important;
	position: fixed;
	bottom: 0;
	left: 0;
}

.vds-play-icon {
	position: absolute;
	width: 3rem;
	height: 3rem;
	left: calc(50% - 1.5rem);
	top: calc(50% - 1.5rem);
}

.b24-form-control-label {
	padding-left: 2rem !important;
}

form {
	width: 100%;
	min-width: 0;
	min-height: 0;
}
