.ut-style-primary
{
	--app-primary-color: #6200ee; /*color*/
	--app-primary-color-light: #b8b0e4; /*color*/
	--app-primary-color-dark: #23036a; /*color*/
	--app-primary-foreground: #ffffff; /*color*/

	--app-secondary-color: #03DAC6; /*color*/
	--app-secondary-foreground: #ffffff; /*color*/
	--menubar-highlighted-background: #323232; /*color*/
	--menubar-foreground: #d0d0d0; /*color*/
	--appbar-background: #272727; /*color*/

	--link-color: #6200ee; /*color*/

	--menubar-background: #2e2e2e; /*color*/
	--menubar-foreground: #f0f0f0; /*color*/
	--menubar-font-size: 15px; /*measure*/

	--headbar-background: white; /*color*/
	--headbar-foreground: black; /*color*/
	--headbar-font-size: 18px; /*measure*/

	--content-background: #f0f0f0; /*color*/
	--content-foreground: #202020; /*color*/
	--content-font-size: 14px; /*measure*/

	--boxed-background: #636363; /*color*/
	--disabled-background: #e0e0e0; /*color*/
	--highlight-on-highlight: #f0f0f0; /*color*/
	--highlight-on-highlight-border: #ababab; /*color*/
	--main-input-font-color: #404040; /*color*/
	--main-input-background-color: #f0f0f0; /*color*/
	--primary-font-color: #f0f0f0; /*color*/

	--primary-font: 'Roboto'; /*string*/

	--input-background: #ffffff; /*color*/
	--input-foreground: #404040; /*color*/
	--input-border-color: #404040; /*color*/
	--input-border-width: 1px; /*measure*/
	--input-border-radius: 3px; /*measure*/
	--input-focus-border-color: #6200ee; /*color*/
	
	--scrollbar-background: #f0f0f0; /*color*/
	--scrollbar-foreground: #a0a0a0; /*color*/

	--main-border-color: #e0e0e0; /*color*/
	--app-flowconnector-color: #202020; /*color*/
	--raster-color: #d8d8d8; /*color*/
	--tag-background-color: #d8d8d8; /*color*/
	--tag-foreground-color: #202020; /*color*/
}

@font-face
{
	font-family: 'Roboto';
	src: url(ressources/fonts/Roboto/Roboto-Regular.ttf) format('truetype');
	font-weight: normal;
}

