table {
    /* This is to override the user agent style of font-size:13px on localhosts */
    font-size: inherit;
}

.add-to-card-btn {
    cursor: pointer;
}

*,
*:focus,
*:hover {
    outline: none;
}

ul.a {
    list-style-type: disc;
}

/*Changing scrolling element*/

body {
    overflow-y: hidden;
    height: 100vh;
}

.GeneralContent {
    height: 100vh;
    overflow-y: auto;
    position: relative;
}

.GeneralContent.General-content-opt-in-bar-open {
    height: calc(100vh - 48px);
}

.side-bar-menu {
    display: Flex;
    flex-direction: column;
}

.side-bar-menu li {
    flex: 0 0 auto;
}

.GeneralContent::-webkit-scrollbar{
    width: 10px;
}

.GeneralContent::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0px;
}

.GeneralContent::-webkit-scrollbar-thumb {
    background-color: darkgrey;
}

.list-wrapper {
    max-height: 72vh;
    overflow-y: scroll;
}

.list-wrapper:hover {
    overflow-y: scroll;
}

.list-wrapper::-webkit-scrollbar {
    width: 7px;
}

.list-wrapper::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0px;
    border-radius: 10px;
}



.list-wrapper::-webkit-scrollbar-thumb {
    background-color: darkgrey;
    border-radius: 10px;
}

.loading-row .loading-row-content {
    background-color: rgba(226, 235, 248, 0.4);
    animation: top-to-bottom 3s infinite;
    height: 20px;
}

.DisplayArea {
    /*display: table;*/
    background-color: #efefef;
}

.payments-page-empty-graph {
    height: 150px;
    text-align: center;
    padding-top: 140px;
}

.marketman-infobox {
    max-width: 700px;
    min-height: 46px;
    box-sizing: border-box;
    border: solid thin #ededed;
    display: flex;
    align-items: center;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 4px;
    font-size: 12px;
    color: #5a6779;
}

.marketman-infobox .marketman-infobox-content span {
    font-size: inherit;
    line-height: inherit;
}

.ReferralButtonAction {
    /*border: 3px dashed #5a6779;*/
    padding: 5px 0;
    /*border-radius: 10px;*/
}

.dropMenuLoginMultiLineElement {
    padding: 0;
    margin: 6px;
}

.marketman-infobox-content {
    display: flex;
}

.marketman-infobox-content p {
    padding: 11px 16px;
    line-height: 1.42;
    margin: 0;
}

.marketman-infobox-right {
    display: flex;
    align-items: center;
}

.marketman-infobox.warning {
    border: solid thin #ffeaea;
}

.marketman-infobox-icon {
    color: #28bd8b;
    padding: 11px 16px;
    border-right: solid thin #ededed;
    display: flex;
}

.marketman-infobox.warning .marketman-infobox-icon {
    border-color: #ffeaea;
}

.marketman-infobox-icon img {
    margin: auto;
}

.marketman-infobox-link {
    color: #28bd8b;
    background-color: inherit;
    border: none;
    text-decoration: underline;
    font-size: 12px;
    padding: 0;
}

.inv-items-health-check .marketman-infobox {
    margin-bottom: 8px;
}

.new-items .marketman-infobox {
    margin-bottom: 8px;
}

.new-items .JumboMessage aside {
    top: -25px;
}

.new-items .JumboMessage aside img {
    width: 75px;
}

.new-items .user-message-container {
    margin: 5px 0;
}

.new-items .k-grid a:link {
    color: #28bd8b !important;
}

.new-items .k-grid a {
    color: #28bd8b !important;
}

.merge-to-existing-inv-items-side-modal .item-details__nameInput {
    font-size: 18px;
    color: #5c82a4;
    padding: 8px 0 0 0;
    line-height: 34px;
}

.merge-inv-items-side-modal .item-details__nameInput {
    font-size: 18px;
    color: #5c82a4;
    padding: 8px 0 0 0;
    line-height: 34px;
}

.merge-inv-items-side-modal .item-details__headFormSubmit {
    margin-bottom: 0;
    padding-top: 8px;
}

.merge-inv-items-merge-items-content .marketman-infobox {
    margin: 8px 0;
}

.merge-inv-items-merge-items-content .popup-form__table {
    grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr 1fr minmax( 48px, auto ) minmax( 48px, auto );
    margin-top: 8px;
}

.merge-inv-items-merge-suggestions-content .popup-form__table {
    grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr 1fr minmax( 48px, auto );
    margin-top: 8px;
}

.merge-inv-items-popup-item-expanded-row {
    display: grid;
    grid-template-columns: 1fr;
    grid-column-gap: 30px;
    margin-top: 12px;
    margin-bottom: 12px;
}

.merge-inv-items-popup-item-expanded-row--form-title {
    margin-top: 0;
    margin-bottom: 0;
}

.merge-inv-items-popup-item-expanded-row--form-line-seperator {
    border-top: 1px solid #ededed;
    margin-top: 14px;
    margin-bottom: 14px;
}

.merge-inv-items-popup-item-expanded-row--form-first {
    margin-top: 0;
}

.merge-inv-items-popup-item-table-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 6px;
    min-height: 0;
    min-width: 0;
}

.merge-inv-items-merge-suggestions-content .marketman-infobox {
    margin: 8px 0;
}

.merge-inv-items-search-content .popup-form__table {
    grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr 1fr;
    margin-top: 8px;
}

.merge-inv-items-search-content .SearchText {
    background-color: inherit;
}

.merge-inv-items-search-content .marketman-infobox {
    margin: 8px 0;
}

.merge-inv-items-popup-content .merge-select-button {
    font-size: 12px;
    color: #28bd8b;
    text-decoration: none;
    border: none;
    background: none;
}

.merge-inv-items-popup-content .merge-select-button:hover {
    text-decoration: underline;
    cursor: pointer;
}

.allergens-bulk-update-popup .marketman-infobox {
    width: 70%;
}

.allergens-import-popup .marketman-infobox {
    width: 100%;
    max-width: 100%;
}

.allergens-import-popup .allergens-import-popup-finished-process {
    margin: auto;
    border: 3px dashed #ddd;
    border-radius: 3px;
}

.allergens-import-popup .allergens-import-popup-finished-process article {
    padding: 0 40px 0 40px;
}

.allergens-import-popup .allergens-import-popup-finished-process p {
    font-weight: bold;
}

.allergens-import-popup .drag-and-drop-box {
    padding: 40px 0 40px 0;
}

.allergens-popup-types-container {
    display: flex;
    flex-direction: column;
    height: 250px;
    flex-wrap: wrap;
}

.allergens-popup-types-container .FormGroup {
    max-width: 50%;
}

md-checkbox .md-icon {
    border-width: 1px;
    height: 19px;
}

md-checkbox.md-default-theme.md-checked .md-icon,
md-checkbox.md-checked .md-icon {
    background-color: #28bd8b;
}

md-checkbox.md-default-theme:not([disabled]).md-primary:not(.md-checked)
    .md-icon,
md-checkbox:not([disabled]).md-primary:not(.md-checked) .md-icon {
    border-color: #b2b3b5 !important;
}

.marketman-link {
    color: #2e2e2e;
    font-weight: 500;
    text-decoration: none;
}

.marketman-button-link {
    color: #28bd8b;
    background-color: inherit;
    border: none;
    text-decoration: underline;
    padding: 0;
    font-size: 14px;
}

.marketman-option-link {
    color: #28bd8b;
    background-color: inherit;
    border: none;
    text-decoration: underline;
}

.marketman-option-link i {
    font-size: 11px;
}

.SidePanel {
    width: 100%;
    position: relative;
}

.SidePanel .Logo {
    top: 0px;
    height: 54px;
    width: 237px;
    background-color: white;
    -webkit-transition: width 0.4s;
    -moz-transition: width 0.4s;
    -o-transition: width 0.4s;
    transition: width 0.4s;
    border-right: solid thin #efefef;
}

.slim .UserLogo {
    display: none !important;
}

.SidePanel.slim .Logo {
    width: 60px;
    display: none;
}

.SideBase.slim .Logo {
    width: 60px;
    display: none;
}

.SideBase.slim .Logo img {
    width: 60%;
}

.SideBase .Logo img {
    width: 80%;
    margin-left: 10px;
    margin-top: 10px;
}

.SideBase {
    width: 238px;
    position: fixed;
    display: inline-block;
    transition-property: all;
    -webkit-transition-property: all;
    float: left;
    background-color: #313542;
    -webkit-transition: width 0.4s;
    -moz-transition: width 0.4s;
    -o-transition: width 0.4s;
    transition: width 0.4s;
    z-index: 90;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE/Edge */
    user-select: none;
}

.SideBase.slim {
    width: 54px;
    /* z-index: 2; */
}

.SideBase.SideBase-opt-in-bar-open {
    opacity: 1;
    transition: opacity 0.2s;
}

.SideBase.SideBase-opt-in-bar-open.ng-hide {
    opacity: 0;
}


.TopBar {
    display: block;
    height: 54px;
    border-bottom: solid thin #e5e6e7;
    background-color: white;
    position: fixed;
    width: calc(100% - 238px);
    z-index: 89;
    -webkit-transition: width 0.4s;
    -moz-transition: width 0.4s;
    -o-transition: width 0.4s;
    transition: width 0.4s;
}

.GeneralContent.slim .TopBar {
    /* z-index: 1; */
    width: calc(100% - 54px);
}

.GeneralContent {
    float: right;
    width: calc(100% - 238px);
    -webkit-transition: width 0.4s;
    -moz-transition: width 0.4s;
    -o-transition: width 0.4s;
    transition: width 0.4s;
}

.GeneralContent.slim {
    width: calc(100% - 54px);
}

.Page {
    padding: 10px;
    margin-top: 55px;
    margin-bottom: 20px;
}

.UserLogo {
    height: 24px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px 15px 15px 15px;
    border-right: solid thin #efefef;
}
.UserLogo img {
    max-width: 100%;
    max-height: 50px;
    height: unset;
}
.marketman-form-field-select-container .non-selectable-group label {
    color: #5c82a4;
}
.marketman-form-field-select-container .non-selectable-option {
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    width: auto;
    padding: 0 16px;
    height: 48px;
}
.marketman-form-field-select-container .non-selectable-option:hover{
    background-color:rgba(158,158,158,0.18);
}



/*Menu*/
.MainMenu,
.MainMenu ul,
.MainMenu li,
MainMenu a {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    font-weight: normal;
    text-decoration: none;
    line-height: 1;
    position: relative;
    outline-color: #313542;
}

.MainMenu {
    padding-right: 5px;
    width: 238px;
}

.MainMenu.NoUserImage {
    height: calc(100vh - 79px);
}

.MainMenu::-webkit-scrollbar {
    display: none;
}

.MainMenu a {
    line-height: 1.3;
}

.MainMenu.footer {
    left: 0;
    padding-top: 10px;
    overflow-y: hidden;
    overflow-x: hidden;
    border-top: 1px solid #555;
    color: #818ea4;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    background-color: #313542;
    transition-property: all;
    -webkit-transition-property: all;
    float: left;
    background-color: #313542;
    -webkit-transition: width 0.4s;
    -moz-transition: width 0.4s;
    -o-transition: width 0.4s;
    transition: width 0.4s;
}

.MainMenu > ul > li {
    display: inline-block;
    width: 100%;
    position: relative;
    overflow-x: hidden;
    overflow-y: hidden;
    white-space: nowrap;
}

.MainMenu > ul > li.has-sub.active > i {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}

.MainMenu > ul > li.has-sub > i {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #818ea4;
    font-size: 12px;
}

.icon-expand {
    position: absolute;
    right: 30px;
    color: #818ea4;
    font-size: 20px !important;
}

.icon-collapse {
    position: absolute;
    right: 20px;
    color: #818ea4;
    font-size: 20px !important;
}

.arrow-expand,
.arrow-collapse {
    position: absolute;
    right: 21px;
    top: 17px;
    bottom: 21px;
    color: #818ea4;
    font-size: 20px !important;
    background-repeat: no-repeat;
    background-position: center;
    height: 20px;
    width: 20px;
    user-select: none;
}

.arrow-expand {
    background-image: url("/images/collaps left.png");
}

.arrow-expand:hover {
    background-image: url("/images/collaps left hover.png");
}

.arrow-collapse {
    background-image: url("/images/expand right.png");
}

.arrow-collapse:hover {
    background-image: url("/images/expand right hover.png");
}

.SideBase.slim .MainMenu {
    width: auto;
}

.SideBase.slim .MainMenu > ul > li.has-sub > i {
    display: none;
}

.MainMenu > ul > li a {
    display: block;
}

.SideBase.slim .MainMenu .user-menu {
    display: none;
}

.MainMenu > ul > li > a {
    display: block;
    color: #818ea4;
    cursor: pointer;
    height: 54px;
    border-left: 6px solid transparent;
    font-weight: normal;
}

.MainMenuBlue {
    color: #23b1f7;
}

/*.MainMenu > ul > li > a:hover, .MainMenu > ul > li.active > a {*/
/*    color: white;*/
/*    border-left: 6px solid #ea5a5a;*/
/*    background-color: #1f222d;*/
/*}*/

/*    .MainMenu > ul > li > a:hover + .MainMenu > ul > li.has-sub > i {*/
/*        color: white;*/
/*    }*/

.MainMenu > ul > li > a:hover,
.MainMenu > ul > li.active > a {
    color: white;
    border-left: 6px solid #ea5a5a;
    background-color: #1f222d;
}

.MainMenu > ul > li > a:hover + .MainMenu > ul > li.has-sub > span {
    color: white;
}

.MainMenu > ul > li.active > i {
    color: white;
}

.MainMenu > ul > li.has-sub:hover > a > span.MenuLabel,
.MainMenu > ul > li.has-sub:hover > i,
.MainMenu > ul > li.has-sub.CurrentMenuHL > i {
    color: #ececed;
}

.CurrentMenuHL > a {
    background-color: #1f222d;
    border-left: 6px solid #ea5a5a !important;
    color: #ffffff !important;
}

.CurrentMenuHL > a > span > i {
    color: #ffffff !important;
}

.MainMenu > ul > li > a > .menu-icon {
    width: 26px;
    height: 26px;
    color: #afb1b3;
    margin-left: 8px;
    margin-right: 15px;
    margin-top: 15px;
    float: left;
}

.MainMenu .menu-parent {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    text-decoration: none;
}

.MainMenu .menu-parent .menu-icon {
    margin: 0 10px 1px;
    display: flex;
    justify-content: center;
}

.MainMenu .menu-parent .menu-icon i {
    display: block;
    width: 100%;
    height: 100%;
}

.MainMenu .menu-icon i:before {
    display: block;
    background: none center / 100% 100% no-repeat;
    width: 100%;
    height: 100%;
    content: '';
}

.MainMenu > ul > li > a:hover {
    text-decoration: none;
}

.MainMenu > ul > li:active {
    text-decoration: none;
}

.MainMenu ul ul {
    display: none;
    background-color: #282c37;
    color: #afb1b3;
}

.SideBase.slim .MainMenu ul ul {
    display: none;
}

.MainMenu ul ul li a:hover {
    background-color: #1f222d;
    color: #fff;
}

.MainMenu ul ul li.active a {
    color: #fff;
    background-color: #1f222d;
}

.MainMenu ul ul li a {
    color: #818ea4;
    text-decoration: none;
    padding-left: 22px;
    line-height: 33px;
    padding: 0px 51px;
    height: 33px;
}

.MainMenu .menu-icon i.Orderfulfillment:before {
    background-image: url("/images/menu-icons/orderfulfillment.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .Orderfulfillment:before,
.MainMenu > ul > li.active.has-sub .Orderfulfillment:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/orderfulfillment-active.png");
}

.MainMenu > ul > li.has-sub:hover .Orderfulfillment:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/orderfulfillment-active.png");
}

.MainMenu .menu-icon i.Customers:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/customers.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .Customers:before,
.MainMenu > ul > li.active.has-sub .Customers:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/customers-active.png");
}

.MainMenu > ul > li.has-sub:hover .Customers:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/customers-active.png");
}

.MainMenu .menu-icon i.Orders:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/orders.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .Orders:before,
.MainMenu > ul > li.active.has-sub .Orders:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/orders-active.png");
}

.MainMenu > ul > li.has-sub:hover .Orders:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/orders-active.png");
}

.MainMenu .menu-icon i.Reports:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/reports.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .Reports:before,
.MainMenu > ul > li.active.has-sub .Reports:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/reports-active.png");
}

.MainMenu > ul > li.has-sub:hover .Reports:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/reports-active.png");
}

.MainMenu .menu-icon i.Inventory:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/inventory.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .Inventory:before,
.MainMenu > ul > li.active.has-sub .Inventory:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/inventory-active.png");
}

.MainMenu > ul > li.has-sub:hover .Inventory:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/inventory-active.png");
}

.MainMenu .menu-icon i.Vendors:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/vendors.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .Vendors:before,
.MainMenu > ul > li.active.has-sub .Vendors:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/vendors-active.png");
}

.MainMenu > ul > li.has-sub:hover .Vendors:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/vendors-active.png");
}

.MainMenu .menu-icon i.Accounting:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/accounting.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .Accounting:before,
.MainMenu > ul > li.active.has-sub .Accounting:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/accounting-active.png");
}

.MainMenu > ul > li.has-sub:hover .Accounting:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/accounting-active.png");
}

.MainMenu .menu-icon i.Settings:before {
    /*font-family: "FontAwesome";*/
    background-image: url("/images/menu-icons/settings.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .Settings:before,
.MainMenu > ul > li.active.has-sub .Settings:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/settings-active.png");
}

.MainMenu > ul > li.has-sub:hover .Settings:before {
    /*font-family: "glyphs";*/
    background-image: url("/images/menu-icons/settings-active.png");
}

.whats-new {
    height: 32px;
    width: 32px;
    margin: 8px;
}

.whats-new:before {
    /*font-family: "glyphs";*/
    width: 10px;
    content: url("/images//whats-new-active.svg");
}

.whats-new-menu-icon {
    background: #23b1f7;
    border-radius: 4px;
    height: 37px;
    width: 37px;
    display: flex;
    justify-content: center;
}
.whats-new-menu-label {
    text-indent: 9px;
    display: inline-block;
    color: #ffffff;
}
#whatsNewIcon a {
    border: none !important;
    padding-left: 8px;
}

#whatsNewIcon a:hover .whats-new-menu-label {
    color: #23b1f7;
}

.UserImg {
    display: inline-block;
    width: 45px;
    height: 45px;
    border-radius: 45px;
    float: left;
    margin-left: 10px;
    margin-right: 10px;
}

.UserSect {
    display: inline-block;
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 15px;
    border-bottom: solid thin #2f3439;
    box-sizing: border-box;
}

.SideBase.slim .UserSect {
    display: none;
}

.UserImg img {
    width: 100%;
    border-radius: 50px;
}

.WelcomeTxt {
    color: #90929d;
    line-height: 20px;
    white-space: normal;
}

.IconButton {
    width: 60.2px;
    height: 54px;
    line-height: 54px;
    display: block;
    border-right: solid thin #efefef;
    text-align: center;
    font-size: 20px;
    cursor: pointer;
    float: left;
}

.IconButton i {
    line-height: 54px;
    color: #bdc3c7;
}

.IconButtton:hover i {
    color: #6d7377;
}

.IconButton:hover,
.HelpSupport:hover,
.HomeButton:hover {
    background-color: #eef2f5;
}

.HelpSupport,
.HomeButton {
    float: right;
    border-left: solid thin #efefef;
    height: 54px;
    line-height: 54px;
    padding: 0px 20px;
    font-weight: normal;
    font-size: 13px;
    display: block;
    color: #c5cad4;
    text-decoration: none;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

.LoginUserText {
    color: #28bd8b;
    font-weight: normal;
    font-size: 13px;
    /*float: right;*/
}

.BuyerNameText {
    font-weight: 300;
    color: #81858d;
    font-size: 13px;
    float: right;
}

.infomation-icon {
    vertical-align: middle;
    padding-left: 5px;
    padding-bottom: 5px;
}

.LoginUserTextPostion {
    float: right;
    display: flex;
    align-items: center;
    justify-content: center;
    /* border-left: solid thin #efefef; */
    /* margin-top: 12px; */
    /* padding: 0px 20px; */
}


.HelpSupport i,
.HomeButton i {
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    border: solid 1px #bdc3c7;
    color: #bdc3c7;
    border-radius: 25px;
    margin-right: 5px;
}

body::-webkit-scrollbar {
    width: 10px;
}

body::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0px;
}

body::-webkit-scrollbar-thumb {
    background-color: darkgrey;
}

.Page::-webkit-scrollbar:horizontal {
    height: 4px;
}

.Page::-webkit-scrollbar-track:horizontal {
    -webkit-box-shadow: inset 0 0 0px rgba(0, 0, 0, 0.3);
}

.dxgvControl {
    width: 100%;
}

.SideBase .MenuLabel {
    text-indent: 2px;
    display: inline-block;
}

.SideBase.slim .MenuLabel {
    display: none;
}

.SideBase.slim .MainMenu > ul > li {
    height: 54px;
    width: 54px;
}

.SideBase .LogoIcon {
    display: block;
    width: 54px;
    top: 0px;
    height: 54px;
    border-top: solid thin #2f3439;
    background-color: #252a30;
    padding-top: 16px;
    padding-left: 10px;
    box-sizing: border-box;
}

.SideBase .LogoIcon {
    display: none;
}

.SideBase .LogoIcon img {
    height: 21.9px;
    width: 25.6px;
    padding-top: 8%;
    padding-left: 5%;
}

.SideBase.slim .LogoIcon {
    background-color: white;
    border-top-style: none;
    height: 54px;
    border-right: solid thin #efefef;
    padding: 0;
    align-items: center;
    justify-content: center;
    display: flex;
    width: 100%;
}

.SideBase .Menu {
    margin-top: 20px;
}

.SideBase.slim .UserLogo {
    display: none;
}

/*Inner Page*/
.PageContent {
    width: 100%;
    box-sizing: border-box;
    background-color: #ffffff;
    border: solid thin #e5e6e7;
    margin-bottom: 40px;
    display: inline-block;
    padding: 16px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.PageContentSeperater {
    padding-top: 10px;
    height: 3px;
    border: solid 0.5px #c5cad4;
}

.PageContentPadding {
    width: 100%;
    box-sizing: border-box;
    background-color: #ffffff;
    border: solid thin #e5e6e7;
    margin-bottom: 40px;
    display: inline-block;
    padding: 20px;
}

.PageContent.PageContentMain {
    width: 75%;
    float: left;
}

.PageContent.PageContentSide {
    width: 24%;
    margin-left: 1%;
    float: left;
}

.TitlePlace {
    float: left;
    margin-left: 15px;
    line-height: 60px;
}

.PageTitle {
    font-size: 17px;
    font-weight: bold;
    color: #5a6779;
    text-transform: uppercase;
}

.LocalTitle {
    font-size: 17px;
    font-weight: bold;
    color: #5a6779;
    text-transform: uppercase;
}

.FormGroup span {
    line-height: 32px;
    /*height: 30px;*/
}

.FormGroup .FormTooltip {
    height: 35px;
    line-height: 35px;
    padding: 0 10px 0 10px;
}

.FormGroup .FormTooltip:before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f128";
}

.ActionButton .ButtonTooltip:after {
    font-family: "Font Awesome 5 Free";
    content: "\f128";
    font-style: normal;
    font-weight: 900;
}

.FormGroup select {
    border-color: #e5e6e7;
    padding-left: 15px;
    color: #2c4054;
    box-sizing: border-box;
    max-width: 200px !important;
    font-size: 15px;
}

.FormGroup select option {
    line-height: 30px !important;
}

.PageHead {
    padding-bottom: 8px;
    /*box-shadow: 0 0.5px 0 #c5cad4;*/
    box-sizing: border-box;
    /*min-height:42px;*/
}

.PageMiddle {
    padding: 1px;
    width: 100%;
    box-sizing: border-box;
}

.firstLine {
    float: left;
    width: 100%;
}

.secondLine {
    float: left;
    margin-top: 15px;
}

.Tools {
    display: inline-block;
    /* max-width: 80%; */
}
.Order-Event-Tools{
    margin-inline-end: 0px;
}

.ToolsOposite {
    display: inline-block;
}

.Tools .FormGroup {
    float: left;
}

.ToolsOposite .FormGroup {
    float: right;
}

.PageHead .FormGroup {
    padding: 0px 4px;
}

.users-list .FormGroup {
    padding: 0;
}

.PageHead .FormGroup.FormGroupPaddingAfter {
    padding: 0px 8px 0px 0px;
}

.PageHead .FormGroup.ac-FormGroup {
    padding: 0 6px 0 4px;
}

.PageHead .FormGroup.ac-FormGroup:first-child {
    padding-left: 0px;
    padding-right: 6px;
}

/*.PageHead .FormGroup:first-child {*/
/*    padding-left: 0px;*/
/*    padding-right: 4px;*/
/*}*/

.FirstDDElement {
    padding-right: 4px !important;
}

.PageHead .FormGroup.PullRight {
    margin-left: 10px;
}

.PageMiddle .FormGroup {
    padding: 0px 5px;
}

.PageMiddle .FormGroup:first-child {
    padding-left: 0px;
}

.PageMiddle .FormGroup.PullRight {
    margin-left: 10px;
}

.ToolsLeft {
    float: left;
}

.ToolsRight {
    float: right;
}

.dxgvControl,
.dxgvDisabled {
    font: 13px "Roboto" !important;
    font-stretch: condensed;
    /*word-break: break-word;*/
}

/*Table*/
.dxgvHeader {
    background-color: #ffffff !important;
    border-right: 0px;
    border-bottom-width: 2px !important;
    border-bottom-color: #e5e6e7 !important;
    padding: 0px 6px !important;
    border-style: none !important;
}

.dxgvHeader,
.dxgvHeader table {
    height: 45px;
    vertical-align: middle;
    background-color: #e3ebf8 !important;
    color: #697586 !important;
    border-right-width: 0px;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    padding-left: 10px;
    padding-right: 10px;
}

