:root {
	--color-presentation-grey: #868686;
}

/* var(--color-presentation-grey) */
.jsClient {
	white-space: pre-wrap;
}

.presentation {
	min-height: 13px;
	min-width: 13px;
	border: 1px solid rgba(140, 140, 140, 0.58);
}

img {
	max-width: 100%;
	width: fit-content;
}

.client1>.presentation {
	background-color: yellow;
}

.client2>.presentation {
	background-color: rgb(170, 223, 248);
}

.client3>.presentation {
	background-color: rgb(158, 231, 55);
}

.client4>.presentation {
	background-color: rgb(255, 172, 251);
}

.client5>.presentation {
	background-color: rgb(255, 218, 129);
}

.client6>.presentation {
	background-color: rgb(248, 191, 91);
}

.pGroup, .pResourceLink {
	min-height: 13px;
	min-width: 13px;
}

.error input, .error select, .error textarea {
	background-color: #fbc0c0;
	border-color: red;
}

.errorStillFocused input, .errorStillFocused select, .errorStillFocused textarea
	{
	border-color: orange;
}

.iconButton {
	cursor: pointer;
	min-width: 16px;
	min-height: 16px;
	display: block;
	float: right;
	position: relative;
	margin-right: 2px;
	top: 0.1rem;
}

.iconButton::before, .iconButton::after {
	background: url("../images/icons3.svg") no-repeat scroll;
	content: "";
	height: 16px;
	width: 16px;
	position: absolute;
	transition: opacity 0.5s ease 0s;
	display: block;
}

.iconButton::before {
	opacity: 1;
	z-index: 1;
}

.iconButton:hover::before {
	opacity: 0;
}

.iconButton::after {
	opacity: 0;
	z-index: 2;
}

.iconButton:hover::after {
	opacity: 1;
}

.removeButton, .infoButton, .openLinkedRecordButton, .showSearchButton {
	/* 	transform: scale(0.7, 0.7); */
	
}

.infoButton, .openLinkedRecordButton, .showSearchButton {
	height: 16px;
	width: 16px;
}

.openLinkedRecordButton::before {
	background-position: -240px -32px;
}

.openLinkedRecordButton::after {
	background-position: -240px -16px;
}

.showSearchButton::before {
	background-position: -224px -32px;
}

.showSearchButton::after {
	background-position: -224px -16px;
}

.clearLinkedRecordIdButton::before {
	background-position: -256px -32px;
}

.clearLinkedRecordIdButton::after {
	background-position: -256px -16px;
}

.infoButton::before {
	background-position: -64px -0px;
	opacity: 0;
}

.infoButton::after {
	background-position: -64px -16px;
}

.iconButton.tool::before {
	background-position: -144px -32px;
}

.iconButton.tool::after {
	background-position: -144px -16px;
}

.removeButton::before {
	background-position: -32px -16px;
}

.removeButton::after {
	background-position: -32px -0px;
}

.defaultButton::before {
	background-position: -192px -32px;
}

.defaultButton::after {
	background-position: -192px -48px;
}

.alternativeButton::before {
	background-position: -192px -32px;
}

.alternativeButton::after {
	background-position: -192px -48px;
}

.minimizeButton::before {
	background-position: -176px -32px;
}

.minimizeButton::after {
	background-position: -176px -48px;
}

.maximizeButton::before {
	background-position: -160px -32px;
}

.maximizeButton::after {
	background-position: -160px -48px;
}

.dragButton::before {
	background-position: -192px -0px;
}

.dragButton::after {
	background-position: -192px -16px;
	cursor: move;
}

.addBeforeButton::before {
	background-position: -273px -32px;
}

.addBeforeButton::after {
	background-position: -273px -16px;
}

