body, html {
    height: 100%;
    margin: 0;
    overflow: hidden;
}

body.light {
  background: #F4F4F4;
}
.topcoat-notification.stock.current-stock,
.topcoat-notification.stock.current-location {
  font-size: 1.3rem;
  text-shadow: none;
}
.topcoat-notification.stock.current-stock:not(:empty),
.topcoat-notification.stock.current-location:not(:empty) {  
  background: #E5F1FB;
  color: #288EDF;
}
.topcoat-notification.stock.current-stock:before {
  content: "Lager: ";
}
.topcoat-notification.stock.current-location:before {
  content: "Stelle: ";
}
.topcoat-notification.stock.current-stock:empty:after,
.topcoat-notification.stock.current-location:empty:after {
  content: "?";
}

.main-content > *:not(:first-child) {
  margin-top: 0.5em;
  margin-bottom: 0.1em;
}

/* identification-list */
.topcoat-list.identification-list, .topcoat-list.stock-position-list {
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  flex-grow: 1;
  flex-shrink: 1;
  flex-direction: column;
  align-items: stretch;
  align-content: flex-start;
}

.topcoat-list.stock-position-list .topcoat-list__container.positions {
  overflow-y: scroll;
}

/* stock-position */
.main-content.locked .dispobox-delivery { display: none; }

.stock-position-list h2 button,
.stock-position-list button.icomatic { line-height: 2rem; padding: 0px 0.25rem; }
.stock-position-list button.icomatic { font-size: 1.2rem; }
.stock-position-list h2 span.select-all { display: flex; align-items: center; }

