@property --angle {
  	syntax: "<angle>";
	initial-value: 0turn;
	inherits: true;
}

@keyframes rotate {
	to {
		--angle: 1turn;
	}
}

:root,
[data-bs-theme="light"] {
	--accent-colour: rgb(0, 128, 128);
	--accent-bg: #348cd4;
	--accent-bg-subtle: #cfe4f7;
	--accent-colour-trans: rgba(0, 128, 128,0.2);
	--zaccent-colour: #cc0000;
	--lightest-grey: rgb(225, 225, 225);
	--light-grey: rgba(144, 144, 144, 1);
	--medium-grey: rgba(96, 96, 96, 1);
	--dark-grey: rgba(13, 13, 13, 1);

	--bs-blue: #0d6efd;
	--bs-indigo: #6610f2;
	--bs-purple: #6f42c1;
	--bs-pink: #d63384;
	--bs-red: #dc3545;
	--bs-orange: #fd7e14;
	--bs-yellow: #ffc107;
	--bs-green: #198754;
	--bs-teal: #20c997;
	--bs-cyan: #0dcaf0;
	--bs-black: #000000;
	--bs-white: #ffffff;
	--bs-gray: #78829D;
	--bs-gray-dark: #252F4A;

	--bs-primary-active: #008BD9;
	--bs-secondary-active: #B5B5C3;
	--bs-light-active: #F1F1F2;
	--bs-success-active: #47BE7D;
	--bs-info-active: #5014D0;
	--bs-warning-active: #F1BC00;
	--bs-danger-active: #D9214E;
	--bs-dark-active: #050f29;
	--bs-primary-light: #F1FAFF;
	--bs-secondary-light: #F9F9F9;
	--bs-success-light: #E8FFF3;
	--bs-info-light: #F8F5FF;
	--bs-warning-light: #FFF8DD;
	--bs-danger-light: #FFF5F8;
	--bs-dark-light: #F1F1F2;


	--bs-gray-100: rgba(245, 248, 250, 1);
	--bs-gray-200: rgba(239, 242, 245, 1);
	--bs-gray-300: rgba(228, 230, 239, 1);
	--bs-gray-400: rgba(181, 181, 195, 1);
	--bs-gray-500: rgba(161, 165, 183, 1);
	--bs-gray-600: rgba(126, 130, 153, 1);
	--bs-gray-700: rgba(94, 98, 120, 1);
	--bs-gray-800: rgba(63, 66, 84, 1);
	--bs-gray-900: rgba(24, 28, 50, 1);

	--bs-text-muted: #A1A5B7;
	--bs-text-gray-100: #F5F8FA;
	--bs-text-gray-200: #EFF2F5;
	--bs-text-gray-300: #E4E6EF;
	--bs-text-gray-400: #B5B5C3;
	--bs-text-gray-500: #A1A5B7;
	--bs-text-gray-600: #7E8299;
	--bs-text-gray-700: #5E6278;
	--bs-text-gray-800: #3F4254;
	--bs-text-gray-900: #181C32;

	--bs-border-color: #EFF2F5;
	--bs-border-dashed-color: #E4E6EF;

	--bs-table-bg: #fff;

	--bs-body-color: #212529;
	--bs-link-color: #212529;
	--bs-body-bg: #ecf2f5;
	--card-bg: #fff;

	--header-height: 70px;
	--header-item-colour: rgba(255, 255, 255, 0.7);



	--animation-duration: 250ms;
	--animation-timing-curve: ease-in-out;

	--moduleblock-bg: #fff;
	--moduleblock-color: #444749;
	--moduleblock-accent-bg: #f7f7f7;

	--moduleblock-hue: 0;
	--moduleblock-saturation: 100%;
	--moduleblock-lightness: 40%;

	--box-shadow:  0px 10px 30px 0px rgba(50, 50, 50, 0.08);

	--bs-border-radius: .25rem;
	--border-radius: 0;/*.25rem;*/
	--border-radius-sm: .2rem;
	--border-radius-lg: .3rem;
	--border-radius-xl: 1rem;
	--border-radius-xxl: 2rem;
	--border-radius-pill: 50rem;

	--border-width: 0px;
	--border-style: solid;
	--border-color: #dee2e6;

	.card {
		--bs-card-spacer-y: 2rem;
		--bs-card-spacer-x: 2rem;
	}
}

