@charset "UTF-8";
/*
 * -----------------------------------------------------------------------------
 *  Lucom Interaction Platform
 *  (C) Lucom GmbH, Erkrath. All rights reserved.
 * -----------------------------------------------------------------------------
 */

 /* ------------------------------------------------------------- Web-Fonts
*/

/* open-sans-regular - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Open Sans Regular'), local('OpenSans-Regular'),
         url('./fonts/open-sans-v17-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
         url('./fonts/open-sans-v17-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* open-sans-italic - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 400;
    src: local('Open Sans Italic'), local('OpenSans-Italic'),
         url('./fonts/open-sans-v17-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
         url('./fonts/open-sans-v17-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* open-sans-600 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
         url('./fonts/open-sans-v17-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
         url('./fonts/open-sans-v17-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* open-sans-700 - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local('Open Sans Bold'), local('OpenSans-Bold'),
         url('./fonts/open-sans-v17-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
         url('./fonts/open-sans-v17-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* open-sans-600italic - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 600;
    src: local('Open Sans SemiBold Italic'), local('OpenSans-SemiBoldItalic'),
         url('./fonts/open-sans-v17-latin-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
         url('./fonts/open-sans-v17-latin-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* open-sans-700italic - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: 700;
    src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'),
         url('./fonts/open-sans-v17-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
         url('./fonts/open-sans-v17-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* ---------------------------------------------------------------------- common
*/

html, body {
	margin: 0;
	padding: 0;
	width: 100%;
	background-color: #FFFFFF;
}

form, form p, page, textarea {
	margin: 0;
	padding: 0;
}

p {
	margin: 1em 0 0 0;
	padding: 0;
}

h1 {
	margin: 0 0 0.5em 0;
	padding: 0;
}

h2 {
	margin: 0.5em 0 0.25em 0;
	padding: 0;
}

strong {
	font-weight: bold;
}

textarea {
	resize: none;
	border-radius: 3px;
	border: 1px solid #808080;
}

input {
	font-size: 11pt;
	margin: 0;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
	background-color: #FFFFFF;
	color: #1A181B;
	border: 1px solid #808080;
	font-weight: normal;
}

input[type="submit"],
input[type="button"] {
	/* normalize for iOS */
	-webkit-appearance: none;
}

input[type="submit"][disabled] {
	color: #808080;
	color: #ededed;
}

input[type="file"] {
	padding: 5px;
	vertical-align: middle;
}

input.button {
	background-color: #ededed;
	border: 0 none #CCCCCC;
	color: #1A181B;
	margin: 0;
	padding: 1px;
	cursor: pointer;
}

input.button.noBackground {
	background-color: transparent;
}

a.button {
	background-color: #ededed;
	border: 0 none #CCCCCC;
	color: #1A181B;
	margin: 0;
	padding: 1px;
	cursor: pointer;
}

img {
	border: none;
	margin: 0;
	padding: 0;
}

ins {
	background: #A6FFA6;
}

del {
	background: #F8BCBC;
}

.floating:after {
	content: '';
	display: block;
	clear: both;
}

.displayNone {
	display: none;
}

.displayBlock {
	display: block;
}

.displayInline {
	display: inline;
}

input:focus, textarea:focus {
	outline: none;
	background-color: #CCCCCC;
	box-shadow: 0 0 0 1px #1A181B;
}


.error {
	color: #BC4949;
	font-weight: bold;
}

.error ul {
	padding-left: 0;
	margin: 0;
}

.error ul.margin {
	margin-top: 10px;
}

.error li {
	list-style-type: none;
}

.actionWarning {
	color: #BC4949;
	font-weight: bold;
}

.actionWarning ul {
	padding-left: 0;
	margin: 0;
}

.actionWarning li {
	list-style-type: none;
}

.lipConverter .actionWarning ul {
	padding-left: 40px;
}

.lipConverter .actionWarning li {
	list-style-type: disc;
}

.lipConverter .actionError {
	color: #BC4949;
	font-weight: bold;
}

.lipConverter .actionError ul {
	padding-left: 0;
	margin: 0;
}

.lipConverter .actionError li {
	list-style-type: none;
}

.invisible {
	position: absolute;
	height: 10px;
	width: 10px;
	overflow: hidden;
	left: -2000px;
	top: -2000px;
}

/* Content of the welcome page and catalog */
#page {
	width: 100%;
	height:100%;
	display: block;
	background-repeat: repeat-y;
	background-color: #FFFFFF;
}

.bold {
	font-weight: bold;
}

.normal {
	font-weight: normal;
}

.text-danger {
	color: #DC3545 !important;
}

.text-success {
	color: #198754 !important;
}

div.centeredContainer {
	text-align: center;
}

div.centeredContainer > div {
	text-align: left;
	display: inline-block;
}

/* ----------------------------------------------------------- Placeholder Style
*/

::-webkit-input-placeholder { /* Chrome, Opera, Safari, Edge */
	color: #CCCCCC;
}

:-moz-placeholder { /* Firefox 18- */
	color: #CCCCCC;
}

::-moz-placeholder { /* Firefox 19+ */
	opacity: 1.0;
	color: #CCCCCC;
}

::placeholder {
	color: #CCCCCC;
}

/* ------------------------------------------------------------- LAYOUT ELEMENTS
*/

div.table {
	vertical-align: top;
}

div.row {
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
}

div.flexRow {
	display: flex;
}

div.cellLabel {
	float: left;
	padding: 0 5px 0 0;
	width: 120px;
}

.flexRow > .cellLabel {
	flex-shrink: 0;
}

div.cellInfo {
	margin-left: 16px;
	font-style: italic;
}

div.cellValue {
	float: left;
	padding: 0 5px 0 0;
	font-weight: normal;
}

div.clearBoth {
	clear: both;
}

div.floatLeft {
	float: left;
	position: relative;
}

div.floatRight {
	float: right;
	position: relative;
}

span.clearBoth {
	clear: both;
}

span.floatLeft {
	float: left;
	position: relative;
}

span.floatRight {
	float: right;
	position: relative;
}

/* ----------------------------------------- catalog export loading notification
*/

div.catalogExportLoadingNotification {
	font-size: 12pt;
	height: 105px;
	width: 400px;
	padding: 3px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 5px;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
	background-color: #FFAACC;
}

div.catalogExportLoadingNotification img {
	float: left;
}

/* ----------------------------------------------------------------- childWindow
*/

.childWindow {
	font-size: 11pt;
	margin: 0;
	padding: 0;
	color: #1A181B;
	background-color: #FFFFFF;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
}

.childWindow a {
	color: #004291;
	text-decoration: none;
	font-weight: bold;
}

.childWindow a:hover,
.childWindow a:focus {
	text-decoration: underline;
}

/* --------------------------------------------------------------------- tooltip
*/

.tooltip {
	position: absolute;
	display: flex;
	justify-content: space-between;
	visibility: hidden;
	font-size: 9pt;
	margin: 0;
	max-width: 400px;
	min-height: 34px;
	z-index: 5;
	word-wrap: break-word;
	background-color: #FFFFFF;
	color: #1A181B;
	border: 1px solid #07529A;
	border-left-width: 10px;
	border-radius: 3px;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: normal;
}

.tooltip-visible {
	visibility: visible;
}

.fixedHeaderSegmentTooltip {
	z-index: 1000;
}

.tooltip.shaded {
	-moz-box-shadow: 3px 4px 12px 0 rgba(153,153,153,0.85);
	-webkit-box-shadow: 3px 4px 12px 0 rgba(153,153,153,0.85);
	box-shadow: 3px 4px 12px 0 rgba(153,153,153,0.85);
}

.tooltip.lucom {
	border-color: #3D8700;;
}

.tooltip.info {
	border-color: #3572B0;;
}

.tooltip.warning {
	border-color: #F6C342;;
}

.tooltip.error {
	border-color: #BC4949;;
}

.tooltip .icon {
	display: flex;
	align-items: center;
	justify-content: center;
	fill: #07529A;;
}

.tooltip .icon svg {
	width: 34px;
	height: 34px;
	margin: 5px;
}

.tooltip.error .icon {
	fill: #BC4949;;
}

.tooltip.info .icon {
	fill: #3572B0;;
}

.tooltip.lucom .icon {
	fill: #3D8700;;
}

.tooltip.warning .icon {
	fill: #F6C342;;
}

.tooltip .body {
	padding: 7px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: start;
}

