/*!
 * ProLink Web UI CSS
 */

/*!
 * Notes
 *
 * Implement env(safe-area-inset-top,right,bottom,left) for iPhoneX+ when appropriate
 */


/* General */
html, body {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 0;
    padding: 0;
    margin: 0;
}
html.csstransforms3d body {
	-webkit-transform: translate3d(0, 0, 0); /* Activates hardware rendering if available */
}
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Roboto', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #222224;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-font-smoothing: subpixel-antialiased;
    /*text-rendering: auto;
    -moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;*/
}
h1, h2, h3, h4, h5 {
    font-weight: 700;
    color: black;
}
a, a:hover, a:focus, a:visited, .linked {
    color: #0A7AFF !important;
    text-decoration: none !important;
    cursor: pointer;
}
a:not([disabled]), .linked:not([disabled]) {
    cursor: pointer;
}
.linked-white, .linked-white:hover, .linked-white:focus, .linked-white:visited {
    color: white !important;
}
.popover {
    font-family: -apple-system, BlinkMacSystemFont, 'Roboto', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
}
::selection {
    color: white;
    background: #0A7AFF;
}
.selectable {
    -webkit-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
    user-select: text !important;
}
.highlighted {
    color: #0A7AFF;
}
.ghosted {
    opacity: 0.5;
}
.transparent {
    opacity: 0;
}
.sticky-header {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    left: 0;
}
.sticky-footer {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    left: 0;
}
.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.no-click {
    pointer-events: none;
}

/* Font Weights */
.font-light {
    font-weight: 300;
}
.font-normal {
    font-weight: 400;
}
.font-medium {
    font-weight: 500;
}
.font-bold {
    font-weight: 700;
}
.font-black {
    font-weight: 900;
}

/* Vector image handling */
html.svg .raster-image,
html:not(.svg) .vector-image {
    display: none;
}

/* Text */
.text-default {
    color: #222224 !important;
}
.text-primary {
    color: #0A7AFF !important;
}
.text-gray {
    color: gray !important;
}
.text-lightgray {
    color: #C5C5C5 !important;
}
.text-success {
    color: #4CAF50 !important;
}
.text-danger {
    color: #D50000 !important;
}
.text-warning {
    /*color: #FF9800 !important;*/
    color: #F66D3C !important;
}
.text-qoh {
    color: #4CAF50 !important;
}
.text-no-qoh,
.text-qoh.no-qoh {
    color: #D50000 !important;
}
.text-qic,
.text-qoo {
    color: #EF6C00 !important;
}
.text-price {
    color: #DD2C00 !important;
}
.text-base-price {
    color: #0066C0 !important;
}
.text-icon {
    display: inline-block;
}
.text-icon .icon-label {
    display: inline-block;
    height: 24px;
    vertical-align: top;
}
.text-icon .text-label {
    display: inline-block;
    line-height: 24px;
    vertical-align: top;
}

/* Bumpers and Spacers */
.bumper {
    height: 25px;
}

/* Buttons */
.btn {
    height: 40px;
    font-size: 16px;
    line-height: 38px;
    vertical-align: baseline;
    border: 1px solid rgba(0,0,0,0.2);
    border-radius: 2px;
    padding: 0 16px;
}
.btn-xs {
    height: 30px;
    font-size: 14px;
    line-height: 28px;
    padding: 0px 12px;
}
.btn-sm {
    height: 35px;
    font-size: 15px;
    line-height: 33px;
    padding: 0px 15px;
}
.btn-lg {
    height: 50px;
    font-size: 18px;
    line-height: 48px;
    padding: 0 20px;
}
.btn-icon i {
    line-height: 38px;
    margin-right: 5px;
}
.btn .keymap {
    line-height: 16px;
    color: white;
    background: rgba(0,0,0,0.25);
    padding: 0px 5px;
    margin-left: 5px;
    margin-right: -5px;
}
.btn-lg .keymap {
    line-height: 18px;
    padding: 0px 6px;
    margin-right: -6px;
}
html:not(.shell) .btn .keymap { display: none; }
a.btn, .btn, .btn:hover, .btn:focus, .btn:active {
    background: none;
    color: #1E88E5;
    border: 1px solid #CECECF;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

/* Styled Buttons */
a.btn-spruce-white,
.btn-spruce-white {
    background: white;
}
a.btn-spruce-default,
.btn-spruce-default,
.btn-spruce-default:hover,
.btn-spruce-default:active,
.btn-spruce-default:focus,
.btn-spruce-default:active:focus {
    color: #FFF;
    background: rgba(0,0,0,0.25);
    border: 1px solid rgba(0,0,0,0.1);
}
.btn-spruce-default .keymap {
    background: rgba(0,0,0,0.1);
}
a.btn-spruce-forward,
.btn-spruce-forward,
.btn-spruce-forward:hover,
.btn-spruce-forward:focus {
    background: #4CAF50;
    color: white;
    border: 1px solid #4CAF50;
}
.btn-spruce-forward:active {
    background: #43A047;
}
.btn-spruce-forward .keymap {
    background: rgba(0,0,0,0.1);
}
a.btn-spruce-highlighted,
.btn-spruce-highlighted,
.btn-spruce-highlighted:hover,
.btn-spruce-highlighted:focus {
    background: #1E88E5;
    color: white;
    border: 1px solid #1E88E5;
}
.btn-spruce-highlighted:active {
    background: #1976D2;
}
.btn-spruce-highlighted .keymap {
    background: rgba(0,0,0,0.1);
}
a.btn-spruce-warning,
.btn-spruce-warning,
.btn-spruce-warning:hover,
.btn-spruce-warning:focus {
    background: #F5640A;
    color: white;
    border: 1px solid #F5640A;
}
.btn-spruce-warning:active {
    background: #FF6F00;
}
.btn-spruce-warning .keymap {
    background: rgba(0,0,0,0.1);
}
a.btn-spruce-danger,
.btn-spruce-danger,
.btn-spruce-danger:hover,
.btn-spruce-danger:focus {
    background: #D50000;
    color: white;
    border: 1px solid #D50000;
}
.btn-spruce-danger:active {
    background: #C70101;
}
.btn-spruce-danger .keymap {
    background: rgba(0,0,0,0.1);
}
.btn.no-bknd,
.btn.no-bknd:hover,
.btn.no-bknd:focus,
.btn.no-bknd:active {
    background: none !important;
}
.btn.no-border,
.btn.no-border:hover,
.btn.no-border:focus,
.btn.no-border:active
.btn.no-border:active:focus {
    border: 1px solid rgba(0,0,0,0) !important;
    -webkit-box-shadow: none;
    box-shadow: none;
}

/* Button Groups */
.btn-group .btn:not(:first-child) {
    margin-left: -1px;
}

/* Alerts */
.alert {
    background-color: white;
    border-width: 2px;
    border-radius: 2px;
}
.alert-primary {
    color: #0A7AFF;
    border-color: #0A7AFF;
}
.alert-success {
    color: #4CAF50;
    border-color: #4CAF50;
}
.alert-warning {
    color: #F5640A;
    border-color: #F5640A;
}
.alert-danger {
    color: #D50000;
    border-color: #D50000;
}

/* Cards */
.card {
    border-radius: 2px;
}
.card.gray {
    background: #F7F7F9;
}
.card.no-border {
    border: 0;
}
.card .card-body {
    padding: 20px;
}
.card .card-title {
    display: inline-block;
    position: absolute;
    top: -11px;
    left: 15px;
    height: 15px;
    line-height: 15px;
    font-size: 15px;
    font-weight: 500;
    background: white;
    padding: 0px 5px;
}

/* Form Controls */
label {
    margin-bottom: 5px;
}
.form-group {
    margin-bottom: 15px;
}
.form-group label,
.form-group .input-label {
    display: block;
    font-size: 13px;
    font-weight: 400;
    line-height: 15px;
    color: gray;
    margin-bottom: 5px;
}
.form-control {
    height: 40px !important;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    color: #333;
    background: white;
    border-radius: 2px;
    border: 1px solid #CECECF;
    padding: 0 12px;
    vertical-align: baseline;
    -webkit-box-shadow: none !important;
    -webkit-appearance: none !important;
    box-shadow: none !important;
}
.form-control:focus {
    color: #0A7AFF;
    background: white;
    border-color: #CECECF;
    box-shadow: none !important;
}
.form-control:hover,
.form-control:active {
    background: white;
}
.form-control[disabled] {
    background-color: #ECEFF1;
}
.form-control.has-warning {
    background: #FFF3E0;
    border-color: #EF6C00;
}
.form-control.has-error {
    background: #FFEBEE;
    border-color: #D50000;
}
.form-control-trans {
    background: rgba(0,0,0,0.06);
    border: 0;
}
.form-control-trans:focus,
.form-control-trans:hover,
.form-control-trans:active {
    background: rgba(0,0,0,0.075);
}
.form-padding {
    padding-top: 15px;
    padding-left: 15px;
}
.input-group-addon {
    height: 40px;
    color: #7E7E7F;
    background: #F6F6F8;
    border-color: #CECECF;
    border-style: solid;
    border-radius: 0;
    padding: 0 8px;
    cursor: pointer;
}
.input-group-addon.disabled {
    opacity: 0.5;
}
.input-group-addon:first-child {
    border-width: 1px 0 1px 1px;
    border-radius: 2px 0 0 2px;
}
.input-group-addon:last-child {
    border-width: 1px 1px 1px 0;
    border-radius: 0 2px 2px 0;
}
textarea.form-control {
    height: auto !important;
    padding: 8px 12px;
    resize: vertical;
}
textarea.form-control.no-resize {
    resize: none;
}
.dummy-input {
    background: none;
    border-color: rgba(0,0,0,0.1);
    padding: 8px 12px;
    pointer-events: none;
    cursor: default;
}
select.form-control option {
    background: white;
    color: black;
}
.select-control {
    position: relative;
    border-radius: 2px;
}
.select-control select {
    padding-right: 35px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.select-control:not(.disabled) select {
    cursor: pointer;
}
.select-control option {
    background: white;
    color: black;
}
.select-control:not(.disabled)::after {
    content: '';
    position: absolute;
    top: 15px;
    right: 13px;
    width: 0;
    height: 0;
    clear: both;
    pointer-events: none;
    border-left: 5.5px solid transparent;
    border-right: 5.5px solid transparent;
    border-top: 10px solid #363636;
}
.checkbox-control,
.radio-control {
    position: relative;
    color: #333;
    border-radius: 20px;
    padding-left: 40px;
    cursor: pointer;
}
.checkbox-control:not(.bordered),
.radio-control:not(.bordered) {
    border-width: 0;
}
.checkbox-control input,
.radio-control input {
    display: none;
}
.checkbox-control label,
.radio-control label {
    font-size: 15px;
    line-height: 40px;
    color: #333;
    margin: 0;
    opacity: 1;
}
.checkbox-control::before,
.radio-control::before {
    position: absolute;
    top: 0;
    left: 10px;
    font-family: "Material Icons";
    font-size: 24px;
    line-height:40px;
}
.checkbox-control.checked::before,
.radio-control.checked::before {
    color: #0A7AFF;
}
.checkbox-control:not(.checked)::before {
    content: "\E835";
}
.checkbox-control.checked::before {
    content: "\E834";
}
.radio-control:not(.checked)::before {
    content: "\E836";
}
.radio-control.checked::before {
    content: "\E837";
}
.radio-group .radio-control:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right-width: 0;
}
.radio-group .radio-control:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Form Validation */
.invalid label, label.invalid {
    color: #D50000;
}
.invalid-hint {
    display: none;
}
.invalid .invalid-hint {
    display: inline-block;
}
.invalid-hint .hint-icon {
    position: relative;
    top: 0;
    left: 0;
    height: 24px;
    line-height: 24px;
    margin: 0;
}
.invalid input, input.invalid,
.invalid select, select.invalid {
    border-color: #D50000;
}
.checkbox-control.invalid label,
.radio-control.invalid label {
    color: #D50000;
}
.checkbox-control.invalid::before,
.radio-control.invalid::before {
    color: #D50000;
}
.checkbox-control.invalid .invalid-hint,
.radio-control.invalid .invalid-hint {
    margin-left: 15px;
    font-weight: 500;
    vertical-align: middle !important;
}
.form-group .invalid-hint {
    float: right;
    font-weight: 500;
}

/* Specialized Form Controls */
input.form-control {
    line-height: 38px;
}
input.form-control::-ms-clear {
    display: none;
}
input.form-control[type=date] {
    padding-right: 7px;
}
input.form-control::-webkit-inner-spin-button {
    display: none;
    -webkit-appearance: none;
}
input.form-control::-webkit-calendar-picker-indicator {
    margin: 0;
}
select.form-control::-ms-expand {
    display: none;
}

/* Animations */
.collapsing {
    pointer-events: none;
}

/* Z Indexes / Rendering Layer */
.sticky-header,
.sticky-footer {
    z-index: 1;
}
#blocker-modal {
    z-index: 2;
}
#nav-overflowmenu {
    z-index: 3;
}
#nav-topbar,
#nav-tabbar {
    z-index: 4;
}
#signin-view,
#store-view {
    z-index: 5;
}
#blocker-modal.fullscreen,
#blocker-modal.fullscreen-add,
#blocker-modal.fullscreen-remove,
#blocker-modal.fullscreen-add-active,
#blocker-modal.fullscreen-remove-active {
    z-index: 6;
}
#loading-modal,
#dialog-modal {
    z-index: 7;
}
#dialog-modal .sticky-header,
#dialog-modal .sticky-footer {
    z-index: 8;
}
#notify-modal {
    z-index: 9;
}
@media (max-width: 1199px) {
    #nav-panel {
        z-index: 10;
    }
}