[data-bs-theme="dark"] {
	color-scheme: dark;

	--accent-bg: #348cd4;
	--accent-bg-subtle: #348cd4;

	--bs-body-color: #dee2e6;
	--bs-link-color: #dee2e6;
	--bs-body-bg: #333A40;
	--card-bg: #444749;

	--bs-gray-100: rgba(27, 27, 41, 1);
	--bs-gray-200: rgba(43, 43, 64, 1);
	--bs-gray-300: rgba(50, 50, 72, 1);
	--bs-gray-400: rgba(71, 71, 97, 1);
	--bs-gray-500: rgba(86, 86, 116, 1);
	--bs-gray-600: rgba(109, 109, 128, 1);
	--bs-gray-700: rgba(146, 146, 159, 1);
	--bs-gray-800: rgba(205, 205, 222, 1);
	--bs-gray-900: rgba(255, 255, 255, 1);

	--bs-text-dark: #FFFFFF;
	--bs-text-muted: #565674;
	--bs-text-gray-100: #1b1b29;
	--bs-text-gray-200: #2B2B40;
	--bs-text-gray-300: #323248;
	--bs-text-gray-400: #474761;
	--bs-text-gray-500: #565674;
	--bs-text-gray-600: #6D6D80;
	--bs-text-gray-700: #92929F;
	--bs-text-gray-800: #CDCDDE;
	--bs-text-gray-900: #FFFFFF;

	--bs-white: #ffffff;
	--bs-light: #2B2B40;
	--bs-primary: #00A3FF;
	--bs-success: #50CD89;
	--bs-info: #7239EA;
	--bs-warning: #FFC700;
	--bs-danger: #F1416C;
	--bs-dark: #FFFFFF;
	--bs-secondary: #323248;
	--bs-primary-active: #008BD9;
	--bs-secondary-active: #474761;
	--bs-light-active: #323248;
	--bs-success-active: #47BE7D;
	--bs-info-active: #5014D0;
	--bs-warning-active: #F1BC00;
	--bs-danger-active: #D9214E;
	--bs-dark-active: white;
	--bs-primary-light: #212E48;
	--bs-success-light: #1C3238;
	--bs-info-light: #2F264F;
	--bs-warning-light: #392F28;
	--bs-danger-light: #3A2434;
	--bs-dark-light: #2B2B40;

	--bs-border-color: #2B2B40;
	--bs-border-dashed-color: #323248;

	/*--sidebar-bg: var(--bs-navbar-bg);
	--sidebar-border: var(--dark-grey);
	--sidebar-link-hover: var(--dark-grey);*/

	--moduleblock-bg: #444749;
	--moduleblock-color: var(--bs-navbar-link);
	--moduleblock-accent-bg: #797979;

	--border-color: #797979;



	.card {
		background-color: var(--card-bg);/*!important;*/
	}


	.debug-info {
		background-color: var(--medium-grey)!important;
		color: var(--bs-body-color)!important;
		border: 1px solid var(--dark-grey)!important;
	}


	.k-upload, .k-editor {
		border-radius: var(--bs-border-radius);
	}

	.k-list li span {
		color: var(--bs-body-color)!important;
	}


	.k-list,
	.k-editor,
	.k-toolbar,
	.k-popup,
	.k-editor,
	.k-content,
	.k-menu-group,
	.k-menu,
	.k-context-menu,
	.k-input,
	.k-picker,
	.k-upload,
	.k-upload .k-dropzone,
	.k-upload .k-upload-dropzone,
	.k-calendar,
	.k-calendar .k-header,
	.k-window,
	.k-window-titlebar {
		border-color: var(--bs-border-color)!important;
		color: var(--bs-body-color)!important;
		background-color: var(--bs-body-bg)!important;
	}

	.k-form,
	.k-label,
	.k-form-label {
		color: var(--bs-body-color)!important;
	}

}


*, *::before, *::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	color: var(--bs-body-color)!important;
	background-color: var(--bs-body-bg)!important;
	overflow-x: hidden;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0;
	margin-bottom: .75rem;
	font-weight: 500;
	line-height: 1.1
}


.h1, h1 {
	font-size: calc(1.35rem + 1.2vw)
}

@media (min-width:1200px) {
	.h1, h1 {
		font-size: 2rem
	}
}

.h2, h2 {
	font-size: calc(1.3125rem + .75vw)
}

@media (min-width:1200px) {
	.h2, h2 {
		font-size: 1.875rem
	}
}

.h3, h3 {
	font-size: calc(1.275rem + .3vw)
}

@media (min-width:1200px) {
	.h3,
	h3 {
		font-size: 1.5rem
	}
}

.h4, h4 {
	font-size: 1.125rem
}

.h5, h5 {
	font-size: .9375rem
}

.h6, h6 {
	font-size: .75rem
}

a {
	text-decoration: none;
	zcolor: var(--bs-link-color);
}

p {
	margin-top: 0;
	margin-bottom: 1rem
}


[hidden], .hidden {
	display: none!important
}

[type=search] {
	-webkit-appearance: textfield;
	outline-offset: -2px
}

#wrapper {
	height: 100%;
	width: 95%;
	margin: 0 auto;
}

.scrollable {
	padding: 0.5rem;
	overflow: scroll;
	height: 10rem;
	background: var(--bs-body-bg);
}

.menu-icon-btn {
	background: none;
	border: none;
	padding: 0;
}

.menu-icon {
	width: 25px;
	height: 25px;
	color: var(--medium-grey);
	cursor: pointer;
}

.menu-icon:hover {
	color: var(--dark-grey);
}

.alert h4 {
	text-transform: uppercase;
}

.alert-sm {

	--bs-alert-padding-x: 0.5rem;
	--bs-alert-padding-y: 0.5rem;
}

.alert-sm h4 {
	font-size: 1rem;
	margin-bottom: 0;
}


.form-group {
	padding-bottom: 1rem;
}

.form-check {
	display: inline-flex;
	min-height: 1.5rem;
	padding-left: 1.5em;
	gap: 0.5rem;
}

.form-check-label {
	margin-right: .5rem;
}

.k-rounded-md {
	border-radius: 0.25rem;
}

.k-switch {
	align-self: center;
}

.k-upload {
	border-color: #dee2e6;
	color: #212529;
	background-color: #ffffff;
}



