/*================================================================================
	Item Name: Robust - Responsive Admin Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
/*Overriding*/

/*this is fix for page flickering on Keyup or KeyDown because of Scroll bar*/
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

/*increasing popover width*/
.popover {
    max-width: 292px !important;
}

#CustomerPolicyDisplay {
    min-width: 100%;
    min-height: 100%;
    overflow: hidden;
    position: absolute;
    border: none;
    left: 0;
    top: 0;
    z-index: -1;
}
/*increasing poover width*/
.popover {
    max-width: 292px !important;
}
/*//view line summary popup header*/
.PopupHeaderBackground {
    background-color: #CC0000 !important;
}

/*form Device catalog col width altering*/
@media (min-width: 768px) and (max-width: 840px) {
    #myTabs {
        flex: 0 0 80.333333% !important;
        max-width: 80.333333% !important;
    }

    .WidthInc {
        flex: 0 0 19.666667% !important;
        max-width: 19.666667% !important;
    }
}



@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
}

/*related stop view orders page chart alignment*/
@media screen and (max-width: 768px) {
    #OrderCountChart {
        margin-top: -1.4em;
    }
}

.menu-content menu-popout ps-container ps-theme-dark {
    top: 0px !important;
}

input[type=text]::-webkit-search-results-decoration {
    display: none;
}

.btnClearDevice {
    margin-left: -40px;
    z-index: 100;
    margin-bottom: 3px;
    margin-right: 2px;
    margin-top: 3px;
    padding-right: 4px;
}

input[type=text]::-ms-clear {
    display: none;
}

@media (min-width: 769px) and (max-width: 1025px) {

    #txtViewAnyDevice {
        width: 85.8% !important;
    }
}

.main-menu {
    top: 100px !important;
}

.tdLeftAlign {
    text-align: left !important;
}

@media only screen and (max-width:1024px) {
    #lblCustomerData {
        line-height: 2.6rem !important;
    }

    .Mobileoverflow {
        overflow: scroll !important;
    }
}


.navbar-collapse {
    padding-top: 10px !important;
}

.tooltip-ex { /* Container for our tooltip */
    position: relative;
    display: inline-block;
}

    .tooltip-ex .tooltip-ex-text { /* This is for the tooltip text */
        visibility: hidden;
        width: 100%;
        background-color: #231F20;
        color: white !important;
        text-align: center;
        padding: 10px;
        font-size: 10px;
        border-radius: 10px;
        position: center; /* This defines tooltip text position */
        z-index: 1;
    }

    .tooltip-ex:hover .tooltip-ex-text { /* Makes tooltip text visible when text is hovered on */
        visibility: visible;
    }



/*Chat bot button styles*/
.open-button {
    background-color: transparent;
    border-radius: 50%;
    color: white;
    padding: 5px 5px;
    border: none;
    cursor: pointer;
    position: fixed;
    bottom: 1px;
    right: 1px;
}


/*start center alignment of login page heading text*/
@media screen and (max-width: 768px) {
    .topnav, .topnav-right {
        float: none;
        display: block;
    }

    .topnav-centered {
        position: relative;
        top: 0;
        left: 0;
        transform: none;
    }
}



@media screen and (max-width: 377px) {
    .nav.nav-tabs.nav-linetriangle > li {
        padding: 10px;
    }
}

.topnav-centered {
    float: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
/* end center alignment of login page heading text*/

/*Button size for small devices*/
@media only screen and (max-width: 414px) {
    #btnOrderReviewPrevious {
        margin-bottom: 2px;
    }
}

/*nav bar height*/
.header-navbar {
    min-height: 100px;
    z-index: 999 !important;
}

/*Order Approval alighnment*/
@media only screen and (max-width: 414px) {
    .Userbg {
        height: 550px;
    }
}

@media only screen and (min-width: 765px) {
    .Userbg {
        height: 385px;
    }
}


/*content wrapper*/
html body .content .content-wrapper {
    padding: 4.2rem 2.2rem 0.3rem 3.5rem;
    padding-top: 4.2rem;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    /*brand logo*/
    .header-navbar .navbar-header .navbar-brand .brand-logo .brandLogoLogin .brandLogoPierce {
        width: 193px !important;
        padding-top: 0.6rem !important;
        min-width: 100px !important; /*for ipad to increase logo size*/
        min-height: 35px !important; /*for ipad to increase logo size*/
    }
}
/*brand logo*/
.header-navbar .navbar-header .navbar-brand .brand-logo .brandLogoLogin .brandLogoPierce {
    /*width: 85px;*/
    /*padding-top: 0.3rem;*/
    /*min-width: 150px;*/ /*for ipad to increase logo size*/
    min-height: 38px; /*for ipad to increase logo size*/
    /*max-height:70px;*/
}