/* Signin View */
#signin-view {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    -webkit-transition: opacity 0.35s ease-out;
    -moz-transition: opacity 0.35s ease-out;
    transition: opacity 0.35s ease-out;
}
#signin-view .centering-table {
    display: table;
    width: 100%;
    height: 100%;
}
#signin-view .centering-cell {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}
#signin-view .signin-container {
    max-width: 360px;
    margin: 0 auto 15px auto;
}
#signin-view .logo-container {
    padding: 0;
}
#signin-view .signin-logo {
    display: block;
    width: 100%;
    height: auto;
    padding: 0 15px 30px 15px;
    -webkit-transition: width 0.35s ease;
    -moz-transition: width 0.35s ease;
    transition: width 0.35s ease;
}
#signin-view .logo-container.account .signin-logo,
#signin-view .logo-container.register .signin-logo {
    width: 50%;
}
#signin-view .title-label {
    font-size: 21px;
    margin-bottom: 4px;
    opacity: 0;
}
#signin-view .instruct-label {
    margin-bottom: 15px;
    opacity: 0;
}
#signin-view .success-icon {
    font-size: 100px;
    line-height: 100px;
}
#signin-view .title-label,
#signin-view .instruct-label {
    -webkit-transition: opacity 0.35s ease-out;
    -moz-transition: opacity 0.35s ease-out;
    transition: opacity 0.35s ease-out;
}
#signin-view .collapse-group.show .title-label,
#signin-view .collapse-group.show .instruct-label {
    opacity: 1;
}
#signin-view .signin-busy {
    pointer-events: none;
}
#signin-view .signin-group .busy-ani,
#signin-view .register-group .busy-ani {
    color: white;
}
#signin-view .account-list {
    margin-bottom: 15px;
}
#signin-view .account-grid {
    border-top: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
}
#signin-view .account-button {
    height: 48px;
}
#signin-view .account-button:not(:last-child) {
    border-bottom: 1px solid #E5E5E5;
}
#signin-view .account-button .account-label,
#signin-view .account-button .busy-ani {
    font-size: 17px;
    font-weight: 500;
    line-height: 48px;
    color: #0A7AFF;
}
#signin-view button.busy .button-label,
#signin-view button:not(.busy) .busy-ani,
#signin-view .account-button.busy .account-label,
#signin-view .account-button:not(.busy) .busy-ani {
    display: none;
}
#signin-view .morelinks-container {
    color: #CCC;
    text-align: center;
}
#signin-view .version {
    position: absolute;
    bottom: 15px;
    left: 15px;
    font-size: 13px;
    line-height: 1;
    color: darkgray;
}
@media (min-width: 400px) {
    #signin-view .account-group .account-grid {
        border: 1px solid #E5E5E5;
        border-radius: 2px;
        margin-left: 0;
        margin-right: 0;
        overflow: hidden;
    }
}
@media (min-width: 1200px) {
    #signin-view {
        background: #FAFAFA;
    }
    #signin-view .signin-container {
        max-width: 400px;
        background: white;
        padding: 30px;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25);
        box-shadow: 0 1px 2px rgba(0,0,0,0.25);
    }
}

/* App View */
#app-view {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}
#app-view.loaded {
    -webkit-transition: opacity 0.35s ease-out 0.35s;
    -moz-transition: opacity 0.35s ease-out 0.35s;
    transition: opacity 0.35s ease-out 0.35s;
}
#app-view:not(.loaded) {
    opacity: 0;
}

/* Scroll View */
#scroll-view {
    position: absolute;
    top: 43px;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 0;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    -webkit-transition: background 0.35s ease;
    -moz-transition: background 0.35s ease;
    transition: background 0.35s ease;
}
#app-view.storeinfo #scroll-view {
    top: 100px;
}
#app-view.fullscreen #scroll-view {
    top: 0;
    /*bottom: 0;*/ /* Tab Bar */
}
@media (min-width: 768px) {
    #app-view:not(.fullscreen) #scroll-view {
        top: 56px;
    }
}
@media (min-width: 1200px) {
    #app-view:not(.fullscreen):not(.accountonly) #scroll-view {
        left: 240px;
    }
}

/* Content View */
#content-view {
    min-height: 100%;
}

/* Top Bar */
#nav-topbar {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 44px;
    border-width: 0 0 1px 0;
    border-style: solid;
    border-color: rgba(0,0,0,0.125);
    padding-left: 8px;
    /*padding-top: calc(0px + env(safe-area-inset-top));*/
}
#nav-topbar .nav-button {
    float: left;
    height: 44px;
    padding: 10px 5px;
    overflow: hidden;
}
#nav-topbar .nav-back {
    width: 34px;
}
#nav-topbar .nav-back.ng-hide-add,
#nav-topbar .nav-back.ng-hide-remove {
    -webkit-transition: width 0.15s ease;
    -moz-transition: width 0.15s ease;
    transition: width 0.15s ease;
}
#nav-topbar .nav-back.ng-hide {
    width: 0;
}
#nav-topbar .nav-menu {
    padding-right: 10px;
}
#nav-topbar .nav-title .nav-title-label {
    font-size: 19px;
    font-weight: 500;
    line-height: 44px;
    opacity: 0;
}
#nav-topbar .nav-title .nav-title-label.updated {
    opacity: 1;
    -webkit-transition: opacity 0.15s ease-out;
    -moz-transition: opacity 0.15s ease-out;
    transition: opacity 0.15s ease-out;
}
#nav-topbar .nav-title.dialog-title {
    padding: 0 15px;
}
#nav-topbar .nav-user {
    padding: 12px 15px 0 15px;
}
#nav-topbar .nav-user .user-icon {
    padding: 0 5px;
    cursor: pointer;
}
#nav-topbar .nav-user .user-icon i {
    font-size: 28px;
    line-height: 32px;
}
#nav-topbar .nav-user .user-name {
    font-size: 17px;
    font-weight: 500;
    line-height: 32px;
    padding-right: 10px;
    vertical-align: baseline;
    cursor: pointer;
}
#nav-topbar .nav-user .user-options {
    font-size: 13px;
    line-height: 24px;
    background: rgba(0,0,0,0.25);
    border-radius: 12px;
    padding: 0 12px;
}
/*#nav-topbar .nav-user .popover {
    max-width: none;
    background-color: rgba(0,0,0,0.25);
    border: 0px;
    border-radius: 2px;
}
#nav-topbar .nav-user .popover-body {
    height: 32px;
    padding: 5px 5px;
}
#nav-topbar .nav-user .popover-link {
    display: inline-block;
    font-size: 13px;
    line-height: 22px;
    color: white;
    padding: 0px 10px;
    cursor: pointer;
}
#nav-topbar .nav-user .popover-link:not(:last-child) {
    border-right: 1px solid rgba(0,0,0,0.25);
}
#nav-topbar .nav-user .popover .arrow {
    left: -8px;
}
#nav-topbar .nav-user .popover .arrow::after {
    border-right-color: transparent;
}*/
#nav-topbar .nav-user .signin-label {
    font-size: 17px;
    line-height: 32px;
    cursor: pointer;
}
#nav-topbar .nav-cart {
    float: right;
    height: 32px;
    text-align: center;
    vertical-align: top;
    padding: 4px 10px;
    border-radius: 18px;
    margin: 6px 6px 0 10px;
    cursor: pointer;
}
html.no-touch #nav-topbar .nav-cart:not(.active):hover {
    background: rgba(0,0,0,0.1);
}
#nav-topbar .nav-cart.active {
    background: rgba(0,0,0,0.25);
}
#nav-topbar .nav-cart .cart-items {
    display: inline-block;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    vertical-align: top;
}
#app-view.fullscreen #nav-topbar {
    display: none !important;
}
@media (max-width: 767px) {
    #nav-topbar .nav-title .nav-title-label {
        padding-right: 15px;
    }
}
@media (min-width: 768px) {
    #nav-topbar {
        height: 56px;
        padding-left: 10px;
    }
    #nav-topbar .nav-button {
        height: 56px;
        padding: 16px 5px;
    }
    #nav-topbar .nav-menu {
        padding-right: 15px;
    }
    #nav-topbar .nav-title .nav-title-label {
        line-height: 56px;
        padding-right: 365px;
    }
    #nav-topbar .nav-cart {
        margin: 12px 15px;
    }
}
@media (min-width: 1200px) {
    #nav-topbar {
        height: 56px;
        padding-left: 0px;
    }
    #nav-topbar .nav-title {
        padding: 10px 0 2px 15px;
    }
    #nav-topbar .nav-cart {
        margin: 12px 15px;
    }
}

/* Tab Bar */
#nav-tabbar {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 50px;
}
#nav-tabbar .tab-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 49px;
    justify-content: center;
    border-top: 1px solid rgba(0,0,0,0.125);
}
#nav-tabbar .tab-item {
    display: inline-block;
    -webkit-box-flex: 0;
    ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
    height: 49px;
    text-align: center;
    padding-top: 6px;
    cursor: default;
}
#nav-tabbar:not(.admin) .tab-item {
    ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}
#nav-tabbar:not(.admin) .tab-item.requires-admin {
    display: none;
}
#nav-tabbar .tab-icon {
    height: 24px;
    line-height: 24px;
}
#nav-tabbar .tab-text {
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
}
#nav-tabbar #tab-overflow.active {
    color: #333;
}
#app-view.fullscreen #nav-tabbar {
    display: none !important;
}
@media (min-width: 768px) {
    #nav-tabbar .tab-item {
        ms-flex: 0 0 14.28%;
        flex: 0 0 14.28%;
        max-width: 14.28%;
    }
}

/* More Menu */
#nav-overflowmenu {
    position: absolute;
    right: 0;
    bottom: 50px;
    left: 0;
    height: 0px;
    border-top: 1px solid rgba(0,0,0,0.1);
    overflow: hidden;
    -webkit-transition: height 0.25s ease;
    -moz-transition: height 0.25s ease;
    transition: height 0.25s ease;
}
#nav-overflowmenu.open {
    opacity: 1;
    -webkit-box-shadow: 0 -1px 2px rgba(0,0,0,0.2);
    box-shadow: 0 -1px 2px rgba(0,0,0,0.2);
}
#nav-overflowmenu:not(.open):not(.open-remove):not(.open-remove-active) {
    opacity: 0;
}
#nav-overflowmenu .overflowmenu-button {
    width: 100%;
    height: 48px;
    font-size: 17px;
    border-width: 0;
}
#nav-overflowmenu .overflowmenu-button:not(:last-child) {
    border-bottom: 1px solid rgba(0,0,0,0.25);
}