.fade-in {
	animation: fadeIn 0.5s ease-in forwards;
	opacity: 0;
}




.fade-container {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out;
}

.fade-container.show {
	opacity: 1;
	visibility: visible;
}


.form-select.k-multiselect {
	background-image: none !important;
}

/* Dark overlay behind the dropdown */
.dropdown-backdrop {
	position: fixed;
	inset: 0; /* top/right/bottom/left: 0 */
	background: rgba(0, 0, 0, 0.5);
	z-index: 1040; /* below the dropdown, above the rest of page */
}

/* Make sure your dropdown menu appears above the backdrop */
.dropdown-menu {
	z-index: 1050;
}




.checkbox-glyph-answer,
.radio-glyph-answer {
	display: inline-block;
	box-sizing: border-box;
	min-width: 100px;
	max-width: 200px;
	margin: 0 10px 10px 0;
	vertical-align: top;
	font-size: 22px;
	text-align: center;
}

.checkbox-glyph-answer label,
.radio-glyph-answer label {
	border-radius: var(--bs-border-radius);
	border: var(--bs-border-width) solid var(--bs-border-color);
	background: var(--bs-card-bg);
	box-sizing: border-box;
	display: block;
	height: 100%;
	width: 100%;
	padding: 10px;
	cursor: pointer;
	opacity: 0.75;
	transition: all 0.5s ease-in-out;
	text-transform: uppercase;
	font-size: 0.8rem;
	word-wrap: normal;
}

.checkbox-glyph-answer label i,
.radio-glyph-answer label i {
	width: 100%;
	font-size: 2rem;
	padding-bottom: 0.5rem;
	max-height: 75px;
}

.checkbox-glyph-answer label:hover,
.checkbox-glyph-answer label:focus,
.checkbox-glyph-answer label:active,
.radio-glyph-answer label:hover,
.radio-glyph-answer label:focus,
.radio-glyph-answer label:active {
	border: var(--bs-border-width) solid var(--bs-info-border-subtle);
}

/* Input style */
.checkbox-glyph-answer input[type=checkbox],
.radio-glyph-answer input[type=radio] {
	opacity: 0;
	zwidth: 0;
	zheight: 0;
	margin-top:-10px;
	position: absolute;
}

.checkbox-glyph-answer input[type=checkbox]:active ~ label,
.radio-glyph-answer input[type=radio]:active ~ label {
	opacity: 1;
}

.checkbox-glyph-answer input[type=checkbox]:checked ~ label,
.radio-glyph-answer input[type=radio]:checked ~ label {
	opacity: 1;
	background: var(--bs-info-bg-subtle);
	border: var(--bs-border-width) solid var(--bs-info-border-subtle);
}


.checkbox-glyph-answer label:has(+ input[type=checkbox]:checked),
.radio-glyph-answer label:has(+ input[type=radio]:checked) {
	opacity: 1;
	background: var(--bs-info-bg-subtle);
	border: var(--bs-border-width) solid var(--bs-info-border-subtle);
}









@keyframes fadeIn {
	to {
		opacity: 1;
	}
}

.spinner-border {
	width: 1.5rem;
	height: 1.5rem;
}


label.required::after {
	content: '*';
	margin-left: 4px;
	color: red;
	font-weight: normal;
}

.button-bar {
	padding: 0.5em 0;
	text-align: right;
}

.button-bar a.k-button+a.k-button,
.button-bar a.k-button+input,
.button-bar a.k-button+button,
.button-bar a.btn+button,
.button-bar input+a.k-button,
.button-bar input+input,
.button-bar input+button,
.button-bar button+a.k-button,
.button-bar button+button,
.button-bar button.k-button+button.k-button,
.button-bar button+input {
	margin-left: 1rem;
}



.page-container {
	zdisplay: flex;
}



.text-dark {
	color: var(--bs-text-dark) !important;
}

.card-title, .header-title {
	font-size: .9rem;
	margin: 0 0 7px 0;
	font-weight: 600;
}

.bg-accent {
	--bs-bg-opacity: 1;
	background-color: var(--accent-bg)!important;
}
.bg-accent-subtle {
	--bs-bg-opacity: 1;
	background-color: var(--accent-bg-subtle)!important;
}



.btn:not(.btn-shadow):not(.shadow):not(.shadow-sm):not(.shadow-lg):not(.shadow-xs) {
	box-shadow: none;
}
.btn-check:checked + .btn.btn-outline.btn-outline-dashed, .btn-check:active + .btn.btn-outline.btn-outline-dashed, .btn.btn-outline.btn-outline-dashed:focus:not(.btn-active), .btn.btn-outline.btn-outline-dashed:hover:not(.btn-active), .btn.btn-outline.btn-outline-dashed:active:not(.btn-active), .btn.btn-outline.btn-outline-dashed.active, .btn.btn-outline.btn-outline-dashed.show, .show > .btn.btn-outline.btn-outline-dashed {
	border-color: var(--bs-primary);
}