.jsClient .menuView .pVar .infoButton, .menuView .pVar:hover>.infoButton::before,
	.menuView .pNumVar .infoButton, .menuView .pNumVar:hover>.infoButton::before,
	.menuView .pGroup:hover>.infoButton::before, .menuView .infoButton::before,
	.menuView .infoButton::after, .menuView .infoButton:hover::after,
	.jsClient .menuView .pVar .openLinkedRecordButton, .menuView .pVar:hover>.openLinkedRecordButton::before,
	.menuView .pGroup:hover>.openLinkedRecordButton::before, .menuView .openLinkedRecordButton::before,
	.menuView .openLinkedRecordButton::after, .menuView .openLinkedRecordButton::after
	{
	display: none;
}

.workView .pVar:hover>.infoButton::before, .pNumVar:hover>.infoButton::before,
	.workView .pRecordLink:hover>.buttonView .infoButton::before, input:focus+.infoButton::before,
	.workView .pCollVar:hover>.infoButton::before, select:focus+.infoButton::before,
	textarea:focus+.infoButton::before, .workView .pGroup:hover>.infoButton::before,
	.workView .pMap:hover>.infoButton::before, textarea:focus+.infoButton::before,
	.workView .pSurroundingContainer:hover>.infoButton::before {
	opacity: 1;
}

.beeingDragged {
	/* 	chrome can not hadle css changes on dragging :( */
	transform: scale(0.8);
	border: 1px solid black;
}

.jsClient .beeingDragged span, .jsClient .beeingDragged div {
	background: transparent;
}

.workView .repeatingElement, .workView .pNonRepeatingChildRefHandler {
	display: flex;
}

.workView .repeatingElement>*, .workView .pNonRepeatingChildRefHandler>*
	{
	flex: 1;
}

.buttonView {
	/* 	needed for tests to see that it is visible */
	display: inline-block;
	padding-bottom: 10px;
}

.buttonView:empty {
	display: none;
}

.workView .repeatingElement>.buttonView, .workView .pNonRepeatingChildRefHandler>.buttonView
	{
	flex: 0 1 0;
	display: flex;
	flex-direction: column;
}

.pVar {
	min-width: 30px;
	display: inline-block;
}

.pVar:hover, .pNumVar:hover, .pCollVar:hover, .pMap:hover, .pGroup:hover,
	.pSurroundingContainer:hover, .repeatingElement:hover, .pRecordLink:hover,
	.pNonRepeatingChildRefHandler:hover {
	background-color: rgba(0, 129, 198, 0.08);
	transition: background-color 0.5s linear;
}

/* .infoActive { */
.pVar.infoActive, .pNumVar.infoActive, .pCollVar.infoActive, .pMap.infoActive,
	.pGroup.infoActive, .pSurroundingContainer.infoActive,
	.repeatingElement.infoActive, .pRecordLink.infoActive,
	.pNonRepeatingChildRefHandler.infoActive {
	background-color: rgba(60, 150, 255, 0.3);
	transition: background-color 0.5s linear;
}

.infoActive>.infoButton::before, .infoActive>.buttonView .infoButton::before,
	.infoActive>.openLinkedRecordButton::before {
	opacity: 1;
}

.workView {
	display: flex;
	flex-wrap: wrap;
}

.workView .pVar {
	flex: 1;
	/* 	display: grid; */
	/* 	grid-template-columns: 1fr minmax(0, 1fr); */
	/* 	grid-template-rows: max-content max-content max-content; */
	/* 	grid-template-areas:  */
	/* 		"label infoButton" */
	/* 		"attributes infoButton" */
	/* 		"input infoButton"; */
}

.default, input[type="button"], input[type="file"] {
	/*   margin-bottom: 0.5rem; */
	/*   margin-top: 0.5rem; */
	
}

.attributes {
	display: flex;
}

.attributes label, .attributes .label {
	font-style: italic;
	font-weight: normal;
}

.attributes .pVar {
	flex: initial;
}

textarea {
	flex: 1 auto;
}

.pGroup, .pMap, .pVar, .pCollVar, .pNumVar, .pSurroundingContainer {
	display: flex;
	flex-direction: column;
	position: relative;
	padding-right: 16px;
}

