/* Material Theming */

:root {
    --mdc-theme-primary: #004a72;
    --mdc-theme-secondary: #fe6652;
    --mdc-typography-button-text-transform: none;
    --mdc-typography-button-font-weight: 400;
    --mdc-typography-font-family: Roboto, sans-serif;

    --mdc-typography-headline2-font-family: var(--mdc-typography-font-family);
    --mdc-typography-headline2-font-size: 3.75rem;
    --mdc-typography-headline2-line-height: 3.75rem;
    --mdc-typography-headline2-font-weight: 300;
    --mdc-typography-headline2-letter-spacing: -0.0083333333em;
    --mdc-typography-headline2-text-decoration: inherit;
    --mdc-typography-headline2-text-transform: inherit;

    --mdc-typography-headline5-text-decoration: inherit;
    --mdc-typography-headline5-font-family: var(--mdc-typography-font-family);
    --mdc-typography-headline5-font-size: 1.5rem;
    --mdc-typography-headline5-line-height: 2rem;
    --mdc-typography-headline5-font-weight: 400;
    --mdc-typography-headline5-letter-spacing: normal;
    --mdc-typography-headline5-text-decoration: inherit;
    --mdc-typography-headline5-text-transform: inherit;

    --mdc-typography-headline6-text-decoration: inherit;
    --mdc-typography-headline6-font-family: var(--mdc-typography-font-family);
    --mdc-typography-headline6-font-size: 1.25rem;
    --mdc-typography-headline6-line-height: 1.8rem;
    --mdc-typography-headline6-font-weight: 500;
    --mdc-typography-headline6-letter-spacing: .0125em;

    --mdc-typography-subtitle1-font-family: var(--mdc-typography-font-family);
    --mdc-typography-subtitle1-font-size: 1rem;
    --mdc-typography-subtitle1-font-weight: 400;
    --mdc-typography-subtitle1-letter-spacing: 0.009375em;
    --mdc-typography-subtitle1-text-decoration: inherit;
    --mdc-typography-subtitle1-text-transform: inherit;

    --mdc-typography-subtitle2-font-family: var(--mdc-typography-font-family);
    --mdc-typography-subtitle2-font-size: 0.875rem;
    --mdc-typography-subtitle2-line-height: 1.375rem;
    --mdc-typography-subtitle2-font-weight: 500;
    --mdc-typography-subtitle2-letter-spacing: 0.0071428571em;
    --mdc-typography-subtitle2-text-decoration: inherit;
    --mdc-typography-subtitle2-text-transform: inherit;

    --mdc-typography-body2-font-family: var(--mdc-typography-font-family);
    --mdc-typography-body2-font-size: 0.875rem;
    --mdc-typography-body2-line-height: 1.25rem;
    --mdc-typography-body2-font-weight: 400;
    --mdc-typography-body2-letter-spacing: 0.0178571429em;
    --mdc-typography-body2-text-decoration: inherit;
    --mdc-typography-body2-text-transform: inherit;

    --mdc-typography-caption-font-family: var(--mdc-typography-font-family);
    --mdc-typography-caption-font-size: 0.75rem;
    --mdc-typography-caption-line-height: 1.25rem;
    --mdc-typography-caption-font-weight: 400;
    --mdc-typography-caption-letter-spacing: 0.0333333333em;
    --mdc-typography-caption-text-decoration: inherit;
    --mdc-typography-caption-text-decoration: inherit;
    --mdc-typography-caption-text-transform: inherit;

    --mdc-typography-overline-font-size: 0.75rem;
    --mdc-typography-overline-line-height: 1.3rem;
    --mdc-typography-overline-font-weight: 500;
    --mdc-typography-overline-letter-spacing: 0.1666666667em;
    --mdc-typography-overline-text-decoration: none;
    --mdc-typography-overline-text-transform: uppercase;

    --mdc-typography-button-font-weight: 500;
    --mdc-typography-button-font-family: var(--mdc-typography-font-family);
    --mdc-typography-button-font-size: 0.875rem;
    --mdc-typography-button-line-height: 2.25rem;
    --mdc-typography-button-letter-spacing: 0.0892857143em;
    --mdc-typography-button-text-decoration: none;
    --mdc-typography-button-text-transform: uppercase;

    --mdc-layout-grid-margin-desktop: 20px;

    --mdc-theme-text-secondary-on-dark: white;
}

/* Normalize what is already imported */

a:link,
a:visited,
a:active {
    color: unset;
    font-weight: unset;
    text-decoration: unset;
}

a:focus {
    outline: 1px dotted;
}

.editor-ultra-wide {
    width: auto;
    max-width: 700px;
}

input[type="submit"],
a.linkbutton {
    background-color: var(--mdc-theme-secondary);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--mdc-typography-button-font-family);
    font-size: var(--mdc-typography-button-font-size);
    line-height: var(--mdc-typography-button-line-height);
    font-weight: 500;
    letter-spacing: var(--mdc-typography-button-letter-spacing);
    text-decoration: none;
    -webkit-text-decoration: var(--mdc-typography-button-text-decoration);
    text-decoration: var(--mdc-typography-button-text-decoration);
    text-transform: uppercase;
    padding: 8px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 64px;
    border: none;
    outline: none;
    line-height: inherit;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-appearance: none;
    overflow: visible;
    vertical-align: middle;
    border-radius: var(--mdc-shape-small, 4px);
    min-height: 36px;
    cursor: pointer;
    color: var(--mdc-theme-on-primary, #fff) !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}

a.linkbutton {
    background: none;
    color: var(--mdc-theme-secondary) !important;
}

a.linkbutton:hover {
    color: var(--mdc-theme-primary) !important;
}

input[type="file"] {
    height: fit-content;
}

input[type="file"]:focus,
a.linkbutton:focus {
    outline: 1px dotted;
}

input[type="submit"]:hover,
input[type="submit"]:focus {
    opacity: .9;
}

input[type="submit"]:focus {
    opacity: .8;
}

input[type="submit"]:active {
    -webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
}

input,
textarea,
select,
legend,
a:hover,
h3 {
    color: inherit;
}

input,
textarea,
select {
    background: unset;
}

input[type="text"],
input[type="password"],
select {
    font-size: inherit;
}

p {
    margin-left: 0px;
    min-height: 1px;
}

body {
    xbackground-color: var(--mdc-theme-primary);
    background-color: #f5f5f5;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    height: 100%;
    font-size: 1rem;
}

table,
tr {
    background-color: transparent;
    border: 0px;
    border-collapse: collapse;
}

tr.alternate {
    background-color: transparent;
}

.fieldset-auto-width {
    border: 0px !important;
}

#typeForm {
    display: none;
}

hr {
    border: 0px;
    border-bottom: 2px solid #dcdcdc;
    margin-top: 30px;
    margin-bottom: 30px;
}