.btn-check:checked + .btn.btn-active-light-primary, .btn-check:active + .btn.btn-active-light-primary, .btn.btn-active-light-primary:focus:not(.btn-active), .btn.btn-active-light-primary:hover:not(.btn-active), .btn.btn-active-light-primary:active:not(.btn-active), .btn.btn-active-light-primary.active, .btn.btn-active-light-primary.show, .show > .btn.btn-active-light-primary {
	color: var(--bs-primary);
	border-color: var(--bs-primary-light);
	background-color: var(--bs-primary-light) !important;
}
.btn.btn-outline.btn-outline-dashed {
	border-width: 1px;
	border-style: dashed;
}
.btn-check:checked + .btn, :not(.btn-check) + .btn:active, .btn:first-child:active, .btn.active, .btn.show {
	color: var(--bs-btn-active-color);
	background-color: var(--bs-btn-active-bg);
	border-color: var(--bs-btn-active-border-color);
	box-shadow: var(--bs-btn-active-shadow);
}
.btn.btn-outline-dashed {
	border: 1px dashed var(--bs-gray-300);
}

.btn-light {
	--bs-btn-color: #000000;
	--bs-btn-bg: #F9F9F9;
	--bs-btn-border-color: #F9F9F9;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #d4d4d4;
	--bs-btn-hover-border-color: #c7c7c7;
	--bs-btn-focus-shadow-rgb: 212, 212, 212;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #c7c7c7;
	--bs-btn-active-border-color: #bbbbbb;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #000000;
	--bs-btn-disabled-bg: #F9F9F9;
	--bs-btn-disabled-border-color: #F9F9F9;
}

.btn-primary {
	--bs-btn-color: #fff;
	--bs-btn-bg: #00A3FF;
	--bs-btn-border-color: #00A3FF;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #26b1ff;
	--bs-btn-hover-border-color: #1aacff;
	--bs-btn-focus-shadow-rgb: 0, 139, 217;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #33b5ff;
	--bs-btn-active-border-color: #1aacff;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #fff;
	--bs-btn-disabled-bg: #00A3FF;
	--bs-btn-disabled-border-color: #00A3FF;
}

.btn-secondary {
	--bs-btn-color: #000000;
	--bs-btn-bg: #DBDFE9;
	--bs-btn-border-color: #DBDFE9;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #e0e4ec;
	--bs-btn-hover-border-color: #dfe2eb;
	--bs-btn-focus-shadow-rgb: 186, 190, 198;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #e2e5ed;
	--bs-btn-active-border-color: #dfe2eb;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #000000;
	--bs-btn-disabled-bg: #DBDFE9;
	--bs-btn-disabled-border-color: #DBDFE9;
}

.btn-success {
	--bs-btn-color: #000000;
	--bs-btn-bg: #50CD89;
	--bs-btn-border-color: #50CD89;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #6ad59b;
	--bs-btn-hover-border-color: #62d295;
	--bs-btn-focus-shadow-rgb: 68, 174, 116;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #73d7a1;
	--bs-btn-active-border-color: #62d295;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #000000;
	--bs-btn-disabled-bg: #50CD89;
	--bs-btn-disabled-border-color: #50CD89;
}

.btn-info {
	--bs-btn-color: #ffffff;
	--bs-btn-bg: #7239EA;
	--bs-btn-border-color: #7239EA;
	--bs-btn-hover-color: #ffffff;
	--bs-btn-hover-bg: #6130c7;
	--bs-btn-hover-border-color: #5b2ebb;
	--bs-btn-focus-shadow-rgb: 135, 87, 237;
	--bs-btn-active-color: #ffffff;
	--bs-btn-active-bg: #5b2ebb;
	--bs-btn-active-border-color: #562bb0;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #ffffff;
	--bs-btn-disabled-bg: #7239EA;
	--bs-btn-disabled-border-color: #7239EA;
}

.btn-warning {
	--bs-btn-color: #000000;
	--bs-btn-bg: #FFC700;
	--bs-btn-border-color: #FFC700;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #ffcf26;
	--bs-btn-hover-border-color: #ffcd1a;
	--bs-btn-focus-shadow-rgb: 217, 169, 0;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #ffd233;
	--bs-btn-active-border-color: #ffcd1a;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #000000;
	--bs-btn-disabled-bg: #FFC700;
	--bs-btn-disabled-border-color: #FFC700;
}

.btn-danger {
	--bs-btn-color: #000000;
	--bs-btn-bg: #F1416C;
	--bs-btn-border-color: #F1416C;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #f35e82;
	--bs-btn-hover-border-color: #f2547b;
	--bs-btn-focus-shadow-rgb: 205, 55, 92;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #f46789;
	--bs-btn-active-border-color: #f2547b;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #000000;
	--bs-btn-disabled-bg: #F1416C;
	--bs-btn-disabled-border-color: #F1416C;
}

.btn-dark {
	--bs-btn-color: #ffffff;
	--bs-btn-bg: #071437;
	--bs-btn-border-color: #071437;
	--bs-btn-hover-color: #ffffff;
	--bs-btn-hover-bg: #2c3755;
	--bs-btn-hover-border-color: #202c4b;
	--bs-btn-focus-shadow-rgb: 44, 55, 85;
	--bs-btn-active-color: #ffffff;
	--bs-btn-active-bg: #39435f;
	--bs-btn-active-border-color: #202c4b;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #ffffff;
	--bs-btn-disabled-bg: #071437;
	--bs-btn-disabled-border-color: #071437;
}

