﻿@charset "utf-8";
@font-face{font-family:Stag-Semibold;src:url(../fonts/Stag-Semibold.eot);src:local('☺'),url(../fonts/Stag-Semibold.woff) format('woff'),url(../fonts/Stag-Semibold.ttf) format('truetype'),url(../fonts/Stag-Semibold.svg) format('svg');font-weight:400;font-style:normal}
body{margin:0;padding:0;font-family:Roboto,sans-serif; background: #f5f6fa;}
.mainContainer{width:100%;float:left}
a{transition:all .25s ease 0s}
a:hover{transition:all .25s ease 0s}
*{box-sizing:border-box}
h1,h2,h3,h4,h5,h6{padding:0;margin:0;font-weight:400}
p{padding:0;margin:0}
ul{padding:0;margin:0;list-style:none}
img{display:block; max-width: 100%; }

.loginMain { width: 550px; height: 550px; margin: auto; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background: #fff; border-radius: 25px; padding: 80px 125px; }
.marutiLogo { width: 100%; float: left; text-align: center; }
.marutiLogo img { margin: auto; }
.loginIcon { width: 100%; float: left; text-align: center; margin: 50px 0px; }
.loginIcon img { margin: auto; }
.loginFormSec { width: 100%; float: left; }
.loginFormSec input[type="text"] { width: 100%; float: left; border-radius: 6px; border: solid 1px rgba(112,112,112,0.18); background-color: rgba(177,179,180,0.18); padding: 10px 10px 10px 40px; }
.loginFormSec input[type="text"]:focus { outline: 0px; }
.loginFormSec input[type="password"] { width: 100%; float: left; border-radius: 6px; border: solid 1px rgba(112,112,112,0.18); background-color: rgba(177,179,180,0.18); padding: 10px 10px 10px 40px; }
.loginFormSec input[type="password"]:focus { outline: 0px; }

.loginField { background: url(../images/user-icon.png) 10px center no-repeat; margin-bottom: 10px; font-size: 14px; }
.passField { background: url(../images/pass-icon.png) 10px center no-repeat; font-size: 14px; }
.loginButt { width: 100%; border: 0px; color: #fff; height: 45px; border-radius: 8px; background-color: #003c8e; margin-top: 15px; font-size: 16px; font-weight: bold; line-height: 45px; text-transform: uppercase; }

.loginFormSec input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #000;
    opacity: 1; /* Firefox */
}
.loginFormSec input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #000;
}
.loginFormSec .memberInputTxt input::-ms-input-placeholder { /* Microsoft Edge */
    color: #000;
}

.info-msg,
.success-msg,
.warning-msg,
.error-msg {
    margin: 10px 0;
    padding: 10px;
    border-radius: 3px 3px 3px 3px;
}

.info-msg {
    color: #059;
    background-color: #BEF;
}

.success-msg {
    color: #270;
    background-color: #DFF2BF;
}

.warning-msg {
    color: #9F6000;
    background-color: #FEEFB3;
}

.error-msg {
    color: #D8000C;
    background-color: #FFBABA;
}


.leftPanel { max-width: 385px;width:100%; background: #e8e8f3; position: fixed; left: 0px; height: 100%; top: 0px; transition: 0.5s; }
.leftPanel.active { left: -345px; transition: 0.5s; }
.leftPanel .logo { padding: 60px; }
.leftPanel .leftLinks ul { padding:0px; margin: 0px; list-style: none; }
.leftPanel .leftLinks li { padding-left: 90px; position: relative; }
.leftPanel .leftLinks li a { font-size:18px; color: #929292; line-height: 2.5; text-decoration: none;transition:all ease 0.2s;}
.leftPanel .leftLinks li a:hover { color: #313131; text-decoration: none; }
.leftPanel .leftLinks li a:before{position:absolute;left:0px;top:50%;width:80px;height:1px;background-color:transparent;content: "";transform:translateY(-50%);}
.leftPanel .leftLinks li a:hover:before{background:#313131;}
.leftPanel .leftLinks li.active a { color: #313131; }
.leftPanel .leftLinks li.active a:before {position:absolute;left: 0px;top:50%;width: 80px; height: 1px; background: #313131; content: "";transform:translateY(-50%);}

.leftPanel .leftPanelArrow { position: absolute; right: -30px; bottom: 20%; }
.leftPanel .leftPanelArrow a { display: inline-block; width: 65px; height: 65px; font-size: 22px; border-radius: 10px; background: #003c8e url(../css/images/left-arrow.png) center center no-repeat; color: #fff; font-weight: bold; text-align: center; line-height: 65px; text-decoration: none; }
.leftPanel.active .leftPanelArrow a { display: inline-block; width: 65px; height: 65px; font-size: 22px; border-radius: 10px; background: #003c8e url(../css/images/right-arrow.png) center center no-repeat; color: #fff; font-weight: bold; text-align: center; line-height: 65px; text-decoration: none; }

.rightPanel{margin-left:385px; padding: 60px 0px 20px 0px; transition: 0.5s; display: inline-block; width: calc(100% - 385px); }
.rightSecMain { width: 85%; margin: auto; }
.rightPanel.active { width: 100%; transition: 0.5s; margin-left: 0px; }
.rightPanel .rightHeadSec { width: 100%; display: inline-block; }
.rightPanel .rightHeadSec h1 { /*font-size: 50px;*/ color: #6f789b; font-weight: bold;font-size:36;}
.searchLoginButt ul { display: inline-block; }
.searchLoginButt ul li { display: inline-block;/* margin-left: 40px;*/ position: relative; }
.searchLoginButt .notificationBox { display: inline-block; margin-left: 40px; top: -5px; position: relative; }
.searchLoginButt .notificationBox a { display: inline-block; width: 65px; height: 65px; font-size: 22px; border-radius: 10px; background: #003c8e; color: #fff; font-weight: bold; text-align: center; line-height: 65px; text-decoration: none; }
.searchLoginButt .notificationBox a:hover { background: #707070; }
.boxImg { width: 100%; }
.boxImg img { width: 100%; height: auto; }

.searchDeskInput { position: absolute; width: 355px; right: 35px; padding: 5px; background: #e8e8f3; top: -10px; z-index: 10; opacity: 0; z-index: 0; transition: 0.5s; }
.searchDeskInput input { padding: 5px 35px 5px 5px; border: 0px; width: 100%; outline: 0; }
.searchDeskInput a { position: absolute; right: 15px; top: 16px; }
.writeToUs li img { display: inline-block; }
.searchDeskInput.active { opacity: 1; z-index: 2; transition: 0.5s; }

.totalAppointMentSec { width: 100%; float: left; margin-top: 30px; margin-bottom: 40px; }
.totalAppointMentSec ul { padding: 0; margin: 0; list-style: none; }
.totalAppointMentSec li { display: inline-block; width: 18.45%; margin-right: 1.9%; font-size: 50px; color: #fff; font-weight: bold; text-align: center; border-radius: 10px; line-height: 1; padding: 20px 0px; margin-left: -4px; }
.totalAppointMentSec li span { font-size: 16px; font-weight: bold; float: left; width: 100%; text-align: center; margin-top: 10px; margin-bottom: 5px; }

.totalAppointMentSec li:nth-child(1) { box-shadow: 0 12px 31px 0 rgba(120, 190, 255, 0.51);
background: rgb(91,165,255); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(91,165,255,1) 0%, rgba(131,198,254,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(91,165,255,1) 0%,rgba(131,198,254,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(91,165,255,1) 0%,rgba(131,198,254,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5ba5ff', endColorstr='#83c6fe',GradientType=1 ); /* IE6-9 */
 }

.totalAppointMentSec li:nth-child(2) { box-shadow: 0 12px 31px 0 rgba(0, 60, 142, 0.19);
background: rgb(97,111,126); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(97,111,126,1) 0%, rgba(157,168,177,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(97,111,126,1) 0%,rgba(157,168,177,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(97,111,126,1) 0%,rgba(157,168,177,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#616f7e', endColorstr='#9da8b1',GradientType=1 ); /* IE6-9 */
 }

.totalAppointMentSec li:nth-child(3) { box-shadow: 0 12px 31px 0 rgba(255, 174, 83, 0.43);
background: rgb(255,167,75); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(255,167,75,1) 0%, rgba(253,195,110,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(255,167,75,1) 0%,rgba(253,195,110,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(255,167,75,1) 0%,rgba(253,195,110,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa74b', endColorstr='#fdc36e',GradientType=1 ); /* IE6-9 */
}

.totalAppointMentSec li:nth-child(4) { box-shadow: 0 12px 31px 0 rgba(13, 196, 230, 0.36);
background: rgb(11,193,229); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(11,193,229,1) 0%, rgba(21,214,238,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(11,193,229,1) 0%,rgba(21,214,238,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(11,193,229,1) 0%,rgba(21,214,238,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0bc1e5', endColorstr='#15d6ee',GradientType=1 ); /* IE6-9 */
}

.totalAppointMentSec li:nth-child(5) { box-shadow: 0 12px 31px 0 rgba(243, 112, 112, 0.41); margin-right: 0px;
background: rgb(239,93,93); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(239,93,93,1) 0%, rgba(246,130,130,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(239,93,93,1) 0%,rgba(246,130,130,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(239,93,93,1) 0%,rgba(246,130,130,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ef5d5d', endColorstr='#f68282',GradientType=1 ); /* IE6-9 */
 }


.totalAppTableMain { width: 100%; float: left; box-shadow: 0 3px 31px 0 rgba(0, 60, 142, 0.16); background: #fff; border-radius: 10px; }
.driverMapMain { width: 100%; float: left; border-radius: 10px; }
.ttAppTabTop { width: 100%; float: left; padding: 20px; }
/*.ttAppTabTop h2 { float: left; font-size: 24px; font-weight: bold; line-height: 1.21; color: #707070; padding: 7px;}*/
.ttAppTabTop h2 { float: left; font-size: 24px; font-weight: bold; line-height: 1; color: #707070; padding: 7px;}
.ttAppTabTop h2 a { color: #707070; text-decoration: none; vertical-align:sub; }
/*.driverAvailabiltyBoard  { float: right; margin-top: 5px; }*/
.driverProductivityTxt { display: inline-block; font-size: 18px; color: #003c8e; font-weight: bold; margin-right: 28px; margin-top: 2px; position: relative;top: 3px; }
.assignRefreshTxt { display: inline-block; font-size: 18px; color: #003c8e; font-weight: bold; margin-right: 28px; margin-top: 2px; position: relative;top: 3px; }
.pdBoardRefreshTxt { display: inline-block; font-size: 18px; color: #003c8e; font-weight: bold; margin-right: 28px; margin-top: 8px; position: relative;top: 3px; }
.driverProductivityTxt a, .assignRefreshTxt a, .pdBoardRefreshTxt a { color: #003c8e; text-decoration: none; }
.refLastTxt { display: inline-block; font-size: 15px; color: #003c8e; font-weight: bold; margin-right: 6px; margin-top: 0px; position: relative;top: 3px; float:right; }
.calendarDate { display: inline-block; color: #0e0e0f; font-size: 14px; margin-top: 5px; position:relative;}
.refLastDate { display: inline-block; color: #0e0e0f; font-size: 12px; margin-top: 5px; position:relative; float:right; margin-right: 8px; }
.calendarDate { display: inline-block; color: #0e0e0f; font-size: 14px; margin-top: 5px;position:relative;}
.refLastDate { display: inline-block; color: #0e0e0f; font-size: 12px; margin-top: 5px;position:relative;}
.calendarDate img { display: inline-block; position: relative; top: -1px; margin-right: 5px;  }
.calendarDate input { width: 120px; border: 0px; padding-left: 25px; background: url(../images/calendar.png) left center no-repeat; cursor: pointer; }
.calendarDate input:focus { outline: 0; }

.calendarDate input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #0e0e0f;
    opacity: 1; /* Firefox */
}
.calendarDate input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #0e0e0f;
}
.calendarDate input::-ms-input-placeholder { /* Microsoft Edge */
    color: #0e0e0f;
}

.ttAppHead { background: #f5f5f5; }
.ttAppHead td { padding: 20px 10px; border-left: #e6e6e6 solid 1px; font-weight: bold; }
.ttAppHead td:first-child { border-left: 0px; padding-left: 20px; }
.ttAppContent td { padding: 20px 10px; border-right: #e6e6e6 solid 1px; border-bottom: #e6e6e6 solid 1px; font-size: 15px; color: #6b6b6b; }
.ttAppContent td:first-child { border-left: 0px; padding-left: 20px; }
.ttAppContent td img { margin: auto; }
.ttAppHead td span { padding-right: 30px; background: url(../images/down-arrow.png) right 9px no-repeat; }
.ttAppHead td span img { display: inline-block; }


.ttAppHead th { padding: 20px 10px; border-left: #e6e6e6 solid 1px; font-weight: bold; }
.ttAppHead th:first-child { border-left: 0px; padding-left: 20px; }
.ttAppHead th span { padding-right: 30px; background: url(../images/down-arrow.png) right 9px no-repeat; }
.ttAppHead th span img { display: inline-block; }


.assignDriverPopupMain .modal-dialog { padding: 0px 70px; }
.assignDriverPopupMain .modal-dialog .modal-content { padding: 40px; border: 0px; border-radius: 10px; }
.assignDriverPopupMain .modal-dialog .modal-content h2 { font-size: 22px; font-weight: bold; color: #6f789b; width: 100%; text-align: center; margin-bottom: 20px; margin-top: 20px; }
.assignDriverPopupMain .modal-dialog .modal-content .assignDriverFormRow { width: 100%; float: left; margin-top: 10px; }
.assignDriverPopupMain .modal-dialog .modal-content .assignDriverFormRow .assignDriverFormLeft { width: 48%; float: left; }
.assignDriverPopupMain .modal-dialog .modal-content .assignDriverFormRow .assignDriverFormRight { width: 48%; float: right; }
.assignDriverFormType { width:33.33%; float: right; }
.radioButtonMain { float: left; width: 100%; }
.radioButtonType { margin-left:50px; float: left; width: 100%; margin-top: 10px; }
.radioButtonMain .radioButtonBx { float: left; margin-right: 50px; }
.radioButtonMain .radioButtonBx:last-child { margin-right: 0px; }
.assignDriverFormRow select, .assignDriverFormRow .bootstrap-select .btn { background: #f1f1f2 url(../images/select-arrow.png) 97% center no-repeat; border-radius: 6px; font-size: 14px; color: #242424; width: 100%; border: 0px; padding: 12px; -webkit-appearance: none; }

select:focus { outline: 0; }
textarea:focus { outline: 0; }

.assignDriverFormRow textarea { background: #f1f1f2 url(../images/map.png) 95% 10px no-repeat; border-radius: 6px; font-size: 14px; color: #242424; width: 100%; border: 0px; padding: 12px 40px 12px 12px; -webkit-appearance: none; min-height: 85px; resize: none; }

.assignDriverPopupMain .modal-dialog .modal-content .assignDriverFormRow.assignButt { text-align: center; margin-top: 25px; }
.assignDriverFormRow.assignButt input { width: 162px; height: 45px; border-radius: 8px; background-color: #003c8e; color: #fff; border: 0px; transition: 0.5s; }
.assignDriverFormRow.assignButt input:hover { background: #e8e8f3; color: #000; transition: 0.5s; }
.popupCloseBtn { padding: 10px; position: absolute; right: 10px; top: 10px; opacity: 1; cursor: pointer; }
.popupCloseBtn img { float: right; }

.driverBoardPopupMain .modal-dialog { padding: 0px 70px; }
.driverBoardPopupMain .modal-dialog .modal-content { padding: 40px 0; border: 0px; border-radius: 10px; }
.driverBoardPopupMain .modal-dialog .modal-content h2 { font-size: 22px; font-weight: bold; color: #6f789b; width: 100%; text-align: center; margin-bottom: 20px; margin-top: 20px; }
.driverBoardPopupMain .modal-dialog .modal-content p { padding: 2px 30px 0px 30px; font-size: 14px; text-align: center; color: red; }
.driverBoardPopupMain .modal-dialog .modal-content p b { color: green; text-transform: uppercase; }

.driverBoardContentMain { width: 100%; float: left; }
.driverBoardContentMain .driverBoardHeadMain { width: 100%; float: left; background: #f2f5f9; padding: 0px 50px; }
.driverBoardContentMain .driverBoardHeadMain .driverBoardHead { width: 100%; float: left; padding: 10px 0px; }
.driverBoardContentMain .driverBoardHeadMain .driverBoardHead .drBoxHead { float: left; font-size: 16px; font-weight: bold; color: #787878; }
.driverBoardContentMain .driverBoardHeadMain .driverBoardHead .drBoxHead.drBoardH1 { width: 15%; text-align: center; }
.driverBoardContentMain .driverBoardHeadMain .driverBoardHead .drBoxHead.drBoardH2{ width: 50%; text-align: left; }
.driverBoardContentMain .driverBoardHeadMain .driverBoardHead .drBoxHead.drBoardH3{ width: 20%; text-align: center; }
.driverBoardContentMain .driverBoardHeadMain .driverBoardHead .drBoxHead.drBoardH4{ width: 15%; text-align: center; }

.driverBoardListMain { width: 100%; float: left; }
.driverBoardListMain .drBoardListRow { width: 100%; float: left; padding: 10px 50px; line-height: normal; }
.driverBoardListMain .drBoardListRow:nth-child(even) { background: #f2f5f9; }
.driverBoardListMain .drBoardListRow .drBoardListC1 { width: 15%; color: #787878; font-size: 16px; text-align: center; float: left; }
.driverBoardListMain .drBoardListRow .drBoardListC2 { width: 50%; color: #787878; font-size: 16px; text-align: left; float: left; }
.driverBoardListMain .drBoardListRow .drBoardListC3 { width: 20%; color: #787878; font-size: 16px; text-align: center; float: left; }
.driverBoardListMain .drBoardListRow .drBoardListC3 span.color-red { width: 15px; height: 15px; border-radius: 50%; background: #ff0000; display: inline-block; }
.driverBoardListMain .drBoardListRow .drBoardListC3 span.color-green { width: 15px; height: 15px; border-radius: 50%; background: #00c82f; display: inline-block; }
.driverBoardListMain .drBoardListRow .drBoardListC4 { width: 15%; color: #787878; font-size: 16px; text-align: center; float: left; margin-top: 3px; }
.driverBoardListMain .drBoardListRow .drBoardListC4 img { margin: auto; }

.rightHeadSec.pastRecordHead { margin-bottom: 50px; }
.pastRecordSearch { display: inline-block; margin-right: 20px; margin-top: -4px; /*position: absolute; right: 350px; */}
.pdBoardSearch { display: inline-block; margin-right: 20px; margin-top: 0px; }
.assignSearch { display: inline-block; margin-right: 60px; margin-top: -4px; }
.pdBoardSearch input, .pastRecordSearch input { width: 375px; background: #f0f1f1 url(../images/search2.jpg) 95% center no-repeat; border-radius: 25px; border: 0px; font-size: 14px; color: #0e0e0f; padding:10px 40px 10px 28px; line-height: normal; height: 42px; }
.assignSearch select { width: 300px; background: #f0f1f1; border-radius: 10px; border: 0px; font-size: 14px; color: #0e0e0f; padding:8px 30px 8px 25px; line-height: normal; height: 42px; }
.pastRecordSearch input:focus, .pdBoardSearch input:focus, .assignSearch input:focus { outline: 0; }

.ttAppTabSec.pastRecordTable .ttAppHead th { border-left: 0px; }
.ttAppTabSec.pastRecordTable .ttAppContent td { border-right: 0px; }

.paginationBoxRight { float: right; margin-top: 30px; text-align: right; background: #fff; padding: 20px; border-radius: 10px;  }
.paginationBoxRight span { display: inline-block; vertical-align: middle; }
.paginationBoxRight span a { display: block; padding: 10px 5px; background: #d9e2ee; border-radius: 5px; width: 35px; height: 35px; }
.paginationBoxRight span a img { margin: auto; }
.paginationBoxRight ul { display: inline-block; }
.paginationBoxRight li { display: inline-block; }
.paginationBoxRight li a { font-size: 18px; color: #6b6b6b; height: 35px; width: 35px; display: inline-block; text-align: center; vertical-align: middle; line-height: 35px; border-radius: 5px; margin-left: 5px; margin-right: 5px; text-decoration: none; }
.paginationBoxRight li a:hover { background: #003c8e; color: #fff; }

.bckBtn { display: inline-block; position: absolute; top: 15px; line-height: normal; }
.bckBtn_driver { display: inline-block; position: absolute; line-height: normal; }
.aglAppnt{ line-height: normal; width: 100%; float: right; margin-bottom: 10px; }
.bckBtn a, .bckBtn_driver a { display: inline-block; padding: 10px 20px; background: #003c8e; color: #fff; border-radius: 5px; font-size: 14px; text-decoration: none; }
.aglAppnt a { display: inline-block; padding: 10px 20px; background: #003c8e; color: #fff; border-radius: 5px; font-size: 14px; text-decoration: none; float: right; }
.bckBtn a:hover, .bckBtn_driver a:hover, .aglAppnt a:hover { background: #929292; }

.pastRecordAppt { width: 100%; box-shadow: 0 3px 31px 0 rgba(0, 60, 142, 0.16); background: #fff; border-radius: 10px; padding: 25px; margin-bottom: 30px; }
.pastRecordAppt ul { padding:0px 20px; margin:0px; display: flex; justify-content: space-between; }
.pastRecordAppt li { font-size: 17px; color: #707070; }

.cusInfoStatusHistoryMain { width: 100%; float: left; margin-bottom: 30px; display: flex; }
.cusInfoMain { width: 48.5%; float: left; box-shadow: 0 3px 31px 0 rgba(0, 60, 142, 0.16); background: #fff; border-radius: 10px; margin-right: 3%; padding: 35px 40px;}
.cusInfoMain ul { padding: 0px; margin: 0px; }
.cusInfoMain li { font-size: 17px; color: #707070; margin-bottom: 15px; float: left; width: 100%; }
.cusInfoMain li strong { width: 100%; float: left; }
.cusInfoMain li:first-child strong { display: inline-block; float: none; width: auto; }
.cusInfoMain li:last-child { margin-bottom: 0px; }


.statusHistoryMain { width: 48.5%; float: right; box-shadow: 0 3px 31px 0 rgba(0, 60, 142, 0.16); background: #fff; border-radius: 10px; 
	padding: 25px 40px 35px 40px; height: 240px }
.statusHistoryMain h3 { font-size: 20px; color: #707070; font-weight: bold; margin-bottom: 10px; }
.statusHistoryMain ul { padding: 0px; margin: 0px; overflow: auto; height: 165px }
.statusHistoryMain li { font-size: 17px; color: #707070; margin-bottom: 15px; float: left; width: 100%; }
.statusHistoryMain li strong { float: right; }
.viewMoreTxt { float: left; width: 100%; text-align: right; text-transform: uppercase; }
.viewMoreTxt a { color: #003c8e; font-size: 17px; font-weight: bold; text-decoration: underline; }
.viewMoreTxt a:hover { text-decoration: none; }

.pastRecdAccordionMain { float: left; width: 100%; }
.pastRecdAccordionMain .mainacrdSec { float: left; width: 100%; margin-bottom: 10px; }
.pastRecdAccordionMain .acrdSec { display:none; position: relative; background: #fff; color: #333; padding: 0px 25px 30px 30px; float: left; width: 100%; }
.pastRecdAccordionMain .mainacrdSec h3 { cursor: pointer; color: #707070; font-size: 20px; background: #fff url(../images/plus-icon.png) 97.5% center no-repeat; display: inline-block; width: 100%; padding: 25px 60px 25px 30px; border-bottom: 10px; font-weight: bold; font-size: 20px; }
.pastRecdAccordionMain .mainacrdSec h3.selected { background: #fff url(../images/minus-icon.png) 97.5% center no-repeat; }

.pastRecdAccSlider { float: left; width: 100%; }
.pastRecdAccSlider .owl-carousel { width: 1230px; }
.pastRecdAccSlider .owl-carousel .owl-nav .owl-prev,  .pastRecdAccSlider .owl-carousel .owl-nav .owl-next{position:absolute;top:50%;transform:translateY(-50%);}
.pastRecdAccSlider .owl-carousel .owl-nav .owl-prev { width: auto; float: left; text-indent: -9999px; width: 35px; height: 55px; background: #003c8e url(../images/slide-left.png) center center no-repeat; border-radius: 0px 5px 5px 0px;left:0}
.pastRecdAccSlider .owl-carousel .owl-nav .owl-next { width: auto; float: right; text-indent: -9999px; width: 35px; height: 55px; background: #003c8e url(../images/right-arrow.png) center center no-repeat; border-radius: 5px 0px 0px 5px;right:0}

.pdboardHead { background: #f5f5f5; padding: 10px 0; }
.pdboardHead th { font-size: 14px; text-align: center; line-height: 1.3; padding: 10px 5px; color: rgba(14,14,15,0.63); border-right: #dbdbdb solid 1px; z-index:1; }
.pdboardHead th:first-child { border-right: 0px; text-align: left; padding-left: 20px; font-weight: bold; font-size: 16px; }
.pdboardHead th:nth-child(2) { font-weight: bold; font-size: 16px; text-align: left; padding-left: 10px; }
.pdboardHead th:last-child { border-right: 0px; }
.pdboardContent td { font-size: 16px; padding: 20px 10px; color: rgba(14,14,15,0.63); border-bottom: #dbdbdb solid 1px; border-right: #dbdbdb solid 1px; text-align: center; font-weight: bold; position: relative; }
.pdboardContent td a { color: rgba(14,14,15,0.63); text-decoration: none; display: block; position: absolute; width: 100%; left: 0; top: 0; right: 0; bottom: 0; padding: 20px 10px; }
.pdboardContent td a:hover { color: #fff; background: #003c8e; cursor: pointer; }
.pdboardContent td a:hover .pdBoardPopup { color: #707070; display: block; }
.pdboardContent td:first-child { padding-left: 20px; border-right: 0px; text-align: left; color: rgba(107,107,107,0.66); font-weight: normal; }
.pdboardContent td:nth-child(2) { text-align: left; color: rgba(107,107,107,0.66); font-weight: normal; }
.pdboardContent td:last-child { border-right: 0px; }

.pdboardContent .borRight { border-right: #e6e6e6 solid 1px; }
.pdboardContent .fontBold { font-weight: bold; }
.pdboardContent .greybg { background: rgba(177,179,180,0.25); }
.pdboardContent .bluebg { background: rgba(0,60,142,0.18); }
.pdboardContent .colorRed { color: #ff0000; }

.pdboardContent:last-child td { border-bottom: 0px; border-left: 0px; border-right: 0px; }



.pdBoardPopup { position: absolute; left: 50%; top: 115px; transform: translate3d(0, -50%, 0); box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
  background: none; border-radius: 10px; width: 100%; width: 450px; z-index: 10; margin-left: -225px; display: none; }
.pdBoardPopup:after { content: ""; width: 20px; height: 20px; transform: rotate(-45deg); background: #fff; position: absolute; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5); z-index: -1; top: -10px; left: calc(50% - 10px); }
.pdBoardPopup .inner { padding: 10px 0; background: #fff; border-radius: 10px; }
.pdBoardPopup .inner ul { padding: 0px 30px; margin: 0px; text-align: left; }
.pdBoardPopup .inner li { font-weight: normal; font-size: 17px; line-height: normal; margin-bottom: 8px; }
.pdBoardPopup .inner li { font-weight: normal; font-size: 17px; line-height: normal; margin-bottom: 8px; }
.pdBoardPopup .inner li:nth-child(3) { margin-bottom: 5px; }
.pdBoardPopup .inner li:last-child { margin-bottom: 0px; }

.pickDropStatTable .pdstatHead { background: #f5f5f5; }
.pickDropStatTable .pdstatHead th { padding: 13px 10px; text-align: center; border-bottom: #eaeaea solid 1px; border-right: #dbdbdb solid 1px; font-weight: bold; color: rgba(14,14,15,0.63); }
.pickDropStatTable .pdstatHead th:first-child { padding-left: 20px; text-align: left; }
.pickDropStatTable .pdstatHead th:last-child { border-right: 0px; }
.pickDropStatTable .pdstatContent td { padding: 13px 10px; text-align: center; border-bottom: #dbdbdb solid 1px; border-right: #dbdbdb solid 1px; color: rgba(107,107,107,0.66); }
.pickDropStatTable .pdstatContent td:first-child { padding-left: 20px; text-align: left; }
.pickDropStatTable .pdstatContent td:last-child { border-right: 0px; }

.pdstatContent:last-child td { border-bottom: 0px; }

.pickDropStatTable .pdstatContent .clrBlk { color: #000; }





.rightPanel.active .pastRecdAccSlider .owl-carousel { width: 1560px; }



/*Rafi*/
.modal-add-driver .modal-lg{max-width:665px;}
.modal-add-driver .custom-file-input:lang(en) ~ .custom-file-label::after, .modal-add-driver .custom-file-label::after{content:none;}
.modal-add-driver .custom-file-input{height:0;display:none;}
.modal-add-driver .custom-file{height:auto;}
.modal-add-driver .modal-body{padding-left:3.125rem;padding-right:5.625rem;}
.form-control{border-color:#b1b3b4;}
.form-control:focus{box-shadow:none;border-color:#b1b3b4;}
input:placeholder{color:#242424;}
.plus-center{top:50%;left:50%;transform:translate(-50%, -50%);}
.modal-add-driver label{font-size:14px;font-weight:bold;color: #242424;}
.card-body-dlf{max-width:159px;height:105px !important;}
.card-body-dlf p{font-size: 14px;color: #242424;font-weight:400;margin-top:6px;}
.modal-add-driver .card-deck .card{border-radius: 6px;border: 1px dashed #707070}
.modal-add-driver .modal-title{color:#6f789b;font-weight:bold;}
.btn-save-details, .btn-save-details:hover, .btn-save-details:focus{width:147px;margin:0;}
.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active{background-color:#003c8e;border-color:#003c8e;box-shadow:none;border-radius:8px;}
.btn-primary:not(:disabled):not(.disabled):active:focus{box-shadow:none;}
.close{opacity:1}
.btn-next{padding:0.4375rem 2.125rem;font-size:0.875rem;position:relative;}
.bg-light{background-color:#f1f1f2 !important}
.assignDriverPopupMain .form-control{height:calc(1.5em + 0.75rem + 9px)}
.assignDriverFormRow .btn{min-width:162px;}
.action-cancel{width:32px;height:32px;border:solid 1.5px #003c8e;}
.modal-cancel-appointment .modal-title{color:#6f789b;font-size:18px;font-weight:bold;}
.lightbox{display:flex;justify-content:center;flex-direction:column;}
.lb-outerContainer{order:2}
.lb-dataContainer{order:1;background-color:#fff;border-bottom-left-radius:0 !important;border-bottom-right-radius:0 !important;padding:10px 0;border-top-left-radius:10px;border-top-right-radius:10px;}
.lightbox .lb-image{border-width:20px !important;border-top-width:0px !important;border-top-left-radius: 0px !important;border-top-right-radius: 0px !important;}
.lb-data .lb-number{display:none !important;}
.lb-data .lb-close{background:url(../images/popup-cross.png) center no-repeat !important;opacity:1 !important;background-size:45% !important}
.btn-next-arrow, .btn-prev-arrow{top:50%;transform:translateY(-50%);background-repeat:no-repeat;display:inline-block;padding:10px 6px;position:absolute;}
.btn-next-arrow{background-image:url(../images/btn-next-arrow.png);right:15px;}
.btn-prev-arrow{background-image:url(../images/btn-prev-arrow.png);left:15px;}
.dropdown-toggle::after{content:none;}
.rightHeadSec .dropdown-menu{min-width:200px;max-width:200px;height:145px;box-shadow:0 3px 15px 0 rgba(0, 0, 0, 0.32);border:0;padding:20px 0;margin-top:-34px;border-radius:8px;}
.rightHeadSec .dropdown-item{color:#707070;font-size:14px;}
.rightHeadSec .dropdown-item-logout{font-weight:bold;margin-top:10px;}
/*.dropdown-item.active, .dropdown-item:active{background-color:transparent;}*/




/*27Jan2021*/
.modal-cp .modal-lg{
	max-width:790px;
}
.col-left{
	max-width:225px;
}
.nav-tab-custom .nav-link{color:#28282a;background-color:#e4ebf3;padding:13px 1rem;}
.nav-tab-custom .nav-item:not(:last-child){margin-bottom:7px;}
.nav-tab-custom .nav-link.active{background-color:#fff;color:#003c8d;-webkit-box-shadow: 0px 0px 14px -4px rgba(51,146,255,0.32);
-moz-box-shadow: 0px 0px 14px -4px rgba(51,146,255,0.32);box-shadow: 0px 0px 14px -4px rgba(51,146,255,0.32);}
.col-right .form-control{border-color:#d1d1d1;color:#666;}
.col-right input::-webkit-input-placeholder{color:#666;}
.col-right .tab-content{padding:10px 20px;-webkit-box-shadow: 0px 0px 6px 4px rgba(237,242,246,1);-moz-box-shadow: 0px 0px 6px 4px rgba(237,242,246,1);box-shadow: 0px 0px 6px 4px rgba(237,242,246,1);}
.modal-cp .modal-body{padding:50px 50px 20px 50px;}
.modal-cp .modal-content{border-radius:10px;}







@media (min-width: 1365px) and (max-width: 2050px){
.ttAppTabSec { float: left; width: 100%; overflow: scroll; max-height: 540px; }
.ttAssignTable { float: left; width: 100%; overflow: scroll; max-height: 540px;}
.assignTable{ width: 1900px; }
}


@media screen and (max-width: 1459px) {

.leftPanel { width: 325px; }
.leftPanel .logo { padding: 60px 30px; }
.leftPanel .leftLinks li { padding-left: 40px; }
.leftPanel .leftLinks li a { font-size: 20px; }
.leftPanel .leftLinks li a:hover:before { width: 35px; }
.leftPanel .leftLinks li.active a:before { width: 35px; }
.leftPanel.active { left: -290px; }
.rightPanel { margin-left: 325px; width: calc(100% - 325px); }

.ttAppTabSec { float: left; width: 100%; overflow: scroll; max-height: 540px; }
.ttAssignTable { float: left; width: 100%; overflow: scroll; max-height: 540px;}
.tableSecInn { width: 1250px; }
.assignTable{ width: 1900px; }

.totalAppointMentSec li span { font-size: 13px; }
.pastRecdAccSlider .owl-carousel { width: 890px; }

.pastRecordAppt ul { padding: 0px; }
.pastRecordAppt li { font-size: 14px; }
.cusInfoMain { padding: 25px; }
.cusInfoMain li { font-size: 14px; }
.statusHistoryMain { padding: 25px 12px 25px 25px; }

.rightPanel.active .pastRecdAccSlider .owl-carousel { width: 1170px; }
.searchLoginButt .notificationBox a { width: 55px; height: 55px; line-height: 55px; }
.rightPanel .rightHeadSec h1 { font-size: 35px; margin-top: 0px; }
.searchDeskInput { width: 300px;}
.leftPanel .leftPanelArrow a { line-height: 55px; width: 55px; height: 55px; }
.leftPanel.active .leftPanelArrow a { line-height: 55px; width: 55px; height: 55px; }



}


@media screen and (max-width: 1379px) {

.leftPanel .leftLinks li a { font-size: 18px; }
.leftPanel .leftLinks li a:hover:before { top: 23px; }
.leftPanel .leftLinks li.active a:before { top: 23px; }
.totalAppointMentSec li span { font-size: 12px; }
.pastRecordSearch { right: 300px; }
.pastRecordSearch input { width: 275px; }
.pastRecdAccSlider .owl-carousel { width: 830px; }
.rightPanel.active .pastRecdAccSlider .owl-carousel { width: 1105px; }

.searchLoginButt .notificationBox { margin-left: 20px; }
.searchLoginButt ul li { margin-left: 20px; }


}


@media screen and (max-width: 1299px) {

.pastRecordSearch input { width: 225px; }
.pastRecdAccSlider .owl-carousel { width: 755px; }
.rightPanel.active .pastRecdAccSlider .owl-carousel { width: 1030px; }

.rightPanel .rightHeadSec h1 { font-size: 27px; margin-top: 12px; }

}

::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}