* {
    font-family: Arial, Helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
}

:root {
    --cybake-orange: #e84e0f;
    --navbar-colour: #e84e0f;
}

*, *:focus, *:hover {
    outline: none !important;
}

.invisible-scrollbar {
    display: block;
    overflow: auto;
}

    .invisible-scrollbar::-webkit-scrollbar {
        display: none;
    }

.u-userLauncherColor:not([disabled]) {
    background-color: var(--cybake-orange) !important;
}

.cybake2 div.login-screens {
    background-image: url("../assets/images/LA.jpg") !important;
}

.uiGrid-header-background {
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(1, #fff));
    background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, from(rgb(238, 238, 238)), to(rgb(255, 255, 255)));
}

.angular-hybrid-screen {
    margin-left: 150px;
    margin-right: -15px;
    padding-top: 4px;
}

.angular-hybrid-screen-login {
    height: calc(100vh - 50px);
    width: 100vw;
}

    .angular-hybrid-screen-login:has(cybake-login) {
        height: 100vh !important;
    }

    .angular-hybrid-screen-login:has(cybake-mfa) {
        height: 100vh !important;
    }

    .angular-hybrid-screen-login:has(cybake-auth-callback) {
        height: 100vh !important;
    }

    .angular-hybrid-screen-login:has(cybake-forgotten-password) {
        height: 100vh !important;
    }

    .angular-hybrid-screen-login:has(cybake-reset-password) {
        height: 100vh !important;
    }

.cybake2.angular-hybrid-screen app-bench-production .page-content.bench-production-tableHeight {
    height: calc(100vh - 259px) !important;
}

.cybake2.angular-hybrid-screen app-bench-production .page-content.bench-production-benchAssignment-tableHeight {
    height: calc(100vh - 314px) !important;
}

.nutrition-table-with-rbnfl {
    width: calc(100% - 315px);
}

.padding-left-0 {
    padding-left: 0 !important;
}

.w-45 {
    width: 45%;
}

.cybake2 {
    @include 'style.css';
}

    .cybake2 p-inputnumber.p-inputnumber-clearable .p-inputnumber-input {
        padding-right: 2rem !important;
    }

.color-red {
    color: red;
}

.select-placeholder-color {
    color: #a499a4 !important;
}

    .select-placeholder-color option {
        color: #555 !important;
    }

/*General Boostrap 4 Classes*/
.me-1 {
    margin-right: 0.25rem;
}

.me-2 {
    margin-right: .5rem;
}

.pe-1 {
    padding-right: 0.25rem;
}

.pe-2 {
    padding-right: .5rem;
}

.ml-1 {
    margin-left: 0.25rem;
}

.ml-2 {
    margin-left: .5rem;
}

.d-inline-block {
    display: inline-block !important;
}

.d-inline-flex {
    display: inline-flex;
}

.d-contents {
    display: contents;
}

.d-block {
    display: block !important;
}

.d-inline-grid {
    display: inline-grid !important;
}

.m-auto {
    margin: auto !important;
}

.m-0 {
    margin: 0 !important;
}

.p-0 {
    padding: 0 !important;
}

.pl-0 {
    padding-left: 0 !important;
}

.pr-0 {
    padding-right: 0 !important;
}

.mb-0 {
    margin-bottom: 0;
}

.mt-0 {
    margin-top: 0;
}

.float-right {
    float: right !important;
}

.float-left {
    float: left !important;
}

.w-50 {
    width: 50% !important
}

.w-35 {
    width: 35% !important;
}

.w-65 {
    width: 65% !important;
}

.w-100 {
    width: 100% !important
}

.credit-notes-no-rows-with-footer {
    margin-bottom: -3px;
}

.green {
    color: green;
}

.btn-info {
    background-color: #fafa00;
    color: black !important;
}

    .btn-info.active, .btn-info.focus, .btn-info:active, .btn-info:focus, .btn-info:hover, .open > .dropdown-toggle.btn-info {
        color: black !important;
        background-color: #fafa00 !important;
        border-color: #fafa00 !important;
    }

/*Credit Notes*/
.creditNotes-generated-check-icon {
    font-size: 1.2em;
}

.creditNotes-generated-check-btn {
    width: 40px;
    font-weight: 600;
    height: 32px;
    background-color: transparent;
    border: none
}

.creditNotes-view-panelBody {
    max-width: 240px;
}

.creditNotes_documentNumber_search_input_label {
    font-weight: 500;
    margin-bottom: 0
}

.creditNotes-searchBy-btn {
    min-width: 105px;
}

.creditNotes-pagenation-select {
    width: 130px;
    margin: 19px 0 0 10px;
}

.p-10px {
    padding: 10px
}

/*SCROLLBAR*/
/* width */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 0;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #A9A9A9;
    border-radius: 15px;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #787878;
    }

/*SCROLLBAR END------------------*/

.mainMenuIcons {
    padding: 10px;
    font-size: 1.75em !important;
}

.modal-xl {
    width: 1200px;
}

.modal-2xl {
    position: relative;
    display: table; /* This is important */
    overflow-y: auto;
    overflow-x: auto;
    width: auto;
    min-width: 300px;
}

.angular-google-map-container {
    height: 400px;
}

.grid-align-center {
    text-align: center;
}

html, body {
    overflow: visible;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    line-height: 1.6;
    height: 100%;
}

h3 {
    color: #584e55;
}

.inline-flex {
    display: inline-flex;
}

.padding-standard {
    padding: 5px 5px 5px 5px;
}

.no-bottom-panel {
    padding: 15px 15px 0 15px;
}

hr.hr-sm {
    margin-top: 10px;
    margin-bottom: 10px;
}

hr.hr-sm-top {
    margin-top: 10px;
}

hr.hr-sm-bottom {
    margin-bottom: 10px;
}

hr.hr-xs {
    margin-top: 5px;
    margin-bottom: 5px;
}

hr.hr-xs-top {
    margin-top: 5px;
}

hr.hr-xs-bottom {
    margin-bottom: 5px;
}

.no-rows-suppliers {
    height: 200px;
    bottom: 0;
    width: 98%;
    background: rgba(0, 0, 0, 0.4);
}

    .no-rows-suppliers .msg {
        opacity: 1;
        position: relative;
        top: 20%;
        left: 20%;
        width: 60%;
        height: 50%;
        line-height: 200%;
        background-color: #eee;
        border-radius: 4px;
        border: 1px solid #555;
        text-align: center;
        font-size: 24px;
        display: table;
    }

        .no-rows-suppliers .msg span {
            display: table-cell;
            vertical-align: middle;
        }

.no-rows {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.4);
}

.deleted-order {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    background: rgba(238, 238, 238, 0.38);
}

.no-rows .msg {
    opacity: 1;
    position: absolute;
    top: 20%;
    left: 20%;
    width: 60%;
    height: 50%;
    line-height: 200%;
    background-color: #eee;
    border-radius: 4px;
    border: 1px solid #555;
    text-align: center;
    font-size: 24px;
    display: table;
}

    .no-rows .msg span {
        display: table-cell;
        vertical-align: middle;
    }

.no-rows .add-specialOrder-msg {
    opacity: 1;
    position: absolute;
    top: 28%;
    left: 11%;
    width: 80%;
    height: 50%;
    line-height: 200%;
    background-color: #eee;
    border-radius: 4px;
    border: 1px solid #555;
    text-align: center;
    font-size: 18px;
    display: table;
}

    .no-rows .add-specialOrder-msg span {
        display: table-cell;
        vertical-align: middle;
    }

.ui-grid-row-dirty .ui-grid-cell {
    color: #94c11c;
    background-color: #ccc;
}

.slim-form {
    padding: 0;
    margin: 0;
}

.grid {
    width: 100%;
    height: 100%;
}

.full-width {
    width: 100%;
}

.full-width-important {
    width: 100% !important;
}

.invalid {
    background-color: pink !important;
    border: 1px solid red;
}

.fa-chevron-right {
    font-size: 8px;
}

.fa-minus {
    font-size: 8px;
}

a:link, a:hover, a:active, a:visited {
    color: #333;
}

.btn, .badge, .modal, .modal-dialog, .modal-content,
input, select {
    -ms-border-radius: 0 !important;
    border-radius: 0 !important;
}

input, select {
    padding: 4px !important;
    /*width: 65% !important;*/
    display: inline-block !important;
}


/* Navbar */



.navbar {
    color: white;
    background-color: var(--navbar-colour);
    height: 52px;
    box-shadow: 43px 1px 2px 1px rgba(0, 0, 0, 0.25);
    border: none;
    /*border-bottom: 1px #584e55 solid;*/
}

    .navbar .navbar-brand {
        color: white;
        background: url('../images/Cybakelogonew.png') no-repeat;
        background-position: center;
        width: 150px;
        margin-left: 5px !important;
    }

.cybake-navbar .navbar-brand {
    color: white;
    background: url('../images/Cybakelogonew.png') no-repeat;
    background-position: center;
    width: 150px;
    margin-left: 5px !important;
}

.navbar .container {
    width: 97% !important;
}

.navbar .nav > li > a {
    color: white;
    font-size: 13px !important;
}

    .navbar .nav > li > a:hover {
        color: white;
        font-size: 13px !important;
    }

    .navbar .nav > li > a:visited {
        color: white;
        font-size: 13px !important;
    }

.navbar i {
    margin-right: 3px;
}

.navbar .caret {
    border-top-color: #fff !important;
    border-bottom-color: #fff !important;
}

.navbar .nav-user-pic {
    width: 20px;
    margin-right: 10px;
}

.navbar .badge {
    margin-left: 5px;
}

/*#region Angular ng-show dissolve animation */
.dissolve-animation.ng-hide-remove,
.dissolve-animation.ng-hide-add {
    position: fixed !important;
    display: inline !important;
    -webkit-transition: 0.5s linear all;
    -moz-transition: 0.5s linear all;
    -o-transition: 0.5s linear all;
    transition: 0.5s linear all;
}

    .dissolve-animation.ng-hide-remove.ng-hide-remove-active,
    .dissolve-animation.ng-hide-add {
        opacity: 1;
    }

        .dissolve-animation.ng-hide-add.ng-hide-add-active,
        .dissolve-animation.ng-hide-remove {
            opacity: 0;
        }
/*#endregion */

/*#region toastr */
#toast-container.toast-top-full-width > div, #toast-container.toast-bottom-full-width > div {
    margin: 4px auto;
}

#toast-container {
    z-index: 2147483648 !important;
}
/*#endregion */

/*#region Angular ng-include, ng-view, ng-repeat shuffle animations*/

.shuffle-animation.ng-enter,
.shuffle-animation.ng-leave {
    position: relative;
}

.shuffle-animation.ng-enter {
    -moz-transition: ease-out all 0.3s 0.4s;
    -o-transition: ease-out all 0.3s 0.4s;
    -webkit-transition: ease-out all 0.3s 0.4s;
    transition: ease-out all 0.3s 0.4s;
    left: 2em;
    opacity: 0;
}

    .shuffle-animation.ng-enter.ng-enter-active {
        left: 0;
        opacity: 1;
    }

.shuffle-animation.ng-leave {
    -moz-transition: 0.3s ease-out all;
    -o-transition: 0.3s ease-out all;
    -webkit-transition: 0.3s ease-out all;
    transition: 0.3s ease-out all;
    left: 0;
    opacity: 1;
}

    .shuffle-animation.ng-leave.ng-leave-active {
        left: 2em;
        opacity: 0;
    }
/*#endregion*/

/*#region Splash */

.flag-haschanges {
    position: fixed !important;
    display: inline;
}

.fa-asterisk.fa-asterisk-large {
    font-size: 180%;
    vertical-align: middle;
    color: #F58A00;
}

.fa-asterisk.fa-asterisk-alert {
    color: #F58A00;
}

.fa-asterisk-inline {
    padding: 0 4px 0 0;
}


.progress,
.page-progress-bar {
    margin: 30px 10% !important;
}

.ngplus-overlay-background {
    top: 0;
    left: 0;
    padding-left: 100px;
    position: absolute;
    z-index: 10000;
    height: 100%;
    width: 100%;
    background-color: #808080;
    opacity: 0.2;
}

.ngplus-overlay-content {
    position: absolute;
    border: 1px solid #000;
    background-color: #fff;
    font-weight: bold;
    height: 100px;
    width: 300px;
    height: 15em;
    width: 20em;
    z-index: 10000;
    text-align: center;
}

.page-spinner-message {
    text-align: center;
    font-size: 400%;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-weight: normal;
    -webkit-text-shadow: 2px 2px #000000;
    text-shadow: 2px 2px #000000;
    text-shadow: 2px 2px rgba(0, 0, 0, 0.15);
    text-transform: uppercase;
    text-decoration: none;
    color: #F58A00;
    padding: 0;
}

    .page-spinner-message.page-spinner-message-subtle {
        margin: 30% auto 0 auto;
        font-size: 200%;
    }

.overlay-message {
    font-size: 200%;
}

.spinner {
    margin: 20% auto 0 auto;
    left: auto;
    top: auto !important;
}
/*#endregion*/

.sidebar-wrapper {
    z-index: 800;
    position: fixed;
    width: 58px;
    height: 100%;
    /*overflow-y: auto;*/
    background-color: #2d323e;
    -webkit-transition: ease all 0.7s;
    -moz-transition: ease all 0.7s;
    -o-transition: ease all 0.7s;
    transition: ease all 0.7s;
    padding-top: 65px;
    /*border-right: solid 1px #e7e7e7;*/
    border: none;
    text-align: center;
    left: -10px;
    text-align: left;
    border-right: solid 1px #584e55;
    padding-left: 6px;
    box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.25);
}

.sidebar-open {
    width: 220px;
}

.sidebar-nav.bottom {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
}

.sidebar-nav li,
.sidebar-nav .sidebar-nav.bottom li {
    list-style-type: none;
    padding: 10px 0 0 0;
    margin-left: -34px;
    -moz-transition: all ease 0.19s;
    -o-transition: all ease 0.19s;
    -webkit-transition: all ease 0.19s;
    transition: all ease 0.19s;
    -moz-transition-delay: 0.13s;
    -o-transition-delay: 0.13s;
    -webkit-transition-delay: 0.13s;
    transition-delay: 0.13s;
    padding-left: 12px;
}

    .sidebar-nav li a {
        /*display: block;*/
        text-decoration: none;
        color: #d3d3d4;
        font-size: 10px;
        text-align: center;
    }

        /*.sidebar-nav li a:hover {
            text-decoration: none;
            color: #999999;
            background: rgba(255,255,255,0.2);
        }*/

        .sidebar-nav li a:active,
        .sidebar-nav li a:focus {
            text-decoration: none;
        }

    .sidebar-nav li:hover {
        background-color: rgba(193, 193, 193, 0.32)
    }

.sidebar-nav > .sidebar-brand {
    height: 65px;
    font-size: 18px;
    line-height: 60px;
}

    .sidebar-nav > .sidebar-brand a {
        color: #999999;
    }

        .sidebar-nav > .sidebar-brand a:hover {
            color: #fff;
            background: none;
        }

.sidebar-label {
    display: inline-block;
    height: 0;
    opacity: 0;
    vertical-align: super;
    margin-left: 10px;
    -moz-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    -webkit-transition: all ease 0.3s;
    transition: all ease 0.3s;
    margin-left: -200px;
    font-size: 18px;
}

.sidebar-label-visible {
    opacity: 1;
    line-height: 29px;
    margin-left: 0px;
    -moz-transition: all ease 0.4s;
    -o-transition: all ease 0.4s;
    -webkit-transition: all ease 0.4s;
    transition: all ease 0.4s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
}

.sidebar-item {
    max-height: 39px;
}

.sidebar-nav li.sidebar-icon-spacing {
    margin-left: 40px;
}

.subNav {
}

    .subNav ul {
        list-style-type: none;
        margin: auto;
    }

        .subNav ul li {
            float: left;
            padding-right: 10px;
            width: 100%;
        }

/*.subNav li a {
    margin-top: 50px;
}*/

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
    margin-left: -70px;
    padding: 20px 15px 5px 5px;
}

    .footer ul {
        list-style-type: none;
        margin: auto;
    }

        .footer ul li {
            float: left;
            padding-right: 10px;
        }

.auditInfo {
    font-size: 10px;
    margin: 20px 0 0 30px;
}

    .auditInfo ul {
        list-style-type: none;
        margin: auto;
    }

        .auditInfo ul li {
            float: left;
            padding-right: 10px;
        }

[tooltip]:before {
    position: absolute;
    content: attr(tooltip);
    opacity: 0;
}

[tooltip]:hover:before {
    opacity: 1;
}

.edit input[type="text"] {
    /*outline: none;
    background-color: transparent;
    border: 0 solid;*/
}

    .edit input[type="text"]:focus {
        outline: none;
        box-shadow: 0 0 5px #61C5FA;
        border: 1px solid #5AB0DB;
    }

    .edit input[type="text"]:hover {
        border: 1px solid #999;
        border-radius: 5px;
    }

    .edit input[type="text"]:focus:hover {
        outline: none;
        box-shadow: 0 0 5px #61C5FA;
        border: 1px solid #5AB0DB;
        border-radius: 0;
    }

.edit input.ng-invalid {
    background-color: pink;
    border: 1px solid red;
}

.edit select.ng-invalid {
    background-color: pink;
    border: 1px solid red;
}

span.text-content {
    background: rgba(0,0,0,0.5);
    color: white;
    cursor: pointer;
    display: table;
    left: 0;
    position: absolute;
    top: 0;
    height: 180px;
    width: 180px;
    padding: 60px 0 0 60px;
    opacity: 0;
    z-index: 999;
}

.productImage .loadImage {
    height: 180px;
    width: 180px;
    background-color: #eeeeee;
    border: solid 1px #cccccc;
}

.productImage .icon {
    margin: auto;
    margin-top: 30%;
    width: 40%;
}

.productImage:hover span.text-content {
    opacity: 1;
}

.companyImage .loadImage {
    height: 180px;
    width: 180px;
    background-color: #eeeeee;
    border: solid 1px #cccccc;
}

.companyImage .icon {
    margin: auto;
    margin-top: 30%;
    width: 30%;
}

.companyImage:hover span.text-content {
    opacity: 1;
}


span.text-content span {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

#admin-wrapper {
    z-index: 700;
    position: fixed;
    width: 225px;
    height: 100%;
    overflow-y: auto;
    background-color: #fafafa;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    padding: 10px 0 0 15px;
    border-right: solid 1px #ddd;
    left: 40px;
    padding-top: 55px;
}

    #admin-wrapper hr {
        margin: 10px 0 10px 0;
    }