.btn-outline-light {
	--bs-btn-color: #F9F9F9;
	--bs-btn-border-color: #F9F9F9;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #F9F9F9;
	--bs-btn-hover-border-color: #F9F9F9;
	--bs-btn-focus-shadow-rgb: 249, 249, 249;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #F9F9F9;
	--bs-btn-active-border-color: #F9F9F9;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #F9F9F9;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #F9F9F9;
	--bs-gradient: none;
}

.btn-outline-primary {
	--bs-btn-color: #00A3FF;
	--bs-btn-border-color: #00A3FF;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #00A3FF;
	--bs-btn-hover-border-color: #00A3FF;
	--bs-btn-focus-shadow-rgb: 0, 163, 255;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #00A3FF;
	--bs-btn-active-border-color: #00A3FF;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #00A3FF;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #00A3FF;
	--bs-gradient: none;
}

.btn-outline-secondary {
	--bs-btn-color: #DBDFE9;
	--bs-btn-border-color: #DBDFE9;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #DBDFE9;
	--bs-btn-hover-border-color: #DBDFE9;
	--bs-btn-focus-shadow-rgb: 219, 223, 233;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #DBDFE9;
	--bs-btn-active-border-color: #DBDFE9;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #DBDFE9;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #DBDFE9;
	--bs-gradient: none;
}

.btn-outline-success {
	--bs-btn-color: #50CD89;
	--bs-btn-border-color: #50CD89;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #50CD89;
	--bs-btn-hover-border-color: #50CD89;
	--bs-btn-focus-shadow-rgb: 80, 205, 137;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #50CD89;
	--bs-btn-active-border-color: #50CD89;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #50CD89;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #50CD89;
	--bs-gradient: none;
}

.btn-outline-info {
	--bs-btn-color: #7239EA;
	--bs-btn-border-color: #7239EA;
	--bs-btn-hover-color: #ffffff;
	--bs-btn-hover-bg: #7239EA;
	--bs-btn-hover-border-color: #7239EA;
	--bs-btn-focus-shadow-rgb: 114, 57, 234;
	--bs-btn-active-color: #ffffff;
	--bs-btn-active-bg: #7239EA;
	--bs-btn-active-border-color: #7239EA;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #7239EA;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #7239EA;
	--bs-gradient: none;
}

.btn-outline-warning {
	--bs-btn-color: #FFC700;
	--bs-btn-border-color: #FFC700;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #FFC700;
	--bs-btn-hover-border-color: #FFC700;
	--bs-btn-focus-shadow-rgb: 255, 199, 0;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #FFC700;
	--bs-btn-active-border-color: #FFC700;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #FFC700;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #FFC700;
	--bs-gradient: none;
}

.btn-outline-danger {
	--bs-btn-color: #F1416C;
	--bs-btn-border-color: #F1416C;
	--bs-btn-hover-color: #000000;
	--bs-btn-hover-bg: #F1416C;
	--bs-btn-hover-border-color: #F1416C;
	--bs-btn-focus-shadow-rgb: 241, 65, 108;
	--bs-btn-active-color: #000000;
	--bs-btn-active-bg: #F1416C;
	--bs-btn-active-border-color: #F1416C;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #F1416C;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #F1416C;
	--bs-gradient: none;
}

.btn-outline-dark {
	--bs-btn-color: #071437;
	--bs-btn-border-color: #071437;
	--bs-btn-hover-color: #ffffff;
	--bs-btn-hover-bg: #071437;
	--bs-btn-hover-border-color: #071437;
	--bs-btn-focus-shadow-rgb: 7, 20, 55;
	--bs-btn-active-color: #ffffff;
	--bs-btn-active-bg: #071437;
	--bs-btn-active-border-color: #071437;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #071437;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #071437;
	--bs-gradient: none;
}

.btn-link {
	--bs-btn-font-weight: 400;
	--bs-btn-color: var(--bs-link-color);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: transparent;
	--bs-btn-hover-color: var(--bs-link-hover-color);
	--bs-btn-hover-border-color: transparent;
	--bs-btn-active-color: var(--bs-link-hover-color);
	--bs-btn-active-border-color: transparent;
	--bs-btn-disabled-color: var(--bs-gray-600);
	--bs-btn-disabled-border-color: transparent;
	--bs-btn-box-shadow: 0 0 0 #000;
	--bs-btn-focus-shadow-rgb: 0, 139, 217;
	text-decoration: none;
}

/*.btn-gradient {
	border: 2px solid transparent;
	border-radius: var(--bs-border-radius);
	background: linear-gradient(rgba(255 255 255 / 1)) padding-box,
				conic-gradient(from var(--angle),
					rgba(42 123 155 / 1),
					rgba(87 199 133 / 1),
					rgba(42 123 155 / 1)
				) border-box;
	animation: rotate 1s linear 5;
}

.btn-gradient:hover,
.btn-gradient:focus-visible {
	background-color: transparent;
	border-color: transparent;
	animation: rotate 1s linear infinite;
}*/

.canvas { padding: 10px !important; }





/* BG */

.bg-gray-100 {
	background-color: var(--bs-gray-100);
}
.bg-gray-200 {
	background-color: var(--bs-gray-200);
}
.bg-gray-300 {
	background-color: var(--bs-gray-300);
}
.bg-gray-400 {
	background-color: var(--bs-gray-400);
}
.bg-gray-500 {
	background-color: var(--bs-gray-500);
}
.bg-gray-600 {
	background-color: var(--bs-gray-600);
}
.bg-gray-700 {
	background-color: var(--bs-gray-700);
}
.bg-gray-800 {
	background-color: var(--bs-gray-800);
}
.bg-gray-900 {
	background-color: var(--bs-gray-900);
}