tr [id*="_DXHeadersRow0"] td:first-child {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

tr [id*="_DXHeadersRow0"] td:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.dxgvHeader:hover,
.dxgvHeader table:hover,
.dxgvHeader:focus,
.dxgvHeader table:focus {
    border-bottom-color: #28bd8b !important;
}

.dxgvFilterRow {
    background-color: #f9fafb !important;
}

.dxgvFilterRow td.dxgv {
    padding: 0px 15px 0px 5px !important;
    border-bottom-style: none;
}

.dxeTextBox,
.dxeMemo {
    border-color: #e5e6e7 !important;
}

.dxeTextBox .dxeEditArea {
    height: 32px !important;
    line-height: 32px !important;
    padding-left: 15px;
    box-sizing: border-box;
    font-family: inherit;
    color: #2c4054;
}

.dxeTextBox td.dxic {
    padding: 0px !important;
}

.dxgvDataRow {
    cursor: pointer;
}

.dxgvDataRow:hover {
    background-color: #f4f7fa;
}

td.dxgv {
    height: 50px;
    border-bottom: Solid thin rgb(229, 231, 236);
    border-left: 0px;
    border-right: 0px !important;
    border-top: 0px;
    color: #424c5a;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    font-size: 13px;
}

.dxgvEditFormDisplayRow td.dxgv,
.dxgvDataRow td.dxgv,
.dxgvDataRowAlt td.dxgv,
.dxgvSelectedRow td.dxgv,
.dxgvFocusedRow td.dxgv {
    border-bottom: Solid thin rgb(229, 231, 236);
    border-bottom-style: solid !important;
}

.dxgvTable {
    color: #2c4054 !important;
    table-layout: fixed;
}

.dxgvTable tr td.dxgvCommandColumn {
    width: 20px !important;
}

.dxgvFooter {
    background-image: url("/images/summary.png");
    background-color: transparent;
    height: 45px;
}

.dxgvFooter td.dxgv {
    color: #28bd8b;
    font-weight: bold;
}

.dxWeb_edtCheckBoxUnchecked {
    background-image: url("/images/empty-checkbox-copy.png") !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
    width: 11px !important;
    height: 11px !important;
    background-position: 0px !important;
}

.dxWeb_edtCheckBoxChecked {
    background-image: url("/images/selected-checkbox.png") !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
    width: 11px !important;
    height: 11px !important;
    background-position: 0px !important;
}

.dxWeb_edtCheckBoxUnchecked,
.dxWeb_edtCheckBoxGrayed,
.dxWeb_edtCheckBoxCheckedDisabled,
.dxWeb_edtCheckBoxUncheckedDisabled,
.dxWeb_edtCheckBoxGrayedDisabled {
    background-image: url("/images/empty-checkbox-copy.png");
    background-repeat: no-repeat;
    background-color: transparent;
    width: 11px;
    height: 11px;
    background-position: 0px;
}
.CheckBoxRow{
    margin-right: 5px !important;
    margin-left: 5px !important;
}
.ActionButton {
    height: 34px;
    padding: 8px 20px;
    border: solid thin #28bd8b;
    color: White;
    font-weight: normal;
    text-align: center;
    font-size: 14px;
    background-color: #28bd8b;
    cursor: pointer;
    padding-left: 23px;
    padding-right: 23px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 3px;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

.ActionButton:hover {
    background-color: #42d7a5;
    border: solid thin #42d7a5;
}

.ActionButton.Gray {
    background-color: #ebedf0;
    border: solid thin #ebedf0;
    color: black;
}

.ActionButton.Gray:hover {
    background-color: #d1d5da;
    border: solid thin #d1d5da;
    color: black;
}

.ActionButton-red {
    border: solid thin #ea5a5a !important;
    background-color: #ea5a5a !important;
}

.ActionButton-red:hover {
    background-color: #ff9494 !important;
    border: solid thin #ff9494 !important;
}

.ActionButton-orange {
    border: solid thin #fc711e !important;
    background-color: #fc711e !important;
}
.ActionButton-blue {
    border: solid thin #0277BD !important;
    background-color: #0277BD !important;
}

.ActionButton-orange:hover {
    background-color: #FFAB58 !important;
    border: solid thin #FFAB58 !important;
}
.ActionButton-blue:hover {
    background-color: #23B1F7 !important;
    border: solid thin #23B1F7 !important;
}
.ActionButton-purple {
    border: solid thin #ab47bc;
    background-color: #ab47bc;
}
.ActionButton-purple:hover {
    background-color: #ab47bc;
    border: solid thin #ab47bc;
}
.ActionButton-red:disabled, .ActionButton-orange:disabled,.ActionButton-blue:disabled {
    border: 1px solid #999999 !important;
    background-color: #cccccc !important;
    color: #666666 !important;
}

.ActionButton:disabled,
.ActionButton-purple:disabled {
    border: 1px solid #999999;
    background-color: #cccccc;
    color: #666666;
}

.ActionButtonMedium {
    text-align: center;
    font-weight: normal;
    background-color: #28bd8b;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 0px;
    color: white;
    float: right;
    height: 35px;
    width: 75px;
    border: #28bd8b;
}

.ActionButtonMedium:hover {
    background-color: #42d7a5;
}

.CancelButtonMedium {
    text-align: center;
    font-weight: normal;
    background-color: #ffffff;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 0px;
    color: #2c4054;
    float: right;
    height: 35px;
    width: 75px;
    border: solid 1px #2c4054;
}

.CancelButtonMedium:hover {
    border: solid 1px #28bd8b;
    color: #28bd8b;
}

.ExportLink {
    background-color: transparent;
    color: #b2b3b5;
    border: none;
    width: 30px;
    height: 34px;
    display: block;
    background-image: url(/images/xsl.svg);
    background-position: 50% 60%;
    background-size: auto;
    background-repeat: no-repeat;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

.ExportLink:hover {
    color: #b2b3b5;
}

/*Checkbox*/

textarea:focus,
input:focus,
select:focus {
    outline: 0px;
}

.FormGroup:not(.new-checkbox) input[type="checkbox"],
.FormGroup input[type="radio"] {
    display: none;
}

.FormGroup label {
    display: inline;
    float: left;
    color: #000;
    cursor: pointer;
    /*text-indent: 20px;*/
    white-space: nowrap;
}

.list-page .Tools .FormGroup.new-checkbox {
    padding: 9px 8px;
}

FormGroup Checkbox label {
    white-space: nowrap;
}

.FormGroup:not(.new-checkbox) input[type="checkbox"] {
    display: none;
}

.FormGroup label {
    display: block;
    float: left;
    color: #000;
    cursor: pointer;
}

.FormGroup input[type="checkbox"] + label {
    display: block;
    height: 24px;
    vertical-align: middle;
    line-height: 23px;
    font-size: 14px;
    margin: 4px 0px;
}

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

.FormGroup input[type="checkbox"]:checked + label::before {
    content: "\f00c";
    color: #2b3f53;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-left: 0px;
    margin-right: 10px;
    font-size: 15px;
    border: 1px solid #d9dfe1;
    border-radius: 2px;
    background-color: #fff;
}

.FormGroup input[type="checkbox"] + label::before {
    content: "\f0c8";
    color: #fff;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-left: 0px;
    margin-right: 10px;
    font-size: 15px;
    border: 1px solid #d9dfe1;
    border-radius: 2px;
    background-color: #fff;
}

.dxgvDataRowAlt {
    background-color: #fff;
}

.row {
    display: inline-block;
    width: 100%;
}

.Col12 {
    width: 100%;
    box-sizing: border-box;
}

.Col8 {
    width: 66.6666%;
    float: left;
    box-sizing: border-box;
}

.Col6 {
    width: 50%;
    float: left;
    box-sizing: border-box;
}

.Col3 {
    width: 25%;
    float: left;
    box-sizing: border-box;
}

.Col4 {
    width: 33.3333%;
    float: left;
    box-sizing: border-box;
}

.Col2 {
    min-width: 16.6666%;
    float: left;
    box-sizing: border-box;
}

.Col1 {
    width: 8, 3333%;
    float: left;
    box-sizing: border-box;
}

.Padding5 {
    padding: 5px;
}

.font-size-smaller {
    font-size: smaller;
}

.Padding5:first-child {
    padding-left: 0px;
}

.ItemDetailsItemAllergens .Padding5:first-child {
    padding-left: 5px;
    padding-right: 0px;
}

.Padding5:last-child:not(:first-child) {
    padding-right: 0px;
}

.PaddingInfoCol {
    padding: 20px 60px 40px 40px;
}

.TitleForm {
    border-bottom: solid thin #efefef;
    margin-bottom: 20px;
}

.TitleForm span {
    border-bottom: solid thin #28bd8b;
    line-height: 44px;
    padding-bottom: 10px;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: bold;
}
.BuyerIntegrationTitle{
    margin-bottom: 32px;
    line-height: 32px;
}
.BuyerIntegrationFormGroup{
    margin-bottom: 20px;
}
.FormGroup .Label {
    color: #6c7a89;
    font-size: 13px;
    padding-bottom: 3px;
}

.FormGroup .FormControl {
    color: #2c4054;
    font-size: 15px;
    height: 34px;
    font-weight: 400;
    border: solid thin #d9dfe1;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
}

.FormGroup .ShortFormControl {
    color: #2c4054;
    font-size: 15px;
    height: 34px;
    font-weight: 400;
    border: solid thin #d9dfe1;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 10px;
    width: calc(100% - 20px);
}

.link-button {
    background: none;
    border: none;
    color: black;
    text-decoration: underline;
    cursor: pointer;
    font-size: 15px;
}

.IntegrationAppSettingsPanelTab{
    width: 100%;
    max-width: 100% !important;
}
.IntegrationAppSettingsLocationRowName{
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    position: relative;
    color: var(--text, #010F19);
    font-family: Roboto;
    left: 22px;
    width: 100%;
}
.IntegrationAppSettingsLocationRowContainer{
    max-width: 100%;
}
.IntegrationAppSettingsLocationRowSelect{
    margin:0% 20%;
    padding: 12px;
    background-color: white;
}
.IntegrationAppSettingsLocationSelect{
    min-width: 200px;
    max-width: 200px;
}
.IntegrationAppSettingsTableFormRow{
    display: flex;
    align-items: center;
    gap: 16px;
    align-self: stretch;
}
.IntegrationAppSettingsGeneralTabSubTitle{
    color: #010F19;
    font-family: Roboto;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 18px;
}
.IntegrationAppSettingsGeneralPopupContainer{
    margin-top:25px;
    max-width: 100%;
    margin-right: 48px;
    margin-left:48px;
}
.IntegrationAppSettingsGeneralForecastAreaContainer{
    display: grid;
    grid-template-columns: 3fr 3fr 2fr;
    gap:8px;
    margin-top: 10px;
}
.IntegrationAppSettingsLaborCostContainer{
    position: relative;
    top: 20px;
}
.IntegrationAppSettingsLaborCostSelectContainer{
    margin-top: 15px;
    display: grid;
    grid-template-columns: 3fr 3fr 2fr;
}
.IntegrationAppSettingsLocationRowBottomGray{
    border-bottom: solid 1px rgb(217, 223, 225);
}
.ShortActionButton{
    padding: 0px 18px;
}
.FormGroup select {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: white;
    background-image: url("/images/arrow-down.png");
    background-position: 95% center;
    background-repeat: no-repeat;
    padding-right: 1.5em;
    color: #5a6779;
    font-size: 13px;
    height: 34px;
    font-weight: 400;
    border: solid thin #d1d2d5;
    width: auto;
    padding-left: 11px;
    border-radius: 3px;
}

.Order select {
    width: 100% !important;
}

.ShowDatePicker {
    border: solid thin #d9dfe1;
    padding-left: 10px;
    height: 34px;
}

.PageFooter {
    padding: 40px;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
}

.PageFields {
    height: 100px;
    padding-top: 30px;
    padding-bottom: 30px;
    border: 1px dashed #ebedf0;
    border-left: 0;
    border-right: 0;
}

.PageReadFields {
    color: #5a6779;
    padding-top: 20px;
    border-top: 1px dashed #ebedf0;
}

.default-popup-text-color {
    color: #5a6779;
}

.PageReadFields .section-start {
    width: 500px;
}

.PageReadFields .ReadField {
    min-width: 122px;
}

.ActionButton.Big {
    padding: 14px 35px;
    height: 60px;
    font-size: 20px;
}

.GreenBtn {
    background-color: #28bd8b;
    border: solid thin #006533;
}

.GreenBtn:hover {
    background-color: #006533;
    border: solid thin #006533;
}

.GreyBtn {
    background-color: #ffffff;
    color: #2c4054;
    border: solid 1px #2c4054;
    border-radius: 3px;
    padding: 8px 20px;
    font-family: inherit;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    font-size: 14px;
}

.GreyBtn:hover {
    background-color: #ffffff;
    color: #28bd8b;
    border: solid 1px #28bd8b;
}

.dxeHyperlink {
    font: 13px "Roboto" !important;
    /*font: normal 14px Arial;*/
    /*font-family: "Roboto" !important;
    font-stretch: normal;*/
    /*font-size:14px;*/
    color: #2c4054 !important;
}

.dxeButtonEdit {
    height: 32px;
    border-color: #e5e6e7 !important;
}

.dxeEditArea {
    /*font: 14px Arial !important;*/
    /*font: inherit;
    font-family: "Roboto" !important;
    font-stretch: normal;*/
    /*font-size:14px;*/
    padding-left: 10px !important;
    box-sizing: border-box;
    font: 13px "Roboto" !important;
}

.dxeButtonEditButton {
    background-color: white !important;
    border: none !important;
    background-image: none !important;
}

.dxeButtonEditButton:hover {
    background-color: #f1f1f2;
}

.SearchInput {
    height: 34px;
    border: solid thin #e5e6e7;
    border-radius: 2px;
    line-height: 31px;
    padding-left: 10px;
}

.ExportLink.VendorDetails {
    background-image: url(/images/vendor-d.svg) !important;
}

.ExportLink.VendorCatalog {
    background-image: url(/images/vendor-list.svg) !important;
}

/*Custom Table */
#ddSection2 input {
    text-indent: 0;
    padding: 2px 2px 1px;
    border-width: 0 0 1px;
    line-height: 26px;
    height: 30px;
    border-radius: 0;
    border-style: solid;
    background-color: inherit;
    color: rgba(0, 0, 0, 0.87);
    border-color: rgba(0, 0, 0, 0.12);
}

#ddSection2 input:focus {
    border-color: #28bd8b;
}

.TableHeader1 {
    display: table-cell;
    height: 45px;
    vertical-align: middle;
    background-color: #e3ebf8 !important;
    color: #5a6779 !important;
    border-right-width: 0px;
    font-size: 14px;
    padding-left: 5px;
    padding-right: 5px;
    text-transform: uppercase;
    font-weight: 500;
}

.TableHeader1:first-of-type {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.TableHeader1:last-of-type {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.TableRow1:hover {
    background-color: #f4f7fa;
}

.TableCell1 {
    height: 45px;
    border-bottom: Solid thin rgb(229, 231, 236);
    border-left: 0px;
    border-right: 0px;
    padding-left: 5px;
    padding-right: 5px;
    border-top: 0px;
    color: #424c5a;
    display: table-cell;
    vertical-align: middle;
    font-size: 13px;
}

TableCell1Title {
    height: 45px;
    border-bottom: Solid thin rgb(229, 231, 236);
    border-left: 0px;
    border-right: 0px;
    padding-left: 13px;
    padding-right: 13px;
    border-top: 0px;
    color: #424c5a;
    display: table-cell;
    vertical-align: middle;
    font-size: 13px;
    font-weight: 500;
}

.doc-details-title {
    font-size: 14px;
    font-weight: 500;
    line-height: 2.86;
    color: #5a6779;
}

.doc-details-lower-section {
    width: 100%;
}

.doc-details-comment-and-upload-area {
    width: 75%;
    padding-right: 2%;
}

.doc-details-comment-and-upload-area .drag-and-drop-box {
    width: 99%;
    height: 70px;
    font-size: 17px;
    font-weight: bold;
    line-height: 1.88;
    text-align: center;
    color: #c8ccd4;
}

.doc-details-comment-and-upload-area .drag-and-drop-box span {
    font-size: 17px;
    font-weight: bold;
    line-height: 1.88;
    text-align: center;
    color: #c8ccd4;
}

.doc-details-comment-and-upload-area .drag-and-drop-box .cloud-icon {
    text-align: unset;
}

.doc-details-comment-and-upload-area .drag-and-drop-box .cloud-icon img {
    width: 40px;
    vertical-align: middle;
}

.doc-details-totals-area {
    width: 23%;
}

.doc-details-totals-area .TableDisplay1 {
    width: 33%;
    margin-top: 0;
}

.doc-details-totals-area .TableHeader1 {
    height: 32px;
}

.doc-details-totals-area input {
    border: 0 !important;
    border-bottom: solid thin #dedede !important;
    background-color: inherit !important;
}

.doc-details-totals-area input:focus {
    border-color: #28bd8b !important;
}

.area-title {
    height: 32px;
    vertical-align: middle;
    background-color: #e3ebf8 !important;
    color: #697586 !important;
    border-right-width: 0px;
    font-size: 14px;
    padding-left: 13px;
    padding-right: 13px;
    text-transform: uppercase;
    font-weight: 500;
    border-radius: 4px;
}

.doc-details-comment {
    width: 99%;
    height: 90px;
    border: 1px solid rgb(204, 204, 204) !important;
    margin: 15px 0px 0px;
    resize: none;
}

.Popup .TableCell1 .BlackLinkUL {
    font-size: 11px;
}

.Popup TableHeader1,
.Popup .TableCell1 {
    padding-right: 5px;
    padding-left: 5px;
    font-size: 11px;
}

tr.dxgv {
    height: 50px;
    background-color: #f1f9f5;
}

.table-count-case {
    max-width: 250px;
    overflow: hidden;
}

/*Dashboard*/
.InfoGroup {
    width: 100%;
    min-height: 68px;
    display: inline-block;
    padding: 0px 20px;
    border-right: solid 2px #dee4ea;
    box-sizing: border-box;
}

.InfoTitle {
    font-size: 13px;
    color: #bdc3c7;
    text-transform: uppercase;
    margin-top: 0px;
}

.InfoContent {
    font-size: 14px;
    color: #2c4054;
    line-height: 20px;
    margin: 0px;
}

.SubContent {
    font-size: 13px;
    color: #bdc3c7;
}

/*NewOrder Table*/
.fill-par {
    height: 35px;
    object-fit: contain;
    border-radius: 3px;
    background-color: #28bd8b;
    border: solid 0.5px #28bd8b;
    padding: 0;
    margin: 0;
    background-image: url(/images/fill-par.png);
    background-position: 5px 5px;
    background-repeat: no-repeat;
    vertical-align: middle;
    color: #fff;
    padding-left: 35px;
    padding-right: 10px;
}

.save {
    word-spacing: normal;
    letter-spacing: normal;
    width: 26.5px !important;
    height: 22px;
    border-top-left-radius: 100px;
    background-color: #fff;
    border: solid 1px #d7dce1;
    border-bottom-left-radius: 100px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 20px;
    background-image: url("/images/save.png");
    background-repeat: no-repeat;
    background-position: 8px 6px;
}

.save:hover {
    background-color: #23b1f7;
    border: solid 1px #23b1f7;
    background-image: url("/images/save-hover.png");
    background-repeat: no-repeat;
    background-position: 8px 6px;
}

.cancel {
    word-spacing: normal;
    letter-spacing: normal;
    width: 26.5px !important;
    height: 22px;
    border-top-right-radius: 100px;
    background-color: #fff;
    border: solid 1px #d7dce1;
    border-bottom-right-radius: 100px;
    display: inline-block;
    vertical-align: middle;
    background-image: url("/images/cancel.png");
    background-repeat: no-repeat;
    background-position: 8px 6px;
}

.cancel:hover {
    background-color: #23b1f7;
    border: solid 1px #23b1f7;
    display: inline-block;
    background-image: url("/images/cancel-hover.png");
    background-repeat: no-repeat;
    background-position: 8px 6px;
}

.par-text {
    width: 45px;
    height: 31px;
    border-radius: 3px;
    border: 0.5px solid rgb(218, 222, 230);
    padding: 0px;
    background-color: inherit;
    color: #2c4054;
    text-indent: 0px;
    text-align: center;
    line-height: 31px;
    font-size: 15px;
    border-top: none;
    border-right: none;
    border-left: none;
}

.left-col-order {
    box-sizing: border-box;
    background-color: #ffffff;
    border: solid thin #e5e6e7;
    margin-bottom: 40px;
    display: inline-block;
    padding-left: 16px;
    padding-top: 16px;
    padding-right: 16px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    width: 75%;
}

.right-col-order {
    width: 25%;
    float: right;
    box-sizing: border-box;
    margin-right: -5px;
}

.TableHeaderCust {
    height: 45px;
    color: #697586;
    display: table;
    line-height: 20px;
    padding-top: 10px;
    width: 100%;
    text-transform: uppercase;
    /*margin-top: 10px;*/
    border-radius: 2px;
    background-color: #e3ebf8;
    font-size: 15px;
    font-weight: 500;
}

.TableHeaderCustGridSimilar {
    height: 50px;
    color: #697586;
    display: table;
    line-height: 15px;
    width: 100%;
    text-transform: uppercase;
    border-radius: 2px;
    background-color: #e3ebf8;
    font-weight: 500;
}

.TableCellCustGridSimilar {
    height: 50px;
    display: table;
    width: 100%;
}

.tColGridSimilar {
    width: 10%;
    box-sizing: border-box;
}

.tColGridSimilar:first-child {
    padding-left: 17px;
}

.tColGridSimilarCell {
    width: 10%;
    box-sizing: border-box;
}

.TableHead {
    display: table-cell;
    vertical-align: middle;
}

.table-cell-dp {
    display: table-cell;
    vertical-align: middle;
}

.tCol1 {
    width: 8%;
    box-sizing: border-box;
}

.tCol2 {
    box-sizing: border-box;
    padding-left: 5px;
}

.tCol3 {
    width: 10%;
    box-sizing: border-box;
}

.tCol4 {
    width: 15%;
    box-sizing: border-box;
    line-height: 100%;
}

.tCol5 {
    width: 15%;
    box-sizing: border-box;
}

.tColIndic {
    min-width: 50px;
    box-sizing: border-box;
}

.tCol6 {
    width: 5%;
    box-sizing: border-box;
}

.tCol7 {
    width: 5%;
    box-sizing: border-box;
}

.ItemWraper {
    display: table;
    width: 100%;
    box-sizing: border-box;
}

.item-wraper-dp {
    display: table;
    width: 100%;
    box-sizing: border-box;
}

.item-wraper-dp.chain-manager:hover {
    background-color: #f4f7fa;
    cursor: pointer;
}

.left-col-order .PageHead {
    box-shadow: none;
}

.left-col-order .tCol1 {
    color: #5a6779;
    font-size: 15px;
    font-weight: bold;
    padding-left: 3px;
    width: 3%;
}

.left-col-order .tCol2 {
    width: 31%;
}

.left-col-order .tCol2.whiteLabelApp {
    width: 45%;
}

.left-col-order .tColImage {
    width: 4%;
    box-sizing: border-box;
}

.left-col-order .tCol3 {
    width: 13%;
}

.left-col-order .tCol4 {
    width: 16%;
}

.left-col-order .tCol5 {
    width: 15%;
}

.left-col-order .tCol6 {
    width: 20px;
}

.left-col-order .tCol7 {
    width: 0;
}

.left-col-order .tColUOM {
    width: 15%;
}

@media screen and (min-width: 1280px) and (max-width: 1550px) {
    .left-col-order .tCol4 {
        width: 21%;
    }

    .left-col-order .tColUOM {
        width: 10%;
    }
}

.orderImage img {
    max-width: 45px;
    height: 45px;
}

.ItemTd {
    display: table-cell;
    box-sizing: border-box;
    vertical-align: middle;
}

.ProductName {
    color: #5a6779;
    font-size: 15px;
    font-weight: 500;
}

.SupplierName {
    font-size: 14px;
    color: #a0a9b2;
}

.PriceCell {
    color: #5a6779;
    font-size: 15px;
    font-weight: 500;
}

.EditCell {
    color: #5a6779;
    cursor: pointer;
}

.SubLinePrice {
    font-size: 14px;
    color: #55585e;
    font-weight: 300;
}

.flot-container .ExportLink {
    display: initial;
    vertical-align: -9px;
}

.ContentBox {
    position: relative;
}

.ContentBoxTable {
    margin-top: 14px;
    margin-left: 17.5px;
    margin-right: 16.5px;
}

.SupplyersTab {
    position: absolute;
    top: 0px;
    right: 0px;
}

.edit-pencil-box {
    background-color: #eaeaea;
    margin-left: 5px;
}

.IconBtn {
    width: 24px;
    height: 24px;
    border-radius: 3px;
    display: block;
    cursor: pointer;
    position: relative;
    text-align: center;
    line-height: 34px;
    color: #2c4054;
    cursor: pointer;
    margin-top: 15px;
    border: solid 0.5px #fff;
}

.IconBtn:hover {
    background-color: #f6f9f9;
    border: solid 0.5px #dadee6;
}

.IconBtn img {
    width: 21px;
    margin-top: 5px;
}

.IconBtn .pencilImage {
    width: 12px;
    margin: 5px;
}

.NoUnderline {
    text-decoration: none !important;
}

.CountNotification {
    width: 12px;
    height: 12px;
    color: #fff;
    display: block;
    text-align: center;
    line-height: 12px;
    font-size: 9px;
    position: absolute;
    top: 0;
    left: -1px;
    background-color: #ea5a5a;
    border-radius: 50%;
    font-weight: bold;
}

.IconBtn .fa {
    font-size: 20px;
    line-height: 35px;
}

.CartDropdown {
    width: 160px;
    background-color: white;
    display: inline-block;
    position: absolute;
    left: -160px;
    top: 44px;
    box-shadow: 0px 1px 3px lightgrey;
}

.VendorsCart {
    color: #2c4054;
    display: block;
    cursor: pointer;
    padding: 10px;
}

.NewOrderFooter {
    width: 100%;
    display: inline-block;
    padding: 5px 16.5px 18px 17.5px;
    box-sizing: border-box;
}

.VendorsCart:hover {
    background: #e5e7e9;
}
.GreenButton {
    width: 34px;
    height: 34px;
    color: #28bd8b;
    background-color: #fff;
    border: solid 1px #28bd8b;
    font-size: 18px;
    padding: 6px 8px;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    margin: 0px 0px;
}

.GreenButton:hover {
    color: #fff;
    background-color: #28bd8b;
    border: solid 1px #28bd8b;
}

.GreyButton {
    height: 34px;
    color: #2c4054;
    background-color: #fff;
    border: solid 1px #2c4054;
    font-size: 14px;
    padding: 8px 23px;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    margin: 0px 0px;
}

.GreyButton:disabled {
    background-color: #dddddd;
    border-color: #dddddd;
    cursor: default;
    color: #666666;
}

.GreyButton:hover:enabled {
    color: #28bd8b;
    border: solid 1px #28bd8b;
}

.btn-image-container {
    width: 34px;
    display: flex;
    justify-content: center;
    cursor: pointer;
    padding: 0px !important;
    margin-left: 4px;
}

.btn-image-container img {
    margin: auto;
    display: block;
}

.GreyButton-red:hover:enabled {
    color: #ff9494 !important;
    border: solid 1px #ff9494 !important;
}
.GreyButton-orange:hover:enabled {
    color: #FFAB58 !important;
    border: solid 1px #FFAB58 !important;
}
.GreyButton-blue:hover:enabled {
    color: #23B1F7 !important;
    border: solid 1px #23B1F7 !important;
}

.green-material-secondary-button {
    height: 34px;
    border: none;
    color: #28bd8b;
    text-align: center;
    background-color: white;
    font-size: 14px;
    padding: 8px 10px;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    margin: 0px 0px;
}

.green-material-secondary-button:hover {
    background-color: lightgray;
}

.OrderInfo {
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    padding-top: 25px;
}

.OrderInfo ul {
    list-style: none;
    padding: 0px;
    box-sizing: border-box;
    margin: 0px;
}

.OrderInfo ul li {
    display: inline-block;
    padding: 6px 16.5px 6px 17.5px;
    color: #2c4054;
    width: 100%;
    box-sizing: border-box;
}

.OrderInfo ul li span {
    font-weight: 700;
}

.OrderTotal {
    width: calc(100% - 34px);
    color: #28bd8b;
    font-size: 18px;
    box-sizing: border-box;
    margin-top: 10px;
    margin-bottom: 14px;
    border-top: solid 1px rgb(217, 223, 225);
    margin-left: 17.5px;
    margin-right: 16.5px;
    padding-top: 10px;
    font-weight: 500;
}

.black-info {
    font-size: 8px;
    /*padding: 0 3px;*/
    background-color: #343945;
    border-radius: 2px;
    color: white;
    font-weight: 900;
    cursor: pointer;
    vertical-align: super;
}

/*#graphGetSplitOrdersByVendorPlaceholder*/
.highcharts-container .highcharts-title {
    position: relative;
}

/*Dashboard*/
.highcharts-title {
    left: 0px !important;
    color: #2c4054 !important;
}

/*Notificaiton Message*/
.BadBox:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f071";
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 30px;
    color: rgba(156, 0, 0, 0.18);
}

.preprocessed-error-list:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f071";
    position: absolute;
    top: 17px;
    left: 22px;
    font-size: 15px;
    color: #e74c3c;
}

.MenuItem {
    float: right;
    list-style: none;
    margin: 0px;
    padding-left: 0px;
}

.MenuItem li {
    color: #6c7a89;
    padding: 7px 6px;
    margin: 2px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 13px;
    cursor: pointer;
    float: left;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
}

.MenuItem li:hover {
    color: #28bd8b;
}

.MenuItem li.selected {
    border: 2px solid #28bd8b;
    padding: 5px 4px;
    color: #28bd8b;
}

.Col6 .MenuItem {
    float: left;
    margin-top: 10px;
}

.DDown {
    padding-left: 0px;
    margin-left: 5px;
}

.title {
    color: #2c4054;
    font: 25px "Arial", Verdana, sans-serif;
    float: left;
    margin-right: 10px;
    margin-left: 20px;
}

.ChartContainer {
    display: inline-block;
    width: 100%;
}

.DDown {
    display: inline-block;
    position: relative;
    padding-right: 30px;
}

.DDown li {
    display: none;
}

.DDown li.selected:before {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #f00;
    position: absolute;
    right: 0px;
}

.Dropdown {
    position: relative;
    display: inline-block;
}

.Dropdown ul {
    padding: 0px;
    margin: 0px;
    z-index: 100;
}

.Dropdown .ArrowD {
    position: absolute;
    top: 14px;
    right: 3px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #28bd8b;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.Dropdown.open .ArrowD {
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.Dropdown .top {
    display: block;
    border: solid thin #fff;
    color: #28bd8b;
    cursor: pointer;
    padding: 7px 20px 7px 10px;
}

.Dropdown li {
    display: none;
    padding: 7px 20px 7px 10px;
    cursor: pointer;
}

.Dropdown.open .top {
    border-left-color: #fff;
    border-right-color: #fff;
    border-bottom-color: #28bd8b;
}

.Dropdown li.selected {
    display: none !important;
}

.Dropdown.open li:hover {
    color: #28bd8b;
    background-color: #efefef;
}

.Dropdown.open li {
    display: block;
    border: 1px solid #efefef;
    border-top: 0;
}

.panel {
    position: absolute;
    min-width: 100px;
    background-color: #fff;
}

.OrrangeLink {
    color: #fc711e;
    cursor: pointer;
    font-weight: 400;
    line-height: 32px;
    text-decoration: underline;
    float: right;
}

.OrrangeLink:hover {
    color: #d05c17;
}

.HeadTitle {
    font-size: 20px;
    color: #2c4054;
    font-weight: 400;
}

.AlertContent {
    margin-bottom: 20px;
    border: solid thin #e5e6e7;
}

.AlertHead {
    padding: 10px;
    border-bottom: solid thin #e5e6e7;
}

.AlertBox {
    padding: 0px 10px;
}

.Padding20 {
    padding: 20px;
}

.Padding25 {
    padding: 25px;
}

.Padding10 {
    padding: 10px;
}

.PaddingTop10 {
    padding-top: 10px;
}

.PaddingTop30 {
    padding-top: 30px;
}

.AlertLine {
    display: inline-block;
    width: 100%;
}

.AlertLine .ShowTimePicker {
    height: 34px;
    border: solid thin #e5e6e7;
    color: #2c4054;
    line-height: 34px;
    padding-left: 10px;
}

.AlertLine .FormGroup {
    padding: 0px 10px;
}

.AlertLine {
    padding: 10px 0px;
    border-bottom: solid thin #e5e6e7;
}

.AlertFooter {
    padding: 10px;
}

.BtnIconSq {
    width: 30px;
    height: 30px;
    border-radius: 2px;
    cursor: pointer;
}

.BtnIconSqWrap {
    display: inline-block;
    width: 30px;
    height: 30px;
    position: relative;
}

.BtnIconSq.Save {
    background: #28bd8b;
    border: solid thin #006533;
    background-image: url(/images/check.svg);
    background-size: 18px 18px;
    background-position: 5px 5px;
    background-repeat: no-repeat;
}

.BtnIconSq.Delete {
    background-color: #d9dfe1;
    border: solid thin #bdc3c7;
    background-image: url(/images/close.svg);
    background-size: 18px 18px;
    background-position: 5px 5px;
    background-repeat: no-repeat;
}

.BtnIconSq.Save:hover {
    background-color: #02812c;
}

.BtnIconSq.Delete:hover {
    background-color: #bfc7c9;
}

.FormGroup.Buttons {
    padding-left: 10px;
    padding-top: 20px;
}

.Buttons .BtnIconSq {
    margin-left: 10px;
}

/*Login Screen*/
.LoginBoxWrap {
    margin-top: 80px;
    width: 100%;
    height: 100%;
    /*display: flex;*/
    justify-content: center;
    align-items: center;
    position: relative;
}

.LoginBox {
    width: 567px;
    max-width: 95%;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 3px;
    box-shadow: 15px 26px 70px 0 rgba(4, 1, 5, 0.25);
    /*border: solid thin #dadfe1;*/
}

.app-ico {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-top: 20px;
    object-fit: contain;
}

.Login-Header {
    font-size: 32px;
    font-weight: 300;
    text-align: center;
    color: #3f4d5f;
    color: var(--slate);
}

.Login-Text {
    font-size: 19px;
    font-weight: 300;
    line-height: 1.68;
    text-align: center;
    color: #3f4d5f;
    color: var(--slate);
}

.login-text-medium {
    font-size: 16px;
    font-weight: 300;
    line-height: 1.68;
    text-align: center;
    color: #3f4d5f;
    color: var(--slate);
}

.login-text-small {
    font-size: 13px;
    font-weight: 300;
    line-height: 1.68;
    text-align: center;
    color: #3f4d5f;
    color: var(--slate);
}

.login-label {
    font-size: 15px;
    color: #404d5f;
}

.LoginTextBox {
    height: 46px;
    border: none;
    border-radius: 2px;
    background-color: #ebedf0;
    font-size: 17px !important;
    font-weight: 300 !important;
    width: 100%;
    text-indent: 20px;
    margin-top: 5px;
}

.referral-top-bar {
    float: right;
    /*background-color:transparent;*/
    background-color: #1eb2f7;
    padding: 12px 20px 0px;
    height: 42px;
    cursor: pointer;
    text-align: center;
}

.referral-top-bar .span-white {
    color: white;
    font-size: 13px;
    font-weight: normal;
}

.referral-top-bar .span-black {
    color: black;
    font-size: 13px;
    font-weight: normal;
    float: right;
}

.referral-close {
    float: right;
    color: transparent;
    margin-top: -10px;
    margin-right: -15px;
    cursor: pointer;
    font-size: 10px;
}

.referral-top-bar:hover .referral-close {
    color: white;
}

.referral-new {
    float: right;
}

.referral-new-widget {
    display: flex;
    align-items: center;
    position: relative;
    background-color: #F7931E;
    height: 36px;
    margin: 9px;
    padding: 0 20px;
    border-radius: 28px;
}

.referral-new-widget .image {
    display: block;
    width: 24px;
    margin-right: 14px;
}

.referral-new-text {
    color: white;
    cursor: pointer;
}

.referral-new-close {
    color: white;
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    cursor: pointer;
    display: none;
}

.referral-new-widget:hover .referral-new-close {
    display: block;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus input:-webkit-autofill,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    border: 1px solid #93dec5;
    -webkit-text-fill-color: 3 f4c5f;
    -webkit-box-shadow: 0 0 0px 1000px #edfff9 inset;
    transition: background-color 5000s ease-in-out 0s;
}

.LoginTextBoxInline {
    width: 44%;
    float: left;
}

.LoginTextBoxInline.First {
    margin-right: 4%;
    width: 52%;
}

.LoginDefHeightAndLineHeight {
    font-size: 13px;
    line-height: 1.85;
    text-align: right;
    color: #3f4d5f;
    color: var(--slate);
}

.LoginTextBox::-webkit-input-placeholder {
    color: #a3a9b2;
}

.LoginButton {
    min-width: 167px;
    height: 52px;
    padding: 8px 20px;
    border: solid thin #28bd8b;
    color: White;
    text-align: center;
    font-size: 20px !important;
    font-weight: 500;
    background-color: #28bd8b;
    cursor: pointer;
    padding-left: 23px;
    padding-right: 23px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 3px;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

.LoginButton:hover {
    background-color: #34d59f;
    border: solid thin #34d59f;
}

.LoginButton:active {
    background-color: #20a176;
    border: solid thin #20a176;
}
.LoginButton:disabled {
    border-color:unset;
}

.LoginTextBox.LoginDropdown {
    color: #5a6779;
    background-color: white;
    border: solid 1px #cacfd7;
    max-width: none;
}

.LoginTextBox.ng-valid {
    color: #5a6779;
    background-color: white;
    border: solid 1px #93dec5;
}

.LoginTextBox.ng-dirty.ng-invalid {
    color: #ed4f47;
    background-color: white;
    border: solid 1px #f1aaa7;
}

.BackButton {
    height: 32px;
    width: 32px;
    position: absolute;
    background-color: #e8eaf1;
    margin-right: inherit;
    margin-left: 30px;
    border-radius: 2px;
    margin-top: 30px;
}

.BackGreenButton i {
    color: #28bd8b;
}

.BackGreenButton i:hover {
    color: #42d7a5;
    cursor: pointer;
}

.BackGreenButton i:focus {
    outline: none;
}

.error-messages {
    color: #ed4f47;
}

.login-suspend-text {

    font-weight:500;
}

.login-suspend-a {
    font-weight:500;
}

.LoginBoxData {
    width: 411px;
    max-width: 90%;
    margin: 0 auto;
    padding: 70px 0px;
    border: solid 0px black;
}

.ImageWrapper {
    position: absolute;
    margin-top: -35px;
    left: 50%;
}

.LogoImage {
    background: url("/images/loginLogo.png") no-repeat center center;
    width: 235px;
    height: 117px;
    object-fit: contain;
    position: relative;
    left: -50%;
    z-index: 5;
}

.LogoImageSaval {
    background: url("/images/loginLogoSaval.jpg") no-repeat center center;
    width: 235px;
    height: 117px;
    object-fit: contain;
    position: relative;
    left: -50%;
    z-index: 5;
}

.LogoImageHalsey {
    background: url("/images/loginLogoHalsey.png") no-repeat center center;
    width: 235px;
    height: 180px;
    object-fit: contain;
    position: relative;
    left: -50%;
    padding-bottom: -50px;
    z-index: 5;
}
.LogoImageChefShop{
    background: url(/images/loginChefShop.png) no-repeat center center;
    background-size: 290px 70px;
    width: 290px;
    height: 175px;
    object-fit: contain;
    position: relative;
    left: -50%;
    z-index: 5;
    }

.halsey-terms-and-conditions-margin-top {
    margin-top: 50px;
}

.halsey-forgot-password-margin-top {
    margin-top: 80px;
}

.LoginBoxHeader {
    font-size: 36px;
    font-weight: 300;
    color: #3f4d5f;
    margin: 20px 0 16px;
}

.StepBoxWrapper {
    margin-top: 30px;
    padding-bottom: 8px;
}

.StepBox {
    width: 32%;
    height: 6px;
    border-radius: 3px;
    background-color: #ebedf0;
    float: left;
    margin: 2px;
}

.current {
    background-color: #28bd8b;
}

.InputAddon {
    display: inline-block;
    width: 100%;
    height: 46px;
    position: relative;
}

.InputAddon i {
    position: absolute;
    left: 14px;
    top: 12px;
    color: #feb41c;
    font-size: 20px;
    text-align: center;
    width: 25px;
}

.Popup .TableHeader1 {
    font-size: 12px;
}

.TableCellImagePlaceholder {
    width: 35px;
}

.DropdownActions {
    position: relative;
    width: 100%;
}

.box-item-wrapper {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
}

.box-item {
    width: 50px;
    background-color: white;
    border-radius: 5px;
    border: solid 1px #cacfd7;
    height: 45px;
    margin: 5px;
    text-align: center;
    font-size: 17px;
    flex-grow: 1;
}

.boxItemSelected {
    background-color: white;
    color: #28bd8b;
}

.box-item-content {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

.SwitchUserActions {
    position: absolute;
    z-index: 10;
    background-color: white !important;
    right: 0;
    left: auto;
    display: none;
    box-shadow: 0px 2px 15px 0 rgba(70, 76, 83, 0.1);
    width: 205px;
    top: 100%;
    border-radius: 0 0 3px 3px;
}

/*.SwitchUserActions:after {
        position: absolute;
        top: -8px;
        right: 12px;
        left: auto;
        width: 0;
        height: 0;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-bottom: 8px solid white;
        content: '';
        display: block;
    }

    .SwitchUserActions:before {
        position: absolute;
        top: -10px;
        right: 10px;
        left: auto;
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-bottom: 10px solid #BDC3C7;
        content: '';
        display: block;
    }*/

.DropMenuActions {
    width: 250px;
    position: absolute;
    z-index: 10;
    background-color: white !important;
    border: solid thin #bdc3c7;
    border-radius: 2px;
    margin-top: 10px;
    right: 0;
    left: auto;
    padding: 8px;
    display: none;
}

.DropMenuActions:last-child {
    padding-bottom: unset;
}

.DropMenuActions:after {
    position: absolute;
    top: -8px;
    right: 12px;
    left: auto;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid white;
    content: "";
    display: block;
}

.DropMenuActions:before {
    position: absolute;
    top: -10px;
    right: 10px;
    left: auto;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #bdc3c7;
    content: "";
    display: block;
}

.DropMenuActions2 {
    width: 250px;
    position: absolute;
    z-index: 10;
    background-color: white;
    border: solid thin #bdc3c7;
    border-radius: 2px;
    margin-top: -110px;
    right: 0;
    left: 20px;
    padding: 10px;
    display: none;
}

.DropMenuActions2:before {
    position: absolute;
    bottom: -10px;
    left: 10px;
    right: auto;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #bdc3c7;
    content: "";
    display: block;
}

.DropMenuActions2:after {
    position: absolute;
    bottom: -8px;
    left: 12px;
    right: auto;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid white;
    content: "";
    display: block;
}

.DropMenuActions2 .GreyButton {
    width: 100%;
    margin-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
}

.DropMenuActions2 .ActionButton {
    width: 100%;
    margin-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
}

.DropMenuLeftActions .GreyButton {
    width: 100%;
    margin-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
}

.DropMenuLeftActions .ActionButton {
    width: 100%;
    margin-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
}

.DropMenuRightActions {
    width: 250px;
    position: absolute;
    z-index: 10;
    background-color: white;
    border: solid thin #bdc3c7;
    border-radius: 2px;
    margin-top: 10px;
    right: 0;
    padding: 10px;
    display: none;
}

.DropMenuRightActions:before {
    position: absolute;
    top: -10px;
    right: 12px;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #bdc3c7;
    content: "";
    display: block;
}

.DropMenuRightActions:after {
    position: absolute;
    top: -8px;
    right: 14px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid white;
    content: "";
    display: block;
}

.DropMenuRightActions .GreyButton {
    width: 100%;
    margin-bottom: 8px;
    margin-left: 0px;
    margin-right: 0px;
}

.DropdownActions:before {
    position: absolute;
    top: 0px;
    left: 80px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #bdc3c7;
}

.DropMenuActions .GreyButton {
    width: 100%;
    margin-bottom: 8px;
    margin-left: 0px;
    margin-right: 0px;
}

.DropMenuActions .GreyHeaderButton {
    width: 100%;
    margin-bottom: 8px;
    margin-left: 0px;
    margin-right: 0px;
}

.DropMenuRightActions .GreyHeaderButton {
    width: 100%;
    margin-bottom: 8px;
    margin-left: 0px;
    margin-right: 0px;
}

.DropMenuActions .ActionButton {
    width: 100%;
    margin-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
}

.fa-active {
    color: #28bd8b;
}

.fa-non-active {
    color: #b2b3b5;
}

.OLSeachFields input:not([type="checkbox"]) {
    width: 100%;
}

.OLSeachFields input[type="checkbox"] {
    margin-top: 10px;
    /*Pages/CatalogItems/BuyerCatalogItemsEdit2.aspx*/
}

.AlertBox input {
    margin-bottom: 10px;
}

.DashboardAlerts {
    width: 100%;
    min-height: 150px;
    max-height: 300px;
    overflow: auto;
    padding: 0px 10px;
    background-color: #fff;
}

.DashboardLite {
    color: black;
    padding: 10px;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    /*border: 1px solid #ddd;*/
    border: solid thin #e5e6e7;
    background-color: white;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    margin-top: 15px;
}

.slimScrollDiv {
    /*border: solid thin #ddd;*/
    border: solid thin #e5e6e7;
    border-radius: 2px;
}

.TitleAlerts {
    padding: 10px;
    font-size: 20px;
    box-sizing: border-box;
    display: inline-block;
    width: 100%;
    color: #2c4054;
    border-bottom: solid thin #ddd;
}

#spnTextAlert4 {
    width: calc(100% - 240px);
    display: inline-block;
    float: left;
}

.Col3:last-child .InfoGroup {
    border: none;
}

.TaskTitle {
    padding: 10px;
    font-size: 20px;
    box-sizing: border-box;
    display: inline-block;
    width: 100%;
    color: #2c4054;
    border-bottom: solid thin #ddd;
    position: relative;
}

.TaskTitle span {
    position: absolute;
    top: 5px;
    right: 5px;
}

.user-data-block span {
    padding: 0 10px;
    line-height: 15px;
}

.green-popup-title {
    font-size: 17px;
    font-weight: bold;
    color: #5a6779;
    text-transform: uppercase;
}

@media only screen and (max-width: 800px) {
    .Col8 {
        width: 100%;
    }

    .Col4 {
        width: 100%;
    }

    .Col3 {
        width: 100%;
    }

    .Col6 {
        width: 100%;
    }

    .Col2 {
        min-width: 33.333%;
    }

    .PageHead .FormGroup:first-child {
        padding-left: 5px;
    }

    .PageHead .FormGroup {
        padding: 5px 5px;
    }
}

.menu-scrollbar::-webkit-scrollbar {
    width: 14px;
    height: 18px;
}

.menu-scrollbar::-webkit-scrollbar-thumb {
    height: 6px;
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 7px;
    background-color: #85898c;
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05),
        inset 1px 1px 0px rgba(0, 0, 0, 0.05);
}

.menu-scrollbar::-webkit-scrollbar-button {
    width: 0;
    height: 0;
    display: none;
}

.menu-scrollbar::-webkit-scrollbar-corner {
    background-color: transparent;
}

.menu-scrollbar {
    overflow-y: auto;
}

ul.menu-scrollbar li.has-sub {
    padding-bottom: 10px;
}

.initial-font-weight {
    font-weight: initial;
}

.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 10px;
}

.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

.fileUpload span {
    text-decoration: underline;
    float: right;
}

#DocDetailsCtrl > div > div > ul > li > span.fa.fa-download {
    margin: 0 5px 5px 5px;
}

.gray-spacer {
    background-color: #f8f8f8;
    height: 24%;
    margin-left: -0.5em;
    margin-right: -0.5em;
}

.drop-box {
    background: #f8f8f8;
    border: 2px dashed #ddd;
    border-radius: 3px;
    width: 200px;
    height: inherit;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
}

.dragover {
    border: 2px dashed #28bd8b;
}

.attachment-preview {
    max-width: 100%;
    max-height: 100%;
    margin-bottom: -1px;
    height: 77%;
}

.attachment-container {
    height: 10em;
    width: 150%;
}

.attachment-element {
    height: inherit;
    width: 200px;
    margin-bottom: 20px;
}

.attachment-file-container {
    border: 1.5px solid #ddd;
    padding: 0.5em;
    padding-bottom: 0px;
    height: inherit;
    text-align: center;
}

.attachment-cut-text {
    text-overflow: ellipsis;
    overflow: hidden;
    width: 80%;
    height: 1.2em;
    white-space: nowrap;
    text-align: left;
}

.attachment-container-popup .attachment-file-container {
    border: none;
    background-color: #f8f8f8;
}

.attachment-container-popup .attachment-element {
    height: 160px;
    width: 160px;
}

#preview-doc {
    max-height: 100%;
    max-width: 100%;
}

.attachment-dialog-loader {
    border: 16px solid #f3f3f3;
    border-top: 16px solid #28bd8b;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
    margin: 30% auto;
}

.upload-invoices-popup-title {
    color: #2c4054;
    font-weight: 500;
}

.upload-invoices-popup-text {
    color: #929498;
}

/* model-dialog*/
.fade {
    opacity: 0;
    -webkit-transition: opacity 0.15s linear;
    -o-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
}

.fade.in {
    opacity: 1;
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 40% 10px 10px 10px;
    height: -moz-available;
    height: -webkit-fill-available;
    height: fill-available;
}

@media screen and (max-height: 640px) {
    .real-time-ocr-completed-popup .modal-dialog {
        overflow-y: auto;
    }
}

.modal-content {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
}

.modal-header {
    padding: 32px;
    border-bottom: none;
    background-color: rgb(250, 250, 250);
}

.modal-title {
    margin: 0;
    line-height: 1.42857143;
}

.modal-body {
    background-color: rgb(250, 250, 250);
    position: relative;
    padding: 15px;
    overflow-y: auto;
    max-height: 70vh;
    direction: ltr !important;
}

.modal-footer {
    padding: 15px;
    border-top: none;
    text-align: center;
    background-color: rgb(250, 250, 250);
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000;
}

.modal-backdrop.in {
    filter: alpha(opacity=50);
    opacity: 0.5;
    /* z-index: 100000 !important; */
}

.modal-backdrop.fade {
    filter: alpha(opacity=30);
    opacity: 0.52;
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
}

.modal.fade .modal-dialog {
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    -o-transform: translate(0, -25%);
    transform: translate(0, -25%);
}

.modal-x-btn {
    position: fixed;
    top: 20px;
    right: 20px;
    border: none;
    background-color: rgb(250, 250, 250);
}

.modal-x-btn:hover {
    cursor: pointer;
    color: #28bd8b;
}

.label-with-icon {
    margin-right: 5px;
    float: left;
}

.fa-label-icon {
    margin-bottom: 5px;
}

.flex-container {
    padding: 0;
    margin: 0;
    list-style: none;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    justify-content: space-around;
}

.flex-nowrap-align-center {
    display: flex;
    align-items: center;
}

.flex-item {
    border: 1px solid black;
    border-radius: 10px;
    padding: 5px;
    width: 150px;
    height: 150px;
    margin-top: 10px;
    line-height: 150px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
    position: relative;
}

.flex-item span {
    display: inline-block;
    vertical-align: middle;
    line-height: normal;
}

.flex-item:hover {
    border-color: #28bd8b;
}

.bottomOrderingMessage {
    position: absolute;
    bottom: 5px;
    left: 5px;
}

.back-button {
    width: 35px;
    height: 35px;
    border: solid 1px #2c4054;
    border-radius: 2px;
    background-color: white;
    cursor: pointer;
}

.back-button-no-border {
    width: 35px;
    height: 35px;
    background-color: white;
    border: solid 0px white;
    border-radius: 2px;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
}

.back-button.back-button-grey {
    border: none;
    background-color: #e8eaf1;
}

.back-button:hover,
.back-button-no-border:hover {
    background-color: #eef2ff;
}

/*Green popup*/
.green-popup:before {
    content: "";
    display: block;
    padding: 2px 0;
    line-height: 1px;
    border-top: 4px solid #28bd8b;
    position: absolute;
    top: 0px;
    width: 100%;
    z-index: 1;
}

