﻿/*#################################################################################
    
    For ease of maintenance please ensure to follow the document structure listed below. If a new section is required, please add to the Table of Contents. 
	
	This CSS file contains base template styles and any styles for shared pages between the portals. This files contents should be the same on all portals. 

    Table Of Contents

    #Defaults
    #Bootstrap Overrides
    #Login
    #Menu
    #BreadCrumb
    #General Purpose
    #ChangePassword
	#Reports
    #Documents
    #DevEx Overrides

    ####Media Queries 

    #Destops and Laptops
    #Tablets
    #Phones
    #Print
    
##################################################################################*/

/************************************************** #Defaults ***********************************************************************/

* {
    outline: none;
}

/*Scroll Bar Customization*/

/* Firefox */
* {
   scrollbar-width: thin;
   scrollbar-color: #ababab transparent;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 8pt;
  height: 6pt;
}

*::-webkit-scrollbar-track {
    background: transparent;
}

*::-webkit-scrollbar-thumb {
  background-color: #ababab;
  border-radius: 10px;
  border: 3px solid transparent;
}
/**/

body {
    padding-top: 50pt;
    overflow: auto;
    max-width: 100%;
}

html {
    -webkit-font-smoothing: antialiased !important;
}

h1, h2, h3, h4, h5, h6 {
    margin-bottom: 20px;
    font-weight: normal;
    text-transform: uppercase;
}

input {
    display: inline-block;
    border-radius: 2pt;
    padding: 2px 2px 2px 4px;
    line-height: 1.42857143;
    background-image: none;
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

    input[type=checkbox] {
        outline: none;
    }

a {
    text-decoration: none;
}

    a:hover, a:active, a:focus {
        transition: all ease-in-out 0.3s;
        -webkit-transition: all ease-in-out 0.3s;
        -moz-transition: all ease-in-out 0.3s;
        -o-transition: all ease-in-out 0.3s;
        text-decoration: none;
    }

    table thead tr {
        border-bottom-style: none;
        padding: 6px 0;
    }

th {
    font-weight: inherit;
}

form {
    height: 100%;
}

label {
    font-weight: bold;
    margin-top: 5px;
}

fieldset {
    margin-bottom: 20pt;
}

legend {
    height: auto;
    overflow: auto;
}

textarea {
    border-radius: 1pt;
    box-shadow: none;
}

select {
    border-radius: 2pt !important;
    margin: 0 0 6px -4px;
    box-shadow: none;
    max-width: 250pt;
    height: 24px;
}


/************************************************** #Bootstrap Overrides ************************************************************/

.row-offcanvas {
    height: 100%;
}

.hide {
    display: none !important;
}

.card {
    border-radius: 2pt;
}

.card-title {
    display: inline-block;
    width: 100%;
    height: auto;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 2pt;
}

input[type=file] {
    max-width: 100%;
}

pre {
    font-size: inherit;
}

.btn {
    padding: 4pt 10pt !important;
    line-height: 1em;
    border-radius: 2pt;
    border-radius: 2pt;
    font-weight: normal;
}

.btn-link{
    background: transparent;
}

.btn-success {
    margin-left: 4px;
}

    .btn-success:hover, .btn-success:focus, .btn-success:active {
        transition: all ease-in-out 1s;
        -webkit-transition: all ease-in-out 1s;
        -o-transition: all ease-in-out 1s;
        -moz-transition: all ease-in-out 1s;
    }

.btn-primary {
    border: 0;
    border-radius: 2pt !important;
    padding: 5pt;
}

    .btn-primary:hover, .btn-primary:active, .btn-primary:focus {
        transition: all ease-in-out 0.3s;
        -webkit-transition: all ease-in-out 0.3s;
        -moz-transition: all ease-in-out 0.3s;
        -o-transition: all ease-in-out 0.3s;
        text-decoration: none;
    }

.alert {
    position: fixed;
    top: 20px;
    left: 50%;
    z-index: 1050;
    display: block;
    width: 300px;
    float: none;
    margin: 0 0 0 -150px;
    padding: 5px 10px;
	opacity: 1 !important;
}

.alert ul{
    padding-left: 15px;
    margin-bottom: 0;
}

.form-control {
    height: 28px;
    display: inline-block;
    padding: 3px 5px;
    border-radius: 2pt;
    font-size: inherit;
}

.modal{
    left: 25vw;
}

textarea.form-control {
    height: auto;
}

.input-group > .form-control {
    width: calc(100% - 32pt);
}

.input-group.date-small > .form-control {
    width: 100%;
}

.checkbox {
    position: relative;
    margin-top: 2px;
}

.navbar-toggle {
    float: left;
    margin-left: 10px;
    display: block !important;
    margin-top: 10pt;
    padding: 10px;
}

    .navbar-toggle:hover, .navbar-toggle:focus, .navbar-toggle:active {
        background: transparent !important;
    }

.navbar {
    min-height: 45px;
}

.navbar-inverse {
    border-bottom-style: none;
}

.container {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
    margin-top: 0px;
    margin-bottom: 30px;
}

.navbar-collapse.collapse {
    z-index: 0;
}

.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle), .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle), .btn-group .btn + .btn, .modal-footer .btn-group .btn + .btn, .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle), .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle), .btn-group .btn + .btn {
    border-radius: 0;
    height: auto;
    margin-left: 10px !important;
    padding: 5px 10px;
}

.inner-widget-wrap .table-responsive {
    overflow-x: visible;
}

.table-responsive {
    clear: both;
}

.row {
    clear: both;
}

.simplebar-content {
    display: flex;
    flex-wrap: wrap;
}

.modal {
    width: 50vw;
    margin: auto;
    max-width: 500pt;
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
}

.modal-backdrop .fade .in {
    opacity: 0.5 !important;
}


.modal-backdrop.fade {
    opacity: 0.5 !important;
}

.fa-calendar:before{
	content: "\f073" !important;
}

.fa{
	font-weight: 900 !important;
	font-family: "Font Awesome 5 Free" !important;
}

[style*="--aspect-ratio"] > :first-child {
    width: 100%;
}

[style*="--aspect-ratio"] > img {
    height: auto;
}

@supports (--custom:property) {
    [style*="--aspect-ratio"] {
        position: relative;
    }

        [style*="--aspect-ratio"]::before {
            content: "";
            display: block;
            padding-bottom: calc(100% / (var(--aspect-ratio)));
        }

        [style*="--aspect-ratio"] > :first-child {
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
        }
}

/************************************************** #Login **************************************************************************/

body.login-page {
    padding-top: 0;
    background-size: cover;
}

.login-header {
    position: fixed;
    top: 20px;
    left: 10px;
}

    .login-header h1 {
        font-weight: 600;
        line-height: 19px;
        margin: 0;
    }

.login-panel {
    position: absolute;
    top: 45%;
    left: 50%;
    z-index: 10;
    border-radius: 2pt;
    margin: -200px 0 0 -200px;
    padding: 20px 5pt;
    max-width: 450px;
}

.login-panel .form-control {
    height: 33px;
    border-radius: 2pt;
    margin: 5pt 0;
    padding: 7px 5px;
}

.login-logo {
    display: block;
    max-width: 160px;
    margin: 0 auto 10pt;
}

.login-panel h2 {
    display: inline-block;
    width: 100%;
    text-align: center;
}

#ctl00_MainContent_b1LoginControl_ctl00_loginBtn, .login-btn {
    margin-top: 12px;
    width: 100%;
    height: 36px;
    font-weight: 600;
    border: none;
    border-radius: 1pt;
    padding: 5pt 0;
}

    #ctl00_MainContent_b1LoginControl_ctl00_loginBtn:hover, #ctl00_MainContent_b1LoginControl_ctl00_loginBtn:active, #ctl00_MainContent_b1LoginControl_ctl00_loginBtn:focus {
        transition: all ease-in-out 0.3s;
        -webkit-transition: all ease-in-out 0.3s;
        -moz-transition: all ease-in-out 0.3s;
        -o-transition: all ease-in-out 0.3s;
    }

#ctl00_MainContent_b1LoginControl_ctl00_RequiredFieldValidator2, #ctl00_MainContent_b1LoginControl_ctl00_RequiredFieldValidator1 {
    display: inline-block;
    margin-top: 4px;
    font-style: italic;
    text-align: left;
}

.login-footer {
    padding: 0;
    width: 100%;
    min-width: 182pt;
    margin: 0 auto;
    text-align: center;
}

    .login-footer a {
        line-height: 12pt;
    }

        .login-footer a:hover, .login-footer a:active, .login-footer a:focus {
            transition: all ease-in-out 0.3s;
            -webkit-transition: all ease-in-out 0.3s;
            -moz-transition: all ease-in-out 0.3s;
            -o-transition: all ease-in-out 0.3s;
        }

.login-panel .error-msg, .alertText {
    padding-top: 10px;
    font-style: italic;
    text-align: center;
}

.login-panel input {
    width: 100%;
}

#footer-controls ul.navlist li {
    display: inline-block;
    float: left;
}


/************************************************** #Menu *************************************************************************/

/*hide old page titles*/
#pageHeaderBarRight {
    display: none;
}
/**/

.menu-tray .row {
    max-height: 92vh;
}

.navbar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 900;
    width: 100%;
    height: 45pt;
    padding: 0;
}

.navbar-header {
    width: 100%;
    text-transform: uppercase;
}

.navbar-toggle {
    background: transparent;
}

.icon-bar {
    width: 22px;
    height: 2px;
    margin: 2pt 0;
    display: block;
}

.fas {
    line-height: 2.4 !important;
}

.top-logo {
    display: inline-block;
    padding: 5pt 5pt 0;
    float: left;
    margin-left: -11pt;
    margin-right: 10pt;
    height: 44pt;
    min-width: 100pt;
    text-align: center;
}

.navbar-brand{
    padding-top: 0;
}

    .top-logo img {
        max-height: 35pt;
    }

.navbar-toggle {
    border: none;
}

