@charset "utf-8";

:root {
    --gap: 1em;

    --gap-row: var(--gap);
    --gap-container: var(--gap);

    --icon: "\f005";
}

/* [data-icon]{
    --icon: "\f005";
} */


/*body {
  --gap-row: var(--gap);
  --gap-container: var(--gap);    
} */


/*
@font-face{
	font-family:'FontAwesome';
	src:url('font-awesome/fonts/fontawesome-webfont.eot?v=4.7.0');
	src:url('font-awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),url('font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('font-awesome/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('font-awesome/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('font-awesome/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
	font-weight:normal;
	font-style:normal;
        font-display: swap;
}
*/

@font-face {
    font-family: 'FontAwesome';
    src: url('fontawesome-5.15.1/fa-solid-900.eot?v=5.15.1');
    src: url('fontawesome-5.15.1/fa-solid-900.eot?#iefix&v=5.15.1') format('embedded-opentype'), url('fontawesome-5.15.1/fa-solid-900.woff2?v=5.15.1') format('woff2'), url('fontawesome-5.15.1/fa-solid-900.woff?v=5.15.1') format('woff'), url('fontawesome-5.15.1/fa-solid-900.ttf?v=5.15.1') format('truetype'), url('fontawesome-5.15.1/fa-solid-900.svg?v=5.15.1#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'FontAwesome';
    src: url('fontawesome-5.15.1/fa-brands-400.eot?v=5.15.1');
    src: url('fontawesome-5.15.1/fa-brands-400.eot?#iefix&v=5.15.1') format('embedded-opentype'), url('fontawesome-5.15.1/fa-brands-400.woff2?v=5.15.1') format('woff2'), url('fontawesome-5.15.1/fa-brands-400.woff?v=5.15.1') format('woff'), url('fontawesome-5.15.1/fa-brands-400.ttf?v=5.15.1') format('truetype'), url('fontawesome-5.15.1/fa-brands-400.svg?v=5.15.1#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}







a {
    cursor: pointer;
}

.trash {
    opacity: 0.5;
}

*,
*:after,
*:before {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}


* {
    vertical-align: top;
}


/*
:not(.editor) *, not(.editor) *:after, not(.editor) *:before {
	-webkit-transition:	max-width 0.3s ease-in-out, max-height 0.3s ease-in-out, padding 0.3s ease-in-out, outline 0.3s ease-in-out, border 0.3s ease-in-out, box-shadow 0.3s ease-in-out; 
 	transition: 		max-width 0.3s ease-in-out, max-height 0.3s ease-in-out, padding 0.3s ease-in-out, outline 0.3s ease-in-out, border 0.3s ease-in-out, box-shadow 0.3s ease-in-out;     
}
*/

html {
    text-size-adjust: none !important;
    -moz-text-size-adjust: none !important;
    -ms-text-size-adjust: none !important;
    -webkit-text-size-adjust: none !important;
    /* iPhone ignores CSS otherwise */

    /*overflow-x: hidden;*/
    /* POSITION: STICKY NOT WORKING ANYMORE  */
    width: 100%;

    overflow-y: scroll;
}

html[data-dimension="xs"] {
    overflow-x: hidden;
    /* POSITION: STICKY NOT WORKING ANYMORE  */
}



body {
    margin: 0;
    font-size: 16px;
    font-family: Arial;

    overflow-x: hidden;
    width: 100%;

}

input,
select,
textarea,
checkbox {
    color: inherit;
    font-size: inherit;
    font-family: inherit;
}

input:not([type]),
input[type="text"],
input[type="number"],
input[type="password"],
select,
textarea {
    width: var(--col-width);
    border: 0px none;
}


.controller {
    z-index: 1;
    position: relative;
    display: inline-block;
    padding-right: 40px;
    vertical-align: top;
    opacity: 0;
    transition: opacity 0.5s;
    white-space: nowrap;
}

.controller:empty {
    display: none;
}

.controller.alwaysVisible {
    opacity: 1;
}

.field_header {
    font-weight: bold;
}

.field_header:hover>.controller,
.mouseOver>.controller,
.mouseOver>[data-template]>.controller {
    opacity: 1;
}

.field_header .controller {
    /*position: absolute;*/
    /* background-color: var(--color-headline); */
    line-height: 1.75em;
    padding: 0.2em;
    /*color: var(--color-main);*/
}
.field_header .controller button:hover {
    color: var(--color-headline);
}

*>.controller>* {
    opacity: 1 !important;
}





[data-icon]:before {
    width: 1em;
    display: inline-block;
    font-weight: normal;
    text-align: center;
}

[data-icon]:not(:empty):not(.iconOnly):before {
    /*	margin-right: 5px;
    width: 1em;*/
    width: 1.4em;
    display: inline-block;
    text-align: left;
}




.icon {
    display: inline-block;
}

.icon::before {
    min-width: 1em;
    font-family: 'FontAwesome';
    text-decoration: none;
    font-weight: normal;
}

.iconFont,
button.iconFont {
    font-family: 'FontAwesome';
}

[data-icon]::before {
    min-width: 1em;
    font-family: "FontAwesome";
    content: attr(data-icon);
}

[data-icon=""]::before {
    content: "" var(--icon);
}




button.icon {
    /*
	padding: 6px;
	padding-top: 3px;
	padding-bottom: 3px;
*/
    /*border-radius: 10px;*/
    border-radius: 1em;
    /*color: #999999;*/
    color: var(--color-main);

    line-height: 1.75em;

    transition: all 0.5s;


}

.icon:not(:empty):before {
    padding-right: 2px;
}

.icon:not(:empty) {
    padding-right: 10px;
}

button.icon[data-hint]:not(:empty):after {
    margin-left: 2px;
}

button.icon:hover {
    color: white;
    background-color: var(--color-headline);

}

button.icon:after {
    display: none;
}

button.icon[data-hint]:after {
    content: attr(data-hint);

    position: absolute;
    font-size: 70%;
    pointer-events: none;
    max-width: 0px;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;

    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;

    /*margin-top: 0.30em;*/
    margin-left: 0px;

    line-height: 1.75em;

    padding-left: 16px;
    padding-right: 8px;

    margin-left: -6px;

    z-index: -1;

    color: transparent;
    background-color: transparent;

    top: 0.30em;
    left: 2em;

    transition: all 0.5s;
}

button.icon[data-hint]:hover:after {
    max-width: 200px;
    background-color: var(--color-main);
    /*background-color: #999999;*/
    color: white;
}

button.icon[data-hint]:not(:hover):after {
    text-shadow: none;
    box-shadow: none;
}




button.icon::before {
    font-family: "FontAwesome";
    position: relative;
    z-index: -5;

    width: 1.75em;
    display: inline-block;
    /*vertical-align: text-top;*/
}

button.icon:hover:before {
    font-family: "FontAwesome";
    /*z-index: 2;*/
    z-index: 11;
    background-color: inherit;
    border-radius: inherit;

}



[data-icon="new"]::before {
    content: ''
}

[data-icon="document"]::before {
    content: ''
}

[data-icon="down"]::before {
    content: ''
}

[data-icon="up"]::before {
    content: ''
}

[data-icon="toggleCollapse"]::before {
    content: ''
}

.collapsed [data-icon="toggleCollapse"]::before {
    content: ''
}


.icon.detail::before {
    content: '';
}

.icon.delete::before {
    /*	content: ''; */
    content: '\f1f8';
}

.icon.print::before {
    content: '';
}

.icon.duplicate::before {
    content: '';
}

.icon.duplicateWithChildren::before {
    content: '';
}

.icon.user::before {
    content: '';
}

.icon.dragHandle:before {
    content: "\f256";
}

.icon.new:before {
    content: '';
}

.icon.download::before {
    content: '';
}





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


ul,
li {
    text-size-adjust: none !important;
    -moz-text-size-adjust: none !important;
    -ms-text-size-adjust: none !important;
    -webkit-text-size-adjust: none !important;
    /* iPhone ignores CSS otherwise */
}

ul[data-structure="set"] {
    position: relative;
    padding: 0px;
    margin: 0px;
}

ul.clean,
.noBullets ul {
    padding: 0px;
    margin: 0px;
}

ul.clean>li,
.noBullets li {
    list-style: outside none none;
}



.li_check ul,
ul.li_check {
    padding-left: 0px;
}

.li_check li {
    list-style: none;
    padding-left: 2.5em;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.li_check li:before {
    content: '\f00c';
    font-family: 'FontAwesome';
    color: var(--color-highlight);
    position: absolute;
    margin-left: -1.5em;
    font-size: 130%;
}

.li_check li li:before {
    content: '\f0da';
    margin-left: -1em;
}







li[data-structure="entity"] {
    position: relative;
    list-style: outside none none;
}

[data-structure="entity"]>[data-structure="field"] {
    /*display:none;*/
    vertical-align: top;
}

[data-structure="field"] {
    position: relative;
}


[data-structure="field"]>p:first-child {
    margin-top: 0px;
}

[data-structure="field"]>p:last-child {
    margin-bottom: 0px;
}

.editorHeader {
    font-weight: bold;
    color: var(--color-headline);
    line-height: 4em;
}

.editorDialog {
    color: #333333;
    opacity: 0;
    transition: opacity 1s;
}



[data-structure="field"][data-label]::after {
    content: attr(data-label);
    /*font-weight: bold;*/
    position: absolute;
    color: var(--color-headline);
    background-color: rgba(255, 255, 255, 0.5);
    font-size: 0.6em;
    line-height: 1em;

    top: 0;
    left: 0;
    transition: font-size 0.2s;
    /*margin-top: -0.8em;*/
}

[data-structure="field"][data-label]:hover::after {
    font-size: 0.8em;
}

[data-structure="field"][data-label] {
    padding-top: 0.8em;
    min-height: 2.5em;
    word-break: break-all;
    word-wrap: break-word;
}

/*.auto[data-structure="set"]>[data-structure="entity"] {
    margin-top: 20px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px dotted #666666;	
}*/

.auto-dataset [data-structure="set"]>[data-structure="entity"],
.auto[data-structure="set"]>[data-structure="entity"],
.auto[data-template],
.auto[data-structure="entity"] {
    margin-top: 6px;
    margin-bottom: 6px;
    padding-top: 0.8em;
    padding-bottom: 0.8em;

    padding-left: 0.5em;
    padding-right: 0.5em;

    border: 1px solid #c3c3c3;
    /*box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);*/

    transition: all 0.5s;

    border-radius: 2px;
    /*border-radius: 2em;*/

    /*    margin-top: 20px;
    margin-bottom: 20px;*/
    line-height: 1.75em;
}

.auto-dataset [data-structure="set"]>[data-structure="entity"]>[data-structure="field"],
.auto[data-structure="set"]>[data-structure="entity"]>[data-structure="field"] {
    -webkit-animation: fadein 0.5s;
    /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 0.5s;
    /* Firefox < 16 */
    -ms-animation: fadein 0.5s;
    /* Internet Explorer */
    -o-animation: fadein 0.5s;
    /* Opera < 12.1 */
    animation: fadein 0.5s;
}

[data-template].auto {
    width: 100%;
    display: flex;
}


body:not(.group_admin) [data-template-editor] {
    display: none !important;
}

[data-template-editor] {
    outline: 2px dashed var(--color-headline);
    outline-offset: -2px;
}

[data-template-editor] [data-field] {
    min-width: 3em;
}

[data-template-editor] [data-module="Placeholder"]:after {
    content: '[data-field="' attr(data-field) '"]';
    outline: 1px dotted;
    outline-offset: 0.1em;
}



@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}




.auto-dataset [data-structure="set"]>[data-structure="entity"]:hover,
.auto[data-structure="set"]>[data-structure="entity"]:hover,
[data-structure="entity"]:hover>.auto[data-template] {
    border: 1px solid var(--color-headline);
    /*box-shadow: 0px 2px 5px var(--color-highlight);*/
    transform: scaleY(-3px);
    /*box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);*/

    /*border-radius: 2px;*/

    border-radius: 2em;


}

.auto-dataset [data-structure="set"]>[data-structure="entity"]>.controller:not(:empty),
.auto[data-structure="set"]>[data-structure="entity"]>.controlle:not(:empty),
.auto[data-template]>.controller:not(:empty) {
    display: inline-block;
    flex-shrink: 0;
    /*padding-left: 0.5em;*/
    padding-right: 0.5em;
}

.auto-dataset [data-structure="set"]>[data-structure="entity"]>[data-structure="field"],
.auto[data-structure="set"]>[data-structure="entity"]>[data-structure="field"] {
    display: inline-block;
}



.hasControls {
    min-height: 40px;
}




button,
input[type="submit"] {
    background-color: transparent;
    border: 0px none;
    font-size: inherit;
    font-family: inherit;
    padding: 0px;
    margin: 0px;
    color: inherit;

    appearance: none;
    -webkit-appearance: none;

    cursor: pointer;

    position: relative;
}


.button {
    background-color: #666666;
    color: white;
    padding: 15px;
    display: inline-block;
}

.button:hover {
    background-color: var(--color-headline);
}

.button a {
    color: inherit;
    transition: inherit;
}

.button.light {
    background-color: var(--color-light);
    color: var(--color-headline);
}

.button.light:hover {
    /* background-color: var(--color-light);
    color: var(--color-headline);     */
}


#btnLoginToggle:before {
    content: "";
}



#btnNavToggle:before {
    content: "";
}

.btnNav,
#btnNavToggle,
#btnLoginToggle {
    background-color: rgba(0, 0, 0, 0.6);
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    float: right;
    margin-left: 8px;
    margin-top: 7px;
    padding: 6px;
    position: relative;
    color: white;
    font-family: "FontAwesome";
    font-size: 17px;
    width: 34px;
    cursor: pointer;
    line-height: 19px;
}