.red-popup:before {
    border-top: 4px solid #ea5a5a !important;
}
.orange-popup:before {
    border-top: 4px solid #fc711e !important;
    /* border-top: 4px solid #ff9320 !important; */
    /* border-top: 4px solid #ff9100 !important; */
}
.blue-popup:before {
    border-top: 4px solid  #0277BD !important;
}

.orange-popup a {
    color: #fc711e !important;
}

.blue-popup a {
    color: #0277BD !important;
}

.green-popup .PopupCloseButton {
    background-color: transparent !important;
    color: inherit;
    border: none;
    padding: 0 !important;
    font: inherit;
    cursor: pointer;
    outline: inherit !important;
    background-image: url("/images/popup-close-x.png");
    height: 17px;
    width: 17px;
    position: absolute;
    top: 15px;
    right: 15px;
}

.zindex {
    z-index: 5500 !important;
}

.zindexHighest {
    z-index: 5501 !important;
}

.green-popup .modal-dialog-text {
    font-size: 15px;
    line-height: 1.6;
    color: #8794a6;
}

.green-popup .modal-dialog-title {
    font-size: 21px;
    font-weight: 400;
    color: #364c5f;
}

.green-popup .modal-header {
    background-color: #ffffff;
    min-height: 20px;
}

.green-popup .modal-body {
    padding: 5px 32px;
    background-color: #ffffff;
    color: #5a6779;
    direction: ltr !important;
}

.green-popup .modal-footer {
    background-color: #ffffff;
    padding: 32px;
    text-align: right;
}

.payment-popup .modal-footer {
    background-color: #ffffff;
    padding: 32px;
    text-align: unset;
}

.payment-popup .green-popup {
    max-height: 95vh;
    overflow-y: auto;
}

.green-popup .wizard-link {
    margin-top: 10px;
    display: inline-block;
    width: 50%;
    text-align: -webkit-center;
}

.green-popup input[type="text"]:not(.form-field-input):not(.manual-labor-cost-textbox) {
    border-radius: 2px !important;
    /*background-color: #ebedf0;*/
    height: 38px !important;
    font-size: 15px !important;
    font-weight: 300 !important;
    text-indent: 13px !important;
}

.green-popup input[type="text"].ng-dirty {
    background-color: #ffffff;
    border: solid 1px #5a6779;
}

.green-popup input::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #aeb3bb;
}

.green-popup-checkbox input[type="checkbox"] {
    -webkit-appearance: none;
    width: 24px;
    height: 24px;
    border-radius: 2px;
    background-color: #ffffff;
    border: solid 2px #ebedf0;
    display: inline-block;
    position: relative;
}

.green-popup-checkbox input[type="checkbox"]:checked {
    background-color: #393c49;
    border: none;
}

.green-popup-checkbox input[type="checkbox"]:checked:after {
    content: "\2714";
    font-size: 20px;
    position: absolute;
    /* top: 0; */
    bottom: 0.5px;
    left: 3px;
    color: #28bd8b;
}

.grey-popup-checkbox input[type="checkbox"] {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 2px;
    background-color: #ffffff;
    border: solid 2px #ebedf0;
    display: inline-block;
    position: relative;
    top: 7px;
}

.grey-popup-checkbox input[type="checkbox"]:checked {
    background-color: #ffffff;
    border: none;
}

.grey-popup-checkbox input[type="checkbox"]:checked:after {
    content: "\2714";
    font-size: 20px;
    position: absolute;
    /* top: 0; */
    bottom: 0.5px;
    left: 3px;
    color: #5a6779;
}

.green-popup .checkbox {
    display: flex;
}

.green-popup .checkbox label {
    margin: 4px;
    width: max-content;
}

.green-popup label:not(:md-input-container) {
    font-size: 15px !important;
    color: #3f4d5f !important;
    color: var(--slate) !important;
}

.green-popup a {
    font-size: 15px;
    color: #28bd8b;
}

.green-popup .DivRowInput {
    padding-bottom: 20px !important;
}

body.modal-open {
    overflow: hidden;
}

/* Item Details Popup */

/**
  * Hack for opened DD in popups
 */
html[style="overflow-y: scroll;"] {
    overflow-y: hidden !important;
}

.submodal-open {
    overflow: hidden;
}

.item-details,
.item-details *,
.popup-item-details,
.popup-item-details * {
    outline: none;
}

.item-details {
    display: flex;
    flex-direction: column;
    position: absolute;
    left: 0;
    right: 0;
    animation: edit-item-appear-y 1s forwards; /* change x to y for vertical animation*/
    top: 0;
    bottom: 0;
    background: white;
    z-index: 90;
    max-height: calc(100vh - 66px);
}

.item-details.closing {
    animation: edit-item-disappear-y 1s forwards; /* change x to y for vertical animation*/
}

.popup-item-details {
    display: flex;
    flex-direction: column;
}

.modal-open #nprogress .bar {
    z-index: 1100;
}

.modal.popup-item-details .modal-dialog {
    width: 80%;
    min-width: 950px;
    max-width: 1200px;
    margin: 0 0 0 auto;
    transform: none;
    height: 100vh;
}

.modal.popup-item-details.dp-modal .modal-dialog {
    width: 40%;
    min-width: 300px;
}

.modal.popup-item-details .modal-dialog .modal-content {
    height: 100%;
    background: transparent;
    box-shadow: none;
    border: none;
}

.popup-item-details .item-details__wrapper {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    animation: edit-item-appear-x 0.15s forwards;
}

.popup-item-details .item-details__wrapper.closing {
    animation: edit-item-disappear-x 0.15s forwards;
}

@keyframes edit-item-appear-y {
    0% {
        transform: translateY(100%);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes edit-item-disappear-y {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(100%);
    }
}

@keyframes edit-item-appear-x {
    0% {
        transform: translateX(100%);
    }

    100% {
        transform: translateX(0);
    }
}

@keyframes edit-item-disappear-x {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(100%);
    }
}

.item-details__wrapper {
    position: relative;
    height: 100vh;
    padding: 12px 0 0;
    background: #ffffff;
    border-radius: 6px 0 0 6px;
    box-sizing: border-box;
}

.item-details__wrapper .item-details__head .marketman-form-field {
    background: #ffffff;
}

.item-details__wrapper .md-tab {
    padding-left: 18px;
    padding-right: 18px;
}

.item-details__wrapper .item-details__tabContent .marketman-form-field {
    background: #fafafa;
}
.item-details__wrapper .item-details__tabContent .popup-form__table .marketman-form-field {
    background: white;
}

.item-details__backdrop {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 90;
}

.item-details__tabs,
.item-details__head {
    padding: 0 48px;
}

.item-details__close {
    position: absolute;
    top: 12px;
    right: 16px;
    font-size: 20px;
    cursor: pointer;
    user-select: none;
}

.item-details__close.disabled {
    cursor: not-allowed;
    pointer-events: none;
}

.item-details__tabs md-tabs md-tabs-wrapper {
    border-bottom: none;
}

.item-details__sysinfo-trigger-area {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    left: 0;
}

.popup-form__header {
    font-size: 14px;
    padding: 1px 16px;
    margin: 0;
}

.item-details__head-form {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
}

.item-details__head-form .item-details__formInput {
    flex-shrink: 0;
}

.popup-title-new-items-indicator {
    display: flex;
    width: 28px;
    align-items: center;
    height: 52px;
}

.popup-title-new-items-indicator img {
    height: 22px;
    padding: 0 5px 0 0;
}

.has-line-item-to-handle {
    padding-left: 22px;
    position: relative;
}

.has-line-item-to-handle::after {
    position: absolute;
    content: "";
    background: url("/images/new_items_icon_small.svg") center no-repeat;
    width: 18px;
    height: 18px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.countforms-warning {
    position: relative;
    bottom: 10px;
}

.item-details__form {
    display: flex;
    align-items: center;
    padding: 12px 0;
}

.item-details__formRow {
    display: flex;
    flex: 0 1 auto;
    min-width: 0;
}
.item-details__commissary-sale .item-details__formRow {
    height: 63px;
}

.item-details__formRow.checkbox-row {
    margin: 12px 0;
    flex-wrap: wrap;
}
.item-details__formRow.checkbox-row.checkbox-grid {
    row-gap:12px;
}
.item-details__formRow.checkbox-row marketman-form-field-checkbox {
    margin: 0 3px;
}
.item-details__formRow.checkbox-row.checkbox-grid marketman-form-field-checkbox{
    width:calc(50% - 6px);
}
.item-details__nameInput {
    display: flex;
    min-width: 0;
    margin-top: 2px;
    margin-right: 16px;
}

.item-details__counting {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.item-details__formInput {
    width: 280px;
    margin-right: 7px;
}
.item-details__formInput.short-width {
    width:200px;
}
.item-details__formInput.long-width {
    width:420px;
}
.item-details__formInput.half-length {
    width: 49%;
}
.width-unset {
    width:unset;
}
.item-details__formInput.double {
    width: 576px;
}

.item-details__formInput .marketman-button {
    margin-top: 6px;
    margin-left: 0;
    margin-right: 0;
}

.item-details__formRow md-input-container .hint {
    color: #28bd8b;
    font-size: 12px;
}

.item-details__headFormSubmit {
    display: flex;
    align-items: center;
    margin-left: 32px;
    margin-bottom: 18px;
    margin-right: -4px;
    flex-shrink: 0;
}

.dp-panel__headFormSubmit {
    display: flex;
    align-items: center;
    margin-right: 32px;
    margin-left: 32px;
    margin-bottom: 18px;
    flex-shrink: 0;
    justify-content: flex-end;
}

.item-details__headFormSubmit marketman-academy-link {
    margin: 0 4px;
}

.item-details__preloader {
    display: flex;
    top: 30px;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: inherit;
    z-index: 1200;
}

.item-details__spinner {
    margin: auto;
    padding-bottom: 66px;
}

.item-details__stock-changes {
    position: relative;
}

@keyframes spinner {
    0% {
        transform: none;
    }
    100% {
        transform: rotate(360deg);
    }
}

.item-details__content {
    height: 100%;
}

.item-details__tabContent {
    display: flex;
    flex-direction: column;
    height: calc(100% - 177px);
    padding: 0 48px 24px;
    background: #fafafa;
    border-radius: 0 0 0 6px;
    transition: 0.4s all;
}

.item-details__tabContent .nano {
    margin: 0 -10px -10px;
    width: calc(100% + 27px);
}

.item-details__tabContent .nano .nano-content {
    padding: 10px 20px 10px 10px;
}

.new-item-tabs .md-tab {
    max-width: 246px;
}

.new-item-tabs .invalid-tab {
    color: #ea5a5a;
}

.popup-form__section {
    margin: 24px 0;
}
.popup-form__section.flex-section {
    display:flex;
    /* flex-wrap: wrap; */
}
.popup-form__section-header {
    font-weight: 500;
    color: #5c82a4;
    font-size: 16px;
    margin-bottom: 12px;
}
.item-details__commissary-sale .popup-form__section-header {
    font-size:15px;
}

.popup-form__label {
    color: #5c82a4;
    font-size: 11px;
    margin: 4px 0;
}

.item-details__purchase-options .popup-form__table {
    grid-template-columns: 1.4fr 2fr 112px 130px auto repeat(4, 75px) minmax(
            48px,
            auto
        );
}

.item-details__purchase-options .popup-form__table.hq-item-table {
    grid-template-columns: 1.4fr 2fr 112px 130px auto repeat(3, 75px) minmax(
            48px,
            auto
        );
}

.item-details__purchase-options
    .popup-form__table
    .popup-form__table-cell:not(.table-form),
.item-details__purchase-options
    .popup-form__table
    .popup-form__table-heading-cell {
    display: flex;
    align-items: center;
}
.advanced-item-definitions .form-field-suffix {
    max-width: 52%;
}

.item-details__stock-changes .popup-form__table {
    grid-template-columns: repeat(4, auto);
}


.item-details__stock-changes .popup-form__table.stock-changes{
    display:block;
}
.stock-changes .popup-form__header-row,
.stock-changes-table{
    display:grid;
    grid-template-columns: 1.3fr 1.3fr 1fr 1fr;
}

.item-details__stock-changes .popup-form__table.on-hand-locations {
    grid-template-columns: repeat(3, auto);
}

.item-details__accounting {
}

.item-details__accounting-content {
    display: flex;
}

.item-details__accounting-software .table-form-description {
    margin-top: 8px;
    margin-bottom: 8px;
}

.item-details__accounting-software {
    border-right: 1px solid lightgrey;
    padding-right: 16px;
    flex: 0 0 auto;
}

.item-details__accounting-options {
    padding-left: 16px;
}

.item-details__accounting-options .item-details__formRow .marketman-button {
    margin-top: 6px;
    flex: 1 0 auto;
}

.item-details__recipes .popup-form__table {
    grid-template-columns: 3fr repeat(2, 2fr);
}

.item-details__recipeConversions .popup-form__table.editMode {
    grid-template-columns: repeat(2, 2fr) 1fr;
}

.item-details__recipeConversions .popup-form__table.readOnlyMode {
    grid-template-columns: repeat(2, 1fr);
}

.item-details__recipeConversions .actionColumn {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

.item-details__recipeConversions .delete-label span {
    cursor: pointer;
}

.item-details__allergens .popup-form__table {
    grid-template-columns: repeat(2, 2fr) repeat(2, 3fr) 1.5fr minmax(
            48px,
            auto
        );
}

.item-details__allergens-list {
    background: white;
    margin: 10px;
    padding: 4px;
}

.item-details__allergens-validation {
    margin: 20px;
}

.popup-form__table {
    margin: 16px 0;
    background: white;
    display: grid;
    border-radius: 2px;
    overflow: hidden;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.2);
}

.no-box-shadow-important {
    box-shadow: none !important;
}

.recipe-and-cost-table,
.recipe-and-yield-table {
    display: block;
}

.recipe-and-cost-table-header,
.recipe-and-yield-table-header,
.recipe-and-cost-table .table-row,
.recipe-and-yield-table .table-row {
    display: grid;
    grid-template-columns: 5fr 3fr repeat(3, 3fr) repeat(2, minmax(60px, auto));
}

.popup-form__table-cell.table-button.popup-grid-action-row {
    padding-top: 9px;
    padding-bottom: 9px;
}

.add-ingredient-ai-block {
    display: flex;
}

.add-ingredient-ai-block > div {
    flex: 1;
}

.popup-form__table-cell.table-button.popup-grid-action-row.button-add-ingredients-ai {
    color: #0277BD;
}

.table-row-ai-suggestion .popup-form__table-cell:not(.table-form) {
    background-color: #EDF5FA;
}

.popup-grid-action-row-cell {
    display:flex;
    align-items: center;
}

.ai-recipe-suggestions-tooltip {
    display: flex;
    margin-left:auto;
}

.ai-recipe-suggestions-tooltip .form-field-tooltip-icon:before {
    width: 13px;
    height: 13px;
}

.ai-recipe-suggestions-warning:before {
    content: "";
    background: url("/images/alert-icon.svg") center/contain no-repeat;
    cursor: pointer;
    display: block;
    width: 13px;
    height: 13px;
    margin: 2px 3px 3px;
}

.add-icon-img {
    content: url('/images/add_icon.svg');
    vertical-align: middle;
    height: 13px;
    /* margin-top: -2px; */
    margin-inline-end: 5px;
}

.add-icon-img-blue {
    content: url('/images/add_icon_blue.svg');
    vertical-align: middle;
    height: 13px;
    /* margin-top: -2px; */
    margin-inline-end: 5px;
}

.ai-suggestion-img {
    content: url('/images/magic_wand.svg');
    vertical-align: middle;
    height: 13px;
    margin-top: -2px;
    margin-inline-end: 5px;
}

.ai-by-image-img {
    content: url('/images/upload_image.svg');
    vertical-align: middle;
    height: 13px;
    margin-top: -2px;
    margin-inline-end: 5px;
}

.add-icon-img.boxed {
    padding:6px;
    margin-inline-start: -5px;
    margin-inline-end: 12px;
    border-radius: 1px;
}

.ai-suggestion-img.boxed,
.ai-by-image-img.boxed {
    padding:6px;
    background-color: #F2F5F5;
    margin-inline-start: -5px;
    margin-inline-end: 12px;
    border-radius: 1px;
}

.ai-recipe-by-image-before-preview {
    width: 100%;
    height: 100%;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 16px;
    display: inline-flex;
    box-sizing: border-box;
}

.ai-recipe-by-image-before-preview .drag-and-drop-container {
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
    display: flex;
    box-sizing: border-box;
    padding-left: 75px;
    padding-right: 75px;
    padding-top: 48px;
    padding-bottom: 48px;
    background: #F2F5F5;
    border-radius: 8px;
    border: 1.50px #F2F5F5 dotted;
}

.ai-recipe-by-image-before-preview  .drag-and-drop-container:hover,
.ai-recipe-by-image-before-preview  .ai-recipe-by-image-section-container:hover {
    background: white;
    box-shadow: 0px 0px 12px rgba(39, 51, 59, 0.25);
}

.ai-recipe-by-image-before-preview .drag-and-drop-container .drag-and-drop-image-container {
    height: 65px;
    position: relative
}

.ai-recipe-by-image-before-preview  .drag-and-drop-container .drag-and-drop-image {
    content: url('/images/drag_and_drop_white_bg.svg');
}

.ai-recipe-by-image-before-preview  .drag-and-drop-container:hover .drag-and-drop-image {
    content: url('/images/drag_and_drop_grey_bg.svg');
}

.ai-recipe-by-image-before-preview .browse-and-paste-container {
    align-self: stretch;
    justify-content: flex-start;
    align-items: center;
    gap: 16px;
    display: inline-flex;
}

.ai-recipe-by-image-before-preview  .browse-files-image {
    content: url('/images/browse_files.svg');
    height: 34px;
}

.ai-recipe-by-image-before-preview .paste-from-clipboard-image {
    content: url('/images/paste_from_clipboard.svg');
    height: 34px;
}

.ai-recipe-by-image-text-big {
    text-align: center;
    color: #5A6369;
    font-size: 16px;
    font-family: Roboto;
    font-weight: 400;
    line-height: 24px;
    word-wrap: break-word;
}

.ai-recipe-by-image-text-small {
    text-align: center;
    color: #5A6369;
    font-size: 14px;
    font-family: Roboto;
    font-weight: 400;
    line-height: 24px;
    word-wrap: break-word;
}

.ai-recipe-by-image-section-container {
    flex: 1 1 0;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 8px;
    padding-bottom: 8px;
    background: #F2F5F5;
    border-radius: 8px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    display: inline-flex;
    cursor: pointer;
}

.ai-recipe-by-image-with-preview {
    width: 100%;
    height: 100%;
    padding: 16px;
    border-radius: 8px;
    border: 2px #D9E3E3 dotted;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 15px;
    display: inline-flex;
    box-sizing: border-box;
}

.ai-recipe-by-image-with-preview .ai-recipe-by-image-preview-image-container {
    align-self: stretch;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
    display: flex;
    height: 237px;
}

.ai-recipe-by-image-with-preview .recipe-by-image-preview {
    max-width: 330px;
    max-height: 198px;
    border-radius: 2px;
    margin: auto;
}

.ai-recipe-by-image-with-preview .recipe-by-image-title {
    text-align: center;
    color: #5A6369;
    font-size: 12px;
    font-family: Roboto;
    font-weight: 400;
    line-height: 24px;
    word-wrap: break-word;
}

.ai-recipe-by-image-buttons-container {
    width: 100%;
    height: 100%;
    padding-top: 42px;
    padding-bottom: 30px;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 8px;
    display: inline-flex;
    box-sizing: border-box;
}

.ai-recipe-by-image-buttons-container .ai-recipe-by-image-buttons {
    justify-content: flex-end;
    align-items: flex-start;
    gap: 8px;
    display: flex;
}

.upload-ai-recipe-image-window .modal-dialog {
    width: 750px;
}

.upload-ai-recipe-image-window .modal-body::-webkit-scrollbar {
    width: 5px;
}

.upload-ai-recipe-image-window .modal-body::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: #D9E3E3;
}

.upload-ai-recipe-image-window .modal-body::-webkit-scrollbar-thumb:hover {
    background-color: rgb(179, 199, 199);
}

.upload-ai-recipe-image-window .modal-body-content {
    display:flex;
    flex-direction:column;
    row-gap: 5px;
}

.item-details__allergens .popup-form__table-cell.table-form {
    background-color: white;
}

.item-details__allergens .allergens-popup2-table {
    grid-template-columns: auto repeat(4, minmax(80px, 165px));
}

.popup-item-details .k-grid-header th.k-header,
.popup-form__table-heading-cell {
    background: #5c82a4;
    color: white;
    font-size: 12px;
    line-height: 15px;
    padding: 14px 12px;
    margin-bottom: 8px;
}
.popup-item-details .k-grid-header th.k-header > .k-link {
    color: white !important;
}

#dynamic-par-locations-grid .k-grid-header th.k-header {
    background: #5c82a4;
    color: rgb(105, 117, 134) !important;
    font-size: 12px;
    line-height: 15px;
    padding: 14px 12px;
    margin-bottom: 8px;
}
#dynamic-par-locations-grid .k-grid-header th.k-header > .k-link {
    color: rgb(105, 117, 134) !important;
}


.popup-form__table-cell.popup-form__table-footer-cell {
    background: #eaeaea;
}

.popup-form__table-heading-cell.popup-form__table-heading-cell--first {
    padding-left: 24px;
}

.popup-form__table-heading-cell.popup-form__row-action-button {
    padding: 12px;
}

.recipe-and-cost-table
    .popup-form__table-heading-cell.popup-form__row-action-button,
.recipe-and-yield-table
    .popup-form__table-heading-cell.popup-form__row-action-button {
    padding: 0 7.5px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.popup-form__table-cell {
    margin-bottom: 8px;
    padding: 12px 12px;
    font-size: 12px;
    line-height: 15px;
    color:#010F19;
    background: white;
    border-top: 1px solid #ededed;
    border-bottom: 1px solid #ededed;
}

.warning-img {
    width:13px;
    height:13px;
    content: url('/images/alert-icon.svg');
}

.popup-form__table-cell .warning-img {
    position: absolute;
}

.expected-on-hand-warning {
    color: #ff9100;
    font-size: 12px;
    margin-left: 5px;
    margin-right: 5px;
}

.warning-img-icon {
    content: url('/images/alert-icon.svg');
    height: 12px;
    width: 12px;
}

.popup-form__table-cell .warning-img.toggled {
    transform: translate(-8px, 16px);
}
.popup-form__table-cell .warning-sibling.warning-padding {
    padding-left:25px;
}
.popup-form__table-cell .warning-sibling.warning-padding.toggled {
    padding-left:17px;
}
.popup-form__table-cell.icon-cell i {
    margin-left: 8px;
}

.popup-form__table-cell.table-button {
    grid-column: 1 / -1;
    border: 1px solid #ededed;
    color: #28bd8b;
    margin: 0 8px 8px;
    border-radius: 3px;
    padding-left: 12px;
    padding-right: 12px;
    cursor: pointer;
}

.popup-form__table-cell.table-button.table-button-disabled {
    opacity: 0.65;
    cursor: default;
}

.popup-form__table-cell.popup-form__row-action-button {
    cursor: pointer;
    padding: 8px;
    min-width: 22px;
    display: flex;
    border-left: 1px solid #ededed;
}

.popup-form__table-cell.popup-form__row-action-button.disabled {
    border-left: none;
    cursor: unset;
}

.popup-form__table-cell.popup-form__row-action-button span {
    margin: auto;
}

.popup-form__table-cell.table-form {
    grid-column: 1 / -1;
    padding: 20px;
    margin: 0 8px 8px;
    border: 1px solid #ededed;
    border-radius: 3px;
    position: relative;
}

.popup-form__action-icon {
    cursor: pointer;
}

.table-form .close-button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 8px 12px;
    cursor: pointer;
}

.table-form .delete-label {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 8px 12px;
}

.table-form .delete-label span {
    cursor: pointer;
}

.table-form .delete-label span.table-cell-bottom-indicator {
    cursor: default;
}

.item-details__purchase-options .table-form-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 6px;
    min-height: 0;
    min-width: 0;
}

.item-details__purchase-options .table-form-row.not-input-fields-row {
    display: flex;
    align-items: center;
    margin: 0 -8px;
    padding: 0 2px;
}

.item-details__purchase-options .table-form-row.not-input-fields-row > * {
    margin: 0 8px;
}

.item-details__purchase-options
    .table-form-row.not-input-fields-row
    > md-radio-group {
    position: relative;
    top: 17px;
}

.table-form__section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.table-form__section-header .table-form-heading {
    flex: 1 1 auto;
    width: auto;
}

.table-form__section-header-side {
    display: flex;
    align-items: center;
    flex: 0 1 auto;
}

.table-form__section-header-side .table-form-description {
    margin-left: 32px;
}

.table-form-heading {
    width: 100%;
    font-weight: 500;
    font-size: 14px;
    margin: 4px 4px 8px;
    color: #5c82a4;
}

.table-form-heading.table-form-link {
    color: #28bd8b;
    cursor: pointer;
}

.table-form-heading.table-form-link:hover {
    color: #28bd8b;
    font-weight: bold;
}

.table-form-description {
    color: #5a6779;
    padding: 0 4px;
    font-size: 14px;
}

.form-row-label {
    padding-top: 16px;
    flex-grow: 0;
}

.table-form-description.conversion {
    display: flex;
    justify-content: space-between;
    color: #63aef7;
}

.table-form-description.conversion.invalid {
    color: #ea5a5a;
}

.table-form-description.conversion .conversion-link {
    text-decoration: underline;
    font-weight: bold;
    cursor: pointer;
}

.table-form-description b {
    font-weight: 500;
}

.popup-form__table-cell .table-form-row marketman-form-field-select,
.popup-form__table-cell .table-form-row marketman-form-field-multi-select,
.popup-form__table-cell .table-form-row marketman-form-field-input,
.popup-form__table-cell .table-form-row marketman-form-field-combo {
    box-sizing: border-box;
    min-width: 0;
    margin-bottom: 4px;
}

.item-details__purchase-options
    .popup-form__table-cell
    .table-form-row
    marketman-form-field-select.double,
.item-details__purchase-options
    .popup-form__table-cell
    .table-form-row
    marketman-form-field-multi-select.double,
.item-details__purchase-options
    .popup-form__table-cell
    .table-form-row
    marketman-form-field-input.double,
.item-details__purchase-options
    .popup-form__table-cell
    .table-form-row
    marketman-form-field-combo.double {
    grid-column: 1 / 3;
}

.popup-form__table-cell.popup-form__table-cell--first {
    margin-left: 8px;
    padding-left: 12px;
    border-left: 1px solid #ededed;
    border-radius: 3px 0 0 3px;
}

.popup-form__table-cell.popup-form__table-cell--last {
    margin-right: 8px;
    border-right: 1px solid #ededed;
    border-radius: 0 3px 3px 0;
}

.popup-form__table-cell .table-form-row .marketman-button.discount-button {
    margin-left: 2px;
    margin-right: auto;
    margin-top: 6px;
}

.survey-popup .green-popup .ActionButton {
    width: 30%;
    max-width: 200px;
    box-shadow: 0px 6px 25px 0 rgba(58, 62, 76, 0.35);
}

.survey-popup .green-popup .GreyButton {
    width: 25%;
    max-width: 200px;
    box-shadow: 0px 6px 25px 0 rgba(58, 62, 76, 0.35);
    margin: 0 10px;
}

.survey-popup .green-popup .modal-body {
    padding: 20px 40px;
}

.wizard-popup div.modal-body-content {
    padding-left: 32px;
    padding-right: 32px;
}

.wizard-popup .green-popup .modal-body {
    padding: 0;
}

.wizard-popup .green-popup .modal-footer {
    padding: 30px 32px 40px;
}

.wizard-popup .green-popup .modal-body {
    padding: 0;
}

.wizard-popup .green-popup .modal-footer {
    padding: 30px 32px 40px;
}

.green-popup .survey-link {
    margin-top: 10px;
    display: inline-block;
    width: 70%;
}

.green-popup .loading-icon {
    position: absolute;
    top: 10px;
    right: 40px;
    color: #28bd8b;
}

.green-popup .grey-text-bold {
    font-size: 22px;
    font-weight: bold;
    color: #c8cbd3;
}

.green-link {
    color: #28bd8b;
    cursor: pointer;
    text-decoration: underline;
    font-weight: bold;
    user-select: none;
    outline: none;
}

.green-link.disabled {
    color: grey;
    pointer-events: none;
}

.opacity-1-important {
    opacity: 1 !important;
}

.item-info__allergens {
    border: 1px solid #a9a9a9;
    padding: 6px;
    background: rgb(235, 235, 228);
    margin-top: 3px;
}

.green-popup .grey-text-light {
    font-size: 17px;
    font-weight: 300;
    color: #c8cbd3;
}

.font-color-grey-important {
    color: grey !important;
}

.upload-invoices-popup > .modal-dialog {
    width: 800px;
}

.modal-generalpopup {
    width: 450px !important;
    transform: translate(-25%, -25%);
}

.upload-invoices-popup .modal-body {
    padding: 5px 50px;
    overflow-y: hidden;
}

.upload-invoices-popup .modal-dialog-title {
    font-size: 28px;
    font-weight: 300;
    color: #364c5f;
}

.drag-and-drop-box {
    border: 3px dashed #ddd;
    border-radius: 3px;
    width: 100%;
    height: 100px;
    text-align: center;
    display: flex;
    align-items: center;
}

.drag-and-drop-box .cloud-icon {
    text-align: right;
}

.blue-button {
    min-width: 100px;
    height: 34px;
    border-radius: 3px;
    background-color: #63aef7;
    border: solid 1px #5b9fe1;
    /*font-size: 15px;*/
    /*font-weight: 500;*/
    color: #ffffff;
    cursor: pointer;
}

.blue-button:hover {
    background-color: #5b9fe1;
}

.blue-button:disabled {
    background-color: #ddd;
    border: solid 1px #ddd;
    cursor: default;
}

/*Black popup*/
.black-popup:before {
    content: "";
    display: block;
    padding: 2px 0;
    line-height: 1px;
    border-top: 4px solid #28bd8b;
    position: absolute;
    top: 0px;
    width: 100%;
    z-index: 1;
}

.black-popup .PopupCloseButton {
    background-color: transparent !important;
    color: white;
    border: none;
    padding: 0 !important;
    font: inherit;
    cursor: pointer;
    outline: inherit !important;
    background-image: url("/images/popup-close-x.png");
    height: 17px;
    width: 17px;
    position: absolute;
    top: 25px;
    right: 35px;
}

.black-popup .modal-header {
    padding: 15px 20px;
    background-color: #434754;
    min-height: 20px;
}

.black-popup .modal-body {
    padding: 4px 30px;
    background-color: #434754;
}

.black-popup .modal-footer {
    background-color: #434754;
    padding: 20px 30px;
    text-align: left;
}

.black-popup .modal-dialog-title {
    font-size: 22px;
    font-weight: 300;
    color: #ffffff;
}

.black-popup .modal-dialog-text {
    font-size: 14px;
    font-weight: 300;
    line-height: 1.43;
    color: #c8ccd4;
}

.black-popup .GreyButton {
    color: white;
    border: solid 1px white;
    background-color: #434754;
    width: unset;
}

.personaSurveyIFrame {
    width: 100%;
    height: -moz-available;
    height: -webkit-fill-available;
    height: fill-available;
    border: none;
    min-height: 500px;
}

.survey-thank-you-popup .modal-dialog-title {
    font-size: 28px;
    font-weight: 300;
    line-height: 1.36;
}

.survey-thank-you-popup .modal-body-text {
    font-size: 17px;
    font-weight: 300;
    line-height: 1.65;
    color: #8396a7;
}

.survey-thank-you-popup .modal-body-textarea {
    width: 100%;
    height: 150px;
    border-radius: 2px;
    background-color: #ffffff;
    border: solid 1px #dadee6;
    resize: none;
}

/*.supplier-popup .modal-body {
    padding: 5px 32px;
}

.supplier-popup .modal-footer {
    padding: 32px;
    text-align: right;
}*/

.supplier-popup .payment-terms-select {
    width: 80% !important;
    height: 38px;
    padding-top: 1px;
}

.supplier-popup .payment-terms-select-full-width {
    width: 100%;
    height: 38px;
    padding-top: 1px;
}

.supplier-popup .DivRowInput {
    padding-bottom: 10px !important;
}

.supplier-popup .day-data-input {
    width: 18% !important;
    height: 38px;
    text-align: center;
    text-indent: unset !important;
}

.whats-invoice-scanning-popup.popover {
    width: 538px;
    max-width: 538px;
    opacity: 0.95;
    padding: 0;
    font-stretch: normal;
    background-color: #434754;
}

.whats-invoice-scanning-popup.popover > .arrow {
    display: none;
}

.whats-invoice-scanning-popup .popover-content {
    padding: 0;
}

.whats-invoice-scanning-popup .modal-content {
    background-color: #434754;
}

.whats-invoice-scanning-popup .modal-body {
    padding: 20px 30px;
}

.get-more-scans-popup .modal-content {
    background-color: #434754;
}

.get-more-scans-popup.popover {
    width: 345px;
    max-width: 345px;
    opacity: 0.95;
    padding: 0;
    font-stretch: normal;
    background-color: #434754;
}

.get-more-scans-popup.popover > .arrow {
    display: none;
}

.get-more-scans-popup .popover-content {
    padding: 0;
}

.suppliers-list {
    overflow: auto;
    max-height: 50vh;
}

.supplier-item .supplier-item-content {
    min-height: 53px;
}

.supplier-item:hover {
    background-color: #b8f1de;
    font-weight: bold;
    cursor: pointer;
}

.supplier-item .logo-wrapper {
    width: 70px;
    height: 40px;
    background-color: #f4f6f7;
    text-align: center;
    margin: 5px;
}

.supplier-item .logo-wrapper img {
    width: 70px;
    height: 40px;
    border: solid 1px #ebedf0;
    border-radius: 2px;
    background-color: #ffffff;
}

.supplier-item .logo-wrapper label {
    font-size: 32px !important;
    font-weight: 1000;
    color: #cfd3da !important;
}

.supplier-item .vendorName {
    margin: 15px 15px 0 15px;
    display: inline-block;
    max-width: 300px;
    text-overflow: ellipsis;
    width: 290px;
    white-space: nowrap;
    overflow: hidden;
}

.supplier-item .orderAlert {
    font-size: 12px;
    margin-left: 5px;
    margin-right: 5px;
}

.supplier-item .orderAlert .red {
    color: red;
}

.supplier-item .orderAlert .green {
    color: #28bd8b;
}

.sortItemCell {
    display: flex;
    align-items: center;
}

.sortItemCell .sortItemImageHolder {
    height: 35px;
    width: 35px;
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    border-radius: 10%;
}

.item-separator {
    height: 1px;
    background-color: #ebedf0;
    margin-left: 95px;
    margin-right: 5px;
}

.NewOrder3Order .item-separator {
    margin-left: 10px;
    margin-right: 10px;
}

.wizard-page-separtor {
    height: 1px;
    background-color: #ebedf0;
    margin-top: 25px;
}

.page-separtor {
    height: 1px;
    background-color: #ebedf0;
    margin-bottom: 15px;
}

#light-scrollbar::-webkit-scrollbar {
    width: 7px;
    background-color: #f5f5f5;
}

#light-scrollbar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #d6d8de;
}

#light-scrollbar::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #f5f5f5;
}

/*delivery table*/
.deliveryTable {
    margin: 5px auto;
    font-size: x-small;
}

.deliveryTable select {
    height: 24px;
    width: 105px;
    line-height: 1;
}

.deliveryTable input[type="text"] {
    height: 24px !important;
    font-size: 15px !important;
}

.green-popup .deliveryTable input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

.deliveryTableinput[type="checkbox"]:checked:after {
    font-size: 15px;
    position: absolute;
    bottom: 0.5px;
    left: 3px;
    color: #28bd8b;
}

.deliveryTable tr {
    font-size: 13px;
    color: #8794a6;
}

/*Bootstrap selected styles*/
.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
    outline: none;
}

.btn:hover,
.btn:focus,
.btn.focus {
    color: #333;
    text-decoration: none;
}

.btn:active,
.btn.active {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
    cursor: not-allowed;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: 0.65;
}

a.btn.disabled,
fieldset[disabled] a.btn {
    pointer-events: none;
}

.btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.btn-default:focus,
.btn-default.focus {
    color: #333;
    background-color: #e6e6e6;
    border-color: #8c8c8c;
}

.btn-default:hover {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad;
}

.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad;
}

.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
    color: #333;
    background-color: #d4d4d4;
    border-color: #8c8c8c;
}

.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
    background-image: none;
}

.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus {
    background-color: #fff;
    border-color: #ccc;
}

.btn-default .badge {
    color: #fff;
    background-color: #333;
}

.btn-primary {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}

.btn-primary:focus,
.btn-primary.focus {
    color: #fff;
    background-color: #286090;
    border-color: #122b40;
}

.btn-primary:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}

.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #286090;
    border-color: #204d74;
}

.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
    color: #fff;
    background-color: #204d74;
    border-color: #122b40;
}

.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    background-image: none;
}

.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus {
    background-color: #337ab7;
    border-color: #2e6da4;
}

.btn-primary .badge {
    color: #337ab7;
    background-color: #fff;
}

.btn-marketman {
    height: 34px;
    color: #fff;
    background-color: #28bd8b;
    text-decoration: none;
    border: solid thin #28bd8b;
    padding: 6px 14px;
    font-size: 14px;
}

.btn-marketman:hover {
    background-color: #42d7a5;
    border: solid thin #42d7a5;
    color: #fff;
}

.btn-marketman:focus {
    color: #fff;
}

.btn-marketman-secondary {
    color: black;
    background-color: #fff;
    text-decoration: none;
    border: solid thin black;
    padding: 8px 20px;
    font-size: 13px;
}

.btn-marketman-secondary:hover {
    border: solid thin #28bd8b;
    color: #28bd8b;
}

.btn-marketman .fa-lg {
    line-height: 1;
}

.btn-success {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.btn-success:focus,
.btn-success.focus {
    color: #fff;
    background-color: #449d44;
    border-color: #255625;
}

.btn-success:hover {
    color: #fff;
    background-color: #449d44;
    border-color: #398439;
}

.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
    color: #fff;
    background-color: #449d44;
    border-color: #398439;
}

.btn-success:active:hover,
.btn-success.active:hover,
.open > .dropdown-toggle.btn-success:hover,
.btn-success:active:focus,
.btn-success.active:focus,
.open > .dropdown-toggle.btn-success:focus,
.btn-success:active.focus,
.btn-success.active.focus,
.open > .dropdown-toggle.btn-success.focus {
    color: #fff;
    background-color: #398439;
    border-color: #255625;
}

.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
    background-image: none;
}

.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled.focus,
.btn-success[disabled].focus,
fieldset[disabled] .btn-success.focus {
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.btn-success .badge {
    color: #5cb85c;
    background-color: #fff;
}

.btn-info {
    color: #fff;
    background-color: #5bc0de;
    border-color: #46b8da;
}

.btn-info:focus,
.btn-info.focus {
    color: #fff;
    background-color: #31b0d5;
    border-color: #1b6d85;
}

.btn-info:hover {
    color: #fff;
    background-color: #31b0d5;
    border-color: #269abc;
}

.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
    color: #fff;
    background-color: #31b0d5;
    border-color: #269abc;
}