/*main menu*/
.main-menu {
    top: 100px !important;
}

.navbar-toggle {
    /* (80px - button height 34px) / 2 = 23px */
    margin-top: 20px;
    padding: 9px 10px !important;
}

@media (min-width: 768px) {
    .navbar-nav > li > a {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        padding-top: 26.5px;
        /*padding-bottom: 35.5px !important;*/ /*commented for center aligning the heder lis*/
        line-height: 45px !important;
    }
}


.header-navbar.navbar-border {
    /*border-bottom: 2px solid rgba(0, 0, 0, 0.1);*/
    border-bottom: solid 2px #CC0000;
}


/*Mainmenu hover*/
.modal-content {
    z-index: 99999 !important;
}


/* Adjust Table column width in Desktop*/
@media (min-width: 768px) {
    .TableTd {
        width: 30% !important;
        padding-right: 1px !important;
    }
}
/* Adjust Table column width in Mobile*/
@media (min-width: 320px) and (max-width: 480px) {

    .TableTd {
        width: 50% !important;
        padding-right: 1px !important;
    }
}

.margintop-5px {
    margin-top: 5px;
}

.displayMenuNone {
    display: inline-block;
}

@media (min-width: 768px) and (max-width: 1199px) { /*code to hide the the other menu icon  heading text in ipad pro*/
    .displayMenuNone {
        display: none !important;
    }
}

/*menu hover*/
.navbar-expand-md .navbar-nav .dropdown-menu-right {
    right: 0;
    left: auto;
    top: 0 !important;
    margin-top: 50px !important;
    /*overflow-y: scroll;*/
}

.activeLink {
    pointer-events: all;
    cursor: pointer;
}


/* loading animation */
@keyframes lds-facebook_1 {
    0% {
        top: 36px;
        height: 128px;
    }

    50% {
        top: 60px;
        height: 80px;
    }

    100% {
        top: 60px;
        height: 80px;
    }
}

@-webkit-keyframes lds-facebook_1 {
    0% {
        top: 36px;
        height: 128px;
    }

    50% {
        top: 60px;
        height: 80px;
    }

    100% {
        top: 60px;
        height: 80px;
    }
}

@keyframes lds-facebook_2 {
    0% {
        top: 41.99999999999999px;
        height: 116.00000000000001px;
    }

    50% {
        top: 60px;
        height: 80px;
    }

    100% {
        top: 60px;
        height: 80px;
    }
}

@-webkit-keyframes lds-facebook_2 {
    0% {
        top: 41.99999999999999px;
        height: 116.00000000000001px;
    }

    50% {
        top: 60px;
        height: 80px;
    }

    100% {
        top: 60px;
        height: 80px;
    }
}

@keyframes lds-facebook_3 {
    0% {
        top: 48px;
        height: 104px;
    }

    50% {
        top: 60px;
        height: 80px;
    }

    100% {
        top: 60px;
        height: 80px;
    }
}

@-webkit-keyframes lds-facebook_3 {
    0% {
        top: 48px;
        height: 104px;
    }

    50% {
        top: 60px;
        height: 80px;
    }

    100% {
        top: 60px;
        height: 80px;
    }
}

.lds-facebook {
    position: relative;
}

    .lds-facebook div {
        position: absolute;
        width: 30px;
    }

        .lds-facebook div:nth-child(1) {
            left: 35px;
            background: #0c9be9;
            -webkit-animation: lds-facebook_1 1s cubic-bezier(0, 0.5, 0.5, 1) infinite;
            animation: lds-facebook_1 1s cubic-bezier(0, 0.5, 0.5, 1) infinite;
            -webkit-animation-delay: -0.2s;
            animation-delay: -0.2s;
        }

        .lds-facebook div:nth-child(2) {
            left: 85px;
            background: #187efc;
            -webkit-animation: lds-facebook_2 1s cubic-bezier(0, 0.5, 0.5, 1) infinite;
            animation: lds-facebook_2 1s cubic-bezier(0, 0.5, 0.5, 1) infinite;
            -webkit-animation-delay: -0.1s;
            animation-delay: -0.1s;
        }

        .lds-facebook div:nth-child(3) {
            left: 135px;
            background: #0054bb;
            -webkit-animation: lds-facebook_3 1s cubic-bezier(0, 0.5, 0.5, 1) infinite;
            animation: lds-facebook_3 1s cubic-bezier(0, 0.5, 0.5, 1) infinite;
        }