.tooltip div.title {
	padding: 3px 0 3px 0;
	font-weight: bold;
	color: #1A181B;
	background-color: #FFFFFF;
}


.tooltip div.close button {
	border: none;
	padding: 0;
	margin: 0;
	width: 25px;
	height: 25px;
	cursor: pointer;
	background-color: transparent;
}

.tooltip div.close button svg {
	fill: #1A181B;
	width: 100%;
	height: 100%;
}

/* Tooltip snatch */
.tooltip:before,
.tooltip:after {
	border-style: solid;
	content: '';
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: transparent;
}

.tooltip:before {
	border-width: 12px;
}

.tooltip:after {
	border-width: 11px;			/* border-width of before - border-width of tooltip */
}

/* right snatch */
.tooltip.right:before,
.tooltip.right:after {
	left: calc(100% - 1px);
	top: 16px;					/* border-width of after + offset (5) */
}

.tooltip.right:before {
	left: 100%;
}

.tooltip.right:before {
	margin-top: -12px;
	border-left-color: #07529A;	/* border color of tooltip */
}

.tooltip.right.lucom:before {
	border-left-color: #3D8700;;
}

.tooltip.right.info:before {
	border-left-color: #3572B0;;
}

.tooltip.right.warning:before {
	border-left-color: #F6C342;;
}

.tooltip.right.error:before {
	border-left-color: #BC4949;;
}

.tooltip.right:after {
	margin-top: -11px;			/* margin-top of before + border-width of tooltip */
	border-left-color: #FFFFFF;	/* background color of tooltip */
}

/* left snatch */
.tooltip.left:before,
.tooltip.left:after {
	top: calc(50% - 9px);  /* At the top of the tooltip */
	right: calc(100% + 10px);
	border-width: 9px;
}

.tooltip.left:before {
	right: calc(100% + 10px);
	top: calc(50% - 10px);  /* At the top of the tooltip */
	border-width: 10px;
	border-right-color: #07529A;	/* border color of tooltip */
}

.tooltip.left.lucom:before {
	border-right-color: #3D8700;;
}

.tooltip.left.info:before {
	border-right-color: #3572B0;;
}

.tooltip.left.warning:before {
	border-right-color: #F6C342;;
}

.tooltip.left.error:before {
	border-right-color: #BC4949;;
}

/* top snatch */
.tooltip.top:before,
.tooltip.top:after {
	bottom: 100%;  /* At the top of the tooltip */
	left: 16px;
	margin-left: -9px;
	border-width: 9px;
	border-bottom-color: #FFFFFF;
}

.tooltip.top:before {
	margin-left: -10px;
	border-width: 10px;
	border-bottom-color: #07529A;
}

.tooltip.top.lucom:before {
	border-bottom-color: #3D8700;;
}

.tooltip.top.info:before {
	border-bottom-color: #3572B0;;
}

.tooltip.top.warning:before {
	border-bottom-color: #F6C342;;
}

.tooltip.top.error:before {
	border-bottom-color: #BC4949;;
}

/* bottom snatch */
.tooltip.bottom:before,
.tooltip.bottom:after {
	top: 100%;  /* At the top of the tooltip */
	left: 16px;
	margin-left: -9px;
	border-width: 9px;
	border-top-color: #FFFFFF;
}

.tooltip.bottom:before {
	margin-left: -10px;
	border-width: 10px;
	border-top-color: #07529A;
}

.tooltip.bottom.lucom:before {
	border-top-color: #3D8700;;
}

.tooltip.bottom.info:before {
	border-top-color: #3572B0;;
}

.tooltip.bottom.warning:before {
	border-top-color: #F6C342;;
}

.tooltip.bottom.error:before {
	border-top-color: #BC4949;;
}

.tooltip.right.valm:before,
.tooltip.left.valm:before{
	top: calc(50% - 10px);  /* At the top of the tooltip */
}

.tooltip.right.valm:after,
.tooltip.left.valm:after {
	top: calc(50% - 9px);
}

.tooltip.right.valb:before,
.tooltip.left.valb:before {
	top: auto;
	bottom: 5px;				/* offset (5) */
}

.tooltip.right.valb:after,
.tooltip.left.valb:after {
	top: auto;
	bottom: 6px;				/* offset (5) + border-width of tooltip */
}

.tooltip.top.halc:before, .tooltip.top.halc:after,
.tooltip.bottom.halc:before, .tooltip.bottom.halc:after {
	left: 50%;
}

.tooltip.top.halr:before,
.tooltip.bottom.halr:before {
	left: auto;
	right: 5px;				/* offset (5) */
}

.tooltip.top.halr:after,
.tooltip.bottom.halr:after {
	left: auto;
	right: 6px;				/* offset (5) + border-width of tooltip */
}

.tooltip ins p,
.tooltip del p,
.tooltip ins div,
.tooltip del div,
.tooltip ins span,
.tooltip del span {
	margin: 0;
	padding: 0;
}

.tooltip.addSegment:after,
.tooltip.addSegment:before,
.tooltip.removeSegment:after,
.tooltip.removeSegment:before {
	/* remove snatch */
	border-width: 0;
}

.tooltip.addSegment {
	cursor: pointer;
}

.tooltip.removeSegment {
	cursor: pointer;
	border-left-width: 1px;
	margin-top: 5px;
}

.tooltip.removeSegment .icon {
	width: 31px;
	height: 36px;

	/* Rebuild the "minus" icon from a border, since there is no proper way to change tooltip icons currently.
	   While hacky, it looks identical.
	   TODO: should be removed, once tooltips icons can be changed */
	border: solid #BC4949;
	border-width: 15px 6px 15px 5px;
}

.tooltip.removeSegment .icon svg {
	display: none;
}


/* ------------------------------------------------------------- prepareSQLSchema
*/

#catalog_prepareSQLSchemaWizard .codeBase{
	width:100%;
	margin: 5px 0 5px 0;
	font-size:10pt;
	font-family: Courier New, Courier, monospace;
}

#catalog_prepareSQLSchemaWizard .codeErrorBackground{
	background-color: #EED0D0;
}

#catalog_prepareSQLSchemaWizard .codeRegularBackground{
	background-color: #ededed;
}

#catalog_prepareSQLSchemaWizard .codeProcessedTextColor{
	color: #1A181B;
}

#catalog_prepareSQLSchemaWizard .codeUnprocessedTextColor{
	color: #A9A9A9;
}

#catalog_prepareSQLSchemaWizard .successMessage{
	color: #198754;
}

#catalog_prepareSQLSchemaWizard .errorMessage{
	color: #FF0000;
}

#catalog_prepareSQLSchemaWizard .errorMessageBold{
	color: #FF0000;
	font-weight: bold;
}

#catalog_prepareSQLSchemaWizard #sql{
	width:100%;
	font-family:Courier New, Courier, monospace;
	font-size:10pt;
	background-color:white;
}

/* -------------------------------------------------------------------- importXMLData
*/

.importXMLData {
	display: block;
}

.importXMLData input[type="submit"] {
	margin-right:5px;
}

.simpleImage {
	background-color: transparent;
	border: none;
}

/* ACL GUI --------------- */
div.acl-header {
	font-size: 11pt;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
}

input.acl-header, input:focus.acl-header {
	border: none;
	font-size: 11pt;
	vertical-align: middle;
	background-color: transparent;
}

input.setChooser {
	text-align: left;
	cursor: pointer;
	line-height: 20px;
	border: none;
	color: #CCCCCC;
	font-weight: normal;
}

input.setChooserChosen {
	text-align: left;
	cursor: pointer;
	line-height: 20px;
	border: none;
	color: #000000;
	font-weight: normal;
}

input.acl-edit-groups,
button.acl-edit-groups {
	border: none;
	vertical-align: middle;
	background-image: url(../images/action/edit_16.png);
	background-repeat: no-repeat;
	-moz-border-radius: 0;
	margin: 0;
	width: 16px;
	height: 16px;
	background-color: transparent;
}

div.acl-matrix {
	font-size: 8pt;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
}

th.acl-matrix {
	text-align: left;
	background-color: #ededed;
}

div.acl-matrix .row0 {
	background-color: #ededed;
}

div.acl-matrix .row1 {
	background-color: #FFFFFF;
}

table.acl-matrix {
	border-width: 1px;
	border-style: solid;
	width: 70%;
	border-color: #808080;
}

input.acl-matrix {
	font-size: 8pt;
	height: 10pt;
	-moz-border-radius: 0;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
	background-color: transparent;
}