.pMap, .pVar, .pCollVar, .pNumVar {
	margin-bottom: 1rem;
}

.pChildRefHandler {
	/*     margin-bottom: 1em; */
	
}

.pChildRefHandler, .pNonRepeatingChildRefHandler, .text {
	width: 100%;
}

.menuView .pChildRefHandler, .menuView .pNonRepeatingChildRefHandler,
	.menuView .text {
	width: auto;
}

.workItem .presentation>.pGroup {
	border-radius: 5px;
	padding: 0rem 1rem 1rem 1rem;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.28);
	margin: 1rem;
}

.searchButton {
	margin-left: 1rem;
}

.pGroup.recordTypePGroup {
	margin-top: .5rem;
	margin-left: .5rem;
	margin-right: .5rem;
	padding-top: 1rem;
	padding: 1rem;
}

.pGroup.recordTypeOutputPGroup {
	margin-top: .5rem;
	margin-left: .5rem;
	margin-right: .5rem;
	padding-top: 1rem;
	padding: 1rem;
}

.pGroup {
	flex-direction: row;
	flex-wrap: wrap;
	column-gap: 1rem;
}

.pMap {
	padding-right: 0px;
}

.pRecordLink {
	padding-right: 16px;
}

.inline {
	display: inherit;
	position: static;
}

.jsClient .workView .inline span, .jsClient .workView .inline div {
	display: inline;
	position: static;
}

.jsClient .workView .inline .infoView {
	display: flex;
	flex-direction: column;
	position: relative;
}

.workView .pRecordLink {
	display: flex;
	flex-wrap: wrap;
	position: relative;
}

.workView .pRecordLink .linkedRecordTypeView {
	display: inline-block;
	width: auto;
	min-width: 6rem;
}

.workView .pRecordLink .linkedRecordIdView {
	display: inline-block;
	width: auto;
	min-width: 10rem;
}

.workView .editView .pRecordLink .linkedRecordIdView {
	min-width: 20rem;
}

.workView .pRecordLink.searchActive {
	border: 1px dashed var(--color-presentation-grey);
	border-radius: 10px 10px;
}

.workView .pRecordLink>.infoView {
	flex: 10 1 80%;
}

.workView .pRecordLink>.childrenView {
	flex: 10 1 80%;
	order: 1;
}

.workView .pRecordLink>.buttonView {
	flex: 1;
	order: 2;
	display: flex;
	flex-direction: column;
}

.workView .pRecordLink>.search {
	flex: 10 1 80%;
	order: -1;
	border-bottom: 1px dashed var(--color-presentation-grey);
}

.workView .pRecordLink>.search .listItem {
	border-bottom: 1px dashed var(--color-presentation-grey);
}

.jsClient .workView .recordViewer {
	flex: 10 1 80%;
	border: 1px dashed var(--color-presentation-grey);
	border-radius: 10px 10px;
	position: relative;
	overflow: hidden;
	z-index: 0;
	order: 1;
}

.workView .presentation>.pGroup>.infoButton {
	z-index: 1005;
}

.workView .infoButton {
	z-index: 5;
	position: absolute;
	top: 0px;
	right: 0px;
}

.workView .pGroup>.pChildRefHandler, .workView .pGroup>.pNonRepeatingChildRefHandler,
	.workView .pGroup>.pSurroundingContainer, .workView .pGroup>.text {
	position: relative;
}

.jsClient .workView .openLinkedRecordButton, .jsClient .workView .showSearchButton,
	.jsClient .workView .clearLinkedRecordIdButton {
	order: 2;
	flex: 0 auto;
}

.infoView {
	flex: 0 1 100%;
	position: relative;
	overflow: hidden;
	z-index: 1;
	display: flex;
	flex-direction: column;
}

.infoView span {
	font-size: 0.7rem;
}

.infoView::before {
	background: url("../images/icons3.svg") no-repeat scroll;
	content: "";
	background-position: -64px -0px;
	opacity: 0.1;
	height: 16px;
	width: 16px;
	transform: scale(5, 5);
	position: absolute;
	right: 5.4rem;
	top: 3rem;
	z-index: -1;
}

