
/*@font-face {
	font-family: Manrope;
	src: url(fonts/manrope/static/Manrope-Medium.ttf);
}

@font-face {
	font-family: ManropeLight;
	src: url(fonts/manrope/static/Manrope-Light.ttf);
}*/


@font-face {
	font-family: Poppins;
	src: url(fonts/poppins/Poppins-Medium.ttf);
}

@font-face {
	font-family: PoppinsLight;
	src: url(fonts/poppins/Poppins-Light.ttf);
}


.ui-widget-header {
	font-weight: 400;
}

.ui-button {
	outline-style: none;
}


.ui-dialog {
	overflow: visible;
	border-radius: 5px;
	padding: 0;
	display: flex;
	flex-direction: column;
	-webkit-box-shadow: 8px 8px 23px -11px rgba(0,0,0,0.75);
	-moz-box-shadow: 8px 8px 23px -11px rgba(0,0,0,0.75);
	box-shadow: 8px 8px 23px -11px rgba(0,0,0,0.75);
}

.ui-dialog.ui-widget-content {
	border: 1px solid #FFF;
}

.ui-dialog .ui-dialog-titlebar {
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	background-image: none;
	background-color: #076484;
	color: #FFF;
	padding: .55rem;
	border: none;
	letter-spacing: .125rem;
	text-transform: uppercase;
	/* font-variant: small-caps; */
}

.ui-dialog .ui-dialog-titlebar span {
	/* flex: 1 1 100%; */
	font-size: 1.15rem;
}

.ui-dialog .ui-dialog-titlebar button.ui-dialog-titlebar-close {
	position: absolute;
	border-width: 0;
	/* background-color: transparent; */
	/* color: #27827a; */
	/* -webkit-border-bottom-right-radius: 7px;
	-webkit-border-bottom-left-radius: 7px;
	-moz-border-radius-bottomright: 7px;
	-moz-border-radius-bottomleft: 7px;
	border-bottom-right-radius: 7px;
	border-bottom-left-radius: 7px; */
	
	border-radius: 1rem;
	width: 2rem;
    height: 2rem;
    right: 0.7rem;
    top: 1.3rem;
}





/* Verstecke die beiden <span> Tags innerhalb des UI-Buttons */
.ui-dialog-titlebar-close.ui-state-default span,
.ui-dialog-titlebar-close.ui-state-hofer span,
.ui-dialog-titlebar-close.ui-state-focus span {
	display: none;
}

/* Mache den Hintergrund des Schließen-Buttons transparent */
.ui-dialog-titlebar-close.ui-state-default,
.ui-dialog-titlebar-close.ui-state-hover,
.ui-dialog-titlebar-close.ui-state-focus {
	background-color: transparent;
	color: #FFF;
	background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z' clip-rule='evenodd'/></svg>");
	background-repeat: no-repeat;
	background-size: 100% 100%;
}




/* Füge über die abstrakte Eigenschaft ::before das Icon als Content ein */
.ui-dialog-titlebar-close.ui-state-default::before,
.ui-dialog-titlebar-close.ui-state-hover::before,
.ui-dialog-titlebar-close.ui-state-focus::before {
/* 	display: inline-block;
	width: 100%;
	height: 100%;
	content: "";
	background-image: url("data:image/svg+xml,<svg viewBox='0 0 23 23' fill='%23333' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z' clip-rule='evenodd'/></svg>");
	background-repeat: no-repeat;
	background-size: 1rem 1rem; */
}





/* .ui-dialog .ui-dialog-titlebar {
	box-sizing: border-box;
} */

.ui-dialog .ui-dialog-content {
	padding: 0;
	/* box-sizing: border-box; */
}

.ui-dialog .ui-dialog-buttonpane {
	box-sizing: border-box;
	margin-top: 0;
	border: 1px solid #FFF;
	padding: .25rem 0;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	height: 40px;
	min-height: 40px;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	height: 100%;
	box-sizing: border-box;
	padding: 0 .7rem;
}

.ui-dialog .ui-dialog-buttonpane button {
	box-sizing: border-box;
	margin: 0 0 0 .25rem;
	height: 100%;
}



.ui-selectmenu-button {
	box-sizing: border-box;
	display: inline-block;
	max-height: 24px;
	outline-style: none;
	border: 1px solid #D3D3D3;
}

.ui-selectmenu-button span.ui-selectmenu-text {
	padding: 3px 1em 3px 1em;
}



.tri-north button {
	height: 100%;
    max-height: 100%;
    margin: 0 .1rem 0 0;
}

.ui-button-text-only .ui-button-text {
	padding: 0 .6rem;
}



.ui-datepicker {
	z-index: 20000 !important;
}

/* .tri-pageselector .ui-button-text-only .ui-button-text,
.tri-pagination .ui-button-text-only .ui-button-text {
	padding: 4px;
} */

.tri-pageselector .ui-button-text-only .ui-button-text i,
.tri-pagination .ui-button-text-only .ui-button-text i {
	width: 15px;
	text-align: center;
	margin: 0;
}

.ui-autocomplete {
	z-index: 300;
	max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
}



/* .ui-autocomplete > .ui-menu-item:last-child {
	border-bottom-width: 0;
	max-height: 26px;
	box-sizing: border-box;
} */





.flexslider {
	border-radius: 0;
}

html, body {
	height: 100%;
}

body {
	padding: 0;
	color: #444;
	overflow: hidden;

}


body.tri-has-background {
	background: #efefef; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#ededed",GradientType=0 ); /* IE6-9 */
	background-image: url(triangle_mvc_logo_660x400_op30.png);
	background-position: center center;
	background-repeat: no-repeat;
}


html,
body,
.ui-widget,
.ui-widget input, 
.ui-widget select, 
.ui-widget textarea, 
.ui-widget button,
.ui-widget .has-standard-font .title {
	font-family: "Poppins", Arial, Helvetica, Verdana, sans-serif;
	font-weight: 400;
	font-size: 13px;
}



.ui-widget input.error, 
.ui-widget select.error, 
.ui-widget textarea.error {
	border-color: red;
	color: red;
}

h1, p {
	margin: 0 0 .5em 0;
}

h2, h3, h4 {
	margin: 0 0 0.3rem 0;
}

a {
	text-decoration: none;
	color: #444;
}

a:focus, a:active {
	outline-style: none;
}

a:hover {
	text-decoration: underline;
}

img {
	width: 100%;
	height: auto;
	display: block;
}

.is-bold {
	font-weight: bold;
}

.hide-it {
	display: none;
}

.is-empty1 { display: none; }

.size26 								{ 	font-size: 2.166666666666667rem;	}
.size24 								{ 	font-size: 2rem;	}
.size20 								{ 	font-size: 1.666666666666667rem;	}
.size18		 							{ 	font-size: 1.5rem;					}

.size15		 							{ 	font-size: 1.25rem;					}

.size14, h2,
	.tri-filter-no-options, 
	.tri-messge .tri-message-title		{ 	font-size: 1.166666666666667rem;	}
.size13 								{ 	font-size: 1.083333333333333rem;	}
.size12,
	h3,
	.tri-nav a,
	.tri-table .tri-table-header h2,
	.tri-table .tri-table-header h3,
	.tri-messge .tri-message-text		{ 	font-size: 1rem;				 	}
.size11 								{ 	font-size: 0.9166666666666667rem;	}