input[disabled].acl-matrix {
	font-size: 8pt;
	height: 10pt;
	-moz-border-radius: 0;
	background-color: #EEEEEE;
	color: #808080;
}

input[type="checkbox"].acl-matrix, input[type="radio"].acl-matrix {
	border: none;
	vertical-align: middle;
	background-color: transparent;
}

input.tabChooser, input:focus.tabChooser {
	font-size: 8pt;
	cursor: pointer;
	border-width: 1px;
	border-style: solid;
	border-bottom: none;
	-moz-border-radius: 0;
	background-color: transparent;
	border-color: #808080;
	color: #CCCCCC;
	font-weight: bold;
}

input.tabChooserChosen {
	font-size: 8pt;
	cursor: pointer;
	border-width: 1px;
	border-style: solid;
	border-bottom: none;
	-moz-border-radius: 0;
	background-color: transparent;
	border-color: #808080;
	color: #000000;
	font-weight: bold;
}

div.acl-matrix .label {
	width: 100px;
	float: left;
	font-weight: bold;
}

div.acl-submit-panel {
	width: 70%;
	text-align: right;
}

/* --------------------------------------------------------------------- dialogs
*/

.dialog {
	font-size: 14px;
	border-radius: 3px;
	background-color: #FFFFFF;
	color: #1A181B;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: normal;
	box-shadow: #00000040 2px 2px 2px 0;
}

.dialog .buttons {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 5px;
}

.dialog .button {
	font-size: 15px;
	padding: 10px 15px;
	height: 40px;
	border-style: solid;
	border-width: 2px;
}

.dialog .button.secondary,
.dialog .button.primary {
	min-width: 100px;
}

.dialog .header {
	display: block;
	height: 60px;
	border-radius: 3px 3px 0 0;
	padding: 0 20px;
	box-sizing: border-box;
	color: #004291;

	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #DCDCDC;
}

.dialog .header.flex-wrapper {
	display: flex;
}

.dialog .header h2 {
	margin: 0;
	font-size: 18px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;

	font-weight: bold;
}

.dialog .content {
	display: block;
	padding: 10px 20px;
	overflow-x: hidden;
	overflow-y: auto;
	box-sizing: border-box;
	/* 20px: offset top/bottom, 100px: height of dialog header/footer */
	max-height: min(800px, calc(100vh - 20px - 100px));
}

.dialog .content .text {
	font-size: 15px;
	font-weight: normal;
	color: #1A181B;
}

.dialog .content p {
	margin: 10px 0;
}

.dialog .footer {
	display: block;
	height: 60px;
	border-radius: 0 0 3px 3px;
	padding: 0 20px;
	box-sizing: border-box;
	color: #004291;

	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #DCDCDC;
}

.dialog .footer.flex-wrapper {
	display: flex;
	justify-content: flex-end;
}

/* ----------------------------------------------------------------- pageBrowser
*/

.page-browser.hidden {
	display: none;
}

.pageBrowser {
	list-style: none;
	padding: 0;
	margin: 0;
	cursor: default;
	white-space: nowrap;
}

.pageBrowser .button {
	padding: 5px;
	margin: 0;
	border: none 0;
	width: auto;
	height: auto;
}

.pageBrowser .button[disabled] {
	background-color: transparent;
	cursor: default;
}

.pageBrowser .button:not([disabled]):focus,
.pageBrowser .button:not([disabled]):hover {
	outline: 2px solid #424242;
	outline-offset: -2px;
	border: none 0;
}

.pageBrowser .button .svg-container {
	width: 30px;
	height: 30px;
}

.pageBrowser .button:not([disabled]):hover .svg-container {
	fill: #004291;
}

.pageBrowser .current {
	font-size: 14px;
	font-weight: 700;
	padding: 10px;
	width: 30px;
	height: 30px;
}

/* ----------------------------------------------------------- attachment dialog
*/

.fileAttachment {
	width: 800px;
	overflow-x: auto;
	overflow-y: hidden;
}

.fileAttachment .dialog .hidden {
	display: none !important;
}

.fileAttachment .dialog div.content h3 {
	font-size: 15px;
}

.fileAttachment .dialog div.content h3 span {
	color: #757575;
	font-weight: normal;
}

.fileAttachment .dialog div.content .noFiles {
	padding-bottom: 30px;
}

.fileAttachment .dialog div.content .list {
	max-height: 460px;
	overflow-x: hidden;
	overflow-y: auto;
}

.fileAttachment .dialog div.content .add {
	margin-top: 20px;
}

.fileAttachment .dialog div.content .add .uploadControl {
	width: 100%;
	padding-top: 5px;
}

.fileAttachment .dialog div.content .add .uploadControl input[type="submit"] {
	margin-right: 0;
	margin-left: 0;
}

.fileAttachment .dialog div.content .add .uploadControl .fileSelect {
	overflow: hidden;
	padding-right: 6px;
	margin-right: 10px;
	float: left;
	width: 100%;
	max-width: 84%;
}

.fileAttachment .dialog div.content .add .uploadControl .fileSelect input[type="file"] {
	border-width: 1px;
	border-style: solid;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	height: 30px;
	width: 100%;
	line-height: 30px;
	margin: 0;
	padding: 0;
	border-color: #CCCCCC;
}

.fileAttachment .dialog div.content .add .uploadControl .fileSelect input[type="file"]:focus {
	outline: none;
}

.fileAttachment .dialog div.content .add .uploadControl .customFileSelect {
	position: relative;
	cursor: pointer;
	height: 30px;
	margin-right: 10px;
	border-width: 1px;
	border-style: solid;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	overflow: hidden;
	float: left;
	width: 100%;
	max-width: 84%;
	border-color: #CCCCCC;
}

.fileAttachment .dialog div.content .add .uploadControl .customFileSelect .text {
	cursor: pointer;
	line-height: 30px;
	height: 31px;
	width: 100%
}