#content {
    -moz-border-radius: unset;
    -webkit-border-radius: unset;
    border: unset;
    margin: unset;
    padding: unset;
    width: 100%;
    background: #f5f5f5;
    float: none;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 64px);
}

#content>form {
    background: var(--mdc-theme-surface);
    padding: 40px;
}

#content>form+div {
    padding: 40px;
}

#content>* {
    order: 5;
}

#content::before {
    display: none;
}

.networklevelcontainer {
    position: relative;
    height: 15px;
}

.unitInfo {
    display: none;
}

.admincontent.mdc .validation-summary-errors {
    display: none;
}

/* Main */

html {
    height: 100%;
}

#main {
    margin: 0px;
    padding: 0px;
    flex-grow: 1;
    background: var(--mdc-theme-surface);
    overflow: auto;
    padding: 20px;
    font-size: unset;
}

body.admin #main {
    overflow: visible;
    padding: 0px;
}

.page {
    width: 100%;
    margin: 0px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

body.admin .page {
    display: block;
}

.page>header {
    top: 0px;
}

.centercontent {
    margin: 0px;
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
    width: auto;
}

div#languages {
    float: none;
    padding-right: 20px;
}

#content>h2 {
    background-color: transparent;
    order: 2;
    margin-top: 50px;
    padding-left: 38px;
}

body.mdc #content>h2 {
    margin-top: 25px
}

h1,
h2,
h3 {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-text-decoration: var(--mdc-typography-headline5-text-decoration);
    font-family: var(--mdc-typography-headline5-font-family);
    font-size: var(--mdc-typography-headline5-font-size);
    line-height: var(--mdc-typography-headline5-line-height);
    font-weight: var(--mdc-typography-headline5-font-weight);
    letter-spacing: var(--mdc-typography-headline5-letter-spacing);
    text-decoration: var(--mdc-typography-headline5-text-decoration);
    text-transform: var(--mdc-typography-headline5-text-transform);
    background-color: unset;
    border-radius: none;
}

h3,
h4 {
    -webkit-text-decoration: var(--mdc-typography-headline6-text-decoration);
    font-family: var(--mdc-typography-headline6-font-family);
    font-size: var(--mdc-typography-headline6-font-size);
    line-height: var(--mdc-typography-headline6-line-height);
    font-weight: var(--mdc-typography-headline6-font-weight);
    letter-spacing: var(--mdc-typography-headline6-letter-spacing);
    padding-left: 0px;
}

p.align-right {
    text-align: right;
}

.flex-end {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.flex-center {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#map-canvas {
    height: 100%;
}

.unit-map #map-canvas {
    width: 100%;
    height: calc(100vw / 2);
    max-height: 550px;
}

#title {
    padding: 0px;
    padding-left: 26px;
    line-height: 0px;
    display: flex;
    overflow: visible;
}

#title a:focus {
    outline: 1px dotted;
}

#title img {
    height: 50px;
}

.mdc-content {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 64px);
}

.mdc-content table td img {
    max-width: 40px;
    max-height: 40px;
    overflow: hidden;
}

.mdc-content .scroll-container {
    background: var(--mdc-theme-surface);
    flex-grow: 1;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

body.mdc #main {
    background: transparent;
}

.mdc-chip a,
.mdc-button a {
    color: inherit !important;
    text-decoration: inherit !important;
}

#app-bar .mdc-button a {
    white-space: nowrap;
    overflow: visible;
    text-transform: none;
    padding-left: 5px;
    padding-right: 5px;
}

#footer {
    color: #aaa;
    font-size: .6em;
    line-height: normal;
    margin: 0;
    padding: 10px 0;
    text-align: center;
    background: var(--mdc-theme-primary);
}

#footermenu {
    overflow: visible;
}

#footermenu button {
    margin-right: 15px;
    margin-bottom: 15px;
}

.client-logo {
    background-color: var(--mdc-theme-primary, #6200ee);
    height: 50px;
    padding: 5px;
    padding-left: 20px;
    padding-right: 20px;
}

@media (min-width: 1180px) {

    #content>h2 {
        width: 1130px;
        margin-left: auto;
        margin-right: auto;
    }

}

@media (max-width: 839px) {

    #content>h2 {
        padding-left: 17px;
    }

    #title {
        padding-left: 5px;
    }

    #title img {
        max-width: 130px;
        height: auto;
    }

}

@media (max-width: 599px) {

    .adminunit-map #map-canvas {
        height: calc(100vw * 1.5);
        max-height: 550px;
    }

    .flex-end {
        justify-content: flex-start;
    }

}

/* Favorite Icon */

.is-favorite {
    color: var(--mdc-theme-secondary) !important;
}

.is-favorite.js-clear-favorite:hover,
.is-favorite.js-clear-favorite2:hover {
    color: var(--mdc-theme-primary) !important;
}

.mdc-list.dashboard li {
    position: relative;
    padding-left: 46px;
}

.mdc-list.dashboard .mdc-list-item {
    padding-left: 11px;
}

.mdc-list.dashboard li .js-make-favorite,
.mdc-list.dashboard li .js-clear-favorite {
    position: absolute;
    left: 12px;
    top: 12px;
    cursor: pointer;
}

/* Dashboards */

.dashboard-grid {
    margin-top: 15px;
}

.dashboard-issues {
    float: none;
    background: none;
    display: flex;
    width: 100%;
    justify-content: space-around;
    flex-wrap: wrap;
}

.dashboard-activities,
.dashboard-open-issues {
    float: none;
}

.dashboard-item {
    float: none;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    flex-basis: 0;
    width: unset;
    min-width: fit-content;
    width: 110px;
}

.dashboard-item .heading {
    order: 2;
    font-size: var(--mdc-typography-overline-font-size);
    text-align: center;
    color: var(--mdc-theme-text-secondary-on-background);
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 5px;
}

.dashboard-item .value {
    order: 1;
    font-size: var(--mdc-typography-headline2-font-size);
    font-weight: bold;
    text-align: center;
    margin-top: 15px;
}

.dashboard-item:not(.due) .value {
    color: var(--mdc-theme-primary);
}

.box-shadow {
    -webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
}

/* Admin Content */

.admincontent {
    width: unset !important;
    border: 0px;
    padding: 40px;
    padding-top: 0px !important;
    overflow: auto;
    height: 100%;
    float: none;
    flex-grow: 1;

    x-webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
    xbox-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
}

