﻿/*body {
    padding-top: 52px;
    margin-top: 60px !important;
    height: 100%;
    color: black;
    font-family: 'Segoe UI';
    background-color: #fff !important;
    font-size: 9pt;
    overflow: hidden;
}

a {
    outline: 0 !important;
}

.help-block-no-margin {
    margin-bottom: 0px;
}

.huge {
    font-size: 24px;
}

.zeeco-header {
    background-color: #e6e6e6 !important;
    border-color: #e6e6e6 !important;
}

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border-color: #e6e6e6 !important;
}

.navbar-inverse {
    background-color: #e6e6e6 !important;
    border-color: #e6e6e6 !important;
}

.zeeco-page-heading {
    padding: 10px;
    background-color: #e5b43d;
    font-size: 24px;
    margin-top: 8px;
}

#appcontent {
    height: 100%;
}

.appcontentarea {
    padding-left: 0;
    padding-right: 0;
}

.nav-sidebar {
    margin-right: -21px;*/ /* 20px padding + 1px border */
    /*margin-bottom: 20px;
    margin-left: -20px;
}

.nav-sidebar > li > a {
    padding-right: 20px;
    padding-left: 20px;
    color: #000;
}

.nav-sidebar > .active > a,
.nav-sidebar > .active > a:hover,
.nav-sidebar > .active > a:focus {
    color: #fff;
    background-color: #d4745d;
}

.sidebar {
    position: fixed;
    top: 100px;
    bottom: 0;
    left: 0;
    z-index: 1000;
    display: block;
    padding: 20px;
    max-width: 215px;
    width: 215px;
    overflow-x: hidden;
    overflow-y: auto;*/ /* Scrollable contents if viewport is shorter than content. */
    /*background-color: #e7e7e7;
    border-right: 1px solid #e7e7e7;
}

.includespacing > li {
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 10px;
}

.loader {
    border: 10px solid #e6e6e6;
    border-radius: 50%;
    border-top: 10px solid #ca5235;
    width: 48px;
    height: 48px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.navbar-primary {
    background-color: #333;
    bottom: 0px;
    left: 0px;
    position: absolute;
    top: 51px;
    width: 200px;
    z-index: 8;
    overflow: hidden;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}

.sidebar.collapsed {
    width: 60px;
}

    .sidebar.collapsed .fa {
        font-size: 22px;
    }

    .sidebar.collapsed .nav-label {
        display: none;
    }

.expandedsidebar {
    bottom: 50pt !important;
}

.collapsedsidebar {
    bottom: 11pt !important;
}

.btn-expand-collapse {
    position: absolute;
    display: block;
    left: 0px;
    bottom: 0;
    width: 100%;
    padding: 8px 0;
    color: grey;
    font-size: 20px;
    text-align: center;
}

    .btn-expand-collapse:hover,
    .btn-expand-collapse:focus {
        background-color: #222;
        color: white;
    }

    .btn-expand-collapse:active {
        background-color: #111;
    }

.main-content {
    margin-left: 215px;
}

.collapsed + .main-content {
    margin-left: 60px;
}

.versionnumber {
    position: absolute;
    display: block;
    left: 0px;
    bottom: 0;
    width: 100%;
    padding: 8px 0;
    color: grey;
    font-size: 20px;
    text-align: center;
}

.info-panel.clickable:hover {
    background-color: #eee;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity .2s;
}

.ClickableLink {
    color: #337ab7;
}

    .ClickableLink:hover {
        color: #337ab7;
        text-decoration: underline;
        cursor: pointer;
    }

.sectionheader {
    font-size: 17px;
    color: #ca5235;
}

.sectionheader:after {
    display: inline-block;
    height: .5em;
    vertical-align: bottom;
    margin-right: -100px;
    margin-left: 10px;
    border-top: 1px solid #eeeeee;
}

.sectionheader-8:after {
    width: calc(100% - 200px);

}

.sectionheader-7:after {
    width: calc(100% - 165px);
}

.sectionheader-6:after {
    width: calc(100% - 145px);
}

.sectionheader-5:after {
    width: calc(100% - 150px);
}

.sectionheader-4:after {
    width: calc(100% - 92px);
}

.k-icon {
    color: #333;
}

.marginRight {
    margin-right: 3px;
}

textarea{
    resize: none;
}

.purchaseOrderStatusPill {
    padding: 2px;
    color: #000;
}

.purchaseOrderStatus-0 {
    background-color: #DDD;
    border: solid 1px #DDD;
}

.purchaseOrderStatus-1, .purchaseOrderStatus-12,
.purchaseOrderStatus-10, .purchaseOrderStatus-1002,
.purchaseOrderStatus-203, .purchaseOrderStatus-2003,
.purchaseOrderStatus-100, .purchaseOrderStatus-1000, .purchaseOrderStatus-1001,
.purchaseOrderStatus-200, .purchaseOrderStatus-201, .purchaseOrderStatus-202,
.purchaseOrderStatus-2000, .purchaseOrderStatus-2001, .purchaseOrderStatus-2002,
.purchaseOrderStatus-300, .purchaseOrderStatus-3000, .purchaseOrderStatus-3001,
.purchaseOrderStatus-400, .purchaseOrderStatus-4000,
.purchaseOrderStatus-500, .purchaseOrderStatus-5000, .purchaseOrderStatus-5001,
.purchaseOrderStatus-700, .purchaseOrderStatus-7000 {
    background-color: #F1C232;
    border: solid 1px #F1C232;
}

.purchaseOrderStatus-600, .purchaseOrderStatus-6000, .purchaseOrderStatus-900 {
    background-color: #e20000;
    color: #fff;
    border: solid 1px #e20000;
}

.purchaseOrderStatus-800, .purchaseOrderStatus-8000 {
    background-color: #02d869;
    border: solid 1px #02d869;
}

.purchaseOrderStatus-OnHold {
    background-color: #8e05a9;
    border: solid 1px #8e05a9;
}

.row-margin{
    margin-bottom: 5px;
}

.zeeco-k-grid-add {
    background-color: #CA5235 !important;
    border-color: #CA5235 !important;
    color: #FFFFFF !important;
    text-transform: uppercase;
}

.k-grid-toolbar > div > button:hover {
    background-color: #bd3c1d !important;
    border-color: #bd3c1d !important;
}

.panel {
    box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.26);
    border-radius: 0px;
    border: none;
}

.heading-panel {
    font-size: 16px;
    padding: 5px !important;
    border-radius: 0px;
}

.panel-heading-black {
    background-color: #000 !important;
    color: #fff !important;
}

.panel-heading-red {
    background-color: #CA5235 !important;
    color: #fff !important;
}*/
html {
    background-color: #e6e6e6;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 30px;
    font-size: 9pt;
    font-family: 'Segoe UI';
    overflow: hidden;
}