.fileAttachment .dialog div.content .add .uploadControl .customFileSelect .text .filename {
	border-style: none;
	padding: 0 1px 0 5px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.fileAttachment .dialog div.content .add .uploadControl .customFileSelect .text div:first-child {
	border-left-width: 1px;
	border-left-style: solid;
	border-radius: 0 2px 2px 0;
	-moz-border-radius: 0 2px 2px 0;
	-webkit-border-radius: 0 2px 2px 0;
	float: right;
	height: 100%;
	padding-left: 5px;
	padding-right: 5px;
	border-left-color: #CCCCCC;
	background-color: #FFFFFF;
}

.fileAttachment .dialog div.content .add .uploadControl .customFileSelect input[type="file"] {
	cursor: pointer;
	position: absolute;
	top: 0;
	left: 0;
	line-height: 20px;
	padding: 5px 0;
	margin: 0;
	width: 100%;
	opacity: 0;
}

.fileAttachment .dialog div.content .add .uploadControl .addButton {
	text-align: right;
	white-space: nowrap;
	width: 1px;
	overflow: visible;
}

.fileAttachment .dialog div.content .add .dropZone {
	border-width: 2px;
	border-style: dashed;
	border-radius: 5px;
	text-align: center;
	position: relative;
	padding: 20px 0;
	cursor: pointer;
	border-color: #1A181B;
	color: #1A181B;
}

.fileAttachment .dialog div.content .add .dropZone:hover,
.fileAttachment .dialog div.content .add .dropZone:focus {
	outline: none;
	border: solid 2px #FFFFFF;
	box-shadow: 0 0 0 2px #1A181B;
}

.fileAttachment .dialog div.content .add .dropZone > input[type="file"] {
	display: block;
	position: absolute;
	opacity: 0;
	height: 100%;
	width: 100%;
	padding: 0;
	margin: 0;
	outline: none;
	border: none;
}

.fileAttachment .dialog div.content .add .dropZone > input[type="file"]:focus,
.fileAttachment .dialog div.content .add .dropZone > input[type="file"]:active,
.fileAttachment .dialog div.content .add .dropZone > input[type="file"]:hover {
	background-color: transparent;
	opacity: 0;
	outline: none;
	border: none;
}

.fileAttachment .dialog div.content .add .dropZone .svg-container {
	width: 48px;
	height: 48px;
}

.fileAttachment .dialog div.content .add .dropZone div {
	margin-top: 5px;
}

.fileAttachment .dialog div.content .add .dropZone.dragOver .svg-container,
.fileAttachment .dialog div.content .add .dropZone:hover .svg-container {
	fill: #004291;
}

.fileAttachment .dialog div.content .add .dropZone.dragOver,
.fileAttachment .dialog div.content .add .dropZone:hover {
	color: #004291;
	text-decoration: underline;
}

.fileAttachment .dialog div.content .uploaded-container {
	margin: 30px 0 20px 0;
}

.fileAttachment .dialog div.content .list,
.fileAttachment .dialog div.content .list * {
	box-sizing: border-box;
}

.fileAttachment .dialog div.content table.list {
	table-layout: auto;
	border-collapse: collapse;
	border: none;
	padding: 0;
	width: 100%;
}

.fileAttachment .dialog div.content table.list caption {
	text-align: left;
}

.fileAttachment .dialog div.content table.list thead {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
}

.fileAttachment .dialog div.content table.list th.sortable {
	text-align: left;
	padding: 0;
	color: #1A181B;
}

.fileAttachment .dialog div.content table.list thead th button {
	background-color: transparent;
	width: 100%;
	height: 50px;
	text-align: left;
	font-size: 14px;
	cursor: pointer;

	border: solid 2px transparent;
	border-radius: 3px;

	font-weight: 700;
}

.fileAttachment .dialog div.content table.list thead th button:focus,
.fileAttachment .dialog div.content table.list thead th button:hover {
	outline-width: 2px;
	outline-style: solid;
	outline-offset: -2px;
	outline-color: #1A181B;
}

.fileAttachment .dialog div.content table.list thead th button:hover {
	text-decoration: underline;
	color: #004291;
}

.fileAttachment .dialog div.content table.list thead th button:hover .svg-container {
	fill: #004291;
}

.fileAttachment .dialog div.content table.list thead th.sortable.disabled,
.fileAttachment .dialog div.content table.list thead th.sortable input:disabled {
	cursor: default;
}

.fileAttachment .dialog div.content table.list tbody td {
	padding: 10px;
}

.fileAttachment .dialog div.content table.list tbody td:not(:last-child) {
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
}

.fileAttachment .dialog div.content table.list tbody td:first-child {
	padding-left: 0;
}

.fileAttachment .dialog div.content table.list tbody tr:nth-child(even) {
	background-color: #ededed;
}

.fileAttachment .dialog div.content table.list tbody tr:hover {
	outline-width: 2px;
	outline-style: solid;
	outline-color: #1A181B;
}

.fileAttachment .dialog div.content table.list tbody tr:hover > *:not(a > div) {
	color: #004291;
}

.fileAttachment .dialog div.content table.list tbody tr:hover .svg-container {
	fill: #004291;
}

.fileAttachment .dialog div.content table.list img {
	vertical-align: middle;
}

.fileAttachment .dialog div.content table.list a {
	max-width: 380px;
	display: inline-block;
	text-overflow: ellipsis;
	overflow: hidden;
	font-size: 11pt;
	white-space: nowrap;

	color: #004291;
	text-decoration: underline;
	border-color: transparent;
}

.fileAttachment .dialog div.content table.list a:focus {
	outline: none;
	border: none;
	box-shadow: none;
}

.fileAttachment .dialog div.content table.list tBody button {
	background-color: transparent;
	border-style: solid;
	border-width: 2px;
	border-radius: 3px;
	cursor: pointer;
	border-color: transparent;
}

.fileAttachment .dialog div.content table.list input[type="image"]:focus {
	outline: none;
	border: solid 2px #FFFFFF;
	box-shadow: 0 0 0 2px #1A181B;
}

.fileAttachment .dialog div.content table.list .preview {
	min-width: 72px;
}

.fileAttachment .dialog div.content table.list .preview img {
	max-height: 60px;
}

.fileAttachment .dialog div.content table.list .link {
	width: 100%;
}

.fileAttachment .dialog div.content table.list th.link {
	padding-left: 6px;
	padding-right: 6px;
}

.fileAttachment .dialog div.content table.list td.link > div {
	border-radius: 3px;
	padding: 10px 6px;
}

.fileAttachment .dialog div.content table.list td.link > div:focus-within {
	outline: 2px solid #424242;
	outline-offset: 2px;
}

.fileAttachment .dialog div.content table.list .temporary ~ div {
	display: block;
	float: right;
	margin-left: auto;
	padding: 2px 5px;
	border-radius: 3px;
	font-size: 14px;
	background-color: #5CB85C;
	color: #FFFFFF;
	font-family: monospace;
}

.fileAttachment .dialog div.content table.list .date {
	white-space: nowrap;
	min-width: 100px;
	max-width: 100px;
	text-overflow: ellipsis;
	overflow: hidden;
	padding-left: 6px;
	padding-right: 6px;
}

.fileAttachment .dialog div.content table.list .size {
	white-space: nowrap;
	min-width: 85px;
	max-width: 85px;
	text-overflow: ellipsis;
	overflow: hidden;
	padding-left: 6px;
	padding-right: 6px;
}

.fileAttachment .dialog div.content table.list .delete {
	padding: 0;
	width: 100%;
	height: 100%;
	min-width: 36px;
	max-width: 36px;
}

.fileAttachment .dialog div.content table.list .delete button {
	width: 100%;
	height: 100%;
	padding: 10px;
	margin: 0;
}

.fileAttachment .dialog div.content table.list .delete button:disabled {
	cursor: default;
}

/* Progress bar */
.fileAttachment .dialog div.content .resumable .progress-list {
	height: 100%;
	width: 100%;
	padding: 10px 0 10px 0;
}

.fileAttachment .dialog div.content .resumable .progress-list ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 100%;
}

.fileAttachment .dialog div.content .resumable .progress-list ul li {
	margin: 20px 0 0 0;
	padding: 0;
	width: 100%;
}

.fileAttachment .dialog div.content .resumable .progress-list ul li .filename {
	word-break: break-word;
	overflow-wrap: break-word;
}

/* WebKit */
@-webkit-keyframes progress-bar-stripes {
	from {
		background-position: 0 0;
	}
	to {
		background-position: 40px 0;
	}
}

@keyframes progress-bar-stripes {
	from {
		background-position: 0 0;
	}
	to {
		background-position: 40px 0;
	}
}

.fileAttachment .dialog div.content .resumable .progress-list .bar-container {
	line-height: 1.42857143;

	font-size: 14pt;

	height: 30px;
	overflow: hidden;

	width: 100%;

	border-style: solid;
	border-width: 2px;
	border-radius: 3px;

	background-color: #ededed;
	-webkit-box-shadow: inset 0 1px 2px #E5E5E5;
	box-shadow: inset 0 1px 2px #E5E5E5;
	border-color: transparent;
	text-decoration: none;
	font-style: normal;
	font-weight: normal;
}

.fileAttachment .dialog div.content .resumable .progress-list .bar-container.focussed {
	outline: none;
	border: solid 2px #FFFFFF;
	box-shadow: 0 0 0 2px #1A181B;
}


.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar {
	font-size: .75em;
	width: 0;
	height: 100%;
	line-height: 30px;
	text-align: left;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	background-color: #07529A;
	color: #FFFFFF;
	-webkit-box-shadow: inset 0 -1px 0 #D9D9D9;
	box-shadow: inset 0 -1px 0 #D9D9D9;
}

.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar.failed {
	background-color: #EE1111;
}

.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar.active {
	-webkit-animation: progress-bar-stripes 2s linear infinite;
	-o-animation: progress-bar-stripes 2s linear infinite;
	animation: progress-bar-stripes 2s linear infinite;
}