.btn-info:active:hover,
.btn-info.active:hover,
.open > .dropdown-toggle.btn-info:hover,
.btn-info:active:focus,
.btn-info.active:focus,
.open > .dropdown-toggle.btn-info:focus,
.btn-info:active.focus,
.btn-info.active.focus,
.open > .dropdown-toggle.btn-info.focus {
    color: #fff;
    background-color: #269abc;
    border-color: #1b6d85;
}

.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
    background-image: none;
}

.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus,
.btn-info[disabled].focus,
fieldset[disabled] .btn-info.focus {
    background-color: #5bc0de;
    border-color: #46b8da;
}

.btn-info .badge {
    color: #5bc0de;
    background-color: #fff;
}

.btn-warning {
    color: #fff;
    background-color: #f0ad4e;
    border-color: #eea236;
}

.text-warning, .modal-body-content .text-warning  {
    color: #ec971f;
}

.cogs-over-time-settings-popup .marketman-form-field {
    background-color: #ffffff;
}

.btn-warning:focus,
.btn-warning.focus {
    color: #fff;
    background-color: #ec971f;
    border-color: #985f0d;
}

.btn-warning:hover {
    color: #fff;
    background-color: #ec971f;
    border-color: #d58512;
}

.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
    color: #fff;
    background-color: #ec971f;
    border-color: #d58512;
}

.btn-warning:active:hover,
.btn-warning.active:hover,
.open > .dropdown-toggle.btn-warning:hover,
.btn-warning:active:focus,
.btn-warning.active:focus,
.open > .dropdown-toggle.btn-warning:focus,
.btn-warning:active.focus,
.btn-warning.active.focus,
.open > .dropdown-toggle.btn-warning.focus {
    color: #fff;
    background-color: #d58512;
    border-color: #985f0d;
}

.btn-warning:active,
.btn-warning.active,
.open > .dropdown-toggle.btn-warning {
    background-image: none;
}

.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled.focus,
.btn-warning[disabled].focus,
fieldset[disabled] .btn-warning.focus {
    background-color: #f0ad4e;
    border-color: #eea236;
}

.btn-warning .badge {
    color: #f0ad4e;
    background-color: #fff;
}

.btn-danger {
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a;
}

.btn-danger:focus,
.btn-danger.focus {
    color: #fff;
    background-color: #c9302c;
    border-color: #761c19;
}

.btn-danger:hover {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925;
}

.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925;
}

.btn-danger:active:hover,
.btn-danger.active:hover,
.open > .dropdown-toggle.btn-danger:hover,
.btn-danger:active:focus,
.btn-danger.active:focus,
.open > .dropdown-toggle.btn-danger:focus,
.btn-danger:active.focus,
.btn-danger.active.focus,
.open > .dropdown-toggle.btn-danger.focus {
    color: #fff;
    background-color: #ac2925;
    border-color: #761c19;
}

.btn-danger:active,
.btn-danger.active,
.open > .dropdown-toggle.btn-danger {
    background-image: none;
}

.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled.focus,
.btn-danger[disabled].focus,
fieldset[disabled] .btn-danger.focus {
    background-color: #d9534f;
    border-color: #d43f3a;
}

.btn-danger .badge {
    color: #d9534f;
    background-color: #fff;
}

.btn-link {
    font-weight: normal;
    color: #337ab7;
    border-radius: 0;
}

.btn-link,
.btn-link:active,
.btn-link.active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
    border-color: transparent;
}

.btn-link:hover,
.btn-link:focus {
    color: #23527c;
    text-decoration: underline;
    background-color: transparent;
}

.btn-link[disabled]:hover,
fieldset[disabled] .btn-link:hover,
.btn-link[disabled]:focus,
fieldset[disabled] .btn-link:focus {
    color: #777;
    text-decoration: none;
}

.btn-lg,
.btn-group-lg > .btn {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;
}

.btn-sm,
.btn-group-sm > .btn {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.btn-xs,
.btn-group-xs > .btn {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.btn-block {
    display: block;
    width: 100%;
}

.btn-block + .btn-block {
    margin-top: 5px;
}

input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
    width: 100%;
}

.btn-group,
.btn-group-vertical {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

.btn-group > .btn,
.btn-group-vertical > .btn {
    position: relative;
    float: left;
}

.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover,
.btn-group > .btn:focus,
.btn-group-vertical > .btn:focus,
.btn-group > .btn:active,
.btn-group-vertical > .btn:active,
.btn-group > .btn.active,
.btn-group-vertical > .btn.active {
    z-index: 2;
}

.btn-group .btn + .btn,
.btn-group .btn + .btn-group,
.btn-group .btn-group + .btn,
.btn-group .btn-group + .btn-group {
    margin-left: -1px;
}

.btn-toolbar {
    margin-left: -5px;
}

.btn-toolbar .btn,
.btn-toolbar .btn-group,
.btn-toolbar .input-group {
    float: left;
}

.btn-toolbar > .btn,
.btn-toolbar > .btn-group,
.btn-toolbar > .input-group {
    margin-left: 5px;
}

.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0;
}

.btn-group > .btn:first-child {
    margin-left: 0;
}

.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-group > .btn-group {
    float: left;
}

.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
    border-radius: 0;
}

.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
    outline: 0;
}

.btn-group > .btn + .dropdown-toggle {
    padding-right: 8px;
    padding-left: 8px;
}

.btn-group > .btn-lg + .dropdown-toggle {
    padding-right: 12px;
    padding-left: 12px;
}

.btn-group.open .dropdown-toggle {
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.btn-group.open .dropdown-toggle.btn-link {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn .caret {
    margin-left: 0;
}

.btn-lg .caret {
    border-width: 5px 5px 0;
    border-bottom-width: 0;
}

.dropup .btn-lg .caret {
    border-width: 0 5px 5px;
}

.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group,
.btn-group-vertical > .btn-group > .btn {
    display: block;
    float: none;
    width: 100%;
    max-width: 100%;
}

.btn-group-vertical > .btn-group > .btn {
    float: none;
}

.btn-group-vertical > .btn + .btn,
.btn-group-vertical > .btn + .btn-group,
.btn-group-vertical > .btn-group + .btn,
.btn-group-vertical > .btn-group + .btn-group {
    margin-top: -1px;
    margin-left: 0;
}

.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
    border-radius: 0;
}

.btn-group-vertical > .btn:first-child:not(:last-child) {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-group-vertical > .btn:last-child:not(:first-child) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
    border-radius: 0;
}

.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group-vertical
    > .btn-group:first-child:not(:last-child)
    > .dropdown-toggle {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.btn-group-vertical
    > .btn-group:last-child:not(:first-child)
    > .btn:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.btn-group-justified {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
}

.btn-group-justified > .btn,
.btn-group-justified > .btn-group {
    display: table-cell;
    float: none;
    width: 1%;
}

.btn-group-justified > .btn-group .btn {
    width: 100%;
}

.btn-group-justified > .btn-group .dropdown-menu {
    left: auto;
}

[data-toggle="buttons"] > .btn input[type="radio"],
[data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
[data-toggle="buttons"] > .btn input[type="checkbox"],
[data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
}

.glyphicon-chevron-left:before {
    content: "\e079";
}

.glyphicon-chevron-right:before {
    content: "\e080";
}

.uib-datepicker {
    outline: 0 !important;
}

.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: none;
    max-width: 276px;
    padding: 1px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    word-wrap: normal;
    white-space: normal;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    line-break: auto;
}

.popover.top {
    margin-top: -10px;
}

.popover.right {
    margin-left: 10px;
}

.popover.bottom {
    margin-top: 10px;
}

.popover.left {
    margin-left: -10px;
}

.popover.top-left {
    margin-top: -10px;
    margin-left: -10px;
}

.popover.top-right {
    margin-top: -10px;
    margin-left: 11px;
}

.popover-title {
    padding: 8px 14px;
    margin: 0;
    font-size: 14px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    border-radius: 5px 5px 0 0;
}

.popover-content {
    padding: 2px 10px;
}

.popover > .arrow,
.popover > .arrow:after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}

.popover > .arrow {
    border-width: 11px;
}

.popover > .arrow:after {
    content: "";
    border-width: 10px;
}

.popover.top > .arrow {
    bottom: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-color: #999;
    border-top-color: rgba(0, 0, 0, 0.25);
    border-bottom-width: 0;
}

.popover.top > .arrow:after {
    bottom: 1.6px;
    margin-left: -10px;
    content: " ";
    border-top-color: #fff;
    border-bottom-width: 0;
}

.popover.right > .arrow {
    top: 50%;
    left: -11px;
    margin-top: -11px;
    border-right-color: #999;
    border-right-color: rgba(0, 0, 0, 0.25);
    border-left-width: 0;
}

.popover.right > .arrow:after {
    bottom: -10px;
    left: 1px;
    content: " ";
    border-right-color: #fff;
    border-left-width: 0;
}

.popover.bottom > .arrow {
    top: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-width: 0;
    border-bottom-color: #999;
    border-bottom-color: rgba(0, 0, 0, 0.25);
}

.popover.bottom > .arrow:after {
    top: 1px;
    margin-left: -10px;
    content: " ";
    border-top-width: 0;
    border-bottom-color: #fff;
}

.popover.left > .arrow {
    top: 50%;
    right: -11px;
    margin-top: -11px;
    border-right-width: 0;
    border-left-color: #999;
    border-left-color: rgba(0, 0, 0, 0.25);
}

.popover.left > .arrow:after {
    right: 1px;
    bottom: -10px;
    content: " ";
    border-right-width: 0;
    border-left-color: #fff;
}

.popover-black {
    background-color: #343945;
    color: #c7cdd3;
}

.popover-black.top > .arrow:after {
    border-top-color: #343945;
}

@font-face {
    font-family: "Glyphicons Halflings";
    src: url("/HtmlControls/DatePicker/fonts/glyphicons-halflings-regular.eot");
    src: url("/HtmlControls/DatePicker/fonts/glyphicons-halflings-regular.eot?#iefix")
            format("embedded-opentype"),
        url("../fonts/glyphicons-halflings-regular.woff2") format("woff2"),
        url("../fonts/glyphicons-halflings-regular.woff") format("woff"),
        url("../fonts/glyphicons-halflings-regular.ttf") format("truetype"),
        url("../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular")
            format("svg");
}

.glyphicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: "Glyphicons Halflings";
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.glyphicon-chevron-up:before {
    content: "\e113";
}

.glyphicon-chevron-down:before {
    content: "\e114";
}

/*Bootstrap end*/

.twoLists select {
    height: 320px;
    max-height: none;
    max-width: none;
    overflow: auto;
    background-image: none;
}

button-clickable {
    cursor: pointer;
}

.fa-clickable {
    cursor: pointer;
}

.fa-clickable:hover {
    color: #28bd8b;
}

.fa-search {
    color: #b7bbc2;
    font-size: 25px !important;
}

.refreshTime {
    font-size: 14px;
    color: #aaa;
}

.marketman-green {
    color: #28bd8b;
}

.marketman-orange {
    color: #fc711e;
}

.color-marketman-orange {
    color: #fc711e;
}

/* This is obviously stupid name but i have no other way of calling it as the designer keep changing the color
Hopefully we will not have this kind of issue in the Angular project */
.color-marketman-orange-2024 {
    color: #FF9100;
}

.input-image-container {
    position: relative;
    padding: 0;
    margin: 0;
}

.input-image-image {
    position: absolute;
    top: 10px;
    right: 17px;
    width: 10px;
    height: 10px;
}

.angucomplete-holder {
    position: inherit !important;
}

.radio-display {
    display: inline-block !important;
    margin-top: 10px;
    vertical-align: top;
}

.modal-body-content span {
    line-height: 1.73;
    font-size: 15px;
    color: #5a6779;
}
.color-marketman-red {
    color: #ea5a5a;
}
.modal-body-content .color-marketman-red span {
    color: #ea5a5a !important;
}

.color-marketman-orange-new {
    color: #ff9320 !important;
}

/*div.modal-body-content {
    padding-right: 32px;
}*/

.modal-body-article {
    font-size: 16px;
    color: #5a6779;
    margin: 16px 0;
}

.modal-body-warning {
    color: #ea5a5a;
}

.modal-body-options-list {
    margin: 6px 0 0;
}

.modal-body-options-list li {
    margin-top: 4px;
}

.modal-body-confirm-input {
    display: flex;
    align-items: center;
}

.modal-body-confirm-input md-input-container {
    margin: 0 8px;
    position: relative;
    bottom: -3px;
}

.modal-body-confirm-input md-input-container input {
    font-size: 16px;
}

@media (min-width: 768px) {
    .modal-dialog {
        width: 600px;
        margin: 250px auto 30px auto;
    }

    .green-popup .modal-dialog {
        width: 530px;
        margin: 250px auto 30px auto;
    }

    .survey-popup > .modal-dialog {
        width: 50%;
    }

    /*.whats-invoice-scanning-popup .modal-dialog {
        width: 534px;
    }

    .get-more-scans-popup .modal-dialog {
        width: 345px
    }*/
    .modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    }

    .credit-from-list-popup > .modal-dialog {
        width: 80%;
    }

    .cogsconfig-popup > .modal-dialog {
        width: 80%;
    }

    .cogsconfig-popup
        > .modal-dialog
        > .modal-content
        > .green-popup
        > .modal-header {
        height: auto;
    }
}

@media screen and (min-width: 768px) and (max-height: 915px) {
    .suppliers-list {
        max-height: 50vh;
    }

    body.modal-open {
        overflow: hidden;
    }
}

@media screen and (min-height: 992px) and (max-height: 1200px) {
    .modal-dialog {
        margin: 320px auto 30px auto;
    }
}

@media screen and (min-height: 1200px) {
    .modal-dialog {
        margin: 435px auto 30px auto;
    }
}

@media screen and (min-width: 768px) and (max-height: 768px) {
    .suppliers-list {
        max-height: 30vh;
    }

    .modal-body {
        max-height: 60vh;
    }

    .modal-body-content {
        max-height: 48vh;
    }

    .modal-dialog {
        width: 600px;
        margin: 200px auto 30px auto;
    }

    body.modal-open {
        overflow: hidden;
    }

    /*TODO:after address cogsconfig*/
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    .NewOrderFooterPadding {
        padding-left: 10px;
        padding-right: 10px;
    }

    /*.PageHead .FormGroup {
        margin-bottom : 10px;
    }*/
    /*.NewOrderFooter * {
        margin-left: 5px;
        margin-right: 5px;
    }*/
    .Col2 {
        min-width: 15.6666%;
    }

    /*.Tools {
        max-width: 80%;
        display: inline-block;
    }

    .ToolsOposite {
        display: inline-block;
        float: right;
    }*/
    /*.ToolsOposite{
        position :absolute;
        right:20px;
    }*/
}

/* Drop down with search */
#acute-wrapper div {
    box-sizing: unset !important;
}

.ac-select-wrapper {
    position: relative;
    display: inline-block;
    width: 100%;
    /*height: 100%;*/
}

.ac-select-wrapper,
.ac-select-wrapper input,
.ac-select-wrapper select {
    font-family: Roboto;
    font-size: 13px;
    background-color: white;
}

.ac-select-main {
    vertical-align: middle;
    /*padding-left:2px;*/
    /*margin-right: -2px;*/
    height: 32px;
    border: solid thin #5a6779;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    overflow: hidden;
}

.list-page .ac-select-main {
    min-width: 198px !important;
}

.ac-select-main-closed {
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    /*line-height: 32px;
    height: 32px;*/
}

.ac-select-main-open {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.ac-select-table {
    border-collapse: collapse;
    border-spacing: 0px;
    width: 100%;
    line-height: unset !important;
}

.ac-select-display {
    padding: 0 0 0 11px;
    vertical-align: middle;
}

.ac-select-table td {
    white-space: nowrap;
    /*padding: 0px !important;*/
    color: #5a6779;
    font-weight: 400;
    height: 32px;
}

.ac-select-widener td {
    visibility: hidden;
    padding: 0px;
    font-size: 0;
    margin: 0;
}

td.ac-select-longest {
    padding-right: 4px;
}

td.ac-select-image {
    background-image: url("/images/arrow-down.png");
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: 50%;
    height: 21px;
    width: 19px !important;
    cursor: pointer;
    vertical-align: bottom;
    margin-bottom: 0px;
    padding-top: 10px;
    padding-right: 10px;
    /*border-left: solid 1px #e8e8e8;*/
}

div.ac-select-popup {
    /*top: 22px;*/
    border-left: thin solid #e5e6e7;
    border-right: thin solid #e5e6e7;
    border-bottom: thin solid #e5e6e7;
    z-index: 1999;
    background-color: white;
    padding-top: 2px;
    width: 100%;
    margin-bottom: 0px;
}

div.ac-select-list {
    overflow: auto;
    /*overflow-x: hidden;*/
    margin-bottom: 0px;
    border-top: 1px thin #e5e6e7;
}

div.ac-select-no-items {
    padding-left: 3px;
    padding-bottom: 3px;
}

.ac-select-text-wrapper {
    padding: 0px;
    padding-left: 7px;
}

.ac-select-text {
    padding-left: 2px;
    width: 100%;
    margin-left: -4px;
    margin-right: -6px;
    border-width: 0px !important;
}

.ac-select-search-wrapper {
    padding: 0 6px;
    padding-bottom: 2px;
    margin-left: -2px;
    padding-left: 6px;
}

.ac-select-search-wrapper table {
    width: 100%;
}

.ac-select-search {
    padding-left: 2px;
    width: 100%;
    margin-left: -3px;
}

td.ac-select-add {
    cursor: pointer;
    width: 20px;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
}

.ac-select-add div {
    border: 1px solid transparent;
    margin: 4px;
    width: 16px;
    line-height: 16px;
}

.ac-select-add div:hover {
    border: 1px solid #e5e6e7;
    /*background-color: #f0f0f0;*/
}

.ac-select-disabled {
    color: #c0c0c0;
    cursor: pointer;
    text-indent: 11px;
}

.Width150Important .ac-select-disabled{
    opacity: 0.8;
}
.Width150Important .ac-select-disabled .ac-select-wrapper{ background-color: rgb(235, 235, 228);}

.ac-select-highlight {
    background-color: #e5e6e7;
}

.ac-select-popup ul {
    cursor: pointer;
    padding: 3px 0px 3px 0px;
    margin: 0;
    text-align: left;
    list-style: none;
    width: 100%;
}

.ac-select-popup li {
    padding-left: 3px;
    margin-right: 3px;
    margin-left: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
}

.ac-select-popup li:hover {
    background-color: #f0f0f0;
}

.ac-select-load-more {
    color: #808080;
    width: 97%;
    margin: 3px 6px 3px 6px;
    line-height: 18px;
    border-top: 1px solid #e5e6e7;
}

.ac-select-loading {
    padding-left: 6px;
    color: #808080;
}

.ac-select-load-more span {
    cursor: pointer;
    padding-left: 12px;
}

.ac-select-filter-options {
    font-family: Arial, sans-serif;
    padding: 2px 4px 0px 4px;
    font-size: 10px;
    color: #666;
    border-top: this 1px #e5e6e7;
}

/* ---------------------------------------- */

/*Order Details styles*/

.order-details-data-wrapper {
    display: flex;
    margin-bottom: 20px;
}

.order-details-data-container {
    border-right: 2px #ececed dotted;
}

.order-details-data {
    margin: 0 20px;
}

.order-details-data-order-image {
    width: 31px;
    height: 31px;
    margin: 0 10px 0 0;
}

.order-details-data-company-image {
    width: 46px;
    height: 46px;
    margin: 0 25px 0 5px;
}

.order-details-data-title {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.13;
    color: #434754;
}

.order-details-data-title-small {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.43;
    color: #434754;
}

.order-details-data-text {
    font-size: 12px;
    font-weight: 300;
    line-height: 1.5;
    color: #8794a6;
}

.order-details-data-middle-upper {
    border-bottom: 2px #ececed dotted;
    height: 80px;
    margin-bottom: 20px;
    display: flex;
}

.order-details-data-middle-last {
    margin: 0 30px;
}

.order-details-data-middle-lower {
    height: 80px;
}

.order-details-print-icon {
    cursor: pointer;
    color: #434754;
}

/* ---------------------------------------- */

.max-width-700 {
    max-width: 700px;
}

.Width280px {
    width: 280px;
}

.Width450 {
    width: 450px;
}

.ItemDetailsCol {
    width: 47.5%;
}

.ItemDetailsMainImageBox {
    width: 100%;
    height: 150px;
    background-color: #f4f6f7;
    text-align: center;
    position: relative;
}

.ItemDetailsImageBoxName {
    font-size: 60px !important;
    font-weight: 1000;
    color: #cfd3da !important;
}

.ItemDetailsImageBoxName img {
    height: 60px;
}

.ItemDetailsImageListItem {
    width: 30%;
    height: 50px;
    line-height: 50px;
    cursor: pointer;
    background-color: #f4f6f7;
    text-align: center;
}

.ItemDetailsImageListItemMargin {
    margin-right: 5%;
}

.ItemDetailsAddImage {
    background-color: #f4f6f7;
}

.ItemDetailsUserImage {
    max-width: 100%;
    max-height: 100%;
}

.ItemDetailsAddImage img {
    vertical-align: middle;
}

.ItemDetailsImageDelete {
    position: absolute;
    right: 10px;
    bottom: 10px;
    color: #cfd3da;
}

.ItemDetailsImageLoader {
    position: absolute;
    right: 10px;
    top: 10px;
    color: #28bd8b;
}

.ItemDetailsImagePreview {
    height: 150px;
}

.ItemDetailsImagePreview img {
    max-height: 100%;
    max-width: 100%;
}

.TogglerContainer {
    display: inline-block;
    border-color: #dadde5;
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
}

.TogglerContainer button {
    width: 40px;
    height: 34px;
    line-height: 34px;
    padding: 0;
    border: 0;
    margin: 0;
    background-color: #fff;
    outline: 0;
    cursor: pointer;
}

.TogglerContainer button i {
    color: #dadde5;
    font-size: 18px;
    vertical-align: middle;
}

.TogglerContainer div {
    width: 1px;
    height: 34px;
    padding: 0;
    border: 0;
    margin: 0;
    background-color: #dadde5;
    display: inline-block;
    vertical-align: top;
}

.TogglerContainer button.TogglerContainerSelected {
    background-color: #dadde5;
}

.TogglerContainer button.TogglerContainerSelected i {
    color: #434754;
}

.MultipleValueBullets button {
    height: 35px;
    color: #5e6678;
    background-color: #fff;
    border: solid 1px #e5e6e7;
    font-size: 14px;
    padding: 8px 23px;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    box-shadow: 0px 3px 7px 0 rgba(70, 76, 83, 0.15);
    outline: 0;
}

.MultipleValueBullets .MultipleValueBulletsItem {
    margin-right: 8px;
    margin-bottom: 14px;
}

.MultipleValueBullets button.SelectedBulletValue {
    color: #434754;
    background-color: #e3ebf8;
    box-shadow: 0px 3px 7px 0 rgba(70, 76, 83, 0.15);
    border: solid 1px #ced6e4;
}

.MultipleValueBullets .DisabledBullet,
.MultipleValueBullets button.SelectedBulletValue.DisabledBullet {
    font-style: italic;
    color: #878b92;
}

.MultipleValueBullets button:first-child {
    margin-left: 0;
}

.CookbookFullRowTitle {
    border-bottom: 1px solid #f3f3f3;
    width: calc(80% + 100px);
}

.CooklbookListCategoryEdit {
    display: inline-block;
    height: 100%;
    padding: 3px;
    position: relative;
    width: 15px;
}

.CooklbookListCategoryEdit section {
    position: absolute;
    cursor: pointer;
}

.CooklbookListCategoryEdit section:nth-child(1) {
    top: -3px;
}

.CooklbookListCategoryEdit section:nth-child(2) {
    top: 23px;
}

.CookbookFullRowTitle h2 {
    display: inline-block;
    padding: 4px 8px;
    border-bottom: 2px solid #6dbd8b;
    margin: 0;
}

.CookbookNoItemsImage {
    width: 70px;
}

.CookbookListItem {
    height: 60px;
    color: #5e6678;
    margin-top: 15px;
    position: relative;
}

.CookbookListItem.CookbookListItemDisabled {
    font-style: italic;
}

.CookbookListItem.CookbookListItemDisabled .CookbookListItemDisabledOverlay {
    display: block;
}

.CookbookListItem.CookbookListItemDisabled .CookbookListItemMain {
    border: none;
}

.CookbookListItemDisabledOverlay {
    width: calc(80% + 100px);
    height: 100%;
    position: absolute;
    top: 0;
    left: 31px;
    background-color: #f4f6f7;
    opacity: 0.6;
    display: none;
}

.CookbookListItemEdit {
    height: 100%;
    width: 25px;
}

.CookbookListItemEdit section {
    text-align: center;
    cursor: pointer;
}

/*.CookbookListItemEdit img {
    padding: 10px 0;
}*/

.CookbookListItemImage {
    height: 100%;
    width: 80px;
    background-color: #f4f6f7;
    text-align: center;
    line-height: 60px;
}

.CookbookListItemImageText {
    font-size: 35px;
    font-weight: 1000;
    color: #cfd3da;
    line-height: 60px;
    font-style: initial;
}

.CookbookListItemImage img {
    max-height: 100%;
    max-width: 100%;
    vertical-align: middle;
}

.CookbookListItemMain {
    border-bottom: 1px solid #f3f3f3;
    height: 100%;
    width: 80%;
}

.CookbookListItemMain article:nth-child(1) {
    width: 30%;
    padding: 0 10px;
    box-sizing: border-box;
}

.CookbookListItemMain article:nth-child(2) {
    width: 15%;
    padding: 0 10px;
    box-sizing: border-box;
}

.CookbookListItemMain article:nth-child(3) {
    width: 50%;
    padding: 0 10px;
    box-sizing: border-box;
}

.CookbookListItemFullDescription {
    font-size: 0.8em;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #b0b6c0;
}

.CookbookListItemTitleDetails p {
    margin: 0;
}

.CookbookListItemTitleDetails span {
    color: #b0b6c0;
}

.CookbookListItemTimeDetails i {
    color: #b0b6c0;
    font-size: 1.5em;
    vertical-align: middle;
}

.CookbookGridContainer {
    width: calc(80% + 120px);
}

.CookbookGridItem {
    width: 230px;
    height: 200px;
    line-height: 200px;
    cursor: pointer;
    background-color: #f4f6f7;
    text-align: center;
    margin-top: 10px;
    margin-right: 10px;
    position: relative;
    overflow: hidden;
    border-radius: 2px;
}

.CookbookGridItem.CookbookGridItemDisabled {
    font-style: italic;
}

.CookbookGridItem.CookbookGridItemDisabled .CookbookGridItemDisabledOverlay {
    display: block;
}

.CookbookGridItemDisabledOverlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    background-color: #f4f6f7;
    opacity: 0.6;
    display: none;
}

.Padding1P {
    padding: 1%;
}

.padding-left-1-percent {
    padding-left: 1%;
}

.padding-right-1-percent {
    padding-right: 1%;
}

.CookbookGridItemDetails {
    width: 230px;
    position: absolute;
    bottom: 0;
    height: 55px;
    line-height: 14px;
    /*background-color: #000;*/
    /*opacity: .8;*/
    color: #fff;
    text-align: initial;
    padding: 12px;
    box-sizing: border-box;
}

.CookbookGridItemDetailsMainContainer {
    width: 160px;
}

.CookbookGridItemDetailsMainContainer p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.CookbookGridItemDetailsSideContainer {
    display: flex;
    height: 100%;
}

.CookbookGridItemDetailsSideContainer span {
    align-self: flex-end;
}

.CookbookGridItemDetailsBlackOverlay {
    background-color: #000;
    opacity: 0.6;
}

.CookbookGridItemImageBlurOverlay {
    text-align: center;
    overflow: hidden;
}

.CookbookGridItemImageBlurOverlay img {
    position: absolute;
    /* left: 0; */
    bottom: 0;
    filter: blur(5px);
    -webkit-filter: blur(5px);
    max-height: 200px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
}

.CookbookGridItemDetails p {
    margin: 0;
}

.CookbookGridItemButton {
    position: absolute;
    height: 25px;
    width: 25px;
    opacity: 0.6;
    border-radius: 2px;
    background-color: #434754;
    border: solid 1px #3b3f4c;
    top: 6px;
    line-height: 30px;
}

.CookbookGridItemButtonDelete {
    right: 6px;
    z-index: 1;
}

.CookbookGridItemButtonDrag {
    left: 6px;
}

.CookbookListJumboText {
    display: inline-block;
    background-color: #e3ebf8;
    line-height: normal;
    padding: 2px;
    text-transform: uppercase;
}

.CookbookGridItem .CookbookGridItemImage {
    max-height: 100%;
    vertical-align: middle;
}

.CookbookGridItem .CookbookGridItemImageText {
    font-size: 90px;
    font-weight: 1000;
    color: #cfd3da;
    line-height: 60px;
    font-style: initial;
}

.CookbookGridItemJumboText {
    display: inline-block;
    background-color: #e3ebf8;
    line-height: normal;
    padding: 2px;
    text-transform: uppercase;
    color: #5d6c86;
    border-radius: 2px;
}

.ActionsDivDoubleTitle {
    line-height: 20px;
    height: 35px;
}

.ActionsDivDoubleTitle h2 {
    font-size: 20px;
    height: 20px;
    line-height: 20px;
}

.BlueTitleRow {
    background-color: #e3ebf8;
    text-indent: 20px;
    border-radius: 3px;
    line-height: 40px;
}

.BlueTitleRow span {
    font-size: 15px;
    font-weight: 500;
    color: #5a6779;
}

.GreenTitleNoBack {
    display: inline-block;
    padding: 5px;
    color: #28bd8b;
    text-transform: uppercase;
}

.SearchWithIcon {
    width: 100%;
    background-image: url(/images/search-icon.png);
    background-size: auto;
    background-repeat: no-repeat;
    background-position: 98% center;
}

.CookbookItemPageImageBox {
    width: 100%;
    height: 300px;
    background-color: #f4f6f7;
    text-align: center;
    position: relative;
}

.CookbookItemPageImageBoxName img {
    height: 150px;
}

.CookbookItemPageImagePreview {
    cursor: pointer;
    height: 300px;
    line-height: 300px;
    text-align: center;
}

.CookbookItemPageImagePreview img {
    max-height: 100%;
    max-width: 100%;
    vertical-align: middle;
}

.CookbookItemPageImageItem {
    width: 95px;
    height: 70px;
    line-height: 70px;
    cursor: pointer;
    background-color: #f4f6f7;
    text-align: center;
}

.CookbookItemPageImageItem img {
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle;
}

.CookbookItemPageImageItemSelected {
    outline: 2px solid #6dbd8b;
}

.CookbookItemPageContainer {
    max-width: 1200px;
}

.CookbookItemPageImageColContainer {
    display: inline-block;
    width: 420px;
}

.CookbookItemPageGridColContainer {
    display: inline-block;
    width: calc(95% - 430px);
    vertical-align: top;
}

@media only screen and (max-width: 1000px) {
    .CookbookItemPageImageColContainer,
    .CookbookItemPageGridColContainer {
        width: 100%;
    }
}

.CookbookItemPageDividerCol {
    display: inline-block;
    width: 5%;
}

.CookbookItemPageIngredients {
    width: 100%;
}

.CookbookItemPageIngredients .CookbookItemPageIngredientsCellPadding {
    padding: 0 25px;
}

.CookbookItemPageTimings {
    color: #5a6779;
    border-top: 1px solid #ebedf0;
}

.CookbookItemPageTimings .CookbookItemPageTimingsNumber {
    font-size: 26px;
    font-weight: bold;
    line-height: 26px;
}

.CookbookItemPageTimings .CookbookItemPageTimingsMins {
    font-weight: bold;
    vertical-align: top;
}

.CookbookItemPageTimings figcaption {
    color: #a0a9b2;
}

.CookbookItemPrintPageContainer .CookbookItemPageImageColContainer {
    width: 35%;
}

.CookbookItemPrintPageContainer .CookbookItemPageDividerCol {
    width: 2%;
}

.CookbookItemPrintPageContainer .CookbookItemPageGridColContainer {
    width: 62%;
}

.CookbookItemPrintPageContainer .CookbookItemPageTimings {
    border: 0;
}

.CookbookItemPrintPageContainer .CookbookItemPageTimings img {
    height: 6mm;
}

.CookbookItemPrintPageContainer .TableHeader1,
.CookbookItemPrintPageContainer .TableCell1,
.CookbookItemPrintPageContainer .BlueTitleRow span,
.CookbookItemPrintPageContainer .CookbookItemPageTimings,
.CookbookItemPrintPageContainer .CookbookItemPageTimings figcaption {
    color: #000 !important;
}

.CookbookItemPrintPageContainer .TableHeader1,
.CookbookItemPrintPageContainer .BlueTitleRow,
.CookbookItemPrintPageContainer .CookbookItemPageImageBox,
.CookbookItemPrintPageContainer .CookbookItemPageImageItem {
    background-color: #e8e8e8 !important;
}

.CookbookItemPrintPageContainer,
.CookbookItemPrintPageContainer .TableCell1,
.CookbookItemPrintPageContainer .TableDisplay1,
.CookbookItemPrintPageContainer .TableHeader1,
.CookbookItemPrintPageContainer .BlueTitleRow span {
    font-size: 11px;
}

.CookbookItemPrintPageContainer .TableRow1:hover {
    background-color: inherit;
}

.CookbookItemPrintPageContainer h2 {
    font-size: 160%;
}

.CookbookItemPrintPageContainer header p {
    font-size: 22px;
    display: inline-block;
    font-weight: bold;
    margin: 0;
    line-height: 60px;
    vertical-align: text-bottom;
}

.CookbookItemPrintPageContainer {
    max-width: unset;
    height: 400px;
}

.CookbookItemPrintPageMMLogo {
    height: 30px;
}

.CookbookItemPrintPageBuyerLogo {
    height: 30px;
}

.CookbookItemPrintPageImagePreview {
    text-align: center;
    width: 100%;
}

.CookbookItemPrintPageImagePreview img {
    max-height: 80mm;
    max-width: 100%;
    vertical-align: middle;
}

.CookbookItemPrintPageImageItem {
    width: 48%;
    height: 130px;
    line-height: 130px;
    text-align: center;
}

.CookbookItemPrintPageImageItem img {
    max-width: 100%;
    max-height: 100%;
    vertical-align: top;
}

.CookbookItemPrintPageContainer .PrintDefaultHeight {
    height: 25px;
    line-height: 25px;
}

.PreviewImagePopup .modal-content {
    height: 70vh;
    text-align: center;
}

.PreviewImagePopup .modal-dialog {
    width: fit-content;
}

.PreviewImagePopupMainImage {
    padding-bottom: 40px;
    max-width: 70vw;
    max-height: 70vh;
}

.ItalicText {
    font-style: italic;
}

.Height35px {
    height: 35px;
}

.Font60P {
    font-size: 60%;
}

.KeepTextLinebreaks {
    white-space: pre-wrap;
}

.ElasticTextarea {
    min-height: 60px;
    max-height: 500px;
}

.AvoidPageBreaks {
    page-break-inside: avoid;
}

.NewBlockIndication {
    font-size: 11px;
    color: #2e4b41;
    border-radius: 1px;
    background-color: #38be91;
    height: 11px;
    line-height: 11px;
    text-align: center;
    vertical-align: top;
    margin: 5px 2px;
    text-transform: lowercase;
    display: none;
    padding: 0 2px;
}

.BlockAddNewIndication .NewBlockIndication {
    display: inline-block;
}

.doc-details label {
    position: relative;
    cursor: pointer;
    color: #666;
    white-space: nowrap;
}

.InputCloseButton {
    background-color: transparent !important;
    color: inherit;
    border: none;
    padding: 0 !important;
    font: inherit;
    cursor: pointer;
    outline: inherit !important;
    background-image: url(/images/popup-close-x.png);
    height: 10px;
    width: 10px;
    position: absolute;
    top: 14px;
    right: 5px;
    background-size: contain;
}

.waste-event-details label {
    position: relative;
    cursor: pointer;
    color: #666;
    white-space: nowrap;
}

.waste-event-details md-select span {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.87);
}

.margin-right-8 {
    margin-right: 8px;
}

.margin-right-32 {
    margin-right: 32px;
}

.margin-right-24 {
    margin-right: 24px;
}

.margin-top-16 {
    margin-top: 16px;
}

.margin-top-8 {
    margin-top: 8px;
}


.waste-event-list .PageHead .ToolsOposite .FormGroup:first-child,
.waste-event-details .PageHead .ToolsOposite .FormGroup:first-child {
    padding-left: 4px;
    padding-right: 0px;
}

.production-event-list .PageHead .ToolsOposite .FormGroup:first-child {
    padding-left: 0px;
    padding-right: 0px;
}

.waste-event-list .PageHead,
.production-event-list .PageHead,
.event-list-page .PageHead {
    min-height: 42px;
    display: flex;
}

.waste-event-list .PageHead .ToolsOposite,
.production-event-list .PageHead .ToolsOposite {
    min-width: 350px;
}

.event-list-page .PageHead .Tools {
    width: 80%;
}

.event-list-page .PageHead .ToolsOposite {
    min-width: 350px;
}

.event-list-page .PageHead .Tools .FormGroup {
    padding: 0px 8px 8px 0px;
}

.event-list-page .PageHead .ToolsOposite .FormGroup {
    padding: 0px 8px 8px 0px;
}

.event-list-page .PageHead .ToolsOposite .FormGroup {
    padding: 0px 0px 8px 8px;
}

.waste-event-list .PageHead .Tools,
.production-event-list .PageHead .Tools {
    flex-grow: 1;
}

.waste-event-list .PageHead .FormGroup,
.event-list-page .PageHead .FormGroup {
    padding: 4px;
}

.waste-event-list .PageHead .FormGroup:first-child,
.event-list-page .PageHead .FormGroup:first-child {
    padding-left: 0px;
    padding-right: 4px;
}

.production-event-list .PageHead .FormGroup {
    padding-left: 0px;
    padding-right: 8px;
    padding-bottom: 8px;
}

.waste-event-list .GridMargin,
.production-event-list .GridMargin,
.event-list-page .GridMargin {
    margin-top: 4px;
}

.waste-event-list .GridMargin {
    margin-top: 4px;
}

.inventory-count-zero .radio-button{
    display: inline-block;
    width: 80%;
}

.inventory-count-zero .radio-button[disabled]{
    opacity: 0.6;
}


.inventory-count-zero .items-count-text{
    float: right;
    opacity:0.5;
}

@media only screen and (max-width: 1470px) {
    .waste-event-list .PageHead .FormGroup:first-child,
    .event-list-page .PageHead .FormGroup:first-child {
        padding-left: 4px;
        padding-right: 4px;
    }

    .event-list-page .Tools .FromGroup .GeryBtn {
        padding-top: 4px;
        padding-bottom: 4px;
    }
}

@media only screen and (max-width: 800px) {
    .production-event-list .PageHead .FormGroup {
        padding: 0px 8px 8px 0px;
    }
}

.doc-details input[type="checkbox"] {
    position: absolute;
    right: 9000px;
}

/*Check box*/
input[type="checkbox"] + .label-text:before {
    content: "\f0c8";
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    speak: none;
    font-style: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    width: 1em;
    display: inline-block;
    margin-right: 5px;
    color: #8794a6;
}

