body {
    font-size: 14px;
    /*height:100%;*/
}

/*
    In Asp.NET 4 and above, Button1.enable = "false" only works on input HTML elements by setting their diabled attribute to disabled: disabled="disabled". 
    Disabling the LinkButton and other non-input Html controls in Asp.Net adds the aspNetDisabled class to Html elements.
    Customize aspNetDisabled to add a disabled effect.

    See for more information
    https://imar.spaanjaars.com/512/handling-disabled-links-in-aspnet-4
*/
a.aspNetDisabled, input.aspNetDisabled {
    opacity: .65 !important;
    pointer-events: none !important;
    cursor: none !important;
    color: black !important;
}

a.aspNetDisabled {
    display: inline-block;
}

.aspNetDisabledBSToolTipWrapper {
    display: inline !important;
    /*display: inline-block !important;*/
}
/*-----------------End Asp.NET Disabled----------------*/

/*----------------- Animations ----------------*/
@-webkit-keyframes buzz-out-on-hover {
    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }

    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}

@keyframes buzz-out-on-hover {
    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }

    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}

.buzz-out-on-hover {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

    .buzz-out-on-hover:hover, .buzz-out-on-hover:focus, .buzz-out-on-hover:active {
        -webkit-animation-name: buzz-out-on-hover;
        animation-name: buzz-out-on-hover;
        -webkit-animation-duration: 0.75s;
        animation-duration: 0.75s;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
    }
/*-----------------End Animations ----------------*/

/*--------------Overide Bootstrap ----------------*/
.custom-navbar-toggler.navbar-toggler {
    border-color: teal !important;
    color: teal !important;
}

.custom-navbar-toggler .navbar-toggler-icon {
    background-image: url( "data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 128, 128, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.btn {
    font-size: 14px;
}

.btn-group-sm > .btn, .btn-sm {
    font-size: 12px;
}

/*.form-control {
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
}*/

/*select.form-control:not([size]):not([multiple]) {
    height: 34px;
}*/

/*.input-sm, .form-control-sm {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
}*/

.form-control-sm, .form-select-sm, .input-group-sm *, .form-label-sm, .form-select-sm + div.chosen-container {
    font-size: 12px !important;
}

/*Bootstrap modal*/
.modal {
    z-index: 99998 !important;
}

button.accordion-button {
    color: #0d6efd !important;
    background-color: #f7f7f7 !important;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif !important;
}

.card {
    margin-bottom: 20px;
}

hr {
    height: 0.5px !important;
    /*border-width: 0; hides hr in firefox */
    color: gray;
    background-color: gray;
    clear: both;
}

.small, small {
    font-size: 80%;
    font-weight: 400;
}

a {
    /*color: #007bff;*/
    text-decoration: none;
    /*background-color: transparent;*/
}

    a:hover:not(nav a, .nav-tabs a, a.btn, a.eBisPrimaryIcon, a.eBisDangerIcon, a.eBisInformationIcon, a.eBisSuccessIcon, a.eBisSecondaryIcon, a.productDetailsPopover) {
        /*color: inherit;*/
        text-decoration: underline;
    }

.nav.flex-column.nav-pills button.nav-link {
    text-align: left;
}

    .nav.flex-column.nav-pills button.nav-link:hover {
        border-radius: 3px;
        border: 2px solid #326efc;
    }

.btn-info {
    color: white !important;
}

    .btn-info:hover {
        color: white !important;
    }

table.table-sm tr td select.form-control, table.table-sm tr td input.form-control, table.small tr td select.form-control, table.small tr td input.form-control, table.small tr td textarea.form-control {
    font-size: 12px !important;
}

.table td, .table th {
    vertical-align: middle !important;
}

table.small tr td textarea.form-control {
    height: auto;
}


/*------------ Multi-level Bootstrap Menu ------------------*/
/* https://www.youtube.com/watch?v=h1hNZUs95nY */
li.static.nav-item > a:hover {
    /*font-weight: bold;*/
    color: darkgray !important;
}

li.static.nav-item > a.selected, li.static.nav-item > a.active {
    color: white !important;
    font-weight: bold !important;
}

@media screen and (min-width: 992px) {

    li.static.nav-item > a:hover {
        -webkit-animation-name: buzz-out-on-hover;
        animation-name: buzz-out-on-hover;
        -webkit-animation-duration: 0.75s;
        animation-duration: 0.75s;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
    }
}

.dropdown-menu > a, .dropdown-menu > li > a {
    color: #212529;
    font-weight: 400;
}

    .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .navbar li a.selected {
        color: #ffffff;
        background-color: #007bff;
    }

/* Display block drop-down sub-menu items */
@media screen and (max-width: 992px) {
    [id*="MnAnonymousMenu"] {
        float: none !important;
    }

    [id*="MnAuthenticatedMenu"] {
        float: none !important;
    }

    /*.dropend > .dropdown-item {
        transform: rotate(-90deg) !important;
    }*/
}

/*-----------------------END------------------------------*/

/*--------------Overide Bootstrap END ----------------*/


/*-------- Override JQuery Chosen ---------------------*/
[class*="col-"] .chosen-container {
    width: 100% !important;
}

    /*[class*="col-"] .chosen-container .chosen-drop {
        z-index: 10015 !important;
    }*/

    [class*="col-"] .chosen-container .chosen-search input[type="text"] {
        border-radius: 5px;
        font-family: inherit !important;
    }

    [class*="col-"] .chosen-container .chosen-single span {
        /*max-width: calc(100% - 27%);*/
    }



/*-------- Override JQuery Chosen END---------------------*/


/*-----------JQuery Typeahead ---------------------*/
/*span.twitter-typeahead {
    width: 100%;
}

.tt-hint {
    color: #999
}

.tt-menu { 
    width: 100%;
    margin-top: 4px;
    padding: 4px 0;
    background-color: #fff;
    border: 0.5px solid #ccc;
    border: 0.5px solid rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.tt-suggestion {
    padding: 3px 20px;
    line-height: 24px;
}

    .tt-suggestion.tt-cursor, .tt-suggestion:hover, .tt-suggestion:focus {
        color: #fff;
        background-color: #0097cf;
        text-decoration: none;
        outline: 0;
    }

    .tt-suggestion p {
        margin: 0;
    }*/

/*-----------JQuery Typeahead END------------------*/

#Header {
    background-color: white;
    color: #09A7E1;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    /*from vsts*/
    /*font-family: "-apple-system",BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Helvetica,Ubuntu,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    color: #212121;
    font-size: 12px;*/
}

.bbsRBL label {
    padding-right: 5px;
}

.bbsRBL input[type=radio] {
    margin-right: 5px;
}

.bbsRBL input[type=checkbox] {
    margin-right: 5px;
}

h1, h2, h3, h4, h5, h6 {
    color: #09A7E1 !important;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif !important;
}

.bbsFooter {
    background-color: #343a40; /*333333*/
    color: white;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    min-height: 100px;
}

    .bbsFooter a {
        color: gold;
    }

.bg-myDark {
    background-color: #333333;
}

.clearFloat {
    clear: both;
}

.roundedBorders {
    border-radius: 10px;
}

.panelBorders {
    box-shadow: 0px 0px 10px 0px LightGray;
}

    .panelBorders:hover {
        outline: 0 !important;
        /*box-shadow: 0 0 3px 2px rgba(228, 121, 17, .50) !important;*/
        box-shadow: 0 0 10px 1px #09A7E1 !important;
    }

.panelShadow {
    /*-ms-box-shadow: 0 5px 3px #888888;*/
    /*-webkit-box-shadow: 0 5px 3px #888888;*/
    box-shadow: 0 5px 3px rgb(136 136 136 / 0.40);
}

.productImageThumbnailShadow {
    border-radius: 2px !important;
    border: 0.5px solid #a2a6ac !important;
}

    .productImageThumbnailShadow:hover, .productImageThumbnailShadow:focus {
        outline: 0 !important;
        border: 0.5px solid #e77600 !important;
        box-shadow: 0 0 3px 2px rgba(228, 121, 17, .50) !important;
        border-radius: 2px !important;
    }

.truncateProductNumberNameDescriptionText {
    display: inline-block !important;
    white-space: nowrap !important;
    max-width: 180px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.truncatePaintOrderMixersRemarks {
    display: inline-block !important;
    white-space: nowrap !important;
    max-width: 180px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.truncateWorkInProgressProductCancellationRemarks {
    display: inline-block !important;
    white-space: nowrap !important;
    max-width: 180px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.truncateWarehouseUtilizationCancellationRemarks {
    display: inline-block !important;
    white-space: nowrap !important;
    max-width: 180px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/*.truncateProductDocumentUrl {
    display: inline-block !important;
    white-space: nowrap !important;
    width: auto !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}*/

.mainDashboardJavaScriptChartContainer {
    background-color: white; /*#f0f1f7*/
    border: 0.5px solid #ddd;
    border-radius: 10px;
    box-shadow: 0px 0px 0px #ddd;
    padding: 3px;
}

    /*.mainDashboardJavaScriptChartContainer > div:nth-child(1) {
        background-color: #f0f1f7;
    }*/

    .mainDashboardJavaScriptChartContainer > div:nth-child(2), .mainDashboardJavaScriptChartContainer canvas {
        border-radius: 6px !important;
    }

    .mainDashboardJavaScriptChartContainer:hover {
        /*border: solid 2px #1196ab !important;*/
        border: solid 0.5px LightGray !important;
        box-shadow: 0px 0px 10px LightGray !important;
    }

.productCatalogueContainer {
    padding: 8px !important;
    height: 100% !important;
    border: 0.5px solid #ddd;
    border-radius: 15px;
    box-shadow: 0px 0px 0px #ddd;
    /*overflow: auto;*/
}

    .productCatalogueContainer:hover {
        /*border: solid 2px #1196ab !important;*/
        border: solid 0.5px LightGray !important;
        box-shadow: 0px 0px 10px LightGray !important;
    }

    .productCatalogueContainer a, .productCatalogueContainer img {
        border: none !important;
        text-decoration: none !important;
        color: black;
    }

        .productCatalogueContainer a:hover:not(a[id*="LnkBtnItemShowModalAddProductToCartOrOther"]) {
            color: #e77600 !important;
        }

.productCatalogueImageSection {
    /*text-align: center !important;*/
    height: 332px !important;
    margin-bottom: 0.5rem !important;
    margin-top: 0.5rem !important;
    /*width: auto;*/
}

.productCatalogueNameSection {
    text-align: left !important;
    font-size: 16px !important;
    white-space: nowrap !important;
    width: auto !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-weight: bold !important;
}

    .productCatalogueNameSection a {
        color: black !important;
    }

.productCatalogueSupplierOrBrandSection {
    text-align: left !important;
    font-size: 16px !important;
    white-space: nowrap !important;
    width: auto !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-weight: bold !important;
}

    .productCatalogueSupplierOrBrandSection a {
        color: black !important;
    }

.productCataloguePriceSection {
    color: #0F1111 !important;
    font-size: 18px !important;
}

    .productCataloguePriceSection table {
        margin-bottom: 0 !important;
        padding: 2px !important;
    }

.productCatalogueQuantitySection {
    color: forestgreen !important;
    text-align: left !important;
    white-space: nowrap !important;
    width: auto !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

    .productCatalogueQuantitySection a {
        color: forestgreen !important;
    }


.productCatalogueDescriptionSection {
    text-align: left !important;
    white-space: nowrap !important;
    width: auto !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.productCatalogueTruncateText {
    text-align: left !important;
    white-space: nowrap !important;
    width: auto !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.productDetailNameSection {
    text-align: left !important;
    font-size: 18px !important;
    margin-bottom: .5rem !important;
    font-weight: bold !important;
}

.productDetailDescriptionSection {
    text-align: justify !important;
    text-justify: inter-word !important;
    margin-bottom: .5rem;
}

.productDetailQuantitySection {
    color: forestgreen;
    margin-bottom: 0.5rem;
}

.productDetailColourSection {
    display: inline-block;
    width: 40px;
    height: 20px;
    border: none;
}

.productDetailPriceSection {
    color: #0F1111 !important;
    font-size: 18px !important;
}

.searchStyle {
    border: 0.5px solid #AED2EE;
    padding: 10px;
}

.buttonStyle {
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    font-size: 9pt;
}

    .buttonStyle:hover {
        cursor: pointer;
        background-color: #09A7E1;
        color: white;
    }

.checkoutButtonStyle {
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    color: forestgreen;
    font-size: small;
}

    .checkoutButtonStyle:hover {
        cursor: pointer;
        background-color: forestgreen;
        color: white;
    }

.hideDisplayVisible {
    visibility: hidden !important;
}

.hideDisplay {
    display: none !important;
}

.showDisplayInitial {
    display: initial !important;
}

.showDisplayInline {
    display: inline !important;
}

.showDisplayNormal {
    display: normal !important;
}

.showDisplayBlock {
    display: block !important;
}

.showDisplayInlineBlock {
    display: inline-block !important;
}

.showDisplayVisible {
    visibility: visible !important;
}

.panelError {
    padding: 2px;
    border: 0.5px solid #CD0A0A;
    background-color: white;
    color: #EA3C3B;
}

.panelSuccess {
    padding: 2px;
    border: 0.5px solid #009900;
    background-color: white;
    color: #009900;
}

.panelAlert {
    padding: 2px;
    border: 0.5px solid #3399FF;
    vertical-align: middle;
    background-color: #FFFFCC;
    width: 100%;
}


.modalBackground {
    /*position: fixed !important;
    margin: 0 !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: auto !important;*/
    /*z-index: 10001 !important;*/
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/*Default z-index of modalpopupextender is 10002*/
.modalPopup {
    position: fixed !important;
    top: 2.5%;
    z-index: 99998 !important;
    background-color: transparent;
    /*box-shadow: 10px 10px 5px #888888;*/
    border-radius: 15px;
    width: 90%;
    height: 70%;
    max-height: calc(100vh - 200px);
}

@media screen and (max-width: 992px) {
    .modalPopup {
        width: 90% !important;
    }
}

/*https://stackoverflow.com/questions/5697067/css-for-grabbing-cursors-drag-drop*/
.modalPopupHeader {
    padding: 10px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    background-color: cornflowerblue;
    color: white;
    font-size: large;
    border-bottom: 0.5px solid lightgray;
    cursor: move; /* fallback if grab cursor is unsupported in the browser */
    cursor: grab;
}

    .modalPopupHeader:active {
        cursor: grabbing;
    }

.modalPopupBody {
    padding: 10px;
    background-color: white;
    color: black;
    border-bottom: 0.5px solid lightgray;
    /*position: absolute;*/
    /*top: 50px;*/
    /*bottom: 50px;*/
    /*left: 0;*/
    width: 100%;
    /*height: calc(100vh - 200px);*/
    /*min-height:250px;*/
    max-height: calc(100vh - 200px);
    overflow-y: auto;
    overflow-x: hidden;
}

.modalPopupFooter {
    width: 100%;
    text-align: right;
    padding: 10px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    background-color: white;
    color: white;
    font-size: large;
}

.progressModalBackgroundFilter {
    position: fixed;
    margin: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    z-index: 99999 !important;
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.productsChangedStyle {
    border-radius: 8px !important;
    border: solid 2px #ffaf38 !important;
    border-left: solid 12px #ffaf38 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
}

.productsChangedIcon {
    color: #ffaf38 !important;
}

.sumOrSeparateProductWarning {
    border-radius: 8px !important;
    border: solid 2px #ffaf38 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

.sumOrSeparateProductAddToCartWarning {
    border-radius: 8px !important;
    border: solid 2px #ffaf38 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
}

.sumOrSeparateProductAddToQuotationWarning {
    border-radius: 8px !important;
    border: solid 2px #ffaf38 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

.reviewQuotationHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

.approveQuotationHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

.paintOrderActionsHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

.warehouseOrderActionsHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

.warehouseReceiptActionsHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

.paintOrderMoreInformationHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    max-height: 200px !important;
    overflow: auto !important;
    /*width: 85%;*/
}

@media screen and (max-width: 992px) {
    .paintOrderMoreInformationHoverMenu {
        width: 80%;
    }
}

.invoiceMoreInformationHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    width: 45%;
}

@media screen and (max-width: 992px) {
    .invoiceMoreInformationHoverMenu {
        width: 80%;
    }
}

.invoiceActivityStatusHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

.workInProgressProductMoreInformationHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    max-height: 200px !important;
    overflow: auto !important;
    /*width: 85%;*/
}

@media screen and (max-width: 992px) {
    .workInProgressProductMoreInformationHoverMenu {
        width: 80%;
    }
}

.warehouseUtilizationMoreInformationHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    max-height: 200px !important;
    overflow: auto !important;
    /*width: 85%;*/
}

@media screen and (max-width: 992px) {
    .warehouseUtilizationMoreInformationHoverMenu {
        width: 80%;
    }
}

.supportRequestSlaInfoHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    max-height: 200px !important;
    overflow: auto !important;
    /*width: 85%;*/
}

@media screen and (max-width: 992px) {
    .supportRequestSlaInfoHoverMenu {
        width: 80%;
    }
}

.supportRequestSlaResponseViolationInfoHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #ffaf38 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    max-height: 200px !important;
    overflow: auto !important;
    /*width: 85%;*/
}

@media screen and (max-width: 992px) {
    .supportRequestSlaResponseViolationInfoHoverMenu {
        width: 80%;
    }
}

.supportRequestSlaResolutionViolationInfoHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #d23849 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    max-height: 200px !important;
    overflow: auto !important;
    /*width: 85%;*/
}

@media screen and (max-width: 992px) {
    .supportRequestSlaResolutionViolationInfoHoverMenu {
        width: 80%;
    }
}

.salesOrderAlertInfoHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #d23849 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    max-height: 200px !important;
    overflow: auto !important;
    /*width: 85%;*/
}

@media screen and (max-width: 992px) {
    .salesOrderAlertInfoHoverMenu {
        width: 80%;
    }
}

.paymentCancelledInfoHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #d23849 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
    /*width: 85%;*/
}

/*@media screen and (max-width: 992px) {
    .paymentCancelledInfoHoverMenu {
        width: 80%;
    }
}*/

.productPriceInfoHoverMenu {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    padding: 8px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
    display: none;
}

/* Prevents hover menu from exceeding the width of the view port */
@media screen and (min-width: 600px) {
    div[id*="itemPlaceholderContainer"] > div.col-lg-3:nth-child(4) div.productCataloguePriceSection table td div[id*="PanItemProductPriceInfo"].productPriceInfoHoverMenu {
        /* left: 74vw !important;
        left: 75% !important;*/
        left: 73vw !important;
        left: 74% !important;
    }
}

.eBisInformation {
    border-radius: 8px !important;
    border: solid 2px #1196ab !important;
    border-left: solid 12px #1196ab !important;
    /*border: solid 2px #0dcaf0 !important;
    border-left: solid 12px #0dcaf0 !important;*/
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem;
    /*white-space:pre-wrap;*/
}

.eBisInformationIcon {
    color: #1196ab !important;
    /*color: #0dcaf0 !important;*/
}

.eBisWarning {
    border-radius: 8px !important;
    border: solid 2px #ffaf38 !important;
    border-left: solid 12px #ffaf38 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
}

.eBisWarningIcon {
    color: #ffaf38 !important;
}

.eBisDanger {
    border-radius: 8px !important;
    border: solid 2px #d23849 !important;
    border-left: solid 12px #d23849 !important;
    padding: 10px !important;
    background-color: white !important;
    margin-bottom: 1rem !important;
}

.eBisDangerIcon {
    color: #d23849 !important;
}

.eBisSuccessIcon {
    color: #00cc00 !important;
}

.eBisPrimaryIcon {
    color: #007bff !important;
}

.eBisSecondaryIcon {
    color: #6d757d !important;
}

.textWaterMark {
    background-color: #FFFF99;
    font-family: 'Segoe UI', Verdana, Geneva, 'DejaVu Sans', sans-serif;
    font-size: 12px;
    text-decoration: none;
}



.divCenterStyle {
    width: 400px;
    margin: 0 auto;
    padding-top: 50px;
}

.img-responsiveCenter {
    margin: 0 auto;
}

.clearBoth {
    clear: both;
}

.cartInformation {
    border: 3px solid #AED2EE;
    background-color: #EAF3FE;
    padding: 5px;
}

.orderHistoryWrapper {
    border: 0.5px solid #AED2EE;
    background-color: #FFFFFF;
    padding: 10px;
}

.orderHistoryRowHeader {
    background-color: #AED2EE !important;
    padding: 5px !important;
    font-size: medium !important;
    font-weight: bold !important;
}

.orderHistoryRowBodyAddress {
    background-color: #ffffff;
    padding: 5px 5px 5px 5px;
    border-right-style: dashed;
    border-right-width: 0.5px;
    border-right-color: #AED2EE;
}

.orderHistoryRowBodyOrders {
    background-color: #ffffff;
    padding: 10px 5px 5px 5px;
}

li {
    line-height: 1.7;
}

.orderForCustomerSections {
    border: 0.5px solid lightgray;
    padding: 10px;
}

.textCapitalize {
    text-transform: capitalize;
}

.textJustify {
    text-align: justify !important;
    text-justify: inter-word !important;
}

.ajaxLoadingModal {
    /*display: none;*/
    position: fixed;
    z-index: 99998;
    margin: 0;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    /*background-color: #ababab;
    opacity: .70;
    filter: alpha(opacity=80);*/
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.ajaxLoadingModalDisplay {
    display: none;
}

.ajaxModalSpinnerContent {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 0.5px solid #888;
    width: 150px;
    text-align: center;
    border-radius: 20px;
    z-index: 99999;
}

.ajaxModalContent {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 0.5px solid #888;
    width: 60%; /* Could be more or less, depending on screen size */
}

.ajaxModalClose {
    color: #aaa !important;
    float: right !important;
    font-size: 28px !important;
    font-weight: bold !important;
}

    .ajaxModalClose:hover, .ajaxModalClose:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

.checkBoxItemMargin input[type="checkbox"] {
    margin-right: 5px !important;
}

.radioItemMargin input[type="radio"] {
    margin-right: 5px !important;
}

/* https://www.w3schools.com/howto/howto_js_collapse_sidebar.asp The sidebar menu */
.toggleEbisNotifications {
    cursor: pointer;
}

/*Bootstrap lg breakpoint */
@media screen and (max-width: 992px) {

    .hideMainDashboardSidebarMenuColumnBorder {
        border: none !important;
        padding: 0 !important;
    }
}

/*Bootstrap md breakpoint */
@media screen and (max-width: 768px) {

    .hideReferenceDataSidebarMenuColumnBorder {
        border: none !important;
        padding: 0 !important;
    }
}