table.stock-positions { border-collapse: collapse; float: right; color: #333; font-size: 1.1rem; margin: 0.35em 0.15em 0; }
table.stock-positions tr:first-child td { border-top: 1px solid #333; }
table.stock-positions td { border-bottom: 1px solid #333; padding: 0 0.5rem; }
table.stock-positions td.quantity { min-width: 3rem; }
table.stock-positions td.value { min-width: 7rem; }
table.stock-positions td.value:before { content: attr(data-currency) ' '; }
 
li.stock-position-item { padding: 1.0rem 0.75rem;}
li.stock-position-item { display: flex; flex-direction: row; flex-wrap: nowrap; }
.stock-position-item .topcoat-checkbox { margin: 0 0.5rem; }
.stock-position-item .description > div { display: inline-block; }
.stock-position-item .description .text {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: pre-wrap;
  display: block;
  width: 100%;
  padding: 0.15em 0.5em 0.2em;
}
.stock-position-item .stock-detail { display: flex; align-items: center; justify-content: flex-end; width: 21rem; flex-shrink: 0; }
.stock-position-item .topcoat-notification:not(:last-child) { margin-right: 0.25rem; }
.stock-position-item .topcoat-notification.externalReference { background: #E5F1FB; color: #288EDF; }
.stock-position-item .topcoat-notification.location { background: #9DCB8A; color: white; min-width: 6.0rem; text-align: center; font-size: 1.8rem; }
.stock-position-item .topcoat-notification.quantity { background: #E1A6A6; color: white; min-width: 2.5rem; text-align: center; }
.stock-position-item .topcoat-notification.value { background: #E5F1FB; min-width: 2.5rem; color: #288EDF; text-align: center; }
.stock-position-item .topcoat-notification.value:before { content: attr(data-currency) ' '; }
.stock-position-item .topcoat-notification.stock { background: #E5F1FB; min-width: 2.5rem; color: #288EDF; text-align: center; font-size: 1.8rem; }
.stock-position-item .topcoat-notification:empty:before { content: '?'; }
.stock-position-item .topcoat-text-input { padding: 0.15em 0.5em 0.2em; width: 8rem; line-height: initial; height: initial; font-size: 1.8rem; }
.stock-position-item.unchecked .topcoat-notification { background: #ec514e; color: white; }
.editing .stock-position-item { opacity: 0.4; }

/* dispobox-delivery-detail */
.dispobox-delivery-detail .topcoat-list__item {
  padding: 0.75rem 1.25rem;
}

.dispobox-delivery-detail .topcoat-text-input, .dispobox-delivery-detail .topcoat-text-input--large {
  line-height: 2.5rem;
  height: 2.5rem;
}

.tt input:nth-child(2) { margin: 0 0.5rem; }
.tt input.zip, .tt input.city { display: none; }
input[type="number"]::-webkit-outer-spin-button, 
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  -moz-appearance: textfield;
}
@media (max-width: 850px) {
  .tt input.tt { width: 16.5rem; }
  .tt input.zip { width: 5.5rem;  }
  .tt input.city { width: 15rem; }
}
@media (min-width: 850px) {
  .tt input.tt { width: 16.5rem; }
  .tt input.zip { width: 5.5rem; }
  .tt input.city { width: 22rem; }
}

.comment input[type="text"] {
  width: 30rem;
}

.weights > span {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-grow: 1;
}

.weights span.arithmetics, .weights label { 
  margin: 0 0.5rem;
  flex-grow: 0;
}

.bags input[type="number"] {
  width: 5.5rem;
}

.weights input[type="number"] {
  width: 7.5rem;
}

.weights input[readonly] {
  pointer-events: none;
  tab-index: -1;
}

.dispobox-status .topcoat-switch {
  width: 12rem;
}

.dispobox-status .topcoat-switch__input:checked + .topcoat-switch__toggle {
  margin-left: 8.7rem;
}

.dispobox-status .topcoat-switch__toggle:before {
  content: attr(data-on);
  padding-left: 1.5rem;
  text-transform: uppercase;
  text-align: center;
  padding-right: 1.5rem;
}

.dispobox-status .topcoat-switch__toggle::after {
    content: attr(data-off);
    background-color: #e7d1cf;
    left: 1rem;
    padding-left: 2rem;
    text-transform: uppercase;
    text-align: center;
    padding-right: 2rem;
}

.dispobox-status .topcoat-switch__toggle::before, 
.dispobox-status .topcoat-switch__toggle::after {
    top: -1px;
    width: 11rem;
}

.date-range-picker {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.date-range-picker > * {
  margin-right: 1rem;
  font-size: 1.15rem;
}

.date-range-picker > input[type="text"], .date-range-picker > button {
  line-height: 2.5rem;
  height: 2.5rem;
  font-size: 1rem;
  padding: 0 1rem;
}

.date-range-picker > input[type="text"] {
  width: 10em;
}

#tabs .topcoat-tab-bar__item label {
  cursor: pointer;
}

body.light #content header::before {
  border-bottom: 1px solid #E0E0E0;
}
#content header::before {
    content: '';
    width: 100%;
    display: block;
    position: absolute;
    left: 0;
    top: 23px;
}
#content header, #content footer {
  position: relative;
}
footer .address {
  white-space: pre-line;
  font-size: 0.8rem;
}

body.light #content header h2 {
    background: #F4F4F4;
}
#content header h2 {
    font-weight: 300;
    margin: 10px 0 25px;
    font-size: 20px;
    position: relative;
    display: inline-block;
    padding-right: 10px;
}

footer h2 {
  font-weight: 300;
  margin: 10px 0 25px;
  font-size: 0.6rem;
  position: relative;
  display: inline-block;
  padding-right: 10px;
}

.topcoat-table.horizontal-scroll {
  overflow-x: scroll;
}

.topcoat-table {
  font-size: 0.8rem;
  border-top: 1px solid #9daca9;
  border-bottom: 2px solid #9daca9;
}

.topcoat-table table {
  width: 100%;
}

.topcoat-table thead th {
  padding: 4px 20px;
  font-size: 0.9em;
  font-weight: 400;
  background-color: #d2d6d6;
  color: #454545;
  text-shadow: 0 1px 0 rgba(255,255,255,0.5);
  border-top: 1px solid rgba(255,255,255,0.5);
  border-bottom: 1px solid rgba(255,255,255,0.23);
}

.topcoat-table thead th, .topcoat-table tbody td {
  padding: 4px 10px;
  font-size: 0.9em;
}

.topcoat-table tbody td:not(:last-child) {
  border-right: solid 1px #ddd;
}

.topcoat-table tbody tr:not(:last-child) td {
  border-bottom: solid 1px #ddd;
}

.topcoat-table tbody tr:first-child td {
  border-top: 1px solid #9daca9;
}

.topcoat-table th, .topcoat-table td {
  white-space: nowrap;
}

.topcoat-table tr.level-1 {
  color: #333;
}
.topcoat-table tr.level-1:nth-child(even) {
  background: white;
}
.topcoat-table tr.level-2 {
  background: #FFFFAF;
}
.topcoat-table tr.level-3 {
  background: #FFEC15;
}

td.client_id, td.container_name, td.units, td.weight,
td.list_type, td.period_year, td.period_month {
  text-align: right;
}

td.chip_id {
  font-family: 'source-code-pro';
}
/* ########################################################################## */

h1.nnch-logo:before {
  background-size: 100%;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBpZD0ibm5jaCIgdmlld0JveD0iMCAwIDEyMS40NTM0NCA2OC4wNDk3NTMiIGhlaWdodD0iMTkuMjA1MTUzbW0iIHdpZHRoPSIzNC4yNzY4NTltbSI+PGRlZnMgaWQ9ImRlZnM4NTI2Ij48Y2xpcFBhdGggaWQ9ImNsaXBQYXRoMTAzNjYiIGNsaXBQYXRoVW5pdHM9InVzZXJTcGFjZU9uVXNlIj48cGF0aCBpZD0icGF0aDEwMzY4IiBkPSJtIDAsNTk1LjI3NiA4NDEuODksMCBMIDg0MS44OSwwIDAsMCAwLDU5NS4yNzYgWiIgLz48L2NsaXBQYXRoPjwvZGVmcz48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzQ0Ljk4NzU2LDcuMzc2OTU2OCkiIGlkPSJsYXllcjEiPjxnIGlkPSJnMTA5NzQiIHRyYW5zZm9ybT0ibWF0cml4KDAuMzc5NjkxNDksMCwwLC0wLjM1OTEwNTM5LDI5MS4xNzI3NSwxNTUuNDkyNDIpIiBzdHlsZT0iZGlzcGxheTppbmxpbmUiPjxwYXRoIGQ9Im0gNDYxLjYwNSwzNjEuNzU4IC0zMTkuODcyLDAgMCw5MS43ODQgMzE5Ljg3MiwwIDAsLTkxLjc4NCB6IiBzdHlsZT0iZmlsbDojM2MyMDEzO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDEwMzYwIiAvPjxnIGlkPSJnMTAzNjIiPjxnIGlkPSJnMTAzNjQiIGNsaXAtcGF0aD0idXJsKCNjbGlwUGF0aDEwMzY2KSI+PGcgaWQ9ImcxMDM3MCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzg5LjU1ODYsNDA3LjMyMDMpIj48cGF0aCBkPSJtIDAsMCBjIC0zLjUyMSwzLjA1MyAtNy44MDQsNC4wMTEgLTEwLjgxLDYuMDgzIC0yLjEyOCwxLjYzNCAtMS44MDksMy43NDYgLTAuNzQsNC44ODcgMi41MzcsMi44MzIgNy44MzgsMS40OTYgOS4wNzksMS4yMDggMS41NjcsLTAuNDU5IDIuNDA5LC0wLjk1IDMuODk4LC0xLjYxNiBsIDAsMy44MjUgYyAtNi4zMzgsMS44NDIgLTE2LjQ1MSwzLjYgLTIwLjQ0LC0yLjc2MyAtMS40ODMsLTIuNjE2IC0xLjg2NSwtNy4zNzEgMi4zNzYsLTEwLjEzMiA0LjI2OCwtMy4zODcgMTEuMjU0LC01LjAwNCAxMi4xMDQsLTcuNzM5IDAuNTUsLTEuNDkxIC0wLjA4NCwtMi45MjUgLTEuMTE4LC0zLjkzNiAtMy43NjUsLTMuNTA1IC05LjgzNCwtMS4zMDUgLTEzLjczNCwwLjQzNCBsIC0wLjAzLC0zLjc3MyBjIDQuMjUxLC0xLjkgOS42MDUsLTIuMzg4IDE0LjM2OSwtMS4zNjIgMy4yODEsMC43MjYgNi45MTgsMy41OTkgNy41MjYsNy4xNDYgQyAzLjA1MiwtNC4yNCAyLjMxMiwtMS45NTkgMCwwIG0gMzguMiwtMTQuNTA1IGMgLTEuODA0LDAgLTMuMjc0LDEuNDc2IC0zLjI3NCwzLjI4MSAwLDEuNzk4IDEuNDcsMy4yNjQgMy4yNzQsMy4yNjQgMS43OTYsMCAzLjI1NywtMS40NjYgMy4yNTcsLTMuMjY0IDAsLTEuODA1IC0xLjQ2MSwtMy4yODEgLTMuMjU3LC0zLjI4MSBtIDAsNi44OTUgYyAtMi4wMDgsMCAtMy42MzIsLTEuNjIyIC0zLjYzMiwtMy42MTQgMCwtMi4wMTIgMS42MjQsLTMuNjMyIDMuNjMyLC0zLjYzMiAyLjAwNCwwIDMuNjQyLDEuNjIgMy42NDIsMy42MzIgMCwxLjk5MiAtMS42MzgsMy42MTQgLTMuNjQyLDMuNjE0IE0gLTIzLjY4NCwwIGMgLTMuNTI3LDMuMDUzIC03LjgxNCw0LjAxMSAtMTAuODMxLDYuMDgzIC0yLjEyMiwxLjYzNCAtMS43OTYsMy43NDYgLTAuNzIxLDQuODg3IDIuNTQyLDIuODMyIDcuODQyLDEuNDk2IDkuMDc4LDEuMjA4IDEuNTYyLC0wLjQ1OSAyLjQwMSwtMC45NSAzLjg4NywtMS42MTYgbCAwLDMuODI1IGMgLTYuMzE5LDEuODQyIC0xNi40MzgsMy42IC0yMC40MzQsLTIuNzYzIC0xLjQ2MSwtMi42MTYgLTEuODQ4LC03LjM3MSAyLjM3NiwtMTAuMTMyIDQuMjY1LC0zLjM4NyAxMS4yNDYsLTUuMDA0IDEyLjExNiwtNy43MzkgMC41MzYsLTEuNDkxIC0wLjEwNywtMi45MjUgLTEuMTE1LC0zLjkzNiAtMy43NzcsLTMuNTA1IC05LjgzOCwtMS4zMDUgLTEzLjc1NiwwLjQzNCBsIC0wLjAxLC0zLjc3MyBjIDQuMjQsLTEuOSA5LjYwNCwtMi4zODggMTQuMzU3LC0xLjM2MiAzLjI2OCwwLjcyNiA2LjkxOSwzLjU5OSA3LjUwNiw3LjE0NiAwLjU5NSwzLjQ5OCAtMC4xNDUsNS43NzkgLTIuNDUzLDcuNzM4IG0gNjIuMjM5LC0xMS4wNTUgLTEuMDkxLDAgMCwxLjE5MSAxLjA5MSwwIGMgMC4zNCwwIDAuNjY0LC0wLjEgMC42NjQsLTAuNTgxIDAsLTAuMzkgLTAuMjI3LC0wLjYxIC0wLjY2NCwtMC42MSBtIDAuNjk1LC0wLjI2MyAwLDAuMDEzIGMgMC4xMjYsMC4wNDYgMC42MjQsMC4yMjEgMC42MjQsMC45NzIgMCwwLjYzNiAtMC40MTksMS4wMzMgLTEuMjM4LDEuMDMzIGwgLTEuODQ5LDAgMCwtMy44MjkgMC42NzcsMCAwLDEuNTc3IDAuOTgzLDAgYyAwLjYyMywwIDAuNzcyLC0wLjMxNyAwLjc3MiwtMS4wMjYgMCwtMC4xODMgMCwtMC40MDEgMC4wOTIsLTAuNTUxIGwgMC43MSwwIGMgLTAuMTQ3LDAuMTUgLTAuMiwwLjU1MSAtMC4yLDEuMDAyIDAsMC41OTMgLTAuMzM3LDAuNzgzIC0wLjU3MSwwLjgwOSBtIC0xOS43NDEsMC4yNDEgLTAuMTEzLDAgYyAtMC44NTEsMCAtNy4wOTksLTAuMjY0IC03LjA1MywxMi4yMDcgMC4wNTEsMTEuNTY0IDYuMTIxLDExLjIzOSA3LjEyLDExLjIzOSAxLjAwNywwIDcuMDcsMC4zMjUgNy4xMjQsLTExLjIzOSAwLjA0LC0xMi40NzEgLTYuMjEyLC0xMi4yMDcgLTcuMDc4LC0xMi4yMDcgTSAxOS40NTgsMTYuMTM1IEMgMTcuNDM3LDE2LjE0OSA0LjM2MSwxNS45MzQgNC4zMDgsMC41NDMgYyAwLC0xNS4yODEgMTIuOTA4LC0xNS44ODUgMTUuMTQ5LC0xNS44NyAyLjIzMiwtMC4wMTUgMTUuMTU2LDAuNTg5IDE1LjExOCwxNS44NyBDIDM0LjU1NSwxNS45MzQgMjEuNDksMTYuMTQ5IDE5LjQ1OCwxNi4xMzUgTSAtMTI3LjIzOSwwIGMgLTMuNTI4LDMuMDUzIC03LjgxLDQuMDExIC0xMC44MzEsNi4wODMgLTIuMTIzLDEuNjM0IC0xLjc5OCwzLjc0NiAtMC43MjEsNC44ODcgMi41NCwyLjgzMiA3Ljg0NCwxLjQ5NiA5LjA3NywxLjIwOCAxLjU2MSwtMC40NTkgMi40MDEsLTAuOTUgMy44OSwtMS42MTYgbCAwLDMuODI1IGMgLTYuMzIxLDEuODQyIC0xNi40NDMsMy42IC0yMC40MzksLTIuNzYzIC0xLjQ2MywtMi42MTYgLTEuODQ1LC03LjM3MSAyLjM3OSwtMTAuMTMyIDQuMjU5LC0zLjM4NyAxMS4yNDQsLTUuMDA0IDEyLjExMywtNy43MzkgMC41MzcsLTEuNDkxIC0wLjEwNywtMi45MjUgLTEuMTEzLC0zLjkzNiAtMy43NzksLTMuNTA1IC05LjgzOSwtMS4zMDUgLTEzLjc1NywwLjQzNCBsIC0wLjAwNywtMy43NzMgYyA0LjIzNywtMS45IDkuNiwtMi4zODggMTQuMzU2LC0xLjM2MiAzLjI2MywwLjcyNiA2LjkxNywzLjU5OSA3LjUwMiw3LjE0NiAwLjYsMy40OTggLTAuMTQ2LDUuNzc5IC0yLjQ0OSw3LjczOCBtIC0yMS41OTQsMTIuMjYzIDAuMDI0LDMuNDEyIC0yMC44OCwwIDAsLTMwLjQ5NyAyMC44OCwwIC0wLjAyNCwzLjQxMyBjIC00LC0wLjEwMSAtOS4wMjEsLTAuNzM3IC0xMy4xMzgsLTAuMzMxIGwgMCwxMC45NTEgYyAzLjMzNiwwLjE3NyA3LjM4NiwwLjExNCAxMC40ODQsLTAuMTcxIGwgMCwzLjYxNyBjIC0zLjE1MywtMC4zOTUgLTcuMTIyLC0wLjM2OCAtMTAuNDg0LC0wLjE2IGwgMCwxMC4wNzYgYyA0LjExNywwLjQyNCA5LjEzOCwtMC4yMzUgMTMuMTM4LC0wLjMxIG0gLTIyLjM0NCwtMzIuMDU4IGMgLTIuNzY4LDEuMDI5IC02Ljc0NSw0LjExMSAtOS4wMzIsNi45MjMgLTIuOTYxLDMuMzgyIC0xMC4wNDcsMTIuOTE5IC0xMC4wNDcsMTIuOTE5IC0zLjY0Nyw0LjcwMyAtOC41MjQsMTIuNTE4IC0xMy4zNDksMTYuNDYgbCAwLC0zMS4yNjUgNC4zMSwwIDAsMTUuNzc4IGMgMy4wMywtMy44NjcgNi41ODMsLTguODA4IDkuMjM3LC0xMS45MyAxLjE3NiwtMS40MDIgNC4yMDIsLTQuNjc3IDUuMDU5LC01LjM5NyA1LjU0NSwtNS40MTEgMTUuNzIzLC03LjgzMyAyNC4yMTcsLTQuODY3IGwgMCwwLjI5OCBjIC0yLjkyMSwtMC42MjYgLTYuNjgyLC0wLjM5NiAtMTAuMzk1LDEuMDgxIG0gLTI2LjI1MywzMy42MzMgYyAyLjk2MywtMy4zODIgMTAuMDQ2LC0xMi45MiAxMC4wNDYsLTEyLjkyIDMuNjUsLTQuNzAxIDguNTI4LC0xMi41MiAxMy4zNSwtMTYuNDYgbCAwLDMxLjI2MyAtNC4zMDcsMCAwLC0xNS43NzggYyAtMy4wMzUsMy44NjggLTYuNTg2LDguODEgLTkuMjQ1LDExLjkzMiAtMS4xNzEsMS4zOTggLTQuMTk2LDQuNjc4IC01LjA1MSw1LjM5OCAtNS41NDksNS40MDggLTE1LjcyNyw3LjgzMiAtMjQuMjIxLDQuODY0IGwgMCwtMC4yOTUgYyAyLjkyLDAuNjIzIDYuNjg4LDAuMzk0IDEwLjM5NywtMS4wODIgMi43NzIsLTEuMDMgNi43NCwtNC4xMDkgOS4wMzEsLTYuOTIyIG0gOTEuOTUxLC0xMS45IGMgLTEuODE1LC0yLjEzNCAtNS44LC0yLjEwOCAtOC40NTcsLTEuOTIzIGwgMC4wMjMsMTIuMjI4IGMgMCwwIDYuODc1LDAuOTU5IDguNjg4LC0yLjE2MyAxLjA0NSwtMS44NjcgMS4yOSwtNi4wNjkgLTAuMjU0LC04LjE0MiBtIC0wLjg4LDEzLjczNyAtMTUuMjY0LDAgMCwtMzAuNDk3IDcuNzMyLC0wLjAwMyAwLDkuMDkzIC0wLjAwMywyLjA4NiBjIDAsMCAxMS4wMzYsLTAuNjA1IDE0LjE0OCwzLjUxMSAyLjMzLDIuNjU2IDIuNDU3LDYuODk1IDEuNTAyLDEwLjE3IC0xLjI3MSwzLjcyNyAtNC4wNDgsNS42NDUgLTguMTE1LDUuNjQgTSAtNzkuMjIxLDMuMTQ2IGMgLTEuODMsLTIuMTk0IC01LjYwMSwtMi4wMzEgLTguMjE0LC0yLjAyNSBsIDAsMTEuMTc2IGMgMCwwIDYuNjQ0LDAuOTk1IDguNDY5LC0yLjE5OCAwLjk0NywtMS43OSAxLjA2MywtNS4xNTEgLTAuMjU1LC02Ljk1MyBtIDkuNTg2LC0xNi4zNzYgLTAuOTQzLDEuNzkxIGMgLTIuMDI1LDMuNzgzIC0zLjY1Miw2Ljk0OCAtNS40MjYsMTEuMDUxIDAuMTg5LDAuMTMyIDAuMTQ5LDAuMDczIDAuNjc0LDAuMzIzIDIuODI0LDEuMzQ4IDQuNjk1LDMuNzg2IDQuNjQzLDguMDA0IC0wLjEzLDUuMTc3IC00Ljg1OCw3Ljc0MSAtOC45OTEsNy43MzYgbCAtMTUuNDY2LDAgMCwtMzAuNDk3IDcuNzc0LC0wLjAwMyAwLDEyLjYwNSA0LjQyMSwwIGMgMS40NzYsLTIuNDU4IDQuNDc4LC05LjQ1IDQuOTQ1LC0xMC41NDcgbCAwLjkyLC0yLjA1NSA4LjI4NywwIC0wLjc0NiwxLjQyIGMgLTAuMDMzLDAuMDU0IC0wLjA2MSwwLjExMyAtMC4wOTIsMC4xNzIiIHN0eWxlPSJmaWxsOiNlNGQxYzA7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoMTAzNzIiIC8+PC9nPjxnIGlkPSJnMTAzNzQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMyMy4zMzAxLDM5Mi40OTgpIj48cGF0aCBkPSJtIDAsMCAyMC44NjcsMCAwLDMuNDEzIEMgMTYuODQ4LDMuMzEzIDExLjgyOCwyLjY3NyA3LjcyMSwzLjA4MiBsIDAsMTAuOTUxIGMgMy4zMzEsMC4xNzcgNy4zOTQsMC4xMTQgMTAuNTA3LC0wLjE3MSBsIDAsMy42MTcgYyAtMy4xODUsLTAuMzk1IC03LjE0NiwtMC4zNjggLTEwLjUxMywtMC4xNiAwLDAuNjUgMC4wMDYsMTAuMDc3IDAuMDA2LDEwLjA3NyA0LjEwNywwLjQyMyA5LjEyNywtMC4yMzYgMTMuMTQ2LC0wLjMxMSBsIDAsMy40MTIgTCAwLDMwLjQ5NyAwLDAgWiIgc3R5bGU9ImZpbGw6I2U0ZDFjMDtmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6bm9uemVybztzdHJva2U6bm9uZSIgaWQ9InBhdGgxMDM3NiIgLz48L2c+PHBhdGggZD0ibSA0NjEuNjA3LDI2NC4wNDQgLTMxOS44NzQsMCAwLDkxLjc4NyAzMTkuODc0LDAgMCwtOTEuNzg3IHoiIHN0eWxlPSJmaWxsOiNlNGQxYzA7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoMTAzNzgiIC8+PGcgaWQ9ImcxMDM4MCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjY2LjQ5NjEsMzI3LjU4MikiPjxwYXRoIGQ9Im0gMCwwIGMgLTEuMTI1LDAuNDQxIC0xLjc0MiwwLjYzOSAtMi44ODgsMC42MzkgLTEuMjM1LDAgLTIuNjg4LC0wLjQ0MSAtMi42ODgsLTIuMDUgMCwtMi45NTMgNi42MTEsLTIuMjcxIDYuNjExLC03LjMzOSAwLC0zLjI4NCAtMi41MzUsLTQuNTg1IC01LjYyLC00LjU4NSAtMS4wOCwwIC0yLjEzNywwLjMxIC0zLjE1MiwwLjY0IGwgMC4yMiwyLjA0OSBjIDAuNzUsLTAuMzA3IDIuMDczLC0wLjc0OSAzLjE5NiwtMC43NDkgMS4yNTcsMCAzLjAxOSwwLjcwNiAzLjAxOSwyLjUxMiAwLDMuNDM5IC02LjYxMSwyLjQ5MSAtNi42MTEsNy4yNzQgMCwyLjczMyAyLjE2LDQuMTg3IDQuOTM2LDQuMTg3IDEuMDE1LDAgMi4yMjcsLTAuMTc2IDMuMjg1LC0wLjU1MSBMIDAsMCBaIiBzdHlsZT0iZmlsbDojM2MyMDEzO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDEwMzgyIiAvPjwvZz48ZyBpZD0iZzEwMzg0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNzEuNDAzOCwzMjkuODk1NSkiPjxwYXRoIGQ9Im0gMCwwIDguNjE5LDAgMCwtMS45MzggLTYuNDE0LDAgMCwtNC40OTcgNS44NCwwIDAsLTEuOTQgLTUuODQsMCAwLC01LjA2OSA2LjQxNCwwIDAsLTEuOTM5IC04LjYxOSwwIEwgMCwwIFoiIHN0eWxlPSJmaWxsOiMzYzIwMTM7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoMTAzODYiIC8+PC9nPjxnIGlkPSJnMTAzODgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI4Ni4zODM4LDMyMy4yODQyKSI+PHBhdGggZD0ibSAwLDAgMS44NzMsMCBjIDIuMDk0LDAgMy4zMjgsMC45MjYgMy4zMjgsMi40MDIgMCwxLjM4OSAtMS4wNTcsMi4yNzEgLTMuMDg2LDIuMjcxIEwgMCw0LjY3MyAwLDAgWiBtIC0yLjIwNCw2LjYxMSAzLjc2OCwwIGMgMy4wNDIsMCA1Ljk3MiwtMC40ODQgNS45NzIsLTQuMTY1IDAsLTEuODczIC0xLjM4NywtMy4xOTUgLTMuMTczLC0zLjUwNSBsIDAsLTAuMDQzIGMgMC42ODQsLTAuMjY0IDEuMDE0LC0wLjU5NSAxLjQ5OCwtMS41NDMgbCAyLjkxMSwtNi4xMjYgLTIuNTEyLDAgLTIuMzU5LDUuMzMzIEMgMy4yMTcsLTEuOTM5IDIuNDksLTEuOTM5IDEuMzIzLC0xLjkzOSBsIC0xLjMyMywwIDAsLTYuODMyIC0yLjIwNCwwIDAsMTUuMzgyIHoiIHN0eWxlPSJmaWxsOiMzYzIwMTM7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoMTAzOTAiIC8+PC9nPjxnIGlkPSJnMTAzOTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMwNC44NzExLDMxNC41MTI3KSI+PHBhdGggZD0ibSAwLDAgLTIuNzU1LDAgLTUuNzk2LDE1LjM4MyAyLjQ2OSwwIDQuNzM3LC0xMy40NDUgMC4wNDUsMCA0Ljg3MSwxMy40NDUgMi4zMTQsMCBMIDAsMCBaIiBzdHlsZT0iZmlsbDojM2MyMDEzO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDEwMzk0IiAvPjwvZz48cGF0aCBkPSJtIDMxMy42MTQsMzI5Ljg5NiAyLjIwMywwIDAsLTE1LjM4MyAtMi4yMDMsMCAwLDE1LjM4MyB6IiBzdHlsZT0iZmlsbDojM2MyMDEzO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDEwMzk2IiAvPjxnIGlkPSJnMTAzOTgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMzMS4xMzA5LDMyNy4zNjEzKSI+PHBhdGggZD0ibSAwLDAgYyAtMC45NywwLjU3MyAtMi4wNTEsMC44NTkgLTMuMTc0LDAuODU5IC0zLjU0OSwwIC01LjkwNiwtMi41NTYgLTUuOTA2LC02LjAxNiAwLC0zLjYxNCAyLjYsLTYuMDE3IDUuNzk3LC02LjAxNyAxLjEwMSwwIDIuNTc4LDAuMjg2IDMuMzQ5LDAuNzQ5IGwgMC4xMzEsLTIuMTM4IGMgLTEuMTY3LC0wLjQ4NCAtMi41OTksLTAuNTUxIC0zLjUwMywtMC41NTEgLTQuODcsMCAtOC4xMTEsMy4xMzEgLTguMTExLDguMDIyIDAsNC43MzkgMy40MzgsNy44OTEgOC4xMzQsNy44OTEgMS4xODksMCAyLjM1NywtMC4xNzYgMy40NiwtMC42NiBMIDAsMCBaIiBzdHlsZT0iZmlsbDojM2MyMDEzO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDEwNDAwIiAvPjwvZz48ZyBpZD0iZzEwNDAyIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMzQuODQ3NywzMjkuODk1NSkiPjxwYXRoIGQ9Im0gMCwwIDguNjE5LDAgMCwtMS45MzggLTYuNDE0LDAgMCwtNC40OTcgNS44NCwwIDAsLTEuOTQgLTUuODQsMCAwLC01LjA2OSA2LjQxNCwwIDAsLTEuOTM5IC04LjYxOSwwIEwgMCwwIFoiIHN0eWxlPSJmaWxsOiMzYzIwMTM7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoMTA0MDQiIC8+PC9nPjxnIGlkPSJnMTA0MDYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI1NS44NzQsMjk0LjI3ODMpIj48cGF0aCBkPSJtIDAsMCAyLjE4MiwwIGMgMS4zNjYsMCAzLjA4NSwwLjY4NSAzLjA4NSwyLjcxMiAwLDEuOTM5IC0yLjAyOCwyLjY0NSAtMy4zOTQsMi42NDUgTCAwLDUuMzU3IDAsMCBaIG0gLTIuMjA0LDcuMjk2IDQuMDMyLDAgYyAzLjE1MywwIDUuNzc1LC0xLjEwMiA1Ljc3NSwtNC42MDcgMCwtMy40MTYgLTIuNjY2LC00LjYyNyAtNS40NDMsLTQuNjI3IGwgLTIuMTYsMCAwLC02LjE0OSAtMi4yMDQsMCAwLDE1LjM4MyB6IiBzdHlsZT0iZmlsbDojM2MyMDEzO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDEwNDA4IiAvPjwvZz48ZyBpZD0iZzEwNDEwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyNzEuOTU4LDI5OS41MDI5KSI+PHBhdGggZD0ibSAwLDAgLTMuMDYyLC03LjYyNiA2LjEyNiwwIEwgMCwwIFogbSAtMS4wNzgsMi4wNzEgMi4zMTQsMCA2LjUwMSwtMTUuMzgzIC0yLjQwMiwwIC0xLjU2NSwzLjg3OCAtNy41MzgsMCAtMS41NjUsLTMuODc4IC0yLjMxNCwwIDYuNTY5LDE1LjM4MyB6IiBzdHlsZT0iZmlsbDojM2MyMDEzO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDEwNDEyIiAvPjwvZz48ZyBpZD0iZzEwNDE0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyODQuNzU0OSwyOTQuOTYyOSkiPjxwYXRoIGQ9Im0gMCwwIDEuODczLDAgYyAyLjA5NCwwIDMuMzI4LDAuOTI2IDMuMzI4LDIuNDAyIDAsMS4zODggLTEuMDU3LDIuMjcxIC0zLjA4NiwyLjI3MSBMIDAsNC42NzMgMCwwIFogbSAtMi4yMDQsNi42MTEgMy43NjgsMCBjIDMuMDQyLDAgNS45NzMsLTAuNDg0IDUuOTczLC00LjE2NSAwLC0xLjg3MyAtMS4zODgsLTMuMTk2IC0zLjE3NCwtMy41MDUgbCAwLC0wLjA0MyBjIDAuNjg0LC0wLjI2NCAxLjAxNCwtMC41OTUgMS40OTksLTEuNTQzIGwgMi45MSwtNi4xMjYgLTIuNTEyLDAgLTIuMzU5LDUuMzMzIGMgLTAuNjg0LDEuNDk5IC0xLjQxLDEuNDk5IC0yLjU3OCwxLjQ5OSBsIC0xLjMyMywwIDAsLTYuODMyIC0yLjIwNCwwIDAsMTUuMzgyIHoiIHN0eWxlPSJmaWxsOiMzYzIwMTM7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoMTA0MTYiIC8+PC9nPjxnIGlkPSJnMTA0MTgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5OS41ODM1LDI5OS42MzU3KSI+PHBhdGggZD0ibSAwLDAgLTQuNzgxLDAgMCwxLjkzOCAxMS43NjgsMCAwLC0xLjkzOCAtNC43ODIsMCAwLC0xMy40NDQgLTIuMjA1LDAgTCAwLDAgWiIgc3R5bGU9ImZpbGw6IzNjMjAxMztmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6bm9uemVybztzdHJva2U6bm9uZSIgaWQ9InBhdGgxMDQyMCIgLz48L2c+PGcgaWQ9ImcxMDQyMiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMzA5LjUxNTYsMzAxLjU3NDIpIj48cGF0aCBkPSJtIDAsMCAyLjk5OCwwIDYuNzg5LC0xMi4zODYgMC4wNDQsMCAwLDEyLjM4NiAyLjIwMywwIDAsLTE1LjM4MyAtMi44MiwwIC02Ljk2NiwxMi42NTEgLTAuMDQzLDAgMCwtMTIuNjUxIC0yLjIwNSwwIEwgMCwwIFoiIHN0eWxlPSJmaWxsOiMzYzIwMTM7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoMTA0MjQiIC8+PC9nPjxnIGlkPSJnMTA0MjYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMyNi4zMjIzLDMwMS41NzQyKSI+PHBhdGggZD0ibSAwLDAgOC42MTksMCAwLC0xLjkzOCAtNi40MTQsMCAwLC00LjQ5NyA1Ljg0MSwwIDAsLTEuOTQgLTUuODQxLDAgMCwtNS4wNjkgNi40MTQsMCAwLC0xLjkzOSAtOC42MTksMCBMIDAsMCBaIiBzdHlsZT0iZmlsbDojM2MyMDEzO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDEwNDI4IiAvPjwvZz48ZyBpZD0iZzEwNDMwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzNDEuMzAzNywyOTQuOTYyOSkiPjxwYXRoIGQ9Im0gMCwwIDEuODc0LDAgYyAyLjA5NCwwIDMuMzI4LDAuOTI2IDMuMzI4LDIuNDAyIDAsMS4zODggLTEuMDU2LDIuMjcxIC0zLjA4NiwyLjI3MSBMIDAsNC42NzMgMCwwIFogbSAtMi4yMDMsNi42MTEgMy43NjcsMCBjIDMuMDQyLDAgNS45NzMsLTAuNDg0IDUuOTczLC00LjE2NSAwLC0xLjg3MyAtMS4zODgsLTMuMTk2IC0zLjE3MywtMy41MDUgbCAwLC0wLjA0MyBjIDAuNjg0LC0wLjI2NCAxLjAxNCwtMC41OTUgMS40OTgsLTEuNTQzIGwgMi45MSwtNi4xMjYgLTIuNTEyLDAgLTIuMzU5LDUuMzMzIGMgLTAuNjgzLDEuNDk5IC0xLjQxLDEuNDk5IC0yLjU3OCwxLjQ5OSBsIC0xLjMyMywwIDAsLTYuODMyIC0yLjIwMywwIDAsMTUuMzgyIHoiIHN0eWxlPSJmaWxsOiMzYzIwMTM7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoMTA0MzIiIC8+PC9nPjwvZz48L2c+PC9nPjwvZz48L3N2Zz4=");
}

h2.topcoat-list__header.descriptive:after {
  content: attr(data-description);
  font-size: 0.8em;
  vertical-align: middle;
  font-style: italic;
  opacity: 0.7;
}
/* .tab { overflow-y: scroll; } */

.header #general-status {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  align-content: space-between;
  max-width: 55%;
}

.header .topcoat-notification.general-status,
.header .topcoat-icon-button {
  font-size: 1.5em;
  line-height: 2.65rem;
  height: 3rem;
}

.header .topcoat-notification.general-status:before {
  /* content: attr(data-number) '. '; */
  content: attr(data-number);
}

.header .topcoat-notification.general-status.status-1,
.header .topcoat-notification.general-status.status-2 {
  background: #9DC5DE;
}
.header .topcoat-notification.general-status.status-3,
.header .topcoat-notification.general-status.status-7 {
  background: #EC514E;
}
.header .topcoat-notification.general-status.status-4,
.header .topcoat-notification.general-status.status-6 {
  background: #9DCB8A;
}
.header .topcoat-notification.general-status.status-deleted {
  background: #000000;
}

.header .topcoat-icon-button {
  margin-left: 0.2em;
  flex-shrink: 0;
}

.play-pause {
  height: 3rem;
  background: #E5F1FB;
  border: 1px solid #9dc6e7;
  font-size: 1.5rem;
  line-height: 2.85rem;
  color: #288edf;
}
.main-content:not(.locked) .play-pause {
  padding-left: 2.85rem;
  width: 10rem;
}
.play-pause.pause {
  background: white;
}
.play-pause:hover {
  background: #F2F9FF;
}
.play-pause:active {
  background: #CDE6FC;
}
.play-pause:active:before {
  border-left-color: rgba(255, 255, 255, 0.5);
}
.play-pause:before {
  position: absolute;
  left: 0;
  top: 50%;
  display: block;
  content: "";
  width: 0;
  height: 0;
  border-top: 0.8rem solid transparent;
  border-bottom: 0.8rem solid transparent;
  border-left: 1.3rem solid #288edf;
  box-sizing: border-box;
  transform: translate(0,-50%);
  margin-left: 1rem;
}
.play-pause.pause:before {
  width: 1.2rem;
  height: 1.3rem;
  border-left: 0.8rem solid #288edf;
  border-right: 0.8rem solid #288edf;
  border-width: 0 0.4rem;
}
.play-pause.pause:active:before {
  border-left-color: rgba(255, 255, 255, 0.5);
  border-right-color: rgba(255, 255, 255, 0.5);
}
.locked .play-pause {
  background: rgb(210, 214, 214) none repeat scroll 0% 0%;
  border: 1px solid rgb(157, 172, 169);
  color: rgb(69, 69, 69);
  box-shadow: none;
  pointer-events: none;
  tab-index: -1;
}
.locked .play-pause:before {
  display: none;
}

#tabs {
  margin-top: 0.5em;
  margin-bottom: 0.1em;
  flex-grow: 0;
  flex-shrink: 0;
}
#tabs .topcoat-tab-bar__item {
  font-size: 1.05em;
}
#tabs .topcoat-tab-bar__item label > span.icomatic {
  margin-right: 0.5rem;
}
#tabs .topcoat-tab-bar__item.green :active + .topcoat-tab-bar__button,
#tabs .topcoat-tab-bar__item.green :checked + .topcoat-tab-bar__button {
    color: #689a53;
    background-color: #CCE7C1;
    box-shadow: inset 0 0 1px rgba(0,0,0,0.1);
}
#tabs .topcoat-tab-bar__item.red :active + .topcoat-tab-bar__button,
#tabs .topcoat-tab-bar__item.red :checked + .topcoat-tab-bar__button {
    color: #ff4848;
    background-color: #FDE0E0;
    box-shadow: inset 0 0 1px rgba(0,0,0,0.1);
}
#tabs .topcoat-tab-bar__item.icon-only label { text-align: center; }
#tabs .topcoat-tab-bar__item.icon-only label > span.icomatic { margin-right: 0rem; }