input[type="checkbox"]:checked + .label-text:before {
    content: "\f14a";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #28bd8b;
    animation: effect 250ms ease-in;
}

input[type="checkbox"]:disabled + .label-text {
    color: #aaa;
}

input[type="checkbox"]:disabled + .label-text:before {
    content: "\f0c8";
    color: #ccc;
}

.productionrecipe-prep-title {
    -webkit-print-color-adjust: exact;
}

div.productionrecipe-prep-title {
    background-color: #e3ebf8;
    border-radius: 3px;
    height: 50px;
    display: inline-block;
    width: 99.5%;
}

.productionrecipe-prep-title span {
    /* height: 10px; */
    font-family: Roboto;
    font-size: 14px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #5a6779;
}

.productionrecipe-prep-item hr {
    border-color: #ebedf0;
    border-width: thin;
    margin-top: 5px;
    margin-bottom: 5px;
}

.productionrecipe-prep {
    -webkit-print-color-adjust: exact;
}

.productionrecipe-prep input[type="checkbox"] {
    width: 55px;
    height: 10px;
    font-family: Roboto;
    font-size: 13px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8794a6;
}

.productionrecipe-prep th {
    /*width: 62px;*/
    height: 14px;
    font-family: Roboto;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8794a6;
}

.productionrecipe-prep td {
    /*width: 216px;*/
    /*height: 70px;*/
    font-family: Roboto;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: normal;
    text-align: left;
    color: #5a6779;
}

div.productionrecipe-prep {
    width: 99%;
    margin-bottom: 15px;
    margin-left: 15px;
    margin-right: 1%;
}

.productionrecipe-table-header-cell {
    display: table-cell;
    width: 170px;
    /*min-width: 150px;
    max-width: 200px;*/
    padding-top: 15px;
    padding-bottom: 5px;
    color: #5a6779;
}

.productionrecipe-table-row-cell {
    display: table-cell;
    width: 170px;
    padding-top: 5px;
    padding-bottom: 5px;
    color: #5a6779;
    word-break: break-word;
}

.productionrecipe-item-type-cell {
    padding-left: 5px;
    padding-right: 5px;
    cursor: pointer;
}

.productionrecipe-prep-procedure {
    -webkit-print-color-adjust: exact;
}

.productionrecipe-prep-procedure > div > span {
    font-family: Roboto;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 2;
    letter-spacing: normal;
    text-align: left;
    color: #5a6779;
    margin-left: 2px;
}

.productionrecipe-prep-procedure > span {
    height: 14px;
    font-family: Roboto;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8794a6;
    margin-left: 2px;
}

div.productionrecipe-prep-procedure {
    margin-bottom: 10px;
    margin-left: 15px;
    margin-top: 15px;
    display: unset;
}

.productionrecipe-prep-procedure > div {
    margin-left: 15px;
}

div.productionrecipe-prep-item-title {
    height: 50px;
    line-height: 50px;
    padding: 0 10px;
    display: flex;
    align-items: baseline;
    gap:10px;
    min-width: 0;
}

div.productionrecipe-pre-produced {
    flex-shrink:0;
    line-height: 50px;
    text-align: right;
    margin-right: 15px;
}

th.productionrecipe-prep-title-padding,
td.productionrecipe-prep-title-padding {
    padding-right: 35px;
}

.switch-login-link {
    color: #28bd8b !important;
    cursor: pointer;
    text-decoration: underline;
}
.switch-login-link.disabled {
    color: rgb(64, 77, 95) !important;
    cursor: unset;
    text-decoration: unset;
}

.SwitchUserActions ul {
    list-style: none;
    /*padding-top: 10px;
    padding-bottom: 10px;*/
    padding-left: 0px;
    padding-right: 0px;
    margin: 0;
}

.SwitchUserActions ul li {
    padding-left: 21px;
    padding-right: 19px;
    /*border-bottom: 1px solid #ebebeb;*/
    color: #81858d;
    min-height: 40px;
    display: flex;
    flex-direction: row;
    align-items: center;
    font-size: 13px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    /*line-height: 3.08;*/
    letter-spacing: normal;
    text-align: left;
    position: relative;
}

.SwitchUserActions ul li a {
    width: 100%;
    border-bottom: 1px solid #ebebeb;
}

.SwitchUserActions li:hover {
    background-color: #eef2f5;
    cursor: pointer;
}

/*.SwitchUserActions ul :first-child{
    line-height:normal;
}*/

.SwitchUserActions ul :last-child {
    border-bottom: none;
}

.SwitchUserActions li:not(:last-child)::before {
    content: "";
    border-top: 1px solid #ebebeb;
    /* width: 100%; */
    position: absolute;
    bottom: 0;
    left: 21px;
    right: 19px;
}

.user-name {
    font-size: 17px;
}

.MainMenu ul ul li a::first-letter {
    text-transform: capitalize !important;
}

a:hover {
    cursor: pointer;
}

.TeaserPageTitle {
    color: #434754;
    font-weight: 500;
    font-size: 26px;
    padding: 0;
    margin: 0;
}

.AlignContainerToTitle {
    padding: 45px 65px;
}

.PageContent.TeaserPage {
    color: #5a6779;
    padding: 0 65px;
    background-color: unset;
    border: unset;
    overflow-x: hidden;
    height: 800px;
    /*max-width: 1200px;*/
}

.TeaserPageMainContainer {
    /*background-image: url(/images/cookbook-teaser-multiview.png);
    background-repeat: no-repeat;
    background-position: right bottom;*/
    padding: 25px 0;
    font-size: 20px;
}

.TeaserPageMainImage {
    position: absolute;
    top: 70px;
    left: 630px;
}

@media only screen and (max-width: 1200px) {
    .TeaserPageMainImage {
        display: none;
    }
}

.TeaserPageMainListBullet {
    display: flex;
    align-items: center;
    padding: 12px 0;
}

.TeaserPageMainListBullet div {
    padding: 0 18px;
}

.TeaserPageExtraList {
    display: inline-block;
    border-radius: 3px;
    background-color: #d8ebe0;
    border-top: 3px solid #6dbe8c;
    padding: 22px;
}

.TeaserPageExtraList ul {
    padding: 0px 20px;
    margin: 0;
}

.TeaserPageExtraList ul li {
    padding: 5px 0;
}

.TeaserPageExtraList strong {
    color: #434754;
}

.samll-title-grid .k-grid-header th.k-header > .k-link {
    font-size: 12px;
}

h1.cogs-logbook-title {
    font-size: 17px;
    font-weight: bold;
    color: #5a6779;
    text-transform: uppercase;
}

.cogs-logbook-title-item h1 {
    font-family: Roboto;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #28bd8b;
    -webkit-margin-before: none;
    -webkit-margin-after: none;
}

.cogs-logbook-tabs div:not(:last-child) {
    border-right: solid 1px #dcdcdc;
    border-top: none;
    border-bottom: none;
    border-left: none;
}

.cogs-logbook-tabs div {
    flex-grow:1;
    height: 47px;
    text-align: center;
}

.cogs-logbook-tabs div:hover {
    background-color: #d3ede4;
}

.cogs-logbook-tabs div span {
    font-family: Roboto;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 3.86;
    letter-spacing: normal;
    color: #3e4957;
}

div.cogs-logbook-tabs {
    border-top: solid 1px #dcdcdc;
    border-bottom: none;
    border-left: none;
    border-right: none;
    min-height: 47px;
    clear: both;
    display: flex;
}

div.cogs-logbook-dataarea {
    background-color: #f2f2f2;
    padding-left: 4%;
    padding-right: 4%;
    padding-top: 27px;
}

.cogs-logbook-dataarea h1 {
    height: 18px;
    font-family: Roboto;
    font-size: 18px;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #434754;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
}

.cogs-logbook-dataarea span {
    font-family: Roboto;
    font-size: 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.73;
    letter-spacing: normal;
    text-align: left;
    color: #434754;
}

#logbook-grid span {
    font-size: 13px;
}

.cogs-logbook-dataarea .modal-body span {
    font-size: 14px;
}

.CogConfigMMCatHeader {
    margin-right: 3%;
}

.cogs-logbook-alert div {
    border-radius: 3px;
    background-color: #d9e0ed;
}

.cogs-logbook-alert span {
    font-family: Roboto;
    font-size: 14px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.29;
    letter-spacing: normal;
    text-align: left;
    color: #434754;
}

.cogs-logbook-alert-popup {
    margin-bottom: 7px;
    font-family: Roboto;
    font-size: 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.73;
    letter-spacing: normal;
    text-align: left;
    color: #434754;
    direction: ltr;
}

.cogs-logbook-calc {
    margin-bottom: 7px;
    font-family: Roboto;
    font-size: 15px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.73;
    letter-spacing: normal;
    text-align: left;
    color: #434754;
    direction: ltr;
}

.cogs-logbook-calc .value {
    unicode-bidi: embed;
}

/*.cogs-logbook-calc span {
        font-weight: 500;
    }*/
@media (min-width: 769px) {
    .cogs-logbook-popup .modal-dialog {
        width: 830px;
    }
}

@media (max-width: 768px) {
    .cogs-logbook-popup .modal-dialog {
        width: 90%;
    }
}

.cogs-logbook-popup .modal-header {
    padding-left: 4%;
}

.cogs-logbook-popup .k-footer-template td {
    background-color: #e2ebf8;
    font-size: 14px;
    color: #697586;
    font-weight: 500;
}

.cogs-logbook-icon-padding {
    padding-right: 2px;
}

.cogs-logbook-learnmore a {
    font: bold;
}

.cogs-logbook-learnmore span {
    padding-right: 10px;
}

.cogs-logbook-popup .modal-body {
    height: 480px;
    overflow-y: auto;
    background-color: rgb(242, 242, 242);
}

.padding-bottom-20 {
    padding-bottom: 20px;
}

.cogs-prep-icon img {
    padding-left: 5px;
    height: 10px;
    width: 10px;
}

.cogs-logbook-popup .k-grid-footer-wrap,
.k-grid-header-wrap {
    background-color: #f2f2f2;
}

.cogs-logbook-subtitles div:first-child {
    padding-bottom: 11px;
}

.cog-logbook-calc-bold span {
    font-weight: 500;
}

.zinfo-upload {
    position: relative;
    padding: 5px;
    margin-bottom: 8px;
    background-color: #f3f5f8;
    border: solid 1px #ccdae7;
    min-height: 100px;
}

.zinfo-upload-close-dialog {
    background-color: transparent !important;
    color: inherit;
    border: none;
    padding: 0 !important;
    font: inherit;
    cursor: pointer;
    outline: inherit !important;
    background-image: url(/images/popup-close-x.png);
    height: 17px;
    width: 17px;
    position: absolute;
    top: 10px;
    right: 10px;
    /* color: black; */
}

.zinfo-upload-task-message {
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 10%;
    padding-left: 150px;
    padding-right: 150px;
    background-color: #e8ebf1;
    color: #c8ccd4;
}

.zinfo-upload-button {
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    line-height: 34px;
}

.buyer-interface-delete {
    color: #28bd8b;
    font-weight: normal;
    font-size: 13px;
    cursor: pointer;
    text-decoration: underline;
}

.OverFlowXAuto {
    overflow-x: auto;
}

/* Tabs style*/

.mmTab .k-block,
.k-widget {
    border: none !important;
    box-shadow: none;
}

.mmTab .k-tabstrip:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.mmTab .k-animation-container,
.k-animation-container *,
.k-animation-container :after,
.k-block .k-header,
.k-list-container,
.k-widget,
.k-widget *,
.k-widget :before {
    -webkit-box-sizing: border-box !important;
    box-sizing: border-box !important;
}

.mmTab .k-state-active > .k-link {
    color: #28bd8b !important;
    background-color: white !important;
    border-radius: 0px;
}

.mmTab .k-state-default:not(.k-state-active) > .k-link,
.k-tabstrip-default:not(.k-state-active) > .k-link:hover {
    background-color: #e2e2e2 !important;
    color: #2c4054 !important;
    border-radius: 0px;
}

.mmTab .k-state-active,
.k-state-default {
    border: none !important;
}

.mmTab .k-tabstrip > .k-content {
    border: none !important;
    min-height: 500px;
    /*margin-top: 13.8px;*/
}

.mmTab .k-tabstrip-items .k-loading {
    border-top: none;
}

.mmTab .k-tabstrip-items .k-item {
    background-image: none !important;
    margin: 0 -3px 0 0;
    display: inline-block;
    position: relative;
    border-style: solid;
    border-width: 1px 1px 0;
    padding: 0;
    vertical-align: top;
}

.mmTab .k-tabstrip-items {
    border-left: solid thin #e5e6e7;
    padding: unset;
}

.mmTab .k-content > div:first-child {
    margin-top: 13.8px;
}

/*.TransferGridLocation > div {*/
/*    position: absolute;*/
/*    top: 10px;*/
/*    !*top: 20%;*/
/*    width: 83.5%;*!*/
/*    !*margin-top: -10%;*!*/
/*}*/

.transfer-details {
    background-color: #fff;
}

.transfer-details .md-datepicker-input,
.transfer-details .marketman-form-field-textarea,
.transfer-details .marketman-form-field-input,
.transfer-details .marketman-form-field-select,
.transfer-details .marketman-form-field-combo {
    background: #fff;
}

.transfer-details__form {
    display: flex;
    flex-direction: column;
    padding: 12px 0;
}

.transfer-details__formRow {
    display: flex;
}

.transfer-details__formInput {
    width: 200px;
    margin-right: 16px;
}

.transfer-details__formInput.double {
    width: 416px;
}

.transfer-details__formRow md-input-container .hint {
    color: #28bd8b;
    font-size: 12px;
}

.Transfer-Truck {
    font-size: 50px !important;
    float: left;
    margin-right: 20px;
    margin-top: 10px;
}

/*.transfer-details .marketman-form-field-input .form-field-input, .transfer-details .marketman-form-field-input .md-datepicker-input{*/
/*    margin-bottom: 0;*/
/*}*/

/*.transfer-details-header-twolines span {*/
/*    display: -webkit-box;*/
/*}*/

/*.transfer-details-header-twolines span {*/
/*    text-align: left;*/
/*    font-size: 16px;*/
/*    color: #5a6779;*/
/*    font-family: Roboto;*/
/*}*/

/*span.transfer-details-header-twolines-title {*/
/*    padding-bottom: 3px;*/
/*    font-size: 12px;*/
/*    color: #838d9b;*/
/*}*/

/* new */

.transfer-details-header-twolines-title-active {
    display: -webkit-box;
}

span.transfer-details-header-twolines-title-active {
    padding-bottom: 3px;
    font-size: 12px;
    color: #28bd8b;
}

/*.transfer-details-header-columnsgap {
    margin-right: 50px;
}*/

div.transfer-details-header-column {
    width: 25%;
    margin-bottom: 20px;
    margin-right: 50px;
}

div.transfer-details-header-column.transfer-details-wide-column {
    width: 40%;
}

div.transfer-details-header-row {
    width: 100%;
}

div.transfer-details-header-border {
    border-bottom: 1px solid #d9dadc;
    padding-bottom: 5px;
}

textarea.transfer-details-header-textarea {
    border: none;
    width: 100%;
    margin-bottom: -9px;
    background-color: transparent;
    resize: none;
}

textarea.transfer-details-header-textarea:focus:not(:read-only) {
    border-bottom: 1px solid #28bd8b;
}

.transfer-details-header-border:focus-within
    .transfer-details-header-textarea-title {
    color: #28bd8b !important;
}

.transfer-details-header-column td.ac-select-image {
    background-image: url("/images/arrow_down.png");
    padding-top: 25px;
}

.transfer-details-header-column .ac-select-main-closed {
    /*#acute-wrapper*/
    border: none !important;
    margin-top: -18px;
}

.transfer-details-header-column .ac-select-main-open {
    /*#acute-wrapper*/
    border: none !important;
    margin-top: -18px;
}

.Searchable-DropDown-AutoWith {
    display: block;
    height: 34px;
}

.Searchable-DropDown-AutoWith .ac-select-popup {
    width: auto;
}

.transfer-details-header-twolines .ac-select-table span {
    margin-left: -4px;
    margin-top: 9px;
}

.transfer-details-header-twolines div {
    outline: 0;
}

.transfer-details-header-column .date-icon-input {
    background-image: url(/images/calendar.png);
    background-size: 14px;
    text-indent: 0 !important;
    background-position: 96% center;
    display: -webkit-box;
    text-align: left;
    font-size: 16px;
    color: #5a6779;
    font-family: Roboto;
}

.transfer-details-header-column .OLSeachFields {
    width: 100%;
    margin-bottom: unset;
}

.transfer-details-header-column .OLSeachFields input {
    border: none !important;
    box-shadow: none;
    border-radius: 0px;
    height: 19px !important;
}

.transfer-header-container {
    margin-left: 22px;
    width: 50%;
    display: grid;
}

.marginside-22 {
    margin-left: 22px;
}

.div-export-options {
    /*padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;*/
    cursor: pointer;
    width: 32px !important;
    height: 32px !important;
}

/*cogs*/

.CogsGrossPageContainer {
    color: #5a6779;
}

.COGSFirstColumn {
    width: 345px;
    flex-shrink: 0;
}

.COGSChartTitle {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 17px;
    color: #5a6779;
}

.COGSChartTitleMargin {
    margin: 16px 0;
}

.COGSBoxBorder {
    border: 1px solid rgba(90, 103, 121, 0.25);
}

.COGSBoxBorderTop {
    border-top: 1px solid rgba(90, 103, 121, 0.25);
}

.COGSTableButton {
    position: absolute;
    z-index: 1;
    top: 15px;
    right: 15px;
}

.COGSColumnSpacer {
    width: 10px;
    flex-basis: 10px;
    /* flex-grow: 1; */
    flex-shrink: 0;
}

.COGSInfoBox {
    height: 108px;
}

.COGSInfo3 {
    width: 32%;
    padding: 16px 13px;
    font-size: 14px;
    box-sizing: border-box;
}

.COGSInfo2 {
    width: 49%;
    padding: 16px 16px;
    font-size: 14px;
    box-sizing: border-box;
}

.COGSInfoEmptyState {
    width: 49%;
    padding: 16px 0;
    font-size: 14px;
    box-sizing: border-box;
}

.COGSInfoEmptyState em {
    font-weight: 500;
    font-style: normal;
}

.COGSInfoEmptyState strong {
    font-weight: bold;
    font-size: 24px;
    font-style: normal;
    color: #3d4859;
}

.COGSInfo3 em,
.COGSInfo2 em {
    font-weight: 500;
    font-size: 14px;
    font-style: normal;
}

.COGSInfo3 strong,
.COGSInfo2 strong {
    font-weight: bold;
    font-size: 21px;
    font-style: normal;
}

.COGSInfoTotalSalesStandOut {
    padding: 16px 0;
    text-align: center;
    vertical-align: middle;
    line-height: 30px;
}

.COGSInfoSpacer {
    width: 2px;
    background-color: #e8e9ea;
    /* height: 100%; */
    margin: 12px 0;
    line-height: 84px;
}

.COGSEmptyState {
    color: #8e96a1;
}

.COGSEmptyState .BigText {
    font-size: 36px;
}

.COGSEmptyState article {
    width: 300px;
    margin: auto;
}

.COGSOverlayBox {
    padding: 10px;
}

.DisplayFlex {
    display: flex;
}

.COGSFlexBox {
    display: flex;
}

@media only screen and (max-width: 800px) {
    .COGSFlexBox {
        display: block;
    }

    .COGSFirstColumn {
        margin: auto;
    }
}

.FlexGrow100 {
    flex-grow: 100;
}

.MaxWidthInitial {
    max-width: initial;
}

.PaddingSide10 {
    padding-left: 10px;
    padding-right: 10px;
}

.ChartTableButton {
    position: absolute;
    z-index: 1;
    top: 18px;
    right: 12px;
}

.PurchaseTableButton {
    position: absolute;
    z-index: 1;
    top: 26px;
    right: 12px;
}

.PurchaseTableButton-breakdown {
    position: absolute;
    z-index: 1;
    top: 12px;
    right: 12px;
}

/*end cogs*/
.k-pdf-export .k-grid-toolbar,
.k-pdf-export .k-pager-wrap,
.k-pdf-export .k-grid .k-grid-header .k-header .k-link .has-tooltip .fa,
.k-pdf-export .k-grid .k-grid-header .k-header .k-link .has-hover-tooltip .icon,
.k-pdf-export .k-header-column-menu .k-icon,
.k-pdf-export input[type="text"],
.k-pdf-export .k-grid .k-filter-row {
    display: none !important;
}

.ExportLinkNew {
    background-color: transparent;
    color: #b2b3b5;
    border: solid thin #28bd8b;
    width: 34px;
    height: 34px;
    display: block;
    background-image: url(/images/download_rest.svg);
    background-position: 50% 60%;
    background-size: auto;
    background-repeat: no-repeat;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    border-radius: 3px;
}

.ExportLinkNew:hover {
    background-image: url(/images/download.svg);
    background-position: 50% 60%;
    background-size: auto;
    background-repeat: no-repeat;
    background-color: #43d7a5;
    border: solid thin #43d7a5;
}

.WeeklyOrder-MinAlert {
    width: 400px;
    text-indent: 5px;
    min-height: 45px;
    line-height: 25px;
    border: solid 1px #c37e7e;
    display: block;
    text-align: left;
    background-color: #ffebeb;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    box-sizing: border-box;
    margin-bottom: 10px;
    margin-top: auto;
    margin-left: 32%;
    position: relative;
    color: #ad2424;
    padding: 10px 0px 10px 50px;
}

.WeeklyOrder-MinAlert:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f071";
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 30px;
    color: rgba(156, 0, 0, 0.18);
}

div.order-popup-weeklyorder {
    position: absolute;
    /*top: 35%;*/
    border: 1px solid black;
    background-color: white;
    /*left: 50px;*/
}

.order-popup-weeklyorder ul {
    -webkit-margin-before: 5px !important;
    -webkit-margin-after: 5px !important;
    -webkit-padding-start: 5px !important;
    -webkit-padding-end: 5px !important;
}

.order-popup-weeklyorder il {
    display: block;
}

.order-popup-weeklyorder a {
    color: blue;
}

.WeeklyOrder-AlreadyScheduledAlert {
    border: 3px red solid;
    padding: 3px;
    text-align: center;
    width: 50%;
    margin-left: 25%;
}

div.WeeklyOrder-Repeating-icon {
    /* TODO (Tal branch): RTL support */
    width: fit-content;
    float: left;
}

.WeeklyOrder-Repeating-icon i {
    /* TODO (Tal branch): RTL support */
    color: #5a6779;
    padding-top: 8px;
    padding-left: 8px;
    font-size: 18px;
    outline: none;
}

.WeeklyOrder-Repeating-icon i:hover {
    color: #28bd8b;
    cursor: pointer;
}

.WeeklyOrder-Repeating-icon div {
    /* TODO (Tal branch): RTL support */
    font-size: 13px;
    padding-left: 8px;
    float: right;
    line-height: 33px;
}

span.WeeklyOrder-Repeating-edit {
    /* TODO (Tal branch): RTL support */
    color: #28bd8b;
    font-weight: bold;
}

span.WeeklyOrder-Repeating-edit:hover {
    cursor: pointer;
}

.marketman-title {
    font-size: 17px;
    font-weight: 700;
    color: #5a6779;
    text-transform: uppercase;
}

.marketman-small-title {
    font-size: 14px;
    font-weight: 700;
    color: #5a6779;
    text-transform: uppercase;
}

.marketman-title.lowercase {
    text-transform: unset;
}

.WeeklyOrderEditTemplateButton:hover {
    cursor: pointer;
}

/* marketman-card*/
.marketman-card-wrapper {
    min-width: 150px;
    padding: 5px;
    border: 1px solid #e5e6e7;
    border-radius: 4px;
}

.marketman-card-box {
    height: 100px;
    padding: 10px 10px 20px 10px;
}

.marketman-card-label {
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    color: #5a6779;
    text-transform: uppercase;
}

.marketman-card-main {
    margin-top: 5px;
    font-size: 28px;
    text-align: center;
    font-weight: 700;
}

.marketman-card-bottom {
    text-align: center;
    bottom: 10px;
}

.marketman-card-info {
    color: #c5cad4;
}

.marketman-card-info:hover {
    cursor: pointer;
}

.marketman-card-link {
    font-size: 11px;
    color: #c5cad4;
    text-decoration: none;
    border: none;
    background: none;
}

.marketman-card-link:hover {
    text-decoration: underline;
    cursor: pointer;
}

/*payments-page*/
.payments-page-top {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: stretch;
}

.payments-page-top-start {
    width: 73%;
    margin-right: 0.5%;
}

.payments-page-top-start-upper marketman-card {
    margin-left: 0;
    margin-right: 0;
}

.payments-page-top-start-lower {
    display: flex;
    width: 100%;
}

.payments-page-top-start-lower marketman-card {
    /*width: 40%;
    margin-left: 0;
    margin-right: 0;*/
    width: 33%;
    margin-left: 1%;
    margin-top: 8px;
}

.payments-page-top-start-lower marketman-card:first-child {
    margin-left: 0;
}

.payments-page-top-end {
    width: 27%;
    margin-left: 0.5%;
}

.payments-page-graph {
    margin-top: 30px;
    border: 1px solid #e5e6e7;
    border-radius: 4px;
}

.payments-page-graph .highcharts-title {
    font-size: 17px !important;
    font-family: "Roboto" !important;
    font-weight: bold;
    color: #5a6779 !important;
    text-transform: uppercase;
}

.payments-page-open-bills {
    margin-top: 30px;
    width: 100%;
}

.payments-page-bottom-section {
    margin-top: 30px;
    width: 100%;
    display: flex;
}

.payments-page-awaiting-approval {
    width: 49.5%;
    padding: 5px;
    margin-right: 0.5%;
    border: 1px solid #e5e6e7;
    border-radius: 4px;
}

.payments-page-recent-payments {
    width: 49.5%;
    margin-left: 0.5%;
}

.payments-page-recent-payments-full-width {
    width: 100%;
    margin-left: 0.5%;
}

/*payment-popup*/

.payment-popup .model-footer {
    padding-top: 5px;
}

.payment-popup-upper {
    border-bottom: 1px dashed #e5e6e7;
}

.payment-popup-bottom {
    padding-top: 12px;
}

.payment-popup-bottom .md-datepicker-input-container {
    width: 100%;
}

.payment-popup-bottom .date-icon-input-end {
    background-position: 98% center;
}

/*docdetails-payment-fields*/
.doc-details-inputs {
    min-width: 195px;
}

.doc-details-inputs .md-datepicker-input-container {
    min-width: 195px;
}

.doc-details-inputs md-input-container {
    margin: 5px 0;
}

.date-icon-input-end :hover {
    cursor: pointer;
}

md-input-container .md-errors-spacer {
    min-height: 10px;
}

/*angular-material*/
.md-icon-button + .md-datepicker-input-container {
    margin: 0;
}

._md-datepicker-floating-label._md-datepicker-has-calendar-icon
    > label:not(.md-no-float):not(.md-container-ignore) {
    right: auto;
    left: auto;
}

.md-pane-open {
    z-index: 9999;
    background: #fff;
}

.md-select-menu-container {
    z-index: 9999;
}

md-backdrop.md-select-backdrop {
    z-index: 8999;
}

md-select-menu,
md-select-menu md-content {
    max-height: 385px;
}

md-tabs.md-default-theme md-ink-bar,
md-tabs md-ink-bar {
    color: #28bd8b !important;
    background-color: #28bd8b !important;
}

md-content.md-default-theme,
md-content {
    background-color: transparent !important;
}

.tab-circle {
    width: 23px;
    height: 23px;
    border-radius: 23px;
    background-color: #949494;
    color: white;
    display: table-cell;
    text-align: center;
    overflow: hidden;
    vertical-align: middle;
}

md-tab-item[tabindex="0"] .tab-circle {
    background-color: #28bd8b;
}

.md-select-menu-container.md-active {
    background-color: white;
}

md-tabs.md-default-theme .md-tab,
md-tabs .md-tab,
md-tabs .md-tab.md-active {
    color: #5a6779;
}

md-checkbox.checkbox {
    margin-bottom: 0 !important;
}

md-checkbox.checkbox .md-icon {
    transform: scale(0.8);
}

md-checkbox.checkbox .md-label {
    margin-left: 15px;
}

.submenu-title {
    color: #2c4054;
    font-size: 14px;
    font-weight: 500;
}

md-checkbox.checkbox {
    margin-bottom: 0 !important;
}

md-checkbox.checkbox .md-icon {
    transform: scale(0.8);
}

md-checkbox.checkbox .md-label {
    margin-left: 15px;
}

.md-select-value {
    padding: 0 0 0 11px;
}

.light-back-chevron {
    color: #e0dddd;
    font-size: 15px !important;
    cursor: pointer;
    padding-right: 5px;
}

.light-back-chevron:hover {
    color: #5a6779 !important;
}

.GeneralPopup-green-header {
    padding-top: 32px;
    padding-left: 32px;
    padding-right: 32px;
    padding-bottom: 25px;
    border-bottom: none;
}

.GeneralPopup-green-body {
    padding-left: 32px;
    padding-right: 32px;
    position: relative;
    overflow-y: auto;
    max-height: 60vh;
    direction: ltr !important;
}

.GeneralPopup-green-Button {
    /*width: 81px !important;*/
    width: unset !important;
    min-height: unset !important;
    height: 34px !important;
    font-size: 14px !important;
    font-weight: normal !important;
    margin-right: 8px;
}

.GeneralPopup-green-footer {
    padding: 0 0 32px;
    width: fit-content;
    display: inline-flex;
    margin-top: 94px;
}

.GeneralPopup-green-footer > div {
    position: absolute;
    right: 24px;
    bottom: 32px;
    display: inline-flex;
}

.orange-footer > div {
    right: 12px;
}

.GeneralPopup-green-footer .footer-link {
    left: 32px;
    right: auto;
    line-height: 32px;
}

.radio-height-fix-weekly > div:first-child {
    top: 28%;
}

span.font16px {
    font-size: 16px;
}

.font32px {
    font-size: 32px;
}

.font18px {
    font-size: 18px;
}

.font16px {
    font-size: 16px;
}

.font14px {
    font-size: 14px;
}

.font12px {
    font-size: 12px;
}

.ui-autocomplete {
    max-height: 150px;
    overflow-y: auto;
    overflow-x: hidden;
}

.popup-over-close {
    float: right !important;
    cursor: pointer;
    color: inherit !important;
    text-decoration: unset;
}

.ui-dialog div.ac-select-list {
    max-height: 160px !important;
}

.modal-xlg {
    width: 800px;
}

.ac-select-inline {
    display: inline-block;
    vertical-align: middle;
}

.k-grouping-row {
    border: none !important;
}

.k-grouping-row td {
    border: none !important;
    background-color: #e2ebf8 !important;
}

.k-resize-handle-inner,
td.k-group-cell {
    background-color: transparent !important;
}

.md-toast-content {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-left-radius: 2px !important;
    border-bottom-right-radius: 2px !important;
}

.mdToast-addition .md-toast-content {
    /*background-color: #ea5a5a;*/
    min-height: 48px;
    max-height: unset;
    padding: 16px 16px 16px 16px;
    min-width: 188px;
    max-width: 330px;
    width: fit-content;
}

.mdToast-addition .md-toast-content:before {
    min-height: unset;
    display: unset;
}

.mdToast-addition {
    padding: unset;
    /*left: 41%;*/
    min-width: 188px;
    max-width: 330px;
    min-height: 80px;
    width: fit-content;
}

.mdToast-addition {
    z-index: 5000;
    /*box-shadow: 0px 5px 10px 0 rgba(0, 0, 0, 0.25);*/
}

.mdToast-addition-image {
    min-width: 28px;
    height: 20px;
    background-repeat: no-repeat;
}

.mdToast-addition-content {
    direction: rtl;
}

.mdToast-addition-content > ul {
    direction: ltr;
    margin-block-start: unset;
    margin-block-end: unset;
    padding-inline-start: unset;
    font-size: 12px;
    white-space: pre-line;
}

.mdToast-addition-content i {
    font-size: 7px;
    vertical-align: middle;
    padding-left: 6px;
    padding-right: 6px;
}

.ps-mode-modal.ps-checkout-visible {
    z-index: 2000 !important;
}

.mdToast-addition-content ul li {
    list-style-type: none;
}

.ac-select-dropdown {
    display: block;
    height: 34px;
}

/*.DivRowInput ac-select.ng-isolate-scope {
    height: unset;
}*/

.buyer-categories-details .green-popup .modal-body {
    overflow-y: visible;
}

/*.DivRowInput ac-select.ng-isolate-scope .ac-select-wrapper {
    position: unset;
}*/

.PageHead {
    min-height: 42px;
    display: flex;
    padding-bottom: unset;
    margin: 0 -8px;
}

.list-page input[type="text"]::placeholder {
    color: #5a6779;
}

.switch-user-tools{
    display:Flex;
    align-items: center;
    justify-content: space-between;
    width:100%;
}

.switch-user-tools .SearchText,
.list-page .SearchText,
.merge-inv-items-search-content .SearchText {
    background-image: url(/images/search_grey.svg);
    background-size: 14px;
    background-repeat: no-repeat;
    background-position: 95% center;
    min-width: 200px;
    text-indent: 11px !important;
    border: thin solid #d1d2d5 !important;
    color: #5a6779 !important;
}




/* .list-page .PageHead .ToolsOposite {
        min-width: 25%;
    } */

.list-page .Tools .FormGroup {
    padding: 0px 8px 8px 0px;
}

.list-page .ToolsOposite .FormGroup {
    padding: 0px 0px 8px 8px;
}

.list-page ac-select.ng-isolate-scope {
    display: block;
    height: 34px;
}

.purchase-supplier-filter-title {
    height: 11px;
    text-transform: uppercase;
    font-weight: 900;
    width: 118px;
}

.purchase-supplier-graph-header {
    height: 75px;
    background-color: #f8f8f8;
}

.purchase-supplier-multiselect-contianer {
    display: block;
    width: 160px;
    height: 34px;
}

.purchase-supplier-switch-position {
    margin-right: 50px !important;
    margin-top: 20px !important;
}

.purchase-supplier-switch-position-breakdown {
    margin-right: 50px !important;
    margin-top: 5px !important;
}

.purchase-supplier-graph-header .Tools {
    padding-top: 13px;
    padding-left: 12px;
}

.set-graph-text {
    position: absolute;
    top: 102px;
    left: 233px;
}

.set-percentage-text {
    font-size: 36px;
    font-weight: bold;
    color: #23b1f7;
}

.set-price-text {
    font-size: 16px;
    font-weight: bold;
    color: #23b1f7;
    margin-bottom: 5px;
}

.chart-left-arrow {
    position: absolute;
    top: 10px;
    left: 4%;
    z-index: 9;
    cursor: pointer;
}

.chart-right-arrow {
    position: absolute;
    top: 10px;
    right: 20px;
    z-index: 9;
    cursor: pointer;
}

.all-purchases {
    font-size: 14px;
    font-weight: 500;
    color: #767881;
}

.offset-top-5 {
    margin-top: 5px;
}

.for-the-selected-buyer {
    font-size: 12px;
    color: #5a6779;
    text-align: left;
    margin-left: 30px;
    margin-bottom: 10px;
}

.single {
    margin-left: 10px;
}

.purchase-supplier-label-text {
    font-size: 44px;
    font-weight: 500;
    color: #23b1f7;
    margin-top: 45px;
    margin-left: 198px;
    word-wrap: break-word;
}

.purchase-supplier-legend {
    margin-left: 198px;
}

.purchase-supplier-text-position {
    position: absolute;
    top: 77px;
    left: 270px;
}

.purchase-buyersDD dl {
    padding: 0px 8px 0px 0px !important;
}

@media only screen and (min-width: 990px) and (max-width: 1130px) {
    .purcahse-first-column {
        width: 45%;
    }

    .purcahse-second-column {
        width: 60%;
    }

    .purchase-supplier-label-text {
        font-size: 44px;
        font-weight: 500;
        color: #23b1f7;
        margin-top: 76px;
        margin-left: 130px;
    }
}

.lite-file-upload-container {
    height: 32vh;
    overflow-y: auto;
}

@media (min-height: 500px) {
    .lite-file-upload-container {
        height: 32vh;
    }
}

@media (min-height: 800px) {
    .lite-file-upload-container {
        height: 42vh;
    }
}