/*
    form and input fields
*/
.zeeco-required-helpblock {
    color: red;
}

.zeeco-required-asterisk {
    color: red;
    padding-left: 4px;
}

.zeeco-form > .form-group {
    margin-bottom: 0px;
}

.form-textarea {
    width: 100%;
    min-height: 75px !important;
}

.zeeco-textbox {
    width: 100%;
}

.zeeco-section-header {
    font-size: 14px;
    color: #F47920;
}

.zeeco-task-uploadtext {
    margin-top: 0px;
    margin-bottom: .25rem;
}

.bg-light {
    background-color: #e6e6e6 !important;
}

.zeeco-header {
    background-color: #e6e6e6 !important;
    border-color: #e6e6e6 !important;
}

.navbar-fixed-top .nav {
    padding-top: 0px;
}

.zeeco-page-heading {
    padding: 10px 16px 10px 16px;
    background-color: #404041;
    font-size: 24px;
    color: #fff;
}

.no-padding {
    padding: 0px;
}

@media all and (max-width: 992px) {
    .zeeco-page-heading {
        margin-top: 56px !important;
    }
}

.zeeco-nav {
    border-radius: 0;
}

    .zeeco-nav > a {
        padding: 8px 10px !important;
        line-height: 20px !important;
        color: #444;
    }

    .zeeco-nav:hover > a {
        cursor: pointer;
        color: #f7f7f7 !important;
        background-color: #F47920 !important;
        border-radius: 0;
    }

.zeeco-nav-header {
    border-radius: 0;
}

    .zeeco-nav-header > a {
        padding: 8px 10px !important;
        line-height: 20px !important;
        color: #444;
    }

    .zeeco-nav-header:hover > a {
        cursor: pointer;
        border-radius: 0;
    }


.side-nav {
    border-radius: 0;
    width: 100%;
}

    .side-nav > a {
        /*padding: 8px 10px !important;*/
        line-height: 20px !important;
    }

    .side-nav:hover {
        cursor: pointer;
        color: #f7f7f7 !important;
        background-color: #F47920 !important;
        border-radius: 0;
    }