/* RESPONSIVE */



[data-module="Html"] {
    width: 100%;
}





#content:after {
    display: none;
}




html:not([data-dimension="xs"]) .onlyXS {
    display: none !important;
}

html[data-dimension="xs"] .notXS {
    display: none  !important;
}

body:not(.group_admin) .adminOnly {
    display: none;
}


body:not(.group_admin) .editor {
    display: none !important;
}




/* MENÜ */


nav ul {
    padding: 0px;
    margin: 0px;

    overflow: initial;
}


nav ul li {
    list-style: outside none none;

    float: none;
}


nav li ul {
    display: none;

}




#menu li {}

#menu ul {}




ul[data-item-direction="vertical"]>li {
    display: inline;
    float: none;
    position: relative;
}

ul[data-item-direction="vertical"]>li:after {
    content: "\a";
    white-space: pre;
    display: none;
}


ul[data-item-direction="horizontal"] {
    white-space: nowrap;
    position: relative;

    overflow: inherit;
}

ul[data-item-direction="horizontal"]>li {
    display: inline-block;
    white-space: nowrap;
    vertical-align: top;
    float: none;
}



/* VERTICAL TO HORIZONTAL */
/*[data-dimension='xs'] .auto-responsive ul[data-item-direction="horizontal"]>li {*/
[data-dimension='xs'] .auto-responsive ul>li {
    display: inline;
    float: none;
    position: relative;
}

