body {
	margin-top: 0px;
}

.headerContainer .callers {
	background-color: transparent;
	border: none;
}

.headerContainer .callers > .caller {
	margin: 0px;
}

.headerContainer .callers > .caller > a {
	background-color: transparent;
}

#searchForm {
	margin: 0px 5px 5px 5px;
}

#searchForm.compressed {
	width: auto;
}

/* let searchform take space of panel */
#searchForm.expanded:not(.compressed),
#searchForm.expanded:not(.compressed) > table {
	width: 100%;
}

/* Suchbegriff auf volle Breite, beeinflusst gesamte Suchmaske */
#searchForm.expanded:not(.compressed) #pattern.withConstraints {
	width: calc(100% - 4px);
}

/* do not wrap feature names */
#searchForm.expanded:not(.compressed) > table td {
	white-space: nowrap;
}

/* border at right side of table */
#searchForm.expanded:not(.compressed) > table td.constraintCell td,
#searchForm.expanded:not(.compressed) > table td.addFeatureCell {
	padding-right: 10px;
}

/* fixed width for first column in search table */
#searchForm.expanded:not(.compressed) > table > tbody:first-child > tr:first-child > td:first-child {
	width: 16px;
}

#searchForm #submit,
#searchForm #resetSearchButton {
	font-size: 108.3333%;
	border: 1px solid #767676;
	border-radius: 2px;
	height: 100%;
	margin: 5px 0px 5px 10px;
}

#searchForm #submit:hover,
#searchForm #resetSearchButton:hover {
	border: 1px solid #4f4f4f;
}

#searchForm #submit:active,
#searchForm #resetSearchButton:active {
	border: 1px solid #8d8d8d;
}

#searchForm #submit {
	background-color: #aaffaa;
}

#searchForm #submit:hover {
	background-color: #9df29e;
}

#searchForm #submit:active {
	background-color: #6de27e;
	color: black;
}

#searchForm #resetSearchButton {
	background-color: #ffdddd;
}

#searchForm #resetSearchButton:hover {
	background-color: #f2d0d0;
}

#searchForm #resetSearchButton:active {
	background-color: #f0b0b0;
}

#searchForm #resetSearchButton img {
	vertical-align: middle;
	width: 16px;
}

#searchForm .constraintBody {
	background-color: #fafafa;
}

#searchForm > table {
	margin: auto;
}

#searchForm table {
	border-spacing: 0px;
}

#searchForm.popupTable #constraintBody {
	position: absolute;
	/* form layer, must be above sticky row layer */
	z-index: 5;
	outline: 2px solid black;
	box-shadow: 9px 9px 7px 0px #A1A1A1;
	padding: 3px 3px 3px 0px;
	margin-top: 2px;
}

#searchForm table tr.hidden {
	display: none;
}

#searchForm table tr.member {
	background-color: #f4f4f4;
}

#searchForm:not(:has(#constraintBody.collapsed)) table tr.hidden-by-collapse {
	display: none;
}

#searchForm #constraintBody.collapsed > tr:not(.showWhenCollapsed) {
	display: none;
}

#searchForm table tr.separatorRow > td {
	padding-top: 3px;
	border-bottom: 1px solid #bebebe;
	border-right: 1px solid #bebebe;
}

#searchForm table tr.separatorRow:first-child,
#searchForm table tbody.noConstraints tr.separatorRow {
	display: none;
}

#searchForm table tr.addFeature > td {
	padding-top: 3px;
	padding-bottom: 2px;
}

#searchForm table tr.addFeatureTableRow > td {
	border-right: 1px solid #bebebe;
}

#searchForm table td {
	padding: 0px;
	text-align: left;
}

#searchForm table tr.lastRow > td {
	border-bottom: 1px solid #bebebe;
}

#searchForm table td > * {
	vertical-align: middle;
}

#searchForm table td .button img {
	vertical-align: middle;
	width: 16px;
}

#searchForm table td.buttonCell {
	padding-left: 1px;
	min-width: 16px;
	box-sizing: border-box;
}