h2+.adminsubmenu+.admincontent {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.admincontent>fieldset>table,
.admincontent>table,
.admincontent form>table {
    width: calc(100% + 80px) !important;
    margin-left: -40px;
}

.admincontent form>table {
    margin-top: -20px;
}

.admincontent>.admintoolbar+table {
    width: calc(100% + 80px) !important;
    margin-left: -40px;
}

.admincontent>fieldset>table,
.admincontent>table {
    -webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
    margin-top: 0px;
    margin-bottom: 20px;
}

.admincontent>fieldset {
    border-bottom: 0px !important;
}

.admincontent table {
    margin-top: 0px;
    background-color: var(--mdc-theme-surface, #fff);
}

.admincontent table td {
    padding-right: 16px;
    padding-left: 16px;
    height: 52px;
    padding-top: 7px;
    padding-bottom: 5px;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--mdc-typography-body2-font-family);
    font-size: var(--mdc-typography-body2-font-size);
    line-height: var(--mdc-typography-body2-line-height);
    font-weight: var(--mdc-typography-body2-font-weight);
    letter-spacing: var(--mdc-typography-body2-letter-spacing);
    -webkit-text-decoration: var(--mdc-typography-body2-text-decoration);
    text-decoration: var(--mdc-typography-body2-text-decoration);
    text-transform: var(--mdc-typography-body2-text-transform);
    box-sizing: border-box;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
}

.admincontent table td img {
    max-width: 40px;
    max-height: 40px;
    overflow: hidden;
}

.admincontent form table td img {
    max-width: none;
    max-height: none;
}

.scroll-container a:link,
.scroll-container a:visited,
.scroll-container a:active,
.mdc-data-table__cell a:link,
.mdc-data-table__cell a:visited,
.mdc-data-table__cell a:active,
.admincontent a:link,
.admincontent a:visited,
.admincontent a:active {
    color: var(--mdc-theme-primary);
    font-weight: 500;
    text-decoration: none;
}

.scroll-container a:hover,
.mdc-data-table__cell a:hover,
.admincontent a:hover {
    color: var(--mdc-theme-secondary);
}

.table-container {
    overflow: auto;
    width: calc(100% - 20px);
    margin-bottom: 20px;
}

@media (max-width: 900px) {

    .table-container {
        width: calc(100vw - 80px);
    }

}

@media (max-width: 600px) {

    .table-container {
        width: calc(100vw - 60px);
    }

}

@media (min-width: 1180px) {

    .admincontent>* {
        max-width: 1080px;
        margin-left: auto !important;
        margin-right: auto !important;
    }

}


/* Toolbar / Sub menu */

.admintoolbar.mdc {
    width: 100%;
    padding-left: 38px;
}

.admintoolbar.mdc .mdc-layout-grid__cell:first-child>.mdc-button:first-child {
    margin-left: -9px;
}

.admincontent>.admintoolbar {
    width: calc(100% + 80px) !important;
    xmargin-left: -40px;
    max-width: 1150px;
    margin-left: auto !important;
    margin-right: auto !important;
}

.admintoolbar h1 {
    margin: 0px;
}

.admintoolbar .mdc-button a {
    outline: 0px;
    max-width: 200px;
}

.mdc-button a.active {
    border-bottom: 1px solid;
    padding-bottom: 1px;
    padding-top: 2px;
    padding-left: 0px !important;
    padding-right: 0px !important;
    xmargin-left: 5px;
    xmargin-right: 5px;
}

.mdc-top-app-bar .mdc-button a.active {
    color: #AAC4D5 !important;
}

#breadcrumbs {
    color: var(--mdc-theme-text-secondary-on-light);
    line-height: 1.2rem;
    margin-bottom: 8px;
}

.toolbar,
.adminsubmenu {
    background: #6f91a7;
    width: 100%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    margin: 0px;
    padding: 5px;
}

.adminsubmenu {
    margin: 0px;
    float: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    order: 1 !important;
}

.adminsubmenu.empty {
    min-height: 36px;
}

.mdc-content .adminsubmenu {
    order: unset !important;
}

.user-search-enabled .adminsubmenu {
    width: auto;
    padding-right: 250px !important;
}

.adminsubmenu.mdc {
    height: auto;
    padding: 5px;
    xorder: 1 !important;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: left;
}

.toolbar .adminsubmenu.mdc {
    box-shadow: none;
    padding: 0px;
}

.adminsubmenu>ul {
    margin: 0px;
    display: flex;
    padding: 0px;
    flex-wrap: wrap;
    min-height: 36px;
}

.adminsubmenu .mdc-button {
    text-transform: none;
}

.adminsubmenu>ul>li {
    line-height: normal;
}

.adminsubmenu>ul>li a {
    color: var(--mdc-theme-text-primary-on-dark);
    font-weight: var(--mdc-typography-button-font-weight);
    font-family: var(--mdc-typography-button-font-family);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-size: var(--mdc-typography-button-font-size);
    line-height: normal;
    letter-spacing: var(--mdc-typography-button-letter-spacing);
    text-decoration: var(--mdc-typography-button-text-decoration);
    text-transform: none;
    padding: 0 8px 0 8px;
    display: inline-flex;
    position: relative;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 64px;
    min-height: 36px;
    border: none;
    outline: none;
    line-height: inherit;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-appearance: none;
    overflow: hidden;
    vertical-align: middle;
    border-radius: var(--mdc-shape-small, 4px);
}

.adminsubmenu>ul>li a:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.adminsubmenu>ul>li a:focus {
    background-color: rgba(0, 0, 0, 0.08);
}

.adminsubmenu>ul>li a:active {
    background-color: rgba(0, 0, 0, 0.12);
}

@media (min-width: 1180px) {

    .admintoolbar.mdc {
        max-width: 1100px;
    }

}

@media (min-width: 840px) {

    .adminsubmenu {
        padding-left: 30px !important;
    }

    .mdc-layout-grid.toolbar .adminsubmenu.mdc {
        padding-left: 26px !important;
    }

}

@media (max-width: 839px) {

    .admintoolbar.mdc {
        padding-left: 20px;
    }

    .toolbar,
    .adminsubmenu {
        padding-left: 10px !important;
    }

    .mdc-layout-grid.toolbar .adminsubmenu.mdc {
        padding-left: 0px !important;
    }

}

@media (min-width: 600px) {

    .admintoolbar .mdc-button {
        text-align: left;
        min-width: fit-content;
        height: fit-content;
        min-height: 56px;
        flex-direction: column;
        justify-content: flex-end;
        padding-bottom: 8px;
    }

    .admintoolbar .mdc-button a.active {
        margin-bottom: -2px;
    }

    .admintoolbar .mdc-button .mdc-button__icon {
        margin-right: 0px;
        margin-bottom: 5px;
    }

}

@media (max-width: 479px) {

    .user-search-enabled .adminsubmenu {
        padding-right: 0px !important;
    }

    .adminsubmenu+div:not(.admintoolbar) {
        xpadding: 0px;
    }

    .admincontent>fieldset>table,
    .admincontent>table,
    .admincontent form>table {
        xwidth: calc(100%) !important;
        xmargin-left: 0px;
    }

    .admincontent>.admintoolbar {
        width: 100%;
        margin-left: 0px;
    }

}

@media (max-width: 599px) {

    #title {
        padding-left: 13px;
    }

}