.MainMenu .menu-icon i.menu-itemsuppliers-lite:before {
    background-image: url("/images/menu-icons/menu-itemsuppliers-lite.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .menu-itemsuppliers-lite:before,
.MainMenu > ul > li.active.has-sub .menu-itemsuppliers-lite:before {
    background-image: url("/images/menu-icons/menu-itemsuppliers-lite-active.png");
}

.MainMenu > ul > li.has-sub:hover .menu-itemsuppliers-lite:before {
    background-image: url("/images/menu-icons/menu-itemsuppliers-lite-active.png");
}

.MainMenu .menu-icon i.menu-reports-lite:before {
    background-image: url("/images/menu-icons/menu-reports-lite.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .menu-reports-lite:before,
.MainMenu > ul > li.active.has-sub .menu-reports-lite:before {
    background-image: url("/images/menu-icons/menu-reports-lite-active.png");
}

.MainMenu > ul > li.has-sub:hover .menu-reports-lite:before {
    background-image: url("/images/menu-icons/menu-reports-lite-active.png");
}

.MainMenu .menu-icon i.menu-payments-lite:before {
    background-image: url("/images/menu-icons/menu-payments-lite.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .menu-payments-lite:before,
.MainMenu > ul > li.active.has-sub .menu-payments-lite::before {
    background-image: url("/images/menu-icons/menu-payments-lite-active.png");
}

.MainMenu > ul > li.has-sub:hover .menu-payments-lite:before {
    background-image: url("/images/menu-icons/menu-payments-lite-active.png");
}

.MainMenu .menu-icon i.menu-home-lite:before {
    background-image: url("/images/menu-icons/menu-home-lite.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .menu-home-lite:before,
.MainMenu > ul > li.active.has-sub .menu-home-lite:before {
    background-image: url("/images/menu-icons/menu-home-lite-active.png");
}

.MainMenu > ul > li.has-sub:hover .menu-home-lite:before {
    background-image: url("/images/menu-icons/menu-home-lite-active.png");
}

.MainMenu .menu-icon i.menu-settings-lite:before {
    background-image: url("/images/menu-icons/menu-settings-lite.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .menu-settings-lite:before,
.MainMenu > ul > li.active.has-sub .menu-settings-lite:before {
    background-image: url("/images/menu-icons/menu-settings-lite-active.png");
}

.MainMenu > ul > li.has-sub:hover .menu-settings-lite:before {
    background-image: url("/images/menu-icons/menu-settings-lite-active.png");
}

.MainMenu .menu-icon i.menu-accounting-lite:before {
    background-image: url("/images/menu-icons/menu-accounting-lite.png");
}

.MainMenu > ul > li.CurrentMenuHL.has-sub .menu-accounting-lite:before,
.MainMenu > ul > li.active.has-sub .menu-accounting-lite:before {
    background-image: url("/images/menu-icons/menu-accounting-lite-active.png");
}

.MainMenu > ul > li.has-sub:hover .menu-accounting-lite:before {
    background-image: url("/images/menu-icons/menu-accounting-lite-active.png");
}

.lite-file-upload-container {
    height: 32vh;
    overflow-y: auto;
}

@media (min-height: 500px) {
    .lite-file-upload-container {
        height: 32vh;
    }
}

@media (min-height: 800px) {
    .lite-file-upload-container {
        height: 42vh;
    }
}

.ui-dialog .ac-select-wrapper {
    position: initial;
}

.lite-dashboard-head {
    height: 114px;
}

.lite-user-name-text {
    padding-left: 11px;
    padding-right: 11px;
    font-size: 17px;
    font-weight: 500;
    color: #5a6779;
}

.lite-user-name-text span {
    padding: 10px;
}

.lite-dashboard-invoice-postion {
    text-align: center;
    /*margin-left: 38%;*/
    /*margin-right: 40%;*/
    margin-top: 2%;
}

.margin-end-5 {
    margin-right: 5px;
}

.chart-switch-position-no-table {
    margin-right: 20px !important;
    margin-top: 20px !important;
}

.chart-switch-position-with-table {
    margin-right: 50px !important;
    margin-top: 10px !important;
}

.MaterialMarketmanMultiselect ul {
    margin-top: 0;
}

.MarketmanDropDown dd .MaterialMarketmanMultiselect ul {
    border-radius: 2px;
    padding: 5px 15px 5px 5px;
    z-index: 30;
}

.MaterialMarketmanMultiselect md-checkbox {
    margin-bottom: 5px;
}

.MaterialMarketmanMultiselect md-checkbox .md-label {
    margin-left: 25px;
    white-space: nowrap;
}

.MarketmanDropDown.MaterialDropDown dt a {
    border: solid thin #e5e6e7;
    border-radius: 2px;
    padding: 4px 5px;
}

.multiselect-container {
    display: block;
    width: 160px;
    height: 34px;
}

.MarketmanDropDown.MaterialDropDown dt a span,
.MaterialDropDown .MarketmanMultiselect span {
    font: 13px "Roboto";
    color: #424c5a;
    margin-top: 5px;
}

.MarketmanDropDown.MaterialDropDown a,
a:visited {
    margin-top: 0;
}

.FormGroup .MaterialDropDown span {
    line-height: unset;
    height: unset;
}

.top-margin-waste {
    margin-top: 17px;
}

.ui-dialog .ac-select-wrapper {
    position: initial;
}

.lite-dashboard-head {
    height: 114px;
}

.lite-user-name-text {
    padding-left: 11px;
    padding-right: 11px;
}

.lite-dashboard-invoice-postion {
    /*margin-left: 38%;*/
    /*margin-right: 40%;*/
    margin-top: -54px;
    margin-bottom: 21px;
}

.selectmmSelectHeader .mm-header-searchbox {
    border: none;
    outline: none;
    height: 100%;
    width: 100%;
    padding: 0;
}

.selectmmSelectHeader .mm-select-header {
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1), 0 0 0 0 rgba(0, 0, 0, 0.14),
        0 0 0 0 rgba(0, 0, 0, 0.12);
    padding-left: 10.667px;
    height: 48px;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    width: auto;
}

.selectmmSelectHeader md-content._md {
    max-height: 240px;
}

md-input-container.marketman-md-select label {
    display: none;
}

.marketman-md-select md-select.md-default-theme .md-select-value,
md-input-container:not(.marketman-formfield-select, .marketman-form-field-select)
    md-select
    .md-select-value {
    border: solid thin #e5e6e7;
    border-radius: 2px;
    padding-left: 11px;
}

.marketman-md-select md-select:not([disabled]):focus .md-select-value {
    border-bottom-width: thin;
}

.marketman-md-select
    md-select.ms-default-theme:not([disabled]):focus
    .md-select-value,
.marketman-md-select md-select:not([disabled]):focus .md-select-value {
    border-bottom-color: #e5e6e7;
}

md-input-container.marketman-md-select {
    display: inline-block;
    position: relative;
    padding: 0;
    margin: 0;
    vertical-align: middle;
    border: solid thin #d1d2d5;
}

.marketman-md-select .md-select-value {
    max-height: 33px;
    border: none !important;
}

#cogsHQ .marketman-md-select .md-select-value {
    box-sizing: border-box;
}

.hideArrow .md-select-value {
    padding: 0 0 0 0;
}

.hideArrow .md-select-value .md-select-icon {
    display: none;
}

md-input-container.marketman-md-select.md-input-focused:not(.md-input-has-value)
    md-select
    .md-select-value.md-select-placeholder {
    color: transparent;
}

md-select-menu.md-default-theme
    md-content
    md-option[disabled].const-option
    .md-text,
md-select-menu md-content md-option[disabled].const-option .md-text {
    color: rgba(33, 33, 33, 0.87);
}

md-select-menu,
md-select-menu md-content {
    max-height: 500px;
}

.selectmmSelectHeader md-content._md {
    max-height: 500px;
}

.selectmmSelectHeader md-content::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

.selectmmSelectHeader md-content::-webkit-scrollbar-track {
    border-radius: 0px;
}

.selectmmSelectHeader md-content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #c6cbd4;
}

md-tooltip.tt-multiline ._md-content {
    height: auto;
}

md-radio-button .md-label {
    color: #62646b;
}
.commissary-sale md-radio-button .md-container {
    height:18px;
    width:18px;
}
.commissary-sale md-radio-button .md-off,
.commissary-sale md-radio-button .md-on {
    height:18px;
    width:18px;
    border-color: #D1D2D5;
}

.waste-switch-text {
    color: #62646b;
}

.purcahse-first-column {
    width: 38%;
}

.purcahse-second-column {
    width: 60%;
}

.title-content-box-container {
    display: flex;
}

.title-content-box {
    display: flex;
    padding: 5px;
}

.title-content-box .title-content {
    width: 200px;
}

.title-content-box .title-content-base {
    width: 120px;
}

.title-content-box .box-title {
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #5a6779;
}

.title-content-box .box-content {
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #5a6779;
}

.title-content-box .box-separetaor {
    width: 66px;
    margin-right: 31px;
    border-right: dotted #c5cad4 2px;
}

.incoming-order-details-data-container {
    display: flex;
    padding-top: 25px;
}

.order-details-data-section {
    padding-right: 93px;
}

.order-details-data-item {
    display: flex;
    padding-bottom: 14px;
}

.order-details-data-item-title {
    width: 130px;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #5a6779;
}

.order-details-data-item-content {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    color: #5a6779;
}

.list-page .PageHead .btn-image-container {
    margin-left: 8px;
}

.tooltip-m8 {
    margin-bottom: 8px;
}

/*New Allergens modal styles*/

.modal-wide {
    width: 90%;
    max-width: 800px;
}

.allergens-popup2 * {
    box-sizing: border-box;
}

.allergens-popup2:before {
    border-top-color: #1b9438;
}

.allergens-popup2 .GeneralPopup-green-header {
    padding-bottom: 14px;
}

.allergens-popup2 .green-popup-title {
    font-size: 20px;
    font-weight: 500;
}

.allergens-popup2 .nano {
    height: 300px;
    margin: 24px 0 16px;
}

.allergens-popup2 .nano .nano-pane {
    top: 47px;
}

.allergens-popup2-description {
    color: #2c4054;
    padding: 0 32px;
}

.allergens-popup2-table {
    display: grid;
    grid-template-columns: auto repeat(4, 133px);
    grid-template-rows: auto;
}

.allergens-popup2-table-heading {
    height: auto;
    position: sticky;
    top: 0;
    z-index: 5;
    background: white;
    padding: 14px 5px;
    color: #5c82a4;
    font-size: 16px;
    font-weight: bold;
    border-bottom: 1px solid #5c82a4;
    text-align: center;
}

.allergens-popup2-table-cell {
    border-bottom: 1px solid #d1d2d5;
    padding: 11px;
    text-align: center;
}

.allergens-popup2-table-cell.title-cell {
    text-align: left;
}

.allergens-popup2-table-cell.title-cell i.fa-question-circle-o {
    color: #ea5a5a;
    font-size: 18px;
    line-height: 13px;
    margin-left: 3px;
    position: relative;
    bottom: -2px;
}

.allergens-popup2-table-cell.title-cell.child {
    padding-left: 25px;
}

.allergens-popup2-table-heading:first-child {
    text-align: left;
}

.allergens__list ul {
    padding-left: 0;
    margin: 0;
}

.allergens__list ul > li {
    margin: 5px 0 0;
}

md-radio-group.allergens-popup2-table-cell {
    position: relative;
}

md-radio-group.allergens-popup2-table-cell i {
    position: absolute;
    left: calc(50% + 12px);
    font-size: 18px;
    top: 50%;
    transform: translateY(-50%);
}

md-radio-group.allergens-popup2-table-cell md-radio-button {
    margin-bottom: 0;
    display: inline-block;
    position: relative;
    right: -4px;
}

.allergens-popup2-table-cell.collapsed {
    display: none;
}

.allergens-popup2-table-cell.expanded,
.allergens-popup2-table .more-info.expanded {
    background: #f8f8f9;
}

.allergens-popup2-table .more-info.expanded [data-action="show more"] {
    display: none;
}

.allergens-popup2-table .more-info.expanded [data-action="show less"] {
    display: inline;
}

.allergens-popup2-table .more-info [data-action="show less"] {
    display: none;
}

.allergens-popup2-table .more-info {
    grid-column-start: 1;
    grid-column-end: 6;
    font-size: 12px;
    color: #23b1f7;
    padding: 3px 11px 8px;
    cursor: pointer;
    user-select: none;
    position: relative;
    top: -2px;
    background: white;
    border-bottom: 1px solid #d1d2d5;
    outline: none !important;
}

.allergens-popup2-checkbox {
    margin-top: 12px;
}

.allergens-popup2-checkbox label {
    cursor: pointer;
    user-select: none;
}

.allergens-popup2-checkbox input[type="checkbox"] {
    display: none;
}

.allergens-popup2-checkbox i {
    font-size: 18px;
    color: #d1d2d5;
    margin-right: 8px;
}

.allergens-popup2-checkbox input[type="checkbox"] ~ i.fa.fa-check-square-o {
    display: none;
}

.allergens-popup2-checkbox input[type="checkbox"]:checked ~ i.fa.fa-square-o {
    display: none;
}

.allergens-popup2-checkbox
    input[type="checkbox"]:checked
    ~ i.fa.fa-check-square-o {
    display: inline;
    color: #29bd8b;
}

.allergens-popup2-checkbox input[type="checkbox"]:disabled ~ i {
    opacity: 0.5;
}

.allergens-popup2-link {
    margin-top: 8px;
}

.allergens-popup2-link a {
    font-size: 12px;
    color: #23b1f7;
    text-decoration: none;
    font-weight: 300;
}

.DropMenuActions.allergens-drop-menu {
    width: 310px;
}

@media only screen and (max-width: 1365px) {
    .title-content-box-container {
        padding-top: 50px;
    }

    #orderDetailsDiv .list-page .PageHead .ToolsOposite {
        min-width: 100%;
    }
}

@media only screen and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) and (orientation: portrait) {
    .title-content-box .title-content {
        width: 120px;
    }
}

.marketman-button {
    height: 34px;
    padding: 6px 23px;
    font-size: 14px;
    border-radius: 3px;
    box-shadow: none;
    margin: 0 4px;
}

.marketman-button[disabled] {
    opacity: 0.7;
    cursor: not-allowed;
}

.marketman-button.marketman-button--green {
    border: 1px solid #28bd8b;
    background: #28bd8b;
    color: white;
}

.marketman-button.marketman-button--green:hover {
    background: white;
    color: #28bd8b;
}

.marketman-button.marketman-button--light {
    padding-left: 9px;
    padding-right: 9px;
    background-color: transparent;
    border: solid 1px #d1d2d5;
}

.marketman-button.marketman-button--green.marketman-button--light {
    background: white;
    color: #28bd8b;
    border-color: #28bd8b;
}

.marketman-button.marketman-button--green.marketman-button--light:hover {
    background: #28bd8b;
    color: white;
}

.marketman-chevron {
    margin-left: 3px;
}

.marketman-chevron:before {
    content: "";
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
    width: 10px;
    height: 8px;
}

.marketman-chevron-down:before {
    background-image: url("/images/row_arrow_open.svg");
}

.marketman-chevron-up:before {
    background-image: url("/images/row_arrow_close.svg");
}

#purchaseItems.gridCheckboxDisabled market-man-grid md-checkbox {
    pointer-events: none;
    opacity: 0.5;
}

.inventory-items-search {
    width: 200px;
}

.marketman-academy-link {
    background-color: transparent;
    color: #b2b3b5;
    border: solid thin #28bd8b;
    width: 34px;
    height: 34px;
    display: block;
    background-image: url(/images/academy_new.svg);
    background-position: 50% 60%;
    background-size: auto;
    background-repeat: no-repeat;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    border-radius: 3px;
}

.marketman-academy-link:hover {
    background-image: url(/images/academy.svg);
    background-position: 50% 60%;
    background-size: auto;
    background-repeat: no-repeat;
    background-color: #42d7a5;
    border: solid thin #42d7a5;
}

.marketman-settings-link {
    background-color: transparent;
    color: #b2b3b5;
    border: 1px solid #28bd8b;
    width: 34px;
    height: 34px;
    display: block;
    background-image: url(/images/setting_new.svg);
    background-position: 50% 49%;
    background-size: auto;
    background-repeat: no-repeat;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    border-radius: 3px;
}

.marketman-settings-link:hover {
    background-image: url(/images/setting_new_hover.svg);
    background-repeat: no-repeat;
    background-color: #42d7a5;
    border: solid thin #42d7a5;
}

.faStack {
    height: 1.75em !important;
}

.SearchText:focus {
    background-image: unset;
}

.list-page .md-select-value .md-select-icon:after {
    transform: scaleY(0.8) scaleX(1);
    content: url(/images/arrow_down.png);
    left: -5px;
}
.table-cell-dp.GrisSimilarCellStylePaddingTopButtom{
    vertical-align: top;
  }
  .GrisSimilarCellStylePaddingTopButtom{
    vertical-align: top;
    padding-top: 10px;
    padding-bottom: 10px;
  }
.PrintButton {
    background-color: transparent;
    color: #b2b3b5;
    border: solid thin #28bd8b;
    width: 34px;
    height: 34px;
    display: block;
    background-image: url(/images/print_new.svg);
    background-position: 50% 60%;
    background-size: auto;
    background-repeat: no-repeat;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    border-radius: 3px;
}

.PrintButton:hover {
    background-image: url(/images/print_hover.svg);
    background-position: 50% 60%;
    background-size: auto;
    background-repeat: no-repeat;
    background-color: #43d7a5;
    border: solid thin #43d7a5;
}

.floatRight {
    float: right !important;
}

.GreyHeaderButton {
    height: 34px;
    color: #28bd8b;
    background-color: #fff;
    border: solid 1px #28bd8b;
    font-size: 14px;
    padding: 8px 23px;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    margin: 0px 0px;
}
.GreyHeaderButton.AI-blue {
    color: #0277bd;
    border: solid 1px #0277bd;
}


.GreyHeaderButton:disabled {
    background-color: #dddddd;
    border-color: #dddddd;
    cursor: default;
    color: #666666;
}
.GreyHeaderButton.GreyHeaderButtonDisabledForTooltip, .GreyHeaderButton.GreyHeaderButtonDisabledForTooltip:hover, .GreyHeaderButton.GreyHeaderButtonDisabledForTooltip:hover:enabled{
    border-color: #dddddd;
    color: #666666;
    background-color: rgb(235, 235, 228);
    cursor: default;
}

.GreyHeaderButton:hover:enabled {
    background-color: #43d7a5;
    border: solid 1px #43d7a5;
    color: #ffffff;
}
.GreyHeaderButton.AI-blue:hover:enabled {
    /* //TODO: REPLACE WITH LIGHTBLUE ELAD */
    background-color: #43d7a5;
    border: solid 1px #43d7a5;
}

.PageHead .Tools,
.PageHead .ToolsOposite {
    display: flex;
    margin: 0 8px;
}

.PageHead .Tools {
    flex-wrap: wrap;
}

.PageHead .ToolsOposite {
    margin-left: auto;
    flex-direction: row-reverse;
}

#IrregularPricesToolTip {
    padding-bottom: 8px;
}

.doc-details .PageHead .btn-group {
    vertical-align: top;
}

@media screen and (max-height: 768px) {
    .upload-invoices-popup .modal-header {
        padding: 8px;
    }

    .upload-invoices-popup .attachment-container-popup {
        min-height: auto !important;
    }

    .upload-invoices-popup .attachment-container-popup .Clear20:first-child {
        display: none;
    }
}

/*Modifiers popup*/

.modal.zindex.modifiers-popup + .modal-backdrop {
    z-index: 5399 !important;
}

.modifiers-popup__add {
    cursor: pointer;
    color: #28bd8b;
    padding: 1px 4px;
    border-bottom: 1px solid #28bd8b;
    display: inline-block;
}

.modifiers-popup__row {
    display: flex;
    margin: 0 12px 0 -4px;
    position: relative;
}

.modifiers-popup__delete {
    color: #424c5a;
    position: absolute;
    right: 2px;
    top: 14px;
    cursor: pointer;
}

.modifiers-popup__delete:hover {
    color: #ea5a5a;
}

.modifiers-popup__select {
    margin: 0 4px;
    width: 46%;
    background-color: white;
}

.item-details__collapse-expand {
    text-align: center;
    color: #3d1ae9;
    cursor: pointer;
    text-decoration: underline;
}

.dialog_fixed {
    position: fixed !important;
}

.item-details__combination-header,
.item-modifiergroup-details__modifier-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: solid 1px #5a6779;
    padding-bottom: 8px;
    margin-bottom: 9px;
}

.item-details__remove-combination {
    cursor: pointer;
    color: #ea5a5a;
    margin-left: 8px;
}

.item-details__combination-header .Head1,
.item-modifiergroup-details__modifier-header .Head1 {
    border-bottom: none;
    margin-bottom: 0;
}

.marketman-button.marketman-button--light.copy-link-icon,
.marketman-button.marketman-button--light.duplicate-item-icon {
    display: flex;
    padding: 0 0;
}

.copy-link-icon i,
.duplicate-item-icon i {
    display: block;
    margin: auto;
    width: 32px;
    height: 32px;
}

.copy-link-icon i {
    background: url("/images/link_clean_rest.svg") center / 100% no-repeat;
}

.copy-link-icon:hover i {
    background-image: url("/images/link_clean_hover.svg");
}

.duplicate-item-icon i {
    background: url("/images/Plus_clean_rest.svg") center / 100% no-repeat;
}

.duplicate-item-icon:hover i {
    background-image: url("/images/Plus_clean_hover.svg");
}

.inv-counts-datepicker {
    position: relative;
    top: -6px;
    margin-bottom: -8px;
}

.inv-counts-datepicker .md-datepicker-input.md-input {
    margin-bottom: 0;
}

#WasteReport .chart-control-section {
    display: flex;
    justify-content: space-between;
}

.uom-on-hand {
    font-size: 11px;
    font-style: italic;
    color: #b1b2b5;
}

.PlusMinusDiv .uom-on-hand {
    line-height: 20px;
}

.GridSimilarCellStyle .uom-on-hand {
    line-height: 20px;
}

.stock-count-cell {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.stock-count-calculator {
    width: 12px;
    margin: 0 4px;
}

.chat-widget-area {
    height: 54px;
    width: 54px;
    float: right;
    /*border-left: solid thin #efefef;*/
}

.chat-widget-button {
    height: 32px;
    width: 32px;
    margin: 11px 11px 11px 8px;
    cursor: pointer;
    background-image:url('/Images/green_q.svg');
    transition-duration: 0.4s;
    background-size:cover;
}

.chat-widget-button:hover{
    background-image:url('/Images/green_q_h.svg');
    transition-duration: 0.4s;
}



.chain-location-storages .MarketmanDropDown .MarketmanMultiselect ul {
    margin-top: 3px;
    height: 107px !important;
    top: -3px;
}

.top-charts__row {
    margin-bottom: 8px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 8px;
}

.top-charts__row,
.top-charts__row * {
    box-sizing: border-box;
}

.top-charts__chart {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.top-charts__chart-left,
.top-charts__chart-right {
    padding: 12px;
    border: 1px solid rgba(209, 210, 213, 0.5);
    border-bottom: none;
    text-align: center;
}

.top-charts__chart-left {
    border-radius: 2px 0 0 0;
}

.top-charts__chart-label {
    font-size: 16px;
    color: #a3a5ab;
    margin-bottom: 8px;
}

.top-charts__chart-value {
    font-weight: bold;
    font-size: 24px;
}

.top-charts__chart-right {
    border-radius: 0 2px 0 0;
}

.top-charts__chart-full {
    height: 82px;
    grid-column: 1 / -1;
    border: 1px solid rgba(209, 210, 213, 0.5);
    border-radius: 0 0 2px 2px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
}

.top-charts__chart-full .top-charts__left-text {
    text-align: left;
}

.top-charts__chart-full .top-charts__right-text {
    text-align: right;
}

.top-charts__full-width-text {
    text-align: center;
    grid-column: 1 / -1;
}

.top-charts__chart-reversed .top-charts__chart-left,
.top-charts__chart-reversed .top-charts__chart-right {
    border-top: none;
    border-bottom: 1px solid rgba(209, 210, 213, 0.5);
}

.actual-usage-color {
    color: #20976f !important;
}

.actual-usage-header {
    color: #20976f !important;
    background: #ecf6f2;
    border-bottom: 1px solid #20976f;
}

.actual-profit-color {
    color: #28bd8b !important;
}

.theoretical-usage-color {
    color: #783284 !important;
}

.theoretical-usage-header {
    color: #783284 !important;
    background: #f5eef6;
    border-bottom: 1px solid #783284;
}

.theoretical-profit-color {
    color: #ab47bc !important;
}

.variance-value {
    color: #0277bd !important;
    font-size: 20px;
    font-weight: bold;
}

.variance-header {
    color: #0277bd !important;
    background: #e9f0f4;
    border-bottom: 1px solid #0277bd;
}

.act-vs-theo-grid-header {
    color: #5c82a4 !important;
    background: #fbfbfb;
}

.act-vs-theo-bar-chart {
    height: 370px;
    margin-bottom: 8px;
    position: relative;
}

.act-vs-theo-bar-chart-area {
    height: 350px;
}

.act-vs-theo-bar-chart .chart-left-arrow {
    left: 20px;
}

.act-vs-theo-y-chart-title {
    font-size: 11px;
}

.act-vs-theo-bar-chart .chart-right-arrow,
.act-vs-theo-bar-chart .chart-left-arrow {
    top: 11px;
}

.variance-box {
    grid-column: 1 / -1;
    margin: 8px 0;
    grid-template-columns: repeat(3, 1fr);
}

.variance-box .top-charts__chart-full {
    grid-column: auto;
}

.variance-box .top-charts__chart-left,
.variance-box .top-charts__chart-right {
    border-top: 1px solid rgba(209, 210, 213, 0.5);
}

.header-template-div {
    height: calc(100% - 0.5px);
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu-prof-header {
    display: grid;
    grid-template-areas:
        "total items"
        "topBy items";
    grid-gap: 8px;
    grid-template-columns: 4fr minmax(178px, 1fr);
    grid-template-rows: 80px 1fr;
    margin: 8px 0;
}

.menu-prof-total {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-area: total;
}

.menu-prof-total .menu-prof-top-bar-chart-box {
    padding: 8px;
}

.menu-prof-total .menu-prof-top-bar-chart-box:not(:last-child) {
    border-right: none;
}

.menu-prof-toggle .menu-prof-radio-group {
    display: flex;
}

.menu-prof-toggle .menu-prof-radio-group md-radio-button:not(:last-child) {
    margin-right: 16px;
}

.menu-prof-toggle .menu-prof-radio-group md-radio-button {
    margin-bottom: 0;
}

.menu-prof-toggle .menu-prof-radio-group md-radio-button .md-label {
    margin-left: 16px;
}

.menu-prof-toggle .menu-prof-radio-group md-radio-button .md-container {
    width: 13px;
    height: 13px;
}

.menu-prof-toggle .menu-prof-radio-group md-radio-button .md-container .md-on,
.menu-prof-toggle .menu-prof-radio-group md-radio-button .md-container .md-off {
    width: 13px;
    height: 13px;
}

.menu-prof-top-bar {
    border: 1px solid rgba(209, 210, 213, 0.5);
    padding: 8px;
    grid-area: topBy;
}

.menu-prof-top-bar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px 0 13px;
}

.menu-prof-top-bar-title {
    font-size: 16px;
    font-weight: bold;
    color: #5a6779;
    text-transform: uppercase;
}

.menu-prof-top-bar-chart-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 8px;
}

.menu-prof-top-bar-chart-box {
    border: 1px solid rgba(209, 210, 213, 0.5);
    text-align: center;
    position: relative;
}

.menu-prof-top-bar-chart-box-label {
    color: #a3a5ab;
    font-size: 12px;
    line-height: 26px;
}

.menu-prof-top-bar-chart-box-value {
    font-size: 24px;
    font-weight: bold;
    line-height: 38px;
}

.menu-prof-sales-color {
    color: #20976f;
}

.menu-prof-profit-color {
    color: #0277bd;
}

.menu-prof-netCost-color {
    color: #23b1f7;
}

.menu-prof-top-bar-chart-box-top {
    border-bottom: 1px solid rgba(209, 210, 213, 0.5);
    padding: 8px;
}

.menu-prof-top-bar-chart-box-bottom {
    display: grid;
    grid-template-columns: 4fr 5fr;
}

.menu-prof-top-bar-chart-box-bottom-text {
    padding: 8px 8px 8px 22px;
}

.net-cost-chart-box {
    padding: 8px;
}

.net-cost-chart-box .menu-prof-top-bar-chart-box-value {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    margin-top: 7px;
}

.menu-prof-items-explanation {
    grid-area: items;
    display: grid;
    color: #5a6779;
}

.menu-prof-items-explanation-box {
    position: relative;
    text-align: center;
    padding: 24px 32px;
}

.menu-prof-items-explanation .icon-more {
    display: block;
    height: 20px;
    width: 20px;
    color: #23b1f7;
    position: absolute;
    bottom: 10px;
    right: 10px;
    cursor: pointer;
}

.menu-prof-items-explanation .icon-more img {
    width: 100%;
    height: 100%;
}

.menu-prof-items-explanation-box.unprofitable {
    border-top: 1px solid rgba(209, 210, 213, 0.5);
}

.menu-prof-bar-chart {
    margin-bottom: 8px;
}

.menu-prof-bar-chart-area {
    height: 350px;
}

.empty-state-message {
    padding: 40px 120px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.empty-state-message.empty-state-vertical {
    flex-direction: column;
}

.empty-state-message > div {
    margin: 0 16px;
}

.empty-state-text {
    font-weight: 300;
    font-size: 32px;
}

.empty-state-message.empty-state-vertical .empty-state-text {
    max-width: 480px;
    text-align: center;
}

.empty-state-image {
    width: 180px;
}

.empty-state-message.empty-state-vertical .empty-state-image {
    width: 320px;
    margin-bottom: 32px;
}

.empty-state-image img {
    width: 100%;
}

.act-vs-theo-report .grid-with-joined-headers .k-grid-header th.k-header,
.act-vs-theo-report
    .grid-with-joined-headers
    .k-grid-header
    th.k-header
    .k-link {
    color: #5c82a4 !important;
    background: #fbfbfb;
    text-transform: none;
    font-size: 13px;
}

.act-vs-theo-report
    .grid-with-joined-headers
    .k-header-column-menu:not([style="display: none;"])
    + .k-link {
    padding-right: 21px !important;
}

.item-details__wrapper.new-menu-item .item-details__tabContent,
.item-details__wrapper.new-sub-recipe-item .item-details__tabContent {
    height: calc(100vh - 233px);
}

.item-details__wrapper.new-menu-item.has-1-pos-row .item-details__tabContent {
    height: calc(100vh - 258px);
}

.item-details__wrapper.new-menu-item.has-2-pos-rows .item-details__tabContent {
    height: calc(100vh - 279px);
}

.new-inventory-item,
.new-menu-item,
.new-modifier-group,
.cogs-grid-item-popup {
    color: #5a6779;
}

.menu-item-recipe-header,
.production-item-recipe-header,
.commissary-sale-item-cost-header {
    display: flex;
    justify-content: space-between;
    margin: 22px 0 16px;
    align-items: center;
}

.menu-item-recipe-header-info,
.production-item-recipe-header-info,
.commissary-sale-item-cost-header-info {
    display: flex;
    margin: 0 -16px 26px;
}
.production-item-recipe-header-info {
    width: calc(100% + 16px);
    justify-content: space-between;
}
.production-item-assortments-input {
    width:400px;
    margin: 0 9px;
}
.production-item-uom-input {
    width:255px;
}
.production-item-header-right-side-wrapper {
    display:flex;
    margin-right: -16px;
    margin-left: 0px;
}

.menu-item-recipe-header-info .menu-item-cost-wrapper,
.production-item-recipe-header-info .production-item-cost-wrapper,
.commissary-sale-item-cost-header-info .commissary-sale-item-cost-wrapper {
    margin: 0 16px;
}

.menu-item-cost-title,
.production-item-cost-title,
.commissary-sale-item-cost-title {
    font-size: 11px;
    margin-bottom: 3px;
    color: #5c82a4;
}
.production-item-cost-title {
    direction:rtl;
}

.menu-item-cost-value,
.production-item-cost-value,
.commissary-sale-item-cost-value {
    color: #abbecf;
    font-size: 20px;
    font-weight: 300;
}
.menu-item-recipe-header-info .menu-item-cost-title,
.production-item-recipe-header-info .production-item-cost-title,
.commissary-sale-item-cost-header-info .commissary-sale-item-cost-title {
    font-size: 14px;
}
.menu-item-recipe-header-info .menu-item-cost-value,
.production-item-recipe-header-info .production-item-cost-value,
.commissary-sale-item-cost-header-info .commissary-sale-item-cost-value {
    font-size: 30px;
}
.menu-item-cost-value.has-value,
.production-item-cost-value.has-value,
.commissary-sale-item-cost-value.has-value {
    color: #23b1f7;
}

.menu-item-cost-value.has-value.exceed-limit,
.production-item-cost-value.has-value.exceed-limit,
.commissary-sale-item-cost-value.has-value.exceed-limit {
    color: #ea5a5a;
}

.item-details__input-with-button {
    display: flex;
    position: relative;
    bottom: 6px;
}

#inv-item-add-about-tab {
    position: relative !important;
    float: right;
    bottom: -4px;
    font-size: 12px;
    color: #5d666d;
    cursor: pointer;
}

#inv-item-add-about-tab:hover {
    color: #28bd8b;
}
.menu-item-recipe-header-food-cost,
.production-item-recipe-header-food-cost {
    margin-top: -13px;
}
.menu-item-recipe-header-food-cost .marketman-button,
.production-item-recipe-header-food-cost .marketman-button{
    position: relative;
    bottom: 8px;
}

.menu-item-recipe-header-food-cost
    .item-details__input-with-button
    .marketman-button,
.production-item-recipe-header-food-cost
    .item-details__input-with-button
    .marketman-button {
    bottom: -6px;
}

.menu-item-recipe-tab .popup-form__table,
.production-item-recipe-yield-tab .popup-form__table {
    grid-template-columns: 5fr 3fr repeat(3, 3fr) repeat(2, minmax(48px, auto));
    margin-top: -12px;
}

.popup-form__table.ai-results-table {
    display: block;
    margin-top: 12px;
}

.ai-results-table-header,
.ai-results-table .table-row {
    display: grid;
    grid-template-columns: 5fr 3fr 9fr repeat(2, minmax(60px, auto));
}

.menu-item-recipe-subitem-type {
    font-style: italic;
    color: #5c82a4;
}

.menu-item-recipe-tab .table-form-row,
.production-item-recipe-yield-tab .table-form-row {
    display: grid;
    grid-template-columns: 3fr repeat(2, 2fr);
    grid-column-gap: 6px;
    min-height: 0;
    min-width: 0;
}

.menu-item-recipe-footer-info,
.production-item-recipe-footer-info {
    display: flex;
    justify-content: space-between;
    gap: 5px;
}

.menu-item-recipe-footer-info .menu-item-cost-wrapper,
.production-item-recipe-footer-info .production-item-cost-wrapper {
    line-height: normal;
}

.menu-item-edit-item-link,
.production-item-edit-item-link {
    position: absolute;
    font-size: 11px;
    right: 12px;
    bottom: 10px;
    color: #28bd8b;
    text-decoration: underline;
    cursor: pointer;
}

.item-details__allergens .allergens-double-cell {
    grid-column: auto / span 2;
}

.combo-item-section {
    border-style: solid;
    border-color: gray;
    border-width: 1px;
    padding: 10px;
}
.menu-item-ingredient-row,
.production-item-ingredient-row {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-column-gap: 30px;
    margin-bottom: -14px;
}

.menu-item-allergens-tab .popup-form__table {
    grid-template-columns: 2fr 2fr 2fr 1fr;
}

.menu-item-allergens-tab .empty-state-message {
    grid-column: 1 / -1;
}

.menu-item-allergens-tab .empty-state-image img {
    height: 100px;
}

.menu-item-allergens-tab .empty-state-text {
    font-size: 18px;
    font-weight: 500;
    color: #5a6779;
}

.menu-item-allergens-tab,
.menu-item-procedure-tab,
.production-item-inventory-tab {
    padding: 12px 0;
}

.item-details__suggestive-ordering {
    padding: 20px 0;
}

.item-details__about {
    padding: 20px 0;
}

.menu-item-procedure-tab .table-form-section {
    margin: 12px 0 0;
    max-width: 850px;
}

.item-details__about .table-form-section {
    margin: 20px 0 0;
    max-width: 850px;
}

.menu-item-procedure-tab .table-form-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 12px;
}

.menu-item-procedure-tab-images {
    display: flex;
    margin: 6px -12px 12px;
}

.menu-item-procedure-tab-image {
    width: 153px;
    height: 104px;
    border-radius: 2px;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.16);
    margin: 0 12px;
    overflow: hidden;
    display: flex;
    position: relative;
}

.menu-item-procedure-tab-image img {
    max-width: 100%;
    max-height: 100%;
    margin: auto;
}

.menu-item-delete-image {
    position: absolute;
    right: 0;
    bottom: -40px;
    transition: 0.3s all;
    cursor: pointer;
    display: block;
    padding: 12px;
    font-size: 18px;
}

.item-image-left-icon {
    position: absolute;
    left: 0;
    bottom: -40px;
    transition: 0.3s all;
    cursor: pointer;
    display: block;
    padding: 12px;
    font-size: 18px;
}

.menu-item-procedure-tab-image:hover .menu-item-delete-image,
.menu-item-procedure-tab-image:hover .item-image-left-icon {
    bottom: 0;
}

.menu-item-procedure-tab .table-form-row .menu-item-cost-wrapper,
.production-item-procedure-tab .table-form-row .production-item-cost-wrapper {
    margin: 0 12px;
}

.menu-item-upload {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: rgba(90, 103, 121, 0.5);
    position: relative;
}

.menu-item-upload-icon {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(90, 103, 121, 0.5);
    border-radius: 50%;
    display: flex;
}

.menu-item-upload-icon i {
    display: block;
    margin: auto;
}

.menu-item-upload-text {
    font-size: 11px;
    line-height: 1.36;
    text-align: center;
    margin-top: 8px;
    max-width: 80%;
}

.recipe-tab-invalid .recipe-tab,
.recipe-yield-tab-invalid .recipe-yield-tab,
.purchase-options-tab-invalid .tabs-inventory-item-purchasing-and-inventory,
.procedure-tab-invalid .tabs-inventory-item-procedure,
.procedure-tab-invalid .procedure-tab,
.commissary-sale-tab-invalid .tabs-inventory-item-commissary-sale,
.about-tab-invalid .tabs-inventory-item-about,
.recipe-tab-invalid .combination-recipe-tab,
.inventory-tab-invalid .inventory-tab .integration-app-setting-locations-tab .integration-app-setting-general-tab {
    color: #ea5a5a !important;
}
.inventory-tab-alert .inventory-tab::after {
    content: '';
    width: 8px;
    height: 8px;
    position: absolute;
    transform:translate(-2px,0);
    border-radius: 50%;
    background-color: #ff9100;
  }
.dot-divider {
    font-size: 14px;
    padding: 2px;
}

.menu-item-locations-header {
    display: flex;
    justify-content: space-between;
    margin: 8px 0 -8px;
}

.menu-item-locations-filter {
    display: flex;
    flex-grow: 2;
    align-items: center;
}

.menu-item-locations-header-action {
    display: flex;
    flex-grow: 1;
    align-items: center;
    justify-content: flex-end;
}

.menu-item-locations-header marketman-form-field-checkbox {
    margin-bottom: -6px;
}

.menu-item-locations-header .search-field {
    flex-grow: 1;
    margin-right: 8px;
}

.menu-item-locations-tab .popup-form__table {
    grid-template-columns: 3fr 1fr repeat(5, 2fr);
}

.menu-item-locations-tab .popup-form__table.has-1-POSField {
    grid-template-columns: 3fr 1fr repeat(6, 2fr);
}

.menu-item-locations-tab .popup-form__table.has-2-POSFields {
    grid-template-columns: 3fr 1fr repeat(7, 2fr);
}

.menu-item-pos-settings-tab .popup-form__table {
    grid-template-columns: 3fr 2fr 2fr 1fr 2fr 0.5fr;
}

.automated-merging-side-modal-content .popup-form__table {
    grid-template-columns: 3fr 2fr 2fr 2fr 1fr 1fr 1fr 1fr 1fr 0.5fr;
}

.pos-settings__new-item-cell {
    height: 30px !important;
    padding-top: 26px !important;
}

.menu-item-pos-settings-tab .marketman-infobox {
    margin: 8px 0;
}

.automated-merging-side-modal-content .marketman-infobox {
    margin: 8px 0;
}

.menu-item-bulk-merge .popup-form__table {
    grid-template-columns: repeat(2, 2fr) repeat(3, 1fr);
}

.menu-item-bulk-merge .popup-form__table-cell {
    height: 15px;

}

.menu-item-bulk-merge .marketman-infobox {
    margin: 8px 0;
}

.menu-item-recipe-tab .table-form-row,
.production-item-recipe-tab .table-form-row {
    display: grid;
    grid-template-columns: 3fr 3fr 2fr 1fr auto;
    grid-column-gap: 6px;
    min-height: 0;
    min-width: 0;
}

@media screen and (max-width: 1365px) {
    .menu-item-ingredient-row,
    .production-item-ingredient-row {
        display: block;
    }

    .menu-item-recipe-footer-info,
    .production-item-recipe-footer-info {
        justify-content: flex-start;
    }

    .menu-item-recipe-footer-info .menu-item-cost-wrapper,
    .production-item-recipe-footer-info .production-item-cost-wrapper {
        margin-right: 52px;
    }
}

/* for make white  */
/*
.popup-item-details .marketman-infobox {
    background-color: white;
}
*/

.weekly-out-of-stock-text-color {
    color: #ea5a5a;
}

.weekly-text-indent {
    text-indent: 5px;
    font: 13px "Roboto";
}

.act-vs-theo-report-filter {
    margin: 4px 0;
}

.act-vs-theo-report .ActionButton.refresh-button,
.ActionButton.refresh-button {
    background-color: white;
    border-color: #ab47bc;
    color: #ab47bc;
}