.admin-inner-wrapper {
    height: 100%;
    overflow-y: auto;
    padding-bottom: 60px;
}

#admin-wrapper ul {
    list-style-type: disc;
    margin: auto;
}

    #admin-wrapper ul li {
        padding-right: -200px;
    }

.learn-more-panel {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    width: 250px;
    margin-right: 0px;
    -moz-transition: ease all 1s;
    -o-transition: ease all 1s;
    -webkit-transition: ease all 1s;
    transition: ease all 1s;
    z-index: 1000;
}

    .learn-more-panel.ng-hide {
        margin-right: -250px;
    }

        .learn-more-panel.ng-hide-remove,
        .learn-more-panel.ng-hide.ng-hide-add-active {
            margin-right: -250px;
            display: block !important;
        }

            .learn-more-panel.ng-hide-add,
            .learn-more-panel.ng-hide-remove.ng-hide-remove-active {
                margin-right: 0;
                display: block !important;
            }

.learn-more {
    z-index: 1000;
    position: fixed;
    margin-top: 40px;
    height: 100%;
    width: 250px;
    background-color: #fafafa;
    border-left: solid 2px #eeeeee;
    padding: 10px 0 0 10px;
}

    .learn-more.bottom {
        position: absolute;
        bottom: 0;
        right: 0;
        margin-left: -25px;
    }

.learn-more-scroll {
    overflow-y: auto;
    height: 90%;
    padding-bottom: 20px;
}

.main {
    margin-left: 200px;
}

/*.col-fixed-200 {
    width: 200px;
    position: fixed;
    height: 100%;
    margin-left: 20px;
}

.col-offset-200 {
    padding-left: 220px;
    padding-right: 20px;
}*/

.modal-backdrop {
    bottom: 0;
}

/*.searchOverlayHidden {
    opacity: 0 !important;
    visibility: hidden !important;
}

.searchOverlay {
    display: block;
    visibility: visible;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: black;
    opacity: 0.75;
    z-index: 900;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

    .searchOverlay div {
        position: relative;
        display: inline-block;
        top: 50%;
        margin: -50% 5px 0 0;
        left: 0;
    }

    .searchOverlay .message {
        top: 50%;
        left: 40%;
        color: white;
        text-align: center;
    }*/

.nav li {
    display: table-cell !important;
}

.listToList ul,
.listToList ul > li {
    position: relative;
}

.listToList ul {
    min-height: 42px;
    padding-left: 0;
}

    .listToList ul .dndDraggingSource {
        display: none;
    }


    .listToList ul .dndPlaceholder {
        display: block;
        background-color: #ddd;
        min-height: 50px;
        border: dashed 1px #999999;
    }


    .listToList ul li {
        background-color: #fff;
        border: 1px solid #ddd;
        border-top-right-radius: 4px;
        border-top-left-radius: 4px;
        display: block;
        padding: 10px 15px;
        margin-bottom: -1px;
    }

.listToList .handle {
    cursor: move;
    position: absolute;
    top: 10px;
}

.listToList .name {
    margin-left: 20px;
}

.listToList .view {
    margin-top: -20px;
    float: right;
}

.listToList ul li.selected {
    background-color: #eeeeee;
}

.details {
    padding: 10px;
}

.action {
    border: 0;
    background-color: white;
}

* > .fa.fa-hover-show,
*:hover > .fa.fa-hover-hidden {
    display: none;
}

*:hover > .fa.fa-hover-show {
    display: inline-block;
}

    *:hover > .fa.fa-hover-show.fa-circle {
        color: #999999;
    }

.tableScroll {
    width: 80%;
    overflow-x: scroll;
    margin-left: 300px;
    overflow-y: visible;
}

.headcol {
    position: absolute;
    width: 320px;
    height: 46px;
    left: 0;
    top: auto;
    border-right: 0 none black;
    border-top-width: 2px; /*only relevant for first row*/
}

    .headcol.heading {
        color: white;
    }

.dropzone {
}

.boringAl {
    height: 475px;
    fill: white;
}

.panel-info {
    border: 1px solid #d4d4d4;
}

    .panel-info > .panel-heading {
        cursor: pointer;
        background-color: #ddd;
        color: #584e55;
        padding-top: 15px;
        padding-bottom: 15px;
        border-radius: 4px 4px 0 0;
        border-bottom: 1px solid #d4d4d4;
    }

.menu-item {
    display: inline-flex;
}

.menu-heading {
    margin-right: 10px;
}

.admin-menu-heading {
    margin-left: 10px;
    margin-right: 10px;
}

.admin-menu-sub-heading {
    margin-left: 20px;
    margin-right: 10px;
}

.standardLineHeight {
    line-height: 34px;
}

.standardHeight {
    height: 34px;
}

.centerAlignmentBlock {
    margin-left: auto;
    margin-right: auto;
}

.centerAlignmentText {
    text-align: center;
}

.no-margin {
    margin: 0;
}

.no-margin-important {
    margin: 0 !important;
}

.no-margin-left {
    margin-left: 0;
}

.no-margin-right {
    margin-right: 0;
}

.no-padding {
    padding: 0 !important;
}

.no-padding-left {
    padding-left: 0 !important;
}

.no-padding-right {
    padding-right: 0 !important;
}

.padding-top-5 {
    padding: 5px 0 0 0 !important;
}

.small-margin-bottom {
    margin-bottom: 10px;
}

.medium-margin-bottom {
    margin-bottom: 20px;
}

.extrasmall-margin-right {
    margin-right: 5px;
}

.extrasmall-margin-left {
    margin-left: 5px;
}

.small-margin-right {
    margin-right: 10px;
}

.small-margin-left {
    margin-left: 10px;
}

.medium-margin-right {
    margin-right: 20px;
}

.scrollable-body {
    overflow-y: auto;
    max-height: 600px;
    /*Correction for scroll bar width*/
    width: calc(100% + 18px);
}

.product-sold-radio-outer-container {
    text-align: center;
    border: 1px solid #e7e7e7;
    padding: 10px;
}

.product-sold-radio-container {
    display: table;
    height: 100%;
    width: 100%;
}

.product-sold-radio {
    display: table-cell;
    text-align: center;
}

button.btn.mappingRemoveBtn {
    height: 24px;
    padding-top: 0;
    padding-bottom: 0;
}

.dndPlaceholder {
    list-style: none;
}

ul.dragListRounds {
    height: calc(100% - 10px);
    min-height: 60px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 10px;
    overflow-y: auto;
}

ul.dragList {
    height: calc(100% - 10px);
    min-height: 60px;
    padding-left: 10px;
    padding-top: 10px;
    overflow-y: auto;
}

    ul.dragList .panel {
        margin-bottom: 5px;
    }

.list-border {
    border-radius: 0;
    border-left: 0;
    border-right: 0;
}

.cybakeOnlinePanel {
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
}

    .cybakeOnlinePanel > div.panel-heading {
        color: #333;
        background-color: #f5f5f5;
        padding: 10px 15px;
        border-bottom: 1px solid #ddd;
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
    }

    .cybakeOnlinePanel h1,
    .cybakeOnlinePanel h2,
    .cybakeOnlinePanel h3,
    .cybakeOnlinePanel h4,
    .cybakeOnlinePanel h5,
    .cybakeOnlinePanel h6 {
        display: inline-block;
    }

    .cybakeOnlinePanel > div.panel-body {
        background-color: rgb(255, 255, 255);
        height: 500px; /*temporary*/
        overflow-y: auto;
        padding: 5px;
        font-size: 0.87em;
    }

    .cybakeOnlinePanel.modalPanel > div.panel-body {
        height: 480px;
    }

    .cybakeOnlinePanel > div.panel-body.panel-with-metrics {
        height: 530px;
        padding-bottom: 70px;
    }

    .cybakeOnlinePanel > div.panel-body .editedPanel,
    .cybakeOnlinePanel li.editedPanel {
        background-color: #f0ad4e;
        color: #fff;
    }

    .cybakeOnlinePanel > div.panel-body .selectedPanel,
    .cybakeOnlinePanel li.selectedPanel {
        background-color: #f1b49b;
        color: #fff;
    }

    .cybakeOnlinePanel > div.panel-body .disabledPanel,
    .cybakeOnlinePanel li.disabledPanel {
        background-color: lightgray !important;
        color: #fff;
    }

    .cybakeOnlinePanel > div.panel-body .addedPanel,
    .cybakeOnlinePanel li.addedPanel {
        background-color: #a8de9e;
        color: #fff;
    }

    .cybakeOnlinePanel > div.panel-body .editedPanel,
    .cybakeOnlinePanel li.editedPanel {
        background-color: #dedc71;
        color: #fff;
    }

.selectedEDIPanel {
    background-color: #a8de9e;
    color: #fff;
}

.cybakeOnlinePanel > div.panel-body .deletedPanel,
.cybakeOnlinePanel li.deletedPanel {
    background-color: #e47f7f;
    color: #fff;
}

.cybakeOnlinePanel > div.panel-footer.metrics-footer {
    height: 70px;
    position: absolute;
    bottom: 55px;
    left: 0;
    right: 0;
}

.cybakeOnlinePanel > div.panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.cybakeOnlinePanel > div.panel-body div.panel-body,
.cybakeOnlinePanel ul li {
    padding: 5px 10px;
}

.icon-button {
    padding: 1px 6px;
    margin-left: 2px;
    margin-right: 2px;
}

.full-height {
    height: 100% !important;
}

.disabled-panel {
    background-color: #f5f5f5;
}

.dropzone-icon {
    font-size: 15em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1001;
    pointer-events: none;
}

.error-panel {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    width: 250px;
    z-index: 1000;
    background-color: var(--cybake-orange);
    transition: all 1s;
}

    .error-panel.ng-hide {
        margin-right: -250px;
    }

        .error-panel.ng-hide-remove,
        .error-panel.ng-hide.ng-hide-add-active {
            margin-right: -250px;
            display: block !important;
        }

            .error-panel.ng-hide-add,
            .error-panel.ng-hide-remove.ng-hide-remove-active {
                margin-right: 0;
                display: block !important;
            }

    .error-panel > div {
        z-index: 1000;
        position: fixed;
        margin-top: 50px;
        height: calc(100% - 50px);
        width: 250px;
        color: #fff;
        padding: 10px 5px 0 10px;
        overflow-y: auto;
    }

        .error-panel > div div.panel-body {
            color: #000;
            padding: 5px 10px;
            font-size: 12px;
        }

    .error-panel div.col-md-12 {
        padding: 10px 5px;
    }

    .error-panel div.panel {
        margin-bottom: 5px;
    }

.orange {
    color: orange;
}

.green {
    color: green;
}

.grid-align {
    text-align: center;
}

.large-tooltip .tooltip-inner {
    max-width: 600px !important;
    width: 600px !important;
}

.ui-grid-viewport {
    height: 401px;
}

.products:link, products:visited, products:enabled {
    background-color: red;
}

.admin-overview-panel {
    height: 130px;
}

.admin-overview-panel-lg {
    height: 245px;
}

.panel-header-overview-screens {
    cursor: initial !important;
}

/*@media screen and (max-width: 1919px) {
    .resetPassword {
        margin-left: 110px;
        margin-bottom: 7px;
    }
}

@media screen and (min-width: 1920px) {
    .resetPassword {
        margin-top: 4px;
    }
}*/

/*@media screen and (max-width: 1919px) {
    .loginLabels {
        margin-left: 110px;
        margin-bottom: 7px;
    }
}*/

.productDetailsBtns {
    width: 180px;
}

.companyDetailsBtns {
    width: 175px;
    margin-left: 1px;
}

.addProdShowAllBtn {
    margin-top: 4px;
    background-color: #EFEFEF;
    border-radius: 4px;
    border: 1px solid #D0D0D0;
    overflow: auto;
    float: left;
}

    .addProdShowAllBtn:hover {
        background: #DFF0D8;
        color: black;
    }

    .addProdShowAllBtn label {
        float: left;
        width: 4.0em;
    }

        .addProdShowAllBtn label span {
            text-align: center;
            padding: 3px 0px;
            display: block;
        }

        .addProdShowAllBtn label input {
            position: absolute;
            top: -20px;
        }

    .addProdShowAllBtn input:checked + span {
        background-color: #DFF0D8;
        color: black;
    }

.ui-grid .ui-grid-render-container-body .ui-grid-viewport {
    overflow-x: auto !important;
}

.uniformButtonHeight {
    margin-bottom: 2px;
    margin-left: -5px;
    height: 34px;
}

.productRangingDropDwn {
    width: 190px;
    height: 34px;
}

.prodContainersTable tbody {
    display: block;
    max-height: 160px;
    overflow-y: scroll;
}

    .prodContainersTable thead, .prodContainersTable tbody tr {
        display: table;
        width: 100%;
        table-layout: fixed;
    }

.prodContainersTable thead {
    width: calc(100% - 10px);
}

.prodContainersTable table {
    width: 200px;
}

.backgroundGreen {
    background-color: #65c706;
    background-color: rgba(101, 199, 6, 0.25);
    ;
}

.cybakeOnlinePanel > div.panel-body .addedPanel.warning, .cybakeOnlinePanel li.addedPanel.warning {
    background-color: #ff9999;
    background-color: rgba(255, 155, 155, 0.7);
}

.deleteuser {
    margin-top: -6px;
}

.deletemapping {
    margin-top: -6px;
}

.activelink {
    text-decoration: underline;
    font-style: oblique;
}

.sideActive {
    background-color: rgba(199, 199, 199, 0.22)
}

.alert-red {
    color: red;
    font-weight: 900;
}

.alert-green {
    color: green;
    font-weight: 900;
}

.viewbutton {
    text-align: center;
    margin-top: -2px;
}

.stockViewbutton {
    text-align: center;
    margin-top: -4px;
}

.prouductviewbutton {
    text-align: center;
    margin-top: -2px;
}

.adminviewbutton {
    text-align: center;
    margin-top: -2px;
}

.ml125 {
    margin-left: 125px;
}

.no-price {
    color: orange;
}

.select-date-modal div.modal-dialog div.modal-content {
    width: 350px;
    margin-left: 125px;
}

    .select-date-modal div.modal-dialog div.modal-content div.modal-body {
        margin-left: -125px;
    }

.app-modal-window-xl .modal-dialog {
    width: 1250px;
}



.modal-1200 {
    width: 70% !important;
}

    .modal-1200 .modal-content {
        height: 700px !important;
    }

.modal-1200-audit {
    width: 80% !important;
}

    .modal-1200-audit .modal-content {
        height: 700px !important;
    }

.ui-grid-icon-menu:before {
    font-family: Font Awesome\ 5 Free !important;
    font-weight: 800 !important;
    content: "\f0c9";
    margin-left: .1em;
}

.ui-grid-menu-button .ui-grid-icon-container {
    height: 28px;
}

.ui-grid-menu {
    padding: 0 0 20px 10px;
}

.ui-grid-icon-ok:before {
    font-family: Font Awesome\ 5 Free !important;
    font-weight: 800 !important;
    content: "\f00c";
}

.ui-grid-icon-plus-squared {
    padding: 10px 10px 10px 0;
    cursor: pointer;
}

    .ui-grid-icon-plus-squared:before {
        font-family: Font Awesome\ 5 Free !important;
        font-weight: 800 !important;
        content: "\f067";
        margin-left: 7px;
        cursor: pointer;
    }

.ui-grid-icon-minus-squared {
    padding: 10px 10px 10px 0;
    cursor: pointer;
}

    .ui-grid-icon-minus-squared:before {
        font-family: Font Awesome\ 5 Free !important;
        font-weight: 800 !important;
        content: "\f068";
        margin-left: 7px;
        cursor: pointer;
    }

.edi-import-validation-ui-grid .ui-grid-icon-plus-squared {
    padding: 2px !important;
    cursor: pointer;
}

    .edi-import-validation-ui-grid .ui-grid-icon-plus-squared:before {
        font-family: Font Awesome\ 5 Free !important;
        font-weight: 800 !important;
        content: "\f067";
        margin-left: 0 !important;
        cursor: pointer;
    }

.edi-import-validation-ui-grid .ui-grid-icon-minus-squared {
    padding: 2px !important;
    cursor: pointer;
}

    .edi-import-validation-ui-grid .ui-grid-icon-minus-squared:before {
        font-family: Font Awesome\ 5 Free !important;
        font-weight: 800 !important;
        content: "\f068";
        margin-left: 0 !important;
        cursor: pointer;
    }

.edi-import-imported-ui-grid .ui-grid-icon-plus-squared {
    padding: 2px !important;
    cursor: pointer;
}

    .edi-import-imported-ui-grid .ui-grid-icon-plus-squared:before {
        font-family: Font Awesome\ 5 Free !important;
        font-weight: 800 !important;
        content: "\f067";
        margin-left: 0 !important;
        cursor: pointer;
    }

.edi-import-imported-ui-grid .ui-grid-icon-minus-squared {
    padding: 2px !important;
    cursor: pointer;
}

    .edi-import-imported-ui-grid .ui-grid-icon-minus-squared:before {
        font-family: Font Awesome\ 5 Free !important;
        font-weight: 800 !important;
        content: "\f068";
        margin-left: 0 !important;
        cursor: pointer;
    }

/*.audit-ui-grid .ui-grid-render-container-left .ui-grid-viewport {
    height: 100% !important; 
}*/

/*.audit-ui-grid .ui-grid-scrollbar-placeholder {
    height: 0 !important;
}*/

.audit-ui-grid .scrollFiller {
    /*display: none;*/
}

/* SCREEN SIZES - SCREEN SIZES  - SCREEN SIZES  - SCREEN SIZES  - SCREEN SIZES  - SCREEN SIZES  - SCREEN SIZES  - SCREEN SIZES - SCREEN SIZES */
/*inbetween Screen Sizes*/
/*.screenSizeIndicator {
        background-color: blue;
    }*/
.ndsidebar {
    z-index: 700;
    position: fixed;
    width: 170px;
    height: 100%;
    overflow-y: auto;
    background-color: #fafafa;
    transition: all 0.5s ease;
    padding: 10px 0 0 15px;
    border-right: solid 1px #ddd;
    left: 40px;
    padding-top: 55px;
    padding-bottom: 30px;
}

.editView {
    width: calc(100% - 210px);
}

.main {
    margin-left: 150px;
}

.loginForgotPass {
    text-align: center;
}

.loginInputs {
    width: 100% !important
}

.loginLabels {
    float: left;
    width: 100%;
    padding: 0px;
    text-align: left;
}

#loginbox {
    margin-left: 31%;
    width: 35%;
    float: left;
}