/* Search Field */

.searchfield {
    margin: 15px;
    border-radius: 28px;
    background-color: #9eb5c1;
    width: calc(100% - 30px);
    margin-top: 8px;
}

.searchfield input {
    border-bottom: 0px;
    font-size: var(--mdc-typography-button-font-size);
    height: 30px;
}

.searchfield .mdc-text-field__input,
.searchfield .mdc-text-field__icon {
    color: white !important;
}

.searchfield input::-webkit-input-placeholder {
    /* Edge */
    color: white !important;
}

.searchfield input:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: white !important;
}

.searchfield input::placeholder {
    color: white !important;
}

/* Customer Search */

#customer_search .searchfield {
    margin-left: -5px;
    width: 195px;
}

#customersearchcontainer {
    display: flex;
}

#customersearchphrase {
    font-size: var(--mdc-typography-button-font-size);
}

#customerDropdown {
    display: none;
}

#currentcustomer {
    background-color: #9eb5c1;
    width: 200px;
    height: 30px;
    margin-top: 8px;
    margin-right: 15px;
    justify-content: left;
}

#currentcustomer,
#currentcustomer .mdc-button__ripple {
    border-radius: 28px;
}

#currentcustomer .mdc-button__label {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    text-transform: none;
    flex-grow: 1;
    text-align: left;
}

.user-search {
    position: absolute;
    width: 100%;
    background: #6f91a7;
    min-height: 46px;
    text-align: right;
}

#clear-selected-user-container {
    position: absolute;
    right: 15px;
    top: 8px;
    width: 36px;
    height: 36px;
}

#clear-selected-user-container>div {
    position: relative;
}

#clear-selected-user {
    color: var(--mdc-theme-on-primary, #fff);
    font-size: 18px;
    vertical-align: top;
    width: 30px;
    height: 30px;
    padding: 6px;
}

.autocomplete {
    /*the container must be positioned relative:*/
    position: relative;
    display: inline-block;
    width: 100%;
}

.autocomplete strong {
    text-decoration: underline;
}

.autocomplete .material-icons {
    margin-right: 16px;
}

.autocomplete-items {
    position: absolute;
    border-bottom: none;
    border-top: none;
    z-index: 99;
    /*position the autocomplete items to be the same width as the container:*/
    top: 100%;
    left: 0;
    right: 0;
}

.mdc-drawer .mdc-list-item {
    border-radius: 0px;
    padding: 4px 4px 4px 12px;
    margin: 0px;
}

.mdc-drawer .mdc-list-divider {
    margin: 0px;
}

@media (max-width: 479px) {

    .user-search {
        float: none;
        display: flex;
        position: unset;
        min-height: 47px;
    }

    #currentcustomer {
        width: 100%;
        margin-left: 15px;
    }

}

/* Form Display/Edit */

#b_Save .mdc-button__icon {
    color: var(--mdc-theme-secondary);
}


input[name="action:Save"],
input[name="action:SaveAndSend"],
#b_Save,
#b_Delete {
    display: none !important;
}

.show-edit #b_Save,
.show-edit #b_Delete,
.show-edit #b_Back {
    display: inline-flex !important;
}

.show-edit #b_Edit {
    display: none !important;
}

/* .show-edit .display-field:not(.show-on-edit) {
    display: none !important;
}
 */
.show-edit .hide-on-edit {
    display: none !important;
}

.show-display .hide-on-display {
    display: none !important;
}

.show-display .text-box,
.show-display .editor-field {
    display: none !important;
}

.display-field:empty::before {
    content: '-';
}

.margin-left-on-empty:empty::before {
    margin-left: 14px;
}

.show-display #footermenu {
    display: none;
}

/* Content Form */

.admincontent>fieldset>form,
.admincontent>form {
    background: var(--mdc-theme-surface);
    width: 100%;
    margin-left: -40px;
    padding: 10px 40px;
/*     -webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, .2), 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12);
 */
    -webkit-box-shadow: 0 5px 5px -1px rgb(0 0 0 / 20%), 0 8px 10px -3px rgb(0 0 0 / 14%), 0 17px 14px 2px rgb(0 0 0 / 12%);
    box-shadow: 0 5px 5px -1px rgb(0 0 0 / 20%), 0 8px 10px -3px rgb(0 0 0 / 14%), 0 17px 14px 2px rgb(0 0 0 / 12%);
    margin-bottom: 40px;
}

.admincontent.multiform>form {
    box-shadow: 0 5px 5px -1px rgb(0 0 0 / 20%), 0 8px 10px -3px rgb(0 0 0 / 14%), 0 17px 14px 2px rgb(0 0 0 / 12%);
    margin-bottom: 0px;
    overflow: initial !important;
}

.admincontent.multiform>form:last-of-type {
    margin-bottom: 40px;
}

.admincontent>form,
.admincontent.mdc>form {
    padding: 20px 40px;
    width: 100%;
    margin-left: -40px;
    max-width: 1003px;
}

.admincontent.mdc>form {
    xheight: calc(100% - 40px);
    xmargin-bottom: 0px;
    xoverflow: overlay;
}

.mdc-form input[type="radio"],
.mdc-form input[type="checkbox"],
.mdc-form input[type="checkbox"].check-box {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0;
}

.mdc-form input[type="radio"]+label {
    padding-top: 3px;
    padding-right: 10px;
    padding-left: 2px;
}

.mdc-form input[type="text"],
.mdc-form input[type="number"],
.mdc-form input[type="email"],
.mdc-form input[type="password"],
.mdc-form textarea,
.mdc-form select {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--mdc-typography-subtitle1-font-family);
    font-size: var(--mdc-typography-subtitle1-font-size);
    font-weight: var(--mdc-typography-subtitle1-font-weight);
    letter-spacing: var(--mdc-typography-subtitle1-letter-spacing);
    -webkit-text-decoration: var(--mdc-typography-subtitle1-text-decoration);
    text-decoration: var(--mdc-typography-subtitle1-text-decoration);
    text-transform: var(--mdc-typography-subtitle1-text-transform);
    background: #f5f5f5;
    padding: 10px 14px 8px;
    border: 0px;
    border-bottom: 1px solid var(--mdc-theme-primary);
    border-top-left-radius: var(--mdc-shape-small, 4px);
    border-top-right-radius: var(--mdc-shape-small, 4px);
    margin-bottom: 1px;
    min-width: 150px;

    width: -moz-available;
    width: -webkit-fill-available;
    width: fill-available;
}

.input-validation-error {
    background: rgba(176, 0, 32, 0.1) !important;
    border-bottom: 1px solid var(--mdc-theme-error) !important;
}

.input-validation-error:focus {
    border-bottom: 2px solid var(--mdc-theme-error) !important;
}

