body {
    font-family: 'CircularStd-Book';
}

.font-nunito {
    font-family: 'CircularStd-Book';
}

.font-Raleway {
    font-family: 'CircularStd-Book';
}

@font-face {
    font-family: 'CircularStd-Black';
    src: url('../fonts/CircularStd-Black.woff2') format('woff2'), url('../fonts/CircularStd-Black.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CircularStd-Book';
    src: url('../fonts/CircularStd-Book.woff2') format('woff2'), url('../fonts/CircularStd-Book.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}


a.circle-menu {
    padding: 19px 10px 15px 10px !important;
}

    a.circle-menu em {
        padding: 10px;
        border-radius: 50%;
        font-size: 16px;
        background-color: rgba(255,255,255,.2);
    }

.font_OpenSans {
    font-family: 'CircularStd-Book';
}

.f-9 {
    font-size: 9px;
}

a.nav-icon {
    line-height: 28px !important;
    padding: 16px 21px 10px 21px !important;
}

/*.digi-font {
    font-family: 'Sarpanch' !important;
}*/
.digi-font {
    font-family: 'CircularStd-Book';
    font-weight: 600;
}

.font-Sarpanch {
    font-family: 'CircularStd-Book';
}

.radious-0 {
    border-radius: 0px !important;
}

.pl2 {
    padding-left: 2px !important;
}

.dropdown-menu > li > a {
    color: #333;
    font-weight: 300;
}

.td-4-8 td {
    padding: 4px 8px !important;
}

.td-6-8 td {
    padding: 6px 8px !important;
}

.text-normal {
    font-weight: 400 !important;
}

.tr-nowrap td, .white-space-nowrap {
    white-space: nowrap;
}

.btn-group-more .dropdown-toggle {
    cursor: pointer;
    padding: 1px 5px;
}

.btn-group-more.open .dropdown-toggle {
    color: #56a0ed;
    box-shadow: none;
}

.btn-group-more > .dropdown-menu {
    margin-top: 6px;
}

    .btn-group-more > .dropdown-menu > li > a > em {
        font-size: 14px !important;
    }
/*text color*/
.text-danger-light {
    color: #f47f7f;
}
/*end*/
.atext {
    width: 45px;
    padding: 0px 3px;
}

/*.br-btm, .br-bottom {
    border-bottom: 1px solid #e5e5e5 !important;
}

.br-right {
    border-right: 1px solid #e5e5e5 !important;
}*/

.atext-md {
    width: 55px;
    padding: 0px 3px;
}

.pt-0 {
    padding-top: 0px !important;
}

.p-10 {
    padding: 10px !important;
}

.p-1020 {
    padding: 10px 20px !important;
}

.p-1025 {
    padding: 10px 25px !important;
}

.p-1520 {
    padding: 15px 20px !important;
}

.text-yellow1 {
    color: #FFEB3B !important;
}

.due-span {
    padding-left: 20px;
    color: #E57373;
}

.display-block {
    display: block;
}

.display-inline-block {
    display: inline-block;
}

a:hover {
    text-decoration: none;
}

.dropdown-menu .divider {
    margin: 7.5px 0;
}

.b-color {
    background-color: #fafafa !important;
}

.d-color {
    background-color: #f0f0ef !important;
}


.panel-body.pb-same {
    padding: 15px !important;
}

.cursor-pointer {
    cursor: pointer;
}

.inline-block {
    display: inline-block;
}

.cursor-default {
    cursor: default;
}

btn-dtrange {
    width: 100%;
    text-align: left;
}

.btn-dtrange i.fa-caret-down {
    float: right;
    padding-top: 3px;
}

.btn-default.btn-dtrange-material {
    border: 1px solid #eaeaea !important;
    border-top: 0px !important;
    border-right: 0px !important;
    border-left: 0px !important;
    border-radius: 0px !important;
    padding-top: 8px;
    width: 100%;
    text-align: left;
    padding-left: 0px;
}

.btn-dtrange-material span > i {
    padding-right: 5px;
}

.bg-transparent .select2-selection {
    background-color: transparent !important;
}

.label-odometer {
    border-radius: 0px;
    padding: 2px 5px 2px 10px;
    font-weight: 400;
    letter-spacing: 5px;
    font-family: 'CircularStd-Book';
    background-color: #E0E0E0;
    min-width: 110px;
}
/*label*/
.label {
    border-radius: 0px;
    padding: 5px 10px 5px;
    font-weight: 400;
    font-size: 72%;
}

    .label.label-count {
        font-size: 100%;
    }

label.label-success {
    background: #3cb878;
}

.label-gray {
    background-color: #848484;
    color: #fff;
    border-radius: 10px;
}
/*nav custom*/
.navbar-brand {
    /*height: 40px !important;*/
}

.navbar-title {
    /*color: #fff;
    padding-top: 10px;*/
}

.navbar {
    /*min-height: 40px !important;*/
}

/**/


table.dataTable, table {
    font-size: 13px !important;
}


.fa-icon {
    padding-right: 5px;
}

.em-icon {
    padding-right: 10px;
}

.panel-body.b-b-n, .b-b-n {
    border-bottom: none !important;
}

.panel-body.b-t-n, .b-t-n {
    border-top: none !important;
}

.b-n {
    border: none !important;
}
/*table custom */


table.dataTable, table {
    font-size: 13px !important;
}

.table > thead:first-child > tr:first-child > th {
    border-top: 0px solid #eee;
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
    padding: 10px 8px;
}

/**/
.setup-add {
    line-height: 28px;
    padding: 16px 21px 10px 21px;
    color: #fff;
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.2);
}

    .setup-add.multi-col-dropdown > div > em {
        font-size: 24px;
    }

    .setup-add .dropdown-menu {
        margin-top: 0px;
        margin-left: -1px;
        border-radius: 0px 0px 3px 3px;
    }

    .setup-add .list-inline {
        white-space: nowrap;
    }

        .setup-add .list-inline > li {
            vertical-align: top;
        }

.setup-inline > li {
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px;
}

.multi-col-dropdown .list-unstyled li a {
    display: block;
    padding: 7px 18px;
    color: #000;
    white-space: nowrap;
    text-decoration: none;
    position: relative;
}

.have-submenu .multi-col-dropdown .list-unstyled li a {
    padding: 5px 18px;
    min-width: 140px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.multi-col-dropdown .list-unstyled li a > em {
    color: #6a75c3;
    padding-right: 12px;
}

.multi-col-dropdown .list-unstyled li a:hover {
    color: #3F51B5;
}

/*.setup-add.open {
    box-shadow: 0 -3px 0 rgba(255, 255, 255, 1) inset;
}*/

.setup-add .dropdown-menu {
    box-shadow: none;
    padding: 0;
}
/**/
.setup-add-tablet {
    padding: 16px 21px 12px 21px !important;
    background-color: rgba(255,255,255,.1) !important;
}
/**/
.alert-col-dropdown {
    line-height: 28px;
    padding: 16px 22px 10px 22px;
    color: #fff;
    cursor: pointer;
}

    .alert-col-dropdown .list-unstyled li a {
        display: block;
        padding: 3px 8px 3px 15px !important;
        color: #000;
        white-space: nowrap;
        text-decoration: none;
    }

        .alert-col-dropdown .list-unstyled li a > .label {
            margin-top: 6px;
            font-size: 88% !important;
        }

        .alert-col-dropdown .list-unstyled li a > img {
            height: 20px;
            width: 20px;
            margin-right: 10px;
        }

        .alert-col-dropdown .list-unstyled li a:hover {
            color: #333;
        }

    .alert-col-dropdown > div > em {
        font-size: 20px;
        line-height: 100%;
    }

    .alert-col-dropdown .dropdown-menu {
        min-width: 350px;
        padding-bottom: 0px;
        border-radius: 0px;
        padding-top: 0px;
        border: 0px;
        margin-right: -4px;
    }
/**/
.custombutton_map {
    position: absolute;
    margin-left: 42%;
    padding-top: 10px;
    top: 0;
}

    .custombutton_map .btn-group {
        box-shadow: 0px 8px 18px -9px rgba(184,182,184,1);
    }

.btn-circle-map {
    float: right;
    margin-top: -35px;
    margin-right: 50px;
}
/**/
.btn-primary2 {
    color: #ffffff;
    background-color: #3a3f51;
    border-color: #323645;
}

    .btn-primary2:hover,
    .btn-primary2:focus,
    .btn-primary2:active,
    .btn-primary2.active,
    .open .dropdown-toggle.btn-primary2 {
        color: #ffffff;
        background-color: #323645;
        border-color: #2a2d3a;
    }

    .btn-primary2:active,
    .btn-primary2.active,
    .open .dropdown-toggle.btn-primary2 {
        background-image: none;
    }

    .btn-primary2.disabled,
    .btn-primary2[disabled],
    fieldset[disabled] .btn-primary2,
    .btn-primary2.disabled:hover,
    .btn-primary2[disabled]:hover,
    fieldset[disabled] .btn-primary2:hover,
    .btn-primary2.disabled:focus,
    .btn-primary2[disabled]:focus,
    fieldset[disabled] .btn-primary2:focus,
    .btn-primary2.disabled:active,
    .btn-primary2[disabled]:active,
    fieldset[disabled] .btn-primary2:active,
    .btn-primary2.disabled.active,
    .btn-primary2[disabled].active,
    fieldset[disabled] .btn-primary2.active {
        background-color: #3a3f51;
        border-color: #323645;
    }
/**/

/*.map-container {
    position: relative;
    
}*/

.mt-70 {
    margin-top: 70px;
}

.mt-30 {
    margin-top: 30px;
}


/*panel*/
.panel {
    border-radius: 0px;
}

    .panel .panel-heading {
        border-bottom: 1px solid #eee;
    }

.panel-default {
    border-color: #eee !important;
}

/*width*/
/**/
.w-5per {
    width: 5%;
}

.w-10per {
    width: 10%;
}

.w-12per {
    width: 12%;
}

.w-15per {
    width: 15%;
}

.w-16per {
    width: 16%;
}

.w-17per {
    width: 17%;
}

.w-18per {
    width: 18%;
}

.w-20per {
    width: 20%;
}

.w-25per {
    width: 25%;
}

.w-30per {
    width: 30%;
}

.w-33per {
    width: 33%;
}

.w-34per {
    width: 34%;
}

.w-35per {
    width: 35%;
}

.w-40per {
    width: 40%;
}

.w-45per {
    width: 45%;
}

.w-50per {
    width: 50%;
}

.w-55per {
    width: 55%;
}

.w-60per {
    width: 60%;
}

.w-65per {
    width: 65%;
}

.w-70per {
    width: 70%;
}

.w-7per {
    width: 7%;
}

.w-75per {
    width: 75%;
}

.w-80per {
    width: 80%;
}

.w-85per {
    width: 85%;
}

.w-90per {
    width: 90%;
}

.w-95per {
    width: 95%;
}

.w-98per {
    width: 98%;
}

.w-99per {
    width: 99%;
}

.w-93per {
    width: 93%;
}


.w-100per {
    width: 100%;
}

/**/
.tab-content.tab-content-10 {
    padding: 10px;
    border: 0px;
}

.bg-white, .addon-white {
    background-color: #fff !important;
}

.addon-checkbox .checkbox {
    margin: 0px;
}

.addon-checkbox {
    background-color: #fff;
    padding: 6px 8px 6px 12px;
}

.offsidebarDashboard {
    overflow-x: hidden;
}

.tbt_vscroll {
    height: calc(100vh - 208px);
    overflow-y: auto;
    margin-top: 5px;
}

    .tbt_vscroll .table {
        margin-bottom: 20px;
    }

.tbt_vscroll1 {
    height: calc(100vh - 152px);
    overflow: auto;
}


.report-body {
    /*with footer */
    /*height: calc(100vh - 220px);*/
    /*without footer*/
    height: calc(100vh - 175px);
    overflow: auto;
}

.analytics-body {
    height: calc(100vh - 154px);
    overflow: auto;
}

.search_autorefresh .checkbox {
    padding-left: 10px;
}

/**/
/* Panels */
.hpanel > .panel-heading {
    color: inherit;
    font-weight: 600;
    padding: 10px 4px;
    transition: all .3s;
    border: 1px solid transparent;
}

.hpanel .hbuilt.panel-heading {
    border-bottom: none;
}

.hpanel > .panel-footer,
.hpanel > .panel-section {
    color: inherit;
    border: 1px solid #e4e5e7;
    border-top: none;
    font-size: 90%;
    background: #f7f9fa;
    padding: 10px 25px;
}

.hpanel.panel-collapse > .panel-heading,
.hpanel .hbuilt {
    background: #fff;
    border-color: #e4e5e7;
    border: 1px solid #e4e5e7;
    padding: 10px 10px;
    border-radius: 2px 2px 0px 0px;
    line-height: 35px;
}

.hpanel > .hbuilt-h {
    line-height: 16px;
    font-weight: 400;
}

.hpanel .panel-body {
    background: #fff;
    border: 1px solid #e4e5e7;
    border-radius: 0px 0px 2px 2px;
    padding: 20px;
    position: relative;
}

.hpanel.panel-group .panel-body:first-child {
    border-top: 1px solid #e4e5e7;
}

.hpanel.panel-group .panel-body {
    border-top: none;
}

.panel-collapse .panel-body {
    border: none;
}

.hpanel {
    background-color: none;
    border: none;
    box-shadow: none;
    margin-bottom: 15px;
}

    .hpanel .panel-tools {
        display: inline-block;
        float: right;
        margin-top: 0;
        padding: 0;
        position: relative;
    }

    .hpanel .alert {
        margin-bottom: 0;
        border-radius: 0;
        border: 1px solid #e4e5e7;
        border-bottom: none;
    }

    .hpanel .panel-tools a {
        margin-left: 5px;
        color: #9d9fa2;
        cursor: pointer;
    }

    .hpanel.hgray .panel-body {
        border-top: 2px solid #c1c1c1;
    }


    .hpanel.hgreen .panel-body {
        border-top: 2px solid #62cb31;
    }

    .hpanel.hblue .panel-body {
        border-top: 2px solid #3498db;
    }

    .hpanel.hyellow .panel-body {
        border-top: 2px solid #ffb606;
    }

    .hpanel.hviolet .panel-body {
        border-top: 2px solid #9b59b6;
    }

    .hpanel.horange .panel-body {
        border-top: 2px solid #e67e22;
    }

    .hpanel.hred .panel-body {
        border-top: 2px solid #e74c3c;
    }

    .hpanel.hreddeep .panel-body {
        border-top: 2px solid #c0392b;
    }

    .hpanel.hnavyblue .panel-body {
        border-top: 2px solid #34495e;
    }

    .hpanel.hbggreen .panel-body {
        background: #62cb31;
        color: #fff;
        border: none;
    }

    .hpanel.hbgblue .panel-body {
        background: #3498db;
        color: #fff;
        border: none;
    }

    .hpanel.hbgyellow .panel-body {
        background: #ffb606;
        color: #fff;
        border: none;
    }

    .hpanel.hbgviolet .panel-body {
        background: #9b59b6;
        color: #fff;
        border: none;
    }

    .hpanel.hbgorange .panel-body {
        background: #e67e22;
        color: #fff;
        border: none;
    }

    .hpanel.hbgred .panel-body {
        background: #e74c3c;
        color: #fff;
        border: none;
    }

    .hpanel.hbgreddeep .panel-body {
        background: #c0392b;
        color: #fff;
        border: none;
    }

    .hpanel.hbgnavyblue .panel-body {
        background: #34495e;
        color: #fff;
        border: none;
    }

.panel-group .panel-heading {
    background-color: #f7f9fa;
}

.small-header .hpanel {
    margin-bottom: 0;
}

.small-header {
    padding: 0 !important;
}

.panel-body.body-12 {
    padding: 12px !important;
}

.normalheader .hpanel:first-child .panel-body {
    padding: 8px 25px;
}

.small-header .panel-body {
    padding: 15px 25px;
    border-radius: 0;
}

.hpanel .panel-body h5,
.hpanel .panel-body h4 {
    font-weight: 600;
}

.small-header .panel-body h2 {
    font-size: 16px;
    font-weight: 600;
    /* text-transform: uppercase; */
    margin: 0 0 0 0;
    display: inline-block;
    color: #353535;
}

.small-header .panel-body small {
    color: #838589;
}

.hbreadcrumb {
    padding: 2px 0px;
    margin-top: 6px;
    margin-bottom: 0px;
    list-style: none;
    background-color: #fff;
    font-size: 11px;
}

    .hbreadcrumb > li {
        display: inline-block;
    }

        .hbreadcrumb > li + li:before {
            padding: 0 5px;
            color: #34495e;
        }

    .hbreadcrumb > .active {
        color: #9d9fa2;
    }

.hpanel.collapsed .panel-body,
.hpanel.collapsed .panel-footer {
    display: none;
}

.hpanel.collapsed .fa.fa-chevron-up:before {
    content: "\f078";
}

.hpanel.collapsed .fa.fa-chevron-down:before {
    content: "\f077";
}

.hpanel.collapsed.panel-collapse .panel-body {
    border-width: 0 1px 1px 1px;
    border-color: #e4e5e7;
    border-style: solid;
}

.hpanel.collapsed .hbuilt.panel-heading {
    border-bottom: 1px solid #e4e5e7;
}

body.fullscreen-panel-mode {
    overflow-y: hidden;
}

.hpanel.fullscreen {
    z-index: 2030;
    position: fixed;
    top: 55px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
    margin-bottom: 0;
}

    .hpanel.fullscreen .showhide {
        display: none;
    }

    .hpanel.fullscreen .panel-body {
        min-height: calc(100% - 58px);
    }


/*control material*/
.form-control.control-material[readonly] {
    background-color: #fff;
}

.form-control.control-material {
    border-radius: 0px;
    border-right: none;
    border-top: none;
    border-left: none;
    padding: 0px 16px 0px 0px;
}

.group-material .input-group-addon {
    border-radius: 0px;
    background-color: transparent;
    border-right: none;
    border-top: none;
    border-left: none;
    padding: 6px 5px 6px 1px;
}

.select2-material .select2-selection--single {
    border-right: 0px !important;
    border-left: 0px !important;
    border-top: 0px !important;
    border-radius: 0px;
}

.select2-m-material .select2-selection--multiple {
    border-right: 0px !important;
    border-left: 0px !important;
    border-top: 0px !important;
    border-radius: 0px !important;
}

.pb-70 {
    padding-bottom: 70px;
}

.select2-m-material .select2-container--bootstrap .select2-selection--multiple .select2-search--inline .select2-search__field {
    padding: 0px 1px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #fafafa !important;
}

.badge-28 {
    min-width: 28px !important;
}

/*.select2-m-material .select2-selection--multiple .select2-search__field {
        padding: 12px 12px 12px 1px !important;
    }*/

/**/
.dropdown-menu-icon li > a > em {
    padding-right: 12px;
    color: #9E9E9E;
}

thead.custom-head > tr > th {
    color: #616161 !important;
    background-color: #f5f5f5;
    font-weight: 500 !important;
    border-top: 1px solid #eee !important;
}
/*datatable custom css .dataTables_scrollHeadInner, */

.dataTable thead > tr > th {
    /*text-transform: uppercase;*/
    color: #616161 !important;
    white-space: nowrap;
    background-color: #f5f5f5;
    font-weight: 500 !important;
    font-size: 13px;
}

table.dataTable tbody td {
    white-space: nowrap !important;
}

.table.dataTable {
    width: inherit !important;
}

.dt-bootstrap.no-footer .dataTables_paginate, .dt-bootstrap.no-footer .dataTables_length {
    margin-top: 8px;
}

tr.radio-row .c-radio {
    margin-right: 0px !important;
}

/**/

h2.with-button {
    padding-top: 8px;
}

em.header-icon {
    padding-right: 10px;
    color: #333;
    font-size: 17px;
}

/**/

.font-extra-bold {
    font-weight: 700;
}

/* color css*/
.text-primary {
    color: #5d9cec !important;
}

.text-blue {
    color: #0076c0 !important;
}

.text-red {
    color: #f15f53 !important;
}

.text-success {
    color: #8BC34A !important;
}

.text-purple1 {
    color: #9b59b6 !important;
}

.text-orange {
    color: #f39c12 !important;
}

.text-black {
    color: #333 !important;
}

.text-green-light {
    color: #8BC34A;
}

.text-green-light1 {
    color: #7CB342;
}
/**/
.label-control.required:after {
    content: "*";
    color: #c52c2c;
    padding-left: 2px;
}

.form-row label.label-control {
    font-weight: normal;
    padding-top: 8px;
}

label.label-control {
    font-weight: normal;
}

/**/
.panel-footer.footer-button {
    border-bottom: 1px solid #e4e5e7;
    background-color: #fff;
}

.footer-button .btn {
    margin-right: 5px;
}

    .footer-button .btn:last-child {
        margin-right: 0px;
    }

.panel.p-flat {
    border-radius: 0px;
    border-top-width: 1px !important;
}

    .panel.p-flat .panel-heading {
        font-weight: 600 !important;
    }


.panel-body.p-body {
    border-left: 0px;
    border-right: 0px;
    border-bottom: 0px;
    padding: 12px 12px !important;
}

    .panel-body.p-body .dataTables_scroll {
        border: 1px solid #eee;
    }

    .panel-body.p-body table.dataTable {
        margin-top: 0px !important;
    }

.panel .panel-heading {
    border-bottom: 0;
}

.fw-600, .text-boldlight {
    font-weight: 600 !important;
}

.fw-500, .text-boldlight1 {
    font-weight: 500 !important;
}

.fw-700, .text-boldlighter {
    font-weight: 700 !important;
}


/**/
td > .alert-icon-div {
    margin: 0 auto;
    margin-top: 8px;
    margin-bottom: 3px;
}

.alert-icon-div {
    /*border: 1px solid #E0E0E0;
    border-radius: 50%;
    height: 36px;
    width: 36px;*/
    text-align: center;
}

img.alert-icon {
    /*height: 32px;
    width: 32px;*/
    margin-top: 7px;
}

.rh-70 {
    height: 70px;
}

.mb-0 {
    margin-bottom: 0px !important;
}

.mw-40px {
    min-width: 40px;
}

.mw-80px {
    min-width: 80px;
}

.mw-65px {
    min-width: 65px !important;
}

td.alertsetting-active, td.alertsetting-inactive {
    text-align: center;
    cursor: pointer;
}

    td.alertsetting-active:after {
        color: #8BC34A;
        content: "\f00c";
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
    }

    td.alertsetting-active:hover:before {
        color: #9E9E9E;
        content: "Edit";
    }

    td.alertsetting-inactive:hover:before {
        content: "\f067";
        color: #9E9E9E;
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
    }

/* validation error */

.form-control.error {
    border-color: #e74c3c !important;
}

label.error, label span.error {
    color: #e74c3c;
    margin: 5px 0 0 0;
    font-weight: 400;
}

label span.error {
    margin-left: 5px;
}

/*btn-file*/

.btn.btn-upload {
    border-right: 0px;
    border-top: 0px;
    border-left: 0px;
    margin-top: 1px;
    border-radius: 0px;
    padding-left: 0px;
}

    .btn.btn-upload:hover {
        background-color: #fff;
        color: #5d9cec;
    }


.btn.btn-file {
    position: relative;
    overflow: hidden;
}

    .btn.btn-file > input[type='file'] {
        position: absolute;
        top: 0;
        right: 0;
        min-width: 100%;
        min-height: 100%;
        font-size: 100px;
        text-align: right;
        opacity: 0;
        filter: alpha(opacity=0);
        outline: none;
        background: white;
        cursor: inherit;
        display: block;
    }

/**/
.settings-list {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 42px;
    overflow-y: scroll;
    background: #fff;
    padding-bottom: 50px;
}

    .settings-list ul {
        list-style: none;
        padding-left: 0px;
    }

    .settings-list li > a {
        display: block;
        padding: 7px 20px;
        text-decoration: none;
        color: #333;
    }

        .settings-list li > a span.link-create {
            float: right;
            display: none;
            font-size: 16px;
            padding: 0px 5px 3px 10px;
        }

        .settings-list li > a:hover span.link-create {
            display: block;
        }

        .settings-list li > a:hover, .settings-list li > a.active {
            background-color: #3a3f51;
            color: #fff;
        }

            .settings-list li > a:hover em {
                color: #fff;
            }

    .settings-list a > em {
        color: #9d9fa2;
        padding-right: 15px;
    }

.setting-search {
    margin: 5px;
}

    .setting-search input {
        border-radius: 0px;
    }

/**/

.closeaside em {
    cursor: pointer;
    font-size: 18px;
}

/**/
.panel-body.mapview-header {
    border: none;
    padding: 8px 0px 8px 10px !important;
    color: #fff !important;
    vertical-align: middle;
    min-height: 47px;
}

a.equalizer-link {
    background-color: #EC407A;
    color: #fff;
    padding: 10px;
    text-decoration: none;
    border-radius: 5px;
}

.btn-group.border-radius {
    border-radius: 6px;
    overflow: hidden;
}

    .btn-group.border-radius button:first-child {
        border-top-left-radius: 6px !important;
        border-bottom-left-radius: 6px !important;
    }

    .btn-group.border-radius button:last-child {
        border-top-right-radius: 6px !important;
        border-bottom-right-radius: 6px !important;
    }

    .btn-group.border-radius button {
        border: 1px solid #cdcdcd;
    }

a.equalizer-link > div {
    display: inline-block;
    margin-top: 4px;
}

.section_mapviewsidebar .tab-content.header {
    padding: 13px 20px;
    border-style: none;
    border-width: 0px;
    background-color: #EC407A;
    color: #fff;
}

.div_mapviewsidebar {
    position: static;
    left: 0;
    right: 0;
    bottom: 0;
    top: 48px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #fff;
    padding-bottom: 10px;
}

.div_dashboardviewsidebar {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 48px;
    padding-bottom: 10px;
}
/*trackin filter panel*/

.scrollable1 .table {
    margin-bottom: 0;
    border: 0;
}

.p-search {
    padding: 0px 8px 4px 8px !important;
}

    .p-search .btn-default {
        /*border-top: none;
        border-right: none;
        border-left: snow;
        margin-top: 1px;*/
    }

        .p-search .btn-default:hover, .p-search .btn-default:focus, .p-search .btn-default:active {
            background-color: #fff !important;
        }


/*outer tab */

.nav-tabs.on-map {
}

    .nav-tabs.on-map > li > a {
        font-weight: normal !important;
        border-left: 0px !important;
        padding: 4px 20px !important;
        font-size: 14px;
        line-height: 21px;
    }

.outer-tab .tab-content {
    border: 0px !important;
    overflow-y: hidden;
    overflow-x: hidden;
    padding: 0;
}

/*inner tab*/
.nav-tabs.on-inner {
}

    .nav-tabs.on-inner > li > a {
        border: 0px !important;
        background-color: #fff !important;
        padding: 4px 12px 4px 12px !important;
    }

    .nav-tabs.on-inner > li.active > a {
        border-bottom: 2px solid #2f80e7 !important;
        color: #2f80e7;
    }

.inner-tab .tab-content {
    border-width: 0px !important;
}

.tab-list {
    font-size: 12px !important;
}

    .tab-list input[type=checkbox] {
        margin-right: 6px !important;
    }

td.list-head {
    font-size: 14px !important;
    color: #808080;
}

.tab-list .fa-circle {
    font-size: 6px !important;
    vertical-align: middle;
    padding-right: 4px;
}

.tab-list tr {
    cursor: pointer;
}

    .tab-list tr > td {
        border-top: 0px !important;
        border-bottom: 1px solid #eee;
    }

.tab-list-footer {
    text-align: right;
    border: 1px solid #ddd;
    padding: 6px 10px;
    margin-top: 10px;
}

/* history tab */
#history-tab {
    margin-top: 5px;
    left: 0px;
    right: 0px;
}

    #history-tab .nav-tabs > li > a {
        font-weight: normal !important;
        padding: 6px 20px !important;
    }

.form-control.h-24 {
    height: 24px !important;
}

.history-tab tr > td {
    border-top: 0px !important;
    border-bottom: 1px solid #eee;
}


.w170 {
    width: 120px !important;
    /*font-size: 12px;*/
}

.w17 {
    width: 17px !important;
}

.dashboard_Sensor_Span {
    display: inline-block;
    margin: 0 7px;
}

.track-overflow {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

.text-overflow-vertical {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.vertical-line-2 {
    -webkit-line-clamp: 2;
}

.near-by-table td {
    padding: 8px 10px 8px 2px !important;
}

.near-by-list {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
    width: 92%;
}

.btn-background-cyan, .btn-background-cyan:hover {
    background-color: #8e8e8e !important;
    color: #fff !important;
}

.scrollable1 {
    height: calc(100vh - 281px);
    overflow: auto;
}

.scrollable2 {
    height: calc(100vh - 420px);
    overflow: auto;
}

.Customcontainer .searchNewWrap label {
    position: absolute;
    right: 10px;
    top: 10px;
    margin: 0;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
}

.footer_mapviewsidebar {
    background-color: #edf1f2;
    position: absolute;
    min-height: 80px;
    padding: 10px;
    left: 0;
    right: 0;
    bottom: 0;
    border-top: 1px solid #E0E0E0;
}

.footer-live {
    margin-top: 10px;
    text-align: right;
    border: 1px solid #ddd;
    padding: 6px 10px;
    margin-bottom: 0;
    border-radius: 10px;
}

.footer-history {
    margin-top: 0px;
    text-align: right;
    border: 1px solid #ddd;
    padding: 6px 10px;
    margin-bottom: 10px;
}

.footer_mapviewsidebar input.form-control {
    background-color: transparent !important;
}

.additional_mapview {
    float: left;
}

    .additional_mapview ul {
        list-style: none;
        padding: 0px;
        margin: 0px;
        margin-top: 6px;
        padding-right: 5px;
    }

        .additional_mapview ul > li {
            display: inline;
        }

            .additional_mapview ul > li > a {
                text-decoration: none;
                padding: 15px 12px 13px 15px;
                color: #EC407A;
                text-align: center;
            }

                .additional_mapview ul > li > a:hover, .additional_mapview .dropdown-list.open > a {
                    background-color: #5e5d64;
                    color: #fff;
                }

        .additional_mapview ul.dropdown-menu {
            margin-top: 13px;
            border-radius: 0px;
            color: #333;
            min-width: 280px;
        }

.polzone-list ul li {
    border-bottom: 1px dashed #e4eaec;
    display: block;
    padding: 6px 0px;
}
/*end*/

.em-circle {
    color: #fff;
    padding: 12px;
    border-radius: 50%;
}

.lead-bold {
    font-size: 21px;
    font-weight: 400;
    line-height: 1.4;
}

.lead-16 {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
}

/**/
#servmainSrcoll {
    height: calc(100vh - 201px);
    overflow: auto;
}

.w-70px {
    width: 70px;
}

/*-----*/
.profile-nav {
    border: 1px solid #e4e5e7;
    margin-bottom: 20px;
}

    .profile-nav .user-heading {
        color: #212121;
        padding: 10px;
        background-color: #fafafa;
    }

        .profile-nav .user-heading h1 {
            font-size: 18px;
            font-weight: 400;
            margin: 12px 0px 10px 0px;
        }

            .profile-nav .user-heading h1 > span {
                color: #d3d3d3 !important;
                font-weight: 400;
            }

        .profile-nav .user-heading img {
            float: left;
            display: inline-block;
            margin: 0px 15px 5px 5px;
            height: 40px;
            width: 40px;
        }

        .profile-nav .user-heading p {
            font-size: 13px;
            color: #424242;
            line-height: 20px;
            display: inline-block;
            min-height: 40px;
            margin-bottom: 0px;
        }

    .profile-nav ul {
        margin-top: 0px;
        border-top: 1px solid #e4e5e7;
        min-height: 205px;
    }

        .profile-nav ul > li {
            border-bottom: 1px solid #ebeae6;
            margin-top: 0;
            line-height: 20px;
        }

            .profile-nav ul > li:last-child {
                border-bottom: none;
            }

            .profile-nav ul > li > a {
                border-radius: 0;
                -webkit-border-radius: 0;
                color: #333;
            }

                .profile-nav ul > li > a:hover, .profile-nav ul > li > a:focus, .profile-nav ul li.active a {
                    background: #fafafa !important;
                    color: #5d9cec !important;
                }

            .profile-nav ul > li:last-child > a:last-child {
                border-radius: 0 0 4px 4px;
                -webkit-border-radius: 0 0 4px 4px;
            }

            .profile-nav ul > li > a > em {
                font-size: 14px;
                padding-right: 10px;
                color: #757575;
            }

.odometer-style {
    background-color: #666;
    color: #fff;
    padding: 2px 2px 1px 8px;
    letter-spacing: 6px;
    font-family: 'CircularStd-Book';
    font-weight: 400;
    font-size: 13px;
    margin-bottom: 5px;
}

.odometer-editable {
    font-family: 'CircularStd-Book';
    letter-spacing: 6px;
    color: #fff !important;
    padding: 1px 1px 1px 8px;
    background-color: #666;
    border-color: #fff !important;
    font-weight: 500 !important;
}

    .odometer-editable:hover, .odometer-editable:active {
        color: #fff;
    }

.f-16 {
    font-size: 16px !important;
}

.f-17 {
    font-size: 17px !important;
}

.f-18 {
    font-size: 18px !important;
}

.f-20 {
    font-size: 20px !important;
}

.f-28 {
    font-size: 28px !important;
}

.f-13 {
    font-size: 13px !important;
}

.f-10 {
    font-size: 10px !important;
}

.f-11 {
    font-size: 11px !important;
}

.f-12 {
    font-size: 12px !important;
}

.f-15 {
    font-size: 15px !important;
}

.f-14 {
    font-size: 14px !important;
}
/*.section-servicedue {
    background-color:#fff;
    margin:10px;
    border:1px solid #ddd;
}*/
.dueScroll, .panel-body.p-body.noteScroll {
    height: 205px;
    min-height: 205px;
    overflow: auto;
    padding: 0px !important;
}

.due-group .due-group-item, .note-group .note-group-item {
    padding: 13px 10px;
}

.due-group-item, .note-group-item {
    position: relative;
    display: block;
    background-color: #fff;
    border-bottom: 1px solid #e4eaec;
}

    .due-group-item:last-child, .note-group-item:last-child {
        border-bottom: none;
    }


/*.poizone-group .list-group-item{
    border-radius:0px !important;
}*/
.poizone-group {
    margin-bottom: 0px !important;
}

    .poizone-group .list-group-item {
        padding-right: 16px !important;
    }

        .poizone-group .list-group-item:hover {
            background-color: #fafafa;
            cursor: default;
        }

.poizone-group-btn {
    float: right;
    cursor: pointer;
    position: relative;
}

    .poizone-group-btn a:first-child {
        margin-bottom: 5px;
    }

.poizone-group .list-group-item a {
    display: none;
}

.poizone-group .list-group-item:hover a {
    display: block;
}

.poizone-group .list-group-item:first-child {
    border-top-right-radius: 0px !important;
    border-top-left-radius: 0px !important;
}


/*.poizone-group .icon-trash:hover {
        color: #e74c3c;
    }*/
/**/

.customtextbox_poizonemap {
    position: absolute;
    left: 21.5%;
    top: 10px;
}

.customtextbox_poizonemap_trip {
    position: absolute;
    left: 96.5%;
    top: 10px;
}

.custombutton_poizonemap {
    position: absolute;
    left: 62%;
    top: 10px;
}

    .custombutton_poizonemap .btn-group {
        box-shadow: 0px 8px 18px -9px rgba(184,182,184,1);
    }
/**/
.alert-body .a-box {
    padding: 10px !important;
}

    .alert-body .a-box .alertcount {
        font-size: 16px;
        margin-top: 5px;
    }

.a-box {
    padding: 20px;
    border: 1px solid #dbdbdb;
    vertical-align: middle;
    border-left-width: 2px;
    cursor: pointer;
    margin-bottom: 15px;
}




    .a-box.active {
        border-left-color: #f47f7f;
    }

    .a-box:hover {
        color: #f05050;
    }

    .a-box .alert-icon-div {
        display: inline-block;
        margin-right: 10px;
    }

.pr {
    padding-right: 0;
}

.a-box div.alerttype {
    position: absolute;
    padding-top: 7px;
    display: inline-block;
    font-weight: 500;
    text-transform: uppercase;
}

.a-box .alertcount {
    font-size: 21px;
    font-weight: 600;
    color: #f47f7f;
    float: right;
    margin-top: 2px;
}

a.starred-link {
    margin-right: 10px;
}

a.starred-link, a.acknowledge-link {
    color: #808080;
    text-decoration: none;
}

    a.starred-link.active, a.starred-link:hover {
        color: #f77600;
        text-decoration: none;
    }

    a.acknowledge-link.active, a.acknowledge-link:hover {
        color: #37bc9b;
        text-decoration: none;
    }


/*modal popup css*/
.modal .modal-content {
    border-radius: 0px !important;
    border: none;
}

.modal .modal-dialog {
    margin: 58px auto !important;
}

.modal-primary .modal-header {
    background-color: #2196F3;
    color: #fff !important;
}

.modal-danger .modal-header {
    background-color: #f47f7f;
    color: #fff !important;
}

.modal-inverse .modal-header {
    background-color: #313232;
    color: #fff !important;
}

.modal .modal-header {
    padding: 10px 15px !important;
}

    .modal .modal-header h4 {
        font-weight: 300;
        color: #fff;
    }

    .modal .modal-header .close {
        color: #fff;
        text-shadow: none !important;
        opacity: initial !important;
        margin-top: 3px;
    }

.modal .modal-footer {
    padding: 5px 15px !important;
}
/**/
.table-vehcilealert .alert-icon-div {
    border-color: #ff8080 !important;
}

/*Buttom customs*/
.btn-square {
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.12);
    border: 0;
}

    .btn-square:hover {
        box-shadow: 0 2px 4px 0 rgba(0,0,0,.36);
        border: 0;
    }

.btn-default.btn-square {
    border: 1px solid #eaeaea;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,.12);
}

    .btn-default.btn-square:hover {
        box-shadow: 0 2px 4px 0 rgba(0,0,0,.20);
        background-color: #fff;
    }

.button-normal.button-grey:hover {
    background-color: #1C1C1C4D;
    color: #F3F3F3;
}

.button-normal.button-blue:hover {
    opacity: 0.6;
    background-color: #1A73E8;
    color: #fff;
    border: 0;
}

.btn-group-xs > .btn, .btn-xs {
    padding: 2px 8px !important;
}

.btn-group-lg > .btn, .btn-lg {
    padding: 10px 16px !important;
}


/*theme color*/
.theme-success {
    background-color: #32c787 !important;
}

.theme-primary {
    background-color: #2196F3 !important;
}

.theme-danger {
    background-color: #ff5652 !important;
}

.theme-warning {
    background-color: #FF9800 !important;
}

.theme-purple {
    background-color: #3F51B5 !important;
}

.theme-info {
    background-color: #00BCD4 !important;
}

.theme-gray {
    background-color: #607D8B !important;
}

.theme-black {
    background-color: #323232 !important;
}

.theme-white {
    background-color: #FFFFFF !important;
}

/*setup menus*/
.setup-menu {
    text-align: center;
    padding: 15px 30px !important;
    border-radius: 0px;
    transition: background-color .3s;
    margin-bottom: 0px;
    /*background-color: #EEEEEE;*/
    /*min-height: 177px;*/
}

    .setup-menu.active {
        /*background-color: #F5F5F5;*/
    }

    .setup-menu:hover, .setup-menu:focus {
        text-decoration: none;
        background-color: #f5f5f5;
        color: #000;
    }

    .setup-menu > img {
        width: 40px;
        height: 40px;
    }

    .setup-menu > h4 {
        display: block;
        color: #333;
        margin-top: 15px;
        font-size: 15px;
    }

    .setup-menu > p {
        color: #757575;
        font-size: 13px;
        margin-bottom: 0px;
        min-height: 50px;
    }

/*.panel-service .panel-heading{
    background-color:#3cb878 !important;
}*/

/**/
.card-panel {
    background: #fff;
    margin-bottom: 25px !important;
    border: medium none;
    border-radius: 0;
    box-shadow: none;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    transition: 0.3s ease;
}

.card-panel-heading1 {
}

.card-panel .card-panel-heading {
    font-size: 13px;
    line-height: 20px;
    text-transform: uppercase;
    padding: 15px 15px;
}

.card-panel .card-panel-body {
    padding: 15px 15px;
}

/*card panel color*/
.text-green1 {
    color: #3cb878;
}

.card-panel-success > .card-panel-heading {
    background-color: #3cb878;
    color: #fff;
}

.card-panel-danger > .card-panel-heading {
    background-color: #f47f7f;
    color: #fff;
}

.card-panel-gray > .card-panel-heading {
    background-color: #9E9E9E;
    color: #fff;
}

.card-panel-white > .card-panel-heading {
    background-color: #fff;
    color: #131e26;
}
/*.card-panel-warning > .card-panel-heading {
    background-color: #ea65a2;
    color: #fff;
}*/
/*.serviceMain-list {
    min-height: 270px;
    padding-right: 15px;
}

    .serviceMain-list ul {
        padding: 0px;
        margin-bottom: 10px;
        margin-top: 15px;
    }

        .serviceMain-list ul > li {
            list-style: none;
            padding: 15px 0px;
            border-bottom: 1px solid #eee;
            font-weight: 300;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .serviceMain-list em {
        color: #424242;
    }


    .serviceMain-list a {
        display: block;
        font-size: 11px;
        margin-left: 25px;
        text-align: left;
    }


        .serviceMain-list a span {
            float: right;
        }

    .serviceMain-list ul > li:first-child {
        padding-top: 0px;
    }

    .serviceMain-list ul > li:last-child {
        padding-bottom: 0px;
        border-bottom: none;
    }

.servicereminder-Tab, .renewalreminder-Tab {
    cursor: pointer;
    background-color: #F5F5F5;
    padding-top: 10px;
}

    .servicereminder-Tab.active, .renewalreminder-Tab.active {
        background-color: #fff;
    }

    .servicereminder-Tab .radial-bar, .renewalreminder-Tab .radial-bar {
        margin-bottom: 5px;
        margin-top: 5px;
    }*/

/**/
.alertMain-list ul {
    padding: 0px;
    margin-bottom: 10px;
}

    .alertMain-list ul > li {
        list-style: none;
        padding: 15px 0px;
        border-bottom: 1px solid #eee;
        font-weight: 300;
    }

        .alertMain-list ul > li > a {
            color: initial;
            display: block;
        }

            .alertMain-list ul > li > a:hover, .alertMain-list ul > li > a:active, .alertMain-list ul > li > a:focus {
                color: #f05050;
                display: block;
                text-decoration: none;
            }

.alertMain-list img {
    width: 25px;
    height: 25px;
    margin-right: 10px;
}

.alertMain-list .a-count {
    float: right;
    font-weight: 500;
    color: #f47f7f;
}

.alertMain-list ul > li:first-child {
    padding-top: 0px;
}

.alertMain-list ul > li:last-child {
    padding-bottom: 0px;
    border-bottom: none;
}


/**/
.nav-tabs-dashboard li a {
    padding: 19px 20px !important;
}

.nav-tabs-dashboard1 {
    margin-bottom: 10px;
}

    .nav-tabs-dashboard1 li a {
        padding: 5px !important;
        background-color: #F5F5F5;
    }

    .nav-tabs-dashboard1 > li.active > a, .nav-tabs-dashboard1 > li.active > a:focus, .nav-tabs-dashboard1 > li.active > a:hover {
        border-right: 0px;
        border-left: 0px;
    }

    .nav-tabs-dashboard1 li a > p:first-child {
        margin-bottom: 5px;
    }

    .nav-tabs-dashboard1 li a > p:last-child {
        letter-spacing: 1.2px;
        font-weight: 500;
    }

.custom-div {
    background-color: #3a3a3a;
    padding: 15px;
    text-align: center;
    color: #fff;
}

    .custom-div h3 {
        margin-top: 8px;
        margin-bottom: 4px;
        font-weight: 400;
    }

/**/
.dropdown-menu-more li > a > em, .btn-group .dropdown-menu li > a > em {
    padding-right: 15px;
    color: #9E9E9E !important;
    font-size: 20px;
    vertical-align: middle;
}
/*font icon*/
.zmdi-20 {
    font-size: 20px;
}

.text-red-light {
    color: #f47f7f;
}

/*flat-box*/
.flat-box.default {
    background-color: #fff;
    color: initial;
}

.flat-box.danger {
    background-color: #f47f7f;
    color: #fff !important;
}

.flat-box.warning {
    background-color: #fcb03b;
    color: #fff !important;
}

.flat-box.success {
    background-color: #3cb878;
    color: #fff !important;
}


.flat-box {
    margin-bottom: 20px;
    border: medium none;
    border-radius: 0;
    box-shadow: none;
    padding: 20px;
    border: 1px solid rgba(0,0,0,0.03);
    /*-webkit-box-shadow: 0px 1px 40px -15px rgba(0,0,0,0.48);
-moz-box-shadow: 0px 1px 40px -15px rgba(0,0,0,0.48);
box-shadow: 0px 1px 40px -15px rgba(0,0,0,0.48);*/
}

    .flat-box .flat-heading h6 {
        font-size: 14px;
        line-height: 20px;
        /*text-transform: uppercase;*/
        font-weight: 400;
        margin: 0;
        padding: 0;
        border: 0;
        vertical-align: baseline;
        display: inline-block;
    }

    .flat-box .flat-heading h5 {
        font-size: 14px;
        line-height: 20px;
        text-transform: uppercase;
        font-weight: 400;
        margin: 0;
        padding: 0;
        border: 0;
        vertical-align: baseline;
        display: inline-block;
    }

    .flat-box .counter-wrap {
        font-size: 25px;
        font-family: 'CircularStd-Book';
    }

        .flat-box .counter-wrap .counter-cap {
            font-size: 16px;
            position: relative;
            vertical-align: top;
            margin-right: 4px;
        }

    .flat-box .flat-body {
        padding-top: 10px;
    }

.flat-alert {
    cursor: pointer;
}

    .flat-alert:hover .counter-wrap {
        cursor: pointer;
        color: #f47f7f;
    }
/**/
.white-error .label-control .error {
    color: #fafafa !important;
    font-weight: 300 !important;
    font-size: 12px;
    padding-left: 10px;
}

.control-gray {
    background-color: transparent !important;
    color: #EEEEEE !important;
    font-weight: 300 !important;
}

input.control-gray::-webkit-input-placeholder {
    color: #BDBDBD !important;
}

input.control-gray::-moz-placeholder {
    color: #BDBDBD !important;
}

input.control-gray:-moz-placeholder {
    color: #BDBDBD !important;
}

input.control-gray:-ms-input-placeholder {
    color: #BDBDBD !important;
}
/*contact card*/
.contact-card {
    background: #fff;
    margin-bottom: 30px;
    border: medium none;
    border-radius: 0;
    box-shadow: none;
    padding: 25px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
}

.contact-cardR {
    text-align: center;
}

.contact-card img {
    width: 65px;
    height: 65px;
    border-radius: 50%;
}

.contact-cardR .lbl {
    margin-top: 5px;
}

    .contact-cardR .lbl .label {
        font-size: 80%;
    }

.contact-card .name-data {
    color: #2f2c2c;
    text-transform: uppercase;
    font-size: 14px;
    margin: 10px 0px;
}

.contact-card .other-data {
    color: #adadad;
    font-size: 13px;
    font-weight: 400;
    padding-bottom: 5px;
}

/**/
hr.lg {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
}

hr.md {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

hr.sm {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}

.modal-body.alter-setting {
    background-color: #fafafa !important;
    border-top: 1px solid #e5e5e5;
    min-height: 150px;
}

.top-menus {
    line-height: 28px;
    /*padding: 16px 22px 10px 22px;*/
    color: #fff;
    cursor: pointer;
    /*background-color: rgba(255,255,255,.2);*/
    margin-right: 10px;
}

/**/
body.fullscreen-panel-mode {
    overflow-y: hidden;
}

.fpanel.fullscreen {
    z-index: 2030;
    position: fixed;
    top: 56px;
    left: -14px;
    right: -14px;
    bottom: 0;
    overflow: auto;
    overflow-x: hidden;
    margin-bottom: 0;
}

    .fpanel.fullscreen .card-panel-body {
        min-height: calc(100vh - 185px);
    }

.card-panel-white.card-panel-vehicledetails {
    margin: 0px 10px 0px 10px !important;
}

.card-panel-vehicledetails .card-panel-heading {
    padding: 15px 0px !important;
}

div#fpanel_grid.fpanel.fullscreen {
    left: 0;
    right: 0;
    background-color: #ffffff;
}

.fullscreen .card-panel-vehicledetails .card-panel-heading {
    padding: 15px 15px !important;
}

.visible-fullscreen {
    display: none;
}

.fullscreen .visible-fullscreen {
    display: inline-block;
    padding-left: 5px;
}
/*.card-panel-danger.card-panel-alertdetails {
    margin: 15px 15px 0px 15px !important;
}

.card-panel-alertdetails .alertMain-list {
    min-height: calc(100vh - 615px);
    overflow-y: auto;
}*/

/*icon*/
em.icon_16, i.icon_16 {
    font-size: 16px;
}

.text-disable {
    color: #949494;
}

div.icon_18, span.icon_18 {
    height: 18px;
    width: 18px;
    margin: 0 auto;
}

div.icon_16, span.icon_16 {
    height: 16px;
    width: 16px;
    margin: 0 auto;
}
/**/
.location-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/*seatbelt_*/
.icon_seatbelt_disable {
    background: url('../../Images/icon/icon_seatbelt_disable.png') no-repeat;
}

.icon_seatbelt_green {
    background: url('../../Images/icon/icon_seatbelt_green.png') no-repeat;
}

.icon_seatbelt_red {
    background: url('../../Images/icon/icon_seatbelt_red.png') no-repeat;
}
/*door disable*/
.icon_door_disable {
    background: url('../../Images/icon/icon_door_disable.png') no-repeat;
}


/*both door close*/
.icon_door_green {
    background: url('../../Images/icon/icon_door_green.png') no-repeat;
}

/*both door Open*/
.icon_door_red {
    background: url('../../Images/icon/icon_door_red.png') no-repeat;
}
/*left door Open*/
.icon_door_left_red {
    background: url('../../Images/icon/icon_door_left_red.png') no-repeat;
}
/*right door Open*/
.icon_door_right_red {
    background: url('../../Images/icon/icon_door_right_red.png') no-repeat;
}

/*aircon*/
.icon_aircon_disable {
    background: url('../../Images/icon/icon_aircon_disable.png') no-repeat;
}

.icon_aircon_green {
    background: url('../../Images/icon/icon_aircon_green.png') no-repeat;
}

.icon_aircon_red {
    background: url('../../Images/icon/icon_aircon_red.png') no-repeat;
}

/*fuel sensor*/
.icon_sensor_disable {
    background: url('../../Images/icon/icon_sensor_disable.png') no-repeat;
}

.icon_sensor_green {
    background: url('../../Images/icon/icon_sensor_green.png') no-repeat;
}

.icon_sensor_red {
    background: url('../../Images/icon/icon_sensor_red.png') no-repeat;
}

.icon_temp_sensor_disable {
    background: url('../../Images/icon/icon_temp_sensor_disable.png') no-repeat;
}

.icon_temp_sensor_green {
    background: url('../../Images/icon/icon_temp_sensor_green.png') no-repeat;
}

.bg-info-window-temp {
    width: 16px;
    height: 16px;
    background-position: center;
    background-size: cover;
    display: inline-block;
}

/**/
.lbl-top {
    position: absolute;
    top: -10px;
    right: 13px;
    font-family: 'CircularStd-Book';
    font-size: 13px;
    background-color: #000 !important;
    line-height: initial;
    padding: 3px 6px;
    border-radius: 13px;
}

/*Tool tip single line*/
.tooltip-inner {
    white-space: nowrap;
    max-width: none;
}


/**/
ul.immobilization {
    padding-top: 10px;
    padding-left: 20px;
}

    ul.immobilization li {
        padding-bottom: 10px;
    }

/*trip-timeline*/

.trip-item {
    margin-bottom: 10px;
    margin-left: 40px;
    position: relative;
    margin-right: 5px;
}

.trip-item1 {
    margin-bottom: 10px;
    margin-left: 40px;
    position: relative;
    margin-right: 5px;
}

.trip-item .trip-inner {
    padding: 10px;
    position: relative;
    border: 1px solid #ddd;
    background: #fff;
}

.trip-item1 .trip-inner {
    padding: 10px;
    position: relative;
    border: 1px solid #ddd;
    background: #fff;
}

.trip-item .trip-inner:before {
    border-right: 10px solid #ddd;
    border-style: solid;
    border-width: 10px;
    color: rgba(0,0,0,0);
    content: "";
    display: block;
    height: 0;
    position: absolute;
    left: -20px;
    top: 6px;
    width: 0;
}

.trip-item1 .trip-inner:before {
    border-right: 10px solid #ddd;
    border-style: solid;
    border-width: 10px;
    color: rgba(0,0,0,0);
    content: "";
    display: block;
    height: 0;
    position: absolute;
    left: -20px;
    top: 6px;
    width: 0;
}

.trip-item1 .trip-inner:after {
    border-right: 10px solid #fff;
    border-style: solid;
    border-width: 10px;
    color: rgba(0,0,0,0);
    content: "";
    display: block;
    height: 0;
    position: absolute;
    left: -18px;
    top: 6px;
    width: 0;
}

.trip-item .trip-inner:after {
    border-right: 10px solid #fff;
    border-style: solid;
    border-width: 10px;
    color: rgba(0,0,0,0);
    content: "";
    display: block;
    height: 0;
    position: absolute;
    left: -18px;
    top: 6px;
    width: 0;
}

.trip-item .trip-outer {
    display: inline-block;
    width: 110px;
    position: absolute;
    border-bottom: 1px dashed #757575;
    color: #9E9E9E;
    padding-bottom: 5px;
    left: -142px;
    top: 6px;
    font-size: 12px;
}

.trip-item1 .trip-outer {
    display: inline-block;
    width: 110px;
    position: absolute;
    border-bottom: 1px dashed #757575;
    color: #9E9E9E;
    padding-bottom: 5px;
    left: -142px;
    top: 6px;
    font-size: 12px;
}

.trip-item:before {
    background: #5d9cec;
    border-radius: 2px;
    bottom: -24px;
    /*box-shadow: 0 0 3px rgba(0,0,0,0.2);*/
    content: "";
    height: 100%;
    left: -30px;
    position: absolute;
    width: 3px;
}

.trip-item1:before {
    /*background: #5d9cec;*/
    border-radius: 2px;
    bottom: -24px;
    /*box-shadow: 0 0 3px rgba(0,0,0,0.2);*/
    content: "";
    height: 100%;
    left: -30px;
    position: absolute;
    width: 3px;
}

.trip-item:after {
    background: #fff;
    border: 2px solid #2196F3;
    border-radius: 50%;
    content: "";
    height: 15px;
    left: -36px;
    position: absolute;
    top: 10px;
    width: 15px;
}

.trip-item1:after {
    background: #fff;
    border: 2px solid #2196F3;
    border-radius: 50%;
    content: "";
    height: 15px;
    left: -36px;
    position: absolute;
    top: 10px;
    width: 15px;
}

/*.trip-item.start:after {
        border: 2px solid #9CCC65;
    }

    .trip-item.end:after {
        border: 2px solid #EF5350;
    }*/

.trip-item.end:before {
    box-shadow: none;
}

.trip-item1.end:before {
    box-shadow: none;
}

.trip-inner.active .trip-head {
    border-bottom: 1px solid #eee;
    margin-bottom: 5px;
    padding-bottom: 5px;
}

.trip-inner .trip-body {
    display: none;
}

.trip-inner.active .trip-body {
    display: block;
}

.trip-inner .trip-body > .div-location {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.trip-inner .trip-body .div-details {
    padding-top: 5px;
}

    .trip-inner .trip-body .div-details > span {
        font-size: 13px;
        color: #9E9E9E;
    }

.trip-item .trip-head h5 {
    font-size: 15px;
    font-weight: 400;
    margin: 0;
    color: #333;
    position: absolute;
    width: 72%;
    padding-top: 2px;
}

    .trip-item .trip-head h5.fuel, .trip-item1 .trip-head h5.fuel {
        width: 84% !important;
    }

.trip-item1 .trip-head h5 {
    font-size: 15px;
    font-weight: 400;
    margin: 0;
    color: #333;
    position: absolute;
    width: 72%;
    padding-top: 2px;
}

.trip-item .trip-head span {
    color: #9E9E9E;
    font-size: 13px;
    padding-top: 1px;
}

.trip-item1 .trip-head span {
    color: #9E9E9E;
    font-size: 13px;
    padding-top: 1px;
}

hr.divider {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
    border-style: dashed;
    border-color: #ada7a7;
}

.btn-act.active, .btn-act.active:active, .btn-act.active:focus {
    background-color: #5d9cec !important;
    box-shadow: none !important;
    border-color: #5d9cec;
}
/**/
.navbar-right ul.menu-right li > a {
    padding: 8px 15px 8px 15px !important;
    line-height: 16px !important;
}

    .navbar-right ul.menu-right li > a > em {
        font-size: 14px;
        color: #6a75c3;
    }

/**/
em.cluster-on, em.arabic-on, em.poi-on, em.traffic-on, em.cluster-info-on {
    color: #333 !important;
}

em.cluster-off, em.arabic-off, em.poi-off, em.traffic-off, em.cluster-info-off {
    color: #cccccc !important;
}

em.icon-pin-text.poi-on {
    color: #5eb179 !important;
}
/**/
.beta_version {
    position: absolute;
    top: 7px;
    right: 6px;
    text-align: center;
    font-size: 8px;
    padding: 3px 2px 2px 3px;
    line-height: 0.8;
    background-color: #424242;
    color: #fff;
    letter-spacing: 1px;
}

.mr-30per {
    margin-right: 38%;
}

.i_20 {
    width: 20px;
    height: 20px;
}


.i_25 {
    width: 25px;
    height: 25px;
}

.count-section:hover, .count-section.active {
    background-color: #fbbc2c;
}

    .count-section.active h3 {
        color: #fff !important;
    }

.count-section {
    cursor: pointer;
    padding: 6px 0px;
}

.i_30 {
    height: 30px;
    width: 30px;
}

.i_35 {
    height: 35px;
    width: 35px;
}

/**/
.dtp-btn-ok {
    margin-left: 10px;
    background-color: #91c247;
    color: #fff;
}

.trackIcon-info {
    position: absolute;
    background-color: #fff;
    border: 1px solid #eee;
    padding: 10px;
    display: inline-block;
    top: 46px;
    right: -10px;
}

/*alert msg popup*/

#haduken.iziToast {
    background: #fff !important;
    border: 1px solid #eee;
    box-shadow: 1px 2px 2px #eee;
    width: 320px;
}

    #haduken.iziToast > .iziToast-cover {
        background-color: #fff !important;
        margin-left: 18px !important;
    }

    #haduken.iziToast > .iziToast-body {
        padding: 0 0 0 25px !important;
        border-left: 1px solid #e6ebec !important;
    }

#haduken .iziToast-message {
    padding-top: 5px !important;
    line-height: 18px;
}

#haduken.iziToast::after {
    box-shadow: none !important;
}

/**/
.list-group-poi ul.poizone-group-filter {
    margin: 0px 10px 10px 0px;
    padding: 0;
}

    .list-group-poi ul.poizone-group-filter > li {
        list-style: none;
        border-left: 2px solid #fff;
        border-bottom: 1px solid #eee;
    }

        .list-group-poi ul.poizone-group-filter > li:last-child {
            list-style: none;
            border-left: 3px solid #fff;
            border-bottom: 1px solid #fff;
        }

.list-group-poi .l-col {
    padding-right: 0px;
}

.list-group-poi .btn-group-more {
    visibility: hidden;
}

.list-group-poi ul.poizone-group-filter > li:hover, .list-group-poi ul.poizone-group-filter > li.active {
    border-left: 2px solid #9E9E9E;
    /*cursor: pointer;*/
}

    .list-group-poi ul.poizone-group-filter > li:hover .btn-group-more, .list-group-poi ul.poizone-group-filter > li.active .btn-group-more {
        visibility: visible;
    }

.list-group-poi ul.poizone-group-filter > li .row {
    padding: 8px 10px;
}

.list-group-poi .row small {
    font-size: 12px;
    color: #adadad;
    display: block;
    padding-top: 3px;
}

.list-group-poi .row strong {
    font-weight: 400;
}



.list-group-poi .circle-border {
    /*border: 1px solid #E0E0E0;
    width: 38px;
    height: 38px;
    border-radius: 50%;*/
    display: inline-block;
}

    .list-group-poi .circle-border img {
        /*margin-top: 10px;
        margin-left: 10px;*/
    }

.location-ellipsis a.poi-name {
    color: #333;
    text-decoration: none;
    font-size: 13px;
}

.list-group-record:hover a.poi-name {
    color: #2196F3;
    text-decoration: none;
}
/**/

a.v-summary {
    color: #333;
    padding: 5px 0px 5px 8px;
    text-decoration: none !important;
    white-space: nowrap;
}

    a.v-summary:hover, a.v-summary.active {
        color: #333;
        background-color: #E0E0E0;
        padding: 5px 0px 5px 8px;
        text-decoration: none !important;
    }
/**/
.text-muted0 {
    color: #BDBDBD !important;
}

.c-000 {
    color: #000 !important;
}

.c-333 {
    color: #333 !important;
}

/**/
.dropdown-menu-grp {
    width: 280px;
}
/**/
.circlecount {
    display: inline-block;
    background-color: #56a0ed;
    color: #fff;
    border-radius: 50%;
    width: 40px;
    font-size: 16px;
    height: 40px;
    top: 14px;
    left: 45%;
    line-height: 40px;
    text-align: center;
    position: absolute;
    z-index: 1;
}
/**/
.dropdown-menu.dropdown-filter {
    min-width: 280px;
    padding: 10px 15px 15px 15px;
    margin-top: 5px;
    border-radius: 10px;
}

#TxtFilterNumberDiv input#TxtFilterNumber {
    padding: 0 10px;
    margin-left: 3px;
}

.dropdown-menu.dropdown-filter .form-group {
    margin-bottom: 5px !important;
}

.fleet-tab .tab-pane {
    min-height: 350px;
}

.fleet-tab ul > li > a {
    text-align: center;
    padding: 12px 20px;
    line-height: 15px;
    /*background-color: #f5f5f5;
        border: 1px solid #eeeeee;
        color: #fff;*/
}

    .fleet-tab ul > li.active > a, .fleet-tab ul > li > a:hover, .fleet-tab ul > li > a:focus, .fleet-tab ul > li > a:active {
        /*background-color: #fff !important;
        border: 1px solid #eeeeee !important;
        color: #fff !important;*/
    }

    .fleet-tab ul > li > a > em {
        font-size: 22px;
    }

    .fleet-tab ul > li > a > img {
        width: 26px !important;
        height: 26px !important;
    }

.fleet-tab .tab-content {
    border-width: 0px 1px 0px 0px !important;
}

.btn.btn-back-icon {
    padding: 6px 12px !important;
}

.empty-address {
    color: #ff0e0e !important;
}

/**/
.groupRouteOptimizeScroll {
    max-height: calc(100vh - 250px);
    overflow-y: auto;
}
/**/

/**/
.groupVehicleScroll {
    max-height: calc(100vh - 360px);
    overflow-y: auto;
}
/**/
.alertVehicleScroll {
    max-height: calc(100vh - 466px);
    overflow-y: auto;
}

    .alertVehicleScroll table {
        margin-bottom: 0px;
    }

    .alertVehicleScroll td > label {
        margin-left: 10px;
        font-weight: 500;
    }

    .alertVehicleScroll label > span {
        margin-right: 10px;
    }


/**/

.group-btn-material .btn-default, .group-btn-material .btn-default:hover, .group-btn-material .btn-default:focus, .group-btn-material .btn-default:active {
    border: none !important;
    background-color: transparent !important;
    color: #707480;
    padding: 6px 12px 6px 5px;
}

.fullscreen .col-group-filter {
    width: 18% !important;
    padding-left: 20px;
}

.fullscreen .col-search-filter {
    width: 25% !important;
    padding-right: 30px;
}

/**/
.list-group-alert {
    min-height: calc(100vh - 372px);
    height: calc(100vh - 372px);
    overflow-y: auto;
}

    .list-group-alert img {
        width: 26px;
        height: 26px;
    }

    .list-group-alert .list-group-item:hover {
        background-color: #fafafa;
    }

    .list-group-alert .list-group-item.current {
        border-left: 3px solid #5d9cec;
    }

        .list-group-alert .list-group-item.current h3 {
            color: #5d9cec !important;
        }
/**/

.list-group-student .list-group-item {
    border: none !important;
    border-bottom: 1px solid #eee !important;
    border-radius: 0px !important;
    margin-bottom: 0px !important;
}

.student-box-heading {
    margin-bottom: 4px;
    color: #333;
    font-weight: 400 !important;
    font-size: 15px;
}
/**/
.bs-none {
    box-shadow: none;
}

.p-summary {
    box-shadow: none;
    margin-bottom: 0px;
}

    .p-summary .h2 {
        font-size: 24px !important;
        margin: 0px 0px 10px 0px !important;
    }

        .p-summary .h2 > span {
            font-size: 18px !important;
        }

/*#reportSummaryModal .modal-dialog {
    margin: 180px auto !important;
}*/


/**/
.table-nobordered td, .table-nobordered th {
    border: none !important;
}

/* Hide hichart link*/
.highcharts-credits {
    display: none !important;
}

.highcharts-pie-series .highcharts-point {
    stroke: #EDE;
    stroke-width: 2px;
}

.highcharts-pie-series .highcharts-data-label-connector {
    stroke: silver;
    stroke-dasharray: 2, 2;
    stroke-width: 2px;
}

.p-0820 {
    padding: 8px 20px !important;
}

.visible-sm-icon {
    display: none !important;
}

@media (max-width: 991px) and (min-width: 768px) {
    .visible-sm-icon {
        display: inline-block !important;
    }
}

.p-1210 {
    padding: 12px 10px !important;
}

.pt-8 {
    padding-top: 8px;
}

.bg-gray-custom {
    background-color: #717172;
    color: #fff !important;
}

tr.td-bt-n td {
    border-top: 0px !important;
}
/**/
.PTS {
    font-size: 11px;
    background-color: #C8E6C9;
    padding: 1px 3px;
    color: #000;
    border: 1px solid #A5D6A7;
    margin-right: 3px;
}

.PT {
    font-size: 11px;
    background-color: #A5D6A7;
    padding: 1px 3px;
    color: #000;
    border: 1px solid #81C784;
    margin-right: 3px;
}

.DTS {
    font-size: 11px;
    background-color: #FFCDD2;
    padding: 1px 3px;
    color: #000;
    border: 1px solid #EF9A9A;
    margin-right: 3px;
}

.DT {
    font-size: 11px;
    background-color: #EF9A9A;
    padding: 1px 3px;
    color: #000;
    border: 1px solid #E57373;
    margin-right: 3px;
}

.btn-success.btn-download {
    background-color: #fff !important;
    color: #4CAF50 !important;
    border: 1px solid #4CAF50 !important;
}

.btn-danger.btn-download {
    background-color: #fff !important;
    color: #f44336 !important;
    border: 1px solid #f44336 !important;
}

.btn-download i {
    padding-right: 10px;
    font-size: 16px;
}

.btn-success.btn-download:hover {
    background-color: #F1F8E9 !important;
}

.btn-danger.btn-download:hover {
    background-color: #FFEBEE !important;
}


.trip-map-view-full-screen {
    position: fixed !important;
    top: 7%;
    height: 100% !important;
    z-index: 2;
}

.trip-map-view-buttons {
    left: 95% !important;
    top: 70px !important;
    position: fixed;
    z-index: 3;
}

.Direction_UI_distance_box {
    background-color: #f5f5f5;
    border: 1px solid #bdbdbd;
    padding: 10px;
}

/* History summary Options 9/1/2018 */

.history-options {
    position: absolute;
    top: 10%;
    background: #fff;
    box-shadow: 2px 3px 5px rgba(0, 0, 0, 0.18);
    border: 1px solid #ddd;
    width: 255px;
    z-index: 1;
}

.fs_13 {
    font-size: 13px;
}

.history-options .icon_div {
    text-align: center;
    border-radius: 100%;
    margin-right: 0;
    font-size: 14px;
    color: #2979FF;
    width: 20px;
}


.history-options ul li .title_name {
    color: #757575;
}

.history-options ul li {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1411764705882353);
    padding: 8px 15px;
}

.history-options table tr td {
    padding: 5px;
}

.fs_16 {
    font-size: 16px;
}

.ml-auto {
    margin-left: auto;
}

.fs_14 {
    font-size: 14px;
}

.history-link-circle {
    font-weight: 700;
    color: #2979FF;
    cursor: pointer;
    text-decoration: underline;
}

    .history-link-circle:hover {
        text-decoration: underline;
    }

.close-history {
    font-weight: 700;
    border-radius: 50%;
    width: 29px;
    height: 29px;
    display: inline-block;
    text-align: center;
    color: #4a4a4a;
    cursor: pointer;
    font-weight: 500;
    text-decoration: none;
    position: absolute;
    right: -14px;
    top: -14px;
    font-size: 22px;
    background: #fff;
}

/* History summary Options 9/1/2018 */


/* Dashboard Servica and maintenance */
.panel_custom {
    border: 1px solid rgba(0, 0, 0, 0.16);
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.11);
    border-radius: 3px;
}

    .panel_custom .panel_header {
        display: block;
        padding: 15px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.16);
    }

    .panel_custom > .panel_header > h4 {
        font-weight: 500;
        font-size: 16px;
        margin: 0;
        text-transform: capitalize;
    }

.overflow_hidden {
    overflow: hidden;
}

.pl-8 {
    padding-left: 8px !important;
}

.pr-8 {
    padding-right: 8px !important;
}

.fs-25 {
    font-size: 25px;
}

.fs-28 {
    font-size: 28px;
}

.fs-47 {
    font-size: 47px;
}

.fs-55 {
    font-size: 55px;
}

.fs-40 {
    font-size: 40px;
}

.chart-pie-custom .legend {
    display: none;
}

ul.chart-today-performance {
    padding: 0;
    list-style: none;
    margin: 0;
}

    ul.chart-today-performance li {
        padding: 22px 15px;
        border-bottom: 1px solid rgba(0,0,0,.12);
    }

        ul.chart-today-performance li:last-child {
            border-bottom: 0 !important;
        }

.filter_header {
    display: block;
    /*padding: 15px;*/
    background: #fff;
}

.filter_btn {
    padding: 12px;
    background: #717171;
    color: #fff;
    border-radius: 50%;
    text-decoration: none;
    font-size: 11px;
    opacity: 0.8;
    transition: 0.2s;
}

    .filter_btn:hover, filter_btn:focus {
        background: #818181;
        opacity: 1;
        color: #fff !important;
    }

.chart-pie-today {
    display: block;
    width: 85%;
    height: 342px;
    margin: 0 auto;
}

.pt_20 {
    padding-top: 20px;
}

.pb_20 {
    padding-bottom: 20px;
}

.h_100vh {
    height: 100vh;
}

.service_dashboard {
    display: block;
    margin-top: 15px;
    position: relative;
    height: 100%
}

.asidebar-menu {
    margin-top: 0;
}


    .asidebar-menu ul li, #school_sidebar_ul > li {
        position: relative;
    }


        .asidebar-menu ul li span.count {
            position: absolute;
            top: -5px;
            font-weight: 500;
            right: 10px;
            padding: 0 5px;
            background: #777777;
            color: #fff;
            border-radius: 5px;
        }

    .asidebar-menu > ul > li {
        width: 100% !important;
        border-left: 0px !important;
    }

        .asidebar-menu > ul > li > a {
            color: #929292 !important;
            width: 33px;
            height: 33px;
            display: block;
            margin: 0 auto;
            line-height: 33px;
            border-radius: 100%;
            font-weight: 600;
            transition: 0.2s all;
            margin-bottom: 18px;
            text-decoration: none;
            text-indent: 0px !important;
            padding: 0 !important;
            border: 1px solid transparent;
            border-radius: 50%;
            padding: 0px !important;
            text-align: center;
        }


#school_sidebar_ul > li > a {
    color: #929292;
    display: block;
    margin: 0 auto;
    line-height: 0;
    font-weight: 600;
    transition: 0.2s all;
    margin-bottom: 10px;
    text-decoration: none;
    padding: 0;
    text-indent: 0px;
    height: auto;
    text-align: center;
    height: 50px;
    width: 50px;
    line-height: 50px;
    border: 1px solid transparent;
    border-radius: 50%;
}

    #school_sidebar_ul > li > a.active {
        border-color: #ddd;
    }

.asidebar-menu ul li a:hover,
.menus-sidebar.active {
    background-color: rgba(0, 0, 0, 0.07);
}

.asidebar-menu ul.nav li a img {
    width: 20px;
}

.chart-fuel-line {
    min-height: 335px;
    max-height: 335px;
}

.service_heading_div {
    padding: 7px 15px;
    border-bottom: 1px solid #ddd;
}

    .service_heading_div h2 {
        margin: 0;
        font-size: 17px;
        font-weight: 600;
        display: inline-block;
        margin-top: 9px;
        color: #6d6d6d;
    }

.btn-blue-date, .btn-blue-date:hover, .btn-blue-date:focus {
    background: #0c84e4;
    color: #fff;
}

.fs_38 {
    font-size: 38px;
}


.fs_15 {
    font-size: 15px;
}

.fs_18 {
    font-size: 18px;
}

.fs-22 {
    font-size: 22px;
}

/* Dashboard Servica and maintenance */

.btn-group-custom label.active, .btn-group-custom label.focus, .btn-group-custom label.active:focus {
    background-color: #2f80e7 !important;
    color: #fff !important;
    border: 1px solid #2f80e7;
    outline: 0 !important;
}

.w-10per-table {
    width: 10% !important;
}

.long_text_table {
    width: 250px !important;
    max-width: 250px !important;
    min-width: 250px !important;
    word-wrap: break-word !important;
}

.text-overflow {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fs-32 {
    font-size: 32px;
}

.fs-35 {
    font-size: 35px;
}


.btn-oval {
    border-radius: 50px;
}

.d-none {
    display: none;
}

.d-block {
    display: block;
}

.light-gray-bg {
    background-color: #FBFAFA;
}

/*Dashboard service maintenance end here*/

/*Trip View 19-01-2019 Start*/

.nav-tabs-custom li.active a,
.nav-tabs-custom li.active a:focus {
    font-weight: 500;
    color: #0b3896;
}

.nav-tabs-custom > li > a {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.trip_view_table_fs {
    font-size: 22px;
    font-weight: 500;
}

.panel-heading-bb {
    border-bottom: 1px solid #eee !important;
}

.panel-icon-main {
    margin: 13px 0 !important;
    padding: 15px;
    border: 1px solid #ececec;
    border-radius: 3px;
}

.panel-gray-bg {
    background: rgba(0, 0, 0, 0.04) !important;
}

    .panel-gray-bg .panel-heading {
        background: rgba(0, 0, 0, 0.07) !important;
    }

.panel-icon-main .panel-icon-heading {
    text-align: right;
}

    .panel-icon-main .panel-icon-heading .panel-icon {
        border-radius: 3px;
        background-color: #fff;
        padding: 5px;
        /*margin-top: -41px;
    margin-right: 16px;*/
        float: left;
        /*box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.11);*/
    }

    .panel-icon-main .panel-icon-heading i {
        font-size: 30px;
        line-height: 50px;
        width: 45px;
        height: 45px;
        text-align: center;
    }

.trip-tab-content {
    min-height: 455px;
    max-height: 455px;
    overflow-y: auto;
    overflow-x: hidden;
}

.trip-overview-left {
    /*min-height: 428px;
    max-height: 428px;*/ margin-bottom: 0px;
}

.trip-view-overview-table tbody tr td {
    padding: 6px 5px !important;
}

.panel-circle {
    width: 55px;
    height: 55px;
    background-color: #f3f3f3;
    border-radius: 50%;
    text-align: center;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.25882352941176473);
    line-height: 45px;
}

.text-matgray {
    color: #767676;
}
/*Trip View 19-01-2019 End*/

/* CSS Start - Poi wise fleet distribution dashboard component */
.p-1015 {
    padding: 10px 15px !important;
}


.media-box-poi:first-child {
    margin-top: 0;
    border-top: 0px solid #bdbdbd;
    padding-top: 15px !important;
}

.media-box-poi {
    margin-top: 0px;
    padding: 20px 0;
    border-top: 1px solid #d0d0d0;
}

    .media-box-poi > .pull-left {
        margin-right: 20px;
    }
/* CSS End - Poi wise fleet distribution dashboard component */


#fc_frame {
    display: none;
}

.tracking_btn.btn-info.active {
    color: #fff;
    background-color: #1aacda;
    border-color: #179ac3;
}

.tracking_btn.btn-warning.active {
    color: #fff;
    background-color: #ff8517;
    border-color: #fc7800;
}
/* Fleet Count Dashboard tab View start 18/06/2019*/
.nav_fleet_tabView li {
    margin-bottom: 0px;
}

    .nav_fleet_tabView li a {
        background-color: #fff;
        padding: 10px 8px;
        border: 0px;
        border-bottom: 0px !important;
    }

.nav_fleet_tabView {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    margin-top: 1px;
}


    .nav_fleet_tabView li a .status_name {
        font-weight: 500;
        font-size: 11px !important;
        margin-bottom: 5px;
    }

    .nav_fleet_tabView li a .status_count {
        font-size: 24px;
        font-weight: 700;
        line-height: 1;
    }

    .nav_fleet_tabView li.active a {
        border: 0px;
        color: #fff;
        background-color: #2196f3;
    }

        .nav_fleet_tabView li.active a .status_count {
            color: #fff !important;
        }

        .nav_fleet_tabView li.active a:hover {
            background-color: #2196f3 !important;
            color: #fff;
            border: 0px;
        }

    .nav_fleet_tabView li a:hover {
        background-color: #fff;
        border: 0px;
    }

    .nav_fleet_tabView > li.active > a:focus {
        background-color: #2196f3 !important;
        color: #fff;
        border: 0px;
    }
/* Fleet Count Dashboard tab View End 18/06/2019*/

.fleet_alerts_tbl tr:first-child td {
    border-top: 0px !important;
}

.position-relative {
    position: relative;
}

.panel_box {
    border-radius: 5px;
    -webkit-box-shadow: 0 1px 11px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 1px 11px 0 rgba(0, 0, 0, 0.12);
    margin-bottom: 20px;
    border: 0px;
}

    .panel_box > .panel-body,
    .panel_box .panel-body {
        border: 0;
        padding: 15px;
    }


    .panel_box .panel-heading-h4 {
        font-family: 'CircularStd-Book';
        font-size: 17px;
        color: #3a3a3a;
        margin: 0;
        padding: 16px;
        font-size: 15px;
        font-weight: 600;
    }

/*Service and maintenance New 03/07/2019 */

.Service_maint_dash_bg {
    background-color: #f9f9f9;
    border-top: 0px;
    margin-bottom: 20px;
    padding-bottom: 20px;
}

.Vehicle_expense_ul {
    margin-bottom: 0;
    overflow: hidden;
}

    .Vehicle_expense_ul li {
        float: left;
        width: 100%;
        text-align: center;
        padding: 8px 15px;
        border-bottom: 1px solid #ddd;
    }

        .Vehicle_expense_ul li:last-child {
            border-bottom: 0px solid #ddd;
        }

.expense_Report .legend {
    display: none;
}

.chart-pie-today {
    display: block;
    width: 90%;
    height: 203px;
    margin: 0 auto;
}

ul.chart-today-performance li {
    padding: 15px 5px;
    border-bottom: 0px solid rgba(0,0,0,.12) !important;
    width: calc(100% / 3);
    float: left;
    border-right: 1px solid #ddd;
    text-align: center;
}

    ul.chart-today-performance li:last-child {
        border-right: 0 !important;
    }

.Reminders_ul {
    border: 0;
}

    .Reminders_ul li {
        width: calc(100% / 3 );
        float: left;
        margin: 0;
    }

.Reminders_ul {
    border: 1px solid #ddd;
}

    .Reminders_ul li {
        border-right: 1px solid #ddd;
    }

        .Reminders_ul li:last-child {
            border: 0px;
        }

        .Reminders_ul li.active a {
            border: 0 !important;
            background-color: #2196f3;
            color: #fff;
        }

            .Reminders_ul li.active a h2,
            .Reminders_ul li.active a p {
                color: #fff;
            }

            .Reminders_ul li.active a:hover,
            .Reminders_ul li.active a:focus {
                border: 0 !important;
                background-color: #2196f3 !important;
                color: #fff;
            }

        .Reminders_ul li a {
            background-color: #fff;
            border: 0;
            padding: 10px 0px;
        }

.Reminders_tab {
    border: 1px solid #ddd;
    padding: 10px !important;
    border-top: 0px;
}

.Reminders_tbl {
    margin-bottom: 0px;
}

    .Reminders_tbl tr td {
        padding: 15px 5px;
    }

.Expense_tab {
    list-style: none;
    margin-bottom: 0px;
    margin-top: 10px;
    padding: 0px;
}

    .Expense_tab li {
        float: left;
    }

        .Expense_tab li a {
            display: inline-block;
            padding: 5px 9px;
            border: 1px solid #2A57C6;
            margin-left: 5px;
            border-radius: 50px;
            font-size: 12px;
            color: #2A57C6;
            -webkit-font-smoothing: initial;
            font-weight: 500;
            text-decoration: none;
            font-family: 'CircularStd-Book';
            font-weight: 500;
        }

            .Expense_tab li a.active {
                background-color: #2A57C6;
                color: #fff;
            }

.Expense_summary_total {
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
}

    .Expense_summary_total .number {
        font-size: 18px;
        font-weight: 600;
    }

/*Service and maintenance New 03/07/2019 End*/


.map_view_setting {
    margin-bottom: 15px;
}

    .map_view_setting a {
        display: inline-block;
        margin-right: 10px;
        border: 1px solid transparent;
        padding: 3px;
    }

        .map_view_setting a img {
            border-radius: 50%;
        }

    .map_view_setting a {
        margin-right: 15px;
    }

        .map_view_setting a.active {
            border: 1px solid #2196F3;
            border-radius: 50%;
            padding: 3px;
        }

.dashboard_layout_setting .layout_inner {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}


.nav_tabs_custom1 {
    border-bottom: 1px solid #eee;
}

ul.nav_tabs_custom1 > li > a {
    font-weight: 500;
    color: #5f6368;
}

ul.nav_tabs_custom1 > li {
    border: 0;
}

    ul.nav_tabs_custom1 > li > a:hover {
        background-color: rgba(32,33,36,0.059) !important;
        color: #333 !important;
    }

    ul.nav_tabs_custom1 > li.active:hover {
        background-color: rgba(32,33,36,0.059) !important;
        color: #1a73e8 !important;
    }

    ul.nav_tabs_custom1 > li > a {
        border: 0 !important;
        margin-bottom: -1px !important;
        background-color: transparent;
    }

    ul.nav_tabs_custom1 > li.active > a {
        color: #3D3D3D;
        border-bottom: 3px solid #878787 !important;
        border-top-left-radius: 2px;
        border-top-right-radius: 2px;
        font-size: 14px;
        line-height: 21px;
        font-weight: bold !important;
    }


.dashboard_layout_setting .layout_inner a {
    margin-right: 20px;
    border: 1px solid transparent;
    display: inline-block;
    padding: 3px;
    border-radius: 3px;
}

    .dashboard_layout_setting .layout_inner a.active {
        border: 1px solid #2196F3;
    }

/*.traditional#DashboardVehiclePanel{
    border-top:1px solid #ddd;
}*/

.tooltipControl {
    position: absolute;
    background: #ffffcc;
    border-radius: 5px;
    padding: 3px;
    text-align: left;
    font-size: 11px;
    border: 1px solid rgb(103, 103, 103);
    z-index: 1111;
    font-weight: 500;
}




/* Language Dropdown */
.lang_dropdown .dropdown-toggle {
    background-color: #fff;
}

    .lang_dropdown .dropdown-toggle:active {
        box-shadow: none;
    }

.lang_dropdown .dropdown-menu {
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.07);
}

    .lang_dropdown .dropdown-menu > li > a {
        padding: 5px 13px !important;
        font-size: 12px !important;
        font-weight: 400 !important;
    }

.overflow_inital {
    overflow: initial !important;
}


/* Login style 16/07/2019 */
.login_container {
    position: relative;
    background-color: rgba(57, 115, 230, 0.04);
    background-color: #f5f7fa;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    color: #000;
}

.login_page {
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 100vh;
    justify-content: center;
}

.login_page_slider {
    width: 80%;
    margin: 0 auto;
}

    .login_page_slider img {
        width: 80%;
        margin: 0 auto;
    }

    .login_page_slider .content-details {
        margin-top: 35px;
    }

        .login_page_slider .content-details h2 {
            font-size: 51px;
            font-weight: 500;
            margin-bottom: 15px;
            color: #4d4d4d;
            margin-top: 0;
        }

            .login_page_slider .content-details h2 span {
                color: #ff620f;
            }

        .login_page_slider .content-details p {
            margin-bottom: 10px;
            font-size: 20px;
        }

.login_header {
    position: absolute;
    top: 10%;
    width: 100%;
}

.form-group-icon .icon {
    right: initial;
    left: 0;
    width: 38px;
    height: 45px;
    line-height: 45px;
    font-size: 16px;
}

.form-group-icon .form-control.control-material {
    padding: 6px 6px 6px 40px;
    height: 45px;
}

.form-group-icon .pass-show {
    right: 0;
    left: auto;
    width: 38px;
    height: 45px;
    line-height: 45px;
    font-size: 18px;
    cursor: pointer;
    position: absolute;
    pointer-events: auto;
    z-index: 9;
}

.form-group-icon {
    margin-bottom: 20px;
}

.login_form_shadow {
    box-shadow: -5px 0px 9px rgba(0, 0, 0, 0.16);
}

.remember_pass span {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin-left: -18px;
    width: 18px;
    height: 18px;
    border-radius: 2px;
    border: 1px solid #ccc;
    margin-right: 10px;
    text-align: center;
}

.remember_pass label {
    min-height: 21px;
    padding-left: 28px;
    margin-bottom: 0;
    font-weight: 400;
    cursor: pointer;
}

.hr-style {
    border-width: 1px;
    border-color: #afafaf;
}

.vs-btn-close {
    display: block;
    line-height: 30px;
    background-color: #fff;
    color: #000;
    text-align: center;
    font-size: 20px;
    box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.52);
    border-radius: 50%;
    font-weight: 500;
}

.vs-close-parent {
    position: absolute;
    right: -15px;
    top: -18px;
    background: #fff;
    border-radius: 50px;
    color: #000;
    width: 30px;
    height: 30px;
    z-index: 9 !important;
    border-radius: 50%;
}

.tab_vehicle_history {
    border: 0;
    padding: 15px;
    height: calc(100vh - 190px);
}

.vs_history_bottom_summary {
    position: absolute;
    bottom: -4px;
    width: 100%;
    left: 0;
    background-color: #ddd;
}

.summary_body {
    display: none;
    background-color: #f3f3f3 !important;
}

    .summary_body .summary_data_section {
        background-color: #fff;
        border: 1px solid #ddd;
    }

.vs_history_bottom_summary .panel-heading {
    background-color: #e0e0e0 !important;
    border-radius: 0px;
    cursor: pointer;
}


.vt_bottom_show {
    bottom: 00px !important;
}

.VHS-Sidebar {
    position: absolute;
    background-color: #fff;
    z-index: 99;
    height: calc(100vh - 143px);
    box-shadow: 7px -6px 5px rgba(0, 0, 0, 0.21);
    width: 0px;
}

.VHS-text-overflow {
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 150px;
    overflow: hidden;
    display: block;
}

.VHS-table {
    margin-bottom: 0px;
}

    .VHS-table td {
        border-top: 0px !important;
        font-size: 11px;
        padding: 5.5px 5px !important;
    }

.VHS-history-timeline .VHS-table tbody tr td:first-child span.bullet {
    position: absolute;
    width: 21px;
    height: 21px;
    background-color: #fff;
    left: -25px;
    border-radius: 50%;
    text-align: center;
    line-height: 20px;
    color: #2196f3;
    font-weight: 600;
    border: 1px solid #2196f3;
    font-size: 12px;
}

    .VHS-history-timeline .VHS-table tbody tr td:first-child span.bullet.active {
        background-color: #2196f3;
        color: #fff;
    }

.VHS-history-timeline {
    position: relative;
    margin-left: 25px;
    padding-left: 0;
}

    .VHS-history-timeline:before {
        content: "";
        position: absolute;
        left: -15px;
        width: 1px;
        height: 100%;
        background-color: #38a7ff;
        top: 0px;
    }

.VHS-slideOut {
    cursor: pointer;
    position: absolute;
    width: 25px;
    height: 35px;
    line-height: 40px;
    text-align: center;
    right: -25px;
    background-color: #fff;
    box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.34);
    top: 40px;
    display: none;
}

.VHS-divider {
    text-align: center;
}

.VHS-divider {
    display: block;
    position: relative;
}

    .VHS-divider:after {
        content: '';
        position: absolute;
        width: 42%;
        height: 1px;
        background-color: #d8d8d8;
        top: 50%;
        left: 9px;
        transform: translateY(-50%);
    }


    .VHS-divider::before {
        content: '';
        position: absolute;
        width: 42%;
        height: 1px;
        background-color: #d8d8d8;
        top: 50%;
        left: 55%;
        transform: translateY(-50%);
    }

.location_name_col {
    width: 250px !important;
    max-width: 250px !important;
    min-width: 250px !important;
}

.poisuggestion_body {
    min-height: 330px;
    max-height: 330px;
    overflow-y: auto;
}

.poisuggestion_shape {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    z-index: 9;
    top: 5px;
}

.btn-outline-blue {
    border-color: #409ee8 !important;
    color: #409ee8 !important;
}

    .btn-outline-blue:hover {
        background-color: #409ee8;
        color: #fff !important;
    }

.service_aside_bar {
    position: fixed;
    top: 5px;
    top: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 1;
}

    .service_aside_bar .asidebar-menu ul {
        margin-top: 55px !important;
    }

ul#school_sidebar_ul {
    padding-top: 20px !important;
}

.service_dashboard_content {
    margin-left: 95px;
}

.setup_icon {
    position: absolute;
    bottom: 30px;
    width: 100%;
    text-align: center;
}

.setup_icons {
    position: absolute;
    bottom: 75px;
    width: 100%;
    text-align: center;
}

.setup_icon a.menus-sidebar {
    width: 21px;
    height: 21px;
    display: block;
    margin: 0 auto;
}

    .setup_icon a.menus-sidebar.active {
        color: #000;
    }


.setup_icons a.menus-sidebar {
    width: 21px;
    height: 21px;
    display: block;
    margin: 0 auto;
}

    .setup_icons a.menus-sidebar.active {
        color: #000;
    }


.lable_show_only {
    background-color: #fff;
    color: #333;
    border: 1px solid #ddd;
    margin: 0 2px;
    padding: 4px 10px;
    font-size: 72%;
}

.arrow-card-body {
    position: relative;
    border-color: rgba(0, 0, 0, 0.18);
}

/*********************** Datatable pagination start  *************************/
.dataTables_paginate_custom {
    text-align: center !important;
}


.dataTables_paginate_custom {
    text-align: center !important;
}

    .dataTables_paginate_custom ul.pagination li.paginate_button {
        display: inline-block;
        width: 32px;
        height: 32px;
        margin: 0 4px;
        text-align: center !important;
    }

        .dataTables_paginate_custom ul.pagination li.paginate_button a {
            width: 100%;
            padding: 0;
            height: 100%;
            border-radius: 50%;
            line-height: 30px;
            font-size: 12px;
            border: 1px solid #c5c5c5;
        }

    .dataTables_paginate_custom .paginate_button.previous a,
    .dataTables_paginate_custom .paginate_button.next a {
        width: 35px;
        height: 35px;
        display: inline-block;
        text-align: center;
    }

    .dataTables_paginate_custom li.paginate_button.disabled a {
        color: #292929;
        line-height: 23px;
    }

    .dataTables_paginate_custom .paginate_button.next a:after,
    .dataTables_paginate_custom .paginate_button.previous a:before {
        left: 50%;
        top: 0;
        font-size: 17px;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }
/*********************** Datatable pagination end  *************************/

/********************** Style Datatable pagination start  ************************/
.dataTable-paginate-circle-widget {
    text-align: center !important;
}

    .dataTable-paginate-circle-widget ul.pagination li.paginate_button {
        display: inline-block;
        width: 25px;
        height: 25px;
        margin: 0 4px;
        text-align: center !important;
    }

        .dataTable-paginate-circle-widget ul.pagination li.paginate_button a {
            width: 100%;
            padding: 0;
            height: 100%;
            border-radius: 50%;
            line-height: 23px;
            font-size: 12px;
            border: 1px solid #c5c5c5;
        }

        .dataTable-paginate-circle-widget ul.pagination li.paginate_button.active a {
            border-color: #2196F3 !important;
        }

    .dataTable-paginate-circle-widget .paginate_button.previous a,
    .dataTable-paginate-circle-widget .paginate_button.next a {
        width: 25px;
        height: 25px;
        display: inline-block;
        text-align: center;
    }

    .dataTable-paginate-circle-widget li.paginate_button.disabled a {
        color: #292929;
        line-height: 23px;
    }

    .dataTable-paginate-circle-widget .paginate_button.next a:after,
    .dataTable-paginate-circle-widget .paginate_button.previous a:before {
        left: 50%;
        top: 0;
        font-size: 17px;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }

.data-table-custom-search input[type=search] {
    margin-left: 0px !important;
    min-width: 100%;
    border: 0;
    border-bottom: 1px solid #ddd !important;
    border-radius: 0px !important;
}
/********************** Style Datatable pagination end  ************************/

/*********************** Start Vehicle Dashboard *************************/
#chart-fleet {
    height: 200px;
    max-width: 750px;
    min-width: 100%;
    margin: 0 auto;
}

#last-5-day-chart {
    height: 250px;
    max-width: 800px;
    min-width: 280px;
    margin: 0 auto;
}

.arrow-card-body:after {
    font-family: 'CircularStd-Book';
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    content: "\e607";
    position: absolute;
    right: 30px;
    top: -15px;
    width: 20px;
    color: rgba(0, 0, 0, 0.34);
    height: 20px;
    background-color: #fff;
    font-size: 20px;
}

.VHS_running_text.active {
    color: #1b72e2 !important;
}


.school_sidebar_submenu {
    position: absolute;
    width: 210px;
    left: 70px;
    background-color: #fff;
    box-shadow: 1px 1px 2px rgb(0 0 0 / 22%);
    display: none;
    margin-top: 0;
    top: 0;
}

.track-minisidebar .aside-inner {
    overflow: visible !important;
}

.school_sidebar_submenu ul li a:hover {
    background-color: #f5f5f5;
}

.open.school_sidebar_submenu {
    display: block;
}

.school_sidebar_submenu ul {
    padding: 0;
    list-style: none;
    margin: 0px;
}

    .school_sidebar_submenu ul li a {
        padding: 10px 10px;
        display: block;
        color: #000;
        text-align: left;
    }


.schooldash_card_panel {
    margin-bottom: 20px !important;
}

.school_bus_dashboard {
    background-color: #f9f9f9;
}

/*------------------ All Dashboard Common Start -----------------------*/
.box-shadow-1 {
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.16);
}

.card-panel-dash {
    margin-bottom: 15px !important;
}

    .card-panel-dash .card-panel-heading {
        padding: 10px 13px !important;
    }

        .card-panel-dash .card-panel-heading h4 {
            font-size: 15px !important;
            font-weight: 500 !important;
            margin: 0;
            text-transform: capitalize;
        }

.dash_widget1 {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    line-height: 45px;
    text-align: center;
}

.bg-f-green {
    background-color: #93BE52;
}

.bg-f-blue {
    background-color: #4680ff;
}

.bg-f-pink {
    background-color: #FC6180;
}

.bg-f-yellow {
    background-color: #FFB64D;
}

.text-f-green {
    color: #93BE52;
}

.text-f-yellow {
    color: #FFB64D;
}

.text-f-pink {
    color: #FC6180;
}

.progressBar-f-green {
    background-color: #93BE52;
}

.progressBar-f-yellow {
    background-color: #FFB64D;
}

.progressBar-f-pink {
    background-color: #FC6180;
}


.progressBar-f-blue {
    background-color: #4680ff;
}

.widget-content-wrapper {
    display: flex;
    flex: 1;
    position: relative;
    align-items: flex-end;
}

.label-widget-dash {
    padding: 4px 9px;
    border-radius: 3px;
}

.school-dash-widgettbl tbody > tr > td {
    font-weight: 500;
    border: 0;
    padding: 12px 0px;
}


.widget-content-wrapper .widget-content-right {
    margin-left: auto;
}

.bus_uitilization_ul {
    overflow: hidden;
    margin-bottom: 0px;
}

    .bus_uitilization_ul li {
        width: calc(100% / 2);
        float: left;
        display: block;
        padding: 5px;
    }

.circle_widget_chart {
    width: 130px;
    height: 130px;
    margin: 15px auto;
    position: relative;
}

.chartJS-circle-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    font-size: 16px;
    font-weight: 500;
    margin: 0;
}

.chartJS-circle-outer {
    height: 90px;
    width: 90px;
    margin: 0 auto;
}

/*------------------ All Dashboard Common End-----------------------*/

.temp-report-ul li {
    padding: 30px 15px;
    border-bottom: 1px solid #ddd;
}

    .temp-report-ul li:last-child {
        border-bottom: 0px solid #ddd;
    }

.temp-card-body {
    min-height: 260px;
    max-height: 260px;
    height: 260px;
}

.Dash_VH_count li {
    width: calc(100% / 5);
    border-right: 1px solid #ddd;
    float: left;
}

    .Dash_VH_count li p {
        padding: 0 15px;
        font-size: 13px;
        margin-bottom: 0px;
    }

        .Dash_VH_count li p span {
            font-weight: 600;
            font-size: 16px !important;
        }

Dash_VH_count li:last-child {
    border-right: 0px solid #ddd !important;
}

.watchLogReport .legend {
    display: none;
}

.watchLogReport {
    width: 220px !important;
    height: 220px !important;
}

    .watchLogReport canvas {
        width: 100%;
        height: 100%;
    }

.Watch_Log_UL li {
    padding: 8px 5px;
}





.Expense_tabView {
    border-bottom: 0;
}

    .Expense_tabView > li {
        display: block !important;
        width: 100% !important;
    }


        .Expense_tabView > li > a {
            font-weight: 500;
            padding: 6px 10px;
            margin-bottom: 12px;
            background-color: #fff;
            border: 1px solid #4680ff !important;
            border-radius: 3px;
            text-align: center;
            color: #4680ff;
        }

        .Expense_tabView > li:first-child > a {
            margin-left: 0px !important;
        }

        .Expense_tabView > li > a.active {
            border: 1px solid #4680ff !important;
            border-radius: 3px;
            color: #444444;
            background-color: rgba(70, 128, 255, 0.22) !important;
            color: #4680ff;
        }

.mb-30 {
    margin-bottom: 30px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-60 {
    margin-bottom: 60px;
}




.pb-20 {
    padding-bottom: 20px;
}

.expense_summary_tab li {
    width: calc(100% / 4);
}

    .expense_summary_tab li a,
    .expense_summary_tab > li a:hover {
        border: 0px;
        background-color: #fff !important;
        text-align: center;
        font-weight: 500;
    }

    .expense_summary_tab li.active a:hover,
    .expense_summary_tab li.active a:focus {
        border: 0px !important;
        border-bottom: 2px solid #4680ff !important;
        color: #4680ff !important;
    }

.expense_summary_tab > li.active > a {
    border: 0px;
    border-bottom: 2px solid #4680ff;
    color: #4680ff;
}


.btn-toggle-custom-parent {
    background-color: #d8d8d8;
    border-radius: 52px;
    display: inline-block;
    overflow: hidden;
    width: 80px;
}

.btn-toggle-custom {
    display: inline-block;
    align-items: center;
    justify-content: center;
    padding: 2px 5px;
    width: 50%;
    color: #000;
    font-size: 19px;
    float: left;
    text-align: center;
    line-height: initial;
    text-decoration: none;
}

    .btn-toggle-custom:hover {
        color: #000;
    }

    .btn-toggle-custom.active {
        background-color: #4680ff;
        color: #fff;
    }

.mt-120 {
    margin-top: 120px;
}

.mt-120 {
    margin-top: 120px;
}

.New-progress {
    overflow: visible;
    display: flex;
    height: .625rem;
    font-size: .70313rem;
    background-color: #f2f4fa;
    border-radius: 1.25rem;
}

.New-progress-bar {
    position: relative;
    align-items: flex-end;
    border-radius: 1.25rem;
}

.New-progress-bar {
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #5f45ff;
    transition: width .6s ease;
}

.New-progress-bar-xs {
    height: 10px !important;
}

.New-progress-bar .New-progress-value {
    display: inline-block;
    background: #fff;
    color: #3a4049;
    min-width: 40px;
    text-align: center;
    border-radius: 10px;
    font-size: 14px;
    box-shadow: 0 1px 7px rgba(58,64,73,.31);
    transform: translateX(50%);
    font-weight: 500;
    padding: 2px 7px;
}


.progress-primary-bg {
    background-color: #5f45ff;
    color: #fff;
}

.progress-danger-bg {
    background-color: #f90583;
}


.custom_tagsinput {
    background-color: #dadada;
    padding: 2px 8px;
    border-radius: 4px;
    color: #000 !important;
    font-size: 13px;
}

.bg-onmap-Panel {
    background-color: #f5f5f5 !important;
    border-radius: 0;
}

.module_body {
    height: calc(100vh - 172px);
}

.btn-blue-outline {
    border: 1px solid #0c84e4;
    background-color: #fff;
    color: #0c84e4;
    padding: 3px 8px;
    margin-bottom: 5px;
}

.side_menu_mail {
    color: #fff;
}

.h-100per {
    height: 100%;
}


.mTripviewslider {
    position: absolute !important;
    width: 90%;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

.mTripViewslider_datepatch {
    position: relative;
    background-color: #4CAF50;
    color: #fff;
    width: 51%;
    padding: 4px;
    text-align: center;
    font-size: 13px;
    font-weight: 500;
}

.mTripMapbox {
    background: #fff;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
    min-height: 124px !important;
    max-height: 124px !important;
}

.mTripviewslider .swiper-slide-custom {
    min-height: 180px !important;
    max-height: 180px !important;
}

.mTripMapSlider .sliderCircle {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: block;
    position: relative;
    margin-top: 3.5px;
}

.mTripMapSlider:nth-child(1):after {
    content: "";
    position: absolute;
    border-left: 1px solid #adacac;
    left: 5px;
    height: 20px;
    top: 17px;
    z-index: 99;
}

.mTripMapSlider, .mTripMapView {
    overflow: hidden;
}

    .mTripMapView li {
        width: 50%;
        float: left;
        text-align: center;
        padding: 8px 10px;
    }

.mtopnavbar.navbar-fixed-top {
    position: fixed !important;
}

.mtab_top {
    position: relative;
    top: 55px;
}

.mtab_p_bottom {
    padding-bottom: 80px;
}

.m_main_section {
    padding-top: 56px;
}

.m-20-minus {
    margin: 0 -20px;
}

/************** Start Driver behaviour graph view CSS ***************/
.Driver_summary_Violation {
    overflow: hidden;
    margin-bottom: 0px;
}

    .Driver_summary_Violation li {
        padding: 26.5px 15px;
        border-bottom: 1px solid #ddd;
        cursor: pointer;
    }

        .Driver_summary_Violation li:last-child {
            border-bottom: 0px;
        }

        .Driver_summary_Violation li.active {
            background-color: #fff;
        }

        .Driver_summary_Violation li .circle-img {
            width: 50px;
            height: 50px;
            background-color: #fff;
            border-radius: 50%;
            text-align: center;
            line-height: 45px;
            border: 1px solid #ddd;
        }
/************** End Driver behaviour graph view CSS ***************/

/************** Start Trip view overview trip CSS ******************/
.trip_view_mapBox {
    position: absolute;
    top: 60px;
    left: 25px;
    width: 400px;
    height: 507px;
    background-color: #fff;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.32);
    border-radius: 5px;
    overflow: hidden;
    z-index: 9;
}

/************** End Trip view overview trip CSS ******************/


/************** Map View timeline bottom patch CSS ******************/
.mapview-patch-bottom {
    position: absolute;
    bottom: 0px;
    width: calc(100% - 410px);
    right: 0;
    background-color: #fff;
    z-index: 99;
    height: 40px;
    overflow: hidden;
    border-top: 1px solid #dcdcdc;
}

.map-view-card {
    box-shadow: 2px -5px 4px rgba(0, 0, 0, 0.18);
    margin-bottom: 0 !important;
    border-left: 1px solid rgba(0,0,0,.12) !important;
    border-bottom: 0px !important;
}

@media screen and ( min-width: 1366px ) and ( max-height: 700px ) {
    .trip_view_mapBox {
        height: 235px;
    }

        .trip_view_mapBox .slimScrollDiv,
        .trip_view_mapBox .slimScrollDiv #tripViewMap {
            height: 180px !important;
        }
}

@media (min-height: 700px) and (max-height: 800px) {
    .trip_view_mapBox {
        height: 419px;
    }

        .trip_view_mapBox .slimScrollDiv,
        .trip_view_mapBox .slimScrollDiv #tripViewMap {
            height: 255px !important;
        }
}



/*-------------Navbar header fixed to top--------------*/
.nav-header-fixed {
    position: fixed;
    top: 0;
    z-index: 999;
    width: 100%;
}

.main-section-pt {
    padding-top: 56px;
}

.fixed-column {
    background-color: #f5f5f5;
    width: 200px !important;
    max-width: 200px !important;
    min-width: 200px !important;
    border-right: 1px solid #eee !important;
}



.table-checkbox-w-auto .checkbox {
    margin: 0 auto;
    width: auto !important;
}

.table-details thead tr th {
    background-color: #eee;
    font-weight: 500 !important;
    border-color: #ddd;
    border-top: 1px solid #ddd !important;
}

.input-top-label {
    position: absolute;
    right: 5px;
    top: -12px;
    cursor: pointer;
}
/************** Start Student ID Card CSS ******************/
.profile-card-9 {
    border-radius: 10px;
    box-shadow: 2px 5px 10px rgba(0,0,0,0.1);
    overflow: hidden;
    position: relative;
    margin: 10px auto;
    cursor: pointer;
    background-color: #fff;
    transition: all 0.25s linear;
    max-width: 275px;
    width: 275px;
    max-height: 350px;
    min-height: 350px;
}

.mx-auto {
    margin: 0 auto !important;
}

.profile-card-9 .profile-card-footer img {
    width: 90px;
}

.profile-card-9 .profile-card-body {
    padding: 0 10px;
}

.profile-card-9 .profile-card-footer {
    padding: 10px 10px 0;
    border-top: 1px solid #ddd;
}

.profile-card-9 img.profile-img {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    margin: 10px auto;
    background-color: #f9f9f9;
    padding: 7px;
    box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.15);
}

.profile-card-9 .profile-name {
    font-size: 12px;
    line-height: 1.2;
    color: #3249b9;
    font-weight: 600;
}

.profile-card-9 .profile-label {
    font-size: 11px;
    color: #777;
}

.profile-card-9 .profile-card-body td {
    padding: 5px 4px;
}

    .profile-card-9 .profile-card-body td span {
        font-size: 11px;
    }

.profile-card-9 .profile-description {
    padding: 10px;
    font-size: 13px;
    color: #777;
    margin: 15px 0px;
    background-color: #F1F2F3;
    border-radius: 5px;
}

.profile-card-9 .profile-card-body > div:last-child {
    margin-top: 10px;
}

.profile-card-9 .student-name {
    padding: 0;
}

.profile-card-9 .row {
    padding-bottom: 15px;
}

    .profile-card-9 .row:last-child {
        padding-bottom: 0px;
    }

.modal-close {
    position: absolute;
    right: -25px;
    z-index: 999;
    background: #fff;
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: 35px;
    top: -20px;
    border-radius: 50%;
    font-size: 22px;
    box-shadow: 2px 5px 8px rgba(0, 0, 0, 0.47);
    cursor: pointer;
}

/************** End Student ID Card CSS ******************/
.m-temp-sensor-icon {
    background-image: url(../../Images/icon/infowindow/temp_sensor.svg);
    width: 16px;
    height: 16px;
    display: inline-block;
    background-position: center;
    background-repeat: no-repeat;
    filter: grayscale(1);
}

.position-absolute {
    position: absolute
}

.box-shadow-map {
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
}

.mini-asidebar .aside-inner,
.mini-asidebar {
    width: 70px !important;
}

    /******************Custom css for app.css and app-rtl.css start**********************/
    .mini-asidebar .aside-inner {
        height: calc(100vh - 111px);
    }

/******************Custom css for app.css and app-rtl.css Start**********************/
.layout-h .wrapper > section {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}
/***************Custom css for app.css and app-rtl.css End***************/

/****************************Vehicle Detail start**********************/
.nav-stacked-widget {
    border-bottom: 0px;
}

    .nav-stacked-widget li {
        padding: 15px 15px;
        margin-top: 0px !important
    }

        .nav-stacked-widget li.active {
            margin-top: 0px !important;
            background-color: rgba(0, 0, 0, 0.04);
            border-right: 2px solid #4680ff;
        }

            .nav-stacked-widget li.active a:hover,
            .nav-stacked-widget li.active a {
                color: #333;
                font-weight: 600;
            }

            .nav-stacked-widget li.active a {
                background-color: transparent !important;
            }

            .nav-stacked-widget li.active a {
                color: #333;
            }

        .nav-stacked-widget li a:hover {
            background-color: transparent !important;
        }

        .nav-stacked-widget li a {
            padding: 0;
            border: 0 !important;
            font-weight: 500;
            color: #888888;
            background-color: transparent;
            font-size: 13px;
            letter-spacing: 0.5px;
        }

.vehicle-detail-sidebar {
    float: left;
    width: 210px;
    padding: 0;
    background-color: #fff;
    position: relative;
    z-index: 98;
    border-right: 1px solid #ddd;
}

.vehicle-detail-wrapper {
    float: left;
    width: calc(100% - 210px);
    position: relative;
    z-index: 22;
    overflow: auto;
    background-color: #f5f7fa;
}

.vehicle-detail-sidebar,
.vehicle-detail-wrapper {
    height: calc(100vh - 252px);
}

.box-shadow-2 {
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.17);
}

/****************************Vehicle Detail End**********************/


/***************Custom css for app.css and app-rtl.css End***************/


.asidebar .track-minisidebar {
    padding-left: 70px !important;
}


.aside-bar-layout-div {
    position: fixed;
    z-index: 112;
    top: 56px;
    height: 100%;
    background-color: #fff;
    border-right: 1px solid #ddd;
    width: 70px;
}

.input-disabled {
    background-color: #efefef !important;
}

.table-dashboard-widget tr td {
    padding: 15px 10px !important;
}

.table-count-widget {
    font-size: 13px;
    padding: 4px 11px;
    color: #fff;
    border-radius: 50%;
    font-weight: 600;
}

.toggle-btn-widget {
    background-color: #ececec;
    border-radius: 8px;
}

    .toggle-btn-widget .toggle-btn {
        background-color: transparent;
        border: 0;
        padding: 7px 15px;
        letter-spacing: 0.5px;
        font-weight: 600
    }


        .toggle-btn-widget .toggle-btn:first-child {
            border-bottom-left-radius: 8px;
            border-top-left-radius: 8px;
        }

        .toggle-btn-widget .toggle-btn.active {
            background-color: #06a8f5;
            color: #fff;
        }

/******************steps-widget start**********************/

.steps-widget {
    list-style: none;
    margin: 0;
    padding: 0;
    display: table;
    table-layout: fixed;
    width: 100%;
    color: #929292;
    height: 4rem;
}

    .steps-widget > .step {
        position: relative;
        display: table-cell;
        text-align: center;
        font-size: 13px;
        color: #6D6875;
        font-weight: 500;
    }

        .steps-widget > .step:before {
            content: attr(data-step);
            display: block;
            margin: 0 auto;
            background: #ffffff;
            border: 2px solid #e6e6e6;
            color: #e6e6e6;
            width: 40px;
            height: 40px;
            text-align: center;
            line-height: 35px;
            border-radius: 100%;
            position: relative;
            z-index: 1;
            font-weight: 700;
            font-size: 16px;
            margin-bottom: 13px;
        }

        .steps-widget > .step:after {
            content: '';
            position: absolute;
            display: block;
            background: #e6e6e6;
            width: 100%;
            height: 0.125rem;
            top: 20px;
            left: 50%;
        }

        .steps-widget > .step:last-child:after {
            display: none;
        }

        .steps-widget > .step.is-complete {
            color: #6D6875;
        }

            .steps-widget > .step.is-complete:before {
                content: '\2713';
                color: #00d809;
                background: #d2ffdc;
                border: 2px solid #00d609;
            }

            .steps-widget > .step.is-complete:after {
                background: #00d809;
            }

        .steps-widget > .step.is-active:before {
            color: #FFF;
            border: 2px solid #00d809;
            background: #00d809;
        }

/******************Steps-widget End**********************/

.table-dashboard-widget tr td {
    padding: 15px 5px !important;
    border-bottom: 1px solid #e8e8e8;
}

.table-count-widget {
    font-size: 13px;
    padding: 4px 11px;
    color: #fff;
    border-radius: 50%;
    font-weight: 600;
}

/*********************Data Table Widget Button **********************/
.dataTable-btn-widget-circle {
    background-color: #fff;
    border: 1px solid #d4d4d4;
    width: 29px;
    height: 29px;
    border-radius: 50%;
}

    .dataTable-btn-widget-circle:hover i {
        color: #FFF !important;
    }

    .dataTable-btn-widget-circle.select:hover {
        background-color: #5d9cec;
        border-color: #5d9cec;
    }

    .dataTable-btn-widget-circle.delete:hover {
        background-color: #f05050;
        border-color: #f05050;
    }



/*********************Start Checkbox Circle Widget**********************/

.checkbox-circle-widget {
    background-color: #fff;
    display: block;
    position: relative;
    margin-bottom: 10px;
}

    .checkbox-circle-widget label {
        display: inline-block;
        text-align: left;
        color: #3C454C;
        cursor: pointer;
        position: relative;
        z-index: 2;
        transition: color 200ms ease-in;
        overflow: hidden;
        padding-left: 30px;
        font-weight: 500;
        margin-bottom: 0;
        padding-bottom: 5px;
        padding-top: 5px;
    }


        .checkbox-circle-widget label:after {
            width: 20px;
            height: 20px;
            content: '';
            border: 1px solid #D1D7DC;
            background-color: #fff;
            background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");
            background-repeat: no-repeat;
            background-position: -3px -3px;
            border-radius: 50%;
            z-index: 2;
            position: absolute;
            left: 0px;
            top: 50%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            cursor: pointer;
            transition: all 200ms ease-in;
        }

    .checkbox-circle-widget input[type='checkbox']:checked ~ label:after {
        background-color: #2196F3;
        border-color: #2196F3;
    }

    .checkbox-circle-widget input[type='checkbox'] {
        width: 20px;
        height: 20px;
        order: 1;
        z-index: 2;
        position: absolute;
        left: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        cursor: pointer;
        border: 0px;
        visibility: hidden;
        margin: 0;
        margin-top: -3px;
    }
/*********************End Checkbox Circle Widget**********************/

.white-preLine {
    white-space: pre-line;
}

.mw-425 {
    max-width: 425px;
}

.mw-645 {
    max-width: 645px !important;
}

.mw-125 {
    max-width: 125px !important;
}

.settingsMain .brd_dotted {
    border: 2px dashed #c2c2c2;
    color: #808080;
    font-size: 14px;
    /* font-style: italic; */
    font-weight: 600;
    margin-top: 5px;
    background-color: #e0dfdb;
}

.text-f-blue {
    color: #4680ff
}

.btn-group-toggle-widget {
    display: inline-block;
    background-color: #ddd;
    border-radius: 6px;
}

    .btn-group-toggle-widget .btn-widget {
        text-transform: capitalize;
        padding: 5px 10px;
        float: left;
        color: #333;
        font-weight: 600;
        border-radius: 5px;
    }

        .btn-group-toggle-widget .btn-widget.active {
            background-color: #2196F3;
            color: #fff;
        }

.filter-map-option {
    position: absolute;
    top: 20px;
    right: 30px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

    .filter-map-option .filter-btn {
        font-weight: 700;
    }

        .filter-map-option .filter-btn:hover,
        .filter-map-option .filter-btn:focus {
            color: #333 !important;
        }

    .filter-map-option .filter-dropdown-ul {
        box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.1) !important;
        margin-bottom: 1px !important;
        padding: 0;
        margin: 0;
        background-color: rgba(245, 245, 245, 0.9);
        border: 0;
        border-radius: 5px;
    }

.filter-dropdown-ul li:first-child {
    padding-top: 10px !important;
}

.filter-dropdown-ul li {
    padding: 0px 8px 10px;
}

.filter-dropdown-ul .checkbox {
    margin: 0;
}

.filter-map-option .filter-dropdown-ul li label {
    font-weight: 600 !important;
    font-size: 13px !important;
}

.filter-map-option .filter-dropdown-ul .disable.c-checkbox:hover span {
    border-color: #ccc !important;
}

.filter-map-option .filter-dropdown-ul .disable.c-checkbox {
    color: #949494 !important
}

    .filter-map-option .filter-dropdown-ul .disable.c-checkbox label {
        cursor: no-drop;
    }


.bg-blue-light {
    background-color: rgba(93, 156, 236, 0.22);
}

.dataTable-btn-widget-circle.delete:hover {
    background-color: #f05050;
    border-color: #f05050;
}


/*********************Start Checkbox Circle Widget**********************/

.checkbox-circle-widget {
    background-color: #fff;
    display: block;
    position: relative;
    margin-bottom: 10px;
}

    .checkbox-circle-widget label {
        display: inline-block;
        text-align: left;
        color: #3C454C;
        cursor: pointer;
        position: relative;
        z-index: 2;
        transition: color 200ms ease-in;
        overflow: hidden;
        padding-left: 30px;
        font-weight: 500;
        margin-bottom: 0;
        padding-bottom: 5px;
        padding-top: 5px;
    }


        .checkbox-circle-widget label:after {
            width: 20px;
            height: 20px;
            content: '';
            border: 1px solid #D1D7DC;
            background-color: #fff;
            background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");
            background-repeat: no-repeat;
            background-position: -3px -3px;
            border-radius: 50%;
            z-index: 2;
            position: absolute;
            left: 0px;
            top: 50%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            cursor: pointer;
            transition: all 200ms ease-in;
        }

    .checkbox-circle-widget input[type='checkbox']:checked ~ label:after {
        background-color: #2196F3;
        border-color: #2196F3;
    }

    .checkbox-circle-widget input[type='checkbox'] {
        width: 20px;
        height: 20px;
        order: 1;
        z-index: 2;
        position: absolute;
        left: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        cursor: pointer;
        border: 0px;
        visibility: hidden;
        margin: 0;
        margin-top: -3px;
    }
/*********************End Checkbox Circle Widget**********************/


/*********************Start Button Circle Widget**********************/
.circle-btn-widget {
    width: 28px;
    height: 28px;
    display: inline-block;
    border-radius: 50%;
    text-align: center;
    line-height: 28px;
}

.btn-bg-primary,
.btn-bg-primary:hover {
    background-color: rgba(92, 119, 255, 0.098);
    color: rgb(92, 119, 255);
}

.btn-bg-green,
.btn-bg-green:hover {
    background-color: rgba(76, 175, 80, 0.098);
    color: rgb(76, 175, 80);
}

.btn-bg-pink,
.btn-bg-pink:hover {
    background-color: rgba(255, 67, 130, 0.098);
    color: rgb(255, 67, 130);
}

    .btn-bg-primary.active,
    .btn-bg-green.active,
    .btn-bg-pink.active {
        color: #fff !important;
    }

.btn-bg-primary.active {
    background-color: rgb(92, 119, 255);
}

.btn-bg-pink.active {
    background-color: rgb(255, 67, 130);
}

.btn-bg-green.active {
    background-color: rgb(76, 175, 80);
}
/*********************End Button Circle Widget**********************/

.mw-300 {
    max-width: 300px;
}

.mw-250 {
    max-width: 250px;
}

/*****************School Dashboard Start*********************/

.Trip-trend-widget .tab-selection a {
    display: block;
    padding: 6px 15px;
}

    .Trip-trend-widget .tab-selection a.active {
        background-color: #06a8f5;
        color: #fff;
    }

.Trip-trend-widget .tab-selection a {
    color: #444;
    text-decoration: none;
}

.Trip-trend-widget .tab-trip-data {
    padding: 8px 0;
}

.btn-widget-radius {
    border-radius: 50%;
    background-color: #93be52;
    line-height: 28px;
    width: 26px;
    height: 26px;
    display: inline-block;
    text-align: center;
    color: #fff;
    font-size: 12px;
}

    .btn-widget-radius:hover,
    .btn-widget-radius:focus {
        color: #fff;
    }

.dash-table-widget td {
    padding: 10px 0 !important;
}

.Total-Trip-Utilization {
    position: absolute;
    top: 58%;
    left: 50%;
    text-align: center;
    transform: translateX(-50%) translateY(-50%);
}


.trips-utilization-icon {
    width: 35px;
    margin-top: 10px;
}

.bg-f-light {
    background-color: #fbfbfb;
}

.vehicle-utlization-span-box {
    display: inline-block;
    width: 15px;
    height: 15px;
}

.Vehicle-Utilization-Table tr:first-child td {
    border-top: 0px;
}

.Vehicle-Utilization-Table tr td {
    padding: 12px !important;
}

.student-info-box li {
    width: calc(100% / 3);
    float: left;
    text-align: center;
}

/*****************School Dashboard End*********************/

.visibility-hidden {
    visibility: hidden;
}

.visibility-visible {
    visibility: visible;
}

.vertical-li-widget > li {
    display: inline-block;
    margin: 0 2px;
}

    .vertical-li-widget > li > a, .vertical-li-btn-widget {
        padding: 3px 7px;
        display: inline-block;
        border: 1px solid #2196F3;
        color: #2196F3;
        text-decoration: none;
        border-radius: 2px;
    }

        .vertical-li-widget > li > a.active, .vertical-li-btn-widget.active {
            background-color: #1b72e2;
            color: #fff;
        }

/*****************Google Map Theme Start*********************/
.GooglemapTheme {
    cursor: pointer;
}

    .GooglemapTheme p {
        color: #BDBDBD;
    }

        .GooglemapTheme p.active {
            color: #2196F3;
        }

/*****************Google Map Theme End*********************/


.tab-widget {
    display: none;
}

    .tab-widget.active {
        display: block;
    }

.call-btn-xs {
    display: inline-block;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    background-color: rgba(28, 212, 5, 0.13);
    text-align: center;
    color: #1cd405;
    line-height: 17px;
}

    .call-btn-xs i {
        font-size: 11px;
    }

.call-btn-xs-1 {
    display: inline-block;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    background-color: rgba(28, 212, 5, 0.13);
    text-align: center;
    color: #1cd405;
}

    .call-btn-xs-1 i {
        font-size: 14px;
        line-height: 29px;
    }

.text-decoration-none,
.text-decoration-none:hover {
    text-decoration: none !important;
}

/************************Brid eye view map start*****************************/
.birdeyeview-map-trafficLayer {
    position: absolute;
    width: 27px;
    height: 26px;
    background-color: #fff;
    z-index: 99;
    top: 10px;
    right: 10px;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
    cursor: pointer;
}

    .birdeyeview-map-trafficLayer img {
        padding: 4px;
    }


.birdeyeview-map-fullscreen i {
    line-height: 26px;
}

.birdeyeview-map-fullscreen {
    position: absolute;
    width: 27px;
    height: 26px;
    background-color: #fff;
    z-index: 99;
    top: 10px;
    right: 45px;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
    cursor: pointer;
}


.mapOptionsBridEyeView {
    position: absolute;
    top: 45px;
    right: 9px;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;
}

    .mapOptionsBridEyeView .btn-default {
        width: 27px;
        padding: 6px 0px;
        border-left: 0px !important;
        border-right: 0px !important;
        color: #484848;
    }

.mapOptionsBridEyeView-top {
    position: absolute;
    top: 10px;
}

/************************Brid eye view map End*****************************/


/************************map view start*****************************/
.mapview-search-section {
    position: absolute;
    left: 27%;
    top: 10px;
    box-shadow: 0px 8px 18px -9px rgba(184,182,184,1);
    width: 450px;
    left: 50% !important;
    transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    border-radius: 10px;
    overflow: hidden;
}

    .mapview-search-section .dropdown-menu {
        margin: 0 !important;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    }

        .mapview-search-section .dropdown-menu li a {
            padding: 8px 10px;
            font-weight: 600;
            color: #4a4a4a;
        }

            .mapview-search-section .dropdown-menu li a i {
                padding-right: 8px;
                color: #a5a5a5;
            }

    .mapview-search-section .dropdown-toggle i {
        color: #848484;
    }

    .mapview-search-section .mapview-serach-input {
        display: none
    }

        .mapview-search-section .mapview-serach-input.active {
            display: table-cell;
        }

    .mapview-search-section .select2-container--bootstrap .select2-selection--single {
        border-radius: 0px !important;
        height: 35px;
        border-right: 0px !important;
    }

.map-view-live-data {
    position: absolute;
    height: 48px;
    width: 100%;
    left: 0%;
    bottom: 0;
    z-index: 9;
    box-shadow: 0px -2px 5px rgba(0, 0, 0, 0.16);
    overflow: hidden;
}

.mapview-search-section .form-control {
    width: 100%;
    height: 35px;
    padding: 6px 16px;
    background-color: #fff;
    background-image: none;
    border: 1px solid #dde6e9;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    border-radius: 0;
}

.map-view-live-data .heading-section {
    background-color: rgba(255, 255, 255, 0.75);
}
/************************map view end*****************************/

.trip-view-active {
    background-color: rgba(70, 128, 255, 0.16)
}

    .trip-view-active h4,
    .trip-view-active i {
        color: #4680ff !important;
    }

.bg-transparent-label {
    padding: 4px 8px;
    border-radius: 5px;
    letter-spacing: 0.8px;
    font-weight: 600;
    color: #252525 !important;
    font-size: 13px !important
}

.bg-transparent-red {
    background-color: rgba(240, 80, 80, 0.28);
}

.bg-transparent-orange {
    background-color: rgba(255, 144, 43, 0.25);
}

.trip-view-active h4,
.trip-view-active i {
    color: #4680ff !important;
}

.live-tracking-report-widget {
    position: absolute;
    width: 245px;
    background-color: rgba(255, 255, 255, 0.90);
    top: 70px;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.26);
    left: 11px;
    border-radius: 0px;
}

.FleetOwnershipChart {
    width: 220px;
    height: 220px;
    margin: 0 auto;
}

.FleetStatusChart {
    width: 205px;
    height: 205px;
    margin: 20px auto 0 auto;
}

.FleetStatusDivTotal {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    text-align: center;
}

.btn-toggle-widget1-div {
    background-color: #d8d8d8;
    overflow: hidden;
}

.btn-toggle-widget1.active,
.btn-toggle-widget1.active:hover,
.btn-toggle-widget1.active:focus {
    background-color: #2196F3;
    color: #fff;
    border-color: #2196F3;
}

.btn-toggle-widget1 {
    display: inline-block;
    align-items: center;
    justify-content: center;
    padding: 4px 13px;
    /* width: 50%; */
    color: #000;
    font-size: 14px;
    border: 1px solid #bcbcbc;
    float: left;
    text-align: center;
    line-height: initial;
    text-decoration: none;
}

.mw-140 {
    max-width: 140px
}

.task-grid-body {
    height: calc(100vh - 148px)
}


.subscription-label {
    padding: 4px 8px;
    border-radius: 5px;
    letter-spacing: 0.8px;
    font-weight: 600;
    color: #252525 !important;
    font-size: 13px !important;
}

.track-premium {
    color: #8BC34A;
    background-color: rgba(24, 237, 138, 0.17);
}

.track-pro {
    background-color: rgba(247, 136, 96, 0.17);
    color: #ff902b;
}

.track-lite {
    background-color: rgba(47, 127, 230, 0.17);
    color: #2f80e7;
}

.school-premium {
    color: #f5e056;
    background-color: rgba( 245, 224, 86, 0.17);
}

.school-pro {
    background-color: rgba(123, 240, 70, 0.17);
    color: #ff902b;
}

.school-lite {
    background-color: rgba(70, 240, 229, 0.17);
    color: #2f80e7;
}

.delivery-premium {
    color: #8BC34A;
    background-color: rgba(70, 186, 240, 0.17);
}

.delivery-pro {
    background-color: rgba(50, 81, 194, 0.17);
    color: #ff902b;
}

.delivery-lite {
    background-color: rgba(194, 50, 189, 0.17);
    color: #2f80e7;
}

.fms-premium {
    color: white !important;
    background-color: #ED5D5D;
}

.all--task--list--location-name--right1 time {
    width: 105%;
    display: block;
    font-size: 10px;
    line-height: 1.3;
    display: inline-block;
    margin-right: 3px !important;
}

.fms-premium1 {
    color: white !important;
    background-color: #ED5D5D;
    border-radius: 10px;
    display: inline-block;
    padding: 0px 2px;
}

.fms-premium2 {
    color: white !important;
    background-color: #ED5D5D;
    border-radius: 10px;
    display: inline-block;
    padding: 2px 7px;
}

.fms-pro {
    background-color: rgba(22, 84, 33, 0.17);
    color: #ff902b;
}

.fms-lite {
    background-color: rgba(232, 247, 96, 0.17);
    color: #2f80e7;
}

.route-select2-div .select2-container--bootstrap .select2-selection--single {
    height: 31px !important;
    padding: 6px 24px 6px 12px;
    border-radius: 0 !important;
}


/********************Delivery CSS Start*******************/

.Add-New-Task-section {
    position: absolute;
    right: 15px;
    bottom: 10px;
    z-index: 9;
}

.btn-add-new-task {
    width: 32px;
    height: 32px;
    font-size: 16px;
    border-radius: 50px;
    line-height: 32px;
    padding: 0 !important;
    box-shadow: 3px 4px 12px rgba(0, 0, 0, 0.25);
}


.delivery-tab-ul {
    border-bottom: 0;
}

    .delivery-tab-ul > li a:hover {
        background-color: #fff !important;
    }

    .delivery-tab-ul > li > a {
        background-color: #fff !important;
        border: 0px;
        font-size: 14px;
        color: #585858;
        padding: 3px 8px;
        border-left: 3px solid transparent !important;
        border-right: 3px solid transparent !important;
        font-weight: 600;
        display: block;
        text-align: center;
        letter-spacing: 0.2px;
        border-top: 0px !important;
        margin: 0 10px;
        border: 1px solid #ddd !important;
        border-radius: 5px;
    }


    .delivery-tab-ul > li.active > a.allTask,
    .delivery-tab-ul > li.active > a.allTask:hover,
    .delivery-tab-ul > li.active > a.allTask:focus {
        border-bottom: 2px solid rgba(39, 47, 130, 0.63) !important;
        background-color: rgba(39, 47, 130, 0.20) !important
    }


    .delivery-tab-ul > li.active > a.Unassigned,
    .delivery-tab-ul > li.active > a.Unassigned:hover,
    .delivery-tab-ul > li.active > a.Unassigned:focus {
        border-bottom: 2px solid #ff902b !important;
        background-color: rgba(255, 144, 43, 0.20) !important;
    }

    .delivery-tab-ul > li.active > a.Assigned,
    .delivery-tab-ul > li.active > a.Assigned:hover,
    .delivery-tab-ul > li.active > a.Assigned:focus {
        border-bottom: 2px solid #F06292 !important;
        background-color: rgba(240, 98, 146, 0.20) !important;
    }

    .delivery-tab-ul > li.active > a.Running,
    .delivery-tab-ul > li.active > a.Running:hover,
    .delivery-tab-ul > li.active > a.Running:focus {
        border-bottom: 2px solid #7CB342 !important;
        background-color: rgba(124, 179, 66, 0.20) !important;
    }

    .delivery-tab-ul > li.active > a.Completed,
    .delivery-tab-ul > li.active > a.Completed:hover,
    .delivery-tab-ul > li.active > a.Completed:focus {
        border-bottom: 2px solid #66a6f5 !important;
        background-color: rgba(102, 166, 245, 0.20) !important;
    }

    .delivery-tab-ul > li > a.allTask > .count {
        color: #272f82;
    }

    .delivery-tab-ul > li > a.Unassigned > .count {
        color: #ff902b;
    }

    .delivery-tab-ul > li > a.Assigned > .count {
        color: #F06292;
    }

    .delivery-tab-ul > li > a.Completed > .count {
        color: #66a6f5;
    }

    .delivery-tab-ul > li > a.Running > .count {
        color: #7CB342;
    }

    .delivery-tab-ul > li > a > .count {
        margin-left: 10px;
        font-size: 18px;
    }

.delivery-type-label {
    padding: 4px 6px;
    background-color: rgba(236, 64, 122, 0.16862745098039217);
    border-radius: 3px;
    font-size: 13px;
}

.tab_content_del {
    background-color: #f3f3f3;
    border: 0;
    padding: 0px;
}

/***************** Vehicle Detail View Sidebar View ******************/
.vehicle-detail-widget-ul {
    margin-bottom: 0px;
    overflow: hidden;
}

    .vehicle-detail-widget-ul li {
        width: calc(100% / 3);
        float: left;
    }

        .vehicle-detail-widget-ul li a {
            padding: 11px 15px;
            border-right: 1px solid #eee;
            display: block;
            text-align: center;
            font-size: 13px;
            color: #909fa7;
            font-weight: 600;
            letter-spacing: 0.5px;
            text-decoration: none;
        }

            .vehicle-detail-widget-ul li a.active {
                background-color: #0784e8;
                color: #fff;
            }

.vehicle-detail-panel {
    border: 0px !important;
}

    .vehicle-detail-panel .panel-heading {
        border-radius: 0px !important;
        background-color: #ececec;
        padding: 7px 10px !important;
        color: #333;
        border: 0;
    }


.Vehicle-progress-bar {
    border: 0;
    background-color: #bdbdbd;
    height: 3px;
    margin-bottom: 0;
    border-radius: 5px;
    position: relative;
}

.vehicle-progress-img {
    width: 25px;
    margin-top: -5px;
    background-color: #fff;
    position: absolute;
}

    .vehicle-progress-img.active {
        margin-left: -25px;
    }

.vehicle-progress-div {
    padding: 15px 8px 8px 8px;
    border: 2px dotted #cecece;
    border-style: dashed;
    background-color: #f5f5f5;
}

.customer-signbox {
    width: 100%;
    padding: 5px 4px;
    height: 42px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.progress-ul {
    display: inline-flex;
    align-items: baseline;
    counter-reset: step;
    padding: 0;
    margin: 0;
    width: 100%;
    list-style: none;
}

.task-table-detail td.tracking-detail,
.task-table-detail td.vehicle-detail {
    height: 45px;
    line-height: 45px;
}

.progress__circle {
    width: 11px;
    height: 11px;
    border: 5px solid #dcdcdc;
    border-radius: 50%;
    position: relative;
    top: 4px;
}


.progress__bar {
    flex: 1;
    height: 3px;
    background: #dcdcdc;
}

.progress-tracking-ontime {
    background: #69b9fb;
}

.progress-tracking-BeforeTime {
    background: #8dde59;
}

.progress-tracking-delay {
    background-color: #f78787;
}

.progress-circle-delay-active {
    border: 5px solid #f37777;
}

.progress-circle-BeforeTime-active {
    border: 5px solid #93BE52;
}

.progress-circle-ontime-active {
    border: 5px solid #69b9fb;
}

.vehicle-ul-progressbar {
    position: absolute;
    left: 0;
    top: 0px;
    background-color: #fff;
    z-index: 9;
}

.delivery-tracking-li-span {
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    color: #636262;
    font-weight: 600;
}

.progress-circle-click {
    position: relative;
    width: 12px;
    height: 12px;
    display: block;
    top: -5px;
    left: -5px;
    z-index: 99;
}

.popover {
    width: 300px;
}

.btn-single-toggle-widget {
    color: #858585;
}

    .btn-single-toggle-widget.active,
    .btn-single-toggle-widget.active:focus,
    .btn-single-toggle-widget.active:hover {
        background-color: rgba(33, 150, 243, 0.16);
        color: #2196F3;
    }

.Task-List-Div {
    width: 380px;
    border-right: 1px solid #c3c3c3;
}

.Task-Map-Div {
    width: calc(100% - 380px);
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-3 {
    margin-bottom: 3px;
}

.table-noheader thead {
    display: none;
}

.tasktbl-td-padding td {
    padding: 0 12px 14px 9px !important;
}



.driver-summary-count li {
    width: calc(100% / 2);
    float: left;
    padding: 0 10px;
    border-left: 1px solid #ddd;
}

.delivery-driver-collapse {
    padding: 10px;
    background-color: #ececec;
}

.driver-name-title {
    font-size: 15px;
    font-weight: 600;
}

.driver-not-assign,
.driver-not-assign a {
    color: #f55d5d;
}

.delivery-driver-collapse .cart-title-name {
    font-size: 15px !important;
}

.delivery-driver-collapse .cart-side-border {
    margin-bottom: 15px !important;
}

.driver-summary-count li:first-child {
    border-left: 0px;
}

.driver-count-div {
    margin: 0 -10px;
}

#TaskMain {
    box-shadow: -2px -1px 5px rgba(0, 0, 0, 0.28);
    background-color: #fff;
}

.closeTask-Sidebar {
    width: 30px;
    height: 30px;
    background-color: #fff;
    border: 1px solid #ddd;
    line-height: 30px;
    text-align: center;
    position: absolute;
    left: -20px;
    cursor: pointer;
    border-radius: 50%;
    display: none;
    z-index: 9;
    box-shadow: -3px 2px 3px rgba(0, 0, 0, 0.16);
}

.task-top-header {
    padding: 9px 15px !important
}

.customer-feedback li {
    width: calc(100% / 3);
    float: left;
}

    .customer-feedback li a {
        padding: 4px 10px !important;
        font-size: 11px;
        color: #333;
        border: 1px solid #ddd;
        display: inline-block;
    }

.routeSummaryPanel-tripStoppage {
    width: 60%;
    left: 75%;
    background-color: #fff;
    cursor: default;
    padding: 0px 10px;
    position: absolute;
    line-height: 45px;
    height: 45px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.30);
    bottom: 0px;
    border-radius: 4px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    z-index: 9;
}

#StoppageMapDiv {
    margin-top: 75px;
}

.routeSummaryPanel-delivery {
    width: 100%;
    left: 50%;
    background-color: #fff;
    cursor: default;
    padding: 15px 10px;
    position: absolute;
    line-height: 45px;
    height: auto;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.30);
    top: 0;
    border-radius: 4px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}


.routeSummaryPanel-sub-client {
    width: 56%;
    left: 71%;
    background-color: #fff;
    cursor: default;
    padding: 15px 10px;
    position: absolute;
    line-height: 30px;
    height: auto;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.30);
    top: 0;
    border-radius: 4px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

.routeOptimizeSummaryPanel-delivery {
    width: 88%;
    left: 50%;
    background-color: #fff;
    cursor: default;
    padding: 5px 15px;
    position: absolute;
    line-height: 25px;
    height: 70px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.30);
    bottom: 1px;
    border-radius: 20px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}


#stoppageTripMap {
    width: 100%;
    /* height: 400px; */
    min-height: calc(100vh - 382px);
    height: inherit;
    max-height: inherit;
}

    #stoppageTripMap.active {
        width: 100%;
        min-height: calc(100vh - 275px) !important;
    }


.dropdown-notification {
    min-width: 550px !important;
}
/********************Delivery CSS End*********************/


.offsidebar-sidebar-new {
    background-color: #fff;
    position: fixed;
    top: 56px;
    right: -280px;
    z-index: 3002;
    width: 280px;
    height: calc(100% - 56px);
    transition: 0.3s all ease-in-out;
}

.sidebar-toggle-body-right .offsidebar-sidebar-new {
    right: 0;
    transition: 0.3s all ease-in-out;
}

.sidebar-toggle-body-right .toggle-sidebar-right {
    right: 280px;
    transition: 0.3s all ease-in-out;
}

.btn-direction-xs {
    padding: 2px 6px !important;
    font-size: 11px;
    font-weight: 600;
    background-color: #f1f1f1;
}

    .btn-direction-xs em {
        transform: rotate(180deg);
        margin-right: 5px;
    }

.remote-immobilize-label {
    padding: 3px 5px;
    border: 1px solid #ef5350;
    border-radius: 3px;
    background-color: rgba(239, 83, 80, 0.09);
}

.panel-footer-fixed-section {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: 0px;
    padding: 10px 80px !important;
    z-index: 7;
    background-color: #fff;
    border-top: 1px solid #ddd;
}

.task-label {
    padding: 4px 5px;
    border-radius: 3px;
}

.task-label-unassigned {
    background-color: rgba(255, 144, 43, 0.23);
}

.task-label-assigned {
    background-color: rgba(240, 98, 146, 0.23)
}

.task-label-running {
    background-color: rgba(147, 190, 82, 0.23)
}

.task-label-completed {
    background-color: rgba(102, 166, 245, 0.23)
}

.task-label-onhold {
    background-color: #fde2e2 !important
}

.mr-8px {
    margin-right: 8px;
}



/**********Switch btn css**********/


.switch-new {
    display: block;
    margin: 12px auto;
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 50px;
    height: 25px;
    padding: 3px;
    background-color: white;
    -moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    border-radius: 18px;
    cursor: pointer;
    padding: 0 !important;
}

.switch-new-input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}

.switch-new-label {
    position: relative;
    display: block;
    height: inherit;
    font-size: 10px;
    text-transform: uppercase;
    background: #b3b3b3;
    -moz-border-radius: inherit;
    -webkit-border-radius: inherit;
    border-radius: inherit;
    -webkit-transition: 0.15s ease-out;
    -moz-transition: 0.15s ease-out;
    -o-transition: 0.15s ease-out;
    transition: 0.15s ease-out;
    -webkit-transition-property: opacity background border;
    -moz-transition-property: opacity background border;
    -o-transition-property: opacity background border;
    transition-property: opacity background border;
}

    .switch-new-label:before, .switch-new-label:after {
        position: absolute;
        top: 50%;
        margin-top: -.5em;
        line-height: 1;
        -webkit-transition: inherit;
        -moz-transition: inherit;
        -o-transition: inherit;
        transition: inherit;
        font-size: 14px;
    }

    .switch-new-label:before {
        content: '';
        right: 11px;
        color: #000;
    }

.switch-label:after {
    content: '';
    left: 11px;
    opacity: 0;
}

.switch-new-input:checked ~ .switch-new-label {
    background: #05a72b;
}

    .switch-new-input:checked ~ .switch-new-label:before {
        opacity: 0;
    }

    .switch-new-input:checked ~ .switch-new-label:after {
        opacity: 1;
    }

.switch-new-handle {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 15px;
    height: 15px;
    background: white;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -webkit-transition: left 0.15s ease-out;
    -moz-transition: left 0.15s ease-out;
    -o-transition: left 0.15s ease-out;
    transition: left 0.15s ease-out;
}

    .switch-new-handle:before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -6px 0 0 -6px;
        width: 12px;
        height: 12px;
        background: #f9f9f9;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        -moz-box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
        -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
        box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
        background-image: -webkit-linear-gradient(top, #eeeeee, white);
        background-image: -moz-linear-gradient(top, #eeeeee, white);
        background-image: -o-linear-gradient(top, #eeeeee, white);
        background-image: linear-gradient(to bottom, #eeeeee, white);
    }


.switch-new-input:checked ~ .switch-new-handle {
    background: #fafafa;
    left: 33px;
    -moz-box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
    box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

    .switch-new-input:checked ~ .switch-new-handle:before {
        background: #fafafa;
    }

.switch-new-green > .switch-new-input:checked ~ .switch-new-label {
    background: #4fb845;
}

.mw-315 {
    max-width: 315px;
}

.active-status {
    background-color: rgba(16, 255, 0, 0.24);
}

.inactive-status {
    background-color: rgba(255, 0, 0, 0.18);
}

/*********** Delivery module new UI start 09/07/2020************/
/*.main-delivery {
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
}*/

.task-sidebar-section {
    /*width:400px;*/
    /*box-shadow: 2px 4px 5px rgba(0, 0, 0, 0.27);*/
    /* float: left; */
    position: fixed;
    z-index: 6;
    top: 56px;
    left: 0;
    width: 100%;
    max-width: 400px;
    border-radius: 10px;
}

.driver_stops_module_wrap small {
    font-size: 12px;
    line-height: 1.2;
    color: #1C1C1C;
    opacity: 0.5;
}

.routeCalendername_title .top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 7px;
}

    .routeCalendername_title .top .input-group.group-material {
        height: auto;
    }

.task-map-section {
    transition: 0.3s all ease-in-out;
    margin-left: 70px;
}

.sidebar-toggle-body .task-map-section {
    margin-left: 350px;
    transition: 0.3s all ease-in-out;
}

.task-filter-main > div + div {
    margin-left: 15px;
}

.task-details-asidebar .icon-arrow-left-circle {
    position: absolute;
    width: 36px;
    height: 30px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2196F3;
    top: 20px;
    right: -36px;
    cursor: pointer;
    color: #ffffff;
    font-weight: bold;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}

.icon-arrow-left-circle.toggle-bar-driver-detail.task-asidebar-close::before {
    transform: rotate( 180deg );
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M0,0H18V18H0Z'/%3E%3Cpath class='b' d='M15.354,9.352H6.977l3.66-3.66a.756.756,0,0,0,0-1.065.747.747,0,0,0-1.057,0L4.637,9.569a.747.747,0,0,0,0,1.057l4.943,4.943a.748.748,0,1,0,1.057-1.057l-3.66-3.66h8.378a.75.75,0,1,0,0-1.5Z' transform='translate(-1.104 -1.102)'/%3E%3C/svg%3E");
    content: '';
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    transform: rotate( 0 );
}

.task-menu-sidebar-section {
    width: 70px;
    float: left;
    box-shadow: 2px 4px 5px rgba(0, 0, 0, 0.27);
    height: 100%;
    position: relative;
    z-index: 1;
    background-color: #ffffff;
}

.task-main-list {
    margin-left: 70px;
}

.routeOptimize-map {
    height: calc(100vh - 180px);
}

.delivery-map {
    height: calc(100vh - 58px);
}

.count-all {
    background-color: #f55d5d !important;
}

.count-unassigned {
    background-color: #999fa5 !important;
}

.count-unassigned-new {
    background-color: #cfdbe8 !important;
}

.count-assigned {
    background-color: #415fa5 !important;
}

.count-in-progress {
    background-color: #ff8f2b !important;
}

.count-on-hold {
    background-color: #5d85f5 !important;
}

.count-on-failed {
    background-color: #f051ea !important;
}

.count-completed {
    background-color: #31c787 !important;
}

.font-count-all {
    color: #f55d5d !important;
}

.font-count-unassigned {
    color: #999fa5 !important;
}

.font-count-assigned {
    color: #415fa5 !important;
}

.font-count-in-progress {
    color: #ff8f2b !important;
}

.font-count-on-hold {
    color: #5d85f5 !important;
}

.font-count-on-failed {
    color: #f051ea !important;
}

.font-count-completed {
    color: #31c787 !important;
}

.task-menu-ul {
}

    .task-menu-ul li {
        margin-bottom: 8px;
    }

        .task-menu-ul li a {
            display: block;
            text-align: center;
            padding: 32px 3px 6px;
            color: #696969;
            border-right: 0px solid transparent;
            position: relative;
        }

            .task-menu-ul li a .task-icon {
                font-size: 21px;
            }

            .task-menu-ul li a.active {
                background-color: #415fa5;
            }

                .task-menu-ul li a.active .task-icon {
                    color: #31c787;
                }

            .task-menu-ul li a .task-count {
                font-size: 12px;
                font-weight: 600;
                color: #fff;
                border-radius: 0;
                width: 40px;
                height: 21px;
                padding: 0;
                line-height: 23px;
                position: absolute;
                top: 6px;
                right: 0;
                left: 0;
                background-color: #f55d5d;
                color: #fff;
                border: 1px solid #fff;
                margin: 0 auto;
            }

            .task-menu-ul li a p {
                color: #777;
                font-size: 12px;
                line-height: 14px;
                margin-top: 5px;
                margin-bottom: 0;
                text-overflow: ellipsis;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            .task-menu-ul li a.active p {
                color: #fff;
            }

            .task-menu-ul li a .icon-img {
                width: 22px;
                height: 22px;
                display: inline-block;
                background-repeat: no-repeat;
                background-position: center;
            }

                .task-menu-ul li a .icon-img.all {
                    background-image: url(../../Images/delivery/icons/unactive/bars.png);
                }

            .task-menu-ul li a.active .icon-img.all {
                background-image: url(../../Images/delivery/icons/active/all_white.png);
            }

            .task-menu-ul li a .icon-img.unassigned {
                background-image: url(../../Images/delivery/icons/unactive/unassigned.png);
            }

            .task-menu-ul li a.active .icon-img.unassigned {
                background-image: url(../../Images/delivery/icons/active/unassigned_white.png);
            }

            .task-menu-ul li a .icon-img.assign {
                background-image: url(../../Images/delivery/icons/unactive/assign.png);
            }

            .task-menu-ul li a.active .icon-img.assign {
                background-image: url(../../Images/delivery/icons/active/assigned_white.png);
            }

            .task-menu-ul li a .icon-img.completed {
                background-image: url(../../Images/delivery/icons/unactive/completed.png);
            }

            .task-menu-ul li a.active .icon-img.completed {
                background-image: url(../../Images/delivery/icons/active/completed_white.png);
            }

            .task-menu-ul li a .icon-img.in-progress {
                background-image: url(../../Images/delivery/icons/unactive/in-progress.png);
            }

            .task-menu-ul li a.active .icon-img.in-progress {
                background-image: url(../../Images/delivery/icons/active/in-progress_white.png);
            }

            .task-menu-ul li a .icon-img.on-hold {
                background-image: url(../../Images/delivery/icons/unactive/on-hold.png);
            }

            .task-menu-ul li a.active .icon-img.on-hold {
                background-image: url(../../Images/delivery/icons/active/on-hold_white.png);
            }

            .task-menu-ul li a .icon-img.on-failed {
                background-image: url(../../Images/delivery/icons/unactive/task_failed.png);
            }

            .task-menu-ul li a.active .icon-img.on-failed {
                background-image: url(../../Images/delivery/icons/active/failed_white.png);
            }



.task-main-list .task-list-header {
    padding: 15px 15px;
    background-color: #ffffff;
}

.task-list-header .task-header-title {
    color: #000000;
    font-weight: 600;
}

.task-list-search-wrapper.dummy-task-search {
    max-width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.33);
    border-radius: 80px;
    width: 100%;
    overflow: auto;
}

.task-list-search-wrapper input.txtSearchTask.task-search-filter, .task-detail-search-wrapper > input {
    border: 0;
    width: 100%;
    color: #3D3D3D;
    padding: 10px 10px 10px 25px;
    font-size: 14px;
    line-height: 1.3;
    background-size: 14px;
    background-image: url("data:image/svg+xml,%3Csvg fill='%2300000080' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cdefs%3E%3C/defs%3E%3Cpath class='a' d='M13.006,11.805h-.632l-.224-.216a5.211,5.211,0,1,0-.56.56l.216.224v.632l4,3.994L17,15.807Zm-4.8,0a3.6,3.6,0,1,1,3.6-3.6A3.6,3.6,0,0,1,8.2,11.805Z' transform='translate(-3 -3)'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center left 5px;
}

.close-search-task {
    color: rgba(0, 0, 0, 0.6);
}

a.filter-option {
    display: flex;
    width: 20%;
    align-items: center;
    justify-content: center;
    transition: 0.3s all ease-in-out;
}

    a.filter-option img {
        max-width: 13px;
        height: auto;
    }

    a.filter-option:hover {
        filter: contrast(0.1);
    }

.task-list-search-wrapper, .task-detail-search-wrapper {
    display: flex;
    border-bottom: 1px solid #00000054;
}

.task-list-header .fa.fa-bullhorn, .task-list-header .dropdown-task-menu-btn {
    color: rgba(0, 0, 0, 0.2);
}

.task-header-icons a,
.task-cart .driver-name i,
.task-cart .task-title i {
    color: #999fa5;
    margin-left: 10px;
}

.task-header-button {
    font-size: 14px;
    border-radius: 50px;
    padding: 6px 10px;
    border: 1px solid #999fa5;
    background-color: #fff;
    width: 100%;
    text-align: left;
    color: #696969;
    font-weight: 600;
}


.task-cart {
    margin-bottom: 10px;
    color: #282828;
    padding: 10px 10px 10px 10px;
    cursor: pointer;
    margin: 0px;
}

    .task-cart.active, .task-cart:hover {
        background-color: #c9e4ff;
    }

    .task-cart .task-title {
        font-size: 14px;
        margin: 0;
        margin-bottom: 7px;
        font-weight: 600;
        width: 150px;
    }

    .task-cart .driver-name {
        margin-bottom: 7px;
    }

.task-status {
    display: inline-block;
    padding: 3px 10px;
    color: #fff;
    font-weight: 500;
    border-radius: 50px;
    font-size: 10px;
    letter-spacing: 0.3px;
}



.task-filter-main {
    position: absolute;
    left: 46%;
    top: 10px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

    .task-filter-main .task-search-filter {
        width: 97%;
        border-radius: 50px;
        padding: 8px 15px;
        border: 1px solid #fff;
        box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.2);
        -webkit-box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.2);
        height: 43px;
    }

.task-dropdown-btn {
    height: 36px;
    width: 67px;
    border-radius: 10px;
    background-color: #415fa5;
    color: #fff;
    border: 0;
    -webkit-box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.3);
}

    .task-dropdown-btn i + i {
        margin-left: 10px;
    }

.task-dropdown-filter {
    top: 36px;
    border-radius: 20px;
    padding: 0px;
    margin-right: 0px;
    margin-top: 1px;
    border: 0;
    overflow: hidden;
    width: 160px;
}

    .task-dropdown-filter li a {
        padding: 10px 15px;
        font-weight: 500;
        font-size: 14px;
    }

        .task-dropdown-filter li a.active {
            background-color: #415fa5;
            color: #fff;
        }

.task-add-btn-div,
.kanban-task-add {
    position: absolute;
    bottom: 35px !important;
    right: 6px !important;
}

.dropdown-select-wrap .dropdown-select-submenu a img {
    width: 14px;
}

.kanban-task-add .task-add-btn,
.task-add-btn-div .task-add-btn {
    width: 40px;
    height: 40px;
    display: block;
    text-align: center;
    background-color: #f55d5d;
    color: #fff;
    font-size: 16px;
    border-radius: 50%;
    box-shadow: -3px -3px 8px rgba(0, 0, 0, 0.28);
    -webkit-box-shadow: -3px -3px 8px rgba(0, 0, 0, 0.28);
    -moz-box-shadow: -3px -3px 8px rgba(0, 0, 0, 0.28);
}

    .kanban-task-add .task-add-btn i,
    .task-add-btn-div .task-add-btn i {
        line-height: 40px;
        font-size: 23px;
    }

.task-driver-list-section {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 73%;
    height: 310px;
    background-color: #fff;
    padding: 15px 20px 10px 34px;
    border-top-left-radius: 50px;
    box-shadow: -16px -4px 10px rgba(0, 0, 0, 0.1);
}

    .task-driver-list-section .task-driver-info li {
        display: inline-block;
        padding: 0 10px;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.3px;
    }

        .task-driver-list-section .task-driver-info li:first-child span {
            color: #f55d5d
        }

        .task-driver-list-section .task-driver-info li:last-child span {
            color: #31c787;
        }

.task-driver-filter {
    margin-top: 10px;
}

.task-driver-close {
    position: absolute;
    left: -55px;
    top: -21px;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background-color: #415fa5;
    text-align: center;
    line-height: 37px;
    color: #fff;
    cursor: pointer;
}

.task-detail-tab,
.task-driver-tab {
    overflow: hidden;
    display: inline-block;
}

    .task-driver-tab li,
    .task-detail-tab li {
        float: left;
    }

        .task-driver-tab li:first-child a,
        .task-detail-tab li:first-child a {
            border-top-left-radius: 50px;
            border-bottom-left-radius: 50px;
            border-left: 1px solid #f55d5d;
        }

        .task-driver-tab li:last-child a,
        .task-detail-tab li:last-child a {
            border-top-right-radius: 50px;
            border-bottom-right-radius: 50px;
            border-right: 1px solid #f55d5d;
        }

        .task-driver-tab li a,
        .task-detail-tab li a {
            border-top: 1px solid #f55d5d;
            padding: 0 10px;
            color: #282828;
            font-size: 12px;
            display: block;
            font-weight: 600;
            text-decoration: none;
            height: 33px;
            line-height: 33px;
            border-bottom: 1px solid #f55d5d;
        }

.search-header {
    position: relative;
}

    .search-header .close-search {
        color: #ffffff;
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
    }

.form-control-rounded {
    border-radius: 50px;
    border-color: #999fa5;
}

.task-driver-tab li a.active, .task-detail-tab li a.active {
    background-color: #f55d5d;
    color: #fff;
}

.task-driver-info {
    margin-top: 10px;
}

    .task-driver-info .driver-count {
        color: #415fa6;
        font-size: 12px;
        font-weight: 500;
    }

.task-menu-ul li a .task-count-zero {
    background: #d5d5d5;
    color: #000;
}

.kanban-header-section li p .task-count-zero {
    background: #d5d5d5;
    color: #000;
}

.task-drivers-carousel .driver-cart {
}

    .task-drivers-carousel .driver-cart .driver-img-div {
        width: 55px;
        height: 55px;
        margin: 0 auto 7px auto;
    }

        .task-drivers-carousel .driver-cart .driver-img-div img {
            display: block;
            width: 100%;
            width: 55px;
            height: 55px;
        }


    .task-drivers-carousel .driver-cart p {
        text-decoration: none;
        color: #282828;
        font-size: 14px;
        font-weight: 500;
    }

.driver-cart.active {
    background-color: #e5eef7;
}

.driver-task-count .driver-circle {
    display: inline-block;
    color: #fff;
    border-radius: 50%;
    margin-left: 7px;
    font-weight: 600;
    font-size: 11px;
    width: 25px;
    height: 25px;
    line-height: 25px;
}

    .driver-task-count .driver-circle.assigned {
        background-color: #f55d5d;
    }

    .driver-task-count .driver-circle.unassigned {
        background-color: #31c787;
    }

.owl-nav-driver {
    margin: 0 !important;
}

    .owl-nav-driver .owl-next {
        position: absolute;
        top: 38%;
        transform: translateY(-50%);
        background-color: #fff !important;
        border: 0;
        font-size: 35px;
        right: -10px;
    }

    .owl-nav-driver .owl-prev {
        position: absolute;
        top: 38%;
        transform: translateY(-50%);
        background-color: #fff !important;
        border: 0;
        font-size: 35px;
        left: -10px;
        color: #282828 !important;
    }

.owl-dots-driver {
    margin-top: 5px !important;
}

.task-details-asidebar {
    width: 280px;
    position: fixed;
    top: 58px;
    height: 100%;
    background-color: #ffffff;
    z-index: 2;
    box-shadow: 2px 4px 5px rgba(0, 0, 0, 0.27);
    display: none;
    z-index: 10;
}

.task-detail-search-wrapper.dummy-task-detail-search {
    max-width: 140px;
}

.waypoints-info p:first-child {
    color: #8D8D8D;
    font-size: 12px;
}

.task-details-asidebar .task-details-header,
.task-details-asidebar .task-details-body {
    padding: 15px 20px;
}

.task-track-section {
    position: relative;
}

.customDate-wrap button .icon-arrow-down {
    font-size: 10px;
    line-height: 1;
    margin-left: 5px;
}

.task-track-div {
    padding: 35px 15px 18px 15px;
    background-color: rgba(65, 95, 165, 1);
    border-radius: 50px;
    -webkit-box-shadow: 0px 0px 5px rgba(65, 95, 165, 0.25);
    -moz-box-shadow: 0px 0px 5px rgba(65, 95, 165, 0.25);
    box-shadow: 0px 0px 5px rgba(65, 95, 165, 0.25)
}

    .task-track-div .progress-bar-xs {
        height: 5px;
        border-radius: 50px;
        border: 0px;
    }

    .task-track-div .progress-bar-warning {
        background-color: #ffbb47 !important;
    }

.progress-bar-truck {
    position: absolute;
    top: -25px;
    left: calc(0%);
}

.task-track-info {
    color: #fff;
    font-size: 12px;
    line-height: 1;
    font-weight: 500;
    margin-top: 4px;
}

.task-details-header .driver-details {
    overflow: hidden;
    margin-top: 10px;
    color: #282828;
}

    .task-details-header .driver-details .driver-img {
        width: 38px;
        height: 38px;
        display: block;
        border-radius: 50%;
        background-color: #f55d5d;
        color: #fff;
        text-align: center;
        font-weight: 600;
        line-height: 38px;
    }

.task-drivers-carousel .driver-cart .driver-img {
    width: 55px;
    height: 55px;
    margin: 0 auto 6px auto;
    display: block;
    border-radius: 50%;
    background-color: #f55d5d;
    color: #fff;
    text-align: center;
    font-weight: 600;
    font-size: x-large;
    line-height: 60px;
}

.waypoints-info .halt-count {
    background-color: #ff8f2b;
    padding: 3px 7px;
    font-size: 11px;
    border-radius: 50%;
    color: #fff;
}

.customer-details {
    margin: 10px 0 12px;
}

.waypoints-timeline::before {
    content: '';
    position: absolute;
    height: 10px;
    width: 10px;
    background-color: white;
    top: 0;
    left: -5px;
}



.waypoints-timeline,
.waypoints-timeline > li {
    list-style: none;
    padding: 0;
    transition: 0.3s all ease-in-out;
    padding-bottom: 0;
    border-left: 2px dashed rgba(127, 127, 127, 0.5);
    position: relative;
    padding-left: 15px;
    margin-left: 0px;
    margin-bottom: 20px;
}

    .waypoints-timeline > li {
        padding-right: 20px;
    }

.waypoints-timeline {
    margin-top: 0;
    border-radius: 12px;
    position: relative;
    counter-reset: dropcap;
    padding-left: 0;
    padding-right: 0;
    border-radius: 0;
}

    .waypoints-timeline > li {
        border-left: 0;
    }



        .waypoints-timeline > li:last-child {
            border-color: #fff;
        }


        .waypoints-timeline > li:before {
            content: "";
            width: 14px;
            height: 14px;
            background: #ffffff;
            border-radius: 50%;
            position: absolute;
            left: -8px;
            top: 8px;
            font-size: 13px;
            line-height: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #ffffff;
            z-index: 1;
            border: 3px solid #999fa5;
        }




        .waypoints-timeline > li .read-more-btn, .rounded-lightBlue-bttn {
            color: #415FA5;
            font-size: 12px;
            line-height: 1.2;
            text-decoration: none;
            background-color: #F3FAFF;
            padding: 6px 22px;
            border-radius: 80px;
            display: flex;
            align-items: center;
        }

.rounded-lightBlue-bttn {
    justify-content: center;
    display: inline-flex;
}

.waypoints-timeline > li .read-more-btn img {
    margin-left: 3px;
}

.waypoints-timeline > li .signature-box {
    border: 1px solid #9ba1a7;
    border-radius: 21px;
    width: 200px;
    height: 80px;
    overflow: hidden;
    padding: 7px 15px;
}

    .waypoints-timeline > li .signature-box img {
        width: 100%;
        height: 70px;
    }

.waypoints-timeline > li .attachment-box {
    border-radius: 15px;
    height: 70px;
    width: 100px;
    overflow: hidden;
    border: 1px solid #9ba1a7;
}

    .waypoints-timeline > li .attachment-box > img {
        height: 65px;
        width: 100% !important;
    }

.waypoints-timeline > li > .waypoints-details .icon-colors {
    color: #999fa5;
}

.waypoints-timeline > li > .waypoints-details .waypoints-status {
    padding: 2px 6px;
    font-size: 11px;
    color: #fff;
    font-weight: 500;
    border-radius: 50px;
}

    .waypoints-timeline > li > .waypoints-details .waypoints-status.arrived {
        background-color: #196343;
    }

    .waypoints-timeline > li > .waypoints-details .waypoints-status.completed {
        background-color: #31c787;
    }

    .waypoints-timeline > li > .waypoints-details .waypoints-status.on-hold {
        background-color: #5d85f5;
    }

    .waypoints-timeline > li > .waypoints-details .waypoints-status.on-failed {
        background-color: #f051ea;
    }

    .waypoints-timeline > li > .waypoints-details .waypoints-status.cancelled {
        background-color: #31c787;
    }

    .waypoints-timeline > li > .waypoints-details .waypoints-status.running {
        background-color: #ff8f2b;
    }

.waypoints-timeline > li > .waypoints-details .customer-details .customer-img {
    width: 38px;
    height: 38px;
    display: block;
    border-radius: 50%;
    background-color: #31c787;
    color: #fff;
    text-align: center;
    font-weight: 600;
    line-height: 38px;
}

.task-asidebar-close {
    width: 25px;
    height: 25px;
    line-height: 25px;
    background-color: #f55d5d;
    border-radius: 50%;
    position: absolute;
    right: -20px;
    text-align: center;
    top: 0px;
    color: #fff;
}

.dropdown-task-menu {
    border-radius: 20px;
    padding: 0px;
    overflow: hidden;
    border: 0;
}

    .dropdown-task-menu li a em {
        color: #999fa5;
        padding-right: 10px;
    }

    .dropdown-task-menu li a {
        font-weight: 500;
        padding: 8px 15px;
    }

.dropdown-task-menu-btn {
    background-color: #fff;
    border: 0px;
    color: #999fa5;
    padding: 0;
    background-color: transparent;
    padding-right: 7px;
}

.task-tab-widget {
    display: none;
}

    .task-tab-widget.active {
        display: block;
    }

.task-detail-tab-widget {
    display: none;
}

    .task-detail-tab-widget.active {
        display: block;
    }

.task-kanban-main {
}

    .task-kanban-main .task-kanban-header {
        padding: 22px 15px 0px;
        background-color: #fff;
    }

.kanban-status-count {
    padding: 20px 15px;
}

    .kanban-status-count p {
        display: flex;
        font-weight: 600;
        font-size: 15px;
        color: #282828;
        align-items: center;
    }


.kanban-task-icon {
    font-size: 15px;
    color: #696969;
}

.kanban-task-count {
    font-size: 11px;
    font-weight: 600;
    background: #ff902b;
    color: #fff;
    padding: 3px 9px;
    /*border-radius: 50%;*/
    display: inline-block;
}

.task-kanban-main .task-kanban-body {
    background-color: #e5eef7;
    padding: 0px 15px;
}


    .task-kanban-main .task-kanban-body .border-right {
        border-right: 2px solid #b9c1c7;
    }

.kanban-card .task-title {
    font-size: 15px;
    margin: 0;
    margin-bottom: 13px;
    font-weight: 600;
}

.task-kanban-main .task-kanban-body .kanban-inner {
    padding: 6px 10px 0 10px;
    margin-bottom: 3px;
}

.kanban-card {
    background-color: #fff;
    padding: 12px 10px;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
}

.tag_time_wrap {
    display: flex;
    align-items: center;
}

    .tag_time_wrap .task-status {
        margin-left: auto;
    }

    .tag_time_wrap .material-icons {
        text-align: left;
        margin-right: 5px;
    }

.task-kanban-main .task-kanban-body .custom-kanban-wrap li {
    border: 0;
    background-color: #f5f7fa;
    width: calc(100% / 6 - 5px);
    border-radius: 10px;
    overflow-x: hidden;
}

.task-kanban-main .task-kanban-body .custom-kanban-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    background-color: #ffffff;
}

.custom-kanban-header {
    padding: 20px 10px 5px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-family: 'CircularStd-Black';
    position: sticky;
    top: 0;
    background-color: #f5f7fa;
    z-index: 99;
}

    .custom-kanban-header .kanban-task-count {
        margin-left: auto !important;
    }


.kanban-card .driver-name i {
    color: #999fa5;
}

.task-icon-colors {
    color: #999fa5;
}

.no-task img {
    width: 200px;
    margin: 0 auto;
}

.no-task .no-task-links {
    font-weight: 700;
    text-decoration: underline;
    color: #f55d5d;
    letter-spacing: 0.2px;
}

.task-filter-map-option .filter-btn {
    height: 36px;
    width: 126px;
    border-radius: 10px;
    font-weight: 600;
    padding: 3px 20px;
    -webkit-box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 17px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.14);
}

.filter-btn.dropdown-toggle {
    width: auto;
}


.kanban-header-section li {
    width: calc(83% / 5);
    float: left;
    padding: 15px 20px;
    text-align: center;
}

.kanban-body-ul li {
    width: calc(100% / 6);
    float: left;
    padding: 0px 0px 10px 0px;
    height: calc(100vh - 178px)
}

.task-loading {
    padding: 15px;
    border: 1px solid #ddd;
    margin: 60px 31px;
    border-radius: 15px;
    font-weight: 600;
    text-align: center;
}

.waypoints-info .waypoints-count {
    background-color: #9E9E9E;
    padding: 3px 7px;
    font-size: 11px;
    border-radius: 50%;
    color: #fff;
}
/*********** Delivery module new UI End************/

.paid-invoice {
    background-color: rgba(16, 255, 0, 0.24);
}

.writeoff-invoice {
    background-color: rgba(255, 0, 0, 0.18);
}

.mb-60 {
    margin-bottom: 60px !important;
}

.task-status-pill.task-status-inprogress, .task-status-inprogress {
    background-color: #ff8f2b
}

.task-status-pill.task-status-completed, .task-status-completed {
    background-color: #31c787;
}

.task-status-pill.task-status-reassign, .task-status-reassign {
    background-color: #f55d5d;
}

.task-status-pill.task-status-assigned, .task-status-assigned {
    background-color: #415fa5;
}

.task-status-pill.task-status-unassigned, .task-status-unassigned {
    background-color: #999fa5;
}

.task-status-pill.task-status-scheduled, .task-status-scheduled {
    background-color: #a829cf;
}

.task-status-pill.task-status-cancelled, .task-status-cancelled {
    background-color: #f55d5d;
}

.task-status-pill.task-status-deleted, .task-status-deleted {
    background-color: #8c5454;
}

.task-status-pill.task-status-failed, .task-status-failed {
    background-color: #f55d5d;
}

.task-status-pill.task-status-hold, .task-status-hold {
    background-color: #5d85f5;
}

.task-status-pill.task-label-cancelled, .task-label-cancelled {
    background-color: rgba(245, 93, 93, 0.23)
}

.task-status-pill.task-label-deleted, .task-label-deleted {
    background-color: rgba(140, 84, 84, 0.35)
}

.task-status-pill.task-label-failed, .task-label-failed {
    background-color: #f55d5d;
}

.icon_heat_map {
    background: url('../../Images/icon/ts_heatmap.png') no-repeat;
}

.icon_task_distribution {
    background: url('../../Images/icon/ts_distribution.png') no-repeat;
}

.icon_task_on_map {
    background: url('../../Images/icon/ts_tasks.png') no-repeat;
}

.icon_vehicle_map {
    background: url('../../Images/icon/ts_assets.png') no-repeat;
}

.icon_selected_heat_map {
    background: url('../../Images/icon/ts_heatmap_selected.png') no-repeat;
}

.icon_selected_task_distribution {
    background: url('../../Images/icon/ts_distribution_selected.png') no-repeat;
}

.icon_selected_task_on_map {
    background: url('../../Images/icon/ts_tasks_selected.png') no-repeat;
}

.icon_selected_vehicle_map {
    background: url('../../Images/icon/ts_assets_selected.png') no-repeat;
}




.task-status-font-inprogress {
    background-color: #ff8f2b;
    color: #ff8f2b;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-completed {
    background-color: #31c787;
    color: #31c787;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-reassign {
    background-color: #f55d5d;
    color: #f55d5d;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-assigned {
    background-color: #415fa5;
    color: #415fa5;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-unassigned {
    background-color: #999fa5;
    color: #999fa5;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-scheduled {
    background-color: #e8cef0;
    color: #e8cef0;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-cancelled {
    background-color: #f55d5d;
    color: #f55d5d;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-deleted {
    background-color: #8c5454;
    color: #8c5454;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-failed {
    background-color: #f55d5d;
    color: #f55d5d;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}

.task-status-font-hold {
    background-color: #5d85f5;
    color: #5d85f5;
    height: 18px;
    width: 18px;
    border-radius: 50%;
}


.form-group-page-icon .icon {
    right: initial;
    left: 0;
    width: 38px;
    height: 45px;
    line-height: 45px;
    font-size: 16px;
}

.form-group-page-icon .form-control.control-material {
    padding: 6px 6px 6px 6px;
    height: 43px;
}

.form-group-page-icon .pass-show {
    right: 0;
    left: auto;
    width: 38px;
    height: 45px;
    line-height: 43px;
    font-size: 18px;
    cursor: pointer;
    position: absolute;
    pointer-events: auto;
    z-index: 9;
}

.form-group-page-icon {
    margin-bottom: 20px;
}

.delivery-task-infobox .info_popup {
    min-width: 120px;
    text-align: center;
}

    .delivery-task-infobox .info_popup .info_popup_rgt {
        padding: 5px 3px;
        width: 100%;
    }

.icon_pickup {
    /*background: url('../../Images/delivery/pickup.png') no-repeat;*/
    background: url('../../Images/delivery/new-pickup-icon.svg') no-repeat;
    height: 30px;
    margin: 0px 0px 0px 10px !important;
}

.icon_delivery {
    /*background: url('../../Images/delivery/delivery.png') no-repeat;*/
    background: url('../../Images/delivery/new-delivery-icon.svg') no-repeat;
    height: 30px;
    margin: 0px 0px 0px 10px !important;
}

.icon_appointment {
    background: url('../../Images/alert_icons/new-delivery-icon.svg') no-repeat;
    height: 30px;
    margin: 0px 0px 0px 10px !important;
}


.driver-details .driver-img, .name-letters {
    width: 24px;
    height: 24px;
    margin: 10px auto 6px auto;
    display: block;
    border-radius: 50%;
    background-color: #8d8d8d;
    color: #fff;
    text-align: center;
    font-weight: 600;
    font-size: x-large;
    line-height: 53px;
}

.blue-color {
    background-color: #415FA5;
    padding: 3px 7px;
    font-size: 11px;
    border-radius: 50%;
    color: #fff;
}

.grey-color {
    background-color: #31c787;
    padding: 3px 7px;
    font-size: 11px;
    border-radius: 50%;
    color: #fff;
}



.task-main-list .toggle-sidebar-left {
    position: absolute;
    width: 36px;
    height: 30px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2196F3;
    top: 20px;
    right: -36px;
    cursor: pointer;
    color: #ffffff;
    font-weight: bold;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}

.task-main-list {
    position: absolute;
    width: 280px;
    background-color: #ffffff;
    left: -280px;
    transition: 0.3s all ease-in-out;
}

.detail-driver-work-list-middle ul > li p span {
    margin-left: 4px;
    max-width: 96px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

.sidebar-toggle-body .task-main-list {
    left: 0;
    transition: 0.3s all ease-in-out;
}

.toggle-sidebar-right {
    position: fixed;
    width: 36px;
    height: 30px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2196F3;
    top: 70px;
    right: 45px;
    cursor: pointer;
    color: #ffffff;
    font-weight: bold;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    transition: 0.3s all ease-in-out;
}

.task-main-list .toggle-sidebar-left::before, .sidebar-toggle-body-right .toggle-sidebar-right::before, .icon-arrow-left-circle.toggle-sidebar-right::before {
    transform: rotate( 180deg );
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D.b%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='a' d='M0,0H18V18H0Z'/%3E%3Cpath class='b' d='M15.354,9.352H6.977l3.66-3.66a.756.756,0,0,0,0-1.065.747.747,0,0,0-1.057,0L4.637,9.569a.747.747,0,0,0,0,1.057l4.943,4.943a.748.748,0,1,0,1.057-1.057l-3.66-3.66h8.378a.75.75,0,1,0,0-1.5Z' transform='translate(-1.104 -1.102)'/%3E%3C/svg%3E");
    content: '';
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
}

.sidebar-toggle-body .task-main-list .toggle-sidebar-left::before, .icon-arrow-left-circle.toggle-sidebar-right::before {
    transform: rotate( 0 );
}

.sidebar-toggle-body-right .icon-arrow-left-circle.toggle-sidebar-right::before {
    transform: rotate( 180deg );
}



.driver-team-wrapper > .search-header input {
    border-radius: 0;
    background-color: #3D5AA9;
    color: #ffffff;
    background-image: url("data:image/svg+xml,%3Csvg fill='%23ffffff' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cdefs%3E%3C/defs%3E%3Cpath class='a' d='M13.006,11.805h-.632l-.224-.216a5.211,5.211,0,1,0-.56.56l.216.224v.632l4,3.994L17,15.807Zm-4.8,0a3.6,3.6,0,1,1,3.6-3.6A3.6,3.6,0,0,1,8.2,11.805Z' transform='translate(-3 -3)'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 14px;
    padding: 7px 10px;
    padding-left: 40px;
    background-position: center left 15px;
    font-size: 14px;
    line-height: 21px;
    height: auto;
}

    .driver-team-wrapper > .search-header input::placeholder {
        color: #ffffff;
    }

.driver-team-wrapper .tab-content .task-driver-filter {
    margin-top: 0;
}

    .driver-team-wrapper .tab-content .task-driver-filter ul.task-driver-tab {
        width: 100%;
        padding: 5px;
    }

        .driver-team-wrapper .tab-content .task-driver-filter ul.task-driver-tab a {
            background-color: #F3FAFF;
            color: rgba(65, 95, 165, 0.7);
            border: 0;
            text-align: center;
            font-size: 12px;
            line-height: 16px;
            height: auto;
            padding: 5px 12px 2px;
            border-radius: 0;
            font-weight: normal;
            display: flex;
            flex-direction: column;
        }

            .driver-team-wrapper .tab-content .task-driver-filter ul.task-driver-tab a label {
                font-size: 15px;
                line-height: 1;
                margin-bottom: 2px;
            }

    .driver-team-wrapper .tab-content .task-driver-filter .w-90per {
        width: 100%;
        padding-right: 5px;
    }

    .driver-team-wrapper .tab-content .task-driver-filter ul.task-driver-tab > li {
        padding: 0 5px;
        width: 33.33%;
    }

    .driver-team-wrapper .tab-content .task-driver-filter ul.task-driver-tab a.active label {
        color: #ffffff !important;
    }

#taskDetailDiv .detail-title-header {
    padding: 8px 15px 8px 19px;
}

.driver-team-wrapper .tab-content .task-driver-filter ul.task-driver-tab > li:first-child {
    padding-left: 0;
}

.driver-team-wrapper .tab-content .task-driver-filter ul.task-driver-tab > li:last-child {
    padding-right: 0;
}

.driver-team-wrapper .tab-content .task-driver-filter ul.task-driver-tab a.active {
    background-color: #2196F3;
    color: #ffffff;
}

.contact-driver-details {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-items: center;
    padding: 8px 10px;
}

.contact-driver-details-center {
    display: flex;
    font-size: 14px;
    line-height: 1;
    flex-wrap: wrap;
    margin: 0 11px;
    width: 100%;
    max-width: calc(100% - 70px);
}

    .contact-driver-details-center a {
        color: #415FA5;
        font-weight: 500;
    }

.driver-details hr {
    margin: 0;
}

.contact-driver-details-center a.tellink {
    color: rgba(0, 0, 0, 0.7);
    font-size: 12px;
    line-height: 16px;
    margin-top: 2px;
    margin-left: 1px;
}

    .contact-driver-details-center a.tellink i {
        display: none;
    }

.contact-driver-details-right .waypoints-count {
    width: 22px;
    height: 22px;
    display: flex;
    font-size: 13px;
    line-height: 1;
    align-items: center;
    justify-content: center;
    padding: 5px;
}

.outer-tab.driver-team-wrapper .driver-details .contact-driver-details .contact-driver-details-center {
    max-width: calc(100% - 100px);
}

.driver-details .driver-img {
    width: 24px;
    height: 24px;
    font-size: 12px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
}

.contact-driver-details-left {
    position: relative;
}

span.active-user {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #2CCB8B;
    border-radius: 50%;
    right: -1px;
    bottom: -1px;
    border: 2px solid #ffffff;
}

span.in-active-user {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #ff442b;
    border-radius: 50%;
    right: -1px;
    bottom: -1px;
    border: 2px solid #ffffff;
}

span.free-user {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #FF8F2B;
    border-radius: 50%;
    right: -1px;
    bottom: -1px;
    border: 2px solid #ffffff;
}

.contact-driver-details-right span + span {
    margin-left: 6px;
}

.contact-driver-details-right {
    display: flex;
    flex-wrap: wrap;
}

    .contact-driver-details-right .grey-color {
        background-color: #2CCB8B;
    }

    .contact-driver-details-right .blue-color {
        background-color: #415FA5;
    }




.task-driver-detail-wrapper {
    background-color: #ffffff;
    color: #000000;
    padding: 0;
}

.driver-details {
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
}

.driver-group-details-wrap {
    display: flex;
    align-items: center;
}

    .driver-group-details-wrap p.fw-700 {
        margin: 0 10px;
    }

.task-driver-map-name {
    margin: 14px 0;
    font-size: 13px;
    line-height: 19px;
}

    .task-driver-map-name img {
        margin-right: 10px;
    }

.task-track-section .task-track-div {
    padding: 0;
    background-color: transparent;
    margin-top: 36px;
    margin-bottom: 10px;
}

    .task-track-section .task-track-div .progress.progress-bar-xs {
        height: auto;
        width: auto;
        border-bottom: 4px dotted white !important;
        background-color: transparent;
    }

        .task-track-section .task-track-div .progress.progress-bar-xs::before, .task-track-section .task-track-div .progress.progress-bar-xs::after {
            content: '';
            width: 12px;
            height: 12px;
            background-color: #ffffff;
            position: absolute;
            z-index: 99;
            border-radius: 50%;
            top: -4px;
        }

        .task-track-section .task-track-div .progress.progress-bar-xs::before {
            left: 0;
            right: auto;
        }

        .task-track-section .task-track-div .progress.progress-bar-xs::after {
            right: 0;
            left: auto;
        }

.task-track-section .task-track-info {
    text-align: center;
}

.task-driver-filter ul.task-detail-tab {
    width: 100%;
    border-radius: 3px;
    box-shadow: 0px 0px 7px #FFFFFF69;
    margin-top: 10px;
}

    .task-driver-filter ul.task-detail-tab li {
        width: 50%;
        text-align: center;
        border-radius: 3px;
    }

        .task-driver-filter ul.task-detail-tab li a {
            font-size: 12px;
            line-height: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 26px;
            background-color: #ffffff;
            border-radius: 0;
            border-color: #ffffff;
        }

            .task-driver-filter ul.task-detail-tab li a.active {
                background-color: #175484;
                border-radius: 3px;
                color: #ffffff;
                border: 0;
            }

.total-halt-time-wrap {
    font-size: 12px;
    line-height: 1;
    display: flex;
    align-items: center;
    width: 90px;
    max-width: 100%;
}

    .total-halt-time-wrap img {
        max-width: 30px;
        margin-right: 5px;
    }

.waypoints-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.view-more-time-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .view-more-time-wrap p {
        margin-bottom: 0;
        background-color: rgb(243, 250, 255);
        width: 44px;
        height: 22px;
        border-radius: 50px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #415FA5;
        font-size: 12px;
        line-height: 1.2;
    }

    .view-more-time-wrap .material-icons {
        font-size: 20px;
        line-height: 1;
        color: #1E77BD;
        margin-right: 5px;
    }

    .view-more-time-wrap p:first-child {
        display: flex;
        align-items: center;
    }

.sytem-update-wrap {
    display: flex;
    align-items: center;
}
/**/
.system-update-icon {
    min-width: 30px;
    height: 30px;
    margin-left: auto;
    background-color: transparent;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(33, 150, 243, 0.2);
}

.system-update-batch-completed {
    font-size: 10px;
    line-height: 1;
    background-color: #1CA200;
    color: #ffffff;
    padding: 6px 9px;
    border-radius: 50px;
    margin-left: auto;
}

.system-update-batch-arrived {
    font-size: 10px;
    line-height: 1;
    background-color: #415fa5;
    color: #ffffff;
    padding: 6px 9px;
    border-radius: 50px;
    margin-left: auto;
}

.system-update-batch-inprogress {
    font-size: 10px;
    line-height: 1;
    background-color: #ff8f2b;
    color: #ffffff;
    padding: 6px 9px;
    border-radius: 50px;
    margin-left: auto;
}

.system-update-batch-onhold {
    font-size: 10px;
    line-height: 1;
    background-color: #5d85f5;
    color: #ffffff;
    padding: 6px 9px;
    border-radius: 50px;
    margin-left: auto;
}

.system-update-batch-cancelled {
    font-size: 10px;
    line-height: 1;
    background-color: #007040;
    color: #ffffff;
    padding: 6px 9px;
    border-radius: 50px;
    margin-left: auto;
}

.system-update-batch-failed {
    font-size: 10px;
    line-height: 1;
    background-color: #f55d5d;
    color: #ffffff;
    padding: 6px 9px;
    border-radius: 50px;
    margin-left: auto;
}


.customer-details .f-14 {
    font-size: 14px !important;
    line-height: 1;
}

.customer-details p.mb0 {
    color: #3D3D3D;
    font-size: 12px;
}

.customer-details p + p {
    opacity: 0.5;
}

.waypoints-timeline > li > .waypoints-details {
    border-bottom: 1px solid #F1F1F1;
    padding-bottom: 10px;
}

span.drop-element {
    width: 23px;
    height: 23px;
    background-color: #515151;
    border-radius: 50%;
    color: #ffffff;
    margin-right: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    line-height: 18px;
    position: relative;
}


.task-details-asidebar .task-details-header {
    padding-left: 10px;
}

.waypoints-info::before {
    content: '';
    position: absolute;
    border-left: 1px dashed rgb(127 127 127 / 50%);
    height: 12px;
    top: 100%;
    left: 10px;
    z-index: -1;
}

.task-driver-detail-wrapper h4 {
    font-size: 14px;
    line-height: 1;
    margin: 14px 0;
}

.driver-details .mt.pull-left.w-100per {
    margin-top: 8px !important;
}

.task-details-asidebar .task-details-header, .task-details-asidebar .task-details-body {
    padding: 10px 10px 10px 20px;
    background-color: #ffffff;
}

.task-details-asidebar .task-details-header {
    padding-left: 11px;
}

.driver-details p i {
    color: #000000;
}

.driver-details p + p {
    margin-top: 3px;
}

.view-more-time-wrap span.text-red small.text-muted {
    display: block;
}

.toggle-bar-driver-detail.task-asidebar-close {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.detail-driver-work-list-top {
    display: flex;
    align-items: center;
}

.detail-driver-name {
    display: flex;
    align-items: center;
    font-size: 14px;
    line-height: 19px;
    color: #000000;
}

    .detail-driver-name span {
        white-space: nowrap;
        text-overflow: ellipsis;
        max-width: 165px;
        overflow: hidden;
    }

.detail-driver-work-list-top .more-option {
    color: #ffffff;
    font-size: 12px;
    line-height: 1;
    margin-left: auto;
}

.driver-name-wrapbox {
    width: calc(100% - 52px - 66px);
}

    .driver-name-wrapbox span {
        max-width: 110px;
    }

.detail-driver-name .driver-img.knowmore_driver {
    min-width: 42px;
    height: 42px;
    background-color: #8D8D8D;
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ffffff;
    margin-right: 10px;
}

.detail-driver-work-list-middle {
    padding: 0 5px;
    margin: 15px 0;
}

    .detail-driver-work-list-middle ul {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        margin: 0 -5px;
    }

        .detail-driver-work-list-middle ul > li {
            width: 50%;
            padding: 0 5px;
        }

            .detail-driver-work-list-middle ul > li p {
                color: #ffffff;
                margin-bottom: 0;
                font-size: 12px;
                line-height: 1;
                display: flex;
                align-items: center;
            }

            .detail-driver-work-list-middle ul > li:nth-child(n + 3) {
                margin-top: 13px;
            }

.detail-drive-work-list-last .task-header-button {
    border-radius: 5px;
    max-width: calc(100% - 87px);
}

.detail-drive-work-list-last {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .detail-drive-work-list-last select {
        font-size: 12px;
        line-height: 1;
        appearance: none;
        padding: 10px;
        border-radius: 5px;
        height: 35px;
        background-color: #EC4B22;
        border: 1px solid #ffffff;
        color: #ffffff;
        text-align: center;
    }

        .detail-drive-work-list-last select option:nth-child(2) {
            background-color: #1B4BE6;
        }

        .detail-drive-work-list-last select option:nth-child(3) {
            background-color: #1FB500;
        }

        .detail-drive-work-list-last select option:nth-child(1) {
            background-color: #EC4B22;
        }

.task-info-details-navigations a {
    font-size: 20px;
    line-height: 1;
}

.task-info-details-navigations .fa-times::before {
    content: "X";
    font-family: cursive;
}

.task-info-details-next-prev-wrap {
    max-width: 40px;
}

    .task-info-details-next-prev-wrap a {
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #F6F6F6;
        color: #000000;
    }

    .task-info-details-next-prev-wrap span {
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #F6F6F6;
        color: #000000;
    }

.task-info-details-navigations {
    left: 100%;
    position: absolute;
    width: 36px;
    height: 30px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #2196F3;
    top: 20px;
    right: -36px;
    cursor: pointer;
    color: #ffffff;
    font-weight: bold;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}

.task-main-detail {
    margin-left: 0px;
}

    .task-main-detail .task-list-header {
        padding: 15px 15px;
        background-color: #4D6FCC;
    }


.task-get-waypoint-status {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

    .task-get-waypoint-status p {
        font-size: 14px;
        line-height: 1.2;
        color: #ffffff;
        margin-bottom: 0;
    }

.order--numner, .order--location--name {
    font-size: 14px;
    line-height: 1.3;
    font-weight: 500;
    color: #ffffff;
    margin-bottom: 10px;
}

.order-icon--text {
    display: flex;
    align-items: center;
    font-size: 12px;
    line-height: 1.3;
    color: #ffffff;
    margin-bottom: 5px;
}

.order-icon--location {
    width: 11px;
    margin-right: 5px;
}

.task-get-page .task-list-header {
    padding: 10px 13px 7px;
}

.task-get-page-details {
    padding: 15px 13px 15px;
    background-color: #ffffff;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: calc(100vh - 145px - 56px);
}

    .task-get-page-details ul {
        padding: 0;
        margin: 0;
        list-style: none;
    }

    .task-get-page-details li {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

.task-get-title {
    font-size: 13px;
    line-height: 1.3;
    color: #3D5AA9;
    max-width: 200px;
    margin-bottom: 5px;
}

.task-info-details-section {
    border-left: 0.5px solid rgba(112, 112, 112, 0.1);
}

.task-get-image img {
    display: block;
    border: 1px solid #A9A9A9;
    border-radius: 3px;
}

.task-get-image {
    width: 100%;
    margin-top: 10px;
}

.task-get-desc {
    font-size: 12px;
    line-height: 1.2;
    color: #3D3D3D;
    max-width: 250px;
    text-align: left;
    font-weight: 600;
}

.mt-20 {
    margin-top: 20px;
}

.mt-10 {
    margin-top: 10px;
}

.task-get-page-details table {
    width: 100%;
}

    .task-get-page-details table th, .task-get-page-details table td {
        background-color: #F6F6F6;
        color: #3D5AA9;
        font-size: 13px;
        line-height: 1;
        padding: 10px;
        font-weight: lighter;
    }

    .task-get-page-details table td, .task-get-page-details table th {
        border: 1px solid #A9A9A9;
    }

    .task-get-page-details table td {
        color: #2D3336;
        background-color: #ffffff;
    }

.task-get-page-details hr {
    border-color: rgba(112, 112, 112, 0.18);
    margin: 10px 0;
}

.waypoints-timeline > li.batch-completed::before {
    border-color: #1CA200;
}

.waypoints-timeline > li.batch-inprogress::before {
    border-color: #ff8f2b;
}

.waypoints-timeline > li.batch-onhold::before {
    border-color: #5d85f5;
}

.waypoints-timeline > li.batch-cancelled::before {
    border-color: #007040;
}

.waypoints-timeline > li.batch-failed::before {
    border-color: #f55d5d;
}

.batch-completed {
    color: #1CA200;
}

.batch-inprogress {
    color: #ff8f2b;
    font-size: smaller;
}

.batch-onhold {
    color: #5d85f5;
    font-size: smaller;
}

.batch-cancelled {
    color: #007040;
    font-size: smaller;
}

.batch-failed {
    color: #f55d5d;
    font-size: smaller;
}


.contact-driver-details:hover, .contact-driver-details.active {
    background-color: #c9e4ff;
}

.detail-driver-work-list-middle ul > li p img {
    max-height: 14px;
    max-width: 10px;
    margin-right: 3px;
}

.delivery-map-options {
    padding-left: 0px !important;
}

.delivery-map-active {
    background-color: #415fa5;
    color: white;
}

.delivery-detail-order {
    padding: 0;
    font-size: 12px;
    line-height: 1.2;
    color: #000000;
}

.delivery-detail-show {
    padding: 0px 0px 0px 0px;
    border-radius: 0px;
    height: 20px;
    margin: 0px 0px 0px 0px;
    position: relative;
    transition: height 0.5s;
    -webkit-transition: height 0.5s;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    line-height: normal;
    outline: 0 none;
    text-decoration: none;
    text-transform: uppercase;
}

    .delivery-detail-show:hover {
        overflow: visible;
        white-space: normal;
        height: auto;
    }

.task-cart p.mb0.f-12.fw-500 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .task-cart p.mb0.f-12.fw-500 .task-status {
        margin-left: auto;
    }

    .task-cart p.mb0.f-12.fw-500 .material-icons {
        margin-right: 5px;
    }

.task-driver-count {
    font-size: 11px;
    padding: 0 0 0 0;
}


/*-- New Theme --*/
a:focus, a:hover {
    text-decoration: none;
}

.task-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 8px 8px 8px;
}

    .task-header h4 {
        font-size: 18px;
        line-height: 1.3;
        color: rgba(0, 0, 0, 0.7);
        margin: 0;
    }

.task-options-wrap {
    display: flex;
    align-items: center;
}

    .task-options-wrap > a, .task-options-wrap .btn-group > a {
        align-items: center;
        width: 30px;
        height: 30px;
        display: inline-flex;
        border: 1px solid rgba(112, 112, 112, 0.2);
        border-radius: 50%;
        justify-content: center;
        color: rgba(0, 0, 0, 0.3);
    }

        .task-options-wrap > a + a, .task-options-wrap > a + div, .task-options-wrap > a + div + div {
            margin-left: 6px;
        }

.task-datetime-picker-wrap {
    width: 100%;
    border: 0;
    background-color: #F3FAFF;
    display: flex;
    align-items: center;
    padding: 8px 16px 9px 20px;
}

    .task-datetime-picker-wrap .filter-datetime {
        font-size: 14px;
        line-height: 1.2;
        color: #415FA5;
    }

    .task-datetime-picker-wrap i {
        color: #415FA5;
        opacity: 0.5;
        margin-right: 10px;
    }

.all-task-list-box {
    padding: 6px 10px 6px 14px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: 0.3s all ease-in-out;
    position: relative;
}

.all--task--list--footer-wrap .task-status-pill {
    margin-bottom: 0;
}

.status-pill-wrap {
    position: absolute;
    left: calc(100% - 86px);
    bottom: -3px;
    z-index: 9;
}

.all-task-list-box.active, all-task-list-box:hover {
    background-color: rgba(33, 150,243, 0.1);
}

.all-task-list-title {
    display: flex;
    align-items: center;
    position: relative;
    justify-content: space-between;
}

    .all-task-list-title h2 {
        margin: 0;
        font-family: 'CircularStd-Black';
        font-size: 14px;
        line-height: 1.3;
        color: rgba(0, 0, 0, 0.7);
        margin-right: auto;
        max-width: 110px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }

    .all-task-list-title h3 {
        margin: 0;
        font-size: 13px;
        line-height: 1.3;
        color: rgba(0, 0, 0, 0.7);
        margin-right: auto;
        /*max-width: 110px;*/
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }


.task-main-list .all-task-list-title h2 {
    max-width: 167px;
}

.task-status-pill {
    font-size: 9px;
    line-height: 1.2;
    color: #FFFFFF;
    background-color: #2196F3;
    /*text-transform: uppercase;*/
    padding: 5px 15px;
    display: inline-block;
    border-radius: 50px;
}

.all-task-info-detail p .pull-right {
    margin-left: 10px;
    color: red;
}

.task-info-link {
    align-items: center;
    width: 30px;
    height: 30px;
    display: inline-flex;
    border: 1px solid rgba(112, 112, 112, 0.2);
    border-radius: 50%;
    justify-content: center;
    color: rgba(0, 0, 0, 0.3);
    padding-right: 0;
}

.task-status-pill.task-completed {
    background-color: #2CCB8B;
}

.task-status-pill.task-pending {
    background-color: #FF8F2B;
}

.task-status-pill.task-assigned {
    background-color: #415FA5;
}

.task-status-pill.task-onhand {
    background-color: #5d85f5;
}

.task-status-pill.task-running {
    background-color: #f55d5d;
}

.task-status-pill.task-cancelled {
    background-color: #007040;
}

.task-status-pill.task-unassigned {
    background-color: #999fa5;
}

.task-status-pill.task-scheduled {
    background-color: #a829cf;
}

.task-status-pill.task-deleted {
    background-color: #8c5454;
}

.task-status-pill.task-failed {
    background-color: #f55d5d;
}


.all-task-info-detail {
    padding: 0;
    margin: 0;
    list-style: none;
    margin-top: 7px;
    position: relative;
}

    .all-task-info-detail li {
        font-size: 11px;
        line-height: 1.5;
        color: rgba(0, 0, 0, 0.7);
    }

        .all-task-info-detail li i {
            color: #415FA5;
            opacity: 0.5;
            width: 16px;
            height: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 5px;
        }

        .all-task-info-detail li img {
            margin-right: 5px;
        }

        .all-task-info-detail li p {
            margin: 0;
            display: flex;
            align-items: center;
        }

        .all-task-info-detail li + li {
            margin-top: 5px;
            z-index: 0;
        }

        .all-task-info-detail li span {
            color: #415FA5;
            margin-right: 5px;
            max-width: 200px;
            overflow: hidden;
            /*white-space: nowrap;*/
            text-overflow: ellipsis;
            font-size: 11px !important;
        }

        .all-task-info-detail li p label {
            margin-bottom: 0;
        }

.detail-title-header {
    padding: 10px 15px 10px 19px;
    background-color: #ffffff;
}

    .detail-title-header .all-task-list-title .task-options-wrap {
        margin-left: 10px;
    }

.detail-task-wrap {
    background-color: #FFFFFF;
}

.detail-tab-link {
    background-color: #F3FAFF;
}

    .detail-tab-link ul {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        align-items: center;
    }

    .detail-tab-link a {
        font-size: 14px;
        line-height: 1.3;
        font-weight: bold;
        color: rgba(0, 0, 0, 0.5);
        padding: 10px 10px;
        display: block;
        border-bottom: 2px solid transparent;
    }

    .detail-tab-link li {
        width: 50%;
        text-align: center;
    }

    .detail-tab-link a.active {
        color: #2196F3;
        border-bottom-color: #2196F3;
    }

.task-status-duration-wrap {
    padding: 6px 18px 1px;
    text-align: center;
}

    .task-status-duration-wrap .progress {
        margin-bottom: 8px;
        background-color: #F1F1F1;
        height: 8px;
        border-radius: 80px;
        overflow: visible;
        max-width: 95%;
        margin-left: 5%;
    }

    .task-status-duration-wrap .progress-bar {
        background-color: #415FA5;
        position: relative;
        border-radius: 80px;
    }

div#taskFilter.detail-tab-link li a {
    padding: 0 2px 5px;
}

div#driverFilterWithTask.detail-tab-link li a {
    padding: 0 2px 5px;
}

.task-status-duration-wrap .progress-bar::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background-color: white;
    border: 6px solid #415FA5;
    border-radius: 50%;
}

.task-status-duration-wrap span {
    font-size: 14px;
    line-height: 1.3;
    color: rgba(0, 0, 0, 0.5);
    display: inline-block;
    margin-top: 4px;
}

.details-sidebar-info-wrap {
    padding: 4px 12px 20px 17px
}

    .details-sidebar-info-wrap .all-task-info-detail {
        margin: 0;
    }

        .details-sidebar-info-wrap .all-task-info-detail li {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

.way-point-halt-wrap {
    background-color: #F3FAFF;
    padding: 5px 18px;
    border-radius: 80px;
    margin-top: 10px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .way-point-halt-wrap span {
        font-size: 12px;
        line-height: 1.4;
        font-weight: bold;
        color: #415FA5;
    }

.routePoint-wrap span {
    font-size: 10px;
    line-height: 1.3;
    color: rgba(0, 0, 0, 0.7);
    display: inline-block;
}

.invert-img {
    transform: scaleX(-1);
}

.ligh-blue-box {
    background-color: #F3FAFF;
    padding: 15px 19px 13px 19px;
}

.elipsis-text {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


.padding-box-sidebar {
    padding: 9px 13px;
    background-color: #ffffff;
}

    .padding-box-sidebar m.all-task-info-detail {
        margin-top: 0;
    }

    .ligh-blue-box .all-task-info-detail, .padding-box-sidebar .all-task-info-detail {
        margin-top: 0;
    }

        .padding-box-sidebar .all-task-info-detail hr {
            margin-top: 10px;
            margin-bottom: 10px;
            border-color: #F1F1F1;
        }

.w-100 {
    width: 100%;
}

.price-table tbody tr:first-child {
    background-color: rgba(241, 241, 241, 0.45);
}

.price-table tbody tr th {
    padding: 4px 10px;
    font-size: 12px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 0.5);
    font-weight: normal;
}

.price-table tr {
    border-spacing: 10px;
}

.price-table td {
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.2;
    color: rgba(0, 0, 0, 0.7);
}

.price-table tbody tr td p {
    margin-bottom: 0;
}

.price-table tbody tr th:last-child {
    text-align: right;
}

.price-table tbody tr:last-child {
    background-color: #F3FAFF;
}

.price-table tbody tr td {
    padding-left: 10px;
    padding-right: 10px;
    font-weight: bold;
}

.list-style-qna {
    padding: 0;
    margin: 0;
    list-style: none;
    font-size: 11px;
    align-items: flex-end;
}

    .list-style-qna p {
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 11px;
        line-height: 1.2;
        color: rgba(0, 0, 0, 0.7);
        margin-bottom: 0;
    }

        .list-style-qna p img {
            margin-right: 3px;
            width: 16px;
            height: auto;
        }

    .list-style-qna li {
        /*border-top: 1px solid #F1F1F1;
        border-bottom: 1px solid #F1F1F1;*/
        padding: 10px 0;
    }

.overflowY-auto {
    overflow-y: auto;
    max-height: calc(100vh - 57px);
}

.image-grey-box {
    background-color: #F9F9F9;
    padding: 12px 30px;
}

.image-box + .image-box {
    margin-top: 20px;
}

.image-grey-box img {
    max-width: 100%;
    height: auto;
}

.flex-wrap {
    flex-wrap: wrap;
}

.batch-pill {
    font-size: 12px;
    line-height: 16px;
    color: rgba(0, 0, 0, 0.7);
    background-color: #F3FAFF;
    padding: 4px 9px;
    border-radius: 60px;
    border: 1px solid rgba(65, 95, 165, 0.1);
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.batch-pills-wrap {
    display: flex;
    flex-wrap: wrap;
    margin: 16px -3px 0;
}

.batch-pill span {
    height: 17px;
    background-color: #2CCB8B;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffffff;
    font-size: 10px;
    line-height: 1;
    margin-right: 3px;
    padding: 0 6px;
}

.batch-pill-col {
    padding: 3px;
}

.batch-pill img, .batch-pill i, .batch-pill span {
    margin-right: 3px;
}

.batch-pill i {
    color: #415FA5;
    opacity: 0.5;
}

.availibility-wrapper {
    font-size: 14px;
    line-height: 19px;
    color: #797D7F;
    opacity: 1.7;
    padding: 6px 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    max-width: calc(100% - 30px);
    margin: 0 auto;
}

.filter-btn.dropdown-toggle {
    position: relative;
    display: flex;
    align-items: center;
    border-radius: 10px !important;
    overflow: hidden;
}

button#poiCollaspeExpand {
    border-radius: 10px !important;
    overflow: hidden;
}

.filter-btn.dropdown-toggle .fa-angle-down {
    font-weight: bold;
}

.dropdownicon::after {
    content: "\f107";
    font-family: 'FontAwesome';
    margin-left: 5px;
}

.batch-pill label {
    margin-bottom: 0;
}

.all-task-info-detail li span.task-status-pill {
    color: #ffffff;
}

.task-header.toggleSearch input.txtSearchTask.task-search-filter {
    background-image: none;
}

.task-header.toggleSearch, .task-header.toggle-Search {
    position: relative;
}

    .task-header.toggleSearch .task-options-wrap, .task-header.toggle-Search .task-options-wrap {
        position: absolute;
        right: 23px;
        top: 50%;
        transform: translateY(-50%);
    }

    .detail-title-header.togglesearch .task-detail-search-wrapper.dummy-task-detail-search, .task-header.toggle-Search .task-list-search-wrapper.dummy-driver-search {
        max-width: 100%;
        border: 1px solid rgba(0, 0, 0, 0.33);
        border-radius: 80px;
        width: 100%;
        overflow: auto;
    }

    .detail-title-header.togglesearch .task-options-wrap, .task-header.toggle-Search .task-options-wrap {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
    }


    .detail-title-header.togglesearch .task-detail-search-wrapper.dummy-task-detail-search input, .task-header.toggle-Search .task-list-search-wrapper input.txtSearchTask.task-search-filter {
        border: 0;
        background-image: none;
    }

.detail-title-header.togglesearch .close-search-task-detail {
    align-items: center;
    width: 30px;
    height: 30px;
    display: inline-flex;
    border: 1px solid rgba(112, 112, 112, 0.2);
    border-radius: 50%;
    justify-content: center;
    color: rgba(0, 0, 0, 0.3);
    background-color: #ffffff;
    z-index: 1;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.task-header.toggleSearch .close-search-task, .task-header.toggle-Search .close-search-driver-search {
    align-items: center;
    width: 30px;
    height: 30px;
    display: inline-flex;
    border: 1px solid rgba(112, 112, 112, 0.2);
    border-radius: 50%;
    justify-content: center;
    color: rgba(0, 0, 0, 0.3);
    z-index: 1;
    background-color: #ffffff;
    top: 50%;
    transform: translateY(-50%);
    right: 23px;
    position: absolute;
}

.task-header.toggle-Search .task-options-wrap {
    right: 23px;
}

.routeSummaryPanel-delivery-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.routeSummaryPanel-box {
    line-height: 2;
}

    .routeSummaryPanel-box > div {
        display: block;
        line-height: 1.2;
        font-weight: bold;
    }

.opacity-50 {
    opacity: 0.5;
}

.white-boxShadow {
    padding: 10px 10px;
    border-radius: 4px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.30);
    margin-bottom: 10px;
}

.select-location-row {
    display: flex;
    flex-wrap: wrap;
}

    .select-location-row > div {
        padding: 0 15px;
    }

    .select-location-row label {
        font-weight: normal;
        margin-bottom: 0;
        font-size: 12px;
        line-height: 1;
    }

    .select-location-row .select2-selection.select2-selection--single {
        height: auto;
        font-size: 14px;
        line-height: 1;
        margin-top: 5px;
        font-weight: bold;
    }

    .select-location-row .timepickerControl {
        font-size: 14px;
        line-height: 1;
        padding: 4px 10px 4px 0;
        height: auto;
        margin-top: 5px;
        font-weight: bold;
        color: #000000;
    }

    .select-location-row .select2-selection.select2-selection--single span {
        color: #000000;
    }

.purple-primary-bttn {
    font-size: 14px;
    line-height: 1;
    padding: 10px 10px;
    background-color: #605dfd;
    display: inline-block;
    color: #ffffff;
    width: 100%;
    text-align: center;
    border-radius: 10px;
    transition: 0.3s all ease-in-out;
    border: 1px solid;
}

    .purple-primary-bttn:hover, .purple-primary-bttn:focus {
        background-color: transparent;
        color: #605dfd;
    }

.small-header .select-location-row label a small {
    color: #605dfd;
    font-weight: bold;
}

.select-location-row > div:nth-child(3) .form-group {
    margin-bottom: 0;
}

.location-hault-time {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.location-trip-status {
    margin-bottom: 5px;
    margin-top: 5px;
}

.location-time, .location-name, .location-hault-time {
    margin-bottom: 5px;
}

.location-time {
    display: inline;
}

.location-name {
    font-size: 14px;
    line-height: 1.4;
    font-weight: bold;
    opacity: 0.5;
}

.stoppage-trip {
    overflow: hidden;
    width: auto;
    height: 100%;
    padding: 0px 10px 0px 0px;
    position: relative;
}

.btn-group-vertical-map {
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    z-index: 9;
    right: 25px;
    top: 130px;
    box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.1);
}

.location-listing-round {
    width: 20px;
    height: 20px;
    background-color: #ffffff;
    border-radius: 50%;
    z-index: 2;
    color: #605dfd;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    position: relative;
    line-height: 1;
    border: 1px solid #605dfd;
    font-weight: bold;
    margin-top: 7px;
}

.location-listing-line {
    position: absolute;
    height: 100%;
    width: 1px;
    background-color: #605dfd;
    top: 0;
    z-index: 0;
    left: 9px;
}

#TripStoppageDetailSlimScroll .table > tbody > tr:first-child > td:nth-child(2) span, #TripStoppageDetailSlimScroll .table > tbody > tr:last-child > td:nth-child(2) span {
    opacity: 0;
}

#TripStoppageDetailSlimScroll .table > tbody > tr > td:nth-child(1) .location-listing-line {
    opacity: 0;
}

#TripStoppageDetailSlimScroll .table > tbody > tr:nth-child(2) > td:nth-child(2) span.location-listing-line {
    height: 50%;
    top: 50%;
}

#TripStoppageDetailSlimScroll .table > tbody > tr:nth-last-child(2) > td:nth-child(2) span.location-listing-line {
    height: 50%;
    bottom: 50%;
}

#TripStoppageDetailSlimScroll .table > tbody > tr > td:nth-child(2) {
    position: relative;
}

.white-boxShadow .ui-sortable-handle {
    position: relative;
}

.location-listing-round.location-start {
    border: 0;
    background-color: #605dfd;
    font-size: 0;
    line-height: 0;
}

.location-listing-round.location-end {
    border-radius: 0;
    font-size: 0;
    line-height: 0;
    background-color: #605dfd;
}

.white-boxShadow .ui-sortable tr:first-child .location-listing-line {
    height: 70%;
    top: auto;
    bottom: 0;
}

/*.white-boxShadow .ui-sortable tr:last-child .location-listing-line {
    height: 50%;
    top: 0;
    bottom: auto;
}*/
.dark-green-text {
    opacity: 1;
    color: #218258;
    font-weight: bold;
}

.dark-red-text {
    opacity: 1;
    color: #f52d05;
    font-weight: bold;
}

.btn-group-vertical-map button {
    width: 40px;
    height: 40px;
    font-size: 18px;
    line-height: 1;
}

.routeSummaryPanel-tripStoppage .checkbox label, .routeSummaryPanel-tripStoppage .radio label {
    line-height: 1.6;
}

.routeSummaryPanel-tripStoppage .checkbox, .routeSummaryPanel-tripStoppage .radio {
    line-height: 1.4;
}

.white-boxShadow .ui-sortable tr:first-child td {
    border-top: 0;
}

.white-boxShadow .ui-sortable tr td:nth-child(2) {
    vertical-align: top;
}

.print-bttn {
    border: 1px solid rgba(0, 0, 0, 0.2);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.task-filter-main .select2-selection.select2-selection--single {
    border-radius: 8px;
    box-shadow: 1px 1px 5px 0px rgb(255 255 255 / 20%) !important;
    /* padding: 10px 12px;*/
    height: auto;
}

.task-filter-main .select2.select2-container {
    width: 121px !important;
}

.task-filter-main {
    display: flex;
}

.select2-container--bootstrap .select2-dropdown {
    border: 0;
}

.select2-container--bootstrap .select2-results__option--highlighted[aria-selected] {
    background-color: #2196f3;
}

ul.select2-results__options::-webkit-scrollbar {
    width: 5px;
}

/* Track */
ul.select2-results__options::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
ul.select2-results__options::-webkit-scrollbar-thumb {
    background: #888;
}

    /* Handle on hover */
    ul.select2-results__options::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

body {
    overflow-x: hidden;
    overflow-y: auto;
}

.select2-container--bootstrap .select2-selection--single .select2-selection__placeholder {
    color: #333333;
    font-weight: 600;
}

.poiZoneMapViewSize {
    /*max-height: calc(100vh - 148px - 78px);*/
    max-height: calc(100vh - 110px);
    top: 0px;
}

.location-hault-time > div {
    width: 25%;
    text-align: center;
}

.location-hault-time .location-edit-wrap {
    text-align: right;
}

.location-hault-icon img {
    margin-right: 7px;
}

.location-hault-time > div:first-child {
    text-align: left;
}

.customtextbox_poizone_map {
    position: absolute;
    left: 23%;
    top: 15px;
}

.poiZoneMap_ViewSize {
    max-height: calc(100vh - 110px);
    top: 0px;
}

.task-progress-wrap {
    /*border: 1px solid #000000;*/
    width: 70px;
    text-align: center;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    /*border-radius: 80px;*/
    /*margin-right: 4px;*/
    margin: 0 0 0 52px;
}

.notification-pref-wrap > div {
    align-items: flex-end;
    display: flex;
}


.notification-pref-checkbox {
    margin: 20px 0 0;
}

    .notification-pref-checkbox .form-group {
        position: relative;
    }



    .notification-pref-checkbox input.control-material {
        padding-right: 20px;
        padding-left: 20px;
        border: 1px solid #c4c4c4;
    }

body .notification-pref-checkbox .select2-selection--multiple {
    max-height: 50px;
}

.notification-pref-checkbox .select2-container--bootstrap {
    border: 1px solid #c4c4c4;
}


.notification-pref-checkbox #CustomersPinLocationType + .select2-container--bootstrap {
    border: 0;
}

.notification-pref-checkbox .pull-right .lable_show_only:first-child {
    margin-left: 0;
}

.notification-pref-checkbox .pull-right {
    float: none !important;
}

    .notification-pref-checkbox .pull-right .lable_show_only {
        margin-bottom: 5px;
        display: inline-block;
        padding: 2px 6px;
        font-size: 9px;
        background-color: rgb(255, 248, 201);
        color: #000000;
        font-weight: bold;
    }

.align-items-center {
    align-items: center;
}

.all-task-info-detail li span.task-progress-wrap {
    margin-left: auto;
    margin-right: 0;
    width: auto;
}



/*Changes commented form new screen from UI designer*/

.beta-pills {
    display: inline-block;
    background-color: #ff63ae;
    color: #ffffff;
    padding: 4px 8px;
    border-radius: 50px;
    font-size: 8px;
    line-height: 1;
    position: absolute;
    top: 0;
    right: -6px;
}

.dashboardTabClick {
    position: relative;
}

ul.nav_tabs_custom1 > li.active > a .beta-pills {
    font-weight: normal;
}

.dataTables_paginate_custom ul.pagination li.paginate_button.previous > a, .dataTables_paginate_custom ul.pagination li.paginate_button.next > a {
    font-size: 0;
}

.task-list-header {
    padding: 25px 20px 15px;
}

.primarry-bttn {
    border: 1px solid #eef4fe;
    padding: 10px 14px;
    width: 75%;
    font-size: 17px;
    line-height: 1.4;
    color: #286ff5;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    border-radius: 4px;
    transition: 0.3s all ease;
    font-weight: 500;
}

    .primarry-bttn:hover {
        background-color: #eef4fe;
    }

    .primarry-bttn i, .primarry-bttn svg {
        min-width: 20px;
        border-right: 0px solid rgba(0, 0, 0, 0.5);
        margin-right: 15px;
    }

.big-button-wrap {
    padding: 0 40px;
}

    .big-button-wrap .primarry-bttn {
        width: 100%;
    }

    .big-button-wrap .form-group {
        margin: 25px 0;
    }

.padding-wrapper {
    padding: 0px 30px;
}

.task-sidebar-section h3 {
    font-size: 20px;
    line-height: 1.2;
    margin: 0;
}

.task-sidebar-section .select-listing-wrap td, .task-sidebar-section .select-listing-wrap th {
    border: 0;
}

    .task-sidebar-section .select-listing-wrap td.w-10per {
        padding: 0;
    }

.task-sidebar-section .select-listing-wrap tr > th:first-child {
    padding-left: 0;
}

.rounded-bttn {
    background-color: #ffffff;
    color: #000000;
    font-weight: 600;
    padding: 14px 64px;
    display: inline-block;
    border-radius: 60px;
    font-size: 16px;
    line-height: 1;
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transition: 0.3s all ease;
}

    .rounded-bttn:hover {
        box-shadow: none;
        color: #000000;
    }

.radioRow .c-radio {
    margin-bottom: 0;
}

.c-checkbox span:before, .c-radio span:before {
    right: 1px;
    top: 1px;
}

.task-detail-tab-widget input, .task-detail-tab-widget textarea {
    padding: 5px 10px;
    border-radius: 6px;
    outline: 0;
    border: 1px solid rgba(0, 0, 0, 0.2);
}

.title-link-wrap {
    justify-content: space-between;
}

.blue-text-link {
    font-weight: bold;
    cursor: pointer;
}

.border-0 {
    border: 0;
}

.search-wrap {
    position: relative;
}

    .search-wrap input {
        width: 100%;
        padding: 8px 35px;
        font-size: 16px;
        line-height: 1;
    }

    .search-wrap i {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 10px;
        font-size: 14px;
        line-height: 1;
        color: rgba(0, 0, 0, 0.3);
    }

.border-bttn-icon {
    font-size: 12px;
    line-height: 1;
    border: 1px solid rgba(0, 0, 0, 0.2);
    padding: 8px 14px;
    display: inline-block;
    border-radius: 50px;
    cursor: pointer;
    transition: 0.3s all ease;
}

    .border-bttn-icon i {
        margin-right: 6px;
    }

    .border-bttn-icon:hover {
        background-color: rgba(0, 0, 0, 0.1);
    }

.location-box {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
}

    .location-box + .location-box {
        margin-top: 20px;
    }

.location-left {
    max-width: 200px;
}

.location-wrapper {
    border-left: 2px solid #2196F3;
    padding-left: 20px;
    position: relative;
    margin-left: 10px;
}

.location-icon {
    position: absolute;
    left: -32px;
    font-size: 20px;
    line-height: 1;
    width: 24px;
    height: 24px;
    background-color: #ffffff;
    color: #2196F3;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
}

    .location-icon.location-text {
        font-size: 13px;
        line-height: 1;
        font-weight: bold;
    }

.route-planning-wrap {
    margin: 20px 0;
}

    .route-planning-wrap.table > tbody > tr > td {
        border: 0;
        padding: 0;
    }

.driver-info-wrap {
    display: flex;
    align-items: center;
    padding: 10px 0;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-left: 0;
    border-right: 0;
}

.driver-info-left i {
    width: 24px;
    height: 24px;
    border: 1px solid #2196F3;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2196F3;
}

.driver-info-right {
    max-width: calc(100% - 40px);
    margin-left: auto;
    width: 100%;
}

    .driver-info-right input[type="text"] {
        border: 0;
        padding: 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.2);
        width: 100%;
        font-weight: bold;
    }

    .driver-info-right p {
        margin: 8px 0 4px;
    }

.dropdown-task-menu li {
    border-radius: 0;
}

.btn-group-more .dropdown-task-menu {
    border-radius: 0;
    top: 70%;
    min-width: auto;
    margin: 0;
    right: 20px;
}

/*.dropdown-task-menu li a {
    border-radius: 0;
    padding: 6px 13px;
    display: inline-block;
    font-size: 14px;
    line-height: 1;
    cursor:pointer;
}*/
.two-input-group input + input {
    margin-top: 5px;
}


.right-Scroll .dashboardTabClick:focus .beta-pills, .right-Scroll .dashboardTabClick:hover .beta-pills {
    font-weight: normal;
}

*/


.school-dash-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.school-dash-icon {
    width: 40px;
    height: 40px;
    background-color: #3f51b5;
    border-radius: 10px;
    display: inline-block;
}

    .school-dash-icon img {
        width: 100%;
        height: auto;
        padding: 9px;
    }

.light-red-bg {
    background-color: #ffdbe2;
}

.light-green-bg {
    background-color: #efffd6;
}

.light-purple-bg {
    background-color: #f1e4ff;
}

.light-orange-bg {
    background-color: #ffe7d1;
}

.school-dash-content {
    margin-left: 14px;
    display: inline-block;
}

td.school-dash-content {
    display: block;
    margin-left: 0;
}

.school-dash-content h5 {
    margin: 0;
    font-size: 16px;
    line-height: 1.4;
    color: #000000;
}

.school-dash-content .label-widget-dash {
    font-size: 20px;
    line-height: 1;
    padding: 0;
    color: #000000;
    margin-top: 5px;
    display: inline-block;
    font-weight: bold;
}

.text-f-pink .label-widget-dash {
    color: #FC6180;
}

.school-dash-widgettbl .fa-ellipsis-v {
    font-size: 16px;
    line-height: 1;
    color: #000;
}

.asidebar-menu > ul > li > a {
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    width: auto;
    height: auto;
    border-radius: 0;
    padding: 15px 6px !important;
}

.aside-collapsed .wrapper > .aside, .aside-collapsed .wrapper > .aside > .aside-inner {
    width: 80px;
}

.aside-collapsed .wrapper > footer, .aside-collapsed .wrapper > section {
    padding-left: 80px !important;
}

.asidebar-menu > ul > li > a img {
    display: block;
}

.asidebar-menu > ul > li > a span {
    font-size: 12px;
    line-height: 1;
    margin-top: 10px;
    font-weight: 800;
    color: #000;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mapViewBoxTitleWrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 15px;
}

    .mapViewBoxTitleWrap h4 {
        margin: 0;
    }


.activity-drop-commute {
    border: 1px solid rgba(0, 0, 0, 0.2);
    background-color: transparent;
    font-size: 14px;
    line-height: 1;
    padding: 8px 18px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


.activity-drop {
    border: 1px solid rgba(0, 0, 0, 0.2);
    background-color: transparent;
    font-size: 14px;
    line-height: 1;
    padding: 8px 18px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .activity-drop i {
        margin-left: 6px;
        font-size: 20px;
        line-height: 0.4;
        color: purple;
    }

    .activity-drop i {
        margin-left: 6px;
        font-size: 20px;
        line-height: 0.4;
        color: purple;
    }

.mapViewBoxTitleWrap .dropdown-menu {
    border-radius: 8px;
    padding: 0;
    right: 0;
    left: auto;
    overflow: hidden;
    margin: 0;
}

    .mapViewBoxTitleWrap .dropdown-menu .dropdown-item {
        display: block;
        padding: 10px;
        color: #000;
        transition: 0.3s all ease;
    }

        .mapViewBoxTitleWrap .dropdown-menu .dropdown-item:hover {
            background-color: rgba(190, 190, 190, 0.6);
        }

.tripOverviewBox {
    padding: 15px;
    display: flex;
    align-items: center;
}

.tripOverviewBox_Commute {
    padding: 5px;
    display: flex;
    align-items: center;
}

.tripOverview_Icon {
    max-width: 40px;
    min-width: 40px;
    height: 40px;
    border: 1.5px solid rgba(0, 0, 0, 0.52);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .tripOverview_Icon img {
        padding: 8px;
        max-width: 100%;
        height: auto;
    }

.tripOverview_time.start_taskTrip {
    background-color: rgba(0, 128, 0, 0.3);
    color: rgba(0, 128, 0, 0.7);
}

.tripOverview_time.end_taskTrip {
    background-color: rgba(0, 149, 255, 0.15);
    color: rgba(0, 149, 255, 0.5);
    font-weight: bold;
}

.tripOverview_Content {
    width: calc(100% - 140px);
    margin: 0 20px;
}

    .tripOverview_Content h4 span {
        font-weight: bold;
        display: inline-block;
    }


.tripOverview_Content_Commute {
    width: calc(100% - 140px);
    margin: 0 6px;
}

    .tripOverview_Content_Commute h4 span {
        font-weight: bold;
        display: inline-block;
    }

.tripOverview_time {
    background-color: #d4d4d4;
    padding: 5px 8px;
    border-radius: 15px;
}

.mapViewBoxTitleWrap h4 img {
    margin-right: 7px;
    max-width: 20px;
    height: auto;
}

.mapViewBoxTitleWrap h4 {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
}

.zoomDropdown .dropdown-menu {
    border-radius: 8px;
    padding: 0;
    overflow: hidden;
    margin: 0;
}

.zoomDropdown.dropdown.open .dropdown-menu {
    bottom: 100%;
    top: auto;
}

.exportExcelIcon-commute img {
    width: 22px;
    height: auto;
    margin-left: 8px;
}

.exportExcelIcon img {
    width: 30px;
    height: auto;
    margin-left: 17px;
}

.zoomDropdown .dropdown-menu .dropdown-item {
    display: block;
    padding: 10px;
    color: #000;
    transition: 0.3s all ease;
    line-height: 1;
}

.tripOverview_Content h4 {
    margin-bottom: 5px;
}

.tripOverview_Content p {
    margin-bottom: 0 !important;
}

.trip_view_mapBox #tripViewMap ul {
    margin-bottom: 0 !important;
}

h2.mainTitleStyle span {
    font-size: 22px;
    font-weight: bold;
}

.subTitle {
    font-size: 17px;
    line-height: 1;
    font-weight: bold;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    color: #1135cf;
}

h4.TitleSubPoint {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
    opacity: 0.6;
}

body .c-checkbox-circle-widget span:before {
    top: 0.6px;
    left: -1px;
    font-size: 9px;
}

.pac-container {
    padding: 8px 0px;
}

.pac-item {
    padding: 4px 10px 9px 10px;
    border: 1px solid transparent;
    cursor: pointer;
    border-bottom: 1px solid rgba(231, 236, 244, 0.3);
}

    .pac-item .pac-icon-marker::before {
        content: "\f041";
        background: none;
        font-family: 'FontAwesome';
        font-size: 16px;
        line-height: 1.2;
        color: #cccccc;
    }

    .pac-item .pac-icon-marker {
        background: none;
        display: inline-flex;
        line-height: 1;
    }

    .pac-item span:nth-child(3) {
        display: block;
        padding-left: 22px;
        line-height: 1;
        margin-top: -5px;
        opacity: 0.5;
    }

    .pac-item .pac-item-query {
        line-height: 1;
        display: inline-block;
    }

    .pac-item:hover {
        background-color: #f4f6fa;
    }

body .hdpi.pac-logo:after {
    display: none;
}

.pac-item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.task-list-footer-wrap {
    margin: 0 auto;
    width: 100%;
    position: fixed;
    bottom: 0;
    max-width: 375px;
    padding: 20px 24px;
    background-color: #ffffff;
}

    .task-list-footer-wrap ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

.bottomNavStyelink {
    font-size: 16px;
    line-height: 1;
    color: #4a5874;
    display: flex;
    align-items: center;
}

    .bottomNavStyelink:hover {
        color: #4a5874;
    }

    .bottomNavStyelink i {
        width: 25px;
    }

.task-list-footer-wrap li + li {
    margin-top: 20px;
}

.route-screen-section {
    min-height: calc(100vh - 56px);
    padding: 10px 10px 10px;
}

.no-wrap {
    flex-wrap: nowrap !important;
}

.customRow {
    display: flex;
    flex-wrap: wrap;
}

.justify-content-center {
    justify-content: center;
}

.route-title-wrap h3 {
    margin: 0;
    font-size: 24px;
    line-height: 1;
    color: #4a5874;
    font-weight: normal;
}

.justify-content-between {
    justify-content: space-between;
}

/*.align-items-center {
    align-items: center;
}*/

.customDate-wrap input {
    border: 1px solid #dce2ee;
    padding: 6px 8px;
    font-size: 16px;
    line-height: 1;
    border-radius: 4px;
}

.bottomNavStyelink svg {
    margin-right: 15px;
}

.white-radius-card {
    background-color: #ffffff;
    border-radius: 6px;
    border: 1px solid rgb(141 156 185 / 30%);
    box-shadow: rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 10%) 0px 1px 3px 0px, rgb(0 0 0 / 6%) 0px 1px 2px 0px;
}

.routes-footer {
    width: 100%;
    padding: 17px 16px;
    background-color: #f4f6fa;
    border-top: 1px solid rgb(141 156 185 / 30%);
    display: flex;
    align-items: center;
    color: #8d9cb9;
    font-size: 15px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

    .routes-footer svg {
        margin-right: 8px;
    }

.routes-left {
    padding: 16px;
    width: calc(100% - 50px);
}

.routes-right {
    padding: 16px 0;
    width: 50px;
    text-align: center;
}

.routes-left-right-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.routes-left h5 {
    margin: 0;
    font-size: 24px;
    line-height: 1.2;
    color: #141a27;
    font-weight: 500;
}

.routes-badges-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

.routes-badge.route-selected {
    background-color: #f4f6fa;
}

.routes-badge {
    background-color: transparent;
    border: 1px solid #f4f6fa;
    font-size: 14px;
    line-height: 1;
    padding: 5px 7px;
    border-radius: 4px;
    margin-top: 8px;
    display: flex;
    align-items: center;
    color: #4a5874;
}

    .routes-badge + .routes-badge {
        margin-left: 8px;
    }

.info-bttn {
    color: #8d9cb9;
    display: flex;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

    .info-bttn:hover {
        background-color: #e7ecf4;
        border-radius: 50%;
        color: #8d9cb9;
    }

.routes-badge svg {
    margin-right: 5px;
}

.routes-badge span {
    margin-left: 5px;
}

.route-title-wrap {
    margin-bottom: 16px;
}

.white-radius-card + .white-radius-card {
    margin-top: 12px;
}

.gettingStartedSection {
    margin-top: 56px;
}

.routes-icon-first-content {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.routes-left-icon {
    width: 24px;
}

.routes-left-content {
    width: calc(100% - 24px);
    padding-left: 16px;
}

    .routes-left-content h6 {
        margin: 0;
        font-size: 17px;
        line-height: 1.2;
        color: #141a27;
        margin-bottom: 5px;
        font-weight: 500;
    }

    .routes-left-content p {
        margin: 0;
        font-size: 15px;
        line-height: 1.2;
        color: #8d9cb9;
    }

.routes-left-icon svg {
    color: #8d9cb9;
}

.routes-right .dropdown-menu, .planTitleSection___Styledmain_right .dropdown-menu {
    padding: 8px;
}

    .routes-right .dropdown-menu li a, .planTitleSection___Styledmain_right .dropdown-menu li a {
        padding: 12px 8px;
        color: #141a27;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

        .routes-right .dropdown-menu li a svg, .planTitleSection___Styledmain_right .dropdown-menu li a svg {
            color: #8d9cb9;
            margin-right: 8px;
            width: 16px;
            height: 16px;
        }

.customCardTask .panel-heading, .customCardTask .panel-body.p-body {
    padding: 20px !important;
}

.customCardTask .panel-body.p-body {
    padding-left: 59px !important;
    padding-top: 10px !important;
}

.customCardTask .em-icon {
    padding-right: 20px;
}


.routerSidebarTitle {
    display: flex;
    align-items: center;
    padding: 10px 15px 10px 5px;
    font-size: 22px;
    line-height: 1;
    color: #141a27;
}

    .routerSidebarTitle span {
        font-size: 30px;
        line-height: 1.2;
    }

.routeButton {
    font-size: 15px;
    line-height: 1.2;
    background-color: #286ff5;
    color: #ffffff;
    display: inline-block;
    padding: 12px 21px;
    border-radius: 4px;
    font-weight: 500;
    cursor: pointer;
}

    .routeButton:hover {
        background-color: #286ff5;
        color: #ffffff;
    }

.routerSidebarSearch {
    margin-bottom: 30px;
    padding: 0 24px;
}

    .routerSidebarSearch input[type="text"] {
        width: 100%;
        font-size: 15px;
        line-height: 1;
        padding: 9px 13px;
    }

.butonTableInfo {
    padding: 0;
    border: 0;
    font-size: 0;
    line-height: 1;
    background-color: transparent;
    display: inline-block;
    vertical-align: middle;
    color: #8d9cb9;
}

.task-detail-tab-widget .padding-wrapper {
    padding: 0;
}

.customRouterTabel thead {
    background-color: #f4f6fa;
    padding: 0;
    width: 100%;
    align-items: center;
}

.customRouterTabel .w-40per {
    width: 100%;
}

table.customRouterTabel {
    display: flex;
    flex-wrap: wrap;
}

.customRouterTabel.table > tbody > tr > td, .customRouterTabel.table > thead > tr > th {
    padding: 10px 8px;
}

.customRouterTabel tr:hover {
    background-color: #f4f6fa;
}

.customRouterTabel .w-40per {
    width: calc(100% - 13% - 36px);
    border: 0;
}

.customRouterTabel tr {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    padding: 0 24px;
}

    .customRouterTabel tr .w-10per {
        width: 13%;
        border: 0;
    }

.customRouterTabel tbody {
    width: 100%;
}

.customRouterTabel thead th, .customRouterTabel td.btn-group.btn-group-more {
    border: 0;
}

.customRouterTabel .text-boldlight1 {
    color: #000000;
    font-weight: 600;
}



.optimizeRoute_screen {
    display: flex;
    flex-wrap: wrap;
}

    .optimizeRoute_screen .task-sidebar-section {
        width: 375px;
        position: fixed;
        padding-bottom: 90px;
        height: 100%;
    }

    .optimizeRoute_screen .task-map-section {
        width: calc(100% - 400px);
        margin-left: 376px;
    }

.routes-right.dropdown.open .dropdown-menu {
    left: auto;
    right: 0;
    top: 80%;
}

.limit-text-wrap {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.px-24 {
    padding: 0 24px;
}

.planTitleSection__DateButton {
    font-size: 16px;
    line-height: 1;
    background-color: transparent;
    border: 0;
    padding: 0;
    color: #8d9cb9;
}

.planTitleSection___Styledmain {
    display: flex;
    flex-wrap: wrap;
}

.planTitleSection___Styledmain_right {
    width: 40px;
    height: auto;
}

    .planTitleSection___Styledmain_right > a {
        padding: 0;
        border: 0;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: transparent;
        color: #8d9cb9;
        border-radius: 50%;
    }

        .planTitleSection___Styledmain_right > a.info-bttn {
            width: 30px;
            height: 30px;
        }

.planTitleSection___Styledmain_left {
    width: calc(100% - 40px);
}

    .planTitleSection___Styledmain_left input {
        width: 100%;
        height: auto;
        border: 0;
        padding: 0;
        font-size: 20px;
        line-height: 1;
        color: #4a5874;
        font-weight: 550;
        border-bottom: 1px solid transparent;
        border-radius: 0;
        transition: 0.3s all ease;
    }

        .planTitleSection___Styledmain_left input:hover, .planTitleSection___Styledmain_left input:focus {
            border-bottom-color: #286ff5;
        }

.planTitleSection___Styledmain_right > button:hover {
    background-color: #e7ecf4;
}

.driverListMain_title_wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
}

    .driverListMain_title_wrap h2 {
        margin: 0;
        font-size: 24px;
        line-height: 1.2;
        color: #141a27;
        font-weight: 550;
        margin: 0 0 5px;
    }

    .driverListMain_title_wrap p {
        font-size: 16px;
        line-height: 1.4;
        color: #8d9cb9;
        margin: 0;
    }

    .driverListMain_title_wrap + .adddriverListMain_button_wrap {
        margin-top: 5px;
    }

.driver_stops_module_wrap small span {
    color: #a1a1a1;
}

.driverListMain_title_wrap .infobox-speed-widget {
    padding: 6px 7px;
    font-size: 12px;
    line-height: 1;
    background-color: #d7d7d7;
    border: 0;
    color: #a1a1a1;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.addBig_radius_blue_bttn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dce2ee;
    background-color: transparent;
    font-size: 12px;
    line-height: 1.2;
    color: #286ff5;
    padding: 8px 10px;
    border-radius: 4px;
    transition: 0.3s all ease;
}

.w-auto {
    width: auto;
}

.addBig_radius_blue_bttn:hover {
    background-color: #eef4fe;
}

.blue_radius_bttn_icon svg {
    max-width: 20px;
    max-height: 20px;
    margin-right: 8px;
}

.addBig_radius_blue_bttn.blue_radius_bttntransparent {
    border-color: transparent;
}

.addBig_radius_blue_bttn.blue_radius_bttn_icon__solid {
    background-color: #286ff5;
    color: #fff;
}

.driver_stops_module_wrap {
    margin-top: 20px;
}

.search_icon_input_wrap input[type="text"] {
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg' class='SidebarAtoms___StyledSearch-sc-1fr9kbh-14 etYIMK'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.71 14H15.5L20.49 19L19 20.49L14 15.5V14.71L13.73 14.43C12.59 15.41 11.11 16 9.5 16C5.90997 16 3 13.09 3 9.5C3 5.90997 5.90997 3 9.5 3C13.09 3 16 5.90997 16 9.5C16 11.11 15.41 12.59 14.43 13.73L14.71 14ZM5 9.5C5 11.99 7.01001 14 9.5 14C11.99 14 14 11.99 14 9.5C14 7.01001 11.99 5 9.5 5C7.01001 5 5 7.01001 5 9.5Z' fill='currentColor'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center left 14px;
    padding: 12px 13px 12px 42px;
}

#tblReOrderServerSide_wrapper .next a, #tblReOrderServerSide_wrapper .previous a {
    font-size: 14px;
}

#tblReOrderServerSide_wrapper .view-pager .next a, #tblReOrderServerSide_wrapper .view-pager .previous a {
    font-size: 0;
}

.track-minisidebar .aside-inner .school_sidebar_submenu {
    position: absolute;
    top: 0;
    left: 100%;
}


.panel-footer-fixed-section {
    padding: 10px 25px !important;
}

.aside-collapsed.layout-fixed .panel-footer.footer-button {
    padding: 0px 95px !important;
}

    .aside-collapsed.layout-fixed .panel-footer.footer-button .p-body {
        border: 0px !important;
    }


/*-- --*/
.circle_percent {
    font-size: 120px;
    width: 1.5em;
    height: 1.5em;
    position: relative;
    background: #eee;
    border-radius: 50%;
    overflow: hidden;
    display: inline-block;
    margin: 0;
}

.circle_inner {
    position: absolute;
    left: 0;
    top: 0;
    width: 1.5em;
    height: 1.5em;
    clip: rect(0 1.5em 1.5em 0.75em);
}

.round_per {
    position: absolute;
    left: 0;
    top: 0;
    width: 1.5em;
    height: 1.5em;
    background: #ff8100;
    clip: rect(0 1.5em 1.5em 0.75em);
    transform: rotate( 180deg);
    transition: 1.05s;
}

.circle_inbox {
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    background: #fff;
    z-index: 3;
    border-radius: 50%;
}

    .circle_inbox .percent_text {
        position: absolute;
        font-size: 14px;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        z-index: 3;
        text-align: center;
        width: 100%;
        margin-bottom: 0;
    }

        .circle_inbox .percent_text span {
            display: block;
            font-size: 30px;
            line-height: 1.2;
            font-weight: bold;
        }

.tabbingWrap_data .nav.nav-tabs {
    border: 0;
}

.tabbingWrap_data li {
    margin: 0;
}

.tabbingWrap_data .nav > li > a {
    border-radius: 70px;
    background-color: #3f51b5;
    color: #ffffff;
    font-size: 14px;
    line-height: 1;
    padding: 12px 20px;
    border: 1px solid #3f51b5;
    transition: 0.3s all ease-in-out;
}

.tabbingWrap_data .nav > li + li {
    margin-left: 10px;
}

.tabbingWrap_data .nav > li.active > a, .tabbingWrap_data .nav > li > a:hover, .tabbingWrap_data .nav > li > a:focus {
    background-color: transparent;
    color: #3f51b5;
}

.perCentageWithingRound_wrap ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    background-color: #e6e6e6;
    margin-top: 6px;
    max-width: 180px;
}

    .perCentageWithingRound_wrap ul li {
        width: 100%;
    }

    .perCentageWithingRound_wrap ul p {
        margin: 0;
        font-size: 14px;
        line-height: 1.2;
        padding: 10px 13px;
    }

.tabbingWrap_leftData {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.tabbingWrap_data .tab-content {
    padding: 0;
    border: 0;
    margin-top: 20px;
}

.perCentageWithingRound_wrap {
    margin-right: 20px;
}


/*-- Dashboard --*/
.taskAnalyti_status_box {
    background-color: #ccd3f8;
    padding: 15px;
    border-radius: 10px;
    height: 100%;
}

.taskAnalyti_status_box_title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

    .taskAnalyti_status_box_title img {
        max-width: 22px;
        max-height: 22px;
        margin-right: 10px;
    }

    .taskAnalyti_status_box_title h4 {
        font-size: 15px;
        line-height: 1.2;
        font-weight: 600;
        margin: 0;
    }

.taskAnalyti_status_box_mid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
}

.taskAnalyti_status_box_mid_left h4 {
    font-size: 30px !important;
    line-height: 1;
    font-weight: 600;
}

.taskAnalyti_status_box_footer span {
    font-size: 14px;
    line-height: 1;
}

.taskAnalyticsRow > div:nth-child(n + 8) {
    margin-top: 20px;
}

.taskAnalyti_status_white_box {
    background-color: #ffffff;
    padding: 20px 30px;
    border-radius: 10px;
    box-shadow: 0 10px 10px -5px rgb(0 0 0 / 10%);
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    border: 1px solid rgba(58, 63, 81, 0.2);
}

    .taskAnalyti_status_white_box > div {
        width: 100%;
    }

.taskAnalyti_status_white_box_top i {
    font-size: 26px;
    line-height: 1;
}

.taskAnalyti_status_white_box_mid h4 {
    font-size: 30px;
    line-height: 1;
    font-weight: 600;
    color: red;
    margin: 20px 0 5px;
}

.taskAnalyti_status_white_box_footer h4 {
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
    color: #505050;
    font-weight: 500;
}

.taskAnalyti_status_box_mid_right .progress {
    margin: 0;
    border: 0;
    margin-bottom: 0;
    background-color: transparent;
    width: 80px;
    height: 80px;
    position: relative;
    text-align: center;
}

    .taskAnalyti_status_box_mid_right .progress path.track {
        stroke: rgb(186, 234, 196);
        fill: rgba(0, 0, 0, 0);
        stroke-width: 5px;
        transform: rotate( 90deg)translate(0px, -80px);
    }

    .taskAnalyti_status_box_mid_right .progress path.fill {
        fill: rgba(0, 0, 0, 0);
        stroke-width: 5px;
        transform: rotate( 90deg)translate(0px, -80px);
        stroke-dasharray: 219.99078369140625;
        stroke-dashoffset: -259.990784;
        transition: stroke-dashoffset 1s;
        stroke: rgb(104, 214, 198);
    }

    .taskAnalyti_status_box_mid_right .progress .value {
        text-align: center;
        text-anchor: middle;
        font-size: 20px;
        line-height: 1;
        font-weight: bold;
    }

.taskAnalyticsRow {
    display: flex;
    flex-wrap: wrap;
}

.taskAnalyti_status_box.bg-lightgreen {
    background-color: #d2ffdb;
}

    .taskAnalyti_status_box.bg-lightgreen .progress path.track {
        stroke: rgb(186, 234, 196);
    }

    .taskAnalyti_status_box.bg-lightgreen .progress path.fill {
        stroke: rgb(104, 214, 198);
    }

.taskAnalyti_status_box.bg-lightgreen {
    background-color: #d2ffdb;
}

    .taskAnalyti_status_box.bg-lightgreen .progress path.track {
        stroke: rgb(186, 234, 196);
    }

    .taskAnalyti_status_box.bg-lightgreen .progress path.fill {
        stroke: rgb(104, 214, 198);
    }

.taskAnalyti_status_box.bg-lightpurple {
    background-color: #ccd3f8;
}

    .taskAnalyti_status_box.bg-lightpurple .progress path.track {
        stroke: #c2c2ff;
    }

    .taskAnalyti_status_box.bg-lightpurple .progress path.fill {
        stroke: #8b8bff;
    }

.taskAnalyti_status_box.bg-lightblue {
    background-color: #dbecfd;
}

    .taskAnalyti_status_box.bg-lightblue .progress path.track {
        stroke: rgb(187, 221, 255);
    }


    .taskAnalyti_status_box.bg-lightblue .progress path.fill {
        stroke: #74baff;
    }

.taskAnalyti_status_box.bg-lightred {
    background-color: #ffd3d3;
}

    .taskAnalyti_status_box.bg-lightred .progress path.track {
        stroke: #ffe1e1;
    }

    .taskAnalyti_status_box.bg-lightred .progress path.fill {
        stroke: #fe8f8f;
    }

.taskAnalyti_status_box.bg-lightyellow {
    background-color: #ffffd3;
}

    .taskAnalyti_status_box.bg-lightyellow .progress path.fill {
        stroke: #fac000;
    }

    .taskAnalyti_status_box.bg-lightyellow .progress path.track {
        stroke: #ffe3b5;
    }

.taskAnalyti_status_box.bg-lightorange {
    background-color: #ffdfa4;
}

    .taskAnalyti_status_box.bg-lightorange .progress path.track {
        stroke: #ffebc6;
    }

    .taskAnalyti_status_box.bg-lightorange .progress path.fill {
        stroke: #ffc965;
    }

.bg-white-padding-radius {
    background-color: #fff;
    box-shadow: 5px 5px 20px rgb(0 0 0 / 10%);
    padding: 20px;
    border-radius: 20px;
}

.taskAnalyticsSection .delivery-map {
    height: 300px;
}

.taskAnalyticsSection {
    padding-bottom: 30px;
}

.loading_time_weight_left_img_box_wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

    .loading_time_weight_left_img_box_wrap .image img {
        max-width: 40px;
        max-height: 40px;
    }

    .loading_time_weight_left_img_box_wrap .content {
        text-align: center;
        margin-left: 20px;
    }

        .loading_time_weight_left_img_box_wrap .content h3 {
            font-size: 23px;
            line-height: 1.2;
            margin: 0 0 2px;
            color: #ff9900;
        }

        .loading_time_weight_left_img_box_wrap .content p {
            margin: 0;
            font-size: 16px;
            line-height: 1.2;
            color: #6e6e6e;
            font-weight: bold;
        }

.loading_time_weight_left {
    border-right: 1px solid #acacac;
    max-width: 240px;
    width: 100%;
}

.loading_time_weight_right {
    width: 100%;
    max-width: calc(100% - 240px);
    padding-left: 40px;
}

.loading_time_weight_left_img_box_wrap + .loading_time_weight_left_img_box_wrap {
    margin-top: 30px;
}

.loading_time_weight_wrap {
    display: flex;
    align-items: center;
}

.loading_time_weight_right h4 {
    text-align: center;
    margin-top: 0;
}

}




.monitor_user_info_img img {
    height: 45px;
    width: 45px;
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
}

.monitorDelivery_user_info_img_name_wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-bottom: 20px;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.monitor_user_info_name h4 {
    margin: 0;
    font-size: 18px;
    line-height: 1.2;
    color: #000000;
    font-family: 'CircularStd-Black';
    max-width: 130px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.monitor_info_arrival_wrap {
    font-size: 12px;
    line-height: 1;
    color: rgba(0, 0, 0, 0.5);
    font-family: 'CircularStd-Black';
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
}

    .monitor_info_arrival_wrap b {
        font-size: 13px;
        color: #fff;
        font-family: 'CircularStd-Black';
        margin-left: auto;
        background-color: #1A73E8;
        padding: 8px 14px;
        line-height: 1;
        border-radius: 20px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 0;
    }

.monitor_info_contact_call {
    display: flex;
    flex-wrap: wrap;
    margin-left: auto;
    align-items: center;
}

.callBlackbttn {
    background-color: #000000;
    color: #ffffff;
    font-size: 12px;
    line-height: 1;
    padding: 8px 12px;
    display: inline-flex;
    align-items: center;
    border-radius: 21px;
}

    .callBlackbttn svg {
        margin-right: 5px;
    }

    .callBlackbttn:hover {
        background-color: #000;
        color: #fff;
    }

.whatsappIcon {
    width: 38px;
    height: 38px;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.monitor_info_contact_call a + a {
    margin-left: 10px;
}

.monitor_user_info_img {
    margin-right: 8px;
}


.monitorDelivey_footer {
    padding-top: 14px;
    margin-top: 17px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    text-align: right;
}

.monitorDelivery_steps_accordion_content + .monitorDelivery_steps_accordion_title {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.monitor_delivery_sliderBox img {
    max-width: 100%;
    height: auto;
}

.monitor_delivery_slider_wrap {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.refreshBttn {
    background-color: #000000;
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    line-height: 1;
    font-family: 'CircularStd-Black';
    color: #ffffff;
    padding: 9px 15px;
    border-radius: 70px;
}

    .refreshBttn:hover {
        background-color: #000000;
        color: #ffffff;
    }

    .refreshBttn svg {
        margin-right: 5px;
    }

.monitorDelivery_steps_accordion_title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 10px 0;
}

.monitorDelivery_steps_accordion_right {
    margin-left: auto;
}

.accordion-icon {
    width: 32px;
    height: 32px;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


.monitorDelivery_steps_accordion_left h4 {
    margin: 0;
    font-size: 18px;
    line-height: 1.2;
    color: #1A73E8;
    font-family: 'CircularStd-Black';
    margin-bottom: 3px;
}

.monitorDelivery_steps_accordion_left p {
    font-size: 13px;
    line-height: 1;
    margin: 0;
    color: rgba(0, 0, 0, 0.5);
    font-family: 'CircularStd-Black';
}

.monitorDelivery_steps_accordion_padding {
    padding: 15px 0;
}

.monitorDelivery_steps_li {
    padding-left: 28px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    position: relative;
}

    .monitorDelivery_steps_li p {
        width: 100%;
        margin: 0 0 3px;
        font-size: 14px;
        line-height: 1.4;
        color: #000000;
        font-family: 'CircularStd-book';
    }

    .monitorDelivery_steps_li.monitorDelivery_steps_progress {
        opacity: 0.5;
    }

    .monitorDelivery_steps_li + .monitorDelivery_steps_li {
        margin-top: 34px;
    }

    .monitorDelivery_steps_li span {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        font-size: 12px;
        line-height: 1.4;
        color: rgba(0, 0, 0, 0.5);
        font-family: 'CircularStd-Black';
        width: 100%;
    }

        .monitorDelivery_steps_li span svg {
            margin-right: 4px;
        }

    .monitorDelivery_steps_li::before {
        content: '';
        position: absolute;
        width: 14px;
        height: 14px;
        background-color: #FFFFFF;
        border: 3px solid #BEBEBE;
        border-radius: 50%;
        left: 0;
        top: 3px;
        z-index: 99;
    }

    .monitorDelivery_steps_li.monitorDelivery_steps_completed::before {
        border: 5px solid #2DB67E;
    }

    .monitorDelivery_steps_li.monitorDelivery_steps_completed::before {
        border: 5px solid #2DB67E;
    }

.monitorDelivery_steps_ul {
    position: relative;
}

    .monitorDelivery_steps_ul::before {
        content: '';
        position: absolute;
        left: 6px;
        top: 7px;
        border-left: 2px dashed #DFDFDF;
        width: 2px;
        height: calc(100% - 37px);
    }

.monitorDelivery_steps_li.monitorDelivery_steps_completed:after {
    content: '';
    position: absolute;
    left: 6px;
    top: 7px;
    border-left: 2px solid #2DB67E;
    width: 2px;
    height: 200%;
}

.monitorDelivery_steps_li.monitorDelivery_steps_progress::before {
    border-color: #000000;
}

.monitor_progress_bar_wrap {
    width: 100%;
    height: 10px;
    background-color: #EDEDED;
    border-radius: 21px;
    margin-top: 26px;
}

    .monitor_progress_bar_wrap .monitor_progress_bar_completed {
        background-color: #1A73E8;
        height: 100%;
        border-radius: 21px;
        position: relative;
        transition: 0.3s all ease;
    }

.monitor_progress_bar_completed svg {
    width: 30px;
    height: 30px;
    background-color: #1A73E8;
    border-radius: 50%;
    border: 2px solid #ffffff;
    padding: 6px;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    left: 0;
}

.lightGreenbutton, .lightGreenbutton:hover {
    font-size: 14px;
    line-height: 1;
    color: #000000;
    background-color: rgba(43, 175, 121, 0.1);
    display: inline-flex;
    align-items: center;
    padding: 11px 17px;
    border-radius: 50px;
    font-family: 'CircularStd-Black';
}

    .lightGreenbutton svg {
        margin-right: 5px;
    }

.monitorDelivery_steps_accordion_padding .lightGreenbutton {
    margin-left: 24px;
    margin-top: 15px;
}

.monitorDelivery_order_detail_head ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.monitorDelivery_order_detail_wrap {
    margin-top: 0;
}

.monitorDelivery_order_detail_head li {
    font-size: 14px;
    line-height: 22px;
    color: rgb(0 0 0 / 50%);
    font-family: 'CircularStd-Black';
}

    .monitorDelivery_order_detail_head li b {
        color: #000000;
        font-weight: normal;
    }

.cod-badge {
    font-size: 16px;
    line-height: 1;
    color: #2DB67E;
    background-color: rgb(45 182 126 / 10%);
    display: inline-block;
    padding: 6px 10px;
    border-radius: 50px;
    font-family: 'CircularStd-Book';
}

.monitorDelivery_order_detail_head li + li {
    margin-top: 10px;
}

.monitorDelivery_order_detail_head li .cod-badge {
    margin-left: 15px;
}

.monitorDelivery_order_detail_body {
    margin: 20px 0;
}

    .monitorDelivery_order_detail_body table {
        width: 100%;
    }

        .monitorDelivery_order_detail_body table td {
            font-size: 11px;
            line-height: 18px;
            color: rgb(0 0 0 / 50%);
            font-family: 'CircularStd-Black';
            padding: 8px 20px;
        }

        .monitorDelivery_order_detail_body table th {
            font-size: 14px;
            line-height: 20px;
            color: rgb(0 0 0 / 50%);
            font-family: 'CircularStd-Black';
            padding: 8px 20px;
        }

        .monitorDelivery_order_detail_body table tfoot td {
            color: #000;
        }

            .monitorDelivery_order_detail_body table tfoot td b {
                font-family: 'CircularStd-Black';
            }

        .monitorDelivery_order_detail_body table tr {
            border: 1px solid #EFEFEF;
        }

.monitorDelivery_delivery_detail_li {
    display: flex;
    flex-wrap: wrap;
}

.monitorDelivery_delivery_detail_left {
    width: 110px;
    font-size: 14px;
    line-height: 20px;
    color: rgb(0 0 0 / 50%);
    font-family: 'CircularStd-Black';
}

.monitorDelivery_delivery_detail_right {
    width: calc(100% - 110px);
}

    .monitorDelivery_delivery_detail_right p {
        font-size: 16px;
        line-height: 24px;
        color: #000;
        font-family: 'CircularStd-Black';
        margin: 0;
    }

.monitorDelivery_delivery_detail_li + .monitorDelivery_delivery_detail_li {
    margin-top: 25px;
}

.changeEdit {
    border: 2px solid rgb(0 0 0 / 10%);
    font-size: 14px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    padding: 9px 12.5px;
    border-radius: 50px;
    color: #000000;
}

.monitorDelivery_steps_accordion_title. .accordion-icon svg#more_horiz_black_24dp {
    display: block;
}

.monitorDelivery_steps_accordion_title.active .accordion-icon svg#more_horiz_black_24dp, .monitorDelivery_steps_accordion_title .accordion-icon svg#expand_more_black_24dp {
    display: none;
}

.monitorDelivery_steps_accordion_title.active .accordion-icon svg#expand_more_black_24dp {
    display: block;
}

.changeEdit svg {
    margin-right: 4px;
}

.monitorDelivery_delivery_detail_right address {
    margin: 4px 0 0;
    max-width: 190px;
    font-size: 14px;
    line-height: 18px;
    color: rgb(0 0 0 / 50%);
    font-family: 'CircularStd-Black';
}

.monitorDelivery_delivery_detail_right p a {
    color: #1A73E8;
}

    .monitorDelivery_delivery_detail_right p a.changeEdit {
        color: #000;
    }

body .headermonitorDelivery_section .navbar {
    box-shadow: 0px 0px 16px #0000001A;
    min-height: auto;
}

.headermonitorDelivery_wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: calc(100% - 380px);
    padding: 20px 30px 10px 15px;
}

.headermonitorDelivery_Left img {
    width: 100%;
    height: auto;
    max-width: 156px;
    max-height: 50px;
}



.headermonitorDelivery_Right ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.headermonitorDelivery_Right p {
    display: flex;
    align-items: center;
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-family: 'CircularStd-Black';
    color: rgba(0, 0, 0, 0.5);
}

    .headermonitorDelivery_Right p span {
        font-size: 16px !important;
        line-height: 30px;
        font-family: 'CircularStd-Black';
        color: #000;
        background-color: #F2F8FF;
        border: 2px solid #1A73E81A;
        padding: 1px 8px;
        display: inline-block;
        border-radius: 60px;
        margin-left: 10px;
    }

.monitorDeliveryScreen .track-task-tab {
    /*height: calc(100vh - 80px);*/
}

.monitorDeliveryScreen #MainContent {
    padding-top: 87px;
}

.monitorDeliveryScreen_row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

.bttNInfo_wrap {
    width: 32px;
    height: 32px;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.monitor_info_contact_call .dropdown {
    margin-left: 10px;
}

    .monitor_info_contact_call .dropdown .dropdown-menu {
        right: 0;
        left: auto;
        min-width: 128px;
        border-radius: 10px;
        background-color: #FFFFFF;
        padding: 0;
        top: 110%;
        border: 0;
        box-shadow: 0px 0px 32px #00000026;
    }

.dropdown-menu > li .bttNInfo_content {
    display: flex;
    align-items: center;
    padding: 12px 13px;
    font-size: 14px;
    line-height: 1.2;
    background-color: #fff;
}

    .dropdown-menu > li .bttNInfo_content svg {
        margin-right: 5px;
    }

.monitor_info_contact_call .dropdown .dropdown-menu::before {
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    background-color: white;
    bottom: calc(100% - 6px);
    right: 16px;
    transform: rotate(45deg);
    z-index: -5;
    box-shadow: 0px 0px 32px #00000026;
}

.monitor_info_contact_call .dropdown .dropdown-menu li:first-child {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    overflow: hidden;
}

.monitor_info_contact_call .dropdown .dropdown-menu li:last-child {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    overflow: hidden;
}

.monitorDeliveryScreen_right {
    width: 380px;
    background-color: #ffffff;
    box-shadow: 0px 0px 16px #0000001A;
    max-height: 100vh;
    overflow: auto;
    position: relative;
    z-index: 9999;
    padding: 18px 20px;
}

.monitorDeliveryScreen_left {
    max-width: calc(100% - 380px);
    width: 100%;
}

.monitorDeliveryScreen_right .custom-tab-content, div#gTrackTaskFleetMap, .monitorDeliveryScreen .track-task-tab > div {
    height: 100%;
}

.monitorDeliveryScreen_right .custom-tab-content {
    padding: 0;
}

.monitorDeliveryScreen_right_top_mobile_btn {
    display: none;
}

.monitorDelivery_steps_accordion_content, .monitorDelivery_steps_accordion_mobieView_bigbutton {
    display: none;
}

.monitorDelivery_user_info_wrap #CustomerAddress {
    min-height: calc(100vh - 100px);
    padding-top: 30px;
}

.buttonFromwrpa {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.buttonRadiusprim {
    background-color: #000000;
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    line-height: 1;
    font-family: 'CircularStd-Black';
    color: #ffffff;
    padding: 9px 16px;
    border-radius: 70px;
    border: 0;
    transition: 0.3s all ease-in-out;
}

    .buttonRadiusprim:hover {
        background-color: #aeaeae;
    }

.buttonFromwrpa .buttonRadiusprim + .buttonRadiusprim {
    margin-left: 10px;
}

.monitorDelivery_user_info_wrap #CustomerSignature {
    min-height: calc(100vh - 120px);
    padding-top: 20px;
}

#CustomerSignature .label-control {
    font-family: 'CircularStd-Black';
    font-style: normal;
}

.pac-container {
    z-index: 9999;
}

#CustomerFeedback {
    height: 100%;
    background-color: #f5f7fa;
}


@media (max-width:1400px) {
    .monitorDeliveryScreen_right {
        width: 400px;
    }

    .monitorDeliveryScreen_left, .headermonitorDelivery_wrap {
        max-width: calc(100% - 400px);
    }
}

@media (max-width:1199px) {
    .monitorDeliveryScreen_right {
        width: 350px;
    }

    .monitorDeliveryScreen_left, .headermonitorDelivery_wrap {
        max-width: calc(100% - 350px);
    }

    .headermonitorDelivery_Right p span {
        font-size: 20px;
        line-height: 1.4;
    }

    .monitor_info_contact_call {
        width: 100%;
        margin-top: 20px;
        justify-content: flex-end;
    }

    .monitorDeliveryScreen #MainContent {
        padding-top: 74px;
    }
}


@media (max-width:991px) {
    .monitorDeliveryScreen_left, .headermonitorDelivery_wrap {
        max-width: 100%;
    }


    .gTrackFleetMapSize {
        min-height: calc(100vh - 323px) !important;
    }

    .headermonitorDelivery_wrap {
        padding: 10px 0;
    }

    .monitorDeliveryScreen_right.monitorDeliveryScreen_right_open .track-content-section {
        max-height: 560px;
    }

    .monitorDeliveryScreen_right .custom-tab-content {
        height: auto !important;
        overflow: auto;
    }

    .monitorDeliveryScreen_right {
        width: 100%;
        position: absolute;
        top: 50vh;
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
        box-shadow: 0px 0px 16px #0000001a;
        overflow: visible;
        transition: 0.3s all ease-in-out;
        /*max-height: calc(100% - 60vh);*/
        height: 100%;
        max-height: 100%;
        /*overflow: auto;*/
    }

        .monitorDeliveryScreen_right .track-content-section {
            max-height: 280px;
            overflow: auto;
        }

    .monitorDeliveryScreen_row {
        position: relative;
        max-height: 100%;
        overflow: hidden;
        height: 100%;
    }

    .monitor_info_contact_call {
        width: auto;
        margin-top: 0;
    }

    .monitorDeliveryScreen_right_top_mobile_btn {
        display: block;
        width: 90px;
        margin: 0 auto;
        text-align: center;
        background-color: #ffffff;
        left: 0;
        right: 0;
        z-index: 99;
        position: absolute;
        transform: translateY(-127%);
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
        color: #292D32;
    }

    .monitorDeliveryScreen_right.monitorDeliveryScreen_right_open {
        top: 74px;
    }

    .monitorDeliveryScreen, .monitorDeliveryScreen_left, .monitorDeliveryScreen #MainContent {
        height: 100%;
    }

        .monitorDeliveryScreen .track-task-tab {
            /*height: calc(100% - 74px) !important;*/
        }

    .monitorDelivery_steps_accordion_mobieView {
        border-top: 1px solid rgba(0, 0, 0, 0.1);
        /*display: none;*/
    }

    .monitorDelivery_steps_accordion_mobieView_bigbutton {
        font-size: 14px;
        line-height: 1;
        color: #000000;
        border: 2px solid #000000;
        width: 280px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 80px;
        font-family: 'CircularStd-Black';
    }

    .monitorDelivery_steps_accordion_content, .monitorDelivery_steps_accordion_mobieView_bigbutton {
        display: block;
    }

    form#frmTask .row {
        margin: 0;
    }

        form#frmTask .row > div {
            padding: 0;
        }

    div#CustomerFeedback #MainContent {
        padding: 0;
    }

        div#CustomerFeedback #MainContent .customer-feedback-section {
            margin-top: 10px;
        }

            div#CustomerFeedback #MainContent .customer-feedback-section textarea {
                max-height: 20px;
            }

    div#CustomerFeedback .body {
        padding-top: 0;
    }

    div#CustomerFeedback .jqEmoji {
        font-size: 35px;
    }

    div#CustomerFeedback .form-group {
        margin-bottom: 15px;
    }
}

@media (max-width:575px) {

    .monitor_user_info_img img {
        width: 40px !important;
        height: 40px !important;
    }

    .monitor_user_info_name h4 {
        font-size: 16px;
    }

    .monitor_info_arrival_wrap {
        font-size: 12px;
    }

        .monitor_info_arrival_wrap b {
            font-size: 14px;
        }

    .monitorDeliveryScreen_right {
        padding: 19px 15px;
        top: 50vh;
        /*max-height: calc(100% - 50vh);*/
    }

    .monitor_user_info_img {
        margin-right: 10px;
    }

    .callBlackbttn {
        font-size: 12px;
        padding: 7px 14px;
    }

    .monitor_info_contact_call {
    }

    .whatsappIcon {
        width: 34px;
        height: 34px;
    }

    .monitor_info_contact_call a + a {
        margin-left: 5px;
    }

    .headermonitorDelivery_Left img {
        max-width: 104px;
    }

    .headermonitorDelivery_Right p {
        max-width: 160px;
        font-size: 12px;
        line-height: 14px;
    }

    .headermonitorDelivery_Left img {
        max-width: 104px;
    }

    .headermonitorDelivery_Right p {
        max-width: 160px;
        font-size: 12px;
        line-height: 14px;
    }

    .accordion-icon {
        width: 30px;
        height: 30px;
        padding: 5px;
    }

    .monitor_progress_bar_wrap {
        height: 5px;
    }

    .monitor_progress_bar_completed svg {
        width: 25px;
        height: 25px;
        padding: 3px;
    }

    .monitorDelivery_steps_li p {
        font-size: 14px;
    }

    .monitorDelivery_steps_li span {
        font-size: 12px;
    }

        .monitorDelivery_steps_li span svg {
            max-width: 14px;
            height: auto;
        }

    .lightGreenbutton, .lightGreenbutton:hover {
        font-size: 12px;
        padding: 9px 14px;
    }

        .lightGreenbutton svg {
            max-width: 14px;
            height: auto;
        }

    .monitorDelivery_order_detail_head li {
        font-size: 14px;
        line-height: 20px;
    }

        .monitorDelivery_order_detail_head li .cod-badge {
            margin-left: 10px;
        }

    .cod-badge {
        font-size: 12px;
        padding: 7px 8px;
    }

    .monitorDelivery_order_detail_body table th {
        font-size: 12px;
        line-height: 18px;
    }

    .monitorDelivery_order_detail_body table td {
        font-size: 14px;
        line-height: 18px;
    }

    .monitorDelivery_delivery_detail_left {
        font-size: 14px;
        line-height: 20px;
    }

    .monitorDelivery_delivery_detail_right p {
        font-size: 16px;
        line-height: 24px;
    }

    .changeEdit {
        font-size: 12px;
    }

        .changeEdit svg {
            max-width: 12px;
            height: auto;
        }

    .monitorDelivery_delivery_detail_right address {
        font-size: 14px;
        line-height: 18px;
    }

    .headermonitorDelivery_Left {
        max-width: calc(100% - 180px);
    }

        .headermonitorDelivery_Left h3 {
            font-size: 14px;
            margin: 0;
        }

    .monitorDelivery_user_info_img_name_wrap .monitor_user_info_name {
        max-width: calc(100% - 60px);
    }
}



@media (max-width:375px) {
}


.all--task--list--location-wrap1 ul {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
}


    .all--task--list--location-wrap1 ul li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        position: relative;
        padding-left: 15px;
    }

        .all--task--list--location-wrap1 ul li .taskLetter {
            position: absolute;
            left: 2.5px;
            z-index: 9;
            top: 1.2px;
            font-size: 13px;
            line-height: 1;
        }


/*New Task UI Contents*/

.all--task--list--location-wrap ul {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
}

    .all--task--list--location-wrap ul::before {
        content: '';
        position: absolute;
        height: 100%;
        width: 2px;
        border-left: 1px dashed rgba(127, 127, 127, 0.5);
        left: 5px;
        top: 1px;
    }

    .all--task--list--location-wrap ul li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        position: relative;
        padding-left: 15px;
    }

        .all--task--list--location-wrap ul li .taskLetter {
            position: absolute;
            left: 2.5px;
            z-index: 9;
            top: 1.2px;
            font-size: 8px;
            line-height: 1;
        }

        .all--task--list--location-wrap ul li::before {
            left: -2px;
            top: -3px;
            content: "";
            width: 15px;
            height: 15px;
            background: #ffffff;
            border-radius: 50%;
            position: absolute;
            font-size: 13px;
            line-height: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #ffffff;
            z-index: 1;
            border: 3px solid #999fa5;
        }
/*.all--task--list--location-wrap ul li:last-child::before {
            border-color: #32c787;
        }*/
.all--task--list--location-name--left h3, .all--task--list--location-name--left p {
    margin: 0;
    font-size: 11px;
    line-height: 1;
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    color: #415FA5;
    /*text-transform: uppercase;*/
    font-weight: normal;
}

.all--task--list--location-name--left h3 {
    margin-bottom: 5px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
/*.all--task--list--location-name--right .delayed-btn {
    margin-top: 15px;
}*/
.all--task--list--location-name--right {
    margin-left: auto;
    text-align: right;
}

.all--task--list--location-name--right1 {
    margin-left: auto;
    text-align: center;
}

.all--task--list--footer-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

    .all--task--list--footer-wrap h3 {
        font-size: 10px;
        line-height: 1;
        margin: 0;
        color: #415FA5;
        font-weight: normal;
        max-width: 165px;
    }

        .all--task--list--footer-wrap h3 span {
            color: rgba(65, 95, 165, 0.6);
        }

        .all--task--list--footer-wrap h3 i {
            margin-right: 7px;
            color: rgba(65, 95, 165, 0.6);
            font-weight: normal;
        }

.all--task-bttn-update {
    display: inline-block;
    font-size: 10px;
    line-height: 1;
    background-color: #ff8f2b;
    color: #fff;
    padding: 7px 12px;
    border-radius: 50px;
    border: 1px solid#ff8f2b;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

    .all--task-bttn-update.all--task-bttn-update-in-progress {
        background-color: #ff8f2b;
        border: 1px solid#ff8f2b;
    }

        .all--task-bttn-update.all--task-bttn-update-in-progress:hover {
            background-color: #ff871b;
            color: #ffffff;
        }

.all-task-list-title .stops--steps--wrap {
    margin-right: 3px;
    font-size: 11px;
    color: #415FA5;
}

.all--task--list--location-wrap {
    padding: 6px 0 3px;
    margin: 0px 0;
}

.all--task--list--footer-wrap a.pull-right {
    float: none !important;
    font-size: 11px;
    line-height: 1;
    margin-left: 4px;
    color: red;
}

.all--task--list--location-wrap ul li + li {
    margin-top: 8px;
}

.task-status-duration-wrap .all-task-info-detail {
    margin-bottom: 8px;
}

.all--task--list--location-name--left p {
    font-size: 9px;
    line-height: 1.3;
    color: rgba(0, 0, 0, 0.7);
    display: block;
}

.all--task--list--location-name--right time {
    width: 100%;
    display: block;
    font-size: 10px;
    line-height: 1.3;
    color: rgba(0, 0, 0, 0.7);
    display: inline-block;
}

.all--task--list--location-wrap ul li:last-child::after {
    content: '';
    position: absolute;
    height: calc(100% - 10px);
    width: 1px;
    background-color: #ffffff;
    left: 5px;
    bottom: -1px;
}

.delayed-btn {
    display: inline-block;
    font-size: 9px;
    line-height: 1;
    background-color: rgb(255 0 0 / 10%);
    color: #f00;
    padding: 1px 2px;
    border-radius: 50px;
    border: 1px solid rgb(255 0 0 / 10%);
}

    .delayed-btn i {
        margin-right: 5px;
    }

.all--task--list--location-name--left h3 .delayed-btn {
    margin-left: auto;
}

.delayed-btn:hover {
    background-color: rgb(255 0 0 / 10%);
    color: #f00;
}


.all--task--list--location-wrap ul li.completed::before {
    border-color: #1CA200;
}

.all--task--list--location-wrap ul li.inprogress::before {
    border-color: #ff8f2b;
}

.all--task--list--location-wrap ul li.onhold::before {
    border-color: #5d85f5;
}

.all--task--list--location-wrap ul li.cancelled::before {
    border-color: #007040;
}

.all--task--list--location-wrap ul li.failed::before {
    border-color: #f55d5d;
}



.task-subset-sidebar-section {
    background-color: #fff;
    box-shadow: 2px 4px 5px rgba(0, 0, 0, 0.27);
    height: calc(100vh - 58px);
    float: left;
    position: fixed;
    z-index: 5;
    margin-left: 377px;
    width: 285px;
    position: absolute;
}

.smallwhiteBox {
    padding-bottom: 60px !important;
}

    .smallwhiteBox .hpanel .panel-body {
        background-color: transparent;
        border: 0;
        padding: 0;
    }

    .smallwhiteBox .hpanel:first-child .panel-body {
        padding: 0;
    }

    .smallwhiteBox .smallwhiteBox-title h2 {
        font-size: 21px;
        margin: 0;
        line-height: 1.2;
    }

.smallwhiteBox-title h3, .smallwhiteBox-title label {
    font-size: 18px;
    margin: 0;
    line-height: 1;
}

.smallwhiteBox-title label {
    font-size: 16px;
}

.smallwhiteBox .smallwhiteBox-title p, .smallwhiteBox-title small {
    margin: 2px 0 0;
    color: #8d9cb9 !important;
    font-size: 14px;
    line-height: 1.4;
    display: block;
}

.smallwhiteBox .panel.panel-default.p-flat, .smallwhiteBox .panel.panel-default.p-flat > .panel-heading {
    background-color: transparent;
    border: 0;
    padding: 0;
}

.smallwhiteBox-title + .smallwhiteBox-title {
    margin-top: 20px;
}

.smallwhiteBox-title input.form-control {
    background-color: transparent;
    padding: 10px;
    font-size: 14px;
    line-height: 1;
    border: 1px solid #4a5874;
    color: #4a5874;
    border-radius: 6px;
    margin-top: 2px;
}

    .smallwhiteBox-title input.form-control::placeholder {
        color: #4a5874;
    }

.mt-5 {
    margin-top: 20px;
}

.footer-bttn-fixed {
    position: fixed;
    bottom: 0;
    left: 375px;
    right: 0;
    /*max-width: 1098px;*/
    background-color: #f5f7fa;
    padding: 10px 42px;
}

#btnBackFromScratch {
    height: auto;
    display: inline-block;
}

    #btnBackFromScratch svg {
        display: block;
    }

.input-group.group-material input#RoutePlanOn {
    border: 0;
    padding: 0;
    height: auto;
    font-size: 14px;
    line-height: 1;
}

.routeCalendername_title .input-group.group-material {
    display: inline-block;
    height: 22px;
}

.task-view-list-footer {
    position: fixed;
    bottom: 0;
    width: 279px;
    padding: 20px 15px;
    background: #ffffff;
}

.task-list-footer {
    position: fixed;
    bottom: 0;
    width: calc(100% - 30px);
    padding: 8px 15px;
    /*box-shadow: rgb(0 0 0 / 25%) 0px 25px 50px 0px;*/
    background-color: #ffffff;
    left: 15px;
}

    .task-list-footer .rounded-bttn {
        color: #ffffff;
        border-radius: 8px;
        background-color: #286ff5;
    }

.addstopsWrapnew {
    padding: 0 15px;
}

.pickupLocation-wrap label {
    margin: 0;
}

.addstopInput---wrap {
    margin: 10px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.filter-search-wrap {
    display: flex;
    flex-wrap: wrap;
    padding: 0 15px;
    margin: 10px 0;
}

.routerSidebarTitle #btnBackFromManageDriver {
    margin-right: 5px;
}

.filter-search-wrap select {
    display: none;
}

.filter-search-wrap span {
    display: inline-block;
}

.filter-search-wrap .routerSidebarSearch {
    padding: 0;
    margin: 0;
}

.filter-search-wrap span .select2-selection--single {
    padding: 10px 10px;
    height: 39px;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.filter-search-wrap > div {
    width: 30%;
}

.filter-search-wrap span.selection {
    width: 100%;
}

.filter-search-wrap .routerSidebarSearch input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.filter-search-wrap > div.routerSidebarSearch {
    width: 70%;
}

.addstopInput---wrap div:not(:last-child) {
    width: calc(100% - 80px);
}

div#tblReOrderServerSide_paginate {
    margin: 0;
    padding-top: 5px;
}

.monitor_user_info_img img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.contact-driver-details-center .detail-driver-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 200px;
}

.task-detail-tab-widget .padding-wrapper {
    max-height: calc(100vh - 160px);
    /*overflow: hidden;*/
    padding-bottom: 30px;
    height: auto !important;
}
/*.routePlan--get-wrap .task-list-body, .routePlan--get-wrap .task-list-body #tabDetail, .routePlan--get-wrap #DetailDev {
    height: 100%;
}*/
#DetailDiv {
    height: 100%;
}

    #DetailDiv .slimScrollDiv {
        height: 100% !important;
    }

.navbar {
    font-family: 'CircularStd-Book';
}

.driverListMain_title_wrap > .row {
    width: 100%;
    margin: 0;
}

#RoutePlanSelectedStopsSlimScroll {
    height: auto !important;
}

.padding-new--wrapper h3, #RoutePlanSubSetDiv .form-group h3 {
    font-size: 16px;
    line-height: 1.2;
    margin-top: 20px;
    padding: 0 15px;
}

.driverAll--details .close-task {
    position: absolute;
    right: -35px;
    top: 10px;
    font-size: 25px;
    line-height: 1;
    color: white;
    background-color: #2196F3;
    width: 35px;
    height: 30px;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.name-letters {
    font-size: 16px;
    line-height: 24px;
}

.routePlan--get-wrap .task-list-footer .rounded-bttn {
    background-color: #ff902b;
    padding: 10px 34px;
    font-size: 14px;
}

.routePlan--get-wrap small {
    color: #bebebe;
}

.routePlan--get-wrap .filter-search-wrap {
    margin-top: 0;
}

    .routePlan--get-wrap .filter-search-wrap input {
        font-size: 12px;
        line-height: 1;
    }

    .routePlan--get-wrap .filter-search-wrap span .select2-selection--single {
        padding: 6px 10px;
        height: auto;
    }

.routePlan--get-wrap .customRouterTabel .w-40per {
    width: calc(100% - 43px);
}

.routePlan--get-wrap .contact-driver-details .contact-driver-details-center {
    max-width: calc(100% - 49px);
}

    .routePlan--get-wrap .contact-driver-details .contact-driver-details-center .detail-driver-name {
        max-width: 100%;
        display: block;
    }

.addstopInput---wrap #existingPOIDiv {
    width: calc(100% - 70px);
    order: -1;
}

.padding-new--wrapper .table > tbody > tr > td {
    border: 0;
}

.padding-new--wrapper .table > tbody > tr > td {
    padding-top: 5px;
    padding-bottom: 5px;
}

.bordery-1 {
    border-top: 1px solid #dde6e9 !important;
    border-bottom: 1px solid #dde6e9 !important;
}

.padding-new--wrapper .bordery-1 {
    padding: 10px 15px !important;
}

.padding-new--wrapper .table > tbody > tr > td {
    padding-left: 15px;
    padding-right: 15px;
}

#tblDrivers {
    height: auto !important;
    max-height: calc(100vh - 300px);
}

div#SelectedStops .slimScrollDiv {
    height: auto !important;
    max-height: calc(100vh - 200px);
}

#tblPOIEdit > tbody > tr > td {
    background-color: transparent;
}

.contact-driver-details-center {
    flex-wrap: wrap;
}

    .contact-driver-details-center .detail-driver-name {
        width: 100%;
    }

.login_page .carousel-inner .item img {
    max-height: 410px;
    width: auto;
}

body .login_page_slider {
    width: 800px;
}

.mr-auto {
    margin-right: auto;
}

.label-count-badge-grey {
    padding: 6px 7px;
    font-size: 12px;
    line-height: 1;
    background-color: #d7d7d7;
    border: 0;
    color: #a1a1a1;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.row.gutter-0 {
    margin: 0;
}

.gutter-0 [class^="col"] {
    padding: 0;
}

.white-radius--row > div:first-child .white-radius-card {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0;
}

.white-radius--row > div:last-child .white-radius-card {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.getDataone-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    margin: 0;
}

.duty-wrap {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

    .duty-wrap .collapse {
        display: none;
        width: 100%;
    }

        .duty-wrap .collapse.in {
            display: flex;
            flex-wrap: wrap;
        }

    .duty-wrap .left h5 {
        margin: 0;
    }

    .duty-wrap .right {
        max-width: 70px;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

.detail-driver-name.custom-name-info-wrap {
    position: relative;
    z-index: 9;
}

.detail-driver-name.custom-name-info-wrap {
    width: 100%;
}

    .detail-driver-name.custom-name-info-wrap .driver-name-wrapbox {
        max-width: 140px;
    }

    .detail-driver-name.custom-name-info-wrap .task-options-wrap {
        margin-left: auto;
    }

    .detail-driver-name.custom-name-info-wrap .driver-name-wrapbox span {
        max-width: 100%;
        overflow: hidden;
        display: block;
    }

.duty-wrap a.fw-600 {
    margin-left: auto;
    margin-top: 10px;
}

.duty-wrap .left {
    width: calc(100% - 70px);
}


.text-overflow-audit-trail {
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 450px;
    overflow: hidden;
    display: block;
}

.routeSummaryPanel-trip {
    width: 100%;
    left: 50%;
    cursor: default;
    padding: 0px 16px;
    position: absolute;
    top: -8px;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

.StoppageMapDivTripView {
    margin-top: 40px !important;
}


.panel-trip-footer-fixed-section {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: -15px;
    z-index: 7;
    background-color: #fff;
}

panel-footer-trip {
    background-color: #fafafa;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.routeSummaryPanel-trip {
    width: 100%;
    left: 50%;
    cursor: default;
    padding: 0px 16px;
    position: absolute;
    top: -8px;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

.StoppageMapDivTripView {
    margin-top: 40px !important;
}


.panel-trip-footer-fixed-section {
    position: fixed;
    width: 100%;
    left: 0;
    bottom: -15px;
    z-index: 7;
    background-color: #fff;
}

panel-footer-trip {
    background-color: #fafafa;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}





.dropdown-task-menu-filter {
    border-radius: 20px;
    padding: 0px;
    overflow: hidden;
    border: 0;
}

    .dropdown-task-menu-filter li {
        border-radius: 0;
    }

.bluetheme-tab-list-wrap ul > li > a {
    background-color: #F3FAFF;
    color: rgba(65, 95, 165, 0.7);
    border: 0;
    text-align: center;
    font-size: 14px;
    line-height: 19px;
    height: auto;
    padding: 7px 15px;
    border-radius: 60px !important;
    font-weight: normal;
}

.bluetheme-tab-list-wrap ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

    .bluetheme-tab-list-wrap ul > li:last-child > a, .bluetheme-tab-list-wrap ul > li:first-child > a {
        border: 0;
    }

    .bluetheme-tab-list-wrap ul > li > a.active {
        background-color: #2196f3;
    }

    .bluetheme-tab-list-wrap ul > li {
        padding: 0 5px;
    }

.dropdown-task-menu-filter li.submenu-wrap {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.dropdown-menu-list-wrap > li {
    padding: 7px 8px;
}

.dropdown-task-menu-filter li.submenu-wrap > .submenu {
    position: absolute;
    left: 100%;
    padding: 0;
    list-style: none;
    background-color: white;
    top: 0;
    min-width: 140px;
    border-radius: 10px;
    overflow: hidden;
    transform: translateY(30px);
    transition: 0.3s all ease;
    opacity: 0;
    visibility: hidden;
}

.dropdown-task-menu-filter li.submenu-wrap:hover > .submenu {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

.dropdown-task-menu-filter li.submenu-wrap > .submenu a {
    width: 100%;
    display: block;
    padding: 8px 12px;
    cursor: pointer;
}

.dropdown-task-menu-filter li.submenu-wrap > .submenu li {
    padding: 0 !important;
}

.dropdown-menu-list-wrap {
    overflow: visible;
}

    .dropdown-menu-list-wrap > li:first-child {
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
    }

.route-setting-screen-section {
    min-height: calc(100vh - 56px);
}


span.active-driver-user {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #2CCB8B;
    border-radius: 50%;
    right: 115px;
    bottom: -1px;
    border: 2px solid #ffffff;
}

span.in-active-driver-user {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #FF8F2B;
    border-radius: 50%;
    right: 170px;
    bottom: -1px;
    border: 2px solid #ffffff;
}

.radioRow .contact-driver-details-left span.active-driver-user {
    left: 12px;
    right: auto;
}

.radioRow .contact-driver-details-left span.in-active-driver-user {
    left: 12px;
    right: auto;
}

#driverTaskList .detail-driver-work-list-info .task-options-wrap {
    top: 22px;
    right: 10px;
}

table#tblReOrderServerSide td.text-center img {
    margin-left: 10px;
}

div#poiZoneMapView {
    height: calc(100vh - 108px);
}

form#frmSubClient .panel-footer-fixed-section.panel-footer.footer-button .btn-lg {
    padding: 5px 16px !important;
}

form#frmSubClient .routeSummaryPanel-sub-client {
    height: 100%;
    padding: 8px 0;
}

[lang = "ar"] #OffsidebarDirection, [lang = "ar"] #OffsidebarNearby {
    right: -320px !important;
}

[lang = "ar"] .wrapper > section {
    margin-bottom: 0 !important;
}

[lang = "ar"] .aside-collapsed .wrapper > footer, [lang = "ar"] .aside-collapsed .wrapper > section {
    padding-left: 0 !important;
}

[lang = "ar"] .layout-h.asidebar .wrapper > section#MainContent {
    padding-left: 0 !important;
}


.optimize-process {
    padding: 6px 7px;
    font-size: 12px;
    line-height: .5;
    background-color: #d7d7d7;
    border: 0;
    color: #2196F3;
    border-radius: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.gray-radius-card {
    background-color: #f4f6fa;
    border-radius: 6px;
    border: 1px solid rgb(141 156 185 / 30%);
    box-shadow: rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 0%) 0px 0px 0px 0px, rgb(0 0 0 / 10%) 0px 1px 3px 0px, rgb(0 0 0 / 6%) 0px 1px 2px 0px;
}




#AssignedDiv table {
    margin: 0;
    border: 0;
}

/*#AssignedDiv table .driver-info-wrap {
    padding: 20px 10px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 10px;
}*/
.detail-tab-link + .tab-content {
    border: 0;
}

.driver-info-wrap {
    border: 0;
}

#AssignedDiv table .driver-info-wrap .driver-info-left {
    align-self: flex-start;
}

    #AssignedDiv table .driver-info-wrap .driver-info-left i::before {
        content: "\f111";
    }

div#OptimizeRouteDiv .detail-tab-link {
    margin-top: 10px;
}

div#OptimizeRouteDiv .mt-lg {
    margin-top: 5px !important;
}

.round-wrap-section, #tblUnAssougnedStops .driver-info-wrap {
    padding: 20px 10px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    margin-top: 20px;
}

    .round-wrap-section .location-wrapper {
        margin-top: 10px;
    }

div#AssignedDiv .location-left, div#AssignedDiv .location-right {
    font-size: 12px;
}

#tblUnAssougnedStops .driver-info-right {
    max-width: 100%;
}


.row-flex {
    display: flex;
    flex-wrap: wrap;
}

    .row-flex .col-md {
        width: 20%;
        padding: 0 15px;
    }

.image-box-wrap .image-box {
    background-color: white;
    width: 100%;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.image-box-wrap h5 {
    margin-top: 19px;
}

.row.row-flex {
    margin-bottom: 40px;
}

.modal-body.import-section {
    padding: 30px 30px;
}

.import-section .route-title-wrap h3 {
    font-size: 30px;
    line-height: 1.4;
    font-weight: bold;
    font-family: 'CircularStd-Black';
    margin-bottom: 20px;
}

.import-section .route-title-wrap h5 {
    margin-bottom: 30px;
    font-size: 16px;
    line-height: 1.4;
}

.modal-dialog .image-box-wrap .image-box {
    background-color: #ebebeb;
}

@media only screen and (max-width:1560px) {
    .navbar-nav > li > a {
        padding-left: 11px;
        padding-right: 11px;
    }

    .setup-menu {
        padding: 14px 30px !important;
    }

    .row.row-table.mt.text-right .col-xs-2.pr0 {
        padding-left: 10px;
    }
}



.advance-section {
    max-width: 92%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    padding: 7px 0;
}

    .advance-section .task-list-search-wrapper.dummy-task-search {
        max-width: calc(100% - 38px);
    }

    .advance-section .filter-wrap {
        width: 30px;
        height: 30px;
        border: 1px solid rgba(0, 0, 0, 0.33);
        margin-left: auto;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #3D3D3D;
    }

    .advance-section .task-list-search-wrapper.dummy-task-search input {
        padding: 6px 10px 6px 25px;
    }

.detail-tab-link#taskFilter li a {
    font-size: 10px;
}

.detail-tab-link#taskFilter li font span {
    font-size: 15px;
}

.detail-tab-link#driverFilterWithTask li a {
    font-size: 10px;
}

.detail-tab-link#driverFilterWithTask li font span {
    font-size: 15px;
}

#taskAuditTrailDiv .vtimeline .dummy-class {
    padding-right: 0;
}

    #taskAuditTrailDiv .vtimeline .dummy-class .row > span:last-child {
        float: right;
        text-align: right;
        font-size: 12px;
        line-height: 1;
        color: #5f79b3;
        margin-top: 5px;
    }



.kanban-top-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 10px;
}

    .kanban-top-title h2 {
        font-family: 'CircularStd-Black';
        font-size: 14px;
        line-height: 1.3;
        color: rgba(0, 0, 0, 0.7);
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        margin: 0;
        max-width: calc(100% - 40px);
    }

.kanban-stops--steps--wrap {
    font-size: 11px;
    color: #415FA5;
    margin-left: auto;
    display: flex;
    align-items: center;
}

    .kanban-stops--steps--wrap img {
        margin-right: 5px;
    }

.kanban-all--task--list--location-wrap > ul {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
}

#kanban-custom-scrollbar .kanban-all--task--list--location-wrap > ul > li {
    min-height: auto;
    height: auto;
    overflow: visible;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    position: relative;
    padding-left: 15px;
    width: 100%;
    float: none;
    background-color: transparent;
}

    #kanban-custom-scrollbar .kanban-all--task--list--location-wrap > ul > li.inprogress::before {
        border-color: #ff8f2b;
    }

.kanban-all--task--list--location-wrap > ul::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 2px;
    border-left: 1px dashed rgba(127, 127, 127, 0.5);
    left: 5px;
    top: 1px;
}

#kanban-custom-scrollbar .kanban-all--task--list--location-wrap > ul > li::before {
    left: -2px;
    top: -3px;
    content: "";
    width: 15px;
    height: 15px;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    font-size: 13px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    z-index: 1;
    border: 3px solid #999fa5;
}

#kanban-custom-scrollbar .kanban-all--task--list--location-wrap > ul > li .taskLetter {
    position: absolute;
    left: 2.5px;
    z-index: 9;
    top: 1.2px;
    font-size: 8px;
    line-height: 1;
}

.kanban-all--task--list--location-name--left {
    max-width: calc(100% - 58px);
}

    .kanban-all--task--list--location-name--left h3 {
        font-size: 11px;
        line-height: 1;
        max-width: 150px;
        white-space: nowrap;
        overflow: hidden;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        color: #415FA5;
        margin: 0;
        margin-bottom: 3px;
    }

#kanban-custom-scrollbar .kanban-all--task--list--location-wrap > ul > li + li {
    margin-top: 8px;
}

.kanban-all--task--list--location-name--left p {
    font-size: 9px;
    line-height: 1.3;
    color: rgba(0, 0, 0, 0.7);
    display: block;
    margin: 0;
    word-break: break-word;
    max-width: 191px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.kanban-all--task--list--location-name--right {
    margin-left: auto;
}

    .kanban-all--task--list--location-name--right time {
        font-size: 10px;
        line-height: 1.3;
        color: rgba(0, 0, 0, 0.7);
        white-space: nowrap;
        display: block;
    }

.kanban-all--task--list--footer-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

    .kanban-all--task--list--footer-wrap h3 {
        font-size: 10px;
        line-height: 1;
        margin: 0;
        color: #415FA5;
        font-weight: normal;
    }

        .kanban-all--task--list--footer-wrap h3 i {
            margin-right: 7px;
            color: rgba(65, 95, 165, 0.6);
            font-weight: normal;
        }

    .kanban-all--task--list--footer-wrap .task-status-pill {
        margin: 0;
        margin-left: auto;
    }

.hide-tab-device .setup-add {
    background-color: transparent;
}

li.have-submenu .dropdown-menu {
    min-width: auto;
}

.task-filter-map-option .filter-btn.dropdown-toggle {
    height: 29px;
    border-radius: 8px;
    padding: 0px 7px 0 7px !important;
}



.filter-dropdown-ul .dropdown-row {
    display: flex;
    flex-wrap: wrap;
    min-width: 480px;
    margin: 0 -10px;
}

    .filter-dropdown-ul .dropdown-row > div {
        padding: 0 10px;
    }

.map-mt.dropdown-menu.dropdown-task-menu.filter-dropdown-ul.map-mt {
    left: auto;
    right: 0;
    padding: 17px 20px;
    top: calc(100% + 6px);
    overflow: visible;
}

    .map-mt.dropdown-menu.dropdown-task-menu.filter-dropdown-ul.map-mt::before {
        content: '';
        position: absolute;
        top: -10px;
        right: 20px;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-bottom: 10px solid #fff;
    }

.dropdown-col {
    width: 50%;
}

.dropdown-col-full {
    width: 100%;
}

.dropdown-col-full {
    border-top: 1px solid rgb(0 0 0 / 20%);
}

    .dropdown-col-full .filter-dropdown-box {
        display: flex;
        flex-wrap: wrap;
        margin: 0 -10px;
    }

        .dropdown-col-full .filter-dropdown-box > div {
            width: 50%;
            padding: 0 10px;
        }

.filter-dropdown-ul .dropdown-row > div.dropdown-col:nth-child(even) {
    border-left: 1px solid rgb(0 0 0 / 20%);
}

.filter-dropdown-ul .dropdown-row > div.dropdown-col-full {
    padding-top: 10px;
    margin-top: 10px;
}

.filter-dropdown-ul .dropdown-row .bb {
    border: 0;
}

.filter-dropdown-box .c-radio input[type=radio]:checked + span:before {
    content: '';
    width: 10px;
    height: 10px;
    background-color: #5d9cec;
    border-radius: 50%;
    top: 4px;
    left: 3.5px;
}

.filter-dropdown-box .c-radio label, .filter-dropdown-box .switch-wrap-col {
    display: flex;
    align-items: center;
}

    .filter-dropdown-box .switch-wrap-col i {
        margin-right: 10px;
    }

        .filter-dropdown-box .switch-wrap-col i img {
            width: 22px;
            height: auto;
        }

    .filter-dropdown-box .c-radio label i {
        margin-left: auto;
        font-size: 20px;
        line-height: 1;
    }

    .filter-dropdown-box .switch-wrap-col i img {
        width: 22px;
        height: auto;
    }


.filter-dropdown-box .radio.c-radio i.border {
    border: 1px solid rgb(0 0 0 / 40%);
    padding: 2px;
    width: 26px;
    height: 26px;
}

    .filter-dropdown-box .radio.c-radio i.border img {
        width: 100%;
        height: auto;
        display: block;
    }

.filter-dropdown-box .switch-wrap-col .switch.pull-right {
    order: 1;
    margin: 0;
    margin-left: auto;
}

.filter-dropdown-box .c-radio {
    margin: 0;
}

.filter-dropdown-box .switch-wrap-col .switch.pull-right span.slider {
    margin-right: 0;
}




.dropdown-select-wrap .dropdown-select-submenu {
    margin: 0;
    padding: 0;
    list-style: none;
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    position: absolute;
    bottom: 100%;
    right: 0;
    display: none;
    background-color: #ffffff;
}

    .dropdown-select-wrap .dropdown-select-submenu a {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 12px;
        padding: 7px 26px 7px 16px;
        color: #000;
        white-space: nowrap;
        text-decoration: none;
        position: relative;
        transition: 0.3s all ease;
    }

        .dropdown-select-wrap .dropdown-select-submenu a:hover {
            background-color: #c9c9c9;
        }

.dropdown-select-wrap:hover .task-add-btn + .dropdown-select-submenu {
    display: block;
}

.dropdown-select-wrap .dropdown-select-submenu li + li {
    border-top: 1px solid rgb(61 61 61 / 10%);
}

.have-submenu > .multi-col-dropdown.dropdown > div:first-child::after {
    content: "\f107";
    font: normal normal normal 14px/1 FontAwesome;
    margin-left: 3px;
    font-weight: bold;
}

.nav.navbar-nav.top-header-navbar .setup-add {
    line-height: 22px;
    padding: 17px 21px 11px 21px;
}

.task-map-assigned-driver {
    margin: 0 0 0 30px !important;
    color: #FFFFFF;
    padding: 5px 5px;
    border-radius: 50px;
}

.monitor_info_contact_call .callBlackbttn {
    width: 32px;
    height: 32px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .monitor_info_contact_call .callBlackbttn svg {
        margin: 0;
    }

.monitorDelivery_delivery_detail_full {
    position: relative;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    width: 100%;
}

    .monitorDelivery_delivery_detail_full .changeEdit {
        width: 32px;
        height: 32px;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        right: 0;
        cursor: pointer;
    }

    .monitorDelivery_delivery_detail_full address {
        margin: 0;
        max-width: calc(100% - 50px);
        word-wrap: break-word;
        font-family: 'CircularStd-Book';
    }

.monitorDelivery_steps_accordion_left {
    max-width: calc(100% - 40px);
    width: 100%;
    position: relative;
}

    .monitorDelivery_steps_accordion_left p {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
    }

        .monitorDelivery_steps_accordion_left p span.cod-badge {
            margin-left: auto;
        }

form#frmTask label {
    font-family: 'CircularStd-Black';
}

form#frmTask input {
    font-family: 'CircularStd-Book';
}

.taskNew-box {
    padding: 8px 15px;
}

.taskNew-tripnm-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2px;
    position: relative;
    margin-left: -2px;
}

    .taskNew-tripnm-wrap h4 {
        font-weight: bold;
        font-size: 14px;
        line-height: 1.2;
        font-family: 'CircularStd-Black';
        margin: 0;
        word-wrap: break-word;
        max-width: 222px;
    }

    .taskNew-tripnm-wrap i {
        width: 26px;
        height: 26px;
        border-radius: 50%;
        background-color: #f3faff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 0 3px 1px rgb(0 0 0 / 20%);
        font-size: 12px;
    }

.taskNew-location-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

    .taskNew-location-wrap span {
        margin-left: 5px;
        font-size: 10px;
        line-height: 1.2;
        color: #415FA5;
    }

.taskNew-person-wrap span {
    color: #415FA5;
}

.taskNew-location-wrap i {
    font-size: 10px;
}

.taskNew-time-wrap, .taskNew-person-wrap {
    font-size: 10px;
    line-height: 1.2;
    display: flex;
    /*flex-wrap: wrap;*/
    max-width: 250px;
    overflow-wrap: break-word;
    align-items: center;
    margin: 0;
}

    .taskNew-time-wrap p {
        margin: 0;
        color: rgba(0, 0, 0, 0.7);
    }

.taskNew-progress-wrap .progress {
    margin: 0;
    height: 4px;
    background-color: #f3faff;
}

.taskNew-progress-wrap .labels {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    font-size: 10px;
    line-height: 2.2;
    margin-bottom: 3px;
}

.taskNew-time-wrap {
    padding: 7px 0;
}

.taskNew-info-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin-top: 5px;
}

.student-info-wrap-bottom {
    border-bottom: 1px solid #F1F1F1;
    padding-bottom: 10px;
}

.taskNew-info-wrap .cta-bttn {
    font-size: 12px;
    line-height: 1;
    border: 1px solid #32c787;
    padding: 5px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #32c787;
    border-radius: 30px;
    cursor: pointer;
}

.taskNew-box {
    padding: 10px 12px;
}

.taskNew-info span + span {
    margin-left: 8px;
}

.taskNew-info span i {
    margin-right: 2px;
}

.taskNew-progress-wrap .labels span:first-child {
    color: #1CA200;
}

.taskNew-person-wrap, .taskNew-time-wrap {
    justify-content: space-between;
}

    .taskNew-time-wrap span.status {
        background-color: green;
        color: #ffffff;
        padding: 3px 8px;
        border-radius: 50px;
        display: inline-flex;
        align-items: center;
    }

.waypoint-stop--wrap h3 {
    font-size: 14px;
    font-family: 'CircularStd-Black';
    font-weight: normal;
    line-height: 1.2;
    margin: 0 0 5px;
}

.waypoint-stop--time {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
    font-size: 10px;
    line-height: 1.2;
}

    .waypoint-stop--time i {
        margin-right: 5px;
    }

.waypoint-icons--wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: 10px;
    line-height: 1.2;
    margin-top: 5px;
    justify-content: space-between;
    border-top: 1px solid #999fa5;
    padding-top: 5px;
}

    .waypoint-icons--wrap p {
        margin: 0;
    }

.waypoint-stop--time span {
    color: #415FA5;
}

.task-configuration-notification {
    border-color: #eee !important;
    border: solid;
    padding: 15px 15px;
    border-width: thin;
}

    .task-configuration-notification .row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

.my-2 {
    margin-top: 15px;
    margin-bottom: 15px;
}

.mt-2 {
    margin-top: 15px;
}

.m-0 {
    margin: 0;
}

.task-configuration-notification .label-icons {
    width: 16px;
    height: auto;
    vertical-align: text-bottom;
}

.task-configuration-notification span.text-bold {
    font-family: 'CircularStd-Black';
    font-weight: 500 !important;
}

.view-icon--wrap {
    font-size: 14px;
    line-height: 1;
    margin-left: 10px;
}



@media print {
    .page-break {
        page-break-after: always;
    }
}



.trip-menu-sidebar-section {
    width: 70px;
    float: left;
    box-shadow: 2px 4px 5px rgba(0, 0, 0, 0.27);
    height: 100%;
    position: relative;
    z-index: 1;
    background-color: #ffffff;
}



.tripNew-box {
    padding: 8px 15px;
    /*border-bottom: 1px solid #e5e5e5 !important;*/
}

.contact-no-code {
    text-indent: 3em;
    width: 242px !important;
}

.date-time-z-index-set {
    z-index: 1 !important;
}

.iti__country-list {
    width: 242px !important;
    z-index: 9;
}

.traffic-off {
    background: url(../../Images/delivery/icons/traffic_off.png) no-repeat;
    background-color: #fffefe;
    height: 35px !important;
    border-color: #eaeaea;
    background-position-x: center;
    background-size: cover;
}

.traffic-on {
    background: url(../../Images/delivery/icons/traffic_on.png) no-repeat;
    background-color: #fffefe;
    height: 35px !important;
    border-color: #eaeaea;
    background-position-x: center;
    background-size: cover;
}


.taskNew-box-wrap {
    padding: 6px 10px 6px 14px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: 0.3s all ease-in-out;
    position: relative;
}

    .taskNew-box-wrap.active, taskNew-box-wrap:hover {
        background-color: rgba(33, 150,243, 0.1) !important;
    }


.trip--leftsidebar-menu-section .trip-menu-sidebar-section {
    width: 80px;
}

.trip--leftsidebar-menu-section .task-menu-ul li a .task-count {
    position: relative;
    display: block;
    top: auto;
    left: auto;
    right: auto;
    font-size: 38px;
    line-height: 1;
    width: 50px;
    height: auto;
    padding: 2px 10px;
    background-color: transparent !important;
    color: #f55d5d;
    border: 0;
}

.trip--leftsidebar-menu-section .task-menu-ul li a span.icon-img {
    width: 18px;
    height: 18px;
    background-size: 100%;
}

.trip--leftsidebar-menu-section .task-menu-ul li a {
    padding: 12px 3px;
    display: block;
}

    .trip--leftsidebar-menu-section .task-menu-ul li a .task-count.count-in-progress {
        color: #ff8f2b;
    }

    .trip--leftsidebar-menu-section .task-menu-ul li a .task-count.count-assigned {
        color: #415fa5;
    }

    .trip--leftsidebar-menu-section .task-menu-ul li a .task-count.count-completed {
        color: #31c787;
    }

    .trip--leftsidebar-menu-section .task-menu-ul li a .task-count.count-on-hold {
        color: #5d85f5;
    }

    .trip--leftsidebar-menu-section .task-menu-ul li a.active .task-count.count-assigned, .trip--leftsidebar-menu-section .task-menu-ul li a.active .task-count.count-in-progress, .trip--leftsidebar-menu-section .task-menu-ul li a.active .task-count.count-completed, .trip--leftsidebar-menu-section .task-menu-ul li a.active .task-count.count-on-hold, .trip--leftsidebar-menu-section .task-menu-ul li a.active .task-count {
        color: #ffffff;
    }

.trip--leftsidebar-menu-section .task-main-list {
    margin-left: 80px;
}

.sidebar-toggle-body .trip--task-map-section {
    margin-left: 360px;
}

.trip--leftsidebar-menu-section .task-menu-ul li a .task-count {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    margin: 0;
    width: 100%;
}

.trip--leftsidebar-menu-section .tripNew-box {
    padding: 0;
}

.trip--leftsidebar-menu-section .task-main-list .slimScrollDiv .task-list-body {
    height: calc(100vh - 223px) !important;
}

.trip--leftsidebar-menu-section .taskNew-location-wrap i, .trip--leftsidebar-menu-section .taskNew-location-wrap span, .trip--leftsidebar-menu-section .taskNew-time-wrap, .trip--leftsidebar-menu-section .taskNew-person-wrap {
    font-size: 12px;
}

.trip--leftsidebar-menu-section .task-main-list .slimScrollDiv {
    height: 100% !important;
}

.trip--leftsidebar-menu-section .taskNew-info-wrap img.i_20 {
    margin-right: 5px;
}

.trip--task-map-section .details-sidebar-info-wrap {
    padding: 10px 12px;
}

.trip--task-map-section .all-task-info-detail li p {
    font-size: 12px;
    align-items: flex-end;
}

.trip--task-map-section .waypoint-stop--wrap h3 {
    font-family: 'CircularStd-Book';
}

.trip--task-map-section .waypoint-stop--wrap h3 {
    font-family: 'CircularStd-Book';
}

.waypoints-timeline::after {
    content: '';
    position: absolute;
    height: 12px;
    width: 12px;
    background-color: white;
    bottom: 0;
    left: 0;
    transform: translateX(-50%);
}

.trip--task-map-section .task-detail-tab-widget .slimScrollDiv {
    height: 100% !important;
}

    .trip--task-map-section .task-detail-tab-widget .slimScrollDiv .task-details-body {
        height: calc(100vh - 246px) !important;
    }

.trip--leftsidebar-menu-section .taskNew-box-wrap {
    padding: 6px 10px 6px 14px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: 0.3s all ease-in-out;
    position: relative;
    margin-top: 10px;
    background-color: #ffffff;
    box-shadow: 0 0px 0px rgba(0,0,0,0.16), 0 0px 4px rgba(0,0,0,0.23);
    border-radius: 10px;
    width: 96%;
    left: 2%;
}

.trip--task-map-section .taskNew-box-wrap .taskNew-box {
    padding: 0;
}

.trip--task-map-section .taskNew-box-wrap {
    border: 1px solid rgba(0, 0, 0, 0.1);
    width: 96%;
    left: 2%;
    margin-top: 10px;
    border-radius: 5px;
}

.trip--task-map-section .taskNew-tripnm-wrap h4 {
    font-family: 'CircularStd-Book';
}

.trip--task-map-section .taskNew-location-wrap {
    margin: 4px 0 6px;
}

    .trip--task-map-section .taskNew-location-wrap p {
        margin: 0;
    }

        .trip--task-map-section .taskNew-location-wrap p span {
            margin: 0;
            font-size: 12px;
            line-height: 1;
            display: block;
        }

    .trip--task-map-section .taskNew-location-wrap span, .trip--task-map-section .taskNew-location-wrap i, .trip--task-map-section .taskNew-time-wrap p {
        font-size: 12px;
        line-height: 1;
    }

.trip--task-map-section .taskNew-info-wrap {
    justify-content: flex-end;
}

    .trip--task-map-section .taskNew-info-wrap .student-info-wrap-bottom {
        padding: 0;
    }

.trip--task-map-section .taskNew-time-wrap {
    padding-top: 0;
    padding-bottom: 2px;
}

.trip--task-map-section #taskAuditTrailDiv .vtimeline .dummy-class .row > span:last-child {
    text-align: left;
    float: none;
}

.driver-name-elipsisi {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: calc(100% - 40px);
    display: inline-block;
    vertical-align: bottom;
}

body .tripHistoryPanel {
    height: auto;
}

.border-bottom-completed {
    border-bottom: 1px solid rgba(0,0,0,.12);
}

.trip--task-map-section #TripStudentDetailDiv {
    height: calc(100vh - 144px) !important;
}


/*-- Custom Form --*/
.custom-form-wrap {
    max-width: 770px;
    margin: 0 auto;
}

.form-box-wrap {
    background-color: #ffffff;
    border-radius: 10px;
    padding: 20px 20px;
}

    .form-box-wrap ~ .form-box-wrap {
        margin-top: 12px;
    }

    .form-box-wrap .label-control.title {
        font-size: 22px;
        line-height: 1.4;
        display: block;
        margin: 10px 0 6px;
    }

    .form-box-wrap .form-group {
        margin: 0;
    }

        .form-box-wrap .form-group .label-control {
            font-size: 14px;
            line-height: 1.2;
            margin: 0;
        }

        .form-box-wrap .form-group input {
            padding-right: 0;
        }

    .form-box-wrap .sigPad label {
        font-family: 'CircularStd-Book';
        font-style: normal;
        margin: 0;
    }

.custom-form-row {
    padding: 20px 14px;
}

.custom-form-wrap .buttonFromwrpa {
    justify-content: space-between;
}

    .custom-form-wrap .buttonFromwrpa .submit-button {
        font-size: 18px;
        line-height: 1;
        background-color: #415fa5;
        color: #ffffff;
        border: 1px solid #415fa5;
        padding: 10px 14px;
        display: inline-block;
        border-radius: 5px;
    }

    .custom-form-wrap .buttonFromwrpa .clear-button {
        font-size: 18px;
        line-height: 1;
        background-color: transparent;
        color: #415fa5;
        border: 1px solid #415fa5;
        padding: 10px 14px;
        display: inline-block;
        border-radius: 5px;
    }

.form-box-wrap .sigPad canvas#Signature_3 {
    width: 100%;
    display: block;
}

.custom-form-mandatory-field {
    border-left: solid;
    border-color: red;
}


/*-- Dashboard --*/
.counter-number-wrap {
    width: calc(100% / 5 - 10px);
    display: inline-block;
}

    .counter-number-wrap .taskAnalyti_status_box_title h4 {
        width: 100%;
        margin-bottom: 15px;
    }

.taskAnalyti_status_box_row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 30px;
}

.counter-number-wrap .taskAnalyti_status_box_title {
    justify-content: center;
    text-align: center;
}

.justify-content-end {
    justify-content: flex-end;
}

.taskAnalyti_status_box_content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

    .taskAnalyti_status_box_content span {
        font-size: 20px;
        line-height: 1;
    }

.mt-3 {
    margin-top: 30px;
}

.realTime_analytics__box {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    height: 100%;
}

    .realTime_analytics__box .panel-body .delivery-map {
        height: 520px;
    }

.real_time_analytics_page .card-panel-heading {
    margin-bottom: 20px;
}

    .real_time_analytics_page .card-panel-heading h4 {
        margin: 0;
        font-family: 'CircularStd-Black';
        font-size: 22px;
        line-height: 1;
    }

    .real_time_analytics_page .card-panel-heading .row {
        align-items: center;
        display: flex;
        flex-wrap: wrap;
    }

.realTime_analytics__row {
    display: flex;
    flex-wrap: wrap;
    margin-top: 30px;
}

    .realTime_analytics__row .realTime_analytics__box {
        padding: 0px 20px 20px;
    }

        .realTime_analytics__row .realTime_analytics__box .highcharts-container {
            width: 100% !important;
        }

        .realTime_analytics__row .realTime_analytics__box .highcharts-figure {
            min-width: 100%;
            width: 100%;
        }

.rider-status-box-wrap .taskAnalyti_status_white_box {
    padding: 20px 20px;
}

.realTime_analytics__box .box-shadow-flat-box .flat-body {
    padding-top: 20px;
}

    .realTime_analytics__box .box-shadow-flat-box .flat-body .row {
        display: flex;
        align-items: center;
    }

    .realTime_analytics__box .box-shadow-flat-box .flat-body .counter-wrap.text-right {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
    }

.realTime_analytics__box em.text-purple {
    background-color: #cbffe9;
    padding: 10px;
    display: inline-block;
    border-radius: 10px;
}

.realTime_analytics__box h6.flat-box-heading-h6 {
    font-size: 18px;
    line-height: 1.2;
}

.realTime_analytics__box .flat-box {
    padding: 10px 10px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    margin-bottom: 0;
}

.total_analytics_no_box > .row {
    margin: 0 -6px;
}

    .total_analytics_no_box > .row > div {
        padding: 0 6px;
    }

.realTime_analytics__row .realTime_analytics__box.total_analytics_no_box {
    padding: 20px 20px;
}

.realTime_analytics__box.total_analytics_no_box > .row {
    margin-top: 30px;
}

.channels-box-wrap {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-top: 20px;
    padding: 0px 10px 12px;
}

    .channels-box-wrap > div {
        width: 100%;
    }

.channels-icon {
    transform: translateY(-50%);
}

    .channels-icon em {
        background-color: #fff13c;
        border-radius: 50%;
        padding: 10px;
        font-size: 18px;
        line-height: 1;
    }

.channels-box-body {
    font-size: 18px;
    line-height: 1;
    color: #00b768;
}

.channels_analytics_box {
    padding: 20px 10px;
}

    .channels_analytics_box > .row {
        margin: 0 -6px;
    }

        .channels_analytics_box > .row > div {
            padding: 0 6px;
        }

.channels-box-heading h6.flat-box-heading-h6 {
    font-size: 14px;
}

.channels_analytics_box .row + .row {
    margin-top: 26px;
}

.chart_round_data_wrap > .row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.chart_round_data_wrap .highcharts-figure, .chart_round_data_wrap .highcharts-figure .highcharts-container, .chart_round_data_wrap .highcharts-figure svg {
    min-width: 100%;
    width: 100% !important;
}

.chart_round_data_wrap p {
    font-size: 12px;
    line-height: 1.2;
    margin: 0;
}

    .chart_round_data_wrap p + p {
        margin-top: 10px;
    }

.chart_round_data_wrap .row + .row {
    margin-top: 10px;
    padding-top: 10px;
    position: relative;
}

    .chart_round_data_wrap .row + .row::before {
        content: '';
        border-top: 1px solid rgba(0, 0, 0, 0.1);
        position: absolute;
        width: calc(100% - 30px);
        top: 0;
        left: 15px;
        right: 0;
    }

.Service_maint_dash_bg > .row {
    display: flex;
    flex-wrap: wrap;
}

.dummy2 ul li.way-blue::before {
    color: #4f78ed;
}

.dummy2 ul li.way-green::before {
    color: #45e5a1;
}

.dummy2 ul li.way-yellow::before {
    color: #f5f53b;
}

.tasknoProgress {
    background-color: #a5a5a5;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 20px;
}

    .tasknoProgress.scheduled {
        background-color: #415fa5;
    }

    .tasknoProgress.progress {
        background-color: #ff8f2b;
    }

    .tasknoProgress.completed {
        background-color: #31c787;
    }

    .tasknoProgress.cancelled {
        background-color: #f55d5d;
    }

.trip--task-map-section .taskNew-box-wrap .taskNew-box .taskNew-location-wrap {
    align-items: flex-start;
}

    .trip--task-map-section .taskNew-box-wrap .taskNew-box .taskNew-location-wrap span {
        max-width: calc(100% - 15px);
        margin-left: 7px;
    }

.row.no-gutters {
    margin: 0;
}

    .row.no-gutters > * {
        padding: 0;
    }

.trip--task-map-section .taskNew-time-wrap p time {
    margin-left: 1px;
}

.task-detail-tab-widget .form-group .select2-material span.select2-selection {
    border-radius: 80px;
    border: 1px solid rgba(0, 0, 0, 0.33);
}

    .task-detail-tab-widget .form-group .select2-material span.select2-selection input.select2-search__field {
        background-size: 14px;
        background-image: url("data:image/svg+xml,%3Csvg id='Group_35' data-name='Group 35' xmlns='http://www.w3.org/2000/svg' width='66.58' height='57.184' viewBox='0 0 66.58 57.184' fill='%2300000054'%3E%3Cpath id='Path_16' data-name='Path 16' d='M-170.816-274.868q7.167,0,14.334,0c1.011,0,2.023.02,3.032-.024.527-.023,1.044.071,1.571.034.56-.04,1.125-.009,1.688-.009h5.025c.667,0,.647-.008.877-.624a8.861,8.861,0,0,1,7.527-6.133,9,9,0,0,1,9.806,6.368.461.461,0,0,0,.519.393c1.524-.011,3.048.006,4.572-.011.387,0,.536.109.529.512q-.031,1.771,0,3.542c.007.409-.151.512-.532.508-1.455-.016-2.911.009-4.366-.014a.683.683,0,0,0-.79.553,9.08,9.08,0,0,1-8.732,6.294,9.07,9.07,0,0,1-8.531-6.292.687.687,0,0,0-.785-.557q-20.966.016-41.932.009a3.9,3.9,0,0,0-.412,0c-.349.037-.48-.083-.473-.459.024-1.235.019-2.471,0-3.707,0-.309.076-.394.39-.393Q-179.158-274.861-170.816-274.868Zm39.725,2.284a4.573,4.573,0,0,0-4.529-4.585,4.615,4.615,0,0,0-4.608,4.551,4.578,4.578,0,0,0,4.533,4.589A4.563,4.563,0,0,0-131.091-272.583Z' transform='translate(187.916 301.197)'/%3E%3Cpath id='Path_17' data-name='Path 17' d='M-136.028-34.24c-4.64,0-9.281.006-13.921-.008a.636.636,0,0,0-.723.517,8.825,8.825,0,0,1-6.667,6.088,8.747,8.747,0,0,1-8.4-2.412,8.587,8.587,0,0,1-2.277-3.753.533.533,0,0,0-.615-.437q-6.013.013-12.026.005c-2.292,0-4.585-.007-6.877.006-.363,0-.5-.083-.494-.48.023-1.235.014-2.471-.012-3.706-.008-.364.192-.366.44-.366h9.761c3.031,0,6.062-.006,9.093.009a.67.67,0,0,0,.764-.53,8.843,8.843,0,0,1,7.366-6.208,8.7,8.7,0,0,1,7.288,2.177,8.784,8.784,0,0,1,2.684,4.156c.113.367.343.4.653.4q3.913-.007,7.825,0h19.852c.927,0,.831-.042.832.812q0,1.524,0,3.048c0,.686,0,.686-.667.686Zm-23.343,2.291a4.58,4.58,0,0,0,4.619-4.534,4.613,4.613,0,0,0-4.525-4.6,4.589,4.589,0,0,0-4.635,4.484A4.57,4.57,0,0,0-159.371-31.949Z' transform='translate(188.054 84.575)'/%3E%3Cpath id='Path_18' data-name='Path 18' d='M-141.742-506.927h-17.875c-.59,0-1.181.019-1.77-.006a.515.515,0,0,0-.583.439,9.022,9.022,0,0,1-3.236,4.6,8.926,8.926,0,0,1-4.538,1.782,8.741,8.741,0,0,1-4.73-.795,8.915,8.915,0,0,1-4.838-5.485.667.667,0,0,0-.777-.548c-2.553.019-5.107,0-7.661.02-.388,0-.442-.117-.438-.462q.022-1.914-.021-3.829c-.007-.31.17-.219.313-.219,2.595,0,5.19-.011,7.784.013a.706.706,0,0,0,.808-.573,8.9,8.9,0,0,1,7.664-6.237,8.479,8.479,0,0,1,5.544,1.167,8.936,8.936,0,0,1,4.078,5.07.716.716,0,0,0,.825.572q19.358-.018,38.716-.009a3.175,3.175,0,0,0,.37,0c.362-.042.48.113.475.471q-.024,1.812,0,3.624c0,.328-.1.414-.426.413q-6.692-.017-13.384-.009Zm-24.341-2.226a4.636,4.636,0,0,0-4.61-4.613,4.584,4.584,0,0,0-4.522,4.6,4.559,4.559,0,0,0,4.57,4.583A4.62,4.62,0,0,0-166.083-509.153Z' transform='translate(188.209 518.3)'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center left 5px;
        padding-left: 26px;
    }

#TripStudentDetail .form-group {
    padding-top: 7px;
}

.taskNew-location-time-wrap {
    align-items: flex-start;
}

    .taskNew-location-time-wrap span {
        max-width: calc(100% - 70px);
        width: 100%;
    }

    .taskNew-location-time-wrap time {
        font-size: 12px;
        color: rgba(0, 0, 0, 0.6);
        margin-left: auto;
    }

.taskNew-location-wrap.taskNew-location-time-wrap:not(.mt-sm) {
    margin-top: 6px;
}

.trip-student-detail-list {
    margin-left: 7px !important;
    padding-top: 5px !important;
}

.trip-map-trip-name {
    max-width: 160px !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.text-muted2 a {
    color: #949494 !important;
}

.taskNew-info-wrap .no-color-bttn {
    font-size: 12px;
    line-height: 1;
    border: 1px solid #000000;
    padding: 5px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #000000;
    border-radius: 30px;
    cursor: pointer;
}

.student-pickup-location {
    color: #949494 !important;
}


.dropdown-menu-custom-wrap {
    position: absolute;
    background-color: #ffffff;
    top: 100%;
    width: 550px;
    left: 0;
    border-radius: 4px;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s all ease-in-out;
    transform: translateY(20px);
}

.setup-add.open .dropdown-menu-custom-wrap {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}

.dropdown-menu-top-custom {
    padding: 10px 10px;
}

.dropdown-menu-bottom-custom {
    background-color: #f7fafb;
    padding: 10px 10px;
    box-shadow: 0 3px 4px 3px rgba(0, 0, 0, 0.2);
}

    .dropdown-menu-bottom-custom li a {
        align-items: center;
    }

.dropdown-menu-top-custom ul h3 {
    color: #5e5e5e;
}

.dropdown-menu-top-custom {
    display: flex;
    flex-wrap: wrap;
}

.dropdown-menu-custom-wrap ul {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}

    .dropdown-menu-custom-wrap ul li {
        width: 50%;
        padding: 6px 10px;
        transition: 0.3s all ease-in-out;
    }

.dropdown-menu-custom-wrap .dropdown-menu-top-custom ul li {
    padding: 10px 10px;
}

.dropdown-menu-custom-wrap ul li:hover {
    background-color: #f7fafb;
    border-radius: 10px;
}

.dropdown-menu-custom-wrap ul li a {
    display: flex;
    flex-wrap: wrap;
}

.dropdown-menu-custom-wrap ul .left em {
    width: 40px;
    height: 40px;
    font-size: 18px;
    line-height: 1;
    border: 1px solid #dadada;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.dropdown-menu-custom-wrap ul .right {
    max-width: calc(100% - 40px);
    padding-left: 10px;
}

.dropdown-menu-custom-wrap ul h3 {
    font-size: 14px;
    line-height: 1;
    margin: 0;
    color: #777777;
    font-family: 'CircularStd-Black';
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
}

.dropdown-menu-custom-wrap ul p {
    font-size: 12px;
    line-height: 1.4;
    margin: 2px 0 0;
    color: #858585;
    font-family: 'CircularStd-Book';
}

.dropdown-menu-bottom-custom li a {
    align-items: center;
}

.dropdown-menu-top-custom ul h3 {
    color: #5e5e5e;
}

.dropdown-menu-bottom-custom ul h3 {
    color: #858585;
    font-family: 'CircularStd-Book';
    font-weight: 600;
}

.dropdown-menu-custom-wrap .dropdown-menu-bottom-custom ul li:hover {
    background-color: #ffffff;
}

.dropdown-menu-custom-wrap ul h3 i {
    color: #2196F3;
    font-size: 15px;
    line-height: 1;
    display: inline-block;
    margin-left: 12px;
}

.dropdown-menu-custom-wrap .dropdown-menu-bottom-custom ul .left em {
    color: #858585;
    background-color: #ffffff;
}


.sidebar-wrap-section {
    max-width: 250px;
    width: 100%;
    background-color: #ffffff;
    border-radius: 10px;
    margin: 20px 20px 20px 20px;
    box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.1);
}

    .sidebar-wrap-section ul {
        margin: 0;
        padding: 0;
        list-style: none;
        margin-top: 10px;
        max-height: calc(100vh - 200px);
        overflow: auto;
    }

        .sidebar-wrap-section ul a {
            display: flex;
            align-items: center;
            padding: 10px;
        }

            .sidebar-wrap-section ul a.active, .sidebar-wrap-section ul a:hover {
                background-color: #32c787;
            }

                .sidebar-wrap-section ul a.active label, .sidebar-wrap-section ul a:hover label {
                    color: #ffffff;
                    opacity: 1;
                }

            .sidebar-wrap-section ul a span {
                width: 35px;
                height: 35px;
                border-radius: 5px;
                overflow: hidden;
            }

                .sidebar-wrap-section ul a span img {
                    max-width: 100%;
                    height: auto;
                }

            .sidebar-wrap-section ul a label {
                margin: 0;
                font-size: 16px;
                line-height: 1;
                color: #000000;
                padding-left: 10px;
                opacity: 0.6;
                max-width: calc(100% - 35px);
            }

        .sidebar-wrap-section ul li + li {
            border-top: 1px solid #e4e5e7;
        }

.dashbaord--section-page .wrapper {
    display: flex;
    flex-wrap: wrap;
}

.dashbaord--content-wrap {
    max-width: calc(100% - 290px);
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 20px;
}

    .dashbaord--content-wrap h1 {
        margin: 0;
        font-size: 25px;
        line-height: 1.4;
    }

.sidebar-wrap-section .search-wrap {
    position: relative;
    padding: 10px;
    box-shadow: 0 5px 10px rgba(0,0,0,0.19);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

    .sidebar-wrap-section .search-wrap span {
        width: 38px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(0, 0, 0, 0.2);
        border-radius: 5px;
        margin-left: 6px;
    }

section.dashbaord--section-page {
    min-height: calc(100vh - 56px);
}

.sidebar-wrap-section .search-wrap input[type="search"] {
    font-size: 14px;
    line-height: 1;
    padding: 10px 10px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    padding-left: 40px;
    max-width: calc(100% - 44px);
}

.sidebar-wrap-section .search-wrap i {
    width: 30px;
    height: 30px;
    padding: 0;
    font-size: 22px;
    line-height: 1;
    border: 0;
    position: absolute;
    top: 30px;
    left: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.dashbaord---box-content img {
    width: 30px;
    height: 30px;
}

.dashbaord---box-content h3 {
    font-size: 16px;
    line-height: 1.4;
    margin: 14px 0 3px;
}

.dashbaord---box-content p {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
    color: #000000;
    opacity: 0.4;
    margin-bottom: 10px;
}

.dashbaord---box-content-row {
    display: flex;
    flex-wrap: wrap;
    grid-gap: 10px;
    margin-top: 0;
}

.dashbaord---box-content-col {
    width: calc(100% / 3 - 10px);
}

.dashbaord---box-content {
    background-color: #ffffff;
    padding: 15px;
    border-radius: 5px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    position: relative;
    display: grid;
}

.dashbaord---box--stick {
    position: absolute;
    right: 15px;
    top: 15px;
    text-align: right;
}

    .dashbaord---box--stick span {
        font-size: 11px;
        line-height: 1.2;
        display: block;
        color: #000000;
        opacity: 0.6;
    }

        .dashbaord---box--stick span.green {
            color: #32c787;
            margin-bottom: 3px;
            opacity: 1;
        }

.dashbaord---box-content .btn {
    font-size: 12px;
    line-height: 1;
    color: #1C1C1C;
    text-transform: uppercase;
    background-color: #FFFFFF;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    border-radius: 10px;
    padding: 7px 9px;
    border: 1px solid rgba(28, 28, 28, 0.2);
}

    .dashbaord---box-content .btn img {
        width: 18px;
        height: 18px;
        display: block;
    }

/*.dashbaord---box-content .btn:hover {
        opacity: 0.6;
    }*/

.nav-icon.center-align-image-navigation {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .nav-icon.center-align-image-navigation img {
        filter: invert(100%);
        width: 20px;
        height: 23px;
    }



/*-- 9June --*/
.integration-top-title-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 30px 0 8px 0;
}

.integration-app-toggle-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 30px;
}

.integration-top-right-title-toggle-wrap {
    margin-left: auto;
    column-gap: 20px;
    display: inline-flex;
    margin-right: 18px;
}

    .integration-top-right-title-toggle-wrap label {
        margin: 0;
        display: inline-flex;
        align-items: center;
        font-size: 14px;
        line-height: 1;
        cursor: pointer;
    }

        .integration-top-right-title-toggle-wrap label input {
            margin: 0 4px 0 0;
        }

.integration-app-toggle-wrap h4 {
    margin: 0 10px 0 0;
}

.integration-app-toggle-wrap label {
    margin: 0;
}

.dashbaord---box-content {
    height: 100%;
}

.switch input {
    margin: 0;
    width: 0;
    height: 0;
}

.custom-radio---wrap label input {
    width: 0;
    height: 0;
    opacity: 0;
    position: absolute;
    z-index: -1;
}

.custom-radio---wrap label span {
    width: 16px;
    height: 16px;
    border: 1px solid #000000;
    border-radius: 50%;
    font-size: 9px;
    line-height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 3px;
    background-color: transparent;
    color: transparent;
}

.custom-radio---wrap label input:checked ~ span {
    background-color: #32c787;
    border-color: #32c787;
    color: #ffffff;
}

.footer-integration---wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: auto;
}

    .footer-integration---wrap label {
        line-height: 1;
    }

    .footer-integration---wrap span {
        font-size: 13px;
        line-height: 1;
        color: #212121;
    }

.dashbaord---box-content:hover {
    box-shadow: rgba(0, 0, 0, 0.11) 0px 3px 6px, rgba(0, 0, 0, 0.10) 0px 3px 6px;
}

.dashbaord---box-content .image-box {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}

    .dashbaord---box-content .image-box img {
        max-width: -webkit-fill-available;
        height: auto;
    }

.customDate-wrap button .icon-calendar {
    font-weight: bold;
    margin-right: 5px;
}

.customDate-wrap button {
    background-color: transparent;
    border: 1px solid #dde6e9;
    padding: 6px 10px;
    border-radius: 5px;
}

@media (max-width:1350px) {
    .footer-integration---left .btn {
        margin: 0;
    }

    .dashbaord---box-content h3 {
        font-size: 14px;
        margin-top: 8px;
    }

    .dashbaord---box-content p {
        font-size: 12px;
    }

    .footer-integration---wrap span {
        font-size: 11px;
    }

    .dashbaord---box-content .btn {
        padding: 6px 8px;
    }

    .dashbaord---box-content .image-box {
        width: 32px;
        height: 32px;
    }
}

.list-group-item1 {
    position: relative;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;
    background-color: #fff;
}

/*work space map filter only*/
html[lang="ar"] .filter-map-option {
    left: 190px;
    right: auto;
}


/*trip map arabic related*/
html[lang="ar"] .offsidebar-sidebar-new {
    right: auto;
    left: -280px;
}

html[lang="ar"] .toggle-sidebar-right {
    left: 0;
    right: auto;
    transform: scale(-1,1);
}

html[lang="ar"] .sidebar-toggle-body-right .toggle-sidebar-right {
    right: auto;
    left: 280px;
}

html[lang="ar"] .sidebar-toggle-body-right .offsidebar-sidebar-new {
    left: 0;
    right: auto;
}

html[lang="ar"] .task-main-list .toggle-sidebar-left {
    transform: scale(-1,1);
    right: auto;
    left: -36px;
}

html[lang="ar"] .task-map-section {
    margin-left: 0;
    margin-right: 360px;
}

html[lang="ar"] .sidebar-toggle-body .trip--task-map-section {
    margin-left: 0;
    margin-right: 70px;
}

html[lang="ar"] .trip--leftsidebar-menu-section .task-main-list {
    margin-left: 0;
    margin-right: 80px;
}
/*html[lang="ar"] .layout-h.sidebar-toggle-body .trip--task-map-section {
    margin-left: 80px;
    margin-right: 0;
}

html[lang="ar"] .layout-h.sidebar-toggle-body.sidebar-toggle-body-right .trip--task-map-section {
    margin-left: 280px;
    margin-right: 0;
}

html[lang="ar"] .sidebar-toggle-body .trip--task-map-section {
    margin-left: 0;
    margin-right: 360px;
}

html[lang="ar"] .toggle-sidebar-right {
    left: 0;
    right: auto;
    transform: scaleX(-1);
}

html[lang="ar"] .offsidebar-sidebar-new {
    right: auto;
    z-index: 5;
    left: -280px;
}

html[lang="ar"] .sidebar-toggle-body-right .offsidebar-sidebar-new {
    right: auto;
    z-index: 5;
    left: 0;
}

html[lang="ar"] .sidebar-toggle-body-right .toggle-sidebar-right {
    right: 360px;
    transition: 0.3s all ease-in-out;
}*/


html[lang="ar"] .POIZone-panel-body #leftDivList {
    padding-left: 0 !important;
    padding-right: 15px;
}

html[lang="ar"] .dataTable-paginate-circle-widget ul.pagination li.paginate_button.previous a, html[lang="ar"] .dataTable-paginate-circle-widget ul.pagination li.paginate_button.next a {
    transform: scale(-1);
}

    html[lang="ar"] .dataTable-paginate-circle-widget ul.pagination li.paginate_button.next a::after {
        right: 0;
    }

html[lang="ar"] #contextMenu {
    right: auto;
}

html[lang="ar"] .colorpicker.dropdown-menu {
    left: auto !important;
    right: 50%;
    transform: translateX(-50%);
}

html[lang="ar"] .gm-style .infoBox {
    direction: ltr;
}

    html[lang="ar"] .gm-style .infoBox .info_popup {
        left: -200px;
        right: auto;
        top: -40px;
    }

html[lang="ar"] .normalheader.small-header .col-md-8.col-sm-6.pt-sm {
    padding-right: 30px;
}

html[lang="ar"] .layout-h .task-main-list {
    left: auto;
    right: -280px;
}

html[lang="ar"] .layout-h.sidebar-toggle-body .task-main-list {
    left: auto;
    right: 70px;
}

html[lang="ar"] .layout-h .task-map-section {
    margin-right: 0;
}

html[lang="ar"] .layout-h.sidebar-toggle-body .task-map-section {
    margin-right: 280px;
}


.task-add-btn-div.dropdown-select-wrap {
    right: -38px;
    bottom: 0;
}

    .task-add-btn-div.dropdown-select-wrap .task-add-btn {
        border-radius: 50%;
        box-shadow: none;
        width: 37px;
        height: 37px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .task-add-btn-div.dropdown-select-wrap .task-add-btn i {
            line-height: initial;
        }

    .task-add-btn-div.dropdown-select-wrap ul.dropdown-select-submenu {
        right: 0;
        left: auto;
        border-radius: 10px;
        overflow: hidden;
    }



html[lang="ar"] #RepeatScheduleDaysID + span.select2.select2-container.select2-container--bootstrap {
    width: 100% !important;
}

html[lang="ar"] .task-datetime-picker-wrap i {
    margin-right: 0;
    margin-left: 5px;
}

html[lang="ar"] .advance-section .filter-wrap {
    margin-left: 0;
    margin-right: auto;
}

html[lang="ar"] .task-details-asidebar {
    left: auto;
    right: 70px;
}


html[lang="ar"] .toggle-bar-driver-detail.task-asidebar-close {
    transform: scale(-1,1);
    right: auto;
    left: -36px;
}

html[lang="ar"] .lbl-top {
    top: -8px;
    right: -10px;
    left: auto;
}

body .select2-container--bootstrap[dir=rtl] .select2-selection--single .select2-selection__arrow {
    left: -60px;
    right: auto;
}

html[lang="ar"] .tablefilterBoxtopwrap .datacalendarwrap {
    margin-left: auto;
    margin-right: 0;
}

html[lang="ar"] button#daterange-picker-report {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

html[lang="ar"] .task-main-list .all-task-list-title h2 {
    margin-left: auto;
    margin-right: 0;
}

html[lang="ar"] div#ReportDateRangeDiv {
    margin-right: 10px;
}

/*html[lang="ar"] .tablefilterBoxtopwrap .datacalendarwrap .bttn-rounded {
    margin-right: 70px;
}*/

html[lang="ar"] .all--task--list--location-name--right {
    text-align: left;
    margin-left: 0;
    margin-right: auto;
}

html[lang="ar"] .all-task-list-title h2.dummy-task-detail {
    margin-left: auto;
    margin-right: 0;
}

html[lang="ar"] .detail-title-header .all-task-list-title .task-options-wrap {
    margin-left: 0;
    margin-right: 10px;
}

html[lang="ar"] .task-info-details-navigations {
    left: -36px;
    right: auto;
    transform: scale(-1,1);
}

html[lang="ar"] .detail-title-header .all-task-list-title .task-options-wrap {
    flex-direction: row-reverse;
    margin-left: 0;
    margin-right: 10px;
}

html[lang="ar"] .all-task-list-title h3 {
    margin-left: auto;
    margin-right: 0;
}

html[lang="ar"] .dropdown-menu-custom-wrap {
    left: auto;
    right: 0;
}

    html[lang="ar"] .dropdown-menu-custom-wrap ul .right {
        padding-left: 0;
        padding-right: 10px;
    }




/*-- 3Sept --*/
html[lang="ar"] .gm-style-iw.gm-style-iw-c.custom-iw {
    top: 0px !important;
    left: 0px !important;
}

html[lang="ar"] .custom-iw .gm-ui-hover-effect span {
    margin: 0 !important;
}

html[lang="ar"] .custom-iw .gm-ui-hover-effect {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

html[lang="ar"] .gm-style .gm-style-iw-t.gmStyleiw {
    right: 0 !important;
    bottom: 20px !important;
}

html[lang="ar"] select#AssignDriverVehicleType + span, html[lang="ar"] select#GroupID + span.select2.select2-container, html[lang="ar"] select#FailedReason + span.select2.select2-container {
    width: 100% !important;
}

html[lang="ar"] .task-filter-main > div + div {
    margin-left: 0;
    margin-right: 15px;
}

html[lang="ar"] .all-task-list-title .stops--steps--wrap {
    margin-right: 0;
    margin-left: 3px;
}

html[lang="ar"] .task-add-btn-div.dropdown-select-wrap {
    right: auto;
    left: -42px;
}

html[lang="ar"] .task-view-list-footer {
    z-index: 2;
}

html[lang="ar"] .task-add-btn-div.dropdown-select-wrap ul.dropdown-select-submenu {
    right: 0;
    left: auto;
}

[lang = "ar"] #OffsidebarDirection, [lang = "ar"] #OffsidebarNearby {
    right: auto !important;
}

[lang = "ar"] .panel-body.mapview-header .mt-sm {
    padding-right: 30px !important;
}

[lang = "ar"] .mapview-search-section .input-group .select2-container--bootstrap {
    width: 100% !important;
}

html[lang="ar"] .layout-h.sidebar-toggle-body .task-main-list {
    margin-right: 10px;
}


#_GetSchoolModuleDiv .form-group.select2-material.bg-transparent span.select2.select2-container.select2-container--bootstrap {
    width: 100% !important;
}

#_GetSchoolModuleDiv li.select2-search.select2-search--inline {
    width: 100%;
}

div#TripScheduleCollapse th {
    white-space: nowrap;
}

div#tblReOrder1_info {
    font-size: 12px;
    line-height: 1.2;
    width: 100%;
    white-space: break-spaces;
    padding-left: 100px;
}


div#CustomerFeedback .jqEmoji::before {
    content: "\f005";
    font-family: 'FontAwesome';
    font-size: 40px;
    line-height: 1;
}

div#CustomerFeedback .jqEmoji {
    font-size: 0;
    width: 25px;
    height: 25px;
    display: inline-block;
    opacity: 1 !important;
    color: rgba(128, 128,128,0.2);
}

.jqEmoji-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.starRatingwrap {
    width: 100%;
}

    .starRatingwrap .star-rating__wrap {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
        flex-direction: row-reverse;
        justify-content: center;
    }

        .starRatingwrap .star-rating__wrap label.star-rating__ico {
            padding: 0;
        }

div#CustomerFeedback .jqEmoji.active::before {
    color: rgba(128, 128,128,0.2);
}

.monitorDelivery_steps_ul .monitorDelivery_steps_li:last-child::after {
    display: none;
}

[lang="ar"] .taskmapview-patch-bottom {
    left: 15px;
    right: auto;
    width: calc(100% - 380px);
}

[lang="ar"] .topnavbar .navbar-header .brand-logo {
    text-align: right;
}

.login_header {
    position: static;
    margin-bottom: 100px;
}

#HeadersDetailDiv .location_name_col {
    width: auto !important;
    min-width: auto !important;
}

.task-status-duration-wrap .all-task-info-detail p + .mt-lg.pull-right {
    position: absolute;
    right: -15px;
    top: -9px;
}

.dropdown-task-menu.dropdown-menu.dropdown-menu-right > div {
    overflow: hidden;
}

    .dropdown-task-menu.dropdown-menu.dropdown-menu-right > div a {
        width: 100%;
        display: block;
    }

.monitorDeliveryScreen_row.trackVehicleBoxwrap {
    align-items: stretch;
}

.trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul li + li {
        margin-top: 5px;
        padding-top: 5px;
        border-top: 1px solid rgba(0, 0, 0, 0.2);
    }

    .trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul li .pull-left {
        float: none !important;
    }


.trackVehicleBoxwrap .monitorDeliveryScreen_right {
    padding: 0;
}

.monitorDeliveryScreen .trackVehicleBoxwrap .track-task-tab {
    height: auto;
    max-height: calc(100vh - 87px);
}

.trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul span#EngineSpan {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}

.trackVehicleBoxwrap .w-33_33per {
    width: auto;
}

.trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul span#EngineSpan .w-33_33per {
    gap: 10px;
    padding: 0 !important;
    align-items: center;
}

    .trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul span#EngineSpan .w-33_33per .count-txt {
        margin: 0;
    }

.trackVehicleBoxwrap .monitorDelivery_user_info_img_name_wrap {
    margin: 0;
    padding: 22px 15px;
}

.trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul > li:first-child {
    padding-top: 7px;
}

.trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul > li {
    padding-left: 15px;
    padding-right: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

    .trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul > li span.text-muted p:empty {
        display: none;
    }

    .trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul > li span#OtherIconSpan {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 20px;
    }

        .trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul > li span#OtherIconSpan > div {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 10px;
        }

            .trackVehicleBoxwrap .monitorDelivery_steps_accordion_wrap ul > li span#OtherIconSpan > div > span {
                display: block;
            }

.headermonitorDelivery_wrap .header-logo h3 {
    margin: 0;
}

.navbar-section.headermonitorDelivery_section .navbar {
    min-height: 86px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}

    .navbar-section.headermonitorDelivery_section .navbar .container-fluid {
        width: 100%;
    }

.track-task-main.custom-tab-content.track-task-tab .lang_btn {
    right: 10px;
    height: auto;
}

div#trackingLanguageDropdownList, .track-task-main.custom-tab-content.track-task-tab .lang_btn {
    background-color: transparent;
    box-shadow: none;
}

#more_horiz_black_24dp {
    transform: scale(-1);
}

.gmnoprint > div {
    border-radius: 10px !important;
}

#recenter-control {
    border-radius: 10px;
}

.track-task-main.custom-tab-content.track-task-tab .lang_btn button {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    border-radius: 10px !important;
    overflow: hidden;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.32);
}

.monitor_user_info_name {
    max-width: calc(100% - 60px);
}

.trackVehicleBoxwrap .monitorDelivery_user_info_img_name_wrap {
    justify-content: space-between;
    gap: 10px;
}

.monitorInfoboxwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

    .monitorInfoboxwrap .btn-group {
        flex: 1;
        display: flex;
    }

        .monitorInfoboxwrap .btn-group button.btn {
            padding: 9px 13px !important;
            font-size: 14px;
            line-height: 1;
            width: 100%;
        }

@media screen and (max-width:991px) {
    .monitorDeliveryScreen_right_top_mobile_btn {
        transform: translateY(-96%);
    }
}

@media screen and (max-width:575px) {
    .navbar-section.headermonitorDelivery_section .navbar {
        min-height: auto;
    }

        .navbar-section.headermonitorDelivery_section .navbar .headermonitorDelivery_wrap {
            padding: 15px 0;
        }
}




/*-- New Modal --*/
.newModaldesign .modal-dialog {
    border-radius: 16px;
    overflow: hidden;
    margin: 20px auto !important;
}

.newModaldesign {
    overflow: hidden;
}

    .newModaldesign .modal-dialog .modal-header {
        background-color: #F3F3F3;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        position: relative;
        min-height: 52px;
        padding: 10px 20px !important;
    }

        .newModaldesign .modal-dialog .modal-header h4 {
            font-size: 16px;
            line-height: 1;
            font-family: 'CircularStd-Book';
            color: #1c1c1c;
            margin: 0;
        }

        .newModaldesign .modal-dialog .modal-header::before, .newModaldesign .modal-dialog .modal-header::after {
            display: none;
        }

        .newModaldesign .modal-dialog .modal-header button {
            width: 30px;
            height: 30px;
            background-color: #ffffff;
            border-radius: 50%;
            color: rgba(28, 28, 28, 0.3);
            position: absolute;
            right: 20px;
            top: 50%;
            transform: translateY(-50%);
            margin: 0;
            transition: 0.3s all ease;
        }

            .newModaldesign .modal-dialog .modal-header button:hover {
                background-color: rgba(28, 28, 28, 0.3);
                color: #ffffff;
            }

    .newModaldesign label {
        font-family: 'CircularStd-Book';
        font-size: 12px;
        line-height: 1;
        color: #6f6969;
        margin: 0;
        /* display: flex;
        flex-wrap: wrap;
        align-items: center;*/
    }

    .newModaldesign input.form-control, .newModaldesign span.select2-selection, .newModaldesign textarea.form-control {
        font-size: 16px;
        line-height: 1;
        font-family: 'CircularStd-Book';
        color: #1C1C1C;
        border: 1px solid #EAEAEA !important;
        border-radius: 10px;
        padding: 12px 14px !important;
        height: auto !important;
        box-shadow: none !important;
    }

    .newModaldesign .modal-dialog .modal-body {
        padding: 16px 20px;
    }

    .newModaldesign .modal-body .row:last-child .form-group {
        margin: 0;
    }

    .newModaldesign input.form-control::placeholder {
        font-size: 16px;
        line-height: 1;
        font-family: 'CircularStd-Book';
        color: #999999;
    }

    .newModaldesign .iti.iti--allow-dropdown {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

        .newModaldesign .iti.iti--allow-dropdown input {
            padding-left: 50px !important;
        }

    .newModaldesign .modal-footer {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 15px !important;
        justify-content: space-between;
    }

        .newModaldesign .modal-footer::before, .newModaldesign .modal-footer::after {
            display: none;
        }

        .newModaldesign .modal-footer input, .newModaldesign .modal-footer button {
            font-family: 'CircularStd-Book';
            font-size: 14px;
            line-height: 1;
            text-transform: uppercase;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 13px 24px !important;
            border-radius: 10px;
            transition: 0.3s all ease;
            border: 0;
        }

            .newModaldesign .modal-footer input, .newModaldesign .modal-footer button.cancelbttn {
                background-color: #F3F3F3;
                border-color: #F3F3F3;
                color: #1C1C1C4D;
                box-shadow: none;
            }

                .newModaldesign .modal-footer input:hover, .newModaldesign .modal-footer button.cancelbttn:hover {
                    background-color: #1C1C1C4D;
                    color: #F3F3F3;
                }

        .newModaldesign .modal-footer button {
            box-shadow: none !important;
            background-color: #1A73E8;
            color: #fff;
        }

            .newModaldesign .modal-footer button:hover {
                opacity: 0.6;
                background-color: #1A73E8;
                color: #fff;
                border: 0;
            }



.tablesettingWrap {
    background-color: #ffffff;
    border-radius: 16px;
}

.tablesettingBody {
    padding: 10px;
}

    .tablesettingBody .dataTables_wrapper .dataTables_info {
        padding: 0;
        font-size: 12px;
        line-height: 1.2;
        color: #1C1C1C;
        font-family: 'CircularStd-Book';
    }

    .tablesettingBody .ColVis, .tablesettingBody .ColVis_Button {
        float: none;
        display: inline-block;
    }

    .tablesettingBody .dataTables_filter {
        display: inline-block;
    }

    .tablesettingBody .dataTables_wrapper .row {
        align-items: center;
        display: flex;
    }

    .tablesettingBody .dataTables_filter label {
        margin: 0;
    }

    .tablesettingBody .hpanel {
        margin: 0;
    }

    .tablesettingBody .dataTables_scroll .dataTables_scrollHeadInner table {
        overflow: hidden;
        background-color: #F3F3F3;
        border-radius: 0;
    }

body, .wrapper > section {
    background-color: #F3F3F3;
}

    body .customerFeedbackReportpg .tablesettingTabsRight .dropdownDrivemenu.overlapMenu {
        transform: translateY(55px);
    }

.feedbackWrapContent p {
    max-height: 80px;
    min-height: 80px;
    overflow: auto;
}

.startwrap.fivestar label.star-rating__ico.fa.fa-star-o.fa-lg::before {
    color: #ffce00;
}

.startwrap.fourstar label.star-rating__ico.fa.fa-star-o.fa-lg:not(:last-child)::before {
    color: #ffce00;
}

.startwrap.threestar label.star-rating__ico.fa.fa-star-o.fa-lg:not(:nth-child(n+4))::before {
    color: #ffce00;
}

.startwrap.twostar label.star-rating__ico.fa.fa-star-o.fa-lg:not(:nth-child(n+3))::before {
    color: #ffce00;
}

.startwrap.onestar label.star-rating__ico.fa.fa-star-o.fa-lg:first-child::before {
    color: #ffce00;
}

.ratingLivegrROWS + .ratingLivegrROWS {
    margin-top: 4px;
}

.tablesettingBody .dataTables_scroll .dataTables_scrollHeadInner table th {
    font-size: 12px;
    line-height: 1.2;
    text-transform: uppercase;
    color: rgba(0, 0, 0, .7) !important;
    background-color: #F3F3F3;
    border-left: 0;
    border-right: 0;
}

.tablesettingBody .dataTables_scroll .dataTables_scrollBody th, .tablesettingBody .dataTables_scroll .dataTables_scrollBody td {
    border-left: 0;
    border-right: 0;
}

.tablesettingBody .dataTables_wrapper .dataTables_scroll + .row {
    background-color: #F3F3F3;
    margin: 0;
}

.dropdownDrivemenu {
    border-radius: 10px;
    box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.15);
    border: 0;
    padding: 0 10px;
    margin: 0;
    list-style: none;
    padding: 0;
    margin: 0;
    background: #ffffff;
}

    .dropdownDrivemenu li a {
        font-size: 14px;
        line-height: 1;
        color: rgba(28, 28, 28, 0.7);
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 10px;
        gap: 10px;
    }

    .dropdownDrivemenu li + li {
        border-top: 1px solid rgba(0, 0, 0, 0.1);
    }

    .dropdownDrivemenu.overlapMenu {
        position: absolute;
        min-width: 160px;
        right: 0;
        z-index: 99;
        transform: translateY(20px);
        opacity: 0;
        visibility: hidden;
        transition: 0.3s all ease-in-out;
        width: 200px;
    }

.btn-group.open .dropdownDrivemenu.overlapMenu {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    transition: 0.3s all ease-in-out;
    z-index: 999;
}

.tablesettingHead {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 7px 20px;
    border-bottom: 1px solid #F3F3F3;
}

    .tablesettingHead h2 {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        margin: 0;
        gap: 10px;
        font-size: 24px;
        line-height: 1;
        color: #1C1C1C;
    }

        .tablesettingHead h2 .back-button {
            color: #111111;
        }

.tablesettingTabswrap {
    background-color: #1A73E81A;
    border-radius: 10px;
    padding: 2px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: 30px;
}

    .tablesettingTabswrap .btn {
        font-size: 12px;
        line-height: 1;
        color: rgba(0, 0, 0, 0.5);
        box-shadow: none;
        border-radius: 8px;
        padding: 6px 19px;
    }

        .tablesettingTabswrap .btn.active {
            background-color: #fff;
            color: #1A73E8;
        }

.tablesettingTabsRight {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

    .tablesettingTabsRight .view-btn {
        border: 0;
        padding: 0;
        width: 30px;
        height: 30px;
        background-color: rgba(0, 0, 0, 0.05);
        border-radius: 50%;
    }

    .tablesettingTabsRight .btn-group {
        margin-left: 10px;
    }

    .tablesettingTabsRight .btn-blue-new {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px;
        background-color: #1A73E81A;
        font-size: 14px;
        line-height: 1;
        color: #1A73E8;
        padding: 8px 11px;
        border-radius: 10px;
    }

        .tablesettingTabsRight .btn-blue-new em {
            padding: 0;
            width: 16px;
            height: 16px;
            background-color: #1A73E8;
            color: #ffffff;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 5px;
            font-size: 12px;
            line-height: 1;
        }


.vieworderpage .titleScreenwrap .tablesettingTabswrap {
    margin-left: auto;
}

.vieworderpage .titleScreenwrap .tablesettingTabsRight {
    margin-left: 10px;
}

.vieworderpage .tablesettingTabswrap .select2 span {
    font-size: 12px;
    line-height: 1;
    color: #1C1C1C;
}

.vieworderpage .tablesettingTabswrap .select2 .select2-selection {
    display: flex;
    align-items: center;
    border-radius: 8px;
    border: 0;
    box-shadow: none !important;
    height: auto;
    padding: 10px 65px 10px 10px;
}



.headsectionrightinfo ul .notificationicon .dropdown-menu.notificationNewdesign-section #VehicleAlertCountDiv {
    padding: 0;
}


.headersectionmenuwrap .toggleMenusquare {
    padding-right: 30px;
    border-right: 2px solid rgba(255, 255, 255, 0.3);
    margin-right: -10px;
}

.headsectionrightinfo ul .notificationicon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .headsectionrightinfo ul .notificationicon .dropdown-menu {
        right: -24px;
        left: auto;
        top: 40px;
    }

        .headsectionrightinfo ul .notificationicon .dropdown-menu #VehicleAlertCountDiv {
            padding: 8px 0px;
        }

            .headsectionrightinfo ul .notificationicon .dropdown-menu #VehicleAlertCountDiv a {
                display: flex;
                flex-wrap: wrap;
                align-items: center;
                gap: 10px;
            }



.vieworderpage .tablesettingBody .dataTables_length {
    margin: 0;
}

    .vieworderpage .tablesettingBody .dataTables_length label {
        margin: 0;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        font-size: 12px;
        line-height: 1;
        color: #999999;
    }

        .vieworderpage .tablesettingBody .dataTables_length label .form-control {
            margin: 0;
            border: 1px solid #F3F3F3;
            background: #FFF;
            border-radius: 8px;
            width: 60px;
            font-size: 12px;
        }

.vieworderpage .tablesettingBody .pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.vieworderpage .tablesettingBody div.dataTables_paginate ul.pagination, .vieworderpage .tablesettingBody div.dataTables_paginate {
    margin: 0;
}

.vieworderpage .tablesettingBody .dataTables_wrapper .dataTables_scroll + .row {
    padding: 5px 12px;
}

.vieworderpage .tablesettingBody .pagination a {
    font-size: 12px;
    line-height: 1;
    padding: 0;
    background-color: transparent;
    border: 0;
    color: rgba(28, 28, 28, 0.4);
}

.vieworderpage .tablesettingBody .pagination .paginate_button.previous a, .vieworderpage .tablesettingBody .pagination .paginate_button.next a {
    font-size: 0;
    line-height: 0;
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #FFFFFF;
    border-radius: 8px;
    color: #1C1C1C;
}

    .vieworderpage .tablesettingBody .pagination .paginate_button.previous a::before, .vieworderpage .tablesettingBody .pagination .paginate_button.next a::before {
        font-size: 20px;
        line-height: 1;
        position: static;
    }

.px0 {
    padding-left: 0;
    padding-right: 0;
}



.addOnecontentwrap {
    background-color: #FFFFFF;
    border-radius: 18px;
}



.addOnecontentheadwrap .navigationadd {
    margin: 0;
    padding: 0 30px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-bottom: 1px solid #F3F3F3;
    margin-bottom: 24px;
}

    .addOnecontentheadwrap .navigationadd a {
        display: block;
        font-size: 16px;
        line-height: 1;
        color: rgba(28, 28, 28, 0.5);
        padding: 12px 15px;
        transition: 0.5s all ease-in-out;
        position: relative;
    }

        .addOnecontentheadwrap .navigationadd a::after {
            content: '';
            position: absolute;
            width: 100%;
            height: 2px;
            bottom: 0;
            left: 0;
            right: 0;
            background: transparent;
        }

    .addOnecontentheadwrap .navigationadd .active a::after {
        background-color: #1A73E8;
    }

    .addOnecontentheadwrap .navigationadd a:hover, .addOnecontentheadwrap .navigationadd .active a {
        color: #1C1C1C;
    }

    .addOnecontentheadwrap .navigationadd a label {
        margin: 0;
        display: block;
    }

.addOnecontentwrap {
    background-color: #FFFFFF;
    border-radius: 18px;
}

.addOnecontentfootwrap {
    padding: 0 30px 30px;
}

    .addOnecontentfootwrap .dashbaord---box-content-row {
        gap: 15px;
        display: grid;
        grid-template-columns: repeat(3,1fr);
    }

        .addOnecontentfootwrap .dashbaord---box-content-row .dashbaord---box-content-col {
            width: 100%;
        }




.iconbutton {
    border-radius: 10px;
    background: #1A73E8;
    border: 0;
    outline: 0;
    color: #ffffff;
    padding: 11px 16px;
    gap: 6px;
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 1;
    transition: 0.3s all ease;
}

    .iconbutton img {
        filter: brightness(0) invert(1);
    }

    .iconbutton:hover {
        opacity: 0.6;
        background-color: #1A73E8;
        color: #fff;
    }



.titleScreenwrap h2 + a#btnRouteOptimization {
    margin-left: 20px;
}

.vieworderpage .tablesettingBody {
    padding: 0;
    border-radius: 16px;
    background: #FFF;
    overflow: hidden;
}

    .vieworderpage .tablesettingBody .panel-body {
        border: 0;
        padding: 10px 12px;
    }

.orderheaderwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 10px 10px;
}

    .orderheaderwrap p.show-result-text {
        margin: 0;
        font-size: 12px;
        line-height: 1.2;
        color: #1C1C1C;
    }

        .orderheaderwrap p.show-result-text span {
            color: #999999;
        }

.statusbarWrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: auto;
    gap: 12px;
}

    .statusbarWrap a.v-summary {
        font-size: 13px;
        line-height: 1;
        background: rgba(28, 28, 28, 0.10);
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        border-radius: 6px;
        padding: 7px 12px 7px 1px;
        position: relative;
        margin-right: 13px;
    }

        .statusbarWrap a.v-summary .label {
            position: absolute;
            right: -12px;
            font-size: 14px;
            line-height: 1;
            padding: 0;
            width: 25px;
            height: 25px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 6px;
        }

.rider-wallet-amount {
    margin-right: -10px !important;
    width: 60px !important;
}

.statusbarWrap a.v-summary.count-unassigned {
    background: rgba(28, 28, 28, 0.10) !important;
}

.statusbarWrap a.v-summary.count-assigned {
    background: rgba(45, 182, 126, 0.10) !important;
}

.statusbarWrap a.v-summary.count-in-progress {
    background: rgba(235, 178, 45, 0.10) !important;
}

.statusbarWrap a.v-summary.count-on-failed {
    background: rgba(223, 29, 90, 0.10) !important;
}

.statusbarWrap a.v-summary.count-completed {
    background: rgba(45, 182, 126, 0.10) !important;
}


.statusbarWrap a.v-summary.count-unassigned .label {
    background-color: #1C1C1C;
}

.statusbarWrap a.v-summary.count-unassigned-new .label {
    background-color: #5d85f5;
}

.statusbarWrap a.v-summary.count-assigned .label {
    background-color: #2DB67E;
}

.statusbarWrap a.v-summary.count-in-progress .label {
    background-color: #EBB22D;
}

.statusbarWrap a.v-summary.count-on-failed .label {
    background-color: #DF1D5A;
}

.statusbarWrap a.v-summary.count-completed .label {
    background-color: #2DB67E;
}

.filterlistwrap button {
    border: 1px solid #F3F3F3;
    background: #FFF;
    border-radius: 8px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    padding: 0;
}

.search-date-wrap {
    margin-left: 10px;
    display: flex;
    align-items: center;
    border: 1px solid #F3F3F3;
    background: #FFF;
    border-radius: 8px;
    border-left: 1px solid #F3F3F3;
}

    .search-date-wrap input[type="search"] {
        border: 0;
        font-size: 13px;
        line-height: 1.5;
        color: rgba(28, 28, 28, 0.3);
        padding: 9px 12px;
        max-width: 100%;
        width: 253px;
        background-color: transparent;
        border-right: 1px solid #F3F3F3;
    }

    .search-date-wrap button {
        display: flex;
        align-items: center;
        padding: 4px 9px;
        border: 0;
        background-color: transparent;
        font-size: 13px;
        line-height: 2;
    }

.date-range-picker {
    gap: 9px;
}

    .date-range-picker i:last-child {
        margin-left: 30px;
    }

.search-date-wrap button .icon-calendar {
    font-size: 18px;
    line-height: 1;
    color: #1C1C1C;
    opacity: 0.3;
}


.titleScreenwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 20px 0;
}

    .titleScreenwrap .searchNewWrap {
        margin-left: auto;
        max-width: 360px;
        width: 100%;
        position: relative;
    }

    .titleScreenwrap h2 {
        font-size: 32px;
        line-height: 1.2;
        font-family: 'CircularStd-Black';
        color: #1C1C1C;
        margin: 0;
    }


.Customcontainer {
    max-width: 100%;
    margin: 0 auto;
    padding: 0 15px;
}

.whiteboxmainsection .Customcontainer {
    padding: 15px !important;
    padding-top: 0px !important;
}

/*-- Form Add --*/
.whiteboxmainWrap {
    border-radius: 16px;
    background: #FFF;
    margin-bottom: 72px;
}

.whiteboxHeader {
    padding: 7px 20px;
    border-bottom: 1px solid #F3F3F3;
}

    .whiteboxHeader h2 {
        margin: 0;
        font-size: 24px;
        line-height: 1;
        font-family: 'CircularStd-Book';
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 15px;
    }

    .whiteboxHeader .back-button {
        color: #111111;
        font-size: 130%;
        line-height: 1;
    }

.whiteboxBody {
    padding: 16px 20px;
}

    .whiteboxBody h3 {
        font-family: 'CircularStd-Book';
        font-size: 14px;
        line-height: 1;
        color: rgba(28, 28, 28, 0.4);
        margin: 0 0 16px;
    }

    .whiteboxBody label.label-control {
        font-family: 'CircularStd-Book';
        font-size: 12px;
        line-height: 2;
        margin: 0 0 2px;
        color: #999999;
    }

    .whiteboxBody input.form-control, .whiteboxBody select.form-control, .whiteboxBody .form-group .select2-selection {
        width: 100%;
        font-size: 12px;
        line-height: 1 !important;
        font-family: 'CircularStd-Book';
        padding: 10px 12px;
        border-radius: 10px;
        height: auto;
        border: 1px solid #EAEAEA !important;
        box-shadow: none !important;
    }


    .whiteboxBody .iti--allow-dropdown {
        width: 100%;
    }

    .whiteboxBody .row {
        display: flex;
        flex-wrap: wrap;
        row-gap: 12px;
    }

    .whiteboxBody .form-group {
        margin: 0;
    }

    .whiteboxBody .row::before, .whiteboxBody .row::after {
        display: none;
    }

    .whiteboxBody .iti--allow-dropdown input.form-control {
        padding-left: 50px;
    }

    .whiteboxBody hr {
        margin: 20px 0;
    }

.whiteboxmainWrap + .whiteboxmainWrap {
    margin-top: 27px;
}

.whiteboxFooterWrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background: #FFF;
    position: fixed;
    bottom: 0;
    z-index: 9;
    width: 100%;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.button-normal, .newModaldesign .button-normal.button-green {
    font-size: 14px;
    line-height: 1;
    text-transform: uppercase;
    border: 0;
    padding: 13px 24px;
    background-color: transparent;
    border-radius: 10px;
    transition: 0.3s all ease;
}

    .button-normal.button-grey {
        color: #1C1C1C4D;
        background: #F3F3F3;
    }

    .button-normal.button-blue {
        background: #1A73E8;
        color: #FFFFFF;
    }

    .button-normal.button-red {
        background: #f05050;
        color: #FFFFFF;
    }

.gap-2 {
    gap: 10px;
}

.button-normal:hover {
    opacity: 0.8
}

.Customcontainer > .tablesettingWrap {
    margin-top: 10px;
}

.whiteboxBody .form-group .input-group.group-material {
    width: 100%;
}

    .whiteboxBody .form-group .input-group.group-material .input-group-addon {
        position: absolute;
        right: 16px;
        padding: 0;
        display: block;
        width: auto;
        z-index: 2;
        top: 50%;
        transform: translateY(-50%);
    }

    .whiteboxBody .form-group .input-group.group-material input {
        border-radius: 10px;
        padding-right: 40px;
    }


.imageUpload {
    margin: 0;
    width: 100%;
    border-radius: 10px;
    border: 1px solid #EAEAEA;
    background: rgba(26, 115, 232, 0.10);
    font-size: 12px;
    line-height: 1;
    font-family: 'CircularStd-Book';
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 1px 5px;
    cursor: pointer;
}

    .imageUpload input {
        position: absolute;
        width: 0;
        height: 0;
        font-size: 0;
        line-height: 0;
        visibility: hidden;
        opacity: 0;
    }

    .imageUpload .browse {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        color: #999999;
    }

    .imageUpload .upload {
        text-transform: uppercase;
        color: #1A73E8;
    }


.normalbttn {
    font-family: 'CircularStd-Book';
    font-size: 14px;
    line-height: 1;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 13px 24px;
    border-radius: 10px;
    transition: 0.3s all ease;
    border: 1px solid #eaeaea;
    background-color: #F3F3F3;
    border-color: #F3F3F3;
    color: #1C1C1C4D;
    box-shadow: none;
    transition: 0.3s all ease-in-out;
}

    .normalbttn:hover {
        background-color: #1C1C1C4D;
        color: #F3F3F3;
    }

    .normalbttn.blue {
        background-color: #1A73E8;
        color: #fff;
        cursor: pointer;
    }

.optimizeprocessmodal h3 {
    margin: 0;
    text-align: center;
    font-size: 16px;
    line-height: 1.4;
    color: grey;
}

.v-summary.active {
    /*box-shadow: rgba(50, 50, 93, 0.2) 0px 0px 7px 3px;*/
}

.normalbttn.blue:hover {
    opacity: 0.6;
    background-color: #1A73E8;
    color: #fff;
}

.newfooterctaWrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.searchFilterwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background-color: #F3F3F3;
    border-radius: 8px;
    padding: 8px 16px;
    justify-content: space-between;
    margin-bottom: 12px;
}

    .searchFilterwrap p {
        margin: 0;
        font-family: 'CircularStd-Book';
        /*font-size: 12px;*/
        line-height: 1.2;
        color: #1C1C1C;
        /*opacity: 1;*/
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
    }

    .searchFilterwrap .closebttn {
        width: 30px;
        height: 30px;
        background-color: #FFFFFF;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #1C1C1C;
    }

        .searchFilterwrap .closebttn i {
            line-height: 1;
            font-size: 20px;
            opacity: 0.5;
        }

    .searchFilterwrap p .sample-file-wrap {
        font-size: 12px;
        line-height: 1;
        gap: 5px;
        display: inline-flex;
        border: 1px solid #1A73E81A;
        background: #ffffff;
        padding: 6px 5px;
        border-radius: 8px;
        color: #1A73E8;
    }

        .searchFilterwrap p .sample-file-wrap i {
            padding: 0;
        }

    .searchFilterwrap p span {
        opacity: 0.5;
    }





    .searchFilterwrap .input-group {
        width: 460px;
        max-width: 100%;
        border: 1px solid #EAEAEA;
        background-color: #ffffff;
        position: relative;
        border-radius: 10px;
        overflow: hidden;
    }

        .searchFilterwrap .input-group input.form-control {
            width: 100%;
            background-color: #ffffff;
            border: 0;
        }

        .searchFilterwrap .input-group .input-group-btn:first-child {
            position: absolute;
            left: 0;
            top: 0;
            color: #999999;
            font-size: 12px;
            line-height: 1;
            width: auto;
        }

        .searchFilterwrap .input-group .input-group-btn:last-child {
            left: auto;
            right: 14px;
            position: absolute;
            width: auto;
            z-index: 9;
            top: 50%;
            transform: translateY(-50%);
        }

        .searchFilterwrap .input-group span.input-group-btn:first-child {
            font-family: 'CircularStd-Book';
            font-size: 12px;
            line-height: 1;
            z-index: 9;
            top: 50%;
            transform: translateY(-50%);
            left: 4px;
            background-color: #ffffff;
            padding: 8px 10px 8px 26px;
            background-image: url("data:image/svg+xml,%0A%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.1667 1.84207C12.825 1.5004 12.2333 1.73373 12.2333 2.20873V5.11707C12.2333 6.33373 13.2667 7.34207 14.525 7.34207C15.3167 7.3504 16.4167 7.3504 17.3583 7.3504C17.8333 7.3504 18.0833 6.79207 17.75 6.45873C16.55 5.2504 14.4 3.0754 13.1667 1.84207Z' fill='%231C1C1C' opacity='0.3'/%3E%3Cpath d='M17.0833 8.49199H14.675C12.7 8.49199 11.0917 6.88366 11.0917 4.90866V2.50033C11.0917 2.04199 10.7167 1.66699 10.2583 1.66699H6.725C4.15834 1.66699 2.08334 3.33366 2.08334 6.30866V13.692C2.08334 16.667 4.15834 18.3337 6.725 18.3337H13.275C15.8417 18.3337 17.9167 16.667 17.9167 13.692V9.32533C17.9167 8.86699 17.5417 8.49199 17.0833 8.49199ZM9.58334 14.792H6.25C5.90834 14.792 5.625 14.5087 5.625 14.167C5.625 13.8253 5.90834 13.542 6.25 13.542H9.58334C9.925 13.542 10.2083 13.8253 10.2083 14.167C10.2083 14.5087 9.925 14.792 9.58334 14.792ZM11.25 11.4587H6.25C5.90834 11.4587 5.625 11.1753 5.625 10.8337C5.625 10.492 5.90834 10.2087 6.25 10.2087H11.25C11.5917 10.2087 11.875 10.492 11.875 10.8337C11.875 11.1753 11.5917 11.4587 11.25 11.4587Z' fill='%231C1C1C' opacity='0.3'/%3E%3C/svg%3E%0A");
            background-repeat: no-repeat;
            background-position: center left;
        }

        .searchFilterwrap .input-group input#FlUploadcsv, .searchFilterwrap .input-group input#DriverBulkFilelUploadcsv {
            font-size: 12px;
            line-height: 0;
            padding: 7px 50px 7px 10px;
            width: 100%;
            appearance: none;
        }

        .searchFilterwrap .input-group .input-group-btn:last-child button {
            font-size: 12px;
            line-height: 3;
            padding: 0;
            background-color: transparent;
            border: 0;
            color: #1A73E8;
            text-transform: uppercase;
            /*letter-spacing: 1.5px;*/
            /*margin: 0px -13px 0 0 !important;*/
        }

.orderMainClass .Customcontainer {
    margin-top: -20px !important;
}


.starReportWrap ul {
    margin: 0;
    padding: 0 35px 0;
    list-style: none;
    column-count: 3;
}

    .starReportWrap ul li {
        gap: 10px;
        padding: 10px 0px;
    }

        .starReportWrap ul li .staringWrap i {
            color: rgba(128, 128, 128, 0.4);
            display: block;
        }

        .starReportWrap ul li a {
            color: #000000;
        }

.dropdownawrapSlct {
    margin-left: 10px;
}

    .dropdownawrapSlct .select2-selection.select2-selection--single {
        border: 0;
        min-width: 140px;
        border-radius: 8px;
    }

        .dropdownawrapSlct .select2-selection.select2-selection--single > span:first-child {
            display: block;
            margin-top: 2px;
        }


.dropdown.lang_dropdown.lang_dropdown_Wrap {
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
}

    .dropdown.lang_dropdown.lang_dropdown_Wrap button label {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        line-height: 1;
        color: #1C1C1C;
    }

        .dropdown.lang_dropdown.lang_dropdown_Wrap button label .roundColor {
            width: 14px;
            height: 14px;
            border-radius: 50%;
        }

    .dropdown.lang_dropdown.lang_dropdown_Wrap button {
        background-color: transparent;
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        padding: 6px 8px;
        color: #1C1C1C;
    }

        .dropdown.lang_dropdown.lang_dropdown_Wrap button .caret {
            border: 0;
            width: 20px;
            height: 20px;
            background-image: url("data:image/svg+xml,%0A%3Csvg width='14' height='8' viewBox='0 0 14 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.28 1.96667L7.9333 6.31334C7.41997 6.82668 6.57997 6.82668 6.06664 6.31334L1.71997 1.96667' stroke='%23000000' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
            background-repeat: no-repeat;
            background-position: center;
            opacity: 0.6;
        }

.lang_dropdown_Wrap .dropdown-menu.dropdown-menu-right {
    width: 100%;
    border-radius: 6px;
    max-height: 160px;
    overflow: auto;
}


.appversion-wrap {
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    text-align: center;
}

    .appversion-wrap p {
        margin: 0;
        font-size: 12px;
        line-height: 1.2;
        color: rgba(28, 28, 28, 1.3);
    }


.profileINfosidebar {
    position: relative;
    min-height: calc(100vh - 55px);
    padding-bottom: 30px;
}


.profileThumbWrap {
    padding: 0 20px 20px;
    text-align: center;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    margin-bottom: 20px;
}

.profileThumbimg {
    display: inline-flex;
    position: relative;
}

    .profileThumbimg img {
        width: 55px;
        height: 55px;
        border-radius: 50%;
    }

    .profileThumbimg .circle-lg {
        margin: 0;
        position: absolute;
        right: 2px;
        bottom: 2px;
        border: 1px solid #ffffff;
    }

.profileThumbimgname {
    margin-top: 5px;
}

    .profileThumbimgname span {
        font-weight: bold;
        display: block;
        line-height: 1;
    }

.profileThumb-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    justify-content: center;
}

    .profileThumb-info a {
        font-size: 12px;
        line-height: 1;
        font-weight: normal;
        padding: 8px 10px;
        border-radius: 6px;
    }

        .profileThumb-info a.changePsw {
            background-color: rgba(33, 150, 243, 0.2);
            color: #0099ff;
        }

        .profileThumb-info a.logoutBtnn {
            color: red;
            background-color: rgba(255, 0, 0, 0.2);
        }

.item.user-block label {
    font-size: 12px;
    line-height: 1.2;
    margin: 0;
    color: rgba(0,0,0,0.6);
}

.notificationWrapbox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    padding: 6px 10px;
    gap: 10px;
    justify-content: space-between;
}

    .notificationWrapbox p.pull-left {
        margin: 0;
    }

    .notificationWrapbox p.pull-left {
        font-size: 13px;
        line-height: 1;
    }

    .notificationWrapbox label.switch {
        display: block;
    }

.mt2 {
    margin-top: 12px;
}


.dashboardmap-popup {
    margin: -14px 0px 0px 170px !important;
    line-height: 1.5;
    text-align: center;
}



/*-- Route Plan --*/
.route-plans--newsection {
    padding: 20px 0;
}

.route-plans--newwrap {
    background-color: #ffffff;
    border-radius: 16px;
}

.route-plans--newbody {
    padding: 20px;
}

.route-plans--newhead {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 14px 20px;
    border-bottom: 1px solid #F3F3F3;
}

.route-plans-titlehead-counter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

    .route-plans-titlehead-counter h3 {
        font-size: 24px;
        line-height: 1;
        margin: 0;
        color: #1C1C1C;
    }

.route-planshead-newinfo {
    margin-left: auto;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

    .route-planshead-newinfo button.view-btn {
        min-width: 30px;
        height: 30px;
        border-radius: 50%;
        border: 0;
        background-color: rgba(0, 0, 0, 0.05);
        color: rgba(0, 0, 0, 0.5);
        padding: 0;
    }

    .route-planshead-newinfo .btn-blue-new {
        font-size: 14px;
        line-height: 1;
        background-color: #1A73E81A;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px;
        padding: 7px 10px;
        text-transform: uppercase;
        border-radius: 10px;
    }

        .route-planshead-newinfo .btn-blue-new em {
            padding: 0;
            width: 16px;
            height: 16px;
            background-color: #1A73E8;
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 5px;
            font-size: 14px;
            line-height: 1;
        }

.route-planshead-searchwrap, .route-planshead-datewrap #daterange-picker-report {
    min-width: 260px;
}

    .route-planshead-searchwrap input {
        font-size: 10px;
        line-height: 1;
        color: black;
        border: 1px solid #F3F3F3;
        padding: 8px 12px;
        width: 100%;
        border-radius: 8px;
    }

.route-planshead-datewrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-left: 6px;
}

    .route-planshead-datewrap #daterange-picker-report {
        font-size: 12px;
        line-height: 1;
        color: #1C1C1C;
        border: 1px solid #F3F3F3;
        padding: 7px 10px;
        background-color: transparent;
        border-radius: 8px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
    }

        .route-planshead-datewrap #daterange-picker-report i {
            color: rgba(28, 28, 28, 0.3);
        }

    .route-planshead-datewrap button:last-child {
        font-size: 12px;
        line-height: 1;
        text-transform: uppercase;
        background-color: #1A73E8;
        color: #ffffff;
        border: 0;
        outline: 0;
        padding: 7px 12px;
        border-radius: 10px;
    }

.route-planshead-searchwrap {
    margin-left: 20px;
}

.route-plans--newbody .delivery-map {
    height: 100%;
    min-height: calc(100vh - 145px);
    border-radius: 10px;
    overflow: hidden;
}

.route-plans--newbody #RoutePlanListDiv > .row {
    display: flex;
    flex-wrap: wrap;
}

    .route-plans--newbody #RoutePlanListDiv > .row::before, .route-plans--newbody #RoutePlanListDiv > .row::after {
        display: none;
    }

.routeplanslistingbox + .routeplanslistingbox {
    margin-top: 16px;
}

.routeplanslistingboxwrap {
    height: 100%;
    max-height: calc(100vh - 195px);
    overflow: auto;
}

.routeplanslistingboxTopradiusUpper {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 10px 16px;
    border-bottom: 1px solid #F3F3F3;
}

.routeplanslistingboxTopradiusUpperRight {
    margin-left: auto;
}

    .routeplanslistingboxTopradiusUpperRight .routes-right {
        padding: 0;
        width: auto;
    }

        .routeplanslistingboxTopradiusUpperRight .routes-right .info-bttn {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            border: 0;
            background-color: rgba(0, 0, 0, 0.05);
            color: rgba(0, 0, 0, 0.5);
            padding: 0;
        }

.routeplanslistingboxTopradiusUpperLeft {
    display: flex;
    flex-wrap: wrap;
}

    .routeplanslistingboxTopradiusUpperLeft > div {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .routeplanslistingboxTopradiusUpperLeft .mainTitle {
        font-size: 18px;
        line-height: 1.2;
        color: #1C1C1C;
    }

    .routeplanslistingboxTopradiusUpperLeft .badgewrap {
        margin-left: 16px;
    }

.badgewrap .task-status-pill {
    font-size: 12px;
    line-height: 1;
    color: #DF1D5A;
    background-color: #DF1D5A1A;
    padding: 4.5px 7px;
    border-radius: 6px;
}

.badgewrap .task-status-pill-draft {
    font-size: 12px;
    line-height: 1;
    color: #1c41e2;
    background-color: #5097d71a;
    padding: 4.5px 7px;
    border-radius: 6px;
}

.badgewrap .task-status-pill-optimize {
    font-size: 12px;
    line-height: 1;
    color: #036406;
    background-color: #bbf1b4;
    padding: 4.5px 7px;
    border-radius: 6px;
}

.badgewrap .task-status-pill-dispatched {
    font-size: 12px;
    line-height: 1;
    color: #036406;
    background-color: #d9f2e7;
    padding: 4.5px 7px;
    border-radius: 6px;
}

.route-point-dispatched {
    background-color: #d9f2e7;
}

.routeplanslistingboxTopradius {
    border: 1px solid #F3F3F3;
    border-radius: 10px;
}

.routeplanslistingboxTopradiusUpperLeft > div:last-child {
    gap: 4px;
    margin-top: 4px;
}

    .routeplanslistingboxTopradiusUpperLeft > div:last-child p {
        margin: 0;
        font-size: 12px;
        line-height: 1.2;
        color: #1C1C1C;
        opacity: 0.5;
    }

.routeplanslistingboxTopradiusLower {
    padding: 8px 16px 16px;
}

    .routeplanslistingboxTopradiusLower .routes--badge .routes-badge-title {
        display: block;
    }

    .routeplanslistingboxTopradiusLower .routes-badges-wrap {
        justify-content: space-between;
    }

    .routeplanslistingboxTopradiusLower .routes-badge-title {
        font-size: 10px;
        line-height: 1.2;
        color: #1C1C1C;
        opacity: 0.5;
    }

    .routeplanslistingboxTopradiusLower .routes-badge-body {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
        margin-top: 4px;
    }

        .routeplanslistingboxTopradiusLower .routes-badge-body span {
            font-size: 14px;
            line-height: 1.2;
            color: #1C1C1C;
        }

.routeplanslistingboxopen .routeplanslistingboxTopradius {
    border-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-color: #1A73E84D;
    background-color: #1A73E808;
}

.routeplanslistingboxopen .routeplanslistingboxTopInfo .white-radius-card {
    border-top: 0;
    border-color: #1A73E84D;
    background-color: #1A73E808;
    border-radius: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    padding: 0 10px 10px;
}

.align-items-end {
    align-items: flex-end;
}

.d-flex {
    display: flex;
}

.lightgreen-bttn {
    font-size: 14px;
    line-height: 1;
    text-transform: uppercase;
    color: #32C787;
    background-color: rgba(50, 199, 135, 0.1);
    padding: 15px 25px;
    display: inline-block;
    border-radius: 10px;
    transition: 0.3s all ease-in-out;
}

.notification-pref-checkbox-list .lable_show_only.active {
    background: #32C787;
    color: #ffffff;
}

.lightgreen-bttn:hover {
    background-color: rgba(50, 199, 135, 0.3);
}

.favouriteRow.yellow .reportConHead {
    background: #EBB22D1A;
}

.alert-row-wrap {
    display: flex;
    flex-wrap: wrap;
}

.alert-row--left {
    max-width: 350px;
}

.alert-row--right {
    max-width: calc(100% - 350px);
}

.alert-row--left #section-alertvehicle {
    max-height: calc(100vh - 210px);
}

.alert-row--right .VehicleAlertDivScroll {
    max-height: calc(100vh - 150px);
}

.whiteBoxnewboxed-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

    .whiteBoxnewboxed-top h4 {
        width: auto;
    }

.alert-row--right .whiteBoxnewRow + .whiteBoxnewRow {
    margin-top: 20px;
}

.alert-row--right .whiteBoxnewRow .whiteBoxnewCols {
    width: calc(25% - 15px);
    flex: calc(25% - 15px);
}





/**/
.deliveryTopheader {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.deliveryTopheaderRight h3 {
    font-size: 20px;
    line-height: 1.2;
    margin: 0;
    font-family: 'CircularStd-Black';
    color: green;
}

.deliveryTopheaderRight p {
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
    font-family: 'CircularStd-Book';
}

.deliverySecwrap {
    max-width: 600px;
    z-index: 9;
    position: relative;
    background-color: #ffffff;
    padding: 15px 15px;
    border-radius: 10px;
    margin: 0 auto;
}

.deliveryBodyWrap {
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    padding: 12px 12px;
    margin: 20px 0px 0;
}

.deliveryBodyRow > label {
    display: block;
    width: 100%;
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
    font-family: 'CircularStd-Book';
}

.deliveryBodyRow + .deliveryBodyRow {
    margin-top: 18px;
}

.deliveryBodyRow .checkbox-group {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 15px 20px;
    margin-top: 10px;
}

    .deliveryBodyRow .checkbox-group .checkbox {
        margin: 0;
    }

div#CustomerFeedback .deliveryBodyRow .jqEmoji {
    width: auto;
    height: auto;
}

.deliveryBodyRow .checkbox-group .checkbox label {
    font-size: 12px;
    line-height: 1.2;
    display: inline-flex;
    align-items: center;
    font-family: 'CircularStd-Book';
}

.deliveryBodyRow textarea {
    padding: 0;
    font-family: 'CircularStd-Book';
    font-size: 14px;
    line-height: 1.2;
    background-color: transparent;
}

.deliveryBodyRow .checkbox-group .checkbox label {
    font-size: 12px;
    line-height: 1.2;
    display: inline-flex;
    align-items: center;
}

.deliveryBodyRow textarea {
    padding: 0;
    font-family: 'CircularStd-Book';
    font-size: 14px;
    line-height: 1.2;
}

.deliveryBodyRow p.text-muted {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 20px;
    font-family: 'CircularStd-Book';
    color: #8D8D8D;
}

.deliveryHeader_section {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99;
    padding: 15px 10px;
    background-color: white;
}

.deliveryHeaderwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    max-width: calc(100% - 390px);
    justify-content: space-between;
}

    .deliveryHeaderwrap .headermonitorDelivery_Left h3 {
        margin: 0;
    }

.trackOrderboxBottom .bottom .deliveryBodyRow textarea {
    padding: 0;
    border: 1px solid #EAEAEA;
    border-radius: 10px;
    margin-top: 2px;
    padding: 10px;
}

.trackOrderboxBottom .bottom .deliveryBodyRow button {
    width: 100%;
}


.leftStickyWrap {
    position: fixed;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: auto;
    height: auto;
    box-shadow: 0px 0px 16px #0000001A;
}

    .leftStickyWrap a {
        font-size: 22px;
        line-height: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #ffffff;
        width: 45px;
        height: 45px;
        text-decoration: none !important;
    }

        .leftStickyWrap a:hover {
            text-decoration: none;
        }

        .leftStickyWrap a img {
            width: 30px;
        }

section.deliveryHeaderScreen .track-task-tab {
    height: auto;
    margin-top: 65px;
}

.deliveryBodyRow textarea {
    max-height: 50px;
    resize: none;
}


#CustomerFeedback #MainContent div#FeedbackDiv, #CustomerFeedback #MainContent div#reviewSubmitwrap {
    margin-top: 25px;
    max-width: calc(100% - 300px);
}

section.deliveryHeaderScreen .track-task-tab #gTrackTaskFleetMap {
    min-height: calc(100vh - 65px);
}

.reviewsubmitAlertboxRow {
    display: flex;
    flex-wrap: wrap;
}

.reviewsubmitAlertboxwrap {
    max-width: 500px;
    border: 2px solid #006f00;
    border-radius: 10px;
}

.reviewsubmitAlertboxIcon {
    border-left: 10px solid #006f00;
    width: 40px;
    padding: 15px 0;
}

.reviewsubmitAlertboxContent {
    max-width: calc(100% - 40px);
    padding: 15px 10px;
}

    .reviewsubmitAlertboxContent h3 {
        font-size: 20px;
        line-height: 1.2;
        font-family: 'CircularStd-Black';
        margin: 0;
        color: #006f00;
    }

    .reviewsubmitAlertboxContent p {
        margin: 8px 0 0;
    }


.trackOrderboxwrap {
    max-width: 500px;
    margin: 0 auto;
}

.trackOrderboxTop, .trackOrderboxBottom {
    background-color: #ffffff;
    text-align: center;
    padding: 15px;
    border-radius: 16px;
}

.trackOrderboxThumb img {
    width: 40px;
}

.trackOrderboxBottom {
    margin-top: 10px;
    text-align: left;
    padding: 0;
}

.trackOrderboxTop + .trackOrderboxTop {
    margin-top: 10px;
}

.trackOrderboxBottom .deliveryBodyRow .top {
    padding: 20px 20px 14px;
}

section#MainContent {
    min-height: calc(100vh - 65px);
}

.trackOrderboxTop h3, .trackOrderboxBottom .deliveryBodyRow h3 {
    margin: 25px 0 10px;
    font-family: 'CircularStd-Black';
    color: #1C1C1C;
    font-size: 20px;
    line-height: 1.2;
}

.trackOrderboxTop p, .trackOrderboxBottom .deliveryBodyRow label {
    max-width: 310px;
    margin: 0 auto;
    font-size: 14px;
    line-height: 1.4;
    color: rgba(28, 28, 28, 0.5);
}

.trackOrderboxBottom .deliveryBodyRow label {
    margin-left: 0;
}

.trackOrderboxBottom .deliveryBodyRow h3 {
    margin: 0 0 8px;
}

.trackOrderboxBottom .deliveryBodyRow .jqEmoji-container {
    padding-top: 20px;
    padding-bottom: 20px;
    border-top: 1px solid #F3F3F3;
    justify-content: center;
}

.trackOrderboxBottom .bottom {
    padding: 0px 20px 16px;
}

    .trackOrderboxBottom .bottom .deliveryBodyRow > label {
        font-size: 12px;
        line-height: 1.2;
        color: #999999;
    }

.tableTaskViewWrap div#tblReOrder_wrapper .row:nth-child(2) .col-sm-12 {
    max-height: 400px;
    overflow: auto;
}

.tableTaskViewWrap div#tblReOrder_wrapper .row:nth-child(1) {
    margin: 0;
}

button.btn.btn-default.btn-md.btn-square.dropdown-toggle {
    width: 35px;
    height: 35px;
    padding: 0;
    border-radius: 8px;
}

/*table.table {
    border-radius: 10px;
    overflow: hidden;
}

    table.table tr th:first-child {
        border-top-left-radius: 10px;
    }

    table.table tr th:last-child {
        border-top-right-radius: 10px;
    }*/

table.table tr th {
    font-size: 12px;
    line-height: 1.2;
    text-transform: uppercase;
    color: rgba(0, 0, 0, .7) !important;
    background-color: #F3F3F3;
}

table.table tr td {
    font-size: 12px;
    line-height: 1.2;
}

/*table.table tr td:first-child {
    border-bottom-left-radius: 10px;
}

table.table tr td:last-child {
    border-bottom-right-radius: 10px;
}

.tableTaskViewWrap div#tblReOrder_wrapper .row:nth-child(1) input.form-control.input-sm {
    width: auto;
    min-width: auto !important;
}*/

.tableTaskViewWrap div#tblReOrder_wrapper .row:nth-child(1) label {
    margin-bottom: 10px;
}

/*div#tblReOrder_wrapper > .row > .col-sm-6:first-child {
    display: none;
}*/

div#tblReOrder_wrapper > .row > .col-sm-6:last-child input.form-control {
    padding: 8px 13px !important;
    border-radius: 6px;
}

.searchDatewrapper {
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

    .searchDatewrapper .dateselector {
        font-size: 14px;
        line-height: 1;
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        padding: 8px;
        border-radius: 8px;
        border: 1px solid #F3F3F3;
        background-color: transparent;
    }

    .searchDatewrapper button.search {
        font-size: 14px;
        line-height: 1;
        font-family: 'CircularStd-Black';
        text-transform: uppercase;
        padding: 10px 11px 8px 11px;
        background-color: #1A73E8;
        border-radius: 10px;
        border: 1px solid #1A73E8;
        color: #fff;
        transition: 0.3s all ease;
    }

        .searchDatewrapper button.search:hover {
            background-color: transparent;
            color: #1A73E8;
        }

.customreportHeaderWrap {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid #F3F3F3;
    padding-bottom: 32px;
    padding-top: 0;
}

.customreportHeaderCol {
    width: 33.33%;
}

.customerFeedbackReportpg .tablesettingBody {
    padding: 30px 40px;
}

.customreportHeaderCol + .customreportHeaderCol {
    border-left: 1px solid #F3F3F3;
    padding-left: 30px;
}

.customreportHeaderCol h3 {
    margin: 20px 0 10px;
    font-family: 'CircularStd-Black';
    font-size: 28px;
    line-height: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.customreportHeaderCol p {
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
    color: rgba(28, 28, 28, 0.4);
}

.customreportHeaderCol h3 span {
    font-size: 16px;
    line-height: 1;
    font-family: 'CircularStd-Book';
    background-color: rgba(50, 199, 135, 0.2);
    padding: 4px 13px;
    border-radius: 50px;
    color: #32C787;
}

div.dataTables_scrollBody table {
    overflow: visible;
}

.ratingLivegrROWS {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

    .ratingLivegrROWS span {
        font-size: 14px;
        line-height: 1.2;
        color: #1C1C1C;
    }

        .ratingLivegrROWS span:first-child {
            width: 10px;
        }

        .ratingLivegrROWS span:last-child {
            width: 26px;
            margin-left: auto;
            text-align: right;
        }

    .ratingLivegrROWS .progress {
        flex: 1;
        margin: 0;
    }

.ratingLivegrwrap {
    max-width: 263px;
}

.feedbackWrapRow {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 0px 40px;
}

.headfeedbackWrapBox p {
    font-size: 12px;
    line-height: 1.2;
    color: #1C1C1C;
    opacity: 0.4;
    margin: 0;
}

.headfeedbackWrapCat {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px 0;
}

    .headfeedbackWrapCat span {
        font-size: 16px;
        line-height: 1;
        font-family: 'CircularStd-Book';
        color: #1C1C1C;
        padding: 9px 14px;
        display: inline-block;
        border: 1px solid #1C1C1C1A;
        border-radius: 50px;
        font-weight: 500;
    }

.feedbackWrapContent p {
    font-size: 16px;
    line-height: 1.25;
    color: #1C1C1C;
    margin: 0;
}

.feedbackWrapContentUserinfo h5 {
    margin: 0 0 5px;
    font-size: 18px;
    line-height: 1.25;
    color: #1C1C1C;
}

.feedbackWrapContentUserinfo ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

.feedbackWrapContentUserinfo {
    margin-top: 14px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
}

    .feedbackWrapContentUserinfo ul p {
        margin: 0;
        font-size: 12px;
        line-height: 1.2;
        color: #1C1C1C;
        opacity: 0.4;
    }

.feedbackWrapCol {
    padding-top: 24px;
}

.feedbackWrapContentUserinfo > div:last-child ul {
    text-align: right;
}

    .feedbackWrapContentUserinfo > div:last-child ul li {
        width: 100%;
    }

.reportvehicledivwrap input.select2-search__field {
    background-color: #ffffff !important;
}

.reportvehicledivwrap .select2-container--bootstrap .select2-selection--multiple .select2-selection__rendered {
    background-color: #ffffff;
    max-width: 300px !important;
}

.feedbackWrapContentUserinfo > div:last-child ul li + li {
    margin-left: 0;
    padding-left: 0;
    padding-top: 5px;
    border: 0;
}

.feedbackWrapRow .feedbackWrapCol:nth-child(n + 3) {
    padding-top: 24px;
    margin-top: 24px;
    border-top: 1px solid #F3F3F3;
}

.feedbackWrapContentUserinfo ul li + li {
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid rgba(28, 28, 28, 0.4);
}


.Customcontainer .star-rating__ico {
    font-size: 16px;
    line-height: 1;
    margin: 0;
    padding: 0;
}

.Customcontainer .star-rating__wrap {
    display: inline-flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    justify-content: flex-end;
}

    .Customcontainer .star-rating__wrap label {
        margin-left: 5px;
    }

        .Customcontainer .star-rating__wrap label:last-child {
            margin-left: 0;
        }

.averageRatingblckwrap .star-rating__wrap {
    margin-top: 7px;
    margin-left: 10px;
}

.customreportHeaderCol .smalltitle {
    font-size: 18px;
    line-height: 1.2;
    color: #1C1C1C;
}

.headfeedbackWrapBox + .feedbackWrapContent {
    margin-top: 14px;
}

.startwrap {
    min-width: 82px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px;
}

    .startwrap label.star-rating__ico.fa.fa-star-o.fa-lg {
        color: #1C1C1C33;
    }

        .startwrap label.star-rating__ico.fa.fa-star-o.fa-lg::before {
            content: '\f005';
            color: rgba(128, 128, 128, 0.2);
        }

.select2-container .select2-search--inline, .select2-container .select2-search--inline input {
    width: 100% !important;
}

.dropdown-menu.dropupBox {
    top: auto;
    bottom: 100%;
}

#ImportUpdateDiv .searchFilterwrap .input-group span.input-group-btn:first-child {
    padding-right: 26px;
}

.iconbutton.green {
    background-color: rgba(50, 199, 135, 0.1);
    color: #32C787;
}

    .iconbutton.green img {
        filter: none;
    }

@media (max-width:575px) {
    .deliveryHeaderwrap {
        max-width: 100%;
        width: 100%;
    }

    .deliveryHeader_section {
        padding: 10px;
    }

    .headermonitorDelivery_Left img {
        width: 110px;
    }

    .headermonitorDelivery_Right p span {
        font-size: 14px !important;
        margin: 0;
    }

    section.deliveryHeaderScreen .track-task-tab {
        margin-top: 46px;
        min-height: calc(100vh - 46px);
    }

        section.deliveryHeaderScreen .track-task-tab div#gTrackTaskFleetMap {
            min-height: calc(100vh - 347px) !important;
        }

    .leftStickyWrap {
        top: 100px;
    }

        .leftStickyWrap a {
            width: 40px;
            height: 40px;
            font-size: 20px;
        }

    .monitorDeliveryScreen_right .track-content-section {
        max-height: calc(100% - 50vh);
        overflow: auto;
    }

    .monitorDeliveryScreen_right {
        border-radius: 0;
    }

    #CustomerFeedback #MainContent div#FeedbackDiv, #CustomerFeedback #MainContent div#reviewSubmitwrap {
        max-width: 100%;
        margin-top: 30px;
        margin-left: 0;
        margin-right: 0;
    }

    #reviewSubmitwrap {
        margin-top: 100px;
    }

    .deliverySecwrap {
        z-index: 99999;
    }
}

/*Report page css*/
.reportContcol + .reportContcol {
    margin-top: 10px;
}

.reportConbox {
    border-radius: 16px;
    background: #FFF;
}

.reportConHeadTitle {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    width: 400px;
    max-width: 100%;
}

    .reportConHeadTitle span {
        min-width: 48px;
        height: 48px;
        background-color: rgba(26, 115, 232, 0.15);
        border-radius: 50%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    .reportConHeadTitle h4 {
        font-size: 24px;
        line-height: 1.2;
        color: #1C1C1C;
        margin: 0;
    }

.reportConHead p {
    margin: 0;
    font-size: 16px;
    line-height: 1.4;
    color: #1C1C1C;
    opacity: 0.5;
    max-width: 678px;
}

.red .reportConHeadTitle span {
    background-color: rgba(223, 29, 90, 0.15);
}

.yellow .reportConHeadTitle span {
    background-color: rgba(235, 178, 45, 0.15);
}

.green .reportConHeadTitle span {
    background-color: rgba(50, 199, 135, 0.15);
}

.staringWrap {
    border: 0;
    padding: 0;
    background-color: transparent;
}

    .staringWrap i {
        font-size: 22px;
        line-height: 1;
        color: #efb021;
    }

.reportConFoot .staringWrap {
    padding-bottom: 12px;
    margin-bottom: 12px;
    margin-right: 9px;
}

.reportConHead {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-radius: 16px 16px 0px 0px;
    background: rgba(243, 243, 243, 0.50);
    padding: 12px 24px;
}

    .reportConHead .iconbutton {
        margin-left: auto;
    }

/*-- Setup --*/
h3.pageTitle {
    font-size: 32px;
    line-height: 1.2;
    font-family: 'CircularStd-Black';
    color: #1C1C1C;
}

.settingWrapRow {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 60px;
    background-color: #ffffff;
    border-radius: 16px;
    padding: 24px
}

.settingIntrosec {
    max-width: 100%;
}

.settingIntroContent h4 {
    font-family: 'CircularStd-Book';
    font-size: 24px;
    line-height: 1.2;
    color: #1C1C1C;
    margin: 12px 0 14px;
}

.settingIntroContent p {
    margin: 0;
    font-family: 'CircularStd-Book';
    font-size: 16px;
    line-height: 1.2;
    color: #1C1C1C;
    opacity: 0.5;
}

.roundImgwrap {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.skyblue .roundImgwrap {
    background-color: rgba(26, 115, 232, 0.15);
}

.yellow .roundImgwrap {
    background-color: rgba(235, 178, 45, 0.15);
}

.green .roundImgwrap {
    background-color: rgba(45, 182, 126, 0.15);
}

.red .roundImgwrap {
    background-color: rgba(223, 29, 90, 0.15);
}

.settingWrapCols ul {
    margin: 0;
    padding: 0;
    list-style: none;
    max-width: 305px;
    margin: 0 auto;
}

    .settingWrapCols ul a {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        font-family: 'CircularStd-Book';
        color: #1C1C1C;
        font-size: 15px;
        line-height: 1;
        transition: 0.5s all ease-in-out;
    }

        .settingWrapCols ul a i {
            font-size: 10px;
            line-height: 1;
            font-weight: bold;
            opacity: 0;
            visibility: hidden;
            transition: 0.3s all ease-in-out;
            color: #1A73E8;
        }

.red .settingWrapCols ul a:hover, .red .settingWrapCols ul a i {
    color: #df1d5a;
}

.skyblue .settingWrapCols ul a:hover, .skyblue .settingWrapCols ul a i {
    color: #1A73E8;
}

.yellow .settingWrapCols ul a:hover, .yellow .settingWrapCols ul a i {
    color: #EBB22D;
}

.green .settingWrapCols ul a:hover, .green .settingWrapCols ul a i {
    color: #2DB67E;
}

.settingWrapCols ul a:hover {
    color: #1A73E8;
}

    .settingWrapCols ul a:hover i {
        opacity: 1;
        visibility: visible;
    }

.settingWrapCols ul li + li {
    margin-top: 12px;
    padding-top: 12px;
    /*border-top: 1px solid rgba(0, 0, 0, 0.1);*/
}

.settingWrapRow + .settingWrapRow {
    margin-top: 10px;
}

.Customcontainer .breadCrumbNew {
    padding: 10px !important;
    padding-bottom: 5px !important;
}
/*-- Listing --*/
.breadCrumbNew ul {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}

    .breadCrumbNew ul a {
        font-family: 'CircularStd-Book';
        color: #1C1C1C;
        opacity: .5;
        font-size: 16px;
        line-height: 1.2;
    }

    .breadCrumbNew ul li + li::before {
        content: "\e606";
        font-family: simple-line-icons;
        font-size: 10px;
        line-height: 1;
        font-weight: bold;
        color: #111111;
        margin: 0 7px;
        opacity: 0.8;
    }

.breadCrumbNew {
    padding: 10px 0;
}

.optimizeTablewrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-radius: 16px;
    background: #FFF;
    padding: 5px 8px;
    position: fixed;
    bottom: 53px;
    left: 0;
    right: 0px;
    width: calc(100% - 425px);
    margin: 0 auto;
    height: 43px;
    background-color: rgba(0, 0, 0, 0.2);
}

.vieworderpage {
    padding-bottom: 90px;
}

.optimizeTablewrap p.select-text {
    margin: 0;
    font-size: 14px;
    line-height: 1;
    color: #ffffff;
    margin-left: 20px;
}

ul.optimizeTablelist {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 50px;
    margin-left: 28px;
}

.optimizeTablewrap > button {
    margin-left: auto;
    font-size: 14px;
    line-height: 1.2;
    text-transform: uppercase;
    background-color: #1A73E8;
    color: #ffffff;
    border: 0;
    padding: 12px 23px;
    display: block;
    outline: 0;
    border-radius: 10px;
    transition: 0.3s all ease;
}

    .optimizeTablewrap > button:hover {
        opacity: 0.6;
    }

.optimizeTableItem {
    font-size: 12px;
    line-height: 1;
    color: #999999;
}

    .optimizeTableItem span {
        font-size: 14px;
        line-height: 1;
        width: 36px;
        height: 26px;
        display: inline-flex;
        background-color: #999999;
        color: #ffffff;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        margin-right: 8px;
    }

    .optimizeTableItem.order {
        color: #1A73E8;
    }

    .optimizeTableItem.pickup {
        color: #EBB22D;
    }

    .optimizeTableItem.delivery {
        color: #2DB67E;
    }

    .optimizeTableItem.order span {
        background-color: #1A73E8;
    }

    .optimizeTableItem.pickup span {
        background-color: #EBB22D;
    }

    .optimizeTableItem.delivery span {
        background-color: #2DB67E;
    }

.button-normal.button-green, .newModaldesign .button-normal.button-green {
    background-color: rgba(50, 199, 135, 0.1);
    color: #32C787;
}

    .button-normal.button-green:hover, .newModaldesign .button-normal.button-green:hover {
        background-color: #32C787;
        color: #ffffff;
    }

.input-group.group-material.data-calendar-wrap input {
    padding: 11px 24px !important;
}

.gmnoprint.gm-style-mtc-bbw, div#googleMapPortalSetting {
    border-radius: 10px;
    overflow: hidden;
}

.reportContcol .reportConbox .reportConHead .dropdownarrow {
    margin-left: auto;
    cursor: pointer;
}

.reportContcol .reportConbox .starReportWrap {
    display: none;
    padding: 14px 0;
}

.reportConbox .reportConHead button.iconbutton +
.dropdownarrow {
    margin-left: 10px;
}

.reportControw .reportConHead {
    border-radius: 16px;
}

.reportControw .active .reportConHead {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.reportConbox.active .reportConHead img.dropdownarrow {
    transform: scale(-1);
}

.Customcontainer > h3.pageTitle {
    margin-top: 6px;
}

.licencetypewrap span.select2 .select2-selection {
    min-height: 52px;
    max-height: 52px;
    padding: 9px 14px;
}

.blockButtonwrap .input-group {
    border: 1px solid #EAEAEA;
    padding: 6.5px 10px;
    border-radius: 10px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.blockButtonwrap input.form-control {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 0;
}

.blockButtonwrap .input-group .input-group-addon {
    border: 0;
}

.whiteboxmainWrap.border-radius {
    border-radius: 15px;
    overflow: hidden;
}

.blockButtonwrap + hr {
    margin: 16px 0;
}

.blockButtonwrap + div#_VehicleGroupVehicleList {
    padding-top: 15px;
}

.settingWrapRow:last-child {
    margin-bottom: 10px;
}

.restrictionwrap .row {
    display: flex;
    flex-wrap: wrap;
    row-gap: 16px;
    margin: 0 -8px;
}

    .restrictionwrap .row > div {
        padding: 0 8px;
    }

.restrictionuionewrap {
    border-radius: 16px;
    border: 1px solid #EAEAEA;
    background: #FFF;
    height: 100%;
}

    .restrictionuionewrap h4 .switch span {
        width: 50px;
        height: 28px;
        background: rgba(28, 28, 28, 0.05);
        border-radius: 16px;
        border: 0;
        box-shadow: none;
    }

        .restrictionuionewrap h4 .switch span::after {
            width: 22px;
            height: 22px;
            box-shadow: none;
            top: 50%;
            transform: translateY(-50%);
            left: 3px;
            border: 0;
        }

    .restrictionuionewrap h4 .switch input:checked + span::after {
        left: 25px;
    }

    .restrictionuionewrap h4 .switch input:checked + span {
        background-color: #1A73E8;
    }

    .restrictionuionewrap h4 {
        font-size: 16px;
        line-height: 1;
        margin: 0;
        color: #1C1C1C;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 11px;
    }

    .restrictionuionewrap p, .restrictionuionewrap label {
        margin: 0;
        font-size: 14px;
        line-height: 1.2;
        color: rgba(28, 28, 28, 0.4);
    }

.restrictionuione-header {
    padding: 16px;
}

/*.newModaldesign .modal-dialog .modal-body.restrictionwrap {
    padding: 20px;
}*/
.restrictionuione-footer {
    padding: 8px 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: rgba(243, 243, 243, 0.50);
}

    .restrictionuione-footer h5 {
        margin: 0;
        font-size: 14px;
        line-height: 1.2;
        color: rgba(28, 28, 28, 0.4);
    }

    .restrictionuione-footer .counter input {
        padding: 8px 10px !important;
        font-size: 14px;
        line-height: 1;
        border-radius: 10px;
        border: 1px solid #EAEAEA !important;
        background: #FFF;
        text-align: center;
        min-width: 80px;
        max-width: 80px;
    }

.newModaldesign h4.TitleSubPoint {
    font-size: 14px;
}

.newModaldesign .notification-pref-wrap {
    margin-top: 20px;
}

    .newModaldesign .notification-pref-wrap > .row {
        align-items: stretch;
    }

.notification-pref-wrap .task-configuration-notification {
    border-radius: 10px;
    background: #F3F3F3;
    padding: 14px;
    border: 0;
    height: 100%;
}

.notification-pref-checkbox .pull-right .lable_show_only {
    font-size: 10px;
    line-height: 1;
    color: #999999;
    background: #FFFFFF;
    padding: 6px 7.5px;
    border-radius: 6px;
}

    .notification-pref-checkbox .pull-right .lable_show_only.active {
        background-color: #32C787;
        color: #ffffff;
    }

.newModaldesign input.form-control, .newModaldesign span.select2-selection, .newModaldesign textarea.form-control {
    font-size: 14px;
    line-height: 1.2;
    background-color: #ffffff;
}

.formGroupLeftRight {
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
}

    .formGroupLeftRight .input-group-btn {
        width: 40px;
        background-color: #ffffff;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

    .formGroupLeftRight input {
        width: 100%;
        max-width: calc(100% - 80px);
    }

    .formGroupLeftRight .input-group-btn:first-child {
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        border: 1px solid #EAEAEA;
        border-right: 0;
    }

    .formGroupLeftRight .input-group-btn:last-child {
        border-bottom-right-radius: 10px;
        border-top-right-radius: 10px;
        border: 1px solid #EAEAEA;
        border-left: 0;
    }

    .formGroupLeftRight .input-group-btn a {
        padding: 0;
        border: 0;
    }
/*Addons page css*/
.switchTogglewrap {
    border-radius: 10px;
    background: rgba(28, 28, 28, 0.05);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 2px;
}

    .switchTogglewrap label {
        margin: 0;
        font-size: 12px;
        line-height: 1;
        color: rgba(0, 0, 0, 0.3);
        padding: 7px 13px;
        border-radius: 8px;
        cursor: pointer;
    }

    .switchTogglewrap input {
        position: absolute;
        width: 0;
        height: 0;
        opacity: 0;
        visibility: hidden;
    }

        .switchTogglewrap input:checked ~ label:last-child, .switchTogglewrap input:not(:checked) ~ label:nth-child(2) {
            color: #1A73E8;
            background-color: #ffffff;
        }

.titleScreenwrap .switchTogglewrap, .titleScreenwrap .filter-wrap {
    margin-left: 20px;
}

.titleScreenwrap .searchNewWrap input {
    font-size: 12px;
    line-height: 1;
    width: 100%;
    padding: 9px 10px 9px 30px;
    border: 0;
    background-color: #fff;
    border-radius: 8px;
    color: rgba(28, 28, 28, 0.3);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cg opacity='0.25'%3E%3Cpath d='M4.79329 8.7498C6.97942 8.7498 8.75163 6.97759 8.75163 4.79146C8.75163 2.60534 6.97942 0.83313 4.79329 0.83313C2.60717 0.83313 0.834961 2.60534 0.834961 4.79146C0.834961 6.97759 2.60717 8.7498 4.79329 8.7498Z' stroke='%231C1C1C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M9.16829 9.16646L8.33496 8.33313' stroke='%231C1C1C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center left 10px;
    background-size: 14px;
}

.titleScreenwrap .searchNewWrap i {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    color: rgba(28, 28, 28, 0.3);
}

.activate .dashbaord---box-contenttop-title .dashbaord---box--stick span {
    color: #32C787;
    background-color: rgba(50, 199, 135, 0.15);
}

.dashbaord---box-contenttop {
    display: flex;
    flex-wrap: wrap;
    padding: 16px;
    gap: 10px;
}

.dashbaord---box-contenttop-left .image-box {
    width: 50px;
    height: 50px;
}

.dashbaord---box-contenttop-right {
    flex: 1;
}

.dashbaord---box-contenttop-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 10px;
    justify-content: space-between;
    gap: 20px;
}

    .dashbaord---box-contenttop-title h3 {
        margin: 0;
        color: #1C1C1C;
    }

    .dashbaord---box-contenttop-title .dashbaord---box--stick {
        position: static;
    }

        .dashbaord---box-contenttop-title .dashbaord---box--stick span {
            font-size: 16px;
            line-height: 1;
            margin: 0;
            color: #1A73E8;
        }

.dashbaord---box-contenttop-right p {
    color: rgba(28, 28, 28, 1);
    margin: 0;
}

.dashbaord---box-contenttop-title .dashbaord---box--stick span {
    font-size: 16px;
    line-height: 1;
    border-radius: 6px;
    background: #32C787;
    color: #fff;
    padding: 4px 7px;
    font-weight: normal;
    font-family: 'CircularStd-Book';
    text-transform: uppercase;
}

.dashbaord---box-contentbottom .btn {
    margin: 0;
}

.dashbaord---box-contentbottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background: rgba(243, 243, 243, 0.50);
    padding: 11px 16px;
}

    .dashbaord---box-contentbottom label.switch span.slider {
        width: 50px;
        height: 28px;
        background: rgba(28, 28, 28, 0.05);
    }

.footer-integration---center {
    margin-left: auto;
    margin-right: 6px;
}

    .footer-integration---center span {
        font-size: 12px;
        line-height: 1;
        color: #1C1C1C;
        opacity: 0.4;
    }

.addOnecontentfootwrap .dashbaord---box-content {
    padding: 0;
    border-radius: 16px;
    border: 1px solid #F3F3F3;
    background: #FFF;
    overflow: hidden;
}

.dashbaord---box-contentbottom label.switch input:checked + span.slider::after {
    left: auto;
    right: 2px;
}

.dashbaord---box-contentbottom label.switch input:checked + span.slider {
    background-color: #1A73E8;
}

.activate .dashbaord---box-contentbottom {
    background: rgba(26, 115, 232, 0.05);
}

.addOnecontentfootwrap .dashbaord---box-content.activate {
    border: 1px solid rgba(26, 115, 232, 0.15);
    background: rgba(26, 115, 232, 0.03);
}

.dashbaord---box-contentbottom label.switch span.slider::after {
    width: 22px;
    height: 22px;
    top: 50%;
    transform: translateY(-50%);
    left: 1px;
}

.addOnecontentwrap.addwebhookmodal {
    background-color: #ffffff;
    overflow: hidden;
}

    .addOnecontentwrap.addwebhookmodal .tabcontent {
        border: 0;
    }

.greyboxbgmodalwrap .restrictionuionewrap {
    padding: 12px 15px;
}

.checkbox.c-checkbox, .checkbox.c-checkbox label {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.mb0 {
    margin-bottom: 0;
}



span.select2-selection.select2-selection--multiple li.select2-selection__choice {
    font-size: 14px;
    line-height: 1;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
    gap: 2px;
}

    span.select2-selection.select2-selection--multiple li.select2-selection__choice span.select2-selection__choice__remove {
        line-height: 1;
    }

.dashbaord---box--stick p {
    color: #1A73E8;
    opacity: 1;
    font-size: 16px;
    line-height: 1;
}

.contactsupport {
    font-size: 14px;
    line-height: 1;
    text-transform: uppercase;
    color: #1C1C1C;
    background-color: #ffffff;
    padding: 10px 13px;
    border-radius: 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

.hpanel.greyboxbgmodalwrap {
    background-color: #f3f3f3;
    margin: 0;
}

.textareainputheight {
    max-height: 42px;
}

.checkboxbgwrap {
    background-color: #ffffff;
    padding: 8px 10px;
    border-radius: 10px;
    border: 1px solid #EAEAEA;
}

.newModaldesign .notification-pref-wrap .row.owl-dots-driver {
    margin-top: 16px !important;
}

.newModaldesign .nav.nav-tabs li a.text-success, .newModaldesign .nav.nav-tabs li a.text-red {
    background-color: transparent;
    color: rgba(28, 28, 28, 0.4) !important;
    border: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.newModaldesign .nav.nav-tabs li.active a.text-success, .newModaldesign .nav.nav-tabs li.active a.text-red {
    color: #1C1C1C !important;
    border-bottom: 1px solid #1C1C1C;
}

    .newModaldesign .nav.nav-tabs li.active a.text-success b, .newModaldesign .nav.nav-tabs li.active a.text-red b {
        line-height: 1;
    }

.green-icon-bttn {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: 12px;
    line-height: 1;
    background-color: #27C24C1A;
    border: 0;
    gap: 3px;
    padding: 8px 13px;
    border-radius: 8px;
}

.ms-auto {
    margin-left: auto
}

.nav-tabs > li > a:hover {
    background-color: transparent !important;
}


/*-- Header start--*/
.headsectionnew {
    background-color: #32C787;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    position: relative;
    z-index: 9;
}

.headnavbarbrand {
    color: #ffffff;
}

.headsectionrightinfo ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 6px 5px 5px 10px;
}

    .headsectionrightinfo ul .navlink {
        padding: 0 0;
        background-color: transparent;
        border: 0;
        min-width: 36px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .headsectionrightinfo ul .notificationicon .alert-col-dropdown {
        padding: 0;
        background-color: transparent !important;
        line-height: 1;
    }

.headersectionmenuwrap {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 30px;
}

.toggleMenusquare .dropdown-toggle img {
    width: 24px;
    height: 24px;
    mix-blend-mode: luminosity;
}

.headsectionrightinfo {
    margin-left: 0;
    padding-right: 15px;
}

.headersectionmenuwrap .menuLinktop a {
    font-size: 14px;
    line-height: 1;
    color: #ffffff;
    padding: 0 !important;
}

body .navbar-active {
    background-color: transparent !important;
}

.navbar-active .dropdown > div > span {
    color: #015531 !important;
}

.headsectionlogo {
    width: 180px;
    text-align: center;
    padding: 0 20px;
}

    .headsectionlogo img {
        width: 200px;
        height: 50px;
    }

.headersectionmenuwrap .have-submenu .setup-add {
    padding: 14px 0;
}

.headersectionmenuwrap .menuLinktop a img {
    display: block;
}

.toggleMenusquare .multi-col-dropdown.dropdown.open .dropdown-menu-custom-wrap {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
}

.toggleMenusquare .dropdown-toggle {
    padding: 15px 0;
    cursor: pointer;
}

.headersectionmenuwrap .toggleMenusquare {
    padding-right: 30px;
    border-right: 2px solid rgba(255, 255, 255, 0.3);
    margin-right: -10px;
}

.headsectionrightinfo ul .notificationicon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .headsectionrightinfo ul .notificationicon .dropdown-menu {
        right: -30px;
        left: auto;
        top: 40px;
    }

        .headsectionrightinfo ul .notificationicon .dropdown-menu #VehicleAlertCountDiv {
            padding: 8px 0px;
        }

ul.notificationNewdesign-wrap li {
    width: 100%;
}

.headsectionrightinfo ul .notificationicon .dropdown-menu #VehicleAlertCountDiv a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    /*width:100%;
                padding:16px;*/
}

    .headsectionrightinfo ul .notificationicon .dropdown-menu #VehicleAlertCountDiv a .label.label-gray.pull-right {
        margin-left: auto;
        font-size: 12px;
        line-height: 1;
        background-color: #1A73E8;
        color: #fff;
        padding: 4px 5px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
        min-width: 31px;
    }

    .headsectionrightinfo ul .notificationicon .dropdown-menu #VehicleAlertCountDiv a .dashboard-alert-span {
        margin: 0 !important;
    }

.headersectionmenuwrap .menuLinktop.betaTag a {
    position: relative;
}

    .headersectionmenuwrap .menuLinktop.betaTag a .beta-pills {
        top: -15px;
        right: -21px;
    }

.moreDropdown {
    position: relative;
}

    .moreDropdown > button {
        background-color: transparent;
        font-size: 14px;
        line-height: 0;
        color: #ffffff;
        text-transform: uppercase;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        border: 1px solid #ffffff;
        padding: 7px 12px;
        border-radius: 10px;
    }

        .moreDropdown > button img {
            width: 14px;
            height: auto;
            display: block;
            mix-blend-mode: luminosity;
        }

    .moreDropdown .moreDropdownmenu::before {
        content: '';
        background-image: url("data:image/svg+xml,%0A%3Csvg width='16' height='12' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.75122 1.54674C6.94541 0.194324 9.0546 0.194324 10.2488 1.54674L14.8559 6.76431C16.5662 8.70117 15.191 11.75 12.6072 11.75H3.39285C0.808978 11.75 -0.566191 8.70117 1.14407 6.76431L5.75122 1.54674Z' fill='white'/%3E%3C/svg%3E%0A");
        position: absolute;
        width: 20px;
        height: 12px;
        top: -8px;
        background-repeat: no-repeat;
        left: 20px;
    }

    .moreDropdown ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .moreDropdown .moreDropdownmenu {
        position: absolute;
        border-radius: 10px;
        background: #FFF;
        box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.15);
        transform: translateY(20px);
        opacity: 0;
        visibility: hidden;
        transition: 0.3s all ease-in-out;
        top: calc(100% + 10px);
    }

    .moreDropdown:hover .moreDropdownmenu {
        transform: translateY(0px);
        opacity: 1;
        visibility: visible;
        transition: 0.3s all ease-in-out;
    }

.moreDropdownmenu > li a:hover {
    background-color: rgba(0,0,0,0.3);
}

.moreDropdown .moreDropdownmenu a {
    white-space: nowrap;
    transition: 0.3s all ease;
}

.moreDropdownmenu > li > a, .moreDropdownsubmenu > li > a {
    font-size: 16px;
    line-height: 1;
    color: rgba(28, 28, 28, 0.7);
    padding: 10px 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    min-width: 255px;
    gap: 12px;
    transition: 0.3s all ease-in-out;
    cursor: pointer;
    position: relative;
}

.hasSubmenuwrap > a::after {
    content: '\f2fb';
    font-family: 'Material-Design-Iconic-Font';
    font-size: 30px;
    line-height: 1;
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 14px;
}

.moreDropdownmenu > li > a > .icon, .moreDropdownsubmenu > li > a > .icon {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    background: rgba(45, 182, 126, 0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s all ease-in-out;
}

.moreDropdownmenu > li a.green::after {
    color: rgba(45, 182, 126);
}

.moreDropdownmenu > li a.blue::after {
    color: rgba(26, 115, 232);
}

.moreDropdownmenu > li a.red::after {
    color: rgba(223, 29, 90);
}

.moreDropdownmenu > li a.yellow::after {
    color: rgba(235, 178, 45);
}

.moreDropdownmenu > li a.green .icon {
    background: rgba(45, 182, 126, 0.10);
}

.moreDropdownmenu > li a.blue .icon {
    background: rgba(26, 115, 232, 0.1);
}

.moreDropdownmenu > li a.red .icon {
    background: rgba(223, 29, 90, 0.1);
}

.moreDropdownmenu > li a.yellow .icon {
    background: rgba(235, 178, 45, 0.1);
}

.moreDropdownmenu > li + li, .moreDropdownsubmenu > li + li {
    border-top: 1px solid rgba(0,0,0,0.1);
}

.moreDropdownmenu li a.green:hover {
    background: rgba(45, 182, 126, 0.10);
}

.moreDropdownmenu li a.blue:hover {
    background: rgba(26, 115, 232, 0.1);
}

.moreDropdownmenu li a.red:hover {
    background: rgba(223, 29, 90, 0.1);
}

.moreDropdownmenu li a.yellow:hover {
    background: rgba(235, 178, 45, 0.1);
}

.moreDropdownmenu li a.green:hover span, .moreDropdownmenu li a.blue:hover span, .moreDropdownmenu > li a.red:hover span, .moreDropdownmenu > li a.yellow:hover span {
    background: #FFF;
}


.moreDropdownsubmenu {
    position: absolute;
    right: 0;
    transform: translateX(100%);
    border-radius: 10px;
    background: #FFF;
    box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.15);
    top: 0;
}

.moreDropdown .moreDropdownmenu > li {
    position: relative;
}


.headnavbarbrand-logo img {
    max-width: 100%;
    height: auto;
    max-height: 40px;
    width: auto;
}

.multi-col-dropdown .megamenuWrapmain {
    position: absolute;
    left: -13px;
    transform: translateY(20px);
    opacity: 0;
    visibility: hidden;
    transition: 0.3s all ease-in-out;
}

.multi-col-dropdown.open .megamenuWrapmain {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
}

.multi-col-dropdown .megamenuWrapmain::before {
    content: '';
    background-image: url("data:image/svg+xml,%0A%3Csvg width='16' height='12' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.75122 1.54674C6.94541 0.194324 9.0546 0.194324 10.2488 1.54674L14.8559 6.76431C16.5662 8.70117 15.191 11.75 12.6072 11.75H3.39285C0.808978 11.75 -0.566191 8.70117 1.14407 6.76431L5.75122 1.54674Z' fill='white'/%3E%3C/svg%3E%0A");
    position: absolute;
    width: 20px;
    height: 12px;
    top: -8px;
    background-repeat: no-repeat;
    left: 20px;
}

.megamenuList {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 10px 20px;
    grid-template-columns: repeat(2,1fr);
    border-radius: 10px;
    background: #FFF;
    box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.15);
    padding: 10px;
}

    .megamenuList a {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        min-width: 220px;
        font-size: 16px;
        line-height: 1;
        color: #1C1C1C;
        gap: 12px 12px;
        padding: 6px;
        transition: 0.3s all ease-in-out;
        cursor: pointer;
        border-radius: 10px;
        position: relative;
    }

        .megamenuList a::after {
            content: '\f2fb';
            font-family: 'Material-Design-Iconic-Font';
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
            font-size: 18px;
            line-height: 1;
            color: #1A73E8;
            opacity: 0;
            transition: 0.3s all ease-in-out;
        }

        .megamenuList a:hover::after {
            opacity: 1;
        }

        .megamenuList a span.icon {
            width: 40px;
            height: 40px;
            background-color: rgba(128, 128, 128, 0.2);
            border-radius: 6px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .megamenuList a.green span, .megamenuList a.green:hover {
            background: rgba(45, 182, 126, 0.10);
        }

        .megamenuList a.blue span, .megamenuList a.blue:hover {
            background: rgba(26, 115, 232, 0.1);
        }

        .megamenuList a.red span, .megamenuList a.red:hover {
            background: rgba(223, 29, 90, 0.1);
        }

        .megamenuList a.yellow span, .megamenuList a.yellow:hover {
            background: rgba(235, 178, 45, 0.1);
        }

.simpleMenuwrapdrop {
    background-color: transparent;
    border: 0;
}

    .simpleMenuwrapdrop::before {
        content: '';
        background-image: url("data:image/svg+xml,%0A%3Csvg width='16' height='12' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.75122 1.54674C6.94541 0.194324 9.0546 0.194324 10.2488 1.54674L14.8559 6.76431C16.5662 8.70117 15.191 11.75 12.6072 11.75H3.39285C0.808978 11.75 -0.566191 8.70117 1.14407 6.76431L5.75122 1.54674Z' fill='white'/%3E%3C/svg%3E%0A");
        position: absolute;
        width: 20px;
        height: 12px;
        top: -8px;
        background-repeat: no-repeat;
        left: 20px;
    }

.simpleMenuwrapdrop-list {
    padding: 0;
    margin: 0;
    border-radius: 10px;
    background: #FFF;
    box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.15);
    list-style: none;
}

    .simpleMenuwrapdrop-list a {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        min-width: 255px;
        font-size: 16px;
        line-height: 1;
        color: rgba(28, 28, 28, 0.7);
        padding: 15px 20px;
        transition: 0.3s all ease-in-out;
        position: relative;
    }

    .simpleMenuwrapdrop-list .submenuWrap > a::after {
        content: '\f2fb';
        font-family: 'Material-Design-Iconic-Font';
        position: absolute;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 24px;
        line-height: 1;
        color: rgba(0, 0, 0, 0.3);
    }

    .simpleMenuwrapdrop-list a:hover {
        background-color: rgba(0,0,0,0.03);
    }

    .simpleMenuwrapdrop-list li + li {
        position: relative;
    }

        .simpleMenuwrapdrop-list li + li::before {
            content: '';
            width: calc(100% - 40px);
            height: 1px;
            background-color: rgba(0, 0, 0, 0.1);
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            margin: 0 auto;
        }

    .simpleMenuwrapdrop-list .submenuWrap {
        position: relative;
    }

        .simpleMenuwrapdrop-list .submenuWrap .submenuWrapmenu {
            position: absolute;
            left: 100%;
            padding: 0;
            margin: 0;
            top: 0;
            background-color: #ffffff;
            border-radius: 10px;
            transform: translateY(20px);
            opacity: 0;
            visibility: hidden;
            transition: 0.3s all ease-in-out;
        }

        .simpleMenuwrapdrop-list .submenuWrap:hover .submenuWrapmenu {
            transform: translateY(0);
            opacity: 1;
            visibility: visible;
        }

    .simpleMenuwrapdrop-list a {
        padding: 12px 12px;
        font-size: 14px;
        min-width: 220px;
    }

    .simpleMenuwrapdrop-list li + li::before {
        width: calc(100% - 24px);
    }

@media only screen and (max-width:1350px) {
    .moreDropdownmenu > li > a > .icon, .moreDropdownsubmenu > li > a > .icon, .megamenuList a span.icon {
        width: 28px;
        height: 28px;
    }

        .moreDropdownmenu > li > a > .icon img, .moreDropdownsubmenu > li > a > .icon img, .megamenuList a span.icon img {
            width: 18px;
            height: auto;
        }

    .moreDropdownmenu > li > a, .moreDropdownsubmenu > li > a {
        font-size: 14px;
        padding: 8px 10px;
        min-width: 220px;
    }

    .megamenuList {
        gap: 8px 16px;
    }

        .megamenuList a {
            font-size: 14px;
            min-width: 210px;
        }

    .hasSubmenuwrap > a::after {
        font-size: 20px;
    }

    .simpleMenuwrapdrop-list a {
        padding: 12px 12px;
        font-size: 14px;
        min-width: 220px;
    }

    .simpleMenuwrapdrop-list li + li::before {
        width: calc(100% - 24px);
    }
}


/*Header end*/


aside.offsidebar.profileINfoAside, aside.offsidebar.profileINfoAside.HelpprofileINfoAside {
    position: fixed;
}

    aside.offsidebar.profileINfoAside.HelpprofileINfoAside {
        z-index: 115;
    }

.staringWrap.active i.zmdi-star-outline::before {
    content: '\f27d';
    color: #efb021;
}

aside.offsidebar.profileINfoAside.HelpprofileINfoAside {
    margin-top: 57px;
}

.helpsupporticon img {
    filter: brightness(0) contrast(1) invert(1);
    width: 26px;
}

.short-name-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    max-width: 150px;
    vertical-align: bottom;
    position: relative;
    cursor: pointer;
}

.reportControw .starReportWrap ul .short-name-text a, .reportControw .starReportWrap ul li a {
    transition: 0.3s all ease;
}

.reportControw .starReportWrap ul .short-name-text:hover a {
    color: #1A73E8 !important;
}

.reportControw.red .starReportWrap ul li a:hover {
    color: #df1d5a !important;
}

.reportControw.green .starReportWrap ul li a:hover {
    color: #2DB67E !important;
}

.reportControw .starReportWrap ul li a:hover {
    color: #1A73E8 !important;
}

#tblReOrderServerSideWithContext_wrapper .row:nth-child(2) {
    margin-top: 7px;
}

.alert-col-dropdown .dropdown-menu.notificationNewdesign-section {
    min-width: 380px;
    border-radius: 16px;
    background: #FFF;
    box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    border: 0;
}

.notificationNewdesign-section .list-group-item {
    padding: 0;
}

    .notificationNewdesign-section .list-group-item a.btn {
        border: 0;
        padding: 0;
        background-color: rgba(45, 182, 126, 0.15);
        font-size: 14px;
        line-height: 1;
        text-transform: uppercase;
        color: #2DB67E;
        padding: 17px 10px;
        transition: 0.3s all ease;
    }

        .notificationNewdesign-section .list-group-item a.btn:hover {
            background-color: rgba(45, 182, 126, 0.4);
        }

.headsectionrightinfo ul .notificationicon .dropdown-menu.notificationNewdesign-section #VehicleAlertCountDiv {
    padding: 0;
}

.notificationNewdesign-section div#VehicleAlertTotalCount0 {
    margin: 10px;
}

.notificationboxwrap.yellow .notificationboxleft span {
    background: rgba(235, 178, 45, 0.10);
}

.notificationboxwrap.yellow .notificationboxright h3.title sapn {
    background-color: #EBB22D;
}

.notificationboxwrap.yellow .notificationboxright a.link {
    background: rgba(235, 178, 45, 0.10);
    color: #EBB22D;
}

.notificationboxwrap.red .notificationboxleft span {
    background: rgba(223, 29, 90, 0.10);
}

.notificationboxwrap.red .notificationboxright h3.title sapn {
    background-color: #DF1D5A;
}

.notificationboxwrap.red .notificationboxright a.link {
    background: rgba(223, 29, 90, 0.10);
    color: #DF1D5A;
}

.notificationboxwrap.green .notificationboxleft span {
    background: rgba(45, 182, 126, 0.15);
}

.notificationboxwrap.green .notificationboxright h3.title sapn {
    background-color: #2DB67E;
}

.notificationboxwrap.green .notificationboxright a.link {
    background: rgba(45, 182, 126, 0.15);
    color: #2DB67E;
}

.notificationboxwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 4px;
    gap: 12px;
}

.notificationboxleft span {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: rgba(26, 115, 232, 0.10);
}

    .notificationboxleft span img {
        width: 24px;
    }

.notificationboxright h3.title sapn {
    font-size: 12px;
    line-height: 1;
    background-color: #1A73E8;
    color: #fff;
    padding: 4px 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    min-width: 31px;
}

.notificationboxright {
    max-width: calc(100% - 52px);
}

    .notificationboxright h3.title {
        margin: 00;
        color: #1C1C1C;
        font-size: 16px;
        line-height: 1.2;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 5px;
        width: 300px;
    }

        .notificationboxright h3.title span.dashboard-alert-span {
            margin: 0 !important;
            max-width: 150px;
            white-space: nowrap;
            overflow: hidden;
        }

    .notificationboxright p {
        font-size: 12px;
        line-height: 1.2;
        color: #999999;
        margin: 4px 0 10px;
    }

    .notificationboxright a.link {
        display: inline-flex !important;
        font-size: 14px;
        line-height: 1;
        text-transform: uppercase;
        border-radius: 10px;
        background: rgba(26, 115, 232, 0.10);
        padding: 8px 11px;
        color: #1A73E8;
    }

/*----------Logistic Dashboard start-------------*/
.dashboardNewsection {
    padding: 15px 0;
}

.Customcontainer {
    max-width: 100%;
    margin: 0 auto;
    padding: 0 15px;
}

.newLinerow2 {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
}

.whiteBoxnewRow {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    width: 100%;
}

.whiteBoxnewboxed {
    background-color: #ffffff;
    border-radius: 16px;
    display: flex;
    flex-wrap: wrap;
    padding: 14px;
}

    .whiteBoxnewboxed h4 {
        margin: 0;
        font-family: 'CircularStd-Book';
        font-size: 14px;
        line-height: 1;
        width: 100%;
    }

.primary .whiteBoxnewboxed h4 {
    color: #1A73E8;
}

.secondary .whiteBoxnewboxed h4 {
    color: #EBB22D;
}

.third .whiteBoxnewboxed h4 {
    color: #2DB67E;
}

.whiteBoxnewboxed .btm {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: 20px;
    color: #1C1C1C;
}

    .whiteBoxnewboxed .btm > span {
        font-size: 24px;
        line-height: 1;
        font-weight: bold;
        font-family: 'CircularStd-Black';
    }

.lineArtupdown {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    line-height: 1.2;
    color: #1C1C1C;
}

.componentTitle {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

    .componentTitle h3 {
        font-size: 18px;
        line-height: 1.2;
        margin: 0;
        color: #1C1C1C;
        opacity: 0.5;
    }

    .componentTitle.comb {
        justify-content: flex-start;
        gap: 16px;
    }

.transborderboxe {
    border: 1px solid rgba(28, 28, 28, 0.1);
    border-radius: 16px;
    padding: 19px 20px;
}

.transborderRow {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.transborderCOls {
    width: 33.33%;
}

.transborderBox {
    padding-left: 16px;
    position: relative;
}

    .transborderBox p {
        font-size: 24px;
        line-height: 1.2;
        margin: 0;
        color: #1C1C1C;
        font-weight: bold;
        font-family: 'CircularStd-Black';
    }

    .transborderBox::before {
        content: '';
        position: absolute;
        width: 5px;
        height: 36px;
        background-color: red;
        border-radius: 50px;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
    }

.primary .transborderBox::before {
    background-color: #1A73E8;
}

.secondary .transborderBox::before {
    background-color: #DF1D5A;
}

.third .transborderBox::before {
    background-color: #2DB67E;
}

.transborderBox h3 {
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
    color: #1C1C1C;
    opacity: 0.5;
}

.rowTopgap {
    margin-top: 42px;
}

.whiteBoxnewRow > div {
    flex: 1;
}

.graphRowsec {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

    .graphRowsec > div {
        width: 100%;
    }

.graphRowgrCollg {
    max-width: calc(50% - 10px);
}

    .graphRowgrCollg .graphRowgrBox {
        padding: 26px 20px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

        .graphRowgrCollg .graphRowgrBox > div:first-child {
            width: 100%;
            max-width: calc(100% - 420px);
        }

.graphRowgrBox {
    background-color: #ffffff;
    padding: 22px 20px;
    border-radius: 16px;
}

.graphCountwrap {
    padding-left: 60px;
    flex: 1;
    width: 100%;
    max-width: 420px;
}

.graphCountRow {
    column-count: 3;
}

.graphCountCols h4, .graphCountCols p {
    width: 100%;
    margin: 0;
}

.graphCountCols h4 {
    font-size: 14px;
    line-height: 1.2;
    color: #1C1C1C;
    opacity: 0.5;
}

.graphCountCols p {
    font-size: 24px;
    line-height: 1.2;
    color: #1C1C1C;
    font-family: 'CircularStd-Black';
    margin-top: 5px;
}

.graphCountCols + .graphCountCols {
    margin-top: 24px;
}

.graphRowgrColsm {
    max-width: calc(25% - 10px);
}

.merchantList {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

    .merchantList + .merchantList {
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid rgba(217, 217, 217, 0.3);
    }

.merchantListLeft {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    line-height: 1.2;
    color: #1C1C1C;
}

    .merchantListLeft img {
        width: 100%;
        height: 100%;
        max-width: 24px;
        max-height: 24px;
        border-radius: 50%;
        object-fit: cover;
    }

.merchantListRight {
    font-size: 14px;
    line-height: 1.2;
    color: #2DB67E;
    font-weight: bold;
}

.titleNewwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px;
    margin-bottom: 36px;
    justify-content: space-between;
}

    .titleNewwrap h2 {
        font-size: 32px;
        line-height: 1.2;
        margin: 0;
        font-family: 'CircularStd-Black';
        font-weight: 500;
        color: #1C1C1C;
    }

.dateInfowrap p {
    font-size: 18px;
    line-height: 1.2;
    color: #1C1C1C;
    font-family: 'CircularStd-Book';
    margin: 0;
}

.dateInfowrap span {
    font-size: 14px;
    line-height: 1.2;
    color: #1C1C1C;
    font-family: 'CircularStd-Book';
    margin: 0;
    opacity: 0.5;
}

.dateInfowrap {
    text-align: center;
}

.iframeBoxwrapnew iframe {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.iframeBoxwrapnew {
    border: 4px solid #ffffff;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
}

    .iframeBoxwrapnew::before {
        content: '';
        display: block;
        padding-top: 46%;
    }

    .iframeBoxwrapnew .delivery-map {
        position: absolute !important;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.buttonstyle1 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    text-decoration: none;
    font-size: 14px;
    line-height: 1;
    color: #2DB67E;
    text-transform: uppercase;
    transition: 0.3s all ease-in-out;
}

    .buttonstyle1:hover {
        color: #2DB67E;
    }

/*----------Logistic Dashboard end-------------*/


/*----------Login page start-------------*/
.login-neww-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 13px 0;
}

    .login-neww-head .dropdown.lang_dropdown button {
        border-radius: 6px;
        background: #FFF;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 9px 64px 9px 10px;
        background-image: url("data:image/svg+xml,%0A%3Csvg width='12' height='6' viewBox='0 0 12 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.6199 1.22119L6.81655 5.02453C6.36738 5.47369 5.63238 5.47369 5.18322 5.02453L1.37988 1.22119' stroke='%231C1C1C' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
        background-size: 14px;
        background-position: center right 10px;
        background-repeat: no-repeat;
        font-size: 14px;
        line-height: 1;
        border: 1px solid rgba(28, 28, 28, 0.10);
    }

.login-neww-body {
    display: flex;
    border-radius: 30px;
    background: linear-gradient(180deg, #CCD8E4 0%, #E9EDF6 100%);
}

.login-neww-body-img {
    max-width: 534px;
    max-height: 434px;
    margin: 0 auto;
}

    .login-neww-body-img img {
        max-height: 350px;
        display: block;
        margin: 0 auto;
    }

.login-neww-body-content {
    max-width: 560px;
    width: 100%;
    margin-top: 46px;
}

    .login-neww-body-content h2 {
        font-size: 36px;
        line-height: 1.2;
        font-family: 'CircularStd-Black';
        color: #1C1C1C;
        margin: 0;
    }

    .login-neww-body-content p {
        font-size: 16px;
        line-height: 1.3;
        color: #1C1C1C;
        margin: 0;
        opacity: 0.5;
        margin-top: 20px;
    }

.login-neww-body-left {
    padding: 50px;
    max-width: calc(100% - 460px);
    width: 100%;
}

.login-neww-body-right {
    max-width: 460px;
    width: 100%;
    margin-left: auto;
    padding: 20px;
}

.loginform-neww-body-boox .loginform-group .form-group .forminputbox {
    position: relative;
}

.loginform-neww-body-boox .loginform-group .form-group svg {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 14px;
}

.loginform-neww-body-boox .loginform-group .form-group {
    margin-bottom: 15px;
}

.loginform-neww-body {
    background: rgba(255, 255, 255, 0.90);
    backdrop-filter: blur(25px);
    border-radius: 20px;
    overflow: hidden;
    height: 100%;
}

.loginform-neww-body-boox {
    padding: 30px 30px;
}

    .loginform-neww-body-boox .titlewrap {
        margin: 20px 0 26px;
    }

        .loginform-neww-body-boox .titlewrap h3 {
            font-size: 36px;
            line-height: 1.2;
            color: #1C1C1C;
            font-family: 'CircularStd-Black';
            margin: 0 0 5px;
        }

        .loginform-neww-body-boox .titlewrap p {
            font-size: 14px;
            line-height: 1.2;
            color: #1C1C1C;
            opacity: 0.5;
            margin: 0;
        }

    .loginform-neww-body-boox .loginform-group label {
        font-size: 12px;
        line-height: 1.2;
        color: #999999;
        margin-bottom: 2px;
    }

    .loginform-neww-body-boox .loginform-group input.form-control {
        font-size: 12px;
        line-height: 1.2;
        border-radius: 10px;
        border: 1px solid #EAEAEA;
        color: #999999 !important;
        padding: 14px 14px 14px 36px;
        height: auto;
    }

        .loginform-neww-body-boox .loginform-group input.form-control::placeholder {
            color: #999999;
        }

.loginform-group .rememebr-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

    .loginform-group .rememebr-wrap .remember_pass {
        margin: 0;
    }

        .loginform-group .rememebr-wrap .remember_pass label {
            padding-left: 20px;
            margin: 0;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            font-size: 12px;
            line-height: 1;
        }

    .loginform-group .rememebr-wrap .text-muted {
        font-size: 12px;
        line-height: 1.2;
        color: #1C1C1C;
    }

.loginform-group .loginbttn {
    transition: 0.3s all ease;
    font-size: 14px;
    line-height: 1;
    background-color: #1A73E8;
    color: #ffffff;
    border: 1px solid #1A73E8;
    width: 100%;
    border-radius: 10px;
    padding: 14px 10px;
}

    .loginform-group .loginbttn:hover {
        background-color: transparent;
        color: #1A73E8;
    }

.loginform-group-footer .download-group {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2,1fr);
}

    .loginform-group-footer .download-group .applink {
        border-radius: 10px;
        border: 1px solid #EAEAEA;
        background: #FCFBFC;
        min-height: 56px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: 0.3s all ease;
        padding: 5px;
    }

        .loginform-group-footer .download-group .applink:hover {
            opacity: 0.8;
        }

.loginform-group-footer {
    padding: 20px 30px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

    .loginform-group-footer p {
        font-size: 16px;
        line-height: 1.25;
        color: #1C1C1C;
        margin: 0 0 14px;
        font-family: 'CircularStd-Book';
    }

.login-neww-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
}

    .login-neww-footer p, .login-neww-footer ul a {
        font-size: 14px;
        line-height: 1.2;
        color: #1C1C1C;
        opacity: 0.5;
        margin: 0;
    }

    .login-neww-footer ul {
        margin: 0;
        padding: 0;
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 20px;
    }
/*----------Login page end-------------*/


/*----------Report page header div start-------------*/

.tablefilterBoxtopwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background-color: #F3F3F3;
    padding: 8px 10px;
}

.expense-summary-head-wrap .list-grid-wrap {
    width: 68px;
    height: 30px;
    background-color: #FFFFFF;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 2px;
}

    .expense-summary-head-wrap .list-grid-wrap button.bttn {
        width: 32px;
        height: 26px;
        background-color: transparent;
        border: 0;
        border-radius: 6px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }

        .expense-summary-head-wrap .list-grid-wrap button.bttn.active {
            background-color: rgba(26, 115, 232, 0.1);
        }

.tablefilterBoxtopwrap .datacalendarwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-left: 0;
    margin-right: auto;
}

.tablefilterBoxtopwrap .expense-summary-head-wrap {
    margin-right: auto;
}

.tablefilterBoxtopwrap .exporttowrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-left: 30px;
}

.tablefilterBoxtopwrap .datacalendarwrap .tripreportdivwrap span.select2 {
    width: 250px !important;
}

div#rightDivHeight {
    border-radius: 10px;
    overflow: hidden;
}

#rightDivHeight .customtextbox_poizonemap {
    left: 34.5%;
}

#rightDivHeight .customtextbox_poizonemapsearrch {
    left: 21.5%;
}

.tablefilterBoxtopwrap .exporttowrap p {
    margin: 0;
    font-size: 14px;
    line-height: 1.2;
    color: rgba(28, 28, 28, 0.5);
}

.tablefilterBoxtopwrap .exporttowrap .tablesettingTabsRight {
    background-color: #FFFFFF;
    border-radius: 8px;
    padding: 7px 10px;
}

    .tablefilterBoxtopwrap .exporttowrap .tablesettingTabsRight a {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        color: rgba(28, 28, 28, 0.5);
        font-size: 14px;
        line-height: 1;
    }

    .tablefilterBoxtopwrap .exporttowrap .tablesettingTabsRight span {
        color: #F3F3F3;
        padding: 0 14px;
    }

    .tablefilterBoxtopwrap .exporttowrap .tablesettingTabsRight span {
        color: #F3F3F3;
        padding: 0 10px;
    }

.tablefilterBoxtopwrap .datacalendarwrap .bttn-rounded {
    font-family: 'CircularStd-Book';
    font-size: 14px;
    line-height: 1;
    background-color: #1A73E8;
    border: 0;
    color: #ffffff;
    padding: 10.5px 14px;
    border-radius: 10px;
}

.tablefilterBoxtopwrap .tripreportdivwrap .select2-material .select2-selection.select2-selection--single, .tablefilterBoxtopwrap .reportvehicledivwrap .select2-selection.select2-selection--single, .tablefilterBoxtopwrap .reportdaterangedivwrap .customDate-wrap button {
    border: 0;
    box-shadow: none !important;
    font-size: 14px;
    line-height: 1.2;
    height: 35px;
    background-color: #ffffff !important;
    border-radius: 8px;
}

    .tablefilterBoxtopwrap .reportdaterangedivwrap .customDate-wrap button i.icon-calendar {
        color: #1C1C1C;
        opacity: 0.3;
    }

.tablefilterBoxtopwrap > .btn-group {
    margin-left: 10px;
}

    .tablefilterBoxtopwrap > .btn-group button {
        box-shadow: none;
        border: 0;
    }

#ReportDetailDiv .card {
    border-radius: 10px;
    margin-top: 0px;
}

.tablefilterBoxtopwrap .reportvehicledivwrap .select2-selection.select2-selection--single, .tablefilterBoxtopwrap .tripreportdivwrap .select2-material .select2-selection.select2-selection--single {
    min-width: 120px;
    /*height: auto;*/
    line-height: 24px;
}

.tablefilterBoxtopwrap .reportdaterangedivwrap .customDate-wrap button input {
    font-size: 12px;
    line-height: 1;
    padding: 0;
    width: auto;
    height: auto;
    border: 0;
}

    .tablefilterBoxtopwrap .reportdaterangedivwrap .customDate-wrap button input + span.input-group-addon {
        padding: 0;
    }

        .tablefilterBoxtopwrap .reportdaterangedivwrap .customDate-wrap button input + span.input-group-addon .icon-calendar {
            font-size: 12px;
            margin: 0;
            color: #1C1C1C;
            opacity: 0.3;
        }

span.select2-selection.select2-selection--multiple li.select2-selection__choice {
    font-size: 12px;
    padding: 4px 6px;
}



.tablesettingTabsRight#TempratureSensorReport .dropdownDrivemenu {
    top: 30px;
}
/*will may be remove this but keep for now- added by Dev and Ajay*/
#ReportDetailDiv .row > hr.mt0 {
    display: none;
}
/*----------Report page header div end-------------*/
.input-group.data-calendar-wrap .input-group-addon {
    border: 1px solid #EAEAEA;
    padding: 6px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    width: 40px;
    font-size: 16px;
}

.task-drivers table.table {
    overflow: auto;
}


.planTitleSection___Styledmain .planTitleSection___Styledmain_left {
    width: 100%;
}

.routeCalendername_title .top a.back-button {
    color: #000000;
}

.routeCalendername_title .top span input#RoutePlanOn {
    font-size: 24px;
    line-height: 1;
    margin-left: 8px;
}

.routes-trips-wrap {
    position: absolute;
    right: 20px;
    z-index: 9;
    background-color: #ffffff;
    border-radius: 8px;
    top: 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 30px;
    padding: 6px 10px;
}

    .routes-trips-wrap > span {
        font-size: 12px;
        line-height: 1;
        color: #1C1C1C;
    }

        .routes-trips-wrap > span span {
            width: 23px;
            height: 19px;
            display: inline-flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            background-color: rgb(26, 115, 232, 0.15);
            border-radius: 6px;
            margin-left: 6px;
            color: #1A73E8;
        }

            .routes-trips-wrap > span span#RoutePlanStopCountSpan {
                background-color: rgba(223, 29, 90, 0.15);
                color: #DF1D5A;
            }

.textclamplimit {
    max-width: 45px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-sidebar-section.routesplansidebar-wrap {
    max-width: calc(100% - 66.66666667%);
    top: 80px;
    left: 6px;
}

span#RoutePlanCount {
    width: 30px;
    height: 30px;
    border: 1px solid #000000;
    border-radius: 50%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}



.driver_stops_module_colswrap {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 10px;
}

    .driver_stops_module_colswrap .driverListMain_title_wrap {
        flex-direction: column;
        align-items: flex-start;
    }

        .driver_stops_module_colswrap .driverListMain_title_wrap small {
            font-size: 10px;
            line-height: 1.2;
            color: #1C1C1C;
        }

        .driver_stops_module_colswrap .driverListMain_title_wrap span {
            background-color: transparent;
            padding: 0;
            font-size: 14px;
            line-height: 1.2;
            color: #1C1C1C;
            display: block;
            margin-top: 2px;
        }

        .driver_stops_module_colswrap .driverListMain_title_wrap > div {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 5px;
        }

            .driver_stops_module_colswrap .driverListMain_title_wrap > div img {
                display: block;
                width: 12px;
            }

.driver-details.driver-detailsboxwrap .contact-driver-details .top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
}

.driver-detailsboxwrap .contact-driver-details-right {
    margin-left: 35px;
    width: 100%;
}

    .driver-detailsboxwrap .contact-driver-details-right .detail-driver-name {
        width: 100%;
        font-size: 12px;
        line-height: 1.2;
    }

        .driver-detailsboxwrap .contact-driver-details-right .detail-driver-name a {
            margin-left: auto;
        }

            .driver-detailsboxwrap .contact-driver-details-right .detail-driver-name a img {
                width: 14px;
            }

.searchFilterwrap.routestopimportboxwrap .input-group span.input-group-btn:first-child {
    left: 10px;
}

.searchFilterwrap.routestopimportboxwrap {
    gap: 10px;
}

div#divDrivers {
    margin-top: 5px;
}

#divDrivers .contact-driver-details .contact-driver-details-center {
    max-width: calc(100% - 64px);
}

.routeplanslistingbox.active {
    border: 1px solid #fce8ee;
    border-radius: 10px;
    box-shadow: 0 0px 28px rgba(0, 0, 0, 0.10), 0 0px 10px rgba(0, 0, 0, 0.10);
}


.delivery-map1 {
    border-radius: 10px;
    height: calc(100vh - 140px);
}

.border-radius-5 {
    border-radius: 10px;
    overflow: hidden;
}

.overview-left-wrap {
    border-radius: 10px;
    overflow: hidden;
    background-color: #ffffff;
    margin-top: 5px;
    max-width: calc(100% - 10px);
    margin-left: 5px;
    border: 1px solid #ddd;
}

    .overview-left-wrap .nav_fleet_tabView {
        border-bottom: 0;
    }

    .overview-left-wrap .card-panel-heading span.fw-600 {
        font-size: 24px;
        line-height: 1;
        color: #1C1C1C;
    }

.card-panel.card-panel-transparent {
    background-color: transparent;
}

.hpanel .panel-body.bg-transparent {
    background: #F3F3F3;
}

.overview-left-wrap + .card-panel-body {
    margin-top: 7px;
    border-radius: 10px;
    background-color: #ffffff;
    max-width: calc(100% - 10px);
    margin-left: 5px;
}

    .overview-left-wrap + .card-panel-body > .row {
        margin: 0;
    }

.btn-group.btn-group-custom {
    border-radius: 10px;
    overflow: hidden;
}

.beta-title {
    font-size: 12px;
    line-height: 1;
    color: #ffffff;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    /*border: 1.5px solid #ffffff;*/
    border-radius: 10px;
    max-width: 222px;
    justify-content: space-between;
    padding: 8px 10px;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: 20px;
    width: 100%;
}

    .beta-title span {
        max-width: 160px;
        display: inline-block;
    }

    .beta-title a {
        color: #ffffff;
        border: 1px solid #ffffff;
        padding: 6px 5px;
        border-radius: 5px;
    }

.moreDropdown .moreDropdownmenu > li > .moreDropdownsubmenu > li > a {
    padding: 12px 12px;
    font-size: 14px;
    min-width: 220px;
}

.moreDropdown .moreDropdownmenu > li > .moreDropdownsubmenu {
    overflow: hidden;
}

    .moreDropdown .moreDropdownmenu > li > .moreDropdownsubmenu > li > a:hover {
        background-color: rgba(0, 0, 0, 0.03);
    }

@media screen and (min-width:1400px) {
    .searchFilterwrap .input-group span.input-group-btn:first-child {
        left: 9px;
    }
}

/*For header UI star*/
.moreDropdownmenu .hasSubmenuwrap .moreDropdownsubmenu {
    top: 20px;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s all ease-in-out;
}

.moreDropdownmenu .hasSubmenuwrap:hover .moreDropdownsubmenu {
    top: 0;
    opacity: 1;
    visibility: visible;
    transition: 0.3s all ease-in-out;
}
/*For header UI end*/

.dashboard-alert-span {
    margin: 11px 0 0 0 !important;
    color: #1C1C1C;
    font-size: 16px;
    line-height: 1.2;
}



.starRatingsecwrap {
    width: 100%;
}

.starRatingseccolswrap {
    width: 100%;
    border: 1px solid #E6E6E6;
    border-radius: 10px;
    padding: 10px;
}

    .starRatingseccolswrap .star-rating .star-rating__wrap {
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        flex-direction: row-reverse;
        justify-content: flex-end;
    }

        .starRatingseccolswrap .star-rating .star-rating__wrap .star-rating__ico {
            font-size: 18px;
            line-height: 1;
            padding: 0;
            margin: 0;
        }

        .starRatingseccolswrap .star-rating .star-rating__wrap::after {
            display: none;
        }

    .starRatingseccolswrap h3 {
        margin: 0 0 5px;
        font-size: 16px;
        line-height: 1.2;
        font-family: 'CircularStd-Book';
        color: #1C1C1C;
    }

    .starRatingseccolswrap p {
        margin: 0;
        font-size: 14px;
        line-height: 1.2;
        color: #1C1C1C;
        opacity: 0.5;
    }

    .starRatingseccolswrap + .starRatingseccolswrap {
        margin-top: 10px;
    }

aside.offsidebar1.section_mapviewsidebar {
    border-radius: 10px 0 0 10px;
}

    aside.offsidebar1.section_mapviewsidebar .footer-history {
        border-radius: 10px;
    }

    aside.offsidebar1.section_mapviewsidebar .btn-group {
        border-radius: 10px;
        overflow: hidden;
    }

        aside.offsidebar1.section_mapviewsidebar .btn-group > .btn-group {
            border-radius: 0
        }

    aside.offsidebar1.section_mapviewsidebar button#btnHistorySearch {
        border-radius: 5px !important;
        overflow: hidden;
        background-color: #32C787;
        border-color: #32C787;
    }

    aside.offsidebar1.section_mapviewsidebar .footer-live, button#daterange-history {
        border-radius: 10px;
    }

.footer_mapviewsidebar .btn-group button.btn-day {
    font-family: 'Roboto';
}

button#btnBirdEyeViewSearch {
    background-color: #32C787;
    border-color: #32C787;
    border-radius: 10px;
}

html[lang="ar"] .headsectionrightinfo ul .notificationicon .dropdown-menu {
    left: -30px;
    right: auto;
}

html[lang="ar"] .dropdown-menu, html[lang="ar"] .moreDropdown .moreDropdownmenu {
    right: auto;
    left: 0;
}

html[lang="ar"] .tablesettingTabsRight {
    margin-right: auto;
    margin-left: 0;
}

    html[lang="ar"] .tablesettingTabsRight .btn-group {
        margin-left: 0;
        margin-right: 10px;
    }

html[lang="ar"] .tablesettingTabswrap {
    margin-left: 0;
    margin-right: 30px;
}

html[lang="ar"] .multi-col-dropdown .megamenuWrapmain {
    right: -13px;
    left: auto;
}

    html[lang="ar"] .multi-col-dropdown .megamenuWrapmain::before {
        right: 10px;
        left: auto;
    }

html[lang="ar"] .newModaldesign .modal-dialog .modal-header button {
    left: 20px;
    right: auto;
}

html[lang="ar"] .dropdownDrivemenu.overlapMenu {
    left: 0;
    right: auto;
}

html[lang="ar"] body.modal-open {
    padding-right: 0 !important;
}

html[lang="ar"] .Customcontainer .searchNewWrap, html[lang="ar"] .reportContcol .reportConbox .reportConHead .dropdownarrow, html[lang="ar"] .reportConHead .iconbutton {
    margin-left: 0;
    margin-right: auto;
}

html[lang="ar"] .breadCrumbNew ul li + li::before {
    content: "\e605";
}

html[lang="ar"] #rightDivHeight .customtextbox_poizonemap {
    left: auto;
    right: 10px;
}

.whiteboxBody h3.contertnumberss {
    font-size: 24px;
    line-height: 1;
    color: #000000;
    margin-bottom: 5px;
}

div#fpanel_grid.fpanel.fullscreen .card-panel-body {
    margin-top: 0;
}

.input-group.borderdinputgroup .input-group-addon {
    border: 1px solid #EAEAEA;
    border-left: 0;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

html[lang="ar"] .settingWrapCols ul a i {
    transform: scale(-1);
}

.div_mapviewsidebar.birdviewsidebardwrap {
    position: static;
    overflow: auto;
    padding: 0;
}

    .div_mapviewsidebar.birdviewsidebardwrap .footer_mapviewsidebar {
        position: static;
    }

aside.offsidebarBirdEye.section_mapviewsidebar {
    position: fixed;
}

html[lang="ar"] body .form-group-icon .form-control.control-material {
    padding: 14px 36px 14px 36px !important;
}

html[lang="ar"] .loginform-neww-body-boox .loginform-group .form-group svg {
    left: auto;
    right: 14px;
}

html[lang="ar"] .has-feedback label ~ .form-control-feedback {
    top: 21px;
}

.image-container {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
}

.gray-background {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #dcdada;
    border-radius: 50%;
}

.rounded-image {
    width: 80%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    z-index: 1;
    background-color: transparent;
}

.image-container.assetstypewrap {
    width: 30px;
    height: 30px;
    margin: 0 auto;
}

    .image-container.assetstypewrap .gray-background {
        /*background-color: transparent;*/
        border: 1px solid rgba(0, 0, 0, 0.2);
    }

        .image-container.assetstypewrap .gray-background .rounded-image {
            width: 60%;
        }

.whiteboxBody h3.contertnumberss.text-info {
    color: #23b7e5;
}

.whiteboxBody h3.contertnumberss.text-f-green {
    color: #93BE52;
}

.whiteboxBody h3.contertnumberss.text-f-pink {
    color: #FC6180;
}

.whiteboxBody h3.contertnumberss.text-f-blue {
    color: #4680ff;
}

.radious-10 {
    border-radius: 5px !important;
}

.btn-group-vertical.border10rad {
    border-radius: 10px;
    overflow: hidden;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

button.gm-svpc {
    border-radius: 0 !important;
    border-bottom-left-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
}

.card-panel .card-panel-heading .pull-right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
}

.btn-group-vertical.border10rad .btn:last-child:not(:first-child) {
    border-radius: 0;
}

button.gm-ui-hover-effect {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 40px !important;
    height: 40px !important;
}

    button.gm-ui-hover-effect span {
        margin: 0 !important;
    }

.bttn-radius {
    border-radius: 10px;
}

div#_OffSideBarMapViewListDiv {
    height: 100% !important;
    max-height: calc(100vh - 210px);
    overflow: auto;
}

div#OffSideBarMapViewPoi_List .slimScrollDiv {
    height: 100% !important;
}

#rightDivHeight .customtextbox_poizonemapsearrch .input-group-btn, .customtextbox_poizone_map button.btn.btn-default.dropdown-toggle {
    border-top-right-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
    overflow: hidden;
}

    #rightDivHeight .customtextbox_poizonemapsearrch .input-group-btn button, .customtextbox_poizone_map button.btn.btn-default.dropdown-toggle {
        border: 0;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        padding: 11px 14px;
    }

.filter-map-option.filter-map-optionterritorial {
    top: 12px;
}

    .filter-map-option.filter-map-optionterritorial button {
        border-radius: 10px !important;
    }

div#poiZoneMapView.poiZoneMapViewSize.traditional, #poiZoneMapView.poiZoneMap_ViewSize.traditional {
    max-height: calc(100vh - 180px);
}

.gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom button.gm-svpc {
    width: 41px !important;
    left: -51px !important;
}

.mapOptionsDashboard.map-panel-control .btn-group-vertical {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    overflow: hidden;
}

.btn {
    border-radius: 10px;
}

.select2-container--bootstrap[dir=rtl] .select2-selection--single .select2-selection__rendered#select2-ItemClassification-container + .select2-selection__arrow, body .select2-container--bootstrap[dir=rtl] .select2-selection--single span#select2-ItemCategory-container + .select2-selection__arrow {
    left: 5px;
}

html[lang="ar"] .transborderBox::before {
    left: auto;
    right: -10px;
}

input#HolidayYear {
    border: 0 !important;
}

.fromdateradiuswrap .input-group-addon {
    width: 40px;
    height: 42px;
    border: 1px solid #EAEAEA;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    border-left: 0;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.fromdateradiuswrap .input-group.group-material {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

    .fromdateradiuswrap .input-group.group-material input {
        max-width: calc(100% - 40px);
    }



html[lang="ar"] .short-name {
    margin-left: auto;
    margin-right: 0;
}

    html[lang="ar"] .short-name + span.delete-icon {
        float: right !important;
        text-align: right;
    }

        html[lang="ar"] .short-name + span.delete-icon button.pull-right {
            float: right !important;
        }

.starReportlinkwrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    width: 100%;
    justify-content: space-between;
}

    .starReportlinkwrap .deleteiicon {
        border: 0;
        background-color: transparent;
        padding: 0;
        display: block;
        visibility: hidden;
        min-width: 120px;
        text-align: left;
    }

    .starReportlinkwrap:hover .deleteiicon {
        visibility: visible;
    }

html[lang="ar"] .starReportlinkwrap .deleteiicon {
    text-align: right;
}

.maplocationtext p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    max-width: calc(100% - 30px);
    margin: -4px 0 0;
    font-size: x-small;
    width: 100%;
}

.maplocationtextwr {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}

.maplocationtext small.text-muted {
    margin-left: 30px;
    font-size: x-small;
}

.select2-container--bootstrap .select2-selection__clear {
    margin-left: 10px;
    margin-right: 0;
}

.no-route-plans {
    text-align: center;
    font-size: xx-large;
    margin-top: 50px;
}

/*multiple selection scroll issue*/
/*body .select2-selection.select2-selection--multiple {
    overflow: auto;
}*/

/*span.select2-selection.select2-selection--multiple {
    padding: 0px 0px 0px 0px !important;
    border-radius: 10px !important;
    height: 20px;
    min-height: 30px;
}*/
/*.select2-selection--multiple .select2-selection__rendered {
    max-width: 260px;
}*/




/*-- New CSS --*/
html[lang="ar"] .task-sidebar-section {
    left: auto;
    right: 0;
}

    html[lang="ar"] .task-sidebar-section .task-menu-sidebar-section {
        float: right;
    }

html[lang="ar"] .task-details-asidebar {
    left: auto;
    right: 360px;
}

.alredtanalyticsrowwrap .row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 0;
}

    .alredtanalyticsrowwrap .row .flat-box.default {
        margin: 0;
        height: 100%;
    }

    .alredtanalyticsrowwrap .row + .row {
        margin-top: 20px;
    }

body #DivisionSchoolID + .select2-container--bootstrap[dir=rtl] .select2-selection--single .select2-selection__arrow, body #ClassSchoolID + .select2-container--bootstrap[dir=rtl] .select2-selection--single .select2-selection__arrow {
    left: 6px;
    right: auto;
}

html[lang="ar"] body #DivID + .select2-container--bootstrap[dir=rtl] .select2-selection--single .select2-selection__arrow {
    left: 5px;
}

html[lang="ar"] body .select2-container, html[lang="ar"] .modal-body .select2-container {
    width: 100% !important;
}

.input-group select#ServiceTypeId + .select2-container span.select2-selection {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group select#ServiceTypeId ~ .input-group-btn a.btn {
    padding: 13.3px 16px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.star-rating__wrap.star-ratingtask__wrap .star-rating__ico {
    font-size: 13px;
    padding-left: 4px;
    margin-bottom: 5px;
}

.star-rating__wrap.star-ratingtask__wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: flex-end;
    margin-top: 5px;
}

    .star-rating__wrap.star-ratingtask__wrap label.star-rating__ico:last-child {
        padding: 0;
    }

.all-task-info-detail li span.customerfeedbackwrap {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    white-space: nowrap;
}

.customerfeedbackwraptoggle {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}

.all-task-info-detail .customerfeedbackwraptoggle .customerfeedbackwrap {
    max-width: calc(100% - 30px);
}

.customerfeedbackwraptoggle .icon.icon-arrow-down {
    display: block;
    margin-top: 5px;
}

    .customerfeedbackwraptoggle .icon.icon-arrow-down::before {
        display: block;
    }

.customerfeedbackwraptoggle.toggle .icon.icon-arrow-down {
    transform: scale(-1);
    margin-top: 0;
}

.customerfeedbackwraptoggle.toggle .customerfeedbackwrap {
    white-space: normal;
}

.headnavbarbrand-text {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.mainToplabel {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.input-group select#RenewalTypeID ~ .input-group-btn a.btn {
    padding: 13.3px 16px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.input-group select#RenewalTypeID + .select2-container span.select2-selection {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.iconbutton.greenbttn {
    background-color: #32C787;
}

.gm-style-iw-t.gmStyleiw .gm-style-iw-chr .gm-style-iw-ch {
    display: none;
}

.div-help-and-support {
    padding: 15px;
    border-bottom: 1px solid #eeeeee;
    font-weight: 400;
    min-height: 55px;
}

    .div-help-and-support p {
        color: #9b9393;
        font-size: 13px;
        font-weight: 300;
        margin: 0px;
        padding-top: 4px;
    }

.csstransforms3d .offsidebarsupport-open .offsidebar.HelpprofileINfoAside {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    transition: transform .3s ease;
}

.offsidebar-sidebar-new {
    right: -235px;
}

#RiderWalletSummaryDiv > .pull-right {
    display: flex;
}



.kanbanModalwrap {
    position: absolute;
    bottom: 30px;
    right: 10px;
}

    .kanbanModalwrap .dropdown-select-submenu {
        background-color: #ffffff;
        position: absolute;
        padding: 0;
        margin: 0;
        bottom: 40px;
        right: 0;
        z-index: 99;
        min-width: 142px;
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        overflow: hidden;
        border-radius: 10px;
        transform: translateY(20px);
        opacity: 0;
        visibility: hidden;
    }

    .kanbanModalwrap:hover .dropdown-select-submenu {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

.kanbanModalbtn {
    border-radius: 50%;
    box-shadow: none;
    width: 37px;
    height: 37px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: #f55d5d;
    color: #fff;
    font-size: 22px;
    line-height: 1;
}

    .kanbanModalbtn:hover, .kanbanModalbtn:focus {
        background-color: #f55d5d;
        color: #fff;
    }

.kanbanModalwrap .dropdown-select-submenu a img, .dropdown-select-wrap .dropdown-select-submenu a img {
    width: 14px;
    filter: invert(1) grayscale(1);
}

.kanbanModalwrap .dropdown-select-submenu a {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    padding: 7px 26px 7px 16px;
    color: #000;
    white-space: nowrap;
    text-decoration: none;
    position: relative;
    transition: 0.3s all ease;
    border-radius: 0;
}

.kanbanModalwrap .dropdown-select-submenu li {
    width: 100% !important;
    min-height: auto !important;
    height: auto !important;
    padding: 0 !important;
    background-color: transparent !important;
    border-radius: 0 !important;
}

    .kanbanModalwrap .dropdown-select-submenu li + li {
        border-top: 1px solid rgb(61 61 61 / 10%) !important;
    }

.kanbanModalwrap .dropdown-select-submenu a:hover {
    background-color: #c9c9c9;
}

.routesetupwrapbox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin-top: 8px;
}
    /*.planTitleSection___Styledmain .planTitleSection___Styledmain_left input {
    border: 1px solid #3D3D3D;
    padding: 6px 14px;
    border-radius: 7px;
    font-size: 18px;
    line-height: 1;
}*/

    .routesetupwrapbox .location {
        font-size: 11px;
        line-height: 1.2;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        position: relative;
        z-index: 1;
    }

        .routesetupwrapbox .location label {
            margin: 0;
        }

        .routesetupwrapbox .location span.text {
            border: 3px solid #999fa5;
            width: 16px;
            height: 16px;
            display: inline-flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            font-size: 9px;
            background-color: #fff;
        }

            .routesetupwrapbox .location span.text + label {
                margin-left: 3px;
                color: #415FA5;
                margin-right: 3px;
                white-space: nowrap;
                max-width: calc(100% - 70px);
                overflow: hidden;
                text-overflow: ellipsis;
                width: 100%;
            }

        .routesetupwrapbox .location label ~ label {
            margin-left: 18px;
            font-size: 9px;
            text-align: right;
        }

        .routesetupwrapbox .location + .location {
            margin-top: 10px;
        }

    .routesetupwrapbox .locationwrap {
        position: relative;
        width: 100%;
        max-width: calc(100% - 85px);
    }

        .routesetupwrapbox .locationwrap::before {
            content: '';
            position: absolute;
            width: 1px;
            height: calc(100% - 20px);
            border: 1px dashed #000000;
            left: 7px;
            top: 5px;
        }

    .routesetupwrapbox .btn-blue-new {
        font-size: 9px;
        line-height: 1.2;
        color: #FFFFFF;
        padding: 5px 15px;
        display: inline-block;
        border-radius: 50px;
        background-color: #999fa5;
    }

aside.offsidebar.profileINfoAside.HelpprofileINfoAside .profileINfosidebar {
    padding-bottom: 0;
    min-height: auto;
    max-height: calc(100vh - 55px);
}

#TaskDetailView.task-detail-tab-widget .slimScrollDiv {
    height: auto !important;
}

    #TaskDetailView.task-detail-tab-widget .slimScrollDiv div#taskdetilsBodyWaypoints {
        height: calc(-302px + 100vh) !important;
    }


div#DeliveryInstructionDiv > .row > div {
    width: 100%;
}

.task-main-list #driverFilterWithTask + .slimScrollDiv {
    height: calc(-164px + 96vh) !important;
}

.popupItemHeader h4 {
    font-size: 16px !important;
    line-height: 1 !important;
}

.popupItemHeader p {
    margin: 0;
    line-height: 1.2;
    color: rgba(28, 28, 28, 0.4);
}


.gm-style-iw-t.gmStyleiw .gm-style-iw-chr {
    position: absolute;
    right: -14px;
    top: -14px;
    z-index: 1;
    display: inline-flex !important;
    width: auto;
}

    .gm-style-iw-t.gmStyleiw .gm-style-iw-chr button.gm-ui-hover-effect {
        top: auto !important;
        right: auto !important;
        left: auto !important;
    }



/*New Dispatch map Icon click event info windw desing*/



.mappmodalbottomwrap .top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

    .mappmodalbottomwrap .top .icon img {
        max-width: 17px;
        height: auto;
        border-radius: 50%;
        display: block;
    }

    .mappmodalbottomwrap .top h3 {
        font-size: 14px;
        line-height: 1.45;
        color: #1C1C1C;
        margin: 0;
        font-family: 'CircularStd-Book';
    }

    .mappmodalbottomwrap .top a {
        font-size: 12px;
        line-height: 1.2;
        text-decoration: none;
        margin-left: 9px;
        display: block;
        color: #1C1C1C;
        opacity: 0.6;
    }

.mappmodalbottomwrap .bottom {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 12px;
}

.mappmodalbottomwrap .mapctadark {
    border: 1px solid #1C1C1C;
    font-size: 14px;
    line-height: 1;
    padding: 7px 28px;
    text-decoration: none;
    border-radius: 10px;
    background-color: #1C1C1C;
    color: #ffffff;
    transition: 0.3s all ease-in-out;
}

    .mappmodalbottomwrap .mapctadark.invert, .mappmodalbottomwrap .mapctadark:hover {
        background-color: transparent;
        color: #1C1C1C;
    }

        .mappmodalbottomwrap .mapctadark.invert:hover {
            background-color: #1C1C1C;
            color: #ffffff;
        }

.mappmodalcenterwrap {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid rgba(28, 28, 28, 0.1);
    border-bottom: 1px solid rgba(28, 28, 28, 0.1);
    padding: 8px 10px;
}

    .mappmodalcenterwrap > p {
        margin: 0;
        max-width: calc(100% - 21px);
        margin-left: auto;
        font-size: 12px;
        line-height: 1.3;
        color: #1C1C1C;
        width: 100%;
    }

.mappmodaltopwrap .right .top .status.in-progress {
    color: orange;
}

.mappmodaltopwrap .right .top .status.completed {
    color: green;
}

.mappmodalcenterwrap > img {
    opacity: 0.5;
}

.mappmodalbottomwrap {
    padding: 6px 10px 10px 10px;
}

    .mappmodalbottomwrap .bottom .moreicon {
        width: 30px;
        height: 30px;
        border: 1px solid #1C1C1C;
        border-radius: 10px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        transition: 0.3s all ease-in-out;
    }

        .mappmodalbottomwrap .bottom .moreicon:hover {
            background-color: #ffffff;
            filter: invert(1);
        }

.mappmodaltopwrap {
    padding: 12px 12px 6px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

    .mappmodaltopwrap .left {
        max-width: 22px;
    }

        .mappmodaltopwrap .left .circle {
            width: 20px;
            height: 20px;
            border: 1px solid #1C1C1C26;
            font-size: 12px;
            line-height: 1;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            margin: 0;
            background-color: transparent;
            color: #1C1C1C;
        }

    .mappmodaltopwrap .right {
        max-width: calc(100% - 27px);
        width: 100%;
        padding: 0 10px 0 5px;
    }

        .mappmodaltopwrap .right .top {
            display: flex;
            align-items: flex-start;
        }

            .mappmodaltopwrap .right .top h3 {
                font-size: 14px;
                line-height: 1.2;
                margin: 0;
                color: #1C1C1C;
                width: 100%;
                max-width: 140px;
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
                font-family: 'CircularStd-Book';
            }

            .mappmodaltopwrap .right .top .status {
                font-size: 10px;
                line-height: 1.2;
                margin-left: auto;
                margin-right: 10px;
                color: #000000;
                text-transform: uppercase;
                font-weight: bold;
                margin-bottom: 0;
            }

                .mappmodaltopwrap .right .top .status.inprogress,
                .mappmodaltopwrap .right .top .status.arrived {
                    color: #EBB22D;
                }

                .mappmodaltopwrap .right .top .status.onhold {
                    color: #5d85f5;
                }

                .mappmodaltopwrap .right .top .status.cancelled,
                .mappmodaltopwrap .right .top .status.deleted,
                .mappmodaltopwrap .right .top .status.failed {
                    color: #de432c;
                }

                .mappmodaltopwrap .right .top .status.completed {
                    color: #2DB67E;
                }

        .mappmodaltopwrap .right .bottom {
            margin-top: 4px;
        }

            .mappmodaltopwrap .right .bottom ul {
                margin: 0;
                padding: 0;
                list-style: none;
                display: flex;
                flex-wrap: wrap;
            }

                .mappmodaltopwrap .right .bottom ul li {
                    font-size: 10px;
                    line-height: 1.2;
                    color: #1C1C1C;
                    padding: 3px 2px;
                    background: #F3F3F3B2;
                    border-radius: 4px;
                }

                    .mappmodaltopwrap .right .bottom ul li + li {
                        margin: 0 4px;
                        position: relative;
                    }

                    .mappmodaltopwrap .right .bottom ul li.pickup {
                        color: #1A73E8;
                        opacity: 1;
                        background: #1A73E81A;
                    }

                    .mappmodaltopwrap .right .bottom ul li.Delivery, .mappmodaltopwrap .right .bottom ul li.Pickup {
                        background: #1A73E81A;
                        padding: 3px 8px;
                        color: #1A73E8;
                    }

                    .mappmodaltopwrap .right .bottom ul li.Delivery {
                        color: #2DB67E;
                        background-color: rgba(45, 182, 126, 0.1);
                    }

        .mappmodaltopwrap .right .top h3.red {
            border: 1px solid #DF1D5A26;
            background: #DF1D5A1A;
            color: rgb(223 29 90);
            border-radius: 50px;
            display: inline-block;
            width: auto;
            padding: 1px 8px;
        }

.delivery-map .gm-style-iw.gm-style-iw-c {
    padding: 0;
    border-radius: 16px;
    box-shadow: 8px 16px 64px 0px #00000033;
}

.delivery-map .gm-style-iw .gm-style-iw-chr {
    position: absolute;
    top: 0;
    right: 0;
}

.delivery-map .gm-style-iw-d {
    overflow: auto !important;
}




.peningtaskupdate {
    font-family: 'CircularStd-Book';
    font-size: 14px;
    line-height: 1;
    padding: 8px 8px;
    background: #EBB22D;
    border: 1px solid #EBB22D;
    color: #ffffff;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-radius: 10px;
    box-shadow: 0px 4px 8px 0px #0000001A;
    margin-left: 30px;
    gap: 5px;
    position: relative;
}

    .peningtaskupdate > img {
        margin-top: -2px;
    }

    .peningtaskupdate > span {
        position: absolute;
        left: -20px;
        top: -10px;
        background-color: #000000;
        color: #ffffff;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        font-size: 12px;
        justify-content: center;
    }
.task-datetime-picker-section {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

    .task-datetime-picker-section button.task-datetime-picker-wrap {
        width: 100%;
        max-width: calc(100% - 74px);
    }