/* Nav Panel (Laptop/Desktop) */
#nav-panel {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 0px;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
#nav-panel .nav-logo,
#nav-panel .nav-user,
#nav-panel .nav-options {
    float: right;
    width: 240px;
}
#nav-panel .logo-img {
    width: 100%;
    height: auto;
    background: white;
    border-bottom: 1px solid #F2F2F2;
}
#nav-panel .nav-user {
    background: white;
    border-bottom: 1px solid #F2F2F2;
    padding: 15px 0;
}
#nav-panel .nav-user .user-options {
    height: 24px;
    font-size: 15px;
    line-height: 24px;
    background: rgba(0,0,0,0.05);
    border-radius: 12px;
    margin: 5px 25px;
}
#nav-panel .nav-options {
    padding: 15px 0;
}
#nav-panel .nav-item {
    height: 44px;
    padding: 0 25px;
    cursor: pointer;
}
#nav-panel:not(.admin) .nav-item.requires-admin {
    display: none;
}
#nav-panel .nav-item:hover {
    background: rgba(0,0,0,0.05);
}
#nav-panel .nav-icon {
    float: left;
    margin-right: 10px;
}
#nav-panel .nav-icon i {
    line-height: 44px;
}
#nav-panel .nav-user .nav-icon {
    margin-right: 4px;
    margin-left: -2px;
}
#nav-panel .nav-user .nav-icon i {
    font-size: 32px;
}
#nav-panel .nav-text {
    font-size: 15px;
    font-weight: 500;
    line-height: 44px;
}
@media (max-width: 1199px) {
    #nav-panel.open-add,
    #nav-panel.open-remove {
        -webkit-transition: width 0.25s ease;
        -moz-transition: width 0.25s ease;
        transition: width 0.25s ease;
    }
    #nav-panel.open,
    #nav-panel.open-add.open-add-active {
        width: 240px;
        -webkit-box-shadow: 1px 0 2px rgba(0,0,0,0.2);
        box-shadow: 1px 0 2px rgba(0,0,0,0.2);
    }
}
@media (min-width: 1200px) {
    #nav-panel {
        top: 56px;
        width: 240px;
        border-right: 1px solid rgba(0,0,0,0.1);
    }
    #app-view.fullscreen #nav-panel {
        display: none !important;
    }
}
@media (min-width: 1200px) and (max-height: 640px) {
    #nav-panel {
        padding-top: 15px;
    }
    #nav-panel .logo-container {
        display: none;
    }
}

/* Store Info */
#store-view {
    position: absolute;
    top: 44px;
    right: 0;
    left: 0;
    height: 56px;
    border-bottom: 1px solid rgba(0,0,0,0.125);
    overflow: hidden;
}
#store-view.open-add, #store-view.open-remove {
    -webkit-transition: height 0.25s ease-in-out;
    -moz-transition: height 0.25s ease-in-out;
    transition: height 0.25s ease-in-out;
}
#store-view.open, #store-view.open-add.open-add-active {
    height: 230px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
#store-view.open-remove.open-remove-active {
    height: 56px;
}
#store-view .store-compact-container {
    height: 55px;
    padding: 12px 15px 0 15px;
    opacity: 1;
    overflow: hidden;
    cursor: pointer;
}
#store-view .store-compact-container.open-remove {
    -webkit-transition: opacity 0.15s ease-out 0.25s;
    -moz-transition: opacity 0.15s ease-out 0.25s;
    transition: opacity 0.15s ease-out 0.25s;
}
#store-view .store-compact-container.open,
#store-view .store-compact-container.open-add.open-add-active {
    height: 0;
    opacity: 0;
    padding: 0;
}
#store-view .store-compact-container.open-remove.open-remove-active {
    height: 55px;
    opacity: 1;
}
#store-view .store-compact-container .storeinfo-text {
    font-size: 13px;
}
#store-view .store-compact-container .store-icon i {
    font-size: 32px;
    line-height: 32px;
    margin-right: 5px;
}
#store-view .store-compact-container .store-label {
    font-weight: 700;
    line-height: 16px;
}
#store-view .store-compact-container .user-label,
#store-view .store-compact-container .job-label {
    line-height: 16px;
}
#store-view .store-compact-container .expand-icon {
    position: absolute;
    top: 7px;
    right: 10px;
}
#store-view .store-detail-container {
    opacity: 0;
}
#store-view .store-detail-container.open-add {
    -webkit-transition: opacity 0.15s ease-out 0.25s;
    -moz-transition: opacity 0.15s ease-out 0.25s;
    transition: opacity 0.15s ease-out 0.25s;
}
#store-view .store-detail-container.open, #store-view .store-detail-container.open-add.open-add-active {
    opacity: 1;
}
#store-view .store-detail-container.open-remove.open-remove-active {
    opacity: 0;
}
#store-view .store-detail-container .rollout-label {
    font-size: 13px;
    font-weight: 400;
    line-height: 1em;
    padding: 12px 12px 8px 12px;
}
#store-view .store-detail-container .select-control {
    background: rgba(0,0,0,0.25);
}
#store-view .store-detail-container .select-control.disabled {
    background: rgba(0,0,0,0.15);
}
#store-view .store-detail-container .select-control select {
    font-size: 17px;
    background: none;
    border: 0;
}
#store-view .store-detail-container .display-control {
    height: 40px;
    background: rgba(0,0,0,0.15);
    border-radius: 2px;
}
#store-view .store-detail-container .display-label {
    font-size: 17px;
    line-height: 40px;
    background: none;
    padding: 0 15px;
    border: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#store-view .store-detail-container .store-links {
    padding-left: 6px;
}
#store-view .store-detail-container .store-link {
    display: inline-block;
    font-size: 15px;
    padding: 12px 6px;
    cursor: pointer;
}
#store-view .store-detail-container .store-link .store-link-icon {
    float: left;
    margin-right: 4px;
}
#store-view .store-detail-container .store-link .store-link-text {
    display: inline-block;
    line-height: 24px;
}
#store-view .store-detail-container #store-close-button {
    width: 100%;
    height: 40px;
    text-align: center;
    cursor: pointer;
}
#store-view .store-detail-container #store-close-button .collapse-icon {
    line-height: 40px;
}
#app-view:not(.storeinfo) #store-view {
    display: none;
}
#app-view.fullscreen #store-view {
    display: none !important;
}
@media (max-width: 359px) {
    #store-view .store-detail-container .store-link {
        font-size: 13px;
    }
    #store-view .store-detail-container .store-link .store-link-icon {
        font-size: 20px;
    }
    #store-view .store-detail-container .store-link .store-link-text {
        line-height: 20px;
    }
}
@media (min-width: 768px) {
    #app-view:not(.storeinfo) #store-view {
        display: block;
    }
    #store-view {
        top: 0;
        right: 15px;
        left: auto;
        width: 350px;
        border-right: 1px solid rgba(0,0,0,0.125);
        border-left: 1px solid rgba(0,0,0,0.125);
        border-radius: 0 0 2px 2px;
    }
    #store-view.cart-sm {
        right: 85px;
    }
    #store-view.cart-md {
        right: 95px;
    }
    #store-view.cart-lg {
        right: 105px;
    }
    #store-view .store-detail {
        padding-right: 20px;
        padding-left: 20px;
    }
    #store-view .store-detail-container .store-link {
        font-size: 14px;
    }
}

/* Load More */
.loadmore-button {
    font-weight: 500;
    text-align: center;
    vertical-align: baseline;
    color: #0A7AFF;
    cursor: pointer;
}
.loadmore-button .loadmore-label,
.loadmore-button .loadmore-icon {
    line-height: 44px;
    vertical-align: top;
    margin-right: 4px;
}
.loadmore-button.busy {
    line-height: 44px;
    color: #AAAAAA;
    pointer-events: none;
}
.loadmore-button .busy-ani {
    font-size: 24px;
}
.loadmore-button.busy .loadmore-label,
.loadmore-button:not(.busy) .busy-ani {
    display: none;
}
@media (max-width: 767px) {
    .loadmore-button {
        border-bottom: 1px solid #E5E5E5;
    }
}
@media (min-width: 768px) {
    .loadmore {
        padding: 15px;
    }
    .loadmore-button {
        background: white;
        border-radius: 2px;
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    }
}

/* Barcode Scan Button */
.barcode-scan-button {
    height: 35px;
    padding: 2px;
    margin-left: 12px;
}
.barcode-scan-button .scan-icon {
    width: 32px;
    height: 32px;
}

/* Interaction Blocker */
#blocker-modal {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    opacity: 0;
    cursor: default;
}
#blocker-modal.show-add {
    -webkit-transition: opacity 0.25s ease-out;
    -moz-transition: opacity 0.25s ease-out;
    transition: opacity 0.25s ease-out;
}
#blocker-modal.show-remove {
    -webkit-transition: opacity 0.25s ease-in;
    -moz-transition: opacity 0.25s ease-in;
    transition: opacity 0.25s ease-in;
}
#blocker-modal.show,
#blocker-modal.show-add.show-add-active {
    bottom: 0;
    opacity: 1;
}
#blocker-modal.show-remove.show-remove-active {
    bottom: 0;
}
#blocker-modal:not(.show) {
    pointer-events: none;
}
#blocker-modal:not(.invisible) {
    background: rgba(25,25,25,0.6);
}

/* Loading Modal */
#loading-modal,
#preload-modal {
    position: absolute;
    top: 44px;
    right: 0;
    bottom: 0;
    /*bottom: 50px;*/ /* Tab Bar */
    left: 0;
    opacity: 1;
    pointer-events: none;
}
#preload-modal {
    position: fixed;
    top: 0;
    /*bottom: 0;*/ /* Tab Bar */
}
#loading-modal.ng-hide-remove,
#preload-modal.ng-hide-remove {
    -webkit-transition: opacity 0.35s ease-out 0.25s;
    -moz-transition: opacity 0.35s ease-out 0.25s;
    transition: opacity 0.35s ease-out 0.25s;
}
#loading-modal.ng-hide,
#preload-modal.ng-hide {
    opacity: 0;
}
#app-view.storeinfo #loading-modal {
    top: 100px;
}
#app-view.fullscreen #loading-modal {
    top: 0;
    /*bottom: 0;*/ /* Tab Bar */
}
.loading-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
@media (min-width: 768px) {
    #app-view:not(.fullscreen) #loading-modal {
        top: 56px;
    }
}
@media (min-width: 1200px) {
    #app-view:not(.fullscreen):not(.accountonly) #loading-modal {
        left: 240px;
    }
}

/* Ghosted Content (Loading/Busy) */
.busy-ghosted,
.busy-ghosted.busy-ghosted-add.busy-ghosted-add-active {
    opacity: 0.5;
    pointer-events: none;
}
.busy-ghosted.busy-ghosted-add {
    opacity: 1;
    -webkit-transition: opacity 0.35s ease-out 0.25s;
    -moz-transition: opacity 0.35s ease-out 0.25s;
    transition: opacity 0.35s ease-out 0.25s;
}

/* Busy Indicator */
@keyframes busy-ani {
    0% {
        opacity: .2;
    }
    20% {
        opacity: 1;
    }
    100% {
        opacity: .2;
    }
}
.busy-ani {
    color: #0A7AFF;
}
.busy-ani span {
    animation-name: busy-ani;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-fill-mode: both;
}
.busy-ani span:nth-child(2) {
    animation-delay: .2s;
}
.busy-ani span:nth-child(3) {
    animation-delay: .4s;
}

/* Page Headers */
.header-panel {
    min-height: 60px;
    background: #FAFAFA;
    border-bottom: 1px solid #E5E5E5;
}
.header-panel .desktop-title {
    font-size: 21px;
    padding-top: 20px;
}
.header-panel .search {
    width: 100%;
    position: relative;
    margin-top: 13px;
}
.header-panel .search::after {
    content: '\E8B6';
    font-family: 'Material Icons';
    position: absolute;
    top: 6px;
    left: 10px;
    font-size: 24px;
    line-height: 24px;
    pointer-events: none;
    color: #AAA;
}
.header-panel .search .search-input {
    height: 35px !important;
    font-size: 15px;
    background: rgba(0,0,0,0.06);
    color: #0A7AFF;
    padding-left: 38px;
    border: none;
    border-radius: 18px;
}
.header-panel .breadcrumb {
    height: 30px;
    line-height: 30px;
    font-size: 15px;
    padding: 0px;
    margin-top: 20px;
    margin-bottom: 0px;
    background: none;
}
.header-panel .breadcrumb-item.mobile {
    padding: 10px 0;
}
.header-panel .breadcrumb .breadcrumb-item.active-title {
    font-size: 21px;
    color: #222224;
}
.header-panel .breadcrumb .breadcrumb-item.alone::before {
    display: none;
}
.header-panel .breadcrumb .breadcrumb-label {
    line-height: 30px;
    vertical-align: middle;
}
.header-panel .breadcrumb .breadcrumb-icon {
    width: 18px;
    height: 30px;
    line-height: 30px;
    vertical-align: middle;
}
@media (min-width: 1200px) {
    .header-panel {
        background: white;
    }
    .header-panel .search {
        float: right;
        max-width: 320px;
    }
}