.act-vs-theo-report .ActionButton.refresh-button:disabled,
.ActionButton.refresh-button:disabled {
    background-color: #dddddd !important;
    border-color: #dddddd !important;
    cursor: not-allowed !important;
    color: #666666 !important;
}

.act-vs-theo-report .ActionButton.refresh-button.accent-refresh,
.ActionButton.refresh-button.accent-refresh {
    color: white;
    background-color: #ab47bc;
}

.act-vs-theo-report .ActionButton.refresh-button.accent-refresh:hover,
.ActionButton.refresh-button.accent-refresh:hover {
    opacity: 0.8;
}

.variance-values-row {
    display: flex;
    justify-content: space-between;
    line-height: 28px;
}

.variance-values-row .top-charts__chart-label {
    margin: 0;
}

#restrictedOrderingThreshold {
    width: 80px;
    padding-left: 16px;
    height: 25px;
}
#restrictedOrderingThreshold.prefix2Chars {
    padding-left: 22px;
}
#restrictedOrderingThreshold.prefix3Chars {
    padding-left: 28px;
}
#restrictedOrderingThreshold.prefix4Chars {
    padding-left: 34px;
}

#restrictedOrderingThresholdCurrency {
    position: absolute;
    left: 5px;
    top: -3.5px;
    font-size: 13px;
}

.position-relative {
    position: relative;
}

.FormGroup input[disabled] + label {
    cursor: not-allowed;
}

.new-menu-item .menu-item-sku {
    position: relative;
    bottom: 8px;
}

.menu-item-modifiers-tab {
    padding: 8px 0;
}

.menu-item-modifiers-tab-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.menu-item-modifiers-tab-header .add-modifier-button {
    flex-shrink: 0;
}

.menu-item-modifiers-tab .popup-form__table {
    grid-template-columns: 2fr repeat(4, 1fr) minmax(48px, auto);
}

.menu-item-modifiers-tab
    .popup-form__table
    .popup-form__table-cell.popup-form__row-action-button {
    border-left: unset;
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu-item-allergens-tab .marketman-infobox {
    margin: 8px 0;
}

.background-color-white {
    background-color: #ffffff !important;
}

.new-menu-item .item-details__headFormSubmit,
.new-inventory-item .item-details__headFormSubmit,
.automated-merging-side-modal .item-details__headFormSubmit {
    margin-bottom: 0;
}

.new-menu-item .item-details__nameInput,
.new-inventory-item .item-details__nameInput
.automated-merging-side-modal .item-details__nameInput {
    position: relative;
    bottom: 4px;
}

@media screen and (max-width: 1364px) {
    .PageHead.incoming-order-header {
        flex-direction: column-reverse;
    }
    .title-content-box-container {
        padding-top: 12px;
    }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    .k-popup {
        max-height: 375px !important;
    }
}

.combination-names {
    overflow: hidden;
}

.menu-item-combination_item-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 16px;
    line-height: 26px;
}

.menu-item-combination_item-name i {
    font-size: 12px;
    padding: 0 4px;
}

.new-menu-item[data-popup="menu item combination"] .item-details__head-form {
    align-items: flex-start;
}

.item-details__wrapper.new-menu-item.has-2-pos-rows[data-popup="menu item combination"]
    .item-details__tabContent {
    height: calc(100vh - 281px);
}

.item-details__wrapper.new-menu-item.has-1-pos-row[data-popup="menu item combination"]
    .item-details__tabContent {
    height: calc(100vh - 260px);
}

.pos-code-row {
    width: calc(100% - 250px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    position: relative;
    bottom: 16px;
    margin: 4px 0;
    color: #010F19;
}

[data-popup="menu item combination"] .pos-code-row {
    bottom: 10px;
}

.item-details__wrapper.new-modifier-group .item-details__tabContent {
    height: calc(100vh - 278px);
}

.new-modifier-group .pos-code-row {
    bottom: 26px;
    margin-bottom: -16px;
    width: calc(100% - 240px);
}

.new-modifier-group.has-group-sku .item-details__tabContent,
.new-modifier-group.has-modifier-sku .item-details__tabContent {
    height: calc(100vh - 283px);
}

.new-modifier-group.has-modifier-sku.has-group-sku .item-details__tabContent {
    height: calc(100vh - 288px);
}

md-tabs md-tab-item span {
    user-select: none;
}

.print-frame {
    display: none;
}

.notify-container .notify-icon {
    color: #fff;
}
.internal-transfers-card .fullfill-button {
    height: 23px;
    background-color: #fff;
    border: 0;
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    letter-spacing: normal;
    text-align: center;
    color: #28bd8b;
}

.neworder-commissary-orders-grid {
    background-color: white;
    display: grid;
    grid-template-columns: repeat(3, 180px);
    grid-column-gap: 8px;
    margin-top: -8px;
}
.logbook-grid tr td:nth-child(2):hover img,
.logbook-inventory-grid tr td:nth-child(2):hover img {
    display: inline-block !important;
}
.internal-transfers-card .dashboard-card-tabs,
.transfers-tab-content {
    margin-top: 20px;
}

.transfers-row-grid .name-block {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 160px;
    padding-right: 20px;
}
.transfers-row-grid .fulfiller span{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

}

.transfers-row-grid:hover .fulfiller {
    color: #28bd8b;
}

.transfer-tabs {
    width: 100%;
}

.transfers-info {
    cursor: pointer;
}

.transfers-row-grid .action {
    text-align: right;
}
.transfers-row-grid .action button {
    display: inline-block;
}

.transfers-row-grid {
    display: grid;
    cursor: pointer;
    grid-template-columns: 3.5fr 1.9fr 4fr 1.7fr;
    width: 100%;
}

.notify-container:hover {
    background-color: #42d7a5;
}

.internal-transfers-card md-tabs-wrapper {
    border: 0px solid transparent;
}

.notify-block {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
}

.option-popover {
    z-index: 2000;
}

.transfers-row-grid .status-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.notify-container {
    border-radius: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    color: white;
    cursor: pointer;
    max-width: 74px;
    height: 32px;
    background-color: #42d7a5;
    transition-duration: 0.4s;
    margin-left: 8px;
    margin-right: 8px;
}

.notify-container .notify-block:hover {
    background-color: #2f3b43;
    transition-duration: 0.4s;
}

.has-notify .notify-icon {
    font-weight: lighter;
    margin-right: 10px;
}

.has-notify {
    border-radius: 180px;
    width: 74px;
    justify-content: space-between;
}

.auto-popover {
    width: 100%;
    height: 100%;
    position: relative;
    display: block;
}

.fixed-table-layout {
    width: 100%;
    table-layout: fixed;
}
.transfers-row-grid .status-icon {
    width: 14px;
    height: 14px;
    margin-right: 5px;
    margin-left: 5px;
}

.transfers-row-grid .status-header {
    padding-left: 30px;
}
.transfers-row-grid .status-icon img {
    width: 14px;
    height: 14px;
}

.text-overflow-ellipsis-nowrap {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.internal-transfers-card .dashboard-card-tabs,
.transfers-tab-content {
    margin-top: 20px;
}


.transfers-row-grid:hover .fulfiller {
    color: #28bd8b;
}

.transfer-tabs {
    width: 100%;
}

.transfers-info {
    cursor: pointer;
}

.transfers-row-grid .action {
    text-align: right;
}
.transfers-row-grid .action button {
    display: inline-block;
}

.transfers-row-grid {
    display: grid;
    cursor: pointer;
    grid-template-columns: 3.5fr 1.9fr 4fr 1.7fr;
    width: 100%;
}

.transfers-row-grid .status-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.transfers-row-grid .status-icon {
    width: 14px;
    height: 14px;
    margin-right: 5px;
    margin-left: 5px;
}

.transfers-row-grid .status-header {
    padding-left: 30px;
}
.transfers-row-grid .status-icon img {
    width: 14px;
    height: 14px;
}

.transfer-card-link {
    text-decoration: none;
}

.logbook-inventory-grid tr td:nth-child(2):hover,
.logbook-grid tr td:nth-child(2):hover {
    cursor: pointer;
}

.neworder-commissary-orders-grid {
    background-color: white;
    display: grid;
    grid-template-columns: repeat(3, 180px);
    grid-column-gap: 8px;
    margin-top: -8px;
}

.logbook-grid tr td:nth-child(2):hover img,
.logbook-inventory-grid tr td:nth-child(2):hover img {
    display: inline-block !important;
}

.accounting-card .dots:hover .dot {
    background-color: #28bd8b;
    transition-duration: 0.4s;
}

.accounting-card .dots .dot {
    width: 3px;
    height: 3px;
    background-color: #babec0;
    border-radius: 360px;
    transition-duration: 0.4s;
}

.accounting-card .dots {
    width: 10px;
    cursor: pointer;
    height: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    position: relative;
    top: -10px;
    right: -8px;
}

.accounting-card-weekly {
    width: 167px;
    height: 48px;
    padding: 0;
}

.small-menu-button {
    background-color: transparent;
    border: 0;
    font-size: 12px;
    color: #28bd8b;
    cursor: pointer;
    margin: 0;
    padding: 0;
    height: 35px;
}

.md-open-menu-container {
    border-radius: 11px;
    overflow: hidden;
    height: 35px;
}

.md-open-menu-container .accounting-card-weekly {
    height: unset;
    min-height: unset;
}

.tempty {
    text-align: center;
}

.split-item {
    color: #d1d2d5;
}

.action-button-border-left {
    border-left: 1px solid #ededed;
}

.merge-split-icon-size {
    height: 12px;
    width: 13px;
}

.display-flex {
    display: flex;
}

.set-as-recipe-checkbox {
    margin-top: -2.5px;
}

.set-as-recipe-checkbox-label {
    margin-top: 3px;
}

.margin-bottom-zero-important {
    margin-bottom: 0px !important;
}

.overflow-hidden-nowrap {
    white-space: nowrap;
    overflow: hidden;
}

.overflow-hidden {
    overflow: hidden;
}

.overflow-ellipsis {
    text-overflow: ellipsis;
}
.rtl-with-tooltip .card-info-label {
    flex-direction: row;
    width: 100%;
    text-align: right;
}

.rtl-with-tooltip .card-info-value {
    display: flex;
    flex-direction: row-reverse;
}

.notify-container .notify-icon {
    color: #fff;
}

.notify-container .notify-block {
    border-radius: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;

    color: white;
    cursor: pointer;
    max-width: 74px;
    height: 32px;
    background-color: #28bd8b;
    transition-duration: 0.4s;
}

.rtl-notify-button {
    flex-direction: row-reverse;
}

.notify-container .notify-block:hover {
    background-color: #42d7a5 !important;
    transition-duration: 0.4s;
}

.has-notify .notify-icon {
    font-weight: lighter;
    margin-right: 10px;
}

.has-notify {
    border-radius: 180px;
    min-width: 32px;
    padding: 0 16px;
    justify-content: space-between;
}

notify-drop-panel .container {
    color: #0f0f0f;
    position: fixed;
    border-right: 15px solid #fff;
    padding: 71px 10px 30px 16px;
    width: 451px;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.2);
    background-color: white;
    top: 50px;
    right: -500px;
    z-index: -1;
    opacity: 0;
    height: calc(100% - 190px);
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

notify-drop-panel .container-open::-webkit-scrollbar {
    width: 9px;
}

notify-drop-panel .container-open::-webkit-scrollbar-button {
    background-color: #fff;
    height: 70px;
}

.notify-opened-button {
    background-color: #00aa00;
}

notify-drop-panel .container-open::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: #e5e6e7;
}

notify-drop-panel .container-open {
    right: 10px;
    opacity: 1;
    top: 50px;
    overflow-x: hidden;
    z-index: 5000;
    overflow-y: auto;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

.long-block .SwitchUserActions {
    right: 82px;
}

.short-block .SwitchUserActions{
    right:40px;
}

.notify-container .content {
    position: relative;
    width: 100%;
}

.container-open .notify-heading {
    opacity: 1;
    transition-duration: 0.4s;
}

.notify-heading {
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    top: 50px;
    z-index: 100;
    margin-bottom: 16px;
    position: fixed;
    line-height: normal;
    opacity: 0;
    width: 435px;
    padding: 24px 12px 12px 12px;
    letter-spacing: normal;
    text-align: left;
    color: #010f19;
    background-color: #fff;
    border-bottom: 1px solid #e8e9ea;
    transition-duration: 0.4s;
}

.has-notify {
    transition-duration: 0.4s;
    background-color: #28bd8b !important;
}

.notify-opened .notify-block {
    background-color: #2f3b43 !important;
}

.has-notify:hover {
    background-color: #42d7a5 !important;
    transition-duration: 0.4s;
}

.notify-name .text {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.29;
    letter-spacing: normal;
    text-align: left;
    color: #2f3b43;
}

notify-drop-panel .container .row {
    min-height: 23px;
    margin-bottom: 10px;
    padding: 12px 8px 8px 12px;
}

notify-drop-panel .container .date {
    font-family: Roboto;
    font-size: 10px;
    margin-top: 4px;
    margin-left: 25px;
    color: #5d666d;
}

.notify-name .icon {
    margin-right: 11px;
}
.notify-name .icon img {
    width: 14px;
    height: 14px;
    margin: 3px 0 0 0;
}
.notify-name {
    display: flex;
    align-items: flex-start;
}

.notification-block .row {
    background-color: #fff;
    width: 100%;
    box-sizing: border-box;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
    border-radius: 8px;
}

.notification-block .row:hover {
    background-color: #f7f7f7;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

.notification-block .row:hover .delete-button {
    opacity: 1;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

.notification-block .row .delete-button {
    opacity: 0;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

.notification-block .row .actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 4px;
}

.notification-block .row .actions input[type="button"],
.notification-block .row .actions button {
    min-width: 55px;
    height: 23px;
    border-radius: 2px;
    background-color: #ffffff;
    font-family: Roboto;
    font-size: 11px;
    font-weight: normal;
    margin-left: 8px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    letter-spacing: normal;
    text-align: center;
    border: 0;
    color: #5d666d;
}

.notification-block .row .actions .delete-button {
    color: #ea5a5a;
}

.empty-state-container .empty-heading {
    font-size: 20px;
    font-weight: bold;
}

.empty-state-container {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    height: 192px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: center;
    color: #2f3b43;
    flex-direction: column;
}

.notify-container .notify-icon {
    color: #fff;
}

.notify-container .notify-block {
    border-radius: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    color: white;
    cursor: pointer;
    max-width: 74px;
    height: 32px;
    background-color: #28bd8b;
    transition-duration: 0.4s;
}

.notify-container .notify-block:hover {
    background-color: #42d7a5 !important;
    transition-duration: 0.4s;
}

.has-notify .notify-icon {
    font-weight: lighter;
    margin-right: 10px;
}

.has-notify {
    border-radius: 180px;
    min-width: 32px;
    padding: 0 16px;
    justify-content: space-between;
}

notify-drop-panel .container {
    color: #0f0f0f;
    position: fixed;
    border-right: 15px solid #fff;
    padding: 71px 10px 30px 16px;
    width: 451px;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.2);
    background-color: white;
    top: 50px;
    right: -500px;
    z-index: -1;
    opacity: 0;
    height: calc(100% - 190px);
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

notify-drop-panel .container-open::-webkit-scrollbar {
    width: 9px;
}

notify-drop-panel .container-open::-webkit-scrollbar-button {
    background-color: #fff;
    height: 70px;
}

.notify-opened-button {
    background-color: #00aa00;
}

notify-drop-panel .container-open::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: #e5e6e7;
}

.internal-transfers-card md-tabs-wrapper {
    border: 0px solid transparent;
}

.small-action-button-green {
    background-color: #fff;
    border: 0;
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: center;
    text-transform: capitalize;
    color: #28bd8b;
}

notify-drop-panel .container-open {
    right: 10px;
    opacity: 1;
    top: 50px;
    overflow-x: hidden;
    z-index: 5000;
    overflow-y: auto;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

.long-block .SwitchUserActions {
    right: 84px;
}
.notify-container .content {
    position: relative;
    width: 100%;
}

.container-open .notify-heading {
    opacity: 1;
    transition-duration: 0.4s;
}

.notify-heading {
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    top: 50px;
    z-index: 100;
    margin-bottom: 16px;
    position: fixed;
    line-height: normal;
    opacity: 0;
    width: 435px;
    padding: 24px 12px 12px 12px;
    letter-spacing: normal;
    text-align: left;
    color: #010f19;
    background-color: #fff;
    border-bottom: 1px solid #e8e9ea;
    transition-duration: 0.4s;
}
.rtl-with-tooltip .card-info-value {
    display: flex;
    flex-direction: row;
}

.has-notify {
    transition-duration: 0.4s;
    background-color: #28bd8b !important;
}

.notify-opened .notify-block {
    background-color: #2f3b43 !important;
}

.has-notify:hover {
    background-color: #42d7a5 !important;
    transition-duration: 0.4s;
}

.notify-name .text {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.29;
    letter-spacing: normal;
    text-align: left;
    color: #2f3b43;
}

notify-drop-panel .container .row {
    min-height: 23px;
    margin-bottom: 10px;
    padding: 12px 8px 8px 12px;
}

notify-drop-panel .container .date {
    font-family: Roboto;
    font-size: 10px;
    margin-top: 4px;
    margin-left: 30px;
    color: #5d666d;
}

.notify-name .icon {
    margin-right: 11px;
}

.notify-name {
    display: flex;
    align-items: center;
}

.notification-block .row {
    background-color: #fff;
    width: 100%;
    box-sizing: border-box;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
    border-radius: 8px;
}

.notification-block .row:hover {
    background-color: #f7f7f7;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

.notification-block .row:hover .delete-button {
    opacity: 1;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

.notification-block .row .delete-button {
    opacity: 0;
    transition-duration: 0.4s;
    -webkit-transition: 0.4s;
}

.notification-block .row .actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 4px;
}

.notification-block .row .actions input[type="button"],
.notification-block .row .actions button {
    min-width: 55px;
    height: 23px;
    border-radius: 2px;
    background-color: #ffffff;
    font-family: Roboto;
    font-size: 11px;
    font-weight: normal;
    margin-left: 8px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    letter-spacing: normal;
    text-align: center;
    border: 0;
    color: #5d666d;
}

.margin-left-8px {
    margin-left:8px !important;
}

.margin-right-8px {
    margin-right:8px !important;
}

.notification-block .row .actions .delete-button {
    color: #ea5a5a;
}

.empty-state-container .empty-heading {
    font-size: 20px;
    font-weight: bold;
}

.empty-state-container {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    height: 192px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: center;
    color: #2f3b43;
    flex-direction: column;
}

.drag-menu-button:hover {
    background-color: #fff !important;
    background-image: url("./../../../Images/reorder_green.svg");
}

.drag-menu-button i:before {
    background: none;
}

.drag-menu-button {
    border-radius: 2px;
    width: 25px;
    background-image: url("./../../../Images/reorder_white.svg");
    height: 25px;
    background-color: transparent;
    background-size: 18px auto;
    border: 0;
    padding: 0;
    line-height: normal;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 12px;
    display: flex;
    min-width: 20px;
    margin: 0;
    align-items: center;
    justify-content: center;
}
.md-open-menu-container.md-active {
    z-index: 10001;
}
md-menu-item > .md-button {
    display: flex;
    align-items: center;
    justify-content: center;
}
md-menu-item > .md-button span {
    font-size: 12px;
    color: #5a6779;
    letter-spacing: -0.36px;
}
md-menu-content {
    padding: 0 !important;
    text-align: left;
    height: 48px;
    border-radius: 4px;
}

.draggable-row:hover .grab-handle,
.grab-handle:hover {
    background-image: url("./../../../Images/reorder_green.svg");
}

.grab-handle {
    height: 15px;
    border-left: 1px solid #ededed;
    background-size: 20px auto;
    background-image: url("./../../../Images/reorder_gray.svg");
    background-repeat: no-repeat;
    background-position: center;
}

.as-sortable-dragging {
    transform: translateZ(0);
}
.as-sortable-dragging .popup-form__table-cell {
    border: 0;
}
.as-sortable-dragging .as-sortable-item {
    display: grid;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16);
    opacity: 0.75;
    background-color: #fafafa;
    border: 0;
    grid-template-columns: 5fr 3fr repeat(3, 3fr) repeat(2, minmax(60px, auto));
}

.recpie-and-cost-table .as-sortable-item-handle {
    width: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.drag-set:hover {
    color: #00aa00;
}

.draggable-row:hover .popup-form__table-cell {
    background-color: #fff;
}

.button-order {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row-reverse;
}

.active-drag-button {
    background-color: #fff;
    background-image: url("./../../../Images/reporder_red.svg");
}
.active-drag-button:hover {
    background-image: url("./../../../Images/reporder_red.svg");
}

.table-block {
    width: 100%;
}

.table1header .TableHeader1 {
    display: flex;
    align-items: center;
}

.table1last {
    height: 100%;
    display: flex;
    align-items: center;
}

.table1last .grab-handle {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.table1header {
    background-color: #e3ebf8 !important;
}

.table-block .TableRow1 .TableCell1 {
    height: auto;
    border-bottom: 0;
}
.table1header,
.table-block .TableRow1 {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr 0.4fr;
}
.table-block .TableRow1 {
    border-bottom: 1px solid rgb(229, 231, 236);
}

.CookbookItemPageGridColContainer .TableDisplay1 {
    display: block;
}

.TableHeader1:last-of-type {
    justify-content: flex-end;
}

.TableHeader1 .drag-set {
    left: -40px;
}

.coobookth2 {
    text-align: right;
    justify-content: flex-end;
    padding-right: 20px;
}

.drag-set {
    width: 30px !important;
    height: 23px;
    padding: 5px 6px 5px 6px;
    border-radius: 2px;
    background-color: #ffffff;
    font-size: 10px;
    line-height: 21px;
    border: 0;
    background-image: none;
    margin: 0 0 0 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #5c82a4;
}

.name-hidden {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: block;
    max-width: 250px;
}
.name-hidden.warning-sibling {
    max-width: 225px;
    vertical-align: middle;
}
.name-hidden.warning-sibling.recipe-ai-padding {
    display: inline-block;
    max-width: 205px;
}



.notify-rtl .container {
    right: auto;
    left: -500px;
}

.notify-rtl .container-open {
    left: 10px;
}

/* INVENTORY ITEM IMAGES - START */

/* Style the Image Used to Trigger the Modal */
.item-image {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}

.item-image:hover {
    opacity: 0.85;
}

/* The Modal (background) */
.item-image-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0, 0, 0); /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4);
}

#zoom {
    width: 100%;
    height: 100%;
    transform-origin: 0px 0px;
    transform: scale(1) translate(0px, 0px);
    cursor: grab;
}

div#zoom > img {
    width: 100%;
    height: auto;
}

/* Modal Content (Image) */
.item-image-modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
.item-image-modal-caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    height: 20px;
}
/* Add Animation - Zoom in the Modal */
.item-image-modal-content,
.item-image-modal-caption {
    animation-name: zoom;
    animation-duration: 0.6s;
}

@keyframes zoom {
    from {
        transform: scale(0);
    }
    to {
        transform: scale(1);
    }
}

/* The Close Button */
.item-image-modal-close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
    z-index: 1;
}

.item-image-modal-close:hover,
.item-image-modal-close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

.last-count-value-card .highcharts-tooltip strong{
    text-overflow: ellipsis;
    max-width:150px;
    width:100%;
    overflow: hidden;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px) {
    .item-image-modal-content {
        width: 100%;
    }
}


.action-button-small:disabled {
    color: #5d666d;
}

/* INVENTORY ITEM IMAGES - END*/
.last-count-value-card-chart .highcharts-tooltip > span {
    text-overflow: ellipsis;
    overflow: hidden;
    height:auto;
    width:140px;
    white-space:normal !important;
}

.user-name-short{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    position: relative;
}

.user-button-shorted{
    max-width:300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.big-popover{
    word-break: break-all;
}

.action-button-small {
    min-width: 55px;
    height: 20px;
    border-radius: 2px;
    background-color: #f1f1f2;
    font-family: Roboto;
    font-size: 11px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    letter-spacing: normal;
    text-align: center;
    border: 0;
    color: #28bd8b;
}



.wastage-button-long {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 160px;
    display: block;
}

.wrap-reverse{
    flex-wrap: wrap-reverse;
}



.partial-receiving-extended-uom-cell {
    font-size: 11px;
    font-style: italic;
    color: #b1b2b5;
}

.receivable-checkbox {
    border-color: #28bd8b !important;
}

.checkbox-asterisk {
    position: relative;
    top: -1px;
    left: 2px;
    font-weight: bold;
}

#partialReceivingReportDiv .marketman-md-select .md-select-value {
    font-size: 13px;
    color: #5a6779;
}

.stock-changes-empty-image img{
    width:150px;
}

.stock-changes-empty {
    display:flex;
    align-items:center;
    flex-direction: column;
    justify-content: center;
    padding:24px 0 ;
}

.tables-empty-text {
    max-width: 600px;
    font-family: Roboto;
    font-size: 18px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.44;
    letter-spacing: -0.54px;
    opacity: 0.5;
    color: #5a6779;
    text-align: center;
    margin-top:8px;
}

.table-empty {
    display:block;
}

.image-with-text-container {
    padding: 20px 40px 40px;
    max-width: 600px;
    margin: auto;
    display: flex;
    align-items: center;
}

.image-with-text-container-image {
    width: 150px;
    margin: 30px 30px 30px 0;
    float: left;
}

.image-with-text-container-text {
    display: inline;
}

.image-with-text-under-container {
    padding: 20px 40px 40px;
    max-width: 600px;
    margin: auto;
    text-align: center;
    align-items: center;
}

.image-with-text-under-container-image {
    width: 150px;
}

.image-with-text-under-container-text {
    display: inline;
    color: #2f3b43;
}

.buyerinfo-short{
    max-width:150px;
    white-space: nowrap;
    display:block;
    text-overflow: ellipsis;
    overflow: hidden;
}

.buyer-details-pos-icon {
    height: 16px;
    width: 16px;
    margin-right: 3px;
    margin-left: 3px;
}

.disable-sales-sync-img {
    content:url("/images/disabled-pos.svg");
}
.enable-sales-sync-img {
    content:url("/images/active-pos-gray.svg");
}
.delete-pos-img {
    content:url("/images/delete-pos-action.svg");
}
.undelete-pos-img {
    content:url("/images/deleted-pos.svg");
}

.disable-sales-sync-img:hover {
    content:url("/images/disabled-pos-hover.svg");
}
.enable-sales-sync-img:hover {
    content:url("/images/active-pos-gray-hover.svg");
}
.delete-pos-img:hover {
    content:url("/images/delete-pos-action-hover.svg");
}
.undelete-pos-img:hover {
    content:url("/images/deleted-pos-hover.svg");
}
.popover-raised-add-newMenuItem{
    margin-top:-50px;
}

.popover-raised-add-newMenuItem{
    margin-top:-50px;
}

.ref-button-container{
    position: relative;
}


/* referal button fix */
@media (max-width:1025px){
    .referral-new-text{
        display:none;
    }
    .referral-new-widget{
        padding:0;
        width:32px;
        margin:0 auto;
        height:32px;
    }

    .referral-new-text,
    .referral-new-widget:hover .referral-new-close{
        display:none;
    }
    .referral-new-widget .image{
        margin:0 auto;
        width:19px;
        height:14px;
    }

    .ref-button-container{
        height:100%;
    }
}

.spanbuyerInfo{
    display:block;
}

.recipe-denied-grid-multiple .k-grid .blockRecipeLine:hover,
.recipe-denied-grid .clickable-rows .k-grid tr:hover{
    cursor: auto;
}

.recipe-denied-grid-multiple .grid-header-checkbox,
.recipe-denied-grid-multiple md-checkbox,
.recipe-denied-grid .grid-header-checkbox,
.recipe-denied-grid md-checkbox{
    display:none;
}

.FormGroup .md-select-value {
    min-width: unset;
    max-width: 200px;
}

.FormGroup md-input-container {
    padding:0;
}

.exclude-category-sales-display {
    font-family: Roboto;
    width: 230px;
    text-align: center;
}

.opt-in-bar-directive {
    display: block;
    height:0px;
    transition: height 200ms;
    overflow: hidden;
    position: relative;
    z-index: 10;
}

.opt-in-bar-directive.opt-in-bar-opened {
    height: 48px;
}

.opt-in-bar {
    width:100%;
    height: 100%;
    position:relative;
    box-sizing: border-box;

    /* padding: 8px; */
    padding: 0 24px;
    background-color: #FFDD6B;
    border-radius: 2px;
}

.opt-in-bar-container {
    width:100%;
    height: 100%;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    display: inline-flex;
}

.opt-in-bar-main {
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    display:flex;
    align-items: center;
    white-space: nowrap;
}

.opt-in-bar-title {
    margin-inline-end: 48px;

    color: #5A6369;
    font-size: 14px;
    font-family: Roboto;
    font-weight: 400;
    line-height: 18px;
    word-wrap: break-word;
    white-space: nowrap;
}

.opt-in-bar-btn {
    border-color: #157E5B;
    background-color: #157E5B;
}

.opt-in-bar-btn:hover {
    color: #157E5B;
    background-color: white;
    border-color: white;
}

.opt-in-bar-url {
    color: #5A6369;
    /* text-decoration: none; */
}

.opt-in-bar-close-btn {
    cursor:pointer;
    content: url('/images/optInBar_x.svg');
}

.opt-in-bar-close-btn:hover {
    border-radius:50%;
    background-color: rgba(255, 255, 255, 0.50)
}

.payments-promo-bar-directive {
    display: block;
    height:0px;
    transition: height 200ms;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 999;
}

.payments-promo-bar-directive.opened {
    height: 48px;
}

.payments-promo-bar {
    width:100%;
    height: 100%;
    position:relative;
    box-sizing: border-box;
    padding: 0 24px;
    background-color: #FFDD6B;
    border-radius: 2px;
}

.payments-promo-bar-container {
    width:100%;
    height: 100%;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    display: inline-flex;
}

.payments-promo-bar-main {
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    display:flex;
    align-items: center;
    white-space: nowrap;
}

.payments-promo-bar-title {
    margin-inline-end: 48px;

    color: #5A6369;
    font-size: 14px;
    font-family: Roboto;
    font-weight: 400;
    line-height: 18px;
    word-wrap: break-word;
    white-space: nowrap;
}

.payments-promo-bar-btn {
    border-color: #157E5B;
    background-color: #157E5B;
}

.payments-promo-bar-btn:hover {
    color: #157E5B;
    background-color: white;
    border-color: white;
}

.payments-promo-bar-url {
    color: #5A6369;
}

.payments-promo-bar-close-btn {
    cursor:pointer;
    content: url('/images/optInBar_x.svg');
}

.payments-promo-bar-close-btn:hover {
    border-radius:50%;
    background-color: rgba(255, 255, 255, 0.50)
}

/* ***************************************************COGS GRID*************************************************** */
.cogs-grid-radio-wrapper {
    display:flex;
    align-items: center;
    padding-left:11px;
}
.cogs-grid-radio-wrapper md-radio-button .md-container {
    height:12px;
    width:12px;
}
.cogs-grid-radio-wrapper md-radio-button .md-container .md-on,
.cogs-grid-radio-wrapper md-radio-button .md-container .md-off {
    height:12px;
    width:12px;
    border-width: 1px;
}

.cogs-grid-radio-btn {
    margin: 0 5px;
}
.cogs-grid-radio-btn .md-label{
    margin-left: 18px;
    color: #010f19;
}
.radio-as-chekcbox-wrapper {
    display:flex;
    align-items: center;
    padding-left:11px;
}
.radio-as-chekcbox-wrapper input[type="radio"].radio-as-checkbox{
    appearance: none;
    border: solid 1px rgba(209, 210, 213, 0.5);
    border-radius: 2px;
    width: 10px;
    height: 10px;
    content: none;
    outline: none;
    margin: 0;
    position: relative;
    cursor:pointer;
 }

 .radio-as-chekcbox-wrapper input[type="radio"].radio-as-checkbox:checked {
   appearance: none;
   outline: none;
   padding: 0;
   content: none;
   border: none;
   background-color: #28BD8B;
 }

 .radio-as-chekcbox-wrapper input[type="radio"].radio-as-checkbox:checked::before{
   position: absolute;
   transform: translate(1px, -3px);
   content: url('/images/checkbox_as_radio.svg');
   width:8px;
 }
 .radio-as-chekcbox-wrapper .radio-as-checkbox-label {
    padding-left: 6px;
 }

/* //TODO (DANIEL): cogs-wip clean up */
/* ***************************************************COGS GRID*************************************************** */
.cogs-grid-page-container {
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
    overflow: hidden;
}
.PageContent.cogs-grid-page {
    background-color: #f8f8f8;
    border: transparent;
    height: 100% !important;
    overflow: hidden;
    padding-top: 71px;
}
.cogs-grid-page .PageHead {
    min-height:unset;
    padding-bottom:unset;
    margin:unset;
    padding-right: 10px;
}
.cogs-grid-page .PageHead .ToolsOposite {
    padding-right: 10px;
    flex: 0 0;
    flex-basis: 100px;
}
.cogs-grid-header {
    padding-bottom: 16px;
    /* padding-left: 15.8px; */
    padding-left: 12px;
    font-size:14px;

    min-width: 0;
    /* flex: 0 1;
    flex-basis: 400px; */

}
.cogs-grid-breadcrumb {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 130px;
}
.cogs-grid-breadcrumb-overall {
    height:100%;
    display:flex;
    align-items:center;
}
.cogs-grid-breadcrumb-icon {
    height: 9px;
    width: 8px;
    background: url(/images/COGS_home.svg) no-repeat center center;
    background-size: contain;
    cursor:pointer;
}
.cogs-grid-breadcrumb-txt {
    font-weight:bold;
    color: #0277bd;
}
.cogs-grid-breadcrumb-clickable {
    /* color: #010f19; */
    /* color: rgba(1,15,25,0.5); */
    font-weight:normal;
    cursor:pointer;
}
.cogs-grid-breadcrumb-clickable:hover {
    color: #28bd8b;
    /* font-weight:bold; */
}
.cogs-grid-breadcrumb-seperator {
    padding: 0 8px;
}
.cogs-grid-subheader {
    display:flex;
    /* color:#010f19; */
    /* color: rgba(1,15,25,0.5); */
    color: #010f19;
    font-size:10px;
    padding-top: 5px;
}
.cogs-grid-empty-state-container {
    position:relative;
    flex-grow: 1;
}
.cogs-grid-empty-state {
    position: absolute;
    left: calc(50% - 108px);
    top: calc(50% - 55px);
    transform: translate(-50%,-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.cogs-grid-empty-state-img {
    width:144px;
    height:144px;
    margin-bottom:20px;
    background:url('/images/COGS_empty_state.svg') no-repeat top left;
    background-size: contain;
}
.cogs-grid-empty-state-text {
    margin-bottom:16px;
    color:#8794a6;
    font-size:22px;
    text-align: center;
}
.cogs-grid-flex {
    display:flex;
    justify-content: space-between;
    height: 100%;
}
.cogs-grid-main-section {
    flex-grow: 1;
    border-left: 0.5px solid rgba(186,190,192,0.3);
    display: flex;
    flex-direction: column;
}
.cogs-grid-menu {
    min-width: 128px;
    padding-right:8px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
}
.cogs-grid-table-container {
    position: relative;
    flex-grow: 1;
    overflow-y: scroll;
    margin-right: -15px;
}
.cogs-grid-time-period-row-header {
    padding-top: 12px;
}
.cogs-time-period-graph {
    background-color:white;
    /* height:142px; */
    height:134px;
    /* padding: 25px 16px 25px 16px; */
    padding: 20px 20px 20px 20px;
    box-sizing: border-box;
}
.cogs-grid-time-period-graph-placeholder {
    height:134px;
}







.cogs-grid-table {
    table-layout: fixed;
    overflow:hidden;
    z-index:1;
    /* padding: 23px; */
    border-spacing: 0px 0px;
    /* transform-origin: top left; */
    height: 1px; /* will be ignored. this solves height=100% issue within cells */
}
.cogs-grid-table thead {
    position:fixed;
    z-index:9;
    background-color: #f8f8f8;
}
.cogs-grid-table .thead-seperator {
    height: 170px;
}
.cogs-grid-table td, .cogs-grid-table th {
    position:relative;
    width: 139px;
    min-width: 139px;
    max-width: 139px;
    /* width: 162px;
    min-width: 162px;
    max-width: 162px; */
    border-right: 0.5px solid rgba(186,190,192,0.3);
    padding-left: 12px;
    padding-right: 12px;
}

.cogs-grid-table td:last-child, .cogs-grid-table th:last-child{
    border-right: none;
}
.cogs-grid-table .cogs-grid-column-hover {
    background-color: rgba(255,255,255,0.75);
}
.cogs-grid-table-col-header {
    text-align:center;
    background-color:white;
    padding:8px;
    font-weight:500;
}
/* .cogs-grid-table th:hover .cogs-grid-table-col-header {
    color: #28bd8b;
    font-weight:bold;
} */



.cogs-grid-table th .cogs-grid-column-remover {
    top: 12px;
}

.cogs-grid-table .cogs-grid-table-row-header {
    height:12px;
    color:#010f19;
    font-size:10px;
    font-weight: 500;
    text-align: left;
}
.cogs-grid-table .cogs-grid-table-row-header.level-2-row {
    color: #010f19;
}
.cogs-grid-table .cogs-grid-table-row-header-text,
.cogs-grid-table .cogs-grid-table-level-2-row-header-text{
    /* position:absolute;
    top: 0;
    width: max-content; */
    padding-bottom: 4px;
    display:inline-block;
    white-space: nowrap;
}


.cogs-grid-table  cogs-grid-cell-directive .exapnd-row-buttons-container {
    height: 0;
    width: calc(100% + 2px);
    left: -1px;
    /* display: none; */
    position: absolute;
    transition: height 0.5s;
    overflow: hidden;
    background-color: inherit;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 8%);
    /* border: solid 1px rgba(112, 112, 112, 0.1); */
    border-top: 0;
}
.cogs-grid-table  cogs-grid-cell-directive .cogs-grid-cell-valid-count {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 5px;
    height: 5px;
    border-radius: 25px;
    background-color: #28bd8b;
}
.cogs-grid-table  cogs-grid-cell-directive .cogs-grid-cell-valid-count.invalid-count {
    background-color: #ff9100;
}
.cogs-grid-table  .flex-center  {
    display: flex;
    align-items: center;
}
.cogs-grid-table  cogs-grid-cell-directive .cogs-grid-cell-container {
    width:100%;
    border-color: #F8F8F8;
    transition: background-color 0.5s;
}
.cogs-grid-table  cogs-grid-cell-directive .cogs-grid-cell-container:not(.cogs-grid-blank-cell):hover {
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);
}

.cogs-grid-table  cogs-grid-cell-directive:hover .cogs-grid-cell-container:not(.cogs-grid-blank-cell) {
    background-color: white !important;
    border-radius: 4px 4px 0px 0px;
}
/* .cogs-grid-table .level-2-row-container cogs-grid-cell-directive:hover .cogs-grid-cell-container > .cogs-grid-cell-content{
    background-color: white;
} */
/* .cogs-grid-table .level-2-row-container cogs-grid-cell-directive .cogs-grid-cell-container .cogs-grid-cell-row-big:hover {
    color: #28bd8b;
    cursor:pointer;
} */