.menu-expand {
    display: inline-block;
    float: right;
    clear: right;
    margin-left: 25pt;
    line-height: 11pt;
    text-transform: uppercase;
}

.simplebar-scroll-content {
    overflow-x: hidden !important;
}

.menu-tray .horizontal.simplebar-track {
    display: none !important;
}

.horizontal.simplebar-track {
    bottom: 5vh;
}

.user-actions {
    padding: 6px 0 8px;
    float: right;
}

.user-action-btn{
    display: none;
}

.navbar-header .user-action-btn{
    display: inline-block;
}

#ctl00_securSALES, #ctl00_securORDER, #ctl00_securQUOTE, #ctl00_securPAYMENT, #ctl00_securSERVICECALL {
    display: inline;
}


.backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    opacity: 0.8;
    display: none;
    z-index: 1000;
}


.navbar-header .user-action-btn {
    display: inline-block !important;
    font-weight: normal;
    text-align: center;
    line-height: 10pt;
    padding: 2pt 5pt;
    opacity: 0.7;
    min-width: 50pt;
}

.navbar-header .user-action-btn {
    margin: 0 -2pt;
}

.navbar-header .user-action-btn, .navbar-header .user-action-btn:hover {
    line-height: 10pt;
}

.navbar-header .user-action-btn .fas, .navbar-header .user-action-btn:hover .fas {
    display: block;
    line-height: 2.4;
}

.navbar-header .user-action-btn:hover, .navbar-header .user-action-btn:hover .fas, .navbar-header .user-action-btn:focus, .navbar-header .user-action-btn:focus .fas, .navbar-header .user-action-btn:active, .navbar-header .user-action-btn:active .fas{    
    transition: all ease-in-out 0.3s;
    -webkit-transition: all ease-in-out 0.3s;
    -moz-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    opacity: 1;
}

.logout-panel {
    float: right;
    clear: right;
    text-align: right;
    border-left: 1px solid #ccc;
    max-width: 78pt;
    max-height: 44pt;
    line-height: 10pt;
    margin-top: 5pt;
    margin-right: -12pt;
}

    .logout-panel .dropdown-toggle {
        height: 33pt;
        padding-left: 12pt;
        padding-right: 10pt;
        opacity: 0.7;
    }

.open .dropdown-menu {
    display: block;
}

.dropdown-toggle span {
    display: inline;
}


.logout-panel .dropdown-toggle::after {
    display: none;
}

.logout-panel .dropdown-menu {
    left: auto;
    right: 0;
    margin-top: 6pt;
    text-transform: capitalize;
}

.logout-panel .dropdown-menu li{
    line-height: 14pt;
    padding: 3pt;
}

.select-customer-wrapper {
    width: 100%;
}

    .select-customer-wrapper.input-group > .form-control {
        width: 1%;
    }

#selectCustomer .ui-autocomplete, #selectDocCustomer .ui-autocomplete {
    margin-top: -1pt;
    padding: 4pt;
    z-index: 2000;
    max-width: 209pt;
}

    #selectCustomer .ui-autocomplete li.ui-menu-item, #selectDocCustomer .ui-autocomplete li.ui-menu-item {
        list-style: none !important;
    }

.no-valid-customer-found {
    margin-top: 5pt;
    margin-bottom: -20pt;
}

#ctl00_securSALESMobile, #ctl00_securACTIONSMOBILE, #ctl00_securORDERMOBILE, #ctl00_securPAYMENTMOBILE, #ctl00_securSERVICECALLMOBILE {
    display: inline;
}

/*End Quick Links*/
#ctl00_lblPackerName {
    width: 100%;
    display: block;
    text-transform: capitalize;
    border-bottom: 1pt solid #eee;
    margin-bottom: 10pt;
}

.sign-out {
    width: 100%;
    display: block;
}

.main .page-header {
    margin-top: 0;
}

/*Menu Tray*/

.menu-tray {
    width: 50vw;
    position: fixed;
    top: 45pt;
    left: 0;
    z-index: 1003;
    padding: 10pt;
    overflow: scroll;
}

    .menu-tray.collapse {
        display: none !important;
    }

    .menu-tray.in, .menu-tray.collapse.show {
        display: block !important;
        height: 100vh !important;
        z-index: 2002;
    }

        .menu-tray a i {
            margin-right: 10pt;
            line-height: 20pt;
            vertical-align: baseline;
            display: inline-block;
            min-height: 20pt;
        }

        .menu-tray a span.fas {
            float: right;
            margin-top: -4pt;
            line-height: 25pt;
        }

    .menu-tray h2 a span.fas {
        float: none;
        margin: auto;
        display: none !important;
    }

    .menu-tray h2 a.openNav span.fas:before {
        content: '\002b';
    }

    .menu-tray ul li ul li a span.fas {
        margin-top: 0;
    }

    .menu-tray ul li {
        margin-left: -30pt;
        padding: 0;
        clear: both;
        position: relative;
        list-style: none;
    }

        .menu-tray ul li a {
            padding: 5pt 10pt;
        }

        .menu-tray ul li li a {
            padding-left: 20pt;
            display: inline-block;
        }

        .menu-tray ul li li li a {
            padding-left: 40pt;
        }

        .menu-tray ul li li li li a {
            padding-left: 60pt;
        }

        .menu-tray ul li li li li li a {
            padding-left: 80pt;
        }

        .menu-tray ul li a.menuLink {
            display: block;
        }

    .menu-tray .fa-thumbtack, #accordion_menu_container .fa-times {
        position: absolute;
        top: 7.5pt;
        right: 12pt;
    }

        .menu-tray .fa-thumbtack:hover, #accordion_menu_container .fa-times:hover {
            cursor: pointer;
        }

    .menu-tray ul li ul li, .menu-tray ul li ul li:last-of-type {
        border: none;
    }

    .menu-tray ul .inner {
        overflow: hidden;
        display: none;
    }

    .menu-tray ul li a span {
        max-width: 85%;
        display: inline-block;
    }

    .menu-tray ul li a.toggle {
        width: 100%;
        display: block;
        transition: background .3s ease;
    }

    .menu-tray ul li a.toggle.active span.fa-chevron-right:before {
        content: "\f078";
    }

.simplebar-content {
    padding-bottom: 40pt !important;
}

#closeMainNav.collapse, #closePinNav.collapse {
    display: block !important;
    height: auto !important;
}

/*Pinned Reports*/

.menu-tray .pinned i, .pinnedMenuLink i {
    display: none !important;
}

.menu-tray .pinned li, .menu-tray .pinned li:last-of-type {
    border: none;
}

.menu-tray .pinned li {
    padding: 5pt 0;
    clear: both;
    border-bottom: 1px solid #636363;
    position: relative;
}

.menu-tray .pinned li span {
    font-size: 11pt;
}

.menu-tray .pinned li a {
        display: inline;
        padding: 5pt;
    }

.menu-tray .pinned .fas {
    display: inline;
    font-size: 8pt !important;
}

.menu-tray .fa-times:hover {
    cursor: pointer;
    transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    -webkit-transition: all ease-in-out 0.3s;
    -moz-transition: all ease-in-out 0.3s;
}
.removePin.pinnedLink.fas.fa-times {
    float: left
}

.pinned .fa-arrow-down, .pinned .fa-arrow-up {
    cursor: pointer;
}

.pinned .fa-arrow-down {
    position: absolute;
    top: -3px;
    right: 5px;
}

.pinned .fa-arrow-up {
    position: absolute;
    bottom: -3px;
    right: 5px;
}

    .pinned .fa-arrow-down:hover, .pinned .fa-arrow-up:hover {
        cursor: pointer;
        transition: all ease-in-out 0.3s;
        -o-transition: all ease-in-out 0.3s;
        -webkit-transition: all ease-in-out 0.3s;
        -moz-transition: all ease-in-out 0.3s;
    }

.menu-tray a.menu-cat-link i {
    font-style: normal;
    display: inline-block;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 2.4;
    font-weight: 900;
}


    .menu-tray a.menu-cat-link i.fa:before, .menu-tray a.menu-cat-link i:before {
        content: "\f054" !important;
    }

.menu-tray ul li li a.menu-cat-link {
    padding-left: 10pt;
}

.menu-tray ul li li li a.menu-cat-link {
    padding-left: 20pt;
}

.menu-tray ul li li li li a.menu-cat-link {
    padding-left: 40pt;
}

.menu-tray ul li li li li li a.menu-cat-link {
    padding-left: 60pt;
}

/************************************************** #Breadcrumb **********************************************************************/

.breadcrumb-nav {
    padding: 10pt 10pt;
    text-transform: uppercase;
    border-bottom: 1px solid #ccc;
    min-height: 40px;
    height: auto;
    position: fixed;
    z-index: 105;
    width: 100%;
    top: 45pt;
    left: 0;
}

.board.sales-user .breadcrumb-nav {
    z-index: 1000;
}


/************************************************** #General Purpose ****************************************************************/
.wrapper {
    height: 100%;
}

.table > thead > tr > th, .table > tbody > tr > td {
    padding: 8pt 11pt;
}

.table > thead > tr > th, .table > tbody > tr > td, .table > tfoot > tr > td, .table > thead > tr > th, .table > tfoot > tr > td {
    border-top-width: 0;
    padding: 8pt 11pt;
}

.ep-wrapper {
    padding: 20px 34px 100px 34px;
    max-width: 900px;
}

    .ep-wrapper label {
        text-transform: uppercase;
    }

.home-intro {
    padding: 0 0px 15px;
    margin-top: -5pt;
}

/*Modals*/

.modal-dialog {
    z-index: 1050;
    transform: translate3d(0px,0px,0px);
    backface-visibility: hidden;
    max-width: 100vw !important;
    overflow: auto !important;
}

.modal-body{
    max-height: 80vh;
    overflow: auto;
}

.modal-open .modal {
    overflow: hidden;
}

.modal-header h4, .modal-header h5 {
    margin: 0;
}