/* Promo Banners */
.promo-banner {
    display: block;
}
.promo-banner .promo-img {
    display: block;
    width: 100%;
    height: auto;
    cursor: pointer;
}
@media (max-width: 767px) {
    .promo-banner {
        border-bottom: 1px solid #E5E5E5;
    }
}
@media (min-width: 576px) {
    .promo-banner {
        padding: 15px;
    }
    .promo-banner .promo-img {
        max-width: 480px;
        border: 1px solid #CECECF;
        margin: 0 auto;
    }
    html.no-touch .promo-banner .promo-img:hover {
        border-color: #0A7AFF;
    }
}
@media (min-width: 768px) {
    .promo-banner {
        padding: 0 0 15px 0;
    }
}

/* Dialog */
#dialog-modal {
    position: absolute;
    top: 44px;
    right: 0;
    bottom: 0;
    left: 0;
}
#dialog-modal:not(.show) {
    height: 0;
    padding: 0;
    opacity: 0;
    overflow: hidden;
}
#dialog-modal.show {
    opacity: 1;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
#dialog-modal .x-close-button {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 50px;
    padding: 13px;
    cursor: pointer;
}
html.no-touch #dialog-modal .x-close-button:hover {
    color: #0A7AFF;
}
.dialog-content {
    display: none;
}
#dialog-modal .dialog-content {
    display: block;
    height: 100%;
    opacity: 0;
}
#dialog-modal.show .dialog-content {
    opacity: 1;
    -webkit-transition: opacity 0.25s ease-out;
    -moz-transition: opacity 0.25s ease-out;
    transition: opacity 0.25s ease-out;
}
#nav-topbar .dialog-title {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding-right: 0px;
}
#nav-topbar .dialog-title .close-button {
    float: right;
    width: 44px;
    height: 44px;
    padding: 10px 12px 10px 8px;
}
#blocker-modal.dialog {
    top: 44px;
    opacity: 0;
}
@media (max-width: 575px) {
    #dialog-modal {
        background: white;
    }
    #dialog-modal.dark {
        background: #424244;
    }
}
@media (min-width: 576px) {
    #dialog-modal {
        top: 0;
        padding: 15px;
    }
    #dialog-modal .dialog-content {
        height: auto;
        background: white;
        border-radius: 2px;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.25);
        box-shadow: 0 1px 2px rgba(0,0,0,0.25);
        transform: scale(0.9);
    }
    #dialog-modal.dark .dialog-content {
        background: #424244;
    }
    #dialog-modal.show .dialog-content {
        transform: scale(1);
        -webkit-transition: transform 0.25s ease, opacity 0.25s ease-out;
        -moz-transition: transform 0.25s ease, opacity 0.25s ease-out;
        transition: transform 0.25s ease, opacity 0.25s ease-out;
    }
    #dialog-modal .max-xl {
        max-width: 1140px;
    }
    #dialog-modal .max-lg {
        max-width: 960px;
    }
    #dialog-modal .max-md {
        max-width: 720px;
    }
    #dialog-modal .max-sm {
        max-width: 540px;
    }
    #blocker-modal.dialog {
        top: 0;
        opacity: 1;
    }
}

/* Change Password Dialog */
.dialog-password .dialog-title {
    padding-top: 25px;
}
.dialog-password .success-row.ng-hide,
.dialog-password .success-row.ng-hide-add.ng-hide-add-active {
    opacity: 0;
}
.dialog-password .success-row:not(.ng-hide),
.dialog-password .success-row.ng-hide-remove.ng-hide-remove-active {
    opacity: 1;
    -webkit-transition: opacity 0.15s ease-out 0.25s;
    -moz-transition: opacity 0.15s ease-out 0.25s;
    transition: opacity 0.15s ease-out 0.25s;
}
.dialog-password .success-group {
    padding-top: 20px;
}
.dialog-password .success-icon {
    font-size: 100px;
    line-height: 100px;
}
.dialog-password .success-message {
    padding-top: 20px;
}
@media (min-width: 576px) {
    .dialog-password .collapse-group {
        height: 480px;
        -webkit-transition: height 0.25s ease-in-out;
        -moz-transition: height 0.25s ease-in-out;
        transition: height 0.25s ease-in-out;
    }
    .dialog-password .collapse-group.success {
        height: 260px;
    }
    .dialog-password .padded-row {
        padding-right: 15px;
        padding-left: 15px;
    }
    .dialog-password .card {
        margin-right: 15px;
        margin-left: 15px;
    }
}

/* Terms and Conditions Dialog */
@media (min-width: 768px) {
    .dialog-terms .terms-copy {
        padding-right: 15px;
        padding-left: 15px;
    }
}

/* Signature Dialog */
.dialog-signature #canvasWrapper {
    background-color: white;
}
.dialog-signature canvas {
    position: relative;
    display: block;
}

/* User Dialog */
.dialog-user .dialog-title {
    padding-top: 25px;
}
.dialog-user .success-row.ng-hide,
.dialog-user .success-row.ng-hide-add.ng-hide-add-active {
    opacity: 0;
}
.dialog-user .success-row:not(.ng-hide),
.dialog-user .success-row.ng-hide-remove.ng-hide-remove-active {
    opacity: 1;
    -webkit-transition: opacity 0.15s ease-out 0.25s;
    -moz-transition: opacity 0.15s ease-out 0.25s;
    transition: opacity 0.15s ease-out 0.25s;
}
.dialog-user .success-group {
    padding-top: 20px;
}
.dialog-user .success-icon {
    font-size: 100px;
    line-height: 100px;
}
.dialog-user .success-message {
    padding-top: 20px;
}
.dialog-user .job-group {
    opacity: 0;
}
.dialog-user .job-list.show .job-group {
    opacity: 1;
    -webkit-transition: opacity 0.15s ease;
    -moz-transition: opacity 0.15s ease;
    transition: opacity 0.15s ease;
}
@media (min-width: 576px) {
    .dialog-user .padded-row {
        padding-right: 15px;
        padding-left: 15px;
    }
}

/* Notifications */
#notify-modal {
    position: fixed;
    top: -100px;
    right: 0;
    left: 0;
    padding: 56px 15px 15px 15px;
    pointer-events: none;
    -webkit-transition: top 0.35s ease;
    -moz-transition: top 0.35s ease;
    transition: top 0.35s ease;
}
#notify-modal.show {
    top: 0px;
}
@media (min-width: 1200px) {
    #notify-modal {
        padding-top: 15px;
    }
}
#notify-modal .notify-panel {
    width: 100%;
    max-width: 320px;
    color: white;
    background-color: rgba(64,64,64,0.9);
    backdrop-filter: blur(5px);
    border-radius: 2px;
    padding: 20px;
    margin: 0 auto;
    pointer-events: initial;
    opacity: 0;
    -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.25);
    box-shadow: 0 3px 6px rgba(0,0,0,0.25);
    -webkit-transition: opacity 0.35s ease;
    -moz-transition: opacity 0.35s ease;
    transition: opacity 0.35s ease;
}
#notify-modal .notify-panel.show {
    opacity: 1;
}
#notify-modal:not(.show):not(.show-remove),
#notify-modal .notify-panel:not(.show):not(.show-remove) {
    height: 0;
    padding: 0;
    overflow: hidden;
}
#notify-modal .notify-icon {
    float: left;
    padding-right: 15px;
}
#notify-modal .icon-content {
    position: relative;
    width: 24px;
    height: 24px;
    background-color: white;
    border-radius: 12px;
    margin: 4px;
}
#notify-modal .icon-content::after {
    font-family: 'Material Icons';
    position: absolute;
    top: -4px;
    left: -4px;
    line-height: 32px;
    height: 32px;
    font-size: 32px;
}
#notify-modal .notify-panel.info .icon-content::after {
    content: '\E88E';
    color: #448AFF;
}
#notify-modal .notify-panel.success .icon-content::after {
    content: '\E86C';
    color: #4CAF50;
}
#notify-modal .notify-panel.warning .icon-content::after {
    content: '\E000';
    color: #FF9100;
}
#notify-modal .notify-panel.error .icon-content::after {
    content: '\E000';
    color: #D32F2F;
}
#notify-modal .notify-message {
    color: #CCC;
    overflow: hidden;
    white-space: pre-line;
}
#notify-modal .notify-title {
    color: white;
    font-weight: 500;
}

/* List - General */
.no-items {
    text-align: center;
    color: gray;
    padding: 30px 0;
}

/* List Buttons, Headers, Footers */
.list-button {
    cursor: pointer;
}
.list-button.open .open-hide,
.list-button:not(.open) .open-show {
    display: none;
}
.list-button .context-icon {
    position: absolute;
    top: 10px;
    right: 10px;
}
html.no-touch .list-button:not(.open):hover {
    background: #FCFCFC;
}
.list-header,
.list-footer {
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    background: white;
    color: gray;
    padding-top: 20px;
    padding-bottom: 8px;
    border-bottom: 1px solid #E5E5E5;
}
.list-header.row,
.list-footer.row {
    padding-left: 15px;
    padding-right: 15px;
}
.list-header-icon {
    vertical-align: top;
    margin-top: -1px;
    margin-right: 2px;
}
.list-header-label {
    display: inline-block;
    line-height: 24px;
}
.list-header.rejected,
.list-footer.rejected {
    color: #D50000;
    border-bottom: 2px solid #D50000;
}
.list-header.pending,
.list-footer.pending {
    color: #FB8C00;
    border-bottom: 2px solid #FB8C00;
}
.list-header.active,
.list-footer.active {
    color: #4CAF50;
    border-bottom: 2px solid #4CAF50;
}
.list-header.info,
.list-footer.info {
    color: #1E88E5;
    border-bottom: 2px solid #1E88E5;
}

/* Item Categories */
.route-shop {
    background: #F5F5F5;
}
#shop-catlist .list-title {
    font-size: 25px;
    font-weight: 500;
    padding-left: 15px;
    margin-bottom: 10px;
}
#shop-catlist .list-grid {
    background: white;
}
#shop-catlist .category-button:not(:last-child) {
    border-bottom: 1px solid #E5E5E5;
}
#shop-catlist .category-button .category-label {
    font-size: 17px;
    font-weight: 500;
    line-height: 44px;
}
#shop-catlist .category-button .list-icon {
    float: left;
    line-height: 44px;
    margin-right: 8px;
}
#shop-catlist .category-button.favorites .list-icon {
    color: orange;
}
@media (min-width: 768px) {
    #shop-catlist .list-grid {
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
        border-radius: 2px;
        margin-right: 0;
        margin-left: 0;
    }
    #shop-catlist .category-button:last-child {
        border-bottom: 0px;
    }
}
@media (min-width: 1200px) {
    #shop-catlist .category-button .category-label,
    #shop-catlist .category-button .list-icon {
        line-height: 40px;
    }
}

/* Items - General */
.item-button {
    min-height: 70px;
    padding: 0;
    border-bottom: 1px solid #E5E5E5;
}
.item-button .item-panel {
    position: relative;
    height: 70px;
}
.item-button .item-image {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 60px;
    height: 60px;
    color: white;
    background-size: contain !important;
    border: 0;
}
.item-button .item-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.item-button .item-detail {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 71px;
    padding: 15px 15px 15px 10px;
}
.item-button .title-label {
    height: 16px;
    font-size: 15px;
    font-weight: 500;
    line-height: 16px;
}
.item-button .description-price {
    height: 13px;
    font-size: 14px;
    line-height: 14px;
    color: #DD2C00;
    margin-right: 10px;
}
.item-button .description-qty {
    float: right;
    height: 13px;
    font-size: 14px;
    line-height: 14px;
}
.item-button .description-price .grouping {
    font-size: 10px;
}
.item-button .sale-tag {
    float: left;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: white;
    background: #EF6C00;
    border-radius: 2px;
    padding: 0px 4px;
    margin-top: -1px;
    margin-right: 5px;
}