.cogs-grid-table  cogs-grid-cell-directive cogs-grid-cell-child-directive .child-container.cogs-grid-cell-content {
    background-color: rgba(255, 255, 255, 0.85);
}
.cogs-grid-table  cogs-grid-cell-directive:hover cogs-grid-cell-child-directive .child-container.cogs-grid-cell-content {
    background-color: rgba(255, 255, 255, 0.60);
}
/* .cogs-grid-table  cogs-grid-cell-directive:hover .cogs-grid-cell-child-container {
    background-color: rgb(231, 232, 233);
} */
.cogs-grid-table  cogs-grid-cell-directive cogs-grid-cell-child-directive {
    position: relative;
    /* height: 66px; */
    height: 64px;
    display: block;
}
.cogs-grid-table  cogs-grid-cell-directive cogs-grid-cell-child-directive .child-container.cogs-grid-cell-content.child-level-hover {
    /* background-color: #fff; */
    box-shadow: 0 1px 6px 0 rgb(0 0 0 / 16%);
    border-bottom: 1px;
    position: absolute;
    z-index: 1;
    width: 100%;
    box-sizing: border-box;
}
.cogs-grid-table cogs-grid-cell-directive cogs-grid-cell-child-directive .child-container.cogs-grid-cell-content.child-level-hover:hover {
    background-color: rgba(255, 255, 255, 0.85);
}
.cogs-grid-table  cogs-grid-cell-directive:hover .exapnd-row-buttons-container {
    height: 16px;
    border: solid 0 1px 1px 1px rgba(112, 112, 112, 0.1);
    /* display: block; */
}

.cogs-grid-table .expand-row-buttons {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    padding: 0 12px;
    font-size: 8px;
    height: 100%;
}
.cogs-grid-table .expand-row-buttons .more-button,
.cogs-grid-table .expand-row-buttons .less-button {
    font-size: 8px;
    color: #babec0;
}
.cogs-grid-table .expand-row-buttons .more-button.active,
.cogs-grid-table .expand-row-buttons .less-button.active {
    color: #28bd8b;
}
.cogs-grid-table .exapnd-row-buttons-container button {
    background-color: unset;
    border: 0;
    margin: 0;
    padding: 0;
}
/* .multi-period-single-location .exapnd-row-buttons-container,
.single-period-multi-location .exapnd-row-buttons-container {
    display:none;
} */


.cogs-grid-table .cogs-grid-table-row-container {
    position:relative;
}
.cogs-grid-table .cogs-grid-table-row-container.grid-row-hover {
    z-index: 10;
}
.cogs-grid-table .cogs-grid-table-row-container.grid-row-hover::after {
    content: "";
    /* background-color: rgba(255,255,255,0.85); */
    background-color: #fff;
    position:absolute;
    /* height: 103px; */
    bottom:10px;
    /* top: -15px; */
    top: -12px;
    /* left: -22px;
    width:calc(100% + 44px); */
    left: 0px;
    width:100%;
    /* border-radius: 6px; */
    /* box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); */
    opacity: 0.65;
    z-index: -1;
}
.cogs-grid-table .cogs-grid-table-row-container .cogs-grid-row-remover,
.cogs-grid-table .cogs-grid-column-remover {
    position:absolute;
    top: 1px;
    right: 12px;
    height: 12px;
    content: url(/images/cogs_grid_trash-grey.svg);
}
.cogs-grid-page .delete-time-period-container {
    height:34px;
    width:34px;
    position:relative;
    margin: 0 2px;
}
.cogs-grid-page .delete-time-period {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    margin: 0;
    padding: 0;
    border:0;
    /* height:16px;
    width:16px; */
    cursor:pointer;
    background:transparent;
    /* background-image: url(/images/cogs_grid_trash.svg); */
    color: #d1d2d5;
    line-height: 34px;
    font-size:16px;
}
.cogs-grid-page .delete-time-period:hover {
    color:#28bd8b;
}

.cogs-grid-page .cogs-pickers-warning-container {
    color:#ea5a5a;
    line-height: 34px;
    display: flex;
    align-items: center;
}
.cogs-grid-page .cogs-pickers-warning-text {
    font-size:10px
}
.cogs-grid-page .cogs-pickers-menu .FormGroup input[type="daterange"].cogs-pickers-error-color {
    color:#ea5a5a;
}
.cogs-grid-page .warning-icon {
    padding:0 8px;
    width:16px;
    height:16px;
    content: url('/images/alert-icon.svg');
}
.cogs-grid-page .marketman-form-field-checkbox input[type="checkbox"]:after {
    padding-top:1px;
}
.cogs-grid-page .cogs-pickers-show-only-selected-btn {
    margin:16px 0;
    background-color:transparent;
    /* height: 32.7px; */
    height: 33px;
    /* margin: 16px 10.7px 43.3px 0; */
    padding: 8px 13px 8px 13px;
    border-radius: 16.4px;
    border: solid 1px #28BD8B;
    color: #28BD8B;
    font-size:14px;
}
.cogs-grid-page .cogs-pickers-show-only-selected-btn[disabled] {
    opacity:0.6;
}
.cogs-grid-page .cogs-pickers-show-only-selected-btn.isActive {
    background-color: #28BD8B;
    color:white;
}
.cogs-grid-table .cogs-grid-table-row-container.grid-row-hover .cogs-grid-row-remover,
.cogs-grid-table .cogs-grid-column-hover .cogs-grid-column-remover {
    content: url(/images/cogs_grid_trash.svg);
    cursor:pointer;
}
/* .cogs-grid-table .cogs-grid-table-row-container .cogs-grid-table-row-header-text:hover, */
.cogs-grid-table .cogs-grid-table-row-container.grid-row-hover .cogs-grid-table-row-header-text,
.cogs-grid-table .cogs-grid-table-row-container.grid-row-hover .cogs-grid-table-level-2-row-header-text,
.cogs-grid-table th.cogs-grid-column-hover .cogs-grid-table-row-header-text:not(.not-clickable) {
    cursor:pointer;
    color: #28bd8b;
    font-weight:bold;
}

.cogs-grid-table .grid-row-hover .cogs-grid-cell-container {
    background-color:#fff;
}







.cogs-grid-table-cell {
    vertical-align: top;
    /* padding: 0px 0px 16px 0px; */

    position: relative;
}
td.cogs-grid-table-cell {
    padding-bottom:16px;
    /* padding: 0px 0px 16px 0px; */

}
/* .cogs-grid-table-cell:first-child  {
    padding-left: 0px;
}
.cogs-grid-table-cell:last-child {
    padding-right: 0px;
} */

.cogs-grid-table .cogs-grid-column-hover .cogs-time-period-graph,
.cogs-grid-table .grid-row-hover .cogs-grid-cell-container {
    border: solid 1px rgba(112, 112, 112, 0.1);
}

.cogs-grid-cell-container {
    border-radius: 4px;
    /* border: solid 1px rgba(112, 112, 112, 0.1); */

    border: solid 1px transparent;
    font-size:10px;
    color: #010f19;
    background-color: #fff;
    position: relative;
}
.cogs-grid-cell-content {
    min-height:32px;
    padding: 12px;
    transition: background-color 0.3s linear, box-shadow 0.3s linear;
}
.cogs-grid-cell-content.child-container {
    padding: 10px 12px;
}
.cogs-grid-table .cogs-grid-cell-container {
    border: solid 1px transparent;
    height: 100%;
}
/* .cogs-grid-table .cogs-grid-cell-container.cogs-hover {

} */
.cogs-grid-table .cogs-grid-cell-container.cogs-hover:hover {
    border: solid 1px rgba(112, 112, 112, 0.1);
}
.cogs-grid-table .cogs-grid-table-row-container:not(.level-2-row-container) .cogs-grid-cell-container.cogs-hover .cogs-grid-cell-row-big:hover {
    cursor: pointer;
    color: #28bd8b !important;
}
/* .single-period-multi-location .cogs-grid-cell-content .direction-container{
    display: flex;
    justify-content: space-between;
} */
.cogs-grid-cell-header {
    color: #010f19;
    /* opacity: 0.5; */
    font-size: 9px;
    padding-bottom: 3px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.cogs-grid-cell-header-text:hover {
    cursor: pointer;
    color: #28bd8b;
}
.cogs-grid-table .cogs-grid-table-row-container .cogs-grid-cell-row-big {
    /* font-size: 16px; */
    font-size: 14px;
    font-weight: 500;
    color: #010f19;
}

.cogs-grid-table .cogs-grid-table-row-container .cogs-grid-cell-row {
    display: flex;
    justify-content: space-between;

}
.cogs-grid-table .cogs-grid-table-row-container .cogs-grid-cell-text {
    color: #babec0;

}
.cogs-grid-table .cogs-grid-table-row-container .child-container .cogs-grid-cell-text {
    color: #010f19;
}

.cogs-grid-table .cogs-grid-table-row-container .child-container .cogs-grid-missing-items-text{
    /* height:46px; */
    height:44px;
}

.cogs-grid-table .cogs-grid-table-row-container .cogs-grid-cell-chart {
    /* height: 62px; */
    height:80px;
    /* WIP */
    overflow: hidden;

    width: 80px;
    margin: 0 auto;
}
.cogs-grid-table .cogs-grid-table-row-container .cogs-grid-cell-chart highchart {
    display: block;
    width: 100%;
    height:100%;
}
.cogs-grid-table .cogs-grid-time-period-placeholder {
    height: 100%;
    background-color: rgba(242, 242, 242, 0.5);
    /* background-color: #f2f2f2;
    opacity: 0.5; */
}
.cogs-grid-table .cogs-grid-blank-cell {
    background-color: rgba(242, 242, 242, 0.5);
}












/* COGS GRID FILTERS */
.cogs-menu-search-container {
    height:56px;
}
/* .cogs-filters-category {

} */

.cogs-filters-text-container {
    padding:4px 0 4px 6px;
    position:relative;
}
/* .cogs-filters-indent .cogs-filters-indent:first-child .cogs-filters-text-container {
    padding-top:0;
} */
.cogs-filters-indent .cogs-filters-indent .cogs-filters-text-container {
    padding:3px 0 3px 6px;
}
/* .cogs-filters-indent .cogs-filters-indent:last-child .cogs-filters-text-container {
    padding-bottom:4px;
} */
.cogs-filters-toggle-button-container {
    height:100%;
    position:absolute;
    top:0;
    left:0;
    transform:translateX(-100%);
    display:flex;
    align-items:center;
}
.cogs-clickable-icon-before::before {
    content: '';
    background-image: url('/images/COGS_chevron_right.svg');
    background-repeat: no-repeat;
    background-size: 13px 13px;
    background-position: center center;
    display: inline-block;
    vertical-align: text-bottom;
    height: 17px;
    width: 13px;
    padding: 0 8px 0 0;
}
.cogs-grid-time-period-row-header.cogs-grid-column-hover .cogs-clickable-icon-before::before,
.grid-row-hover .cogs-clickable-icon-before::before {
    background-image: url('/images/COGS_chevron_right_green.svg');
}
.cogs-filters-toggle-button {
    width:13px;
    height:13px;
    border:0;
    margin:0;
    padding:0;
    background: url('/images/COGS_menu_expand.svg') no-repeat center;
}
.cogs-filters-toggle-button:hover {
    background-image: url('/images/COGS_menu_expand_hover.svg');
}
.cogs-filters-toggle-button.expanded {
    background-image: url('/images/COGS_menu_collapse.svg');
}
.cogs-filters-toggle-button.expanded:hover {
    background-image: url('/images/COGS_menu_collapse_hover.svg');
}
.cogs-filters-text {
    font-size:10px;
    color:#010f19;
}
.cogs-filters-text-all-categories {
    /* color:#010f19;
    font-weight:bold; */
    color: #0277bd;
}
.cogs-filters-text:hover {
    cursor:pointer;
    color: #28bd8b;
    /* font-weight:bold; */
}

.cogs-filters-text.expanded {
    color: #0277bd;
}
.cogs-filters-text.active {
    color: #0277bd;
    font-weight:bold;
}
.cogs-filters-indent {
    /* padding-left:8px; */
    padding-left:14px;
}
/* .cogs-filters-dot {
    position:relative;
}
.cogs-filters-dot::before {
    position: absolute;
    content: '';
    width: 3px;
    height: 3px;
    border-radius:25px;
    opacity: 0.5;
    background-color: #babec0;
    top: 13px;
    left: 0;
} */
.cogs-filters-horizontal-seperator {
    width: 78px;
    height: 0.5px;
    margin: 8px 40px 9px 0;
    opacity: 0.5;
    background-color: #babec0;
}
/* .cogs-filter-vertical-seperator {
    position:relative;
}
.cogs-filter-vertical-seperator::before {
    position: absolute;
    content: '';
    width: 0.5px;
    opacity: 0.5;
    background-color: #babec0;
    height: calc(100% - 13px);
    left: 1px;
} */
.item-green:hover{
    color: #28bd8b;
    cursor: pointer;
}

.suggestive-ordering-select-width {
    width: 178px;
}

.suggestive-ordering-input-width {
    width: 178px;
}

.suggestive-ordering-day-buffers-width {
    width: 178px;
}

.dp-tab-row {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

.dp-tab-day-row-height {
    height: 65px;
    max-height: 80px;
}

.dp-row-spacing {
    margin-bottom: 5px;
}

.dp-tab-day-label {
    width: 150px;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 24px;
}

.dp-tab-day-buffer {
    width: 125px;
}

.dp-tab-day-buffer-wide {
    width: 250px;
}

#dp-tab-locations-search {
    margin-top: auto;
    margin-bottom: auto;
    margin-right: auto;
    margin-left: 0;
    width: 263px;
    background-image: url(/images/search_grey.svg);
    background-size: 14px;
    background-repeat: no-repeat;
    background-position: 95% center;
    min-width: 100px;
    text-indent: 11px !important;
    border: thin solid #d1d2d5 !important;
    color: #5a6779 !important;
}

@media (max-width: 1480px) {
    .dp-tab-day-buffer-wide {
        width: 150px;
    }

    #dp-tab-locations-search {
        width: 150px;
    }

    .dp-tab-day-label {
        width: 120px;
    }
}

.dp-tab-day-toggle {
    margin-right: 58px;
    margin-top: 7px;
}

.dp-day-input-margins {
    margin-top: 8.5px;
    margin-bottom: auto;
}

.dp-tab--card-border {
    border: solid 1px rgba(209, 210, 213, 0.5);
}

.dp-hyphen {
    border-bottom: 1.5px solid #d1d2d5;
    margin-top: auto;
    margin-bottom: auto;
    margin-right: auto;
    margin-left: 0;
    width: 25px;
}

.dp-day-buffer-row-separator {
    border-top: 1px solid #e8e9ea;
    margin-left: 24px;
    margin-right: 24px;
}

#dp-tab-locations-grid-div .k-grid .k-grid-header .k-header{
    background-color: white;
}

#dp-tab-locations-grid-div .k-grid .k-grid-header .grid-header-checkbox{
    margin-left: 3px;
}

#dp-tab-locations-grid-div .k-grid .k-grid-header .k-link{
    text-transform: lowercase;
}

#dp-tab-locations-grid-div .k-grid .k-grid-header .k-link::first-letter{
    text-transform: uppercase;
}
.dp-location-sync-empty-state-container{
    margin-left: 48px;
    margin-right: 48px;
    position: relative;
    top: 20%;
    display: flex;
    align-items: center;
    flex-direction: column;
}
.dp-location-sync-empty-state-text{
    font-size: 24px;
    text-align: center;
    margin-top: 24px;
}
.dp-locations-sync-empty-state-button{
    margin-top: 16px;
}
.dp-locations-grid-section {
    height: 462px !important;
    max-width: 525px !important;
    margin-bottom: auto !important;
    overflow-y: hidden;
}


#dp-tab-empty-state-img {
    width: 20%;
    margin-top: 5%;
}

.text-align-center {
    text-align: center;
}

#dp-tab-locations-grid-div {
    margin-left: 5px;
    margin-right: 7px;
}
.dp-prediction-row{
    padding: 0 15px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    line-height: 58px;
    height: 58px;
}
.dp-prediction-title-row{
    font-weight: bold;
    height: 15px;
    line-height: 15px;
    margin-bottom: 15px;
}
.dp-prediction-label-column{
    width:25%;
}
.dp-prediction-switch-column{
    width:17%;
}
.dp-prediction-forcast-column{
    width: 30%;
    line-height: 12px;
}
.dp-prediction-actual-column{
    width: 25%;

    display: flex;
    align-items: center;
    justify-content: center;
}
.dp-prediction-table-container{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 11px;
}
.dp-prediction-hyphen{
    width: 25px;
    height: 1px;
    border-bottom: 1.5px solid #d1d2d5;
}
.dp-prediction-save-button{
        align-self: center;
}
.do_predictioin_tools{
    justify-content: space-between;
    max-width: 700px;
    width: 100%;
    display: flex;
    margin: 0 8px;
}
.dp-prediction-row .marketman-form-field-input .form-field-prefix{
    top: 12px
}
.dp_flex{
    display: flex;
}
.dp_FormGroup_NoLeft{
    padding: 0px 8px 8px 0px !important;
}
.dp_minWidth200px{
    min-width: 200px;
}
.cogs-grid-page .cogs-pickers-menu-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}
.cogs-grid-page .cogs-pickers-menu-tab-buttons {
    padding-top:9px;
}

.cogs-grid-page md-sidenav.cogs-pickers-menu md-backdrop.md-sidenav-backdrop {
    z-index: 90;
}
.cogs-grid-page md-sidenav.cogs-pickers-menu  {
    z-index: 91;
    max-width: 500px;
    width: 500px;
    border-radius: 10px 0 0 0;
}

.cogs-grid-page .cogs-pickers-menu-tab {
    /* padding: 12px; */
    padding: 24px;
    flex-grow: 1;
    overflow: hidden;
    background-color: #fafafa;
}

.cogs-grid-page .cogs-pickers-menu-container md-tabs md-tabs-wrapper {
    border:0;
}
.cogs-grid-page .cogs-pickers-menu-locations-tab {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.cogs-grid-page .cogs-grid-info-box-container {
    margin-bottom:23px
}

.cogs-grid-page .cogs-pickers-menu .cogs-pickers-scrollable,
.cogs-grid-page .cogs-grid-menu,
.cogs-grid-table-container {
    overflow-y: scroll;
}
.cogs-grid-page .cogs-pickers-scrollable::-webkit-scrollbar,
.cogs-grid-page .cogs-grid-menu::-webkit-scrollbar,
.cogs-grid-table-container::-webkit-scrollbar {
    width: 5px;
}
.cogs-grid-page .cogs-pickers-scrollable::-webkit-scrollbar-thumb,
.cogs-grid-page .cogs-grid-menu::-webkit-scrollbar-thumb,
.cogs-grid-table-container::-webkit-scrollbar-thumb {
    background-color: rgba(169, 169, 169, 0.5);
}
.cogs-grid-page .cogs-pickers-scrollable::-webkit-scrollbar-track,
.cogs-grid-page .cogs-grid-menu::-webkit-scrollbar-track,
.cogs-grid-table-container::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0px;
}


.cogs-grid-page .cogs-pickers-menu .cogs-pickers-search-input {
    width:100%;
    background: url('/images/COGS_search_icon.svg') no-repeat center right 10px;
    background-color:transparent;

}
.cogs-grid-page .cogs-pickers-menu input[type="daterange"] {
    background-color:transparent;
}
.cogs-grid-page .cogs-pickers-menu .cogs-pickers-checkbox {
    height: 47px;
    line-height: 47px;
    border-bottom: 1px solid rgba(209, 210, 213, 0.5);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cogs-grid-page .cogs-pickers-menu .cogs-pickers-checkbox .marketman-form-field {
    background-color:transparent;
}
.cogs-grid-page .cogs-pickers-menu .cogs-pickers-checkbox .marketman-form-field label span{
    padding-left: 6px;
}
.cogs-grid-page .GreyHeaderButton {
    background: transparent;
}
.cogs-grid-page .action-fab {
    /* height: 55px; */
    height: 34px;
    width:34px;
    padding: 0px;
    font-weight: 600;
    top: 70px;
    right: 0px;
    bottom: auto;
    left: auto;
    z-index: 89;
    border-radius: 4px 0 0 4px;
    position: fixed;
    box-sizing: content-box;
}
.cogs-grid-page .action-fab:hover {
    width:36px;
}
.cogs-grid-page .action-fab-icon {
    top: 50%;
    transform: translate(50%,-50%);
    position: absolute;
    right: 50%;
}
.cogs-grid-page .cogs-grid-sidenav {
    overflow:hidden !important;
}
.cogs-grid-page .cogs-pickers-time-period-container {
    display: flex;
    /* justify-content: space-between; */
    padding-bottom:16px;
}
.cogs-grid-page .cogs-pickers-time-period-picker-placeholder {
    border:1px dashed rgba(209, 210, 213, 0.75);
    border-radius: 2px;
    height: 34px;
    width: 100%;
    color: #28BD8B;
    font-size: 17px;
    background-color:transparent;
}
.cogs-grid-page .cogs-pickers-time-period-container .calender-input-icon{
    right: 11px;
}
.cogs-grid-page .cogs-pickers-time-period-section-title {
    color:#010f19;
    font-size:12px;
    font-weight: bold;
}
.cogs-grid-page .cogs-pickers-time-period-section{
    padding: 16px 0 32px 0;
}
.cogs-grid-page .cogs-pickers-time-period-setting-btn-row {
    display:flex;
}
.cogs-grid-page .cogs-pickers-time-period-setting-btn-row:not(:last-child) {
    margin-bottom: 8px;
}
.cogs-grid-page .cogs-pickers-time-period-setting-btn-row .cogs-pickers-time-period-setting-btn {
    width: 153px;
    height: 33px;
    padding: 8px 5px 8px 5px;
    border: solid 1px #28BD8B;
    color: #28BD8B;
    background-color:transparent;
    border-radius: 25px;
}
.cogs-grid-page .cogs-pickers-time-period-setting-btn-row .cogs-pickers-time-period-setting-btn.isPresetActive {
    color: white;
    background-color: #28BD8B;
}
.cogs-grid-page .cogs-pickers-time-period-setting-btn-row .marketman-settings-link {
    margin:0px 8px;
    border-radius:25px;
    height:33px;
    width:33px;
}
.cogs-grid-page .cogs-pickers-time-period-container .FormGroup {
    position: relative;
    width:200px
}
/* .cogs-grid-page .cogs-pickers-time-period-container .FormGroup input {
    width:160px
} */
.cogs-grid-page .cogs-pickers-load-data-container {
    min-height:66px;
    display: flex;
    align-items: center;
    justify-content: center;
    position:relative;
}
.cogs-grid-page .cogs-pickers-load-data-container .cogs-pickers-load-btn-error-text {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 110px;
    font-size: 11px;
    padding: 11px;
    border-radius: 4px;
    overflow-wrap: break-word;
    color: #ff9100;
}
.cogs-pickers-menu-tab-buttons.locations-tab-invalid .locations-tab::after,
.cogs-pickers-menu-tab-buttons.date-range-tab-invalid .date-range-tab::after {
    content: '';
    width: 8px;
    height: 8px;
    position: absolute;
    transform:translate(-2px,0);
    border-radius: 50%;
    background-color: #ff9100;
  }
.cogs-grid-tooltip {
    font-family: "Roboto";
    display:flex;
    flex-direction: column;
    gap: 3px;
    color:#010f19;
    padding: 4px 0;
}
.cogs-grid-tooltip .cogs-grid-tooltip-row {
    font-size:11px;
    display:flex;
    justify-content: space-between;
    gap: 5px;
}
.cogs-menu-search-container md-autocomplete {
    height:34px;
    border: 0.5px solid rgba(186,190,192,0.3);
    background: url(/images/COGS_search_icon.svg) no-repeat top calc(50% - 1px) left 10px;
    background-color: transparent;
    background-size: 11px;
    min-width: unset;
}
.cogs-menu-search-container md-autocomplete md-autocomplete-wrap {
    height: 34px;
}
.cogs-menu-search-container md-autocomplete input {
    height:100%;
    font-size: 12px;
    color: #010f19;
    padding-left: 30px;
    padding-right: 0px;
}
.cogs-menu-search-container .md-whiteframe-1dp,
.cogs-menu-search-container .md-whiteframe-z1 {
    box-shadow: none;
}
.popup-item-details .cogs-grid-item-popup .item-details__tabContent {
    background: unset;
}

@media (min-width: 1366px) and (max-width: 1919px) {
    .cogs-grid-header {
        font-size: 14px;
    }
    .cogs-grid-subheader {
        font-size:10px;
    }
    .cogs-grid-page .cogs-filters-text {
        font-size:12px;
    }
    .cogs-grid-menu {
        padding-right:16px;
    }
    .cogs-grid-table td.cogs-grid-table-cell, .cogs-grid-table th.cogs-grid-table-cell {
        min-width:160px;
        max-width:160px;
        width:160px;
    }
    .cogs-grid-table .cogs-time-period-graph, .cogs-grid-table .cogs-grid-time-period-graph-placeholder {
        height: 142px;
    }
    .cogs-grid-table .cogs-grid-table-row-header {
        font-size:12px;
    }
    .cogs-grid-table .cogs-grid-table-row-container .cogs-grid-cell-row-big {
        font-size:16px;
    }
    .cogs-grid-table .cogs-grid-cell-container {
        font-size:10px;
    }
    .cogs-grid-table  cogs-grid-cell-directive cogs-grid-cell-child-directive {
        height:66px;
    }
    /* .cogs-grid-table .cogs-grid-cell-container.cogs-grid-blank-cell {
        height: 67px;
    } */
    .cogs-grid-table .cogs-grid-table-row-container .child-container .cogs-grid-missing-items-text {
        height: 46px;
    }

    /* .cogs-grid-table .cogs-grid-table-row-container.grid-row-hover::after {
        top:-12px
        height: 103px;
        height:116px;
    } */
    .cogs-filters-text-container {
        padding: 6px 0 6px 6px;
    }
    .cogs-grid-table .thead-seperator {
        height: 170px;
    }
    .cogs-grid-header {
        padding-left: 12px;
    }
    .cogs-grid-table td, .cogs-grid-table th {
        padding-left: 12px;
        padding-right: 12px;
    }
    .cogs-menu-search-container {
        height:56px;
    }
    .cogs-grid-menu {
        min-width: 216px;
        padding-right:16px;
    }
    .cogs-grid-breadcrumb {
        max-width: 180px;
    }
}

@media (min-width: 1920px) {
    .cogs-grid-header {
        font-size: 16px;
    }
    .cogs-grid-breadcrumb-icon {
        height: 13px;
        width: 12px;
    }
    .cogs-grid-subheader {
        font-size:12px;
    }
    .cogs-grid-page .cogs-filters-text {
        font-size:14px;
    }
    .cogs-grid-menu {
        padding-right:16px;
    }
    .cogs-grid-table td.cogs-grid-table-cell, .cogs-grid-table th.cogs-grid-table-cell {
        min-width:252px;
        max-width:252px;
        width:252px;
        padding-bottom: 24px;
    }
    .cogs-grid-table .cogs-time-period-graph, .cogs-grid-table .cogs-grid-time-period-graph-placeholder {
        height: 142px;
    }
    .cogs-grid-table .cogs-grid-table-row-header {
        font-size:14px;
    }
    .cogs-grid-table .cogs-grid-table-row-container .cogs-grid-cell-row-big {
        font-size:20px;
    }
    .cogs-grid-table .cogs-grid-cell-container {
        font-size:14px;
    }
    .cogs-grid-table  cogs-grid-cell-directive cogs-grid-cell-child-directive {
        height:75px;
    }
    .cogs-grid-table .cogs-grid-cell-container.cogs-grid-blank-cell {
        height: 67px;
    }
    .cogs-grid-table .cogs-grid-table-row-container .child-container .cogs-grid-missing-items-text {
        height: 55px;
    }

    .cogs-grid-table .cogs-grid-table-row-container.grid-row-hover::after {
        /* height:120px; */
        top: -15px;
    }
    .cogs-filters-text-container {
        padding: 8px 0 8px 6px;
    }
    .cogs-filters-indent .cogs-filters-indent .cogs-filters-text-container {
        padding:6px 0 6px 6px;
    }
    /* .cogs-filters-indent .cogs-filters-indent:last-child .cogs-filters-text-container {
        padding-bottom:8px;
    } */
    .cogs-grid-table .thead-seperator {
        /* height: 195px; */
        height: 200px;
    }
    .cogs-grid-header {
        padding-left: 16px;
    }
    .cogs-grid-table td, .cogs-grid-table th {
        padding-left: 16px;
        padding-right: 16px;
        width:252px;
        min-width:252px;
        max-width:252px;
    }
    .cogs-menu-search-container {
        height:62px;
    }
    .cogs-grid-empty-state-img {
        height: 180px;
        width: 180px;
        margin-bottom:24px;
    }
    .cogs-grid-empty-state-text {
        font-size:24px;
    }
    .cogs-grid-table th.cogs-grid-table-row-header:hover::after {
        height: 800px;
    }
    .cogs-grid-table .cogs-grid-table-row-container .cogs-grid-row-remover,
    .cogs-grid-table .cogs-grid-column-remover {
        right: 17px;
    }
    .cogs-grid-menu {
        min-width: 216px;
        padding-right:16px;
    }
    .cogs-grid-breadcrumb {
        max-width: 250px;
    }
}

.sort-items-margin-top {
    margin-top: -44px;
}

.spend-by-product-card-arrow {
    width: 5.1px;
    height: 2.6px;
    color: #2f3b43;
}

.hiding-env .hide-when-in-env {
    display: none;
}
.hiding-env .hide-borders-when-in-env {
    border: unset;
}
.hiding-env .hide-padding-when-in-env {
    padding: unset;
}
.advanced-item-definitions-row-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.advanced-item-definitions-row-grid .advanced-item-definitions-cell:first-child {
    margin-left: 0;
}

.advanced-item-definitions-row-grid .advanced-item-definitions-cell:visible:last-child {
    margin-right: 0;
}

.advanced-item-definitions-cell {
    margin: 0 5px;
}

.advanced-item-definitions-cell .marketman-button {
    margin-top: 6px;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}

.item-ordering-limitations-section {
    margin-top: 32px;
}

.cart-item-quantity {
    position: relative;
}

.max-quantity-indication {
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    text-align: center;
    color: #ea5a5a;
    font-size: 12px;
    font-weight: bold;
}

.place-orders-special-delivery {
    color: #0277bd;
    font-size: 12px;
    cursor: pointer;
}

.place-orders-special-delivery-icon {
    position: relative;
    bottom: -4px;
}

.place-orders-storage-type img {
    width: 16px;
    position: relative;
    bottom: -4px;
}

.FormGroup #chkisShowUploadInvoicesPopup + label {
    white-space: normal;
    height: auto;
}

.modal-body-content .ordering-radio-group span {
    color: #838383;
}

.ordering-radio-group .md-off,
.ordering-radio-group .md-on {
    height: 16px;
    width: 16px;
}

.supplier-ordering-radio-group {
    margin-top: 20px;
    margin-left: 8px;
    display: flex;
    justify-content: space-evenly;
    flex-direction: column;
    position: relative;
    bottom: 3.5px;
}

.supplier-ordering-radio-button {
    transform: scale(0.73);
    left: -11px;
}

.ordering-radio-group md-radio-button .md-label {
    margin-left: 20px;
}

.buyer-details-ordering-radio-group {
    display: flex;
    gap: 8px;
}

.buyer-details-ordering-radio-group md-radio-button {
    margin-bottom: 8px;
}

md-input-container .bottom-border-only-when-disabled.md-input[disabled] {
    border: unset;
    border-bottom: 1px solid #d1d2d5;
    cursor: not-allowed;
    height: 30px;
}

.width-222 {
    width: 222px;
}

.width-191 {
    width: 191px;
}

.make-a-payment-prepare, .make-a-payment-checkout {
    display: grid;
    color: #5A6369;
    grid-template-columns: repeat(2, 50%);
}

.payments-system-popup .modal-dialog {
    width: 500px;
}

.payments-system-popup .marketman-title,
.payments-system-popup .marketman-small-title {
    text-transform: none;
}

.make-a-payment-prepare > .input-field {
    padding-top: 6px;
    padding-bottom: 4px;
    background-color: white;
    border-bottom: 1px solid #D9E3E3;
}

.make-a-payment-prepare .input-field,
.make-a-payment-prepare .text-label,
.make-a-payment-prepare .input-label,
.make-a-payment-checkout .text-label {
    border-bottom: 1px solid #D9E3E3;
}

.make-a-payment-prepare .text-label,
.make-a-payment-prepare .input-label,
.make-a-payment-checkout .text-label {
    font-size: 16px;
}

.make-a-payment-prepare .text-label,
.make-a-payment-checkout .text-label {
    padding-bottom: 16px;
    padding-top: 15px;
}

.make-a-payment-prepare .input-label {
    padding-top: 21px;
    padding-bottom: 16px;
}

.make-a-payment-prepare > .no-border {
    border: none;
    padding-bottom: 0;
}

.make-a-payment-prepare > .payment-note {
    grid-column: 1/-1;
}

.payments-system-popup .green-popup .modal-body {
    height: 450px;
}

.make-a-payment-checkout .total-payment {
    color: #00529E;
    border-bottom-color: #00529E;
}

.payments-system-popup .payments-system-popup-loader {
    display: flex;
    height: 200px;
}

.payments-system-popup .payments-system-popup-spinner {
    width: 120px;
    height: 120px;
    margin: auto;
}

.cogs-icon-wrapper:hover .help-icon {
    display: inline-block !important;
}

.ocr-processing-image {
    justify-self: center;
}

.modal-body-content .ocr-processing-text {
    font-size: 16px;
    text-align: center;
    font-weight: 400;
    line-height: 24px;
    font-family: Roboto;
    font-style: normal;
    margin-top: 24px;
}

.ocr-progress-bar-text {
    color: #AB47BC;
    text-align: center;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    justify-self: left;
    margin-bottom: 8px;
}

.ocr-progress-bar {
    width: 100%;
    background-color: #D9E3E3;
    border-radius: 8px 8px 8px 8px;
}

.ocr-progress-bar-filler {
    width: 0%;
    height: 6px;
    background-color: #AB47BC;
    border-radius: 8px 8px 8px 8px;
    transition: width 0.5s ease-in-out;
}

.real-time-ocr-loading-popup .green-popup .modal-header
.real-time-ocr-completed-popup .green-popup .modal-header {
    min-height: auto;
}

.modal-body-content .ocr-processing-complete-header {
    justify-self: center;
    text-align: center;
    margin-top: 40px;
    margin-bottom: 16px;

    span {
        font-family: Roboto;
        font-size: 24px !important;
        font-style: normal;
        font-weight: 600;
        line-height: 24px !important;
    }
}

.modal-body-content .ocr-processing-complete-text {
    justify-self: center;
    margin-bottom: 16px;
    text-align: center;

    span {

        font-family: Roboto;
        font-size: 16px !important;
        font-style: normal;
        font-weight: 400;
        line-height: 24px !important;
    }
}

.ocr-process-results-additional-info {
    margin-top: 8px;
    text-align: left;
}

.real-time-ocr-completed-popup .modal-footer {
    background-color: #F2F5F5;
}

.ocr-process-results-table {
    display: flex;
    padding-bottom: 16px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    color: #5A6369;
    font-family: Roboto;
}

.ocr-process-results-table-row {
    display: flex;
    background-color: white;
    border-radius: 4px;
    align-self: stretch;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 2px;
}

.ocr-process-results-table-cell {
    display: flex;
    padding: 16px 40px 16px 16px;
    flex-direction: column;
    align-items: flex-start;
}

.ocr-process-results-table-cell>.ocr-process-results-table-cell-header {
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
}

.ocr-process-results-additional-info {
    color: #27333B;
    font-family: Roboto;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
}

.collapsed-left {
    transform: translateX(-100%);
}

.collapsed-right {
    transform: translateX(100%);
}

.doc-details .action-fab {
    height: 55px;
    padding: 10px 40px;
    font-weight: 600;
    top: 25%;
    right: -50px;
    bottom: auto;
    left: auto;
    z-index: 999;
    border-radius: 40px;
    position: fixed;
}
.doc-details .action-fab:hover {
    right: -45px;
}
.doc-details .action-fab-icon {
    margin-top: 20px;
    position: absolute;
    right: 60px;
    left: unset;
}
.doc-details-expanded {
    width:80%
}

/* Ensure styles only apply inside the .doc-details section */
.doc-details {

    /* Image Section */
    .pagination-container {
        margin-bottom: 10px;
        display: flex;
        gap: 5px;
        align-items: center;
        font-size: 16px;
    }

    .page-button {
        border: none;
        padding: 5px 10px;
        cursor: pointer;
        background: none;
        font-weight: normal;
    }

    .page-button-active {
        background: #ddd;
        font-weight: bold;
    }

    .doc-details-images-nav-arrow {
        background: none;
        border: none;
        font-size: 20px;
        cursor: pointer;
    }

    .doc-details-image-container {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }

    .doc-details-image-wrapper {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: flex-start;
    }

    .doc-details-zoomable-image {
        width: 100%;
        height: 100%;
        object-fit: fill;
        transition: transform 0.2s ease-out;
        cursor: grab;
    }

    .expand-icon {
        position: absolute;
        top: 12px;
        right: 12px;
        font-size: 18px;
        color: gray;
        border-radius: 50%;
        padding: 8px;
        cursor: pointer;
        transition: background 0.2s, transform 0.2s;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
    }

    .expand-icon:hover {
        background: rgba(0, 0, 0, 0.8);
        transform: scale(1.1);
    }

    .action-fab.action-fab-left{
        right: unset;
        left: -50px;
    }

    .action-fab.action-fab-left:hover{
        left: -45px;
    }

}

.suppliers-matching-table-container {
    overflow-y: auto;
}

.suppliers-matching-table-header,
.suppliers-matching-table-row {
    display: grid;
    grid-template-columns: 3fr 3fr 1fr;
    padding: 8px 0;
}

.suppliers-matching-table-header > *,
.suppliers-matching-table-row > * {
   overflow: hidden;
}

.suppliers-matching-table-header {
    color: #010F19;
    font-family: Roboto;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
}

.suppliers-matching-table-row {
    color: #5A6369;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    align-items: center;
    border-bottom: 1px solid #D9E3E3;
}

.suppliers-matching-table-remove-match {
    justify-self: center;
    min-width: 20px;
}

.supplier-matching-header {
    color: #27333B;
    font-family: Roboto;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 16px;
}

.supplier-matching-subheader {
    color: #5A6369;
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}

.vendors-matching-table-header .green-popup .modal-header {
    padding-bottom: 24px;
}

.vendors-matching-table-header .green-popup .modal-footer {
    padding: 0px;
}

.vendor-matching-popup-row-icon {
    background-color: transparent;
    border: none;
    width: 30px;
    height: 34px;
    display: block;
    background-position: 50% 60%;
    background-size: auto;
    background-repeat: no-repeat;
    cursor: pointer;
    -webkit-transition: width 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    justify-self: center;
}

.cross {
    background-image: url(/images/x.svg);
}

.disabled-opacity {
    opacity: 0.5;
}


.ai-category-table-wrapper {
    max-height: 300px;
    overflow-y: auto;
    margin-top: 15px;
}

.ai-category-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    color: #333;
}

.ai-category-table th,
.ai-category-table td {
    text-align: left;
    padding: 12px 8px;
    border-bottom: 1px solid #eee;
    font-weight: normal;
}

.ai-category-table th {
    font-weight: bold;
}