#modalBody .form-horizontal .checkbox label {
    position: relative;
    padding-left: 20px;
    margin: 10px 0;
}

#modalBody .form-horizontal .checkbox input {
    margin-top: 2px;
}

#modalBody .row div {
    padding-left: 0 !important;
}

.modal-header {
    border-radius: 2pt 1pt 0 0;
    padding: 10px 15px;
}

    .modal-header button.close {
        opacity: 1;
    }

#modalBody label {
    margin-top: 15px;
}

#modalBody .comment, #modalBody .dropdown, .full-select, .google-visualization-table-table, .google-visualization-table, .order-page-list-item-note-wrapper input {
    width: 100%;
}

/*End Modals*/


/*Order Pad loading image*/

.loading-indicator {
    padding: 15px;
}

.loading-image {
    margin-right: 15px;
    width: 16px;
    height: 16px;
    background-image: url(data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA%3D%3D);
    float: left;
}

/*Pinned Reports Background Processing Animation*/

.pinned .loading-animation img {
    height: 50px;
    width: 50px;
}

.pinned .loading-indicator {
    padding: 15px;
}

.pinned .loading-image {
    margin-right: 15px;
    width: 20pt;
    height: 20pt;
    background-image: url('../img/loading-image.svg');
    position: absolute;
    top: 5pt;
    right: -22px;
}



/**Pending Upload Animation for Opportunity Details and Board**/

@-webkit-keyframes title {
    0% {
        opacity: 0;
        right: 130px;
    }

    48% {
        opacity: 0;
        right: 130px;
    }

    52% {
        opacity: 1;
        right: 30px;
    }

    70% {
        opacity: 1;
        right: 30px;
    }

    100% {
        opacity: 0;
        right: 30px;
    }
}

@-moz-keyframes title {
    0% {
        opacity: 0;
        right: 130px;
    }

    48% {
        opacity: 0;
        right: 130px;
    }

    52% {
        opacity: 1;
        right: 30px;
    }

    70% {
        opacity: 1;
        right: 30px;
    }

    100% {
        opacity: 0;
        right: 30px;
    }
}

@-webkit-keyframes fade {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-moz-keyframes fade {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes spin-rotate {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spin-rotate {
    0% {
        -moz-transform: rotate(0);
        transform: rotate(0)
    }

    50% {
        -moz-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    100% {
        -moz-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes loading {
    0% {
        background-color: rgba(255, 255, 255, 0.2);
    }

    50% {
        background-color: rgba(255, 255, 255, 1);
    }

    100% {
        background-color: rgba(255, 255, 255, 0.2);
    }
}

.loading-animation img {
    height: 50px;
    width: 50px;
}

.loading-animation {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 200000;
    width: 100px;
    height: 40px;
    line-height: 40px;
    opacity: 0.7;
    border-radius: 4px;
    text-align: center;
    margin: 0 auto;
    padding: 2px 5px;
}

    .loading-animation span {
        display: inline-block;
        width: 10px;
        height: 10px;
        margin-left: 10px;
        border-radius: 100%;
        animation-name: loading;
        animation-duration: .5s;
        animation-iteration-count: infinite;
    }

        .loading-animation span:first-of-type {
            margin-left: 0px;
        }

    .loading-animation:nth-child(1) {
        margin-left: 0;
        animation-delay: .15s;
    }

/*End Loading Animation*/


.required {
    font-style: italic;
    padding: 4px 0;
}

.clearfix {
    width: 100%;
    clear: both;
}

.comment {
    display: block;
    box-shadow: none;
    margin: 10px auto;
}

.card-title h4 {
    font-weight: 600;
    float: left;
}

.card-title .btn {
    margin-top: 0;
    float: right;
    height: auto;
    padding: 5pt;
}

.card-footer {
    display: inline-block;
    width: 100%;
}

.no-shadow {
    box-shadow: none;
}

.ul-nostyles {
    list-style-type: none;
}

.checkbox label span {
    line-height: 22px;
    font-weight: normal !important;
    margin: 0 26px;
}

.footer {
    clear: both;
    width: 100%;
    text-align: center;
    margin: 10px auto;
    padding: 10px 0 0;
}

.timeStampTag {
    display: none;
    width: 240px;
    text-align: center;
    border-radius: 2pt;
    clear: both;
    margin: 0 auto 20px;
    padding: 4px 10px;
}

#footer-controls ul.navlist {
    float: left;
    list-style-type: none;
    margin: 4px 8px;
    padding: 0;
}

    #footer-controls ul.navlist li span {
        margin-right: 8px;
        padding: 0;
    }

.top-buffer-sm {
    padding-top: 14px;
}

.top-buffer-md {
    padding-top: 25px;
}

.top-buffer-lg {
    padding-top: 40px;
}

.right-buffer-sm {
    padding-right: 14px;
}

.bottom-buffer-sm {
    padding-bottom: 14px;
}

.bottom-buffer-md {
    padding-bottom: 25px !important;
}

.no-border {
    border: 0 !important;
}

.percent-86 {
    display: block;
    max-width: 845px;
    width: 86%;
    float: none;
    margin: 0 auto 10px !important;
}

.percent-95 {
    display: block;
    width: 95%;
    float: none;
    margin: 0 auto;
}


.panel-group .card {
    margin-bottom: 0;
    border-radius: 2pt;
}

.notice-alert {
    font-style: italic;
}

.row-full-height {
    height: 100%;
    margin: 10px 0 0px;
}

.col-full-height {
    height: 100%;
    vertical-align: middle;
}

.row-same-height {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.col-height {
    display: table-cell;
    float: none !important;
}

.ui-dialog.custSelect {
    z-index: 1100;
}

    .ui-dialog.custSelect .ui-widget-content a.close {
        margin-top: -7px !important;
        margin-bottom: 1px !important;
        float: right;
        clear: both;
        display: block;
        height: 20pt;
        line-height: 10pt;
        vertical-align: top;
        opacity: 0.9;
        border: none;
    }

.ui-dialog.custSelect {
    position: fixed !important;
    padding: 10px 1px;
    margin: 1em 0 3em;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 2pt;
    margin-left: 30px;
    min-height: 130px !important;
    top: 40pt !important;
}

    .ui-dialog.custSelect:before {
        content: "";
        position: absolute;
        border-style: solid;
        display: block;
        width: 0;
        top: -12pt;
        bottom: auto;
        right: 20pt;
        border-width: 0 15px 15px 15px;
    }

    .ui-dialog.custSelect:after {
        content: "";
        position: absolute;
        border-style: solid;
        display: block;
        width: 0;
        top: -11pt;
        bottom: auto;
        right: 20pt;
        border-width: 0 15px 15px 15px;
    }

    .ui-dialog.custSelect .ui-widget-content a {
        margin-top: 45pt;
        margin-bottom: -5px;
    }

    .ui-dialog.custSelect.ui-dialog .ui-dialog-titlebar-close {
        display: none;
    }

    .ui-dialog.custSelect .ui-dialog-titlebar {
        display: none;
    }

    .ui-dialog.custSelect .input-group .btn {
        margin-left: -2pt !important;
        margin-top: 0 !important;
        height: 28px;
        width: 39px;
        min-width: 20px;
    }

        .ui-dialog.custSelect .input-group .btn .fas {
            line-height: 1.55;
            margin-top: -2pt;
        }

.select-customer-wrapper {
    width: 100%;
}

    .select-customer-wrapper.input-group > .form-control {
        width: 1%;
    }

#selectCustomer .ui-autocomplete, #selectDocCustomer .ui-autocomplete {
    margin-top: -1pt;
    padding: 4pt;
    z-index: 2000;
    max-width: 209pt;
}

    #selectCustomer .ui-autocomplete li.ui-menu-item, #selectDocCustomer .ui-autocomplete li.ui-menu-item {
        list-style: none !important;
    }

.no-valid-customer-found {
    margin-top: 5pt;
    margin-bottom: -20pt;
}


.ui-dialog-buttons {
    height: 200px !important;
}

.ui-dialog .ui-dialog-content {
    height: auto !important;
}

.ui-widget-header {
    border: none !important;
    background: none !important;
}

input[type=number] {
    -moz-appearance: textfield;
}

::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

/*Error pages*/

.error-page-custom .breadcrumb-nav, .error-page-custom .navbar-toggle, .error-page-custom .logout-panel, .error-page-custom #most-fab, .error-page-custom .user-actions {
    display: none !important;
}

.error-page-custom {
    text-align: center;
}

.error-page-custom .container{
    max-width: unset;
}

.error-heading {
    padding: 20pt;
    margin-top: -10pt;
    margin-bottom: 15pt;
}

.error-page-custom h2, .error-page-custom h3 {
    font-weight: bold;
}

.error-page-custom h2 {
    margin-bottom: 0;
}

.error-page-custom h3 {
    margin-top: 0;
    margin-bottom: 5pt;
}

.error-page-custom p {
    margin: 20pt auto;
    text-align: left;
    padding: 0 20pt;
    max-width: 500px;
}

.error-page-custom .btn {
    height: 25pt
}

.error-page-custom .error-heading img {
    max-width: 70vw;
}

/*Optional Sub Nav*/

.sales-user-nav-btn {
    display: none;
}

.top-tabbed-navigation.collapse {
    display: block;
}

.top-tabbed-navigation {
    height: auto;
    position: fixed;
    z-index: 107;
    margin-top: 12pt;
    width: auto;
    background-color: #fff;
    top: 37pt;
    right: 0;
    text-align: right;
    padding: 0;
}

.top-tabbed-navigation label, .top-tabbed-navigation select{
	margin: 0;
	vertical-align: middle !important;
}

.reports .top-tabbed-navigation{
    top: 40pt;
}

    .top-tabbed-navigation ul {
        width: 100%;
        margin: 10pt -25pt 10pt 0 !important;
    }

   .doc-content .top-tabbed-navigation ul {
        width: 100%;
        margin: 5pt 0 !important;
        padding: 0;
    }


    .sidebar-header-right {
        margin: 0 10pt;
    }
    .top-tabbed-navigation li {
        display: inline-block;
        border-right-width: 1px;
        border-right-style: solid;
        border-right-color: #3c3c3c;
        font-size: 9pt;
        width: auto !important;
        padding: 0 5px;
    }

    .top-tabbed-navigation li:empty{
        display: none;
    }

    .reports .top-tabbed-navigation li input, .reports .top-tabbed-navigation li input:hover, .reports .top-tabbed-navigation li input:active, .reports .top-tabbed-navigation li input.focus{
        border:none !important;
    }



    .top-tabbed-navigation .dropdown {
        display: none;
        border-right: none;
    }

        .top-tabbed-navigation .dropdown .dropdown-menu {
            top: 20pt;
            border-top: none;
            border-radius: 1pt;
        }

        .top-tabbed-navigation .dropdown li {
            border-right: none;
            border-bottom: 1pt solid #ccc;
            width: 100% !important;
            padding: 5pt;
        }

    .top-tabbed-navigation li:last-of-type, .top-tabbed-navigation ul li:last-of-type {
        border: none !important;
    }

    .top-tabbed-navigation li ul li:last-of-type {
        border-right: 1pt solid;
    }

/*Locale Selector*/

.navbar-nav ul#localeSelect {
    float: left;
    margin-top: 9px;
    margin-right: 20px;
}

/* Hide language buttons after login. Should only select language on login screen. */
.sidebar ul#localeSelect{
    display:none;
}

