/* Allerlei Nuetzliches */
/* Buttons */
 .btn.small {
     padding: 0 1rem;
     height: 30px;
     line-height: 30px;
}
.btn.small i.material-icons.left {margin-right: 5px;}

.btn.small.active {
    background-color: var(--color-tertiary);
}

 .btn, .btn-floating, .btn.small, .btn:hover, .btn.small:hover, .btn-large:hover, .btn-floating:hover {
     background-color: var(--color-primary);
}
 .btn-floating.small {
    width: 30px;
     height: 30px;
     line-height: 30px;
}

.infoView .btn.small a,
.errorView .btn.small a,
.warningView .btn.small a {
  color: #fff;
}

/* Menübuttons sind initial aktiviert */
.btn.small {
    pointer-events: auto;
}
.btn.small[disabled]{
    pointer-events: none;
}

/* initial sind die Speicherbuttons deaktiviert gestylt aber klickbar */
.btn.small.save,
.btn.small.saveAndClose,
.btn.small.saveAndNew {
    background-color: #DFDFDF;
    color: #9F9F9F;
    cursor: default;
}

/* Menübuttons sind für Tempobjekte deaktiviert */
.btn.small.js-temp {
    pointer-events: none;
    background-color: #DFDFDF;
    color: #9F9F9F;
    cursor: default;
}

/* Menübuttons sind für Spezialfälle deaktiviert */
.btn.small.preview,
.btn.small.clip,
.btn.small.uploadAndApply {
    pointer-events: none;
    background-color: #DFDFDF;
    color: #9F9F9F;
    cursor: default;
}

/* Speicherbuttons werden aktiv */
.btn.small.save.js-dataChanged,
.btn.small.save.js-saveable,
.btn.small.save.js-saving-failed,
.btn.small.saveAndClose.js-dataChanged,
.btn.small.saveAndClose.js-saveable,
.btn.small.saveAndClose.js-saving-failed,
.btn.small.saveAndNew.js-dataChanged,
.btn.small.saveAndNew.js-saveable,
.btn.small.saveAndNew.js-saving-failed {
    background-color: var(--color-primary);
    color: #fff;
    cursor: pointer;
}

/* Menübuttons sind für Spezialfälle aktiviert */
.btn.small.js-previewPossible,
.btn.small.uploadAndApply.js-dataChanged,
.btn.small.clip.js-dataChanged,
.btn.small.clip.js-saveable,
.btn.small.clip.js-saving-failed {
    pointer-events: auto;
    background-color: var(--color-primary);
    color: #fff;
    cursor: pointer;
}
/* Menübuttons sind für Spezialfälle in Flex-Menue */
.foldedElements .btn.small.js-previewPossible,
.foldedElements .btn.small.uploadAndApply.js-dataChanged,
.foldedElements .btn.small.clip.js-dataChanged,
.foldedElements .btn.small.clip.js-saveable,
.foldedElements .btn.small.clip.js-saving-failed {
    color: var(--color-primary);
    cursor: pointer;
}

/* Speicherbutton und implizit uploadAndApply während des Speichervorgangs */
/* Die Buttons saveAndNew and saveAndClose haben zwar auch js-saving, werden
 * aber nicht berücksichtigt */
.btn.small.save.js-saving {
    background-color: var(--color-primary);
    color: #fff;
    cursor: wait;
}