/* Rollout (General) */
.lookup-rollout.open-add,
.lookup-rollout.open-remove,
.lookup-rollout.show-add,
.lookup-rollout.show-remove {
    -webkit-transition: height 0.25s ease-in-out;
    -moz-transition: height 0.25s ease-in-out;
    transition: height 0.25s ease-in-out;
}
.lookup-rollout .lookup-display.open-remove,
.lookup-rollout .lookup-panel.open-add {
    -webkit-transition: opacity 0.15s ease-out 0.25s;
    -moz-transition: opacity 0.15s ease-out 0.25s;
    transition: opacity 0.15s ease-out 0.25s;
}
.lookup-rollout .lookup-display.open,
.lookup-rollout .lookup-display.open-add.open-add-active,
.lookup-rollout .lookup-panel:not(.open),
.lookup-rollout .lookup-panel.open-remove.open-remove-active {
    height: 0;
    padding: 0;
    opacity: 0;
}
.lookup-rollout .lookup-display:not(.open),
.lookup-rollout .lookup-display.open-remove.open-remove-active,
.lookup-rollout .lookup-panel.open,
.lookup-rollout .lookup-panel.open-add.open-add-active {
    opacity: 1;
}

/* Cart */
#cart .item-button {
    min-height: 70px;
    overflow: hidden;
}
#cart .item-button:last-child {
    border-bottom: none;
}
#cart .item-button.removing {
    pointer-events: none;
}
#cart .item-button .item-detail-desktop {
    padding: 15px;
}
#cart .item-button .item-detail-mobile {
    position: initial;
    width: 100%;
    height: 70px;
    background: white;
    padding-left: 80px;
}
#cart .item-button .item-detail-mobile.no-click .context-icon {
    opacity: 0.5;
}
#cart .item-button .item-controls-mobile {
    background: #FAFAFA;
    box-shadow: inset 0 1px 4px rgba(0,0,0,0.1);
    margin: 0;
}
#cart .item-button .item-controls-desktop .qty-group {
    max-width: 215px;
}
#cart .item-button .item-controls-desktop.no-click {
    opacity: 0.5;
}
#cart .item-button .purchasing-control {
    padding-top: 12px;
    padding-bottom: 12px;
}
#cart .item-button .purchasing-control .qty-label {
    text-align: right;
    line-height: 40px;
    padding: 0px 4px 0px 0px;
}
#cart .item-button .qty-input {
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    color: #0A7AFF;
}
#cart .item-button .qty-button {
    width: 40px;
    vertical-align: top;
}
#cart .item-button .qty-button i {
    line-height: 38px;
}
#cart .item-button .remqty-button {
    padding: 0px 7px 0px 9px;
    border-radius: 20px 0px 0px 20px;
}
#cart .item-button .addqty-button {
    padding: 0px 9px 0px 7px;
    border-radius: 0px 20px 20px 0px;
}
#cart .item-button .qty-buttons.qty-changed .qty-delete-button,
#cart .item-button .qty-buttons:not(.qty-changed) .qty-update-button {
    display: none;
}
#cart .item-button .control-group.collapsing {
    -webkit-transition-duration: 0.25s;
    -moz-transition-duration: 0.25s;
    transition-duration: 0.25s;
}
#cart .subtotal-footer {
    min-height: 48px;
    background: rgba(255,255,255,0.9);
    backdrop-filter: blur(5px);
    border-top: 1px solid #E5E5E5;
    padding-top: 15px;
    padding-bottom: 10px;
}
#cart .checkout-card .card-body {
    padding: 15px;
}
#cart .subtotal-footer .subtotal-amount {
    font-size: 19px;
    font-weight: 500;
}
@media (max-width: 767px) {
    #cart .subtotal-footer .subtotal-label {
        float: left;
        padding-top: 4px;
    }
    #cart .checkout-card {
        background: none;
        border: none;
        border-radius: 0;
    }
    #cart .checkout-card .card-body {
        padding: 0;
    }
}
@media (max-width: 991px) {
    #cart .item-button.open .description-price.cart-price,
    #cart .item-button.open:not(.hide-qoh) .description-qty .text-qic,
    #cart .item-button:not(.open) .description-price.base-price,
    #cart .item-button:not(.open) .description-qty .text-qoh,
    #cart .item-button:not(.open) .description-qty .text-no-qoh {
        display: none;
    }
    #cart .item-button .title-label {
        margin-right: 25px;
    }
    #cart .item-button .qty-button {
        background: white;
    }
    #cart .checkout {
        padding-top: 15px;
    }
}
@media (min-width: 768px) {
    .route-cart {
        background: #F5F5F5;
    }
    #cart .header-panel .subtotal {
        height: 35px;
        line-height: 35px;
        border-radius: 2px;
        margin-top: 13px;
        margin-right: 15px;
    }
    #cart .header-panel .subtotal-label {
        margin-right: 4px;
    }
    #cart .header-panel .subtotal-amount {
        font-size: 19px;
        font-weight: 500;
    }
    #cart .header-panel .checkout-button {
        margin-top: 13px;
    }
    #cart .list-grid {
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
        margin-left: 0;
        margin-right: 0;
    }
    #cart .item-button {
        height: 150px;
        background: white;
    }
    #cart .item-button .item-image {
        position: absolute;
        width: 120px;
        height: 120px;
        top: 15px;
        left: 15px;
    }
    #cart .item-button .description {
        padding-left: 135px;
    }
    #cart .item-button .description .title-label {
        height: auto;
        font-size: 17px;
        line-height: 20px;
    }
    #cart .item-button .description-price {
        height: auto;
        font-size: 15px;
        line-height: 20px;
        margin: 0;
    }
    #cart .item-button .description-price.text-base-price {
        float: none;
    }
    #cart .item-button .description-price:not(.text-base-price) {
        font-size: 17px;
        font-weight: 500;
    }
    #cart .item-button .qty-input {
        font-size: 17px;
    }
    #cart .item-controls-desktop {
        padding-top: 5px;
    }
    #cart .item-controls-desktop .qty-delete-button {
        color: #D50000;
    }
    #cart .subtotal-footer .subtotal-amount {
        margin-right: 15px;
    }
    #cart .checkout {
        padding: 20px 10px;
    }
}

/* Checkout */
#checkout .checkout-content {
    padding-top: 15px;
}
#checkout .terms-link {
    margin-left: 10px;
}
#checkout .radio-control,
#checkout .checkbox-control {
    border: none;
}
#checkout #deposit-input:not(.ng-empty) {
    text-align: right;
}
@media (max-width: 575px) {
    #checkout .form-message {
        text-align: center;
    }
}
@media (min-width: 1200px) {
    #checkout .header-panel .desktop-subtotal {
        padding-top: 20px;
    }
    #checkout .header-panel .subtotal-label {
        margin-right: 5px;
    }
    #checkout .header-panel .subtotal-amount {
        font-size: 21px;
        font-weight: 500;
    }
    #checkout .checkout-content {
        padding-top: 25px;
        padding-bottom: 15px;
    }
    #checkout .checkout-group {
        max-width: 320px;
    }
    #checkout .checkout-group.deposit {
        max-width: 480px;
    }
}

/* Shop - Item List */
.route-shop-group,
.route-shop-section,
.route-shop-search,
.route-shop-group-search,
.route-shop-section-search {
    background: #F5F5F5;
}
#shop-itemlist .list-grid {
    background: white;
}
#shop-itemlist .item-button .item-detail {
    height: 70px;
}
#shop-itemlist .item-button.favorite .item-panel::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 20px;
    border-right-color: orange;
    border-top-color: orange;
}
#shop-itemlist .item-button.favorite .item-panel::after {
    content: '\E838';
    position: absolute;
    top: 0;
    right: 0;
    width: 24px;
    font-family: 'Material Icons';
    font-size: 22px;
    line-height: 24px;
    text-align: center;
    color: white;
}
@media (min-width: 360px) {
    #shop-itemlist .item-button .item-panel {
        height: 96px;
    }
    #shop-itemlist .item-button .item-detail {
        height: 96px;
    }
    #shop-itemlist .item-button .item-image {
        width: 86px;
        height: 86px;
    }
    #shop-itemlist .item-button .item-detail {
        left: 96px;
        height: 96px;
        padding: 15px 15px 15px 10px;
    }
    #shop-itemlist .item-button .title-label {
        height: 36px;
        line-height: 18px;
        white-space: normal;
    }
}
@media (min-width: 768px) {
    #shop-itemlist .list-grid {
        background: none;
        padding: 0 11px;
    }
    #shop-itemlist .item-button {
        border-bottom: none;
    }
    #shop-itemlist .item-panel {
        height: 96px;
        background: white;
        border-radius: 2px;
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
        margin: 4px;
    }
    #shop-itemlist .item-image {
        border-radius: 2px 0 0 2px;
    }
    #shop-itemlist .item-button:hover {
        background: none;
    }
    #shop-itemlist .item-button.ng-enter {
        padding-top: 10px;
        opacity: 0;
        -webkit-transition: padding-top 0.3s ease-out, opacity 0.3s ease-out;
        -moz-transition: padding-top 0.3s ease-out, opacity 0.3s ease-out;
        transition: padding-top 0.3s ease-out, opacity 0.3s ease-out;
    }
    #shop-itemlist .item-button.ng-enter-stagger {
        -webkit-transition-delay: 0.05s;
        -moz-transition-delay: 0.05s;
        transition-delay: 0.05s;
    }
    #shop-itemlist .item-button.ng-enter.ng-enter-active {
        padding-top: 0;
        opacity: 1;
    }
}
@media (min-width: 1200px) {
    #shop-itemlist {
        padding: 0;
    }
    #shop-itemlist .list-grid {
        max-width: 924px;
        padding: 0;
        margin: auto;
    }
    #shop-itemlist .item-button {
        width: 231px;
        max-width: none;
        -webkit-box-flex: unset;
        flex: none;
    }
    #shop-itemlist .item-button .item-panel {
        width: 215px;
        height: 245px;
        margin: 8px;
    }
    #shop-itemlist .item-button .item-image {
        top: 12px;
        left: 12px;
        width: 191px;
        height: 145px;
        border-radius: 2px 2px 0 0;
    }
    #shop-itemlist .item-button .item-detail {
        top: 160px;
        left: 0;
        height: 85px;
        padding: 10px 12px 12px 12px;
    }
    #shop-itemlist .item-button .title-label {
        height: 36px;
        line-height: 18px;
        white-space: normal;
    }
    #shop-itemlist .item-button .sale-tag {
        float: right;
        margin-top: 1px;
    }
}
@media (min-width: 1431px) { /* 5 wide */
    #shop-itemlist .list-grid {
        max-width: 1155px;
    }
}
@media (min-width: 1662px) { /* 6 wide */
    #shop-itemlist .list-grid {
        max-width: 1386px;
    }
}
@media (min-width: 1893px) { /* 7 wide */
    #shop-itemlist .list-grid {
        max-width: 1617px;
    }
}
@media (min-width: 2124px) { /* 8 wide */
    #shop-itemlist .list-grid {
        max-width: 1848px;
    }
}
@media (min-width: 2355px) { /* 9 wide */
    #shop-itemlist .list-grid {
        max-width: 2079px;
    }
}
@media (min-width: 2586px) { /* 10 wide */
    #shop-itemlist .list-grid {
        max-width: 2310px;
    }
}
@media (min-width: 2817px) { /* 11 wide */
    #shop-itemlist .list-grid {
        max-width: 2541px;
    }
}
@media (min-width: 3048px) { /* 12 wide */
    #shop-itemlist .list-grid {
        max-width: 2772px;
    }
}