#searchForm table td.constraintCell {
	padding-right: 1px;
	padding-bottom: 1px;
	border-right: 1px solid #bebebe;
	white-space: nowrap;
}

#searchForm table td.constraintCell table {
	width: 100%;
}

#searchForm table td.constraintCell td {
	padding-right: 1px;
	width: 1px;
}

#searchForm table td.constraintCell td.languageSelectorCell {
	padding-right: 0px;
}

#searchForm table td.constraintCell td.valueCell {
	width: auto;
}

#searchForm table td.headingCell {
	padding-top: 2px;
	padding-bottom: 1px;
	border-right: 1px solid #bebebe;
	font-weight: bold;
}

#searchForm table td.headingCell table {
	width: 100%;
}

#searchForm table td.label {
	padding-right: 2px;
}

#searchForm table td.addFeatureCell {
	padding-right: 2px;
	border-right: 1px solid #bebebe;
	white-space: nowrap;
}

#searchForm table td.addFeatureCell table {
	width: 100%;
}

#searchForm table td.addFeatureCell .addFeatureInputCell {
	padding-right: 10px;
}

#searchForm table td.addFeatureCell input {
	width: 100%;
	box-sizing: border-box;
}

#searchForm table tr.addFeatureTableRow .treetable td {
	padding: 2px;
}

#searchForm table tr.addFeatureTableRow .treetable tr:not(.disabled) td:nth-last-child(3) {
	cursor: pointer;
}

#searchForm table tr.addFeatureTableRow .treetable .buttons .disabled {
	display: none;
}

#searchForm table tr.addFeatureTableRow .treetable > tbody > tr > td.header {
	text-align: right;
	padding-left: 5px;
	padding-right: 5px;
}

#searchForm table tr.addFeatureTableRow .treetable > tbody > tr.odd.disabled > td:not(.header) {
	background-color: #f0f0f0;
	color: #606060;
}

#searchForm table tr.addFeatureTableRow .treetable > tbody > tr.even.disabled > td:not(.header) {
	background-color: #e5e5e5;
	color: #606060;
}

#searchForm .rightButtonCell {
	display: none;
	width: 1px;
	vertical-align: bottom;
	padding-right: 1px;
}

#searchForm .lastConstraintRow .rightButtonCell,
#searchForm .addFeature .rightButtonCell {
	display: table-cell;
}

#searchForm td > input,
#searchForm td > select,
#searchForm td > .ss-main > .ss-single-selected {
	background-color: white;
	border-width: 1px;
	border-style: solid;
	border-color: #abadb3 #dbdfe6 #e3e9ef #e2e3ea;
	border-radius: 2px;
	box-sizing: border-box;
	width: 100%;
}

#searchForm td > input {
	padding: 2px;
}

#searchForm td > select {
	padding: 0px;
}

#searchForm td > select.hidden {
	display: none;
}

#searchForm td > select option.hidden {
	display: none;
}

#searchForm td > .ss-main > .ss-single-selected {
	padding: 1px 0px;
}

#searchForm td > input:hover,
#searchForm td > select:hover,
#searchForm td > .ss-main > .ss-single-selected:hover {
	border-color: #5794bf #b7d5ea #c7e2f1 #c5daed;
}

#searchForm td > input:focus,
#searchForm td > select:focus,
#searchForm td > .ss-main > .ss-single-selected:focus {
	border-color: #3d7bad #a4c9e3 #b7d9ed #b5cfe7;
}

#searchForm .ss-main .ss-single-selected {
	height: auto;
}

#searchForm .ss-main .ss-single-selected .placeholderSearch {
	height: auto;
	flex-grow: 1;
}

#searchForm .modified,
#searchForm td > .ss-main > .ss-single-selected.modified {
	background-color: lightyellow;
}

#searchForm .invalid.invalid {
	border-color: red;
}

#searchForm #searchFormWarning {
	display: none;
}

#searchForm .unit {
	display: inline-block;
	padding-top: 2px;
}

#searchForm .callers {
	display: inline;
}