.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar.striped,
.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar.striped.failed {
	background-image: -webkit-linear-gradient(135deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
	background-image: -o-linear-gradient(135deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
	background-image: linear-gradient(135deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
	-webkit-background-size: 40px 40px;
	background-size: 40px 40px;
}

.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar.striped:focus,
.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar.striped.failed:focus {
	outline: none;
}

.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar div {
	padding-left: 5px;
	display: flex;
}

.fileAttachment .dialog div.content .resumable .progress-list .bar-container .bar svg {
	fill: white;
}

.fileAttachment .dialog div.content .resumable .progress-list .progress {
	padding: 0 10px 0 20px;
}

.fileAttachment .dialog div.content .resumable .progress-list .control {
	font-size: 14pt;
	display: block;
	text-align: center;
	padding: 0;
	height: 30px;
	min-width: 30px;
	max-width: 30px;
	background: no-repeat center;
	margin: 0 0 0 5px;
	border-style: solid;
	border-width: 2px;
	border-radius: 3px;

	background-color: #ededed;
	border-color: transparent;
	-webkit-box-shadow: inset 0 1px 2px #E5E5E5;
	box-shadow: inset 0 1px 2px #E5E5E5;
}

.fileAttachment .dialog div.content .resumable .progress-list .control:disabled {
	opacity: .5;
	cursor: default;
}

.fileAttachment .dialog div.content .resumable .progress-list .control.resume {
	background-image: url(../script/form/attachments/resumable.js/resume.png);
}

.fileAttachment .dialog div.content .resumable .progress-list .control.pause {
	background-image: url(../script/form/attachments/resumable.js/pause.png);
}

.fileAttachment .dialog div.content .resumable .progress-list .control.cancel {
	background-image: url(../script/form/attachments/resumable.js/cancel.png);
}

.fileAttachment .dialog div.content .resumable .progress-list .control:focus {
	outline: none;
	border: solid 2px #FFFFFF;
	box-shadow: 0 0 0 2px #1A181B;
}

/* Flexbox */
.fileAttachment .dialog div.content .resumable .progress-list .flex-container {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
}

.fileAttachment .dialog div.content .resumable .progress-list .flex-container .flex-container {
	flex-direction: row;
	align-items: center;
	width: 100%;
	margin: 10px 0;
}

/* Viewport width dependent rules */
@media (max-width: 460px) {
	.fileAttachment .dialog .info .icon {
		display: none;
	}

	.fileAttachment .dialog .info .text {
		padding-left: 10px;
	}
}

.fileAttachment #lip_attachmentDescription {
	visibility: hidden;
	height: 0;
}

.fileAttachment .dropZone.isIE{
	width: 99%;
}

/* --------------------------------------------------------------- lookup dialog
*/

.lookupWindow {
	overflow-x: auto;
	overflow-y: hidden;
}

.lookupWindow .dialog {
	color: #1A181B;
}

/* not modal dialog */
body > .lookupWindow .dialog {
	margin: 30px;
}

.lookupWindow .dialog .description {
	padding-bottom: 10px;
	padding-top: 10px;
}

.lookupWindow .dialog .matchcode {
	margin-top: 30px;
}

.lookupWindow .dialog .matchcode .button {
	margin-left: 10px;
}

.lookupWindow .dialog .matchcode input[type="text"] {
	width: 100%;
	height: 40px;
	padding: 0 10px;
	border-width: 1px;
	border-style: solid;
	border-radius: 3px;
	border-color: #808080;
}

.lookupWindow .dialog .matchcode input[type="text"]:hover,
.lookupWindow .dialog .matchcode input[type="text"]:focus {
	outline-width: 2px;
	outline-style: solid;
	border: none;
	box-shadow: none;
	outline-color: #1A181B;
}

.lookupWindow .dialog .matchcode input[type="text"]::placeholder {
	font-size: 15px;
	color: #CCCCCC;
	font-style: normal;
}

.lookupWindow .dialog .navigation {
	margin: 20px 0;
	height: 40px;
}

.lookupWindow .dialog .navigation.flex-wrapper {
	justify-content: space-between;
}

.lookupWindow .dialog .navigation.flex-wrapper.bottom {
	justify-content: flex-end;
}

.lookupWindow .dialog .navigation .row-indicator {
	font-size: 16px;
	font-weight: 700;
	font-style: italic;
}

.lookupWindow .dialog .navigation .separator {
	height: 32px;
	margin: 0 10px;
	background-color: #CCCCCC;
}

.lookupWindow .dialog div.content .list .table {
	width: 100%;
	padding: 0;
	table-layout: auto;
	border-collapse: collapse;
}

.lookupWindow .dialog div.content .list .table .tHeader {
	height: 50px;

	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;

	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-color: #CCCCCC;
}

.lookupWindow .dialog div.content .list .table .tHeader .tCell {
	text-align: left;
	padding-left: 10px;
	color: #1A181B;
}

.lookupWindow .dialog div.content .list .table .tBody .tRow {
	cursor: pointer;
}

.lookupWindow .dialog div.content .list .table .tBody .tRow.oddRow {
	background-color: #F5F5F5;
}

.lookupWindow .dialog div.content .list .table .tBody .tRow:hover,
.lookupWindow .dialog div.content .list .table .tBody .tRow:focus-within {
	outline-width: 2px;
	outline-style: solid;
	outline-offset: -2px;
	outline-color: #1A181B;
}

.lookupWindow .dialog div.content .list .table .tBody .tRow:hover a {
	color: #004291;
}

.lookupWindow .dialog div.content .list .table .tBody .tCell {
	overflow: hidden;
	text-overflow: ellipsis;
	padding: 10px;
}

.lookupWindow .dialog div.content .list .table .tBody td:not(:last-child) {
	border-right-width: 2px;
	border-right-style: solid;
	border-color: #FFFFFF;
}

.lookupWindow .dialog div.content .list .table .tBody .tCell a {
	color: #1A181B;
	text-decoration: none;
}

.lookupWindow .dialog div.content .list .table .tBody .tCell:hover a,
.lookupWindow .dialog div.content .list .table .tBody .tCell:focus a {
	text-decoration: underline;
}

.lookupWindow .dialog div.content .list .table .tBody .tCell a:focus {
	outline-offset: 2px;
	outline-width: 2px;
	outline-style: solid;
	border-radius: 3px;
	outline-color: #1A181B;
}

.lookupWindow .dialog div.content .list {
	margin: 20px 0;
	overflow: auto;
}

/* ------------------------------------------------------------------ checkboxes
*/

@font-face {
	font-family: 'lip_Checkbox';
	src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBD8AAAC8AAAAYGNtYXAYVtCJAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5Zn4huwUAAAF4AAABYGhlYWQGPe1ZAAAC2AAAADZoaGVhB30DyAAAAxAAAAAkaG10eBBKAEUAAAM0AAAAHGxvY2EAmgESAAADUAAAABBtYXhwAAkALwAAA2AAAAAgbmFtZSC8IugAAAOAAAABknBvc3QAAwAAAAAFFAAAACAAAwMTAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADoAgPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg6AL//f//AAAAAAAg6AD//f//AAH/4xgEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAEUAUQO7AvgAGgAAARQHAQYjIicBJjU0PwE2MzIfAQE2MzIfARYVA7sQ/hQQFhcQ/uMQEE4QFxcQqAF2EBcXEE4QAnMWEP4UEBABHRAXFhBOEBCoAXcQEE4QFwAAAAABAAABbgMlAkkAFAAAARUUBwYjISInJj0BNDc2MyEyFxYVAyUQEBf9SRcQEBAQFwK3FxAQAhJtFxAQEBAXbRcQEBAQFwAAAAABAAAASQMlA24ALAAAARUUBwYrARUUBwYrASInJj0BIyInJj0BNDc2OwE1NDc2OwEyFxYdATMyFxYVAyUQEBfuEBAXbhYQEO4XEBAQEBfuEBAWbhcQEO4XEBACEm0XEBDuFxAQEBAX7hAQF20XEBDuFxAQEBAX7hAQFwAAAQAAAAIAAHRSzT9fDzz1AAsEAAAAAADRsdR3AAAAANGx1HcAAAAAA7sDbgAAAAgAAgAAAAAAAAABAAADwP/AAAAEAAAAAAADuwABAAAAAAAAAAAAAAAAAAAABwQAAAAAAAAAAAAAAAIAAAAEAABFAyUAAAMlAAAAAAAAAAoAFAAeAE4AcgCwAAEAAAAHAC0AAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAIAAAAAQAAAAAAAgAHAGkAAQAAAAAAAwAIADkAAQAAAAAABAAIAH4AAQAAAAAABQALABgAAQAAAAAABgAIAFEAAQAAAAAACgAaAJYAAwABBAkAAQAQAAgAAwABBAkAAgAOAHAAAwABBAkAAwAQAEEAAwABBAkABAAQAIYAAwABBAkABQAWACMAAwABBAkABgAQAFkAAwABBAkACgA0ALBDaGVja2JveABDAGgAZQBjAGsAYgBvAHhWZXJzaW9uIDIuMABWAGUAcgBzAGkAbwBuACAAMgAuADBDaGVja2JveABDAGgAZQBjAGsAYgBvAHhDaGVja2JveABDAGgAZQBjAGsAYgBvAHhSZWd1bGFyAFIAZQBnAHUAbABhAHJDaGVja2JveABDAGgAZQBjAGsAYgBvAHhGb250IGdlbmVyYXRlZCBieSBJY29Nb29uLgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype');
}

.lip_checkbox input[type="checkbox"],
.lip_checkbox input[type="radio"],
.lip_checkbox div[data-type="checkbox"],
.lip_checkbox div[data-type="radio"] {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	cursor: pointer;
	opacity: 0 !important;
	z-index: 3;
}

.lip_checkbox.hidden *,
.lip_checkbox.hidden {
	visibility: hidden;
}

.lip_checkbox > div > .before,
.lip_checkbox > div > .after,
.lip_checkbox > div > .after:before {
	position: absolute;
	top: 0;
	left: 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: border 0.1s ease, opacity 0.1s ease, box-shadow 0.1s ease, -webkit-transform 0.1s ease;
	transition: border 0.1s ease, opacity 0.1s ease, box-shadow 0.1s ease, -webkit-transform 0.1s ease;
	transition: border 0.1s ease, opacity 0.1s ease, transform 0.1s ease, box-shadow 0.1s ease;
	transition: border 0.1s ease, opacity 0.1s ease, transform 0.1s ease, box-shadow 0.1s ease, -webkit-transform 0.1s ease;
	box-sizing: border-box;
	display: block;
}


/* checkbox/radio hover/active outline (because it cannot be set in formStyles) */
.lip_checkbox:hover .before,
.lip_checkbox:active .before {
	outline: none;
	box-shadow: 0 0 0 1px #1A181B;

}

/* checkbox */
.lip_checkbox input[type="radio"] ~ div > .before,
.lip_checkbox div[data-type="radio"] ~ div > .before {
	-webkit-border-radius: 50% !important;
	-moz-border-radius: 50% !important;
	border-radius: 50% !important;
}

/* checkmark */
.lip_checkbox input[type="checkbox"] ~ div > .after,
.lip_checkbox div[data-type="checkbox"] ~ div > .after {
	height: 100%;
	visibility: hidden;
	padding: 1px;
}

.lip_checkbox div > .after .lip_icon > span,
.lip_checkbox input[type="checkbox"] ~ div > .after .lip_icon > span,
.lip_checkbox div[data-type="checkbox"] ~ div > .after lip_icon > span{
	height: 100%;
}

.lip_checkbox div .after svg,
.lip_checkbox input[type="checkbox"] ~ div > .after svg,
.lip_checkbox div[data-type="checkbox"] ~ div > .after svg {
	width: 100%;
	height: 100%;
}

.lip_checkbox input[type="checkbox"]:checked ~ div > .after,
.lip_checkbox div[data-type="checkbox"][data-checked="checked"] ~ div > .after {
	color: #004291;
	visibility: visible;
}

.lip_checkbox input[type="radio"]:checked ~ div > .after:before,
.lip_checkbox div[data-type="radio"][data-checked="checked"] ~ div > .after:before {
	content: '';
	transform: scale(.5);
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	width: 100%;
	height: 100%;
	background-color: #004291;
}

/* disabled */

.lip_checkbox input[disabled],
.lip_checkbox div[data-type="checkbox"],
.lip_checkbox div[data-type="radio"] {
	cursor: not-allowed;
}

.lip_checkbox input[disabled] ~ div,
.lip_checkbox input[disabled] ~ div .after,
.lip_checkbox div[data-type="checkbox"] ~ div,
.lip_checkbox div[data-type="checkbox"] ~ div .after,
.lip_checkbox div[data-type="radio"] ~ div,
.lip_checkbox div[data-type="radio"] ~ div .after {
	opacity: 0.5;
	color: #808080;
}

/* ------------------------------------------------------------- checkbox slider
*/

.lip_checkbox.toggle > div {
	position: absolute;
}

.lip_checkbox.toggle > div > .before {
	z-index: 1;
	-webkit-transform: none;
	transform: none;
	border: none;
	top: 0;
	float: left;
}

.lip_checkbox.toggle > div > .after {
	background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
	background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.05));
	opacity: 1;
	box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15),
				0 0 0 1px rgba(34, 36, 38, 0.15) inset;

	position: absolute;
	top: 0;
	left: -1px;
	z-index: 2;

	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;

	-webkit-transition: background 0.3s ease, left 0.3s ease;
	transition: background 0.3s ease, left 0.3s ease;

	background-color: #FFFFFF;
}