/*[data-dimension='xs'] .auto-responsive ul[data-item-direction="horizontal"]>li:after { 
		content:"\a";
	    white-space: pre;
	}	
	*/

/*
	.col-sm-0 {
		display: none;
	}
	*/


/*
@media (max-width: 1199px)  {
	.col-md-0 {
		display: none;
	}
}


@media (min-width: 1200px)  {
	.col-lg-0 {
		display: none;
	}
}
*/



ul[data-item-position="inside"] {
    position: relative;
}

ul[data-item-position="bottom"] {
    position: absolute;
}

ul[data-item-position="top"] {
    position: absolute;
}

ul[data-item-position="left"] {
    position: absolute;
    top: 0px;
    right: 100%;
    display: inline;


}

ul[data-item-position="right"] {
    position: absolute;
    top: 0px;

    left: 100%;
    /* ??? */

    display: inline;
}



#menu>ul>li {
    margin-left: 20px;

}











.draggable_accepting {
    /* outline: solid 5px blue;	*/
    position: relative;
    outline: 2px solid #333333;
    outline-style: inset;
}

.draggable_accepting::after {
    font-family: "FontAwesome";
    content: "";
    right: 0px;
    bottom: 0px;
    line-height: 100vw;
    font-size: 50vw;
    position: absolute;
    top: 0px;
    left: 0px;

    color: #333333;
    background-color: rgba(255, 255, 255, 0.8);
    text-align: center;
    display: inline-block;

}

.draggable_hovering {
    /* outline: solid 8px red;		*/
}

.draggable_hovering::after {
    background-color: rgba(0, 0, 0, 0.9);
    color: white;
}


.ui-sortable .dragHandle {
    cursor: grab;
}

.ui-sortable.dragHandleChildren>[data-structure="entity"] {
    cursor: grab;
}




/*

NOT WORKING, SCROLLS TO TOP

body.showingDialog{
    overflow: hidden !important;
    height: 100vh !important;
}

*/


.modalBG {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0, 0, 0, 0.75);

    z-index: 1000;

    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;

    justify-content: center;

    padding: 15px;

}

.scroll_bg .modalBG {
    overflow: auto;
}

.transparent_bg .modalBG {
    background-color: transparent;
}

.transparent_panel .modalPanel {
    background-color: transparent;
}



.modalPanel {
    display: inline-block;
    position: relative;
}

.modalPanel {
    /*padding-bottom: 93px;*/
    background-color: white;

}

.scroll_panel .modalPanel {
    overflow: auto;
    width: 80vw;
    /* default, can be overwritten */
    height: 80vh;
    /* default, can be overwritten */
    background-color: white;
    padding: 20px;
}


.galleryDialog .modalPanel {
    /*background-color: transparent;*/
    background-color: white;
    overflow: visible;
}

.galleryDialog [data-module="Picture"]>picture>img {
    object-fit: contain;
}



.message .modalPanel {
    max-width: 40em;
}


.message .modalPanel {

    /* padding: 2em; */

    text-align: center;
    /* webkit-box-shadow: 2px 2px 11px 2px rgba(0,0,0,1);
    -moz-box-shadow: 2px 2px 11px 2px rgba(0,0,0,1);
    box-shadow: 2px 2px 11px 2px rgba(0,0,0,1);
    z-index: 0; */
}

.message .modalButtons {

    text-align: center;
}

.messagePanel {

    max-height: 80vh;
    overflow-y: auto;

    /* background-color: white;    */
    padding: 2em;

    text-align: center;
    /* webkit-box-shadow: 2px 2px 11px 2px rgba(0,0,0,1);
    -moz-box-shadow: 2px 2px 11px 2px rgba(0,0,0,1);
    box-shadow: 2px 2px 11px 2px rgba(0,0,0,1); */

    z-index: 0;
}

.modal .title {
    font-weight: bold;
    font-size: 130%;
}



/*
.modalPanel>div:first-child {
	overflow: auto;
	height:100%;
	
}*/



.modalButtons {
    /*position: absolute;*/
    /*bottom: 0px;*/
    text-align: right;
    /*background-color: white;*/
    /*width:100%;*/
    right: 0px;
    /*padding-right:5vw;*/
}

.messagePanel .modalButtons {
    text-align: center
}

.modalButtons button {
    /*	background-color: #666666;*/
    background-color: var(--color-main);
    color: white;
    padding: 15px;
    /*margin: 20px;*/
    margin-left: 10px;
    margin-right: 10px;
}

.modalButtons button:hover {
    background-color: var(--color-headline);
}

.closingCross {
    position: absolute;
    top: 16px;
    right: 20px;
    font-size: 22px;
    cursor: pointer;
    color: #9a9a9a;
}

.closingCross:hover {
    color: black;
}




[data-header="false"]>.DisplaySet_Header {
    display: none;
}

.DisplaySet_Header {
    padding: 15px;
    position: relative;

    z-index: 10;
    background-color: var(--color-main);
    /* background-color: var(--color-headline); */
    border-radius: 2px;
    color: white;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);

    flex-basis: 100%;
}


.DisplaySet_Header .filterInput {
    color: var(--color-main);

}

.DisplaySet_Header .filterInput input {
    /*color: var(--color-main);*/
}

.DisplaySet_Header .filterInput .icon {
    color: var(--color-main);
}





.DisplaySet_Header>li {
    display: inline-block;
}


.DisplaySet_Header .icon {
    color: white;
}

.auto-dataset [data-structure="set"][data-columns] .DisplaySet_Header,
ul.auto[data-structure="set"][data-columns] .DisplaySet_Header {
    /*padding-left: 0px;*/
    padding-left: 0.5em;
    padding-right: 0px;
}

.auto-dataset [data-structure="set"][data-columns] .DisplaySet_Header .title,
ul.auto[data-structure="set"][data-columns] .DisplaySet_Header .title {
    display: none;
}

.auto-dataset [data-structure="set"][data-columns] [data-structure="entity"],
/* ul.auto[data-structure="set"][data-columns] [data-structure="entity"], */
ul.auto[data-structure="set"][data-columns] .DisplaySet_Header,
.auto [data-structure="entity"] {
    display: flex;
    flex-direction: row;
}

[data-columns] [data-structure="field"],
.auto-dataset [data-structure="set"] [data-structure="field"],
/* ul.auto[data-structure="set"][data-columns] [data-structure="field"], */
.auto [data-structure="field"],
.auto-item {
    /*flex-grow:1;*/
    flex-shrink: 1;
    /* needed for same size */
    /*width: 100%;*/
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding-right: 0.3em;
    padding-left: 0.3em;
}

.auto-dataset .DisplaySet_Header [data-column-field],
.auto .DisplaySet_Header [data-column-field] {
    flex-grow: 1;
    flex-shrink: 1;
    width: 100%;
    /* needed for same size */
    white-space: nowrap;
    /*overflow: visible;*/
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1.75em;
}

[data-structure="set"] .DisplaySet_Header>.controller {
    opacity: 1;
    flex-shrink: 0;
}

.DisplaySet_Header>.controller .counter {
    background-color: white;
    color: var(--color-main);
    display: inline-block;
    padding-left: 0.8em;
    padding-right: 0.8em;
    border-radius: 1em;
    /*margin-top: 0.3em;*/

    transform: scale(0.8);
    line-height: 1.75em;
}