/* Shop - Item Detail Dialog */
.itemdetail-content .breadcrumb {
    line-height: 15px;
    background-color: inherit;
    padding: 0;
}
.itemdetail-content .desc-label {
    font-size: 21px;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 6px;
}
.itemdetail-content .item-label {
    color: gray;
    margin-bottom: 12px;
}
.itemdetail-content .price-label {
    font-size: 19px;
    line-height: 17px;
    color: #0066C0;
}
.itemdetail-content .price-label .grouping {
    font-size: 13px;
}
.itemdetail-content .price-label .sale-tag {
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    color: white;
    background: #EF6C00;
    border-radius: 2px;
    padding: 1px 4px;
    margin-right: 2px;
}
.itemdetail-content .item-image {
    min-height: 180px;
    text-align: center;
    padding: 15px 0;
}
.itemdetail-content .item-image .item-img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 500px;
}
.itemdetail-content .qty-input {
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    color: #0A7AFF;
}
.itemdetail-content .qty-input.ng-invalid {
    color: #D50000;
}
.itemdetail-content .qty-button {
    width: 40px;
    vertical-align: top;
}
.itemdetail-content .qty-button i {
    line-height: 38px;
}
.itemdetail-content .remqty-button {
    padding: 0px 7px 0px 9px;
    border-radius: 20px 0px 0px 20px;
}
.itemdetail-content .addqty-button {
    padding: 0px 9px 0px 7px;
    border-radius: 0px 20px 20px 0px;
}
.itemdetail-content .col-qic {
    margin-top: -5px;
}
@media (max-width: 767px) {
    #shop-itemdetail .header-panel {
        min-height: 50px;
        background: none;
        border: none;
    }
    #shop-itemdetail .header-panel .breadcrumb {
        margin-top: 12px;
    }
    .itemdetail-content .cart-card {
        margin-bottom: 15px;
    }
}
@media (min-width: 576px) {
    .itemdetail-content .dialog-row {
        padding: 25px 10px;
    }
    .itemdetail-content .item-image {
        padding: 15px;
    }
}
@media (min-width: 768px) {
    .dialog-itemdetail .cart-card {
        margin-top: 30px;
    }
    #shop-itemdetail .item-details {
        padding: 15px 30px;
    }
    .itemdetail-content .item-image {
        padding: 15px 15px 5px 15px;
    }
    #shop-itemdetail .itemdetail-content {
        padding-top: 15px;
        padding-bottom: 15px;
    }
}
@media (min-width: 992px) {
    #shop-itemdetail .itemdetail-content {
        padding-top: 15px;
    }
}
@media (min-width: 1200px) {
    #shop-itemdetail .itemdetail-content {
        padding-bottom: 20px;
    }
}

/* Orders - Order List */
.route-orders,
.route-quotes {
    background: #F5F5F5;
}
#orders-orderlist .list-grid {
    background: white;
}
#orders-orderlist .order-button {
    position: relative;
    padding-top: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #E5E5E5;
}
#orders-orderlist .order-button .order-datetime {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 13px;
    font-weight: 500;
    line-height: 16px;
    opacity: 0.5;
}
#orders-orderlist .order-button .order-number {
    font-size: 17px;
    font-weight: 700;
    line-height: 22px;
}
#orders-orderlist .order-button .order-status {
    font-size: 15px;
    line-height: 22px;
}
#orders-orderlist .order-button .order-spacer {
    height: 8px;
}
#orders-orderlist .order-button .order-type,
#orders-orderlist .order-button .order-job,
#orders-orderlist .order-button .order-address {
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
}
#orders-orderlist .order-button .order-subtotal {
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    color: #DD2C00;
}
@media (max-width: 767px) {
    #orders-orderlist .order-button .order-subtotal {
        float: right;
        margin-left: 15px;
    }
}
@media (min-width: 768px) {
    #orders-orderlist .list-grid {
        margin-right: 0;
        margin-left: 0;
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
        border-radius: 2px;
    }
    /*#orders-orderlist .order-button:not(:hover) {
        background: white;
    }*/
    #orders-orderlist .order-button:last-child {
        border-bottom: 0px;
    }
    #orders-orderlist .loadmore-button  {
        border: 1px solid #CECECF;
        box-shadow: none;
    }
}

/* Orders - Order Detail */
#orders-orderdetail .order-requestlabel {
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
}
#orders-orderdetail .order-datetime {
    font-size: 13px;
    font-weight: 500;
    line-height: 13px;
    margin-bottom: 5px;
}
#orders-orderdetail .order-label {
    font-size: 13px;
    line-height: 13px;
    margin-bottom: 5px;
}
#orders-orderdetail .order-number {
    font-size: 19px;
    font-weight: 700;
    line-height: 19px;
}
#orders-orderdetail .order-status {
    font-size: 15px;
    font-weight: 700;
    line-height: 15px;
}
#orders-orderdetail .order-status.pending {
    color: #FB8C00;
}
#orders-orderdetail .order-status.active {
    color: #4CAF50;
}
#orders-orderdetail .order-status.hold {
    color: #D50000;
}
#orders-orderdetail .order-summary-header {
    font-size: 17px;
    padding: 30px 0px;
}
#orders-orderdetail .type-label {
    margin-bottom: 0px;
}
#orders-orderdetail .order-summary-header .summary-title {
    font-size: 44px;
}
#orders-orderdetail .order-summary-header .order-number {
    font-size: 14px;
    margin-top: 15px;
}
#orders-orderdetail .list-grid {
    border-top: 1px solid rgba(0,0,0,0.125);
}
#orders-orderdetail .item-button .item-detail {
    height: 70px;
}
#orders-orderdetail .item-button:last-child {
    border-bottom: none;
}
@media (min-width: 1200px) {
    #orders-orderdetail {
        padding-bottom: 15px;
    }
    #orders-orderdetail .list-grid {
        border: 1px solid rgba(0,0,0,0.125);
        border-bottom-width: 0px;
        border-radius: 2px 2px 0px 0px;
        margin-right: 0;
        margin-left: 0;
    }
    #orders-orderdetail .subtotal {
        margin: 0;
    }
    #orders-orderdetail .subtotal-bar {
        border: 1px solid #E5E5E5;
        border-radius: 0px 0px 2px 2px;
        margin-right: 0;
        margin-left: 0;
    }
}

/* Deliveries - Date Range Rollout */
#deliveries-deliverylist .header-panel {
    min-height: 44px;
}
#deliveries-deliverylist .daterange-rollout {
    padding: 0;
    overflow: hidden;
}
#deliveries-deliverylist .daterange-display {
    color: #AAAAAA;
    padding: 11px 15px 0px 15px;
    overflow: hidden;
    cursor: pointer;
}
#deliveries-deliverylist .filter-display .filter-icon,
#deliveries-deliverylist .filter-display .filter-label {
    height: 24px;
    line-height: 24px;
    display: inline-block;
    position: relative;
    vertical-align: baseline;
}
#deliveries-deliverylist .filter-display .filter-icon {
    height: 24px;
    line-height: 24px;
    float: left;
    color: #0A7AFF;
    margin-top: -1px;
    margin-right: 8px;
}
#deliveries-deliverylist .daterange-panel {
    padding: 15px;
}
#deliveries-deliverylist .daterange-panel label {
    height: 20px;
    font-size: 13px;
    font-weight: 400;
    line-height: 13px;
    color: #808080;
    margin-bottom: 0;
}
#deliveries-deliverylist .daterange-panel .range-input.ng-invalid {
    color: #D50000;
}
#deliveries-deliverylist .daterange-rollout.open-add,
#deliveries-deliverylist .daterange-rollout.open-remove,
#deliveries-deliverylist .daterange-rollout.custom-add,
#deliveries-deliverylist .daterange-rollout.custom-remove {
    -webkit-transition: height 0.25s ease-in-out;
    -moz-transition: height 0.25s ease-in-out;
    transition: height 0.25s ease-in-out;
}
#deliveries-deliverylist .daterange-display.init-remove,
#deliveries-deliverylist .daterange-display.open-remove,
#deliveries-deliverylist .daterange-panel.open-add,
#deliveries-deliverylist .customrange-control.custom-add,
#deliveries-deliverylist .update-control.custom-add {
    -webkit-transition: opacity 0.15s ease-in-out 0.25s;
    -moz-transition: opacity 0.15s ease-in-out 0.25s;
    transition: opacity 0.15s ease-in-out 0.25s;
}
#deliveries-deliverylist .daterange-display.init,
#deliveries-deliverylist .daterange-display.open,
#deliveries-deliverylist .daterange-display.open-add.open-add-active,
#deliveries-deliverylist .daterange-panel:not(.open),
#deliveries-deliverylist .daterange-panel.open-remove.open-remove-active {
    height: 0;
    padding: 0;
    opacity: 0;
    pointer-events: none;
}
#deliveries-deliverylist .daterange-display:not(.open),
#deliveries-deliverylist .daterange-display.open-remove.open-remove-active,
#deliveries-deliverylist .daterange-panel.open,
#deliveries-deliverylist .daterange-panel.open-add.open-add-active,
#deliveries-deliverylist .customrange-control.custom,
#deliveries-deliverylist .customrange-control.custom-add.custom-add-active,
#deliveries-deliverylist .update-control.custom,
#deliveries-deliverylist .update-control.custom-add.custom-add-active {
    opacity: 1;
}
#deliveries-deliverylist .daterange-rollout:not(.custom) .customrange-selection {
    pointer-events: none;
}
@media (max-width: 575px) {
    #deliveries-deliverylist .daterange-rollout,
    #deliveries-deliverylist .daterange-display {
        height: 44px;
    }
    #deliveries-deliverylist .daterange-rollout.open {
        height: 146px;
    }
    #deliveries-deliverylist .daterange-rollout.open.custom {
        height: 220px;
    }
    #deliveries-deliverylist .customrange-selection {
        -webkit-transition: height 0.25s ease-in-out;
        -moz-transition: height 0.25s ease-in-out;
        transition: height 0.25s ease-in-out;
    }
    #deliveries-deliverylist .customrange-selection:not(.custom),
    #deliveries-deliverylist .customrange-selection.custom-remove.custom-remove-active {
        height: 0;
    }
    #deliveries-deliverylist .customrange-selection.custom,
    #deliveries-deliverylist .customrange-selection.custom-add.custom-add-active {
        height: 75px;
    }
    #deliveries-deliverylist .customrange-control:not(.custom),
    #deliveries-deliverylist .customrange-control.custom-remove.custom-remove-active,
    #deliveries-deliverylist .update-control:not(.custom),
    #deliveries-deliverylist .update-control.custom-remove.custom-remove-active {
        opacity: 0;
    }
}
@media (min-width: 576px) {
    #deliveries-deliverylist .daterange-rollout,
    #deliveries-deliverylist .daterange-display {
        height: 44px;
    }
    #deliveries-deliverylist .daterange-rollout.open {
        height: 146px;
    }
    #deliveries-deliverylist .customrange-control:not(.custom),
    #deliveries-deliverylist .customrange-control.custom-remove.custom-remove-active {
        opacity: 0.5;
    }
    #deliveries-deliverylist .update-control:not(.custom),
    #deliveries-deliverylist .update-control.custom-remove.custom-remove-active {
        opacity: 0;
    }
}
@media (min-width: 768px) {
    #deliveries-deliverylist .daterange-rollout,
    #deliveries-deliverylist .daterange-display {
        height: 56px;
    }
    #deliveries-deliverylist .daterange-rollout.open {
        height: 90px;
    }
    #deliveries-deliverylist .daterange-display {
        padding: 17px 15px;
    }
    #deliveries-deliverylist .daterange-rollout .range-input {
        width: 150px;
    }
}
@media (min-width: 1200px) {
    #deliveries-deliverylist .daterange-rollout,
    #deliveries-deliverylist .daterange-display {
        height: 60px;
    }
    #deliveries-deliverylist .daterange-display {
        padding: 25px 15px 0 15px;
    }
}