.lds-facebook {
    width: 200px !important;
    height: 200px !important;
    -webkit-transform: translate(-100px, -100px) scale(1) translate(100px, 100px);
    transform: translate(-100px, -100px) scale(1) translate(100px, 100px);
}

.outer {
    display: table;
    height: 100%;
    width: 100%;
}

.middle {
    display: table-cell;
    vertical-align: middle;
}

.inner {
    margin-left: auto;
    margin-right: auto;
    width: 400px;
    /*whatever width you want*/
}
/* loading animation */


/* Loading Open */
body.loading-open {
    overflow: hidden;
}
/* Loading Open */


/*autocompleteStyles*/
.autocomplete-items {
    border: 0.5px solid;
}

    .autocomplete-items > div {
        padding: 5px;
        border-bottom: 0.1px solid;
    }

    .autocomplete-items:hover {
        cursor: pointer;
    }

.autocomplete-suggestions {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #999;
    background: #FFF;
    cursor: default;
    overflow: auto;
    -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
    -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
    box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64);
}

.autocomplete-suggestion {
    padding: 2px 5px;
    white-space: nowrap;
    overflow: hidden;
}

.autocomplete-no-suggestion {
    padding: 2px 5px;
}

.autocomplete-selected {
    background: #F0F0F0;
}

.autocomplete-suggestions strong {
    font-weight: bold;
    color: #000;
}

.autocomplete-suggestions strong {
    font-weight: bold;
    color: #000;
}

.autocomplete-group {
    padding: 2px 5px;
    font-weight: bold;
    font-size: 16px;
    color: #000;
    display: block;
    border-bottom: 1px solid #000;
}

.ui-menu-item-odd {
    padding: 5px;
    border: 1px solid #ececec !important;
    background-color: #E7E7E7 !important;
    border-collapse: collapse;
    font-size: 1em !important;
}


.ui-menu-item {
    padding: 5px;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #ddd;
    border-collapse: collapse;
    background-color: #F7F7F7;
    font-size: 1em !important;
}

.ui-widget-content {
    max-height: 200px;
    overflow: auto;
}

.ui-autocomplete-input {
    font-size: 1em !important;
}

.fontCustom {
    font-size: 1.5rem;
}

/*To avoid Wrapping of date in cards*/
@media only screen and (max-width:1500px) {
    .fontCustom {
        font-size: 1rem !important;
    }
}

.morris-hover.morris-default-style {
    border-radius: 3px;
    padding: 1px 1px;
    color: #FFF;
    background: rgba(0,0,0,0.7);
    border: solid 1px rgba(0,0,0,0.8);
    font-family: sans-serif;
    font-size: 0.9rem;
    text-align: center
}

.btn-info {
    border-color: #CC0000 !important; /*231F20;*/
    background-color: #CC0000 !important; /*#231F20 !important;*/
    color: #FFFFFF;
}

.btn-info-back {
    border-color: #CC0000 !important;
    background-color: #CC0000 !important;
    color: #FFFFFF;
}

.btn-info-next {
    border-color: #CC0000 !important;
    background-color: #CC0000 !important;
    color: #FFFFFF;
}

.btn-info-next {
    border-color: #CC0000 !important;
    background-color: #CC0000 !important;
    color: #FFFFFF;
}

    .btn-info-next:hover {
        border-color: #990000 !important;
        background-color: #990000 !important;
        color: #FFF !important;
    }

.btn-info-back:hover {
    border-color: #990000 !important;
    background-color: #990000 !important;
    color: #FFF !important;
}

.ui-widget-content {
    z-index: 99999 !important;
}


@media only screen and (max-width:414px) {
    .col-sm-8, .col-md-8, .col-lg-8, .col-xl-8 {
        position: relative;
        width: 100%;
        min-height: 1px;
        padding-right: 25px;
        padding-left: 25px;
    }
}