.size26 *,
.size24 *,
.size20 *,
.size18 *,
.size14 *,
.size13 *,
.size12 *,
.size11 *,
h1 *, 
h1 *, 
h3 *, 
h4 *,
.tri-nav a * {
	font-size: 1em;
}


.downloadtrigger-area {
	position: absolute; 
	left: -9999em;
	top: -99999em;
	height: 0;
	overflow: hidden;
}


input[type="text"],
input[type="password"],
textarea,
select {
	width: 100%;
	padding: 1px 4px;
	border: 1px solid #d4d4d4;
	line-height: 17px;
}

input[type="text"],
input[type="password"],
textarea,
select,
.tri-input-amend-content {
	box-sizing: border-box;
	height: 23px;
}

select:disabled,
.input.disabled {
	background-color: rgb(235, 235, 228);
}

select {
	line-height: 150%;
	font-size: 14px;
}

select:focus,
input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus {
    outline-offset: 0;
    outline-color: #06736a;
    outline-style: auto;
    outline-width: 0;
}

select > option {
    font-weight: normal;
    display: block;
    white-space: pre;
    min-height: 1.5rem;
    height: 1.5rem;
    padding: 2px 2px;
}



/* input:focus {
	outline: none;
} */


a.tri-listbutton,
a.tri-edit,
a.tri-delete {
	display: inline-block;
	width: 22px;
	height: 22px;
	border: 1px solid #bababa;
	text-align: center;
	margin: 0 0 0 4px;
}

a.tri-listbutton:focus,
a.tri-listbutton:active {
	outline-style: none;
}

a.tri-listbutton {
	background-color: #FFF;
	box-sizing: border-box;
}

a.tri-listbutton,
a.tri-edit i {
	line-height: 20px;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}




.has-childs0 .tri-toggle-opened i {
	display: none;
}

img.img-triangle-logo-small {
	width: auto;
	height: 100%;
}

.ui-dialog .tri-error-dialog.ui-dialog-content {
	box-sizing: border-box;
	padding: 20px;
}

.tri-error-dialog pre {
	display: block;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}

.ui-dialog-buttonpane {
	position: relative;
}

.tri-on-existing-record {
	display: none;
}


body.tri-hostpage > .tri-view {
	display: flex;
	flex-direction: column;
	height: 100%;
	position: relative;
	z-index: 50;
}


body.tri-hostpage > .tri-view > nav.tri-nav {
	padding: 5px 5px 0 5px;
	opacity: .94;
	height: 50px;
	flex: 0 0 auto;
	
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	z-index: 500;
}

body.tri-hostpage .flexslider {
	z-index: 2;
	margin: 0;
	padding: 0;
	border-width: 0;
}

body.tri-hostpage .flexslider .slides > li {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}


body.tri-hostpage .flexslider,
body.tri-hostpage .flexslider .slides,
body.tri-hostpage .tri-hostpage-slides > li {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%; 
	overflow: hidden;
	list-style-type: none;
}


body.tri-hostpage > .tri-view > nav.tri-nav > div.tri-start-menu {
	flex: 1 1 auto;
}

div.tri-start-menu > ul.tri-start-ul {
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	height: 100%;
}


div.tri-start-menu > .tri-start-ul > li {
	position: relative;
	min-width: 200px;
	box-sizing: border-box;
	margin: 0 10px 0 0;
	flex: 0 0 225px;
}

div.tri-start-menu > .tri-start-ul > li.tri-startmenu {
	min-width: 70px;
	flex: 0 0 70px;
}

div.tri-start-menu > .tri-start-ul > li.tri-startmenu > a {
	padding: 5px;
}

div.tri-start-menu > .tri-start-ul > li.tri-startmenu img {
	height: 100%;
	width: auto;
}

body.tri-hostpage > .tri-view > nav.tri-nav > .tri-clock {

	font-family: "PoppinsLight", Arial, Helvetica, Verdana, sans-serif;
	flex: 0 1 230px;
	color: #FFF;
	font-size: 1.1rem;
	text-align: left;
	padding: 9px 10px;
	text-align: right;
}


body.tri-hostpage > .tri-view > nav.tri-nav > a.tri-logo-wrapper {
	display: block;
	box-sizing: border-box;
	position: relative;
	max-width: 74px;
	flex: 0 0 74px;
	cursor: pointer;
	padding: 5px;
}

a.tri-logo-wrapper span.version {
	display: inline-block;
	position: absolute;
	top: 2px;
	right: 10px;
	font-size: 9px;
	color: #FFF;
}

body.tri-hostpage > .tri-view > .tri-dashboards {
	flex: 1 1 auto;
	position: relative;
	z-index: 8;
}

body.tri-hostpage > .tri-view > .tri-dashboards > .tri-dashboard {
	width: 100%; 
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	visibility: hidden;
	opacity: 0;
	transition: visibility 0s, opacity .2s linear;
}

body.tri-hostpage > .tri-view > .tri-dashboards > .tri-dashboard.is-active {
	visibility: visible;
	opacity: 1;
	transition: visibility 0s, opacity .2s linear;
}

.tri-hostpage > .tri-view > .tri-footer {
	display: none;
}

.tri-nav a.tri-describe-tab * {
	font-size: 1em;
	line-height: 130%;
}

.tri-no-whitespace-wrap {
	white-space: nowrap;
}

.is-ellipsis-parent {
	overflow: hidden;
}

.tri-has-elipsis,
.tri-has-ellipsis,
.is-ellipsis-parent > * {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
}


.has-border-radius {
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
}


.tri-nav,
.tri-dialog-nav,
.tri-footer,
.has-linear-gradient {
	box-sizing: border-box;
}


.tri-dialog-nav,
.tri-footer,
.has-linear-gradient {
	box-sizing: border-box;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#e5e5e5",GradientType=0 ); /* IE6-9 */
}


.tri-nav {
	background-color: #4a4a4a;
}



/* .tri-nav, */
.tri-dialog-nav {
	position: absolute;
	top: 0;
	width: 100%;
	border-bottom: 1px solid #bababa;
	z-index: 1;
}

/* .tri-dialog-nav button .fa {
	width: 15px;
	margin: 0 5px 0 0;
	text-align: center;
} */




/* ---------------------------------------------------------------------------------------------------------------------------------

In Dialogen wird mit diesen Einstellungen eine Kachel-Aufteilung der Feldgruppen .tri-fields .tri-field 
erreicht.

*/
.is-flex-parent {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
		
.is-flex-parent > .is-flex-widget {
	flex: 0 0 48%;
	margin: 0 0 18px 0;
}

.is-flex-parent > .is-flex-widget.is-flex-widget-fullsize {
	flex: 0 0 100%;
	margin: 0 0 18px 0;
}


/* --------------------------------------------------------------------------------------------------------------------------------- */






.tri-pageselector,
.tri-pagination {
	display: inline-block;
	vertical-align: middle;
	width: 225px;
	height: 100%;
}

.tri-pageselector .ui-spinner,
.tri-pagination .ui-spinner {
	box-sizing: border-box;
	height: 100%;
}


.tri-pageselector button,
.tri-pagination button {
	text-align: center;
}

.tri-pageselector *,
.tri-pagination * {
	vertical-align: middle;
}

.tri-footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	border-top: 1px solid #bababa;
	padding: 6px 0;
	z-index: 1000;
}