.lip_checkbox.toggle input[type="checkbox"] ~ div > .after:before,
.lip_checkbox.toggle div[data-type="checkbox"] ~ div > .after:before {
	content: '';
}

.lip_checkbox.toggle input:checked ~ div > .after,
.lip_checkbox.toggle div[data-checked="checked"] ~ div > .after {
	left: 57.5%;
}

.flex-center-container {
	display: flex !important;
	justify-content: center;
	align-items: center;
}

:root {
	--lip-theme-primary-color: #004291;;
	--lip-theme-white-color: #FFFFFF;;
	--lip-theme-secondary-color: #757575;;
	--lip-theme-text-color: #1A181B;;
	--lip-theme-row-background-color: #F5F5F5;;
	--lip-theme-error-color: #BC4949;;
	--lip-theme-warning-color: #F6C342;;
	--lip-theme-info-color: #3572B0;;
	--lip-theme-gray1-color: #808080;;
	--lip-theme-gray2-color: #CCCCCC;;
	--lip-theme-gray3-color: #EEEEEE;;

	--lip-theme-primary-color-darker: #003475;;
	--lip-theme-primary-color-lighter: #3467a6;;
	--lip-theme-secondary-color-darker: #686868;;
	--lip-theme-secondary-color-lighter: #9b9b9b;;

	--lip-theme-font-default: Open Sans, Verdana, Arial, Helvetica, sans-serif;

}

/*
 * -----------------------------------------------------------------------------
 *  Lucom Interaction Platform
 *  (C) Lucom GmbH, Erkrath. All rights reserved.
 * -----------------------------------------------------------------------------
 */

.lip-modal-window-background {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	max-width: 100vw;


	height: 100%;

	z-index: 3002;
	display: none;
	background-color: #000000;
	opacity: 0.4;
}

.lip-modal-window-background.loadingIndicator {
	background-color: #FFFFFF;
}

.lip-modal-window-tmp,
.lip-modal-window {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	max-width: 100vw;
	height: 100%;
	align-items: center;
	justify-content: center;
}

.lip-modal-window-tmp {
	z-index: 2999;
}

.lip-modal-window {
	z-index: 3003;
}

@keyframes loadingIndicator {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

.loading-notification svg {
	margin: auto;
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	display: block;
	shape-rendering: auto;
	width: 191px;
	height: 191px;
}

.loading-notification svg rect {
	animation-duration: 3.3333333333333335s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	animation-name: loadingIndicator;
	fill: #004291;
}

.loading-notification svg g:nth-child(1) rect {
	animation-delay: -3.055555555555556s;
}

.loading-notification svg g:nth-child(2) rect {
	animation-delay: -2.777777777777778s;
}

.loading-notification svg g:nth-child(3) rect {
	animation-delay: -2.5000000000000004s;
}

.loading-notification svg g:nth-child(4) rect {
	animation-delay: -2.2222222222222223s;
}

.loading-notification svg g:nth-child(5) rect {
	animation-delay: -1.9444444444444446s;
}

.loading-notification svg g:nth-child(6) rect {
	animation-delay: -1.6666666666666667s;
}

.loading-notification svg g:nth-child(7) rect {
	animation-delay: -1.388888888888889s;
}

.loading-notification svg g:nth-child(8) rect {
	animation-delay: -1.1111111111111112s;
}

.loading-notification svg g:nth-child(9) rect {
	animation-delay: -0.8333333333333334s;
}

.loading-notification svg g:nth-child(10) rect {
	animation-delay: -0.5555555555555556s;
}

.loading-notification svg g:nth-child(11) rect {
	animation-delay: -0.2777777777777778s;
}

.loading-notification svg g:nth-child(12) rect {
	animation-delay: 0s;
}

/*
 * -----------------------------------------------------------------------------
 *  Lucom Interaction Platform
 *  (C) Lucom GmbH, Erkrath. All rights reserved.
 * -----------------------------------------------------------------------------
 */


/* -------------------------------------------------------------- viewEmbeddings
*/

.viewEmbeddings {
	position: relative;
	font-size: 11pt;
	line-height: 20px;
	cursor: default;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
	color: #1A181B;
}

.viewEmbedding .headlineWrapper {
	grid-row: 1;
	grid-column: 2;
	display: flex;
	align-items: end;
	min-height: 46px;
	margin-right: 30px;
}

.viewEmbedding .headlinePlaceholder {
	grid-row: 1;
	grid-column: 2;
	height: 10px;
}

#lip_formBean .form div.formControl.lip_error-notifications-label h3,
.viewEmbedding .headline {
	margin: 0;
	font-size: 18px;
	color: #1A181B;
	font-weight: bold;
}

#lip_formBean .form div.formControl.lip_error-notifications-label h3 {
	margin: 10px 0 0;
}