ul#localeSelect{
    margin:0px;
    height:auto;
    padding: 0;
}

ul#localeSelect li {
    list-style: none;
    display: inline-block;
    margin-right: -5px;
    float: none;
    padding: 0;
}

ul#localeSelect li button {
    width: auto;
    height: 25px;
    margin-bottom: 10pt;
    padding: 0 3pt;
}

ul#localeSelect li button:hover, ul#localeSelect li button:focus, ul#localeSelect li button:active {
        transition: all ease-in-out 0.3s;
        -webkit-transition: all ease-in-out 0.3s;
        -moz-transition: all ease-in-out 0.3s;
        -o-transition: all ease-in-out 0.3s;
}

/*Date Picker Input*/

.date-large input, .date-small input{
	max-width: 100pt;
}

.date-small {
    display: none !important;
}

/************************************************** #ChangePassword *****************************************************************/

.change-password-contain {
    clear: both;
    padding-left: 25px;
    padding-top: 45pt;
    max-width: 99vw;
}

#ctl00_MainContent_updatePasswordBtn {
    width: 100% !important;
    text-align: center;
    font-weight: 600;
    margin: 10px auto;
    height: 15pt !important;
    max-width: 275pt;
    display: block;
}

    #ctl00_MainContent_updatePasswordBtn tbody, #ctl00_MainContent_updatePasswordBtn tr, #ctl00_MainContent_updatePasswordBtn td, #ctl00_MainContent_updatePasswordBtn_CD {
        display: inline-block;
        width: 100%;
        text-align: center;
        font-weight: 400;
    }

.change-password-contain h6 {
    line-height: 13pt;
}

/************************************************** #Reports ************************************************************************/

/*Styling fix for long list of saved views */

#ctl00_MainContent_ctl00_ddeLayouts_DDD_DDDC .dxgvDataRow_SoftOrange td.dxgv {
    width: 100%;
}

/*Pivots fill full width*/

#ctl00_MainContent_ctl00_pivotDisplay_ContainerTopPager{
    width: 100vw !important;
}

/*Add scroll to views list if long enough*/

#ctl00_MainContent_ctl00_ddeLayouts_DDD_PW-1.dxpc-ddSys {
    width: 100% !important;
    max-width: 233px;
}

#ctl00_MainContent_ctl00_ddeLayouts_DDD_PW-1.dxpc-ddSys .dxpc-mainDiv.dxpc-shadow {
    overflow: auto !important;
    height: auto !important;
    max-height: 80vh !important;
}

/**/

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border: 0;
    background: none;
}

#report-dt_wrapper label {
    font-weight: normal;
}

.btn-chart {
    display: inline-block;
}

    .btn-chart input[type="submit"] {
        border: 0;
        border-radius: 2pt;
        padding: 5px;
    }

.reports .top-tabbed-navigation li.dropdown {
    display: inline-block;
}

.reports .top-tabbed-navigation li.dropdown.advanced{
    border-left: 1px solid !important;
}

.reports .top-tabbed-navigation li.dropdown ul{
    left: 7px !important;
}

.reports .top-tabbed-navigation .dropdown-menu {
    top: 23pt;
}


.subnav-panel .btn-link, .doc-body .btn-link {
    font-weight: normal !important;
    padding: 0 5px !important;
}

    .subnav-panel .btn-link:hover {
        font-weight: normal !important;
        text-decoration: none;
    }

.subnav-panel .dxeButtonEditSys {
    width: 124pt;
    height: auto;
    display: inline-block;
    vertical-align: middle;
    line-height: 1em;
}

.subnav-panel .dxEditors_edtDropDown_SoftOrange {
    height: 16px !important;
}

div#report-dt_wrapper {
    width: 100%;
    min-width: 100%;
    overflow-x: auto;
    height: 100%;
    padding: 10pt;
}

#ctl00_MainContent_reportPanel {
    margin: -15pt 0 0;
    padding: 5pt;
}

#report-page-container{
    margin-top:12pt; /*Added to prevent overlap when closing custom params*/
}

#report-page-container .subnav-panel {
    margin: 0;
}

#report-display {
    min-width: 320px;
    width: 100%;
    padding: 45pt 0 0;
}

.pivot #ctl00_MainContent_reportPanel {
    padding-top: 61pt;
}

.pivot .row-offcanvas {
    overflow: auto;
    max-height: calc(100vh - 100pt);
}


#ctl00_MainContent_ctl00_rptPanel {
    width: auto !important;
}

.reports .footer {
    display: none !important;
}

/** Pivot/Chart **/

#report-display.pivot-wrapper {
    padding-top: 0px;
    margin-top: -20px;
}

.pivot.reports .full-height, .pivot .row-offcanvas {
    overflow: inherit !important;
}

#ctl00_MainContent_ctl00_pivotDisplay_pgArea3,
#ctl00_MainContent_ctl00_pivotDisplay_pgArea0 {
    white-space: nowrap !important;
}

.pivot .dxpc-shadow {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}


/* Custom Parameters */
.custom-query-params-select {
    position: relative;
    top: 0;
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    line-height: 1.428571429;
    background-image: none;
    border-radius: 4px;
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.custom-query-params .dxeEditArea_SoftOrange {
    margin-top: 0 !important;
}

.custom-query-params-min {
    display: inline-block;
    padding: 4px 0;
    width: 99.99%;
    margin-top: 30pt;
}

.custom-param-list-min {
    display: inline-block;
    padding: 6px 0 0 10px;
    float: left;
    margin-top: 0;
}

    .custom-param-list-min li {
        display: inline;
        padding-right: 8px;
        float: left;
    }

#ctl00_MainContent_ctl00_customParams_btnShowCustomParams {
    display: inline;
    margin: 0px 5px 0px 0px;
    width: 33px;
    height: 30px;
    background: transparent url('../img/plus-icon.png') no-repeat !important;
    background-position: 0 0;
    border: none;
    float: right;
    text-indent: -999999px;
}

.custom-query-params {
    margin-top: -6px;
    padding-bottom: 10px;
}

.hidden-param {
    display: none;
}

.custom-param-list-min li span {
    margin-right: 6px;
}

.custom-param-list {
    display: inline-block;
    padding: 6px 0 0 10px;
    max-width: 800px;
    width: 100%;
    float: left;
}

    .custom-param-list li {
        display: inline-block;
        padding: 5px;
        width: 46%;
        float: left;
    }

        .custom-param-list li span {
            display: inline-block;
            margin: 0 0 6px 0;
            width: 100%;
            float: none;
            clear: none;
        }

        .custom-param-list li input {
            display: inline-block;
            margin-top: 6px;
            max-width: 170px;
            width: 100%;
            clear: both;
            float: none;
        }

    .custom-param-list .dxeButtonEditSys, .custom-param-list .custom-query-params-text {
        display: block;
        width: 100%;
        height: 34px;
        padding: 6px 12px;
        line-height: 1.428571429;
        background-image: none;
        border: 1px solid #ccc;
        border-radius: 4px;
        -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    }

.param-warning {
    display: block;
    margin: 15px 15px 8px 15px;
    font-style: italic;
    clear: both;
}

.error-params-required {
    display: inline;
    width: 100%;
}

    .error-params-required li {
        display: block;
        width: 100%;
        font-style: italic;
    }

#ctl00_MainContent_ctl00_customParams_pnlCustomParams {
    display: inline-block;
    width: 100%;
    clear: both;
}

#ctl00_MainContent_ctl00_customParams_btnUpdate {
    margin-left: 15px;
    clear: both;
    float: none;
}

/*Delivery Document Report*/

#delivery-report-body {
    padding-top: 30pt;
}

#delivery-report #report-dt {
    width: 100% !important;
    min-width: 500px;
}

#delivery-report .row {
    margin: 0 -15px;
}

#delivery-report #report-dt td, #delivery-report #report-dt th {
    padding: 10pt 5pt !important;
}

    #delivery-report #report-dt td:nth-of-type(1), #delivery-report #report-dt th:nth-of-type(1) {
        width: 47pt !important;
        min-width: unset;
    }

    #delivery-report #report-dt td:nth-of-type(2), #delivery-report #report-dt th:nth-of-type(2) {
        width: 38pt !important;
        min-width: unset;
    }

    #delivery-report #report-dt td:nth-of-type(3), #delivery-report #report-dt th:nth-of-type(3) {
        width: 29pt !important;
        min-width: unset;
    }