.tri-footer-element {
	box-sizing: border-box;
	float: left;
	border: 1px solid #D3D3D3;
	width: 24%;
	height: 20px;
	margin: 0 0.5%;
	padding: 2px;
	font-size: 14px;
}



.ui-dialog .tri-dialog {
	margin: 0;
	padding: 0;
	overflow: hidden;
	/* border-right: 1px solid #bababa;
	border-left: 1px solid #bababa; */
	border-bottom: 1px solid #bababa;
}

.tri-liststructure > li > a,
.tri-nav a:hover,
.tri-left-menu a:hover {
	text-decoration: none;
}

.tri-liststructure a.tri-state-active, 
.tri-left-menu a.tri-state-active {

}

.tri-nav a .tri-subtitle {
	font-size: 0.975em;
}


.tri-nav,
.tri-dialog-nav,
.tri-list-nav {
	/* border-bottom: 1px solid #bababa; */
	padding: 3px;
	height: 35px;
}

.tri-list-nav a.tri-listbutton {
	margin: 1px 4px 1px 0;
}

.tri-rowset {
	margin: 0;
	padding: 0;
	list-style-type: none;	
}

.tri-rowset > li,
div.tri-list-row {
	position: relative;
	border: 1px solid #bababa;
	padding: 5px;
	margin: 0 0 5px 0;
	background: #efefef; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#ededed",GradientType=0 ); /* IE6-9 */
	
}

.tri-rowset > li.tri-list-row-blind {
	background: none;
	border-width: 0;
	padding: 0;
}

.tri-rowset > li:last-child {
	margin: 0;
}

.tri-rowset50pct > li {
	box-sizing: border-box;
	float: left;
	width: 49%;
}

.tri-rowset50pct > li:nth-child(even) {
	margin-left: 1%;
}

.tri-rowset50pct > li:nth-child(odd) {
	margin-right: 1%;
}

.tri-rowset > li * {
	vertical-align: middle;
}

.tri-rowset > li .tri-fa-icon {
	cursor: ns-resize;
	margin: 0 5px 0 0;
	width: 12px;
	text-align: center;
}

.tri-rowset > li > label {
	display: inline-block;
	width: 20%;
	margin: 0 10px 0 0;
}

.tri-rowset > li > input[type="text"] {
	display: inline-block;
	width: 30%;
	border: 1px solid #bababa;
	background-color: transparent;
	cursor: text;
	padding: 4px 3px;
	margin: 0 10px 0 0;
}

.tri-rowset > li input[type="text"]:focus {
	cursor: text;
}

.tri-list-row .tri-trash-button,
.tri-list-row .tri-play-button {
	display: block;
	float: right;
	margin: 4px 4px 0 0;
	cursor: pointer;
	font-size: 1.125em;
}

.tri-float-col {
	float: left;
	width: 19%;
	box-sizing: border-box;
	margin-right: 1%;
}

.tri-float-col:last-child {
	margin-right: 0;
}

.tri-col10 {
	width: 9%;
}
.tri-col20 {
	width: 19%;
}
.tri-col30 {
	width: 29%;
}
.tri-col40 {
	width: 39%;
}
.tri-col50 {
	width: 49%;
}
.tri-col60 {
	width: 59%;
}
.tri-col70 {
	width: 69%;
}
.tri-col80 {
	width: 79%;
}
.tri-col90 {
	width: 89%;
}
.tri-col100 {
	width: 100%;
	margin-right: 0;
}




/* ---------------------------------------  [/Menüstrukturen] --------------------------------------- */

.tri-is-menu > li > .tri-describe-tab,
.tri-left-menu li > .tri-describe-tab {
	box-sizing: border-box;
	display: block;
	white-space: nowrap;
	padding: 5px 10px;
	height: 100%;
	line-height: 100%;
	vertical-align: middle;
	color: #333;
}

.tri-is-menu > li > .tri-describe-tab *,
.tri-left-menu li > .tri-describe-tab * {
	vertical-align: middle;
	
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	
}

.tri-is-menu li .tri-open-tab-menu,
.tri-left-menu li .tri-open-tab-menu,
.tri-sortable .tri-open-tab-menu {
	display: block;
	float: right;
	width: 17px;
	text-align: center;
	margin: 6px 0 0 0;
}

.tri-is-menu > li .tri-open-tab-menu .fa,
.tri-left-menu li .tri-open-tab-menu .fa {
	line-height: 17px;
	font-size: 1.1em;
}

.tri-is-menu li.hidden,
.tri-left-menu li.hidden {
	display: none;
}


.tri-liststructure,
.tri-is-menu,
.tri-is-menu ul,
.tri-left-menu,
.tri-left-menu ul,
.tri-dropdown-menu,
.tri-dropdown-menu ul,
.tri-treestructure ul,
.tri-table ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}


.tri-controllgroup {
	position: relative;
	display: inline-flex;
	margin-right: .2em;
	align-items: center;
}

.tri-controllgroup button {
	min-height: 28px;
	height: 28px;
}

.tri-controllgroup button[name="toggle_controllgroup_menu"] {
	width: 15px;
	text-align: center;
}

.tri-controllgroup button[name="toggle_controllgroup_menu"] > span {
	padding: 0;
}


.tri-controllgroup > button.ui-button:first-child {
	margin-right: 0;
	/*border-right-width: 0;*/
	flex: 1 1 auto;
}
.tri-controllgroup > button.ui-button.tri-toggle-controllgroup-menu {
	margin-left: 0;
	flex: 0 0 auto;
	max-width: 17px;
	width: 17px;
	box-sizing: border-box;
	border-left-width: 0;
}

.tri-controllgroup > button.ui-button.tri-toggle-controllgroup-menu > span.ui-button-text {
	padding: 0;
}

.tri-controllgroup-menu {
	position: absolute;
	left: -99999em;
	top: -99999em;
	background-color: #FFF;
	z-index: 1000;
	list-style-type: none;
	margin: 0;
	padding: 0;
	border: 1px solid #bababa;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    display: inline-block;
}

.tri-controllgroup-menu.active {
	left: 0;
	top: 100%;
}


.tri-controllgroup-menu > li {
	margin: 0;
	padding: 7px 12px;
	cursor: pointer;
	border-top: 1px dotted #bababa;

	text-overflow: ellipsis;
	white-space: nowrap;

}

.tri-controllgroup-menu > li:first-child {
	border-top-width: 0;
}


div.tri-controllgroup-menu {
	display: flex;
	flex-direction: column;
}

div.tri-controllgroup-menu > .tri-controllgroup-body {
	box-sizing: border-box;
	flex: 1 1 auto;
	padding: 7px;
}


div.tri-controllgroup-menu > .tri-controllgroup-footer {
	box-sizing: border-box;
	flex: 0 0 40px;
	display: flex;
	justify-content: flex-end;
	padding: 7px;
}



.tri-dropdown-menu {
	display: inline-block;
	margin: 0 0 0 5px;
}

.tri-dropdown-menu .ui-selectmenu-button {
	overflow: visible;
}

.tri-dropdown-menu > li {
	position: relative;
	padding: 3px 30px 3px 3px;
	white-space: nowrap;
	
}

.tri-dropdown-menu > li > ul > li {
	padding: 4px; 	
}

.tri-left-menu {
	height: 100%;
	border-right: 1px solid #bababa;
	/* border-left: 1px solid #bababa; */
}