#tether .topcoat-switch__input:checked + .topcoat-switch__toggle {
  margin-left: 6.7rem;
}
#tether .topcoat-switch__input + .topcoat-switch__toggle::before {
  content: 'VERBUNDEN';
  color: #288edf;
  right: 0rem;
  padding-left: 1.5rem;
}
#tether .topcoat-switch__input + .topcoat-switch__toggle::after {
  content: 'NICHT VERB.';
  left: 0rem;
  padding-left: 1.5rem;
  text-align: center;
}
#tether.topcoat-switch { width: 10rem; }
#tether .topcoat-switch__input + .topcoat-switch__toggle::after,
#tether .topcoat-switch__input + .topcoat-switch__toggle::before {
    top: -1px;
    width: 10rem;
}

.download {
  display: none;
  height: 3rem;
  line-height: 2.85rem;
}
.locked .download {
  display: initial;
}

.locking .topcoat-switch__toggle {
  font-family: 'Icomatic','sans-serif';
  text-rendering: optimizeLegibility;
}
.locking .topcoat-switch__input + .topcoat-switch__toggle::before {
  content: 'unlock';
  color: #288edf;
}
.locking .topcoat-switch__input + .topcoat-switch__toggle::after {
  content: 'lock';
}
.locking .topcoat-switch__input + .topcoat-switch__toggle::after,
.locking .topcoat-switch__input + .topcoat-switch__toggle::before {
    top: -1px;
}
.async-work .locking {
  pointer-events: none;
}
.async-work .locking .topcoat-switch__input + .topcoat-switch__toggle::after {
  content: 'error';
}