#delivery-report {
    padding: 10pt 15pt;
}

    #delivery-report #report-dt_length select {
        margin: auto 2pt;
    }

.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter {
    text-align: left !important;
}

.sig-img {
    text-align: center;
}

    .sig-img img {
        max-width: 100%;
        width: 584px;
        height: auto;
        margin: auto;
    }

h5.route {
    margin-bottom: 5pt;
}

#delivery-report #report-dropdown {
    margin-left: 3pt;
}

.row.subnav-panel{
    margin-right: 0;
}

.chart-options:empty, .delete-all:empty, .default-view:empty {
	display:none;
}

/*Email Report*/

.email-modal {
    max-height: 95vh !important;
    border-radius: 2pt 2pt 0 0 !important;
    padding: 0 !important;
    margin-bottom: 10pt;
    overflow: hidden;
}

.email-modal .dxpc-header {
    margin: 0 !important;
    border-radius: 2pt 2pt 0 0 !important;
    padding: 10px 15px !important;
    font-weight: bold;
}

.email-scroll {
    overflow-x: hidden;
    max-height: 76vh;
    overflow-y: auto;
}

.dxeTextBox_SoftOrange.emInput input, .dxeButtonEditSys.emInput {
    height: 28px !important;
    display: inline-block !important;
    padding: 3px 5px !important;
    border-radius: 2pt !important;
    font-size: inherit !important;
    width: 100% !important;
}

.emInput {
    width: 100% !important;
}

.dxeListBox_SoftOrange.emInput{
    width: 300px !important;
}

.email-modal .row{
    padding: 10pt 0;
}

.email-modal .row .row{
    padding: 0 0 5pt;
}

.email-modal .row .row .col-12, .email-modal .row .row .col{
    padding-left: 0;
}

.email-modal .col-lg-2 span, .email-modal .col-lg-12 span{
    font-weight: bold !important;
    vertical-align: bottom;
    display: inline-block;
}

.email-modal .col-lg-10 .col-lg-12 span, .email-modal .col-lg-10 label{
    font-weight: normal !important;
}

.email-modal .col-lg-10 .col-lg-12 span{
    margin-top: 0 !important;
}

.email-modal .float-right{
    padding: 10pt 0;
    margin-bottom: 10pt;
}

.dxeMemo_SoftOrange td{
    padding: 0 !important;
}
.dxeMemo_SoftOrange td textarea{
    width: 100%;
}

.email-modal .dxeListBox_SoftOrange div.dxlbd, .email-modal .col{
    width: 300px !important;
    max-width: 300px !important;
}

.email-modal .customer-selection .dxeListBox_SoftOrange div.dxlbd{
    width: 100% !important;
    max-width: 100% !important;
}

.email-modal .customer-selection .dxeListBox_SoftOrange{
    max-width: 300pt !important;
}

#employee-recipient-select, #customer-recipient-select {
    height: 65pt;
}

.modal-content.email-modal{
    max-height: 95vh !important;
}

#email-document-modal{
    max-width: 600pt !important;
    width: 80vw;
}

.email-modal .modal-body {
    padding-top: 0;   
}

.email-modal .modal-footer{
    border: none;
}

.email-modal .checkbox{
    margin-left: 10pt;
}

#ctl00_MainContent_ctl00_ucEmlReport_puEmlReport_PW-1 {
    position: fixed !important;
    top: 2vh !important;
    left: 0 !important;
    right: 0 !important;
    margin: auto;
    max-width: 600pt !important;
    width: 80vw !important;
    display: block !important;
}

.email-modal .dxpc-content #ctl00_MainContent_ctl00_ucEmlReport_puEmlReport_pnlEmlReport{
    max-height: 90vh;
    max-width: 96vw;
    overflow-y: auto;
    overflow-x: hidden;
}

/************************************************** #Documents **********************************************************************/
/*copy and edit buttons*/

.doc-order-btns {
    position: fixed;
    top: 45pt;
    right: 0pt;
    z-index: 1100;
    padding: 5pt;
    text-align: right;
}

    .doc-order-btns .btn.odr-btn:hover, .doc-order-btns .btn.odr-btn:active {
        transition: all 1s ease-in-out;
    }

    .doc-order-btns .btn.qte-btn:hover, .doc-order-btns .btn.qte-btn:active {
        transition: all 1s ease-in-out;
    }

    .doc-order-btns .btn {
        padding: 4pt 3pt !important;
    }

/**/

/*Delivery Doc Status*/

#ctl00_MainContent_deliverySigNav {
    position: absolute;
    top: 6pt;
    right: 40pt;
}

/**/

.doc-content, .main-content-box {
    width: 70%;
    margin: 40pt auto;
    padding: 60pt 20pt;
    min-height: 500pt;
    max-width: 700pt;
    position: relative;
}

.table-responsive {
    width: 100%;
    margin-bottom: 15px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    border: 0;
}

.subheading-detail {
    padding: 10px 20px;
    font-style: italic;
}

#invoiceDetailsWrapper .address-wrapper, #deliveryDetailsWrapper .address-wrapper, #orderDetailsWrapper .address-wrapper {
    padding: 0 5pt;
    border: none;
}

    #invoiceDetailsWrapper .address-wrapper label, #deliveryDetailsWrapper .address-wrapper label, #orderDetailsWrapper .address-wrapper label {
        padding-right: 0;
        margin-left: 0
    }

    #invoiceDetailsWrapper .address-wrapper pre, #deliveryDetailsWrapper .address-wrapper pre, #orderDetailsWrapper .address-wrapper pre {
        background: none;
        border: none;
        color: inherit;
        margin: 0;
        padding: 0 !important;
    }

.billing-doc-info {
    margin-top: 32pt;
    padding-left: 20pt;
}

   .doc-wrapper .billing-doc-info .address-wrapper {
        margin-left: -10pt;
        margin-top: 20pt;
    }

.doc-content h1.float-right {
    margin-right: 10pt;
}

.doc-wrapper {
    margin-top: -30pt;
}

.doc-logo {
    position: absolute;
    top: -10pt;
    left: 15pt;
    max-width: 120pt;
    max-height: 80pt;
}

.btn-success.print {
    margin-left: -5pt;
    margin-top: 25pt;
}

.doc-header {
    margin-right: -10pt;
}

    .doc-header hr {
        margin: 2pt 0;
    }

    .doc-header label {
        display: inline-block;
        min-width: 80pt;
        margin-left: 5pt;
    }

    .doc-header span {
        display: inline-block;
        padding-left: 5pt;
    }
	
	
#orderDetailsWrapper .cp-table .notes, #invoiceDetailsWrapper .cp-table .notes, #deliveryDetailsWrapper .cp-table .notes, #paymentDetailsWrapper .cp-table .notes {
    border-left: none;
	border-right: none;
	height: auto;
	margin: auto;
}

.cp-table {
    margin: 40pt auto;
    min-width: 550pt;
}

    .cp-table td {
        font-weight: normal;
    }

    .cp-table thead tr {
        padding: 8px 0;
        height: 24px;
    }

            .cp-table thead tr td:first-child {
                padding-left: 5px;
            }

    .cp-table tbody tr {
        padding: 3px 0;
        height: 30px;
    }

        .cp-table tbody tr td:first-child {
            font-weight: 600;
            padding-left: 5px;
        }

    .cp-table tbody td {
        padding: 5pt 0;
    }

.faded-section-heading {
    display: block;
    margin-bottom: 5pt;
}

.doc-content .order-total {
    margin: 0 -15px 0 0;
    padding: 0;
    width: 214px;
    float: right;
    border: none;
}

    .doc-content .order-total li {
        padding: 4px 0;
        font-weight: 400;
        list-style-type: none;
        text-align: right;
    }

.doc-content .total-label {
    font-weight: bold;
    max-width: 80px;
    display: inline-block;
}

.doc-content .total-amount {
    width: 130px;
    display: inline-block;
}

.doc-content .f-order-notes {
    margin-top: 20pt;
}

    .doc-content .f-order-notes textarea {
        width: 100%;
        padding: 5pt;
    }

/************************************************** #TMC **********************************************************************/
.tmc-contain {
    padding: 0 10pt;
}

    .tmc-contain .dropdown-menu {
        top: -42pt;
        left: -66pt;
    }

        .tmc-contain .dropdown-menu > li > a {
            display: block;
            padding: 3px 20px;
            clear: both;
            font-weight: 400;
            line-height: 10pt;
            white-space: nowrap;
        }

    .tmc-contain .tmc-reports {
        height: auto;
    }

    .tmc-contain h1 {
        padding: 0 5pt 10pt;
    }

    .tmc-contain .dash-date-picker-wrapper {
        display: inline-block;
        padding: 0 0 10px;
        width: 410pt;
        float: left;
        margin-right: 0;
    }

.run-jobs .btn {
    margin: 0 auto 10px;
    clear: both;
    display: block;
    min-width: 100%;
}

.tmc-contain .table > thead:first-child > tr:first-child > th {
    text-transform: uppercase;
    min-width: 71px;
}

.tmc-contain .global-widgets-wrapper {
    margin-bottom: 0;
}

    .tmc-contain .global-widgets-wrapper ul {
        padding: 0;
        margin-bottom: -1px;
    }

.tmc-contain .nav-tabs > li.active > a, .tmc-contain .nav-tabs > li.active > a:hover, .tmc-contain .nav-tabs > li.active > a:focus, .tmc-contain .nav-tabs > li > a {
    border: none;
    border-radius: 0;
    padding: 0;
}

.tmc-contain .tab-content {
    margin-top: -45px;
}

.project-btns, #startJob, #addJobHours, #addMaterials {
    float: none;
    margin: auto;
    word-wrap: break-word;
}

.tmc-contain .nav-tabs {
    border-bottom: none;
}

.tmc-contain .global-widgets-wrapper ul li {
    padding: 10px;
    width: auto;
    list-style: none;
    display: inline-block;
    text-align: center;
}

.proj-select, .act-select {
    height: 100pt;
    padding: 10pt 20pt;
}