.loginPage {
    margin: 0px 40px 0px 0px !important;
}

.mainSearchBar div {
    width: 150px;
}

.col-md-1 {
    width: 8.33333333%;
}

/*12" Screen Size"*/
@media only screen and (min-width: 1023px) and (max-height: 768px) {
    .mainSearchBar {
        /*background-color: blue;*/
    }
        /*.screenSizeIndicator {
        color: blue;
    }
    .screenSizeIndicatorLogo {
        background-color: blue;
    }*/
        .mainSearchBar div {
            width: 300px;
        }

    .searchProdsStOrders {
        width: 200px;
        margin-right: 0px;
    }

    .stOrdersAddProfileBtn {
        margin-left: -5px;
    }

    .stOrdersAddProfileInput {
        width: 65%
    }

    .stOrdersAddProfileDiv {
        padding-left: 5px;
        padding-right: 5px;
    }

    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 170px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 150px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 210px);
    }

    .main {
        margin-left: 145px;
    }

    .loginBtn {
        width: 100%;
        margin-bottom: 10px;
    }

    .loginForgotPass {
        text-align: center;
    }

    .loginInputs {
        width: 100% !important
    }

    .loginLabels {
        float: left;
        width: 100%;
        padding: 0px;
        text-align: left;
    }

    .sidebar-open {
        width: 220px;
    }

    .showbakeplan {
        margin-top: -110px;
        margin-right: -15px;
    }

    .showorderbake {
        margin-left: 5px;
    }

    .weeklyOrderFooterLine {
        height: 90px !important;
        position: absolute !important;
        width: 43.9% !important;
        padding-top: 20px !important;
        background-color: #f3f3f3 !important;
        border-right: 2px solid #6f6f6f !important;
    }

    .orderByProductSOFooter {
        width: 98% !important;
    }

    .weeklyOrderGridHeader {
        width: 98% !important;
    }

    .homeUsersLogo {
        /*height: 50% !important;*/
    }

    .mainServiceDeskPanel {
        margin-top: -208px !important;
    }

    .homeCyBakeLogo {
        /*height: 38% !important;*/
    }

    .app-modal-window-xl {
        /*width: 1020px;*/
    }

    .firstPanel {
        width: 41%;
    }

    .secondPanel {
        width: 41%;
    }

    .footerButtons {
        margin-right: 220px;
    }
}

/*13" Screen Size"*/
@media screen and (min-width:1279px) and (max-height:800px) {
    .mainSearchBar {
        /*background-color: pink;*/
    }
        /*.screenSizeIndicator {
        color: pink;
    }
    .screenSizeIndicatorLogo {
        background-color: pink;
    }*/
        .mainSearchBar div {
            width: 350px;
        }

    .searchProdsStOrders {
        width: 250px;
        margin-right: 0px
    }

    .stOrdersAddProfileBtn {
        margin-left: -5px;
    }

    .stOrdersAddProfileInput {
        width: 65%
    }

    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 170px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 150px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 210px);
    }

    .main {
        margin-left: 145px;
    }

    .loginBtn {
        width: 100%;
        margin-bottom: 10px;
    }

    .loginForgotPass {
        text-align: center;
    }

    .loginInputs {
        width: 100% !important
    }

    .loginLabels {
        float: left;
        width: 100%;
        padding: 0px;
        text-align: left;
    }

    .sidebar-open {
        width: 220px;
    }

    .showbakeplan {
        width: 270px;
        margin-top: 5px;
    }

    .showorderbake {
        width: 270px;
        margin-left: 15px;
    }

    .defaulttable {
        width: 25%;
    }

    .waveTitles {
    }

    .modalPopupAdjustments {
        margin-left: -145px !important;
    }

    .adjustmentsPopUp {
        width: 108% !important;
    }

    .weeklyOrderFooterLine {
        height: 90px !important;
        position: absolute !important;
        width: 43.9% !important;
        padding-top: 20px !important;
        background-color: #f3f3f3 !important;
        border-right: 2px solid #6f6f6f !important;
    }

    .weeklyOrderGridHeader {
        width: 98% !important;
    }

    .homeUsersLogo {
        /*height: 59% !important;*/
    }

    .mainServiceDeskPanel {
        margin-top: -179px !important;
    }

    .homeCyBakeLogo {
        /*height: 59% !important;*/
    }

    .dateFromPurchase {
        width: 26% !important;
    }

    .dateToPurchase {
        width: 24% !important;
    }

    .orderDelivPurchase {
        width: 25% !important;
    }

    .headShopPurchase {
        width: 25% !important;
    }

    .searchNewOrPurchase {
        margin-top: 5px;
        margin-right: 22px;
    }

    .goodsInDateFrom {
        width: 26% !important;
    }

    .goodsInDateTo {
        width: 27% !important;
    }

    .generateInvoiceMatchButton {
        margin-right: 30px !important;
    }

    .invoiceMatchDateFrom {
        width: 26% !important;
    }

    .invoiceMatchDateTo {
        width: 27% !important;
    }

    .invoiceMatchSelectSup {
        width: 34.9% !important;
    }

    .rbNFL {
        margin-top: -20px !important;
        margin-left: -50px !important;
    }

    #recipe_nutrition_table {
        height: calc(100vh - 315px) !important;
    }
}

/*15" Screen Size"*/
@media screen and (min-width:1365px) and (max-height:768px) {
    .mainSearchBar {
        /*background-color: green;*/
    }
        /*.screenSizeIndicator {
        color: green;
    }
    .screenSizeIndicatorLogo {
        background-color: green;
    }*/
        .mainSearchBar div {
            width: 380px;
        }

    .searchProdsStOrders {
        width: 250px;
        margin-right: 0px
    }

    .stOrdersAddProfileBtn {
        margin-left: -5px;
    }

    .stOrdersAddProfileInput {
        width: 65%
    }

    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 180px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 160px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 220px);
    }

    .main {
        margin-left: 160px;
    }

    #loginbox {
        margin-left: 31%;
        width: 35%;
        float: left;
    }

    .loginBtn {
        width: 30%;
        margin-top: 4px;
    }

    .loginForgotPass {
        float: left;
        margin-top: 10px;
    }

    .loginInputs {
        width: 100% !important;
        margin-bottom: 10px;
    }

    .sidebar-open {
        width: 230px;
    }

    .showbakeplan {
        width: 310px;
        margin-right: -1px;
        margin-top: 5px;
        margin-bottom: 10px;
    }

    .showorderbake {
        margin-left: 15px;
        width: 310px;
    }

    .defaulttable {
        width: 25%;
    }

    .modalPopupAdjustments {
        margin-left: -145px !important;
    }

    .adjustmentsPopUp {
        width: 110% !important;
    }

    .weeklyOrderFooterLine {
        height: 90px !important;
        position: absolute !important;
        width: 43.9% !important;
        padding-top: 20px !important;
        background-color: #f3f3f3 !important;
        border-right: 2px solid #6f6f6f !important;
    }

    .weeklyOrderGridHeader {
        width: 98% !important;
    }

    .homeUsersLogo {
        /*height: 60% !important;*/
    }

    .mainServiceDeskPanel {
        margin-top: -164px !important;
    }

    .homeCyBakeLogo {
        /*height: 53% !important;*/
    }

    .invoiceMatchDateFrom {
        width: 24% !important;
    }

    .invoiceMatchDateTo {
        width: 24% !important;
    }

    .invoiceMatchSelectSup {
        width: 33% !important;
    }

    .rbNFL {
        margin-top: -20px !important;
        margin-left: -40px !important;
    }

    #recipe_nutrition_table {
        height: calc(100vh - 285px) !important;
    }
}

/*19" Screen Size"*/
@media screen and (min-width:1439px) and (max-height:900px) {
    .mainSearchBar {
        /*background-color: black;*/
    }
        /*.screenSizeIndicator {
        color: black;
    }
    .screenSizeIndicatorLogo {
        background-color: black;
    }*/
        .mainSearchBar div {
            width: 400px;
        }

    .searchProdsStOrders {
        width: 250px;
        margin-right: 0px
    }

    .stOrdersAddProfileBtn {
        margin-left: -5px;
    }

    .stOrdersAddProfileInput {
        width: 65%
    }

    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 180px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 160px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 220px);
    }

    .main {
        margin-left: 160px;
    }

    #loginbox {
        margin-left: 31%;
        width: 35%;
        float: left;
    }

    .loginBtn {
        width: 30%;
        margin-top: 4px;
    }

    .loginForgotPass {
        float: left;
        margin-top: 10px;
    }

    .loginInputs {
        width: 100% !important;
        /*		margin-bottom: 10px;*/
    }

    .loginLabels {
        padding: 0px;
    }

    .sidebar-open {
        width: 230px;
    }

    .showbakeplan {
        width: 340px;
        margin-right: -2px;
        margin-top: 5px;
        margin-bottom: 10px;
    }

    .showorderbake {
        width: 340px;
        margin-left: 15px;
    }

    .defaulttable {
        width: 20%;
    }

    .modalPopupAdjustments {
        margin-left: -150px !important;
    }

    .adjustmentsPopUp {
        width: 111% !important;
    }

    .weeklyOrderFooterLine {
        height: 90px !important;
        position: absolute !important;
        width: 43.9% !important;
        padding-top: 20px !important;
        background-color: #f3f3f3 !important;
        border-right: 2px solid #6f6f6f !important;
    }

    .weeklyOrderGridHeader {
        width: 98% !important;
    }


    .mainServiceDeskPanel {
        margin-top: -140px !important;
    }

    .goodsInDateFrom {
        width: 22% !important;
    }

    .goodsInDateTo {
        width: 23% !important;
    }

    .invoiceMatchDateFrom {
        width: 22% !important;
    }

    .invoiceMatchDateTo {
        width: 23% !important;
    }

    .invoiceMatchSelectSup {
        width: 16% !important;
    }

    .rbNFL {
        margin-top: -20px !important;
        margin-left: -40px !important;
    }

    #recipe_nutrition_table {
        height: calc(100vh - 325px) !important;
    }
}

/*20" Screen Size"*/
@media screen and (min-width:1599px) and (max-height:901px) {
    .mainSearchBar {
        /*background-color: orange;*/
    }
        /*.screenSizeIndicator {
        color: orange;
    }
    .screenSizeIndicatorLogo {
        background-color: orange;
    }*/
        .mainSearchBar div {
            width: 430px;
        }

    .searchProdsStOrders {
        width: 250px;
        margin-right: 0px
    }

    .stOrdersAddProfileBtn {
        margin-left: -5px;
    }

    .stOrdersAddProfileInput {
        width: 65%
    }

    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 210px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 190px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 250px);
    }

    .main {
        margin-left: 180px;
    }

    #loginbox {
        margin-left: 31%;
        width: 35%;
        float: left;
    }

    .loginBtn {
        width: 30%;
        margin-top: 4px;
    }

    .loginForgotPass {
        float: left;
        margin-top: 10px;
    }

    .loginInputs {
        width: 100% !important;
        /*		margin-bottom: 10px;*/
    }

    .sidebar-open {
        width: 260px;
    }

    .showbakeplan {
        width: 185px;
        margin-right: 215px;
        margin-top: -65px;
    }

    .showorderbake {
        width: 191px;
        margin-left: 15px;
        margin-top: 20px;
    }

    .modalPopupAdjustments {
        margin-left: -170px !important;
    }

    .adjustmentsPopUp {
        padding: 10px;
        width: 113% !important;
        margin-top: -21px;
        margin-bottom: -10px;
    }

    .weeklyOrderFooterLine {
        height: 90px !important;
        position: absolute !important;
        width: 43.9% !important;
        padding-top: 20px !important;
        background-color: #f3f3f3 !important;
        border-right: 2px solid #6f6f6f !important;
    }

    .weeklyOrderGridHeader {
        width: 98% !important;
    }

    .rbNFL {
        margin-top: -20px !important;
        margin-left: -15px !important;
    }

    #recipe_nutrition_table {
        height: calc(100vh - 325px) !important;
    }
}

/*22" Screen Size"*/
@media screen and (min-width:1680px) and (max-height:1050px) {
    .mainSearchBar {
        /*background-color: gainsboro;*/
    }
        /*.screenSizeIndicator {
        color: gainsboro;
    }
    .screenSizeIndicatorLogo {
        background-color: gainsboro;
    }*/
        .mainSearchBar div {
            width: 460px;
        }

    .profileLists {
        width: 220px;
    }

    .searchProdsStOrders {
        width: 250px;
        margin-right: 0px
    }

    .stOrdersAddProfileBtn {
        margin-left: -5px;
    }

    .stOrdersAddProfileInput {
        width: 65%
    }

    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 240px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 220px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 280px);
    }

    .main {
        margin-left: 220px;
    }

    #loginbox {
        margin-left: 31%;
        width: 35%;
        float: left;
    }

    .loginBtn {
        width: 30%;
        margin-top: 4px;
    }

    .loginForgotPass {
        float: left;
        margin-top: 10px;
    }

    .loginInputs {
        width: 100% !important;
        /*		margin-bottom: 10px;*/
    }

    .loginLabels {
        padding: 0px;
    }

    .loginPage {
        margin: 0px 40px 0px 0px !important;
    }

    .sidebar-open {
        width: 290px;
    }

    .showbakeplan {
        width: 195px;
        margin-top: -65px;
        margin-right: 220px;
    }

    .showorderbake {
        width: 192px;
        margin-left: 15px;
        margin-top: 20px;
    }

    .listCustomer {
    }

    .modalPopupAdjustments {
        margin-left: -170px;
    }

    .adjustmentsPopUp {
        padding: 10px;
        width: 111%;
        margin-top: -21px;
        margin-bottom: -10px;
    }

    .weeklyOrderFooterLine {
        height: 90px !important;
        position: absolute !important;
        width: 43.9% !important;
        padding-top: 20px !important;
        background-color: #f3f3f3 !important;
        border-right: 2px solid #6f6f6f !important;
    }

    .weeklyOrderGridHeader {
        width: 98% !important;
    }

    .goodsInDateFrom {
        width: 20% !important;
    }

    .goodsInDateTo {
        width: 20% !important;
    }

    .invoiceMatchDateFrom {
        width: 19% !important;
    }

    .invoiceMatchDateTo {
        width: 20% !important;
    }

    .rbNFL {
        margin-top: -20px !important;
        margin-left: -15px !important;
    }

    #recipe_nutrition_table {
        height: calc(100vh - 475px) !important;
    }
}

/*23" Screen Size"*/
@media screen and (min-width:1919px) and (max-height:1080px) {
    .mainSearchBar {
        /*background-color: orchid;*/
    }
        /*.screenSizeIndicator {
        color: orchid;
    }
    .screenSizeIndicatorLogo {
        background-color: orchid;
    }*/
        .mainSearchBar div {
            width: 480px;
        }

    .profileLists {
        width: 260px;
    }

    .profileListsLine {
        width: 130px;
    }

    .profileListsAddNew {
        /*padding-right: 0px;*/
        margin-top: 27px;
    }

    .profileListsSearchBox {
        margin-left: -1px;
        margin-top: -1px;
    }

    .searchProdsStOrders {
        width: 250px;
        margin-right: 0px
    }

    .stOrdersAddProfileBtn {
        margin-left: -5px;
    }

    .stOrdersAddProfileInput {
        width: 65%
    }

    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 240px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 220px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 280px);
    }

    .main {
        margin-left: 220px;
    }

    #loginbox {
        margin-left: 31%;
        width: 35%;
        float: left;
    }

    .loginBtn {
        width: 30%;
        margin-top: 4px;
    }

    .loginForgotPass {
        float: left;
        margin-top: 10px;
    }

    .loginInputs {
        width: 100% !important;
        /*		margin-bottom: 10px;*/
    }

    .loginLabels {
        padding: 0px;
    }

    .sidebar-open {
        width: 290px;
    }

    .showorderbake {
        width: 255px;
        margin-left: 15px;
    }

    .showbakeplan {
        width: 240px;
        margin-right: -3px;
        margin-top: -65px;
    }

    .weeklyOrderFooterLine {
        height: 90px !important;
        position: absolute !important;
        width: 43.9% !important;
        padding-top: 20px !important;
        background-color: #f3f3f3 !important;
        border-right: 2px solid #6f6f6f !important;
    }

    .weeklyOrderGridHeader {
        width: 99% !important;
    }

    .rbNFL {
        margin-top: -20px !important;
        margin-left: -15px !important;
    }

    #recipe_nutrition_table {
        height: calc(100vh - 500px) !important;
    }
}

/*24" Screen Size"*/
@media screen and (min-width:1920px) and (max-height:1200px) {
    .mainSearchBar {
        /*background-color: purple;*/
    }
        /*.screenSizeIndicator {
        color: purple;
    }
    .screenSizeIndicatorLogo {
        background-color: purple;
    }*/
        .mainSearchBar div {
            width: 500px;
        }

    .searchProdsStOrders {
        width: 250px;
        margin-right: 0px
    }

    .stOrdersAddProfileBtn {
        margin-left: -5px;
    }

    .stOrdersAddProfileInput {
        width: 65%
    }

    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 240px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 220px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 280px);
    }

    .main {
        margin-left: 220px;
    }

    #loginbox {
        margin-left: 31%;
        width: 35%;
        float: left;
    }

    .loginBtn {
        width: 30%;
        margin-top: 4px;
    }

    .loginForgotPass {
        float: left;
        margin-top: 10px;
    }

    .loginInputs {
        width: 100% !important;
        /*		margin-bottom: 10px;*/
    }

    .loginLabels {
        padding: 0px;
    }

    .sidebar-open {
        width: 290px;
    }

    .showorderbake {
        width: 245px;
        margin-left: 15px;
        margin-top: 40px;
    }

    .showbakeplan {
        width: 245px;
        margin-right: 271px;
        margin-top: -65px;
    }

    .listCustomer {
        cursor: pointer;
    }

    .weeklyOrderGridHeader {
        width: 99% !important;
    }

    .rbNFL {
        margin-top: -20px !important;
        margin-left: -15px !important;
    }

    #recipe_nutrition_table {
        height: calc(100vh - 360px) !important;
    }
}