.tri-is-menu > li {
	float: left;
	/* min-width: 180px; */
	position: relative;
	
	/* border-top: 1px solid #bababa;
	border-left: 1px solid #bababa;
	border-right: 1px solid #bababa; */
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	
	background-color: #8d8f92;
}

.tri-is-menu > li.tri-active {
	
	background-color: #f3f3f3;
}


.tri-is-menu > li > ul,
.tri-dropdown-menu > li > ul,
.tri-is-menu ul.tri-menu-clientslist {
	position: absolute;
	left: -9999em;
	top: -99999em;
	border: 1px solid #bababa;
	-webkit-border-bottom-right-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-bottomright: 3px;
	-moz-border-radius-bottomleft: 3px;
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;
}


.tri-is-menu ul.tri-menu-clientslist {
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}



.tri-is-menu > li > ul {
	/* width: 100%; */
}


a.tri-listbutton:hover {
	color: #FFF;
			
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#009689+0,017067+100 */
	background-color: #076484; /* Old browsers */
	background: -moz-linear-gradient(top, #076484 0%, #076484 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #076484 0%,#076484 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #076484 0%,#076484 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#076484", endColorstr="#076484",GradientType=0 ); /* IE6-9 */
}

/* a.tri-listbutton:hover.disabled {
	background: white;
} */

.tri-north,
.tri-south,
.tri-list-nav,
.tri-standard-gradient,
.tri-is-menu > li > ul,
.tri-is-menu ul.tri-menu-clientslist,
.tri-left-menu, 
.tri-dropdown-menu > li > ul,
.tri-cards .tri-card,
.tri-fieldset-legend,
.tri-left-menu li > ul.tri-pop-right > li,
.tri-sorter > .tri-sorter-row,
.tri-controllgroup .tri-controllgroup-menu {
	background: #efefef; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#ededed",GradientType=0 ); /* IE6-9 */
	
}


.tri-is-menu > li.tri-opened > ul,
.tri-dropdown-menu > li.tri-opened > ul {
	box-sizing: border-box;
	left: -1px;
	top: 100%;
	z-index: 1500;
	min-width: 230px;
	max-width: 140%;
	
}

.tri-is-menu ul.tri-menu-clientslist {
	position: absolute; 
	left: -9999em;
	top: -9999em;
	z-index: 1500;
	min-width: 200px;
	margin: 0;
	padding: 0;
	
}

.tri-is-menu  li.tri-opened > ul.tri-menu-clientslist {
	left: 100%;
	top: -1px;
}

.tri-is-menu > li > ul > li > ul,
.tri-left-menu li > ul {
	height: 0;
	overflow: hidden;	
}

.tri-left-menu > li.tri-state-active > ul,
.tri-is-menu > li > ul > li.tri-opened > ul,
.tri-left-menu li.tri-opened > ul {
	height: auto;
	overflow: visible;	
}

.tri-left-menu > li > ul > li:first-child {
	border-top: 1px solid #bababa;
}

.tri-is-menu > li > ul li,
.tri-left-menu li {
	position: relative;
	border-bottom: 1px solid #bababa;
	white-space: nowrap;
	/* display: flex;
	align-items: center; */
}

.tri-is-menu > li > ul li:last-child,
.tri-left-menu > li > ul li:last-child {
	border-bottom-width: 0;
}



.tri-left-menu li > ul.tri-pop-right {
	position: absolute;
	left: -99999em;
	top: -99999em;
	height: auto;
	z-index: 1000;
}

.tri-left-menu > li.tri-state-active:hover > ul.tri-pop-right {
	left: 100%;
	top: -1px;
}

.tri-left-menu li > ul.tri-pop-right > li {
	border: 1px solid #bababa;
}


.tri-is-menu > li > ul > li > ul > li,
.tri-left-menu > li > ul > li, 
.tri-left-menu > li > ul > li > ul > li,
.tri-dialog-menu > li > ul > li {
	border-top: 1px dotted #bababa;
	border-bottom-width: 0;
	padding: 0 0 0 27px;
}


.tri-is-menu > li > ul > li > ul.tri-menu-clientslist > li:first-child {
	border-top-width: 0;
}


.tri-is-menu > li > ul > li > ul.tri-menu-clientslist > li {
	padding: 0;
}



.tri-is-menu > li.tri-state-active,
.tri-dialog-menu > li.tri-state-active,
.tri-left-menu li.tri-state-active {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ebf1f6+0,abd3ee+50,89c3eb+51,d5ebfb+100;Blue+Gloss+%234 */
	background: #ebf1f6; /* Old browsers */
	background: -moz-linear-gradient(top,  #ebf1f6 0%, #abd3ee 50%, #89c3eb 51%, #d5ebfb 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ebf1f6 0%,#abd3ee 50%,#89c3eb 51%,#d5ebfb 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ebf1f6 0%,#abd3ee 50%,#89c3eb 51%,#d5ebfb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ebf1f6", endColorstr="#d5ebfb",GradientType=0 ); /* IE6-9 */


	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e2e2e2+0,dbdbdb+47,c9c9c9+57,dddddd+100 */
	background: #e2e2e2; /* Old browsers */
	background: -moz-linear-gradient(top,  #e2e2e2 0%, #dbdbdb 47%, #c9c9c9 57%, #dddddd 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #e2e2e2 0%,#dbdbdb 47%,#c9c9c9 57%,#dddddd 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #e2e2e2 0%,#dbdbdb 47%,#c9c9c9 57%,#dddddd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e2e2e2", endColorstr="#dddddd",GradientType=0 ); /* IE6-9 */

}


.tri-is-menu > li > ul li > a.tri-menu-label,
.tri-left-menu a.tri-menu-label, 
ul.tri-menu-clientslist > li > a.tri-load-module,
ul.tri-menu-clientslist > li > span.tri-no-module {
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	padding: 7px 30px 7px 10px;
	white-space: nowrap;
	cursor: pointer; 
}



.tri-is-menu > li > ul li > a.tri-menu-label:active,
.tri-left-menu a.tri-menu-label:active,
.tri-is-menu > li > ul li > a.tri-menu-label:focus,
.tri-left-menu a.tri-menu-label:focus,
ul.tri-menu-clientslist > li:first-child > a.tri-load-module,
ul.tri-menu-clientslist > li:first-child > span.tri-no-module {
	outline-style: none;
}



.tri-is-menu > li > ul li.tri-subcategories0 a.tri-open-tab-menu,
.tri-left-menu > li > ul li.tri-subcategories0 a.tri-open-tab-menu {
	display: none;
}


.tri-is-menu > li > ul > li:last-child,
.tri-left-menu ul > li:last-child {
	border-bottom-width: 0;
	margin-bottom: 0;
}

.tri-treestructure {
	overflow: hidden;
}

.tri-treestructure .fa-angle-right,
.tri-is-menu > li > ul > li a.tri-menu-label .fa,
.tri-left-menu li > a.tri-menu-label .fa {
	flex: 0 0 auto;
	width: 14px;
	min-width: 14px;
	height: 14px;
	line-height: 100%;
}

.tri-toggleble-content {
	height: 100%;
}






.tri-toggle-opened,
.tri-toggle-opened .fa {
	display: inline-block;
	width: 20px;
	height: 22px;
	line-height: 22px;
	vertical-align: middle;
	text-align: center;
}

.tri-angle-right:focus {
	outline-style: none;
}

.tri-treestructure .has-subcategories0 .tri-angle-right,
.tri-treestructure .has-subcontactgroups0 .tri-angle-right {
	/* visibility: hidden; */
	color: #eaeaea;
}

.tri-treestructure .has-subcategories0 .tri-grabber, 
.tri-treestructure .has-subcontactgroups0 .tri-grabber {
	display: inline-block;
	/* margin: 0 0 0 20px; */
	/* line-height: 22px; */
}

.tri-treestructure .tri-dotted {
	border-bottom: 1px dotted #D3D3D3;
	margin: 0 5px;
}



.tri-is-menu > li > ul > li a span,
.tri-left-menu li > a > span {
	/* display: block; */
	padding: 0 0 0 8px;
	vertical-align: middle;
}


.tri-left-menu-div {
	box-sizing: border-box;
	float: left;
	width: 200px;
}

/* ---------------------------------------  [\Menüstrukturen] --------------------------------------- */


.tri-messge {
	position: absolute;
	width: 300px;
	padding: 15px;
	background-color: #333;
	color: #FFF;
	top: 15px;
	right: 15px;
	z-index: 10000;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	
	opacity: 1;
	-webkit-transition: opacity 2000ms;
	-moz-transition: opacity 2000ms;
	-o-transition: opacity 2000ms;
	transition: opacity 2000ms;
}




.tri-messge-transition {
	opacity: 0;
}

.tri-messge .tri-message-title {
	margin: 0 0 7px 0;
}

.tri-messge.tri-message-success {
	background-color: #006b0d;
}

.tri-messge.tri-message-failed {
	background-color: #c50000;
}

.tri-messge.tri-message-info {
	background-color: #676767;
}






.tri-center {
	position: absolute;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-color: #FFF;
}

.tri-center-north {
	margin-top: 35px;
	height: calc(100% - 35px);
}
.tri-center-south {
	margin-bottom: 35px;
	height: calc(100% - 35px);
}
.tri-center-north-south {
	margin-top: 35px;
	margin-bottom: 35px;
	height: calc(100% - 70px);
}

.tri-north, .tri-south {
	box-sizing: border-box;
	width: 100%;
	position: absolute;
	background-color: #FFF;
}


.tri-north {
	top: 0;
	left: 0;
	height: 35px;
	z-index: 900;
	border-bottom: 1px solid #bababa;
}

.tri-north.tri-north-flex {
	display: flex;
	align-items: center;
}

.tri-north.tri-north-flex > button,
.tri-north.tri-north-flex > input,
.tri-north.tri-north-flex > select,
.tri-north.tri-north-flex > div {
	flex: 0 0 auto;
	margin-right: 4px;
}

.tri-north.tri-north-flex > button:last-child,
.tri-north.tri-north-flex > input:last-child,
.tri-north.tri-north-flex > select:last-child,
.tri-north.tri-north-flex > div:last-child {
	margin-right: 0;
}

.tri-north.tri-north-flex > span {
	flex: 0 0 auto;
	padding-right: 7px;
}

.tri-north.tri-north-flex > span:last-child {
	padding-right: 0;
}

.tri-south {
	height: 35px;
	bottom: 0;
	left: 0;
	z-index: 900;
	border-top: 1px solid #bababa;
}

.tri-north-grabber {
	border-bottom: 1px solid #bababa;
	z-index: 80;
	
}

.tri-north-grabber > .tri-grabber {
	box-sizing: border-box;
	width: 40px;
	height: 5px;
	margin-left: -20px;
	position: absolute;
	left: 50%;
	bottom: -3px;
	border-top: 1px solid #bababa;
	border-bottom: 1px solid #bababa;
	z-index: 89;
}

.tri-west, .tri-east {
	position: absolute;
	box-sizing: border-box;
	height: 100%;
	width: 200px;
	top: 0;
	z-index: 88;
}

.tri-west {
	left: 0;
}

.tri-west.tri-west-grabber,
.tri-flex .tri-west.tri-west-grabber,
.tri-flex-row .tri-west.tri-west-grabber {
	border-right: 1px solid #bababa;
}

.tri-west-grabber > .tri-grabber {
	box-sizing: border-box;
	width: 5px;
	height: 40px;
	position: absolute;
	top: 50%;
	right: -3px;
	margin-top: -20px;
	border-left: 1px solid #bababa;
	border-right: 1px solid #bababa;
	z-index: 89;
}

.tri-east {
	right: 0;
}


.tri-flex {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: stretch;
}


.tri-flex-row {
	flex-direction: row;
}

.tri-flex-column {
	flex-direction: column;
}

.tri-flex > .tri-north,
.tri-flex > .tri-south, 
.tri-flex > .tri-west,
.tri-flex > .tri-east,
.tri-flex > .tri-center {
	left: auto;
	right: auto;
	top: auto;
	bottom: auto;
	position: relative;
	box-sizing: border-box;
	width: auto;
	height: auto;
	background: none;
	border-color: #BABABA;
	border-style: solid;
	border-width: 0;
	overflow: hidden;
	z-index: 85;
}

.tri-flex-column > .tri-north,
.tri-flex-column > .tri-south {
	height: 35px;
	flex: 0 0 35px;
}

.tri-flex-column > .tri-north.tri-standardpadding,
.tri-flex-column > .tri-south.tri-standardpadding {
	padding: .4rem 0;
}

.tri-flex-column > .tri-north {
	border-bottom-width: 1px;
}
.tri-flex-column > .tri-south {
	border-top-width: 1px;
}


.tri-flex-row > .tri-west,
.tri-flex-row > .tri-east {
	width: 200px;
	flex: 0 0 200px;
}

.tri-flex-row > .tri-west {
	border-right-width: 1px;
}
.tri-flex-row > .tri-east {
	border-left-width: 1px;
}


.tri-flex > .tri-center {
	flex: 1 1 100%;
}

.tri-flex .tri-no-lines {
	border-width: 0;
}



.tri-flex .tri-pageselector .ui-button-text-only .ui-button-text,
.tri-flex .tri-pagination .ui-button-text-only .ui-button-text {
	padding: 1px 4px;
}







.tri-aside {
	box-sizing: border-box;
	width: 200px;
	height: 100%;
	padding: 50px 2px 32px 2px;
	border-right: 1px solid #bababa;
}


.tri-dialog form {
	height: 100%;
	margin: 0;
	padding: 0;
	position: relative;
}

.tri-standard-content {
	padding: 10px;
	box-sizing: border-box;
	height: 100%;
}



.tri-grabbable-right {
	border-right: 1px solid #bababa;
}

/* UL-Tag */
.tri-liststructure {
	font-size: 13px;
}

.tri-liststructure > li {
	align-items: stretch;
}

.tri-liststructure > li > a {
	display: block;
}

.tri-liststructure-margin > li {
	margin: 8px;
}

.tri-liststructure-highlighted > li {
	background-color: #E6E6E6;
	padding: 8px;
	border: 1px solid #bababa;
}




/* ------------------------------------------------------------------------------------------------------------------------------------------------ */
/* Neue Herangehensweise an die Tree-Structure Thematik */
/* Erstmals eingeführt in 11/2020 für das Pannel des Planners */
/* Ersetzt .tri-treestructure vollständig und baut eine neue Logik auf */

ul.tri-tree {
	margin: 0;
	padding: 1.1rem;
	
}

ul.tri-tree ul {
	margin: 0;
	padding: 0 0 0 1.1rem;
	list-style-type: none;
	overflow: hidden;
	height: 0;
}

ul.tri-tree a.tri-toggler {
	flex: 0 0 auto;
    width: 14px;
    min-width: 14px;
    height: 14px;
    line-height: 100%;
}

ul.tri-tree li {
	font-size: 1rem;
	margin: 3px 0 0 0;
	list-style-type: none;
}

ul.tri-tree > li:first-child,
ul.tri-tree ul > li:first-child {
	margin: 0;
}


/* Optische Deaktivierung des Togglers */
ul.tri-tree li.has-childs0 > div > a.tri-toggler {
	color: #e6e6e6;
}

/* In bestimmten Situationen verschiedene Toggler vestecken */
ul.tri-tree a.tri-toggler i.fa-angle-down,
ul.tri-tree li.has-childs1.opened > div > a.tri-toggler > i.fa-angle-right {
	display: none;
}

/* Toggler nach unten einblenden, wenn Menü geöffnet wird */
ul.tri-tree li.has-childs1.opened > div > a.tri-toggler > i.fa-angle-down {
	display: inline-block;
}

ul.tri-tree li.has-childs1.opened > ul {
	height: auto;
	overflow: visible;
}


/* ------------------------------------------------------------------------------------------------------------------------------------------------ */






/* ------------------------------------------------------------------------------------------------------------------------------------------------ */
/* Bisherige Abbildung der Baumstruktur, die aber zu komplex im Hinblick auf einfache Handhabung war */
/* Ist in vielen Modulen noch vorhanden, kann aber durch .tri-tree (siehe oben) ersetzt werden */
.tri-treestructure > ul {
	padding: 10px;
}


.tri-treestructure ul > li {
	font-size: 13px;
	margin: 3px 0 0 0;
}

.tri-treestructure > ul > li:first-child {
	margin: 0;
}

.tri-treestructure p {
	margin: 0;
}


.tri-treestructure > ul ul {
	height: 0;
	overflow: hidden;
}

.tri-treestructure > ul ul.tri-opened,
.tri-treestructure > ul ul.opened {
	height: auto;
	overflow: visible;
	padding: 0 0 0 15px;
}

.tri-treestructure p.tri-grabber {
	cursor: pointer;
	line-height: 20px;
}
/* ------------------------------------------------------------------------------------------------------------------------------------------------ */





.tri-table {
	display: flex;
	align-items: stretch;
	flex-direction: column;
	height: 100%;
}

.tri-table .tri-table-header {
	flex: 0 0 30px;
	overflow: hidden;
	border-bottom: 1px solid #bababa;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f1f1f1+50,e1e1e1+51,f6f6f6+100;White+Gloss+%231 */
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#f6f6f6",GradientType=0 ); /* IE6-9 */
	display: flex;
}

.tri-table .tri-table-header .tri-rowflex {
	height: 100%;
	width: 100%;
	flex: 1 1 100%;
}

.tri-table .tri-table-header .tri-spare {
	height: 100%;
	width: 0;
	flex: 0 0 0;
}


.tri-table .tri-table-header .tri-rowflex > * {
	font-weight: 500;
}

.tri-table .tri-table-header h2 {
	margin: 0;
	line-height: 20px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: 500;
}

.tri-table .tri-table-body {
	min-height: 0;
	flex: 1 1 auto;
	overflow: auto;
}

.tri-table .tri-rowflex {
	align-items: stretch;
}

.tri-table .tri-rowflex svg {
	width: 1.2rem;
	height: 1.2rem;
}

.tri-table .tri-rowflex.disabled,
.tri-table .tri-colflex.disabled {
	color: #cacaca;
}

.tri-table .tri-rowflex.tri-dblklick,
.tri-table .tri-colflex.tri-dblklick {
	cursor: pointer;
}


.tri-table .tri-table-body > .tri-rowflex:nth-child(even),
.tri-table .tri-table-body > .tri-colflex:nth-child(even) {
	background-color: #f6f6f6;
}

.tri-table .tri-table-body > .tri-rowflex:hover,
.tri-table .tri-table-body > .tri-colflex:hover {
	background-color: #e8e8e8;
}

.tri-table .tri-rowflex > * {
	padding: 5px;
	border-right: 1px solid #bababa;
	box-sizing: border-box;
}

.tri-table .tri-rowflex > *:last-child {
	/* border-right-width: 0; */
}

.tri-markables.dias {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: baseline;
	list-style-type: none;
}

.tri-markables .tri-markable {
	box-sizing: border-box;
	width: 140px;
	height: 140px;
	margin: 10px;
	padding: 10px;
	flex: 0 0 auto;
	background-color: #E6E6E6;
	border: 1px solid #D3D3D3;
	border-radius: 5px;
	cursor: pointer;
}

.tri-markables .tri-markable .image {
	width: 100%;
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

.tri-table .tri-table-body > .tri-rowflex.active-row,
.tri-table .tri-table-body > .tri-colflex.active-row,
.tri-markables .tri-markable.active-row {
	background-color: #c1cdd2;
}

.tri-table .tri-table-body > .tri-rowflex.active-row:hover,
.tri-table .tri-table-body > .tri-colflex.active-row:hover {
	background-color: #92a6af;
}

.tri-table .tri-table-body > .tri-rowflex.active-row.disabled:hover,
.tri-table .tri-table-body > .tri-colflex.active-row.disabled:hover {
	background-color: #c0d2da;
}


.tri-table .tri-rowflex .tri-flex-scrollbardifference {
	flex: 0 0 12px;
}


.tri-table .tri-table-footer {
	flex: 0 0 30px;
	overflow: hidden;
	border-top: 1px solid #bababa;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f1f1f1+50,e1e1e1+51,f6f6f6+100;White+Gloss+%231 */
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#f6f6f6",GradientType=0 ); /* IE6-9 */
}

.tri-table .tri-table-footer .tri-rowflex:last-child {
	border-bottom-width: 0;
}


.tri-filter select,
.tri-sorter select {
	box-sizing: border-box;
	width: 100%;
}

.tri-colflex {
	display: flex;
	flex-direction: column;
}


.tri-rowflex-vertical {
	display: flex;
	flex-direction: column;
	margin-bottom: 9px;
}

.tri-rowflex-vertical:last-child {
	margin-bottom: 0;
}

.tri-rowflex-vertical label {
	display: flex;
	flex-direction: column;
	margin-bottom: 4px;
}

.tri-rowflex {
	display: flex;
	align-items: stretch;
}

.centered-strategy .tri-rowflex > * {
	display: block;
	align-items: center;
}


.tri-rowflex .tri-stretch-basis,
.tri-rowflex .tri-listbutton,
.tri-rowflex .tri-flex-listbutton,
.tri-rowflex .tri-toggle-opened  {
	flex: 0 0 20px;
}


.tri-rowflex.column {
	display: flex;
	flex-direction: column;
}



.tri-filter .tri-rowflex label {
	flex: 1 1 40%;
}

.tri-filter .tri-rowflex p {
	flex: 1 1 40%;
	text-align: right;
}


.tri-rowflex.column {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.tri-rowflex.column div,
.tri-rowflex.column p {
	flex: 1 1 auto;
	text-align: left;
	margin: 0 0 4px 0;
}


.tri-flex-columns {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
}

.tri-flex-columns > .tri-listbutton,
.tri-flex-columns > button {
	width: 23px;
	flex: 0 0 23px;
	margin: 0;
	height: auto;
}

.tri-flex-columns > .tri-listbutton span.ui-button-text,
.tri-flex-columns > button span.ui-button-text {
	padding: 0;
	line-height: 20px;
}

.tri-flex-columns > .tri-listbutton span.ui-button-text > i,
.tri-flex-columns > button span.ui-button-text > i {
	padding: 0;
}

.tri-flex-columns > input,
.tri-flex-columns > select {
	width: calc(100% - 30px);
	flex: 0 1 auto;
}




a.tri-listbutton.disabled,
a.tri-listbutton:hover.disabled,
.tri-rowflex .tri-flex-listbutton.disabled,
.tri-rowflex .tri-flex-listbutton:hover.disabled {
	color: #e0e0e0;
	border-color: #e0e0e0;
	background: white;
}

.tri-rowflex .tri-flex-interaction {
	flex: 0 0 70px;
	display: flex;
	justify-content: space-around;
	align-items: flex-start;
}


.centered-strategy .tri-rowflex .tri-flex-interaction {
	align-items: center;
}

.centered-strategy .tri-rowflex .tri-flex-interaction > * {
	flex: 0 0 auto;
	margin: 0;
}


.tri-rowflex .tri-flex-interaction-middle {
	flex: 0 0 56px;
	text-align: right;
}

.tri-rowflex .tri-flex-interaction-large {
	flex: 0 0 86px;
	text-align: right;
}

.tri-rowflex .tri-flex-interaction-small {
	flex: 0 0 22px;
	text-align: right;
}


.tri-rowflex .tri-flex-interaction-small > a:first-child,
.tri-rowflex .tri-flex-interaction > a:first-child {
	margin: 0;
}


.tri-flex-interaction button.ui-button .ui-button-text {
	padding: 4px 7px;
}

.tri-flex-interaction .tri-controllgroup > button.ui-button.tri-toggle-controllgroup-menu > span.ui-button-text {
	padding: 4px 0;
}



.tri-rowflex .tri-stretch-basis {
	flex-basis: 30%;
}

.tri-rowflex .tri-flexible-20px {
	flex: 0 0 20px;
}

.tri-rowflex .tri-flexible-200px {
	flex: 0 0 200px;
}

.tri-rowflex .tri-flexible-300px {
	flex: 0 0 300px;
}

.tri-rowflex .tri-flex-checkbox {
	flex: 0 0 15px;
	height: 13px;
}

/* .centered-strategy .tri-rowflex .tri-stretch-flexible,
.centered-strategy .tri-rowflex .tri-stretch-fixedwidth {
	display: flex;
} */


.tri-rowflex .tri-stretch-flexible {
	flex: 1 1 auto;
	
}


.tri-rowflex .tri-stretch-fixedwidth {
	flex: 0 0 auto;
}

.tri-table .tri-rowflex,
.tri-table .tri-colflex {
	border-bottom: 1px solid #bababa;
}

.tri-table .tri-spare {
	width: 0;
	padding: 0;
	margin: 0;
	flex: 0 0 auto;
}



/* Wird f�r die Darstellung von Feldern in Buttonleisten gebrauch */
.tri-labeled-fields {
	box-sizing: border-box;
	display: inline-block;
	padding: 0 10px 0 0;
	
}


.tri-labeled-fields label,
.tri-labeled-fields .tri-field {
	box-sizing: border-box;
	display: inline-block;
	padding: 0 5px 0 0;
	vertical-align: middle;
}


.tri-labeled-fields .tri-field {
	height: 24px;
	overflow: hidden;
}


.tri-labeled-fields select {
	width: 150px;
}


.tri-fields select {
	width: 100%;
}

.tri-ui-selectmenu-overflow {
	/* height: 250px; */
}

.tri-fieldset {
	margin: 1em 0 1.5em 0;
	padding: 2em 1em 1em 1.2em;
	position: relative;
	
}

.tri-fieldset section {
	margin: 35px 0 0 0;
	padding: 35px 0 0 0;
	border-top: 1px solid #C0C0C0;
	position: relative;
}

.tri-fieldset section .tri-section-description {
	display: inline-block;
	padding: 5px;
	margin: 0 0 0 30px;
	position: absolute;
	height: 26px;
	border: 1px solid #C0C0C0;
	box-sizing: border-box;
	left: 0;
	top: -13px;
	background-color: #FFF;
}

.tri-fieldset section:first-child {
	margin: 0;
	padding: 0;
	border-top: 0;
}

.tri-fieldset legend {
	position: relative;
}

.tri-fieldset legend .tri-fieldset-legend-toolbar {
	position: absolute;
	top: 50%;
	margin: -15px 0 0 0;
	left: calc(100% + 20px);
	height: 30px;
	box-sizing: border-box;
	width: 210px;
	
	display: flex;
	align-content: stretch;
	align-items: center;
	justify-content: flex-start;
}

.tri-fieldset legend .tri-fieldset-legend-toolbar > * {
	flex: 0 0 auto;
	margin-right: .3rem;
	min-height: 28px;
	height: 28px;
}
						




.tri-fieldset-legend {
	display: inline-block;
	padding: 0.5em;
	border: 1px solid #bababa;
	vertical-align: middle;
	
}



.tri-fieldset-legend input[type="checkbox"] {
	vertical-align: middle;
}

.tri-fields {
	margin: 0 0 5px 0;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}





.tri-fields + .tri-fields:last-child {
	margin: 0;
}

.tri-fields label * {
	vertical-align: middle;
}

.tri-fields div.tri-label,
.tri-fields div.label,
.tri-fields label {
	line-height: 20px;
	flex: 0 0 150px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	position: relative;
}

.tri-fields .tri-field {
	line-height: 20px;
	flex: 1 1 auto;
	display: block;
	
}

.tri-fields.is-checkbox label {
	flex: 1 1 auto;
}

.tri-fields.is-checkbox .tri-field {
	flex: 0 0 24px;
}



.tri-fields.flex-column {
	flex-direction: column;
}


.tri-fields.flex-column > * {
	flex: 1 1 auto;
	width: 100%;
}


.tri-fields.rtl {
	flex-direction: row-reverse;
}

.tri-fields.rtl label {
	line-height: 20px;
}

.tri-fields.rtl .tri-field {
	line-height: 20px;
	margin: 0 20px 0 0;
}


.tri-fields .tri-field * {
	font-size: 1rem;
}

.tri-fields .tri-field p,
.tri-fields .tri-field .input {
	margin: 0;
	padding: 1px;
	line-height: 19px;
	min-height: 19px;
}

.tri-fields .tri-field .input {
	border: 1px solid #D4D4D4;
	padding: 1px 4px;
	box-sizing: border-box;
}


.tri-fields.tri-fields-vertical .tri-field,
.tri-fields.tri-fields-vertical label {
	float: none;
	margin: 0 0 5px 0;
	width: 100%;
}

.tri-fields .tri-field .tri-ckeditor-preview {
	height: 200px;
	overflow: auto;
	padding: 10px;
	/* cursor: pointer; */
}

.tri-fields-even label {
	float: left;
	width: 49%;
	
}

.tri-fields-even .tri-field {
	float: right;
	width: 49%;
}


.tri-fields .tri-field.tri-radiobuttonlist > .tri-radiobuttonset {
	display: flex;
}

.tri-fields .tri-field.tri-radiobuttonlist > .tri-radiobuttonset > .tri-radiobutton-input{
	flex: 0 0 20px;
	padding: 2px;
}


.tri-fields .tri-field.tri-radiobuttonlist > .tri-radiobuttonset > .tri-radiobutton-label{
	flex: 1 1 auto;
}


/* --------------------------------------------------------------------------------------------------------------- */
/* Dynamisches Dropdownfeld */
.tri-fields .tri-field.has-selector {
	position: relative;
}

.tri-fields .tri-field.has-selector > input {
	padding-right: 20px;
}

.tri-fields .tri-field.has-selector > a {
	cursor: pointer; 
	width: 20px;
	height: 20px; 
	position: absolute;
	top: 50%;
	margin-top: -10px;
	right: 1px;
	text-align: center;
}

.tri-fields .tri-field.has-selector > a > i {
	font-size: 11px;
}
/* --------------------------------------------------------------------------------------------------------------- */






.tri-profile-image {
	width: 200px;
	height: 200px;
	border: 1px solid #D3D3D3;
	background-image: url(silhouette.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	position: relative;
}


.tri-profile-image .delete-profile-image {
	display: block;
	position: absolute;
	width: 24px;
	height: 24px;
	left: 15px;
	bottom: 15px;
	/* text-align: center; */
	/* background-color: #FFF; */
	/* border: 1px solid #666; */
	/* -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px; */
	
}

.tri-profile-image .delete-profile-image.has-profile-image0 {
	display: none;
}

.tri-profile-image .delete-profile-image .fa {
	line-height: 20px;
}



.tri-input-amend-icon {
	padding: 4px 5px;
}

.tri-input-amend-content {
	display: inline-block;
	cursor: pointer;
	border-top: 1px solid #d4d4d4;
	border-bottom: 1px solid #d4d4d4;
}

input.tri-input-prepend-seamless {
	border-left: none;
}

.tri-input-prepend-content {
	border-left: 1px solid #d4d4d4;
}

input.tri-input-append-seamless {
	border-right: none;
}

.tri-input-append-content {
	border-right: 1px solid #d4d4d4;
}

.tri-field .ui-spinner {
	height: 23px;
	box-sizing: border-box;
}

.ui-spinner input[type="text"] {
	border-width: 0;
	margin: 0;
	padding: 0 4px;
	height: 100%;
	line-height: 100%;
	box-sizing: border-box;
}

.ui-spinner input[type="text"]:focus {
	outline-style: none;
	outline-color: transparent;
}



select {
	width: auto;
}

label select {
	width: 100%;
}

input[name="tri_current_page"] {
	width: 70px;
	height: 18px;
}

textarea {
	height: 150px;
}

.tri-filter,
.tri-sorter {
	margin: 0;
	padding: 7px;
	box-sizing: border-box;
	height: 100%;
	overflow: auto;
	background-color: #FFF;
}

.tri-filter-no-options {
	text-align: center;
	color: #D3D3D3;
	padding: 15px;
}

.tri-filter .tri-toggleble-content {
	height: auto;
}

.tri-filter.for-select-state {
	padding: 0;
}

.tri-sorter > .tri-sorter-row {
	box-sizing: border-box;
	border: 1px solid #bababa;
	display: flex;
	margin: 0 0 5px 0;
	padding: 3px;
	cursor: pointer;
}

.tri-sorter > .tri-sorter-row:last-child {
	margin: 0;
}

.tri-sorter > .tri-sorter-row > .tri-label {
	width: calc(100% - 30px);
	flex: 1 1 auto;
	line-height: 22px;
}

.tri-sorter > .tri-sorter-row > .tri-action {
	flex: 0 0 30px;
	text-align: right;
}


.tri-filter .row,
.tri-sorter .row {
	margin: 0 0 7px 0;
}

.tri-filter .row:last-child,
.tri-sorter .row:last-child {
	margin: 0;
}




/* DEPRICATED */
.tri-border-right {
	/* border-right: 1px solid #bababa; */
}

/* DEPRICATED */
.tri-border-left {
	/* border-left: 1px solid #bababa; */
}

.tri-padding,
.tri-cards {
	margin: 0;
	padding: 15px;
}

.tri-cards .tri-card {
	float: left;
	box-sizing: border-box;
	display: inline-block;
	margin: 0 20px 20px 0;
	padding: 10px;
	border: 1px solid #bababa;
	width: calc(50% - 20px);
	min-width: 320px;
	position: relative;
	max-height: 200px;
}

/* Wenn ein .tri-card in Verbindung mit einem .tri-rowflex layoutet ist */
.tri-cards .tri-card.tri-rowflex {
	display: flex;
	align-items: stretch;
}

.tri-cards .tri-card.tri-rowflex .tri-card-flexcontent {
	width: calc(100% - 30px);
	flex: 0 0 auto;
}

.tri-cards .tri-card.tri-rowflex .tri-card-flexinteraction {
	width: 30px;
	flex: 0 0 auto;
}

.tri-cards .tri-card.tri-rowflex .tri-card-flexinteraction .tri-listbutton {
	position: static;
	margin-bottom: 4px;
}


/* DEPRECATED - Der Container f�r die Buttons in Cards ist in Zukunft ein Flex (rechts) */
.tri-cards .tri-card a.tri-edit,
.tri-rowset .tri-list-row a.tri-edit {
	position: absolute;
	right: 12px;
	top: 12px;
}


.tri-register-content .tri-field input[type="text"],
.tri-register-content .tri-field input[type="password"] {
	width: 80%;
	margin-right: 15px;
}



.tri-menustructures-dialog select[name^="tri_destination_module_id"] {
	width: 220px;
	
}

select[name="tri_country_id"] {
	width: 50%;
}

select[name="tri_state_id"] {
	width: 50%;
}

.tri-left-float {
	box-sizing: border-box;
	float: left;
	width: 50%;
	height: 100%;
	display: inline-flex;
	align-items: stretch;
}

.tri-left-float > * {
	margin-right: 4px;
}

.tri-right-float {
	box-sizing: border-box;
	float: right;
	width: 50%;
	height: 100%;
	text-align: right;
}


.tri-overflow {
	overflow: auto;
}

.has-text-overflow {
	text-overflow: ellipsis;
}


.tri-loader {
	position: absolute;
	background-color: transparent;
	color: #006f66;
	text-align: center;
	left: -99999em;
	top: -99999em;
	opacity: 0;
}

.tri-loader.tri-loader-middle {
	width: 70px;
	height: 70px;
	left: 50%;
	top: 50%;
	font-size: 70px;
	line-height: 70px;
	margin: -35px 0 0 -35px;
	opacity: 1;
}

.hide-on-new {
	display: none;
}

.ui-dialog button .fa-check.hidden {
	opacity: 0;
	transition: opacity 1s linear;
}
		
		
.ui-dialog button .fa-check.visible {
	opacity: 1;
}
		
		
.ui-dialog button .fa-check {
	position: absolute;
	top: -5px;
	right: -5px;
	color: darkgreen;
	font-size: 12px;
}



.ui-dialog,
.tri-cards .tri-card,
.tri-is-menu > li > ul,
.tri-dropdown-menu > li > ul,
.tri-fieldset section .tri-section-description,
.has-box-shadow {
	-webkit-box-shadow: 8px 8px 23px -11px rgba(0,0,0,0.75);
	-moz-box-shadow: 8px 8px 23px -11px rgba(0,0,0,0.75);
	box-shadow: 8px 8px 23px -11px rgba(0,0,0,0.75);
}