@charset "UTF-8";
/*!
 * Author: in34 GmbH (https://in34.de/)
 * Version: v0.01
 */


h1, h2, h3, h4 { color: #085E9E; }
h2 { margin-bottom: 50px; }
h3 { margin-bottom: 30px; }

.headerbar {
	height: 60px;
	background: #085E9E;
	width: 100%;
	border-top: 4px solid #ED1D24;
	position: fixed;
	z-index: 99;
	color: #fff;
	line-height: 56px;
	font-size: 1.6em;
	-webkit-box-shadow: 0 4px 8px 1px #A1A1A1;
	box-shadow: 0 4px 8px 1px #A1A1A1;
}

.headerbar nav ul {
	list-style-type: none;
	padding: 0;
	
}
.headerbar nav li {
	padding: 10px;
	display: inline;
}	
.headerbar .dropdown li { 
	padding: 0; 
}

.headerbar li:hover {
	background: #116cad;
}
.headerbar nav a {
	color: #fff;
	text-decoration: none;
}
.headerbar nav a.dropdown-item { 
	color: #000; 
	line-height: 40px;
}

.headerbar .form-control {
	border-radius: .375rem 0 0 .375rem;
}
.offcanvas-body { 
	background: #e2e2e2; 
}
.offcanvas-body,
.offcanvas-body a 
{ 
	color: #085E9E !important;
	font-size: 0.95em !important;
	line-height: 32px !important;
	text-align: left;
}
.offcanvas-body li { 
	display: block !important;  
	padding: 5px !important;
}

.breadcrumb {
	height: 36px;
	background: #e2e2e2;
	width: 100%;
	margin-top: 60px;
	position: fixed;
	z-index: 98;
	line-height: 38px;
	font-size: 0.8em;
	color: #969696;
}
.sidebar {
	width: 80px;
	background: #e2e2e2;
	position: fixed;
	z-index: 97;
	left: 0;
	float: left;
	height: 100%;
	border-top: 4px solid #ED1D24;
	text-align: center;
	padding: 100px 0 0 0;
}
.sidebar nav ul {
	list-style-type: none;
	padding: 0;
}
.sidebar nav li {
	padding: 5px 0;
	margin: 15px 0;
}	
.sidebar li:hover {
	background: #f2f2f2;
}
.sidebar nav li.active {
	background-color: #F2F2F2;
}
.sidebar a {
	color: #085E9E;
	text-decoration: none;
	font-size: 0.7em;
	line-height: 20px;
}
.sidebar a span { line-height: 10px; }

.sidebar .bi {
	font-size: 2.6em;
	margin-bottom: 0px;
}

.main {
	padding-top: 150px;
}

.intro {
	background: url(../../images/intro_bg.jpg) no-repeat top; 
	background-size: cover; 
	width: 100vw;
	height: 100vh;
	display: flex;
	justify-content: center; 
 	align-items: center;
}

.tab-pane {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-radius: 0px 0px 5px 5px;
    padding: 20px 10px;
}
.nav-tabs {
    margin-bottom: 0;
}
.nav-link {
	color: #085E9E;
}
.nav-tabs .nav-link {
	background-color: #E2E2E2;
	margin-right: 5px;
}
.dropdown-item .bi { 
	color: #085E9E; 
	margin-right: 5px; 
}
.dropdown-item img {
	margin-left: -4px;
	margin-right: 5px; 
}
.dropdown-item:active { background-color: #ddd; }

.table-wrapper {
	max-height: 500px;
	overflow-y: scroll;
	margin-top: 10px;
 }
tbody tr { cursor: pointer; }
tbody tr .table-title { cursor: default; }

.sticky-header thead {
  position: sticky;
  top: 0;
  background-color: #fff;
}
.right {
	text-align: right;
	float: right;
}
.tright {
	text-align: right;
}
.tred {
	color: #FF0000 !important;
}
.btn-primary {
	background: #085E9E !important;
}
.vdkflogo {
	width: 60px;
	margin-bottom: 5px;
}
.bottom {
	position: absolute;
	left: 5px;
	bottom: 12px;
	z-index: 99;
		line-height: 16px;
}
.bottom span { 
	font-size: 0.8em;
}

.equal-width-span {
    flex: 1;
 }
.trash-icon {
    display: inline-block;
    position: relative;
    left: 8px;
	color: #FF0000;
  }

#toggle-label-betreuungsstatus.active {
	color: green;
}

#toggle-label-betreuungsstatus.inactive {
  color: red;
}

.bg-primary {
	background-color: #085E9E !important;
}

.btn-outline-primary {
    --bs-btn-color: #085E9E;
    --bs-btn-border-color: #085E9E;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #085E9E;
    --bs-btn-hover-border-color: #085E9E;
    --bs-btn-focus-shadow-rgb: 13,110,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #085E9E;
    --bs-btn-active-border-color: #085E9E;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #085E9E;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #085E9E;
    --bs-gradient: none;
}

@media screen and ( max-width: 1500px ) {
	.main {
		margin-left: 100px;
	}
}
@media screen and ( max-width: 768px ) {
	.main {
		margin-left: 0px;
	}
	.player { width: 90% !important; }
}


:required {
	background-color: #ffffe0;
}

.form-control:read-only{
    background-color: #e9ecef;
    opacity: 1;
    transition: none;
    appearance: none;
    pointer-events: none;
}