/*Above Screen Sizes*/
@media only screen and (min-width: 1920px) and (min-height: 1081px) {
    /*.screenSizeIndicator {
        background-color: red;
    }
    .screenSizeIndicatorLogo {
        background-color: red;
    }*/
    .ndsidebar {
        z-index: 700;
        position: fixed;
        width: 240px;
        height: 100%;
        overflow-y: auto;
        background-color: #fafafa;
        transition: all 0.5s ease;
        padding: 10px 0 0 15px;
        border-right: solid 1px #ddd;
        left: 40px;
        padding-top: 55px;
    }

    .angular-hybrid-screen {
        margin-left: 220px;
        margin-right: -15px;
        padding-top: 4px;
    }

    .editView {
        width: calc(100% - 280px);
    }

    .main {
        margin-left: 220px;
    }

    .sidebar-open {
        width: 290px;
    }

    .showorderbake {
        width: 245px;
        margin-left: 15px;
        margin-top: 40px;
    }

    .showbakeplan {
        width: 245px;
        margin-right: 272px;
        margin-top: -65px;
    }

    .rbNFL {
        margin-top: -20px !important;
        margin-left: -15px !important;
    }

    #recipe_nutrition_table {
        height: calc(100vh - 625px) !important;
    }
}

@media only screen and (min-width: 1200px) {
    .visible-1200 {
        display: block !important;
    }

    .hidden-1200 {
        display: none !important;
    }
}

@media only screen and (min-width: 1400px) {
    .visible-1400 {
        display: block !important;
    }

    .hidden-1400 {
        display: none !important;
    }
}

@media only screen and (max-width: 1205px) {
    .fontsize-1205 {
        font-size: 13px;
    }
}

@media screen and (min-width:1588px) and (max-width:1599px) {
    .categoryPanelHeaderTwoLines {
        padding: 10px 15px !important;
    }

    .categoryPanelHeaderBtnTwoLines {
        margin-top: 0px !important;
    }
}

@media only screen and (min-width:1600px) and (max-width: 1608px) {
    .categoryPanelHeaderTwoLines {
        padding: 2px 15px !important;
    }

    .categoryPanelHeaderBtnTwoLines {
        margin-top: 7px !important;
    }
}

@media only screen and (max-width: 1587px) {
    .categoryPanelHeaderTwoLines {
        padding: 2px 15px !important;
    }

    .categoryPanelHeaderBtnTwoLines {
        margin-top: 7px !important;
    }
}

/* END SCREEN SIZES - END SCREEN SIZES  - END SCREEN SIZES  - END SCREEN SIZES  - END SCREEN SIZES  - END SCREEN SIZES  - END SCREEN SIZES  */

.editView {
    height: 45px;
    padding: 5px;
    position: fixed;
    z-index: 1000;
    top: 50px;
    right: 0;
}

.editViewMargin {
    margin-top: 25px;
}

.profileListsAddNewEditedFalse {
    padding-top: 7px;
}


.rangeClearCal {
    margin-left: -5px;
    margin-top: -2px;
}

.clearCal {
    margin-left: -5px;
}

.rangeSelectCal {
    margin-right: -5px;
    margin-top: -2px;
}

.selectCal {
    margin-right: -5px;
}

.fa-gbp-custom {
    text-align: center;
    font-size: 23px;
}

.fa-question-custom {
    margin-left: 1px;
    font-size: 23px;
}

.dropdownfind {
    margin-top: 20px;
}

.productgroupscnlay {
    margin-left: 20px;
    margin-top: 1px;
}

.dropdownmanagestandingorder {
    margin-left: 10px;
    height: 34px;
}

.no-rows-dbl-list {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
}

    .no-rows-dbl-list .msg {
        opacity: 1;
        position: absolute;
        top: 20%;
        left: 20%;
        width: 60%;
        line-height: 200%;
        background-color: #eee;
        border-radius: 4px;
        border: 1px solid #555;
        text-align: center;
        font-size: 18px;
        display: table;
    }

        .no-rows-dbl-list .msg span {
            display: table-cell;
            vertical-align: middle;
        }

.ui-grid-viewport {
    overflow-anchor: none;
}

.productAvailable {
    width: 400px;
    margin-left: 250px
}

.availablecheckbox {
    margin-left: 53px;
}

.productAvailableturefalse {
    border: 1px solid #CCCCCC;
    margin-top: 5px;
}

.screenLocking tbody tr td {
    width: 33.3%;
}

.screenLocking tbody tr th {
    width: 33.3%;
}

.timeinput tbody tr td {
    width: auto;
}

.timeinput tbody tr th {
    width: auto;
}

.grid-align-margin {
    margin-left: 25px;
}

.company-warning div.ui-grid-cell {
    background-color: #ff9999 !important;
}

.btn-output {
    line-height: 0.9;
}

.disabled-events {
    pointer-events: all !important;
}

.forcasting-grid .ui-grid-render-container-body .ui-grid-viewport {
    overflow: hidden !important;
}

.forcasting-grid {
    height: 72px !important;
}

.stockcover-grid .ui-grid-render-container-body .ui-grid-viewport {
    overflow: hidden !important;
}

.stockcover-grid {
    height: 40px !important;
}

.forecastingtxt {
    margin-bottom: -10px;
    margin-right: 435px;
    margin-top: -5px;
}

.gridforecasting {
    margin-top: -25px !important;
    width: 100%;
    height: 100%;
}

.viewOrderCalendar {
    margin-top: -450px;
    margin-left: 335px !important;
}

.viewOrderGrid {
    height: 595px !important;
}

.gridViewCustomerOrder {
    height: 650px !important;
}

.viewCustInfo {
    margin-top: -5px;
}

.chevCom {
    font-size: 13px;
    margin-top: 6px;
    margin-right: 23px;
}


.branding-text-color-btn-whte {
    background-color: white;
    border: 1px solid black;
    border-radius: 5px !important;
    width: 4vh;
    height: 4vh;
}

.branding-text-color-btn-blck {
    background-color: black;
    border: 1px solid black;
    border-radius: 5px !important;
    width: 4vh;
    height: 4vh;
}

.color_black {
    color: black;
}

.categoriesList {
    font-size: 15px;
    font-family: inherit;
    font-weight: bold;
}

/*.underlineTxt:hover {
    text-decoration: underline !important;
}*/

.grid-wrap-text .ui-grid-cell-contents {
    white-space: normal;
    overflow-y: auto;
}

.p-l-10 {
    padding-right: 10px;
}
/* COLUMNS */
.col-fixed-100, .col-fixed-rem-100, .col-fixed-150, .col-fixed-rem-150, .col-fixed-200, .col-fixed-rem-200, .col-fixed-250, .col-fixed-rem-250, .col-fixed-300, .col-fixed-rem-300, .col-fixed-350, .col-fixed-rem-350, .col-fixed-400, .col-fixed-rem-400, .col-fixed-450, .col-fixed-rem-450, .col-fixed-500, .col-fixed-rem-500, .col-fixed-550, .col-fixed-rem-550, .col-fixed-600, .col-fixed-rem-600, .col-fixed-650, .col-fixed-rem-650 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left;
}

.col-fixed-100 {
    width: 100px;
}

.col-fixed-rem-100 {
    width: calc(100% -100px);
}

.col-fixed-150 {
    width: 150px;
}

.col-fixed-rem-150 {
    width: calc(100% - 150px);
}

.col-fixed-200 {
    width: 200px;
}

.col-fixed-rem-200 {
    width: calc(100% - 200px);
}

.col-fixed-250 {
    width: 250px;
}

.col-fixed-rem-250 {
    width: calc(100% - 250px);
}

.col-fixed-300 {
    width: 300px;
}

.col-fixed-rem-300 {
    width: calc(100% - 300px);
}

.col-fixed-350 {
    width: 350px;
}

.col-fixed-rem-350 {
    width: calc(100% - 350px);
}

.col-fixed-400 {
    width: 400px;
}

.col-fixed-rem-400 {
    width: calc(100% - 400px);
}

.col-fixed-450 {
    width: 450px;
}

.col-fixed-rem-450 {
    width: calc(100% - 450px);
}

.col-fixed-500 {
    width: 500px;
}

.col-fixed-rem-500 {
    width: calc(100% - 500px);
}

.col-fixed-550 {
    width: 550px;
}

.col-fixed-rem-550 {
    width: calc(100% - 550px);
}

.col-fixed-600 {
    width: 600px;
}

.col-fixed-rem-600 {
    width: calc(100% - 600px);
}

.col-fixed-650 {
    width: 650px;
}

.col-fixed-rem-650 {
    width: calc(100% - 650px);
}

/* END OF COLUMNS*/

.margin-0 {
    margin: 0 !important;
}

.col-padding-15 > .col-sm-1, .col-padding-15 > .col-sm-2, .col-padding-15 > .col-sm-3, .col-padding-15 > .col-sm-4, .col-padding-15 > .col-sm-5, .col-padding-15 > .col-sm-6, .col-padding-15 > .col-sm-7, .col-padding-15 > .col-sm-8, .col-padding-15 > .col-sm-9, .col-padding-15 > .col-sm-10, .col-padding-15 > .col-sm-11, .col-padding-15 > .col-sm-12, .col-padding-15 > .col-md-1, .col-padding-15 > .col-md-2, .col-padding-15 > .col-md-3, .col-padding-15 > .col-md-4, .col-padding-15 > .col-md-5, .col-padding-15 > .col-md-6, .col-padding-15 > .col-md-7, .col-padding-15 > .col-md-8, .col-padding-15 > .col-md-9, .col-padding-15 > .col-md-10, .col-padding-15 > .col-md-11, .col-padding-15 > .col-md-12, .col-padding-15 > .col-lg-1, .col-padding-15 > .col-lg-2, .col-padding-15 > .col-lg-3, .col-padding-15 > .col-lg-4, .col-padding-15 > .col-lg-5, .col-padding-15 > .col-lg-6, .col-padding-15 > .col-lg-7, .col-padding-15 > .col-lg-8, .col-padding-15 > .col-lg-9, .col-padding-15 > .col-lg-10, .col-padding-15 > .col-lg-11, .col-padding-15 > .col-lg-12 {
    padding: 15px;
}


.daysOfWeekDropDown {
    height: 40px;
    margin-left: 10px
}

.checkboxMakeActive {
    width: 80px;
    height: 40px;
    margin-top: 20px;
}

.bakeDropDown {
    height: 40px;
}

.wavesDates {
    text-align: center;
}

.waveStartWaveEnd {
    margin-top: 60px;
    margin-left: 10px;
}


.alert-lookup {
    padding: 5px;
    border: 1px solid transparent;
    margin-bottom: 0;
    border-radius: 4px;
}

.ta-text.ta-editor.form-control {
    min-height: 200px;
    height: auto;
}

    .ta-text.ta-editor.form-control > div.ng-pristine.ng-valid.ta-bind {
        min-height: 200px;
        height: auto;
    }

    .ta-text.ta-editor.form-control > div.ta-bind {
        min-height: 200px;
        height: auto;
    }


.details-menu-item {
    padding-bottom: 5px;
    padding-top: 15px;
    border-bottom: 1px solid lightgray;
    cursor: pointer;
    transition: all 0.1s ease-in;
}

    .details-menu-item:hover {
        -webkit-transform: scale(1.1); /* Safari and Chrome */
        -moz-transform: scale(1.1); /* Firefox */
        -ms-transform: scale(1.1); /* IE 9 */
        -o-transform: scale(1.1); /* Opera */
        transform: scale(1.1);
        font-weight: 600;
    }

.subMenuItems {
    transition: all 0.1s ease-in;
}

    .subMenuItems:hover {
        -webkit-transform: scale(1.1); /* Safari and Chrome */
        -moz-transform: scale(1.1); /* Firefox */
        -ms-transform: scale(1.1); /* IE 9 */
        -o-transform: scale(1.1); /* Opera */
        transform: scale(1.1);
    }


.details-menu-item-first {
    padding-top: 8px;
}

.details-menu-item-last {
    padding-bottom: 15px;
    padding-top: 15px;
    border-bottom: 1px solid #d3d3d300;
    cursor: pointer;
}

.details-menu-item-icon {
    font-size: 10px;
}

.bold {
    font-weight: 600;
}

.waveProfileAlertDiv {
    color: red;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 0px;
    padding: 6px;
}

.inactiveWaveLine {
    color: grey;
    font-style: italic;
}

.inactiveWaveLineTimes {
    display: none;
    color: grey;
    font-style: italic;
}

.ui-grid-menu-button {
    width: 18px;
}

.messagePanelTitle {
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 210px;
    /* display: inline; */
    white-space: nowrap;
    /* overflow: hidden; */
    text-overflow: ellipsis;
    margin-top: 5px;
    font-weight: bold;
}

.messagePanelSelected {
    background-color: #dadada;
}

.yes-no-group .btn {
    width: 60px;
}

.yes-no-group-80px .btn {
    width: 80px;
}

.yes-no-group-120px .btn {
    width: 120px;
}

.yes-no-group-50percent .btn {
    width: 50%;
}

.yes-no-group-no-width .btn {
}

.yes-only {
    background-color: rgb(223, 240, 216) !important;
}

    .yes-only.active, .yes-only.focus, .yes-only:active, .yes-only:focus, .yes-only:hover {
        color: #333;
        background-color: rgb(223, 240, 216) !important;
        border-color: #adadad;
    }

.btn-group .btn-default.active, .btn-group .btn-default.focus, .btn-group .btn-default:active, .btn-group .btn-default:focus {
    background-color: rgb(223, 240, 216);
}

.yes-no-group .yes.btn-default.active, .yes.btn-default.focus, .yes.btn-default:active, .yes.btn-default:focus {
    background-color: rgb(223, 240, 216);
}

.yes-no-group .no.btn-default.active, .no.btn-default.focus, .no.btn-default:active, .no.btn-default:focus {
    background-color: rgba(232, 78, 15, 0.22);
}

.yes-no-group-80px .yes.btn-default.active, .yes.btn-default.focus, .yes.btn-default:active, .yes.btn-default:focus {
    background-color: rgb(223, 240, 216);
}

.yes-no-group-80px .no.btn-default.active, .no.btn-default.focus, .no.btn-default:active, .no.btn-default:focus {
    background-color: rgba(232, 78, 15, 0.22);
}

.yes-no-group-120px .yes.btn-default.active, .yes.btn-default.focus, .yes.btn-default:active, .yes.btn-default:focus {
    background-color: rgb(223, 240, 216);
}

.yes-no-group-120px .no.btn-default.active, .no.btn-default.focus, .no.btn-default:active, .no.btn-default:focus {
    background-color: rgba(232, 78, 15, 0.22);
}

.yes-no-group-50percent .yes.btn-default.active, .yes.btn-default.focus, .yes.btn-default:active, .yes.btn-default:focus {
    background-color: rgb(223, 240, 216);
}

.yes-no-group-50percent .no.btn-default.active, .no.btn-default.focus, .no.btn-default:active, .no.btn-default:focus {
    background-color: rgba(232, 78, 15, 0.22);
}

.yes-no-group-no-width .no.btn-default.active, .no.btn-default.focus, .no.btn-default:active, .no.btn-default:focus {
    background-color: rgba(232, 78, 15, 0.22);
}

.yes-no-group-no-width .yes.btn-default.active, .yes.btn-default.focus, .yes.btn-default:active, .yes.btn-default:focus {
    background-color: rgb(223, 240, 216);
}

.yes-no-group-no-width .no.btn-default.active, .no.btn-default.focus, .no.btn-default:active, .no.btn-default:focus {
    background-color: rgba(232, 78, 15, 0.22);
}

.active-toggle-button {
    background-color: rgb(223, 240, 216);
}

.orderByProduct3RowHdr {
    text-align: center;
    border-bottom: 1px solid #d4d4d4;
    padding: 5px;
}

.disabledUiGridCell {
    background-color: #d4d4d4;
    color: #7d7d7d;
    font-style: italic;
}

.disabledUiGridCellLight {
    background-color: #eeeeee;
    color: #7d7d7d;
    font-style: italic;
}

.orderByProdGridCellBorderRight {
    border-right: 2px solid #6f6f6f;
}

.orderByProdGridCellBorderLeft {
    border-left: 1px solid #6f6f6f;
}

.ui-grid-footer-panel {
    height: auto !important;
}

.orderByProdGridCellTransparent {
    background-color: transparent !important;
}

/*.ui-grid-canvas {
    padding-top: 0px;
}*/

.btn-separated {
    margin-right: 5px;
}

.weeklyOrdersSelectedColumn {
    background-color: #337ab7;
    color: white;
    border-top: 1px solid #d4d4d4;
}

.orderByProdCell {
    margin-right: 0px;
    margin-left: 0px;
    padding: 0;
}

.orderByProdCellContents {
    padding: 5px 0;
}

.orderByProdHeader {
    height: 96px;
    padding: 0 !important;
}

.orderByProdHeaderDay {
    position: absolute;
    width: 200%;
    border-right: 1px solid #d4d4d4;
}

.orderByProdHeaderQty {
    margin-right: 0px;
    margin-left: 0px;
    padding: 0;
    margin-top: 64px;
}

.orderByProdCellQty {
    border-right: 1px solid #d4d4d4;
    padding: 5px 0;
}

.orderByProdHeaderDay {
    position: absolute;
    width: 200%;
    border-right: 1px solid #d4d4d4;
}

.orderByProductDate {
    margin-top: 32px;
    position: absolute;
    width: 200%;
    text-align: center;
}

.orderByProdHeaderCellSO {
    border-right: 1px solid #d4d4d4;
    padding: 5px 0;
}

.orderByProductSOHeader {
    height: 96px;
    padding: 0 !important;
    border-right: 2px solid #6f6f6f;
}

.orderByProductQtyFooter {
    height: 30px !important;
    border-right: 1px solid #d4d4d4;
}

.orderByProductTotalFooter {
    height: 30px !important;
    position: absolute;
    width: 7.894%;
    border-top: 1px solid #d4d4d4;
}

.orderByProductSOFooter {
    border-right: 2px solid #6f6f6f;
}

.orderByProductSOFooterNone {
    display: none;
}

.no-rows-with-footer {
    margin-bottom: -1px;
}

.no-rows-retail-stock-screens {
    margin-bottom: -3px;
}

.modal-400 {
    width: 400px;
}

.ordersByProductMsgSpan {
    padding: 0 5px;
}

.margin-top-40-percent {
    margin-top: 40%;
}

.recipeInfoPanelRowPadding {
    margin-bottom: 5px;
}

.no-data-panel {
    height: 250px;
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
}

    .no-data-panel .msg {
        opacity: 1;
        position: absolute;
        top: 100px;
        left: 20%;
        width: 60%;
        line-height: 200%;
        background-color: #eee;
        border-radius: 4px;
        border: 1px solid #555;
        text-align: center;
        font-size: 22px;
        display: table;
    }

        .no-data-panel .msg span {
            display: table-cell;
            vertical-align: middle;
        }

.dropdown-top-rounds .dropdown-menu {
    max-height: 450px;
    overflow-y: auto;
    min-width: 495px;
    left: 0px !important;
    bottom: 100% !important;
    top: auto !important;
    margin-left: 15px;
}