.searchFieldContextMenu {
	position: fixed;
}

#pattern {
	width: 240px;
}

#pattern.withConstraints {
	/* expand icon is 16 px wide */
	width: 224px;
}

#resultmsg {
	font-size: xx-small;
	margin-bottom: 5px;
}

#resultmsg a {
	text-decoration: none;
	color: darkblue;
	font-weight: normal;
}

#busy {
	background-color: #E5E9CA;
	border: 1px solid #ACB381;
	border-radius: 10px;
	margin-top: 40px;
	margin-left: 10px;
	margin-right: 10px;
	padding: 20px;
	font-weight: bold;
	font-size: larger;
	color: #4D5C30;
}

#busy img {
	/* img solution for loading animation in IE */
	display: block;
	margin: 20px auto 0px;
}

#busy iframe {
	/* iframe solution for loading animation in other browsers */
	width: 24px;
	height: 24px;
	display: block;
	margin: 20px auto 0px;
}

.selection-buttons {
	text-align: center;
	min-height: 20px;
	padding: 5px;
}

.selection-buttons a {
	color: #597730;
	font-weight: bold;
	text-decoration: underline;
}

.selection-buttons img {
	padding-left: 5px;
	vertical-align: middle;
	border-style: none;
}

.sort-features {
	text-align: left;
	padding-top: 5px;
}

.sort-features span {
	vertical-align: middle;
	padding-right: 10px;
}

.sort-features .button {
	vertical-align: middle;
	padding-left: 1px;
}

.errorbox {
	font-size: smaller;
	margin-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 40px;
	padding: 20px;
	border: 1px solid #ACB381;
	border-radius: 10px;
	background-color: #E5E9CA;
}

.errorbox .msg {
	font-weight: bold;
	font-size: larger;
	color: red;
	text-align: center;
	padding: 10px 0px;
}

.nav-button {
	color: #597730;
	font-weight: bold;
}

.buttonbox {
	margin-top: 10px;
}

a.button {
	display: inline-block;
}

a.button img {
	border-style: solid;
	border-color: transparent;
	border-width: 1px;
	border-radius: 3px;
	padding: 1px 2px;
	cursor: pointer;
	width: 16px;
}

a.button:hover img {
	border-style: solid;
	border-color: #a2a4ac;
	background: #f0f0f0;
}

a.button.selected img {
	border-style: inset;
	border-color: #e2e4ec;
	background: #e4e4e4;
}

a.smallbutton {
	display: inline-block;
}

a.smallbutton:hover {
	background: #f0f0ff;
}

a.smallbutton img {
	padding: 1px 2px;
	cursor: pointer;
}

.loading-div {
	position: absolute;
	left: 0px;
	right: 0px;
	/* form layer, must be above sticky row layer */
	z-index: 5;
}

.loading-div > div {
	display: inline-block;
	margin: 40px auto;
	padding: 10px;
	background-color: #f0f0f0;
	border-radius: 3px;
	border: 1px solid black;
}

.loading-div > div span {
	vertical-align: middle;
	margin-left: 10px;
}

.decoratedIFrame {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
}

.decoratedIFrame.popup {
	position: fixed;
	padding: 50px;
	z-index: 10;
}

.decoratedIFrame table {
	width: 100%;
	height: 100%;
	border-spacing: 0px;
}

.decoratedIFrame.popup table {
	box-shadow: 0px 0px 20px 5px black;
}

.decoratedIFrame tr:first-child {
	background-color: #F68712;
}

.decoratedIFrame td {
	padding: 0px;
}

.decoratedIFrame .prompt {
	font-weight: bold;
	font-size: 133.3333%;
	text-align: left;
	padding: 0px 10px;
	height: 1px;
}

.decoratedIFrame .close {
	width: 1px;
	height: 1px;
	padding: 2px;
}

.decoratedIFrame .close > img {
	cursor: pointer;
	vertical-align: middle;
}

.decoratedIFrame .iframe {
	border-top: 1px solid black;
	height: 100%;
}