.btn.small.save .preloader-wrapper {display: none; margin-left: 5px;}
.btn.small.save.js-saving i.material-icons {display: none;}
.btn.small.save.js-saving .preloader-wrapper {display: inline-block; width: 14px; height: 14px; left: -15px; top: 3px; border-color: #fff;}
.btn.small.save.js-saving .preloader-wrapper .spinner-layer {border-color: #fff;}

.no-button-design .btn,
.no-button-design .btn:hover {
    background: transparent;
    box-shadow: none;
    color: var(--color-primary);
}

.pointer {cursor: pointer; color: var(--color-primary);}
.nowrap {white-space: nowrap;}

/* Anpassung Icons */
 .material-icons {
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
}
 .large.material-icons {
     font-size: 25px;
}
.status .material-icons {
     font-size: 25px;
}
/* Fonts */
 :root {
     --font-primary:'Lato';
     --font-secondary: 'Helvetica';
}
/* Farbe Orange */
/* :root {
     --color-primary: #ff5722;
     --color-secondary: #ffccbc;
     --color-tertiary: #bf360c;
     --color-quartiary: #ff8a65;
     --color-grey: #f8f8f8;
     --color-font: #5B5B5B;
}
 */
/* Farbe Blau */
/* :root {
     --color-primary: #039be5;
     --color-secondary: #e1f5fe;
     --color-tertiary: #01579b;
     --color-quartiary: #81d4fa;
     --color-grey: #f8f8f8;
     --color-font: #5B5B5B;
}
 */
/* Links */
.link,
 a {
     color: var(--color-primary);
     text-decoration: none;
     -webkit-tap-highlight-color: transparent;
}
 a:focus, input:focus {
     outline: 1px solid transparent;
}
/* Dropdowns */
 .dropdownLink {
     position: relative;
     cursor: pointer;
     display: inline-block;
}
 .dropdown-contents {
     background-color: #fff;
     margin: 0;
     display: none;
     min-width: 100px;
     max-height: 650px;
     overflow-y: auto;
     position: absolute;
     z-index: 999;
     top: 35px;
}
 .dropdown-contents li,
 .dropdown-contents > div {
     clear: both;
     color: rgba(0, 0, 0, 0.87);
     cursor: pointer;
     min-height: auto;
     line-height: 1.5rem;
     width: 100%;
     text-align: left;
     text-transform: none;
}
 .dropdown-contents li > a,
 .dropdown-contents li > span,
 .dropdown-contents li > span > span,
 .dropdown-contents > div > span,
 .dropdown-contents > div span.notsaved {
     font-size: 14px;
     color: var(--color-primary);
     display: block;
     line-height: 20px;
     padding: 10px;
}
 .dropdown-contents li:hover,
 .dropdown-contents li.active,
 .dropdown-contents li.selected,
 .dropdown-contents > div:hover {
     background-color: #eee
}
 .dropdown-contents li.active.selected {
     background-color: #e1e1e1
}
/* Checkbox */
 [type="checkbox"]:checked + label:before {
     top: -4px;
     left: -5px;
     width: 12px;
     height: 22px;
     border-top: 2px solid transparent;
     border-left: 2px solid transparent;
     border-right: 2px solid var(--color-primary);
     border-bottom: 2px solid var(--color-primary);
     -webkit-transform: rotate(40deg);
     -ms-transform: rotate(40deg);
     transform: rotate(40deg);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     -webkit-transform-origin: 100% 100%;
     -ms-transform-origin: 100% 100%;
     transform-origin: 100% 100%;
}
/* Radiobutton */
[type="radio"]:checked + label:after, [type="radio"].with-gap:checked + label:after {
    background-color: var(--color-primary);
}
[type="radio"]:checked + label:after, [type="radio"].with-gap:checked + label:before, [type="radio"].with-gap:checked + label:after {
    border: 2px solid var(--color-primary);
}

/* Checkboxen ohne ID und for */

   .label-wrapper [type="checkbox"] + .style-label {
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  display: inline-block;
  height: 25px;
  line-height: 25px;
  font-size: 1rem;
  -webkit-user-select: none;
  /* webkit (safari, chrome) browsers */
  -moz-user-select: none;
  /* mozilla browsers */
  -khtml-user-select: none;
  /* webkit (konqueror) browsers */
  -ms-user-select: none;
  /* IE10+ */
}

 .label-wrapper [type="checkbox"] + style-label:before,
 .label-wrapper [type="checkbox"]:not(.filled-in) + .style-label:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  z-index: 0;
  border: 2px solid #5a5a5a;
  border-radius: 1px;
  margin-top: 2px;
  transition: .2s;
}

 .label-wrapper [type="checkbox"]:not(.filled-in) + .style-label:after {
  border: 0;
  -webkit-transform: scale(0);
          transform: scale(0);
}

 .label-wrapper [type="checkbox"]:not(:checked):disabled + .style-label:before {
  border: none;
  background-color: rgba(0, 0, 0, 0.26);
}

 .label-wrapper [type="checkbox"].tabbed:focus + .style-label:after {
  -webkit-transform: scale(1);
          transform: scale(1);
  border: 0;
  border-radius: 50%;
  box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  background-color: rgba(0, 0, 0, 0.1);
}

 .label-wrapper [type="checkbox"]:checked + .style-label:before {
  top: -4px;
  left: -5px;
  width: 12px;
  height: 22px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #26a69a;
  border-bottom: 2px solid #26a69a;
  -webkit-transform: rotate(40deg);
          transform: rotate(40deg);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform-origin: 100% 100%;
          transform-origin: 100% 100%;
}

 .label-wrapper [type="checkbox"]:checked:disabled + .style-label:before {
  border-right: 2px solid rgba(0, 0, 0, 0.26);
  border-bottom: 2px solid rgba(0, 0, 0, 0.26);
}


 .label-wrapper [type="checkbox"].filled-in + style-label:after {
  border-radius: 2px;
}

 .label-wrapper [type="checkbox"].filled-in + .style-label:before,
[type="checkbox"].filled-in + .style-label:after {
  content: '';
  left: 0;
  position: absolute;
  /* .1s delay is for check animation */
  transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  z-index: 1;
}

 .label-wrapper [type="checkbox"].filled-in:not(:checked) + .style-label:before {
  width: 0;
  height: 0;
  border: 3px solid transparent;
  left: 6px;
  top: 10px;
  -webkit-transform: rotateZ(37deg);
  transform: rotateZ(37deg);
  -webkit-transform-origin: 20% 40%;
  transform-origin: 100% 100%;
}

 .label-wrapper [type="checkbox"].filled-in:not(:checked) + .style-label:after {
  height: 20px;
  width: 20px;
  background-color: transparent;
  border: 2px solid #5a5a5a;
  top: 0px;
  z-index: 0;
}

 .label-wrapper [type="checkbox"].filled-in:checked + .style-label:before {
  top: 0;
  left: 1px;
  width: 8px;
  height: 13px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotateZ(37deg);
  transform: rotateZ(37deg);
  -webkit-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

 .label-wrapper [type="checkbox"].filled-in:checked + .style-label:after {
  top: 0;
  width: 20px;
  height: 20px;
  border: 2px solid var(--color-primary);
  background-color: var(--color-primary);
  z-index: 0;
}

 .label-wrapper [type="checkbox"].filled-in.tabbed:focus + .style-label:after {
  border-radius: 2px;
  border-color: #5a5a5a;
  background-color: rgba(0, 0, 0, 0.1);
}

 .label-wrapper [type="checkbox"].filled-in.tabbed:checked:focus + .style-label:after {
  border-radius: 2px;
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

 .label-wrapper [type="checkbox"].filled-in:disabled:not(:checked) + .style-label:before {
  background-color: transparent;
  border: 2px solid transparent;
}

 .label-wrapper [type="checkbox"].filled-in:disabled:not(:checked) + .style-label:after {
  border-color: transparent;
  background-color: #BDBDBD;
}

 .label-wrapper [type="checkbox"].filled-in:disabled:checked + .style-label:before {
  background-color: transparent;
}

 .label-wrapper [type="checkbox"].filled-in:disabled:checked + .style-label:after {
  background-color: #BDBDBD;
  border-color: #BDBDBD;
}

.label-wrapper [type="checkbox"].filled-in:not(:checked) + .style-label:after {
    height: 20px;
    width: 20px;
    background-color: #fff;
    border: 1px solid #000;
    top: 0px;
    z-index: 0;
    opacity: 1;
}


.listfoot .label-wrapper [type="checkbox"] + .style-label {
    display: flex !important;
    padding-left: 30px !important;
}

.listfoot .label-wrapper [type="checkbox"].filled-in:not(:checked) + .style-label::after,
.listfoot .label-wrapper [type="checkbox"].filled-in:checked + .style-label::after {
top: 2px;
}

.listfoot .label-wrapper [type="checkbox"].filled-in:checked + .style-label::before {
	top: 4px;
}



/* Tooltips fuer Doku */
 .mein-tooltip {
     padding: 10px 8px;
     font-size: 1rem;
     z-index: 2000;
     background-color: transparent;
     border-radius: 2px;
     color: #fff;
     min-height: 36px;
     line-height: 120%;
     position: absolute;
     text-align: center;
     left: 50px;
     top: 35px;
     pointer-events: none;
     display: none;
     text-transform: none;
     width: 10px;
     -webkit-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
}
 .mein-tooltip.active {
     background-color: black;
     -webkit-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
     width: auto;
     white-space: nowrap;
}
 .tooltip-button {
     cursor: pointer;
}

 .label-tooltip {
	display: none;
    color: var(--color-primary);
    font-size: 12px;
    cursor: default;
	margin-left: 2px;
	cursor: pointer;

}
  label:hover .label-tooltip {display: inline;}




  .sidebar-container .editor-fieldrow label:hover .label-tooltip {
    display: none;
}

.sidebar-container .opendoc,
.detailcontainer label.opendoc
 {cursor: pointer;}
.sidebar-container .opendoc:hover:after {content: "?"; color: var(--color-primary); margin-left: 2px;}

/* Flexboxen */
/* flexbox Reihe, Elemente ordnen sich automatisch gleichmäßig mittig an */
 .flex-container {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: horizontal;
     -webkit-box-direction: normal;
     -ms-flex-flow: row wrap;
     flex-flow: row wrap;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
}
 .flex-container.inline {display: inline-flex;}
 .flex-container.start {justify-content: flex-start;}
 .flex-container.nowrap {flex-wrap: nowrap;}
 .flex-container > * {
     -webkit-box-flex: 0;
     -ms-flex: 0 1 auto;
     flex: 0 1 auto;
}
  .nowrap {flex-wrap: nowrap;}

/* Einklapper */
 .collapsibles {
     margin: 0.5rem 0 1rem 0;
	 max-width: 600px;
}
 .collapsibles-header {
     display: block;
     cursor: pointer;
     min-height: 2rem;
     line-height: 2rem;
     padding: 0;
     border-bottom: 0px solid #ddd;
     background: transparent;
}
 .collapsibles-header.active {
     background: transparent;
}
 .collapsibles-header i {
     width: 2rem;
     font-size: 1.6rem;
     line-height: 2rem;
     display: block;
     float: left;
     text-align: left;
     margin-right: 1rem;
}
 .collapsibles-body {
     border-bottom: 1px solid #ddd;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     padding: 2rem;
     border-top: 1px solid #ddd;
     border-right: 1px solid #ddd;
     border-left: 1px solid #ddd;
     margin: 0.5rem 0 1rem 0;
     -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
     box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
	 -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
         -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
}
 .collapsibles-header.active i.material-icons {
     -webkit-transform: rotate(180deg);
     -ms-transform: rotate(180deg);
     transform: rotate(180deg);
}
/* Pager */
 .pagination li {
     display: inline-block;
     border-radius: 2px;
     text-align: center;
     vertical-align: top;
     height: 30px;
}
 .pagination li a, .pagination li span {
     color: #444;
     display: inline-block;
     font-size: 14px;
     padding: 0 10px;
     line-height: 30px;
}
 .pagination li.active a, .pagination li.active span {
     color: #fff;
}
 .pagination li.active {
     background-color: var(--color-primary);
}
 .pagination li.disabled a, .paginationn li.disabled span {
     cursor: default;
     color: #999;
}
 .pagination li i {
     font-size: 14px;
}
 .pagination li.pages ul li {
     display: inline-block;
     float: none;
}
 @media only screen and (max-width: 992px) {
     .pagination {
         width: 100%;
    }
     .pagination li.prev, .pagination li.next {
         width: 10%;
    }
     .pagination li.pages {
         width: 80%;
         overflow: hidden;
         white-space: nowrap;
    }
}
/* Checkboxen */
 [type="checkbox"].filled-in:not(:checked) + label:after {
     height: 20px;
     width: 20px;
     background-color: #fff;
     border: 1px solid #000;
     top: 0px;
     z-index: 0;
     opacity: 1;
}

.default__checkbox label .small {margin-left: 25px; }
.default__checkbox label.mittext  {display: flex !important; align-items: center; height: 20px;}
.default__checkbox [type="checkbox"] {min-height: 25px; min-width: 25px;}

/* Inputs */
 input:not([type]), input[type=text], input[type=password], input[type=email], input[type=url], input[type=time], input[type=date], input[type=datetime], input[type=datetime-local], input[type=tel], input[type=number], input[type=search], textarea.materialize-textarea {
     width: auto;
}
.subcontent.ticker .numberselect input[type=number] {
	min-width: 120px;
}
 [type="checkbox"].filled-in:checked + label:after {
     top: 0;
     width: 20px;
     height: 20px;
     border: 2px solid var(--color-primary);
     background-color: var(--color-primary);
     z-index: 0;
}
 input:not([type]):focus:not([readonly]), input[type=text]:focus:not([readonly]), input[type=password]:focus:not([readonly]), input[type=email]:focus:not([readonly]), input[type=url]:focus:not([readonly]), input[type=time]:focus:not([readonly]), input[type=date]:focus:not([readonly]), input[type=datetime]:focus:not([readonly]), input[type=datetime-local]:focus:not([readonly]), input[type=tel]:focus:not([readonly]), input[type=number]:focus:not([readonly]), input[type=search]:focus:not([readonly]), textarea.materialize-textarea:focus:not([readonly]) {
     border-bottom: 1px solid var(--color-primary);
     -webkit-box-shadow: 0 1px 0 0 var(--color-primary);
     box-shadow: 0 1px 0 0 var(--color-primary);
}
 input:not([type]):focus:not([readonly]) + label, input[type=text]:focus:not([readonly]) + label, input[type=password]:focus:not([readonly]) + label, input[type=email]:focus:not([readonly]) + label, input[type=url]:focus:not([readonly]) + label, input[type=time]:focus:not([readonly]) + label, input[type=date]:focus:not([readonly]) + label, input[type=datetime]:focus:not([readonly]) + label, input[type=datetime-local]:focus:not([readonly]) + label, input[type=tel]:focus:not([readonly]) + label, input[type=number]:focus:not([readonly]) + label, input[type=search]:focus:not([readonly]) + label, textarea.materialize-textarea:focus:not([readonly]) + label {
     color: var(--color-primary);
}
 input:not([type]).valid, input:not([type]):focus.valid, input[type=text].valid, input[type=text]:focus.valid, input[type=password].valid, input[type=password]:focus.valid, input[type=email].valid, input[type=email]:focus.valid, input[type=url].valid, input[type=url]:focus.valid, input[type=time].valid, input[type=time]:focus.valid, input[type=date].valid, input[type=date]:focus.valid, input[type=datetime].valid, input[type=datetime]:focus.valid, input[type=datetime-local].valid, input[type=datetime-local]:focus.valid, input[type=tel].valid, input[type=tel]:focus.valid, input[type=number].valid, input[type=number]:focus.valid, input[type=search].valid, input[type=search]:focus.valid, textarea.materialize-textarea.valid, textarea.materialize-textarea:focus.valid {
     border-bottom: 1px solid var(--color-primary);
     -webkit-box-shadow: 0 1px 0 0 var(--color-primary);
     box-shadow: 0 1px 0 0 var(--color-primary);
}
 input:not([type]).valid + label:after, input:not([type]):focus.valid + label:after, input[type=text].valid + label:after, input[type=text]:focus.valid + label:after, input[type=password].valid + label:after, input[type=password]:focus.valid + label:after, input[type=email].valid + label:after, input[type=email]:focus.valid + label:after, input[type=url].valid + label:after, input[type=url]:focus.valid + label:after, input[type=time].valid + label:after, input[type=time]:focus.valid + label:after, input[type=date].valid + label:after, input[type=date]:focus.valid + label:after, input[type=datetime].valid + label:after, input[type=datetime]:focus.valid + label:after, input[type=datetime-local].valid + label:after, input[type=datetime-local]:focus.valid + label:after, input[type=tel].valid + label:after, input[type=tel]:focus.valid + label:after, input[type=number].valid + label:after, input[type=number]:focus.valid + label:after, input[type=search].valid + label:after, input[type=search]:focus.valid + label:after, textarea.materialize-textarea.valid + label:after, textarea.materialize-textarea:focus.valid + label:after {
     content: attr(data-success);
     color: var(--color-primary);
     opacity: 1;
}

.searchform input:-webkit-autofill + .inlinelabel {display: none;}
.searchform .inlinelabel {pointer-events: none; position: absolute; bottom: 23px; font-weight: normal;  color: var(--color-font); white-space: nowrap; padding-right: 3px;}
.searchform .labelbox {position: relative;}
.searchform input:valid + .inlinelabel {display: none;}
.searchform .inlinelabel span {max-width: 110px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: inline-block; vertical-align: bottom;}

/* Fix für Chromebug bei input type file */
input[type=file],
input[type=file]::-webkit-file-upload-button {
    cursor: pointer;
}

/* Seclects */
 .select {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
}
 .editor-fieldrow.select {display: block;}
 .select label {
     margin-right: 10px;
}
 select {
     background-color: rgba(255, 255, 255, 0.9);
     width: auto;
     padding: 5px;
     border: 1px solid var(--color-primary);
     border-radius: 2px;
     height: 32px;
}
 .select select {
    display: block;
}

 .editor-field select:not(.autowidth) {
     height: 25px;
     max-width: 100%;
     /* overflow: hidden; */
     width: 100%;
     padding: 0;

}
.noticelist .editor-field select {
	width: auto;
}
 .editor-field select option selected=[selected] {
     height: 25px;
     padding: 5px;
     background-color: var(--color-primary) !important;
}
.selectbox {
	position: relative;
}
.show-text {
	cursor: pointer;
}
  .selectbox select {
	border: 0 !important;
	outline: 0;
	background: transparent;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance:none;
    cursor: pointer;
	opacity: 0;
	position: absolute;
	top: 0px;
}

.selectbox .show-text {

  color: var(--color-primary);
  cursor:pointer;
  text-decoration: underline;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}


/* Kontextmenue */
.contextmenu_overlay {
    width: 100%;
    position: fixed;
    height: 100%;
    top: 0;
    z-index: 9998;
}

.contextmenu {
     margin: 0.5rem 0 1rem 0;
     background-color: #fff;
     -webkit-transition: -webkit-box-shadow .25s;
     transition: -webkit-box-shadow .25s;
     -o-transition: box-shadow .25s;
     transition: box-shadow .25s;
     transition: box-shadow .25s, -webkit-box-shadow .25s;
     border-radius: 2px;
     width: auto;
     min-width: 120px;
     max-width: 250px;
     webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
     z-index: 9999;
}
 .contextmenu ul {
     margin: 0;
     border: 1px solid #e0e0e0;
     border-radius: 2px;
}
 .contextmenu li {
     background-color: #fff;
     line-height: 1rem;
     padding: 10px;
     margin: 0;
     border-bottom: 1px solid #e0e0e0;
     font-size: 13px;
     color: var(--color-primary);
     white-space: nowrap;
     text-align: left;
     display: flex;
     align-items: center;
}
 .contextmenu li:hover {
     background-color: var(--color-grey);
     cursor: pointer;
}
 .contextmenu ul li ul {
     display: none;
     z-index: 99999;
     margin: 0 -1px;
}
 .contextmenu li:before {
     font-family: 'Material Icons';
     text-rendering: optimizeLegibility;
     -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
     font-feature-settings: 'liga';
     color: var(--color-primary);
     width: 25px;
     font-size: 16px;
     margin-right: 10px;
}
 .contextmenu li.bearbeiten:before {
     content: "edit";
}
.contextmenu li.bearbeiten_in_neuem_fenster:before {
     content: "open_in_new";
}

.contextmenu li.inhalt_bearbeiten:before {
     content: "build";
}

.contextmenu li.uebernehmen:before {
     content: "forward";
}
 .contextmenu li.schnellbearbeitung:before {
     content: "edit";
}
 .contextmenu li.status:before {
     content: "traffic";
 }
 .contextmenu li.schnellverlinkung:before {
     content: "link";
 }

.contextmenu li.collection-eintrag_erstellen:before,
.contextmenu li.auf_collection_setzen:before {
    content: "link";
}

.contextmenu li.in_mediagalerie_aufnehmen:before {
    content: "burst_mode";
}

.contextmenu li.schlagwort_hinzufuegen:before {
     content: "local_offer";
 }
 .contextmenu li.ausschneiden:before {
     content: "content_cut";
}
 .contextmenu li.umbenennen:before {
     content: "find_replace";
}
 .contextmenu li.neuladen:before {
     content: "autorenew";
}
 .contextmenu li.kopieren:before {
     content: "content_copy";
}
.contextmenu li.verlinkungen_loesen:before {
    content: "delete_sweep"
}
 .contextmenu li.loeschen:before {
     content: "delete";
     color: red;
}
.contextmenu li.blockieren:before {
     content: "block";
}
 .contextmenu li.neuer_liveticker-eintrag:before,
 .contextmenu li.neu:before {
     content: "library_add";
}
 .contextmenu li.herunterladen:before {
     content: "file_download";
}
 .contextmenu li.selektion:before {
     content: 'check_box';
}
 .contextmenu li.alle:before {
     content: "check";
}
 .contextmenu li.keine:before {
     content: "check_box_outline_blank";
}
 .contextmenu li.online:before {
     font: normal normal normal 14px FontAwesome;
	 color: #32CD32;
     content: "\f111";
}
 .contextmenu li.offline:before,
 .contextmenu li.gesperrt:before,
 .contextmenu li.gesperrt_inklkind-kommentare:before {
     font: normal normal normal 14px FontAwesome;
     content: "\f111";
     color: red;
}
 .contextmenu li.wartend:before,
 .contextmenu li.zu_pruefen:before {
     font: normal normal normal 14px FontAwesome;
     content: "\f111";
     color: orange;
}
 .contextmenu li.archiviert:before {
     font: normal normal normal 14px FontAwesome;
     content: "\f111";
     color: blue;
}
 .contextmenu li.nicht_gelistet:before {
     font: normal normal normal 14px FontAwesome;
     content: "\f111";
     color: grey;
 }
 .contextmenu li.freigeben:before {
     content: "assignment_turned_in";
}
 .contextmenu li.top-kommentar:before {
     content: "star_rate";
}
 .contextmenu li.verschieben:before {
     content: "open_with";
}
 .contextmenu li.status_aendern:before {
     content: "change_history";
}
 .contextmenu li.liste_exportieren:before {
     content: "import_export";
}
 .contextmenu li.offen:before {
     content: "lock_open";
}
 .contextmenu li.abgeschlossen:before {
     content: "lock";
}
 .contextmenu li.fehler:before {
     content: "error_outline";
 }
 .contextmenu li.gekuendigt:before,
 .contextmenu li.storniert:before {
     content: "cancel";
}
.contextmenu li.offen:before {
     content: "brightness_1"; color: orange; font-size: 14px;
}
 .contextmenu li.aktiv:before,
 .contextmenu li.abgeschlossen:before {
     content: "brightness_1"; color: #4caf50; font-size: 14px;
}
.contextmenu li.gekuendigt:before,
.contextmenu li.storniert:before {
     content: "brightness_1"; color: red; font-size: 14px;
}
.contextmenu li.fehler:before {
     content: "error"; color: var(--color-font) !important;
}
.contextmenu li.abgelaufen:before,
.contextmenu li.inaktiv:before {
    content: "brightness_1"; color: grey; font-size: 14px;
}

/* neu */
 .contextmenu li.newsletter:before {
     content: "offline_pin";
}
 .contextmenu li.freischalten:before {
     content: "vpn_key";
}
 .contextmenu li.vorschau:before {
     content: "pageview";
}
 .contextmenu li.sortierung:before {
     content: "sort";
}
 .contextmenu li.nach_ganz_oben:before {
     content: "vertical_align_top";
}
 .contextmenu li.nach_ganz_unten:before {
     content: "vertical_align_bottom";
}
 .contextmenu li.hinzufuegen:before {
     content: "library_add";
}
 .contextmenu li.erstellen:before {
     content: "create_new_folder";
}
 .contextmenu li.alle_in_grundtext_uebernehmen:before {
     content: "select_all";
}
.contextmenu li.in_grundtext_uebernehmen:before {
     content: "select_all";
}
 .contextmenu li.alle_aus_grundtext_entfernen:before {
     content: "remove_circle_outline";
 }
 .contextmenu li.zeitsteuerung_entfernen:before {
     content: "timer_off";
 }
 .contextmenu li.zielartikel_verwenden:before {
     content: "forward";
 }
.contextmenu li.bilderserie_anzeigen:before,
.contextmenu li.mediagalerie_anzeigen:before {
     content: "photo_library";
}
.contextmenu li.in_bilderserien_uebernehmen:before {
     content: "photo_size_select_large";
}
.contextmenu li.in_thumbs_uebernehmen:before {
     content: "photo_size_select_small";
}
.contextmenu li.details_anzeigen:before {
     content: "details";
}
.contextmenu li.log-datei_anzeigen:before {
     content: "open_in_browser";
}
.contextmenu li.editor_oeffnen:before {
     content: "edit";
}
.contextmenu li.aenderungen_anzeigen:before {
     content: "track_changes";
}
.contextmenu li.zusammenfassen:before {
     content: "all_inclusive";
}
.contextmenu li.oeffnen:before {
     content: "open_in_browser";
}
.contextmenu li.entfernen:before {
     content: "delete";
}
.contextmenu li.layout-eintrag:before {
     content: "import_contacts";
}
.contextmenu li.aktivieren:before {
     content: "check_circle";
}
.contextmenu li.deaktivieren:before {
     content: "cancel";
}
.contextmenu li.contentbox:before {
     content: "add";
}
.contextmenu li.template:before {
     content: "add";
}
.contextmenu li.komponente:before {
     content: "add";
}
.contextmenu li.html:before {
     content: "add";
}
.contextmenu li.oneup:before {
     content: "arrow_upward";
}
.contextmenu li.onedown:before {
     content: "arrow_downward";
}
.contextmenu li.allup:before {
     content: "vertical_align_top";
}
.contextmenu li.alldown:before {
     content: "vertical_align_bottom";
}
.contextmenu li.verwendung_anzeigen:before {
     content: "data_usage";
}
.contextmenu li.jetzt_publizieren:before {
     content: "publish";
}
.contextmenu li.aktivitaet:before {
     content: "alarm";
}
.contextmenu li.anstehend:before {
     content: "alarm_add";
}
.contextmenu li.laufend:before {
     content: "play_arrow";
}
.contextmenu li.pausiert:before {
     content: "pause";
}
.contextmenu li.beendet:before {
     content: "stop";
}
.contextmenu li.als_neu_erneut_ausfuehren:before,
.contextmenu li.erneut_verarbeiten:before {
     content: "play_arrow";
}
.contextmenu li.monitoring:before {
     content: "cloud";
}
.contextmenu li.monitoring li.aktivieren:before {
     content: "cloud_on";
}
.contextmenu li.monitoring li.deaktivieren:before {
     content: "cloud_off";
}
.contextmenu li.unterseite_hinzufuegen:before {
     content: "note_add";
}
.contextmenu li.indexierung:before {
     content: "language";
}
.contextmenu li.wert_der_seitenkategorie_verwenden:before {
     content: "language";
}
.contextmenu li.seite_nicht_indexieren_links_ignorieren_nicht_archivieren:before {
     content: "language"; color: red;
}
.contextmenu li.liveticker-eintraege_anzeigen:before {
     content: "remove_red_eye";
}
.contextmenu li.boosting:before {
     content: "trending_up";
}

.contextmenu li.collection-eintraege_anzeigen:before,
.contextmenu li.mediagalerie-eintraege_anzeigen:before {
     content: "visibility";
}
.contextmenu li.collection_leeren:before {
     content: "delete_sweep";
}
.contextmenu li.details:before {
     content: "edit";
}
.contextmenu li.details_in_neuem_fenster:before {
     content: "open_in_new";
}
.contextmenu li.portalseite_hinzufuegen:before,
.contextmenu li.ressort_hinzufuegen:before,
.contextmenu li.ressorts_hinzufuegen:before,
.contextmenu li.untereintrag_hinzufuegen:before
{
     content: "add_box";
}
.contextmenu li.untereintraege_automatisch_erzeugen:before {
     content: "subdirectory_arrow_right";
}
.contextmenu li.overlay_hinzufuegen:before {
     content: "add_box";
}
.contextmenu li.overlay_oeffnen:before {
     content: "open_in_browser";
}
.contextmenu li.overlay_loeschen:before {
     content: "delete";
	 color: red;
}
.contextmenu li.neue_anpassung_erstellen:before {
     content: "add_box";
}
.contextmenu li.neue_multidomain-anpassung:before {
     content: "storage";
}
.contextmenu li.seite_blockieren:before {
     content: "block";
}
.contextmenu li.anpassung_bearbeiten:before {
     content: "edit";
}
.contextmenu li.anpassung_entfernen:before {
     content: "delete";
	 color: red;
}
.contextmenu li.originalseite_bearbeiten:before {
     content: "edit";
	 color: red;
}
.contextmenu li.originalseite_loeschen:before {
     content: "delete";
	 color: red;
}
/* Hovereffect Contextmenu */
 .vakata-context.jstree-contextmenu li:not(.loeschen):hover:before,
 .contextmenu li:hover:not(.loeschen):before {
    color: black !important;
 }

 .vakata-context.jstree-contextmenu li:hover > a,
 .contextmenu li:hover {
     color: black !important;
 }

/* Tagbox */
 .tagbox .taggle_placeholder {
     position: absolute;
}
 .tagbox .taggle_sizer {
     padding: 0;
     margin: 0;
     position: absolute;
     top: -500px;
     z-index: -1;
     visibility: hidden;
}
 .tagbox ul {
     margin: 0;
     padding: 0;
}
 .tagbox li.taggle {

	display: inline-block;
    height: 25px;
    font-size: 12px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.8);
    line-height: 25px;
    padding: 0 12px;
    border-radius: 16px;
    background-color: #d1d1d1;
    margin-bottom: 5px;
    margin-right: 5px;
}

.tagbox li.taggle.auto {
     background-color: var(--color-secondary);
}
 .tagbox li.taggle span {
     display: inline-block;
     width: 125px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}

 .tagbox li.taggle .close {
     display: inline-block;
     position: absolute;
     right: 10px;
     background: transparent;
     border: none;
     font-weight: bold;
     font-size: 17px;
	 line-height: 21px;
}
 .tagbox .taggle_list input:disabled {
	 display: none;
 }
.editor-field .ui-helper-hidden-accessible {
     display: none;
}

/* Markierung der ausgewahlten Autocomplete Eintraege */
input.taggle_input.ui-autocomplete-input {
    width: 145px !important;
    max-width: 145px;
    border-right: 1px solid #9e9e9e;
}
.tagbox .ui-autocomplete .ui-state-active {
    background: #ffe0b2;
	cursor: pointer;

}

/* Tagbox im Detaileditor */
.tagbox.searchtags {margin-top: 5px;}
.tagbox.searchtags .taggle_placeholder {visibility: hidden;}
.tagbox.searchtags li.taggle {position: relative; padding-right: 20px;}
.tagbox.searchtags  li.taggle .close {right: 5px;}
.tagbox.searchtags li.taggle span { width: auto; max-width: 250px; padding-right: 5px;}
.tagbox.searchtags ul.taggle_list {display: flex; flex-wrap: wrap;}
.tagbox.searchtags ul.taggle_list li:not(:first-child) input.taggle_input {padding: 0; height: 25px; max-width: 250px !important;}
.tagbox.searchtags ul.taggle_list li:first-child:not(.taggle) {width: 100%;}


/* Foldable List */
 .moreElements {
     position: absolute;
     top: 15px;
     right: 0px;
     z-index: 99999;
}
 .moreElements i {
     font-size: 25px;
}
 .foldedElements {
     position: absolute;
     right: -2px;
     top: 60px;
     padding: 20px !important;
     background-color: var(--color-secondary);
     z-index: 999;
     display: flex;
     justify-content: space-between;
     align-items: center;
	 white-space: nowrap;
}
 .foldedElements li:not(:last-child) {
     margin-right: 5px; flex: 1 0 auto;
}
/* Texteditor Foldable List */
 .detailcontainer .texteditor {
     -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
     margin-bottom: 15px;
}
 .texteditor .menubar {
     position: relative;
     margin-bottom: 5px;
     height: 28px;
     font-size: 11px;
     display: flex;
     background-color: var(--color-secondary);
     color: #000;
     border-radius: 4px 4px 0 0;
     padding: 0 10px 0 10px;
 }
 .texteditor .menubar.script {
     height: auto;
	 min-height: 28px;
	 align-items: center;
	 font-family: monospace;
	 font-size: 12px;
 }


 .texteditor .menubar .listcontainer {
     flex: 1;
     position: relative;
 }
 .texteditor .menubar.script .listcontainer {
     flex: 0;
 }

 .texteditor .texteditor-content {
     position: relative;
	 z-index: 8;
 }

 .texteditor .texteditor-container:focus{
     outline: 0;
 }

 .texteditor .menubar ul.items {
     display: flex;
     height: 28px;
     flex-flow: row wrap;
     overflow: hidden;
 }

  .texteditor .menubar ul.items.nowrap {
	  flex-wrap: nowrap;
  }

 .texteditor .menubar ul.items li, .texteditor .menubar .foldedElements li {
     flex: 0 0 auto;
     height: 30px;
     width: auto;
     margin-right: 15px;
     border: 0;
     display: flex;
     align-items: center;
}
 .texteditor .menubar ul.items li a, .texteditor .menubar .foldedElements li a {
     color: #000;
     font-size: 12px;
}
 .texteditor .menubar ul.items li i, .texteditor .menubar .foldedElements li i {
     color: var(--color-primary);
}
 .texteditor .menubar ul.items li, .texteditor .menubar .foldedElements li  {
     cursor: pointer; color: #000;
}
/* Grafiken für foldable List */
 .texteditor .menubar ul.items li:not(.max-editor):before, .texteditor .menubar .foldedElements li:before {
     content: "\f187";
     display: inline-block;
     font: normal normal normal 14px/1 FontAwesome;
     font-size: 14px;
     color: var(--color-primary);
     text-rendering: auto;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     transform: translate(0, 0);
     margin-right: 3px;
	 cursor: pointer;
}

 .texteditor .menubar ul.items li.zoomin:before {
     content: 'zoom_in';
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 20px;
     line-height: inherit;
     text-rendering: optimizeLegibility;
     -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
     font-feature-settings: 'liga';
 }

 .texteditor .menubar ul.items li.zoomout:before {
     content: 'zoom_out';
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 20px;
     line-height: inherit;
     text-rendering: optimizeLegibility;
     -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
     font-feature-settings: 'liga';
 }


.texteditor .menubar ul.items li.img:before, .texteditor .menubar .foldedElements li.img:before {
     content: "\f03e";
}
 .texteditor .menubar ul.items li.dia:before, .texteditor .menubar .foldedElements li.dia:before {
     content: "photo_library";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
 .texteditor .menubar ul.items li.sts:before, .texteditor .menubar .foldedElements li.sts:before {
     content: "\f03d";
}
 .texteditor .menubar ul.items li.med:before, .texteditor .menubar .foldedElements li.med:before {
     content: "\f1c1";
}
 .texteditor .menubar ul.items li.lbx:before, .texteditor .menubar .foldedElements li.lbx:before {
     content: "\f0c1";
}
 .texteditor .menubar ul.items li.ted:before, .texteditor .menubar .foldedElements li.ted:before {
     content: "poll";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
 .texteditor .menubar ul.items li.liveticker:before, .texteditor .menubar .foldedElements li.liveticker:before {
     content: "live_tv";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
 .texteditor .menubar ul.items li.ticker:before, .texteditor .menubar .foldedElements li.ticker:before {
     content: "dvr";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
     text-rendering: optimizeLegibility;
     -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
     font-feature-settings: 'liga';
}
 .texteditor .menubar ul.items li.competition:before, .texteditor .menubar .foldedElements li.competition:before {
     content: "card_giftcard";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
 .texteditor .menubar ul.items li.brightcove:before, .texteditor .menubar .foldedElements li.brightcove:before {
     content: "\f1c8";
}
 .texteditor .menubar ul.items li.form:before, .texteditor .menubar .foldedElements li.form:before {
     content: "content_paste";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
}
 .texteditor .menubar ul.items li.pic:before, .texteditor .menubar .foldedElements li.pic:before {
     content: "photo";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
 .texteditor .menubar ul.items li.xma:before, .texteditor .menubar .foldedElements li.xma:before {
     content: "insert_drive_file";
	 font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
 .texteditor .menubar ul.items li.art:before, .texteditor .menubar .foldedElements li.art:before {
     content: "format_align_center";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
 .texteditor .menubar ul.items li.tbr:before, .texteditor .menubar .foldedElements li.tbr:before {
     content: "linear_scale";
	 font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
.texteditor .menubar ul.items li.textmodule:before, .texteditor .menubar .foldedElements li.textmodule:before {
     content: "view_quilt";
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 16px;
     line-height: inherit;
     text-rendering: optimizeLegibility;
     -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
     font-feature-settings: 'liga';
     content:  "view_quilt";
     padding-top:  3px;
}

 .texteditor .menubar .moreElements {
     position: absolute;
     top: 0;
     z-index: 99999;
     height: 28px;
}
 .texteditor .menubar .moreElements i {
     font-size: 18px;
	 line-height: 29px;
}
 .texteditor .menubar .foldedElements {
     position: absolute;
     right: 0;
     top: 29px;
     border-radius: 4px;
     padding: 3px 10px !important;
     background-color: var(--color-secondary);
     z-index: 999;
     display: flex;
     justify-content: space-between;
     align-items: center;
	 flex-wrap: wrap;
     -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}
 .texteditor textarea {
     resize: none;
     z-index: 9;
     height: 580px;
 }
 .fcms-codemirror .texteditor textarea {
	 font-family: monospace !important;
 }

 .editor-fieldrow.tinymce textarea {
     height: 500px;
 }

 .texteditor .changeview {
     padding: 10px 20px;
     font-size: 12px;
     z-index: 999;
 }
 .texteditor .toggle-editor {
     display: flex;
     align-items: center;
     cursor: pointer;
     font-size: 14px;
 }
 .texteditor .toggle-editor i {
     margin-right: 3px;
     font-size: 22px;
 }

.texteditor .textsize .notInCategory {
    color: red;
}

 .texteditor .codemirror-container {
     position: absolute;
     width: 100%;
     height: 100%;
     top: 0;
     border: 1px solid #E2E2E2;
 }

 .texteditor .codemirror-container .CodeMirror {
     height: 100%;
 }

 .subcontent.article .max-editor {
	 margin-left: 20px;
 }
 .subcontent.article .max-editor .maximize,
 .subcontent.article .max-editor .minimize
 { font-size: 20px;
 }


/* CK Editor Anpassungen */



 .ckeditor-container .cke_1 {
     flex: 1 1 100% !important;
}
 .ckeditor-container .cke_toolbox {
     display: flex;
     flex-wrap: wrap;

}
 .ckeditor-container .cke_toolbar {
     border: 1px solid var(--color-secondary);
     border-radius: 2px;
     margin: 5px;
     padding: 0 5px;
}
/* Texteditor maxmieren */
 .subcontent.maximized .detailcontainer {
     padding-bottom: 0; overflow:hidden; }


 .subcontent.maximized .editor-fieldrow {display: none;}
 .subcontent.maximized .editor-fieldrow.fcms-wysiwyg,
 .subcontent.maximized .editor-fieldrow.fcms-codemirror {
     display: block;
     height: calc(100vh - 210px);

   }
 .subcontent.maximized .editor-fieldrow.fcms-wysiwyg .editor-field,
 .subcontent.maximized .editor-fieldrow.fcms-wysiwyg .editor-field .channel,
 .subcontent.maximized .editor-fieldrow.fcms-wysiwyg .editor-field .texteditor,
 .subcontent.maximized .editor-fieldrow.fcms-wysiwyg .editor-field .texteditor textarea,
.subcontent.maximized .editor-fieldrow.fcms-codemirror .editor-field,
 .subcontent.maximized .editor-fieldrow.fcms-codemirror .editor-field .channel,
 .subcontent.maximized .editor-fieldrow.fcms-codemirror .editor-field .texteditor,
.subcontent.maximized .editor-fieldrow.fcms-codemirror .editor-field .texteditor textarea {
    height: 100%;

   }

 .subcontent.maximized .editor-fieldrow.fcms-wysiwyg .editor-field .texteditor-content,
 .subcontent.maximized .editor-fieldrow.fcms-codemirror .editor-field .texteditor-content {
     height: calc(100% - 100px);}

   .subcontent.article .max-editor .minimize {display: none;}
   .subcontent.article.maximized .max-editor .minimize {display: block;}
   .subcontent.article.maximized .max-editor .maximize {display: none;}
   .subcontent.article .max-editor .maximize {display: block;}
   .subcontent .max-editor .minimize {display: none;}
   .subcontent.maximized .max-editor .minimize {display: block;}
   .subcontent.maximized .max-editor .maximize {display: none;}
   .subcontent .max-editor .maximize {display: block;}

/* Ladeanimation */

.myloader.center {
  margin: 0 auto;
  position: absolute;
  top: 35%;
  left: calc(50% - 25px);
  width: 50px;
  z-index: 999;
}

.mylistloader {
position: absolute; left: calc(50% - 25px); top: 30%; z-index: 9999;
background: #fff;
border-radius: 50%;
width: 40px;
height: 40px;
text-align: center;
padding-top: 2px;
}

.mylistloader:empty {display: none;}

.mylistloader .preloader-wrapper {
	margin: 0;
}

.clickcatcher {
    background: #fff;
    width: 100%;
    height: 100%;
    z-index: 9998;
    position: absolute;
    opacity: 0.6;
}

 .preloader-wrapper {
     display: inline-block;
     position: relative;
     width: 36px;
     height: 36px;
     margin-left: calc(50% - 35px);
}
 .preloader-wrapper.active {
     -webkit-animation: container-rotate 1568ms linear infinite;
     animation: container-rotate 1568ms linear infinite;
}
 @-webkit-keyframes container-rotate {
     to {
         -webkit-transform: rotate(360deg);
    }
}
 @keyframes container-rotate {
     to {
         -webkit-transform: rotate(360deg);
         transform: rotate(360deg);
    }
}
 .spinner-layer {
     position: absolute;
     width: 100%;
     height: 100%;
     opacity: 0;
     border-color: var(--color-primary);
}
 .spinner-green, .spinner-green-only {
     border-color: var(--color-primary);
}
 .active .spinner-layer.spinner-green {
     -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
     animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
 .active .spinner-layer, .active .spinner-layer.spinner-green-only {
     opacity: 1;
     -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
     animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
 @-webkit-keyframes fill-unfill-rotate {
     12.5% {
         -webkit-transform: rotate(135deg);
    }
     25% {
         -webkit-transform: rotate(270deg);
    }
     37.5% {
         -webkit-transform: rotate(405deg);
    }
     50% {
         -webkit-transform: rotate(540deg);
    }
     62.5% {
         -webkit-transform: rotate(675deg);
    }
     75% {
         -webkit-transform: rotate(810deg);
    }
     87.5% {
         -webkit-transform: rotate(945deg);
    }
     to {
         -webkit-transform: rotate(1080deg);
    }
}
 @keyframes fill-unfill-rotate {
     12.5% {
         -webkit-transform: rotate(135deg);
         transform: rotate(135deg);
    }
     25% {
         -webkit-transform: rotate(270deg);
         transform: rotate(270deg);
    }
     37.5% {
         -webkit-transform: rotate(405deg);
         transform: rotate(405deg);
    }
     50% {
         -webkit-transform: rotate(540deg);
         transform: rotate(540deg);
    }
     62.5% {
         -webkit-transform: rotate(675deg);
         transform: rotate(675deg);
    }
     75% {
         -webkit-transform: rotate(810deg);
         transform: rotate(810deg);
    }
     87.5% {
         -webkit-transform: rotate(945deg);
         transform: rotate(945deg);
    }
     to {
         -webkit-transform: rotate(1080deg);
         transform: rotate(1080deg);
    }
}
 @-webkit-keyframes green-fade-in-out {
     from {
         opacity: 0
    }
     65% {
         opacity: 0
    }
     75% {
         opacity: 1
    }
     90% {
         opacity: 1
    }
     100% {
         opacity: 0
    }
}
 @keyframes green-fade-in-out {
     from {
         opacity: 0
    }
     65% {
         opacity: 0
    }
     75% {
         opacity: 1
    }
     90% {
         opacity: 1
    }
     100% {
         opacity: 0
    }
}
 .gap-patch {
     position: absolute;
     top: 0;
     left: 45%;
     width: 10%;
     height: 100%;
     overflow: hidden;
     border-color: inherit;
}
 .gap-patch .circle {
     width: 1000%;
     left: -450%;
}
 .circle-clipper {
     display: inline-block;
     position: relative;
     width: 50%;
     height: 100%;
     overflow: hidden;
     border-color: inherit;
}
 .circle-clipper .circle {
     width: 200%;
     height: 100%;
     border-width: 3px;
     border-style: solid;
     border-color: inherit;
     border-bottom-color: transparent !important;
     border-radius: 50%;
     -webkit-animation: none;
     animation: none;
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
}
 .circle-clipper.left .circle {
     left: 0;
     border-right-color: transparent !important;
     -webkit-transform: rotate(129deg);
     -ms-transform: rotate(129deg);
     transform: rotate(129deg);
}
 .circle-clipper.right .circle {
     left: -100%;
     border-left-color: transparent !important;
     -webkit-transform: rotate(-129deg);
     -ms-transform: rotate(-129deg);
     transform: rotate(-129deg);
}
 .active .circle-clipper.left .circle {
     -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
     animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
 .active .circle-clipper.right .circle {
     -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
     animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
}
 @-webkit-keyframes left-spin {
     from {
         -webkit-transform: rotate(130deg)
    }
     50% {
         -webkit-transform: rotate(-5deg)
    }
     to {
         -webkit-transform: rotate(130deg)
    }
}
 @keyframes left-spin {
     from {
         -webkit-transform: rotate(130deg);
         transform: rotate(130deg)
    }
     50% {
         -webkit-transform: rotate(-5deg);
         transform: rotate(-5deg)
    }
     to {
         -webkit-transform: rotate(130deg);
         transform: rotate(130deg)
    }
}
 @-webkit-keyframes right-spin {
     from {
         -webkit-transform: rotate(-130deg)
    }
     50% {
         -webkit-transform: rotate(5deg)
    }
     to {
         -webkit-transform: rotate(-130deg)
    }
}
 @keyframes right-spin {
     from {
         -webkit-transform: rotate(-130deg);
         transform: rotate(-130deg)
    }
     50% {
         -webkit-transform: rotate(5deg);
         transform: rotate(5deg)
    }
     to {
         -webkit-transform: rotate(-130deg);
         transform: rotate(-130deg)
    }
}
 #spinnerContainer.cooldown {
     -webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1);
     animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1);
}
 @-webkit-keyframes fade-out {
     from {
         opacity: 1
    }
     to {
         opacity: 0
    }
}
 @keyframes fade-out {
     from {
         opacity: 1
    }
     to {
         opacity: 0
    }
}
/* Datepicker Ueberschreibungen */

 .flatpickr-calendar {
    font-size: 14px;
    line-height: 24px;
    border-radius: 5px;
    width: 315px;
}

 .flatpickr-days {
    padding: 0;
    outline: 0;
    text-align: left;
    width: 315px;
    min-height: 200px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

flatpickr-days .dayContainer {
    width: 315px;

}

.numInputWrapper span:hover {
     background: var(--color-primary);
}

.numInputWrapper span:active {
     background: var(--color-primary);
}

.flatpickr-time::before {
     content: "Zeit";
     padding-left: 10px;
     font-family: Arial, Helvetica, sans-serif;
     color: rgba(0, 0, 0, 0.54);
     font-size: 90%;
     font-weight: bold;
}

.flatpickr-calendar.showTimeInput.hasTime .flatpickr-time {
     height: 30px;
	 line-height: 30px;
}

.flatpickr-time input.numInput.flatpickr-minute,
.flatpickr-time input.numInput.flatpickr-hour {width: 100%;}

.flatpickr-months .flatpickr-month {
    background: var(--color-secondary);
}

.flatpickr-prev-month:hover, .flatpickr-next-month:hover {
    background: rgba(0, 0, 0, 0.05);
}

.flatpickr-prev-month:hover svg, .flatpickr-next-month:hover svg {
     fill: initial;
}

.flatpickr-current-month {
    font-size: 110%;
}

.flatpickr-weekdays {
     background: var(--color-secondary);
     padding-bottom: 5px;
     border-bottom: 1px solid var(--color-primary);
     margin-bottom: 10px;

}
.flatpickr-weekdays .flatpickr-weekdaycontainer {
	background: transparent;
    text-align: center;
    overflow: hidden;
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 28px;
}

 .flatpickr-day.inRange, .flatpickr-day.prevMonthDay.inRange, .flatpickr-day.nextMonthDay.inRange, .flatpickr-day.today.inRange, .flatpickr-day.prevMonthDay.today.inRange, .flatpickr-day.nextMonthDay.today.inRange, .flatpickr-day:hover, .flatpickr-day.prevMonthDay:hover, .flatpickr-day.nextMonthDay:hover, .flatpickr-day:focus, .flatpickr-day.prevMonthDay:focus, .flatpickr-day.nextMonthDay:focus {
     background: var(--color-secondary);
     border-color: var(--color-secondary);
}
 .flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay {
     background: var(--color-primary);
     border-color: var(--color-primary);
}
 span.flatpickr-weekday {
     line-height: 30px;
     max-height: 30px;
}
 .flatpickr-time .numInputWrapper {
     height: 30px;
}
 .flatpickr-time .numInputWrapper:hover {
     background-color: var(--color-secondary) !important;
}
 span.flatpickr-weekday {
     font-size: 13px;
}
 .flatpickr-time input {
     font-size: 13px;
}


.flatpickr-day.today,
.flatpickr-day.today:hover {

}

.flatpickr-time.time24hr .numInputWrapper {
    width: 40%;
    margin: 0 5px;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
    display: inline-block;
    height: initial;
    border-radius: 0px;
    padding: 0px;
    margin-right: 5px;
    font-weight: 700;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
   line-height: 1;
}

/* Brotkruemelnavi */
 .menu-title.small {
    position: relative;
}
 .sidebar.menu .breadcrumb-wrapper {
    display: none;
}
 .sidebar.menu.collapsed .breadcrumb-wrapper {
    display: block;
}
 .breadcrumb-wrapperli {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     width: 100%;
     overflow: hidden;
     margin-left: 20px;
}
 .breadcrumb-wrapper {
     writing-mode: tb-rl;
     transform: rotate(-180deg);
     position: absolute;
     top: 55px;
     left: 0;
     height: 300px;
     width: 35px;
     z-index:9999;
}
 .breadcrumb-wrapper i {
     transform: rotate(90deg);
}
 .breadcrumb-wrapper .breadcrumb:before, .breadcrumbnavi .foldedElements li:before {
     content: '\E5CC';
     color: rgba(0, 0, 0, 0.7);
     vertical-align: top;
     display: inline-block;
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 15px;
     margin: 0 5px 0 3px;
     -webkit-font-smoothing: antialiased;
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
 .breadcrumb-wrapper .breadcrumb:first-child:before {
     display: none
}
 .breadcrumb-wrapper .breadcrumb {
     color: rgba(0, 0, 0, 0.7);
     cursor: pointer;
     display: flex;
     align-items: center;
     font-size: 12px;
}
/* Infobox */
 .infobox {
     z-index: 2;
     background-color: var(--color-secondary);
     border: 1px solid #fff;
     border-radius: 2px;
     max-width: 280px;
 }

 .infobox.large {
     max-width: 560px;
 }
 .infobox.list {
	 position: absolute; top: 50px; right: 30px; max-width: 560px; white-space: initial;
 }
 .infobox.list .infobox-title {display: flex; justify-content: space-between;}
 .infobox.list .close {cursor: pointer;}
 .infobox .infobox-title {
     background-color: var(--color-primary);
     padding: 10px;
     color: #fff;
}
 .infobox .infobox-text {
     padding: 10px;
	 max-height: calc(100vh - 300px);
     overflow-y: auto;
	 max-width: 300px;
}
 .help {
     cursor: help;
     font-size: 12px;
     font-weight: bold;
}
.help.large {
     cursor: help;
     font-size: 18px;
     font-weight: bold;
	 margin-left: 10px;
}
.help.large.article {
     position: absolute;
	 right: 10px;
}
 .material-icons.help {
     position: absolute;
	 top: 0; right: 0;
}

.contentcontainer.detail .subcontent .material-icons.help {
	display: block;
}


/* Channels */
.channelcontainer .editor-field.channels input[type="text"], .channelcontainer .editor-field.channels textarea {
	padding-right: 20px;
}
 .channel-marker {
	 width: 10px; height: 10px; margin-left: 5px; border-radius: 50%; display: inline-block; background-color: var(--color-alternative);
  }
  .show-text .channel-marker {
	 margin: 0 5px 0 0;
  }
  .channel-deletebutton img {
	 display: none;
  }
  .channel-deletebutton:before {
	 content: 'delete';
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 20px;
     margin: 0 5px 0 3px;
     -webkit-font-smoothing: antialiased;
	 color: var(--color-primary);
	 text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
  }
  .channel-menubutton:before {
	 content: 'important_devices';
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
     font-size: 20px;
     margin: 0 0 0 3px;
     -webkit-font-smoothing: antialiased;
	 color: #000;
	 opacity: 0.5;text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
  }

  .channel-menubutton.active:before {
	opacity: 1;
  }


.channel.notdefault {

    display: none;
}

.channel.nullValue {;
    opacity: 0.7; border-bottom: 1px solid white; }

.channel.nullValue textarea,
.detailcontainer .editor-field .channel.nullValue input[type="text"]
	{background-color: var(--color-secondary);
    opacity: 0.7; }
.detailcontainer .editor-field .channel.nullValue .channel-marker {opacity: 0.7;}
.detailcontainer .editor-field .channel.textarea.nullValue .channel-marker {opacity: 1;}

.channel {
    display: block;

}

.channel.inputs input::placeholder,
.channel.textarea.nullValue textarea::placeholder {
	opacity: 0;
}

.channel.inputs.nullValue input::placeholder,
.channel.textarea.nullValue textarea::placeholder {
	opacity: 1;
	color: #000;
	z-index:999;
}


.channel-defaultoverlay,
.detailcontainer .editor-fieldrow .linkedelements .channel-defaultoverlay {
    display: none;
    background-color: var(--color-secondary);
    opacity: 0.8;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 20;
    cursor: pointer;
}



.channel.nullValue .channel-deletebutton,
.channel-status.nullValue .channel-deletebutton,
.channel-status.notdefault .channel-deletebutton,
.channel.notdefault.active .channel-deletebutton {
    display: none;

}



.channel-menu {
    padding: 5px;
    border: 1px solid #777;
    border-radius: 3px;
    background-color: #fff;
    box-shadow: 3px 4px 4px #777;
    min-width: 100px;
}

.channel-wysiwygbuttons {
    flex: 0 0 30px;
    width: 30px;
}

.channel-wysiwygbutton {
    height: 30px;
}

.channel-markerbuttons {
    cursor: pointer;
    border-radius: 2px;
	margin-top: 79px;
	background: #cdcdcd;
}

.channel-marker-toggle {
    border-bottom: 1px solid #E2E2E2;
	border-right: 1px solid #E2E2E2;
	border-radius: 2px;
	display: flex;
	flex-direction: column;
	align-items: center;
    justify-content: center;
	opacity: 0.8;
	background-color: var(--color-grey);
}

.channel-marker-toggle.active {
    border-top: 1px solid #E2E2E2;

}

.channel-marker-toggle.markerHighlight {
    background-color: #fafafa;
	border-left: 2px solid #fafafa;
	border-right: 1px solid #E2E2E2;
	position: relative;
	right: 2px;
	z-index: 9999;
	opacity: 1;
	 width: 32px;
}

.channel-marker-toggle.nullValue {

    background-color: #cdcdcd;



}

.channel-marker-toggle.nullValue.markerHighlight {
   border-left: 2px solid var(--color-secondary);
   background: var(--color-secondary);
	position: relative;
	right: 2px;
	z-index: 9999;
	opacity: 0.9;
	width: 31px;

}

.channel-marker-toggle.nullValue .channel-marker {

	opacity: 0.5;
}

.channel-marker-toggle.nullValue.markerHighlight .channel-marker {
	opacity: 1;
}


.channel-marker-toggle:hover {
    opacity: 1;
}




.channel-wysiwygbuttons .channel-deletebutton {
    position: relative;
    top: 12px;
    left: 3px;
}

.channel-marker-toggle .channel-marker {
    height: 16px;
    width: 16px;
    z-index: 1;
	margin: 0;
}

.channel-marker-toggle.notdefault .channel-marker {margin-left: 2px;}


.editor-field.channels {
	display: flex;

}

.editor-field.channels .channelcontainer {
    flex: 1 1 auto; min-width: 0;
}
.editor-field.channels .channel-menubutton {
    flex: 0 0 30px; cursor: pointer;
}

.editor-field.channels .channel {
	position: relative;
}

.editor-field.channels .markers {
	display: flex; justify-content: space-between;
	position: absolute; top: 15px; right: 5px;
}

.editor-field.channels .channel.default .markers {
	display: flex; justify-content: space-between;
	position: absolute; top: 12px; right: 5px;
}

 .editor-field.channels .channel.notdefault .channel-inner {
	position: relative;

}
.editor-field.channels .channel.notdefault .channel-marker {
	position: absolute; top: 10px; right: 5px;

}

.editor-field.channels .channel.notdefault .channel-deletebutton {
     position: absolute; top: 0px; right: -28px; cursor: pointer;
}

.channel.wysiwyg {

}
.channel.wysiwyg .markers {
	justify-content: flex-end;
	top: -20px; left: 5px;
	display: none;
}


.sidebar-container .editor-fieldrow.channels .editor-field.channels {
	display: flex;
	flex-direction: column;
}
.sidebar-container .editor-fieldrow.channels .editor-field.channels .channel-status {
	display: flex;
	align-items: center; height: 25px;
}
.sidebar-container .editor-fieldrow.channels .editor-field.channels .channel-marker,
.sidebar-container .editor-fieldrow.channels .editor-field.channels .selectbox {
	margin-right: 10px;
}


.sidebar-container .editor-fieldrow.channels .editor-field.channels .selectbox {
	min-width: 70px;
}

.sidebar-container .editor-fieldrow.channels .editor-field.channels .channel-deletebutton:before {
	font-size: 16px; line-height: 28px;
}

.contentcontainer.detail .sidebar-2 .fieldcontainer .editor-fieldrow.channels {
   margin-top: 5px;
}

.contentcontainer.detail .sidebar-2 .fieldcontainer .editor-fieldrow.channels label {
     margin-top: 5px; align-self: flex-start;
}


.editor-fieldrow.channels.js-unfolded .channel.default .markers {visibility: hidden;}

.editor-fieldrow.channelselect {display: flex;}
.editor-fieldrow.channelselect label {margin-right: 10px;}
.editor-fieldrow.channelselect .show-text {font-size: 12px;}

/* Anpassung channelselect */
.editor-fieldrow.channelselect {justify-content: flex-end; margin-bottom: 0; margin-top: -10px;}
.editor-fieldrow.channelselect label {
	display: none;
}

.editor-fieldrow.channelselect .channelselect-container {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	margin-right: 10px;

}
.editor-fieldrow.channelselect select {
	margin-left: 10px;
}

.editor-fieldrow.channelselect .channel-marker {
    width: 20px;
    height: 20px;
    margin-left: 0;
    border-radius: 50%;
	flex: 0 0 20px;
}


/* Inline-Dialog */
.inlinedialog {
    grid-area: inlinedialog;
}

.inlinedialog li {
    color: black;
    font-weight: normal;
    font-size: 16px;
    padding: 7px 10px 10px 10px;
}

.inlinedialog .btn-floating {
    width: 20px;
    height: 20px;
    line-height: 20px;
    position: absolute;
    right: -5px;
    top: -5px;
    font-size: 12px;
}

.inlinedialog .card {
    width: calc(100% - 20px);
    margin: 10px 20px 10px 0;
    background-color: var(--color-alternative);
    cursor: default;
    webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s; /* Firefox < 16 */
    -ms-animation: fadein 1s; /* Internet Explorer */
    -o-animation: fadein 1s; /* Opera < 12.1 */
    animation: fadein 1s;
}

.inlinedialog .card .card-content {
    font-size: 14px;
    padding: 0 20px;
}
.inlinedialog .card.errorlist .card-content {
	padding: 20px 20px 30px 20px;
}
.inlinedialog .card.errorlist .card-content li.error {
	padding-bottom: 0;
}
.inlinedialog .btn-floating i {
    font-size: 14px;
    line-height: 20px;
}

.inlinedialog ul.issues li {
    display: flex;
}

.inlinedialog ul.issues li.error {
    color: red;
}

.inlinedialog ul.issues li.error:before {
    color: red;
    content: "error";
}
.inlinedialog ul.issues.secondrow li.error:before,
.inlinedialog ul.issues li.error.noicon:before {
    display: none;
}
.inlinedialog ul.issues.secondrow li.error {
    margin-left: 25px;
}
.inlinedialog ul.issues.inframe li {
	padding: 0 0 5px 0;
}

.inlinedialog ul.issues li.warning:before {
    content: "warning";
}

.inlinedialog ul.issues li:before {
    content: "info";
    color: black;
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    text-rendering: optimizeLegibility;
    -webkit-font-feature-settings: 'liga';
    -moz-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    margin-right: 5px;
    height: 22px;
}
.inlinedialog fieldset {min-width: 100%;}

/** Hinweis über Änderung des Datensatzes im Hintergrund über einen Job */
.backgroundmodification {
    grid-area: backgroundmodification;
}

.backgroundmodification .card {
    width: calc(100% - 20px);
    margin: 10px 20px 10px 0;
    background-color: var(--color-alternative);
    cursor: default;
    webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s; /* Firefox < 16 */
    -o-animation: fadein 1s; /* Opera < 12.1 */
    animation: fadein 1s;
}

.backgroundmodification .card .card-content {
    padding: 0px 20px;
}

.backgroundmodification .card .card-content .text {
    color: black;
    padding: 7px 10px 10px 10px;
    font-weight: normal;
    font-size: 16px;
}

.backgroundmodification .card .card-content .text:before {
    content: "info";
    color: black;
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    text-rendering: optimizeLegibility;
    -webkit-font-feature-settings: 'liga';
    -moz-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    margin-right: 5px;
    height: 22px;
}

.field-error {color: red;}

.modulelist .noresults, .modulelist .subdirectories {
	display: flex; align-items: center; color: var(--color-primary);
}
.modulelist .subdirectories {
	display: flex; align-items: center; color: var(--color-primary); cursor: pointer; margin-top: 10px;
}
.modulelist .noresults .material-icons, .modulelist .subdirectories .material-icons {
	font-size: 22px;
}
/*Fehlermeldung Application */
.app-errorcontainer {
   /* border: 1px solid #c1b7b7;
    border-radius: 4px;
	padding: 20px;
	background: #fff; */
}


   /* Fehlermeldung Detaileditor */
div.error + input
  {border: 1px solid red !important;}
div.error + textarea, div.error + .ckeditor-container iframe
  {border: 1px solid red !important;}


	/* Switch */

	.switch,.switch * {
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.switch label {
    cursor: pointer
}

.switch label .input {
	display: none;
}

.switch.on label .input + .lever {
    background-color: var(--color-secondary);
}

.switch.on label .input + .lever:before, .switch.on label .input + .lever:after {
    left: 20px
}

.switch.on label .input + .lever:after {
    background-color: var(--color-primary);


}

.switch label .lever {
    content: "";
    display: inline-block;
    position: relative;
    width: 36px;
    height: 12px;
    background-color: rgba(0,0,0,0.38);
    border-radius: 12px;
    margin-right: 12px;
    -webkit-transition: background 0.3s ease;
    transition: background 0.3s ease;
    vertical-align: middle;
    margin: 2px 0;
}

.switch label .lever:before,.switch label .lever:after {
    content: "";
    position: absolute;
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    left: 0;
    top: -3px;
    -webkit-transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
    transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
    transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease;
    transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease
}

.switch label .lever:before {
    background-color: rgba(38,166,154,0.15)
}

.switch label .lever:after {
    background-color: #F1F1F1;
    -webkit-box-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12);
    box-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)
}


.switch.on:hover .input ~ .lever:before {
    -webkit-transform: scale(1.6);
    transform: scale(1.6);
    background-color: rgba(38,166,154,0.15)
}

.switch.off:hover .input ~ .lever:before {
    -webkit-transform: scale(1.6);
    transform: scale(1.6);
    background-color: rgba(0,0,0,0.08)
}

span.lever {padding:0 !important;}

.originalpictureeditor .range-field .rangecontainer {
     width: calc(100% - 50px);
}
.originalpictureeditor .range-field .rangecontainer input[type=range] {
     width: 100%;
	 }

/**
 * Drag-and-Drop
 *
 */

.js-dndhighlight {
  border: 2px solid #ffb74d !important;

}
.js-dragover,
.js-dragover * {
  background-color: var(--color-dragdrop) !important;
}

/*
 * jQuery Autocomplete
 */
.ui-autocomplete {
    z-index: 9999 !important;
	background: #fff;
	width: auto;
	max-width: 320px;
	border: 1px solid #E2E2E2;
}
.ui-autocomplete li.ui-menu-item {
    padding: 5px;
	cursor: pointer;
}
.ui-autocomplete li.ui-menu-item:hover {
    background: var(--color-alternative);
}

/*
 * Modaldialog
 */
 .modaldialog .ui-helper-hidden-accessible {
     display: none;
}
 .modaldialog.card:hover {
	 background: #fff;
	 cursor: default;
 }
 .modaldialog .card-text {
	 font-size: 14px;
	 margin-bottom: 20px;
	 color: var(--color-primary);
 }
 .modaldialog.card .card-content .card-title {
	 font-weight: 500;
	 color: var(--color-primary);
	 display: flex;
	 align-items: center;
	 justify-content: flex-start;

 }
 .modaldialog.card .card-content .card-title .buttons {
	 font-weight: 500;
	 color: var(--color-primary);
	 margin-left: auto;
	 cursor: pointer;

 }
 .modaldialog.card .card-content .card-title .buttons .close,
 .modaldialog.card .card-content .card-title .buttons .maximize {
	 height: 25px;

 }
 .modaldialog.card .card-content .card-title .material-icons {
	 margin-right: 10px;
 }

 .modaldialog.card .card-content .card-title .warning .material-icons:before {
	 content: "warning";
	 font-size: 18px;
 }
 .modaldialog-container.treeselect .modaldialog.card .card-content .card-title .material-icons:before {
	 content: "folder";
 }
 .modaldialog .card-action {
	 font-size: 14px;
 }
 .modaldialog .card-action a {
	 cursor: pointer;
	 color: var(--color-primary) !important;
	 font-weight: 500;
 }

 .modaldialog .card-action a:hover {
	 cursor: pointer;
	 color: var(--color-secondary) !important;
 }
 .modaldialog .card-action a.disabled:hover,
 .modaldialog .card-action a.disabled {
	 cursor: default;
	 color: #e6e6e6 !important;
 }

.modaldialog-container {
    display: none;
}


.modaldialog-overlay {
    z-index: 999999 !important;
    background-color: rgba(0,0,0,0.5);
    height: 100vh;
    width: 100vw;
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.modaldialog {
    opacity: 0;
    z-index: 999999 !important;
    background-color: #fff;

}

.modaldialog .modalerror { padding: 10px 5px; font-size: 14px; color: red;}

.modaldialog-container.visible .modaldialog-overlay {
    opacity: 1;
    transition: opacity ease-in-out 0.5s;
}

.modaldialog-container.visible .modaldialog {
    opacity: 1;
    transition: opacity ease-in-out 0.5s;
}

.modaldialog-container .modaldialog.card {
	height: auto;
	max-height: calc(100vh - 120px);
	width: auto;
	min-width: 300px;
	max-width: calc(100vw - 20px);
	overflow: hidden;

}

.modaldialog-container .modaldialog .modalwrapper {
	max-height: calc(100vh - 300px);
    overflow: hidden;
    overflow-y: auto;
}

.modaldialog-container .modaldialog .card-action {
	display: flex;
	justify-content: space-between;
	padding: 15px 10px;
}

.modaldialog-container .modaldialog .card-action a {
	margin-right: 0;
}
.modaldialog-container .modaldialog .card-action .material-icons {
	color: var(--color-primary); margin-right: 5px;
}

.modaldialog-container.upload .modaldialog.card {
    width: 800px;
}



/* Modaldialog full window */

.modaldialog-container.maximized .modaldialog.card {
	width: 100vw; height: 100vh; max-width: 100vw; max-height: calc(100vh - 50px);
	top: 25px; margin: 0; padding: 0;
}
.modaldialog-container.maximized .modaldialog.card .card-content {
	height: 100%;
}
.modaldialog-container.maximized .modaldialog .modalwrapper {
    max-height: calc(100vh - 150px);
	height: 100vh;

}

.modaldialog-container.maximized  .modaldialog-overlay {
    background: transparent;
	}

.modaldialog-container.maximized div.diffOutputArea {
    max-height: calc(100vh - 250px);
	height: 100vh;
}

.modaldialog-container.maximized div.mergeViewWindow {
    max-height: calc(100vh - 150px);
	height: 100vh;
}

.modaldialog-container.visible {
    display: block;
}
.modaldialog-container .maximize .material-icons:before {
    content: "crop_square";
}
.modaldialog-container.visible.maximized .maximize .material-icons:before {
    content: "remove";
}
/* Modaldialog für Applikationen */
.application-dialog .modaldialog-overlay {
    position: absolute;
    width: 100%;
}

.application-dialog.detailsearch .modaldialog-overlay {
    justify-content: flex-start;
}

.application-dialog.detailsearch .modaldialog.card {
    margin-left: 284px;
}

/* Modaldialog Items */

.modaldialog .card-action a {
    display: inline-flex;
    align-items: center;
}

 .modaldialog .card-action a:before {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
     font-size: 16px;
     margin-right: 5px;
}
 .modaldialog .card-action a.done:before {

     content: "done";
}
.modaldialog .card-action a.ok:before {
     content: "check";
}
.modaldialog .card-action a.cancel:before {
     content: "close";
}
.modaldialog .card-action a.start:before {
     content: "play_arrow";
}
.modaldialog .card-action a.copy:before {
     content: "content_copy";
}
.modaldialog .card-action a.select:before {
     content: "check";
}
.modaldialog .card-action a.close:before {
     content: "close";
}
.modaldialog .card-action a.inject:before {
     content: "add";
}
.modaldialog .card-action a.merge:before {
     content: "check";
}
.modaldialog .card-action a.move:before {
     content: "forward";
}
.modaldialog .card-action a.recover:before {
     content: "history";
}
.modaldialog .card-action a.retryupload:before {
     content: "redo";
}
.modaldialog .card-action a.createlink:before {
     content: "insert_link";
}
.modaldialog .card-action a.replicate:before {
     content: "content_copy";
}
.modaldialog .card-action a.move:before {
     content: "forward";
}
.modaldialog .card-action a.savefilesandclose:before {
     content: "done";
}
.modaldialog .card-action a.block:before {
     content: "block";
}

/* Modaldialog tinymce */

.modaldialog .detailcontainer.tinymce-link-editor {
     box-shadow: none;
}
.modaldialog .input.sectionsimpleselect.select.tinymce-link-editor {
     align-items: flex-start;
     margin-bottom: 5px;
}
.modaldialog .simpleselect-choice.tinymce-link-editor {
     display: flex;
}
.modaldialog .input.sectionsimpleselect.select.tinymce-link-editor .delete {
	margin-right: 20px; margin-left: auto;
}
 .modaldialog .simpleselect-choice.tinymce-link-editor .title {
	 width: 250px;
}
.modaldialog .simpleselect-choice.tinymce-link-editor .simpleselect {
     align-items: flex-start;
}
.modaldialog .tinymce-link-editor .editor-field .simpleselect .material-icons,
.modaldialog .tinymce-link-editor .sectionsimpleselect .simpleselect .material-icons {
    font-size: 16px; margin-right: 5px;
}
.modaldialog .simpleselect-choice.tinymce-link-editor .thumbnailContainer img {width: 80px; height: 80px; object-fit: cover;}
.modaldialog .detailcontainer.tinymce-picture-settings-editor {box-shadow: none;}

/* Compute Messages */
.card.computemessage {
	position: absolute;
	top: 100px;
	right: 30vw;
    margin: 10px 20px 10px 0;
    background-color: var(--color-secondary);
    cursor: default;
    webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 1s; /* Firefox < 16 */
    -ms-animation: fadein 1s; /* Internet Explorer */
    -o-animation: fadein 1s; /* Opera < 12.1 */
    animation: fadein 1s;
}


/* Taskbar */
.taskbar-item {
    display: none;
}

.taskbar .btn-floating {
	width: 20px;
    height: 20px;
    line-height: 20px;
	position: absolute;
	right: -5px;
	top: -5px;
	font-size: 12px;
}

.taskbar .card {
	width: auto;
	width: calc(100% - 20px);
	margin: 10px 20px 10px 0;
	background-color: var(--color-alternative);
	cursor: default;
}

.taskbar .card .card-content {
    font-size: 14px;
	padding: 20px;
}

.taskbar .btn-floating i {

    font-size: 14px;
    line-height: 20px;
}
.taskbar .state-success,
.taskbar .state-failed,
.taskbar .state-running {
display: flex;
align-items: center;
}

.taskbar .state-failed .item-error {
cursor: pointer;
font-weight: normal;
margin-left: 20px;
display: flex;
align-items: center;
    height: 25px;
    font-size: 13px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.8);
    line-height: 25px;
    padding: 0 12px;
    border-radius: 16px;
    background-color: var(--color-secondary);

}
.taskbar .state-success .material-icons  {
font-size: 20px;
margin-right: 5px;
}
.taskbar .state-failed .material-icons  {
font-size: 20px;
margin-right: 5px;
}
.taskbar .state-failed.license .material-icons  {
align-self: start;
line-height: 20px;
}

.taskbar .state-running .preloader-wrapper.small {
	width: 20px; height: 20px; margin-right: 10px;
	margin-left: 0;
}

.taskbar .item-error-list .error-details {
	display: flex;
}
.taskbar .item-error-list .error-details .objectname {
	font-weight: bold;
	min-width: 80px;
	margin-right: 10px;

}

/* simpleselect Linkartikel */
.simpleselect-section {
    border: 1px solid #E2E2E2;
    padding: 1px 5px;
    border-radius: 2px;
    width: 100%;
    height: auto;
	display: flex;
	flex-wrap: wrap;
}
.simpleselect-section.empty {
	align-items: center;
}
.sidebar-container .simpleselect-section {
     border: 0; padding: 10px 0; }

.sidebar-container .simpleselect-section .simpleselect.title {
     flex: 1 1 100%; width: 100%; }

.editor-field .simpleselect-container {
    display: flex; align-items: center;
}
.sidebar-container .simpleselect-container {
	flex-wrap: nowrap;
}
.sidebar-container .simpleselect-section .title,
.sidebar-container .simpleselect-section .delete,
.sidebar-container .simpleselect-section .change
 {
height: 18px;
}

.sidebar-container .simpleselect-section .delete,
.sidebar-container .simpleselect-section .change {
    flex: 0 0 20px;
    margin-right: 0;
    align-self: flex-end;
	}
.flex-container.choose-and-delete .simpleselect-section.linkdelete,
.flex-container.choose-and-delete .simpleselect-section.change {
    flex: 0 0 110px;
    margin-right: 0;
    align-self: flex-end;
	border: 0;
	}

.flex-container.choose-and-delete .simpleselect-section.linkdelete .material-icons,
.flex-container.choose-and-delete .simpleselect-section.change .material-icons {
	margin-right: 2px;
	}
.sidebar-container .flex-container.choose-and-delete .simpleselect-section.linkdelete,
.sidebar-container .flex-container.choose-and-delete .simpleselect-section.change {
    flex: 0 0 100px;
	}



.editor-field .simpleselect,
.modaldialog .simpleselect {
    display: flex; align-items: center;
    margin-right: 20px;
}
.editor-field .multiselect.inline .simpleselect.inline {margin-left: 20px;}
.sidebar-container .editor-field a.simpleselect {
    margin-top: 4px;
}

.editor-field .simpleselect .material-icons {
    font-size: 25px; margin-right: 3px;
    color: var(--color-primary);
}

/* Liste, Taskbar */
.taskbar-item.active {
    display: inline-block;
}

/* Fade-in Animation */
@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; }
}

.boosttoggle > div {
    display: inline-block;
}

/**
 * Taskbar
 *
 */
.tab.slider__nav {
  display: flex; position: relative;
  white-space: nowrap;
}
.tab.slider__nav .dropdownLink  {
  order: 2; font-size: 24px;
}
.tab.slider__nav .material-icons {
  font-size: 24px;
}
.tableistenmenue.dropdown-contents {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
  border-top: 1px solid #c1b7b7;
  border-radius: 0 0 4px 4px;
  margin: 0;
  display: none;
  min-width: 100%;
  width: auto;
  position: absolute;
  top: 35px;
  background: var(--color-grey);
  background: #fff;
  padding-top: 10px;
  max-height:	calc(100vh - 150px);
}
.usermenue.dropdown-contents {
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
    border-top: 1px solid #c1b7b7;
    border-radius: 0 0 4px 4px;
    margin: 0;
    width: auto;
    position: absolute;
    top: 35px;
    background: var(--color-grey);
    background: #fff;
}

.usermenue.dropdown-contents li {
    padding: 10px;
    color: var(--color-font);
}
header.header {
  z-index: 999999;
  min-height: 50px;
}
.tab.slider__nav .dropdownLink .material-icons {
  transition: all ease 0.5s;
}
.tab.slider__nav .dropdownLink.active .material-icons {
  transform: rotate(180deg); transition: all ease 05.s;
}
.tableistenmenue.dropdown-contents li {
  white-space: nowrap;
  display: flex;
  justify-content: space-between;
  color: var(--color-font);
}
.tableistenmenue.dropdown-contents li .material-icons {
  font-size: 16px;
}
.tableistenmenue.dropdown-contents li .chaincontainer {
  color: var(--color-font);
  padding: 0 10px;
  display: inline-block;
}
.tableistenmenue.dropdown-contents li .description{
  display: inline-block; max-width: 300px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding:0; margin-bottom: -5px;
}
.tableistenmenue.dropdown-contents li .descriptioncontainer {
  margin-left: 2px; margin-right: 5px;
}
.tab.slider__nav .activeApplication {
  padding: 0px 5px 0px 20px;
  order: 1;
  cursor: pointer;
  margin-top: 5px;
  font-weight: bold;
  box-sizing: border-box;
}

.tableistenmenue.dropdown-contents li span {color: var(--color-font);}


.tableistenmenue .chain {color: var(--color-font); display: flex;}

.tableistenmenue .following {
	display: flex;
}

.tableistenmenue .following li:before {
	content: "arrow_forward";
	font-family: 'Material Icons';
     text-rendering: optimizeLegibility;
     -webkit-font-feature-settings: 'liga';
     -moz-font-feature-settings: 'liga';
     font-feature-settings: 'liga';
     color: inherit;
     font-size: inherit;
     margin-right: 5px;
	 margin-left: 10px;
}

/* Trenner */

.editor-field > .separator,
.subcontent > .separator {background: var(--color-primary);
    color: #fff;
    padding: 10px;
    margin: 15px 0 5px 0;

}



.to-bottom {vertical-align: bottom !important;}
.to-top {vertical-align: top !important;}



/* iframe */
iframe body {
	overflow-y: auto;
}

/* Range */

.range-field {
    position: relative
}

.range-field input[type=text]:disabled {
	color: var(--color-primary);
	opacity: 1;
	border-bottom: 0;
	margin-left: 20px;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 0;
}
.range-field label {
	margin-right: 20px;
	width: 100px;
}

input[type=range],input[type=range]+.thumb {
    cursor: pointer
}

input[type=range] {
    position: relative;
    background-color: transparent;
    border: none;
    outline: none;
    width: 100%;
	width: auto;
    margin: 15px 0;
    padding: 0
}

input[type=range]:focus {
    outline: none
}

input[type=range]+.thumb {
    position: absolute;
    top: 10px;
    left: 0;
    border: none;
    height: 0;
    width: 0;
    border-radius: 50%;
    background-color: var(--color-primary);
    margin-left: 7px;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

input[type=range]+.thumb .value {
    display: block;
    width: 30px;
    text-align: center;
    color: #26a69a;
    font-size: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

input[type=range]+.thumb.active {
    border-radius: 50% 50% 50% 0
}

input[type=range]+.thumb.active .value {
    color: #fff;
    margin-left: -1px;
    margin-top: 8px;
    font-size: 10px
}

input[type=range] {
    -webkit-appearance: none
}

input[type=range]::-webkit-slider-runnable-track {
    height: 3px;
    background: #c2c0c2;
    border: none
}

input[type=range]::-webkit-slider-thumb {
    border: none;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    background: var(--color-primary);
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s;
    -webkit-appearance: none;
    background-color: var(--color-primary);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    margin: -5px 0 0 0
}

.keyboard-focused input[type=range]:focus:not(.active)::-webkit-slider-thumb {
    -webkit-box-shadow: 0 0 0 10px rgba(38,166,154,0.26);
    box-shadow: 0 0 0 10px rgba(38,166,154,0.26)
}

input[type=range] {
    border: 1px solid white
}

input[type=range]::-moz-range-track {
    height: 3px;
    background: #c2c0c2;
    border: none
}

input[type=range]::-moz-focus-inner {
    border: 0
}

input[type=range]::-moz-range-thumb {
    border: none;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    background: #26a69a;
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s;
    margin-top: -5px
}

input[type=range]:-moz-focusring {
    outline: 1px solid #fff;
    outline-offset: -1px
}

.keyboard-focused input[type=range]:focus:not(.active)::-moz-range-thumb {
    box-shadow: 0 0 0 10px rgba(38,166,154,0.26)
}

input[type=range]::-ms-track {
    height: 3px;
    background: transparent;
    border-color: transparent;
    border-width: 6px 0;
    color: transparent
}

input[type=range]::-ms-fill-lower {
    background: #777
}

input[type=range]::-ms-fill-upper {
    background: #ddd
}

input[type=range]::-ms-thumb {
    border: none;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    background: #26a69a;
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s
}

.keyboard-focused input[type=range]:focus:not(.active)::-ms-thumb {
    box-shadow: 0 0 0 10px rgba(38,166,154,0.26)
}


/* Blinker */



.blink_me {
 animation: blinker 2s linear infinite;
}

.blink_me .slow {
 animation: blinkerslow 2s linear infinite;
}

@keyframes blinkerslow {
   0% {border: 0;}
  25% {border: 0;}
  50% { box-shadow: 0 0 0 5px rgba(38,166,154,0.26); border-radius: 50%; }
  75% {border: 0; }
  100% {border: 0;}
}


@keyframes blinker {
  50% { opacity: 0; }
}

/* Drag and Drop */

        .sortable-chosen { background: var(--color-dragdrop) !important; cursor: move; }
        /* Artikel-Editor: Bilder/Thumbnails Auswahl */
        .linkedelements .sortable-chosen .thumbnailContainer:before {
            position: absolute;
            content: "";
            height: 100%;
            width: 100%;
            background: rgba(255, 243, 224, 0.47) !important;
        }


.modulelist.article .items:not(.notice) > div.list_open_editor,
.modulelist .listresults .items .item.list_open_editor {
	background: var(--color-secondary);
}

.passcheck {
    margin-left: 3rem;
    background: #E2E2E2;
}

.passcheck.risky {
    background: #993333;
}

.passcheck.weak {
    background: #f09206;
}

.passcheck.moderate {
    background: #ffcc00;
}

.passcheck.good {
    background: #8fdb1d;
}

.passcheck.strong {
    background: #339933;
}