.dropdown-top .dropdown-menu {
    max-height: 450px;
    overflow-y: auto;
    min-width: 495px;
    left: 0px !important;
    bottom: 100% !important;
    top: auto !important;
}

.scrollable-dropdown-menu .dropdown-menu {
    max-height: 450px;
    overflow-y: auto;
    min-width: 100%;
}

.modalPopupAdjustments {
    margin-left: -210px;
}

.adjustmentsPopUp {
    padding: 10px;
    width: 117%;
    margin-top: -21px;
    margin-bottom: -10px;
}

.modalPopupAdjustmentSave {
}

.no-rows-content-only-weekly {
    margin-top: 130px;
    margin-bottom: 60px;
}

.ui-grid-header-cell {
    height: 0;
}

.modal-backdrop {
    height: 10000px;
}

.noPadding {
    padding: 0px;
}

.btnSpacingRight {
    margin-right: 5px
}

.productDopdownSearchNoResults {
    padding: 4px;
    background-color: #dddddd;
    border: 1px solid #999999;
}

.productDopdownSearchBtnsContainer {
    padding: 2px 0px 0px 0px;
}

.productDopdownSearchBtns {
    margin-top: -2px;
}

.productDopdownSearchContainer {
    padding: 0px 0px 0px 15px;
}

.modal-800 {
    width: 800px;
}

.modal-1200-px {
    width: 1200px;
}

.modal-1100 {
    width: 1100px;
}

.modal-750 {
    width: 750px;
}

.modal-600 {
    width: 600px;
}

.modal-900 {
    width: 900px;
}

.modal-1100-outputs {
    width: 1100px;
    margin: 16px auto;
}

.modal-1175-outputs {
    width: 1175px;
    margin: 16px auto;
}

.modal-1305-outputs {
    width: 1305px;
    margin: 16px auto;
}

.no-padding-right {
    padding-right: 0px;
}

.no-padding-left {
    padding-left: 0px;
}

.supplier-products-hr {
    margin-top: 0px;
    margin-bottom: 11px;
}

.supplier-products-zebra {
    background-color: #FAFAFA;
}

.supplier-products-border-top {
    border-top: 1px lightgray solid;
    padding-top: 10px;
    padding-bottom: 10px;
}

.Percent80Width {
    width: 80% !important;
}

.Percent15Width {
    width: 15% !important;
}

.Percent10Width {
    width: 10% !important;
}

.Percent63Width {
    width: 63% !important;
}

.nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:focus, .nav-tabs.nav-justified > .active > a:hover {
    font-weight: bold;
}

.nav-tabs.nav-justified > .inactive > a, .nav-tabs.nav-justified > .inactive > a:focus, .nav-tabs.nav-justified > .inactive > a:hover {
    background-color: #fafafa;
    border: 1px solid #eee;
    color: #777;
}

.bold {
    font-weight: bold;
}

.purchaseOrderGrid {
    height: 655px !important;
    margin-top: -25px !important;
}

/*#viewAdjustmentGrid {
    height: 700px !important;
}*/

.even-style {
    background-color: #f9f9f9;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.disabledDropdown {
    background-color: #fff;
    border-color: #ccc;
    /* color: #ccc; */
    pointer-events: none;
    cursor: not-allowed;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: .65;
}

.error-panel-grey {
    position: fixed;
    right: 0;
    top: 0;
    bottom: 0;
    width: 250px;
    z-index: 1000;
    background-color: #fafafa;
    transition: all 1s;
    border-left: 1px solid #dddddd;
}

.popover-title {
    width: 100%;
}

.rounds-panel {
    width: 14%;
}

.days-panel {
    width: 14%;
}

.daysMsg {
    z-index: 1;
    margin-left: 15px;
    margin-bottom: 10px;
    width: 98%;
}

.daysPanelFirst {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.daysPanelLast {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.daysSelectedPanel {
    background-color: #337ab7 !important;
    color: white !important;
}

.unselectable {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */
}

.roundsSelectedPanel {
    background-color: #337ab7 !important;
    color: white !important;
}

.roundDoubleSelectedPanel {
    background-color: #ef5350 !important;
    color: black !important;
}

.noBorderRadius {
    border-radius: 0px;
}

.roundsPanelFirst {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.roundsPanelLast {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.brandingOutputsLogoExample {
    float: left;
    height: 130px;
    padding: 15px 15px;
    font-size: 18px;
    line-height: 20px;
    width: 100%;
}

.brandingSelectFileButton {
    text-align: center;
    box-sizing: border-box;
    border: 1px solid #9a9a9a;
    border-radius: 6px !important;
    font-size: 15px;
    padding: 4px;
    cursor: pointer;
}

#prodCatGroups_conflictingChanges_panel {
    margin-top: 60px;
    padding: 10px;
}

#custCatGroups_conflictingChanges_panel {
    margin-top: 60px;
    padding: 10px;
}

.roundsMsg {
    z-index: 1;
    margin-left: 15px;
    margin-bottom: 10px;
    width: 98%;
}

.roundsDisabledPanel {
    background-color: #eeeeee !important;
}

#searchOrders_categories_container {
    /*display: inline-flex;
    padding-right: 0px;
    margin-right: 15px;
    width: 31%;*/
}

.order_accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 10px;
    width: 100%;
    border: none;
    text-align: center;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

/*.active, .order_accordion:hover {
    background-color: #ccc;
}*/

.order_panel {
    padding: 0 18px;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

.oneOffPriceCell {
    color: red;
}

    .oneOffPriceCell .tooltip {
        overflow: visible;
        z-index: -1;
    }

.cheaperSuppliersCell {
    color: purple;
    font-weight: 900;
}

    .cheaperSuppliersCell .tooltip {
        overflow: visible;
        z-index: -1;
    }

.specialPricePriceCell {
    color: orange;
}

    .specialPricePriceCell .tooltip {
        overflow: visible;
        z-index: -1;
        padding: 10px;
    }

.cellToolTip {
    overflow: visible;
    z-index: -1;
}

.unselectable {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */
}

.orderingOverviewNoOrderLine {
    color: #777;
    font-style: italic;
}

.searchOrders_deleteAllOrders_btn {
    top: -76px !important
}

.textOnInvoice {
    resize: none !important;
    height: 155px !important;
}

.textOnDeliveryNote {
    resize: none !important;
    height: 155px !important;
}

.specialPriceGrid {
    height: 485px !important;
}

.orderInfoRowPadding {
    padding: 6px 0px;
}

.dailyOrderDeletedOrderAlert {
    margin-bottom: 0;
    width: 85%;
    padding-left: 5px;
    padding-right: 3px;
    text-align: center;
}

.hidden {
    display: none;
}

/*table, th, td {
    border: 1px solid #dddddd;
    border-collapse: collapse;
}*/

.highlightedDiscountRow {
    background-color: #5cb85c;
}

.highlightedDeliveryChargeRow {
    background-color: #5cb85c;
}

.deleteSpecialPriceListLine {
    margin-top: -1px;
    margin-left: 9px;
}

.orderPricePopover .popover-content {
    padding: 0px
}

.vatRegCheckBox {
    transform: scale(3.0);
    margin-top: 12px !important;
}

#mainMenu_export_icon {
    margin-left: -3px;
}

#mainMenu_pricing_icon {
    margin-left: -2px;
}

#mainMenu_home_icon {
    margin-left: -2px;
}

#mainMenu_companies_icon {
    margin-left: -3px;
}

#mainMenu_order_icon {
    font-size: 1.8em;
}

.adjustmentsPopUpGoBtn {
    margin-top: -3px;
}

.tooltipFormatId .tooltipText {
    visibility: hidden;
    width: 120px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 20px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 76%;
    margin-left: -60px;
    opacity: 0;
    transition: opacity 0.3s;
}

    .tooltipFormatId .tooltipText::after {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: #555 transparent transparent transparent;
    }

.tooltipFormatId:hover .tooltipText {
    visibility: visible;
    opacity: 1;
}

.priceListOnlinePanel {
    margin-bottom: 20px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05) !important;
    box-shadow: 0 1px 1px rgba(0,0,0,.05) !important;
}

    .priceListOnlinePanel > div.panel-body {
        background-color: rgb(255, 255, 255);
        height: 500px; /*temporary*/
        overflow-y: auto;
        padding: 5px;
        font-size: 12px;
    }

.priceListGroupItems {
    position: relative;
    display: block;
    padding: 5px 5px;
    margin-bottom: -1px;
    background-color: #fff;
    border: 1px solid #ddd;
}

.priceListOnlinePanel > div.panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.priceListOnlinePanel > div.panel-body div.panel-body,
.priceListOnlinePanel ul li {
    padding: 5px 5px;
}

.panelBodyCusPrice {
    padding: 5px !important;
    font-size: 12px !important;
    height: 350px !important;
}

.panel-heading.collapsed span {
    display: inline-block;
    -ms-transform: rotate(180deg); /* IE 9 */
    -moz-transform: rotate(180deg); /* Firefox */
    -webkit-transform: rotate(180deg); /* Safari and Chrome */
    -o-transform: rotate(180deg);
    float: right !important;
    margin-top: 5px !important;
    font-size: 1em !important;
}

.introJsProductsActiveProduct {
    width: 600px;
    max-width: 600px !important;
}

.deliveryNoteViewTable {
    width: 100%;
}

.addProfileButton {
    margin-bottom: 4px;
    word-wrap: break-word;
    width: 100%;
    white-space: normal !important;
}

.Percent100Width {
    width: 100%;
}

.Percent50Width {
    width: 50%;
}

.Percent33Width {
    width: 33.33333333%;
}

.ryanSearchNoResults {
    padding: 4px;
    background-color: #dddddd;
    border: 1px solid #999999;
    cursor: pointer;
}

.ryanSearchClearDiv {
    cursor: pointer;
}

#dailyOrder_customerSelect_div {
    padding-left: 0px;
    width: 30%;
}

#ordersByProduct_customerSelect_div {
    padding-left: 0px;
    width: 40%;
}

#dailyOrder_productSelect_div {
    width: 33%;
}

#weeklyOrder_customerSelect_div {
    padding-left: 0px;
    width: 50%;
}

#weeklyOrder_productSelect_div {
    width: 32%;
}

#ordersByProduct_productSelect_dropdown {
    width: 47%;
    padding-left: 0px;
}

.standard_margin_right {
    margin-right: 5px;
}

input.pw {
    -webkit-text-security: disc;
}

.modal-1300 {
    width: 1300px !important;
}

.boxedLabelGrey {
    width: 50%;
    padding-left: 0px;
    height: 34px;
    border: 1px solid #cccccc;
    padding: 5px;
    overflow: hidden;
    text-align: center;
    background-color: #eee;
}

.boxedLabel {
    width: 50%;
    padding-left: 0px;
    height: 34px;
    border: 1px solid #cccccc;
    padding: 5px;
    overflow: hidden;
    text-align: center
}

/*Credit Notes Screen*/

.creditNotes-UIGrid-msg {
    padding: 0 10px;
}

/* UI GRID SPLIT HEADING */
.splitHeadingHeader {
    height: 64px;
    padding: 0;
}

.splitHeadingHeaderRow {
    text-align: center;
    border-bottom: 1px solid #d4d4d4;
    padding: 5px;
}

.splitHeadingSplitHeaderHeader {
    position: absolute;
    width: 200%;
    border-right: 1px solid #d4d4d4;
}

.splitHeadingHeaderHeader {
    position: absolute;
    width: 100%;
    border-right: 1px solid #d4d4d4;
}

.splitHeadingHeaderSubHeader {
    margin-right: 0px;
    margin-left: 0px;
    padding: 0;
    margin-top: 32px;
}

.splitHeadingSideHeader {
    height: 64px;
    padding: 0;
    border-right: 1px solid #d4d4d4;
}

.splitHeadingCellContent {
    border-right: 1px solid #d4d4d4;
    padding: 5px 0;
}

.padding2px {
    padding: 2px;
}

.adjustment-popup {
    margin-right: 5px;
    margin-left: 5px;
}

.outputAddItemRemoveBtn {
    height: 31px;
    margin-top: -6px;
    border-right: none;
    background-color: #f2dede;
    width: 30px;
}

.outputAddBoxMargin {
    margin-top: 23px
}

.outputDropdown {
    max-width: 30%;
}

/*.outputsInactiveFilterTab {
    background-color: #eeeeee;
    border: 1px solid #dddddd;
    border-radius: 4px 4px 0 0;
}

.outputTabs > .ng-isolate-scope > .nav-tabs > li > a {
    margin-right: 0px;
}*/

#priceList_div {
    padding: 10px;
}

#priceLists_panels_container {
    box-shadow: none !important;
    position: relative
}

#priceLists_decimalIncrease_dropdown {
    width: 65px;
}

.cursor-pointer {
    cursor: pointer;
}

.cursor-pointer-important {
    cursor: pointer !important;
}

.half-width-important {
    width: 50% !important;
}

.third-width-important {
    width: 50% !important;
}

.wrap-row {
    white-space: normal;
}

.header5 {
    display: block;
    font-size: 1em;
    margin-top: 1.67em;
    margin-bottom: 1.67em;
    margin-left: 0;
    margin-right: 0;
}

.panel-header5 {
    display: block;
    font-size: 1em;
    margin-top: 5px;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}

.panel-body-h5 {
    display: block;
    font-size: 1.13em;
    margin-top: 5px;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}

.cat-groups-help-btns {
    width: 2.66em;
    height: 2.46em;
}

.screenreader_text {
    /*text visible by screenreaders only, doesn't affect page layout*/
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    width: 1px;
    overflow: hidden;
    position: absolute !important;
    word-wrap: normal !important;
}

.screen_reader_text {
    /*text visible by screenreaders only, doesn't affect page layout*/
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    width: 1px;
    overflow: hidden;
    position: absolute !important;
    word-wrap: normal !important;
}

.releaseNotesBorder {
    height: 93%;
    overflow: auto;
}

/*.releaseNotesBorder::-webkit-scrollbar {
        display: none;
    }*/


.screenreader_label {
    display: unset;
}

.screen_reader_label {
    display: unset;
}

.title-help-button {
    margin-top: 20px;
    /*margin-bottom: 10px;*/
}

.hr-half-margin {
    margin-top: 10px;
    margin-bottom: 10px;
}

.ml-10px {
    margin-left: 10px;
}

.color-white {
    color: white;
}

/* Embeded Reports */

.powerbi-frame {
    margin: 0 0 3rem 0;
    height: 800px;
}

.powerbi-frame-dashboard {
    margin: 0 0 3rem 0;
    height: 800px;
}


.powerbi-frame iframe {
    border: none;
}


[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}

.no-border {
    border: none;
}

.no-border-right {
    border-right: none !important;
}

.popup-grid {
    height: 300px;
}

.popup-title {
    padding: 5px 15px;
}

.popup-body {
    padding: 10px 15px;
}

.popup-panel-header {
    padding: 5px 9px;
}

.popup-panel-body {
    padding: 10px 15px 0px 15px;
}

.popup-footer {
    padding: 9px 15px;
}

.order-note-preview {
    border: 1px solid #ccc;
    height: 155px;
    overflow: auto;
}

.loading-order-note {
    text-align: center;
    display: block;
    margin-top: 65px;
}

.order-note-span {
    white-space: pre-wrap;
}

.orders-deleted-order {
    color: red;
    /*background-color: #fad8ca !important;*/
}

.accountancy-connection {
    float: right;
    border-radius: 25px;
    font-size: 14px;
    padding: 10px;
}