.project-btns h4, .project-btns h2 {
    margin-bottom: 0;
}

.project-btns h2 {
    margin-top: 10px;
}

.project-btns .btn-primary {
    background-color: transparent !important;
    position: absolute;
    top: 75px;
    right: 0px;
    border: none !important;
    outline: none !important;
}

.project-btns .proj-num {
    display: block;
}

.proj-actions .btn {
    border-radius: 1pt;
    width: 100%;
    margin: 4pt auto 6pt;
    height: 41pt;
}

.tmc-contain h3 {
    padding: 0 5pt 5pt;
    clear: both;
}

#startJob .input-group:nth-of-type(1), #addMaterials .input-group {
    padding: 0 10px 0 5pt;
}

#startJob .input-group:nth-of-type(2) div {
    padding: 5pt 10pt 0 5pt;
}

#startJob .btn, #addMaterials .btn, .tmc-actions .btn, #addJobHours .btn {
    margin: 20pt 10pt 20pt 10pt;
    min-width: 60pt;
    min-height: 20pt;
    float: right;
}

#addMaterials .warehouse-name, .project-num, .work-type {
    display: block;
}

.choose-list {
    width: 100%;
    position: absolute;
    top: 92pt;
    left: 0;
    padding: 10pt 10pt 0pt;
    z-index: 5;
    height: 35vh !important;
    overflow: auto;
}

    .choose-list input[type=checkbox], .choose-list label {
        margin-right: 4pt;
    }

    .choose-list input[type=checkbox] {
        vertical-align: text-bottom;
    }

    .choose-list ul {
        width: 100%;
        padding: 0;
        list-style: none;
        margin: 10pt 0pt 0pt;
    }

        .choose-list ul li {
            margin-right: -13px;
            margin-left: -13px;
            padding: 10px;
        }

            .choose-list ul li li {
                border-top: none;
                background-color: transparent !important;
                padding: 0 15pt;
                margin: 0;
            }

/*Class for hidden records in hour list*/
.hour-list tr.posted td {
    font-weight: bold;
}

/* Overrides the bootstrap panel for job forms*/
#formsParent .card {
    border: none;
    box-shadow: none;
    margin: inherit;
}


.tm-btns-contain {
    margin-top: 10pt;
    clear: both;
}

    .tm-btns-contain .btn {
        margin-left: 10pt;
    }


/************************************************** #DevEx Overrides ****************************************************************/

.dxpc-ddSys {
    border: none;
    padding: 4px !important;
}

#ctl00_MainContent_ctl00_ucEmlReport_puEmlReport_pnlEmlReportControls_cmbEmailAttachmentType_DDD_PW-1.dxpc-ddSys {
    position: fixed !important;
}

#ctl00_MainContent_ctl00_ucEmlReport_puEmlReport_pnlEmlReportControls_cmbEmailAttachmentType_DDD_PW-1.dxpc-ddSys .dxeListBox_SoftOrange{
    width: 100% !important;
}

.dxeCalendarToday_SoftOrange {
    border-radius: 2pt;
}

.dxeCalendarButton_SoftOrange {
    font-weight: 600;
    border-radius: 2pt;
}

.dxpLite_SoftOrange .dxp-num {
    font-weight: 600 !important;
    text-decoration: none !important;
}

.dxEditors_edtDropDown_SoftOrange {
    width: 10px !important;
    height: 10px !important;
    background: url(../img/caret.png) 50% 50% no-repeat transparent !important;
}

.dxeButtonEdit_SoftOrange {
    display: block;
    width: 100%;
    height: 24px;
    line-height: 1.42857;
    border-radius: 2pt;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    background-image: none;
    padding: 3px 12px 2px;
}

.dxeCalendar_SoftOrange, .dxpcLite_SoftOrange .dxpc-mainDiv {
    border-radius: 2pt;
}

.dxeListBoxItemSelected_SoftOrange:hover, #ulmenu ul li:hover, .expense-name-date input:hover, .sales-order-header h4:hover, .shipping-and-address h2:hover {
    cursor: pointer;
}

.dxbButton_SoftOrange, .btn-menu {
    padding: 4pt 10pt !important;
    line-height: 1em;
    border-radius: 2pt;
    border-radius: 2pt;
    font-weight: normal;
    border: 0;
    border-radius: 2pt !important;
    padding: 5pt;
}

.btn-menu{
    margin-right: 5pt;
}

.dxbButton_SoftOrange:hover, .dxbButton_SoftOrange:active, .dxbButton_SoftOrange:focus, .btn-menu:hover, .btn-menu:active, .btn-menu:focus {
    transition: all ease-in-out 0.3s;
    -webkit-transition: all ease-in-out 0.3s;
    -moz-transition: all ease-in-out 0.3s;
    -o-transition: all ease-in-out 0.3s;
    text-decoration: none;
}

.dxbButton_SoftOrange .dxb{
    padding: 0 !important;
    display: inline !important;
}

/******************************* ####Media Queries ********************************/

/******************************* #Desktops and LapTops ****************************/

@media all and (max-device-width: 1920px) {

    /*Support for iPad Pro max res*/

    .ui-dialog.custSelect {
        padding: 10px 1px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 2pt;
        min-height: 168px !important;
    }

        .ui-dialog.custSelect .ui-dialog-content {
            position: absolute;
            top: 0pt;
            left: 0;
            padding: 7pt;
            width: 100% !important;
        }
}

@media (max-width: 1280px) {
    /*Report display on customer profile sub nav*/

    .top-tabbed-navigation .dropdown {
        display: inline-block;
    }

    .top-tabbed-navigation .p-reports-full {
        display: none;
    }
}

@media (max-width: 1200px) {

    .col-lg-height {
        display: table-cell;
        float: none !important;
    }

}

/******************************* #Tablets *****************************************/

@media (hover: none) {
    *::-webkit-scrollbar-thumb {
        background-color: transparent;
    }
}

@media all and (max-width: 1082px) {

    .modal {
        max-height: 96vh;
    }

    input[type='text'].dxeEditArea_SoftOrange, input[type='password'].dxeEditArea_SoftOrange{
        height: 16pt !important;
    }

    .dxic input[type='text'].dxeEditAreaSys{
        margin-top: -3pt;
    }

    .reports .full-height{
        padding-bottom: 200pt;
    }

    .menu-tray {
        width: 100vw;
    }

    #accordion_menu_container {
        margin-bottom: 15vh;
    }
    
    #report-display{
        overflow: auto;
    }

    .navbar {
        padding: 0 10pt;
    }

    .navbar-header .user-action-btn {
        padding: 0 3pt;
        line-height: 9pt;
        width: 55pt;
        vertical-align: top;
        height: 35pt;
    }

    .export-button {
        display: none;
    }

    .change-password-contain {
        padding: 45pt 12pt;
    }

    /*Report display on customer profile sub nav*/

    .top-tabbed-navigation .dropdown {
        display: none;
    }

    .top-tabbed-navigation .p-reports-full {
        display: block;
    }

    .top-tabbed-navigation li ul li:last-of-type {
        border-right: none;
    }

    .reports .top-tabbed-navigation {
        top: 67pt;
    }

    body.modal-open {
        overflow: hidden !important;
        /*position:fixed; Had to remove for iPad*/
        max-width: 100%;
    }

    ul.top-tabbed-navigation {
        top: 68pt;
        width: 100vw;
        text-align: center;
        padding: 5pt 0;
    }

        ul.top-tabbed-navigation li, div.top-tabbed-navigation li {
            width: auto !important;
            display: block;
            padding: 5px;
            border-right: 0;
        }


    .reports .top-tabbed-navigation .dropdown-menu ul{
        padding: 0;
        border-top: 1pt solid #ccc !important;
    }

    /*Sub menu toggle*/

    .btn.sales-user-nav-btn {
        width: 20pt;
        height: 22pt;
        min-width: initial;
        color: #fff;
        background-color: #1565C0;
        font-weight: normal !important;
        display: block;
        position: fixed;
        top: 50pt;
        z-index: 106;
        left: unset;
        right: 2pt;
        border-radius: 10pt !important;
        box-shadow: none;
        text-align: center;
        padding: 0 !important;
    }

        .btn.sales-user-nav-btn span.fas {
            line-height: 1.4 !important;
        }

    .sales-user-nav-btn .fa-plus:before {
        content: "\f068";
    }

    .sales-user-nav-btn.collapsed .fa-plus:before {
        content: "\f067";
    }

    .top-tabbed-navigation li {
        text-align: center;
        padding-left: 0;
        padding-top: 10pt;
    }

    ul.top-tabbed-navigation {
        top: 67pt;
        width: 100vw;
        text-align: center;
        padding: 5pt 0;
    }

        ul.top-tabbed-navigation li {
            width: auto !important;
            display: block;
            border-bottom: 1px solid #E4E4E4;
            font-size: 14px;
            padding: 5px;
            border-right: 0;
        }

    .top-tabbed-navigation.collapse {
        display: none !important;
        width: auto;
        height: auto;
    }

        .top-tabbed-navigation.collapse.show {
            display: block !important;
            width: 100%;
        }

    .reports .top-tabbed-navigation .dropdown-menu {
        display: block;
        top: -13pt;
        width: 100vw;
        left: -4pt !important;
        right: unset !important;
        margin: auto !important;
        position: relative;
        text-align: center;
        border-top: 1pt solid #ccc;
        border-right: none;
        border-left: none;
    }

    .reports .top-tabbed-navigation li.dropdown.advanced {
        border-left: none !important;
    }

    .reports .top-tabbed-navigation li.dropdown ul {
        left: -4pt !important;
    }

    .reports .dropdown-toggle {
        display: none;
    }

    .subnav-panel .dxeButtonEditSys {
        margin-top: -20pt;
    }

    .reports .top-tabbed-navigation li, .reports .top-tabbed-navigation .dropdown-menu{
            border: none !important;
        }

        .reports .top-tabbed-navigation li a, .reports .top-tabbed-navigation li input{
            border-bottom: 1px solid #ccc !important;
            display: inline-block;
            width: 100%;
            line-height: 21pt;
            margin-top: -4px;
        }

        .reports .top-tabbed-navigation li input.dxeEditArea_SoftOrange{
            border: none !important;
            margin-top: 0pt;
        }

        .reports .subnav-panel .dxeButtonEditSys{
            margin-top: -2pt;
        }

        .reports .top-tabbed-navigation li a.dropdown-toggle{
            display: none;
        }


    /* Bootstrap Overides  */

    .form-control {
        padding: 3px;
    }

    .reports .top-tabbed-navigation .dropdown-menu {
        display: block;
        top: -13pt;
        width: 100vw;
        left: -4pt !important;
        right: unset !important;
        margin: auto !important;
        position: relative !important;
        text-align: center;
        border-top: 1pt solid #ccc;
        border-right: none;
        border-left: none;
        padding: 0;
    }

    .reports .dropdown-toggle {
        display: none;
    }

    .reports .logout-panel .dropdown-toggle{
        display: inline-block;
    }

    .subnav-panel .dxeButtonEditSys {
        margin-top: -20pt;
    }

    /* outer div */
    .row-offcanvas {
        position: relative;
        left: 0;
        -webkit-transition: left .3s ease-in;
        -mos-transition: left .3s ease-in;
        transition: left .3s ease-in;
    }

    #ulmenu ul li {
        padding: 5px 0 5px 14px;
    }

    .container-fluid > .navbar-header {
        margin-right: 0;
        margin-left: 0;
    }

    .navbar-inverse .navbar-toggle, .navbar-inverse .navbar-toggle:active, .navbar-inverse .navbar-toggle:focus {
        margin-top: 11pt;
        background-color: transparent;
        border: none;
        float: left;
    }

    .container-fluid {
        padding: 0;
        width: 100%;
    }

    /* Button Groups */
    .btn-group {
        width: 100%;
    }

    .btn-group {
        display: block;
        margin: 0 auto;
        float: none;
        max-width: 700px;
        width: auto;
    }

    .inner-widget-wrap {
        width: 100%;
        overflow-x: auto;
    }

}