.zeecoactive {
    color: #ffffff !important;
    background-color: #F47920 !important;
    border-radius: 0 !important;
}

    .zeecoactive > a {
        color: #ffffff !important;
        background-color: #F47920 !important;
    }

.maincontainerloadingarea {
    position: absolute;
    z-index: 2147483647;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    top: 0;
    bottom: 0;
}

.no-padding {
    padding: 0px;
}

.footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 30px;
    line-height: 30px; /* Vertically center the text there */
    background-color: #e6e6e6;
}

.card-zeeco {
    border-radius: 0;
    border: none;
    margin-bottom: 10px;
    box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.26);
}

.card-header-zeeco-red {
    border-radius: 0 !important;
    background-color: #404041;
    padding: 5px;
    color: #fff;
    font-weight: normal;
    font-size: 16px;
}

.zeeco-collapse-header {
    color: #404041;
    font-size: 14px;
    padding-left: 0px;
}

    .zeeco-collapse-header:hover {
        color: #404041d4;
    }

.zeeco-collapse-panel-heading {
    border-bottom: 1px solid #F47920;
}

.card-header-zeeco-green {
    border-radius: 0 !important;
    background-color: #008000;
    padding: 5px;
    color: #fff;
    font-weight: normal;
    font-size: 16px;
}

.card-header-zeeco-black {
    border-radius: 0 !important;
    background-color: #000;
    padding: 5px;
    color: #fff;
    font-weight: normal;
    font-size: 16px;
}

.card-header-zeeco-black-text {
    color: #fff;
    font-weight: normal;
    font-size: 18px;
}

.card-header-zeeco-black-notext {
    border-radius: 0 !important;
    background-color: #000;
    padding: 5px;
    color: #fff;
}

.card-body-zeeco {
    padding: 8px;
}

.col-zeeco {
    padding: 8px !important;
}

.col-form-readonly-zeeco {
    padding-top: calc(.375rem + 1px);
    padding-bottom: calc(.375rem + 1px);
}

.cal-link {
}

    .cal-link > a {
        color: #FFFFFF;
    }

/*
    App Loader
*/
.loadercontainer {
    padding-top: 50%;
}

.loadertext {
    color: #fff;
}