.defTextView {
	font-style: italic;
}

.search {
	position: relative;
	overflow: hidden;
}

.search>* {
	position: relative;
}

.search::before {
	background: url("../images/icons3.svg") no-repeat scroll;
	content: "";
	background-position: -224px -0px;
	opacity: 0.2;
	height: 16px;
	width: 16px;
	transform: scale(10, 10);
	position: absolute;
	right: 6.8rem;
	top: 8.1rem;
}

.infoView .defTextView {
	padding-top: 0.1rem;
}

.infoView .defTextView+.technicalView {
	padding-top: 0.2rem;
}

.infoView .clickable {
	cursor: pointer;
}

.infoView .clickable:hover {
	text-decoration: underline;
}

.pRepeatingContainer {
	border: 1px dashed green;
	display: block;
}

.workView .twelveChildStyle {
	/* 	width: 100%; */
	width: 96%;
}

.workView .elevenChildStyle {
	/* 	width: 91%; */
	width: 87%;
}

.workView .tenChildStyle {
	/* 	width: 83%; */
	width: 80%;
}

.workView .nineChildStyle {
	/* 	width: 75%; */
	width: 72%;
}

.workView .eightChildStyle {
	/* 	width: 66%; */
	width: 63%;
}

.workView .sevenChildStyle {
	/* 	width: 58%; */
	width: 55%;
}

.workView .sixChildStyle {
	/* 	width: 50%; */
	width: 48%;
}

.workView .fiveChildStyle {
	/* 	width: 41%; */
	width: 39%;
}

.workView .fourChildStyle {
	/* 	width: 33%; */
	width: 31%;
}

.workView .threeChildStyle {
	/* 	width: 25%; */
	width: 23%;
}

.workView .twoChildStyle {
	/* 	width: 16%; */
	width: 15%;
}

.workView .oneChildStyle {
	/* 	width: 8%; */
	width: 7%;
}

.workView .zeroChildStyle {
	width: 0;
}

.presentation .headline {
	width: 100%;
}

.presentation .text {
	margin: 4px;
	display: inline-block;
}

h1, h2, h3, h4, h5, h6 {
	width: 100%;
	color: #575757;
	font-weight: normal;
	margin-top: .5rem;
	margin-bottom: 0rem;
}

h1, h2, h3, .h1TextStyle, .h2TextStyle, .h3TextStyle {
	padding-left: .5rem;
	padding-right: .5rem;
	margin-bottom: 0.2rem;
}

h2, h3, .h2TextStyle, .h3TextStyle {
	border-radius: 4px;
}

h3, .h3TextStyle {
	padding-left: 0rem;
}

h1, .presentation .h1TextStyle {
	font-size: 1.6rem;
	color: var(--color-white);
	background-color: var(--color-h1);
	margin: 0 -1rem 0 -1rem;
	padding: 0.2rem 1rem 0.2rem 1rem;
	position: sticky;
	top: 0rem;
	z-index: 1001;
	border-radius: 4px 4px 0px 0px;
}

h2, .presentation .h2TextStyle {
	font-size: 1.3rem;
	background-color: var(--color-h2);
	margin-left: 0px;
}

h3, .presentation .h3TextStyle {
	font-size: 1.1rem;
	font-weight: bold;
	margin-left: 0px;
}

h4, .presentation .h4TextStyle {
	font-size: 0.9rem;
	font-weight: bold;
	margin-left: 0px;
}

h5, .presentation .h5TextStyle {
	font-size: 0.7rem;
	margin-left: 0px;
}

h6, .presentation .h6TextStyle {
	font-size: 0.6rem;
	margin-left: 0px;
}

.h7TextStyle {
	font-style: italic;
}

label, .label {
	/* 	font-style: italic; */
	font-weight: bold;
	color: #575757;
}

.pRecordLink .label {
	flex: 1 1 100%;
}