.topcoat-list__item span.text {
  white-space: normal;
  flex-grow: 1;
}
.topcoat-list__item span.text.w65 {
  max-width: 65%;
}
.topcoat-list__item span.text:empty:after {
  content: '\2014';
}
.topcoat-list__item.free-text {
  position: relative;
  padding: 0;
}
.topcoat-list__item.free-text:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 3rem;
  border-right: 3px double #288EDF;
}
.free-text .topcoat-textarea {
  font-size: 1.75rem;
  padding-left: 4rem;
  width: 100%;
  border: 0px none;
  border-radius: 0px;
}
.locked .free-text .topcoat-textarea {
  color: #288EDF;
}

.tab .topcoat-navigation-bar:not(:first-child) {
  margin-top: 25px;
}
.topcoat-list__header span .topcoat-button--cta,
.topcoat-list__header span .topcoat-button--quiet,
.topcoat-list__header span .topcoat-button {
  padding: 0.4rem 0.7rem;
  line-height: 1.4rem;
  margin-left: 0.5em;
  height: 2.3rem;
}

.locked .edit {
  display: none;
}

.topcoat-list__container.dates-list .topcoat-notification {
  font-size: 1.5em;
}
.topcoat-notification.status:before {
  font-family: 'Icomatic','sans-serif';
  text-rendering: optimizeLegibility;
  padding-right: 0.5rem;
}
.main-content:not(.locked) .topcoat-notification.status:after {
  font-family: 'Icomatic','sans-serif';
  text-rendering: optimizeLegibility;
  padding-left: 0.5rem;
}