@media (max-width: 1080px) {

    .row-offcanvas {
        position: relative;
        left: 0;
        -webkit-transition: left .3s ease-in;
        -mos-transition: left .3s ease-in;
        transition: left .3s ease-in;
    }

    .doc-sub-nav {
        left: 0 !important;
    }

    .no-left-right-padding {
        padding-right: 0;
        padding-left: 0;
    }

    .navbar-collapse.collapse {
        display: none !important;
    }

    .navbar-collapse.in {
        display: block !important;
    }

    .container-fluid > .navbar-header {
        margin-right: 0;
        margin-left: 0;
    }

        .navbar-inverse .navbar-toggle, .navbar-inverse .navbar-toggle:active, .navbar-inverse .navbar-toggle:focus {
            margin-top: 11pt;
            background-color: transparent;
            border: none;
            float: left;
        }

    .container-fluid {
        position: relative;
        padding: 0;
        width: 100% !important;
    }

    /* Bootstrap Overides  */
    .form-control {
        padding: 3px;
    }

    .login-panel {
        max-width: 320pt;
        padding: 20px;
    }

    .navbar-collapse.collapse {
        overflow: scroll !important;
    }

    /* outer div */
    .row-offcanvas {
        position: relative;
        left: 0;
        -webkit-transition: left .3s ease-in;
        -mos-transition: left .3s ease-in;
        transition: left .3s ease-in;
    }

    #ulmenu ul li {
        padding: 5px 0 5px 14px;
    }

    #fatal-error {
        max-width: 80vw;
    }
}

@media all and (max-width: 1024px) {

    .modal-body {
        max-height: 75vh;
        overflow: auto;
    }

    /*Sub menu toggle*/

    .btn.sales-user-nav-btn {
        width: 20pt;
        height: 22pt;
        min-width: initial;
        color: #fff;
        background-color: #1565C0;
        font-weight: normal !important;
        display: block;
        position: fixed;
        top: 50pt;
        z-index: 106;
        left: unset;
        right: 2pt;
        border-radius: 10pt !important;
        box-shadow: none;
        text-align: center;
        padding: 0 !important;
    }

        .btn.sales-user-nav-btn span.fas {
            line-height: 1.4 !important;
        }

    .sales-user-nav-btn .fa-plus:before {
        content: "\f068";
    }

    .sales-user-nav-btn.collapsed .fa-plus:before {
        content: "\f067";
    }

    .top-tabbed-navigation li {
        text-align: center;
        padding-left: 0;
        padding-top: 10pt;
    }

    ul.top-tabbed-navigation {
        top: 67pt;
        width: 100vw;
        text-align: center;
        padding: 5pt 0;
    }

        ul.top-tabbed-navigation li {
            width: auto !important;
            display: block;
            border-bottom: 1px solid #E4E4E4;
            font-size: 14px;
            padding: 5px;
            border-right: 0;
        }

    .top-tabbed-navigation.collapse {
        display: none !important;
        width: auto;
        height: auto;
    }

        .top-tabbed-navigation.collapse.show {
            display: block !important;
            width: 100%;
        }

    .reports .top-tabbed-navigation .dropdown-menu {
        display: block;
        top: -13pt;
        width: 100vw;
        left: -4pt !important;
        right: unset !important;
        margin: auto !important;
        position: relative;
        text-align: center;
        border-top: 1pt solid #ccc;
        border-right: none;
        border-left: none;
    }

	.reports .top-tabbed-navigation li.dropdown ul{
	    left: -4pt !important;
	}

    .reports .dropdown-toggle {
        display: none;
    }

    .subnav-panel .dxeButtonEditSys {
        margin-top: -20pt;
    }


    /*Mobile Tray*/

    .ui-dialog.custSelect {
        position: fixed !important;
        bottom: 0 !important;
        top: auto !important;
        left: 0 !important;
        margin-left: 0 !important;
        width: 100vw !important;
        height: 170px !important;
        margin-bottom: 0;
    }

    body.noScroll {
        position: fixed;
    }

    .pinned .fas-arrow-down:hover, .pinned .fas-arrow-up:hover {
        cursor: pointer;
    }

    .user-actions {
        display: none;
    }

    .user-action-btn {
        position: fixed;
        bottom: 10px;
        right: 10px;
        display: inline-block;
        cursor: default;
        z-index: 1001;
    }

    .op .user-action-btn{
        bottom: 60pt;
    }

    .user-action-btn.child {
        right: 20px;
        width: 200px;
        height: 55px;
        display: none;
        opacity: 0;
        border: none;
    }

    .user-action-btn.child i, #most-fab span{
        width: 42.66666667px;
        height: 42.66666667px;
        border-radius: 50%;
        text-align: center;
        float: right;
        clear: right;
        box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5), 3px 3px 3px rgba(0, 0, 0, 0.25);
    }
    
    #most-fab span{
        width: 64px;
        height: 64px;
        padding-top: 6pt;
    }

    #most-fab{
        border: none;
    }

    .user-action-btn.child span{
        display: inline-block;
        width: auto;
        text-align: center;
        padding: 1pt 5pt;
        border-radius: 3pt;
        margin-top: 10pt;
        margin-right: 10pt;
        float: right;
    }

    /*Documents*/

    .subnav-panel {
        width: 100vw;
        margin-top: 45pt;
    }

    .o-summary .billing-doc-info .address-wrapper {
        margin-left: -10pt;
    }

    .doc-content, .main-content-box {
        width: 90%;
        border: 0;
        padding: 30pt 10pt 30pt;
        min-height: 100%;
        margin: 40pt auto 20pt;
    }

    .print .doc-content, .print .main-content-box {
        min-height: inherit !important;
        margin: auto;
    }

        .doc-content h1.float-right {
            margin-right: 13pt;
        }

    .doc-header {
        margin-right: 0;
    }

    /***/

    #report-display.pivot-wrapper {
        max-width: 100vw;
    }

    i.fas.fas-calendar {
        display: none;
    }

    .navbar-toggle {
        display: block;
    }

    .no-left-right-margin {
        margin-right: 0;
        margin-left: 0;
    }

    .no-left-right-padding {
        padding-right: 0;
        padding-left: 0;
    }

    /* Button Groups */
    .btn-group {
        width: 100%;
    }

    .btn-group {
        display: block;
        margin: 0 auto;
        float: none;
        max-width: 700px;
        width: auto;
    }

    .delete-list-item {
        margin: 0;
    }

    .modal-backdrop {
        z-index: 1040;
    }

    .navbar-collapse.collapse {
        overflow: scroll !important;
    }

    .date-large {
        display: none;
    }

    .date-small {
        display: inline-block !important;
        margin-bottom: 8px !important;
    }

        .date-small input {
            line-height: 16px !important;
            text-indent: 4px;
			min-width: 75pt;
        }

    .mobile-tbl-wrapper {
        overflow-x: auto;
        width: 100%;
    }

    .inner-widget-wrap .table-responsive {
        max-width: 100vw;
    }

    .doc-order-btns {
        position: fixed;
        top: 45pt;
        right: 0;
        z-index: 106;
        width: 100%;
        text-align: right;
        padding: 5pt;
    }
}

@media all and (max-device-width: 994px) {

    .modal {
        left: 7vw;
    }

    .email-scroll {
        max-height: 76vh;
        overflow: auto;
        max-width: 72vw;
    }

    .order-item-heading .hidden-xs {
        display: none;
    }

    .search-list-item ul {
        max-width: 100%;
        min-width: 90%;
    }

    .main {
        width: 100% !important;
    }

    /* Dialog */
    .ui-dialog {
        top: 30px;
        left: 50%;
        display: block;
        width: 300px !important;
        height: 300px !important;
        margin-left: -150px;
    }

        .ui-dialog.custSelect {
            height: 150px !important;
        }

            .ui-dialog.custSelect .ui-dialog-content {
                position: absolute;
                top: 10pt;
                left: 0;
            }

}