@font-face
{
	font-family: 'Roboto';
	src: url(ressources/fonts/Roboto/Roboto-Black.ttf) format('truetype');
	font-weight: bold;
}
.ui-tooltip
{
  padding: 0 10px;
}
body.utalic-stage
{
	margin: 0;
	padding: 0;
	user-select: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: moz-none;
	-ms-user-select: none;
	-o-user-select: none;
	font-family: var(--primary-font);
  font-size: 15px;
  background-color: #26282c;
  color: var(--content-foreground);
	overscroll-behavior: none;
	position: fixed;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
.vcontrol
{
	position: absolute;
	box-sizing: border-box;
	vertical-align: top;
	outline: none;
}
.utalic-filedrop-marker 
{
	border: 4px dashed var(--app-primary-color);
  border-radius: 20px;
	content: 'drop';
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 99;
}
.color-scheme-light .utalic-filedrop-marker 
{
	background-color: #ffffffde;
}
.color-scheme-dark .utalic-filedrop-marker 
{
	background-color: #000000de;
}
.utalic-filedrop-icon
{
	position: absolute;
	left: calc(50% - 20px);
	top: calc(50% - 20px);
	width: 40px;
	height: 40px;
	color: #747474;
	font-size: 30px;
	text-align: center;
}
.color-scheme-dark .select2-dropdown 
{
  background-color: var(--main-input-border-color) !important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable
{
	border-radius: 4px;
}
.select2-container--default .select2-selection--single
{
	border: none !important;
	background-color: inherit !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered
{
	color: inherit !important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable
{
	border-radius: 4px !important;
	margin: 2px 5px 2px 5px !important;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable:not(:hover)
{
	background-color: inherit;
	color: inherit;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable:hover
{
	background-color: var(--record-active-color) !important;
	color: var(--record-active-font-color) !important;
	border-radius: 8px !important;
}
.select2-results__option--selectable
{
	margin: 2px 5px 2px 5px !important;
	font-size: var(--content-font-size) !important;
}
.select2-container
{
	width: 100% !important;
}
.select2-dropdown
{
  background-color: var(--content-background) !important;
}
.select2-results__option.select2-results__message
{
  font-size: 12px;
  opacity: 0.4;
  padding: 6px 10px;
}
.select2-container--default .select2-results__option--selected
{
	background-color: var(--app-primary-color-dark) !important;
	border-radius: 4px !important;
	margin: 2px 5px 2px 5px !important;
	color: var(--record-active-font-color) !important;
}
.select2-container--default .select2-search--dropdown .select2-search__field
{
	border: none !important;
	border-radius: 7px !important;
	outline: none !important;
  background-color: var(--main-input-background-color) !important;
  color: var(--main-input-font-color) !important;
	padding: 2px 4px 2px 7px;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable:empty,
.select2-container--default .select2-results__option--selected:empty
{
	display: none;
}
.select2-container--open .select2-dropdown
{
	left: -1px !important;
	padding: 5px 0 5px 0 !important;
	box-sizing: content-box !important;
	border-color: var(--main-input-border-color) !important;
}
.select2-container--open .select2-dropdown--below 
{
	margin-top: -6px !important;
}
.select2-container .select2-selection--single .select2-selection__rendered
{
  padding-left: 5px !important;
}
.quill-toolbar
{
	height: 40px !important;
	border-bottom: 1px solid var(--main-border-color) !important;
  overflow-x: auto !important;          
  overflow-y: hidden !important;     
  -ms-overflow-style: none !important; 
  scrollbar-width: none !important; 
}
.quill-toolbar::-webkit-scrollbar {
  display: none !important;
}
.quill-toolbar.active {
  cursor: grabbing !important;
}
.quill-editor
{
	height: calc(100% - 40px) !important;
}

.vcontrol[data-utalic-class="VButtonGroup"] .scroll-content 
{
    white-space: nowrap;
    overflow-x: auto;
    display: inline-block;
    width: 100%;
    height: 100%;
}

.vcontrol[data-utalic-class="VButtonGroup"] .scroll-button {
    position: absolute;
    top: 0px;
    bottom: 0px;
    width: 30px;
    background-color: var(--app-primary-color);
    color: rgb(255, 255, 255);
    text-align: center;
    cursor: pointer;
    z-index: 10;
    line-height: 25px;
    font-weight: bold;
    font-size: 19px;
}
.vcontrol[data-utalic-class="VButtonGroup"] .scroll-button.left {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    left: 0;
}

.vcontrol[data-utalic-class="VButtonGroup"] .scroll-button.right {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    right: 0;
}

.utalic-pickr
{
	box-sizing: border-box;
}
.utalic-pickr .pickr
{
	width: 100%;
	height: 100%; 
}
.utalic-pickr .pickr .pcr-button
{
	box-shadow: none !important;
	width: 100% !important;
	height: 100% !important; 
}

.vcontrol[data-utalic-class="VButtonGroup"] .scroll-content 
{
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* Internet Explorer 10+ */
}

.vcontrol[data-utalic-class="VButtonGroup"] .scroll-content::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

.VCarouselItem
{
	position: absolute;
	height: 100%;
	width: 100%;
	box-sizing: border-box;
}
.fc .fc-scrollgrid-section-sticky > *
{
	background-color: var(--menubar-background) !important;
	color: var(--menubar-foreground) !important;
}
.fc-dayGridMonth-view.fc-view.fc-daygrid,
.fc-dayGridMonth-view.fc-view.fc-daygrid .fc-scrollgrid,
.fc-dayGridMonth-view.fc-view.fc-daygrid .fc-scrollgrid .fc-scroller-harness,
.fc-dayGridMonth-view.fc-view.fc-daygrid .fc-scrollgrid .fc-scroller-harness .fc-scroller,
.fc-dayGridMonth-view.fc-view.fc-daygrid .fc-scrollgrid .fc-scroller-harness .fc-scroller .fc-daygrid-body.fc-daygrid-body-unbalanced.fc-daygrid-body-natural,
.fc-dayGridMonth-view.fc-view.fc-daygrid .fc-scrollgrid .fc-scroller-harness .fc-scroller .fc-daygrid-body.fc-daygrid-body-unbalanced.fc-daygrid-body-natural > table
{
	height: 100%;
}
.vcontrol[data-utalic-class="VButtonGroup"]
{
	overflow-x: auto;
	overflow-y: hidden;
	padding: 0 !important;
	white-space: nowrap;
	text-align: center;
}
.vcontrol[data-utalic-class="VButton"].disabled
{
	opacity: 0.4 !important;
}
.vcontrol[data-utalic-class="VButtonGroup"] .groupbutton
{
	display: inline-block;
	padding: 5px;
	cursor: pointer;
	height: 100%;
	min-width: 25%;
	box-sizing: border-box;
	text-align: center;
}
.vcontrol.side-by-side[data-utalic-class="VButtonGroup"] .groupbutton
{
	white-space: nowrap;
}
.vcontrol[data-utalic-class="VButtonGroup"] .groupbutton .icon
{
	font-size: inherit;
	line-height: inherit;
}
.vcontrol.side-by-side[data-utalic-class="VButtonGroup"] .groupbutton .icon
{
	display: inline-block;
	margin-right: 5px;
}
.vcontrol.side-by-side[data-utalic-class="VButtonGroup"] .groupbutton .caption
{
	display: inline-block;
	margin-right: 5px;
}
.vcontrol[data-utalic-class="VShape"] svg
{
	position: absolute;
	left: 0;
	top: 0;
}
.vcontrol[data-utalic-class="VCanvas"] canvas,
.vcontrol[data-utalic-class="VPieChart"] canvas,
.vcontrol[data-utalic-class="VDrawingPad"] .canvas-wrapper
{
	width: 100%;
	height: 100%;
}
.vcontrol[data-utalic-class="VDrawingPad"] .canvas-wrapper
{
	overflow: auto;
}
.vcontrol p,
.vcontrol h1,
.vcontrol h2,
.vcontrol h3,
.vcontrol h4,
.vcontrol h5,
.vcontrol h6
{
	margin: 0;
	padding: 0;
}
.vcontrol.toolbar-left[data-utalic-class="VDrawingPad"]:not(.readonly)
{
	padding-left: 40px !important;
}
.vcontrol.toolbar-top[data-utalic-class="VDrawingPad"]:not(.readonly)
{
	padding-top: 40px !important;
}
.vcontrol[data-utalic-class="VDrawingPad"] .toolbox .tools
{
	overflow: auto;
}
.vcontrol[data-utalic-class="VDrawingPad"] .toolbox .tools::-webkit-scrollbar
{
	height: 0;
	width: 0;
}
.vcontrol.toolbar-left[data-utalic-class="VDrawingPad"] .toolbox
{
	position: absolute;
	left: 0;
	top: 0;
	width: 40px;
	bottom: 0;
	background-color: black;
}
.vcontrol.toolbar-left[data-utalic-class="VDrawingPad"] .toolbox .tools
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 75px;
	top: 0;
}
.vcontrol.toolbar-top[data-utalic-class="VDrawingPad"] .toolbox .tools
{
	position: absolute;
	left: 0;
	right: 45px;
	bottom: 0;
	top: 0;
}
.vcontrol.toolbar-top[data-utalic-class="VDrawingPad"] .toolbox
{
	position: absolute;
	left: 0;
	top: 0;
	height: 40px;
	right: 0;
	background-color: black;
	white-space: nowrap;
}
.vcontrol.toolbar-none[data-utalic-class="VDrawingPad"] .toolbox
{
	display: none;
}
.vcontrol .toolbox .color-fg-wrapper,
.vcontrol .toolbox .color-bg-wrapper
{
	width: 15px;
	height: 15px;
	position: absolute;
	border: 1px solid white;
	background-image: url(ressources/images/chess.svg);
	background-size: 30px;
}
.vcontrol .toolbox .color-fg-wrapper
{
	left: 7px;
	top: 7px;
	z-index: 2;
}
.vcontrol .toolbox .color-bg-wrapper
{
	right: 7px;
	bottom: 7px;
}
.vcontrol .toolbox .color-fg,
.vcontrol .toolbox .color-bg
{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.device-mode-tablet .VDrawerMenu,
.device-mode-desktop .VDrawerMenu
{
	display: none !important;
}
.refresh-bouncer
{
	background-color: transparent;
	text-align: center;
}
.refresh-bouncer .refresh-icon
{
	color: var(--app-primary-color);
	font-size: 18px;
	transform-origin: center;
	text-align: center;
}
.refresh-bouncer.complete .refresh-icon
{
	color: var(--app-secondary-color);
}
.VDrawerMenu
{
	position: fixed;
	min-width: 5px;
	min-height: 10px;
	vertical-align: top;
	white-space: nowrap;
	border-radius: 8px;
	overflow: hidden;
}
.VDrawerMenu .VDrawerMenuItem
{
	display: inline-block;
	vertical-align: top;
	position: relative;
	height: 100%;
  overflow: hidden;
  text-align: center;
  padding: 10px 5px;
  box-sizing: border-box;
	font-size: 24px;
  cursor: pointer;
}
.VDrawerMenu .VDrawerMenuItem .icon
{
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	left: 5px;
	top: 10px;
	bottom: 10px;
	right: 5px;
}
.VDrawerMenu .VDrawerMenuItem .caption
{
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 10px;
  margin-top: 5px;
  position: absolute;
  left: 5px;
  right: 5px;
  top: 55%;
}
.VInlineDrawerMenu
{
	position: absolute;
	right: 10px;
	top: 10px;
	height: 30px;
	display: none;
	border-radius: 0;
	white-space: nowrap;
	overflow: hidden;
	z-index: 99;
}
.VInlineDrawerMenu .VDrawerMenuItem
{
	display: inline-block;
	vertical-align: top;
	position: relative;
	height: 100%;
  overflow: hidden;
  text-align: center;
  padding: 2px;
  box-sizing: border-box;
	font-size: 15px;
  cursor: pointer;
  width: 30px !important;
  border-radius: 50%;
  margin-right: 5px;
}
.VInlineDrawerMenu .VDrawerMenuItem .icon
{
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  line-height: 30px;
  text-align: center;
  width: 100%;
}
.VInlineDrawerMenu .VDrawerMenuItem .caption
{
  display: none;
}
@keyframes delayed-drawer-menu
{
	0% {opacity: 0; pointer-events: none;}
	50% {opacity: 0; pointer-events: none;}
	100% {opacity: 1; pointer-events: auto;}
}
.device-mode-tablet .vcontrol.owner-control > .VInlineDrawerAction,
.device-mode-desktop .vcontrol.owner-control > .VInlineDrawerAction,
.device-mode-mobile .vcontrol.owner-control > .VInlineDrawerAction
{
	display: none;
}
.device-mode-mobile .vcontrol[data-utalic-class="VScenePopup"] > .vcontrol
{
	top: 45px !important;
	border-radius: 0 !important;
}
.device-mode-tablet .vcontrol.owner-control:not(.inline-drawer-shown):hover > .VInlineDrawerAction,
.device-mode-desktop .vcontrol.owner-control:not(.inline-drawer-shown):hover > .VInlineDrawerAction,
.device-mode-tablet .vcontrol.owner-control.dbcursor:not(.inline-drawer-shown) > .VInlineDrawerAction,
.device-mode-desktop .vcontrol.owner-control.dbcursor:not(.inline-drawer-shown) > .VInlineDrawerAction
{
	position: absolute;
	right: 10px;
	top: 10px;
	width: 30px;
	height: 30px;
	display: block;
	line-height: 30px;
	text-align: center;
	background-color: var(--content-background);
	border-radius: 50%;
}
.device-mode-tablet .vcontrol.owner-control.inline-drawer-shown > .VInlineDrawerMenu,
.device-mode-desktop .vcontrol.owner-control.inline-drawer-shown > .VInlineDrawerMenu
{
	display: block;
}
.vcontrol[data-utalic-class="VDrawingPad"] .toolbox .stroke-chooser
{
	position: absolute;
	width: 40px;
	height: 40px;
	cursor: pointer;
}
.vcontrol.toolbar-left[data-utalic-class="VDrawingPad"] .toolbox .stroke-chooser .stroke
{
	position: absolute;
	left: 5px;
	right: 5px;
	top: calc(50% - 2px);
	height: 2px;
	background-color: white;
}
.vcontrol.toolbar-top[data-utalic-class="VDrawingPad"] .toolbox .stroke-chooser .stroke
{
	position: absolute;
	top: 5px;
	bottom: 5px;
	left: calc(50% - 2px);
	width: 2px;
	background-color: white;
}
.vcontrol[data-utalic-class="VDrawingPad"] .toolbox .color-chooser
{
	position: absolute;
	width: 40px;
	height: 40px;
	cursor: pointer;
}
.vcontrol.toolbar-left[data-utalic-class="VDrawingPad"] .toolbox .color-chooser
{
	left: 0;
	bottom: 0;
}
.vcontrol.toolbar-top[data-utalic-class="VDrawingPad"] .toolbox .color-chooser
{
	top: 0;
	right: 0;
}
.vcontrol.toolbar-left[data-utalic-class="VDrawingPad"] .toolbox .stroke-chooser
{
	left: 0;
	bottom: 40px;
}
.vcontrol.toolbar-top[data-utalic-class="VDrawingPad"] .toolbox .stroke-chooser
{
	top: 0;
	right: 40px;
}
.vcontrol[data-utalic-class="VDrawingPad"] .toolbox .tool
{
  display: inline-block;
  width: 40px;
  height: 40px;
  margin-right: 5px;
  margin-bottom: 5px;
  overflow: hidden;
  font-size: 20px;
  box-sizing: border-box;
  padding: 10px;
  cursor: pointer;
  text-align: center;
}
.vcontrol[data-utalic-class="VVideo"],
.vcontrol[data-utalic-class="VHtmlEdit"]
{
	overflow: hidden;
}
.vcontrol[data-utalic-class="VHtmlEdit"] .ql-toolbar.ql-snow
{
	border-top: none;
	border-right: none;
	border-left: none;
}
.vcontrol[data-utalic-class="VHtmlEdit"] .ql-container.ql-snow
{
	border: none;
}
.vcontrol[data-utalic-class="VVideo"] video-js
{
	background: transparent;
	width: 100%;
	height: 100%;
}
.vcontrol[data-utalic-class="VProgressBar"] .bar
{
	height: 100%;
}
.vcontrol[data-utalic-class="VSlider"] .bar,
.vcontrol[data-utalic-class="VSlider"] .hover-bar
{
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
}
.vcontrol[data-utalic-class="VSlider"] .indicator
{
	left: 58%;
  width: 12px;
  height: calc(100% + 16px);
  background-color: black;
  position: absolute;
  margin-left: -8px;
  margin-top: -8px;
  border-radius: 5px;
}
.vcontrol[data-utalic-class="VSlider"]
{
	overflow: visible !important;
}
.vcontrol[data-utalic-class="VSlider"] .hover-bar
{
	display: none;
}
.vcontrol[data-utalic-class="VSlider"]:hover .hover-bar
{
	display: block;
}
.vcontrol[data-utalic-class="VSlider"]:hover .bar
{
	display: none;
}
.vcontrol[data-utalic-class="VCalendar"] .calendar-wrapper
{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
.vcontrol[data-utalic-class="VCalendar"] .fc-view-harness
{
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	top: 60px !important;
	overflow: auto !important;
}
.vcontrol[data-utalic-class="VCalendar"] .fc-scrollgrid-section-body .fc-scroller-harness .fc-daygrid-body.fc-daygrid-body-unbalanced.fc-daygrid-body-natural
{
	position: fixed;
	background-color: var(--content-background);
	margin-top: -2px;
}
.vcontrol[data-utalic-class="VCalendar"] .fc-scrollgrid-section-body .fc-scroller-harness .fc-timegrid-body
{
  margin-top: 35px;
}
.vcontrol[data-utalic-class="VCalendar"] .fc-today-button:disabled
{
	display: none;
}
.vcontrol[data-utalic-class="VCalendar"] .fc-button-primary
{
	border: none;
}
.vcontrol[data-utalic-class="VCalendar"] .fc .fc-button-primary:not(:disabled).fc-button-active:focus, 
.vcontrol[data-utalic-class="VCalendar"] .fc .fc-button-primary:not(:disabled):active:focus,
.vcontrol[data-utalic-class="VCalendar"] .fc .fc-button-primary:focus
{
	box-shadow: none;
}
.vcontrol[data-utalic-class="VCalendar"] .fc .fc-col-header-cell-cushion
{
	font-size: 12px;
	color: #858585;
}
.vcontrol[data-utalic-class="VCalendar"] .fc .fc-toolbar-title
{
	font-size: 1.25em;
	font-weight: inherit;
}
.vcontrol[data-utalic-class="VCalendar"] .fc .fc-timegrid-slot-label,
.vcontrol[data-utalic-class="VCalendar"] .fc .fc-timegrid-axis-cushion
{
  color: #b8b8bb;
  font-size: 12px;
}
.VOwnerControlInnerPanel
{
	position: relative;
	width: 100%;
	height: 100%;
	display: flow-root;
}
.VTagsLabel
{
	overflow: hidden !important;
}
.VTagsLabelTag
{
	padding: 5px 10px;
	margin-right: 5px;
	margin-bottom: 2px;
	display: inline-block;
}
.vcontrol[data-utalic-class="VTagsEdit"],
.vcontrol[data-utalic-class="VMailRecipientsEdit"]
{
	overflow: auto;
	border-radius: 4px;
	padding: 2px;
	cursor: text !important;
}
.VTagsEditTag,
.VMailRecipientsEditTag
{
	border: none;
	outline: none !important;
	padding: 5px 10px;
	display: inline-block;
	margin-bottom: 4px;
	position: relative;
}
.VTagsEditSelector
{
  display: inline-block;
  height: 22px;
  width: 20px;
  content: 'AA';
  background-color: var(--app-primary-color);
  color: var(--app-primary-foreground);
  cursor: pointer;
  vertical-align: middle;
  border-radius: 8px;
  border: 1px solid var(--main-input-border-color);
  text-align: center;
  line-height: 22px !important;
  font-size: 13px;
}
.VMailRecipientsEditAutoComplete,
.VMailRecipientsEditIndicatorSelector
{
	position: fixed;
	min-height: 40px;
	min-width: 100px;
	background-color: var(--content-background);
	border-radius: 4px;
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.55);
	border: 1px solid var(--main-border-color);
	padding: 10px;
}
.VMailRecipientsEditIndicatorSelector .indicator-type
{
	cursor: pointer;
	padding: 3px;
	font-size: 13px;
	border-radius: 4px;
	margin-bottom: 2px;
}
.VMailRecipientsEditIndicatorSelector .indicator-type:hover
{
	background-color: var(--app-primary-color) !important;
  color: var(--app-primary-foreground) !important;
}
.VMailRecipientsEditEmptyTagWrapper
{
	display: inline-block;
}
.VMailRecipientsEditEmptyTagMagnify
{
	cursor: pointer;
	display: none;
} 
.VMailRecipientsEditEmptyTagMagnify:hover
{
	color: var(--app-primary-color);
}
.VMailRecipientsEditEmptyTagWrapper.focussed .VMailRecipientsEditEmptyTagMagnify
{
	display: inline-block;
}
.VMailRecipientsEditTagIndicator
{
	font-size: 12px;
	margin-right: 5px;
	padding: 1px 3px;
	border-radius: 3px;
	background-color: var(--app-primary-color);
	color: var(--app-primary-foreground);
	cursor: pointer;
}
.VTagsEditTag .remover,
.VMailRecipientsEditTag .remover
{
	position: absolute;
	cursor: pointer;
	display: none;
	right: 0;
	top: 5px;
	height: 20px;
	width: 25px;
	line-height: 20px;
	text-align: center;
	font-size: 18px;
	color: inherit;
	border-radius: 50%;
	background-color: inherit;
}
.VTagsEditTag:hover .remover,
.VMailRecipientsEditTag:hover .remover
{
	display: block;
}
.VTagsEditTag input,
.VMailRecipientsEditTag input
{
	border: none;
	outline: none !important;
	padding: 0;
	margin: 0;
	display: inline-block;
	background: transparent;
}
.VTagsEditEmptyTag,
.VMailRecipientsEditEmptyTag
{
	border: none;
	outline: none !important;
	padding: 0;
	display: inline-block;
	margin-left: 2px;
	margin-right: 2px;
	height: 25px;
	background-color: transparent;
}
.VDataSetPanelSelectCheck,
.VDataSetPanelSelectRadio,
.VDataSetPanelActionIcon
{
  position: absolute;
  width: 30px;
  height: 30px;
  top: calc(50% - 10px);
  left: 5px;
  cursor: pointer;
  font-size: 22px;
  text-align: center;
}
.vcontrol[data-utalic-class="VCalendar"] .fc-theme-standard td,
.vcontrol[data-utalic-class="VCalendar"] .fc-theme-standard th
{
  border: 1px dashed var(--main-border-color);
}
.fc .fc-daygrid-day.fc-day-today,
.fc .fc-timegrid-col.fc-day-today
{
	background-color: var(--boxed-background) !important;
}
.fc-theme-standard .fc-scrollgrid
{
	border: none !important;
}
.vcontrol[data-utalic-class="VStarRating"]
{
	white-space: nowrap;
}
.vcontrol[data-utalic-class="VBarCode"] svg
{
	height: 100% !important;
	transform-origin: left top;
}
.vcontrol[data-utalic-class="VDonutChart"] canvas,
.vcontrol[data-utalic-class="VPieChart"] canvas,
.vcontrol[data-utalic-class="VLineChart"] canvas,
.vcontrol[data-utalic-class="VBarChart"] canvas,
.vcontrol[data-utalic-class="VHorizontalBarChart"] canvas
{
	margin: auto;
}
.vcontrol[data-utalic-class="VOnOffSwitch"]
{
	transition: background-color 0.5s ease;
}
.vcontrol[data-utalic-class="VOnOffSwitch"] .handle
{
	position: absolute;
  border-radius: 50%;
  transition: left 1.5s ease;
  margin: 5px;
  left: 0;
}
.vcontrol[data-utalic-class="VComboBox"],
.vcontrol[data-utalic-class="VLookupComboBox"],
.vcontrol[data-utalic-class="VListBox"]
{
	background-color: var(--main-input-background-color);
}

.utalic-stage.color-scheme-dark .vcontrol[data-utalic-class="VComboBox"] select,
.utalic-stage.color-scheme-dark .vcontrol[data-utalic-class="VLookupComboBox"] select,
.utalic-stage.color-scheme-dark .vcontrol[data-utalic-class="VListBox"] select
{
	color: #7a7a7a;
}
.vcontrol[data-utalic-class="VComboBox"] select,
.vcontrol[data-utalic-class="VLookupComboBox"] select,
.vcontrol[data-utalic-class="VListBox"] select
{
	width: 100%;
	height: 100%;
	border: none;
	background-color: transparent;
	color: inherit;
	outline: none !important;
	font: inherit;
	text-align: inherit;
	box-sizing: border-box;
	margin-left: 0;
	text-overflow: ellipsis;
	padding: inherit;
	padding-left: 3px;
}
.vcontrol[data-utalic-class="VListBox"] select
{
	background-image: none;
	overflow: auto;
	min-height: 25px;
}
.vcontrol[data-utalic-class="VDrawingPadPopup"]
{
	width: 150px;
	height: 230px;
	z-index: 9999;
}
.vcontrol[data-utalic-class="VFlowEditor"]
{
	overflow: hidden;
}
.vcontrol[data-utalic-class="VFlowEditor"] .dragpanel
{
	position: absolute;
	display: block;
	width: 100px;
	height: 100px;
	background-color: var(--app-primary-color);
	opacity: 0.1;
	pointer-events: none;
}
.vcontrol[data-utalic-class="VFlowEditor"] .tool-area
{
	position: absolute;
  right: 0;
  top: 0;
  width: 250px;
  bottom: 0;
  padding: 10px;
  border-left: 1px solid var(--main-border-color);
  background-color: var(--boxed-background);
  font-size: var(--content-font-size);
  overflow: auto;
  box-sizing: border-box;
  background: linear-gradient(0deg, var(--boxed-background) 5%, var(--content-background) 100%) !important
}
.vcontrol[data-utalic-class="VFlowEditor"] .tool-category
{
	background-color: var(--main-input-background-color);
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	width: 100%;
	margin-bottom: 20px;
	box-sizing: border-box;
	box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.16);
	overflow: hidden;
}
.vcontrol[data-utalic-class="VFlowEditor"] .tool-area .tool-heading
{
	background-color: var(--app-primary-color);
	color: var(--app-primary-foreground);
	padding: 5px 10px;
	white-space: nowrap;
	padding: 5px 10px;
  box-sizing: border-box;
  line-height: 25px;
}
.vcontrol[data-utalic-class="VFlowEditor"] .tool-area .tool
{
	padding: 10px;
	cursor: pointer;
	border: 2px solid var(--main-border-color);
	width: 66px;
	height: 60px;
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 85%;
	text-align: center;
	border-radius: 4px;
	margin: 4px 9px;
	position: relative;
}
.vcontrol[data-utalic-class="VFlowEditor"] .tool-area .tool.active
{
	background-color: var(--app-secondary-color);
	color: var(--app-secondary-foreground);
}
.vcontrol[data-utalic-class="VFlowEditor"] .tool-area .tool:hover
{
	background-color: var(--app-secondary-color);
	color: var(--app-secondary-foreground);
}
.vcontrol[data-utalic-class="VFlowEditor"] .tool-area .tool .icon
{
	text-align: center;
  font-size: 16px;
}
.vcontrol[data-utalic-class="VFlowEditor"] .tool-area .tool .caption
{
	display: block;
	top: 50%;
	height: 50%;
	position: absolute;
	left: 5px;
	right: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.vcontrol[data-utalic-class="VFlowEditor"] .drawing-area
{
	position: absolute;
	left: 0;
	top: 0;
	right: 250px;
	bottom: 0;
	overflow: hidden;
	background-color: var(--boxed-background);
	background-image: radial-gradient(var(--raster-color) 1px, transparent 1px);
  background-size: 20px 20px;
}
.vcontrol[data-utalic-class="VFlowEditor"] .flowpanel
{
	position: absolute;
	left: 0;
	top: 0;
	right: 8px;
	bottom: 8px;
	overflow: visible;
}
.vcontrol[data-utalic-class="VPopupMenu"]
{
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.55);
	border: 1px solid var(--main-border-color);
	z-index: 9999;
	overflow: hidden;
	background: white !important;
}
.vcontrol[data-utalic-class="VPopupMenu"] .popup-icon
{
	margin-right: 10px;
	width: 10px;
}
.vcontrol[data-utalic-class="VScenePopup"] .navigation-bar, 
.vcontrol[data-utalic-class="VSceneBeamer"] .navigation-bar,
.VFullscreenDialog[data-utalic-class="VSceneDialog"] .navigation-bar
{
	position: absolute;
	top: 0;
	right: 0;
	height: 50px;
	left: 0;
	box-sizing: border-box;
	border-bottom: 1px solid var(--main-border-color);
	background-color: var(--headbar-background);
	display: none;
	text-align: right;
}
body .vcontrol[data-utalic-class="VScenePopup"] .navigation-bar .closer
{
	position: absolute;
	top: 0;
	right: 0;
	height: 50px;
	width: 50px;
	font-size: 22px;
	line-height: 50px;
	text-align: center;
	cursor: pointer;
	display: none;
}
body .VFullscreenDialog[data-utalic-class="VSceneDialog"] .navigation-bar .closer,
body .vcontrol[data-utalic-class="VSceneBeamer"] .navigation-bar .closer
{
  position: absolute;
  top: 0;
  left: 0;
  height: 40px;
  width: 50px;
  font-size: 22px;
  line-height: 40px;
  text-align: left;
  cursor: pointer;
  display: none;
  font-size: 19px;
  padding: 1px 10px;
}
.utalic-stage.device-mode-mobile .vcontrol[data-utalic-class="VScenePopup"] > .navigation-bar .closer
{
	display: block;
}
.VFullscreenDialog[data-utalic-class="VSceneDialog"] > .navigation-bar,
.VFullscreenDialog[data-utalic-class="VSceneDialog"] > .navigation-bar .closer
{
	display: block !important;
}
.device-mode-tablet .vcontrol[data-utalic-class="VScenePopup"] > .close,
.device-mode-desktop .vcontrol[data-utalic-class="VScenePopup"] > .close
{
  position: absolute;
  width: 26px;
  height: 26px;
  top: -8px;
  right: -8px;
  background-color: white;
  color: black;
  font-size: 14px;
  line-height: 26px;
  text-align: center;
  cursor: pointer;
  border-radius: 50%;
  z-index: 9;
}
.device-mode-mobile .vcontrol[data-utalic-class="VScenePopup"]
{
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 100% !important;
}
.vcontrol[data-utalic-class="VScenePopup"] .ut-se-resizer
{
	z-index: 90;
  height: 15px;
  font-size: 17px;
  overflow: hidden;
  transform: rotate(45deg);
  bottom: 4px;
  right: 4px;
  position: absolute;
  width: 15px;
  text-align: right;
}
.device-mode-mobile .vcontrol[data-utalic-class="VScenePopup"] > .navigation-bar,
.device-mode-mobile .vcontrol[data-utalic-class="VScenePopup"] > .navigation-bar .close,
.vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .navigation-bar,
.device-mode-mobile .vcontrol[data-utalic-class="VSceneBeamer"] > .navigation-bar,
.device-mode-mobile .vcontrol[data-utalic-class="VSceneBeamer"] > .navigation-bar .close,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .navigation-bar
{
	display: block;
}
.device-mode-mobile .vcontrol[data-utalic-class="VScenePopup"] > .navigation-bar,
.device-mode-mobile .vcontrol[data-utalic-class="VScenePopup"] > .navigation-bar .close,
.device-mode-mobile .vcontrol[data-utalic-class="VSceneBeamer"] > .navigation-bar,
.device-mode-mobile .vcontrol[data-utalic-class="VSceneBeamer"] > .navigation-bar .close
{
  background-color: var(--appbar-background);
  color: white;
}
.device-mode-mobile .mobile-full-width
{
	max-width: 100% !important;
	width: 100% !important;
}
/*.device-mode-mobile .vcontrol[data-utalic-class="VScenePopup"] > .app-scene,
.device-mode-mobile .vcontrol[data-utalic-class="VSceneBeamer"] > .app-scene,*/
.vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .app-scene,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .app-scene
{
	top: 50px !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	width: auto !important;
	height: auto !important;
}
.utalic-stage:not(.device-mode-mobile) .vcontrol[data-utalic-class="VScenePopup"]
{
	border-radius: 8px;
}
.vcontrol[data-utalic-class="VScenePopup"],
.vcontrol[data-utalic-class="VCalendarPopup"]
{
	box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.75);
	z-index: 999;
}
.vcontrol[data-utalic-class="VScenePopup"] > .vcontrol
{
	border-radius: 8px;
}
.vcontrol[data-utalic-class="VCalendarPopup"]
{
	background-color: white;
}
.vcontrol[data-utalic-class="VCalendarPopup"] .option
{
	position: relative;
	height: 30px;
}
.vcontrol[data-utalic-class="VCalendarPopup"] .option:hover
{
	background-color: var(--app-primary-color);
	color: var(--app-primary-foreground);
}
.vcontrol[data-utalic-class="VCalendarPopup"] .option .color
{
	display: block;
	position: absolute;
	left: 9px;
	top: 5px;
	bottom: 5px;
	width: 20px;
	border-radius: 4px;
}
.vcontrol[data-utalic-class="VCalendarPopup"] .option .caption
{
	position: absolute;
	left: 25px;
	top: 0;
	bottom: 0;
	width: 150px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding: 0 10px;
	line-height: 30px;
}
.VModalDialog
{
	position: fixed;
  top: 20%;
  left: calc(50% - 150px);
  background-color: var(--content-background);
  color: var(--content-foreground);
  font-size: var(--content-font-size);
  padding: 20px;
  width: 300px;
  border-radius: 10px;
  max-height: 70%;
  overflow: hidden;
  font-family: var(--primary-font);
  padding-bottom: 60px;
	box-sizing: border-box;
	z-index: 9999;
}
.VModalDialog .buttons
{
	position: absolute;
	left: 0;
	right: 20px;
	box-sizing: border-box;
	bottom: 0;
	height: 45px;
	text-align: right;
	white-space: nowrap;
}
.VModalDialog .buttons .button
{
	display: inline-block;
	margin-left: 10px;
	box-sizing: border-box;
	padding: 7px 20px;
	vertical-align: top;
	height: 30px;
	border-radius: 8px;
	cursor: pointer;
	border: 1px solid var(--content-background);
	opacity: 0.9;
}
.VModalDialog .buttons .button.ok
{
	background-color: var(--app-primary-color);
	color: var(--app-primary-foreground);
}
.VModalDialog .buttons .button.cancel
{
	background-color: var(--app-cancelling-color);
	color: var(--app-cancelling-foreground);
}
.VModalDialog .buttons .button.ok:focus
{
	border-color: var(--app-primary-color);
}
.VModalDialog .buttons .button.cancel:focus
{
	border-color: var(--app-cancelling-color);
}
.VDialogGrayout
{
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background-color: #00000099;
	z-index: 999;
}
.VInputDialog input
{
	display: block;
	width: 100%;
	outline: none;
	margin-top: 10px;
	box-sizing: border-box;
	padding: 5px 10px;
}
.VFullscreenDialog
{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 99;
}
.VSceneDocumentation
{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	border-bottom: 1px solid var(--input-border-color);
	min-height: 30px;
	box-sizing: border-box;
}
.VSceneDocumentation .button-close
{
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
	width: 30px;
	height: 30px;
	font-size: 20px;
	line-height: 30px;
	text-align: center;
	color: var(--primary-font-color):
}
.VSceneDocumentation .button-close:hover
{
	color: var(--app-primary-color);
}
.VSceneDocumentation .documentation-text
{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: auto;
	padding: 10px;
	margin-right: 30px;
	max-height: 50%;
}
.VSceneDocumentation.autoheight .documentation-text
{
	position: static;
}
.VToastNotification
{
	position: fixed;
	z-index: 9999;
	background-color: var(--boxed-background);
	color: var(--content-foreground);
	border-radius: 10px;
	box-shadow: 0 0 5px -1px rgba(0,0,0,0.1);
	min-height: 80px;
	font-size: 90%;
	width: 0;
	overflow-x: hidden;
	transition: width 0.4s;
	box-sizing: border-box;
	max-width: 100%;
}
.VToastNotification.visible
{
	padding: 10px 40px 10px 50px;
	width: 400px;
}
.VToastNotification .icon
{
	position: absolute;
	left: 5px;
	top: 5px;
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 25px;
	text-align: center;
}
.VToastNotification .closer
{
	position: absolute;
	top: 5px;
	right: 5px;
	width: 25px;
	height: 25px;
	text-align: center;
	font-size: 22px;
	line-height: 25px;
	cursor: pointer;
}
.VToastNotification .title
{
	font-weight: bold;
	white-space: nowrap;
	margin-bottom: 5px;
}
.VToastNotification .description
{
  width: 310px;
  white-space: normal;
  font-size: 85%;
  max-width: 100vW;
  display: inline-block;
}
@keyframes delay-animation
{
	from
	{
		transform: rotate(0deg);
	}
	to
	{
		transform: rotate(360deg);
	}
}
.delayed-progress
{
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background-color: #000000dd;
	z-index: 99999
}
.delayed-progress .delay-icon
{
	width: 40px;
	height: 40px;
	position: absolute;
	left: calc(50% - 20px);
	top: calc(50% - 20px);
	color: var(--app-primary-color);
	font-size: 30px;
	transform-origin: center;
	animation: delay-animation 2s linear infinite;
	line-height: 40px;
	text-align: center;
}
.FDataSetPanelInitialWaiter
{
	height: 80px;
	padding-top: 10px;
	position: relative;
}
.FDataSetPanelInitialWaiter span
{
	width: 40px;
	height: 40px;
	display: inline-block;
	position: absolute;
	left: calc(50% - 20px);
	top: calc(50% - 20px);
	text-align: center;
	color: var(--app-primary-color);
	font-size: 40px;
	transform-origin: center;
	animation: delay-animation 2s linear infinite;
	line-height: 40px;
	text-align: center;
}
.vcontrol[data-utalic-class="VKanban"]
{
	white-space: nowrap;
	overflow-x: auto;
	overflow-y: hidden;
}
.device-mode-mobile .vcontrol[data-utalic-class="VKanban"]:not(.table) .column
{
	transition: width 0.5s, height 0.5s;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table)
{
	white-space: normal !important;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .add-column
{
	display: none;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .column
{
	width: calc(50% - 15px);
	height: 200px;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .column .cardarea
{
	top: 45px;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .column .new-button
{
	display: none !important;
}
.vcontrol.table[data-utalic-class="VKanban"]
{
	overflow-y: auto;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .column .utalic-kanban-card
{
	width: 100%;
	height: 50px;
	overflow: hidden;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .column .utalic-kanban-card .text
{
	max-height: 35px;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 10px !important;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .column .utalic-kanban-card .textwrapper
{
	margin-left: 0;
}
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .column .utalic-kanban-card .card-menu,
.device-mode-mobile .vcontrol.dragging[data-utalic-class="VKanban"]:not(.table) .column .utalic-kanban-card .add-element
{
	display: none;
}
.vcontrol[data-utalic-class="VKanban"] .column .new-button
{
	position: absolute;
	top: 50px;
	left: 10px;
	right: 10px;
	height: 40px;
	text-align: center;
	cursor: pointer;
	border-radius: 10px;
	line-height: 40px !important;
	background-color: var(--app-primary-color);
	color: var(--app-primary-foreground);
}
.vcontrol[data-utalic-class="VKanban"] .column .new-input input
{
	position: absolute;
	top: 50px;
	left: 8px;
	right: 50px;
	height: 30px;
	text-align: left;
	border-radius: 5px;
	border: none;
	outline: none !important;
	line-height: 30px !important;
	padding-left: 10px;
	background-color: var(--main-input-background-color);
	color: var(--main-input-font-color);
	box-sizing: border-box;
}
.vcontrol[data-utalic-class="VKanban"] .column .new-input .input-submit
{
	position: absolute;
	top: 50px;
	width: 30px;
	right: 10px;
	height: 30px;
	text-align: center;
	cursor: pointer;
	border-radius: 5px;
	line-height: 30px !important;
	background-color: var(--app-primary-color);
	color: var(--app-primary-foreground);
	box-sizing: border-box;
}
.vcontrol[data-utalic-class="VKanban"]:not(.table) .column .new-button i
{
	margin-right: 5px;
}
.vcontrol[data-utalic-class="VKanban"] .column .new-button:hover
{
	opacity: 0.9;
}
.vcontrol[data-utalic-class="VKanban"] .column .cardarea
{
	position: absolute;
	top: 60px;
	left: 5px;
	right: 5px;
	bottom: 5px;
	overflow: auto;
	white-space: normal;
}
.vcontrol[data-utalic-class="VKanban"] .column .cardarea.shifted
{
	top: 100px;
}
.vcontrol.table[data-utalic-class="VKanban"] .add-column
{
	margin-top: 10px;
	width: calc(100% - 20px);
	border: none;
	text-align: center;
	margin-right: 0;
	border-radius: 0 !important;
}
.vcontrol[data-utalic-class="VKanban"] .add-column
{
	display: inline-block;
	vertical-align: top;
	width: 200px;
	top: 0;
	min-height: 35px;
	margin-right: 15px;
	border-radius: 10px;
	background-color: var(--main-input-background-color);
	overflow: hidden;
	border: 1px solid var(--main-border-color);
	position: relative;
	font-size: 90%;
	box-sizing: border-box;
	padding-bottom: 5px;
	color: var(--main-input-font-color);
}
.vcontrol[data-utalic-class="VKanban"] .add-column:not(.focus)
{
	opacity: 0.7;
	cursor: pointer;
}
.vcontrol[data-utalic-class="VKanban"] .add-column:hover
{
	opacity: 1;
}
.vcontrol[data-utalic-class="VKanban"] .add-column .actions
{
	display: none;
}
.vcontrol[data-utalic-class="VKanban"] .add-column .new-column-editor
{
	display: none;
	margin-left: 40px;
	margin-top: 2px;
	height: 30px;
	width: calc(100% - 44px);
	outline: none !important;
	box-sizing: border-box;
}
.vcontrol.table[data-utalic-class="VKanban"] .add-column .new-column-editor
{
	margin: 0 !important;
	width: 100%;
}
.vcontrol[data-utalic-class="VKanban"] .add-column .actions
{
	margin-top: 10px;
	padding-left: 40px;
}
.vcontrol[data-utalic-class="VKanban"] .add-column .icon
{
	position: absolute;
	left: 0;
	top: 3px;
	width: 35px;
	height: 32px;
	line-height: 30px;
	font-size: 15px;
	text-align: center;
}
.vcontrol[data-utalic-class="VKanban"] .add-column .submit
{
	border-radius: 8px;
	color: var(--app-primary-foreground);
	background-color: var(--app-primary-color);
	text-align: center;
	padding: 5px 10px;
	cursor: pointer;
	display: inline-block;
	margin-right: 5px;
}

.vcontrol[data-utalic-class="VKanban"] .add-column .cancel
{
	border-radius: 8px;
	color: var(--app-cancelling-foreground);
	background-color: var(--app-cancelling-color);
	text-align: center;
	padding: 5px 10px;
	cursor: pointer;
	display: inline-block;
}
.vcontrol[data-utalic-class="VKanban"] .add-column .caption
{
	box-sizing: border-box;
	line-height: 30px;
	padding: 3px 0 0 40px;
	box-sizing: border-box;
	height: 30px;
}
.vcontrol.table[data-utalic-class="VKanban"] .add-column .caption
{
	padding-left: 0;
	vertical-align: top;
	display: inline-block;
	padding-top: 0;
}
.vcontrol.table[data-utalic-class="VKanban"] .add-column .icon
{
	vertical-align: top;
	display: inline-block;
	position: static;
}
.vcontrol.table[data-utalic-class="VKanban"] .add-column.focus .icon,
.vcontrol[data-utalic-class="VKanban"] .add-column.focus .caption
{
	display: none;
}
.vcontrol[data-utalic-class="VKanban"] .add-column.focus .new-column-editor,
.vcontrol[data-utalic-class="VKanban"] .add-column.focus .actions
{
	display: block;
}
.vcontrol[data-utalic-class="VKanban"] .column
{
	display: inline-block;
	vertical-align: top;
	width: 200px;
	top: 0;
	height: 100%;
	box-sizing: border-box;
	margin-right: 15px;
	border-radius: 10px;
	background-color: var(--boxed-background);
	position: relative;
	overflow: hidden;
	border: 1px solid var(--main-border-color);
	transition: transform 300ms;
}
.vcontrol[data-utalic-class="VKanban"] .column.virtual
{
	display: none;
}
.vcontrol.table[data-utalic-class="VKanban"] .utalic-kanban-card
{
	white-space: nowrap;
	background-color: transparent;
	margin: 0;
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
	border-bottom: 1px solid var(--main-border-color) !important;
	box-shadow: none;
}
.vcontrol.table[data-utalic-class="VKanban"] .utalic-kanban-card:hover,
.vcontrol.table[data-utalic-class="VKanban"] .utalic-kanban-card.active
{
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
	border-bottom: 1px solid var(--main-border-color) !important;
}
.vcontrol.table[data-utalic-class="VKanban"] .utalic-kanban-card .textwrapper
{
	display: inline-block;
	max-width: 50%;
	width: 200px;
	vertical-align: top;
	white-space: normal;
	margin-left: 30px;
}
.vcontrol.table[data-utalic-class="VKanban"] .utalic-kanban-card .add-element
{
	display: inline-block;
	width: 100px;
	vertical-align: top;
	white-space: normal;
}
.vcontrol.table[data-utalic-class="VKanban"] .column
{
	display: block;
	height: auto;
	min-height: 100px;
	padding-top: 35px;
	border-radius: 0 !important;
  width: fit-content;
  min-width: calc(100% - 10px);
}
.vcontrol.table[data-utalic-class="VKanban"] .column .cardarea
{
	position: static;
  min-height: 20px;
  display: block;
  width: fit-content;
}
.vcontrol.table[data-utalic-class="VKanban"] .column .new-button
{
	left: auto;
	top: 0;
	right: 30px;
	height: 35px;
	width: 30px;
	background-color: transparent !important;
	line-height: 35px !important;
	text-align: center !important;
}
.vcontrol.table[data-utalic-class="VKanban"] .column .new-button span
{
	display: none;
}
.vcontrol[data-utalic-class="VKanban"] .column > .icon
{
  position: absolute;
  left: 0;
  top: 0;
  height: 15px;
  width: 20px;
  text-align: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px;
  padding: 10px;
  color: white;
  font-size: 15px;
}
.vcontrol[data-utalic-class="VKanban"] .column .configurator
{
	position: absolute;
	right: 0;
	top: 0;
	height: 35px;
	width: 30px;
	line-height: 35px;
	cursor: pointer;
	text-align: center;
}
.vcontrol[data-utalic-class="VKanban"] .column .caption
{
	position: absolute;
	top: 0;
	right: 0;
	left: 40px;
	height: 35px;
	line-height: 35px;
	padding-right: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.vcontrol[data-utalic-class="VKanban"] .column .caption-editor
{
	display: none;
	position: absolute;
	top: 0;
	right: 35px;
	left: 0;
	height: 35px;
	line-height: 35px;
	overflow: hidden;
	text-overflow: ellipsis;
	box-sizing: border-box;
	background: transparent;
	border: none;
	outline: none !important;
	font-size: inherit;
	color: inherit;
	font-family: inherit;
}
.vcontrol[data-utalic-class="VKanban"] .column.edit-title .caption span
{
	display: none;
}
.vcontrol[data-utalic-class="VKanban"] .column.edit-title .caption-editor
{
	display: block;
}
.utalic-kanban-card
{
	background-color: var(--main-input-background-color);
	border-radius: 8px;
	box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.16);
	margin: 3px;
	font-size: 13px;
	position: relative;
	transition: transform 500ms;
	min-height: 35px;
	box-sizing: border-box;
	border: 2px solid transparent;
}
.utalic-kanban-card:hover,
.utalic-kanban-card.selected
{
	border-color: var(--card-hover-color);
}
.utalic-kanban-card .text
{
	padding: 10px 5px;
	margin-right: 30px;
}
.utalic-kanban-card .add-element
{
	padding: 0 5px;
	position: relative;
	margin-bottom: 5px;
}
.utalic-kanban-card .add-element.empty-value
{
	display: none;
}
.vcontrol.table[data-utalic-class="VKanban"].table .utalic-kanban-card .add-element.empty-value
{
	display: inline-block;
	opacity: 0;
}
.utalic-kanban-card .add-element.has-icon
{
	padding-left: 25px;
}
.utalic-kanban-card .add-element .content
{
	vertical-align: top;
	min-height: 25px;
	box-sizing: border-box;
	line-height: 25px;
	padding: 0 5px;
}
.utalic-kanban-card .add-element .icon
{
	position: absolute;
	left: 0;
	top: 0;
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align: center;
	font-size: 14px;
}
.utalic-kanban-card .card-menu
{
	position: absolute;
	right: 0;
	top: 0;
	height: 35px;
	width: 30px;
	line-height: 35px;
	cursor: pointer;
	text-align: center;
	display: none;
}
.table .utalic-kanban-card .card-menu,
.utalic-kanban-card:hover .card-menu,
.utalic-kanban-card.selected .card-menu,
.device-mode-mobile .utalic-kanban-card .card-menu,
.device-mode-tablet .utalic-kanban-card .card-menu
{
	display: block;
}
.table .utalic-kanban-card .card-menu
{
	right: auto;
	left: 0;
}

.vcontrol[data-utalic-class="VKanban"] .utalic-kanban-placeholder
{
	border-radius: 3px;
	padding: 10px 5px;
	background-color: #00000022;
}
.vcontrol[data-utalic-class="VKanban"] .column.ui-sortable-helper
{
	transform: rotate(2deg);
	box-shadow: 1px 1px 12px 4px rgba(0,0,0,0.1);
	opacity: 0.7 !important;
	overflow: hidden;
}
.device-mode-mobile .vcontrol[data-utalic-class="VKanban"] .utalic-kanban-placeholder
{
	max-height: 5px !important;
}
.device-mode-mobile .utalic-kanban-card.ui-sortable-helper
{
	transform: scale(0.4);
	transform-origin: center;
	opacity: 0.2;
}
.vcontrol[data-utalic-class="VKanban"]:not(.table) .utalic-kanban-column-placeholder
{
	display: inline-block;
	vertical-align: top;
	width: 200px;
	top: 0;
	height: 100%;
	box-sizing: border-box;
	margin-right: 15px;
	border-radius: 10px;
	background-color: #00000022;
	position: relative;
	overflow: hidden;
	border: 1px solid var(--main-border-color);
}
.utalic-kanban-card.ui-sortable-helper
{
	transform: rotate(5deg);
	box-shadow: 1px 1px 12px 4px rgba(0,0,0,0.1);
	opacity: 0.8 !important;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .tabbar
{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 60px;
	box-sizing: border-box;
	border-right: 1px solid var(--appbar-border-color);
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar
{
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	box-sizing: border-box;
}
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] > .sidebar
{
	width: 40px !important;
	overflow: hidden !important;
	transition: width 0.2s ease;
}
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].open-menu > .sidebar,
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].auto-menu > .sidebar
{
	width: 220px !important;
	position: fixed;
	z-index: 9;
	box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.31);
	background-color: rgb(0 0 0 / 91%) !important;
  backdrop-filter: blur(7px);
}
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] > .sidebar > .menuicon
{
	position: absolute;
	top: 10px;
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 20px;
	text-align: center;
	padding-left: 2px;
	cursor: pointer;
}
.utalic-stage.device-mode-tablet .vcontrol.open-menu[data-utalic-class="VSideBar"] > .sidebar > .menuicon
{
	color: var(--app-primary-color);
}
.utalic-stage:not(.device-mode-tablet) .vcontrol[data-utalic-class="VSideBar"] > .sidebar > .menuicon
{
	display: none !important;
}
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar-item
{
	margin-left: 4px;
}
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"]:not(.open-menu):not(.auto-menu) .sidebar-item
{
  width: 20px !important;
  padding: 17px;
}
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] > .contentarea
{
	left: 45px !important;
}
.utalic-stage:not(.device-mode-mobile) .vcontrol[data-utalic-class="VSideBar"]:not(.boxed) .sidebar
{
	border-right: 1px solid var(--appbar-border-color);
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar .logo
{
	position: absolute;
	top: 30px;
	left: 30px;
	right: 30px;
	height: 40px;
	overflow: auto;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: contain;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar .items
{
	position: absolute;
	top: 20px;
	left: 0;
	right: 0;
	bottom: 10px;
	overflow: auto;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar .items::-webkit-scrollbar,
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"].has-logo > .tabbar > .items::-webkit-scrollbar
{
	height: 2px;
	width: 5px;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"]:not(.open-menu):not(.auto-menu) .sidebar .items::-webkit-scrollbar
{
	width: 0;
}
/* Scrollbar-Track */
.vcontrol[data-utalic-class="VSideBar"] .sidebar .items::-webkit-scrollbar-track,
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"].has-logo > .tabbar > .items::-webkit-scrollbar-track {
    background: transparent; /* oder z.B. #eee */
    padding: 2px;
}

/* Scrollbar-Daumen */
.vcontrol[data-utalic-class="VSideBar"] .sidebar .items::-webkit-scrollbar-thumb,
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"].has-logo > .tabbar > .items::-webkit-scrollbar-thumb {
  background-color: #606060;   /* <-- Hier wird er rot */
  border-radius: 4px;
  margin: 0 2px 0 0;
  padding: 0 2px 0 0;
  border: none;
  border-right: 2px solid transparent;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar .items
{
	top: 60px;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"]:not(.open-menu):not(.auto-menu) .sidebar .items
{
	overflow-x: hidden !important;
}
.vcontrol[data-utalic-class="VSideBar"].has-logo .sidebar .items
{
	top: 100px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar .extra-items
{
	position: absolute;
	bottom: 10px;
	left: 0;
	right: 0;
	border-top: 1px solid var(--appbar-border-color);
	overflow: auto;
	padding-top: 10px;
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .has-extra-items .extra-items
{
	display: block;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar.has-user-panel .extra-items
{
	bottom: 70px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar.has-user-panel .items
{
	bottom: 70px;
}
.vcontrol[data-utalic-class="VSideBar"] .contentarea
{
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
}
.utalic-stage:not(.device-mode-mobile) .vcontrol[data-utalic-class="VSideBar"] .contentarea
{
	overflow: hidden;
}
.utalic-stage.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].boxed .contentarea
{
	position: absolute;
	right: 20px;
	top: 20px;
	bottom: 20px;
	border-radius: 10px;
}
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed .contentarea
{
	position: absolute;
	right: 20px;
	top: 20px;
	bottom: 0px;
	border-radius: 10px;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].boxed .contentarea
{
	transition: right 0.4s;
	transition: width 0.4s;
}
.vcontrol[data-utalic-class="VSideBar"] .contentarea.restricted-size
{
	right: auto;
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .contentarea.restricted-size
{
	width: 180px !important;
}
.vcontrol[data-utalic-class="VSideBar"] .contentarea.restricted-size .sidebar-detail-action-two,
.vcontrol[data-utalic-class="VSideBar"] .contentarea.restricted-size .sidebar-detail-action
{
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .additional-column
{
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
}
.utalic-stage:not(.device-mode-mobile) .vcontrol[data-utalic-class="VSideBar"].boxed .additional-column
{
	position: fixed;
	top: 20px;
	right: 20px;
	bottom: 20px;
	overflow: hidden;
	left: 100%;
}
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed .additional-column
{
	bottom: 80px;
	left: 45px !important;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}
.vcontrol[data-utalic-class="VSideBar"] .info-column-box,
.VFullscreenDialog[data-utalic-class="VSceneDialog"] .info-column-box
{
	display: none;
}
.VFullscreenDialog[data-utalic-class="VSceneDialog"] > .dialog-content-area
{
	position: absolute;
	top: 40px;
	left: 0;
	right: 0;
	bottom: 0;
}
.ql-font-arial {
  font-family: Arial, sans-serif;
}

.ql-font-courier {
  font-family: "Courier New", Courier, monospace;
}

.ql-font-verdana {
  font-family: Verdana, Geneva, sans-serif;
}

.ql-font-helvetica {
  font-family: Helvetica, Arial, sans-serif;
}

.ql-font-times-new-roman {
  font-family: "Times New Roman", Times, serif;
}

.ql-font-georgia {
  font-family: Georgia, serif;
}

.ql-font-tahoma {
  font-family: Tahoma, Geneva, sans-serif;
}

.ql-font-trebuchet-ms {
  font-family: "Trebuchet MS", sans-serif;
}

.ql-font-lucida-console {
  font-family: "Lucida Console", Monaco, monospace;
}

.ql-font-sans-serif {
  font-family: sans-serif;
}

.ql-font-serif {
  font-family: serif;
}

.ql-font-monospace {
  font-family: monospace;
}
.device-mode-tablet .VFullscreenDialog.info-column[data-utalic-class="VSceneDialog"].breakpoint-mobile > .dialog-content-area,
.device-mode-desktop .VFullscreenDialog.info-column[data-utalic-class="VSceneDialog"].breakpoint-tablet > .dialog-content-area,
.device-mode-desktop .VFullscreenDialog.info-column[data-utalic-class="VSceneDialog"].breakpoint-mobile > .dialog-content-area,
.device-mode-tablet .VFullscreenDialog.info-column[data-utalic-class="VSceneDialog"].breakpoint-mobile > .navigation-bar,
.device-mode-tablet .vcontrol.info-column[data-utalic-class="VSceneBeamer"].breakpoint-mobile > .navigation-bar,
.device-mode-desktop .VFullscreenDialog.info-column[data-utalic-class="VSceneDialog"].breakpoint-tablet > .navigation-bar,
.device-mode-desktop .vcontrol.info-column[data-utalic-class="VSceneBeamer"].breakpoint-tablet > .navigation-bar,
.device-mode-desktop .VFullscreenDialog.info-column[data-utalic-class="VSceneDialog"].breakpoint-mobile > .navigation-bar,
.device-mode-desktop .vcontrol.info-column[data-utalic-class="VSceneBeamer"].breakpoint-mobile > .navigation-bar
{
	right: var(--sidebarInfoWidth);
	padding-right: 10px;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-tablet .info-column-box,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-mobile .info-column-box,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-mobile .info-column-box,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.breakpoint-tablet .info-column-box,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.breakpoint-mobile .info-column-box,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.breakpoint-mobile .info-column-box
{
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 200px;
	background-color: var(--boxed-background);
	border-left: 1px solid var(--main-border-color);
	box-sizing: border-box;
	padding-top: 50px;
	display: block;
}
.utalic-stage.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].breakpoint-tablet .info-column-box .info-column-navigation,
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile .info-column-box .info-column-navigation,
.utalic-stage.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile .info-column-box .info-column-navigation,
.vcontrol[data-utalic-class="VSideBar"] .info-column-box .info-column-navigation,
.utalic-stage.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-tablet .info-column-box .info-column-navigation,
.utalic-stage.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile .info-column-box .info-column-navigation,
.utalic-stage.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile .info-column-box .info-column-navigation,
.VFullscreenDialog[data-utalic-class="VSceneDialog"] .info-column-box .info-column-navigation
{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 50px;
	border-bottom: 1px solid var(--main-border-color);
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].breakpoint-tablet .info-column-box .info-column-navigation,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile .info-column-box .info-column-navigation,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile .info-column-box .info-column-navigation,
.vcontrol[data-utalic-class="VSideBar"] .info-column-box .info-column-navigation .close,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-tablet .info-column-box .info-column-navigation,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile .info-column-box .info-column-navigation,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile .info-column-box .info-column-navigation,
.VFullscreenDialog[data-utalic-class="VSceneDialog"] .info-column-box .info-column-navigation .close
{
	display: none;
}
.utalic-stage:not(.device-mode-desktop) .vcontrol[data-utalic-class="VSideBar"].breakpoint-tablet .info-column-box .info-column-navigation .close,
.utalic-stage:not(.device-mode-desktop):not(.device-mode-tablet) .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile .info-column-box .info-column-navigation .close,
.utalic-stage:not(.device-mode-desktop) .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-tablet .info-column-box .info-column-navigation .close,
.utalic-stage:not(.device-mode-desktop):not(.device-mode-tablet) .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile .info-column-box .info-column-navigation .close
{
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	height: 50px;
	width: 50px;
	text-align: center;
	line-height: 50px;
	font-size: 22px;
	cursor: pointer;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].info-column.infocolumn-visible.breakpoint-tablet .info-column-box,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].info-column.infocolumn-visible.breakpoint-mobile .info-column-box,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.infocolumn-visible.breakpoint-tablet .info-column-box,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.infocolumn-visible.breakpoint-mobile .info-column-box
{
	padding-top: 50px;
	position: absolute;
	background-color: var(--boxed-background);
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	display: block;
	-webkit-box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.4); 
	box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.4);
	border-radius: 10px;
	min-width: 400px;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"].info-column.infocolumn-visible.breakpoint-mobile .info-column-box,
.device-mode-mobile .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.infocolumn-visible.breakpoint-mobile .info-column-box
{
	padding-top: 50px;
	position: absolute;
	background-color: var(--boxed-background);
	top: 0;
	right: 0;
	bottom: 0;
	width: 100% !important;
	z-index: 9999;
	display: block;
	-webkit-box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.4); 
	box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.4);
	border-radius: 0;
	min-width: 400px;
	position: fixed;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed.info-column.infocolumn-visible .sidebar-grayout
{
	position: absolute;
	left: 45px;
	top: 20px;
	right: 8px;
	bottom: 0px;
	background-color: #000000ad;
	z-index: 999;
	border-radius: 10px;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed.info-column.infocolumn-visible.breakpoint-tablet .info-column-box,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed.info-column.infocolumn-visible.breakpoint-mobile .info-column-box,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].boxed.info-column.infocolumn-visible.breakpoint-tablet .info-column-box,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].boxed.info-column.infocolumn-visible.breakpoint-mobile .info-column-box
{
	right: 10px;
	top: 20px;
	bottom: 20px;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"].info-column.infocolumn-visible.breakpoint-tablet .info-column-box,
.device-mode-mobile .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.infocolumn-visible.breakpoint-tablet .info-column-box
{
	padding-top: 50px;
	position: fixed;
	background-color: var(--boxed-background);
	top: 0;
	left: 0;
	width: auto !important;
	right: 0;
	bottom: 0;
	border-radius: none !important;
	z-index: 99;
	display: block;
	height: 100% !important;
	box-sizing: border-box;
}

body .vcontrol[data-utalic-class="VSideBar"].info-column .info-column-box > .vcontrol,
body .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column .info-column-box > .vcontrol
{
	position: absolute !important;
	top: 51px !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 100% !important;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed.info-column.infocolumn-visible.breakpoint-tablet .info-column-box > .vcontrol,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed.info-column.infocolumn-visible.breakpoint-mobile .info-column-box > .vcontrol,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].boxed.info-column.infocolumn-visible.breakpoint-tablet .info-column-box > .vcontrol,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].boxed.info-column.infocolumn-visible.breakpoint-mobile .info-column-box > .vcontrol
{
	height: calc(100% - 35px) !important;
}

.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].breakpoint-tablet.info-column .info-column-box > .vcontrol,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile.info-column .info-column-box > .vcontrol,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile.info-column .info-column-box > .vcontrol,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-tablet.info-column .info-column-box > .vcontrol,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile.info-column .info-column-box > .vcontrol,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile.info-column .info-column-box > .vcontrol
{
	top: 0 !important;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].breakpoint-tablet.info-column.boxed .info-column-box > .vcontrol,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile.info-column.boxed .info-column-box > .vcontrol,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].breakpoint-mobile.info-column.boxed .info-column-box > .vcontrol,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-tablet.info-column.boxed .info-column-box > .vcontrol,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile.info-column.boxed .info-column-box > .vcontrol,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].breakpoint-mobile.info-column.boxed .info-column-box > .vcontrol
{
	border-top-right-radius: 10px;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].info-column.boxed.breakpoint-tablet .info-column-box,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].info-column.boxed.breakpoint-mobile .info-column-box,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.boxed.breakpoint-tablet .info-column-box,
.device-mode-desktop .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.boxed.breakpoint-mobile .info-column-box
{
	top: 20px;
	bottom: 20px;
	right: 20px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].info-column.boxed.breakpoint-mobile .info-column-box,
.device-mode-tablet .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.boxed.breakpoint-mobile .info-column-box
{
	top: 20px;
	bottom: 20px;
	right: 20px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
.vcontrol[data-utalic-class="VSideBar"] .info-column-button,
.VFullscreenDialog[data-utalic-class="VSceneDialog"] .info-column-button
{
	display: none;
}
.utalic-stage:not(.device-mode-desktop) .vcontrol[data-utalic-class="VSideBar"].info-column .info-column-button,
.utalic-stage:not(.device-mode-desktop) .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column .info-column-button
{
	right: 0;
	top: 0;
	height: 50px;
	width: 50px;
	font-size: 20px;
	cursor: pointer;
	text-align: center;
	line-height: 50px;
}
.utalic-stage:not(.device-mode-desktop) .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-tablet .additional-column .info-column-button,
.utalic-stage:not(.device-mode-desktop) .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-tablet .contentarea:not(.restricted-size) .info-column-button,
.utalic-stage:not(.device-mode-desktop):not(.device-mode-tablet) .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-mobile .additional-column .info-column-button,
.utalic-stage:not(.device-mode-desktop):not(.device-mode-tablet) .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-mobile .contentarea:not(.restricted-size) .info-column-button,
.utalic-stage:not(.device-mode-desktop) .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.breakpoint-tablet .info-column-button,
.utalic-stage:not(.device-mode-desktop):not(.device-mode-tablet) .VFullscreenDialog[data-utalic-class="VSceneDialog"].info-column.breakpoint-mobile .info-column-button
{
	display: inline-block;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].boxed:not(.info-column) .additional-column,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].boxed.breakpoint-mobile:not(.info-column) .additional-column,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed.breakpoint-mobile:not(.info-column) .additional-column,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed:not(.breakpoint-mobile) .additional-column,
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"].boxed .additional-column
{
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].boxed.info-column.breakpoint-tablet .contentarea,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"].boxed.info-column.breakpoint-mobile .contentarea,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"].boxed.info-column.breakpoint-mobile .contentarea
{
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item
{
	position: relative !important;
  padding-left: 45px;
  cursor: pointer;
  margin-left: 20px;
  margin-right: 10px;
  margin-bottom: 4px;
  border-radius: 6px;
  min-height: 0;
	transition: min-height 200ms;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.heading
{
	border-radius: 0;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.heading:not(:first-of-type)
{
	margin-top: 20px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.heading .caption
{
	opacity: 0.5;
	font-size: 95%;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item:not(.subitem),
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.subitem.sub-expanded
{
  min-height: 34px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.subitem
{
	height: 0;
	overflow: hidden;
	border: none !important;
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.subitem.no-category
{
	left: 10px;
	width: calc(100% - 40px);
	box-sizing: border-box;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.subitem.sub-expanded
{
	display: block;
	height: auto;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item
{
	opacity: 0.7;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item.active
{
	opacity: 1;
}
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .items,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .items
{
	bottom: 0 !important;
}
.vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .items
{
	white-space: nowrap;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	overflow: auto;
}
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open
{
	display: none;
}
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open
{
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	color: inherit;
	font-size: 30px;
	text-align: center;
	line-height: 80px;
}
.device-mode-mobile .vcontrol.has-logo[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open,
.device-mode-tablet .vcontrol.has-logo[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open,
.device-mode-mobile .vcontrol.has-logo2[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open,
.device-mode-tablet .vcontrol.has-logo2[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open
{
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	height: 60px;
	overflow: hidden;
	color: inherit;
	font-size: 30px;
	text-align: center;
	line-height: 80px;
	cursor: pointer;
}
.device-mode-tablet .vcontrol.has-logo[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open,
.device-mode-tablet .vcontrol.has-logo2[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-open
{
	right: var(--tabbar-item-width);
}
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .items
{
	top: 20px;
}
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"].has-logo > .tabbar > .items
{
	top: 80px;
}
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-items,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-items
{
	display: none;
	opacity: 0;
	position: fixed;
	z-index: 9;
	right: 0;
	width: 100px;
	bottom: 80px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	background-color: var(--appbar-background);
	box-sizing: border-box;
	border: 1px solid var(--appbar-border-color);
}
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"].show-extra-items > .tabbar > .extra-items,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"].show-extra-items > .tabbar > .extra-items
{
	display: block;
	opacity: 1;
}
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-items .tabbar-item,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-items .tabbar-item
{
	width: 100% !important;
}
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-items
{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	border-top: 1px solid var(--appbar-border-color);
	width: 100% !important;
}
.vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .logopanel > .logo
{
  position: absolute;
  top: 15px;
  left: 5px;
  right: 5px;
  height: 30px;
  overflow: auto;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
  display: none;
}
.vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .logopanel > .logo2
{
  position: absolute;
  top: 35px;
  left: 10px;
  right: 5px;
  height: 40px;
  overflow: auto;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: contain;
  display: none;
}
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .logopanel
{
	position: absolute;
	right: 0;
	bottom: 0;
	height: 60px;
	display: block;
	width: var(--tabbar-item-width);
	overflow: hidden;
}
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"].has-logo > .tabbar > .logopanel > .logo,
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"].has-logo2 > .tabbar > .logopanel > .logo2,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"].has-logo > .tabbar > .logopanel > .logo,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"].has-logo2 > .tabbar > .logopanel > .logo2
{
	display: block;
}
.device-mode-tablet .vcontrol.has-logo[data-utalic-class="VTabBarMenu"] > .tabbar > .items,
.device-mode-tablet .vcontrol.has-logo2[data-utalic-class="VTabBarMenu"] > .tabbar > .items
{
	right: var(--tabbar-item-width);
}

.vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .items .tabbar-item
{
	position: relative !important;
  height: 60px;
  box-sizing: border-box;
  text-align: center;
  padding-top: 5px;
  font-size: 10px;
  white-space: normal;
  cursor: pointer;
}
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .items .tabbar-item,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .items .tabbar-item
{
  font-size: 10px;
}
.vcontrol[data-utalic-class="VTabBarMenu"] > .tabbar > .extra-items .tabbar-item
{
	position: relative !important;
  box-sizing: border-box;
  text-align: center;
  padding-top: 14px;
  font-size: 10px;
  white-space: normal;
  cursor: pointer;
}
.VPopupGrayout
{
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 999;
}
.VPopupGrayout:not(.transparent-grayout)
{
	background-color: #00000044;
}
.VPopupGrayout.transparent-grayout
{
	background-color: transparent;
}
.device-mode-desktop .VPopupGrayout,
.device-mode-tablet .VPopupGrayout
{
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
}
.device-mode-desktop .VPopupGrayout:not(.transparent-grayout),
.device-mode-tablet .VPopupGrayout:not(.transparent-grayout)
{
	background-color: #000000a6;
}
.device-mode-desktop .VPopupGrayout.transparent-grayout,
.device-mode-tablet .VPopupGrayout.transparent-grayout
{
	background-color: transparent;
}
.device-mode-desktop .VPopupMenuCanceler,
.device-mode-tablet .VPopupMenuCanceler
{
	display: none;
	z-index: 999;
}
.device-mode-mobile .VPopupMenuCanceler
{
	z-index: 999;
	display: block;
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 15px;
	border-radius: 16px;
	overflow: hidden;
  background-color: var(--app-cancelling-color) !important;
  font-size: 15px !important;
  text-align: center !important;
  color: var(--app-cancelling-foreground) !important;
  padding: 10px 5px;
  font-weight: bold;
  cursor: pointer;
}
.device-mode-mobile .vcontrol[data-utalic-class="VPopupMenu"]
{
	bottom: 65px !important;
  left: 10px !important;
  right: 10px !important;
  top: auto !important;
  background-color: white !important;
  color: black;
  border: none !important;
  box-shadow: none !important;
  max-height: 100% !important;
  padding: 0 !important;
	overflow: hidden;
	border-radius: 16px !important;
	overflow: auto;
	height: calc(100% - 100px);
}
.device-mode-mobile .vcontrol[data-utalic-class="VPopupMenu"] ul
{
	max-height: 100%;
	box-sizing: border-box;
	line-height: 60px;
	appearance: none;
	padding: 0;
}
.device-mode-desktop .vcontrol[data-utalic-class="VPopupMenu"] ul,
.device-mode-tablet .vcontrol[data-utalic-class="VPopupMenu"] ul
{
	max-height: 100%;
	box-sizing: border-box;
	line-height: 30px;
	appearance: none;
	padding: 0;
	margin: 0;
}
.vcontrol[data-utalic-class="VPopupMenu"] ul li,
.vcontrol[data-utalic-class="VPopupMenu"] ul li
{
  max-width: 100% !important;
  display: block !important;
  background-color: white !important;
  font-size: 15px !important;
  text-align: center !important;
  color: var(--app-primary-color) !important;
  cursor: pointer;
  list-style-type: none;
}
.device-mode-desktop .vcontrol[data-utalic-class="VPopupMenu"] ul li,
.device-mode-tablet .vcontrol[data-utalic-class="VPopupMenu"] ul li
{
	padding: 0 30px;
  font-size: 13px !important;
  color: black !important;
  text-align: left !important;
}
.device-mode-desktop .vcontrol[data-utalic-class="VPopupMenu"] ul li.new-group,
.device-mode-tablet .vcontrol[data-utalic-class="VPopupMenu"] ul li.new-group
{
	padding-top: 5px;
	margin-top: 5px;
	border-top: 1px solid var(--app-primary-color) !important;
}
.device-mode-desktop .vcontrol[data-utalic-class="VPopupMenu"] ul li:hover,
.device-mode-tablet .vcontrol[data-utalic-class="VPopupMenu"] ul li:hover
{
	background-color: var(--app-primary-color) !important;
  color: var(--app-primary-foreground) !important;
}
.vcontrol[data-utalic-class="VPopupMenu"] ul li.has-icon
{
	padding-left: 10px;
}
.vcontrol[data-utalic-class="VPopupMenu"] ul li:not(:first-of-type),
.vcontrol[data-utalic-class="VPopupMenu"] ul li:not(:first-of-type)
{
  border-top: 1px solid #f0f0f0;
}
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] .utalic-collection-adder,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] .utalic-collection-adder
{
	display: none;
}
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item:not(.hidden),
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item:not(.hidden)
{
  display: inline-block !important;
  cursor: pointer;
}
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item:not(.hidden)
{
  display: block !important;
  width: 100% !important;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .items .tabbar-item .caption
{
	padding-top: 5px;
	width: 100%;
	overflow: hidden;
	opacity: 0.5;
	text-overflow: ellipsis;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .items .tabbar-item .badge
{
	position: absolute;
	top: 4px;
	height: 20px;
	right: calc(50% - 35px);
	max-width: 40px;
	vertical-align: top;
	line-height: 20px;
	padding: 3px 10px;
	background-color: #ff2020;
	color: white;
	font-size: 90%;
	border-radius: 12px;
	display: none;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .items .tabbar-item.has-badge .badge
{
	display: inline-block;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .extra-items .tabbar-item .caption
{
	display: none;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .items .tabbar-item .icon,
.vcontrol[data-utalic-class="VTabBarMenu"] .items .tabbar-item .hot-icon
{
	height: 40px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	font-size: 20px;
	line-height: 35px;
}
.vcontrol[data-utalic-class="VTabBarMenu"] .extra-items .tabbar-item .icon,
.vcontrol[data-utalic-class="VTabBarMenu"] .extra-items .tabbar-item .hot-icon
{
	height: 36px !important;
	background-size: 16px;
	background-repeat: no-repeat;
	background-position: center;
	font-size: 14px;
	line-height: 36px;
	background-color: var(--menubar-highlighted-background);
	width: 36px !important;
	margin: auto;
	border-radius: 50%;
}
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item .hot-icon,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item .hot-icon,
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item:hover .icon,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item:hover .icon,
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item.active .icon,
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item:not(.active) .hot-icon
{
	display: none;
}
.device-mode-desktop .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item:hover .hot-icon,
.device-mode-tablet .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item:hover .hot-icon,
.device-mode-mobile .vcontrol[data-utalic-class="VTabBarMenu"] .tabbar-item.active .hot-icon
{
	display: inline-block;
}
.vcontrol[data-utalic-class="VSideBar"] .nav-back::before
{
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 40px;
	height: 40px;
	padding: 1px 10px;
	line-height: 48px;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"] .sidebar-item,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar-item
{
	opacity: 0.7;
	cursor: pointer !important;
}
.vcontrol[data-utalic-class="VTabBarMenu"] > .contentarea
{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 80px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item .caption
{
	position: absolute;
	padding: 4px 0;
	left: 38px;
	top: 0;
	line-height: 26px;
	text-overflow: ellipsis;
	right: 0;
	height: 24px;
	font-size: 13px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item .badge
{
	position: absolute;
	top: 4px;
	bottom: 4px;
	right: 0;
	max-width: 40px;
	vertical-align: top;
	line-height: 20px;
	padding: 3px 10px;
	background-color: #ff2020;
	color: white;
	font-size: 90%;
	border-radius: 12px;
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.has-badge .caption
{
	right: 45px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.has-badge .badge
{
	display: inline-block;
}
.vcontrol[data-utalic-class="VSideBar"] .extra-items .sidebar-item .caption
{
	font-size: 90%;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.active
{
	opacity: 1;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item .hot-icon,
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item .move-handle
{
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item:not(.heading) .expander
{
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.heading .expander
{
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 34px;
	height: 34px;
	font-size: 17px;
	line-height: 34px;
	text-align: center;
	transition: transform 200ms;
	opacity: 0.5;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.heading.expanded .expander
{
	transform: rotate(180deg);
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item .move-handle,
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item:not(.heading) .icon,
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item:not(.heading) .hot-icon
{
	position: absolute;
	left: 0;
	top: 0;
	width: 34px;
	height: 100%;
	background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;
  line-height: 34px;
  text-align: center;
  font-size: 15px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.heading .icon,
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item.heading .hot-icon
{
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-item .move-handle
{
	text-align: center;
	padding: 0;
	position: absolute;
	top: 0;
	overflow: hidden;
	box-sizing: border-box;
	display: none;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"] .sidebar-item:not(.heading):hover,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"] .sidebar-item.active:not(.heading),
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar-item:not(.heading):hover,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar-item.active:not(.heading)
{
	background-color: #ffffff22;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"] .sidebar-item:hover .icon,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"] .sidebar-item.active .icon,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar-item:hover .icon,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar-item.active .icon
{
	display: none;
}
.device-mode-desktop .vcontrol.move-mode[data-utalic-class="VSideBar"] .icon,
.device-mode-desktop .vcontrol.move-mode[data-utalic-class="VSideBar"] .hot-icon,
.device-mode-tablet .vcontrol.move-mode[data-utalic-class="VSideBar"] .icon,
.device-mode-tablet .vcontrol.move-mode[data-utalic-class="VSideBar"] .hot-icon
{
	display: none !important;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"]:not(.move-mode) .sidebar-item:not(.heading):hover .hot-icon,
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"]:not(.move-mode) .sidebar-item.active:not(.heading) .hot-icon,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar-item:not(.heading):hover .hot-icon,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .sidebar-item.active:not(.heading) .hot-icon,
.device-mode-desktop .vcontrol.move-mode[data-utalic-class="VSideBar"] .move-handle,
.device-mode-tablet .vcontrol.move-mode[data-utalic-class="VSideBar"] .move-handle
{
	display: block;
}
.vcontrol[data-utalic-class="VSideBar"] .extra-items .sidebar-item .icon,
.vcontrol[data-utalic-class="VSideBar"] .extra-items .sidebar-item .hot-icon
{
	background-size: 16px;
}
.vcontrol[data-utalic-class="VSideBar"] .navigation-bar,
.vcontrol[data-utalic-class="VSideBar"] .additional-navigation-bar
{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 40px;
  line-height: 40px;
  text-align: right;
  white-space: nowrap;
  font-size: 13px;
  font-weight: normal;
  font-family: var(--primary-font);
}
.vcontrol[data-utalic-class="VSideBar"] .additional-column
{
	border-left: 1px solid var(--main-border-color);
}
.vcontrol[data-utalic-class="VSideBar"] .navigation-bar .content-caption
{
  position: absolute;
  left: 50px;
  font-size: 17px;
  height: 50px;
  line-height: 50px;
  right: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .navigation-bar .content-caption
{
  left: 15px;
  display: none;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .contentarea:not(.restricted-size) .navigation-bar .content-caption
{
	left: 20px;
}
.device-mode-desktop .vcontrol[data-utalic-class="VSideBar"] .navigation-bar .content-caption,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .contentarea:not(.restricted-size) .navigation-bar .content-caption
{
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .navigation-bar .system-icon,
.vcontrol[data-utalic-class="VSideBar"] .additional-navigation-bar .system-icon,
.vcontrol[data-utalic-class="VScenePopup"] > .navigation-bar .system-icon,
.vcontrol[data-utalic-class="VSceneBeamer"] > .navigation-bar .system-icon
{
	left: 0;
	height: 50px;
	width: 25px;
	text-align: center;
	line-height: 50px;
	font-size: 160%;
	display: inline-block;
}
.vcontrol[data-utalic-class="VSideBar"] .navigation-bar .nav-back,
.vcontrol[data-utalic-class="VSideBar"] .additional-navigation-bar .nav-back
{
	position: absolute;
	top: 0;
	width: 50px;
	bottom: 0;
	left: 0;
	cursor: pointer;
	background-size: 30px;
	background-position: center;
	background-repeat: no-repeat;
	text-align: left;
}
.vcontrol[data-utalic-class="VSideBar"] .navigation-bar .nav-back
{
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .user-area
{
	position: absolute;
	bottom: 10px;
	left: 10px;
	right: 10px;
	background-color: #ffffff1c;
	border: 1px solid #ffffff0f;
	padding: 10px;
	border-radius: 8px;
	padding-left: 60px;
	min-height: 50px;
	box-sizing: border-box;
  cursor: pointer;
}
.vcontrol[data-utalic-class="VSideBar"] .user-area:hover
{
	background-color: #ffffff2c;
}
.vcontrol[data-utalic-class="VSideBar"] .user-name
{
	font-size: 120%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.vcontrol[data-utalic-class="VSideBar"] .user-avatar
{
	position: absolute;
  left: 10px;
  top: calc(50% - 20px);
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: #323232;
}
.vcontrol[data-utalic-class="VSideBar"] .user-description
{
	font-size: 80%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.vcontrol[data-utalic-class="VSideBar"] .additional-navigation-bar .nav-back
{
	background-size: 20px;
}
.vcontrol[data-utalic-class="VDurationEdit"] .html-duration-picker-input-controls-wrapper
{
	height: 100%;
}
.vcontrol[data-utalic-class="VTextEdit"].delay input,
.vcontrol[data-utalic-class="VPhoneEdit"].delay input,
.vcontrol[data-utalic-class="VCurrencyEdit"].delay input,
.vcontrol[data-utalic-class="VDurationEdit"].delay input,
.vcontrol[data-utalic-class="VIconEdit"].delay input,
.vcontrol[data-utalic-class="VLocationEdit"].delay input,
.vcontrol[data-utalic-class="VMarkdownEditor"].delay input,
.vcontrol[data-utalic-class="VMultilineEdit"].delay input,
{
	background-image: url(ressources/images/spinner.gif) !important;
}
.vcontrol[data-utalic-class="VSideBar"] .content-scene,
.vcontrol[data-utalic-class="VSideBar"] .additional-scene
{
	position: absolute;
	left: 0;
	right: 0;
	top: 40px;
	bottom: 0;
	overflow: auto;
	background-color: white;
}
.vcontrol[data-utalic-class="VSideBar"] .content-scene > .app-scene,
.vcontrol[data-utalic-class="VSideBar"] .additional-scene > .app-scene
{
	left: 0 !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action.has-icon > span,
.VFullscreenDialog .sidebar-detail-action.has-icon > span,
.vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action.has-icon > span,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .navigation-bar .sidebar-detail-action.has-icon > span,
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action-two.has-icon > span,
.VFullscreenDialog .sidebar-detail-action-two.has-icon > span,
.vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action-two.has-icon > span,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .navigation-bar .sidebar-detail-action-two.has-icon > span
{
	display: none;
}


.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action,
.VFullscreenDialog .sidebar-detail-action,
.vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .navigation-bar .sidebar-detail-action,
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action-two,
.VFullscreenDialog .sidebar-detail-action-two,
.vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action-two,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .navigation-bar .sidebar-detail-action-two
{
  top: 0;
  height: 50px;
  line-height: 30px !important;
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: left center;
  cursor: pointer;
  display: inline-block;
  vertical-align: top;
  font-size: var(--content-font-size);
  margin-right: 10px;
  padding: 0 10px 0 10px;
}
.VTagsEditSelector
{
	padding: 0 5px;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action,
.VFullscreenDialog .sidebar-detail-action,
.vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .navigation-bar .sidebar-detail-action,
{
  height: 30px !important;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action-two,
.VFullscreenDialog .sidebar-detail-action-two,
.vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action-two,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .navigation-bar .sidebar-detail-action-two
{
  height: 50px !important;
  box-sizing: border-box;
  width: 50px;
}
.VFullscreenDialog .sidebar-detail-action.has-icon .system-icon,
.VFullscreenDialog .sidebar-detail-action-two.has-icon .system-icon,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] .sidebar-detail-action-two.has-icon .system-icon,
.vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] .sidebar-detail-action-two.has-icon .system-icon
{
	margin-right: 5px;
	margin-left: 5px;

}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action
{
	right: 0;
}
.VScenePopup.has-navigation-bar > .navigation-bar,
.vcontrol[data-utalic-class="VSceneBeamer"].has-navigation-bar > .navigation-bar
{
	text-align: right;
}
.VScenePopup.has-navigation-bar > .navigation-bar .sidebar-detail-action
.vcontrol[data-utalic-class="VSceneBeamer"].has-navigation-bar > .navigation-bar .sidebar-detail-action
{
	display: inline-block;
	cursor: pointer;
}
.vcontrol .placeholder-standalone-element
{
	padding: 5px;
	font-size: 12px;
	display: inline-block;
}
.utalic-stage.color-scheme-light .vcontrol *::placeholder,
.utalic-stage.color-scheme-light .vcontrol .placeholder-standalone-element,
.utalic-stage.color-scheme-light .select2-search__field::placeholder
{
  color: #d4d4d4 !important;
}
.utalic-stage.color-scheme-dark .vcontrol *::placeholder,
.utalic-stage.color-scheme-dark .vcontrol .placeholder-standalone-element,
.utalic-stage.color-scheme-dark .vcontrol .select2-search__field::placeholder
{
  color: #525252;
}
.utalic-stage.device-mode-mobile .vcontrol.has-navigation-bar[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action,
.utalic-stage.device-mode-mobile .vcontrol.has-navigation-bar[data-utalic-class="VSceneBeamer"] > .navigation-bar .sidebar-detail-action,
.utalic-stage:not(.device-mode-desktop) .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-tablet .contentarea:not(.restricted-size) .sidebar-detail-action,
.utalic-stage:not(.device-mode-desktop) .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-tablet .additional-column .sidebar-detail-action,
.utalic-stage:not(.device-mode-desktop):not(.device-mode-tablet) .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-mobile .contentarea:not(.restricted-size) .sidebar-detail-action,
.utalic-stage:not(.device-mode-desktop):not(.device-mode-tablet) .vcontrol[data-utalic-class="VSideBar"].info-column.breakpoint-mobile .additional-column .sidebar-detail-action
{
	right: 50px;
}
.vcontrol .resize-handle
{
	position: absolute;
	width: 10px;
	height: 10px;
	background-color: var(--app-primary-color);
}
.vcontrol .resize-handle.circle
{
	border-radius: 50%;
}
.vcontrol .resize-handle.nw
{
	cursor: nw-resize;
}
.vcontrol .resize-handle.n
{
	cursor: n-resize;
}
.vcontrol .resize-handle.ne
{
	cursor: ne-resize;
}
.vcontrol .resize-handle.e
{
	cursor: e-resize;
}
.vcontrol .resize-handle.se
{
	cursor: se-resize;
}
.vcontrol .resize-handle.s
{
	cursor: s-resize;
}
.vcontrol .resize-handle.sw
{
	cursor: sw-resize;
}
.vcontrol .resize-handle.w
{
	cursor: w-resize;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action.has-icon > span
{
	display: none;
}
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action.has-icon,
.vcontrol[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action.has-icon,
.vcontrol[data-utalic-class="VSideBar"] .sidebar-detail-action-two.has-icon,
.vcontrol[data-utalic-class="VScenePopup"] > .navigation-bar .sidebar-detail-action-two.has-icon
{
	padding-left: 10px;
	padding-right: 15px;
	min-width: 20px;
}
.vcontrol[data-utalic-class="VMarkdownLabel"] span a
{
	color: var(--app-primary-color);
}
.vcontrol[data-utalic-class="VCheckBox"],
.vcontrol[data-utalic-class="VRadioButton"]
{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.vcontrol[data-utalic-class="VCheckBox"] input,
.vcontrol[data-utalic-class="VRadioButton"] input
{
	vertical-align: top;
	margin: 0 4px 0 0;
}
.vcontrol[data-utalic-class="VLabel"] > .hl,
.vcontrol[data-utalic-class="VRelativeTimeLabel"] > .hl
{
	white-space: nowrap;
}
.vcontrol[data-utalic-class="VLabel"] > .hl .ut-lbl,
.vcontrol[data-utalic-class="VRelativeTimeLabel"] > .hl .ut-tlbl
{
	vertical-align: middle;
	white-space: normal;
}

.vcontrol[data-utalic-class="VLabel"] span.placeholder,
.vcontrol[data-utalic-class="VLookupLabel"] span.placeholder,
.vcontrol[data-utalic-class="VLinkLabel"] span.placeholder,
.vcontrol[data-utalic-class="VMarkdownLabel"] span.placeholder,
.vcontrol[data-utalic-class="VMultiCaptionLabel"] span.placeholder
{
	opacity: 0.5;
}
.vcontrol[data-utalic-class="VLabel"] span,
.vcontrol[data-utalic-class="VLookupLabel"] span,
.vcontrol[data-utalic-class="VLinkLabel"] span,
.vcontrol[data-utalic-class="VMarkdownLabel"] span,
.vcontrol[data-utalic-class="VMultiCaptionLabel"] span
{
	box-sizing: border-box;
	cursor: inherit;
}
.vcontrol[data-utalic-class="VLabel"].showellipsis .hl,
.vcontrol[data-utalic-class="VLookupLabel"].showellipsis .hl,
.vcontrol[data-utalic-class="VMarkdownLabel"].showellipsis .hl,
.vcontrol[data-utalic-class="VLinkLabel"].showellipsis .hl,
.vcontrol[data-utalic-class="VMultiCaptionLabel"].showellipsis .hl
{
	overflow: hidden;
}
.vcontrol[data-utalic-class="VLabel"].showellipsis:after,
.vcontrol[data-utalic-class="VLookupLabel"].showellipsis:after,
.vcontrol[data-utalic-class="VMarkdownLabel"].showellipsis:after,
.vcontrol[data-utalic-class="VLinkLabel"].showellipsis:after,
.vcontrol[data-utalic-class="VMultiCaptionLabel"].showellipsis:after
{
	content: "...";
	position: absolute;
	left: 0;
	bottom: 0;
}
.vcontrol[data-utalic-class="VCheckBox"] label,
.vcontrol[data-utalic-class="VRadioButton"] label
{
	min-height: 10px;
	vertical-align: top;
}
.vcontrol[data-utalic-class="VMultilineEdit"],
.vcontrol[data-utalic-class="VMarkdownEditor"],
.vcontrol[data-utalic-class="VTextEdit"],
.vcontrol[data-utalic-class="VPhoneEdit"],
.vcontrol[data-utalic-class="VCurrencyEdit"],
.vcontrol[data-utalic-class="VDurationEdit"],
.vcontrol[data-utalic-class="VIconEdit"],
.vcontrol[data-utalic-class="VLocationEdit"]
{
	background-color: var(--input-background);
	color: var(--input-foreground);
	border-color: var(--input-border-color);
	border-width: var(--input-border-width);
	border-radius: var(--input-border-radius);
	border-style: solid;
	overflow: hidden;
}

.vcontrol[data-utalic-class="VMarkdownEditor"]
{
	overflow: auto;
}

.vcontrol.focussed[data-utalic-class="VMultilineEdit"],
.vcontrol.focussed[data-utalic-class="VMarkdownEditor"],
.vcontrol.focussed[data-utalic-class="VTextEdit"],
.vcontrol.focussed[data-utalic-class="VPhoneEdit"],
.vcontrol.focussed[data-utalic-class="VCurrencyEdit"],
.vcontrol.focussed[data-utalic-class="VDurationEdit"],
.vcontrol.focussed[data-utalic-class="VIconEdit"],
.vcontrol.focussed[data-utalic-class="VLocationEdit"]
{
	border-color: var(--input-focus-border-color);
}

.vcontrol[data-utalic-class="VTextBlock"] img
{
	max-width: 100%;
}
.vcontrol[data-utalic-class="VMultilineEdit"] textarea,
.vcontrol[data-utalic-class="VMarkdownEditor"] textarea
{
	resize: none;
}
textarea.auto-height
{
	overflow: visible !important;
}
.vcontrol[data-utalic-class="VDBGrid"] .tabulator-header,
.vcontrol[data-utalic-class="VDBGrid"] .tabulator-header .tabulator-col,
.vcontrol[data-utalic-class="VDBGrid"] .tabulator-header .tabulator-col:hover
{
	background-color: var(--app-primary-color) !important;
	color: var(--app-primary-foreground);
}
.vcontrol[data-utalic-class="VDBGrid"] .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-content .tabulator-col-sorter .tabulator-arrow
{
	border-bottom-color: var(--app-primary-color-dark) !important;
}
.vcontrol[data-utalic-class="VDBGrid"] .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow
{
	border-bottom-color: var(--app-primary-foreground) !important;
}
.vcontrol[data-utalic-class="VDBGrid"] .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=descending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow
{
	border-top-color: var(--app-primary-foreground) !important;
}
.vcontrol[data-utalic-class="VDBGrid"] .tabulator-header .tabulator-col
{
	border-right: none;
}
.vcontrol[data-utalic-class="VLinkLabel"] .icon
{
	display: inline-block;
	height: 100%;
	width: 20px;
	text-align: left;
}
.vcontrol[data-utalic-class="VLinkLabel"] span:hover
{
	text-decoration: underline !important;
}
.vcontrol[data-utalic-class="VButton"]
{
	padding: 0 !important;
}
.vcontrol[data-utalic-class="VIcon"] .modifier
{
  position: absolute;
  top: 30%;
  left: 30%;
  width: calc(70% - 1px);
  height: calc(70% - 1px);
  background: #eeeeee;
  border-radius: 50%;
  text-align: center;
  padding: 2px;
}
.vcontrol[data-utalic-class="VMultilineEdit"] textarea,
.vcontrol[data-utalic-class="VMarkdownEditor"] textarea,
.vcontrol[data-utalic-class="VTextEdit"] input,
.vcontrol[data-utalic-class="VPhoneEdit"] input,
.vcontrol[data-utalic-class="VCurrencyEdit"] input,
.vcontrol[data-utalic-class="VDurationEdit"] input,
.vcontrol[data-utalic-class="VLocationEdit"] input,
.vcontrol[data-utalic-class="VPasswordEdit"] input,
.vcontrol[data-utalic-class="VDateEdit"] input,
.vcontrol[data-utalic-class="VTimeEdit"] input,
.vcontrol[data-utalic-class="VDateTimeEdit"] input,
.vcontrol[data-utalic-class="VNumberEdit"] .input-wrapper,
.vcontrol[data-utalic-class="VIconEdit"] input,
.vcontrol[data-utalic-class="VLocationEdit"] input,
.vcontrol[data-utalic-class="VTimeEdit"] input,
.vcontrol[data-utalic-class="VValidationEdit"] input,
.vcontrol[data-utalic-class="VUrlEdit"] input,
.vcontrol[data-utalic-class="VEmailEdit"] input,
.vcontrol[data-utalic-class="VVatIdEdit"] input,
.vcontrol[data-utalic-class="VBicEdit"] input,
.vcontrol[data-utalic-class="VIbanEdit"] input,
.vcontrol[data-utalic-class="VBicEdit"] input,
.vcontrol[data-utalic-class="VCheckEdit"] input
{
	border: none;
	background: transparent;
	color: inherit;
	outline: none !important;
	font-family: inherit;
	text-align: inherit;
	box-sizing: border-box;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	padding: inherit;
	text-decoration: inherit;
	font-weight: inherit;
	text-transform: inherit;
	font-size: inherit;
	line-height: inherit;
}
.autoheight-shadow-object
{
	border: none;
	background: transparent;
	color: inherit;
	outline: none !important;
	font-family: inherit;
	text-align: inherit;
	box-sizing: border-box;
	padding: inherit;
	text-decoration: inherit;
	font-weight: inherit;
	text-transform: inherit;
	font-size: inherit;
	line-height: inherit;
}
.vcontrol[data-utalic-class="VNumberEdit"],
.vcontrol[data-utalic-class="VDateTimeEdit"],
.vcontrol[data-utalic-class="VDateEdit"],
.vcontrol[data-utalic-class="VIconEdit"],
.vcontrol[data-utalic-class="VLocationEdit"],
.vcontrol[data-utalic-class="VValidationEdit"],
.vcontrol[data-utalic-class="VUrlEdit"],
.vcontrol[data-utalic-class="VEmailEdit"],
.vcontrol[data-utalic-class="VVatIdEdit"],
.vcontrol[data-utalic-class="VBicEdit"],
.vcontrol[data-utalic-class="VIbanEdit"],
.vcontrol[data-utalic-class="VCheckEdit"],
.vcontrol[data-utalic-class="VTimeEdit"]
{
	overflow: hidden;
}
.vcontrol[data-utalic-class="VNumberEdit"] .btn-plus,
.vcontrol[data-utalic-class="VNumberEdit"] .btn-minus,
.vcontrol[data-utalic-class="VDateEdit"] .btn-open,
.vcontrol[data-utalic-class="VIconEdit"] .btn-open,
.vcontrol[data-utalic-class="VLocationEdit"] .btn-open,
.vcontrol[data-utalic-class="VDateTimeEdit"] .btn-open,
.vcontrol[data-utalic-class="VTimeEdit"] .btn-open
{
	display: none;
}
.vcontrol[data-utalic-class="VIconEdit"] input,
{
	border: none !important;
	border-radius: 0;
	outline: none !important;
	margin: 0;
	text-align: inherit;
}
.vcontrol[data-utalic-class="VDateEdit"] input
.vcontrol[data-utalic-class="VLocationEdit"] input,
.vcontrol[data-utalic-class="VDateTimeEdit"] input,
.vcontrol[data-utalic-class="VNumberEdit"] input,
.vcontrol[data-utalic-class="VTimeEdit"] input
{
	border: none !important;
	border-radius: 0;
	outline: none !important;
	padding: 0;
	margin: 0;
	text-align: inherit;
	color: inherit;
}
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"] .input-wrapper
{
	border: none !important;
	border-radius: 0;
	left: 25px !important;
	right: 25px !important;
}
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"] input::-webkit-outer-spin-button,
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"] input::-webkit-inner-spin-button,
.vcontrol.utalic-plain[data-utalic-class="VNumberEdit"] input::-webkit-outer-spin-button,
.vcontrol.utalic-plain[data-utalic-class="VNumberEdit"] input::-webkit-inner-spin-button,
.vcontrol[data-utalic-class="VCurrencyEdit"] input::-webkit-outer-spin-button,
.vcontrol[data-utalic-class="VCurrencyEdit"] input::-webkit-inner-spin-button,
.vcontrol.utalic-enclosed[data-utalic-class="VDateEdit"] input::-webkit-inner-spin-button,
.vcontrol.utalic-enclosed[data-utalic-class="VDateEdit"] input::-webkit-calendar-picker-indicator,
.vcontrol.utalic-enclosed[data-utalic-class="VDateTimeEdit"] input::-webkit-inner-spin-button,
.vcontrol.utalic-enclosed[data-utalic-class="VDateTimeEdit"] input::-webkit-calendar-picker-indicator,
.vcontrol.utalic-enclosed[data-utalic-class="VTimeEdit"] input::-webkit-inner-spin-button,
.vcontrol.utalic-enclosed[data-utalic-class="VTimeEdit"] input::-webkit-calendar-picker-indicator
{
	-webkit-appearance: none;
	display: none;
  margin: 0;
}
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"] .btn-plus,
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"] .btn-minus,
.vcontrol.utalic-enclosed[data-utalic-class="VDateTimeEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VLocationEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VDateEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VIconEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VValidationEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VUrlEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VEmailEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VIbanEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VVatIdEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VBicEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VCheckEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VTimeEdit"] .btn-open
{
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 40px;
	text-align: center;
}
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"] .btn-plus,
.vcontrol.utalic-enclosed[data-utalic-class="VDateEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VIconEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VLocationEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VDateTimeEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VValidationEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VUrlEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VEmailEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VVatIdEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VBicEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VIbanEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VCheckEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VCheckEdit"] .btn-open,
.vcontrol.utalic-enclosed[data-utalic-class="VTimeEdit"] .btn-open
{
	right: 0;
}
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"] .btn-minus
{
	position: absolute;
	left: 0;
}
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"] input,
.vcontrol.utalic-enclosed[data-utalic-class="VCurrencyEdit"] input
{
	border: none !important;
	border-radius: 0 !important;
	padding: inherit !important;
	outline: none !important;
	-moz-appearance: textfield !important;
	-webkit-appearance: none !important;
}
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"]:not(.utalic-enclosed) input
{
	width: 100%;
	height: 100%;
}
.vcontrol.utalic-enclosed[data-utalic-class="VNumberEdit"]:not(.utalic-enclosed) .input-wrapper
{
	position: absolute;
	left: 42px;
	right: 42px;
	top: 0;
	bottom: 0;
	width: auto !important;
}
.vcontrol.utalic-enclosed[data-utalic-class="VDateEdit"] input,
.vcontrol.utalic-enclosed[data-utalic-class="VIconEdit"] input,
.vcontrol.utalic-enclosed[data-utalic-class="VLocationEdit"] input,
.vcontrol.utalic-enclosed[data-utalic-class="VDateTimeEdit"] input,
.vcontrol.utalic-enclosed[data-utalic-class="VTimeEdit"] input
{
	-moz-appearance: textfield;
	position: absolute;
	left: 0;
	right: 40px;
	top: 0;
	bottom: 0;
	width: auto !important;
}

.vcontrol[data-utalic-class="VIconEdit"] .icon,
.vcontrol[data-utalic-class="VLocationEdit"] .icon
{
	display: inline-block;
	height: 100%;
  width: 40px;
  top: 0;
  position: absolute;
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  text-align: center;
  font-size: 1.2em;
}

.vcontrol[data-utalic-class="VImage"],
.vcontrol[data-utalic-class="VDatabaseImage"]
{
	text-align: center;
	overflow: hidden;
}
.vcontrol[data-utalic-class="VImage"] img,
.vcontrol[data-utalic-class="VDatabaseImage"] img
{
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: left top;
}
.vcontrol[data-utalic-class="VExpanderPanel"]
{
	overflow: hidden !important;
}
.vcontrol[data-utalic-class="VExpanderPanel"] .jqx-widget-header
{
	border: none !important;
	background-color: inherit;
}
.vcontrol[data-utalic-class="VExpanderPanel"] .jqcontrol
{
	width: 100% !important;
	height: 100% !important;
}
.vcontrol[data-utalic-class="VExpanderPanel"] .jqx-widget-content
{
	border: none !important;
	padding: 0 !important;
}
.vcontrol[data-utalic-class="VSlider"] div
{
	z-index: auto !important;
}
.vcontrol.collapsing[data-utalic-class="VAccordionTab"]
{
	overflow: hidden !important;
}

.vcontrol[data-utalic-class="VSwitchButton"]
{
	position: relative;
	transition: background-color 0.2s;
	cursor: pointer;
}
.vcontrol[data-utalic-class="VSwitchButton"] .handle
{
	position: absolute;
	left: 0;
	top: 0;
	width: 50%;
	border: 1px solid var(--highlight-on-highlight-border);
	transition: left 0.2s;
}
.vcontrol.on[data-utalic-class="VSwitchButton"] .handle
{
	left: 50%;
}
.vcontrol[data-utalic-class="VResponsiveColumnsPanel"]
{
	text-align: center !important;
	overflow: visible !important;
	height: auto !important;
	min-height: 50px;
}
.vcontrol[data-utalic-class="VResponsiveColumnsPanelBox"]
{
	position: relative !important;
	display: inline-block !important;
	top: auto !important;
	left: auto !important;
	vertical-align: top !important;
}
.vcontrol.responsive-break .vcontrol[data-utalic-class="VResponsiveColumnsPanelBox"]
{
	width: 100% !important;
}
.vcontrol.newline[data-utalic-class="VResponsiveColumnsPanelBox"]:before
{
  content: '\a';
  white-space: pre;
}
.vcontrol[data-utalic-class="VImageCheckboxes"]
{
	overflow-x: hidden !important;
	overflow-y: auto !important;
}
.vcontrol[data-utalic-class="VImageCheckboxes"] .image-container
{
	position: relative;
	vertical-align: top;
	display: inline-block;
	opacity: 0.8;
	cursor: pointer;
}
.vcontrol[data-utalic-class="VImageCheckboxes"] .image-container.checked
{
	opacity: 1;
}
.vcontrol[data-utalic-class="VImageCheckboxes"] .image-container .check-rectangle
{
	position: absolute;
	left: 10px;
	top: 10px;
	background-color: white;
	width: 20px;
	height: 20px;
	border-radius: 4px;
	background-position: center;
	background-size: 18px;
	background-repeat: no-repeat;
}
.vcontrol[data-utalic-class="VImageCheckboxes"] .image-container.checked .check-rectangle
{
	background-color: var(--app-primary-color);
	background-image: url(ressources/images/check.svg);
}
.vcontrol[data-utalic-class="VImageCheckboxes"] .image-container img
{
	border-radius: 10px;
	border: 4px solid transparent;
}
.vcontrol[data-utalic-class="VImageCheckboxes"] .image-container img:hover
{
	border: 4px solid var(--app-primary-color);
}
.vcontrol.utalic-float-full
{
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	width: auto;
	height: auto;
}
.utalic-window-header-div,
.utalic-expander-header-div
{
	line-height: 20px;
}
.utalic-window-header-div.with-icon,
.utalic-expander-header-div.with-icon
{
	padding-left: 28px;
	background-position: 2px center;
	background-size: 20px;
	background-repeat: no-repeat;
}
.utalic-window-content-div,
.utalic-expander-content-div
{
	position: relative;
	width: 100%;
	height: 100%;
}
iframe.size-changed-x
{
  width: 100%;
  display: block;
  border: 0;
  height: 0;
  margin: 0;
}
iframe.size-changed-y
{
	position: absolute;
  height: 100%;
  display: inline-block;
  border: 0;
  width: 0;
  margin: 0;
}
.utalic-authframe
{
	z-index: 99;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.utalic-runtime-hidden
{
	display: none !important;
}
.vcontrol[data-utalic-class="VResponsivePanel"]
{
	white-space: nowrap !important;
	overflow: hidden !important;
}
.vcontrol[data-utalic-class="VResponsivePanelStage"]
{
	height: 100% !important;
	vertical-align: top !important;
	position: relative !important;
}
.utalic-stage
{
	background-color: #363636;
}
.utalic-stage .utalic-centered-scene
{
	left: 50% !important;
	transform: translateX(-50%) !important;
}
.utalic-stage .utalic-rightaligned-scene
{
	left: 100% !important;
	transform: translateX(-100%) !important;
}
.utalic-responsivepanel-invisible
{
	display: none !important;
}
.owner-control .utalic-menubar .utalic-back
{
	height: 45px;
	width: 45px;
	display: none;
}
.vcontrol[data-utalic-class="VButton"].empty-caption button span:not(.btn-icon)
{
	display: none;
}
.vcontrol[data-utalic-class="VButton"].empty-caption button,
.vcontrol[data-utalic-class="VButton"].empty-caption button span
{
	overflow: hidden;
	text-overflow: clip;
}
.vcontrol[data-utalic-class="VButton"] button,
.vcontrol[data-utalic-class="VCancelButton"] button
{
	cursor: inherit;
}
.vcontrol .lbl-icon,
.vcontrol[data-utalic-class="VButton"]:not(.empty-caption) button .btn-icon,
.vcontrol[data-utalic-class="VCancelButton"]:not(.empty-caption) button .btn-icon
{
	font-size: 120%;
	line-height: 120%;
	margin-right: 5px;
}
.gantt-container .ressource-title
{
	stroke: var(--primary-font-color);
}
.gantt-container .popup-wrapper .openbutton
{
	margin: 10px;
	padding: 5px 10px;
	cursor: pointer;
	color: white;
	background-color: var(--app-primary-color);
	border-radius: 4px;
	text-align: center;
}
.must-autoheight::-webkit-scrollbar
{
	display: none !important;
}
.vcontrol[data-utalic-class="VResponsivePanelStage"] .utalic-menubar.hidden
{
	display: none;
}
.vcontrol.visible-back-button[data-utalic-class="VResponsivePanelStage"] .utalic-menubar
{
	display: block !important;
}
.vcontrol.visible-back-button[data-utalic-class="VResponsivePanelStage"] .utalic-menubar .utalic-back
{
	display: block;
}
.utalic-responsive-stage-with-caption.nonempty-caption .utalic-menubar,
.utalic-first-visible-after-invisible:not(.utalic-first-stage) .utalic-menubar,
.utalic-first-visible-after-invisible:not(.utalic-first-stage) .utalic-menubar .utalic-back
{
	display: block;
}
.VTableView {
    font-family: Arial, sans-serif;
    user-select: none;
    overflow: auto;
    outline: 1px solid #ccc;
}

.VTableView-scroll-wrapper {
    overflow: auto;
    max-height: 100%;
    position: relative;
}

.VTableView-table {
    border-collapse: collapse;
    table-layout: auto;
    width: max-content;
    margin-left: -1px;
}

.VTableView-table th,
.VTableView-table td {
    border: 1px solid #ccc;
    padding: 0;
    margin: 0;
    position: relative;
}

.VTableView-table th {
  background: #f3f3f3;
  text-align: left;
  height: 32px;
  padding-left: 8px;
  font-weight: bold;
  white-space: nowrap;
  border-top: none;
  border-bottom: 1px solid #ccc;
  border-right-width: 2px;
  border-top-color: white;
  border-left-color: white;
  border-right-color: #ccc;
  padding-right: 0;
  box-sizing: border-box;
}

.VTableView-table td {
    height: 32px;
    white-space: nowrap;
}

.VTableView-line {
		position: sticky !important;
    width: 20px;
    background-color: #f0f0f0;
    border-right: 1px solid #ccc;
    min-width: 20px;
    max-width: 20px;
    z-index: 2;
    left: -1px;
}

.VTableView-topline
{
	top: 0;
	left: -1px;
	z-index: 4;
	background: #f0f0f0 !important;
}

.VTableView-col {
    position: sticky !important;
    top: -1px !important;
    background: #f3f3f3 !important;
    z-index: 2 !important;
    white-space: nowrap !important;
}

.VTableView-resizer {
  position: absolute;
  top: 0;
  right: -2px;
  width: 8px;
  height: 100%;
  cursor: col-resize;
  z-index: 10;
  border-right: 1px solid #ccc;
  background: #f3f3f3;
}

.VTableView-table input,
.VTableView-table select {
    border: none;
    width: 100%;
    height: 100%;
    padding: 6px;
    box-sizing: border-box;
    font-size: 14px;
    background-color: transparent;
    outline: none;
}

.VTableView-table input[type="checkbox"] {
    width: auto;
    margin: auto;
    display: block;
}

.VTableView-table tr:hover {
    background-color: #f9f9f9;
}

.VTableView-active-row .VTableView-line,
.VTableView-active-cell:not(.VTableView-modified-cell) {
    background-color: var(--app-primary-color);
}

.VTableView-modified-cell:not(.VTableView-active-cell) {
    background-color: #ffa700;
}

.VTableView-modified-cell.VTableView-active-cell {
    background-color: var(--app-secondary-color);
}

.owner-control .utalic-menubar .caption
{
	position: absolute;
	left: 46px;
	right: 46px;
	overflow: hidden;
	text-overflow: ellipsis;
	top: 8px;
	height: 28px;
	line-height: 28px;
	text-align: center;
	font-size: var(--menubar-font-size);
	font-weight: 400;
	font-family: var(--primary-font);
}
.auto-hidden
{
	display: none !important;
}
.jqx-window
{
	border: 1px solid var(--highlight-on-highlight-border) !important;
	border-radius: 5px !important;
	box-shadow: none !important;
	background: transparent !important;
}
.jqx-window-header
{
	border: none !important;
	padding: 20px !important;
}
.jqx-window-close-button-background,
.jqx-window-collapse-button-background
{
	width: 30px !important;
	height: 30px !important;
	top: 10px !important;
	margin-right: 10px !important;
}
.jqx-window-collapse-button-background .jqx-window-collapse-button
{
	transition: transform 0.3s ease-out;
}
.jqx-window-collapse-button-background .jqx-window-collapse-button-collapsed
{
	transform: rotate(-180deg);
}
.jqx-window-collapse-button-background,
.jqx-window-collapse-button-background
{
	right: 30px !important;
}
.jqx-window-content
{
	position: relative;
}
.utalic-colorpicker-without-values .jqx-color-picker-panel > div:not(.jqx-widget-content-material)
{
	display: none;
}
.jqx-checkbox-hover-material,
.jqx-radiobutton-hover-material,
.jqx-tree-material .jqx-checkbox-material .jqx-checkbox-default-material, 
.jqx-checkbox-material[checked] .jqx-checkbox-default-material, 
.jqx-tree-grid-checkbox[checked].jqx-checkbox-default-material, 
.jqx-radiobutton-material[checked] .jqx-radiobutton-default-material
{
	background-color: var(--app-primary-color) !important;
	border-color: var(--app-primary-color) !important;
}
.utalic-stage select
{
	background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGlkPSJMYXllcl8xIiBkYXRhLW5hbWU9IkxheWVyIDEiIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0ye2ZpbGw6Izg4ODt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHBvbHlnb24gY2xhc3M9ImNscy0yIiBwb2ludHM9IjEuNDEgNC42NyAyLjQ4IDMuMTggMy41NCA0LjY3IDEuNDEgNC42NyIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIzLjU0IDUuMzMgMi40OCA2LjgyIDEuNDEgNS4zMyAzLjU0IDUuMzMiLz48L3N2Zz4=);
	background-repeat: no-repeat;
	background-position: right center;
  -moz-appearance: none; 
  -webkit-appearance: none; 
  appearance: none;
  padding: 5px;
}
.hidden,
.internal-hidden
{
	display: none !important;
}
.jqx-checkbox-material .ink,
.jqx-radiobutton-material .ink
{
	background-color: var(--app-primary-color) !important;
}

.slick-list,
.slick-list .slick-track
{
	height: 100%;
}
.slick-slide
{
	position: relative;
}

.slick-slide .slick-content-image
{
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.utalic-carousel-content
{
	height: 100%;
	width: 100%;
}

.utalic-carousel-content.has-arrows
{
	width: calc(100% - 60px);
	margin: 0 30px;
}

.utalic-carousel-content.has-dots
{
	height: calc(100% - 30px);
}

::-webkit-scrollbar
{
  width: 12px;
  height: 12px;
}
::-webkit-scrollbar-track
{
	background: var(--scrollbar-background);
  background-color: transparent;
}

::-webkit-scrollbar-thumb
{
  background-color: var(--scrollbar-foreground);
	background-clip: padding-box;
	border: 3px solid rgba(0, 0, 0, 0);
	border-radius: 9999999px;
}
::-webkit-scrollbar-corner
{
	background-color: var(--scrollbar-background);
}

/*-----------------------------------DEVICE MODE MOBILE-----------------------------------*/

.device-mode-mobile .utalic-responsive-invisible-mobile
{
	display: none !important;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"] .navigation-bar .nav-back,
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"] .additional-navigation-bar .nav-back
{
	display: block;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"] .additional-navigation-bar .nav-back
{
	background-size: 16px;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="menu"] .sidebar
{
	width: 100% !important;
	border-right: none;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="menu"] .contentarea,
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="menu"] .additional-column
{
	display: none;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="content"] .contentarea
{
	width: 100% !important;
	left: 0 !important;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="content"] .sidebar,
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="content"] .additional-column
{
	display: none;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="additional"] .additional-column
{
	width: 100% !important;
	left: 0 !important;
}
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="additional"] .sidebar,
.device-mode-mobile .vcontrol[data-utalic-class="VSideBar"][data-focus-view="additional"] .contentarea
{
	display: none;
}

.device-mode-mobile .vcontrol[data-utalic-class="VKanban"]
{
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;   /* Snap beim horizontalen Scrollen */
  scroll-snap-stop: always;        /* immer aufs Ziel einrasten */
}

.device-mode-mobile .vcontrol[data-utalic-class="VKanban"] .column-stack
{
  display:inline-block;
  vertical-align:top;
  height:100%;
  /* Grundregel: volle Bildschirmbreite minus 2×30px */
  width: calc(100vw - 60px) !important;
  /* links/rechts 30px “Vorschau”-Rand für die Nachbarspalte */
  margin: 0 5px !important;
  /* in die Mitte snappen */
  scroll-snap-align: center;
  box-sizing:border-box;
}

/* Erste/letzte Spalte: nur ein 30px-Rand, daher Breite = 100vw - 30px */
.device-mode-mobile .vcontrol[data-utalic-class="VKanban"] .column-stack:first-child
{
  margin-left:0;
  width: calc(100vw - 30px);
}
.device-mode-mobile .vcontrol[data-utalic-class="VKanban"] .column-stack:last-child
{
  margin-right:0;
  width: calc(100vw - 30px);
}



/*-----------------------------------DEVICE MODE TABLET-----------------------------------*/

body:not(.utalic-ide).device-mode-tablet .utalic-responsive-invisible-tablet
{
	display: none !important;
}
/*
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="additional"] .sidebar
{
  overflow: hidden !important;
  width: 0 !important;
  transition: width 400ms;
}*/
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="additional"]:not(.boxed) .contentarea
{
	left: 0 !important;
}
/*
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="additional"].boxed .contentarea
{
	left: 20px !important;
}*/
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"] .contentarea
{
  transition: left 400ms;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="menu"] .additional-column,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="content"] .additional-column
{
	display: none;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="menu"]:not(.boxed) .contentarea,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"]:not(.has-additional-panel):not(.boxed) .contentarea
{
	right: 0 !important;
	width: auto !important;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="menu"]:.boxed .contentarea,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"]:not(.has-additional-panel):.boxed .contentarea
{
	right: 20px !important;
	width: auto !important;
}
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="menu"] .contentarea .content-scene,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"]:not(.has-additional-panel) .contentarea .content-scene
{
	border-right: none;
}
/*
.device-mode-tablet .vcontrol.has-additional-panel[data-utalic-class="VSideBar"][data-focus-view="content"] .navigation-bar .nav-back,
.device-mode-tablet .vcontrol[data-utalic-class="VSideBar"][data-focus-view="additional"] .navigation-bar .nav-back
{
	display: block;
}*/



/*-----------------------------------DEVICE MODE DESKTOP-----------------------------------*/

body:not(.utalic-ide).device-mode-desktop .utalic-responsive-invisible-desktop
{
	display: none !important;
}