[data-structure="set"].collapsed>*:not(.DisplaySet_Header) {
    display: none !important;
}


[data-structure="set"].streaming>[data-structure="entity"] {
    height: var(--streamingHeight);
}





/* -----------------  GALLERY  -------------------- */

[data-structure="set"].style_tiles {
    line-height: 0px;
    /* Sonst gibt es Abstand zwischen den Reihen */
}

[data-structure="set"].style_tiles>[data-structure="entity"] {
    display: inline-block;
    /* shrink to fit */
    width: 25%;
    /* whatever width you like */
    position: relative;
    /* so preview image can use position: absolute */
    line-height: inherit;
}


[data-structure="set"].style_tiles>[data-structure="entity"]::after {
    padding-top: 100%;
    /* percentage of containing block _width_ */
    display: block;
    content: '';
    /* background-color: red; */
}


[data-structure="set"].style_tiles>[data-structure="entity"]>.preview {
    position: absolute;
    /* top: 15px; bottom: 15px; right: 15px; left: 15px; /* follow the parent's edges */
    top: 0px;
    bottom: 0px;
    right: 0px;
    left: 0px;
    /* follow the parent's edges */
    outline: 3px solid white;
    /* just so you can see the box */
    overflow: hidden;

    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}








.TabContainer {
    padding: 0px;
    border: 0px none;
    border-radius: 0px;
}

.TabContainer>ul.container_titles {
    padding: 0px;
    border: 0px none;
    border-radius: 0px;
}

.TabContainer>ul.container_titles>li {
    margin-bottom: 0px;
    padding-bottom: 0px;
    border: 0px none;
    border-radius: 0px;
}

.TabContainer.DraggablePanel {
    z-index: 100;
}




/*
[data-module="Container"][class*="gridrows-"] [data-module="ContainerItem"]>* {
	position: absolute; top:0px; left:0px; right:0px; bottom:0px; 
};
*/

[data-module="Container"][data-frame="grid"] [data-module="ContainerItem"] {
    position: absolute;
}

[data-module="Container"][data-frame="grid"] [data-module="ContainerItem"]>* {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}


.container {
    margin-left: auto;
    margin-right: auto;
    /*
    padding-left: 15px;
    padding-right: 15px;    
    */
    position: relative;
}

[data-module="Container"]>div {
    /*	overflow-x: hidden;	*/
    /*overflow: hidden;*/
}

.row {
    /*
    margin-left: -15px !important;
    margin-right: -15px !important;
    */
    /*overflow: hidden;*/
    position: relative;
}

.row:after {
    clear: both;
}

.row>* {
    min-height: 1px;
    position: relative;
    /*float: left;*/
}

.padding-left {
    padding-left: calc((100vw - 100rem) / 2) !important;
}

.padding-right {
    padding-right: calc((100vw - 100rem) / 2) !important;
}

.gap [data-module="Container"]:not(.noGap)>div>.row,
.gap [data-module="Container"]:not(.noGapContainer)>div>.row,
.gapContainer [data-module="Container"]:not(.noGap)>div>.row,
.gapContainer [data-module="Container"]:not(.noGapContainer)>div>.row,
.gap[data-module="Container"]>div>.row,
.gapContainer[data-module="Container"]>div>.row {
    margin: calc(var(--gap-container) * -0.5);
}

/*[data-module="Container"]:not(.noGap)>div>.row>*  */
.gap [data-module="Container"]:not(.noGap)>div>.row>*,
.gap [data-module="Container"]:not(.noGapContainer)>div>.row>*,
.gapContainer [data-module="Container"]:not(.noGap)>div>.row>*,
.gapContainer [data-module="Container"]:not(.noGapContainer)>div>.row>*,
.gap[data-module="Container"]>div>.row>*,
.gapContainer[data-module="Container"]>div>.row>* {
    padding: calc(var(--gap-container) * 0.5);
}


/*
	allStyles += ':root { --gap: ' + responsive_Border + 'px }\n';	
	allStyles += ':root { --gap-container: ' + responsive_Border + 'px }\n';	
	allStyles += ':root { --gap-row: ' + responsive_Border + 'px }\n';	

*/


.paddingless {
    padding-left: 0px;
    padding-right: 0px;
}

.gap [data-module="Container"]:not(.noGapRow),
.gapRow [data-module="Container"]:not(.noGapRow),
.gap[data-module="Container"],
.gapRow[data-module="Container"] {
    padding-top: calc(var(--gap-row) * 0.5);
    padding-bottom: calc(var(--gap-row) * 0.5);
}




.sameChildHeight {
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;

    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;

}

.sameChildHeight>[data-module="ContainerItem"]:not(.vertical-align)>* {
    height: 100%;
}

/*[data-module="Container"].sameChildHeight .row {*/
[data-module="Container"]>div>.row {
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;

    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
}

[data-module="ContainerItem"].remainingWidth {
    flex-basis: 1%;
    width: auto !important;
    flex-shrink: 1;
    flex-grow: 1;
}

[data-module="ContainerItem"].contentWidth {
    width: auto !important;
    flex-shrink: 0;
    flex-grow: 0;
}