/* Deliveries - Delivery List */
.route-deliveries {
    background: #F5F5F5;
}
#deliveries-deliverylist .list-grid {
    background: white;
}
#deliveries-deliverylist .delivery-button:not(:last-child) {
    border-bottom: 1px solid #E5E5E5;
}
#deliveries-deliverylist .delivery-button .delivery-display {
    padding-top: 12px;
    padding-bottom: 12px;
}
#deliveries-deliverylist .delivery-button .delivery-datetime {
    float: right;
    font-size: 13px;
    line-height: 22px;
    margin-right: 24px;
}
#deliveries-deliverylist .delivery-button .delivery-number {
    font-size: 17px;
    font-weight: 700;
    line-height: 22px;
}
#deliveries-deliverylist .delivery-button .delivery-status {
    font-size: 15px;
    line-height: 22px;
}
#deliveries-deliverylist .delivery-button .delivery-spacer {
    height: 8px;
}
#deliveries-deliverylist .delivery-button .delivery-type,
#deliveries-deliverylist .delivery-button .delivery-job,
#deliveries-deliverylist .delivery-button .delivery-address {
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
}
#deliveries-deliverylist .delivery-rollout {
    background: #FAFAFA;
    box-shadow: inset 0 1px 4px rgba(0,0,0,0.1);
    margin: 0;
}
#deliveries-deliverylist .delivery-rollout .form-group {
    padding-top: 15px;
}
#deliveries-deliverylist .delivery-rollout .invoice-button.busy .button-label,
#deliveries-deliverylist .delivery-rollout .invoice-button:not(.busy) .busy-ani {
    display: none;
}
@media (min-width: 768px) {
    #deliveries-deliverylist .list-grid {
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
        border-radius: 2px;
        margin-left: 0;
        margin-right: 0;
    }
}
@media (min-width: 1200px) {
    #deliveries-deliverylist .delivery-rollout .form-group {
        max-width: 200px;
    }
}

/* Delivery Tracking Dialog */
.dialog-deliverytracking .tracking-header {
    position: absolute;
    top: 15px;
    left: 20px;
}
.dialog-deliverytracking .tracking-header h5 {
    margin-bottom: 3px;
}
.dialog-deliverytracking .tracking-map {
    height: 100%;
    padding: 75px 0 15px 0;
}
.dialog-deliverytracking .map-frame {
    width: 100%;
    height: 100%;
    border: 1px solid #CECECF;
}

/* Documents - Lookup Rollout */
#documents-documentlist .lookup-rollout {
    padding: 0;
    overflow: hidden;
}
#documents-documentlist .lookup-rollout.busy {
    pointer-events: none;
}
#documents-documentlist .lookup-rollout.busy .filter-details,
#documents-documentlist .lookup-rollout:not(.busy) .busy-ani {
    display: none;
}
#documents-documentlist .lookup-display {
    color: #AAAAAA;
    padding: 0 15px;
    overflow: hidden;
    cursor: pointer;
}
#documents-documentlist .filter-display .filter-icon,
#documents-documentlist .filter-display .filter-label {
    height: 30px;
    line-height: 30px;
    display: inline-block;
    position: relative;
    vertical-align: baseline;
}
#documents-documentlist .lookup-display .filter-icon {
    height: 30px;
    line-height: 30px;
    float: left;
    color: #0A7AFF;
    margin-top: 2px;
    margin-right: 5px;
}
#documents-documentlist .lookup-panel {
    padding: 15px;
}
#documents-documentlist .lookup-panel .input-label {
    height: 20px;
    font-size: 13px;
    font-weight: 400;
    line-height: 13px;
    color: #808080;
}
#documents-documentlist .lookup-panel .range-input.ng-invalid {
    color: #D50000;
}
#documents-documentlist .lookup-panel .lookup-buttons-xl button:last-child {
    margin-left: 8px;
}
#documents-documentlist .lookup-rollout.open-add,
#documents-documentlist .lookup-rollout.open-remove,
#documents-documentlist .lookup-rollout.show-add,
#documents-documentlist .lookup-rollout.show-remove {
    -webkit-transition: height 0.25s ease-in-out;
    -moz-transition: height 0.25s ease-in-out;
    transition: height 0.25s ease-in-out;
}
#documents-documentlist .lookup-display.init-remove,
#documents-documentlist .lookup-display.open-remove,
#documents-documentlist .lookup-panel.open-add {
    -webkit-transition: opacity 0.15s ease-out .25s;
    -moz-transition: opacity 0.15s ease-out .25s;
    transition: opacity 0.15s ease-out .25s;
}
#documents-documentlist .lookup-display.init,
#documents-documentlist .lookup-display.open,
#documents-documentlist .lookup-display.open-add.open-add-active,
#documents-documentlist .lookup-panel:not(.open),
#documents-documentlist .lookup-panel.open-remove.open-remove-active {
    height: 0;
    padding: 0;
    opacity: 0;
    pointer-events: none;
}
#documents-documentlist .lookup-display:not(.open),
#documents-documentlist .lookup-display.open-remove.open-remove-active,
#documents-documentlist .lookup-panel.open,
#documents-documentlist .lookup-panel.open-add.open-add-active {
    opacity: 1;
}
#documents-documentlist .jobselect-control,
#documents-documentlist .customrange-control .form-row {
    -webkit-transition: opacity 0.15s ease;
    -moz-transition: opacity 0.15s ease;
    transition: opacity 0.15s ease;
}
#documents-documentlist .jobselect-control.show,
#documents-documentlist .jobselect-control.show-add.show-add-active,
#documents-documentlist .customrange-control.show .form-row,
#documents-documentlist .customrange-control.show-add.show-add-active .form-row {
    opacity: 1
}
#documents-documentlist .jobselect-control:not(.show),
#documents-documentlist .jobselect-control.show-remove.show-remove-active,
#documents-documentlist .customrange-control:not(.show) .form-row,
#documents-documentlist .customrange-control.show-remove.show-remove-active .form-row {
    opacity: 0.5;
}
#documents-documentlist .jobselect-control:not(.show),
#documents-documentlist .customrange-control:not(.show) {
    pointer-events: none;
}
@media (max-width: 575px) {
    #documents-documentlist .lookup-rollout,
    #documents-documentlist .lookup-display {
        height: 100px;
    }
    #documents-documentlist .lookup-rollout.open {
        height: 385px;
    }
    #documents-documentlist .lookup-display .search {
        margin-top: 15px;
    }
    #documents-documentlist .filter-display {
        padding-top: 10px;
    }
    #documents-documentlist .filter-display .filter-label {
        width: 100%;
        height: 50px;
        line-height: 24px;
        text-align: center;
        margin-top: 2px;
    }
    #documents-documentlist .filter-display .lookup-label {
        margin-top: 14px;
    }
}
@media (min-width: 576px) {
    #documents-documentlist .lookup-rollout,
    #documents-documentlist .lookup-display {
        height: 100px;
    }
    #documents-documentlist .lookup-rollout.open {
        height: 235px;
    }
    #documents-documentlist .lookup-display .search {
        margin-top: 15px;
    }
    #documents-documentlist .filter-display {
        padding: 10px 10px 0 10px;
    }
}
@media (min-width: 768px) {
    #documents-documentlist .header-panel {
        min-height: 56px;
    }
    #documents-documentlist .lookup-rollout,
    #documents-documentlist .lookup-display {
        height: 56px;
    }
    #documents-documentlist .lookup-display .search {
        margin-top: 12px;
    }
    #documents-documentlist .lookup-rollout.open {
        height: 235px;
    }
    #documents-documentlist .filter-display {
        padding: 15px 0 0 0;
    }
}
@media (min-width: 992px) {
    #documents-documentlist .lookup-rollout.open {
        height: 165px;
    }
}
@media (min-width: 1200px) {
    #documents-documentlist .header-panel {
        min-height: 60px;
    }
    #documents-documentlist .lookup-rollout,
    #documents-documentlist .lookup-display {
        height: 60px;
    }
    #documents-documentlist .lookup-display .search {
        margin-top: 13px;
    }
    #documents-documentlist .filter-display {
        padding-top: 22px;
        padding-left: 0;
    }
}

/* Documents - Document List */
.route-documents {
    background: #F5F5F5;
}
#documents-documentlist .list-grid {
    background: white;
}
#documents-documentlist .document-button {
    position: relative;
    padding-top: 12px;
    padding-bottom: 12px;
}
#documents-documentlist .document-button:not(:last-child) {
    border-bottom: 1px solid #E5E5E5;
}
#documents-documentlist .document-button .document-datetime {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 13px;
    font-weight: 500;
    line-height: 16px;
    opacity: 0.5;
}
#documents-documentlist .document-button .document-number {
    font-size: 17px;
    font-weight: 700;
    line-height: 22px;
}
#documents-documentlist .document-button .document-spacer {
    height: 8px;
}
#documents-documentlist .document-button .document-type,
#documents-documentlist .document-button .document-job {
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
}
#documents-documentlist .document-button .document-total {
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    color: #0A7AFF;
}
@media (max-width: 767px) {
    #documents-documentlist .document-button .document-total {
        float: right;
        margin-left: 15px;
    }
}
@media (min-width: 768px) {
    #documents-documentlist .list-grid {
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
        border-radius: 2px;
        margin-left: 0;
        margin-right: 0;
    }
}

/* Store Locations */
#locations-contactlist .branch-panel {
    background: white;
    padding: 15px 0px;
}
#locations-contactlist .branch-title .branch-name {
    font-size: 17px;
    font-weight: 700;
    line-height: 1em;
}
#locations-contactlist .branch-title .branch-id {
    font-size: 14px;
    color: #AAAAAA;
    margin-top: 2px;
}
#locations-contactlist .branch-info {
    margin-top: 20px;
}
#locations-contactlist .branch-info .branch-detail:not(:last-child) {
    padding-bottom: 15px;
}
#locations-contactlist .branch-info .branch-link {
    margin-bottom: 4px;
}
#locations-contactlist .branch-info .branch-link-text {
    line-height: 24px;
    vertical-align: top;
}
#locations-contactlist .branch-info .branch-link-icon {
    margin-right: 4px;
    margin-left: -2px;
    vertical-align: top;
}
@media (max-width: 767px) {
    #locations-contactlist .branch-button:not(:last-child) {
        border-bottom: 1px solid #E5E5E5;
    }
}
@media (min-width: 768px) {
    .route-locations {
        background: #F5F5F5;
    }
    #locations-contactlist .list-grid {
        padding: 4px;
    }
    #locations-contactlist .branch-button {
        padding: 4px;
        border-bottom-width: 0;
    }
    #locations-contactlist .branch-panel {
        height: 250px;
        padding: 15px;
        border-bottom: none;
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    }
}
@media (min-width: 992px) {
    #locations-contactlist .branch-panel {
        height: 180px;
    }
}

/* My Account */
#account .user-content {
    padding-top: 30px;
}
#account .account-content,
#account .payment-content {
    padding-top: 15px;
}
#account .activity-label {
    font-size: 17px;
    margin-bottom: 15px;
}
#account .card .table {
    margin-bottom: 0px;
}
#account .card .table tr:first-child td {
    border-top: 0;
}
#account .card .table td {
    padding: 4px 0;
}
#account .card .table td.spaced {
    border-top: 0;
    padding-top: 20px;
}
#account .payment-card {
    background: #F7F7F9;
}
#account .pending-card {
    border-color: #4CAF50;
}
#account .pending-card .card-body {
    padding: 15px 20px;
}
#account .rep-name,
#account .rep-link {
    vertical-align: top;
    margin-bottom: 8px;
}
#account .terms-link {
    margin-left: 20px;
}
#account .checkbox-control {
    border: none;
    margin-left: 10px;
}
#account .statements-button.busy {
    pointer-events: none;
}
#account .statements-button.busy .button-label,
#account .statements-button:not(.busy) .busy-ani {
    display: none;
}
#account .payment-submitted .success-group {
    padding-top: 20px;
}
#account .payment-submitted .success-icon {
    font-size: 100px;
    line-height: 100px;
}
#account .payment-submitted .success-message {
    padding-top: 20px;
}
@media (min-width: 768px) {
    #account .payment-content .invoices-col {
        padding-right: 26px;
    }
}
@media (min-width: 1200px) {
    #account .statements-group {
        max-width: 640px;
    }
    #account .payment-group {
        max-width: 320px;
    }
}