.address-form-card-body {
    flex: 1 1 auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

@media only screen and (max-width:414px) {
    .table-responsive {
        display: block;
        width: 100%;
        overflow-x: scroll;
    }
}

@media only screen and (max-width: 575px) {
    .sameline {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

.headerspace {
    margin-bottom: 10px;
}

.actionddl {
    /* (80px - line-height of 27px) / 2 = 26.5px */
    width: 100%;
    margin-left: -17%;
}

@media (min-width: 1921px) and (max-width:2560px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: -42%;
    }
}

@media (min-width: 1681px) and (max-width:1920px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: -37%;
    }
}

@media (min-width: 1537px) and (max-width:1680px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: -34%;
    }
}

@media (min-width: 1367px) and (max-width:1536px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: -30%;
    }
}

@media (min-width:1024px) and (max-width: 1120px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: -6%;
    }
}

@media (min-width:1280px) and (max-width: 1366px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: -24%;
    }
}

@media (max-width: 414px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 76%;
        margin-left: 12%;
    }
}

@media (min-width:414px) and (max-width: 768px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: 10%;
    }
}

@media (min-width:770px) and (max-width: 1024px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: 1%;
    }
}
/*@media (min-width:1336px) {
    .actionddl {
        width: 100%;
        margin-left: -53px;
    }
}*/
@media (min-height:545px) {
    .actionddl {
        /* (80px - line-height of 27px) / 2 = 26.5px */
        width: 100%;
        margin-left: -40%;
    }
}

.ui-state-focus {
    background-color: grey !important;
}

@media only screen and (max-width: 700px) {
    /* For mobile phones: */
    .BluepageHeader {
        margin-top: 20px !important;
        margin-left: 0px !important;
        max-height: 55px !important;
        max-width: 230px !important;
        float: left !important;
    }
}

/*on mouse hovering otherMenus*/
.hoverbg:hover {
    background-color: #F5F5F5;
}

.hoverbg {
    height: 43px;
    padding-top: 6px;
    vertical-align: middle;
}

/*Chat box*/
@charset "utf-8";
/* CSS Document */

/* ---------- GENERAL ---------- */

/*body {
    background: #e9e9e9;
    color: #9a9a9a;
    font: 100%/1.5em "Droid Sans", sans-serif;
    margin: 0;
}

a {
    text-decoration: none;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

h4, h5 {
    line-height: 1.5em;
    margin: 0;
}

hr {
    background: #e9e9e9;
    border: 0;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 1px;
    margin: 0;
    min-height: 1px;
}

img {
    border: 0;
    display: block;
    height: auto;
    max-width: 100%;
}

input {
    border: 0;
    color: inherit;
    font-family: inherit;
    font-size: 100%;
    line-height: normal;
    margin: 0;
}

p {
    margin: 0;
}

.clearfix {
    *zoom: 1;
}*/
/* For IE 6/7 */
/*.clearfix:before, .clearfix:after {
        content: "";
        display: table;
    }

    .clearfix:after {
        clear: both;
    }*/

/* ---------- LIVE-CHAT ---------- */

#live-chat {
    bottom: 40px;
    /* font-size: 12px; */
    right: 65px;
    position: fixed;
    width: 300px;
    z-index: 9999;
}

    #live-chat header {
        /* background: #293239;*/
        background: #007ac0;
        border-radius: 5px 5px 0 0;
        color: #fff;
        cursor: pointer;
        padding: 16px 24px;
    }

    #live-chat h4:before {
        background: #1a8a34;
        border-radius: 50%;
        content: "";
        display: inline-block;
        height: 8px;
        margin: 0 8px 0 0;
        width: 8px;
    }

    #live-chat h4 {
        font-size: 12px;
    }

    #live-chat h5 {
        font-size: 10px;
    }

    #live-chat form {
        padding: 24px;
    }

    #live-chat input[type="text"] {
        border: 1px solid #ccc;
        border-radius: 3px;
        padding: 8px;
        outline: none;
        width: 234px;
    }

.chat-message-counter {
    background: #e62727;
    border: 1px solid #fff;
    border-radius: 50%;
    display: none;
    font-size: 12px;
    font-weight: bold;
    height: 28px;
    left: 0;
    line-height: 28px;
    margin: -15px 0 0 -15px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 28px;
}

.chat-close {
    display: none !important;
    background: #3ab0b7;
    border-radius: 50%;
    color: #fff;
    display: block;
    float: right;
    font-size: 14px;
    height: 16px;
    line-height: 16px;
    margin: 2px 0 0 0;
    text-align: center;
    width: 16px;
}

    .chat-close:hover {
        background: #3ab0b7;
    }