*,
::before,
::after,
input[type="search"] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*,
::before,
::after {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


[format-align="center"] {
    display: flex;
    display: -webkit-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;

    align-items: center;

}

.center-vertical {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.center {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}


.line {
    position: relative;
    margin-right: auto;
    margin-left: auto;
    height: 2em;

}

.line::after {
    content: '';
    width: 100%;
    position: absolute;
    left: 0px;
    top: 50%;
    border-bottom: 1px dotted;
}



.layout-height-provider {
    display: flex;
    flex-flow: column;
}

.layout-height-provider>.layout-height-consumer {
    flex: 2;
    overflow: auto;
}




[data-ratio] {
    position: relative;
    height: auto !important;
}

[data-ratio]:before {
    content: "";
    display: block;
    padding-top: 100%;
    /* initial ratio of 1:1*/

    padding-top: var(--ratio);
}



[data-ratio]>* {
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
}

[data-module="Container"][data-ratio]>.container>.row {
    height: 100%;
}


/*

BADLY SUPPORTED, SPEED?

[style*="--aspect-ratio"] {
	height: auto !important;
        height: unset !important;
}


[style*="--aspect-ratio"] > :first-child {
  width: 100%;
}
[style*="--aspect-ratio"] > img {  
  height: auto;
} 

@supports (--custom:property) {
  [style*="--aspect-ratio"] {
    position: relative;
  }
  [style*="--aspect-ratio"]::before {
    content: "";
    display: block;
    padding-bottom: calc(100% / (var(--aspect-ratio)));
  }  
  [style*="--aspect-ratio"] > :first-child {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }  
}

*/


/* FULL HEIGHT BUT SQUARE WHEN WIDER THAN LARGE */
/* OVERWRITE IF OTHER SETTINGS NEEDED */
.fullViewHeight {
    height: 100vh;
}

@media (max-aspect-ratio: 1/1) {
    .fullViewHeight {
        min-height: 100vw;
        height: auto;
    }
}



.square:before {

    content: "";
    display: block;
    padding-top: 100%;
    /* initial ratio of 1:1*/

}

.square {
    /*	position: relative; 
    vertical-align: top;
	
	*/

}



.half:before {
    content: "";
    display: block;
    padding-top: 50%;
    /* initial ratio of 1:1*/
}



.noBreak {
    white-space: nowrap;
}

.noBreak:after {
    white-space: normal;
    content: " ";
    width: 0px;
    height: 0px;
}


.break {
    width: 100% !important;
    height: 0px !important;
    padding: 0px !important;
    margin: 0px !important;
    display: block;
    clear: both;
    overflow: hidden !important;
}



[data-module="ContainerItem"].vertical-align {
    display: -webkit-flexbox !important;
    display: -ms-flexbox !important;
    display: -webkit-flex !important;
    display: flex !important;
    -webkit-flex-align: center !important;
    -ms-flex-align: center !important;
    -webkit-align-items: center !important;
    align-items: center !important;

}

[data-module="ContainerItem"].vertical-align>* {
    width: 100%;
}

.centerVertical {
    top: 50%;
    transform: translate(0%, -50%);
    /*position: absolute;*/

}

.centerHorizontal {
    left: 50%;
    transform: translate(-50%, 0%);
    /*position: absolute;*/
}





/*
 TABLES NOT WORKING WITH RESPONSIVE FLOATING
 USE JS INSTEAD
 
.sameChildHeight {
	display: table;	
}
.sameChildHeight>*>* {
	display: table-cell;
	float: none;	
	vertical-align: middle;
}
*/




[data-type="textarea"] {
    white-space: normal;
    min-height: 5em;
}




/*.extension[class~=ext-] {*/
.extension {
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-image: url(icons-extensions/unknown.png);

    /* Hide the text. */
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}


.extension.ext-css {
    background-image: url(icons-extensions/css.png);
}

.extension.ext-cvs {
    background-image: url(icons-extensions/cvs.png);
}

.extension.ext-doc {
    background-image: url(icons-extensions/doc.png);
}

.extension.ext-docx {
    background-image: url(icons-extensions/docx.png);
}

.extension.ext-exe {
    background-image: url(icons-extensions/exe.png);
}

.extension.ext-flv {
    background-image: url(icons-extensions/flv.png);
}

.extension.ext-folder {
    background-image: url(icons-extensions/folder.png);
}

.extension.ext-gif {
    background-image: url(icons-extensions/gif.png);
}

.extension.ext-htm {
    background-image: url(icons-extensions/htm.png);
}

.extension.ext-html {
    background-image: url(icons-extensions/html.png);
}

.extension.ext-jpg {
    background-image: url(icons-extensions/jpg.png);
}

.extension.ext-js {
    background-image: url(icons-extensions/js.png);
}

.extension.ext-mov {
    background-image: url(icons-extensions/mov.png);
}

.extension.ext-mp3 {
    background-image: url(icons-extensions/mp3.png);
}

.extension.ext-mp4 {
    background-image: url(icons-extensions/mp4.png);
}

.extension.ext-pdf {
    background-image: url(icons-extensions/pdf.png);
}

.extension.ext-php {
    background-image: url(icons-extensions/php.png);
}

.extension.ext-png {
    background-image: url(icons-extensions/png.png);
}

.extension.ext-tif {
    background-image: url(icons-extensions/tif.png);
}

.extension.ext-txt {
    background-image: url(icons-extensions/txt.png);
}

.extension.ext-unknown {
    background-image: url(icons-extensions/unknown.png);
}

.extension.ext-wav {
    background-image: url(icons-extensions/wav.png);
}

.extension.ext-xls {
    background-image: url(icons-extensions/xls.png);
}

.extension.ext-xlsx {
    background-image: url(icons-extensions/xlsx.png);
}

.extension.ext-xml {
    background-image: url(icons-extensions/xml.png);
}

.extension.ext-zip {
    background-image: url(icons-extensions/zip.png);
}


.hideEmpty[data-field][data-value="0"],
.hideEmpty[data-field]:not([data-value]),
.hideEmpty[data-field][data-value=""] {
    display: none !important;
}

.hideEmpty [data-field][data-value="0"],
.hideEmpty [data-field]:not([data-value]),
.hideEmpty [data-field][data-value=""] {
    display: none;
}

[data-template-editor] .hideEmpty [data-field][data-value="0"],
[data-template-editor] .hideEmpty [data-field]:not([data-value]),
[data-template-editor] .hideEmpty [data-field][data-value=""] {
    display: inline-block;
}

/* IF CLASS defineEmpty IS GIVEN, THIS ELEMENT'S VALUE DEFINES 
IF SUCCESSORS WITH hideByEmpty AND showByEmpty ARE VISIBLE */
.defineEmpty[data-value="0"]~.hideByEmpty,
.defineEmpty:not([data-value])~.hideByEmpty,
.defineEmpty[data-value=""]~.hideByEmpty {
    display: none;
}

.defineEmpty[data-value]:not([data-value="0"]):not([data-value=""])~.showByEmpty {
    display: none;
}



.printOnly {
    display: none !important;
}

/* page break not working in FireFox inside Table! */
/*
.pageBreak {
    position: relative !important;
    page-break-after: always !important;
    border-bottom: 1px dotted black;            
}
*/

@media print {
    .noPrint {
        display: none !important;
    }

    .printOnly {
        display: block !important;
    }

    .container {
        width: 95% !important;
    }
}


button:focus {
    outline: 0;
}

/* chrome */


@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}














/*    NODES     */


.nodeButton {
    display: inline-block;
    height: 100%;
    color: gray;
    /* COLOR OF LINES! */
    font-size: 80%;
    padding-right: 10px;
}

.nodeButton:before {
    /* BACKGROUND FOR BUTTONS TO PREVENT LINES SHOWING THROUGH */
    position: absolute;
    color: white;
    z-index: -1;
    font-size: 80%;
}

.nodeButton .nodeButtonLines {
    position: absolute;
    height: 100%;
    pointer-events: none;
    z-index: -2;
}

[data-structure="entity"] .nodeButton .lineToNext {
    content: ' ';
    width: 0px;
    position: absolute;
    bottom: -0.75em;
    top: 0.75em;
    left: 0.35em;
    border-left: 1px dotted;
    /*margin-bottom: -20px;  = NEGATIVE MARGIN OF ENTITY! */
    margin-bottom: -10px;
}

[data-structure="entity"]:last-child>.nodeButton .lineToNext {
    display: none;
}

[data-structure="entity"] .nodeButton .lineToPrevious {
    content: ' ';
    width: 0px;
    position: absolute;
    /*padding-top: 20px;           = MARGIN OF ENTITY! */
    padding-top: 10px;
    /* = MARGIN OF ENTITY! */
    padding-bottom: 0.75em;
    /*margin-top: -20px;           = NEGATIVE MARGIN OF ENTITY! */
    margin-top: -10px;
    /* = NEGATIVE MARGIN OF ENTITY! */
    top: 0px;
    left: 0.35em;
    border-left: 1px dotted;
}

[data-structure="set"]>[data-structure="entity"]+[data-structure="entity"]>.nodeButton .lineToPrevious {
    display: none;
    /*  HIDE LINE IF NOT FIRST ENTITY ELEMENT */
}

.nodeButton .lineToElement {
    content: ' ';
    height: 0px;
    position: absolute;
    /*top: 15px;*/
    top: 8px;
    left: 0.5em;
    border-top: 1px dotted;
    width: 11.5em;
}

.nodeButton [data-icon] {
    display: none;
    color: black;
    /* COLOR OF BUTTON */
    cursor: pointer;
    font-size: 80%;
}


.nodeButton[data-currentState="shown"] [data-icon].btnShow {
    display: inline-block;
}

.nodeButton[data-currentState="hidden"] [data-icon].btnHide {
    display: inline-block;
}

.nodeButton[data-currentState]:hover [data-icon] {
    display: none;
}

.nodeButton[data-nextState="shown"]:hover [data-icon].btnShow {
    display: inline-block;
}

.nodeButton[data-nextState="hidden"]:hover [data-icon].btnHide {
    display: inline-block;
}



.nodeButton[data-count="0"] [data-icon] {
    display: none !important;
}

.nodeButton[data-count="loading"] [data-icon] {
    display: none !important;
}

.nodeButton[data-count="loading"] [data-icon].btnLoading {
    display: inline-block !important;
}

.nodeButton[data-count="0"] [data-icon].btnEmpty {
    display: inline-block !important;
}


.noNodeLines[data-structure="set"]>[data-structure="entity"]>.nodeButton .lineToPrevious {
    display: none;
}

.noNodeLines[data-structure="set"]>[data-structure="entity"]>.nodeButton .lineToNext {
    display: none;
}


.nodeButton[data-count="loading"] [data-icon].btnLoading {
    transition-property: transform;
    transition-duration: 1s;

    animation-name: rotate;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


.ui-sortable {
    transition: min-height 0.5s;
    min-height: 0em;
}

.ui-sortable-helper {
    transition: none !important;
}


.draggingArrangeable *:hover>*>*>.ui-sortable {
    transition: min-height 0.5s;
    min-height: 3em;
}


.draggingArrangeable [data-structure="entity"]:hover {
    /*background-color: blue;*/

}


.ui-sortable-helper {
    pointer-events: none;
    display: inline-block;
    width: auto !important;
    height: auto !important;
    box-shadow: 2px 3px 19px -5px rgba(0, 0, 0, 0.75);
}

.ui-sortable-helper [data-structure="set"] {
    display: none;
}

.ui-sortable-helper .controller,
.ui-sortable-helper .nodeButton {
    display: none;
}

.ui-arrangeable-placeholder {
    /*height: 0.5em;*/
    min-height: 2em;
    font-size: 2em;
    line-height: 2em;
    list-style: outside none none;

    /*line-height: 1.2em;*/
    position: relative;
    padding: 0px;
    margin: 0px;
    background-color: rgba(1, 1, 0, 0.26);

    /*transition: height 0.5s;*/
}

/*.ui-arrangeable-placeholder:hover { 
    height: 2em; 
    
  
}*/


.ui-arrangeable-placeholder:before {
    font-family: "FontAwesome";
    content: "";
    right: 0px;
    bottom: 0px;
    /*line-height: 3em;*/
    vertical-align: middle;


    position: absolute;
    top: 0px;
    left: 0px;
    color: #333333;
    text-align: center;
    display: inline-block;
}



[data-icon="0"]::before {
    content: '\f0c8'
}

[data-icon="1"]::before {
    content: '\f14a'
}

*>.showOnParentHover {
    opacity: 0;
}

*:hover>.showOnParentHover {
    opacity: 1;
}

* {
    background-repeat: no-repeat;
}



[data-view="users_account"][data-field="salt"] {
    display: none;
}



.tox-tinymce {
    /*z-index: 1399;*/
    z-index: 1299;
}


.tinymce-fullscreen-inline {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    max-height: 100vh !important;
    /*z-index: 99!important;*/
    padding: 2% !important;
    overflow: auto !important;
    background-color: white;
}

.mce-edit-focus .enhancement_sub,
.mce-edit-focus .enhancement {
    opacity: 0.2 !important;
}





/*   PRESETS */
h1 {
    color: var(--color-headline);
    font-size: 2em;
}

h2 {
    color: var(--color-headline);
    font-size: 1.5em;
    font-weight: bold;
}

h3 {
    color: var(--color-headline);
    font-size: 1.2em;
    font-weight: bold;
}

h4 {
    color: var(--color-main);
    font-size: 1em;
    font-weight: bold;
}

.module_Background {
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}


.bg_inverse,
.bg_main {
    color: white;
    background-color: var(--color-main);
}

.bg_inverse h1,
.bg_inverse h2,
.bg_inverse h3,
.bg_inverse h4,
.bg_inverse a,
.bg_inverse a:hover {
    color: inherit;
}


.bg_highlight {
    color: white;
    background-color: var(--color-highlight);
}

.highlight {
    color: var(--color-highlight);
}

.bg_light {
    color: var(--color-main);
    background-color: var(--color-light);
}

.bg_headline {
    color: white;
    background-color: var(--color-headline);
}

.bg_headline h1,
.bg_headline h2,
.bg_headline h3 {
    color: inherit;
}



:root {
    --col-width: 10em;
}


.col-width {
    display: inline-block;
    width: var(--col-width);
}




/*[data-structure="field"][data-type="boolean"]{
    font-family: "FontAwesome";
}*/
/*

[data-structure="field"][data-type="boolean"]:after{
    visibility: visible;
    content: "\f046";
    font-family: "FontAwesome";
}
[data-structure="field"][data-type="boolean"][data-value="0"]:after {
    content: "\f096";
}

*/





/*  ------------ ANIMATIONS ------------------- */

/**

.flyin {
    background-color: rgba(255, 255, 255, 0.5);
    padding: 4em;
    padding-left: 10%;
    padding-right: 10%;
    margin-top: 8em;
    margin-bottom: 8em;    
    
    transition: left 1s ease-out, margin-right 1s ease-out, opacity 1s;
}

.flyin[clicked="true"] {
    opacity: 0;    
}      

.decor:nth-of-type(even)  .flyin {
    left: -30%;
}

.decor:nth-of-type(even) .flyin[data-animationviewvisible="true"] {
    left: 0%;
}


.decor:nth-of-type(odd) .flyin {
    margin-right: -30%;
    float: right;
}

.decor:nth-of-type(odd) .flyin[data-animationviewvisible="true"] {
    margin-right: 0%;
}


.flyinBottom {
    bottom: -10rem;
    transition: bottom 1s ease-out;

}

.flyinBottom[data-animationviewvisible="true"] {
    bottom: 0rem;
}

*/



body:not(.notAtTop) .showWhenNotAtTop {
    /*display: none;*/
    opacity: 0;
}

body.notAtTop .showWhenAtTop {
    /*display: none;*/
    opacity: 0;
}

body.notAtTop .hideWhenNotAtTop {
    /*display: none;*/
    opacity: 0;
}

body:not(.notAtTop) .hideWhenAtTop {
    /*display: none;*/
    opacity: 0;
}



[data-show-if-full-ds] {
    display: none !important;
}

[data-show-if-empty-ds] {
    display: none !important;
}

body.group_admin [data-show-if-full-ds] {
    display: block !important;
    opacity: 0.5;

}

body.group_admin [data-show-if-empty-ds] {
    display: block !important;
    opacity: 0.5;
}





.fill {
    position: absolute;
    height: 100%;
    /* overwritten by xs */
    width: -moz-available;
    /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available;
    /* Mozilla-based browsers will ignore this. */
    width: fill-available;
    top: 0px;
    --gap-container: 0px;
}

.fill>* {
    position: absolute;
    height: 100%;
    width: 100%;
    width: -webkit-fill-available;
    width: fill-available;
    top: 0px;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

/*
.fill>.row>[data-module="ContainerItem"] {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;    
}
*/
.fill.container>.row {
    width: calc(var(--width-content) + var(--gap-container));
}

.container {
    /* better than 'margin:auto', also supports position: absolute */
    margin-right: var(--width-margin);
    margin-left: var(--width-margin);
}





[data-module="Container"].expanded {
    /*display: flex;*/
    background-color: rebeccapurple;
}

[data-module="Container"].expanded>div {
    position: relative;
    min-height: 500px;
    outline: 5px solid blue;
    transform: scale(1);
    margin-top: 0px;
    margin-bottom: 0px;
    z-index: auto;
}

[data-module="Container"].expanded>div>div {
    margin-top: 0px;
    margin-bottom: 0px;
}

[data-module="Container"].expanded>.fix>div {
    height: 500px !important;
}



/* PARALLAX BACKGROUND */
/* !!! NOT WORKING IF PARENTS USE TRANSFORM!  */

.fix {
    position: absolute;
    clip: rect(0, auto, auto, 0);
    overflow: hidden;
    height: 100%;
    width: 100%;
}

.fix.container {
    /* ADD MARGIN TO CLIP IF ROW USES MARGINS */
    /*clip: rect(0px, auto, auto, calc( -1 * var(--width-margin)));*/
    /* clip: rect(0px, calc( var(--width-content) + 0.5 * var(--gap-container) ), auto, calc( -1 * var(--width-margin))); /* apply margin */
    clip: rect(0px, 100vw, auto, calc(-1 * var(--width-margin)));
    /* full width */
}



.fix>* {
    position: fixed !important;
    height: 100%;

    /* HEIGHT IS SET DYNAMICALLY BY OBSERVER OF PARENT */

    height: calc(var(--outer-height) + var(--offset-top));

    max-height: 100vh;
    /*width: 100%;*/
    padding: 0px;

    top: 0px;
}

/* SAFARI BUG, NOT SHOWING PARALLAX PICTURES */
/* Safari 7.1+ */
_::-webkit-full-page-media .fix>*,
_:future .fix>*,
:root .fix>* {
    position: relative !important;
    height: 100%;
}

_::-webkit-full-page-media .fix,
_:future .fix,
:root .fix {
    clip: unset;
}


/* DISABLE PARALLAX IN INTERNET EXPORER AND OLD EDGE*/
@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .fix>* {
        position: absolute !important;
        height: 100% !important;
        max-height: none !important;
    }
}

@supports (-ms-ime-align:auto) {
    .fix>* {
        position: absolute !important;
        height: 100% !important;
        max-height: none !important;
    }
}


/*.fixed *{

    top: 0px !important;
    left: 100px !important;
    height: 1000px !important;
    max-height: 1000px !important;


}*/






.layer.background {
    /*z-index: -1;*/
    --gap-container: 0;
}

.layer.background [data-module="ContainerItem"] {
    /*    padding: 0px !important;
    padding: 0px;*/
    height: 100%;
}



[data-module="Container"][observed-visible="true"] {
    transform: unset !important;
}

#content [data-module="Container"] {
    position: relative;
}







/* SCROLLER */


.scroller_panel[data-presentation="scroller"] {
    /*overflow: hidden;*/
    overflow-x: scroll;
    flex-wrap: nowrap !important;
    display: flex;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.scroller_panel[data-presentation="scroller"]::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.scroller_panel[data-presentation="scroller"] {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}



.scroller.scroller_expanded .scroller_panel[data-presentation="scroller"] {
    flex-wrap: wrap !important;
    overflow: visible;
}



.scroller_panel[data-presentation="scroller"]>* {
    flex-shrink: 0;
    flex-grow: 0;
    /*display: inline-block;*/
}


.scroller_btn {
    cursor: pointer;
    height: 100%;
    font-size: 2em;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;

    top: 0px;
    z-index: 1;

    width: auto;
}

.scroller_btn>div {
    transition: color 0.3s, transform 0.3s;
}

.scroller_btn:hover>div {
    transform: scale(1.5);
    color: var(--color-headline);
}


.scroller_btnLeft {
    margin-left: calc(var(--gap) / 2);
    left: 0px;
}

.scroller_btnRight {
    margin-right: calc(var(--gap) / 2);
    right: 0px;
}

.scroller_btnExpand {
    margin-right: calc(var(--gap) / 2);
    right: 0px;
    top: 1.5em;
    height: auto !important;
}

.scroller_expanded .scroller_btnExpand>div::before {
    content: '\f066';
    content: '\f0dc';
    transform: rotate(90deg);
}

.scroller_expanded .scroller_btnLeft {
    display: none;
}


.scroller_expanded .scroller_btnRight {
    display: none;
}


.scroller_panel[data-presentation="scroller"] {
    margin-left: 3.5em;
    margin-right: 3.5em;
    /* padding: 1.5em !important; */
    padding-top: 1.5em;
    padding-bottom: 1.5em;
}


.scroller[data-scroller-animation="fade"] .scroller_panel {
    /*flex-direction: column-reverse;*/
}

.scroller[data-scroller-animation="fade"] [data-module="ContainerItem"] {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}

.scroller[data-scroller-animation="fade"] [data-module="ContainerItem"] {
    transition: all 3s;
}

.scroller[data-scroller-animation="fade"] [data-module="ContainerItem"][data-scroller-seen] {
    opacity: 0;
    transform: scale(1.5);
}


/* Gallery */

[data-structure='set'] [data-view='pictures'][data-structure='entity'] {
    /* border-radius: 20px; */
    width: 50%;
    height: 44rem;
    padding: 2em;
    display: inline-block;
    cursor: pointer;
    overflow: hidden;
    outline: 2px solid white;
    /* outline-offset: 0px; */
}


html.width-md [data-structure='set'] [data-view='pictures'][data-structure='entity'] {
    width: 32.3rem;
    height: 32.3rem;
    padding: 2em;
    display: inline-block;
}


html.width-lg [data-structure='set'] [data-view='pictures'][data-structure='entity'] {
    width: 24.5rem;
    height: 24.5rem;
    padding: 2em;
    display: inline-block;
}

html.width-lg .scroller_expanded [data-structure='set'] [data-view='pictures'][data-structure='entity'] {
    width: 17.5rem;
    height: 17.5rem;
    padding: 2em;
    display: inline-block;
}


[data-view='pictures'][data-field='image'] {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    margin: 0;
}

[data-view='pictures'][data-structure='entity'] {
    transition: all 0.5s;
}

[data-structure='set'] [data-view='pictures'][data-structure='entity']:hover {
    z-index: 10;
    box-shadow: 5px 4px 14px black;
    transform: scale(1.05);
}

[data-view='pictures'][data-structure='entity']:hover [data-field='title'] {
    margin-top: 0%;
}





/* Selections */

.s-headline-color .selected {
    color: var(--color-headline);
}

.expandable {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.3s cubic-bezier(0, 1, 0, 1), opacity 0.3s;
}

.expandable.selected {
    max-height: 9999px;
    opacity: 1;
    transition: max-height 0.3s cubic-bezier(1, 0, 1, 0), opacity 0.3s;
}

.rotatable_icon:before {
    transition: transform 0.3s;
}


.rotatable_icon.selected:before {
    transform: rotate(90deg);
}

.hideable.selected {
    display: none;
}

.showable:not(.selected) {
    display: none;
}


/**>.expandable{
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.3s cubic-bezier(0,1,0,1), opacity 0.3s;
}

*.expanded>.expandable{
    max-height: 9999px;
    opacity: 1;
    transition: max-height 0.3s cubic-bezier(1,0,1,0), opacity 0.3s;
}

*>.rotatable_icon:before{
    transition: transform 0.3s;
}


*.expanded>.rotatable_icon:before{
    transform: rotate(90deg);
}*/



/* REPAIR FONTAWESOME */

[data-icon=""]:before {
    content: "\f2f6";
}

[data-icon=""]:before {
    content: "\f2f5";
}

[data-icon=""]:before {
    content: "\f2f5";
}

[data-icon=""]:before {
    content: "\f2f5";
}

[data-icon=""]:before {
    content: "\f304";
}

[data-icon=""]:before {
    content: "\f14a";
}

[data-icon=""]:before {
    content: "\f0c8";
}




.controllerHidden {
    position: absolute;
    white-space: nowrap;
    display: inline-block;
    /*opacity: 0 !important;*/
    max-width: 0;
    overflow: hidden;
    transition: all 0.5s;
    /*transition: max-width 0.5s, padding-left 0.5s, padding-right 0.5s;*/
    /*padding: inherit;*/
    padding-top: inherit;
    padding-right: inherit;
    padding-left: 0px;
    padding-right: 0px;

    left: 0px;
    top: 0px;
    height: 100%;
    /* background-color: var( --color-headline ); */
    background-color: var(--color-highlight);

    color: transparent;
}


*:hover>.controllerHidden {
    /* padding-left: inherit;
    padding-right: inherit; */

    padding-left: 0.1em;
    padding-right: 0.1em;

    max-width: 500px;
    /*max-width: 2.9em;*/
}

.controllerHidden>.showOnHoverParent {
    max-width: 10em;
    color: white;
    opacity: 1;
}



.controllerHidden>* {
    max-width: 0;
    padding-left: 0px;
    padding-right: 0px;
    transition: max-width 0.5s 0.1s, padding-left 0.25s, padding-right 0.25s, color 0.5s;
    /*opacity: 0;*/

    /*    max-width: 500px;    */
}





.controllerHidden:hover {
    max-width: 500px;
    color: var(--color-main);
}

.controllerHidden:hover>.showOnHoverParent {
    max-width: 0px;
    padding: 0px;
    color: transparent;
}




.controllerHidden:hover>* {
    max-width: 100px;
    padding-left: 0.25em;
    padding-right: 0.25em;
    /*opacity: 1;*/
}

.tabs-controller {
    /*padding: 0px;*/
    background-color: #eeeeee;
    padding-left: 25px;
    padding-right: 40px;
    color: var(--color-main);
    /*overflow: hidden;   NEEDED FOR FLOAT */
}


.tabs-controller>.controller {
    opacity: 1;
}


.tabs-controller>.controller {
    /*background-color: #666666;*/
    background-color: var(--color-main);
    color: white;

    text-overflow: ellipsis;
    overflow: hidden;
    /*padding-right: 3em !important;*/
    max-width: 100%;
    cursor: pointer;
    /*color: black;*/
    /*    padding-top: 0.8em;
    padding-bottom: 0.3em;*/
    /*float: left;*/
    display: inline-block;
    padding: 0.65em 1em;
    text-decoration: none;
    transition: 0.5s;

    outline: 1px solid #ffffff1f;
    outline-offset: 0px;
}


/* ADMIN */

.tabs-controller {
    /*background-color: white;*/
}

#main_container .scroller_panel {
    box-shadow: 0px 0px 41px -4px rgba(0, 0, 0, 0.5);
    padding: 2em;
    height: 100%;
    transition: box-shadow 1s;
}

#main_container .scroller_panel:hover {
    box-shadow: 0px 0px 41px -4px rgba(0, 0, 0, 1);
}