#lip_formBean .form div.formControl.lip_error-notifications-label {
	padding: 20px;
}

#lip_formBean .form div.formControl.lip_error-notifications-label.componentWrapper {
	padding: 0;
}

#lip_formBean .form .componentWrapper div.formControl.lip_error-notifications-label {
	border: 0;
	margin: 0;
	padding: 0;
}

#lip_formBean .form div.formControl.lip_error-notifications-label,
.viewEmbedding {
	display: grid;
	grid-template-columns: auto 1fr auto;
	grid-row-gap: 10px;
	border-width: 1px;
	border-style: solid;
	border-radius: 3px;
	margin: 15px auto;
}

.viewEmbedding .buttons.displayNone,
.viewEmbedding .displayNone {
	display: none;
}

#lip_formBean .form div.formControl.lip_error-notifications-label .lip_error-notifications-label,
.viewEmbedding .body {
	grid-row: 2;
	grid-column: 2;
	width: 100%;
	padding: 0 20px 0 0;
	overflow:visible
}

.viewEmbedding .body .text {
	padding-right: 20px;
	display: inline-block;
}

.viewEmbedding .body input[type="text"] {
	padding: 5px;
}

.viewEmbedding .buttons button {
	cursor: pointer;
	padding: 10px 20px;
	margin-right: 10px;
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 10px;
	border-radius: 3px;
	color: #1A181B;
	fill: #1A181B;
	background-color: #FFFFFF;
	border: #DCDCDC 1px solid;
	text-decoration: none;
}

.viewEmbedding .close button:focus,
.viewEmbedding .close button:hover,
.viewEmbedding .buttons button:hover,
.viewEmbedding .buttons button:focus {
	outline: none;
	filter: none;
	border: #CCCCCC 1px solid;
	box-shadow: 0 0 0 2px #1A181B;
	text-decoration: underline;
}

.viewEmbedding .close button:focus,
.viewEmbedding .close button:hover {
	border: none;
}

.viewEmbedding .close button:hover,
.viewEmbedding .buttons button:hover {
	background-color: #EEEEEE;
}

.viewEmbedding .buttons button.displayNone {
	display: none;
}

.viewEmbedding .buttons button svg,
.viewEmbedding .buttons button img {
	height: 100%;
	width: 25px;
}

/*Content of Buttons sometimes caught click event*/
.viewEmbedding .buttons button svg,
.viewEmbedding .buttons button img,
.viewEmbedding .buttons button span {
	pointer-events: none;
}

.viewEmbedding .buttonsPlaceholder {
	pointer-events: none;
	min-height: 10px;
	grid-column: 2;
	grid-row: 3;
}

.viewEmbedding .close {
	position: relative;

}

.viewEmbedding .close button {
	position: absolute;
	top: 5px;
	right: 5px;
	width: 24px;
	height: 24px;
	cursor: pointer;
	border-radius: 3px;
	padding: 0;
	border: 0;
	background: transparent;
}

.viewEmbedding .close svg {
	width: 100%;
	height: 100%;
	fill: #1A181B;
}

#lip_formBean .form div.formControl.lip_error-notifications-label a,
.viewEmbedding a {
	color: #1A181B;
	text-decoration: none;
	font-weight: bold;
	display: inline-block;
	padding: 2px;
}

#lip_formBean .form div.formControl.lip_error-notifications-label a:hover,
.viewEmbedding a:hover {
	text-decoration: underline;
}

#lip_formBean .form div.formControl.lip_error-notifications-label a:focus,
#lip_formBean .form div.formControl.lip_error-notifications-label a:focus-within,
.viewEmbedding a:focus,
.viewEmbedding a:focus-within {
	outline: none;
	box-shadow: inset 0 0 0 1px #1A181B;
	text-decoration: underline;
}

.viewEmbedding .text .textIcon {
	padding: 3px;
	vertical-align: middle;
}

#lip_formBean .form div.formControl.lip_error-notifications-label .lip_icon,
.viewEmbedding .icon {
	width: 100px;
	padding: 0 12px;
	display: flex;
	justify-content: center;
	align-items: center;
	grid-column: 1;
	grid-row: 1 /span 3;
	border-left: 30px solid;
}

#lip_formBean .form div.formControl.lip_error-notifications-label {
	border-left: 30px solid;
}

#lip_formBean .form div.formControl.lip_error-notifications-label .lip_icon {
	border-left: 0;
}

#lip_formBean .form div.formControl.lip_error-notifications-label .lip_icon svg,
.viewEmbedding .icon svg {
	width: 36px;
	height: 36px;
}

#lip_formBean .form div.formControl.lip_error-notifications-label .lip_icon span,
#lip_formBean .form div.formControl.lip_error-notifications-label .lip_icon span svg,
.viewEmbedding .icon img {
	width: 36px;
	height: 36px;
}

.viewEmbedding .buttons {
	width: 100%;
	grid-row: 3;
	grid-column: 2;
	display: flex;
	justify-content: start;
	min-height: 52px;
	flex-wrap: wrap;
}

.lip_modalWindow .viewEmbedding {
	margin: 20px 50px;
	max-width: 800px;
}

.viewEmbedding .body.closable {
	padding-right: 15px;
}

/* ---------------------------------------------------------- message embeddings
*/

.viewEmbedding.message {
	background-color: #FFFFFF;
	border-color: #3572B0;
}

.viewEmbedding.message .icon {
	fill: #3572B0;
	border-color: #3572B0;
}

.viewEmbedding.message .buttons button.primary {
	border-color: #3572B0;
}


/* --------------------------------------------------------- question embeddings
*/

.viewEmbedding.confirm,
.viewEmbedding.question {
	background-color: #FFFFFF;
	border-color: #F6C342;
}

.viewEmbedding.confirm .icon,
.viewEmbedding.question .icon {
	fill: #F6C342;
	border-color: #F6C342;
}

.viewEmbedding.confirm .body a,
.viewEmbedding.question .body a {
	color: #1A181B;
	text-decoration: underline;
	font-weight: normal;
}

.viewEmbedding.confirm .buttons button.primary ,
.viewEmbedding.question .buttons button.primary {
	border-color: #F6C342;
}


	/* ---------------------------------------------------- error message embeddings / segment error messages / outOfSync error messages
	*/
#lip_formBean .form div.formControl.lip_error-notifications-label,
.viewEmbedding.outOfSync,
.viewEmbedding.error {
	background-color: #FFFFFF;
	color: #1A181B;
	border-color: #BC4949;
	font-weight: normal;
}

#lip_formBean .form div.formControl.lip_error-notifications-label .lip_icon svg,
.viewEmbedding.outOfSync .icon,
.viewEmbedding.error .icon {
	fill: #BC4949;
	border-color: #BC4949;
}

#lip_formBean .form div.formControl.lip_error-notifications-label ul,
.viewEmbedding.error .body {
	box-sizing: border-box;
	overflow: auto;
	padding-left: 0;
	margin-bottom: 0;
}

.viewEmbedding.error .body.grow {
	max-height: none;
}

.viewEmbedding.error .simple {
	padding: 5px;
}

#lip_formBean .form div.formControl.lip_error-notifications-label li,
.viewEmbedding.error .body li {
	list-style: outside;
	margin-left: 1.5rem;
	margin-bottom: .5rem;
}

#lip_formBean .form div.formControl.lip_error-notifications-label li a,
.viewEmbedding.error .errorLink {
	display: inline-block;
	vertical-align: top;
	color: #1A181B;
	text-decoration: none;
	font-weight: normal;
}

#lip_formBean .form div.formControl.lip_error-notifications-label li a,
.viewEmbedding.error .errorLink a {
	font-size: 11pt;
	overflow-wrap: anywhere;
	hyphens: auto;

	outline: none;

	background-color: #FFFFFF;
	font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
}

.viewEmbedding.error .errorLink .image,
.viewEmbedding.error .errorText .image {
	padding-left: 5px;
	margin: 1px;
	vertical-align: middle;
}