.mdc-form select:hover,
.mdc-form input[type="text"]:hover,
.mdc-form input[type="number"]:hover,
.mdc-form input[type="email"]:hover,
.mdc-form input[type="password"]:hover,
.mdc-form textarea:hover {
    background: #ececec;
}

.mdc-form select:focus,
.mdc-form input[type="text"]:focus,
.mdc-form input[type="number"]:focus,
.mdc-form input[type="email"]:focus,
.mdc-form input[type="password"]:focus,
.mdc-form textarea:focus {
    outline: 0;
    background: #dcdcdc;
    border-bottom: 2px solid var(--mdc-theme-primary);
    padding-bottom: 7px;
}

.mdc-form select>option {
    background: var(--mdc-theme-surface);
}

#content form>div {
    float: none !important;
}

#content table {
    width: 100%;
}

#content table th {
    background-color: #a4a4a4;
    color: white;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--mdc-typography-subtitle2-font-family);
    font-size: var(--mdc-typography-subtitle2-font-size);
    line-height: var(--mdc-typography-subtitle2-line-height);
    font-weight: var(--mdc-typography-subtitle2-font-weight);
    letter-spacing: var(--mdc-typography-subtitle2-letter-spacing);
    -webkit-text-decoration: var(--mdc-typography-subtitle2-text-decoration);
    text-decoration: var(--mdc-typography-subtitle2-text-decoration);
    text-transform: var(--mdc-typography-subtitle2-text-transform);
    box-sizing: border-box;
    text-overflow: ellipsis;
    overflow: hidden;
    outline: none;
    height: 34px;
    padding-top: 7px;
    padding-bottom: 5px;
    padding-right: 16px;
    padding-left: 16px;
    text-align: left;
    text-align: -webkit-left;
}

#content .admincontent fieldset table th,
#content .admincontent fieldset table td {
    height: 34px;
    padding-top: 7px;
    padding-bottom: 5px;
    padding-right: 5px;
    padding-left: 10px;
}

#content table th a {
    color: white;
}

.mdc-dialog fieldset,
#content fieldset {
    border: 0px;
    padding: 0px;
    margin: 0px;
    margin-bottom: 10px;
    padding-top: 10px;
    padding-bottom: 30px;
    border-bottom: 2px solid #dcdcdc;
    width: unset;
    float: none;
    display: flex;
    flex-direction: column;
}

#content form:last-of-type fieldset:last-of-type {
    border-bottom: 0px;
}

#content .admincontent form fieldset {
    display: grid;
    grid-template-columns: 200px 1fr;
    grid-column-gap: 20px;
    width: unset;
    float: none;
    position: relative;
}

#content .admincontent form fieldset fieldset {
    display: flex;
    flex-direction: column;
}

#content .admincontent fieldset>.beside-break {
    display: none;
}

#content .admincontent form fieldset>* {
    grid-column: 2;
}

#content fieldset>p {
    min-height: 1px;
    grid-row: 100;
}

#content .editor-image {
    max-width: 100%;
}

#content .display-label,
#content .editor-label {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--mdc-typography-subtitle2-font-family);
    font-size: var(--mdc-typography-subtitle2-font-size);
    line-height: var(--mdc-typography-subtitle2-line-height);
    font-weight: var(--mdc-typography-subtitle2-font-weight);
    letter-spacing: var(--mdc-typography-subtitle2-letter-spacing);
    -webkit-text-decoration: var(--mdc-typography-subtitle2-text-decoration);
    text-decoration: var(--mdc-typography-subtitle2-text-decoration);
    text-transform: var(--mdc-typography-subtitle2-text-transform);
    margin-bottom: 5px;
}

.editor-label {
    color: rgba(0, 0, 0, .6);
}

.admincontent div[class*="-beside"] {
    margin-bottom: 20px;
    position: relative;
    margin-left: 0px;
}

fieldset fieldset>legend,
form>fieldset>h3 {
    font-family: var(--mdc-typography-subtitle2-font-family);
    font-size: var(--mdc-typography-subtitle2-font-size);
    line-height: var(--mdc-typography-subtitle2-line-height);
    font-weight: var(--mdc-typography-subtitle2-font-weight);
    letter-spacing: var(--mdc-typography-subtitle2-letter-spacing);
    -webkit-text-decoration: var(--mdc-typography-subtitle2-text-decoration);
    text-decoration: var(--mdc-typography-subtitle2-text-decoration);
    text-transform: var(--mdc-typography-subtitle2-text-transform);
}

.admincontent.mdc form>fieldset>* {
    margin-left: 14px;
}

/* .show-display form>fieldset>* {
    margin-left: 14px;
}
 */
form>fieldset>h3 {
    margin-left: 14px;
}

form h3 {
    color: rgba(0, 0, 0, .6);
}

.left-margin {
    margin-left: 14px;
}

.right-margin {
    margin-right: 5px;
}

.show-display .left-margin-on-display {
    margin-left: 14px;
}

.checkbox-item {
    display: flex;
    margin-bottom: 2px;
    margin-left: 14px;
}

.display-item {
    display: flex;
    margin-bottom: 2px;
}

.display-item>label,
.checkbox-item>label {
    margin-top: 2px;
}

.selected .display-item:before,
.show-display .checkbox-item:not(.disabled):before {
    content: 'check_circle_outline';
    color: rgba(0, 0, 0, .6);
    margin-right: 5px;
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 22px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

.show-display .checkbox-item.disabled {
    margin-left: 41px;
    color: var(--mdc-theme-text-disabled-on-light);
}

.editor-beside .editor-image {
    margin-right: 14px;
    margin-top: 8px;
}

.show-edit .editor-beside .editor-image {
    xmargin-left: 14px;
}

#content .display-field,
#content .editor-field {
    margin-bottom: 20px;
    display: flex;
}

#content .no-flex {
    display: block;
}

.editor-field>label {
    margin-top: 2px;
}

#content .display-field {
    xmargin-left: 14px;
}

.editor-field .mdc-typography--caption {
    color: rgba(0, 0, 0, .6);
}

#content .editor-label {
    font-family: var(--mdc-typography-caption-font-family);
    font-weight: var(--mdc-typography-caption-font-weight);
    letter-spacing: var(--mdc-typography-caption-letter-spacing);
    text-transform: var(--mdc-typography-caption-text-transform);
    font-size: 0.75rem;
    line-height: 1.15rem;
    text-align: left;
    color: rgba(0, 0, 0, .6);
}

#content .admincontent fieldset div[class*="-beside"]>.editor-label {
    position: absolute;
    top: 5px;
    left: 14px;
    white-space: nowrap;
    margin: 0px;
    overflow: hidden;
    /* xwidth: 100%; 200211 */
    min-width: fit-content; /* 210205 */
    text-overflow: ellipsis;
}

.show-edit .admincontent fieldset div[class*="-beside"] {
    overflow-x: hidden;
}