#main_container .scroller_btn {
    display: none;
}

.tabs-controller>.controller.selected {
    background-color: white;
    /* color: var(--color-main); */
    background-color: var(--color-headline);

}

.tabs-controller>.controller:hover {
    /* background-color: var(--color-highlight); */
    /* color: white; */
    /* color: var(--color-highlight); */
    z-index: 2;
}


.gallery.scroller .tabs-controller {
    display: none;
}

.tab-title {
    display: inline-block;
    padding-right: 1em;
    max-width: 25rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    transition: 0.3s;

}

/*.tab-title:hover{
    max-width: 100%;
}*/




.scroller_panel[data-presentation="tabs"] {
    position: relative;
    /*display: block;*/
    overflow-y: auto;
}

.scroller_panel[data-presentation="tabs"]>.tab {
    display: none;
    width: 100%;
    /*top: 0px;*/
    /*z-index: 0;*/
}

.scroller_panel[data-presentation="tabs"]>.tab.selected {
    display: block;
    /*top: 0px;*/
    /*z-index: 0;*/
}













.scroller_panel[data-presentation="fader"] {
    /*display: block;*/
    position: relative;
    /*overflow: hidden*/
}

.scroller_panel[data-presentation="fader"]>.tab {
    /*display: none;*/
    /*top: 0px;*/
    opacity: 0;
    z-index: 0;
    transition: opacity 2s;
    position: absolute;
}

