:root {
	--color-1: #FD9698;
	--color-2: #B3FF9E;
	--color-3: #F6DA46;
	--color-4: #A8DEFF;
	--btn-bg-color-1: #FD969733;
	--btn-bg-color-2: #B3FF9E33;
	--btn-bg-color-3: #F6DA4633;
	--btn-bg-color-4: #A8DEFF33;
}

@font-face {
	font-family: 'Catamaran';
	src: url('../vendor/fonts/Catamaran-VariableFont_wght.ttf') format('truetype-variations');
	font-weight: 1 999;
}

body {
  background-image: linear-gradient(to right, rgba(51, 51, 51, 1), rgba(51,51,51,1) 50%, rgba(183, 39, 45, 1));
}

body#intro {
	height: 100vh;
	position: relative;
  background-image: url('/images/v2-bg-lock.jpg'), linear-gradient(to right, rgba(51, 51, 51, 1), rgba(51,51,51,1) 50%, rgba(183, 39, 45, 1));
	background-blend-mode: multiply;
}

main {
	padding-bottom: 53px;
}

#intro #logo {
	max-height: 60px;
}

#intro header {
	height: auto;
}

.bg h1,
.bg h2,
.bg h3,
.bg h4,
.bg h5,
.bg h6 {
	color: #5b5b5b;
}

.bg {
	--mdb-body-bg: white;
	background-color: var(--mdb-body-bg);
}

.bg-black .breadcrumb-item:before {
	color: rgba(255,255,255, 0.5)!important;
}
.bg-black .breadcrumb-item a {
	color: rgba(255,255,255, 1)!important;
}
.bg-black .breadcrumb-item.active {
	color: rgba(2555,255,255, 0.75);
}

.bg-black .legalize a {
	color: rgba(255,255,255,0.77);
}

header {
	height: 120px;
}

#logo {
	max-height: 30px;
	width: auto;
}

.btn-menu {
	color: white;
}

.btn-menu.show,
.btn-menu:hover {
	color: white;
	background-color: rgba(255,255,255,0.1);
}

.bg-black .dropdown-item {
	color: white;
}

/*

#main-nav > .nav-item > .btn-group > a {
	color: #9f9f9f;
	border-color: #9f9f9f;
	border-width: 2px;
	border-style: solid;
	border-left-style: none;
	border-right-style: none;
	min-width: 200px;
	position: relative;
	height: 38px;
}
#main-nav > .nav-item > .btn-group > a:first-of-type {
	border-left-style: solid;
}
#main-nav > .nav-item > .btn-group > a:last-of-type {
	border-right-style: solid;
}
#main-nav > .nav-item > .btn-group > a.dropdown-toggle {
	min-width: unset;
}

#main-nav > .nav-item > .btn-group > a:before {
	content:" ";
	position: absolute;
	top:0;
	bottom:0;
	left:0;
	width: 0%;
	background-color: white;
	transition: width 0.2s ease-in;
	opacity:0.2;
}

#main-nav > .nav-item > .btn-group > a:hover:before {
	width: 100%;
	transition: width 0.2s ease-out;
}

/*
.dropdown-hover+.dropdown-menu:hover,
.dropdown-hover:hover+.dropdown-menu {
	display: block;
}

.dropdown-hover+.dropdown-toggle:active {
	pointer-events: none;
}
*/

#main-nav > li {
	margin: 0;
	background-color: #AAAAAA;
	box-shadow: inset -2px -2px 2px 2px #777;
	border: thin solid #999999;
}

#main-nav .nav-item a:hover {
	color: white;
}

#main-nav .btn-group {
	height: 70px;
}
#main-nav .btn {
	padding-left: 1vw;
	padding-right: 1vw;
}

.nav-secondary {
	top: 46px;
	padding: 0;
	padding-left: 12px;
	background-color: rgba(128,128,128,1);
	box-shadow: none;
}

#main-nav .dropdown-toggle-split {
	width: 25px;
	border-left: thin solid #999;
}

.btn-home {
}

.btn-home i {
	color: var(--color-1);
}
#main-nav .nav-item .btn-home a:before {
	background-color:var(--color-1);
}