.accountancy-connection-connected {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.accountancy-connection-disconnected {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.btn-quickbooks {
    padding-top: 0px;
    padding-right: 5px;
    padding-bottom: 0px;
    padding-left: 5px;
    background-color: #2c9f1c;
    color: white;
    width: 182px;
    height: 27px
}

    .btn-quickbooks:hover {
        background-color: #2c9f1c;
        color: white;
    }

    .btn-quickbooks:active {
        background-color: #2c9f1c;
        color: white;
    }

    .btn-quickbooks img {
        height: 20px
    }

.btn-sage {
    padding-top: 0px;
    padding-right: 5px;
    padding-bottom: 0px;
    padding-left: 5px;
    background-color: #00D736;
    color: white;
    width: 182px;
}

    .btn-sage:hover {
        background-color: #00D736;
        color: white;
    }

    .btn-sage:focus {
        background-color: #00D736;
        color: white;
    }

    .btn-sage:active {
        background-color: #00D736;
        color: white;
    }

    .btn-sage img {
        height: 20px;
        padding-top: 2px;
    }

.productImage .icon-image {
    height: 100%;
    width: 100%;
    margin-top: 0;
}

.companyImage .icon-image {
    height: 100%;
    width: 100%;
    margin-top: 0;
}

.goodsInGrid {
    height: 650px;
}

/*Recipe Screen*/

.claim-no-description {
    margin-top: 10px;
}

.recipe-spec-textarea {
    resize: none !important;
}

.box-message-background {
    background: rgba(0, 0, 0, 0.4);
    height: 350px;
}

.box-message-background-small {
    background: rgba(0, 0, 0, 0.4);
    height: 100px;
}

.alert-null-recipe {
    color: #333333;
    background-color: #efefef;
    border-color: #eeeeee;
}

/*Recipe Screen End*/

.InvoiceMatchGoodsInGrid.ui-grid-viewport {
    height: 350px;
}

.InvoiceMatchesGrid.ui-grid-viewport {
    height: 350px;
}

.vertically-center-right-align {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: right !important;
}

.vertically-center-left-align {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: left !important;
}

.inline-box {
    border: 1px solid #cccccc;
    padding: 5px;
    overflow: hidden;
    background-color: #eeeeee;
}

}

.no-shadow {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.cybakeOnlinePanel > div.loading-panel {
    background-color: rgba(211, 211, 211, 0.3215686274509804);
}

.loading-panel {
    background-color: rgba(211, 211, 211, 0.3215686274509804);
}

.selected-panel-list-item {
    background-color: grey;
}

.list-group-item:last-child .selected-panel-list-item {
    background-color: grey;
    border-bottom-left-radius: 4px;
}

.list-group-item:first-child .selected-panel-list-item {
    background-color: grey;
    border-top-left-radius: 4px;
}

.unselected-panel-list-item {
    background-color: transparent;
}

.list-group-item:last-child .unselected-panel-list-item {
    background-color: transparent;
    border-bottom-left-radius: 4px;
}

.list-group-item:first-child .unselected-panel-list-item {
    background-color: transparent;
    border-top-left-radius: 4px;
}

.list-group-item:last-child .panel-list-item-button-bottom {
    border-bottom-right-radius: 4px !important;
}

.list-group-item:first-child .panel-list-item-button-top {
    border-top-right-radius: 4px !important;
}

.list-group-item:first-child {
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
}

.list-group-item.with-margin:last-child {
}

.ediSetupGrid {
    height: 90% !important;
    margin-top: 10px
}

.ediSetupGridEdited {
    height: calc(90% - 45px) !important;
    margin-top: 10px
}

.ediSetupTradingPartnerPanel {
    height: calc(100% - 40px) !important;
}

.ediSetupTradingPartnerPanelEdited {
    height: calc(100% - 60px) !important;
}

.viewGoodsInGrid {
    height: 670px;
}

.tooltip {
    pointer-events: none;
}

selectedDropdownItem {
    background-color: red;
    color: red;
}

.productionGrid {
    height: 615px !important;
}

/*.hexagon {
    position: relative;
    background-color: #64C7CC;
}

    .hexagon:before, .hexagon:after {
        content: " ";
        position: absolute;
        border-top: 30px solid transparent;
        border-bottom: 30px solid transparent;
    }

    .hexagon:before {
        left: 100%;
        border-left: 30px solid #64C7CC;
    }*/

.stepper {
    display: flex;
    padding: 0;
    list-style: none;
    position: relative;
}

    .stepper::before {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        content: "";
        width: calc(100%);
        background: palegreen;
        /*background: #ccc;*/
    }

.first-stepper {
    display: flex;
    padding: 0;
    list-style: none;
    position: relative;
}

    .first-stepper::before {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        content: "";
        width: calc(100%);
        background: red;
    }

.stepper__item {
    flex: 100%;
    padding: 14px 20px 15px 40px;
    /*background: repeating-linear-gradient(-65deg, #fff, #fff 20px, #fcfcfc 20px, #fcfcfc 40px);*/
    margin: 0 -15px 0 0;
    -webkit-clip-path: polygon(20px 50%, 0% 0%, calc(100% - 20px) 0%, 100% 50%, calc(100% - 20px) 100%, 0% 100%);
}

    .stepper__item.inactive {
        background-color: #eee;
        /*font-weight: bold;*/
        font-size: 17px;
    }

    .stepper__item.current {
        background: #fff;
        font-weight: bold;
        font-size: 17px;
    }

    .stepper__item.complete {
        /*background: repeating-linear-gradient(-65deg, #fcfcfc, #fcfcfc 20px, #f4faf7 20px, #f4faf7 40px);*/
        background: #28f72863;
        font-weight: bold;
        font-size: 17px;
    }

    .stepper__item:first-child {
        padding: 20px;
        -webkit-clip-path: polygon(0% 0%, calc(100% - 20px) 0%, 100% 50%, calc(100% - 20px) 100%, 0% 100%);
        background: red;
    }

    .stepper__item:last-child {
        -webkit-clip-path: polygon(20px 50%, 0% 0%, 100% 0%, 100% 100%, 0% 100%);
        margin-right: 0;
    }

.edi-file-upload-drop-box {
    background: #F8F8F8;
    border: 5px dashed #DDD;
    text-align: center;
    padding: 35% 10px;
    height: 600px;
}

.md-stepper-vertical {
    display: table;
    width: 100%;
    margin: 0 auto;
    background-color: #FFFFFF;
}

    .md-stepper-vertical .md-step {
        display: table-cell;
        position: relative;
        padding: 0;
    }

        .md-stepper-vertical .md-step:hover,
        .md-stepper-vertical .md-step:active {
            background-color: rgba(0,0,0,0.04);
        }

        .md-stepper-vertical .md-step:active {
            border-radius: 15% / 75%;
        }

        .md-stepper-vertical .md-step:first-child:active {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }

        .md-stepper-vertical .md-step:last-child:active {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
        }

        .md-stepper-vertical .md-step:hover .md-step-circle {
            background-color: #757575;
        }

        /*.md-stepper-vertical .md-step:first-child .md-step-bar-left,
        .md-stepper-vertical .md-step:last-child .md-step-bar-right {
            display: none;
        }*/

        .md-stepper-vertical .md-step .md-step-circle {
            width: 30px;
            height: 30px;
            margin: 0 auto;
            background-color: #999999;
            border-radius: 50%;
            text-align: center;
            line-height: 30px;
            font-size: 16px;
            font-weight: 600;
            color: #FFFFFF;
        }

    .md-stepper-vertical.green .md-step.active .md-step-circle {
        background-color: #00AE4D;
    }

    .md-stepper-vertical.orange .md-step.active .md-step-circle {
        background-color: #F96302;
    }

    .md-stepper-vertical .md-step.active .md-step-circle {
        background-color: rgb(33,150,243);
    }

    .md-stepper-vertical .md-step .md-step-title {
        margin-top: 35px;
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 10px;
    }

    .md-stepper-vertical .md-step .md-step-title,
    .md-stepper-vertical .md-step .md-step-optional {
        text-align: center;
        color: rgba(0,0,0,.26);
    }

    .md-stepper-vertical .md-step.active .md-step-title {
        font-weight: 600;
        color: rgba(0,0,0,.87);
    }

    .md-stepper-vertical .md-step.active.done .md-step-title,
    .md-stepper-vertical .md-step.active.editable .md-step-title {
        font-weight: 600;
    }

    .md-stepper-vertical .md-step .md-step-optional {
        font-size: 12px;
    }

    .md-stepper-vertical .md-step.active .md-step-optional {
        color: rgba(0,0,0,.54);
    }

    .md-stepper-vertical .md-step .md-step-bar-left,
    .md-stepper-vertical .md-step .md-step-bar-right {
        position: absolute;
        top: 16px;
        height: 1px;
        border-top: 1px solid #DDDDDD;
    }

    .md-stepper-vertical .md-step .md-step-bar-right {
        right: 0;
        left: 50%;
        margin-left: 20px;
    }

    .md-stepper-vertical .md-step .md-step-bar-left {
        left: 0;
        right: 50%;
        margin-right: 20px;
    }

.md-stepper-horizontal {
    display: table;
    width: 100%;
    margin: 0 auto;
    background-color: #FFFFFF;
    box-shadow: 0 3px 8px -6px rgba(0,0,0,.50);
}

    .md-stepper-horizontal .md-step {
        display: table-cell;
        position: relative;
        padding: 0;
    }

        .md-stepper-horizontal .md-step:hover,
        .md-stepper-horizontal .md-step:active {
            background-color: rgba(0,0,0,0.04);
        }

        .md-stepper-horizontal .md-step:active {
            border-radius: 15% / 75%;
        }

        .md-stepper-horizontal .md-step:first-child:active {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }

        .md-stepper-horizontal .md-step:last-child:active {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
        }

        .md-stepper-horizontal .md-step:hover .md-step-circle {
            background-color: #757575;
        }

        .md-stepper-horizontal .md-step:first-child .md-step-bar-left,
        .md-stepper-horizontal .md-step:last-child .md-step-bar-right {
            display: none;
        }

        .md-stepper-horizontal .md-step .md-step-circle {
            width: 30px;
            height: 30px;
            margin: 0 auto;
            background-color: #999999;
            border-radius: 50%;
            text-align: center;
            line-height: 30px;
            font-size: 16px;
            font-weight: 600;
            color: #FFFFFF;
        }

    .md-stepper-horizontal.green .md-step.active .md-step-circle {
        background-color: #00AE4D;
    }

    .md-stepper-horizontal.orange .md-step.active .md-step-circle {
        background-color: #F96302;
    }

    .md-stepper-horizontal .md-step.active .md-step-circle {
        background-color: rgb(33,150,243);
    }

    .md-stepper-horizontal .md-step .md-step-title {
        margin-top: 16px;
        font-size: 16px;
        font-weight: 600;
    }

    .md-stepper-horizontal .md-step .md-step-title,
    .md-stepper-horizontal .md-step .md-step-optional {
        text-align: center;
        color: rgba(0,0,0,.26);
    }

    .md-stepper-horizontal .md-step.active .md-step-title {
        font-weight: 600;
        color: rgba(0,0,0,.87);
    }

    .md-stepper-horizontal .md-step.active.done .md-step-title,
    .md-stepper-horizontal .md-step.active.editable .md-step-title {
        font-weight: 600;
    }

    .md-stepper-horizontal .md-step .md-step-optional {
        font-size: 12px;
    }

    .md-stepper-horizontal .md-step.active .md-step-optional {
        color: rgba(0,0,0,.54);
    }

    .md-stepper-horizontal .md-step .md-step-bar-left,
    .md-stepper-horizontal .md-step .md-step-bar-right {
        position: absolute;
        top: 16px;
        height: 1px;
        border-top: 1px solid #DDDDDD;
    }

    .md-stepper-horizontal .md-step .md-step-bar-right {
        right: 0;
        left: 50%;
        margin-left: 20px;
    }

    .md-stepper-horizontal .md-step .md-step-bar-left {
        left: 0;
        right: 50%;
        margin-right: 20px;
    }

.color_green {
    color: green !important;
    background-color: green !important;
}

.m-auto {
    margin: auto;
}

.d-inline-block {
    display: inline-block;
}

.d-flex {
    display: flex;
}

.d-block {
    display: block;
}

.ryan-search-loading-div {
    border: 1px solid #ccc;
    background-color: #eeeeee;
}

.ryan-search-loading-spinner {
    width: 20px;
}

.specialOrder_step1_height {
    height: 400px;
}

.specialOrder_step2_height {
    height: 500px;
    overflow: hidden;
    transition: transform 0.3s ease-out;
    transform: scaleY(1);
    transform-origin: top;
}

.specialOrder_step3_height {
    height: 475px;
}

.underlineTxt:hover {
    text-decoration: underline;
}

.selectedText {
    text-decoration: underline;
    font-weight: bold;
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.modal-backdrop {
    width: calc(100% + 500px);
}

.specialOrders-grid .ui-grid-viewport .ui-grid-cell-contents {
    word-wrap: break-word;
    white-space: normal !important;
}

.specialOrders-grid .ui-grid-row-header-cell {
    display: block !important;
}

.specialOrders-grid .ui-grid-tree-header-row .ui-grid-row-header-cell {
    display: block !important;
}

.specialOrders-grid .ui-grid-row .ui-grid-cell {
    height: auto !important;
}

.specialOrders-grid .ui-grid-row div[role=row] {
    display: flex;
    align-content: stretch;
    height: 100%
}

.validationErrors-grid .ui-grid-viewport .ui-grid-cell-contents {
    word-wrap: break-word;
    white-space: normal !important;
}

.validationErrors-grid .ui-grid-row-header-cell {
    display: block !important;
}

.validationErrors-grid .ui-grid-tree-header-row .ui-grid-row-header-cell {
    display: block !important;
}

.validationErrors-grid .ui-grid-row .ui-grid-cell {
    height: auto !important;
}

.validationErrors-grid .ui-grid-row div[role=row] {
    display: flex;
    align-content: stretch;
}

.basketListGroup {
    padding: 5px 5px;
}

.basketInputGroup {
    width: 50px;
    height: 20px;
    float: right;
    border: none;
    box-shadow: none;
    border-bottom: 1px solid;
}

.basketInput {
    height: 20px;
    width: 90%;
}

table#basketTable {
    border: none !important;
    margin-bottom: 5px !important;
    border-collapse: collapse !important;
}

.basketContainer {
    height: 140px;
    max-height: 140px;
    overflow: auto;
}

.productOverviewGrid {
    height: 680px !important;
}

.reportOverviewGrid {
    height: 1000px !important;
}

.backToOverviewBtn {
    animation: shadow-pulse 1.1s infinite;
    animation-iteration-count: 7;
}

@keyframes shadow-pulse {
    0% {
        box-shadow: 0px 0 0 0px rgba(0,0,0,0.2);
    }

    100% {
        box-shadow: 0px 0 0 5px rgba(0,0,0,0)
    }
}

.roundTempPan {
    max-height: 73%;
}

.hide-spinners input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    /*-webkit-appearance: none;*/
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.hide-spinners input[type=number] {
    -moz-appearance: textfield; /* Firefox */
}

.padding-10 {
    padding: 10px;
}

.margin-right-5 {
    margin-right: 5px;
}

.smallMainMenuIcons .mainMenuIcons {
    padding: 5px;
    font-size: 0.87em;
}

.smallMainMenuIcons #mainMenu_order_icon {
    padding: 5px;
    font-size: 0.87em;
}

.userGroupMenuItem {
    height: 36px;
}

/* Home */
.home-panel-container-8 {
    height: calc(100% - 220px);
    position: absolute;
}

.home-panel-container-4 {
    height: calc(100% - 220px);
    position: absolute;
    width: 29.5%;
}

/* Home - Logo */
.home-logo-container {
    height: 60%;
    padding-left: 0;
}

    .home-logo-container .panel {
        height: 100%;
        border: 0;
        box-shadow: 0 0;
        padding-bottom: 10px;
    }

.home-default-logo {
    background: url('https://cybake.com/wp-content/themes/cgit-cybake/images/cybake-logo-rev-4.svg') no-repeat center center;
    background-color: var(--cybake-orange);
    border-radius: 35px;
}

.home-users-logo {
    background-size: contain;
}

/* Home - Service Desk */
.home-service-desk-container {
    padding-left: 0;
}

.home-service-desk-item {
    margin: 1em 0;
}

/* Home - Quick Links */
.home-quick-links-container {
    position: fixed;
    bottom: 5px;
}

.home-quick-link {
    z-index: 20;
    line-height: 56px;
    min-width: 0;
    width: 56px;
    height: 56px;
    vertical-align: middle;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
    border-radius: 50%;
    background-clip: padding-box;
    overflow: hidden;
    background-color: var(--cybake-orange);
    text-align: center;
    display: inline-block;
    margin-right: 15px;
}

    .home-quick-link:hover {
        transition-timing-function: ease;
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1);
        font-weight: 600;
        background-color: #4CAF50;
    }

    .home-quick-link:focus {
        transition-timing-function: ease;
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1);
        font-weight: 600;
        background-color: #4CAF50;
        outline: 0;
    }

    .home-quick-link span {
        font-size: 2em;
        color: white;
        margin-top: 12px;
        margin-left: 5px
    }

.homeReleaseList {
    overflow: auto;
    overflow-x: hidden;
    margin-bottom: 10px;
    max-height: 100%
}

.transparent-btn {
    background-color: transparent;
    color: transparent;
    border-color: transparent;
}

    .transparent-btn:hover {
        background-color: transparent;
        color: transparent;
        border-color: transparent;
    }

.preview-mode-index-styling {
    margin: 0;
    height: calc(100% - 98px);
}

.normal-index-styling {
    margin: 50px 15px 0 60px;
    height: calc(100% - 98px);
}

    .normal-index-styling:has(cybake-login) {
        margin: 0px 0px 0px 0px !important;
        height: 100vh !important;
    }

    .normal-index-styling:has(cybake-mfa) {
        margin: 0px 0px 0px 0px !important;
        height: 100vh !important;
    }

    .normal-index-styling:has(cybake-auth-callback) {
        margin: 0px 0px 0px 0px !important;
        height: 100vh !important;
    }

    .normal-index-styling:has(cybake-forgotten-password) {
        margin: 0px 0px 0px 0px !important;
        height: 100vh !important;
    }

    .normal-index-styling:has(cybake-reset-password) {
        margin: 0px 0px 0px 0px !important;
        height: 100vh !important;
    }

.products-containers-table .container-type-columns {
    width: 85px;
}

.products-containers-table .container-edit-delete {
    width: 50px;
}

.products-containers-table .border-right {
    border-right: 1px solid black;
}

.pulseButton {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
    transform: scale(1);
    animation: pulse-button 1.5s infinite;
}

@keyframes pulse-button {
    0% {
        box-shadow: 0 0 0 0 #3FBF3F;
    }

    70% {
        box-shadow: 0 0 0 10px rgba(255, 121, 63, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 121, 63, 0);
    }
}

.ui-grid-row {
    clear: both !important;
    display: block !important;
}

.table-scroll tr:first-child > th {
    position: sticky;
    top: 0;
}

.removeSpinners[type=number]::-webkit-inner-spin-button,
.removeSpinners[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.removeSpinners[type=time]::-webkit-inner-spin-button,
.removeSpinners[type=time]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.container-3PFIa {
    padding-right: 0 !important;
}

.Icon-2SEmO {
    padding-right: 0 !important;
}

.icon-3E9qF {
    padding-right: 0 !important;
}

.label-3kk12 {
    display: none !important;
}

#order_selectAddress_newAddress_addressTypes_table {
    padding: 10px 0;
}

.p-5px {
    padding: 5px;
}

.table-border-standard {
    border: 1px solid #cccccc;
}

.w-50 {
    width: 50%;
}

.w-25 {
    width: 25%;
}

.fs-15px {
    font-size: 15px;
}

.fs-16px {
    font-size: 16px;
}

.mb-10px {
    margin-bottom: 10px;
}

.w-200px {
    width: 200px;
}

.order-selectAddress-creatingAddressLoader-div {
    height: 350px;
    text-align: center;
    display: flex;
    background-color: #eeeeee;
}

#stockTakesGrid {
    height: 660px !important;
}

.item-modal .modal-dialog {
    width: 350px !important;
}

.locationInput.ng-touched.ng-invalid.ng-dirty {
    border-color: red;
}

.addCustomer-loader {
    border: 3px solid #f3f3f3;
    border-radius: 50%;
    border-top: 3px solid #3498db;
    width: 20px;
    height: 19px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
    margin-top: 1px;
    float: right;
}

.addCustomer-saving-div-success {
    color: #3c763d !important;
    background-color: #dff0d8 !important;
    border-color: #d6e9c6 !important;
}

.addCustomer-saving-div-inProgress {
    color: #8a6d3b !important;
    background-color: #fcf8e3 !important;
    border-color: #faebcc !important;
}

.addCustomer-saving-div-failed {
    color: #fff !important;
    background-color: #d9534f !important;
    border-color: #d43f3a !important;
}

.font-underline {
    text-decoration: underline !important;
}

.ml-5px {
    margin-left: 5px;
}

.mr-5px {
    margin-right: 5px;
}

.unselectable-table-cell {
    background-color: #ddd;
    cursor: not-allowed;
}