/* EO BG */
/* TEXT */
.text-muted {
	zcolor: var(--bs-text-muted)!important
}

.text-hover-muted {
	transition: color .2s ease
}

.text-hover-muted i {
	transition: color .2s ease
}

.text-hover-muted:hover {
	transition: color .2s ease;
	color: var(--bs-text-muted)!important
}

.text-hover-muted:hover i {
	transition: color .2s ease;
	color: var(--bs-text-muted)!important
}

.text-hover-muted:hover .svg-icon {
	color: var(--bs-text-muted)!important
}

.text-active-muted {
	transition: color .2s ease
}

.text-active-muted i {
	transition: color .2s ease
}

.text-active-muted.active {
	transition: color .2s ease;
	color: var(--bs-text-muted)!important
}

.text-active-muted.active i {
	transition: color .2s ease;
	color: var(--bs-text-muted)!important
}

.text-active-muted.active .svg-icon {
	color: var(--bs-text-muted)!important
}

.text-gray-100 {
	color: var(--bs-text-gray-100)!important
}

.text-hover-gray-100 {
	transition: color .2s ease
}

.text-hover-gray-100 i {
	transition: color .2s ease
}

.text-hover-gray-100:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-100)!important
}

.text-hover-gray-100:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-100)!important
}

.text-hover-gray-100:hover .svg-icon {
	color: var(--bs-text-gray-100)!important
}

.text-active-gray-100 {
	transition: color .2s ease
}

.text-active-gray-100 i {
	transition: color .2s ease
}

.text-active-gray-100.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-100)!important
}

.text-active-gray-100.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-100)!important
}

.text-active-gray-100.active .svg-icon {
	color: var(--bs-text-gray-100)!important
}

.text-gray-200 {
	color: var(--bs-text-gray-200)!important
}

.text-hover-gray-200 {
	transition: color .2s ease
}

.text-hover-gray-200 i {
	transition: color .2s ease
}

.text-hover-gray-200:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-200)!important
}

.text-hover-gray-200:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-200)!important
}

.text-hover-gray-200:hover .svg-icon {
	color: var(--bs-text-gray-200)!important
}

.text-active-gray-200 {
	transition: color .2s ease
}

.text-active-gray-200 i {
	transition: color .2s ease
}

.text-active-gray-200.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-200)!important
}

.text-active-gray-200.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-200)!important
}

.text-active-gray-200.active .svg-icon {
	color: var(--bs-text-gray-200)!important
}

.text-gray-300 {
	color: var(--bs-text-gray-300)!important
}

.text-hover-gray-300 {
	transition: color .2s ease
}

.text-hover-gray-300 i {
	transition: color .2s ease
}

.text-hover-gray-300:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-300)!important
}

.text-hover-gray-300:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-300)!important
}

.text-hover-gray-300:hover .svg-icon {
	color: var(--bs-text-gray-300)!important
}

.text-active-gray-300 {
	transition: color .2s ease
}

.text-active-gray-300 i {
	transition: color .2s ease
}

.text-active-gray-300.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-300)!important
}

.text-active-gray-300.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-300)!important
}

.text-active-gray-300.active .svg-icon {
	color: var(--bs-text-gray-300)!important
}

.text-gray-400 {
	color: var(--bs-text-gray-400)!important
}

.text-hover-gray-400 {
	transition: color .2s ease
}

.text-hover-gray-400 i {
	transition: color .2s ease
}

.text-hover-gray-400:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-400)!important
}

.text-hover-gray-400:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-400)!important
}

.text-hover-gray-400:hover .svg-icon {
	color: var(--bs-text-gray-400)!important
}

.text-active-gray-400 {
	transition: color .2s ease
}

.text-active-gray-400 i {
	transition: color .2s ease
}

.text-active-gray-400.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-400)!important
}

.text-active-gray-400.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-400)!important
}

.text-active-gray-400.active .svg-icon {
	color: var(--bs-text-gray-400)!important
}

.text-gray-500 {
	color: var(--bs-text-gray-500)!important
}

.text-hover-gray-500 {
	transition: color .2s ease
}

.text-hover-gray-500 i {
	transition: color .2s ease
}

.text-hover-gray-500:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-500)!important
}

.text-hover-gray-500:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-500)!important
}

.text-hover-gray-500:hover .svg-icon {
	color: var(--bs-text-gray-500)!important
}

.text-active-gray-500 {
	transition: color .2s ease
}

.text-active-gray-500 i {
	transition: color .2s ease
}

.text-active-gray-500.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-500)!important
}

.text-active-gray-500.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-500)!important
}

.text-active-gray-500.active .svg-icon {
	color: var(--bs-text-gray-500)!important
}

.text-gray-600 {
	color: var(--bs-text-gray-600)!important
}

.text-hover-gray-600 {
	transition: color .2s ease
}

.text-hover-gray-600 i {
	transition: color .2s ease
}

.text-hover-gray-600:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-600)!important
}

.text-hover-gray-600:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-600)!important
}

.text-hover-gray-600:hover .svg-icon {
	color: var(--bs-text-gray-600)!important
}

.text-active-gray-600 {
	transition: color .2s ease
}