.scroller_panel[data-presentation="fader"]>.tab.selected {
    display: block;
    opacity: 1;
    z-index: 1;
    /*position: relative;*/
}

.scroller_panel[data-presentation="fader"]>.tab.activating {
    display: block;
    opacity: 1;
    z-index: 2;
    /*position: absolute;*/
}


.scroller_panel[data-presentation="fader"]>.tab:last-child {
    position: relative;
}





@media print {
    @page {
        /*size: landscape;*/
        margin: 0 !important;
    }

    * {
        -webkit-print-color-adjust: exact !important;
        /* Chrome, Safari */
        color-adjust: exact !important;
        /*Firefox*/
    }
}

body.printing {
    overflow: visible;
}

body.printing * {
    transition: none !important;
}

body.printing>*:not(.printContent) {
    display: none !important;
}

body.printing .noPrint {
    display: none !important;
}


.printContent .controller {
    visibility: hidden !important;

}

.printContent {
    pointer-events: none !important;
}



[onclick] {
    cursor: pointer;
}

/* [data-exe]{
    cursor: pointer;
} */

/* [data-a="selection"]{ */
[data-a] {
    cursor: pointer;
}

.selectable {
    cursor: pointer;
}

.selectable:hover .btnSelectable,
.btnSelectable:hover {
    color: var(--color-headline);
}