input.invalid-postcode {
    background-color: pink !important;
    border: 1px solid red !important;
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.businessViewButton {
    border-radius: 17px !important;
    width: 100px !important;
    background-color: #47c9db !important;
    border-color: #47c9db !important;
}

.selectScroll {
    max-height: 645px;
    overflow-y: scroll;
}

    .selectScroll::-webkit-scrollbar {
        width: 6px;
    }

.addNewCustomer-rounds-deliveryTimes-tableRow input[type=time]::-webkit-clear-button {
    display: none;
}

.addNewCustomer-rounds-deliveryTimes-tableRow input[type=time]::-ms-clear {
    display: none;
}

.addNewCustomer-rounds-deliveryTimes-tableRow input::-webkit-outer-spin-button,
.addNewCustomer-rounds-deliveryTimes-tableRow input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.addNewCustomer-rounds-deliveryTimes-tableRow input[type=time] {
    -moz-appearance: textfield;
}

.addNewCustomer-roundstable-table .addNewCustomer-roundstable-tbody {
    display: block;
    max-height: 363px;
    overflow-y: scroll;
}

.addNewCustomer-roundstable-table .addNewCustomer-roundstable-thead, .addNewCustomer-roundstable-tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.addNewCustomer-roundstable-table .addNewCustomer-roundstable-thead {
    width: 100%;
}

.redBorder {
    border: 1px solid red;
    border-color: red;
}

.labourGrid {
    height: 325px !important;
}

.overheadGrid {
    height: 325px !important;
}

.recipeLabourGrid {
    height: 250px !important;
}

.recipeOverheadGrid {
    height: 250px !important;
}

.searchButton {
    border: 1.4px solid #9E9E9E;
    background: #EEEEEE;
}

.input-group-addon-left {
    border-top-left-radius: 4px !important;
    border-bottom-left-radius: 4px !important;
}

.no-rows-loading-spinner-style {
    display: block;
    width: 40px;
    margin: auto
}

.purchaseOrderRequired {
    border-color: orange;
}

.purchaseOrderEntered {
    border-color: green;
}

.pr-7-5px {
    padding-right: 7.5px;
}

.pl-7-5px {
    padding-left: 7.5px;
}

.input-addon-text-box {
    border: 1px solid #cccccc;
    padding: 5px;
    overflow: hidden;
    background-color: #eeeeee;
}

.pt-3px {
    padding-top: 3px;
}

.h-31px {
    height: 31px;
}

#pickingSearch_pickingList_uiGrid {
    height: calc(100vh - 280px) !important;
}

.d-inline-grid {
    display: inline-grid;
}

.align-items-end {
    align-self: end;
}

.input-addon-text-styling {
    padding: 5px 10px;
    border: 1px solid #cccccc;
    border-left: none;
}

#pickingHeader_pickingList_uiGrid {
    height: calc(100vh - 225px);
}

.w-20 {
    width: 20%;
}

.btn-transparent {
    background-color: transparent;
    border-color: transparent;
    color: inherit;
}

    .btn-transparent:hover {
        background-color: transparent;
        border-color: transparent;
        color: inherit;
    }

    .btn-transparent:focus {
        background-color: transparent;
        border-color: transparent;
        color: inherit;
    }

.fs-1-4em {
    font-size: 1.4em;
}

.h-100 {
    height: 100%;
}

}

.resizeNone {
    resize: none !important;
}

.pr-standard {
    padding-right: 15px;
}

.pl-standard {
    padding-left: 15px;
}

.mr-standard {
    margin-right: 15px;
}

.ml-standard {
    margin-left: 15px;
}

.no-rows .grid-msg {
    opacity: 1;
    position: absolute;
    top: 20%;
    left: 20%;
    width: 60%;
    height: 50%;
    line-height: 200%;
    background-color: #eee;
    border-radius: 4px;
    border: 1px solid #555;
    text-align: center;
    font-size: 24px;
}

.center-grid-msg {
    top: 35%;
    position: relative;
}

.mb-3 {
    margin-bottom: 1rem;
}

.mt-3 {
    margin-top: 1rem;
}

.mt-3px {
    margin-top: 3px;
}

.bi-report-expanded {
    height: calc(100% + 23px);
}

.bi-report-collapsed {
    height: 230px;
}

.bi-report-desc-expanded {
    height: 100%;
}

.bi-report-desc-collapsed {
    height: 100px;
}

.bi-report-repeat .bi-report-panel:last-child {
    margin-bottom: 0px !important;
}

/*Orders Screen Responsiveness*/

@media (max-width: 767px) {

    #searchOrders_dateFrom_container {
        color: blue;
    }

    #searchOrders_dateTo_container {
    }

    #searchOrders_allCustomersToggle_container {
    }

    #searchOrders_documentNumberToggle_container {
    }

    #searchOrders_waveSelect {
    }

    #searchOrders_orderStatues_container {
    }
}

@media (min-width: 768px) {

    #searchOrders_dateFrom_container {
        padding-bottom: 5px;
    }

    #searchOrders_dateTo_container {
        padding-left: 7.5px !important;
        padding-bottom: 5px;
    }

    #searchOrders_allCustomersToggle_container {
        padding-left: 0 !important;
        padding-bottom: 5px;
    }

    #searchOrders_documentNumberToggle_container {
        padding-bottom: 5px;
    }

    #searchOrders_waveSelect {
        padding-left: 0 !important;
    }

    #searchOrders_orderStatues_container {
    }
}

@media (min-width: 992px) and (max-width: 1399px) {

    #searchOrders_dateFrom_container {
        width: 33.33333333% !important;
        padding-bottom: 5px !important;
    }

    #searchOrders_dateTo_container {
        width: 33.33333333% !important;
        padding-left: 7.5px !important;
        padding-bottom: 5px !important;
    }

    #searchOrders_allCustomersToggle_container {
        width: 33.33333333% !important;
        padding-bottom: 5px !important;
    }

    #searchOrders_documentNumberToggle_container {
        width: 33.33333333% !important;
        padding-left: 0 !important;
    }

    #searchOrders_waveSelect {
        width: 33.33333333% !important;
    }

    #searchOrders_orderStatues_container {
        width: 33.33333333% !important;
    }
}

.add-new-customer-delivery-times input[type="time"]::-webkit-calendar-picker-indicator {
    display: none;
}

.mt-save {
    margin-top: 45px;
}

.deliveries-grid {
    height: calc(100vh - 300px) !important;
}

.deliveries-grid-savebar {
    height: calc(100vh - 345px) !important;
}

.myShop-products-grid {
    height: calc(100vh - 490px) !important;
}

.myShop-products-grid-savebar {
    height: calc(100vh - 515px) !important;
}

.returns-grid {
    height: calc(100vh - 300px) !important;
}

.returns-grid-savebar {
    height: calc(100vh - 345px) !important;
}

.waste-grid {
    height: calc(100vh - 300px) !important;
}

.waste-grid-savebar {
    height: calc(100vh - 345px) !important;
}

.transfers-grid {
    height: calc(100vh - 300px) !important;
}

.transfers-grid-savebar {
    height: calc(100vh - 345px) !important;
}

.retailOrder-grid {
    height: calc(100vh - 300px) !important;
}

.retailOrder-grid-savebar {
    height: calc(100vh - 345px) !important;
}

.default-page-padding {
    padding: 10px 10px 0 10px;
}

#deliveries_dateSelect_btn {
    width: 38px;
}

#deliveries_productSelectNoResult_container {
    margin-top: -66px;
}

.disableUi {
    background: lightgrey;
    opacity: 0.7;
}

.alert-primary {
    color: black;
    background-color: #cce5ff7a;
    border-color: #b8daff;
}

.chartContainer {
    height: 350px;
}

.chart {
    font-family: Arial, sans-serif;
    font-size: 12px;
}

.axis path, .axis line {
    fill: none;
    stroke: #000;
    shape-rendering: crispEdges;
}

.bar {
    fill: #8ec89a;
}

.barDropped {
    fill: rgb(169, 68, 66);
}

input:disabled,
.tableDataDisabled {
    background-color: #eee !important;
}

.areaManage-panelBody-height {
    height: calc(100vh - 220px) !important;
}

.areaManage-panelBody-search-height {
    height: calc(100vh - 275px) !important;
}

.areaManage-panelBody-addedInfo-height {
    height: calc(100vh - 328px) !important;
}

.disabledTab {
    cursor: no-drop;
}

.wasteTarget-table {
    height: calc(100vh - 525px) !important;
}

.wasteTarget-table-edited {
    height: calc(100vh - 550px) !important;
}

#wasteTargets .tooltip {
    width: 500px;
}

#wasteTargets .tooltip-inner {
    max-width: 500px;
}

#addNewCustomer_deliveryTimes_tableRow #reset-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.click_and_collect_shop_uiGrid {
    height: calc( 100vh - 785px) !important;
}

.tabnav {
    color: black;
    text-decoration: none !important;
}

    .tabnav:hover {
        color: #007ad9;
    }


.navbar-logo {
    width: 120px;
    padding-top: 10px;
}

.myShop-B2BProducts-grid {
    height: calc(100vh - 485px) !important;
}

.myShop-B2BProducts-grid-savebar {
    height: calc(100vh - 510px) !important;
}

.myShop-B2BCompanie-grid {
    height: calc(100vh - 485px) !important;
}

.myShop-B2BCompanie-grid-savebar {
    height: calc(100vh - 510px) !important;
}

}

.uib-timepicker.error tbody {
    border: 1px solid red;
}

.uib-timepicker.slim .uib-time input {
    width: 35px;
}

.uib-timepicker.slim .am-pm .btn {
    padding: 0;
    height: 34px;
    width: 35px;
}

.myShop-b2cProducts-grid-savebar {
    height: calc(100vh - 460px) !important
}

.myShop-b2cProducts-grid {
    height: calc(100vh - 435px) !important
}

#mainMenu_purhasing_icon {
    padding: 10px 10px 10px 7px !important;
}

.vertically-center {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.grid-empty-message {
    background-color: #eee;
    border-radius: 4px;
    border: 1px solid #555;
    text-align: center;
    font-size: 24px;
    width: 60%;
    padding: 10px;
}

.no-methods-background {
    background: rgba(0, 0, 0, 0.4);
}

.selectedRecipeProduct {
    background-color: #5cb85c;
    color: white;
}

#copyRecipeInformation_library_input {
    border-color: #cccccc;
}

#copyRecipeInformation_searchText_inputGroup .input-group-addon {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

#copyRecipeInformation_searchText_inputGroup .input-addon-div {
    width: 70px;
}

#copyRecipeInformation_products_div {
    border: 1px solid rgb(204, 204, 204);
    border-radius: 1px;
    height: 300px;
    overflow-y: auto
}

    #copyRecipeInformation_products_div .copyRecipeInfo-emptyMsg-div {
        background: rgb(0 0 0 / 21%);
        font-size: 1.2em;
    }

#copyRecipeInformation_copyInfo_btn {
    width: 200px;
}

.error {
    border: 1px solid red;
}

.rbNFL {
    margin-top: -20px;
    margin-left: -30px;
}

#recipe_nutrition_table {
    height: 575px;
}

.rateOfSaleStockCoverGrid {
    height: 200px !important;
}

    .rateOfSaleStockCoverGrid .msg {
        top: 30% !important;
    }

.recipeAlibiStatementTextbox {
    resize: none !important;
    height: 155px !important;
}

.btn-expand, btn-expand:focus, btn-expand.active {
    background-color: none;
    border: none;
    font-size: 17px;
    height: 22px;
    padding: 0 5px;
}

.pulseInput {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
    transform: scale(1);
    animation: pulse-input 1.5s infinite;
}

@keyframes pulse-input {
    0% {
        box-shadow: 0 0 0 0 #FF0000;
    }

    70% {
        box-shadow: 0 0 0 10px rgba(255, 121, 63, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 121, 63, 0);
    }
}

.mainSearchGrid {
    height: 630px !important;
}

.alert-disabled {
    color: black;
    background-color: #f9f9f9;
    border-color: #f9f9f9;
}

/*// CyBake 2 Styling //*/

.geocode-map-overlay {
    height: 500px;
    position: absolute;
    z-index: 99999;
    font-weight: 600;
    background-color: #dee2e6;
    opacity: .85;
    font-size: 1.3em;
    width: calc(100% - 30px);
}

.cybake2 .manageVehicleAssetsPanel .p-panel-content {
    height: calc(100vh - 191px) !important;
}

.cybake2 .manageVehicleAssetsPanelWithSearch .p-panel-content {
    height: calc(100vh - 244px) !important;
}

#vehicleStockTake_table_empty_div {
    height: calc(100vh - 277px) !important;
}

#vehicleDespatch_table_empty_div {
    height: calc(100vh - 277px) !important;
}

.vehicle-assets-content-height {
    height: calc(100vh - 178px) !important;
}

.cybake2 .page-content {
    height: calc(100vh - 119px) !important
}

    .cybake2 .page-content.integrations-page-info {
        height: 200px !important;
    }

    .cybake2 .page-content.integrations-page-content {
        height: calc(100vh - 320px) !important;
    }

.cybake2 .order-adjustments-page-content-popup {
    height: calc(100vh - 190px) !important;
    background: none !important;
}

#addVehicle_summary_div {
    margin: 0 !important;
}

.cybake2 .dropdown .p-dropdown-label {
    padding: 0.5rem !important;
}

.cybake2 .options-dropdown-height .p-dropdown-label {
    padding: 0.75rem !important;
}

#vehicleStockTake_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#vehicleDespatch_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#stockTake_table .p-datatable-wrapper {
    height: calc(100vh - 276px) !important;
}

#users_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#customersSearch_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#productionForecast_table .p-datatable-wrapper {
    height: calc(100vh - 280px) !important;
}

#productionForecast_table_emptyMessage_tableRow {
    height: calc(100vh - 340px) !important;
}

.production-forecast-with-shift-msg .p-datatable-wrapper {
    height: calc(100vh - 290px) !important;
}

#productionCycles_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#productionCycles_table_emptyMessage_tableRow {
    height: calc(100vh - 284px) !important;
}

#weeklyOrdersByProductTable .p-datatable-wrapper {
    height: calc(100vh - 250px) !important;
}

#weeklyOrdersByProduct_table_emptyMessage_tableRow {
    height: calc(100vh - 339px) !important;
}

#productionPlanSearch_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#productionPlanSearch_table_emptyMessage {
    height: calc(100vh - 277px) !important;
}

#weeklyOrdersTable .p-datatable-wrapper {
    height: calc(100vh - 272px);
}

#weeklyOrders_table_emptyMessage_tableRow {
    height: calc(100vh - 361px);
}

.weeklyOrdersTableWithOrderNote .p-datatable-wrapper {
    height: calc(100vh - 324px) !important;
}

.weeklyOrdersTableWithOrderNote #weeklyOrders_table_emptyMessage_tableRow {
    height: calc(100vh - 391px) !important;
}

#productionEntry_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#productionOverview_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#dailyOrder_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#dailyOrder_table_emptyMessage_tableRow {
    height: calc(100vh - 277px) !important;
}

.cybake2 .dailyOrderpanel .p-panel-content {
    max-height: calc(100vh - 184px) !important;
}

#productionEntry_table_emptyMessage_tableRow {
    height: calc(100vh - 284px) !important;
}

productionOverview_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#productionOverview_table_emptyMessage_tableRow {
    height: calc(100vh - 277px) !important;
}

#ceuiManage_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#ceuiManage_table_emptyMessage_tableRow {
    height: calc(100vh - 277px) !important;
}

/*Order Adjustments*/

.order-adjustments-page-content .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

.order-adjustments-page-content-popup .p-datatable-wrapper {
    height: calc(100vh - 321px) !important;
}

.order-adjustments-page-content-popup #orderAdjustments_table_emptyMessage_tableRow {
    height: calc(100vh - 358px) !important;
}

#orderAdjustments_table_emptyMessage_tableRow {
    height: calc(100vh - 277px) !important;
}

.cybake2 .order-adjustments-page-content {
    background: #F8F9FA !important;
    height: calc(100vh - 109px) !important;
}

/*Output Grouping*/
#outputGrouping_addedItems_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#outputGrouping_addedItems_table_emptyMessage {
    height: calc(100vh - 277px) !important;
}

#outputGrouping_availableItems_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

#outputGrouping_availableItems_table_emptyMessage {
    height: calc(100vh - 277px) !important;
}

.outputGroupingGroupsPanel .p-panel-content {
    height: calc(100vh - 192px) !important;
    overflow-y: auto;
}

.outputGroupingGroupsPanelWithSearch .p-panel-content {
    height: calc(100vh - 236px);
    overflow-y: auto;
}

.outputGroupingGroupsPanel {
    height: calc(100vh - 136px);
}

.manage-table {
    height: calc(100vh - 136px);
}

.outputGroupingGroupsPanelWithSearch {
    height: calc(100vh - 208px);
}

.cybake2 .customer-branding-btn {
    width: 33.5px !important;
    height: 33.5px !important;
}

.me-2 {
    margin-right: 0.5rem !important;
}

.text-end {
    text-align: right;
}

.text-start {
    text-align: left;
}

.cybake2 .table-dropdown .p-dropdown-label {
    padding: 0.35rem 0.5rem !important;
}

.footer-button {
    line-height: 1.6 !important;
}

.footer-input {
    line-height: 1.7 !important;
}

.table-header-button {
    padding-top: .5rem !important;
}

.table-footer-button {
    padding-top: .5rem !important;
}

.cybake2 .productPartnerPanel .p-panel-content {
    height: calc(100vh - 191px) !important;
}

.cybake2 .parnter-product-content-height {
    height: calc(100vh - 178px) !important;
}

.cybake2 #login_forgottenPassword_input {
    border-radius: 0.25rem !important;
    height: 38px !important;
    padding: 0.375rem 1.75rem 0.375rem 2rem !important;
}

.disabled-button {
    background-color: #fff;
    border-color: #ccc;
    box-shadow: none;
    opacity: .65;
    cursor: not-allowed;
}

.notifications-overlay .p-overlaypanel-content {
    padding-top: 0.5rem !important;
}

.p-badge.p-badge-danger {
    background-color: var(--danger) !important;
    color: #ffffff !important;
}

.notification-badge {
    position: absolute;
    margin-left: -5px;
    margin-top: 8px;
    font-size: .7em;
    height: 20px;
    line-height: 19px;
}

.notification-icon svg {
    margin-top: 5px;
}