.decoratedIFrame iframe {
	background-color: white;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	border: none;
}

.submitPanel {
	display: inline-block;
	position: sticky;
	left: 5px;
	bottom: 5px;
	background-color: white;
	border: 1px solid #606060;
	border-radius: 5px;
	margin: 5px;
	padding: 0px 2px;
	/* form layer, must be above sticky row layer */
	z-index: 5;
	overflow: auto;
}

.submitPanel > button,
.submitPanel > input {
	margin: 4px 2px;
}

.submitPanel > div {
	margin: 4px 2px;
}

.submitPanel > div > button,
.submitPanel > div > input {
	margin: 0px 2px;
}

.caller.showinresulttable {
	display: none;
}

/* scroll contents of expandable container but hide scrollbars */
.expandableContainer {
	float: left;
	/* no margin for better support of background color */
	margin: 0px;
	padding: 7px;
	flex: 0 0 auto;
	flex-direction: column;
	flex-wrap: nowrap;
	overflow-y: auto;
	overflow-x: hidden;
	/* Firefox */
	scrollbar-width: none;
	/* IE */
	-ms-scrollbar-style: none;
}

.expandableContainer::-webkit-scrollbar {
	/* Safari, Chrome */
	display: none;
}

/* fade out and hide caller captions when not expanded */
.expandableContainer:not(.expanded) .caller .caption {
	opacity: 0;
	transition-property: opacity;
	transition-delay: 0s;
	transition-timing-function: ease-out;
	/*
	transition-duration: 3000ms;
	visibility: hidden;
	transition-property: visibility, opacity;
	transition-duration: 0s, 1s;
	transition-delay: 1s, 0s;
	*/
}


.expandableContainer .sidebar .caller .caption {
	overflow: hidden;
	text-overflow: ellipsis;
}

/* fade in and show caller captions when expanded */
.expandableContainer.expanded .caller .caption {
	opacity: 1;
	transition-property: opacity;
	transition-delay: 0.1s;
	transition-timing-function: ease-in;
	/*
	transition-duration: 3000ms;
	visibility: visible;
    transition-property: opacity, visibility;
	transition-duration: 1s, 0s;
	transition-delay: 0.1s, 0s;
	*/
}

/* hide captions when not expanded and not fading */
.expandableContainer:not(.expanded, .fade) .caller .caption {
	width: 0;
	overflow: hidden;
}

/* show captions when expanded or fading */
.expandableContainer.fade .caller .caption {
	width: auto;
}

.topbarContainer {
	margin: 0px auto;
	width: 100%;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #f0f0f0;
}

.sidebar {
	flex-direction: column;
	align-items: flex-start;
}

.sidebar .caller.separator {
	width: 100%;
	height: 1px;
	min-height: 1px;
	margin: 2px 0px;
	background-color: #888888;
}

/* one caller per line */
.sidebar .caller {
	display: block;
	width: 100%;
}

/* use full width with no extra padding for caller */
.sidebar .caller .caller-button {
	width: 100%;
	padding: 0px;
}

/* distance between icon and caption + text color */
.sidebar .caller .caption {
	margin-left: 5px;
	color: canvastext;
}

.mailCountBadge {
	background-color: #fa3e3e;
	border-radius: 2px;
	color: white;
	padding: 1px;
	font-size: 10px;
	pointer-events: none;
	position: absolute;
	right: 2px;
	bottom: 2px;
}

.textEditorPopup {
	min-width: 400px;
	max-width: 400px;
	width: 400px;
	position: fixed;
	background-color: white;
	z-index: 6;
	border: 1px solid #c2c4cc;
	border-radius: 5px;
}

.ql-snow {
	border: none !important;
}

.textEditorSubmitPanel {
	padding: 2px;
	text-align: left;
}

.ql-container.ql-snow {
	border-top: 1px solid #c2c4cc !important;
	border-bottom: 1px solid #c2c4cc !important;
}

.ql-toolbar.ql-snow {
	padding: 2px !important;
	text-align: left;
}