.topcoat-notification.status-1 { background: #9DC5DE; }
.topcoat-notification.status-1:before { content: 'question' }
.topcoat-notification.status-2 { background: #9DCB8A; }
.topcoat-notification.status-2:before { content: 'checkmark' }
.topcoat-notification.status-3 { background: #E1A6A6; }
.topcoat-notification.status-3:before { content: 'cancel' }

button.topcoat-button--cta > span.icomatic,
button.topcoat-button--quiet > span.icomatic,
button.topcoat-button > span.icomatic {
  margin-right: 0.5rem;
}

.topcoat-list__item > *.icomatic:first-child {
  margin-right: 0.2rem;
}

.topcoat-list__item.serial-number span,
.topcoat-list__item.email span {
  flex-grow: 1;
}

.topcoat-list__item.serial-number span input,
.topcoat-list__item.email span input {
  max-width: 70%;
}

.topcoat-list__item.serial-number input,
.topcoat-list__item.email input {
  width: 100%;
}
.topcoat-list__item.serial-number input {
  font-size: 1.5em;
}

.locked .topcoat-list__item input[type="text"],
.locked .topcoat-list__item input[type="number"],
.locked .topcoat-list__item input[type="email"] {
  opacity: 1;
  border: none;
  box-shadow: unset;
  text-align: right;
  color: #288EDF;
  border-radius: 2px;
}

.locked .content input[type="text"],
.locked .content input[type="number"],
.locked .content input[type="email"],
.locked .content textarea.edit {
  background: #E5F1FB;
}

.locked .content .topcoat-radio-button__checkmark:after {
  border: 1px solid #288EDF;
  background: #E5F1FB;
}

.locked .content .topcoat-checkbox__checkmark::after {
  border-color: #288EDF;
}

.locked .content label,
.locked .content input[type="text"],
.locked .content input[type="number"],
.locked .content input[type="email"],
.locked .content textarea {
  pointer-events: none;
  tab-index: -1;
}

.locked .topcoat-list__item input[type="text"]:invalid,
.locked .topcoat-list__item input[type="number"]:invalid,
.locked .topcoat-list__item input[type="email"]:invalid {
  background: #E1A6A6;
  color: #FFE4E4;
}
.locked .topcoat-list__item input[type="email"]:invalid:after {
  content: 'A';
}

label > input[type="checkbox"] ~ .topcoat-notification.repair-code,
label > input[type="checkbox"] ~ .topcoat-notification.key-code,
.topcoat-notification.repair-code,
.topcoat-notification.key-code,
.topcoat-notification.spare-part,
.topcoat-notification.spare-part-quantity {
  background: #D2D6D6;
  min-width: 50px;
  text-align: center;
}
.topcoat-notification.spare-part {
  min-width: 70px;
}
label > input[type="checkbox"]:checked ~ .topcoat-notification.repair-code,
label > input[type="checkbox"]:checked ~ .topcoat-notification.key-code,
label > input[type="checkbox"]:checked ~ .topcoat-notification.spare-part,
.repair-codes-list .topcoat-notification.repair-code,
.actions-list .topcoat-notification.key-code,
.spare-parts-list .topcoat-notification.spare-part-quantity {
  background: #E5F1FB;
  color: #288EDF;
}
.spare-parts-list .topcoat-notification.spare-part-extra {
  font-size: 1.1em;
}
.topcoat-notification.spare-part-extra {
  background: #B0B0B0;
}
.dates-list .topcoat-notification.datetime-item,
.dates-list .topcoat-notification.technician-item,
.spare-parts-list .topcoat-notification.spare-part-item,
.repair-codes-list .topcoat-notification.repair-code,
.spare-parts-list .topcoat-notification.spare-part-quantity,
.actions-list .topcoat-notification.key-code {
  font-size: 1.5em;
  min-width: 75px;
  vertical-align: middle;
  background: #E5F1FB;
  color: #288EDF;
  text-align: center;
}

ul.topcoat-list__container.repair-codes-list {
  counter-reset: repair-codes;
  list-style: repair-codes-list;
}

ul.topcoat-list__container .handle {
  padding: 1rem;
  cursor: move;
}

ul.topcoat-list__container .topcoat-list__item:only-child .handle {
  pointer-events: none;
  opacity: 0.25;
}

.dates-list .default-value .topcoat-notification.technician-item {
  background: #D2D6D6;
  color: #FFF;
}
.topcoat-list__item span.default-value {
  display: none;
}
.topcoat-list__item span.value:empty + span.default-value {
  display: initial;
}

ul.dates-list h2.add-date {
  margin-bottom: 1rem;
}
.dates-list .topcoat-notification.datetime-item {
  text-align: center;
}
.main-content:not(.locked) .dates-list .topcoat-notification.datetime-item.date {
  min-width: 7.5em;
}
.dates-list .topcoat-notification.datetime-item.day {
  min-width: 220px;
}
.dates-list .topcoat-notification.datetime-item.time {
  min-width: 100px;
}
.dates-list .topcoat-list__item > span:last-child {
  max-width: initial;
}
button.topcoat-icon-button.plus {
  background-color: #CFE6C3;
}
button.topcoat-icon-button.plus:hover {
  background-color: #B4D1A5;
}
button.topcoat-icon-button.minus,
button.topcoat-icon-button.remove {
  background-color: #FFD2D2;
}
button.topcoat-icon-button.minus:hover,
button.topcoat-icon-button.remove:hover {
  background-color: #EFC0C0;
}
.spare-parts-list .spare-part-description {
  max-width: 50%;
}
.spare-parts-list .spare-part-description > div {
  min-height: 2rem;
  margin-bottom: 0.5rem;
}
.spare-parts-list .times {
  font-size: 2em;
  vertical-align: middle;
  display: none;
}
.modal .content.spare-part-extra {
  width: 500px;
}

.modal .topcoat-list__item.spare-part-extra-side span.values {
  white-space: normal;
}

.locked .content .times {
  display: inline-block;
}

li.topcoat-list__item[data-action="clickable"]:active {
  background: rgba(40, 142, 223, 0.18);
}

.topcoat-list__container.select-many .topcoat-list__item {
  height: 100%;
  padding: 0 1.25rem;
}
.topcoat-list__container.select-many .topcoat-list__item .topcoat-checkbox,
.topcoat-list__container.select-many .topcoat-list__item .topcoat-radio-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}
.topcoat-list__container.select-many .topcoat-list__item .topcoat-checkbox__checkmark {
  order: -1;
}
.topcoat-list__container.select-many .topcoat-list__item .topcoat-label {
  flex-grow: 1;
  margin-left: 1rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.topcoat-list__container.select-many .topcoat-list__item .topcoat-notification.spare-part,
.topcoat-list__container.select-many .topcoat-list__item .topcoat-notification.spare-part-extra {
  flex-shrink: 0;
}
.topcoat-list__container.select-many .topcoat-list__item .topcoat-notification.spare-part {
  order: 2;
}
.topcoat-list__container.select-many .topcoat-list__item .topcoat-notification.spare-part-extra {
  margin-right: 0.25rem;
  order: 1;
}
.topcoat-notification.spare-part-extra:before {
  content: attr(data-content);
}
.topcoat-notification.spare-part-extra[default] {
  display: none;
}

.topcoat-list__container.select-many .topcoat-list__item  label {
  width: 100%;
}

.feedback {
  counter-reset: question;
}
.feedback .topcoat-navigation-bar {
  padding-left: 0.3rem;
  padding-right: 0.3rem;
}
.feedback h1.nnch-logo:before {
  content: '';
  width: 109px;
  height: 62px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0,-50%);
}
.feedback .topcoat-list__header {
  padding: 4px 20px;
  font-size: 1.1em;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.feedback h2.topcoat-list__header.question:before {
  counter-increment: question;
  content: counter(question) ". " attr(data-question);
}
.feedback .topcoat-radio-button {
  font-size: 0.85em;
}
.feedback.submitted .introduction, .feedback.submitted .questions {
  display: none;
}
.feedback .conclusion {
  display: none;
}
.feedback.submitted .conclusion {
  display: inherit;
}

.topcoat-tag {
  padding: 0.2rem 0.4rem;
  line-height: inherit;
  border-radius: 2px;
  color: rgb(40, 142, 223);
  background-color: #e5f1fb;
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.1) inset;
  font-size: 0.9em;
}

.topcoat-well__container {
  line-height: 1.5em;
  padding: 1rem 1.5rem;
  display: inline-block;
  cursor: default;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.topcoat-well__container span {
  white-space: pre-line;
}

.button-bar {
  display: flex;
  justify-content: space-between;
  padding: 1.25rem;
}

.topcoat-list__container.acknowledgment-check-list .topcoat-list__item .topcoat-label {
  margin-left: 1rem;
}

.topcoat-list__itembutton {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 100;
}

.locked .topcoat-list__itembutton {
  display: none;
}

.topcoat-list__item.acknowledgment {
  position: relative;
}

.modal .acknowledgment .signature {
  width: 625px;
}

.tab .acknowledgment .signature {
  width: 313px;
}

.acknowledgment .signature,
.acknowledgment .button-bar {
  margin-left: auto;
  margin-right: auto;
  overflow-x: visible;
}

.signature {
  position: relative;
  display: block;
  background: white;
  box-sizing: border-box;
  border: 2px solid #E5F1FB;
  border-radius: 4px;
}

.modal .acknowledgment:last-child .signature {
  margin: 1rem;
}

.locked .content .signature {
  background: #E2E9EE;
}

.not-empty .signature:after,
.locked .content .signature:after {
  display: block;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
}

.signature:after {
  display: none;
}

.signature:before {
  content: '';
  display: block;
  position: relative;
  margin: 0 auto;
  border-top: 1px dotted #288edf;
}

.modal .signature:before {
  width: 500px;
  top: 225px;
}

.tab .signature:before {
  width: 250px;
  top: 112px;
}

.modal .signature .pad {
  width: 620px;
  height: 250px;
}

.tab .signature .pad {
  width: 310px;
  height: 125px;
}

.acknowledgment .signature:not(.not-empty) + .button-bar {
  pointer-events: none;
  tab-index: -1;
  opacity: 0.3;
}

.modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
  background: rgba(40, 142, 223, 0.20);
	z-index: 9999;
	opacity:0;
	-webkit-transition: opacity 100ms ease-in;
	-moz-transition: opacity 100ms ease-in;
	transition: opacity 100ms ease-in;
	pointer-events: none;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.modal.content-top {
  justify-content: flex-start;
}

.modal.content-top > div {
  margin-top: 4rem;
}

.modal.show-modal {
	opacity:1;
	pointer-events: auto;
}

.modal > div {
	position: relative;
	max-width: 85%;
	background: #dfe2e2;
  border-radius: 5px;
  border: 4px solid rgba(40, 142, 223,0.4);
  background-clip: padding-box;
  -webkit-background-clip: padding-box;
}

.modal .topcoat-searchbar {
  padding: 0.5rem;
}
.modal .topcoat-search-input {
  width: 100%;
  font-size: 1.75em;
  padding-top: 0.3rem;
}
.modal .topcoat-navigation-bar,
.modal .topcoat-list__header {
  font-size: 1.1em;
  letter-spacing: 0.05rem;
  cursor: default;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: flex;
}

.modal .spare-part-extra .topcoat-list__header {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inherit;
}

.modal .topcoat-navigation-bar {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

.modal .topcoat-list__container {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
.modal .topcoat-list__container.select-many {

}
.modal .topcoat-list__item > span {
  cursor: default;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.modal .topcoat-list__item > span:last-child {
  float: initial;
  color: #288edf;
  text-align: initial;
  max-width: initial;
  white-space: pre-line;
}
.modal.alert .topcoat-list__header:before {
  content: 'alert';
  margin-right: 0.5rem;
  font-family: 'Icomatic','sans-serif';
  line-height: 1;
  font-feature-settings: "liga", "dlig";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

select.technicians {
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    clear: both;
}

body, html {
  margin: 0;
}

/*
@media screen and (orientation: landscape) {
  .container { max-width: 900px; }
}
@media screen and (orientation: landscape) and (min-width: 900px) {
  body { background: #454545; }

  .container {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 5px;
    border: 4px solid rgba(40, 142, 223,0.4);
    background-clip: padding-box;
    -webkit-background-clip: padding-box;
    height: 97%;
  }
}
*/
.container.open.open-left {
  left: 300px;
}
.container.open.open-right {
  left: -300px;
}
.slide {
  transition: all 0.1s ease;
}

#swipe-left {
  left: 0;
}
#swipe-right {
  right: 0;
}
.swipe-area {
  position: absolute;
  width: 15px;
  top: 10%;
  bottom: 0;
  z-index: 10;
}
.open.swipe-area {
  top: 0;
  width: inherit;
  background: rgba(40, 142, 223, 0.05);
}
#swipe-left.open.swipe-area {
  right: 0;
}
#swipe-right.open.swipe-area {
  left: 0;
}
.open-left #swipe-right.swipe-area,
.open-right #swipe-left.swipe-area {
  display: none;
}

.open .main-content {
  opacity: 1;
}

.sidebar {
  background: #e5f1fb;
  position: absolute;
  width: 300px;
  padding: 10px;
  height: 100%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-shadow: -3px 0 3px rgba(40, 142, 223, 0.20) inset, 3px 0 3px rgba(40, 142, 223, 0.20) inset;
}

#sidebar-left { left: -300px; }
#sidebar-right { right: -300px; }

.sidebar ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.sidebar ul li {
    margin: 0;
}
.sidebar ul li a {
    padding: 15px 20px;
    font-size: 16px;
    font-weight: 100;
    color: white;
    text-decoration: none;
    display: block;
    border-bottom: 1px solid #C9223D;
    -webkit-transition:  background 0.2s ease-in-out;
    -moz-transition:  background 0.2s ease-in-out;
    -ms-transition:  background 0.2s ease-in-out;
    -o-transition:  background 0.2s ease-in-out;
    transition:  background 0.2s ease-in-out;
}
.sidebar ul li:hover a {
    background: #C9223D;
}
.main-content {
  min-width: 735px;
  width: 100%;
  height: 100%;
  border: 10px solid transparent;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  position: relative;
  display: flex;
  flex-direction: column;
  -webkit-transition : border 100ms ease-out;
  -moz-transition : border 100ms ease-out;
  -o-transition : border 100ms ease-out;
  transition : border 100ms ease-out;
}
.flash .main-content { border-color: #EC514E; }
.flash .main-content:not(.locked) { border-color: #9DCB8A; }

.main-content .header {
  flex-grow: 0;
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  align-content: space-between;
}
.main-content .content {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  flex-grow: 1;
  flex-shrink: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  align-content: flex-start;
}

.main-content .sidebar-toggle {
    background: #DF314D;
    border-radius: 3px;
    display: block;
    position: relative;
    padding: 10px 7px;
    float: left;
}
.main-content .sidebar-toggle .bar{
  display: block;
  width: 18px;
  margin-bottom: 3px;
  height: 2px;
  background-color: #fff;
  border-radius: 1px;
}
.main-content .sidebar-toggle .bar:last-child{
     margin-bottom: 0;
}

.loader {
  height: 0.1em;
  width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  overflow: hidden;
  background-color: #ddd;
}
.main-content:empty:not(.failed) + .loader:before,
.main-content.async-work + .loader:before {
  display: block;
  position: absolute;
  content: "";
  left: 50%;
  width: 0;
  height: 0.1em;
  background-color: #288edf;
/*   animation: loading 1s cubic-bezier(0,1,.71,1) infinite; */
  animation: loading 1s cubic-bezier(0,1,.71,1) infinite;
}

@keyframes loading {
    from {left: 50%; width: 0%;}
    90% {left: 0; width: 100%; opacity: 1;}
    95% {left: 0; width: 100%; opacity: 1;}
    to {left: 0; width: 100%; opacity: 0;}
}