.show-display fieldset div[class*="-beside"]>.editor-label {
    width: 100%;
    min-width: unset !important;
}

#content .admincontent fieldset div[class*="-beside"]>.display-field,
#content .admincontent fieldset div[class*="-beside"]>.editor-field {
    margin-top: 27px;
    xmargin-top: 25px;
    margin-bottom: 0px;
    margin-left: 14px;
    display: flex;
    min-height: 19px;
    flex-wrap: wrap;
}

#content form fieldset div[class*="-beside"]>.editor-field>input[type="text"],
#content form fieldset div[class*="-beside"]>.editor-field>input[type="number"],
#content form fieldset div[class*="-beside"]>.editor-field>input[type="email"],
#content form fieldset div[class*="-beside"]>.editor-field>input[type="password"] {
    padding-top: 17px;
    height: 38px;
    padding-bottom: 0px;
}

#content form fieldset div[class*="-beside"]>.editor-field>input[type="text"],
#content form fieldset div[class*="-beside"]>.editor-field>input[type="number"],
#content form fieldset div[class*="-beside"]>.editor-field>input[type="email"],
#content form fieldset div[class*="-beside"]>.editor-field>input[type="password"],
#content form fieldset div[class*="-beside"]>.editor-field>textarea {
    margin-top: -28px;
    margin-left: -14px;
}

#content form fieldset div[class*="-beside"]>div[class*="-beside"]>.editor-field>input[type="text"],
#content form fieldset div[class*="-beside"]>div[class*="-beside"]>.editor-field>input[type="number"],
#content form fieldset div[class*="-beside"]>div[class*="-beside"]>.editor-field .editor-field>input[type="email"],
#content form fieldset div[class*="-beside"]>div[class*="-beside"]>.editor-field .editor-field>input[type="password"],
#content form fieldset div[class*="-beside"]>div[class*="-beside"]>.editor-field .editor-field>textarea {
    margin-top: 0px;
}

#content form fieldset div[class*="-beside"]>.editor-field>select {
    margin-left: -14px;
    margin-top: -27px;
    padding-top: 25px;
}

#content form fieldset div[class*="-beside"]>.editor-field>textarea {
    padding-top: 28px;
    min-height: 70px;
    min-width: 100px;
}

#content form div[class*="-beside"]>.editor-field>input[type="text"]:focus,
#content form div[class*="-beside"]>.editor-field>input[type="number"]:focus,
#content form div[class*="-beside"]>.editor-field>input[type="email"]:focus,
#content form div[class*="-beside"]>.editor-field>input[type="password"]:focus {
    height: 36px;
    padding-top: 18px;
}

#content fieldset>legend {
    color: #000;
    font-weight: 500;
    grid-column: 1 !important;
    letter-spacing: .02em;
    grid-row: 1 / last-line;
    grid-row-start: span 9000;
    margin: 0px;
    margin-bottom: 10px;
}

#content fieldset>legend>h3 {
    margin: 0px;
}

#content fieldset>legend>h4 {
    margin: 0px;
    font-weight: normal;
}

.admincontent form>fieldset>legend {
    position: relative;
    top: 10px;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--mdc-typography-headline6-font-family);
    font-size: var(--mdc-typography-headline6-font-size);
    line-height: var(--mdc-typography-headline6-line-height);
    font-weight: var(--mdc-typography-headline6-font-weight);
    letter-spacing: var(--mdc-typography-headline6-letter-spacing);
    -webkit-text-decoration: var(--mdc-typography-headline6-text-decoration);
    text-decoration: var(--mdc-typography-headline6-text-decoration);
    text-transform: var(--mdc-typography-headline6-text-transform);
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    height: auto;
    left: -30px;
    padding-left: 30px;
    position: absolute;
}

fieldset.toggle>legend {
    cursor: pointer;
    position: relative;
    max-width: 200px;
}

fieldset.toggle.hide>legend {
    height: auto !important;
    margin-bottom: 20px !important;
    word-break: normal !important;
    position: relative;
}

fieldset.toggle.hide {
    padding-bottom: 0px !important;
    display: flex !important;
    flex-direction: column !important;
}

fieldset.toggle.hide>*:not(legend) {
    display: none !important;
}

fieldset.toggle>legend:before {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 28px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    content: 'expand_more';
    position: absolute;
    top: 1px;
    left: 0px;
}

fieldset.toggle.hide legend:before {
    content: 'expand_less';
}

#content form .field-validation-error,
#content form .field-validation-valid {
    display: block;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: var(--mdc-typography-caption-font-family);
    font-size: var(--mdc-typography-caption-font-size);
    line-height: var(--mdc-typography-caption-line-height);
    font-weight: var(--mdc-typography-caption-font-weight);
    letter-spacing: var(--mdc-typography-caption-letter-spacing);
    -webkit-text-decoration: var(--mdc-typography-caption-text-decoration);
    text-decoration: var(--mdc-typography-caption-text-decoration);
    text-transform: var(--mdc-typography-caption-text-transform);
    color: rgba(0, 0, 0, .6);
}

#content form .field-validation-error {
    color: var(--mdc-theme-error);
    width: 100%;
}

.radiobutton {
    display: flex;
}

.radiobutton input {
    flex-shrink: 0;
}

.radiobutton label {
    padding: 3px;
}

/* *+.text-box.single-line {
    margin-left: 5px !important;
} */

@media (max-width: 900px) {

    .admincontent>form,
    .admincontent.mdc>form {
        padding: 20px 20px;
        width: calc(100% + 40px);
    }

    #content .admincontent form fieldset {
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
        padding-bottom: 10px;
        padding-top: 0px;
    }

    #content .admincontent form fieldset.toggle.hide {
        padding-bottom: 30px;
    }

    #content .admincontent form>fieldset>legend {
        top: 0px;
        display: block;
        margin-bottom: 20px !important;
        left: -16px;
        max-width: none;
        height: auto;
        width: calc(100% - 10px);
        position: relative;
    }

    .admincontent.mdc {
        xbackground: var(--mdc-theme-surface);
        background: #f5f5f5;
    }

}

@media (max-width: 839px) {

    .admincontent>form,
    .admincontent.mdc>form {
        width: 100%;
        margin-left: -20px;
    }

}

@media (max-width: 599px) {

    .admincontent.mdc form>fieldset>* {
        margin-left: 0px;
    }

    #content fieldset .editor-field {
        max-width: calc(100vw - 60px);
    }

    #content fieldset .editor-field>textarea,
    #content fieldset .editor-field>select,
    #content fieldset .editor-field>input {
        width: 100%;
        width: -moz-available;
        width: -webkit-fill-available;
        width: fill-available;
    }

    .checkbox-item {
        margin-right: 14px;
        margin-left: 0px;
    }

    .show-display .admincontent div[class*="-beside"] {
        margin-left: -14px;
    }