.notifications-overlay {
    margin-top: -4px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

    .notifications-overlay::before {
        border-color: transparent !important;
        border: none !important;
        border-bottom-color: transparent !important;
        display: none !important;
        box-sizing: 0 !important;
        border-width: 0 !important;
        margin-bottom: -10px !important;
        top: 10px;
        right: 20px;
        content: "" !important;
    }

    .notifications-overlay::after {
        border-color: transparent !important;
        border: none !important;
        border-bottom-color: transparent !important;
        display: none !important;
        box-sizing: 0 !important;
        border-width: 0 !important;
        margin-bottom: -10px !important;
        top: 10px;
        right: 20px;
        content: "" !important;
    }

.notifications-overlay {
    right: 0 !important;
    width: 400px !important;
    left: auto !important;
}

    .notifications-overlay .p-overlaypanel-content {
        padding: 0 !important;
    }

.notification-print-icon svg {
    margin-top: -5px !important;
}

.cybake-navbar {
    color: white;
    background-color: var(--cybake-orange);
    height: 52px;
    box-shadow: 0px 1px 2px 1px rgb(0 0 0 / 25%);
    border: none;
}

.notification-icon svg {
    font-size: 1.6rem !important;
}

#notification_icon {
    height: 49px;
}

.cybake2 .deliveryGroupPanel .p-panel-content {
    height: calc(100vh - 200px) !important;
}

.cybake2 .deliveryGroupPanelWithSearch .p-panel-content {
    height: calc(100vh - 245px) !important;
}

.cybake2 .delivery-groups-content-height {
    height: calc(100vh - 186px) !important;
}

.cybake2 #deliveryGroupCharges_table .p-datatable-wrapper {
    height: calc(100vh - 289px) !important;
}

.cybake2 #deliveryGroupsCharges_emptyMessage {
    height: calc(100vh - 326px) !important;
}

.cybake2 #deliveryGroupCustomers_addedItems_table .p-datatable-wrapper {
    height: calc(100vh - 317px) !important;
}

.cybake2 #deliveryGroupCustomers_addedItems_table_emptyMessage {
    height: calc(100vh - 354px) !important;
}

.cybake2 #stockAdjustments_table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

/*.cybake2 #stockAdjustments_table_emptyMessage {
    height: calc(100vh - 284px) !important;
}*/

.cybake2 #deliveryGroupCustomers_availableItems_table .p-datatable-wrapper {
    height: calc(100vh - 317px) !important;
}

.cybake2 #deliveryGroupCustomers_availableItems_table_emptyMessage {
    height: calc(100vh - 354px) !important;
}

.cybake2 .automatedIntegrationsSetupPanel .p-panel-content {
    height: calc(100vh - 191px) !important;
}

.cybake2 .automatedIntegrationsSetupPanelWithSearch .p-panel-content {
    height: calc(100vh - 237px) !important;
    overflow-y: auto;
}

.cybake2 .automatedIntegrationRunHistory-table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

.cybake2 .automatedIntegrationRunHistory_table-emptyMessage-tableRow {
    height: calc(100vh - 277px) !important;
}

.cybake2 .callList-table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

.cybake2 #callList_table_emptyMessage_tableRow {
    height: calc(100vh - 277px) !important;
}

.cybake2 .productionPlanEdit-table .p-datatable-wrapper {
    height: calc(100vh - 285px) !important;
}

app-cybake-table .productionPlanEdit-table .cybakeTable-expandedRow-table .p-datatable-wrapper {
    height: 100% !important;
}

.cybake2 #productionPlanEdit_emptyMessage_tableRow {
    height: calc(100vh - 277px) !important;
}

.cybake2 .goodsInSearch-table .p-datatable-wrapper {
    height: calc(100vh - 240px) !important;
}

.cybake2 .goodsInSearch-table .table-emptyMessage-tableRow {
    height: calc(100vh - 277px) !important;
}

.cybake2 .goodsInViewPanel .p-panel-content {
    height: calc(100vh - 296px);
}

.cybake2 #goodsInView_table .p-datatable-wrapper {
    height: calc(100vh - 239px) !important;
}

.cybake2 #goodsInView_table_emptyMessage_tableRow {
    height: calc(100vh - 276px) !important;
}

.cybake2 .goodsInViewPanel .p-panel-content {
    height: calc(100vh - 296px) !important;
    overflow-y: auto;
}

.cybake2 .cybake-btn fa-icon svg {
    vertical-align: middle !important;
}

.cybake-page-content {
    height: calc(100vh - 107px) !important;
}

app-sites-setup .cybake-page-content {
    height: calc(100vh - 119px) !important
}

.cybake-panel ul li {
    margin-bottom: 1px;
}

    .cybake-panel ul li:not(:first-child) {
        margin-top: -1px;
    }

.div-input-disabled {
    height: 34px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #eee;
    background-image: none;
    border: 1px solid #ccc;
    padding: 7px 4px !important;
}

.view-btn-no-delete {
    margin-right: 37px !important;
}

.p-input-icon-right > .p-inputtext {
    padding-right: 2rem !important;
}

.calendar-btns-div {
    margin-top: -0.5rem !important;
    padding-top: 5px !important;
}

.cybake2 .p-paginator-rpp-options .p-dropdown-label {
    padding-top: 5px !important;
}

.cybake2 .p-paginator-rpp-options .p-dropdown-trigger-icon {
    padding-top: 2px !important;
}

.cybake2 .table-search-input.p-input-icon-left > fa-icon, .table-search-input.p-input-icon-right > fa-icon {
    margin-top: -0.10rem !important;
}

.bi-reports-search-div {
    height: calc(100vh - 198px) !important;
}

.cybake2 app-purchasing-dashboard .cybake-page-content {
    height: calc(100vh - 119px) !important;
}

.cybake2 app-recipe-scaler app-cybake-button button.p-button {
    border-radius: 0 !important;
    padding: 5px 10px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important;
}

    .cybake2 app-recipe-scaler app-cybake-button button.p-button:hover {
        color: #333 !important;
        background-color: #e6e6e6 !important;
        border-color: #adadad !important;
    }

.cybake2 app-products-search button.p-button:hover {
    color: #333 !important;
    background-color: #e6e6e6 !important;
    border-color: #adadad !important;
}

.cybake2 app-products-search button.p-button {
    border-radius: 0 !important;
    padding: 5px 10px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important;
}

    .cybake2 app-products-search button.p-button fa-icon {
        margin-top: -1px !important;
    }

.cybake-calendar-date-range {
    width: 55em;
}

    .cybake-calendar-date-range .p-datepicker-calendar-container .p-datepicker-calendar tbody tr td span {
        padding: 0px !important;
    }

    .cybake-calendar-date-range .p-overlaypanel-content {
        padding: 0.5rem 1rem 0.2rem 1rem;
    }

    .cybake-calendar-date-range .p-datepicker table td.p-datepicker-today > span {
        background: inherit !important;
        color: #495057 !important;
        border-color: transparent !important;
    }

        .cybake-calendar-date-range .p-datepicker table td.p-datepicker-today > span.p-highlight {
            background: #E3F2FD !important;
        }

    .cybake-calendar-date-range .p-datepicker-header {
        padding-top: 0 !important
    }

    .cybake-calendar-date-range .calendar-panel {
        padding: 0 !important;
    }

    .cybake-calendar-date-range .calendar-panel {
        border: none !important;
    }

    .cybake-calendar-date-range .p-datepicker-calendar-container {
        border-top: 1px solid #dee2e6;
    }

    .cybake-calendar-date-range .p-datepicker-header {
        border-bottom: none !important;
    }

    .cybake-calendar-date-range .p-datepicker-month {
        padding: 0.5rem 0rem !important;
    }

    .cybake-calendar-date-range .p-datepicker-year {
        padding-right: 0px !important;
    }

    .cybake-calendar-date-range thead th {
        text-align: center;
    }

    .cybake-calendar-date-range tbody td {
        padding: 0.2rem !important;
    }

        .cybake-calendar-date-range tbody td span {
            display: block !important;
            text-align: center;
            width: 38px;
            height: 36px;
            padding: 5px;
        }

.map-route-loading-div {
    top: 70px !important;
}


#dropdownMultiselect .dropdown {
    cursor: pointer
}

#dropdownMultiselect .not-allowed {
    cursor: not-allowed
}

#dropdownMultiselect .dropdown .badge {
    background-color: #777;
    margin-right: 2px
}

#dropdownMultiselect .dropdown .dropdown-menu, .dropdown button {
    width: 100%
}

#dropdownMultiselect #dropdownMenu > .caret {
    margin-top: 8px;
    margin-right: -6px
}

#dropdownMultiselect .dropdown-menu div {
    width: 100%;
    z-index: 1
}

#dropdownMultiselect .dropdown-menu {
    width: 100%;
}

#dropdownMultiselect li {
    cursor: pointer;
}

#dropdownMultiselect .badge {
    margin-right: 0.5rem !important;
}

#dropdownMultiselect .dropdown-static {
    position: absolute;
    list-style-type: none;
    background-color: #fff;
    width: 100%;
    padding-left: 0;
    padding-bottom: 10px;
    border-style: solid;
    border-width: 0 0 1px 0;
    border-color: #e5e5e5
}

#dropdownMultiselect .dropdown-scrollable {
    list-style-type: none;
    padding: 0 0 0;
    margin-top: 65px;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    position: relative
}

.opacity-0 {
    opacity: 0;
}

#dropdownMultiselect .hasfilter {
    margin-top: 100px
}

#dropdownMultiselect .dropdown-height {
    max-height: 300px
}

#dropdownMultiselect .dropdown-menu .dropdown-scrollable > li > a, .dropdown-menu .dropdown-static > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
    text-decoration: none;
    height: 25px
}

    #dropdownMultiselect .dropdown-menu .dropdown-scrollable > li > a > .option-content {
        position: absolute;
        left: 40px
    }

    #dropdownMultiselect .dropdown-menu .dropdown-scrollable > li > a > .option-selected-icon {
        margin-left: 3px
    }

#dropdownMultiselect .dropdown-menu li a:hover {
    color: #333;
    background-color: #f9f2f4
}

#dropdownMultiselect .dropdown-show {
    display: block !important
}

#dropdownMultiselect .dropdown-hide {
    display: none !important
}

#dropdownMultiselect .glyphicon {
    position: static
}

#dropdownMultiselect .pad-icon {
    padding-top: 4px
}

#dropdownMultiselect .filter-parent {
    position: relative;
    font-size: 18px;
    padding-top: 0;
    padding-left: 20px;
    padding-right: 20px;
    margin: 3px auto 0
}

    #dropdownMultiselect .filter-parent label {
        position: absolute;
        left: 27px;
        top: 5px;
        color: #c3bfbf
    }

    #dropdownMultiselect .filter-parent > div {
        width: 100%
    }

    #dropdownMultiselect .filter-parent #filter-by {
        padding: 6px 26px;
        border-radius: 23px;
        height: 30px
    }

@media only screen and (min-device-width:414px) and (max-device-width:736px) and (-webkit-min-device-pixel-ratio:3) and (orientation:portrait) {
    #dropdownMultiselect .hasfilter {
        margin-top: 112px !important
    }

    #dropdownMultiselect .dropdown-menu .dropdown-scrollable > li > a, .dropdown-menu .dropdown-static > li > a {
        line-height: 2
    }
}

#dropdownMultiselect .dropdown-scrollable {
    max-height: 250px !important;
    overflow-y: auto !important;
}

.disabled-multiselect #dropdownMultiselect .dropdown-toggle {
    pointer-events: none !important;
    cursor: not-allowed !important;
    background-color: #eee !important;
    opacity: 1 !important;
}

#addProduct_general_productNominals_table .p-datatable-wrapper {
    height: 100%;
}

#addProduct_general_productNominals_table .p-datatable-table {
    height: 100%;
}

#addProduct_general_productNominals_table .p-datatable-tbody {
    height: 100%;
}

#addProduct_general_priceLists_primeDropdown .p-dropdown {
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

.cybake-addItemsToTable-autocomplete-panel .p-scroller {
    min-width: 650px;
}

.p-tooltip {
    max-width: 22.5rem !important;
}

.ms-2 {
    margin-left: 0.5rem !important;
}

.p-multiselect-items-wrapper .p-scroller {
    min-width: 525px;
}

app-cybake-editor p-editor select {
    display: none !important;
}

.cybake2 .cybake-page-content {
    height: calc(100vh - 119px) !important;
}

.cybake2 app-home .cybake-page-content {
    height: calc(100vh - 115px) !important;
}

.cybake2 app-home .cybake-release-notes-panel .p-panel-content {
    height: calc(100vh - 251px) !important;
}

.cybake2 app-cybake-breadcrumb .p-breadcrumb li {
    padding-top: 1px;
}

    .cybake2 app-cybake-breadcrumb .p-breadcrumb li a span {
        font-size: 1.3em;
        font-weight: 500;
    }

.cybake2 app-cybake-breadcrumb .p-breadcrumb {
    font-size: 1em !important;
}

    .cybake2 app-cybake-breadcrumb .p-breadcrumb #home_0_breadcrumbItem a span {
        font-size: 1.6em;
        padding-top: 5px;
        font-weight: 700;
    }

.cybake2 p-galleriaitemslot {
    text-align: left !important;
}

.cybake2 #addSpecialOrder_deliveryDate_pcalendar table th {
    font-size: 1.1rem;
    padding: 0.5rem !important;
    text-align: center;
}

.cybake2 #addSpecialOrder_deliveryDate_pcalendar table td {
    font-size: 1.1rem;
    padding: 0.5rem !important;
    height: 48px;
    width: 52px;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.cybake2 .addSpecialOrder-deliveryDate-calendar-panel {
    height: 416px !important;
}

.cybake2 app-pod-photos .p-dialog-title {
    text-align: left !important;
}

.cybake2 p-galleria .p-galleria-item app-cybake-image .p-image-mask {
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    position: fixed;
    margin-top: -18% !important;
    margin-left: -99% !important;
}

#dailyOrder_proofOfDeliveryPhoto_img .cybake2 app-pod-photos app-cybake-button .p-element button {
    width: 100% !important;
    border-radius: 0 !important;
}

.p-tooltip.breadcrumb-buttom-tooltip {
    top: 103.5px !important;
}

.cybake-dropdown-panel ul {
    margin-bottom: 0px !important;
}

.cybake-dropdown-panel ol {
    margin-bottom: 0px !important;
}

cybake-autocomplete-new .p-autocomplete-dropdown .p-icon-wrapper {
    color: white !important;
}

.cybake2 p-fileupload .p-fileupload input {
    display: none !important;
}

.cybake2 .addProduct_general_imageSelect_btn {
    color: white !important;
}

.cybake2 #addProduct_goBackAStep_btn {
    color: white !important;
}

.cybake2 #addProduct_goToNextStep_btn {
    color: white !important;
}

.cybake2 #addProduct_goToNextStep_generalStep_btn {
    color: white !important;
}

.cybake2 .version-number {
    position: fixed;
    right: 0.75rem;
    bottom: 0.5rem;
    z-index: 1000;
    font-size: 1em !important;
    line-height: 1;
    color: #fff;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.8), 1px -1px 1px rgba(0, 0, 0, 0.8), -1px 1px 1px rgba(0, 0, 0, 0.8), 1px 1px 1px rgba(0, 0, 0, 0.8);
}

.cybake2 .background-switcher {
    position: fixed;
    top: 0;
    right: 0;
    width: 80px;
    height: 80px;
    z-index: 9999;
    background: transparent;
    border: 0;
    padding: 0;
    opacity: 0;
    cursor: default;
}

.cybake2 cybake-login #login-page {
    min-height: 100% !important
}

    .cybake2 cybake-login #login-page .auth-shell {
        min-height: 100% !important;
        height: 100vh !important;
    }

.cybake2 cybake-mfa #login-page {
    min-height: 100% !important
}

    .cybake2 cybake-mfa #login-page .mfa-page {
        min-height: 100% !important;
        height: 100vh !important;
    }

.cybake2 cybake-forgotten-password #login-page {
    min-height: 100% !important
}

    .cybake2 cybake-forgotten-password #login-page .auth-shell {
        min-height: 100% !important;
        height: 100vh !important;
    }

.cybake2 cybake-reset-password #login-page {
    min-height: 100% !important
}

    .cybake2 cybake-reset-password #login-page .auth-shell {
        min-height: 100% !important;
        height: 100vh !important;
    }

.cybake2 cybake-auth-callback #login-page {
    min-height: 100% !important
}

    .cybake2 cybake-auth-callback #login-page .mfa-page {
        min-height: 100% !important;
        height: 100vh !important;
    }

.cybake2 .mfa-error-panel {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .cybake2 .mfa-error-panel > div {
        display: flex;
        flex-direction: column;
    }


.p-dropdown-items-wrapper {
    max-height: 410px !important;
}

.p-contextmenu-root-list {
    margin-bottom: 0 !important;
}

.p-autocomplete-items {
    margin-bottom: 0 !important;
}

.p-colorpicker-panel .p-colorpicker-content .p-colorpicker-color {
    background: transparent url("../images/primeng-color-picker-main.png") no-repeat left top !important;
}


.p-colorpicker-panel .p-colorpicker-content .p-colorpicker-hue {
    background: transparent url("../images/primeng-color-picker-hue.png") no-repeat left top !important;
}

#recipe_allergen_table .ui-grid-header {
    height: 40px !important;
}

#recipe_allergen_table .ui-grid-top-panel {
    width: 100% !important;
    position: absolute !important;
}

#recipe_claim_table .ui-grid-header {
    height: 34px !important;
}

#recipe_claim_table .ui-grid-top-panel {
    width: 100% !important;
    position: absolute !important;
}

.cybake2.angular-hybrid-screen .export-page-height {
    height: calc(100vh - 158px) !important;
}

cybake-customer-call-lists {

    .customer-panel-height {
        height: calc(100vh - 240px) !important;
    }
}

ms-1 {
    margin-left: .25rem !important;
}

.cybake2.angular-hybrid-screen cybake-manual-integrations-import .import-page-content {
    height: calc(100vh - 54px) !important;
}

.cybake2.angular-hybrid-screen cybake-manual-integrations-import .import-integration-page-content {
    height: calc(100vh - 227px) !important;
}

.cybake2.angular-hybrid-screen cybake-manual-integrations-import app-panel-info .cybake-panel > .p-toggleable-content {
    height: calc(100% - 14px) !important;
}

.cybake2.angular-hybrid-screen cybake-manual-integrations-import app-panel-info .cybake-info-panel {
    height: calc(100% - 14px) !important;
}

.cybake2.angular-hybrid-screen cybake-manual-integrations-import .import-integration-page-content .manual-integrations-table-div {
    height: calc(100% - 30px) !important;
}

.cybake2.angular-hybrid-screen cybake-manual-integrations-import app-panel-info.import-height-panel-open {
    height: calc(100% - 125px) !important;
}

.cybake2.angular-hybrid-screen cybake-manual-integrations-import app-panel-info.import-height-second {
    height: calc(100% - 31px) !important;
}