.text-active-gray-600 i {
	transition: color .2s ease
}

.text-active-gray-600.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-600)!important
}

.text-active-gray-600.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-600)!important
}

.text-active-gray-600.active .svg-icon {
	color: var(--bs-text-gray-600)!important
}

.text-gray-700 {
	color: var(--bs-text-gray-700)!important
}

.text-hover-gray-700 {
	transition: color .2s ease
}

.text-hover-gray-700 i {
	transition: color .2s ease
}

.text-hover-gray-700:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-700)!important
}

.text-hover-gray-700:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-700)!important
}

.text-hover-gray-700:hover .svg-icon {
	color: var(--bs-text-gray-700)!important
}

.text-active-gray-700 {
	transition: color .2s ease
}

.text-active-gray-700 i {
	transition: color .2s ease
}

.text-active-gray-700.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-700)!important
}

.text-active-gray-700.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-700)!important
}

.text-active-gray-700.active .svg-icon {
	color: var(--bs-text-gray-700)!important
}

.text-gray-800 {
	color: var(--bs-text-gray-800)!important
}

.text-hover-gray-800 {
	transition: color .2s ease
}

.text-hover-gray-800 i {
	transition: color .2s ease
}

.text-hover-gray-800:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-800)!important
}

.text-hover-gray-800:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-800)!important
}

.text-hover-gray-800:hover .svg-icon {
	color: var(--bs-text-gray-800)!important
}

.text-active-gray-800 {
	transition: color .2s ease
}

.text-active-gray-800 i {
	transition: color .2s ease
}

.text-active-gray-800.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-800)!important
}

.text-active-gray-800.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-800)!important
}

.text-active-gray-800.active .svg-icon {
	color: var(--bs-text-gray-800)!important
}

.text-gray-900 {
	color: var(--bs-text-gray-900)!important
}

.text-hover-gray-900 {
	transition: color .2s ease
}

.text-hover-gray-900 i {
	transition: color .2s ease
}

.text-hover-gray-900:hover {
	transition: color .2s ease;
	color: var(--bs-text-gray-900)!important
}

.text-hover-gray-900:hover i {
	transition: color .2s ease;
	color: var(--bs-text-gray-900)!important
}

.text-hover-gray-900:hover .svg-icon {
	color: var(--bs-text-gray-900)!important
}

.text-active-gray-900 {
	transition: color .2s ease
}

.text-active-gray-900 i {
	transition: color .2s ease
}

.text-active-gray-900.active {
	transition: color .2s ease;
	color: var(--bs-text-gray-900)!important
}

.text-active-gray-900.active i {
	transition: color .2s ease;
	color: var(--bs-text-gray-900)!important
}

.text-active-gray-900.active .svg-icon {
	color: var(--bs-text-gray-900)!important
}
/* EO TEXT */


main.content {
	height: calc(100% - var(--header-height));
}


main.content[data-with-toolbar] {
	padding: 0 0 0 0;
}

main.content .container {
	/*calc(100vw - calc(var(--sidebar-closed-width) + 1rem + 1px));*/
	/* background-color: #f5f8fa; */
	height: calc(100% - var(--header-height));
	margin-left: var(--sidebar-closed-width);
	max-width: calc(100% - var(--sidebar-closed-width));
	padding:0.75rem 1.25em;
	transition: margin-left var(--animation-duration) var(--animation-timing-curve), background-color var(--animation-duration) var(--animation-timing-curve);
}

main.content.open .container {
	margin-left: var(--sidebar-open-width);
	max-width: calc(100% - var(--sidebar-open-width));
	/*max-width: calc(100vw - calc(var(--sidebar-open-width) + 1rem + 1px));*/
}

main.content .toolbar {
	/* box-shadow: 0 10px 30px 0 rgb(82 63 105 / 5%); */
	/* z-index: 99; */
	align-items: center;
	background-color: rgba(0, 0, 0, 0.9);
	border-bottom: 1px solid var(--lightest-grey);
	border-top: 0;
	display: flex;
	height: 50px;
	left: var(--sidebar-closed-width);
	position: fixed;
	right: 0;
	top: 40px;
	transition: left var(--animation-duration) var(--animation-timing-curve);
	width:100%;
}

main.content.open .toolbar {
	left: var(--sidebar-open-width);
}