/*     .admincontent>form,
    .admincontent.mdc>form {
        padding: 20px 10px;
        width: calc(100% + 20px);
    }
 */
}

/* Flex */

.flex {
    display: flex;
    flex-wrap: wrap;
}

.bottom-margin {
    margin-bottom: 30px;
}


/* Grids */

.grid {
    display: grid;
    margin-left: 0px !important;
    margin-bottom: 10px;
}

.grid.left-margin {
    margin-left: 14px !important;
}

.grid.left-margin-on-edit {
    margin-left: 0px !important;
}

.show-edit .grid.left-margin-on-edit {
    margin-left: 14px !important;
}

.no-left-margin {
    margin-left: 0px !important;
}

.no-left-padding {
    padding-left: 0px !important;
}

.grid.grid-col-3 {
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(180px, 1fr);
    grid-column-gap: 20px;
}

fieldset .grid .editor-field>textarea,
fieldset .grid .editor-field>select,
fieldset .grid .editor-field>input[type="text"]:focus,
fieldset .grid .editor-field>input[type="number"]:focus,
fieldset .grid .editor-field>input[type="email"]:focus,
fieldset .grid .editor-field>input[type="password"]:focus {
    width: -moz-available;
    width: -webkit-fill-available;
    width: fill-available;
}

fieldset .grid .editor-field>input[type="checkbox"] {
    xmargin-left: 14px;
}

.grid .radiobuttonlist-vertical:first-of-type,
.grid .radiobuttonlist-horiz:first-of-type {
    margin-left: 14px;
}

.show-display .radiobuttonlist-vertical.disabled,
.show-display .radiobuttonlist-horiz.disabled {
    color: var(--mdc-theme-text-disabled-on-light);
}

@media (max-width: 630px) {

    .grid.grid-col-3 {
        grid-column-gap: 10px;
    }

}

@media (max-width: 599px) {

    .show-edit .grid.left-margin-on-edit {
        margin-left: 0px !important;
    }

    .grid .radiobuttonlist-vertical,
    .grid .radiobuttonlist-horiz {
        margin-left: 0px !important;
    }

    .grid.grid-col-3 {
        display: flex;
        flex-direction: column;
    }

}

/* Login */

figure.logo {
    width: 100%;
    padding: 0px;
    margin: 0px;
    margin-bottom: 30px;
}

figure.logo>img {
    width: 100%;
    height: auto;
}

body.login {
    background-color: var(--mdc-theme-primary);
}

body.login #title {
    display: none;
}

.login fieldset {
    border: 0px;
    padding: 0px;
    margin: 0px;
}

.login fieldset>legend {
    display: none;
}

.mdc-center-content.login {
    max-width: 330px;
    margin: 0px auto;
}

.mdc-center-content.login .mdc-text-field,
.mdc-center-content.login .text-field-container {
    width: 100%;
}

/* Hack to right align after redraw */
.mdc-menu {
    transform-origin: right top !important;
    right: 0px !important;
    top: 48px !important;
    left: unset !important;
}

/* MDC Snackbar */

.mdc-snackbar__label {
    white-space: pre-line;
}

/* MDC Variations */

.mdc-secondary-bg {
    background-color: var(--mdc-theme-secondary) !important;
    color: var(--mdc-theme-text-secondary-on-dark) !important;
}

.mdc-gray-bg {
    background-color: #a4a4a4 !important;
}

/* MDC Top App BAR */

.mdc-top-app-bar {
    position: static;
}

/* .mdc-top-app-bar .mdc-button {
    opacity: 0;
}

.mdc-top-app-bar.done .mdc-button {
    opacity: 1;
}
 */
.mdc-top-app-bar .mdc-button .mdc-button__ripple::before,
.mdc-top-app-bar .mdc-button .mdc-button__ripple::after {
    background-color: var(--mdc-theme-on-primary, #fff);
}

.mdc-top-app-bar .mdc-button.mdc-ripple-upgraded--background-focused .mdc-button__ripple:before {
    opacity: .24;
}

@media (max-width: 599px) {

    .mdc-top-app-bar .mdc-button {
        display: none !important;
    }

    #dropmenu_button {
        display: inline-block !important;
    }

    #default-menu .mdc-list-item {
        display: flex !important;
    }

}

/* MDC Dialog */

.mdc-dialog__content>form {
    margin-top: 10px !important;
}

.mdc-dialog .mdc-dialog__content {
    color: inherit;
}

/* MDC Drawer */

.mdc-drawer__content {
    height: calc(100% - 64px);
}

.mdc-drawer .bubble:before,
.mdc-drawer .bubble:after {
    content: none;
    display: none;
}

.mdc-drawer .bubble {
    background-color: transparent;
    border: 0px;
    border-radius: 5px;
    display: inline-block;
    padding: 0.8em 1em;
    border-radius: 0px;
    box-shadow: none;
}

.mdc-drawer .tooltip {
    position: static;
    float: none;
    width: 100%;
    font-family: Roboto, sans-serif;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    line-height: 1.25rem;
    font-weight: 400;
    text-decoration: inherit;
    text-transform: inherit;
    font-size: .875rem;
    letter-spacing: .0178571429em;
}

.mdc-drawer .tooltip>img {
    margin-left: auto;
    position: absolute;
    left: 20px;
    top: 62px;
}

.mdc-drawer #search-helper-text {
    padding-left: 22px;
}

.mdc-drawer .tooltipContainer {
    padding: 0px;
    width: 223px;
}

.mdc-drawer .tooltipContainer ul {
    margin-bottom: 0;
    margin-left: 0px;
    padding-left: 15px;
}

.mdc-drawer .tooltip:hover .bubble {
    position: static;
    left: 0px;
    width: 223px;
}

td .tooltip:hover .bubble {
    position: static;
    left: 0px;
    width: 223px;
}

@media (max-width: 479px) {

    .mdc-drawer {
        width: 100%;
    }

    body.mdc-drawer--open div.mdc-drawer-app-content {
        overflow: hidden;
    }

}

.mdc-drawer--right.mdc-drawer--open:not(.mdc-drawer--closing)+.mdc-drawer-app-content {
    margin-left: 0;
    margin-right: 256px;
}

.mdc-drawer--right {
    left: unset;
    right: 0;
}

.mdc-drawer--right.mdc-drawer--animate,
.mdc-drawer--right.mdc-drawer--animate {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}

.mdc-drawer--right.mdc-drawer--opening,
.mdc-drawer--right.mdc-drawer--opening {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.mdc-drawer--closing,
.mdc-drawer--closing {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}

/* MDC Dark theme */

.dark .mdc-floating-label.mdc-floating-label--float-above {
    background-color: var(--mdc-theme-primary);
}

.mdc-text-field .mdc-text-field__input {
    caret-color: white;
}

.dark input:-webkit-autofill,
.dark input:-webkit-autofill:hover,
.dark input:-webkit-autofill:focus textarea:-webkit-autofill,
.dark textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
.dark select:-webkit-autofill,
.dark select:-webkit-autofill:hover,
.dark select:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px var(--mdc-theme-primary) inset !important;
    -webkit-text-fill-color: white;
    transition: background-color 5000s ease-in-out 0s;
}

