﻿@charset "utf-8";


/*===== Common CSS =====*/
/*===== HeaderFooter CSS =====*/

/*===== Login CSS =====*/
/*===== Driver CSS =====*/
/*===== Payroll CSS =====*/
/*===== Calendar CSS =====*/
/*===== Manifest CSS =====*/
/*===== RoutingMap CSS =====*/
/*===== VehicleList CSS =====*/
/*===== VehicleDetail CSS =====*/
/*===== PublicTransit CSS =====*/
/*===== Dashboard CSS =====*/
/*===== FMSCAHistory CSS =====*/
/*===== ResponsePlans_Index CSS =====*/
/*===== ResponsePlansHistory CSS =====*/
/*===== ProSummary CSS =====*/
/*===== HubManager & HumanResource & OrgDashboard CSS =====*/
/*===== BillingDetails CSS =====*/
/*===== invoiceSalesReports CSS =====*/
/*===== LeaderBoard CSS =====*/
/*===== elogReports CSS =====*/
/*===== listContacts CSS =====*/
/*===== LoginTracker-menuManagement CSS =====*/
/*===== scheduleRide & rideListHistory CSS =====*/
 


/*===== Modal CSS =====*/


/*===== Responsive CSS =====*/
 
/*===============================
  ===============================*/

/*===== Common CSS =====*/
body { overflow-x: hidden; padding: 0; margin: 0; font-family: 'proxima-soft', sans-serif; font-size: 16px; font-weight: 400; line-height: 22px; color: #414242; position: relative; text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale; }

* { box-sizing:border-box; }
*:hover { -webkit-transition: all ease-out 0.3s; -moz-transition: all ease-out 0.3s; -o-transition: all ease-out 0.3s; transition: all ease-out 0.3s; }
*:focus, .btn-default-focus { box-shadow: none !important; outline:none !important; }

h1, h2, h3, h4, h5, h6, p, ul { padding: 0; margin: 0; }

h1 { font-size: inherit; display: block; }
h2 { font-size: 30px; color: #0a2070; font-weight: bold; }
h3 { font-size: 30px; }
h4 { font-size: 20px; }
h5 { font-size: 24px; }
h6 { font-size: 16px; }

img, svg { border: none; vertical-align: middle; max-width: 100%; }
ul li { list-style: none; }

a { cursor: pointer; color:#3b4049; font-weight: 600; outline: none !important; text-decoration: none; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
a:hover, a:focus { text-decoration: none; color:#14bcff; }
a, input, button, textarea, a:focus, select:focus { outline: none; }
a:hover, a:focus, select:focus, button:focus { color: #fab329; outline: none; text-decoration: none; }
button, input, textarea { outline: none; -webkit-appearance: none; -moz-appearance: none; -moz-box-shadow: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }

button, .btn { font-size: 16px; color: #ffffff !important; font-weight:500; padding:0 20px; border:none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; padding: 6px 15px 7px;}

.primary-btn { padding:6px 15px 7px; background: #11357e !important; }
.primary-btn img.ic { min-width:20px; max-width:20px; height:20px; object-fit: cover; display: inline-block; vertical-align: middle; margin:-1px 5px 0 0; object-position: center top; }
.primary-btn:hover img.ic { object-position: center bottom; }
.primary-btn img.view { width:25px; height:25px; object-fit: cover; display: inline-block; vertical-align: middle; margin:-2px 5px 0 0; object-position: center top; }
.primary-btn img.arrow { width:13px; height:13px; object-fit: cover; display: inline-block; vertical-align: middle; margin:-2px 0 0 5px; object-position: center top; }
.primary-btn:hover { color: #fab329 !important; background: #11357e; }

.icon-link { min-width: 30px; max-width:30px; height: 30px; display: block; padding: 5px; margin:0 5px; }
.icon-link img.ic { width:20px; height:20px; object-fit: contain; display: block; object-fit: cover; object-position: center top; }
.icon-link:hover img.ic { object-position: center bottom; }

.linear-btn { color: #3b4049 !important; border:1px solid #dfe5ed; padding:5px 12px; display: flex; align-items: center; }
.linear-btn img { min-width:25px; max-width:25px; height:25px; margin-right:5px; object-fit: cover; object-position: center top; }
.linear-btn:hover, .linear-btn:focus, .linear-btn:active { color: #3b4049; border:1px solid #3b4049; }
.linear-btn:hover img { object-position: center bottom; }

.primary-btn.linear-btn { color: white !important; border:1px solid #11357e !important; }
.primary-btn.linear-btn:hover { color: #fab329 !important; }


.primary-btn.dropdown-toggle::after { display: none; }


.red-btn { background: #ff5233 !important; }
.red-btn:hover { color: white !important; text-decoration: none !important; background: #e93819 !important; }


.grey-btn { color: black; background: #999999 !important; }
.grey-btn:hover { color: white !important; text-decoration: none !important; background: #666666 !important; }


.purple-btn { color: white; background: #9e27b1 !important; }
.purple-btn:hover { color: white !important; text-decoration: none !important; background: #700e7f !important; }


.linear-btn.day-btn { min-width:38px; padding:2px 5px; font-size:12px !important; line-height: 15px !important; display: flex; flex-direction: column; align-content: center; }
.linear-btn.day-btn img { min-width: 19px; max-width: 19px; height: 19px; margin:0; }


label { font-weight: 600; }
input::-webkit-placeholder, textarea::-webkit-placeholder, input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; }

form { text-align: center; }
.form-group { text-align: left; position:relative; }
label { margin-bottom: 0.3rem !important; color: #3b4049; line-height: 18px; }
.form-group .form-control, .dataTables_filter input, select.form-control { width:100%; max-width:100%; height:40px !important; background:#fff; box-sizing: border-box; display: block; font-weight: 500; font-size:16px; color:#001041; padding:0 12px; border:1px solid #dfe5ed; outline:none; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; }
.form-group select.form-control { padding-right:35px; }
.form-group textarea.form-control { height:80px !important; resize: none; padding:8px 12px; }
.form-group .form-control:focus { border:1px solid #11357e; }
.select-option .arrow { pointer-events: none; overflow: hidden; position: absolute; right:20px; bottom:14px; width:12px; height:12px; display: block; transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); }
.select-option .arrow img { display: block; }
.form-group.d-flex { align-items: center; }
.form-group.d-flex label { margin:0 10px 0 0 !important; }
.form-group.d-flex label.nowrap { white-space: nowrap; }

input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration { display: none; }

.checkbox *, .radiobtn * { transition:0s ease-in-out; -webkit-transition:0s ease-in-out; -moz-transition:0s ease-in-out; }
.checkbox input[type="checkbox"] { display:none; }
.checkbox input[type="checkbox"] + label { color:#3b4049; font-weight: 400; cursor: pointer; margin:0px !important; }
.checkbox input[type="checkbox"] + label span { display:inline-block; vertical-align:middle; min-width:20px; max-width:20px; height:20px; margin:0 8px 0 0; position: relative; top:-2px;  background:url("../images/checkbox.svg")no-repeat left top / 20px; }
.checkbox input[type="checkbox"]:checked + label span { background:url("../images/checkbox.svg")no-repeat left bottom / 20px; }


.checkbox.withImg input[type="checkbox"] + label { padding-left: 25px; position: relative; }
.checkbox.withImg input[type="checkbox"] + label img {  min-width:20px; max-width:20px; height:20px; margin:0 8px 0 0; object-fit: cover; object-position: center top; position: absolute; left: 0; top: 0; bottom: 0; margin: -1px auto 0; }
.checkbox.withImg input[type="checkbox"]:checked + label img { object-position: center bottom; }



.radiobtn input[type="radio"] { display:none; }
.radiobtn input[type="radio"] + label { color:#3b4049; font-weight: 400; cursor: pointer; margin:0px !important; }
.radiobtn input[type="radio"] + label span { display:inline-block; vertical-align:middle; width:20px; height:20px; margin:0 8px 0 0; position: relative; top:-1px;  background:url("../images/radiobtn.svg")no-repeat left top / 20px; }
.radiobtn input[type="radio"]:checked + label span { background:url("/Assets_New/images/radiobtn.svg")no-repeat left bottom / 20px; }

.loginCheckbox {
    display: flex;
    gap: 10px;
    align-items: center;
    vertical-align: middle;
    margin-bottom: 20px;
}

    .loginCheckbox input {
        width: 20px !important;
        height: 20px !important;
        border-radius: unset !important;
        border-color: #11357e !important;
        border: 1px solid #11357e;
    }

.login-box .loginCheckbox label {
    margin-bottom: -1px !important;
    font-weight: 400 !important;
    color: #3b4049;
    cursor: pointer;
}

.loginCheckbox .form-check-input:checked {
    background-color: #11357e !important;
    border-color: #11357e !important;
}

/*Old Checkbox design*/
.checkbox-styled input ~ span, .radio-styled input ~ span {
    position: relative;
    padding-left: 30px;
    display: inline-block;
    cursor: pointer;
    vertical-align: text-top;
}

.checkbox-styled input[type="checkbox"], .radio-styled input[type="radio"] {
    position: absolute;
    z-index: -1;
    opacity: 0;
    filter: alpha(opacity = 0);
}

.checkbox-styled input ~ span:before, .radio-styled input ~ span:before {
    content: "";
    position: absolute;
    left: 0;
    z-index: 1;
    width: 20px;
    height: 20px;
    border: 1px solid #11357e;
    top: 0px;
    border-color: #11357e !important;
}
.radio-styled:not(ie8) input ~ span:after {
    content: "";
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 1;
    width: 0;
    height: 0;
    background-color: #0aa89e;
    border-radius: 50%;
}
.radio-styled input ~ span:before {
    top: 0;
    border-radius: 50%;
}
.radio-styled input ~ span:before {
    content: "";
    position: absolute;
    left: 0;
    z-index: 1;
    width: 20px;
    height: 20px;
    border: 2px solid #535858;
}
.radio-styled input ~ span:before {
    border: 1px solid #11357e;
    top: 0px;
}

.checkbox-styled input:checked ~ span:before {
    background: url("../images/checkbox.svg")no-repeat left bottom / 18px;
}
.radio-styled input:checked ~ span:before {
    background: url("/Assets_New/images/radiobtn.svg")no-repeat left bottom / 18px;
}

.checkbox-styled input ~ span:before {
    border: 1px solid #535858;
    top: 0px;
    width: 20px !important;
    height: 20px !important;
    border-radius: unset !important;
    border-color: #11357e !important;
    border: 1px solid #11357e;
}
.checkbox-styled.disabled ~ span:before, .checkbox-styled input[disabled] ~ span:before, .checkbox-styled input[readonly] ~ span:before {
    border-color: #e5e6e6 !important;
}
.checkbox-styled.disabled ~ span:before, .radio-styled.disabled ~ span:before, .checkbox-styled input[disabled] ~ span:before, .radio-styled input[disabled] ~ span:before, .checkbox-styled input[readonly] ~ span:before, .radio-styled input[readonly] ~ span:before {
    border-color: #3b404947 !important;
}

.no-border { border: none !important; }

header, main, section, footer { display: block; position: relative; }
.side-padding { padding-left:50px; padding-right:50px; }
 
/*===== *************** =====*/


/*===== HeaderFooter CSS =====*/
header { padding:5px 0 8px; border-bottom:2px solid #dfe5ed; z-index: 21; background: #ffffff; }
.navbar { margin-top:0px; padding:0; align-items: flex-end; } 
.navbar-collapse { justify-content: flex-end; align-items: flex-end; flex-direction: column; }
.navbar .navbar-brand, .navbar .navbar-brand a, .navbar .navbar-brand img { padding:0; margin:0; width:134px; height:68px; display: block; object-fit: contain; }
.navbar .navbar-brand { margin-top:-7px; }

/*.navbar-collapse * { transition:0.2s ease-in-out; -webkit-transition:0.2s ease-in-out; -moz-transition:0.2s ease-in-out; }*/
header .admin-menu { justify-content: flex-end; position: relative; z-index: 2; }
header .admin-menu .dropdown-menu { right:0; }
header .admin-menu, header .admin-menu ul.list { display: flex; align-items: center; }
header .admin-menu ul.list li.dropdown>a { font-weight: normal; padding:0 5px; margin:0 15px; display: flex; align-items: center; }
header .admin-menu ul.list li a img.ic { min-width:23px; max-width:23px; height:23px; object-fit: cover; object-position: center top; margin-right:5px; }
header .admin-menu ul.list li a img.arrow { min-width:12px; max-width:12px; height:12px; object-fit: contain; padding:1px; }
header .admin-menu .admin-dropdown { margin-left:20px; position: relative; }
header .admin-menu .admin-dropdown .dropdown-toggle { color: #3b4049 !important; font-weight: normal; border: none; background: transparent; padding:0; }
header .admin-menu .admin-dropdown .dropdown-toggle::after { margin: 0; vertical-align: middle; border: none; width:10px; height:10px; background: url("../images/greyarrow-ic.svg")no-repeat center center; }
header .admin-menu .admin-dropdown .dropdown-toggle img.placeholder { width:25px; height:25px; margin-right:10px; opacity: 1; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; }


.navbar-collapse .navbar-nav .nav-item, .navbar-collapse .navbar-nav .dropdown { margin-left:40px; }
.navbar-collapse .navbar-nav .nav-item:first-child { margin-left:0; }
.navbar-collapse .navbar-nav .nav-link { color: #7d95bd; font-weight: normal; padding:0 5px; text-align: center; line-height: 18px; }
.navbar-collapse .navbar-nav .nav-link img { display: block; margin: auto; width:28px; height:28px; object-fit: cover; object-position: center top; }
.navbar-collapse .navbar-nav .nav-link span { display: flex; align-items: center; }
.navbar-collapse .navbar-nav .nav-link span .arrow { min-width: 12px; max-width: 12px; height: 12px; object-fit: contain; padding: 1px; margin:2px 0 0 2px; }
.navbar-collapse .navbar-nav .dropdown-menu { right:inherit; top:100% !important; }
.dropdown-menu a, header .admin-menu .admin-dropdown a { color: #3b4049; padding:5px 15px; display: block; font-weight: normal; }
.dropdown-menu a { font-size:15px; }
.navbar-collapse .navbar-nav .dropdown-menu a:hover, header .admin-menu .dropdown-menu a:hover { background: #e1eaf4; }

/* width */
.dropdown-menu::-webkit-scrollbar {
  width: 4px;
}

/* Track */
.dropdown-menu::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgba(0,0,0,0.15); 
  border-radius: 2px;
}

/* Handle */
.dropdown-menu::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.5); 
  border-radius: 2px;
}

/* Handle on hover */
.dropdown-menu::-webkit-scrollbar-thumb:hover {
  background: rgba(0,0,0,0.5); 
}

.dropdown-menu { right:0; max-height:300px; overflow: auto; }
.dropdown-menu .checkbox label { white-space: nowrap; }
.dropdown-menu .checkbox { margin:10px 12px; }

.datepicker.dropdown-menu { right:inherit; max-height:inherit; overflow: inherit; }


.navbar-collapse .navbar-nav .active, .navbar-collapse .navbar-nav .active .nav-link, .navbar-collapse .navbar-nav .nav-link:hover, header .admin-menu ul.list li a:hover { color: #11357e !important; }
header .admin-menu ul.list li.dropdown.active img, .navbar-collapse .navbar-nav .active img, .navbar-collapse .navbar-nav .nav-link:hover img, header .admin-menu ul.list li a:hover img { object-position: center bottom; }




footer { background: #0d1124; padding:12px 0; position: fixed; left:0; right:0; bottom:0; z-index: -1; }
footer .d-flex { width:100%; justify-content: center; }
footer p, footer a { font-size: 15px; color: #ffffff; font-weight: 400; line-height: 20px; }
footer a { margin-left:5px; padding-left:5px; border-left:1px solid #808290; }





/*===== *************** =====*/



/*===== Login CSS =====*/
.banner-bg { height:250px; background: url("../images/login-bannerbg.jpg")no-repeat center center / cover; }

.login-box { width:450px; max-width:90%; margin:-200px auto 0; padding:25px 40px; text-align: center; background: #ffffff; box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.25); }
.login-box h1, .login-box h1 img { width:100px; height:50px; display: block; object-fit: contain; margin: auto; }
.login-box h2 { font-size:25px; color: #3b4049; font-weight: normal; margin:20px 0; }

.login-box label { margin-bottom:2px !important; }
.login-box .form-group { margin-bottom:20px; }
.login-box .form-control { height:50px !important; padding:10px 15px; }
.login-box .btn { display: block; width: 100%; padding: 12px 25px; text-transform: uppercase; }


.latest-news { padding:30px 0; }
.news-box { display: block; background: #ffffff; padding:10px 10px 10px 90px; margin-top:10px; position: relative; }
.news-box img.thumb-img { position: absolute; left:0; top:12px; width:70px; height:70px; object-fit: cover; }
.news-box h4 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.news-box p { color: #3b4049; margin:5px 0 0; font-weight: normal; line-height: 20px; max-height:44px; overflow: hidden; }
.news-box span.link { color: #7d95bd; display: flex; align-items: center; }
.news-box span.link img { width: 12px; height: 12px; object-fit: cover; object-position: top center; margin:3px 0 0 10px; }



.news-box.highlighted { background: #dce6fb; }
.news-box:hover span.link { color: #fab329; }
.news-box:hover span.link img { object-position: bottom center; }






/*===== *************** =====*/



/*===== Driver CSS =====*/
main.main-wrp { background: #ffffff; /*z-index: 10;*/ margin-bottom:80px; }

.breadcrumbs-wrp { margin:15px 0 10px; }
.breadcrumbs { display: flex; align-items: center; }
.breadcrumbs a { margin-right:25px; color: #030d22; border-bottom:2px solid #030d22; position: relative; }
.breadcrumbs a::before { content: ">"; display: block; position: absolute; left:-15px; top:0; }

.breadcrumbs a:first-child::before { display: none; }
.breadcrumbs a.current { color: #808290; border: none; pointer-events: none; }


.map { width:100%; height:500px; position: relative; }
.map iframe { width:100%; height:100%; }
.map .primary-btn { position: absolute; right:20px; top:20px; }

    .map .map-filters {
        padding: 13px 20px;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(201, 225, 248, 0.95); 
        /*display: flex;*/
        justify-content: flex-start;
        align-items: center;
    }
.map .map-filters > label { color: #3b4049; font-weight: bold; margin:0 !important; }
.map .map-filters .radiobtn { margin-left:25px; }



.datatable-wrp { margin:50px 0; }

.datatable-wrp .checkbox-columnbtn { display: flex; justify-content: space-between; align-items: center; margin:10px 0; }
.checkbox-columnbtn .primary-btn { border: none; color: #ffffff; }
.checkbox-columnbtn .primary-btn::after { display: none; }
.checkbox-columnbtn .checkbox-listing { display: flex; justify-content: flex-start; align-items: center; max-width:75%; flex-wrap: wrap; }
.checkbox-columnbtn .checkbox-listing .checkbox { margin:5px 30px 5px 0; }


.table-wrp { overflow: auto; }
.table-wrp table { margin:0; }
.table-wrp table * { line-height: 18px; text-align: center; border: none !important; white-space: normal; box-shadow: none !important; outline: none !important; }
.table-wrp th { font-size: 15px; }
.table-wrp th, .table-wrp td { padding:6px 10px; color: #3b4049; font-weight: normal; background: #e1eaf4; border-bottom:1px solid #717681 !important; }
.table-wrp td .icon { min-width:20px; max-width:20px; height:20px; display: inline-block; margin:0 6px; }
.table-wrp td .icon img { width:100%; height:100%; object-fit: cover; object-position: center top; }
.table-wrp td .icon:hover img { object-position: center bottom; }
.table-wrp td .badge { background: #11357e; padding:1px 6px 1.5px; text-align: center; border-radius:8px; }
.table-wrp .sort { cursor: pointer; }
.table-wrp th.sort::after { display: inline-block; vertical-align: middle; content: ""; width:12px; height:12px; margin-left:5px; }
.table-wrp th.sort.az::after { background: url("../images/sort-az.svg")no-repeat center top / cover; }
.table-wrp th.sort.az:hover::after { background: url("../images/sort-az.svg")no-repeat center bottom / cover; }
.table-wrp th.sort.num::after { background: url("../images/sort-num.svg")no-repeat center top / cover; }
.table-wrp th.sort.num:hover::after { background: url("../images/sort-num.svg")no-repeat center bottom / cover; }



.table-wrp td { background: #ffffff; vertical-align: middle; }
.table-wrp td a, .table-wrp table .blue { font-weight: normal; color: #0e89f7; cursor: pointer; }
.table-wrp td a:hover, .table-wrp table .blue:hover { text-decoration: underline; }
.table-wrp td .info-icons { display: flex; flex-wrap: wrap; min-width:70px; max-width:70px; margin: auto; }
.table-wrp td .info-icons a { margin:4px; }
.table-wrp td .info-icons a, .table-wrp td .info-icons a img { display: block; max-width:15px; height:15px; flex: 0 0 33%; }



.pagination-records, .markeditems-autorefresh { background: #e1eaf4; padding:6px 15px; display: flex; justify-content: space-between; align-items: center; }
.pagination-records .total-records { display: flex; align-items: center; }
.pagination-records .total-records .form-group { margin-left:20px; }
.pagination-records .total-records .form-group select { color: #3b4049; }

.pagination-records .pagination ul { display: flex; align-items: center; }
.pagination-records .pagination ul li { margin:0 5px; }
.pagination-records .pagination ul li a { color: #3b4049; font-weight: normal; padding:3px 5px; display: block; line-height: 16px; }
.pagination-records .pagination ul li a:hover, .pagination-records .pagination ul li a.current { color: #11357D; font-weight: 600; text-decoration: underline; }
.pagination-records .pagination ul li a.img { padding:5px; border:1px solid transparent;  }
.pagination-records .pagination ul li a.img img { width:12px; height:12px; display: block; object-fit: cover; object-position: center top; }

.pagination-records .pagination ul li a.img.disabled { opacity: 0.35; pointer-events: none; }
.pagination-records .pagination ul li a.img:hover { border:1px solid #fab329; }
.pagination-records .pagination ul li a.img:hover img { object-position: center bottom; }


.markeditems-autorefresh { border-top:1px solid #717681; }
.markeditems-autorefresh .markeditems { display: flex; align-items: center; }
.markeditems-autorefresh label { font-weight: normal; margin:0 8px 0 0 !important; }
.markeditems-autorefresh select { color: #3b4049; }
.markeditems-autorefresh .btn { padding:1px 5px; }

.autorefresh, .autorefresh .action { display: flex; align-items: center; }
.autorefresh .action { margin-left:10px; }
.autorefresh .action a { margin:0 5px; }
.autorefresh .action a, .autorefresh .action a img { display: block; width:22px; height:22px; object-fit: cover; object-position: center top; }
.autorefresh .action a:hover img { object-position: center bottom; }


/*===== *************** =====*/


/*===== Payroll CSS =====*/
.payroll .datatable-wrp .filters .title-filters { display: flex; justify-content: space-between; align-items: center; margin-bottom:20px; }
.payroll .datatable-wrp .filters .checkbox-columnbtn { margin:0; }
.payroll .datatable-wrp .filters .checkbox-columnbtn .coulumn-dropdown { margin:0 20px 0 5px; }
.payroll .datatable-wrp .filters .checkbox-listing .checkbox { margin-right: 25px; }
.payroll .datatable-wrp .filters label.nowrap { white-space: nowrap; }

.payroll .datatable-wrp .filters .form-group { margin:10px 0; }
.payroll .datatable-wrp .filters label { margin-bottom:0 !important; }
.payroll .datatable-wrp .filters .select-option { align-items: center; }
.payroll .datatable-wrp .filters .select-option label.nowrap { margin-right:10px; }

.payroll .datatable-wrp .filters .option-btns { display: flex; }
.payroll .datatable-wrp .filters .option-btns a { margin-right:15px; }
.payroll .datatable-wrp .filters .option-btns a, .payroll .datatable-wrp .filters .option-btns a img { width:25px; height:25px; display: block; object-fit: cover; object-position: center top; transition:0s ease-in-out; -webkit-transition:0s ease-in-out; -moz-transition:0s ease-in-out; }
.payroll .datatable-wrp .filters .option-btns a:hover img { object-position: center bottom; }

.advanced-fitlers { margin:-10px 0 15px; }

/*===== *************** =====*/


/*===== Calendar CSS =====*/
.calendar-wrp .title { display: flex; justify-content: space-between; align-items: flex-start; }


.calendar { margin:30px 0; width:100%; overflow: auto; }
.calendar_legends { display: flex; align-items: center; }
.calendar_legends span { padding:1px 6px; color: white; margin-left:10px; font-size: 12px; text-transform: uppercase; }
.calendar_legends span.single_event { background: #0dd3c0; }
.calendar_legends span.recuring_event { background: #0896a0; }
.calendar_legends span.manifest, .days .day_event.manifest { background: #00ca01; }
.calendar_legends span.pro_number, .days .day_event.pro_number { background: #2c9be6; }
.calendar_legends span.holiday { background: #ff9f89; }
.calendar_legends span.vaction { background: #ff8c00; }

.calendar .calendar_top { margin:20px 0 15px; }
.calendar .calendar_top ul { display: flex; justify-content: space-between; align-items: center; }
.calendar .calendar_top ul li { min-width:33%; max-width:33%; }
.calendar_top .month { font-size: 20px; text-transform: uppercase; letter-spacing: 3px; display: flex; justify-content: center; align-items: center; }
.calendar_top .month a { margin:0 20px; }
.calendar_top .tabs { padding:0; display: flex; align-items: center; margin:0 5px; }
.calendar_top .tabs a { font-size:14px; text-transform: uppercase; padding:5px 10px; border:1px solid #7d95bd; color: #7d95bd; }
.calendar_top .tabs a:hover, .calendar_top .tabs a.selected { color: white; background: #7d95bd; }



.calendar .weekdays { border:1px solid #dfe5ed; margin: 0; padding: 0; background-color: #f5f5f7; }
.calendar .weekdays, .calendar .days { border:1px solid #dfe5ed; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; }
.calendar .weekdays li, .calendar .days li { width: 14.2857143%; text-align: center; padding:10px 0; }
.calendar .days li a { display: block; margin-bottom:10px; }

.calendar .days .day_event { padding:7px 10px; margin:2px; text-align: left; color: white; font-size: 13px; line-height: 18px; }




/*===== *************** =====*/


/*===== Manifest CSS =====*/
.manifest-summary {}
.manifest-summary .table-wrp { margin-top:20px; }
.manifest-summary h2 { margin-bottom:10px; }

.search-box { width:100%; margin-right:30px; }
.search-box .form-control { padding:0 45px 0 12px; appearance:none; -webkit-appearance:none; }
.search-box .btn.search-btn { position: absolute; right:0; top:0; bottom:0; padding:8px; border:1px solid #dfe5ed; }
.search-box .btn.search-btn img { width:25px; height:25px; display: block; object-fit: cover; object-position: center top; }
.search-box .btn.search-btn:hover img { object-position: center bottom; }

.btn.icon-btn { padding:9px; margin-top:1px; }
.btn.icon-btn img { min-width:20px; max-width:20px; height:20px; display: block; object-fit: cover; object-position: center top; }
.btn.icon-btn:hover img { object-position: center bottom; }

/*===== *************** =====*/


/*===== RoutingMap CSS =====*/
main.routingmap-wrp { margin:0; }

.mapbox { position: fixed; left:320px; right:0; top:90px; bottom:0; }
.mapbox iframe { width:100%; height:100%; }

aside { position: fixed; left:0; top:90px; bottom:0; width:320px; background: #11357e; overflow-y: auto; overflow-x: visible; padding-bottom: 25px; transition:0.2s ease-in-out; -webkit-transition:0.2s ease-in-out; -moz-transition:0.2s ease-in-out; }
aside .border-bottom { border-bottom:2px solid #ccd4e0; margin-bottom:20px; padding-bottom:20px; }
aside .expand-collapse { width:40px; height:40px; background: #fab329; display: block; position: fixed; left:300px; top:120px; display: none; transition:0.35s ease-in-out; }
aside .expand-collapse img { padding:5px; transition:0.2s ease-in-out; -webkit-transition:0.2s ease-in-out; -moz-transition:0.2s ease-in-out; transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); }

aside label { font-size:12px; text-transform: uppercase; color: #ffffff; opacity: 0.75; display: flex; align-items: center; margin:0 0 5px !important; }
aside label img, aside .accordion-button img { width:20px; height:20px; margin-left:5px; }
aside .form-group { margin:15px 20px; }
aside .form-control { font-style: italic; color: #ffffff !important; height:45px; border:2px solid rgba(255,255,255,0.5) !important; background: transparent !important; }
aside .form-group textarea.form-control { height:80px !important; padding:5px 15px; }
aside .form-control:focus {  border:2px solid rgba(255,255,255,1) !important; }

aside .sorting-ic { position: absolute; right:0; top:0; width:15px; height:15px; }
aside .sorting-ic img { display: block; width:100%; height:100%; object-fit: cover; object-position: center top; }
aside .sorting-ic:hover img { object-position: center bottom; }

aside .accordion { padding:10px 20px; margin-bottom:10px; background: rgba(0,0,0,0.2); }
aside .accordion-item { background: transparent; border: none; }
aside .accordion-button { padding:5px 0; color: #ffffff !important; background: transparent !important; color: #ffffff; display: flex; }
aside .accordion-button::after { width:15px; background: url("../images/aside-downarrow.svg")no-repeat center center !important; }
aside .accordion-body { padding:0; }
aside .accordion-body .form-group { margin:10px 0; }

aside .yellow-btn { background: #fab329; border:2px solid #fab329; color: #11357e; text-transform: uppercase; padding:8px 20px 6px; font-size:14px; }
aside .yellow-btn:hover { background: transparent; border:2px solid #fab329; color: #fab329; }

aside .nav-tabs { display: flex; justify-content: space-between; align-items: center; border: none; }
aside .nav-tabs li { flex: 2; text-align: center; }
aside .nav-tabs .nav-link { display: block; width:100%; padding:8px 5px; background: transparent !important; border: none; color: #ffffff !important; opacity: 0.5; border-radius: 0px; }
aside .nav-tabs .nav-link.active { opacity: 1; background: #0a1f4c !important; }

aside .tab-content { padding:15px; background: #0a1f4c; }
aside .tab-content .form-group { margin:0 0 10px; }

aside .checkbox { margin:10px 0; }
aside .checkbox label { color: #ffffff !important; line-height: 20px; opacity: 1; }
aside .checkbox input[type="checkbox"] + label span { background: url("../images/checkbox-orange.svg")no-repeat left top / 20px; }
aside .checkbox input[type="checkbox"]:checked + label span { background:url("../images/checkbox-orange.svg")no-repeat left bottom / 20px; }

aside .selected-items, aside .transport-items { display: flex; flex-wrap: wrap; }
aside .selected-items span { text-transform: uppercase;  padding:2px 10px 1px; background: #fab329; margin:0 10px 10px 0; }
aside .selected-items a.close { width:16px; height:16px; }
aside .transport-items a { width:30px; height:30px; display: block; margin:0 10px 10px 0; opacity: 0.5; }
aside .transport-items a img { width:100%; height:100%; object-fit: cover; object-position: center top; }

aside .transport-items a:hover, aside .transport-items a.selected { opacity: 1; }
aside .transport-items a.selected img { object-position: center bottom; }

/*===== *************** =====*/



/*===== VehicleList CSS =====*/
.btns-group { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
.btns-group .btn, .btns-group .dropdown-toggle { margin-left:10px; }


.checkbox-columnbtn .dropdown-menu { right:0; }


/*===== *************** =====*/



/*===== VehicleDetail CSS =====*/
.required { color: red !important; }

.vehicle-details .center-box { max-width:1200px; margin:20px auto; padding:15px; border: 2px solid #e1eaf4; }
.vehicle-details .note { color: #084298; background-color: #cfe2ff; border: 1px solid #a5b3c7; padding: 8px 12px; margin-bottom:20px; }

.vehicle-details .form-group { margin:0 0 8px 0; }
.vehicle-details .radiobtn, .vehicle-details .checkbox { margin:5px 20px 5px 0; }
.vehicle-details .radiobtn input[type="radio"] + label span { top:-2px; }



/*===== *************** =====*/



/*===== PublicTransit CSS =====*/
.public-transit h2 { margin-bottom:15px; }

.alert { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin:15px 0; border-radius: 0; padding: 8px 12px; }
.alert div { margin:0 15px; }
.alert label { font-size: 13px; margin:3px !important; }

.alert.warning { color: #664d03; background: #fff3cd; border:1px solid #dfcd98; }
.alert.submited-details { padding:3px 10px 4px; }

.public-transit .table-wrp table * { text-align: left; }

.public-transit .mapbox { position: relative; left:0; right:0; top:0; bottom:0; margin:20px 0; height:500px; }

/*===== *************** =====*/



/*===== Dashboard CSS =====*/
.table-wrp .no-border { border: none !important; }
.table-wrp .border-left { border-left: 1px solid #717681 !important; }
.table-wrp .green-dot { width:10px; height:10px; display: block; background: #52a917; margin: auto; border-radius: 50%; }

.chart-box { margin:10px 0 15px; }
.chart-box .checkbox { text-align: center; margin:5px 0; }

/*===== *************** =====*/



/*===== FMSCAHistory CSS =====*/
.minWidth-200 { min-width:200px; }


.m-0 { margin:0 !important; }
.ml-5 { margin-left:5px !important; }
.ml-10 { margin-left:10px !important; }
.ml-20 { margin-left:20px !important; }
.ml-30 { margin-left:30px !important; }
.ml-50 { margin-left:50px !important; }
.mr-5 { margin-right:5px !important; }
.mr-10 { margin-right:10px !important; }
.mlr-20 { margin-left:20px !important; margin-right:20px !important; }
.mt-0 { margin-top:0 !important; }
.mb-0 { margin-bottom:0 !important; }
.mb-10 { margin-bottom:10px !important; }
.mb-5 { margin-bottom:5px !important; }
.mb-20 { margin-bottom:20px !important; }
.mtb-0 { margin-top:0 !important; margin-bottom:0 !important; }
.mt-5 { margin-top:5px !important; }
.mt-10 { margin-top:10px !important; }
.mt-20 { margin-top:15px !important; }
.mt-30 { margin-top:30px !important; }
.mtb-10 { margin-top:10px !important; margin-bottom:10px !important; }
.mtb-20 { margin-top:15px !important; margin-bottom:15px !important; }
.success { color: #30af4e; font-weight: bold; }
.failed { color: #af2d3b; font-weight: bold; }

.separator { height:0px; margin:10px 0;  border-top:1px solid #e1eaf4; }

.FMSCAHistory {  }
.table-wrp table img.status-ic { width:20px; height:20px; object-fit: cover; object-position: center top; display: block; margin: auto; cursor: pointer; }
.table-wrp table img.status-ic:hover { object-position: center bottom; }

.dropdown-menu.dropdown-menu-right { right: 0; }



.table-wrp table .yellow { color: #fab329; cursor: pointer; }
.table-wrp table .yellow:hover { text-decoration: underline; }




/*===== *************** =====*/



/*===== ResponsePlans_Index CSS =====*/
.ResponsePlans_Index .badge { font-size:12px !important; color: white; padding:3px 7px !important; margin:0 5px !important; line-height:16px !important; border: none !important; }

.badge.grey { background: grey !important; }
.badge.orange { background: #fab329 !important;  }
.badge.green { background: green !important; color: #fff; }
span.red { color: #ffa52e !important;  }

.badge.blue { color: white !important;  }
.ResponsePlans_Index span.blue { color: white !important; font-weight: 500; }


.ResponsePlans_Index .table-wrp .d-felx { align-items: center; }


#AddEditResponse .modal-body .d-flex { flex-wrap: wrap; }
#AddEditResponse .modal-body .form-group.d-flex { flex-wrap: nowrap; }
#AddEditResponse .modal-body .form-group.d-flex label { margin-right:10px !important; }
#AddEditResponse .modal-body .checkbox { margin:5px 20px 5px 0; }


#AddEditResponse .modal-body .editor { width: 100%; height: 300px; border: 2px solid #717681; background: #e1eaf4; margin: 0 0 20px; }

#AddEditResponse .modal-body .pagination-records .total-records .form-group { margin:0 0 0 20px; }
#AddEditResponse .alert { padding: 8px 10px; }
#AddEditResponse .alert p { margin:0 15px; font-weight: 600; }


/*===== *************** =====*/



/*===== ResponsePlansHistory CSS =====*/
alert.warning { padding-right:50px; position: relative; }
.alert .btn.icon-btn { position: absolute; right:0; top:0; bottom:0; margin: auto; }


.responsePlansHistory .checkbox-columnbtn { margin:0; }









/*===== *************** =====*/



/*===== ProSummary CSS =====*/
.pro-summary h5 { font-size: 20px; margin-bottom:8px; }
.pro-summary .title { margin:10px 0 5px; font-weight: bold; }
.pro-summary .checkbox, .pro-summary .radiobtn { margin-right:20px; }  
.pro-summary .primary-btn {
    min-width: 90px;
    margin: 0 0 0 10px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pro-summary .primary-btn.icon-btn { min-width: inherit; }

.pro-summary .search-box { margin:0 10px; }

.pro-summary .checkbox-columnbtn .checkbox-listing { max-width:50%; }
.pro-summary .checkbox-columnbtn .linear-btn { padding:5px 8px 5px 5px; }
.pro-summary .checkbox-columnbtn .primary-btn.icon-btn { padding:8.5px 10px; }


.table-badges { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; }
.table-badges .badge { font-size:12px; color: black; font-weight: 500; text-transform: uppercase; padding:5px 7px; display: block; border-radius: 0; margin:5px; }
.table-badges .badge.grey { background: #cac9d8; }
.table-badges .badge.white { background: #fafae6; }
.table-badges .badge.lightgreen { background: #e2f1e3; }
.table-badges .badge.blue { background: #11357e; color:white; }
.table-badges .badge.orange { background: #fab329; color:white; }
.table-badges .badge.black { background: #000000; color:white; }
.table-badges .badge.green { background: #237e11; color:white; }


.table-wrp td a.badge-blue { color: #11357e; }
.table-wrp td a.badge-orange { color: #fab329; }
.table-wrp td a.badge-black { color: #000000; }
.table-wrp td a.badge-green { color: #237e11; }



#proSummaryFiltersModal .modal-dialog, #showOnMapModal .modal-dialog { max-width:1400px; }

#proSummaryFiltersModal .title { display: flex; justify-content: center; background: #e1eaf4; margin: 0 0 2px; padding: 10px; color: #11357e; }
#proSummaryFiltersModal .title div { margin:0 15px; }


body { padding:0 !important; }

.imgTextList, .imgTextList div { display: flex; align-items: center; }
.imgTextList div { margin-right: 30px; }
.imgTextList div img, .imgTextList div span { display: block; margin-right: 5px; }
.imgTextList div img { min-width: 25px; max-width: 25px; height: 25px; object-fit: cover; object-position: center top; }

#showOnMapModal .map, #showOnMapModal .map iframe { width:100%; height:425px; }
.prosWrp .list { margin-top: 10px; }
.prosWrp .list p { padding: 6px 10px; background: rgba(0,0,0,.05); }
.prosWrp .list p:nth-child(2n + 2) { background: white; }



.eliteTabsVertical .nav-pills { min-width:200px; max-width:200px; }
.eliteTabsVertical .nav-pills .nav-link { color: #3b4049 !important; text-transform: uppercase; border-radius: 0; text-align: left; }
.eliteTabsVertical .tab-content { background: #e1eaf4; width:100%; }


.eliteTabsVertical .nav-pills .nav-link.active { color: #11357e !important; font-weight: bold; background: #e1eaf4; }

#filterDisplayOptionModal .eliteTabsVertical .checkbox-listing .d-flex { align-items: flex-start; flex-wrap: wrap; }
#filterDisplayOptionModal .eliteTabsVertical .checkbox-listing .checkbox { margin:8px 25px 8px 0; }

#filterDisplayOptionModal .eliteTabsVertical .tab-content .tab-pane { padding:10px 40px; }




#previewManifest .alert { margin: 0; }
#previewManifest .map { margin:15px 0; }


.alert.primary { border: 1px solid #11357e; background: #e1eaf4; padding:6px 15px; }
.alert.primary * { color: #11357e; }


/*===== *************** =====*/



/*===== HubManager & HumanResource & OrgDashboard CSS =====*/

.datatable-wrp .accordion .accordion-item { border: 1px solid #11357e; border-radius: 0; }


.datatable-wrp .accordion .accordion-item { margin:10px 0; }
.datatable-wrp .accordion .accordion-item .accordion-button { color: #030d22 !important; font-size:20px; border-radius: 0px; background: white; }
.datatable-wrp .accordion .accordion-item .accordion-button:focus { color: inherit!important; }
.datatable-wrp .accordion .accordion-item .accordion-button[aria-expanded="true"] { color: #11357e !important; background: #e1eaf4; }

.datatable-wrp .accordion .accordion-body { padding:12px 20px; }


.hub-manager .form-group, .OrgDashboard .accordion .form-group { margin:0 0 12px; }
.form-group.disable * { opacity: 0.5; cursor: not-allowed; }
.form-group.disable .form-control { background: #ddd; }

.hub-manager .select_and-btn { margin:0 0 15px; display: flex; align-items: center; }
.hub-manager .select_and-btn .form-group { margin:0; width:100%; }
.hub-manager .select_and-btn .btns-group { flex-wrap: nowrap; }

.hub-manager .btns-group .dropdown-menu { right:0; }
.hub-manager .btns-group.justify-content-end { margin:0 0 15px; }

.OrgDashboard .datePicker-wrp { margin:0 0 12px; display: flex; justify-content: space-between; align-items: center; }
.OrgDashboard .datePicker-wrp label { margin:0 10px 0 0; }
.OrgDashboard .datePicker-wrp .form-group { margin:0; }

.pagination-records .markeditems { display: flex; align-items: center; }
.pagination-records .markeditems select { margin:0 0 0 10px; }

.OrgDashboard .total-records .form-group { margin:0 10px 0 0; }
.OrgDashboard .alert.warning { padding:10px; text-align: center; display: block; }
.OrgDashboard .form-group textarea.form-control { height:120px !important; }
.OrgDashboard .form-group .ml-10 { margin:0 0 0 10px !important; }

.OrgDashboard .form-group .form-control { border: 1px solid #dfe5ed !important; }

.form-group.upload input { background: lightgrey; display: block; margin:10px 0; width:100%; cursor: pointer; }
.placeholder-img { border:1px solid lightgrey; padding:50px; text-align: center; }


.alert.grey { background: lightgrey; }


.coulumn-dropdown.disable { opacity: 0.35; pointer-events: none; }


.OrgDashboard .border-box { padding:12px 15px; border: 1px solid #dfe5ed; margin:15px 0; height:calc(100% - 30px); }
.OrgDashboard .border-box .checkbox input[type="checkbox"] + label { display: flex; align-items: center; }
.OrgDashboard .border-box .checkbox input[type="checkbox"] + label span { min-width:20px; max-width:20px; top:0; margin:0 10px 0 0; }


/*===== *************** =====*/



/*===== BillingDetails CSS =====*/
.alert.warning { margin:0 0 10px; padding:3px 0 4px; justify-content: flex-start; }
.alert.warning div { margin:0 10px; }
.alert.warning label { font-size:13px; }
.alert .btn.icon-btn { padding:4px; }

.billing-details .d-flex .form-group { width:100%; }
.billing-details .d-flex .btns-group { flex-wrap: nowrap; justify-content: flex-end; }

.billing-details .dropdown-menu { right:0; }
.billing-details .checkbox-listing { display: flex; flex-wrap: wrap; }
.billing-details .checkbox-listing .checkbox { margin:5px 20px 5px 0; }

/*===== *************** =====*/



/*===== invoiceSalesReports CSS =====*/
.invoiceSalesReports .eliteTabs { margin:15px 0; }
.invoiceSalesReports .checkbox-listing { display: flex; align-items: flex-start; flex-wrap: wrap; }
.invoiceSalesReports .checkbox-listing .checkbox { margin:5px 20px 5px 0; }
.invoiceSalesReports .form-control { border: 1px solid #dfe5ed !important; }
.invoiceSalesReports select { white-space: nowrap; }





/*===== *************** =====*/



/*===== LeaderBoard CSS =====*/
.leader-board .dropdown-menu { right:0; }

.width100 { width:100%; }


#ViewFleetScorecardModal .chart-box { margin-top:10px; }
.chart-box span.circle { width: 120px; height: 120px; line-height: 120px; background: #008a8a; border-radius: 50%; display: block; text-align: center; font-size: 50px; font-weight: normal; color: white; margin: auto; }


#ViewFleetScorecardModal .table-wrp { margin-top:0; }
#ViewFleetScorecardModal .table-wrp table * { text-align: left; }

#ViewFleetScorecardModal .table-wrp .badge { font-size: 14px; text-align: center; padding: 2px 9px 2.5px 8px; min-width: auto; border-radius: 50%; }
#ViewFleetScorecardModal .table-wrp .badge.red { background: #ff231e; }


/*===== *************** =====*/



/*===== elogReports CSS =====*/
.elogReports a.blue { color: #1258e8; }
.elogReports a.blue:hover { text-decoration: underline; }





/*===== *************** =====*/




/*===== listContacts CSS =====*/
.listContacts .highlighted-box { padding:10px; margin-bottom:15px; border:2px solid #dfe5ed; background: #f2f6fb; }


.abcd { display: flex; align-items: flex-start; flex-wrap: wrap; }
.abcd a { padding:2px 5px; display: block; background: #dfe5ed; margin:5px 5px 5px 0; }








/*===== *************** =====*/



/*===== LoginTracker-menuManagement CSS =====*/
.title-tag { display: inline-block; padding:1px 10px 2px; font-size: 13px; background: #8294ba; text-transform: uppercase; color: white; font-weight: bold; border-radius: 20px; }
.title-tag .icon-link { margin:0; border: 1px solid #dfe5ed; border-left:0; height:36px; padding:9px 6px; }
.title-tag .icon-link img { width:16px; height:16px; object-fit: cover; }


.loginTracker .input-group .form-control { padding:0 10px 0 45px; }
.loginTracker .input-group span.input-group-append { left:0; right: inherit; margin:0; }
.loginTracker .input-group span.input-group-append span.input-group-text { margin-right:0; background: transparent !important; border: none; border-right:1px solid #dfe5ed;  }

.loginTracker .btns-group .btn { margin:1px 0; }


.titleBelt .search-by { display: flex; justify-content: space-between; align-items: flex-end; }
.titleBelt .search-by > div { margin-right: 10px; display: block;  width:100%; }
.titleBelt .search-by .form-group { width:100%; } 
.titleBelt .search-by > div.btns-group { width:auto; }

/*===== *************** =====*/



/*===== scheduleRide & rideListHistory CSS =====*/
.rideListHistory .titleBelt .primary-btn { display: flex; align-items: center; padding:7px 5px; }
.rideListHistory .titleBelt .primary-btn .icon { min-width:20px; max-width:20px; height:20px; display:block; object-fit: cover; object-position: center top; }
.rideListHistory .titleBelt .primary-btn .arrow { min-width:10px; max-width:10px; height:10px; margin:0 0 0 5px; }

.rideListHistory .titleBelt .primary-btn:hover .icon { object-position: center bottom; }

.rideListHistory .alert.warning { padding:15px; margin:0; }



.scheduleRide .center-box { max-width: 1200px; margin: 20px auto; padding: 15px; border: 2px solid #e1eaf4; }
.scheduleRide .center-box .form-group { margin:0 0 15px; }



.scheduleRide label.sort_label::after { display: inline-block; vertical-align: middle; content: ""; width:12px; height:12px; margin-left:5px;  background: url("../images/sort-az.svg")no-repeat center top / cover; }











/*===== *************** =====*/



/*===== Modal CSS =====*/
.modal-open { padding:0 !important; }
.modal-content { border-radius: 0; border:none; }


.modal-header { padding:6px 20px 8px; background: #e1eaf4; border-radius: 0; }
.modal-header h5.modal-title { font-size: 22px; color: #11357e; }
.modal-header .btn-close { padding: 15px; background-size: 15px; }

.modal-body { padding:10px 20px; }
.modal-body .title { margin:10px 0 5px; font-weight: bold; }

.modal-body .nav-tabs,
.eliteTabs .nav-tabs
{ border-bottom:2px solid #e1eaf4; }

.modal-body .nav-tabs .nav-link,
.eliteTabs .nav-tabs .nav-link
{ color: #3b4049 !important; font-weight: 600; padding:5px 20px; background: transparent; border: none; border-radius: 0; }

.modal-body .nav-tabs .nav-link.active,
.modal-body .nav-tabs .nav-link:hover,
.eliteTabs .nav-tabs .nav-link.active,
.eliteTabs .nav-tabs .nav-link:hover
{ background: #e1eaf4; }


.tab-content .tab-pane { padding:10px 0; }
.vehicle-details .form-group { margin:10px 0; } 

.modal-body h5 { font-size:20px; color:#11357e; }
.modal-body .form-group { margin:7px 0; }
.modal-body .form-group label { margin:0 0 3px !important; line-height: 20px; }
.modal-body .radiobtn input[type="radio"] + label span { margin:-2px 5px 0 0; }


.qr-code img { width: 100px; height:100px; margin:0 0 10px; }


.btns-group .btn.small { width: 30px; height: 30px; padding: 5px; }
.btns-group .btn.disable { opacity: 0.25; cursor: not-allowed; }



.input-group span.input-group-append { position: absolute; right: 0; top: 0; bottom: 0; cursor: pointer; z-index: 11; }
.input-group span.input-group-append span.input-group-text { width: 38px; height: 38px; margin: 1px; padding:8px; display: block; border: none; border-left: 1px solid #dfe5ed; border-radius: 0px; }
.input-group span.input-group-append span.input-group-text .fa { font-size:0; display: block; width:22px; height:22px; background:transparent url("../images/calendar-ic.svg")no-repeat center top / cover; }
.input-group span.input-group-append span.input-group-text:hover .fa { background:transparent url("../images/calendar-ic.svg")no-repeat center bottom / cover; }


.datepicker td, .datepicker th { font-size: 14px; }



#ManifestSummaryModal .modal-body { padding-bottom:80px; max-height: 85vh; overflow: auto; }
#ManifestSummaryModal .modal-footer { position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 11;
    background: white;
    border-radius: 0;
    padding: 8px 20px;
    box-shadow: 0 0 10px rgba(0,0,0,0.25);
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.25);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.25);
}
#ManifestSummaryModal .modal-footer .btns-group { width:100%; } 

/*===== *************** =====*/




/*===== Responsive CSS =====*/

@media screen and (max-width: 1599px) {
    
    body, .form-group .form-control, .dataTables_filter input, select.form-control, button, .btn { font-size: 15px; line-height: 20px; }
    .table-wrp th { font-size: 14px; }
    .navbar-collapse .navbar-nav .dropdown-menu a { font-size:14px; }
    
    .linear-btn img { min-width: 22px; max-width: 22px; height: 22px; }
    .btn.icon-btn { padding:7px; }
    h2 { font-size: 26px; }
    .search-box .btn.search-btn { padding:6px 8px; }
    .search-box .btn.search-btn img { width:20px; height:20px; }
    
    .form-group .form-control, .dataTables_filter input, select.form-control { height: 36px !important; }
    .form-group select.form-control { padding-right:30px; }
    .select-option .arrow { bottom:12px; right:12px; }
    .input-group span.input-group-append span.input-group-text { width:36px; height:34px; padding:6px; }
    
    .side-padding { padding-left:25px; padding-right:25px; }
    
    /* HeaderFooter CSS */
    header .admin-menu ul.list li a img.ic { min-width:20px; max-width:20px; height:20px; }
    .navbar-collapse .navbar-nav .nav-item, .navbar-collapse .navbar-nav .dropdown { margin-left:25px; }

    
    footer p, footer a { font-size: 15px; }
    
    
        
}


@media screen and (max-width: 1439px) {
    
    .side-padding { padding-left:0; padding-right:0; }
    
    
    /* HeaderFooter CSS */
    .navbar .navbar-brand, .navbar .navbar-brand a, .navbar .navbar-brand img { width: 115px; height: 60px; }
    
    
    
    /* Driver CSS */
    .checkbox-columnbtn .checkbox-listing .checkbox { margin-right: 25px; }
    
    
    
    /* RoutingMap CSS */
    aside .transport-items a { width:25px; height:25px; }
    
    
        
}


@media screen and (max-width: 1365px) {
    
    
    /* HeaderFooter CSS */
    .navbar { margin-top:0; }
    
    
    
    .billing-details .btns-group { justify-content: flex-start !important; }
    .billing-details .btns-group a { margin:5px 0 5px 10px;  }
    
    
    
    
    
    
    
}


@media screen and (max-width: 1199px) {
    body, .table-wrp table *, button, .btn, .form-group .form-control, .dataTables_filter input, select.form-control { font-size: 15px; }
    
    /* HeaderFooter CSS */
    header { padding:10px 0; z-index: 11; }
    .navbar { align-items: center; }
    .navbar .navbar-brand { margin:0; }
    
    .hamburger { padding:5px; }
    .navbar-toggler { position: relative; z-index: 21;  padding: 0; background: #e1eaf4; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
    .navbar-toggler .navbar-toggler-icon { font-size: 0; display: block; width:32px; height:1px; background: #3b4049; margin:8px 5px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
    .hamburger.is-active { z-index: 21; }
    .hamburger.is-active .navbar-toggler-icon:nth-child(2){ opacity: 0; }
    .hamburger.is-active .navbar-toggler-icon:nth-child(1){ -webkit-transform: translateY(9px) rotate(45deg); -ms-transform: translateY(9px) rotate(45deg); -o-transform: translateY(9px) rotate(45deg); transform: translateY(9px) rotate(45deg); }
    .hamburger.is-active .navbar-toggler-icon:nth-child(3){ -webkit-transform: translateY(-9px) rotate(-45deg); -ms-transform: translateY(-9px) rotate(-45deg); -o-transform: translateY(-9px) rotate(-45deg); transform: translateY(-9px) rotate(-45deg); }
    
    
    header .admin-menu { position: absolute; right: 80px; top: 21px; }
    header .admin-menu ul.list { display: none; }
    header .admin-menu .admin-dropdown { margin:0; }
    header .admin-menu .admin-dropdown .dropdown-toggle { padding:5px 0; }
    
    .navbar-collapse { width: 300px; padding:75px 0 10px; background: #e1eaf4; overflow: auto; z-index: 20; position: fixed; right: 0; top: 0; bottom: 0; }
    .navbar-collapse .navbar-nav li { width:100%; margin:2px 0 !important; }
    .navbar-collapse .navbar-nav .nav-link { font-size:18px; display: flex; align-items: center; padding:10px 20px; }
    .navbar-collapse .navbar-nav .nav-link img, .navbar-collapse .navbar-nav .d-xl-none .nav-link img { min-width:30px; max-width:30px; height:30px; margin:0 10px 0 0; }
    
    
    .navbar-collapse .navbar-nav .nav-link:hover { background: rgba(0,0,0,0.05);  }
    .navbar::after { content: ""; display: block; position: fixed; left: 0; right:0; top: -100%; height:100vh; background: #000; z-index: 0; opacity: 0; transition: 0.3s ease-in-out; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; }
    .menu-open { overflow: hidden; }
    .menu-open .navbar::after { top:0; opacity: 0.75; z-index: 19; }
    
    
    /* Driver CSS */
    .checkbox input[type="checkbox"] + label span, .radiobtn input[type="radio"] + label span { width:18px; height:18px; }
    .radiobtn input[type="radio"] + label span { background: url("../images/radiobtn.svg")no-repeat left top / 18px; }
    .radiobtn input[type="radio"]:checked + label span { background: url("../images/radiobtn.svg")no-repeat left bottom / 18px; }
    .checkbox input[type="checkbox"] + label span { background: url("../images/checkbox.svg")no-repeat left top / 18px; }
    .checkbox input[type="checkbox"]:checked + label span { background: url("../images/checkbox.svg")no-repeat left bottom / 18px; }
    .checkbox-columnbtn .checkbox-listing .checkbox { margin-right:25px; }
    .checkbox input[type="checkbox"] + label { display: flex; flex-direction: column; }
    .checkbox input[type="checkbox"] + label span { margin: auto; }
    
    .datatable-wrp .checkbox-columnbtn { margin:15px 0; }
    .table-wrp table .checkbox { margin-top:4px; }
    
    
    /* Payroll CSS */
    .payroll .datatable-wrp .filters label { text-align: center; line-height: 18px; }
    
    
    /* RoutingMap CSS */
    .mapbox, aside { top:80px; }
    
    
    
    .billing-details .btns-group.justify-content-end { justify-content: flex-end !important; }
    #ManifestSummaryModal .checkbox input[type="checkbox"] + label { display: block; }
    
    
    .pro-summary .checkbox-columnbtn .linear-btn { margin:5px 0 5px 10px; }
    #AddEditResponse .checkbox input[type="checkbox"] + label, .pro-summary .checkbox input[type="checkbox"] + label { display: block; }
    
    
    
    .titleBelt .col-12 {
        margin: 10px 0;
    }

}


@media screen and (max-width: 991px) {
    
    
    /* HeaderFooter CSS */
    .login-box { padding:20px; }
    .latest-news { position: relative; }
    
    /* HeaderFooter CSS */
    
    
    
    /* Driver CSS */
    .map { height:400px; }
    
    .datatable-wrp .checkbox-columnbtn { flex-direction: column; align-items: flex-end; }
    .checkbox-columnbtn .checkbox-listing { flex-wrap: wrap; justify-content: flex-start; width:100%; margin-bottom:10px; }
    .checkbox-columnbtn .checkbox-listing .checkbox { margin:0 20px 10px 0; }
    .checkbox input[type="checkbox"] + label { flex-direction: row; }
    .checkbox input[type="checkbox"] + label span { margin-right:8px; }
    
    
    /* Payroll CSS */
    .payroll .datatable-wrp .checkbox-columnbtn { flex-direction: row; align-items: center; }
    
    
    /* Manifest CSS */
    .form-group { margin:5px 0; }
    .form-group.search-box { margin:5px 15px 5px 0; }
    
    
    /* RoutingMap CSS */
    .mapbox { left: 0; }
    aside { width:300px; left: -300px; z-index: 11;  }
    aside .expand-collapse { top:100px; display: block; z-index: 12; left:0; }
    aside.expand { left:0; }
    aside.expand .expand-collapse { left:300px; }
    aside.expand .expand-collapse img { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); }
    
    
    
    .billing-details .btns-group, .billing-details .checkbox-listing, .billing-details .btns-group.justify-content-end { justify-content: center !important; }
    .billing-details .text-end { text-align: center !important; }
    
    
    .checkbox-columnbtn .checkbox-listing { max-width:100%; justify-content: center; align-items: center; }
    .checkbox-columnbtn .checkbox-listing .checkbox { margin:5px 10px; }
    
    .chart-box { margin: 15px auto 25px; max-width: 600px; }
    
    
    .FMSCAHistory .btns-group { justify-content: center !important; margin:10px 0; }
    .FMSCAHistory .btns-group .d-flex { flex-wrap: wrap; justify-content: center; }
    .FMSCAHistory .btns-group a.btn { margin:5px 10px; }
    
    
    .hub-manager .btns-group.justify-content-end { justify-content: center !important; }
    
    .leader-board .form-group { width:100%; }
    .leader-board .d-flex.justify-content-end { justify-content: center !important; }
    
    
    
    #ManifestSummaryModal .btns-group.justify-content-end { justify-content: center !important; }
    
    .pro-summary .checkbox-columnbtn .checkbox-listing { max-width:100%; }
    .pro-summary .checkbox-columnbtn { justify-content: center; align-items: center; }
    
    
    .vehicle-list .btn.primary-btn { margin:10px auto; display: block; max-width: 100px; }
    .vehicle-list .btns-group .btn { margin:10px; }
    .vehicle-list .checkbox-columnbtn { align-items: center; }
    
    
    
    .titleBelt .form-group {
        margin: 0;
    }
    .loginTracker .title-tag + .checkbox {
        margin:0 10px 0 0;
    }
    
    
}


@media screen and (max-width: 767px) {
    
    body, .table-wrp table *, button, .btn, footer p, footer a, .form-group .form-control, .dataTables_filter input, select.form-control { font-size: 14px; }
     
    /* HeaderFooter CSS */
    .navbar .navbar-brand, .navbar .navbar-brand a, .navbar .navbar-brand img { width:100px; height:50px; }
    header .admin-menu { top:16px; }
    .navbar-collapse .navbar-nav { flex-direction: column; justify-content: center; align-items: flex-start; padding-bottom:5px; }
    .navbar-nav .dropdown-menu { position: relative; }
    .navbar-collapse .navbar-nav .dropdown-menu li { padding:0; }
    .navbar-collapse .navbar-nav .nav-link img { margin: 0 10px 0 0; }

    
    
    footer .d-flex { flex-direction: column; align-items: center; }
    footer a { border: none; border-top:1px solid #808290; padding-top: 5px; margin-top: 5px; }
    
    
    /* Driver CSS */
    main.main-wrp { margin-bottom:150px; }
    
    .markeditems-autorefresh { flex-direction: column; }
    .markeditems-autorefresh .markeditems { margin-bottom:10px; }
    .markeditems-autorefresh .autorefresh .markeditems { margin:0; }
    
    
    /* Payroll CSS */ 
    .advanced-fitlers { margin:-5px 0 20px; }
    .payroll .datatable-wrp .filters .title-filters { flex-direction: column; }
    .payroll .datatable-wrp .filters .title-filters h2 { width:100%; text-align: left; margin-bottom:15px; }
    .payroll .datatable-wrp .checkbox-columnbtn { width:100%; }
    .payroll .datatable-wrp .filters .form-group { margin:5px 0; }
    .payroll .datatable-wrp .filters .checkbox-listing { margin-top:15px; }
    
    
    
    /* RoutingMap CSS */
    .mapbox, aside { top:70px; }
    
    
    
    .titleBelt .search-by {
        flex-direction: column;
        align-items: center;
    }
    .titleBelt .search-by > div {
        margin:0 0 10px 0;
    }
     
    
    
    
    
}


@media screen and (max-width: 576px) {
    
    .primary-btn { padding: 5px 10px; }
    
    /* HeaderFooter CSS */
    
    
    
    /* Driver CSS */
    .map { height:auto; }
    .map .primary-btn { right:10px; top:10px; }
    .map iframe { height:350px; }
    .map .map-filters { position: relative; display: block; padding:10px 15px; }
    .map .map-filters > label { display: block; }
    .map .map-filters .radiobtn { margin:5px 0; }
    
    .pagination-records { flex-direction: column-reverse; }
    .pagination-records .pagination { margin-bottom:10px; }
    
    
    /* RoutingMap CSS */
    aside { width:250px; left: -250px; }
    aside.expand .expand-collapse { left:250px; }
    
    
           
}


@media screen and (max-width: 479px) {
    
    
    /* Payroll CSS */
    .payroll .datatable-wrp .filters .checkbox-columnbtn { flex-direction: column; }
    .payroll .datatable-wrp .filters .checkbox-columnbtn .coulumn-dropdown { margin:10px 0; }
    
    
}


@media screen and (max-width: 359px) {
    
    /* HeaderFooter CSS */
    header .admin-menu { right:70px; top:7px; }
    header .admin-menu .admin-dropdown .dropdown-toggle { padding:10px 0; }
    header .admin-menu .admin-dropdown .dropdown-toggle img.placeholder { width:35px; height:35px; margin-right:2px; }
    header .admin-menu .admin-dropdown .dropdown-toggle span { display: none; }
    
    .navbar-collapse { width:275px; }
    .navbar-collapse .navbar-nav .nav-link { font-size: 16px; }
    
    /* Driver CSS */
    
    
}

/*===== *************** =====*/
.style-danger {
    background-color: #f44336;
    border-color: #f44336;
    color: #ffffff;
}
.style-danger .modal-title {
    color: #ffffff !important;
}
.NumForAlert {
    color: #af2d3b;
    font-weight: bold;
}
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected.inRange, .flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay {
    background: #11357e !important;
    border-color: #11357e !important;
}
/*Start: Validation css*/
.form-control-feedback {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    pointer-events: none;
}

.has-success label, .has-success .control-label, .has-success .form-control-feedback {
    color: #4caf50;
}

.has-error label, .has-error .control-label, .has-error .form-control-feedback {
    color: #f44336;
}

.has-feedback label ~ .form-control-feedback, .form-control-feedback {
    top: auto;
    bottom: 0;
}
/*End: Validation css*/