/* My Account - Invoice Selection Dialog */
.dialog-invoices .dialog-title {
    padding-top: 25px;
}
.dialog-invoices .list-grid {
    border-top: 1px solid rgba(0,0,0,0.125);
}
.dialog-invoices .invoice-button {
    position: relative;
    padding-top: 12px;
    padding-right: 15px;
    padding-bottom: 12px;
    padding-left: 50px;
}
.dialog-invoices .invoice-button .invoice-select {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 40px;
    background: #FAFAFA;
}
.dialog-invoices .invoice-button .checkbox-icon {
    line-height: 24px;
    color: gray;
    margin-top: 11px;
}
.dialog-invoices .invoice-button.checked .checked-icon {
    color: #0A7AFF;
}
.dialog-invoices .invoice-button.checked .unchecked-icon,
.dialog-invoices .invoice-button:not(.checked) .checked-icon {
    display: none;
}
.dialog-invoices .invoice-button .invoice-datetime {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 13px;
    font-weight: 500;
    line-height: 16px;
    opacity: 0.5;
}
.dialog-invoices .invoice-button .invoice-number {
    font-size: 17px;
    font-weight: 700;
    line-height: 22px;
}
.dialog-invoices .invoice-button .invoice-spacer {
    height: 8px;
}
.dialog-invoices .invoice-button .invoice-name {
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
}
.dialog-invoices .invoice-button .invoice-amount {
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    color: #DD2C00;
}
.dialog-invoices .dialog-footer {
    background: white;
    border-top: 1px solid #CECECF;
    padding-top: 15px;
    margin-top: -1px;
}
.dialog-invoices .invoices-total {
    margin-bottom: 10px;
}
.dialog-invoices .invoices-total .total-amount {
    font-size: 19px;
    line-height: 19px;
}
@media (max-width: 575px) {
    .dialog-invoices .invoices-total .total-label {
        float: left;
    }
}
@media (max-width: 767px) {
    .dialog-invoices .invoice-grid {
        margin-right: -15px;
        margin-left: -15px;
    }
    .dialog-invoices .invoice-button {
        border-bottom: 1px solid #E5E5E5;
    }
    .dialog-invoices .invoice-button .invoice-amount {
        float: right;
        margin-left: 15px;
    }
}
@media (min-width: 576px) {
    .dialog-invoices .padded-row {
        padding-right: 15px;
        padding-left: 15px;
    }
    .dialog-invoices .invoices-total {
        padding-bottom: 10px;
    }
    .dialog-invoices .invoices-total .total-label,
    .dialog-invoices .invoices-total .total-amount {
        margin-right: 5px;
    }
}
@media (min-width: 768px) {
    .dialog-invoices .list-grid {
        border: 1px solid rgba(0,0,0,0.125);
        border-radius: 2px;
        margin-right: 0;
        margin-bottom: 16px;
        margin-left: 0;
    }
    .dialog-invoices .invoice-button {
        padding-left: 59px;
    }
    .dialog-invoices .invoice-button:not(:last-child) {
        border-bottom: 1px solid #E5E5E5;
    }
    .dialog-invoices .invoice-button .invoice-select {
        width: 44px;
    }
}

/* My Account - Statements Dialog */
.dialog-statements .dialog-title {
    padding-top: 25px;
    padding-bottom: 5px;
}
.dialog-statements .list-grid {
    margin-bottom: 25px;
    overflow: hidden;
}
.dialog-statements .statement-button {
    position: relative;
    padding-top: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #E5E5E5;
}
.dialog-statements .statement-button .statement-datetime {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 13px;
    font-weight: 500;
    line-height: 16px;
}
.dialog-statements .statement-button .statement-docid {
    font-size: 17px;
    font-weight: 700;
    line-height: 22px;
}
.dialog-statements .statement-button .statement-job {
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
}
.dialog-statements .statement-button .statement-total {
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    color: #0A7AFF;
}
.dialog-statements .loadmore-button {
    padding: 0;
    border-top: none;
    box-shadow: none;
}
@media (max-width: 767px) {
    .dialog-statements .statement-button .statement-total {
        float: right;
        margin-left: 15px;
    }
}
@media (min-width: 576px) {
    .dialog-statements .padded-row {
        padding-right: 15px;
        padding-left: 15px;
    }
    .dialog-statements .list-grid {
        border-top: 1px solid rgba(0,0,0,0.125);
        border-bottom: 1px solid rgba(0,0,0,0.125);
    }
    .dialog-statements .list-grid.more .statement-button:last-child,
    .dialog-statements .list-grid:not(.more) .statement-button:nth-last-child(2) {
        border-bottom: none;
    }
}
@media (min-width: 768px) {
    .dialog-statements .list-grid {
        border: 1px solid rgba(0,0,0,0.125);
        border-radius: 2px;
        margin-right: 0;
        margin-left: 0;
    }
}

/* Subtotal Bar */
.subtotal-bar {
    font-size: 15px;
    line-height: 15px;
    padding: 15px;
    margin-left: -15px;
    margin-right: -15px;
    border-top: 1px solid #E5E5E5;
}
.subtotal-bar .subtotal-label {
    font-weight: 400;
    color: #808080;
}
.subtotal-bar .subtotal-amount {
    float: right;
    font-size: 19px;
    color: #DD2C00;
}
@media (min-width: 992px) {
    .subtotal-bar .subtotal-label {
        float: right;
        padding-top:4px;
        margin-right: 10px;
    }
    .subtotal-bar .subtotal-amount {
        font-size: 19px;
        line-height: 20px;
    }
}

/* Users */
#users-userlist .instructions-row {
    padding-top: 15px;
    padding-bottom: 25px;
}
#users-userlist .list-grid {
    border-top: 1px solid #E5E5E5;
}
#users-userlist .user-button {
    min-height: 48px;
    border-bottom: 1px solid #E5E5E5;
    overflow: hidden;
}
#users-userlist .user-button.open:hover {
    background: initial;
}
#users-userlist .user-button.open-add,
#users-userlist .user-button.open-remove {
    pointer-events: none;
}
#users-userlist .user-button .user-label,
#users-userlist .user-button .header-label {
    font-size: 17px;
    line-height: 48px;
    vertical-align: top;
}
#users-userlist .user-button .newuser-label,
#users-userlist .user-button .header-label {
    font-weight: 500;
}
#users-userlist .user-button .arrow-icon {
    margin-top: 8px;
    margin-right: -4px;
}
#users-userlist .user-button.open .arrow-down,
#users-userlist .user-button:not(.open) .arrow-up {
    display: none;
}
#users-userlist .user-rollout {
    background: #FAFAFA;
    box-shadow: inset 0 1px 4px rgba(0,0,0,0.1);
    margin: 0;
}
#users-userlist .user-rollout .form-group {
    padding-top: 15px;
}
#users-userlist .user-rollout .edit-button.busy .button-label,
#users-userlist .user-rollout .edit-button:not(.busy) .busy-ani {
    display: none;
}
@media (max-width: 419px) {
    #users-userlist .d-xxs-none {
        display: none;
    }
}
@media (max-width: 575px) {
    #users-userlist .user-button .user-display {
        padding-top: 7px;
        padding-bottom: 7px;
    }
    #users-userlist .user-button:not(.newuser-button) .user-label {
        line-height: 28px;
    }
    #users-userlist .user-button .icon-col {
        height: 28px;
    }
    #users-userlist .user-button .arrow-icon {
        margin-top: 0;
    }
    #users-userlist .users-card {
        background: none;
        border: none;
        border-radius: 0;
    }
    #users-userlist .users-card .card-body {
        padding: 0;
    }
}
@media (min-width: 768px) {
    .route-users {
        background: #F5F5F5;
    }
    #users-userlist .list-grid {
        background: white;
        box-shadow: 0 1px 2px rgba(0,0,0,0.1);
        border-radius: 2px;
        margin-left: 0;
        margin-right: 0;
    }
    #users-userlist .user-button:last-child {
        border-bottom: 0px;
    }
}
@media (min-width: 1200px) {
    #users-userlist .header-panel .newuser-button {
        margin-top: 13px;
    }
}

/* Bootstrap Responsive Overrides */

@media (min-width: 768px) and (max-width: 991px) {
    .container {
        max-width: 760px;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .container {
        max-width: 990px;
    }
}

/* Extended Responsiveness */
.no-padding {
    padding-left: 0;
    padding-right: 0;
}
.no-padding-l {
    padding-left: 0;
}
.no-padding-r {
    padding-right: 0;
}
.half-padding {
    padding-left: 7px;
    padding-right: 7px;
}
.half-padding-l {
    padding-left: 7px;
}
.half-padding-r {
    padding-right: 7px;
}
@media (max-width: 575px) {
    .no-padding-xs {
        padding-left: 0;
        padding-right: 0;
    }
    .no-padding-xs-l {
        padding-left: 0;
    }
    .no-padding-xs-r {
        padding-right: 0;
    }
    .half-padding-xs {
        padding-left: 7px;
        padding-right: 7px;
    }
    .half-padding-xs-l {
        padding-left: 7px;
    }
    .half-padding-xs-r {
        padding-right: 7px;
    }
    .fluid-xs {
        width: 100%;
        max-width: none;
    }
    .w-xs-100 {
        width: 100% !important;
    }
    .h-xs-100 {
        height: 100% !important;
    }
    .sticky-header-xs {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        left: 0;
    }
}
@media (min-width: 576px) and (max-width: 768px) {
    .no-padding-sm {
        padding-left: 0;
        padding-right: 0;
    }
    .no-padding-sm-l {
        padding-left: 0;
    }
    .no-padding-sm-r {
        padding-right: 0;
    }
    .half-padding-sm {
        padding-left: 7px;
        padding-right: 7px;
    }
    .half-padding-sm-l {
        padding-left: 7px;
    }
    .half-padding-sm-r {
        padding-right: 7px;
    }
    .fluid-sm {
        width: 100%;
        max-width: none;
    }
    .w-sm-100 {
        width: 100% !important;
    }
    .h-sm-100 {
        height: 100% !important;
    }
    .sticky-header-sm {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        left: 0;
    }
}
@media (min-width: 768px) and (max-width: 992px) {
    .no-padding-md {
        padding-left: 0;
        padding-right: 0;
    }
    .no-padding-md-l {
        padding-left: 0;
    }
    .no-padding-md-r {
        padding-right: 0;
    }
    .half-padding-md {
        padding-left: 7px;
        padding-right: 7px;
    }
    .half-padding-md-l {
        padding-left: 7px;
    }
    .half-padding-md-r {
        padding-right: 7px;
    }
    .fluid-md {
        width: 100%;
        max-width: none;
    }
    .w-md-100 {
        width: 100% !important;
    }
    .h-md-100 {
        height: 100% !important;
    }
    .sticky-header-md {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        left: 0;
    }
}
@media (min-width: 992px) and (max-width: 1200px) {
    .no-padding-lg {
        padding-left: 0;
        padding-right: 0;
    } 
    .no-padding-lg-l {
        padding-left: 0;
    }
    .no-padding-lg-r {
        padding-right: 0;
    }
    .half-padding-lg {
        padding-left: 7px;
        padding-right: 7px;
    }
    .half-padding-lg-l {
        padding-left: 7px;
    }
    .half-padding-lg-r {
        padding-right: 7px;
    }
    .fluid-lg {
        width: 100%;
        max-width: none;
    }
    .w-lg-100 {
        width: 100% !important;
    }
    .h-lg-100 {
        height: 100% !important;
    }
    .sticky-header-lg {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        left: 0;
    }
}
@media (min-width: 1200px) {
    .no-padding-xl {
        padding-left: 0;
        padding-right: 0;
    }
    .no-padding-xl-l {
        padding-left: 0;
    }
    .no-padding-xl-r {
        padding-right: 0;
    }
    .half-padding-xl {
        padding-left: 7px;
        padding-right: 7px;
    }
    .half-padding-xl-l {
        padding-left: 7px;
    }
    .half-padding-xl-r {
        padding-right: 7px;
    }
    .fluid-xl {
        width: 100%;
        max-width: none;
    }
    .w-xl-100 {
        width: 100% !important;
    }
    .h-xl-100 {
        height: 100% !important;
    }
    .sticky-header-xl {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        left: 0;
    }
}

/* Disabling */
.disabled,
.ignored {
    pointer-events: none !important;
    cursor: not-allowed !important;
}
/*.btn.disabled,
.btn:disabled {
    opacity: 0.5 !important;
}*/
.input-group.disabled .input-group-addon {
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}
.no-animate {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    transition: none !important;
}