.btnSelectable {
    cursor: pointer;
    margin-right: 0.75em
}

.btnSelectable>.iconSelected {
    display: none
}

.btnSelectable>.iconDeselected {
    display: inline-block
}

.btnSelectable.selected>.iconSelected {
    display: inline-block
}

.btnSelectable.selected>.iconDeselected {
    display: none
}

label.selectable {
    /* display: block; */
    display: flex;
    word-break: normal;
}

label.selectable input[type="checkbox"] {
    display: none;
}










.showIfPredecessorChecked {
    display: none;
}

[data-value="1"]+.showIfPredecessorChecked {
    display: block;
}



.flex {
    display: flex;
    /* width: 100%; */
}

.flex>* {
    flex-grow: 1;
    flex-shrink: 1;
}


.width-grow {
    flex-grow: 1;
    width: 100%;
}

.width-fix {
    flex-grow: 0;
    flex-shrink: 0;
    white-space: nowrap;
    display: flex;
}




.css-counter-reset {
    counter-reset: section;
}

.css-counter::before {
    counter-increment: section;
    content: counter(section);
}
/* p::before, p::after{
    content: ' ';
    display: table;
} */


body.shop_net .shop_gross{
    display: none !important;
}
body.shop_gross .shop_net{
    display: none !important;
}


.iconOnly{
    /* visibility: hidden; */
    border-radius: 100%;
    width: 1.75em;
    display: inline-block;
    line-height: 1.75em;
    text-align: center;
    padding-right: 0 !important;
    /* color: transparent; */
    padding-left: 0 !important;
    background-color: var(--color-headline);
    white-space: nowrap;
    color: var(--color-main);
    overflow: hidden;
}
.iconOnly::before{
    visibility: visible;
    width: 100%;
    text-align: center;
    /* color: var(--color-main); */
}

.iconOnly:empty{
    opacity: 0.25;
}