.chat {
    background: #fff;
}

.chat-history {
    height: 252px;
    padding: 8px 24px;
    overflow-y: scroll;
}

.chat-message {
    margin: 16px 0;
}

    .chat-message img {
        border-radius: 50%;
        float: left;
    }

.chat-message-content {
    margin-left: 56px;
}

.chat-time {
    float: right;
    font-size: 10px;
}

.chat-feedback {
    font-style: italic;
    margin: 0 0 0 80px;
}
/*Chat box end*/

/*For Azure Search*/
.autocomplete-items-azure {
    position: absolute;
    background: #fff;
    padding: 26px;
    line-height: 1.3;
}

    .autocomplete-items-azure > div {
        border: none;
    }

#myUl {
    left: 60px;
    overflow: auto;
    border: none;
}
/*Device catalog -display carriers in single row in mobile view*/
@media only screen and (max-width: 414px) {
    #divCarrierTabs {
        display: -webkit-box;
        flex-wrap: wrap;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
    }
}

@media screen and (max-width: 768px) {
    .topnav, .topnav-right {
        float: none;
        display: block;
    }

    .topnav-centered {
        position: relative;
        top: 0;
        left: 0;
        transform: none;
    }
}

.topnav-centered {
    float: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #e6f7ff;
}


.Qv-font {
    font-family: "Muli", Georgia, "Times New Roman", Times, serif;
}

.ui-slider-range {
    background: #CC0000 !important;
    border-color: transparent;
}

.ui-slider-handle:nth-last-of-type(n+2) {
    background: #CC0000;
    border-color: transparent;
    width: 1em;
}


.ui-slider-handle:nth-of-type(2n+1) {
    background: #CC0000; /*rgb(139, 24, 27);*/
    border-color: transparent;
}

#wfilterPrices {
    z-index: 99 !important;
}


/*Price slider Values Width*/
.ui-slider-vertical.ui-slider-pips .ui-slider-label {
    width: 4.5em !important;
}
/*Price slider Values tooltip Width*/
.ui-slider-vertical.ui-slider-float .ui-slider-tip, .ui-slider-vertical.ui-slider-float .ui-slider-tip-label {
    width: 4.5em !important;
}
/*Start*/
/*Style related to Nav tabs colosrs in international Travel and Order accessories*/
.nav.nav-tabs.nav-linetriangle .nav-item a.nav-link.active {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom-color: #CC0000 !important;
    color: #CC0000 !important;
}

/*Add class to completed step to indicate step is completed*/
.StepCompleted {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-bottom-color: #CC0000 !important;
    color: #CC0000 !important;
}

.nav.nav-tabs.nav-linetriangle .nav-item a.nav-link.active:before {
    margin-left: -11px;
    border-width: 12px;
    border-top-color: #CC0000 !important;
}

.PrimaryColor {
    color: #CC0000 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-bottom-color: #CC0000 !important;
    color: #CC0000 !important;
    border-top-color: #CC0000 !important;
}

.nav.nav-tabs.nav-linetriangle {
    border-bottom-color: #CC0000 !important;
}
/*Style related to Nav tabs colosrs in international Travel and Order accessories*/
/*End*/


/*progress or loading bar color*/
html body .pace .pace-progress {
    background: #CC0000 !important;
}

/*Tables header colors*/
.TableHeadColor {
    color: white;
    background-color: #CC0000 !important;
}

.sideBysideImg {
    float: left;
    /*width: 33.33%;*/
    padding: 5px;
}

/*close buttton styling*/
.CloseAccessoriesModel {
    padding: 0;
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
}

/*Style for Alret ribbons on errors and success messages*/
.alertDiv {
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.21rem;
}

.KendoGridHeader {
    font-weight: bold !important;
    color: black !important;
    text-align: center !important;
}

.brand-logo {
    max-width: 66% !important;
}

.brandLogoPierce {
    max-width: 66% !important;
}

/*disable click event*/
.disableClick {
    pointer-events: none;
    opacity:0.2;
    cursor: default;
}

div.w3-display-middle {
    position: absolute !important;
    bottom: 45% !important;
    right: 25% !important;
    /* width: 300px; */
    /* border: 3px solid #73AD21; */
    padding: 10px !important;
    font-size: 20px !important;
}
.tableTdPadding {
    padding: 0.75rem 1.5rem !important;
    padding-bottom: 0.25rem !important;
    padding-top: 0.25rem !important
}