.pRecordLink .pVar label, .pRecordLink .pVar .label {
	font-weight: normal;
}

label::after, .label:after {
	content: ": ";
}

.value {
	word-break: break-word;
}

.presentation .text.labelTextStyle {
	font-weight: bold;
}

.presentation .text.labelTextStyle::after {
	content: ": ";
}

.presentation .inline>.text {
	flex: 0 0;
}

.pRecordLink .text {
	display: block;
}

.repeatingElement:first-child {
	border-top: 1px dashed var(--main-color);
}

.workView .repeatingElement {
	display: grid;
	grid-template-columns: 10fr 16px;
	gap: 0px;
}

.repeatingElement :is(h1, h2, h3, h4, h5, h6) {
	grid-column: 1;
	grid-row: 1;
	width: calc(100% - 16px);
}

.clickableHeadline {
	cursor: pointer;
}

/* .repeatingElement .pGroup { */
.repeatingElement .default, .repeatingElement .alternative {
	grid-area: 1/1;
	grid-row: span 2;
}
/* .repeatingElement .pGroup { */
.repeatingElement:has(.clickableHeadline) .default, .repeatingElement:has(.clickableHeadline) .alternative
	{
	grid-area: 2/1;
}

.repeatingElement .buttonView {
	grid-column: 2;
	grid-row: 1/3;
}

.workView .pNonRepeatingChildRefHandler {
	display: grid;
	grid-template-columns: 10fr 16px;
	gap: 0px;
}

.pNonRepeatingChildRefHandler :is(h1, h2, h3, h4, h5, h6) {
	grid-column: 1;
	grid-row: 1;
	width: calc(100% - 16px);
}

.pNonRepeatingChildRefHandler .pGroup, .pNonRepeatingChildRefHandler .pSurroundingContainer
	{
	grid-area: 2/1;
}

.pNonRepeatingChildRefHandler .buttonView {
	grid-column: 2;
	grid-row: 1/3;
	/*   	background: aquamarine; */
}

.jsClient .repeatingElement.hoverRemove {
	background-color: #ffc6c6;
}

.repeatingElement:first-child:last-child {
	border-top: none;
	border-bottom: none;
}

.compactChildStyle .pGroup, .compactChildStyle .pVar, .compactChildStyle .pCollVar,
	.compactChildStyle .pSurroundingContainer {
	padding-right: 0;
}

.jsClient .workView .rowBasedChildStyle, .jsClient .workView .rowBased {
	flex-direction: row;
	flex-wrap: wrap;
}

.jsClient .showView .frame.pGroup {
	border: 1px solid gray;
}

#coraMap, .coraMap {
	height: 600px;
	width: calc(100% - 20px);
}

.boldTextStyle {
	font-weight: bold;
}

.italicTextStyle {
	font-style: italic;
}

.specificationTextStyle, .specificationNormalTextStyle,
	.specificationChildStyle>.childrenView .value {
	color: #999;
}

.specificationTextStyle::before, .specificationNormalTextStyle::before,
	.specificationChildStyle>.childrenView .value::before {
	content: " (";
}

.specificationTextStyle::after, .specificationNormalTextStyle::after,
	.specificationChildStyle>.childrenView .value::after {
	content: ") ";
}

.specificationNormalTextStyle {
	font-weight: normal;
}

.labelSquareBracketTextStyle::before {
	content: " [";
}

.labelSquareBracketTextStyle::after {
	content: "] ";
}

.highlight>.pChildRefHandler>.childrenView>.repeatingElement:nth-child(2n+1)
	{
	background: #d9e9f2;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
	padding: 4px;
}

.frameChildStyle {
	border: dotted 1px red;
}

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: local('Open Sans Regular'), local('OpenSans-Regular'),
		url('../fonts/OpenSans-Regular.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
		U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193,
		U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: local('Open Sans Bold'), local('OpenSans-Bold'),
		url('../fonts/OpenSans-Bold.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
		U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193,
		U+2212, U+2215, U+FEFF, U+FFFD;
}