.dark .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background {
    border-color: white;
}

.dark .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input {
    color: white;
}

.dark .mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label {
    color: #6692aa;
}

.dark .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__leading,
.dark .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__notch,
.dark .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__trailing {
    border-color: #6692aa !important;
}

/* MDC Data Table */

.mdc-data-table {
    width: 100%;
    border: 0px;
    border-radius: 0px;
    overflow: visible;
}

.mdc-data-table__table {
    white-space: normal;
}

.mdc-data-table table {
    background-color: var(--mdc-theme-surface, #fff);
}

.mdc-data-table__table-container {
    overflow: visible;
}

.scroll-container .mdc-data-table__header-cell:first-child,
.scroll-container .mdc-data-table__cell:first-child {
    padding-left: 39px !important;
}

.scroll-container .mdc-data-table__header-cell:last-child,
.scroll-container .mdc-data-table__cell:last-child {
    padding-right: 39px !important;
}

.mdc-data-table .mdc-data-table__header-row {
    background-color: #a4a4a4;
    color: var(--mdc-theme-text-primary-on-dark);
    height: 30px;
}

.mdc-data-table table,
.mdc-data-table tr {
    /* background-color: unset; 210418 Removed */
    width: unset !important;
}

.mdc-data-table table th {
    background-color: unset;
    color: unset;
    text-align: left;
    position: sticky;    
    top: 0px;
    background-color: #a4a4a4;
}

.mdc-data-table__header-cell {
    height: 34px;
}

.align-right {
    text-align: right;
}

.force-wrap {
    overflow-wrap: anywhere;
}

.no-wrap {
    white-space: nowrap;
}

tr.onclick {
    cursor: pointer;
}

.material-icons.inherit-size {
    font-size: inherit;
    cursor:default;
}

.toggle__row {
    display: none;
    padding: 14px;
}

.toggle__row.show {
    display: block;
}

.scroll-container .mdc-data-table__cell.toggle__cell {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.child__tbody {
    display: none;
}

.child__tbody.show {
    display: table-row-group;
}

@media (max-width: 839px) {

    .scroll-container .mdc-data-table__header-cell:not(.toggle__cell):first-child,
    .scroll-container .mdc-data-table__cell:not(.toggle__cell):first-child {
        padding-left: 20px !important;
    }

    .scroll-container .mdc-data-table__header-cell:last-child,
    .scroll-container .mdc-data-table__cell:last-child {
        padding-right: 20px !important;
    }

}

@media (max-width: 599px) {

    .admincontent .scroll-container {
        padding-right: 20px;
        xfloat: left !important;
    }

    #content form>div.scroll-container {
        float: left !important;
    }

}

/* Scroll container */

@media (min-width: 1120px) {

    .mdc-content .scroll-container {
        width: 1080px;
        margin: 0px auto;
    }
}

/* MDC List */

.mdc-list {
    background-color: var(--mdc-theme-surface);
}

.mdc-list-item--readonly .mdc-list-item__text {
    opacity: 1;
}

.mdc-list .mdc-list-divider:last-child {
    display: none;
}

.mdc-list-item__text a:focus {
    outline: 1px dotted;
}


/* Tablet */

@media (max-width: 839px) {

    .admincontent {
        xoverflow: initial;
        width: calc(100% - 40px) !important;
        xoverflow-x: hidden; /* Removed 210122 because no scroll x on mobile */
        padding-left: 20px;
        padding-right: 20px;
    }

}

@media (max-width: 599px) {

    body:not(.login) .mdc-top-app-bar {
        position: fixed;
    }

    .admincontent>* {
        overflow-x: auto;
        width: 100%;
    }

    .admincontent>fieldset>table,
    .admincontent>table,
    .admincontent form>table {
        width: calc(100% + 40px) !important;
        margin-left: -20px;
    }

    .mdc-data-table table th {
        position: initial;
    }

    .mdc-content .scroll-container {
        overflow-y: visible;
        overflow-x: auto;
        height: fit-content;
    }

    .admincontent>fieldset>form,
    .admincontent>form {
        overflow-x: auto;
        overflow-y: hidden;
    }

    body {
        overflow-y: auto;
    }

    body:not(.login) .page {
        padding-top: 56px;
        height: auto;
    }

    .hide-on-mobile {
        display: none;
    }

}

@media (max-width: 479px) {

    .mdc-menu-surface--anchor {
        position: unset;
    }

    .mdc-menu-surface {
        right: 0px !important;
        left: 0px !important;
        max-width: none !important;
        border-radius: 0px !important;
        height: 100vh !important;
        top: 56px !important;
        max-height: none !important;
    }

    #customer_search form,
    #customer_search .searchfield {
        width: 100%;
    }

    #customer_search form {
        margin-right: 10px;
    }

}

/* Menu break points */

.hide,
.max-phone,
.max-tablet,
.max-desktop,
.max-desktop-wide,
.min-desktop,
.min-desktop-wide,
.min-desktop-widest {
    display: none;
}

.hide {
    display: none !important;
}

@media (min-width: 840px) {

    .min-desktop.mdc-button {
        display: inline-flex;
    }

}

@media (min-width: 1100px) {

    .min-desktop-wide.mdc-button {
        display: inline-flex;
    }

}

@media (min-width: 1500px) {

    .min-desktop-widest.mdc-button {
        display: inline-flex;
    }

    #dropmenu_button {
        display: none !important;
    }

}

@media (max-width: 599px) {

    .max-phone.mdc-list-item {
        display: flex;
    }

}

@media (max-width: 839px) {

    .max-tablet.mdc-list-item {
        display: flex;
    }

}

@media (max-width: 1099px) {

    .max-desktop.mdc-list-item {
        display: flex;
    }

}

@media (max-width: 1499px) {

    .max-desktop-wide.mdc-list-item {
        display: flex;
    }

}

/* Header height get thinner so.. */

@media (max-width: 599px) {

    body:not(.login) #footer {
        display: none;
    }

    .mdc-drawer__content {
        height: calc(100vh - 56px);
    }

    #content {
        height: auto;
    }

    .admincontent table {
        overflow-x: auto;
        width: 100%;
    }

}


@media (max-width: 479px) {

    .mdc-drawer__content {
        height: calc(100vh - 103px);
    }

    .mdc-content {
        xheight: calc(100vh - 103px);
        display: block;
        height: auto;
    }

}

.legacy .centercontent {
    max-width: none;
}


/* Scaling experiment for phones */

/* element.style {
    transform: scale(0.7);
    -transform-origin: 0 0;
    transform-origin: top left;
}
 */