#lip_formBean .form div.formControl.lip_error-notifications-label li a:hover,
#lip_formBean .form div.formControl.lip_error-notifications-label li a:focus,
.viewEmbedding.error .errorLink:hover,
.viewEmbedding.error .errorLink:hover a,
.viewEmbedding.error .errorLink:focus,
.viewEmbedding.error .errorLink:focus a {
	cursor: pointer;
}


.viewEmbedding.error .errorLink:hover span,
.viewEmbedding.error .errorLink:focus span {
	text-decoration: none;
}

#lip_formBean .form div.formControl.lip_error-notifications-label li a:hover,
#lip_formBean .form div.formControl.lip_error-notifications-label li a:focus,
.viewEmbedding.error .errorLink:hover a,
.viewEmbedding.error .errorLink:focus a,
.viewEmbedding.error .errorLink a:focus,
.viewEmbedding.error .errorLink a:hover {
	text-decoration: underline;
}

.viewEmbedding.error .errorText {
	line-height: 22px;
	margin: 0;
	white-space: normal;
	display: inline-block;

	color: #1A181B;
	text-decoration: none;
	font-weight: normal;
}

.viewEmbedding.error .buttons button.primary {
	border-color: #BC4949;
}


/* ----------------------------------------------- viewEmbeddings default styles
*/

.viewEmbedding.ok {
	background-color: #FFFFFF;
	color: #1A181B;
	border-color: #3D8700;
	font-weight: normal;
}

.viewEmbedding.ok .icon {
	fill: #3D8700;
	border-color: #3D8700;
}

.viewEmbedding.ok .buttons button.primary {
	border-color: #3D8700;
}


/* ------------------------------------------------- attachment error embeddings
*/

.viewEmbedding.attachmentError {
	margin-top: 3px;
	margin-bottom: 3px;
	color: #1A181B;
	background-color: #FFFFFF;
	font-weight: normal;
}

.viewEmbedding.attachmentError .text {
	padding: 0;
}

.viewEmbedding.attachmentError ul {
	padding-bottom: 2px;
	padding-top: 2px;
	margin-bottom: 0;
	margin-top: 0;
}

.viewEmbedding.attachmentError .body {
	padding-left: 5px;
}

.viewEmbedding.attachmentError .fixedToolbar {
	max-height: calc(3 * 1.5rem + .5rem);
	overflow: auto;
}

.viewEmbedding .fixedToolbar {
	max-height: calc((3 * (24px + 0.5rem)) + .5rem);
	overflow: auto;
	position: relative;
}

.viewEmbedding .fixedToolbar::after {
	content: '';
	position: sticky;
	bottom: 0;
	left: 0;
	right: 0;
	height: 1.5rem;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
	pointer-events: none;
	display: block;
}

.viewEmbedding.attachmentError .errorText {
	color: #1A181B;
	text-decoration: none;
	font-weight: normal;
}

.viewEmbedding.attachmentError .errorText img {
	vertical-align: top;
	padding-left: 0;
}

.viewEmbedding.attachmentError .errorText span {
	padding-left: 10px;
}

/* ------------------------------------------------- warn embeddings
*/

.viewEmbedding.warn {
	background-color: #FFFFFF;
	border-color: #F6C342;
}

.viewEmbedding.warn .icon {
	fill: #F6C342;
	border-color: #F6C342;
}

.viewEmbedding.warn .buttons button.primary {
	border-color: #F6C342;
}

/*
 * -----------------------------------------------------------------------------
 *  Lucom Interaction Platform
 *  (C) Lucom GmbH, Erkrath. All rights reserved.
 * -----------------------------------------------------------------------------
 */

.toast-messages {
    position: fixed;
    width: 350px;
    height: auto;
    max-height: calc(100vh - 2rem);
    z-index: 3000;
    overflow-y: auto;
    overflow-x: hidden;

    /* scrollbars for Firefox */
    scrollbar-width: none;
}

.toast-messages,
.toast-messages *,
.toast-messages *::after,
.toast-messages *::before {
    box-sizing: border-box;
}

.toast-messages.top {
    top: 90px;
}

.toast-messages.bottom {
    bottom: 1rem;
}

.toast-messages.right {
    right: 1rem;
}

.toast-messages.left {
    left: 1rem;
}

.toast-messages.middle {
    left: calc(50vw - 175px);
}

/* scrollbars for webkit */
.toast-messages::-webkit-scrollbar,
.toast-messages::-webkit-scrollbar-thumb {
    width: 0;
    height: 0;
}

.toast-messages .toast-message {
    font-weight: normal;
    backdrop-filter: blur(2px);
    background-color: rgba(255, 255, 255, 0.9);
    border-style: solid;
    border-width: 1px;
    border-left-width: 14px;
    /*border-left-style: solid;*/
    /*border-left-width: 2px;*/
    display: flex;
    padding: 1.5rem 1rem;
    margin: 1px;
    pointer-events: auto;
    visibility: hidden;
    box-shadow: rgba(149, 157, 165, 0.2) 0 8px 24px;

    font-family: Open Sans, Verdana, Arial, Helvetica, sans-serif;
    color: #4A4A4A;
    border-left-color: #808080;
}

.toast-messages.right .toast-message {
    transform: translate3d(110%, 0, 0);
}

.toast-messages.left .toast-message {
    transform: translate3d(-110%, 0, 0);
}

.toast-messages.top.middle .toast-message {
    transform: translate3d(0, -110%, 0);
}

.toast-messages.bottom.middle .toast-message {
    transform: translate3d(0, 110%, 0);
}

.toast-messages .toast-message:not(:last-child) {
    margin-bottom: 1rem;
}

.toast-messages .toast-message.active,
.toast-messages.middle .toast-message.active {
    transform: translate3d(0, 0, 0);
    visibility: visible;
}

.toast-messages .toast-message .message {
    flex-grow: 1;
}

.toast-messages .toast-message .icon {
    align-items: center;
    display: flex;
    justify-content: center;
    padding-right: 1rem;
}

.toast-messages .toast-message .close {
    -webkit-appearance: button;
    background-color: transparent;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    overflow: visible;
    text-transform: none;
    align-items: center;
    display: inline-flex;
    justify-content: center;
    margin: -1.5rem -1rem;
    padding: 1.5rem 1rem;
}

.toast-messages .toast-message .close:hover .svg-container {
    color: rgba(0, 0, 0, 0.8);
}

.toast-messages .toast-message .svg-container {
    display: inline-flex;
    height: 1rem;
    width: 1rem;
    color: #808080;
}

.toast-messages .toast-message .svg-container svg {
    height: 100%;
    width: 100%;
}

.toast-messages .toast-message .timer {
    width: 0;
    height: 2px;
    position: absolute;
    z-index: 10;
    bottom: 0;
    margin-left: -16px;
    animation: timer linear 5s reverse;
    animation-play-state: paused;
    background-color: #808080;
}

.toast-messages .toast-message .timer.hidden {
    visibility: hidden;
    height: 0;
}

.toast-messages .toast-message.default {
    border-left-color: #808080;
}

.toast-messages .toast-message.default .svg-container {
    color: #808080;
}

.toast-messages .toast-message.default .timer {
    background-color: #808080;
}

.toast-messages .toast-message.success {
    border-left-color: #3D8700;
}

.toast-messages .toast-message.success .svg-container {
    color: #3D8700;
}

.toast-messages .toast-message.success .timer {
    background-color: #3D8700;
}

.toast-messages .toast-message.info {
    border-left-color: #3572B0;
}

.toast-messages .toast-message.info .svg-container {
    color: #3572B0;
}

.toast-messages .toast-message.info .timer {
    background-color: #3572B0;
}

.toast-messages .toast-message.warning {
    border-left-color: #F6C342;
}

.toast-messages .toast-message.warning .svg-container {
    color: #F6C342;
}

.toast-messages .toast-message.warning .timer {
    background-color: #F6C342;
}

.toast-messages .toast-message.error {
    border-left-color: #BC4949;
}

.toast-messages .toast-message.error .svg-container {
    color: #BC4949;
}

.toast-messages .toast-message.error .timer {
    background-color: #BC4949;
}

@keyframes timer {
    0% { width: 0; }
    100% { width: 100%; }
}

@media only screen and (max-width: 380px) {
    .toast-messages {
        width: 100%;
        padding-right: 0;
        right: 0;
    }
    .toast-messages .toast-message {
        margin-left: 1em;
        margin-right: 1rem;
    }
}