.btn-organization i {
	color: var(--color-2);
}
#main-nav .nav-item .btn-organization a:before {
	background-color:var(--color-2);
}


.btn-permissions i {
	color: var(--mdb-warning);
}
#main-nav .nav-item .btn-permissions a:before {
	background-color:var(--mdb-warning);
}


.btn-forms i {
	color: var(--mdb-info);
}

.btn-debug i {
	color: red;
}
.btn-toggle-split.btn-debug {
	margin-top: 25px;
}

#main-nav .nav-item .btn-forms a:before {

	background-color:var(--mdb-info);
}

/************ LOGIN SCREEN ********************/
.lang-positioning {
	position: absolute;
	top: 1em;
	right: 1em;
	z-index:99;
}


#intro {
}

.bg-image.bg-lock {
  background-image: linear-gradient(to right, rgba(51, 51, 51, 1), rgba(51,51,51,1) 50%, rgba(183, 39, 45, 1));/*,  url('/images/v2-bg-lock.jpg');*/
}

.color-1 {
	color: var(--color-1);
}

.color-2 {
	color: var(--color-2);
}

.color-3 {
	color: var(--color-3);
}

.color-4 {
	color: var(--color-4);
}

#intro .mask {
	top:120px;
}
.msg-box {
	padding: 20px;
	margin-bottom: 30px;
/*	box-shadow: 1px 1px 5px rgba(0,0,0,0.25);*/
}

.alert-primary,
.alert-warning,
.alert-danger {
	color: #1e1e1e;
}

.alert-primary {
	background-color: var(--mdb-info-bg-subtle);
}

.select-option:hover .select-option-text {
	color: white!important;
}


#main-nav .dropdown-toggle {
	padding-bottom: 15px;
}

#main-nav .dropdown-toggle:after {
	position: absolute;
	bottom: 5px;
	height:7px;
	left: 50%;
	transform: translateX(-50%);
}

/*
.dropdown-toggle.debug::after {
	border-left: solid thin red;
	color: red;
	content: "\f188";
	font-family: "FontAwesome";
	border: none;
	margin-top: 12px;
}*/

/* MDB customization that isn't available in custom variables */
.card-header {
	border-bottom-color: var(--mdb-primary);
}
#main-content > .card > .card-body {
	padding: 0;
}
#main-content > .card > .card-body > section {
	border-bottom: thin solid var(--mdb-primary);
}
.card-body .card-header,
.card-body .card {
	background-color: var(--mdb-body-bg);
}



#chartArea {
	min-height: 500px;
}

.grid {
	gap: 1rem;
}

.card-header .modifiedDate {
	opacity: 0.8;
	line-height: 1;

}

.google-visualization-orgchart-node {
	background-color: none!important;
	padding:0!important;
	border: 2px solid transparent!important;
}
td:has(.chartNode) {
	background-color: var(--btn-bg-color-4)!important;
	background-image: unset!important;
	padding: 2px;
}
td:has(.chartNode.originNode) {
	background-color: var(--btn-bg-color-1)!important;
}
td:has(.chartNode.parentNode) {
	background-color: var(--btn-bg-color-2)!important;
}
td:has(.chartNode.childNode) {
	background-color: var(--btn-bg-color-3)!important;
}
.google-visualization-orgchart-nodesel {
	background-color: none!important;
	border-color: var(--mdb-primary)!important;
}
/*
.google-visualization-orgchart-node {
	background-color: var(--btn-bg-color-4)!important;
}

.google-visualization-orgchart-nodesel {
	border-color: var(--mdb-primary)!important;
	background-color: var(--btn-bg-color-3)!important;
}*/

/*
#chartArea {
	margin-top: 20px;
}

.organization-chart-table {
	margin:auto;
	padding: 20px;
}

.organization-chart-node {

	background-color: var(--mdb-secondary);
	color: white;
}

.organization-chart-lines-top div {
	background-color: var(--mdb-primary);
}
.organization-chart-line {
    height: 20px;
    border-right: 1px solid var(--mdb-primary);
    border-top: 1px solid var(--mdb-primary);
}*/


.dates {
	text-align: right;
}
.dates .label {
	width: 75px;
	display: inline-block;
	text-align: left;
}