.page-title-box .page-title {
	margin: 0;
	line-height: 65px;
	text-transform: uppercase;
	font-weight: 600;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.page-title-box .page-title-right {
	float: right;
	margin-top: 20px;
}


a.module-block.card {
	margin-bottom: 0;
}

.module-block {
	border: 1px solid rgba(0,0,0,.125);/*1px solid #f7f7f7;*/
	background-color: var(--moduleblock-bg);
	color: var(--moduleblock-color);
	box-shadow: var(--box-shadow);
	border-radius: 5px;
	overflow: hidden;
	padding: 30px;
	text-decoration: none!important;
}

.module-block:before {
	position: absolute;
	top: -65px;
	right: -65px;
	z-index: 0;
	content: " ";
	width: 150px;
	height: 150px;
	background: var(--moduleblock-accent-bg);
	border-bottom-left-radius: 0;
	transform: rotate(45deg);
	border-radius: 50%;

	transition: all 400ms ease-in-out;
	-moz-transition: all 400ms ease-in-out;
	-ms-transition: all 400ms ease-in-out;
	-webkit-transition: all 400ms ease-in-out;
	-o-transition: all 400ms ease-in-out
}

/*.module-block:before {
	position: absolute;
	top: -42px;
	right: -100px;
	z-index: 0;
	content: " ";
	width: 250px;
	height: 120px;
	background: #f7f7f7;
	border-bottom-left-radius: 0;
	transform: rotate(45deg);

	transition: all 400ms ease-in-out;
	-moz-transition: all 400ms ease-in-out;
	-ms-transition: all 400ms ease-in-out;
	-webkit-transition: all 400ms ease-in-out;
	-o-transition: all 400ms ease-in-out
}*/

.module-block:hover:before {
	background: hsl(var(--moduleblock-hue), var(--moduleblock-saturation), var(--moduleblock-lightness));
}

.module-block .service-icon {
	position: absolute;
	top: 18px;
	right: 18px;
	z-index: 1;
	text-align: center
}

.module-block .access-icon {
	position: absolute;
	bottom: 5px;
	right: 10px;
	z-index: 1;
	text-align: center
}

.module-block .service-icon i {
	color: hsl(var(--moduleblock-hue), var(--moduleblock-saturation), var(--moduleblock-lightness));
	font-size: 2rem;
	line-height: normal;
	transition: all 400ms ease-in-out;
	-moz-transition: all 400ms ease-in-out;
	-ms-transition: all 400ms ease-in-out;
	-webkit-transition: all 400ms ease-in-out;
	-o-transition: all 400ms ease-in-out;
	margin-bottom: 0
}

.module-block:hover .service-icon i {
	color: #fff
}

.module-block .service-desc {
	position: relative
}

.module-block .service-desc h4 {
	margin-bottom: 8px;
	font-size: 18px;
	font-weight: 600
}

.module-block .service-desc h5 {
	margin-bottom: 5px;
	font-size: 0.75rem;
	font-weight: 500;
	padding-right: 50px;
}

.module-block .service-desc h4:after {
	content: '';
	display: block;
	width: 80px;
	height: 2px;
	background: hsl(var(--moduleblock-hue), var(--moduleblock-saturation), var(--moduleblock-lightness));
	margin-top: 10px;
	margin-bottom: 15px;
	-moz-transition-duration: .4s;
	-ms-transition-duration: .4s;
	-webkit-transition-duration: .4s;
	-o-transition-duration: .4s;
	transition-duration: .4s
}

.module-block .service-desc p {
	margin-top: 25px;
	padding-right: 50px;
	margin-bottom: 0;
	font-size: 0.75rem;
}

.module-block .author_info {
	display:block;

	margin-top: 25px;
}

.module-block .service-desc ul {
	margin: 0;
	margin-top: 10px;
	padding-right: 50px;
	font-size: 0.75rem;
}

.module-block .service-desc ul li {
	margin: 0;
}


.module-block.red    { --moduleblock-hue: 0; }
.module-block.orange { --moduleblock-hue: 40; --moduleblock-saturation: 85%; --moduleblock-lightness: 60%; }
.module-block.yellow { --moduleblock-hue: 55; --moduleblock-saturation: 85%; --moduleblock-lightness: 60%; }
.module-block.green  { --moduleblock-hue: 160; --moduleblock-saturation: 80%; }
.module-block.teal   { --moduleblock-hue: 180; --moduleblock-saturation: 100%; --moduleblock-lightness: 35%; }
.module-block.blue   { --moduleblock-hue: 220; --moduleblock-saturation: 80%; }
.module-block.purple { --moduleblock-hue: 280; --moduleblock-saturation: 70%; }
.module-block.brown  { --moduleblock-hue: 30; --moduleblock-saturation: 100%; --moduleblock-lightness: 29%; }
.module-block.black  { --moduleblock-lightness: 0%; }
.module-block.white  { --moduleblock-lightness: 100%; }
.module-block.grey   { --moduleblock-hue: 0; --moduleblock-saturation: 0%; --moduleblock-lightness: 40%; }


/* Cards */
.card {
	background-clip: border-box;
	background: var(--card-bg);
	border-radius: var(--border-radius);
	border: var(--border-width) var(--border-style) var(--border-color);
	box-shadow: var(--box-shadow);
	display: flex;
	flex-direction: column;
	margin-bottom: 1.5rem;
	min-width: 0;
	position: relative;
	word-wrap: break-word;
}

.card .header-title {
	margin-bottom: .5rem;
	text-transform: uppercase;
	letter-spacing: .02em;
	font-size: .9rem;
	margin-top: 0;
}

.card .card-aside-left {
	width: 240px;
	float: left;
	padding: 0 20px 20px 10px;
	position: relative;
}
.card .card-aside-right {
	margin: -0.5rem 0 -0.5rem 250px;
	border-left: 5px solid var(--card-bg);
	padding: 1.5rem 0 1.5rem 25px;
}

/* LISTS */
.list-unstyled,.list-inline {
	padding-left: 0;
	list-style: none
}

.list-inline-item {
	display: inline-block
}

.list-inline-item:not(:last-child) {
	margin-right: .5rem
}



/* PROFILE */
span.pipe {
	color: #fff;
	padding: 0 4px;
}

span.pipe::after{
	content: "|";
}

.avatar-lg {
	height: 5rem;
	width: 5rem;
}