@media (min-width: 992px) {
    .col-md-height {
        display: table-cell;
        float: none !important;
    }

    .main {
        padding-left: 0;
        padding-right: 0;
        height: 100%;
        min-height: 100%;
    }

    .no-left-right-margin {
        margin-left: 0;
        margin-right: 0;
    }

    .no-left-right-padding {
        padding-left: 0;
        padding-right: 0;
    }
}

@media all and (max-device-width: 840px) {

    .top-tabbed-navigation ul {
        margin: 0 2% 0 -40px !important;
    }

}


/******************************* #Phones ******************************************/

@media all and (max-width: 812px) {

    .top-logo img {
        max-width: 75pt;
    }

    .top-logo{
        padding: 0 5pt;
    }

    .modal {
        width: 95vw;
    }

    .modal-body{
        overflow:auto;
        padding-bottom: 10pt;
    }

    .menu-tray h2 a span.fas {
        display: inline-block !important;
    }

    #closeMainNav.collapse, #closePinNav.collapse {
        display: none !important;
        height: 0 !important;
    }

    .top-logo {
        height: 44.5pt;
    }

    .date-picker-wrapper {
        width: 100%;
    }

    .navbar-header .user-actions {
        display: none;
    }

    .table-responsive .table{
        min-width: 700px;
    }

    #selectCustomer .ui-autocomplete, #selectDocCustomer .ui-autocomplete {
        max-height: 100px;
        overflow-y: auto;
        overflow-x: hidden;
        padding-right: 20px;
    }

        #selectCustomer .ui-autocomplete li, #selectDocCustomer .ui-autocomplete li {
            margin: 0;
            padding: 0;
            zoom: 1;
            float: left;
            clear: left;
            width: 100%;
        }

    .ui-dialog.custSelect:before, .ui-dialog.custSelect:after {
        display: none
    }

    #email-document-modal, #ctl00_MainContent_ctl00_ucEmailReport_puEmailReport_PW-1 {
        width: 100vw !important;
    }

    .email-modal .dxpcContentPaddings_SoftOrange {
        max-height: 78vh;
    }

    .email-modal .row .row .col-12{
        padding-bottom: 10pt;
    }

    .email-modal .dxpc-content #ctl00_MainContent_ctl00_ucEmlReport_puEmlReport_pnlEmlReport{
        max-height: 77vh;
    }
}


@media (min-width: 768px) {
    .col-sm-height {
        display: table-cell;
        float: none !important;
    }

}

@media (max-device-width: 767px) {

    .col-height {
        display: block !important;
        margin-bottom: 10px;
        float: none !important;
    }

    .modal {
        left: 3vw;
    }


}

@media all and (max-device-width: 768px) {

    .top-tabbed-navigation ul {
        margin: 10px 27% 10px -40px !important;
        width: 100%;
    }

}

@media all and (max-device-width: 736px) {

    #paperContentWrapper h1.no-padding {
        margin-left: 10pt;
    }

    .login-panel {
        margin: -179px 0 0 -212px;
        width: 450px;
        border: none;
        padding: 0pt;
    }

    *::-webkit-scrollbar{
        width: 0;
        height: auto;
    }

}

@media all and (max-device-width: 568px) {

    .loading-animation {
        left: 37%;
    }

    body.modal-open {
        position: fixed;
    }

}

@media (max-width:568px) {

    .doc-logo {
        max-height: 50pt;
        max-width: inherit;
    }

    .doc-content, .main-content-box {
        width: 100%;
        border: 0;
        padding: 80pt 10pt 30pt;
        min-height: 100%;
        margin: -5px auto 20pt;
    }

    .doc-content h1.float-right {
        margin-top: 50pt;
        float: none !important;
        margin-bottom: 0;
    }

        .doc-body .doc-content h1.float-right {
            margin-top: 15pt;
            float: none !important;
            margin-bottom:inherit;
        }

    .billing-doc-info {
        margin-top: 20pt;
    }

    .billing-doc-info .address-wrapper {
        margin-left: 0;
        margin-bottom: 20pt;
    }

    .btn-success.print {
        margin-left: 0;
        margin-bottom: 10pt;
    }

    #orderDetailsWrapper .doc-content h1.float-right, #invoiceDetailsWrapper.doc-content h1.float-right {
        margin-top: 85pt;
    }


    /*Delivery Doc Status*/

    #ctl00_MainContent_deliverySigNav {
        position: absolute;
        top: 20pt;
        right: 40pt;
    }

    /**/

    .mobile-quick-lnks a {
        max-width: calc(100% / 6);
        width: auto;
    }

    .modal-content {
        max-height: 80vh;
    }
}

@media all and (max-device-width: 560px) {

    /* General UI*/
    .max-680 {
        width: 100% !important;
    }

    .subnav-panel-wrapper {
        width: 100%;
    }

    .subnav-panel {
        min-width: 320px;
    }

    #ctl00_MainContent_ctl00_customParams_btnShowCustomParams {
        position: fixed;
        right: 3px;
        z-index: 1032;
    }

    .modalBody {
        padding: 10px 5px !important;
    }

    .btn-group .btn {
        margin-top: 10pt;
    }

}

@media (max-width: 480px) {

    .main-card-contain {
        margin: 20% 0.5% 3%;
    }

    .login-page {
        padding-top: 20px;
    }

    .login-header {
        display: none;
    }

    .login-panel {
        margin: -200px 0 0 -150px;
        width: 300px;
        border: none;
        padding: 10pt;
    }

        .login-panel h1 {
            margin-top: 6px;
            padding-bottom: 15px;
        }

        .login-panel .form-group {
            margin-bottom: 0;
        }

    .login-logo {
        width: 120px;
    }

    .login-panel .card-body {
        padding: 0;
    }

    .mobile-quick-lnks a.ql-order{
        word-spacing: 100pt;
    }

    .mobile-quick-lnks a{
        margin-right: -8pt;
    }

}


@media all and (max-width: 467px) {

    .breadcrumb-nav {
        padding-right: 30pt;
    }

    ul.top-tabbed-navigation {
        top: 81pt;
    }

    .mobile-tbl-wrapper {
        overflow-y: auto;
        height: auto;
        width: 100vw;
        margin-bottom: 15px;
    }

    #report-display {
        padding-top: 25pt;
    }
}

@media (max-device-width:380px) {

    .doc-order-btns .btn {
        margin-bottom: 3pt;
    }

}

@media all and (max-device-width: 320px) {

    /*iPhone 5s - lowest supported mobile res*/


    .user-action-btn.child{
        height:31px;
    }

    .user-action-btn.child i{
        width: 30px;
        height: 30px;
    }

    .user-action-btn.child span{
        margin-top: 2pt;
    }

    .menu-expand {
        display: none;
    }

    .navbar-toggle {
        margin-left: -3pt;
    }

    #table#ctl00_MainContent_ctl00_puSaveAs_CLW-1 {
        max-width: 305px;
    }

    .doc-sub-nav .float-right {
        margin-right: 1% !important;
        margin-top: -6pt !important;
    }

    .billing-doc-info .address-wrapper {
        margin-left: 0;
        margin-bottom: 20pt;
    }

}

@media (max-height: 480px){

    .modal-header {
        height: 70pt;
    }

	/*Email Form button position*/
	
	.email-modal .float-right{
		marin-bottom: 15pt;
	}

    .email-scroll {
        max-height: 68vh;
    }

     /*Mobile Tray Landscape*/

    #most-fab {
        bottom: 20pt;
    }

    .user-action-btn.child {
        width: 66px;
        height: 70px;
        bottom: 20pt
    }

    .user-action-btn.child span {
        display: block;
        width: 50pt;
        text-align: center;
        margin-top: 5px;
        margin-right: auto;
        float: none;
        clear: both;
        line-height: 9pt;
    }

    .user-action-btn.child i, #most-fab span {
        text-align: center;
        clear: both;
        float: none;
        margin: auto;
        display: block;
    }


}

@media (max-height: 480px) and (max-width: 570px) {
    .user-action-btn.child {
        bottom: 37pt;
    }

    #most-fab {
        bottom: 48pt;
    }
}

/******************************* #Print ********************************************/

@media print {

    body {
        padding: 0 !important;
        background-color: #fff !important;
        margin: 0 !important;
        height: auto;
    }

    .breadcrumb-nav {
        display: none;
    }

    .main .footer {
        display: none;
    }

    .col-lg-8, .col-md-8, .col-lg-8.col-12 {
        width: 66% !important;
        max-width: 66%;
        float: left;
    }

    .col-lg-4, .col-md-4, .col-lg-4.col-12 {
        width: 33% !important;
        max-width: 33%;
        float: left;
    }

    .doc-content {
        border: none !important;
        width: 100%;
		margin: auto;
		min-height: inherit;
    }

    .o-summary.main-content-box{
        border: none;
    }

	@page{margin: 50mm auto;}

    #ctl00_MainContent_deliverySigNav {
        display: none;
    }

    .col-sm-6, .col-sm-6.col-12 {
        width: 50% !important;
        max-width:50%;
        float: left;
    }

    .col-md-2 {
        width: 16% !important;
        float: left;
    }


    .order-items-bar {
        border: 1px solid;
        border-right: none;
        border-left: none;
    }


    #pageHeaderBarRight, .doc-order-btns, .navbar, .menu-tray, .doc-sub-nav, .footer, #footer, #order-options.top-tabbed-navigation.show, #report-options.top-tabbed-navigation.show {
        display: none !important;
    }

    .order-form-wrapper {
        border: none;
    }

    .stamp {
        display: none;
    }

    .f-codename button {
        display: none;
    }

    .btn {
        display: none !important;
    }

    h1.float-right {
        margin-bottom: 40pt;
    }
    
    .alert-success, .alert-danger { border:none; }

    .user-action-btn{
        display: none;
    }
}

/*End Print*/