.loader {
    border: 8px solid #e6e6e6;
    border-radius: 50%;
    border-top: 8px solid #F47920;
    width: 48px;
    height: 48px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    margin: auto;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*
    App Naviagation
*/
.appnav-panel {
    position: fixed;
    z-index: 10000;
    height: 100%;
    top: 0;
    right: 0;
    background-color: #fff;
    overflow-x: hidden;
    transition: 0.5s;
    box-shadow: 0 0 0.875rem 0 rgba(0,0,0,.3);
    white-space: nowrap;
}

.appnav-panel-show {
    width: 370px;
}

.appnav-panel-hide {
    width: 0;
}

.appnav-item:hover {
    color: #777;
}

.appnav-ham-show {
    position: absolute;
    -webkit-animation: right_to_left 0.5s ease;
    animation: right_to_left 0.5s ease;
    animation-fill-mode: forwards;
}

@keyframes right_to_left {
    from {
        right: 0;
    }

    to {
        right: 380px;
    }
}

/*
    Search 
*/
.highlightedtext {
    background-color: rgba(202, 82, 53, .6);
}

/*
    Card and Accordion Customizations
*/
.zeeco-k-checkbox-label {
    margin: 0;
}

.span-clickable {
    cursor: pointer;
}

    .span-clickable:hover {
        color: #e6e6e6;
    }

.span-clickable-blue {
    color: #0072c6;
}

    .span-clickable-blue:hover {
        text-decoration: underline;
        color: rgba(0,114,198,.5);
    }

input[type=text]::-ms-clear {
    display: none;
    width: 0;
    height: 0;
}

input[type=text]::-ms-reveal {
    display: none;
    width: 0;
    height: 0;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    display: none;
}

.loggedOnAs {
}

    .loggedOnAs:hover {
        cursor: pointer;
        color: #007bff;
        text-decoration: underline;
    }
/*
    Kendo Overrides
*/
.k-grid tr td {
    border-bottom: 1px solid #e6e6e6;
}

.k-animation-container, .k-animation-container *, .k-animation-container ::after, .k-block .k-header, .k-list-container, .k-widget, .k-widget *, .k-widget ::before {
    box-sizing: border-box;
}

.k-dropdown-wrap .k-input, .k-picker-wrap .k-input, .k-numeric-wrap .k-input {
    box-sizing: content-box;
}

.k-pager-numbers .k-state-selected {
    border-color: #F47920 !important;
}

.k-multiselect-wrap li {
    font: inherit !important;
}

.k-multiselect.k-state-focused.k-state-border-up .k-button, .k-multiselect.k-state-focused.k-state-border-down .k-button {
    color: #FFFFFF;
    background-color: #F47920;
    border-color: #F47920
}

.k-multiselect.k-header.k-state-focused .k-button {
    border-color: #F47920
}

.k-dropdown-wrap.k-state-default.k-state-active, .k-picker-wrap.k-state-default.k-state-active {
    background-color: #F47920;
    border-color: #F47920
}

.k-primary {
    background-color: #F47920;
    border-color: #F47920
}

.k-splitbar.k-state-focused {
    background-color: #F47920 !important;
    border-color: #F4F4F4 !important;
}

.k-splitter .k-ghost-splitbar-horizontal,
.k-splitter .k-splitbar-horizontal {
    top: 0;
    width: 12px;
    border-width: 0 1px;
    background-repeat: repeat-y;
}

.k-ghost-splitbar-vertical,
.k-splitbar-vertical {
    left: 0;
    height: 12px;
    border-width: 1px 0;
    background-repeat: repeat-x;
}

.k-grid tr td {
    border-right: 1px solid #e6e6e6 !important;
}

.k-grid tbody tr:hover {
    cursor: pointer;
}

.k-grid .k-state-selected {
    background-color: #F47920 !important;
    color: #FFFFFF;
    cursor: pointer;
}

.k-grid-toolbar > a:hover {
    background-color: #f46600 !important;
    border-color: #f46600 !important;
}

a.k-grid-update:hover {
    background-color: #f46600 !important;
    border-color: #f46600 !important;
}

.k-grid-header th.k-header > .k-link {
    background-color: #F47920 !important;
    color: #ffffff !important;
}

.k-grid-header th.k-header {
    background-color: #F47920 !important;
    color: #ffffff !important;
}

.k-grid-header .k-header {
    overflow: visible !important;
    white-space: normal !important;
}

.k-zeeco-padd-button > i {
    padding-top: 3px;
}

.k-grid-add {
    background-color: #F47920 !important;
    border-color: #F47920 !important;
    color: #FFFFFF !important;
    text-transform: uppercase;
}

.k-grid-add-zeeco {
    background-color: #F47920 !important;
    border-color: #F47920 !important;
    color: #FFFFFF !important;
    text-transform: uppercase;
}


.k-grid-header {
    background-color: #F47920 !important;
}

.k-grid-toolbar {
    background-color: #F47920;
    border-bottom: 0;
}

.k-grid-update {
    background-color: #F47920 !important;
    border-color: #F47920 !important;
    color: #ffffff !important;
}

.k-dialog .k-window-titlebar {
    background-color: #F47920;
    color: #fff;
}

.k-grid-header .k-link .k-icon.k-i-sort-asc-sm, .k-grid-header .k-link .k-icon.k-i-sort-desc-sm, .k-grid-header .k-link .k-sort-order {
    color: #000;
}

.k-button.k-button-icon .k-icon, .k-grid-filter .k-icon, .k-header .k-icon {
    color: #000;
}

.k-grouping-header {
    background-color: #F47920;
    border: #eee 1px solid;
    color: #fff;
}

/* Side Bar Navigation */
.nav-sidebar {
    margin-right: -21px; /* 20px padding + 1px border */
    margin-bottom: 20px;
    margin-left: -20px;
}

    .nav-sidebar > li > a {
        padding-right: 20px;
        padding-left: 20px;
        color: #000;
    }

    .nav-sidebar > .active > a,
    .nav-sidebar > .active > a:hover,
    .nav-sidebar > .active > a:focus {
        color: #fff;
        background-color: #d4745d;
    }

.sidebarArea {
    height: Calc(100% - 121px);
    width: Calc(100% - 200px);
    position: absolute;
    z-index: 999;
    top: 102px;
    left: 200px;
    bottom: -92px;
    background-color: black;
    opacity: 0.5;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

.sidebar {
    height: Calc(100% - 121px);
    width: 200px;
    position: absolute;
    z-index: 999;
    top: 0;
    top: 102px;
    left: 0;
    bottom: -92px;
    background-color: white;
    overflow-x: hidden;
    transition: 0.5s;
    padding: 16px 16px 16px 16px;
}